/*
Modernização UX/UI das telas WooCommerce (fases 0 e 1)
Toque de Carinho — fundação de design (tokens, botões, campos, avisos,
tabelas, badges de status) + telas do carrinho.

Carregado por make2_enqueue_woo_moderno() no functions.php do child,
depois do skin do Creta (que usa !important, por isso este arquivo
também usa !important nas mesmas propriedades).
*/

/* =========================================================
   1. Tokens da marca
   ========================================================= */
:root {
    --tdc-vinho: #800110;
    --tdc-vinho-escuro: #5c000c;
    --tdc-vinho-suave: #f8eef0;
    --tdc-dourado: #e99620;
    --tdc-rosa: #e62263;
    --tdc-texto: #2b2b2b;
    --tdc-texto-suave: #767676;
    --tdc-borda: #e3e3e3;
    --tdc-fundo: #faf7f5;
    --tdc-verde: #2e7d4f;
    --tdc-verde-suave: #eaf6ee;
    --tdc-erro: #c0392b;
    --tdc-raio-campo: 8px;
    --tdc-raio-botao: 10px;
    --tdc-raio-card: 14px;
    --tdc-sombra-card: 0 6px 24px rgba(43, 14, 18, 0.07);
}

/* rede defensiva (o skin antigo não esconde esta classe em todas as telas) */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    width: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    word-wrap: normal !important;
}

