/*
 * Santrim Cart Page — skin da pagina do carrinho (shortcode [woocommerce_cart]).
 *
 * Mesma linguagem do checkout: #FFF/#F8F8F8, sombras suaves, azul #2563EB so
 * em foco de campo, verde (token global --santrim-confirm, v5.118.0) so
 * em desconto Pix e botao de finalizar.
 * Nada de roxo, rosa ou cinza-botao do tema.
 *
 * TUDO escopado em body.woocommerce-cart. Alvos = markup classico core do Woo.
 *
 * @since 5.97.0
 */

/* ── Tipografia base (so os elementos escopados) ─────────────────── */
body.woocommerce-cart .woocommerce {
    font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    color: #1F1F1F;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ═══════════════════════════════════════════════════════════════════
 * 1. ITENS — cada linha vira BLOCO (nao planilha). Hierarquia por fonte +
 *    espacamento, nao por grade de bordas. v5.100.0.
 *    Tabela/tbody viram block; cabecalho (thead) some; a linha .cart_item
 *    vira grid: [thumb 90px] [nome+stepper+remover] [preco a direita].
 * ═══════════════════════════════════════════════════════════════════ */
body.woocommerce-cart table.shop_table.cart,
body.woocommerce-cart table.shop_table.cart tbody {
    display: block;
    border: 0 !important;
    background: transparent;
    margin: 0 0 8px;
}
body.woocommerce-cart table.shop_table.cart thead { display: none !important; }

/* Linha = bloco. thumb ocupa as 2 linhas; preco idem, alinhado ao topo. */
body.woocommerce-cart table.shop_table.cart tbody tr.cart_item {
    display: grid;
    grid-template-columns: 90px 1fr auto;
    grid-template-areas:
        "thumb name  price"
        "thumb qty   price";
    align-items: start;
    column-gap: 20px;
    row-gap: 12px;
    padding: 28px 0;
    border: 0;
    border-bottom: 1px solid #F0F0F0;
}
body.woocommerce-cart table.shop_table.cart tbody tr.cart_item:first-child { padding-top: 6px; }

/* Reset das celulas p/ o grid; mata rotulos ::before do responsive. */
body.woocommerce-cart tr.cart_item > td {
    display: block;
    padding: 0;
    margin: 0;
    border: 0 !important;
    background: transparent !important;
    text-align: left;
}
body.woocommerce-cart tr.cart_item > td::before { display: none !important; content: none !important; }

/* × nativo escondido (Remover vira link de texto via JS) e preco unitario
   redundante escondido — so o preco da LINHA (subtotal) fica. */
body.woocommerce-cart tr.cart_item td.product-remove { display: none !important; }
body.woocommerce-cart tr.cart_item td.product-price  { display: none !important; }

body.woocommerce-cart tr.cart_item td.product-thumbnail { grid-area: thumb; }
body.woocommerce-cart tr.cart_item td.product-name      { grid-area: name; }
body.woocommerce-cart tr.cart_item td.product-quantity  { grid-area: qty; align-self: start; }
body.woocommerce-cart tr.cart_item td.product-subtotal  { grid-area: price; align-self: start; text-align: right; }

/* Thumbnail ~90px, canto arredondado. */
body.woocommerce-cart tr.cart_item td.product-thumbnail img {
    width: 90px;
    height: 90px;
    max-width: 90px;
    object-fit: cover;
    border-radius: 10px;
    display: block;
}

/* Nome peso 500, sem cara de link; variacoes em cinza abaixo. */
body.woocommerce-cart tr.cart_item td.product-name a {
    color: #1F1F1F !important;
    font-weight: 500;
    font-size: 15px;
    line-height: 1.35;
    text-decoration: none !important;
}
body.woocommerce-cart tr.cart_item td.product-name a:hover { text-decoration: underline !important; }
body.woocommerce-cart tr.cart_item td.product-name dl.variation {
    margin: 6px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: #888;
}
body.woocommerce-cart tr.cart_item td.product-name dl.variation dt,
body.woocommerce-cart tr.cart_item td.product-name dl.variation dd {
    margin: 0;
    font-weight: 400;
    color: #888;
    display: inline;
}
body.woocommerce-cart tr.cart_item td.product-name dl.variation dd { margin-right: 8px; }
body.woocommerce-cart tr.cart_item td.product-name dl.variation p { margin: 0; }

/* Preco da linha a direita, sobrio, alinhado ao topo do bloco. */
body.woocommerce-cart tr.cart_item td.product-subtotal,
body.woocommerce-cart tr.cart_item td.product-subtotal .woocommerce-Price-amount {
    color: #1F1F1F;
    font-weight: 600;
    font-size: 15px;
}

/* Link "Remover" (injetado por JS dentro do td.product-quantity). */
body.woocommerce-cart .santrim-cart-remove {
    display: inline-block;
    margin-top: 12px;
    padding: 0;
    background: none;
    border: 0;
    color: #999;
    font-size: 13px;
    text-decoration: underline;
    cursor: pointer;
}
body.woocommerce-cart .santrim-cart-remove:hover { color: #C0392B; }

/* ═══════════════════════════════════════════════════════════════════
 * 2. QUANTIDADE — stepper (mesmo desenho do drawer v5.96)
 *    Botoes -/+ injetados via JS (.santrim-cart-qty). Sem JS: input nativo.
 * ═══════════════════════════════════════════════════════════════════ */
body.woocommerce-cart .quantity.santrim-cart-qty {
    display: inline-flex;
    align-items: center;
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    vertical-align: middle;
}
body.woocommerce-cart .santrim-cart-step {
    width: 32px;
    height: 34px;
    padding: 0;
    margin: 0;
    border: 0;
    background: none;
    color: #1F1F1F;
    font-size: 17px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .12s ease;
}
body.woocommerce-cart .santrim-cart-step:hover { background: #F0F0F0; }
body.woocommerce-cart .quantity.santrim-cart-qty input.qty {
    width: 40px;
    height: 34px;
    padding: 0;
    margin: 0;
    border: 0;
    border-left: 1px solid #E0E0E0;
    border-right: 1px solid #E0E0E0;
    border-radius: 0;
    background: #fff;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    color: #1F1F1F;
    -moz-appearance: textfield;
    box-shadow: none;
}
body.woocommerce-cart .quantity.santrim-cart-qty input.qty::-webkit-outer-spin-button,
body.woocommerce-cart .quantity.santrim-cart-qty input.qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* ═══════════════════════════════════════════════════════════════════
 * 3. AUTO-ATUALIZAR — esconde o botao "Atualizar carrinho".
 *    Classe adicionada SO via JS: sem JS o botao volta a aparecer.
 * ═══════════════════════════════════════════════════════════════════ */
body.woocommerce-cart .santrim-cart-hide { display: none !important; }

/* ═══════════════════════════════════════════════════════════════════
 * 4. CUPOM — mora no card de totais (secao 5). O bloco NATIVO em td.actions
 *    fica escondido SO quando o JS assumiu (body.santrim-cart-js) — sem JS o
 *    cupom nativo volta a aparecer e o fluxo core segue intacto.
 * ═══════════════════════════════════════════════════════════════════ */
body.santrim-cart-js td.actions .coupon { display: none !important; }
body.woocommerce-cart td.actions {
    padding: 0 !important;
    border: 0 !important;
}

/* ═══════════════════════════════════════════════════════════════════
 * 5. CARD DE TOTAIS — fundo #F8F8F8, SEM linhas entre as rows. Hierarquia
 *    por espacamento; separador unico so antes do Total. v5.100.0.
 * ═══════════════════════════════════════════════════════════════════ */
body.woocommerce-cart .cart-collaterals { margin-top: 0; }
body.woocommerce-cart .cart_totals {
    background: #F8F8F8;
    border: 0;
    border-radius: 12px;
    box-shadow: none;
    padding: 24px 26px;
}
/* Titulo "Total no carrinho": menor, caps leve, cinza. */
body.woocommerce-cart .cart_totals h2 {
    font-size: 12px;
    font-weight: 600;
    color: #888;
    margin: 0 0 14px;
    padding: 0;
    border: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
body.woocommerce-cart .cart_totals table.shop_table {
    border: 0 !important;
    border-collapse: collapse !important;
    margin: 0;
    background: transparent;
}
/* Rows sem borda; ar por padding. */
body.woocommerce-cart .cart_totals table.shop_table th,
body.woocommerce-cart .cart_totals table.shop_table td {
    border: 0 !important;
    background: transparent !important;
    padding: 11px 0;
    font-size: 14px;
    vertical-align: top;
}
body.woocommerce-cart .cart_totals table.shop_table th {
    color: #666;
    font-weight: 400;
    text-align: left;
}
body.woocommerce-cart .cart_totals table.shop_table td {
    color: #1F1F1F;
    text-align: right;
    font-weight: 500;
}

/* Desconto Pix (fee) — valor em verde, como no resumo do checkout. */
body.woocommerce-cart .cart_totals table.shop_table tr.fee th,
body.woocommerce-cart .cart_totals table.shop_table tr.fee td,
body.woocommerce-cart .cart_totals table.shop_table tr.fee td .woocommerce-Price-amount {
    color: var(--santrim-confirm) !important;
    font-weight: 600;
}

/* Separador UNICO antes do Total; Total em fonte maior peso 700. */
body.woocommerce-cart .cart_totals table.shop_table tr.order-total th,
body.woocommerce-cart .cart_totals table.shop_table tr.order-total td {
    border-top: 1px solid #E4E4E4 !important;
    padding-top: 16px;
    font-size: 18px;
}
body.woocommerce-cart .cart_totals table.shop_table tr.order-total th { color: #1F1F1F; font-weight: 600; }
body.woocommerce-cart .cart_totals table.shop_table tr.order-total td,
body.woocommerce-cart .cart_totals table.shop_table tr.order-total td .woocommerce-Price-amount {
    color: #1F1F1F;
    font-weight: 700;
}

/* Campo de cupom da casa (linha antes do Total). Estilo dos campos do checkout. */
body.woocommerce-cart .santrim-cart-coupon-row td { padding: 4px 0 16px !important; }
body.woocommerce-cart .santrim-cart-coupon { display: flex; gap: 8px; }
body.woocommerce-cart .santrim-coupon-input {
    flex: 1 1 auto;
    min-width: 0;
    height: 42px;
    padding: 0 14px;
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    background: #fff;
    font-size: 14px;
    color: #1F1F1F;
    box-shadow: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}
body.woocommerce-cart .santrim-coupon-input:focus {
    border-color: #2563EB;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
    outline: none;
}
body.woocommerce-cart .santrim-coupon-apply {
    height: 42px;
    padding: 0 18px;
    background: #fff !important;
    color: #1F1F1F !important;
    border: 1px solid #E0E0E0 !important;
    border-radius: 8px !important;
    font-size: 14px;
    font-weight: 500;
    box-shadow: none !important;
    text-shadow: none !important;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease;
}
body.woocommerce-cart .santrim-coupon-apply:hover {
    background: #F1F1F1 !important;
    border-color: #D0D0D0 !important;
}

/* FRETE FORA DO CARRINHO (v5.101.0): woocommerce_cart_ready_to_calc_shipping
   -> false em is_cart() faz o Woo nao renderizar o bloco de envio nem o
   calculador. Sem markup pra estilizar aqui; frete resolve-se no checkout. */

/* ═══════════════════════════════════════════════════════════════════
 * 6. NOTICES NATIVOS — linguagem da casa. v5.101.0.
 *    Woo pinta message/info com borda azul/verde grossa e fundo forte.
 *    Aqui: fundo #F8F8F8, sem borda grossa, texto cinza escuro, icone
 *    discreto. NAO escondemos (cupom aplicado / erro precisam aparecer).
 * ═══════════════════════════════════════════════════════════════════ */
body.woocommerce-cart .woocommerce-message,
body.woocommerce-cart .woocommerce-info,
body.woocommerce-cart .woocommerce-error {
    background: #F8F8F8 !important;
    border: 0 !important;
    border-left: 3px solid #E0E0E0 !important;
    border-radius: 8px;
    box-shadow: none !important;
    color: #444 !important;
    font-size: 14px;
    line-height: 1.5;
    padding: 14px 16px 14px 44px;
    margin: 0 0 20px;
}
body.woocommerce-cart .woocommerce-error { border-left-color: #C0392B !important; }
/* Icone ::before do Woo — discreto, cinza, alinhado. */
body.woocommerce-cart .woocommerce-message::before,
body.woocommerce-cart .woocommerce-info::before,
body.woocommerce-cart .woocommerce-error::before {
    color: #999 !important;
    font-size: 16px;
    top: 15px;
    left: 16px;
}
body.woocommerce-cart .woocommerce-error::before { color: #C0392B !important; }
/* Link "Ver carrinho"/acao dentro do notice — discreto, sem botao do tema. */
body.woocommerce-cart .woocommerce-message .button,
body.woocommerce-cart .woocommerce-info .button {
    background: none !important;
    color: #1F1F1F !important;
    border: 0 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    padding: 0 !important;
    text-decoration: underline;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════════════════
 * 6. BOTAO FINAL — MESMO tamanho do botao principal do checkout (v5.98.0).
 *    Dimensoes copiadas de modules/ecommerce/checkout (#place_order /
 *    .santrim-co-pay-proxy, via tokens): padding 12px 20px, radius 10px,
 *    font-size 15px, peso 600, line-height 1.25. Continua largura total
 *    do box e verde do token global --santrim-confirm (v5.118.0).
 * ═══════════════════════════════════════════════════════════════════ */
body.woocommerce-cart .wc-proceed-to-checkout { padding: 20px 0 0; }
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 12px 20px;
    background: var(--santrim-confirm) !important;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 15px;
    line-height: 1.25;
    letter-spacing: .3px;
    text-align: center;
    text-transform: uppercase;
    text-decoration: none !important;
    text-shadow: none !important;
    border: 0 !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    transition: background .15s ease;
}
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:focus {
    background: var(--santrim-confirm-strong) !important;
    color: #fff !important;
}

/* ═══════════════════════════════════════════════════════════════════
 * 7. CROSS-SELLS — so neutralizar cores (polimento fica pra depois)
 * ═══════════════════════════════════════════════════════════════════ */
body.woocommerce-cart .cross-sells h2,
body.woocommerce-cart .cross-sells h3,
body.woocommerce-cart .cross-sells .woocommerce-loop-product__title {
    color: #1F1F1F !important;
}
body.woocommerce-cart .cross-sells a.button {
    background: #fff !important;
    color: #1F1F1F !important;
    border: 1px solid #E0E0E0 !important;
    box-shadow: none !important;
    text-shadow: none !important;
}
body.woocommerce-cart .cross-sells a.button:hover {
    background: #F8F8F8 !important;
    border-color: #D0D0D0 !important;
}

/* ═══════════════════════════════════════════════════════════════════
 * 8. LAYOUT DUAS COLUNAS — tabela (~60%) a esquerda, totais (~38%) a
 *    direita, ALINHADOS PELO TOPO (como no checkout). v5.98.0.
 *    Wrapper = .woocommerce (shortcode [woocommerce_cart]); filhos diretos
 *    estaveis do cart.php core: form.woocommerce-cart-form + .cart-collaterals.
 *    Flex (nao grid) pra que qualquer filho extra — ex.: .woocommerce-notices-
 *    wrapper — ocupe 100% e nao vire coluna. Mobile: empilha, tabela primeiro
 *    (ordem natural do DOM).
 * ═══════════════════════════════════════════════════════════════════ */
body.woocommerce-cart .woocommerce {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 32px;
}
body.woocommerce-cart .woocommerce > form.woocommerce-cart-form {
    flex: 1 1 60%;
    min-width: 0; /* impede overflow da tabela dentro do flex item */
    margin: 0;
}
body.woocommerce-cart .woocommerce > .cart-collaterals {
    flex: 0 1 36%;
    width: auto;
    margin-top: 0;
}
/* Notices (e qualquer outro filho direto) ocupam a linha inteira. */
body.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper {
    flex: 1 1 100%;
}
/* Dentro da coluna direita, o box ocupa 100% (o tema costuma floata-lo). */
body.woocommerce-cart .cart-collaterals .cart_totals {
    width: 100%;
    float: none;
    margin-top: 0;
}

@media (max-width: 768px) {
    body.woocommerce-cart .woocommerce { flex-direction: column; gap: 24px; }
    body.woocommerce-cart .woocommerce > form.woocommerce-cart-form,
    body.woocommerce-cart .woocommerce > .cart-collaterals { flex: 1 1 100%; }
    body.woocommerce-cart .cart_totals { padding: 20px; }
    body.woocommerce-cart table.shop_table.cart td.product-thumbnail img { width: 56px; height: 56px; }
    body.woocommerce-cart td.actions .coupon input#coupon_code { min-width: 0; flex: 1 1 auto; }
}

/* ═══════════════════════════════════════════════════════════════════
 * TITULO DA PAGINA — nosso H1 proprio (render_cart_title, hook
 * woocommerce_before_cart), na linguagem da casa. Filho direto do wrapper
 * flex .woocommerce → ocupa a linha inteira, no topo. O titulo do TEMA
 * (solto/deslocado) fica escondido logo abaixo. v5.104.0.
 * ═══════════════════════════════════════════════════════════════════ */
body.woocommerce-cart .woocommerce > .santrim-cart-title {
    flex: 1 1 100%;
    width: 100%;
    /* Respiro: 40px acima (unico espaco no topo — e o 1o item flex, o gap nao
       conta acima dele) separa do header do site; abaixo, o gap 32px do wrapper
       ja da o espaco ate o grid (alvo ~28px), por isso margin-bottom fica 0 e
       nao soma/duplica em ~60px. v5.105.0. */
    margin: 40px 0 0;
    font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    font-size: 26px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: normal;
    color: #1F1F1F;
}

/* Titulo do TEMA (H1 da pagina, fora do conteudo do Woo) escondido — cobrimos
   os seletores comuns. Cuidado: NAO casa o nosso .santrim-cart-title nem os
   headings internos do Woo (h2 do cart_totals). Fallback em cart-page.js para
   o caso destes seletores nao baterem o tema real (ai o passo seguinte e pedir
   o outerHTML ao Tiago — nao iterar as cegas). */
body.woocommerce-cart h1.entry-title,
body.woocommerce-cart .page-title,
body.woocommerce-cart .elementor-page-title,
body.woocommerce-cart .elementor-page-title .elementor-heading-title,
body.woocommerce-cart .page-header h1,
body.woocommerce-cart header.entry-header {
    display: none !important;
}

/* ═══════════════════════════════════════════════════════════════════
 * BARRA DE FRETE GRATIS — agora PRIMEIRA linha do card de totais (helper
 * compartilhado Santrim_Shipping_Bar, prefixo santrim-cart; renderizada em
 * woocommerce_before_cart_totals, dentro de .cart_totals, acima do h2).
 * Herda o cinza #F8F8F8 do card: SEM fundo/borda proprios; separador sutil
 * 1px #E8E8E8 abaixo. Re-renderiza no updated_cart_totals → acompanha a
 * quantidade. Sem minimo configurado → wrapper :empty colapsa (nada aparece,
 * card sem linha vazia). v5.104.0 (antes: cartao branco avulso no topo).
 * ═══════════════════════════════════════════════════════════════════ */
body.woocommerce-cart .cart_totals .santrim-cart__shipping:empty { display: none; }
body.woocommerce-cart .cart_totals .santrim-cart__ship {
    margin: 0 0 14px;
    padding: 0 0 14px;
    background: none;
    border: 0;
    border-bottom: 1px solid #E8E8E8;
}
body.woocommerce-cart .cart_totals .santrim-cart__ship-text {
    margin: 0 0 8px;
    font-size: 13px;
    line-height: 1.35;
    font-weight: 500;
    color: #1F1F1F;
}
body.woocommerce-cart .cart_totals .santrim-cart__ship.is-reached .santrim-cart__ship-text {
    color: var(--santrim-confirm);
    font-weight: 600;
}
body.woocommerce-cart .cart_totals .santrim-cart__ship-track {
    display: block;
    width: 100%;
    height: 4px;
    border-radius: 999px;
    background: #EDEDED;
    overflow: hidden;
}
body.woocommerce-cart .cart_totals .santrim-cart__ship-bar {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: #1F1F1F;
    transition: width .3s ease;
}
body.woocommerce-cart .cart_totals .santrim-cart__ship.is-reached .santrim-cart__ship-bar { background: var(--santrim-confirm); }