/**
 * WPP Cote - estilos estruturais base.
 *
 * Este arquivo cuida apenas do layout (flexbox, espaçamentos e alinhamento
 * do ícone). Cores, tipografia, bordas, sombras e demais aspectos visuais
 * são controlados dinamicamente pelo painel de Estilo do Elementor.
 */

.wpp-cote-wrapper {
	display: flex;
	width: 100%;
}

.wpp-cote-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	cursor: pointer;
	background-color: #25D366;
	color: #ffffff;
	line-height: 1;
	box-sizing: border-box;
	padding: 14px 28px;
	border-radius: 4px;
}

.wpp-cote-button:hover,
.wpp-cote-button:focus,
.wpp-cote-button:visited,
.wpp-cote-button:active {
	color: inherit;
	text-decoration: none;
}

.wpp-cote-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.wpp-cote-button--icon-before .wpp-cote-icon {
	margin-right: 8px;
}

.wpp-cote-button--icon-after {
	flex-direction: row-reverse;
}

.wpp-cote-button--icon-after .wpp-cote-icon {
	margin-left: 8px;
}

.wpp-cote-icon svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

.wpp-cote-text {
	display: inline-block;
}