/* =========================================================
   2. Botões (fundação)
   O skin do Creta força a.button/input.button com !important
   cinza/uppercase — substituímos pelo sistema da marca.
   ========================================================= */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce-page input.button {
    display: inline-block;
    padding: 12px 22px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    text-align: center;
    color: var(--tdc-vinho) !important;
    background: #fff !important;
    border: 1px solid var(--tdc-vinho) !important;
    border-radius: var(--tdc-raio-botao) !important;
    box-shadow: none !important;
    text-decoration: none !important;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    -webkit-appearance: none;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce-page a.button:hover,
.woocommerce-page button.button:hover,
.woocommerce-page input.button:hover {
    color: #fff !important;
    background: var(--tdc-vinho) !important;
    border-color: var(--tdc-vinho) !important;
}

/* CTAs primários (ação principal da tela) */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce a.checkout-button,
.woocommerce .return-to-shop > .button,
.woocommerce .return-to-shop > a {
    color: #fff !important;
    background: var(--tdc-vinho) !important;
    border-color: var(--tdc-vinho) !important;
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce a.checkout-button:hover,
.woocommerce .return-to-shop > .button:hover,
.woocommerce .return-to-shop > a:hover {
    background: var(--tdc-vinho-escuro) !important;
    border-color: var(--tdc-vinho-escuro) !important;
    color: #fff !important;
}

.woocommerce a.button:disabled,
.woocommerce button.button:disabled,
.woocommerce input.button:disabled,
.woocommerce a.button.disabled,
.woocommerce button.button.disabled,
.woocommerce input.button.disabled {
    opacity: 0.45 !important;
    color: var(--tdc-texto-suave) !important;
    background: #f2f2f2 !important;
    border-color: var(--tdc-borda) !important;
    cursor: not-allowed;
}

/* =========================================================
   3. Campos de formulário (fundação)
   ========================================================= */
.woocommerce .input-text,
.woocommerce textarea,
.woocommerce select,
.woocommerce .qty,
.woocommerce select2-container--default .select2-selection--single {
    padding: 10px 14px !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
    color: var(--tdc-texto);
    background: #fff !important;
    border: 1px solid #cfcfcf !important;
    border-radius: var(--tdc-raio-campo) !important;
    box-shadow: none !important;
    height: auto !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    min-height: 44px;
}

.woocommerce textarea {
    min-height: 96px;
}

.woocommerce .input-text:focus,
.woocommerce textarea:focus,
.woocommerce select:focus {
    border-color: var(--tdc-vinho) !important;
    box-shadow: 0 0 0 3px rgba(128, 1, 16, 0.12) !important;
    outline: none;
}

.woocommerce select {
    -webkit-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23767676' d='M6 8L0 1.4 1.4 0 6 4.6 10.6 0 12 1.4z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    padding-right: 38px !important;
}

/* labels + marcador de obrigatório */
.woocommerce label {
    font-size: 14px;
    color: var(--tdc-texto);
    margin-bottom: 4px;
}

.woocommerce label .required {
    color: var(--tdc-rosa) !important;
    font-weight: 700;
}

.woocommerce label .optional {
    color: var(--tdc-texto-suave);
    font-weight: 400;
}

/* olho de senha dentro do campo */
.woocommerce .woocommerce-form-login .show-password-input,
.woocommerce .woocommerce-form-register .show-password-input,
.woocommerce .show-password-input {
    top: 50% !important;
    right: 12px !important;
    margin-top: -11px;
    opacity: 0.55;
}

.woocommerce .show-password-input:hover,
.woocommerce .show-password-input:focus {
    opacity: 1;
}

/* anel de foco acessível em qualquer elemento interativo */
.woocommerce a:focus-visible,
.woocommerce button:focus-visible,
.woocommerce input:focus-visible,
.woocommerce select:focus-visible,
.woocommerce textarea:focus-visible {
    outline: 2px solid var(--tdc-dourado);
    outline-offset: 2px;
}

/* =========================================================
   4. Avisos (notices) compactos
   ========================================================= */
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error,
.woocommerce-page .woocommerce-message,
.woocommerce-page .woocommerce-info,
.woocommerce-page .woocommerce-error {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    margin: 0 0 20px 0 !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    color: var(--tdc-texto) !important;
    background: #fff !important;
    border: 1px solid var(--tdc-borda) !important;
    border-left: 4px solid var(--tdc-dourado) !important;
    border-radius: var(--tdc-raio-campo) !important;
    box-shadow: none !important;
    text-align: left;
}

/* o skin posiciona os ::before dos avisos como absolute (FontAwesome) e o
   texto fica por baixo — forçar o ícone a voltar ao fluxo como item flex */
.woocommerce .woocommerce-message::before,
.woocommerce .woocommerce-info::before,
.woocommerce .woocommerce-error::before,
.woocommerce-page .woocommerce-message::before,
.woocommerce-page .woocommerce-info::before,
.woocommerce-page .woocommerce-error::before {
    position: static !important;
    left: auto !important;
    top: auto !important;
    margin: 0 !important;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    font-size: 13px;
    font-family: inherit !important;
    box-shadow: none !important;
    border-radius: 50%;
}

.woocommerce .woocommerce-message::before,
.woocommerce-page .woocommerce-message::before {
    content: "\2713";
    color: #fff !important;
    background: var(--tdc-verde) !important;
}

.woocommerce .woocommerce-info::before,
.woocommerce-page .woocommerce-info::before {
    content: "i";
    color: #fff !important;
    background: var(--tdc-dourado) !important;
    font-style: italic;
    font-weight: 700;
}

.woocommerce .woocommerce-error::before,
.woocommerce-page .woocommerce-error::before {
    content: "!";
    color: #fff !important;
    background: var(--tdc-erro) !important;
    font-weight: 700;
}

.woocommerce .woocommerce-message {
    border-left-color: var(--tdc-verde) !important;
}

.woocommerce .woocommerce-message .button,
.woocommerce .woocommerce-info .button {
    flex: 0 0 auto;
    margin-left: auto !important;
    padding: 8px 14px !important;
    font-size: 13px !important;
}

/* =========================================================
   5. Badges de status do pedido
   ========================================================= */
.woocommerce mark.order-status,
.woocommerce-page mark.order-status {
    display: inline-block;
    padding: 4px 12px;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0;
    text-transform: none;
    color: var(--tdc-texto);
    background: #f2f2f2;
    border: none;
    border-radius: 999px;
}

.woocommerce mark.order-status.status-processing,
.woocommerce-page mark.order-status.status-processing {
    color: #1d4e89;
    background: #e3edf8;
}

.woocommerce mark.order-status.status-completed,
.woocommerce-page mark.order-status.status-completed {
    color: var(--tdc-verde);
    background: var(--tdc-verde-suave);
}

.woocommerce mark.order-status.status-on-hold,
.woocommerce-page mark.order-status.status-on-hold,
.woocommerce mark.order-status.status-pending,
.woocommerce-page mark.order-status.status-pending {
    color: #8a5a00;
    background: #fdf1dc;
}

.woocommerce mark.order-status.status-saiu-para-entrega,
.woocommerce-page mark.order-status.status-saiu-para-entrega {
    color: var(--tdc-vinho);
    background: var(--tdc-vinho-suave);
}

.woocommerce mark.order-status.status-cancelled,
.woocommerce-page mark.order-status.status-cancelled,
.woocommerce mark.order-status.status-failed,
.woocommerce-page mark.order-status.status-failed {
    color: var(--tdc-erro);
    background: #fdeceb;
}

.woocommerce mark.order-status.status-refunded,
.woocommerce-page mark.order-status.status-refunded {
    color: var(--tdc-texto-suave);
    background: #ececec;
}

/* =========================================================
   6. Minha conta — item ativo do menu (fundação)
   ========================================================= */
.woocommerce-MyAccount-navigation ul li {
    list-style: none;
    padding: 0;
    border-bottom: 1px solid var(--tdc-borda);
}

.woocommerce-MyAccount-navigation ul li a {
    display: block;
    padding: 12px 14px;
    font-size: 15px;
    color: var(--tdc-texto);
    text-decoration: none;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.woocommerce-MyAccount-navigation ul li a:hover {
    color: var(--tdc-vinho);
    background: var(--tdc-fundo);
}

.woocommerce-MyAccount-navigation ul li.is-active a {
    color: var(--tdc-vinho) !important;
    font-weight: 700;
    background: var(--tdc-vinho-suave);
    border-left: 3px solid var(--tdc-vinho);
}

/* =========================================================
   6.5 Minha conta — tabela de pedidos
   ========================================================= */
.woocommerce table.woocommerce-MyAccount-orders {
    margin: 0;
    border: 1px solid var(--tdc-borda) !important;
    border-radius: var(--tdc-raio-card);
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    background: #fff;
    box-shadow: var(--tdc-sombra-card);
}

.woocommerce table.woocommerce-MyAccount-orders thead tr {
    background: var(--tdc-fundo) !important;
}

.woocommerce table.woocommerce-MyAccount-orders thead th {
    padding: 12px 14px !important;
    font-size: 11.5px !important;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-texto-suave);
    border: none !important;
    border-bottom: 1px solid var(--tdc-borda) !important;
}

.woocommerce table.woocommerce-MyAccount-orders tbody td,
.woocommerce table.woocommerce-MyAccount-orders tbody th {
    padding: 16px 14px !important;
    font-size: 14.5px;
    vertical-align: middle;
    border: none !important;
    border-bottom: 1px solid var(--tdc-borda) !important;
}

.woocommerce table.woocommerce-MyAccount-orders tbody tr:last-child td,
.woocommerce table.woocommerce-MyAccount-orders tbody tr:last-child th {
    border-bottom: none !important;
}

.woocommerce table.woocommerce-MyAccount-orders .woocommerce-orders-table__cell-order-number a {
    font-weight: 700;
    color: var(--tdc-vinho);
    text-decoration: none;
}

.woocommerce table.woocommerce-MyAccount-orders .woocommerce-orders-table__cell-order-actions .button {
    padding: 9px 16px !important;
    font-size: 13.5px !important;
}

/* mobile: linhas empilham com rótulos (padrão shop_table_responsive) */
@media (max-width: 767px) {
    .woocommerce table.woocommerce-MyAccount-orders thead {
        display: none;
    }

    .woocommerce table.woocommerce-MyAccount-orders tbody tr {
        display: block;
        padding: 6px 0;
        border-bottom: 1px solid var(--tdc-borda);
    }

    .woocommerce table.woocommerce-MyAccount-orders tbody tr:last-child {
        border-bottom: none;
    }

    .woocommerce table.woocommerce-MyAccount-orders tbody td,
    .woocommerce table.woocommerce-MyAccount-orders tbody th {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 8px 14px !important;
        text-align: right;
        border: none !important;
    }

    .woocommerce table.woocommerce-MyAccount-orders tbody td::before,
    .woocommerce table.woocommerce-MyAccount-orders tbody th::before {
        content: attr(data-title);
        flex: 0 0 auto;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        color: var(--tdc-texto-suave);
        text-align: left;
    }
}

/* =========================================================
   7. Carrinho — layout duas colunas (itens + resumo)
   Estrutura vinda do cart.php do tema parent:
   form > .cart > .table-responsive (tabela)
                + .cart-collaterals.row (cupom + totais)
   ========================================================= */
@media (min-width: 992px) {
    /* atenção: o <table> do carrinho também carrega a classe .cart no
       markup do tema — escopar em div.cart para não virar grid também */
    form.woocommerce-cart-form div.cart {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 370px;
        gap: 28px;
        align-items: start;
    }

    form.woocommerce-cart-form div.cart > .table-responsive {
        grid-column: 1;
    }

    form.woocommerce-cart-form div.cart > .cart-collaterals {
        grid-column: 2;
        position: sticky;
        top: 24px;
        display: flex;
        flex-direction: column;
        gap: 16px;
        margin: 0;
    }

    /* os dois blocos (cupom e totais) empilham na coluna direita */
    form.woocommerce-cart-form div.cart .cart-collaterals > .col-sm-6 {
        width: 100%;
        float: none;
        padding: 0;
    }
}

/* card do resumo */
.woocommerce .cart_totals {
    padding: 22px 22px 24px !important;
    background: #fff;
    border: 1px solid var(--tdc-borda);
    border-radius: var(--tdc-raio-card);
    box-shadow: var(--tdc-sombra-card);
}

.woocommerce .cart_totals h2 {
    margin: 0 0 14px;
    padding: 0 0 12px;
    font-size: 13px !important;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-texto-suave);
    border-bottom: 1px solid var(--tdc-borda);
}

.woocommerce .cart_totals .shop_table {
    margin-bottom: 16px;
    border: none !important;
}

.woocommerce .cart_totals .shop_table th {
    font-size: 14px;
    font-weight: 400;
    color: var(--tdc-texto-suave);
    border: none !important;
    padding: 8px 0 !important;
}

.woocommerce .cart_totals .shop_table td {
    font-size: 15px;
    text-align: right;
    border: none !important;
    padding: 8px 0 !important;
}

.woocommerce .cart_totals .order-total th {
    font-weight: 700;
    color: var(--tdc-texto);
}

.woocommerce .cart_totals .order-total td {
    font-size: 22px !important;
    font-weight: 800;
    color: var(--tdc-vinho);
}

/* CTA principal: Finalizar compra — o tema chama de .btn-proceed-checkout */
.woocommerce .wc-proceed-to-checkout {
    margin: 0;
    padding: 0;
}

.woocommerce a.button.btn-proceed-checkout,
.woocommerce a.checkout-button {
    display: block;
    float: none !important;
    width: 100% !important;
    padding: 15px 20px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #fff !important;
    background: var(--tdc-vinho) !important;
    border: 1px solid var(--tdc-vinho) !important;
    border-radius: var(--tdc-raio-botao) !important;
    text-decoration: none !important;
}

.woocommerce a.button.btn-proceed-checkout:hover,
.woocommerce a.checkout-button:hover {
    color: #fff !important;
    background: var(--tdc-vinho-escuro) !important;
    border-color: var(--tdc-vinho-escuro) !important;
}

.woocommerce a.button.btn-proceed-checkout span {
    font-size: 16px !important;
    font-weight: 700 !important;
}

/* =========================================================
   8. Carrinho — tabela de itens
   ========================================================= */
.woocommerce table.cart-table {
    margin: 0;
    border: 1px solid var(--tdc-borda) !important;
    border-radius: var(--tdc-raio-card);
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    background: #fff;
    box-shadow: var(--tdc-sombra-card);
}

.woocommerce table.cart-table thead tr,
.woocommerce table.cart-table tfoot tr {
    background: var(--tdc-fundo) !important;
}

.woocommerce table.cart-table thead th {
    padding: 12px 14px !important;
    font-size: 11.5px !important;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-texto-suave);
    border: none !important;
    border-bottom: 1px solid var(--tdc-borda) !important;
}

