/**
 * Estilos da loja: tabela de lotes e nome do evento junto ao nome do produto.
 */

/* ---------------------------------------------------------------
   Nome do evento no carrinho, checkout e pedidos
   --------------------------------------------------------------- */

.ce-nome-evento {
	display: block;
	font-size: .85em;
	font-weight: 400;
	opacity: .75;
	line-height: 1.35;
}

.ce-nome-evento-inline {
	display: inline;
	font-size: inherit;
	opacity: 1;
}

/* O separador só existe para os e-mails em texto puro, onde as tags são
   removidas; na tela o evento já ganha linha própria. */
.ce-nome-evento-sep {
	display: none;
}

/* ---------------------------------------------------------------
   Carrinho com recálculo automático
   --------------------------------------------------------------- */

/* A classe é adicionada por JS: sem JS o botão continua visível.
   Sem exigir um ancestral, para valer também no widget de carrinho do
   Elementor, cuja estrutura não tem .woocommerce-cart-form em volta. */
body.ce-carrinho-auto [name="update_cart"] {
	display: none !important;
}

/* ---------------------------------------------------------------
   Lotes
   --------------------------------------------------------------- */

.ce-lotes-bloco {
	margin: 0 0 1.5em;
}

.ce-lotes-titulo {
	margin: 0 0 .5em;
	font-size: 1.05em;
}

.ce-lotes-tabela {
	width: 100%;
	margin: 0;
	border-collapse: collapse;
	font-size: .92em;
}

/* Só aparece dentro do editor do Elementor. */
.ce-lotes-aviso-editor {
	padding: 1em;
	border: 1px dashed #c3c4c7;
	border-radius: 4px;
	background: #fafafa;
	color: #646970;
	font-size: .9em;
	text-align: center;
}

.ce-lotes-tabela th,
.ce-lotes-tabela td {
	padding: .5em .75em;
	text-align: left;
	border-bottom: 1px solid rgba(0, 0, 0, .1);
}

.ce-lotes-tabela thead th {
	font-size: .85em;
	text-transform: uppercase;
	letter-spacing: .03em;
	opacity: .7;
}

/* Sem opacity na linha e sem line-through no conjunto: as duas coisas
   atingiriam também a tag "encerrado", justamente o que precisa ser legível.
   O risco fica só no preço, que é o dado que não vale mais. */
.ce-lotes-tabela .ce-lote-encerrado {
	color: #8c9196;
}

.ce-lotes-tabela .ce-lote-encerrado .ce-lote-preco {
	text-decoration: line-through;
}

.ce-lotes-tabela .ce-lote-vigente {
	font-weight: 600;
}

/* Parcelamento abaixo do preço.
   Sem opacity: ela clarearia a cor definida, e o resultado na tela deixaria
   de ser exatamente rgb(84, 89, 95).
   O !important na cor é para vencer os temas e o widget de preço do Elementor,
   que costumam pintar os spans dentro de .price. */
.ce-parcelamento {
	display: block;
	margin-top: .25em;
	font-size: .8em;
	font-weight: 400;
	line-height: 1.4;
	color: rgb(84, 89, 95) !important;
}

.ce-lote-badge {
	display: inline-block;
	padding: .1em .55em;
	border-radius: 999px;
	background: #00a32a;
	color: #fff;
	font-size: .72em;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .03em;
	vertical-align: middle;
	text-decoration: none;
}

/* Depois de .ce-lote-badge de propósito: o elemento tem as duas classes e a
   especificidade é a mesma, então quem vence é a regra que vier por último. */
.ce-lote-badge-encerrado {
	background: #8c9196;
}

.ce-lote-badge-em-breve {
	background: #2271b1;
}

.ce-lotes-encerrado {
	font-weight: 600;
	color: #b32d2e;
}

/* Venda que ainda vai abrir: aviso, não recusa — daí o azul, e não o vermelho
   de "inscrições encerradas". */
.ce-lotes-em-breve {
	font-weight: 600;
	color: #2271b1;
}