/**
 * Chantell — experiência de compra (WooCommerce).
 *
 * O tema desliga os estilos default do Woo (`woocommerce_enqueue_styles`), então
 * TUDO que aparece no carrinho, checkout, minha conta e mini-carrinho é
 * desenhado aqui, com os tokens de `tokens.css`.
 *
 * Convenções:
 *  - classes próprias com prefixo `.cc-`;
 *  - classes nativas do Woo (`.woocommerce-error`, `.form-row`, `#place_order`…)
 *    são estilizadas pelo nome original — elas são geradas pelo plugin e não
 *    dá pra renomear sem quebrar o JS dele;
 *  - foco visível em tudo que recebe teclado (`:focus-visible`).
 */

/* ═══════════════════════ Tokens locais da loja ═══════════════════════
   O laranja da marca — hsl(11 87% 57%) — nasceu para seções ESCURAS, onde tem
   contraste de sobra. Sobre o cream e sobre o branco dos cards ele fica em
   ~2.8:1, abaixo do mínimo de 4.5:1 da WCAG AA. Preço e mensagem de erro são
   informação que a pessoa PRECISA ler pra comprar, então aqui usam uma versão
   mais escura do MESMO tom (mesma matiz e saturação, luminosidade menor):
   4.7:1 sobre o cream e 5.8:1 sobre o branco. O laranja original continua
   valendo em tudo que é decorativo (kickers, hovers, bordas). */

.cc-loja,
.cc-cart-panel {
  --cc-preco: 11 87% 40%;
  --cc-erro: 0 72% 42%;
}

/* ═══════════════════════ Casca das páginas da loja ═══════════════════════ */

.cc-loja {
  min-height: 70vh;
  padding-bottom: 6rem;
}

.cc-loja__inner {
  max-width: 76rem;
  margin-inline: auto;
  padding-inline: 1.5rem;
}

@media (min-width: 768px) {
  .cc-loja__inner { padding-inline: 2.5rem; }
}

.cc-loja__hero {
  padding: 2.5rem 0 2rem;
  border-bottom: 1px solid hsl(var(--foreground) / 0.12);
  margin-bottom: 2.5rem;
}

.cc-loja__kicker {
  font-family: var(--font-body);
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: hsl(var(--muted-foreground));
  margin-bottom: 0.75rem;
}

.cc-loja__kicker .font-accent {
  text-transform: none;
  letter-spacing: 0;
  font-size: 1.125rem;
  color: hsl(var(--primary));
}

.cc-loja__title {
  font-family: var(--font-display);
  font-size: clamp(2.5rem, 7vw, 5rem);
  line-height: 0.92;
  color: hsl(var(--foreground));
}

.cc-loja__content { padding-bottom: 1rem; }

.cc-loja__empty {
  font-family: var(--font-body);
  color: hsl(var(--muted-foreground));
  padding: 3rem 0;
}

/* ═══════════════════════ Peças compartilhadas ═══════════════════════ */

/* ── Cards (resumo do carrinho, resumo do pedido) ── */

.cc-loja-card {
  background: hsl(0 0% 100%);
  border: 1px solid hsl(var(--foreground) / 0.08);
  border-radius: 0.75rem;
  padding: 1.5rem;
}

.cc-loja-card__title {
  font-family: var(--font-display);
  font-size: 1.25rem;
  letter-spacing: 0.02em;
  color: hsl(var(--foreground));
  margin-bottom: 1.25rem;
}

/* ── Botões ── */

.cc-loja__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.9rem 1.75rem;
  font-family: var(--font-body);
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  background: hsl(var(--foreground));
  color: hsl(var(--background));
  border: 1px solid hsl(var(--foreground));
  border-radius: 0.5rem;
  cursor: pointer;
  text-align: center;
  transition: background 0.4s var(--ease-premium), color 0.4s var(--ease-premium);
}

.cc-loja__btn:hover {
  background: hsl(var(--primary));
  border-color: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
}

.cc-loja__btn--ghost {
  background: transparent;
  color: hsl(var(--foreground));
}

.cc-loja__btn--ghost:hover {
  background: hsl(var(--foreground));
  color: hsl(var(--background));
  border-color: hsl(var(--foreground));
}

.cc-loja__btn--block {
  display: flex;
  width: 100%;
}

/*
 * Botões que o WooCommerce imprime sozinho (login, recuperar senha, salvar
 * endereço, aplicar cupom do checkout…). Não dá pra trocar a classe deles sem
 * sobrescrever meia dúzia de templates só por causa disso — mais honesto
 * estilizar a classe nativa.
 */
.cc-loja .button,
.cc-loja button[type='submit'],
.cc-loja input[type='submit'] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.85rem 1.6rem;
  font-family: var(--font-body);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  background: hsl(var(--foreground));
  color: hsl(var(--background));
  border: 1px solid hsl(var(--foreground));
  border-radius: 0.4rem;
  cursor: pointer;
  transition: background 0.4s var(--ease-premium), border-color 0.4s var(--ease-premium);
}