.woocommerce table.cart-table tbody td {
    padding: 18px 14px !important;
    font-size: 14.5px;
    vertical-align: middle;
    border: none !important;
    border-bottom: 1px solid var(--tdc-borda) !important;
}

.woocommerce table.cart-table tbody tr:last-child td {
    border-bottom: none !important;
}

.woocommerce table.cart-table td.product-thumbnail img,
.woocommerce table.cart-table td.image img {
    width: 76px !important;
    height: 76px !important;
    object-fit: cover;
    border-radius: 10px;
    border: 1px solid var(--tdc-borda);
}

.woocommerce table.cart-table td.product-name h2,
.woocommerce table.cart-table td.product-name .product-name {
    margin: 0;
    font-size: 15.5px !important;
    font-weight: 600 !important;
    letter-spacing: 0;
    text-transform: none;
    color: var(--tdc-texto);
}

.woocommerce table.cart-table td.product-name a {
    color: var(--tdc-texto);
    text-decoration: none;
}

.woocommerce table.cart-table td.product-name a:hover {
    color: var(--tdc-vinho);
}

.woocommerce table.cart-table td.product-price .price,
.woocommerce table.cart-table td.product-subtotal .price,
.woocommerce table.cart-table .cart-price .price {
    color: var(--tdc-texto) !important;
    font-size: 15px !important;
    font-weight: 400;
}

.woocommerce table.cart-table td.product-subtotal .price {
    font-weight: 700 !important;
}

/* rodapé de ações da tabela (Continuar / Atualizar / Limpar) */
.woocommerce table.cart-table tfoot td {
    padding: 14px !important;
    text-align: right !important;
    border-top: 1px solid var(--tdc-borda);
}

.woocommerce table.cart-table tfoot .button {
    padding: 10px 16px !important;
    font-size: 13.5px !important;
    margin: 0 0 0 8px !important;
}

/* o skin pinta Continuar/Atualizar de rosa (#e62263) com !important —
   sobrescrevemos: Continuar vira link discreto, Atualizar vira outline */
.woocommerce #shopping-cart-table .button.btn-continue,
.woocommerce .button.btn-continue,
.woocommerce .button.continue {
    float: left !important;
    padding: 10px 14px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: var(--tdc-texto-suave) !important;
    background: transparent !important;
    border: 1px solid transparent !important;
}

.woocommerce #shopping-cart-table .button.btn-continue:hover,
.woocommerce .button.btn-continue:hover,
.woocommerce .button.continue:hover {
    color: var(--tdc-vinho) !important;
    background: var(--tdc-vinho-suave) !important;
    border-color: #eed3d7 !important;
}

.woocommerce .cart .button.btn-update,
.woocommerce .button.btn-update {
    float: right !important;
    margin-left: 8px !important;
    padding: 10px 16px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    font-family: inherit !important;
    letter-spacing: 0 !important;
    color: var(--tdc-vinho) !important;
    background: #fff !important;
    border: 1px solid var(--tdc-vinho) !important;
    border-radius: var(--tdc-raio-botao) !important;
}

.woocommerce .cart .button.btn-update:hover,
.woocommerce .button.btn-update:hover {
    color: #fff !important;
    background: var(--tdc-vinho) !important;
    border-color: var(--tdc-vinho) !important;
}

.woocommerce table.cart-table tfoot #empty_cart_button,
.woocommerce #empty_cart_button.button {
    float: right !important;
    padding: 10px 14px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    font-family: inherit !important;
    letter-spacing: 0 !important;
    color: var(--tdc-erro) !important;
    background: transparent !important;
    border-color: transparent !important;
    border-radius: var(--tdc-raio-botao) !important;
}

.woocommerce #empty_cart_button.button:hover {
    color: var(--tdc-erro) !important;
    background: #fdeceb !important;
    border-color: #fdeceb !important;
}

/* botão de remover item: círculo discreto com × */
.woocommerce table.cart-table a.remove-item {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 34px !important;
    height: 34px !important;
    padding: 0 !important;
    font-size: 18px !important;
    line-height: 1 !important;
    color: var(--tdc-texto-suave) !important;
    background: transparent !important;
    border: 1px solid var(--tdc-borda) !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    text-indent: -9999px;
    overflow: hidden;
    position: relative;
}

.woocommerce table.cart-table a.remove-item::before {
    content: "\00d7";
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-indent: 0;
    font-size: 20px;
    font-weight: 400;
}

.woocommerce table.cart-table a.remove-item:hover {
    color: #fff !important;
    background: var(--tdc-erro) !important;
    border-color: var(--tdc-erro) !important;
}

/* =========================================================
   9. Stepper de quantidade (− qtd +)
   Botões injetados pelo make2_scripts.js; o template do tema
   traz só o input numérico.
   ========================================================= */
.woocommerce .quantity {
    float: none !important;
    display: inline-block;
    margin: 0;
}

.woocommerce .quantity .pull-left,
.woocommerce .quantity .custom {
    float: none !important;
    display: flex;
    align-items: center;
    gap: 6px;
}

.woocommerce .quantity .qty {
    width: 54px !important;
    min-width: 54px;
    padding: 9px 4px !important;
    text-align: center;
    -moz-appearance: textfield;
    appearance: textfield;
}

.woocommerce .quantity .qty::-webkit-outer-spin-button,
.woocommerce .quantity .qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.tdc-qty-btn {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
    color: var(--tdc-vinho);
    background: #fff;
    border: 1px solid #cfcfcf;
    border-radius: var(--tdc-raio-campo);
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.tdc-qty-btn:hover {
    color: #fff;
    background: var(--tdc-vinho);
    border-color: var(--tdc-vinho);
}

/* =========================================================
   10. Cupom inline (carrinho)
   ========================================================= */
.woocommerce .coupon.discount {
    padding: 18px 20px !important;
    background: var(--tdc-fundo);
    border: 1px dashed #d8c2c5;
    border-radius: var(--tdc-raio-card);
}

.woocommerce .coupon.discount h3 {
    margin: 0 0 10px;
    font-size: 13px !important;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-texto-suave);
}

.woocommerce .coupon.discount label {
    display: block;
    margin: 0 0 8px;
    font-size: 13.5px;
    color: var(--tdc-texto-suave);
}

/* cupom empilhado: rótulo, campo e botão cada um na sua linha */
.woocommerce .coupon.discount #discount-coupon-form label {
    display: block;
    margin: 0 0 8px;
}

