/**
 * Estilo da Calculadora de Corte.
 *
 * A troca de estado usa classe no formulario em vez de attr('style', ...) no
 * JavaScript. Isso evita a briga de "!important" que o snippet antigo travava com
 * o tema toda vez que o cliente alternava a variacao.
 */

.dcc {
	margin: 20px 0;
}

.dcc[hidden] {
	display: none;
}

.dcc__regras {
	background: #f4f4f4;
	border-radius: 6px;
	padding: 14px 16px;
	margin-bottom: 18px;
	font-size: 14px;
	line-height: 1.5;
}

.dcc__regras ul {
	margin: 8px 0 0;
	padding-left: 18px;
}

.dcc__regras li {
	margin-bottom: 4px;
}

.dcc__escolha {
	margin: 0 0 16px;
}

.dcc__escolha .dcc__opcao {
	margin: 0 0 6px;
}

.dcc__escolha .dcc__opcao:last-child {
	margin-bottom: 0;
}

.dcc__opcao {
	margin: 0 0 12px;
}

/* O tamanho da fonte precisa ser cravado aqui: sem isso o rotulo herda o do tema
   e fica menor que os rotulos dos campos logo abaixo. */
.dcc__opcao label {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	cursor: pointer;
}

.dcc__opcao label span {
	font-size: 14px;
	line-height: 1.4;
}

/* Zerar a margem que o tema poe na caixa e o que alinha o quadradinho com o
   texto -- o align-items sozinho nao vence uma margem vertical herdada. */
.dcc__opcao input[type="checkbox"],
.dcc__opcao input[type="radio"] {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin: 0;
	vertical-align: middle;
}

.dcc__campo {
	margin: 0 0 14px;
}

.dcc__campo label {
	display: block;
	font-weight: 600;
	font-size: 14px;
	margin-bottom: 4px;
}

.dcc__campo input {
	width: 100%;
}

.dcc__avisos {
	display: none;
	margin: 0 0 14px;
}

.dcc__avisos p {
	color: #b3261e;
	font-style: italic;
	margin: 0 0 4px;
	font-size: 14px;
}

.dcc__resultado:empty {
	display: none;
}

.dcc__resultado {
	background: #fdfdfd;
	border: 2px solid #007cab;
	border-radius: 8px;
	padding: 15px;
	margin: 0 0 18px;
}

.dcc__linha {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	margin: 0 0 13px;
	font-size: 14px;
	line-height: 1.6;
	color: #333;
}

.dcc__linha:last-child {
	margin-bottom: 0;
}

.dcc__rotulo {
	font-weight: 700;
}

.dcc__linha--total {
	color: #007cab;
	font-size: 1.2em;
	font-weight: 700;
	border-top: 1px solid #e0e0e0;
	padding-top: 14px;
	margin-top: 16px;
}

.dcc__dica {
	margin: 0 0 14px;
	font-size: 14px;
	color: #666;
}

.dcc__dica:empty {
	display: none;
}

/* -------------------------------------------------------------------------
   Modo "corte personalizado": o preco unitario e o seletor de quantidade saem
   de cena, porque quem manda na quantidade e a calculadora.

   O botao de compra continua VISIVEL e apenas desabilitado enquanto a
   configuracao nao fecha. Faze-lo sumir -- como o snippet antigo fazia --
   deixa o cliente procurando o botao sem saber o que esta faltando.
   ------------------------------------------------------------------------- */

/* O bloco "1x Produto R$ X / Subtotal R$ X" do Product Add-ons nao serve aqui:
   quem manda na conta e a calculadora, e o TOTAL dela ja mostra folhas x preco.
   Esta folha so carrega em produto com corte personalizado, entao o alcance da
   regra e exatamente esse. */
#product-addons-total {
	display: none !important;
}

form.variations_form.dcc-ativo .quantity,
form.variations_form.dcc-ativo .woocommerce-variation-price {
	display: none !important;
}

form.variations_form.dcc-ativo .single_add_to_cart_button.dcc-bloqueado {
	opacity: 0.45;
	cursor: not-allowed;
}