.cc-loja .button:hover,
.cc-loja button[type='submit']:hover,
.cc-loja input[type='submit']:hover {
  background: hsl(var(--primary));
  border-color: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
}

/*
 * Exceções: os botões que já têm estilo próprio do tema.
 * Dois nomes de classe de propósito — `[type='submit']` pesa como classe na
 * especificidade, então `.cc-loja .cc-loja__btn--ghost` (0,2,0) PERDE de
 * `.cc-loja button[type='submit']` (0,2,1). Com a classe repetida vai a (0,3,0).
 */
.cc-loja .cc-loja__btn.cc-loja__btn {
  padding: 0.9rem 1.75rem;
  font-size: 0.8125rem;
  border-radius: 0.5rem;
}

.cc-loja .cc-loja__btn.cc-loja__btn--ghost {
  background: transparent;
  color: hsl(var(--foreground));
  border-color: hsl(var(--foreground));
}

.cc-loja .cc-loja__btn.cc-loja__btn--ghost:hover {
  background: hsl(var(--foreground));
  color: hsl(var(--background));
}

.cc-loja .cc-loja__btn.cc-loja__btn--block {
  display: flex;
  width: 100%;
}

/* Variante escura do stagger button (o original é branco, feito p/ seções escuras). */
.stagger-btn--dark {
  background: hsl(var(--foreground));
  color: hsl(var(--background));
  font-family: var(--font-body);
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.stagger-btn--dark:hover { background: hsl(var(--primary)); }

.cc-loja__cta {
  display: flex;
  width: 100%;
  margin-top: 1.25rem;
}

/* ── Campos ── */

.cc-loja__label,
.cc-loja .form-row label,
.woocommerce-form label,
.cc-account__nav + .woocommerce-MyAccount-content label {
  display: block;
  font-family: var(--font-body);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: hsl(var(--muted-foreground));
  margin-bottom: 0.375rem;
}

.cc-loja .required { color: hsl(var(--primary)); text-decoration: none; }

.cc-loja__input,
.cc-loja input[type='text'],
.cc-loja input[type='email'],
.cc-loja input[type='tel'],
.cc-loja input[type='password'],
.cc-loja input[type='number'],
.cc-loja input[type='search'],
.cc-loja textarea,
.cc-loja select,
.cc-loja .select2-container .select2-selection--single {
  width: 100%;
  padding: 0.8rem 0.9rem;
  font-family: var(--font-body);
  font-size: 0.9375rem;
  color: hsl(var(--foreground));
  background: hsl(0 0% 100%);
  border: 1px solid hsl(var(--foreground) / 0.18);
  border-radius: 0.4rem;
  transition: border-color 0.3s ease;
}

.cc-loja textarea { min-height: 7rem; resize: vertical; }

.cc-loja input:focus,
.cc-loja textarea:focus,
.cc-loja select:focus {
  outline: none;
  border-color: hsl(var(--primary));
}

.cc-loja :is(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid hsl(var(--primary));
  outline-offset: 2px;
  border-radius: 0.25rem;
}

.cc-loja .form-row { margin-bottom: 1rem; }

.cc-loja .form-row-first,
.cc-loja .form-row-last { width: 100%; }

@media (min-width: 640px) {
  .cc-loja .form-row-first,
  .cc-loja .form-row-last {
    display: inline-block;
    width: calc(50% - 0.5rem);
  }
  .cc-loja .form-row-first { margin-right: 0.75rem; }
}

.cc-loja .woocommerce-input-wrapper { display: block; }

.cc-loja .form-row .description,
.cc-loja small {
  display: block;
  margin-top: 0.375rem;
  font-size: 0.75rem;
  color: hsl(var(--muted-foreground));
}

/* select2 do Woo (país/estado) — só o mínimo pra não destoar. */
.cc-loja .select2-container .select2-selection--single {
  height: auto;
  display: flex;
  align-items: center;
}

.cc-loja .select2-container--default .select2-selection--single .select2-selection__rendered {
  padding: 0;
  line-height: 1.4;
  color: hsl(var(--foreground));
}

.cc-loja .select2-container--default .select2-selection--single .select2-selection__arrow { top: 50%; transform: translateY(-50%); }

.select2-dropdown {
  border: 1px solid hsl(var(--foreground) / 0.18);
  border-radius: 0.4rem;
  font-family: var(--font-body);
  font-size: 0.9375rem;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
}

/* ── Avisos do Woo (erro / sucesso / info) ── */

.woocommerce-error,
.woocommerce-message,
.woocommerce-info,
.woocommerce-noreviews {
  list-style: none;
  margin: 0 0 1.5rem;
  padding: 1rem 1.25rem;
  border-radius: 0.5rem;
  border-left: 3px solid hsl(var(--foreground));
  background: hsl(var(--muted));
  font-family: var(--font-body);
  font-size: 0.9375rem;
  color: hsl(var(--foreground));
}

.woocommerce-error {
  border-left-color: hsl(var(--destructive));
  background: hsl(var(--destructive) / 0.08);
}

.woocommerce-message { border-left-color: hsl(var(--primary)); }

.woocommerce-error li { margin-bottom: 0.25rem; }
.woocommerce-error li:last-child { margin-bottom: 0; }

.woocommerce-error a,
.woocommerce-message a,
.woocommerce-info a {
  color: hsl(var(--cc-preco, 11 87% 40%));
  text-decoration: underline;
  text-underline-offset: 3px;
}

.woocommerce-message .button,
.woocommerce-info .button {
  float: right;
  margin-left: 1rem;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: hsl(var(--primary));
}

/* Erro de validação inline do checkout.js */
.cc-loja .woocommerce-invalid input.input-text,
.cc-loja .woocommerce-invalid .select2-container .select2-selection--single {
  border-color: hsl(var(--destructive));
}

.cc-loja .woocommerce-validated input.input-text { border-color: hsl(140 45% 40% / 0.6); }

/* ═══════════════════════ Carrinho ═══════════════════════ */

.cc-cart-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-body);
  margin-bottom: 2.5rem;
}