.woocommerce .coupon.discount #discount-coupon-form .fullwidth {
    display: block;
    width: 100% !important;
    margin: 0 0 10px;
    box-sizing: border-box;
}

.woocommerce .coupon.discount #discount-coupon-form input[name="apply_coupon"] {
    display: block;
    width: 100%;
    margin: 0 !important;
    box-sizing: border-box;
}

/* =========================================================
   11. Carrinho vazio (template cart-empty.php do child)
   ========================================================= */
.tdc-empty-cart {
    max-width: 560px;
    margin: 8px auto 40px;
    padding: 40px 24px 36px;
    text-align: center;
    background: #fff;
    border: 1px solid var(--tdc-borda);
    border-radius: var(--tdc-raio-card);
    box-shadow: var(--tdc-sombra-card);
}

.tdc-empty-cart__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 88px;
    height: 88px;
    margin-bottom: 18px;
    font-size: 38px;
    color: var(--tdc-vinho);
    background: var(--tdc-vinho-suave);
    border-radius: 50%;
}

.tdc-empty-cart__title {
    margin: 0 0 8px;
    font-size: 24px;
    font-weight: 700;
    color: var(--tdc-texto);
}

.tdc-empty-cart__text {
    margin: 0 0 22px;
    font-size: 15px;
    line-height: 1.6;
    color: var(--tdc-texto-suave);
}

.tdc-empty-cart .return-to-shop {
    margin: 0 0 22px;
}

.tdc-empty-cart .return-to-shop > a {
    display: inline-block;
    padding: 14px 28px !important;
    font-size: 15px !important;
}

.tdc-empty-cart__cats {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    padding-top: 18px;
    border-top: 1px solid var(--tdc-borda);
}

.tdc-empty-cart__cats a {
    display: inline-block;
    padding: 8px 16px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--tdc-vinho);
    text-decoration: none;
    background: var(--tdc-fundo);
    border: 1px solid var(--tdc-borda);
    border-radius: 999px;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.tdc-empty-cart__cats a:hover {
    color: var(--tdc-vinho);
    background: var(--tdc-vinho-suave);
    border-color: #d8b6ba;
}

/* =========================================================
   12. Carrinho — mobile
   ========================================================= */
@media (max-width: 991px) {
    .woocommerce .cart_totals,
    .woocommerce .coupon.discount {
        margin-top: 18px;
    }
}

/* tabela empilha (padrão shop_table_responsive do core) com rótulos legíveis */
@media (max-width: 767px) {
    .woocommerce table.cart-table thead {
        display: none;
    }

    .woocommerce table.cart-table tbody tr {
        display: block;
        padding: 8px 0;
        border-bottom: 1px solid var(--tdc-borda);
    }

    .woocommerce table.cart-table tbody tr:last-child {
        border-bottom: none;
    }

    .woocommerce table.cart-table tbody td {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 8px 14px !important;
        text-align: right;
        border: none !important;
    }

    .woocommerce table.cart-table tbody td::before {
        content: attr(data-title);
        flex: 0 0 auto;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        color: var(--tdc-texto-suave);
        text-align: left;
    }

    .woocommerce table.cart-table tbody td.image,
    .woocommerce table.cart-table tbody td.product-thumbnail {
        display: flex !important; /* o core do Woo esconde a miniatura no mobile (#content table.cart .product-thumbnail) */
        justify-content: center;
        padding-bottom: 4px !important;
    }

    .woocommerce table.cart-table tbody td.image::before,
    .woocommerce table.cart-table tbody td.product-thumbnail::before {
        content: none;
    }

    .woocommerce table.cart-table tbody td.product-name {
        justify-content: center;
        text-align: center;
    }

    .woocommerce table.cart-table tbody td.product-name::before {
        content: none;
    }

    .woocommerce table.cart-table tbody td.product-remove {
        justify-content: flex-end;
        padding-top: 0 !important;
    }

    .woocommerce table.cart-table tbody td.product-remove::before {
        content: none;
    }

    .woocommerce table.cart-table tfoot td {
        text-align: center !important;
    }

    /* botões empilhados e largura total: sem floats o "Continuar comprando"
       flutuava solto no canto com aparência de link morto */
    .woocommerce table.cart-table tfoot .button,
    .woocommerce #shopping-cart-table .button.btn-continue,
    .woocommerce .button.btn-continue,
    .woocommerce .cart .button.btn-update,
    .woocommerce #empty_cart_button.button {
        display: block;
        float: none !important;
        width: 100%;
        margin: 6px 0 !important;
        text-align: center;
    }
}

/* =========================================================
   13. Painel "Informação adicional" do checkout
   Troca o azul #99c3ed por um tom da marca (coerência de fundação)
   ========================================================= */
.woocommerce-additional-fields {
    margin-top: 24px;
    padding: 22px;
    background: var(--tdc-vinho-suave);
    border: 1px solid #eed3d7;
    border-radius: var(--tdc-raio-card);
    color: var(--tdc-texto) !important;
}

.woocommerce-additional-fields h3 {
    margin: 0 0 6px;
    font-size: 13px !important;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-vinho);
}

.woocommerce-additional-fields ~ .form-row label,
.woocommerce-additional-fields label {
    color: var(--tdc-texto);
}

/* =========================================================
   15. Checkout — layout duas colunas (formulário + resumo fixo)
   O aside .tdc-resumo-pedido vem do override do child
   woocommerce/checkout/form-checkout.php.
   ========================================================= */
@media (min-width: 992px) {
    body.woocommerce-checkout form.checkout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 400px;
        gap: 32px;
        align-items: start;
    }

    body.woocommerce-checkout form.checkout > #customer_details {
        grid-column: 1;
        min-width: 0;
    }

    body.woocommerce-checkout form.checkout > .tdc-resumo-pedido {
        grid-column: 2;
        position: sticky;
        top: 24px;
        min-width: 0;
    }
}

/* cobrança e entrega/cartão empilham na coluna esquerda
   (o skin flutua .col-1/.col-2 com 48% + borda dupla) */
body.woocommerce-checkout #customer_details {
    display: block;
    overflow: visible;
}

body.woocommerce-checkout #customer_details .col-1,
body.woocommerce-checkout #customer_details .col-2 {
    float: none !important;
    width: 100% !important;
    padding: 0;
    margin: 0 0 28px;
    border: none !important;
}

/* títulos de seção do checkout */
body.woocommerce-checkout .woocommerce-billing-fields h3,
body.woocommerce-checkout #order_review_heading,
body.woocommerce-checkout .woocommerce-shipping-fields h3,
body.woocommerce-checkout .woocommerce-additional-fields h3 {
    margin: 0 0 16px;
    padding: 0 0 10px;
    font-size: 13px !important;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-texto-suave);
    border-bottom: 1px solid var(--tdc-borda);
}

body.woocommerce-checkout #order_review_heading {
    color: var(--tdc-vinho);
}

/* =========================================================
   16. Checkout — campos de cobrança em duas colunas
   Emparelhamentos (por ordem do DOM, respeitando os campos
   ocultos de PJ que o plugin brasileiro alterna):
   nome|sobrenome, pessoa|cpf, [empresa|cnpj],
   número|complemento, bairro|cidade, estado|telefone.
   ========================================================= */
@media (min-width: 768px) {
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 16px;
    }

    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row {
        float: none !important;
        width: 100% !important;
        margin-right: 0 !important;
    }

    /* meia largura (form-row-first/last do core já entram aqui) */
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-first,
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-last,
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_persontype_field,
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_cpf_field,
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_company_field,
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_cnpj_field,
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_address_2_field,
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_city_field,
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_state_field,
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_phone_field {
        grid-column: auto / span 1;
    }

    /* largura total */
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-wide,
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_country_field,
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_postcode_field,
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_address_1_field,
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_email_field {
        grid-column: 1 / -1;
    }
}

/* campo de senha da conta (convidado) em destaque neutro */
body.woocommerce-checkout .woocommerce-account-fields {
    margin: 0 0 20px;
    padding: 14px 16px;
    background: var(--tdc-fundo);
    border: 1px solid var(--tdc-borda);
    border-radius: var(--tdc-raio-campo);
}

/* no mobile o skin flutua form-row-first/last a 48% (campos de ~131px) —
   empilhar tudo em largura total */
@media (max-width: 767px) {
    body.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row,
    body.woocommerce-checkout .woocommerce-account-fields .form-row {
        float: none !important;
        width: 100% !important;
        margin-right: 0 !important;
    }
}

/* =========================================================
   17. Checkout — painel entrega/cartão + observações
   ========================================================= */
body.woocommerce-checkout .woocommerce-additional-fields {
    margin-top: 0;
}

body.woocommerce-checkout .woocommerce-additional-fields .form-row {
    margin-bottom: 14px;
}

body.woocommerce-checkout .woocommerce-additional-fields textarea {
    min-height: 80px;
}

/* contador da frase do cartão (make2_scripts.js) */
.tdc-contador-frase {
    margin-top: 4px;
    font-size: 12px;
    color: var(--tdc-texto-suave);
    text-align: right;
}

.tdc-contador-frase.tdc-contador-longo {
    color: var(--tdc-dourado);
    font-weight: 600;
}

/* =========================================================
   17.5 Checkout — observações separadas + endereços salvos
   Observações saem do painel "Entrega e mensagem do cartão"
   (override form-shipping.php) e ganham bloco neutro próprio;
   o seletor de endereços salvos vem do hook no functions.php.
   ========================================================= */
body.woocommerce-checkout .tdc-checkout-observacoes {
    padding: 20px;
    background: #fff;
    border: 1px solid var(--tdc-borda);
    border-radius: var(--tdc-raio-card);
    box-shadow: var(--tdc-sombra-card);
}

body.woocommerce-checkout .tdc-checkout-observacoes h3 {
    margin: 0 0 12px;
    font-size: 13px !important;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-texto-suave);
}

body.woocommerce-checkout .tdc-checkout-observacoes textarea {
    min-height: 88px;
}

/* seletor de endereços salvos (acima do formulário de cobrança) */
body.woocommerce-checkout .tdc-seletor-endereco {
    margin: 0 0 18px;
    padding: 14px 16px;
    background: var(--tdc-fundo);
    border: 1px solid var(--tdc-borda);
    border-radius: var(--tdc-raio-campo);
}

body.woocommerce-checkout .tdc-seletor-endereco label {
    display: block;
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--tdc-texto-suave);
}

body.woocommerce-checkout .tdc-seletor-endereco select {
    width: 100%;
}

body.woocommerce-checkout .tdc-seletor-endereco .tdc-seletor-endereco__gerenciar {
    display: inline-block;
    margin-top: 8px;
    font-size: 13px;
    color: var(--tdc-vinho);
    text-decoration: underline;
}

/* estado "buscando CEP" no campo */
body.woocommerce-checkout #billing_postcode.tdc-buscando-cep {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='6' fill='none' stroke='%23800110' stroke-width='2' stroke-dasharray='24' %3E%3CanimateTransform attributeName='transform' type='rotate' from='0 8 8' to='360 8 8' dur='0.8s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
}

/* =========================================================
   18. Checkout — resumo do pedido (card da direita)
   ========================================================= */
body.woocommerce-checkout .tdc-resumo-pedido #order_review {
    padding: 22px 22px 24px;
    background: #fff;
    border: 1px solid var(--tdc-borda);
    border-radius: var(--tdc-raio-card);
    box-shadow: var(--tdc-sombra-card);
}

body.woocommerce-checkout table.woocommerce-checkout-review-order-table {
    margin: 0 0 16px;
    border: none !important;
    border-bottom: 1px solid var(--tdc-borda) !important;
}

body.woocommerce-checkout table.woocommerce-checkout-review-order-table th,
body.woocommerce-checkout table.woocommerce-checkout-review-order-table td {
    padding: 10px 0 !important;
    font-size: 14px;
    border: none !important;
    vertical-align: top;
}

body.woocommerce-checkout table.woocommerce-checkout-review-order-table thead th {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-texto-suave);
    border-bottom: 1px solid var(--tdc-borda) !important;
}

body.woocommerce-checkout table.woocommerce-checkout-review-order-table .cart_item td {
    padding-top: 14px !important;
}

body.woocommerce-checkout table.woocommerce-checkout-review-order-table .order-total th {
    font-weight: 700;
    color: var(--tdc-texto);
}

body.woocommerce-checkout table.woocommerce-checkout-review-order-table .order-total td {
    font-size: 22px !important;
    font-weight: 800;
    color: var(--tdc-vinho);
}

/* botão finalizar pedido */
body.woocommerce-checkout #payment #place_order {
    display: block;
    width: 100%;
    margin-top: 14px;
    padding: 15px 20px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #fff !important;
    background: var(--tdc-vinho) !important;
    border-color: var(--tdc-vinho) !important;
    border-radius: var(--tdc-raio-botao) !important;
    float: none !important;
}

body.woocommerce-checkout #payment #place_order:hover {
    background: var(--tdc-vinho-escuro) !important;
    border-color: var(--tdc-vinho-escuro) !important;
}

/* selos de confiança abaixo do botão (hook do functions.php) */
.tdc-selos-checkout {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 18px;
    margin-top: 14px;
    font-size: 12.5px;
    color: var(--tdc-texto-suave);
}

.tdc-selos-checkout .fa {
    margin-right: 5px;
    color: var(--tdc-verde);
}

.tdc-selos-checkout a {
    color: var(--tdc-texto-suave);
    text-decoration: none;
}

.tdc-selos-checkout a:hover {
    color: var(--tdc-vinho);
}

.tdc-selos-checkout a .fa {
    color: #4dc247;
}

/* =========================================================
   19. Checkout — métodos de pagamento em cards
   Estado selecionado via classe .tdc-ativo (make2_scripts.js).
   ========================================================= */
body.woocommerce-checkout ul.payment_methods {
    margin: 0 0 4px;
    padding: 0;
    list-style: none !important;
}

body.woocommerce-checkout ul.payment_methods > li {
    margin: 0 0 10px;
    padding: 0;
    background: #fff;
    border: 1.5px solid var(--tdc-borda);
    border-radius: var(--tdc-raio-campo);
    transition: border-color 0.15s ease, background-color 0.15s ease;
    overflow: hidden;
}

body.woocommerce-checkout ul.payment_methods > li.tdc-ativo {
    border-color: var(--tdc-vinho);
    background: var(--tdc-vinho-suave);
}

body.woocommerce-checkout ul.payment_methods > li > label {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 !important;
    padding: 13px 16px;
    font-size: 14.5px !important;
    font-weight: 600;
    color: var(--tdc-texto);
    cursor: pointer;
}

body.woocommerce-checkout ul.payment_methods > li > label img {
    margin-left: auto;
    max-height: 24px;
}

body.woocommerce-checkout ul.payment_methods input[type="radio"] {
    margin: 0;
    accent-color: var(--tdc-vinho);
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
}