.cc-cart-table thead th {
  font-family: var(--font-body);
  font-size: 0.6875rem;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: hsl(var(--muted-foreground));
  text-align: left;
  padding: 0 0.75rem 0.75rem;
  border-bottom: 1px solid hsl(var(--foreground) / 0.12);
}

.cc-cart-table thead th.product-subtotal { text-align: right; }

.cc-cart-item td {
  padding: 1.25rem 0.75rem;
  border-bottom: 1px solid hsl(var(--foreground) / 0.08);
  vertical-align: middle;
}

.cc-cart-item .product-remove { width: 2.5rem; padding-left: 0; }

.cc-cart-item .remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 999px;
  font-size: 1.25rem;
  line-height: 1;
  color: hsl(var(--muted-foreground));
  transition: all 0.3s ease;
}

.cc-cart-item .remove:hover {
  background: hsl(var(--destructive) / 0.1);
  color: hsl(var(--destructive));
}

.cc-cart-item .product-thumbnail { width: 5.5rem; }

.cc-cart-item .product-thumbnail img {
  width: 4.5rem;
  height: 6rem;
  object-fit: cover;
  border-radius: 0.375rem;
  background: hsl(var(--muted));
}

.cc-cart-item .product-name a {
  font-family: var(--font-display);
  font-size: 1.125rem;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  color: hsl(var(--foreground));
  transition: color 0.3s ease;
}

.cc-cart-item .product-name a:hover { color: hsl(var(--primary)); }

.cc-cart-item .product-price,
.cc-cart-item .product-subtotal { white-space: nowrap; }

.cc-cart-item .product-subtotal {
  text-align: right;
  font-weight: 500;
  color: hsl(var(--cc-preco));
}

.cc-cart-item .quantity { display: inline-block; }

.cc-cart-item .quantity input.qty {
  width: 4.5rem;
  padding: 0.5rem;
  text-align: center;
  border: 1px solid hsl(var(--foreground) / 0.18);
  border-radius: 0.375rem;
  background: hsl(0 0% 100%);
}

/* Linha de ações (cupom + atualizar) */
.cc-cart-actions {
  padding: 1.5rem 0 0 !important;
  border-bottom: 0 !important;
}

.cc-cart-coupon {
  display: block;
  margin-bottom: 1.25rem;
  max-width: 26rem;
}

.cc-cart-coupon__row { display: flex; gap: 0.5rem; }

.cc-cart-coupon__row .cc-loja__input { flex: 1 1 auto; }
.cc-cart-coupon__row .cc-loja__btn { flex: 0 0 auto; white-space: nowrap; }

.cc-cart-update { margin-top: 0.25rem; }

.cc-cart-collaterals {
  display: flex;
  justify-content: flex-end;
}

.cc-cart-collaterals .cart_totals { width: 100%; max-width: 26rem; }

.cc-cart-continue {
  margin-top: 2rem;
  font-family: var(--font-body);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: hsl(var(--muted-foreground));
}

.cc-cart-continue a:hover { color: hsl(var(--primary)); }

/* Tabela de totais (carrinho e checkout) */

.cc-loja-totals,
.cc-review-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-body);
  font-size: 0.9375rem;
}

.cc-loja-totals th,
.cc-review-table tfoot th {
  text-align: left;
  font-weight: 400;
  color: hsl(var(--muted-foreground));
  padding: 0.6rem 0;
  vertical-align: top;
}

.cc-loja-totals td,
.cc-review-table tfoot td {
  text-align: right;
  padding: 0.6rem 0;
  vertical-align: top;
}

.cc-loja-totals .order-total th,
.cc-loja-totals .order-total td,
.cc-review-table .order-total th,
.cc-review-table .order-total td {
  border-top: 1px solid hsl(var(--foreground) / 0.12);
  padding-top: 1rem;
  font-family: var(--font-display);
  font-size: 1.25rem;
  color: hsl(var(--foreground));
}

.cc-loja-totals .order-total td,
.cc-review-table .order-total td { color: hsl(var(--cc-preco)); }

/* Métodos de entrega */

.woocommerce-shipping-methods {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: right;
}

.woocommerce-shipping-methods li { margin-bottom: 0.375rem; }

.woocommerce-shipping-methods label { display: inline; font-size: 0.9375rem; }

.woocommerce-shipping-destination {
  margin-top: 0.5rem;
  font-size: 0.75rem;
  color: hsl(var(--muted-foreground));
}

.cc-loja__ship-none,
.cc-loja__ship-hint {
  display: block;
  text-align: right;
  font-size: 0.8125rem;
  line-height: 1.45;
}

.cc-loja__ship-none { color: hsl(var(--cc-erro)); }

.cc-loja__ship-hint {
  margin-top: 0.375rem;
  color: hsl(var(--muted-foreground));
}

/* O link para a loja do outro idioma é a parte ÚTIL do aviso de mercado: ele
   é a saída do comprador, não um detalhe. Precisa se destacar dentro de um
   parágrafo que já está inteiro na cor de erro. */
.cc-loja__mercado-link {
  color: inherit;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.cc-loja__mercado-link:hover,
.cc-loja__mercado-link:focus-visible {
  text-decoration-thickness: 2px;
}

/* ── Endereço por país ──
   `cc-campo-oculto` é o equivalente em CSS do `hidden` do locale do Woo, que
   só existe em JavaScript. É ele que impede um comprador americano com JS
   desligado de ver os campos "Número" e "Bairro". O `.show()` do jQuery
   escreve `display` inline e ganha desta regra quando o JS está ligado. */

.cc-campo-oculto { display: none; }

.cc-endereco-recado {
  display: block;
  margin-top: 0.375rem;
  font-size: 0.75rem;
  line-height: 1.45;
}

.cc-endereco-recado.is-info { color: hsl(var(--muted-foreground)); }
.cc-endereco-recado.is-ok { color: hsl(var(--muted-foreground)); }
.cc-endereco-recado.is-erro { color: hsl(var(--cc-erro)); }

.shipping-calculator-button {
  display: inline-block;
  margin-top: 0.5rem;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: hsl(var(--cc-preco));
  text-decoration: underline;
  text-underline-offset: 3px;
}

.shipping-calculator-form { margin-top: 0.75rem; text-align: left; }
.shipping-calculator-form .form-row { margin-bottom: 0.625rem; }
.shipping-calculator-form button { width: 100%; }

/* ── Carrinho vazio ── */

.cc-loja-empty {
  max-width: 34rem;
  margin: 2rem auto 0;
  text-align: center;
  padding: 3rem 0;
}

.cc-loja-empty__svg {
  width: 2.5rem;
  height: 2.5rem;
  margin: 0 auto 1.5rem;
  color: hsl(var(--primary));
}

.cc-loja-empty__title {
  font-family: var(--font-display);
  font-size: var(--text-h3);
  color: hsl(var(--foreground));
  margin-bottom: 0.75rem;
}

.cc-loja-empty__text {
  font-family: var(--font-body);
  color: hsl(var(--muted-foreground));
  margin-bottom: 2rem;
}

.cc-loja-empty__cta .stagger-btn { display: inline-flex; }

/* ═══════════════════════ Checkout ═══════════════════════ */

.cc-checkout__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
  align-items: start;
}

@media (min-width: 1024px) {
  .cc-checkout__grid { grid-template-columns: 1.35fr 1fr; gap: 3rem; }
  .cc-checkout__aside { position: sticky; top: calc(var(--navbar-height) + 1rem); }
}

.cc-checkout__fields .col-1,
.cc-checkout__fields .col-2 { margin-bottom: 2rem; }

.cc-checkout h3,
.cc-checkout .woocommerce-billing-fields > h3,
.cc-checkout .woocommerce-shipping-fields > h3,
.cc-checkout .woocommerce-additional-fields > h3 {
  font-family: var(--font-display);
  font-size: 1.125rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: hsl(var(--foreground));
  margin-bottom: 1.25rem;
  padding-bottom: 0.625rem;
  border-bottom: 1px solid hsl(var(--foreground) / 0.1);
}

.cc-checkout .woocommerce-shipping-fields h3 label {
  border: 0;
  text-transform: none;
  letter-spacing: 0;
  font-family: var(--font-display);
  font-size: 1.125rem;
  color: hsl(var(--foreground));
  margin: 0;
  display: inline;
}