body.woocommerce-checkout ul.payment_methods .payment_box {
    margin: 0;
    padding: 12px 16px 14px 43px;
    font-size: 13px;
    line-height: 1.55;
    color: var(--tdc-texto-suave);
    background: var(--tdc-fundo);
    border-top: 1px solid var(--tdc-borda);
}

/* =========================================================
   20. Datepicker da data de entrega (jQuery UI)
   Substitui o visual padrão do jquery-ui.min.css do Woo.
   ========================================================= */
#ui-datepicker-div {
    padding: 14px !important;
    background: #fff;
    border: 1px solid var(--tdc-borda) !important;
    border-radius: var(--tdc-raio-card);
    box-shadow: var(--tdc-sombra-card);
    font-family: inherit;
}

#ui-datepicker-div .ui-datepicker-header {
    padding: 0 0 10px;
    border: none;
    background: transparent;
}

#ui-datepicker-div .ui-datepicker-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--tdc-texto);
}

#ui-datepicker-div .ui-datepicker-prev,
#ui-datepicker-div .ui-datepicker-next {
    border: none;
    background: transparent;
    color: var(--tdc-vinho);
    cursor: pointer;
}

#ui-datepicker-div .ui-datepicker-prev:hover,
#ui-datepicker-div .ui-datepicker-next:hover {
    color: var(--tdc-vinho-escuro);
}

#ui-datepicker-div table {
    font-size: 13px;
}

#ui-datepicker-div th {
    padding: 4px 2px;
    font-size: 11px;
    font-weight: 700;
    color: var(--tdc-texto-suave);
    border: none;
    background: transparent;
}

#ui-datepicker-div td {
    padding: 2px;
    border: none;
    background: transparent;
}

#ui-datepicker-div td a,
#ui-datepicker-div td span {
    display: block;
    padding: 6px 0;
    text-align: center;
    color: var(--tdc-texto);
    background: transparent;
    border: none;
    border-radius: 8px;
}

#ui-datepicker-div td a:hover {
    color: var(--tdc-vinho);
    background: var(--tdc-vinho-suave);
}

#ui-datepicker-div td a.ui-state-highlight {
    background: #fdf1dc;
    color: #8a5a00;
}

#ui-datepicker-div td a.ui-state-active {
    color: #fff;
    background: var(--tdc-vinho);
}

/* select2 (horário da entrega) na altura dos campos novos */
body.woocommerce-checkout .select2-container .select2-selection--single {
    height: 44px;
    border: 1px solid #cfcfcf !important;
    border-radius: var(--tdc-raio-campo) !important;
}

body.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__rendered {
    padding: 10px 14px !important;
    font-size: 15px;
    color: var(--tdc-texto);
    line-height: 1.4 !important;
}

body.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__arrow {
    height: 42px;
}

/* =========================================================
   21. Movimento respeitado
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
    .woocommerce a.button,
    .woocommerce button.button,
    .woocommerce input.button,
    .tdc-qty-btn,
    .woocommerce-MyAccount-navigation ul li a,
    body.woocommerce-checkout ul.payment_methods > li {
        transition: none !important;
    }
}

/* =========================================================
   22. Minha conta — navegação em abas horizontais (fase 3)
   O skin flutua a nav à direita com 24% — vira barra de abas
   no topo. Ícones vêm do override navigation.php do child.
   ========================================================= */
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-navigation.sticky-header {
    float: none !important;
    width: 100% !important;
    position: inherit;
    margin: 8px 0 0;
    background: inherit;
    box-shadow: none;
    border: none;
}

.woocommerce-account .woocommerce-MyAccount-content {
    float: none !important;
    width: 100% !important;
    margin-top: 26px;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
    border-bottom: 1px solid var(--tdc-borda);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    padding: 0;
    border: none !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 13px 18px;
    margin-bottom: -1px;
    font-size: 14.5px;
    font-weight: 600;
    color: var(--tdc-texto-suave);
    text-decoration: none;
    border: none;
    border-bottom: 2.5px solid transparent;
    border-radius: 10px 10px 0 0;
    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a .fa {
    font-size: 14px;
    color: inherit;
    opacity: 0.8;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
    color: var(--tdc-vinho);
    background: var(--tdc-fundo);
}

/* aba ativa (sobrepõe o item ativo da seção 6, que era vertical) */
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    color: var(--tdc-vinho) !important;
    background: transparent;
    border-left: none;
    border-bottom: 2.5px solid var(--tdc-vinho);
}

/* Sair empurrado para a direita */
.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout {
    margin-left: auto;
}

@media (max-width: 767px) {
    .woocommerce-account .woocommerce-MyAccount-navigation ul {
        flex-wrap: nowrap;
        overflow-x: auto;
        gap: 2px;
        padding-bottom: 2px;
        -webkit-overflow-scrolling: touch;
    }

    .woocommerce-account .woocommerce-MyAccount-navigation ul li a {
        padding: 11px 14px;
        font-size: 13.5px;
        white-space: nowrap;
        border-radius: var(--tdc-raio-campo) var(--tdc-raio-campo) 0 0;
    }

    .woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout {
        margin-left: 0;
    }
}

/* =========================================================
   23. Minha conta — painel com cards (fase 3, dashboard.php)
   ========================================================= */
.tdc-conta-cabecalho {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 6px 16px;
    margin: 0 0 22px;
}

.tdc-conta-saudacao {
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    color: var(--tdc-texto);
}

.tdc-conta-saudacao strong {
    color: var(--tdc-vinho);
}

.tdc-conta-sair {
    margin: 0;
    font-size: 13.5px;
    color: var(--tdc-texto-suave);
}

.tdc-conta-sair a {
    color: var(--tdc-vinho);
    text-decoration: underline;
}

.tdc-conta-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px;
    margin: 0 0 30px;
}

.tdc-card-conta {
    padding: 20px;
    background: #fff;
    border: 1px solid var(--tdc-borda);
    border-radius: var(--tdc-raio-card);
    box-shadow: var(--tdc-sombra-card);
}

.tdc-card-conta h3 {
    margin: 0 0 12px;
    font-size: 13px !important;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-texto-suave);
}

.tdc-card-pedido__num {
    margin: 0 0 6px;
}

.tdc-card-pedido__num a {
    font-size: 18px;
    font-weight: 800;
    color: var(--tdc-vinho);
    text-decoration: none;
}

.tdc-card-pedido__num .order-status {
    margin-left: 8px;
    vertical-align: 2px;
}

.tdc-card-pedido__info,
.tdc-card-endereco__info,
.tdc-card-ajuda__info {
    margin: 0 0 4px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--tdc-texto-suave);
}

.tdc-card-endereco__info .fa,
.tdc-card-ajuda__info .fa {
    margin-right: 7px;
    color: var(--tdc-dourado);
}

.tdc-card-ajuda__info .fa {
    color: #4dc247;
}

.tdc-card-conta__acao {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
    font-size: 14px;
    font-weight: 600;
    color: var(--tdc-vinho);
    text-decoration: none;
}

.tdc-card-conta__acao:hover {
    text-decoration: underline;
}

/* =========================================================
   24. Minha conta — página do pedido (fase 3, view-order.php)
   ========================================================= */
.tdc-pedido-cabecalho {
    margin: 0 0 20px;
    padding: 0 0 14px;
    border-bottom: 1px solid var(--tdc-borda);
}

.tdc-pedido-cabecalho__titulo {
    margin: 0 0 6px;
    font-size: 22px;
    font-weight: 800;
    color: var(--tdc-texto);
}

.tdc-pedido-cabecalho__titulo .order-status {
    margin-left: 10px;
    vertical-align: 3px;
}