.cc-checkout__secure {
  margin-top: 1.5rem;
  font-family: var(--font-body);
  font-size: 0.8125rem;
  line-height: 1.5;
  color: hsl(var(--muted-foreground));
}

.cc-checkout__back {
  margin-top: 1.25rem;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: hsl(var(--muted-foreground));
}

.cc-checkout__back a:hover { color: hsl(var(--primary)); }

.cc-review-table thead th {
  font-size: 0.6875rem;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: hsl(var(--muted-foreground));
  text-align: left;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid hsl(var(--foreground) / 0.12);
}

.cc-review-table thead th.product-total { text-align: right; }

.cc-review-table tbody td {
  padding: 0.875rem 0;
  border-bottom: 1px solid hsl(var(--foreground) / 0.06);
  vertical-align: top;
}

.cc-review-table tbody td.product-total { text-align: right; white-space: nowrap; }

.cc-review-table .product-quantity { color: hsl(var(--muted-foreground)); font-weight: 400; }

/* Login / cupom acima do checkout */

.woocommerce-form-login,
.checkout_coupon {
  background: hsl(0 0% 100%);
  border: 1px solid hsl(var(--foreground) / 0.08);
  border-radius: 0.75rem;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}

.woocommerce-form-login .form-row { margin-bottom: 1rem; }

.woocommerce-form-login-toggle,
.woocommerce-form-coupon-toggle { margin-bottom: 1rem; }

/* Pagamento */

.cc-payment { margin-top: 1.5rem; }

.cc-payment__title {
  font-family: var(--font-display);
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: hsl(var(--foreground));
  margin-bottom: 0.875rem;
}

.cc-payment__methods {
  list-style: none;
  margin: 0 0 1.25rem;
  padding: 0;
}

.cc-payment__methods > li {
  border: 1px solid hsl(var(--foreground) / 0.12);
  border-radius: 0.5rem;
  padding: 0.875rem 1rem;
  margin-bottom: 0.625rem;
  font-family: var(--font-body);
  font-size: 0.9375rem;
}

.cc-payment__methods > li label {
  display: inline;
  text-transform: none;
  letter-spacing: 0;
  font-size: 0.9375rem;
  color: hsl(var(--foreground));
  margin: 0;
  cursor: pointer;
}

.cc-payment__methods .payment_box {
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px dashed hsl(var(--foreground) / 0.12);
  font-size: 0.8125rem;
  color: hsl(var(--muted-foreground));
}

.cc-payment__methods .payment_box p:last-child { margin-bottom: 0; }

.cc-payment__place { margin-top: 1rem; }

.woocommerce-terms-and-conditions-wrapper { margin-bottom: 1rem; font-size: 0.8125rem; }

.woocommerce-terms-and-conditions-wrapper .woocommerce-privacy-policy-text p { color: hsl(var(--muted-foreground)); }

.woocommerce-terms-and-conditions-wrapper label {
  display: inline;
  text-transform: none;
  letter-spacing: 0;
  color: hsl(var(--foreground));
}

/* Blocker de "processando" do checkout.js */
.blockUI.blockOverlay {
  position: relative;
  background: hsl(var(--background) / 0.6) !important;
  opacity: 1 !important;
}

.blockUI.blockOverlay::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1.75rem;
  height: 1.75rem;
  margin: -0.875rem 0 0 -0.875rem;
  border: 2px solid hsl(var(--foreground) / 0.2);
  border-top-color: hsl(var(--primary));
  border-radius: 50%;
  animation: cc-loja-spin 0.8s linear infinite;
}

@keyframes cc-loja-spin {
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  .blockUI.blockOverlay::after { animation: none; }
}

/* Checkout bloqueado por item com problema */

.cc-loja-blocked {
  max-width: 40rem;
  padding: 2rem 0 3rem;
}

.cc-loja-blocked__text {
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.55;
  color: hsl(var(--foreground));
  margin-bottom: 1.25rem;
}

.cc-loja-blocked ul {
  list-style: none;
  margin: 0 0 1.5rem;
  padding: 0;
}

.cc-loja-blocked__cta { margin-top: 1.5rem; }

/* ═══════════════════════ Pedido recebido ═══════════════════════ */

.cc-thanks__lead {
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.6;
  max-width: 40rem;
  color: hsl(var(--foreground));
  margin-bottom: 2rem;
}

.cc-thanks__details {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  gap: 1px;
  list-style: none;
  margin: 0 0 2.5rem;
  padding: 0;
  background: hsl(var(--foreground) / 0.08);
  border: 1px solid hsl(var(--foreground) / 0.08);
  border-radius: 0.75rem;
  overflow: hidden;
}