.tdc-pedido-cabecalho__info {
    margin: 0;
    font-size: 14px;
    color: var(--tdc-texto-suave);
}

.tdc-pedido-cancelado {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 24px;
    padding: 14px 18px;
    font-size: 15px;
    font-weight: 600;
    color: var(--tdc-erro);
    background: #fdeceb;
    border: 1px solid #f2c4c0;
    border-radius: var(--tdc-raio-campo);
}

/* linha do tempo do status */
.tdc-linha-status {
    display: flex;
    margin: 0 0 28px;
    padding: 0;
    list-style: none;
}

.tdc-linha-status .tdc-etapa {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

/* trilho entre as etapas */
.tdc-linha-status .tdc-etapa:not(:first-child)::before {
    content: "";
    position: absolute;
    top: 8px;
    right: calc(50% + 14px);
    left: calc(-50% + 14px);
    height: 2px;
    background: var(--tdc-borda);
}

.tdc-linha-status .tdc-etapa--concluida:not(:first-child)::before {
    background: var(--tdc-verde);
}

.tdc-etapa__ponto {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid var(--tdc-borda);
}

.tdc-etapa--concluida .tdc-etapa__ponto {
    background: var(--tdc-verde);
    border-color: var(--tdc-verde);
}

.tdc-etapa--atual .tdc-etapa__ponto {
    background: #fff;
    border: 2.5px solid var(--tdc-vinho);
    box-shadow: 0 0 0 4px rgba(128, 1, 16, 0.12);
}

.tdc-etapa__rotulo {
    font-size: 12.5px;
    font-weight: 600;
    text-align: center;
    color: var(--tdc-texto-suave);
}

.tdc-etapa--concluida .tdc-etapa__rotulo {
    color: var(--tdc-texto);
}

.tdc-etapa--atual .tdc-etapa__rotulo {
    color: var(--tdc-vinho);
}

@media (max-width: 600px) {
    .tdc-linha-status {
        flex-direction: column;
        gap: 14px;
    }

    .tdc-linha-status .tdc-etapa {
        flex-direction: row;
        align-items: center;
        gap: 12px;
    }

    .tdc-linha-status .tdc-etapa:not(:first-child)::before {
        top: -16px;
        right: auto;
        left: 8px;
        width: 2px;
        height: 16px;
    }

    .tdc-etapa__rotulo {
        text-align: left;
    }
}

/* box de entrega agendada */
.tdc-box-entrega {
    margin: 0 0 28px;
    padding: 18px 20px;
    background: var(--tdc-vinho-suave);
    border: 1px solid #eed3d7;
    border-radius: var(--tdc-raio-card);
}

.tdc-box-entrega h3 {
    margin: 0 0 10px;
    font-size: 13px !important;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-vinho);
}

.tdc-box-entrega h3 .fa {
    margin-right: 6px;
}

.tdc-box-entrega__quando {
    margin: 0 0 8px;
    font-size: 15px;
    color: var(--tdc-texto);
}

.tdc-box-entrega__quando strong {
    font-size: 17px;
    font-weight: 800;
}

.tdc-box-entrega__frase {
    margin: 0 0 8px;
    font-size: 14.5px;
    font-style: italic;
    line-height: 1.6;
    color: var(--tdc-texto);
}

.tdc-box-entrega__assinatura {
    margin: 0;
    font-size: 13px;
    color: var(--tdc-texto-suave);
}

/* detalhes/endereços do pedido (saída do hook woocommerce_view_order) */
.woocommerce-account .woocommerce-order-details h2,
.woocommerce-account .woocommerce-customer-details h2 {
    margin: 0 0 14px;
    padding: 0 0 10px;
    font-size: 13px !important;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-texto-suave);
    border-bottom: 1px solid var(--tdc-borda);
}

.woocommerce-account .woocommerce-order-details {
    margin: 0 0 28px;
}

.woocommerce-account table.order_details {
    margin: 0;
    border: 1px solid var(--tdc-borda) !important;
    border-radius: var(--tdc-raio-card);
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    background: #fff;
    box-shadow: var(--tdc-sombra-card);
}

.woocommerce-account table.order_details th,
.woocommerce-account table.order_details td {
    padding: 12px 14px !important;
    font-size: 14px;
    border: none !important;
    border-bottom: 1px solid var(--tdc-borda) !important;
}

.woocommerce-account table.order_details thead th {
    background: var(--tdc-fundo);
    font-size: 11.5px !important;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-texto-suave);
}

.woocommerce-account table.order_details tfoot th,
.woocommerce-account table.order_details tfoot td {
    background: var(--tdc-fundo);
}

.woocommerce-account table.order_details tr:last-child th,
.woocommerce-account table.order_details tr:last-child td {
    border-bottom: none !important;
}

.woocommerce-account .woocommerce-customer-details address {
    font-style: normal;
    line-height: 1.75;
    color: var(--tdc-texto);
}

/* upload de comprovante (plugin checkout-files-upload) na página do pedido:
   o plugin imprime um wrapper <div> sem classe com uma <table> sem classe
   como filho direto do conteúdo da conta */
.woocommerce-account .woocommerce-MyAccount-content > div > table {
    margin: 20px 0 0;
    padding: 16px 18px;
    background: var(--tdc-fundo);
    border: 1px dashed #d8c2c5;
    border-radius: var(--tdc-raio-card);
}

.woocommerce-account .woocommerce-MyAccount-content > div > table td {
    border: none !important;
    font-size: 14px;
    color: var(--tdc-texto-suave);
}

.woocommerce-account input[type="file"]::file-selector-button {
    margin-right: 12px;
    padding: 10px 16px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--tdc-vinho);
    background: #fff;
    border: 1px solid var(--tdc-vinho);
    border-radius: var(--tdc-raio-botao);
    cursor: pointer;
}

/* =========================================================
   25. Minha conta — detalhes da conta em seções (fase 3)
   ========================================================= */
.woocommerce-account .edit-account fieldset {
    margin: 0 0 26px;
    padding: 0;
    border: none;
}

.woocommerce-account .edit-account legend {
    width: 100%;
    margin-bottom: 16px;
    padding: 0 0 10px;
    font-size: 13px !important;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-texto-suave);
    border-bottom: 1px solid var(--tdc-borda);
}

/* salvar alterações é a ação principal da página */
.woocommerce-account .edit-account button[name="save_account_details"] {
    color: #fff !important;
    background: var(--tdc-vinho) !important;
    border-color: var(--tdc-vinho) !important;
}

.woocommerce-account .edit-account button[name="save_account_details"]:hover {
    background: var(--tdc-vinho-escuro) !important;
    border-color: var(--tdc-vinho-escuro) !important;
}

/* =========================================================
   26. Minha conta — endereços em cards (fase 3)
   ========================================================= */
.woocommerce-account .woocommerce-Addresses {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 16px;
}

/* o container de endereços carrega col2-set e o skin flutua .col-1/.col-2
   a 48% com borda dupla — neutralizar para o grid valer */
.woocommerce-account .woocommerce-Addresses .col-1,
.woocommerce-account .woocommerce-Addresses .col-2,
.woocommerce-account .woocommerce-Addresses .woocommerce-Address {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 20px;
    border: 1px solid var(--tdc-borda) !important;
    border-radius: var(--tdc-raio-card);
    box-sizing: border-box;
}

/* posição explícita: cobrança à esquerda, entrega à direita (a colocação
   automática herdada do col2-set do skin invervia as colunas) */
@media (min-width: 641px) {
    .woocommerce-account .woocommerce-Addresses .u-column1 {
        grid-column: 1;
    }

    .woocommerce-account .woocommerce-Addresses .u-column2 {
        grid-column: 2;
    }
}

@media (max-width: 640px) {
    .woocommerce-account .woocommerce-Addresses {
        grid-template-columns: 1fr;
    }

    .woocommerce-account .woocommerce-Addresses .u-column1,
    .woocommerce-account .woocommerce-Addresses .u-column2 {
        grid-column: 1;
    }
}

.woocommerce-account .woocommerce-Address {
    padding: 20px;
    background: #fff;
    border: 1px solid var(--tdc-borda);
    border-radius: var(--tdc-raio-card);
    box-shadow: var(--tdc-sombra-card);
}

.woocommerce-account .woocommerce-Address header h2,
.woocommerce-account .woocommerce-Address h2 {
    margin: 0 0 12px;
    font-size: 13px !important;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-texto-suave);
}

.woocommerce-account .woocommerce-Address address {
    font-style: normal;
    line-height: 1.75;
    color: var(--tdc-texto);
    margin: 0 0 12px;
}

.woocommerce-account .woocommerce-Address a.edit,
.woocommerce-account .woocommerce-Address .edit {
    display: inline-block;
    padding: 10px 16px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--tdc-vinho) !important;
    background: #fff;
    border: 1px solid var(--tdc-vinho);
    border-radius: var(--tdc-raio-botao);
    text-decoration: none;
}

.woocommerce-account .woocommerce-Address a.edit:hover,
.woocommerce-account .woocommerce-Address .edit:hover {
    color: #fff !important;
    background: var(--tdc-vinho);
}

/* =========================================================
   27. Minha conta — entrar/cadastrar em cards (fase 3)
   ========================================================= */
.woocommerce-account .u-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 8px;
}

.woocommerce-account .u-column1,
.woocommerce-account .u-column2 {
    padding: 26px 26px 30px;
    background: #fff;
    border: 1px solid var(--tdc-borda);
    border-radius: var(--tdc-raio-card);
    box-shadow: var(--tdc-sombra-card);
}

.woocommerce-account .u-column2 {
    background: var(--tdc-fundo);
}

.woocommerce-account .u-columns h2 {
    margin: 0 0 16px;
    font-size: 13px !important;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tdc-texto-suave);
    border-bottom: 1px solid var(--tdc-borda);
    padding-bottom: 10px;
}

/* cada card tem sua própria ação principal */
.woocommerce-account .u-columns .woocommerce-form-login__submit,
.woocommerce-account .u-columns .woocommerce-form-register__submit {
    color: #fff !important;
    background: var(--tdc-vinho) !important;
    border-color: var(--tdc-vinho) !important;
}

.woocommerce-account .u-columns .woocommerce-form-login__submit:hover,
.woocommerce-account .u-columns .woocommerce-form-register__submit:hover {
    background: var(--tdc-vinho-escuro) !important;
    border-color: var(--tdc-vinho-escuro) !important;
}

/* posição explícita (mesma proteção do col2-set dos endereços):
   "Entrar" à esquerda, "Cadastre-se" à direita */
@media (min-width: 768px) {
    .woocommerce-account .u-columns .u-column1 {
        grid-column: 1;
    }

    .woocommerce-account .u-columns .u-column2 {
        grid-column: 2;
    }
}

@media (max-width: 767px) {
    .woocommerce-account .u-columns {
        grid-template-columns: 1fr;
    }

    .woocommerce-account .u-columns .u-column1,
    .woocommerce-account .u-columns .u-column2 {
        grid-column: 1;
    }
}

/* movimento respeitado (itens novos da fase 3) */
@media (prefers-reduced-motion: reduce) {
    .woocommerce-account .woocommerce-MyAccount-navigation ul li a,
    .woocommerce-account .woocommerce-Address a.edit {
        transition: none !important;
    }
}

/* =========================================================
   28. Polimento (fase 4)
   Unificar botões de produto/grade (o child pinta de azul
   #99c3ed e o skin de rosa #e62263 no hover), compactar o
   logo do rodapé e arredondar a busca do cabeçalho.
   ========================================================= */

/* botão "Adicionar à cesta" da página de produto (vinho, sem
   box-shadow interno que o child usa para simular gradiente) */
.woocommerce .product-view .product-shop .cart .single_add_to_cart_button,
.woocommerce div.product form.cart .single_add_to_cart_button {
    color: #fff !important;
    background: var(--tdc-vinho) !important;
    border: 1px solid var(--tdc-vinho) !important;
    box-shadow: none !important;
}

.woocommerce .product-view .product-shop .cart .single_add_to_cart_button:hover,
.woocommerce div.product form.cart .single_add_to_cart_button:hover {
    background: var(--tdc-vinho-escuro) !important;
    border-color: var(--tdc-vinho-escuro) !important;
}

/* hover dos botões da grade de produtos (child/skin pintam azul/rosa) */
.woocommerce .products-grid .item a.button.btn-cart:hover,
.woocommerce .products-grid .item:hover a.button.btn-cart,
.woocommerce .products-list .actions .add_cart a.button.add_to_cart_button:hover {
    color: #fff !important;
    background: var(--tdc-vinho) !important;
    border: 1px solid var(--tdc-vinho) !important;
}

/* toolbar (grade/lista), filtro de preço e abas da página de produto */
.woocommerce .toolbar a.button-active,
.woocommerce .toolbar a.button-active.button-grid,
.woocommerce .toolbar a.button-active.button-list {
    background-color: var(--tdc-vinho) !important;
    border: 1px solid var(--tdc-vinho) !important;
}

.woocommerce .widget_price_filter .ui-slider .ui-slider-handle {
    background-color: var(--tdc-vinho) !important;
}

.woocommerce .nav-tabs > li.active > a,
.woocommerce .nav-tabs > li.active > a:hover,
.woocommerce .nav-tabs > li.active > a:focus {
    color: var(--tdc-vinho) !important;
    border-bottom: 2px solid var(--tdc-vinho) !important;
}

.woocommerce .product-view .product-shop a:hover {
    color: var(--tdc-vinho) !important;
}

/* rodapé: logo 220px → 120px e textos de contato maiores */
.footer-middle img {
    width: 120px !important;
    height: auto !important;
}

.footer-middle .container .row > div {
    padding-top: 6px;
    padding-bottom: 6px;
}

.footer-middle,
.footer-middle p,
.footer-middle span,
.footer-middle div {
    font-size: 13.5px !important;
    color: #c9c9c9;
}

.footer-middle a,
.footer-bottom a {
    color: #c9c9c9 !important;
}

.footer-middle a:hover,
.footer-bottom a:hover {
    color: #f2b8c6 !important;
}

/* busca do cabeçalho: cantos acompanhando os campos novos */
.widget_search .search-field,
.header-container .search-box input[type="text"] {
    border-radius: 8px 0 0 8px !important;
}

.search-btn-bg {
    border-radius: 0 8px 8px 0 !important;
}

/* =========================================================
   29. Produtos relacionados — cards do mesmo tamanho
   As fotos têm proporções mistas (quadradas e retrato 3:4) e o
   tema fixa só a largura, então a altura do card variava
   (349/415/451px). Padroniza a caixa da imagem com object-fit
   (contain preserva a foto inteira do produto) e reserva
   espaço fixo para o título em 2 linhas.
   ========================================================= */
.related-pro .item-img .product-image img {
    width: 100%;
    height: 210px;
    object-fit: contain;
    background: #fff;
}

/* nomes de 1 linha não podem encurtar o card em relação aos de 2 */
.related-pro .item-title {
    min-height: 34px;
}