.cc-thanks__details li {
  background: hsl(0 0% 100%);
  padding: 1.125rem 1.25rem;
}

.cc-thanks__label {
  display: block;
  font-family: var(--font-body);
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: hsl(var(--muted-foreground));
  margin-bottom: 0.375rem;
}

.cc-thanks__details strong {
  font-family: var(--font-display);
  font-size: 1.0625rem;
  font-weight: 800;
  color: hsl(var(--foreground));
}

.cc-thanks__failed { margin-bottom: 2rem; }
.cc-thanks__failed-actions { display: flex; gap: 0.75rem; flex-wrap: wrap; }

.cc-thanks .woocommerce-order-details,
.cc-thanks .woocommerce-customer-details { margin-top: 2.5rem; }

.cc-thanks h2 {
  font-family: var(--font-display);
  font-size: 1.25rem;
  text-transform: uppercase;
  color: hsl(var(--foreground));
  margin-bottom: 1rem;
}

.cc-thanks .woocommerce-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-body);
  font-size: 0.9375rem;
}

.cc-thanks .woocommerce-table th,
.cc-thanks .woocommerce-table td {
  padding: 0.75rem 0;
  border-bottom: 1px solid hsl(var(--foreground) / 0.08);
  text-align: left;
}

.cc-thanks .woocommerce-table td:last-child,
.cc-thanks .woocommerce-table th:last-child { text-align: right; }

.cc-thanks .woocommerce-columns--addresses {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  margin-top: 1.5rem;
}

@media (min-width: 768px) {
  .cc-thanks .woocommerce-columns--addresses { grid-template-columns: 1fr 1fr; }
}

.cc-thanks .woocommerce-column__title,
.cc-thanks .woocommerce-column h2 { margin-bottom: 0.75rem; }

.cc-thanks address {
  font-style: normal;
  font-family: var(--font-body);
  font-size: 0.9375rem;
  line-height: 1.6;
  color: hsl(var(--muted-foreground));
}

.cc-thanks__cta { margin-top: 2.5rem; }
.cc-thanks__cta .stagger-btn { display: inline-flex; }

/* ═══════════════════════ Minha conta ═══════════════════════ */

/* A grade de duas colunas só existe quando há navegação da conta — ou seja,
   com o visitante logado. Deslogado, a página é o formulário de login. */
body.logged-in.woocommerce-account .woocommerce {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  align-items: start;
}

@media (min-width: 900px) {
  body.logged-in.woocommerce-account .woocommerce { grid-template-columns: 15rem 1fr; gap: 3rem; }
}

/* Login / recuperação de senha (visitante deslogado).
   `.woocommerce-account` é classe do BODY — daí o seletor colado, sem espaço. */
body:not(.logged-in).woocommerce-account .woocommerce > h2,
body:not(.logged-in).woocommerce-account .woocommerce-form-login,
body:not(.logged-in).woocommerce-account .woocommerce-ResetPassword {
  max-width: 26rem;
  margin-inline: auto;
}

body:not(.logged-in).woocommerce-account .woocommerce > h2 {
  font-family: var(--font-display);
  font-size: 1.5rem;
  text-transform: uppercase;
  text-align: center;
  color: hsl(var(--foreground));
  margin-bottom: 1.25rem;
}

.cc-account__nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid hsl(var(--foreground) / 0.1);
}

.cc-account__nav li { border-bottom: 1px solid hsl(var(--foreground) / 0.1); }

.cc-account__nav a {
  display: block;
  padding: 0.875rem 0;
  font-family: var(--font-body);
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: hsl(var(--muted-foreground));
  transition: color 0.3s ease;
}

.cc-account__nav a:hover,
.cc-account__nav .is-active a,
.cc-account__nav a[aria-current='page'] { color: hsl(var(--primary)); }

.cc-account__hello {
  font-family: var(--font-display);
  font-size: 1.5rem;
  text-transform: uppercase;
  color: hsl(var(--foreground));
  margin-bottom: 0.5rem;
}

.cc-account__intro {
  font-family: var(--font-body);
  color: hsl(var(--muted-foreground));
  margin-bottom: 2rem;
}

.woocommerce-MyAccount-content { font-family: var(--font-body); }

.woocommerce-MyAccount-content .woocommerce-orders-table,
.woocommerce-MyAccount-content table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9375rem;
}

.woocommerce-MyAccount-content th {
  text-align: left;
  font-weight: 400;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: hsl(var(--muted-foreground));
  padding: 0 0.5rem 0.75rem 0;
  border-bottom: 1px solid hsl(var(--foreground) / 0.12);
}

.woocommerce-MyAccount-content td {
  padding: 0.875rem 0.5rem 0.875rem 0;
  border-bottom: 1px solid hsl(var(--foreground) / 0.08);
}

.woocommerce-MyAccount-content .button,
.woocommerce-MyAccount-content button[type='submit'] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.7rem 1.35rem;
  font-family: var(--font-body);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  background: hsl(var(--foreground));
  color: hsl(var(--background));
  border: 1px solid hsl(var(--foreground));
  border-radius: 0.4rem;
  cursor: pointer;
  transition: background 0.4s var(--ease-premium);
}

.woocommerce-MyAccount-content .button:hover,
.woocommerce-MyAccount-content button[type='submit']:hover {
  background: hsl(var(--primary));
  border-color: hsl(var(--primary));
}

/* Login / cadastro (Minha conta deslogada) */

.cc-loja .u-columns.col2-set {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}

@media (min-width: 768px) {
  .cc-loja .u-columns.col2-set { grid-template-columns: 1fr 1fr; }
}

.cc-loja .u-column1 > h2,
.cc-loja .u-column2 > h2 {
  font-family: var(--font-display);
  font-size: 1.25rem;
  text-transform: uppercase;
  color: hsl(var(--foreground));
  margin-bottom: 1rem;
}

.cc-loja .woocommerce-form__label-for-checkbox,
.cc-loja label.checkbox {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  text-transform: none;
  letter-spacing: 0;
  font-size: 0.875rem;
  color: hsl(var(--foreground));
}

.cc-loja input[type='checkbox'],
.cc-loja input[type='radio'] { width: auto; accent-color: hsl(var(--primary)); }

.cc-loja .woocommerce-LostPassword {
  margin-top: 0.75rem;
  font-size: 0.8125rem;
}

.cc-loja .woocommerce-LostPassword a { color: hsl(var(--primary)); text-decoration: underline; text-underline-offset: 3px; }

/* ═══════════════════════ Vitrine (Shop) ═══════════════════════ */

.cc-shop-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  gap: 2rem 1.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.cc-shop-card__media {
  display: block;
  aspect-ratio: 3 / 4;
  border-radius: 0.5rem;
  overflow: hidden;
  background: hsl(var(--muted));
  margin-bottom: 0.875rem;
}

.cc-shop-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s var(--ease-premium);
}

.cc-shop-card__link:hover .cc-shop-card__media img { transform: scale(1.04); }

.cc-shop-card__title {
  display: block;
  font-family: var(--font-display);
  font-size: 1rem;
  text-transform: uppercase;
  color: hsl(var(--foreground));
}

.cc-shop-card__price {
  display: block;
  margin-top: 0.25rem;
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: hsl(var(--cc-preco));
}

/* Esgotado na vitrine: o card continua clicável (a ficha tem a história do
   livro e vale a leitura), mas o visitante já sabe antes de clicar. */
.cc-shop-card__soldout {
  display: inline-block;
  margin-top: 0.5rem;
  padding: 0.15rem 0.5rem;
  border: 1px solid hsl(var(--muted-foreground) / 0.4);
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: hsl(var(--muted-foreground));
}

.cc-loja .woocommerce-pagination { margin-top: 3rem; }

.cc-loja .woocommerce-pagination ul {
  display: flex;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
  justify-content: center;
}

.cc-loja .woocommerce-pagination a,
.cc-loja .woocommerce-pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  border: 1px solid hsl(var(--foreground) / 0.15);
  border-radius: 0.375rem;
  font-family: var(--font-body);
  font-size: 0.875rem;
}

.cc-loja .woocommerce-pagination .current {
  background: hsl(var(--foreground));
  color: hsl(var(--background));
  border-color: hsl(var(--foreground));
}

/* ═══════════════════════ Mini-carrinho no header ═══════════════════════ */

.cc-cart-btn-wrap { position: relative; }

.cc-cart-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.375rem;
  color: hsl(var(--foreground));
  transition: color 0.3s ease;
}

.cc-cart-btn:hover { color: hsl(var(--primary)); }

.cc-cart-btn:focus-visible {
  outline: 2px solid hsl(var(--primary));
  outline-offset: 2px;
  border-radius: 0.25rem;
}

body.cc-menu-open .cc-cart-btn { color: hsl(var(--primary-foreground)); }

.cc-cart-btn__icon { width: 1.125rem; height: 1.125rem; }

.cc-cart-btn__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.125rem;
  height: 1.125rem;
  padding-inline: 0.25rem;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 0.625rem;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  background: hsl(var(--foreground) / 0.1);
  color: hsl(var(--muted-foreground));
  transition: background 0.3s ease, color 0.3s ease;
}

.cc-cart-btn__count.is-filled {
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
}

body.cc-menu-open .cc-cart-btn__count {
  background: hsl(var(--primary-foreground) / 0.15);
  color: hsl(var(--primary-foreground));
}

body.cc-menu-open .cc-cart-btn__count.is-filled {
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
}

/* Painel deslizante */

.cc-cart-panel {
  position: absolute;
  top: calc(100% + 0.75rem);
  right: 0;
  width: min(22rem, calc(100vw - 2rem));
  background: hsl(0 0% 100%);
  border: 1px solid hsl(var(--foreground) / 0.1);
  border-radius: 0.75rem;
  box-shadow: 0 24px 48px -18px rgb(0 0 0 / 0.28);
  padding: 1.25rem;
  z-index: 60;
  font-family: var(--font-body);
  color: hsl(var(--foreground));
}

.cc-cart-panel[hidden] { display: none; }

.cc-cart-panel__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}

.cc-cart-panel__title {
  font-family: var(--font-display);
  font-size: 0.9375rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.cc-cart-panel__close {
  font-size: 1.375rem;
  line-height: 1;
  color: hsl(var(--muted-foreground));
  padding: 0.125rem 0.375rem;
  border-radius: 0.25rem;
}

.cc-cart-panel__close:hover { color: hsl(var(--foreground)); }

.cc-minicart__list {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
  max-height: 17rem;
  overflow-y: auto;
}

.cc-minicart__item {
  position: relative;
  display: block;
  padding: 0.75rem 1.75rem 0.75rem 0;
  border-bottom: 1px solid hsl(var(--foreground) / 0.08);
}

.cc-minicart__link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.cc-minicart__thumb img {
  width: 2.75rem;
  height: 3.5rem;
  object-fit: cover;
  border-radius: 0.25rem;
  background: hsl(var(--muted));
}

.cc-minicart__name {
  font-size: 0.875rem;
  line-height: 1.3;
  color: hsl(var(--foreground));
}

.cc-minicart__qty {
  display: block;
  margin-top: 0.25rem;
  padding-left: 3.5rem;
  font-size: 0.75rem;
  color: hsl(var(--muted-foreground));
}

.cc-minicart__item .remove {
  position: absolute;
  top: 0.75rem;
  right: 0;
  width: 1.25rem;
  height: 1.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 1rem;
  line-height: 1;
  color: hsl(var(--muted-foreground));
}

.cc-minicart__item .remove:hover { color: hsl(var(--destructive)); }

.cc-minicart__total {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding-bottom: 1rem;
  border-bottom: 1px solid hsl(var(--foreground) / 0.1);
  margin-bottom: 1rem;
}

.cc-minicart__total-label {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: hsl(var(--muted-foreground));
}

.cc-minicart__total-value {
  font-family: var(--font-display);
  font-size: 1.125rem;
  color: hsl(var(--cc-preco));
}

.cc-minicart__buttons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
}

.cc-minicart__buttons .cc-loja__btn {
  padding: 0.7rem 0.5rem;
  font-size: 0.6875rem;
  letter-spacing: 0.1em;
}

.cc-minicart__empty {
  font-size: 0.875rem;
  color: hsl(var(--muted-foreground));
  padding: 0.5rem 0 0.25rem;
}

.cc-cart-panel :is(a, button):focus-visible {
  outline: 2px solid hsl(var(--primary));
  outline-offset: 2px;
}

/* ═══════════════════════ Responsivo — tabelas viram cards ═══════════════════════ */

@media (max-width: 767px) {
  .cc-cart-table thead { display: none; }

  .cc-cart-table,
  .cc-cart-table tbody,
  .cc-cart-item,
  .cc-cart-item td,
  .cc-cart-actions { display: block; width: 100%; }

  .cc-cart-item {
    position: relative;
    display: grid;
    grid-template-columns: 4.5rem 1fr;
    grid-template-areas:
      'thumb name'
      'thumb price'
      'qty   subtotal';
    gap: 0.5rem 1rem;
    padding: 1.25rem 2rem 1.25rem 0;
    border-bottom: 1px solid hsl(var(--foreground) / 0.08);
  }

  .cc-cart-item td { padding: 0; border: 0; }

  .cc-cart-item .product-thumbnail { grid-area: thumb; width: auto; }
  .cc-cart-item .product-name { grid-area: name; }
  .cc-cart-item .product-price { grid-area: price; color: hsl(var(--muted-foreground)); font-size: 0.875rem; }
  .cc-cart-item .product-quantity { grid-area: qty; }
  .cc-cart-item .product-subtotal { grid-area: subtotal; align-self: center; }

  .cc-cart-item .product-remove {
    position: absolute;
    top: 1rem;
    right: 0;
    width: auto;
  }

  .cc-cart-item .product-price::before,
  .cc-cart-item .product-subtotal::before {
    content: attr(data-title) ': ';
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: hsl(var(--muted-foreground));
  }

  .cc-cart-collaterals .cart_totals { max-width: none; }

  .cc-cart-coupon { max-width: none; }
  .cc-cart-coupon__row { flex-direction: column; }
  .cc-cart-coupon__row .cc-loja__btn { width: 100%; }
  .cc-cart-update { width: 100%; }

  .cc-thanks__details { grid-template-columns: 1fr; }
}