
/*
Theme Name:     Retrato Pet
Theme URI:
Description:    Hello-elementor child theme.
Author:         Romario
Template:       hello-elementor
Version:        1.0.0
*/

/* ==========================================================================
   1. VARIÁVEIS E BASE
   ========================================================================== */
:root {
    --color-primary: #F96A00;
    --color-primary-hover: #D95A00;
    --color-bg: #FAFAFA;
    --color-text: #333333;
    --color-text-light: #555555;
    --font-main: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-heading: "DM Serif Display", serif;
}

body {
    background-color: var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-main);
    line-height: 1.6;
    margin: 0;
    padding: 0;
}
.site {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.site-main {
    flex: 1; /* Estica o meio da página para empurrar o footer */
}

h1, h2, h3, h4, h5, h6 {
    color: var(--color-text);
    font-family: var(--font-heading);
    font-weight: 700;
    margin-top: 0;
    line-height: 1.2;
}

a {
    color: var(--color-primary);
    text-decoration: none;
    transition: color 0.3s ease, transform 0.2s ease;
}

a:hover {
    color: var(--color-primary-hover);
}

img {
    max-width: 100%;
    height: auto;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.gradient-heading {
    background: linear-gradient(45deg, #F96A00, #FF9B44);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
    font-weight: 800;
    display: inline-block;
}

/* ==========================================================================
   2. BOTÕES GLOBAIS
   ========================================================================== */
.button, button, input[type="button"], input[type="reset"], input[type="submit"],
.wp-block-button__link,
.woocommerce button.button.alt,
.woocommerce a.button.alt,
.woocommerce a.button,
.woocommerce button.button {
    background-color: var(--color-primary);
    color: #ffffff;
    border: none;
    border-radius: 8px;
    padding: 15px 30px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.2s ease;
    display: inline-block;
    text-align: center;
}

.button:hover, button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover,
.wp-block-button__link:hover,
.woocommerce button.button.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
    background-color: var(--color-primary-hover);
    color: #ffffff;
    transform: translateY(-2px);
}

/* ==========================================================================
   3. HEADER (CABEÇALHO) E EFEITOS
   ========================================================================== */
.site-header {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    height: 90px;
    background-color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    border-top: none;
    border-bottom: 2px solid var(--color-primary);
    position: sticky !important;
    top: 0 !important;
    z-index: 99999 !important;
    box-sizing: border-box;
}

.header-container {
    max-width: 1200px;
    width: 100% !important;
    height: 100%;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
}

.site-branding {
    display: flex;
    align-items: flex-end;
    height: 100%;
}

.brand-link {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    height: 100%;
    text-decoration: none;
    transition: opacity 0.2s ease;
}
.brand-link:hover { opacity: 0.9; }

.brand-icon {
    height: 80px;
    max-height: 80px;
    width: auto;
    display: block;
    margin-bottom: -16px;
    vertical-align: bottom;
}

.brand-text {
    font-family: var(--font-heading);
    font-style: italic;
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--color-primary);
    white-space: nowrap;
    line-height: 1;
    margin-bottom: 10px;
    display: inline-block;
}

.main-navigation {
    display: flex;
    align-items: center;
    gap: 24px;
}

.nav-link {
    color: var(--color-text);
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none;
    position: relative;
    transition: color 0.25s ease, transform 0.2s ease;
}
.nav-link:hover {
    color: var(--color-primary);
    transform: translateY(-1px);
}

.cart-link {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--color-text);
    text-decoration: none;
    transition: color 0.25s ease, transform 0.2s ease;
}
.cart-link svg { display: block; }
.cart-link:hover {
    color: var(--color-primary);
    transform: scale(1.08);
}
.cart-link:hover .cart-count { background-color: #F96A00; }

.cart-count {
    background-color: var(--color-primary);
    color: #ffffff;
    font-size: 0.75rem;
    font-weight: 700;
    border-radius: 999px;
    padding: 2px 7px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s ease;
}

@media (max-width: 550px) {
    .brand-text { display: none; }
}
@media (max-width: 405px) {
    .brand-icon { display: none; }
}
/* ==========================================================================
   4. WOOCOMMERCE - CARRINHO CLÁSSICO (ESTÉTICA FIGMA E LADO A LADO)
   ========================================================================== */

/* 1. Destrava a largura da página e aplica fundo branco */
body.woocommerce-cart #primary {
    max-width: 1200px !important;
    margin: 0 auto !important;
}
body.woocommerce-cart .site-main {
    background-color: #ffffff !important;
}

/* 2. Força o layout em duas colunas LADO A LADO (Esquerda: Tabela | Direita: Totais) */
body.woocommerce-cart .woocommerce {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 60px !important;
    align-items: flex-start !important;
    margin-top: 30px !important;
}

/* --- LADO ESQUERDO: TABELA DE PRODUTOS --- */
form.woocommerce-cart-form {
    flex: 1 !important;
    width: 100% !important;
}

table.shop_table.cart {
    border: none !important;
    border-radius: 0 !important;
    width: 100% !important;
    margin: 0 !important;
}

table.shop_table.cart th,
table.shop_table.cart td {
    border: none !important;
    background: transparent !important;
}

/* Esconde as Colunas de Quantidade e Subtotal da Tabela Esquerda */
table.shop_table.cart th.product-quantity,
table.shop_table.cart td.product-quantity,
table.shop_table.cart th.product-subtotal,
table.shop_table.cart td.product-subtotal {
    display: none !important;
}

/* Cabeçalho da Tabela */
table.shop_table.cart thead th {
    font-family: var(--font-main), 'Inter', sans-serif !important;
    font-size: 0.75rem !important;
    text-transform: uppercase !important;
    color: var(--color-primary, #F96A00) !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    border-bottom: 2px solid #eaeaea !important;
    padding: 0 0 15px 0 !important;
}

/* Alinhamento dos textos do cabeçalho */
table.shop_table.cart thead th.product-name { text-align: left !important; }
table.shop_table.cart thead th.product-price { text-align: right !important; }

/* Linhas dos Produtos */
table.shop_table.cart tbody td {
    border-bottom: 1px solid #f1f5f9 !important;
    padding: 25px 10px 25px 0 !important;
    vertical-align: top !important; 
}

/* Imagem e Nome do Produto */
table.shop_table.cart td.product-thumbnail img {
    border-radius: 8px !important;
    width: 80px !important;
    height: 80px !important;
    object-fit: cover !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05) !important;
}

table.shop_table.cart td.product-name a {
    font-family: var(--font-main), 'Inter', sans-serif !important;
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    color: var(--color-primary, #F96A00) !important;
    text-decoration: none !important;
    display: block !important;
    margin-bottom: 8px !important;
}

/* --- CORREÇÃO DAS VARIAÇÕES (LIMPAS E LADO A LADO) --- */
table.shop_table.cart dl.variation {
    margin: 5px 0 0 0 !important;
    font-size: 0.85rem !important;
    color: #64748b !important;
    line-height: 1.6 !important;
}

table.shop_table.cart dl.variation dt::after {
    content: none !important;
}

table.shop_table.cart dl.variation dt {
    float: left !important;
    clear: left !important;
    font-weight: 600 !important;
    color: #475569 !important;
    margin: 0 6px 6px 0 !important;
    padding: 0 !important;
}

table.shop_table.cart dl.variation dd {
    float: left !important;
    margin: 0 0 6px 0 !important;
    padding: 0 !important;
}

table.shop_table.cart dl.variation dd p {
    margin: 0 !important;
    padding: 0 !important;
    display: inline !important;
}

table.shop_table.cart dl.variation::after {
    content: "";
    display: table;
    clear: both;
}

/* Botão de Remover (X) */
table.shop_table.cart td.product-remove {
    vertical-align: middle !important;
}
table.shop_table.cart td.product-remove a.remove {
    color: #ef4444 !important;
    font-size: 1.5rem !important;
    font-weight: 300 !important;
    background: transparent !important;
}
table.shop_table.cart td.product-remove a.remove:hover {
    background: transparent !important;
    color: #b91c1c !important;
}

/* Preço na Tabela */
table.shop_table.cart td.product-price {
    color: #111 !important;
    font-weight: 600 !important;
    text-align: right !important; 
}

/* --- AÇÕES DA TABELA (CUPOM E ATUALIZAR) --- */
table.shop_table.cart td.actions {
    padding: 25px 0 !important;
    border: none !important;
}

.coupon {
    display: flex !important;
    gap: 10px !important;
    float: left !important;
}

.coupon input.input-text {
    height: 44px !important;
    border-radius: 8px !important;
    border: 1px solid #e2e8f0 !important;
    padding: 0 15px !important;
    width: 200px !important;
    outline: none !important;
}

.coupon button.button {
    height: 44px !important;
    border-radius: 8px !important;
    background-color: var(--color-primary, #F96A00) !important;
    color: #fff !important;
    font-weight: 600 !important;
    border: none !important;
    padding: 0 20px !important;
    cursor: pointer !important;
}

/* --- LADO DIREITO: CARD DE TOTAIS E FRETE --- */
.cart-collaterals {
    width: 400px !important;
    min-width: 400px !important;
}

.cart-collaterals .cart_totals {
    background: #ffffff !important;
    padding: 30px 25px !important;
    border-radius: 12px !important;
    border: 1px solid #eaeaea !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
    width: 100% !important;
    float: none !important;
}

.cart-collaterals .cart_totals h2 {
    font-family: var(--font-main), 'Inter', sans-serif !important;
    font-size: 0.85rem !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    color: var(--color-primary, #F96A00) !important;
    font-weight: 700 !important;
    margin-top: 0 !important;
    margin-bottom: 20px !important;
    border-bottom: none !important;
}

.cart-collaterals .cart_totals table {
    width: 100% !important;
    border: none !important;
    border-collapse: collapse !important;
}

.cart-collaterals .cart_totals th,
.cart-collaterals .cart_totals td {
    padding: 15px 0 !important;
    border: none !important;
    border-bottom: 1px solid #f1f5f9 !important;
    background: transparent !important;
}

.cart-collaterals .cart_totals th {
    color: #666 !important;
    font-size: 0.95rem !important;
    font-weight: normal !important;
    text-align: left !important;
}

.cart-collaterals .cart_totals td {
    text-align: right !important;
    color: #222 !important;
    font-weight: 700 !important;
}

/* Total Geral do Carrinho */
.cart-collaterals .cart_totals tr.order-total th {
    font-family: var(--font-heading), 'DM Serif Display', serif !important;
    font-size: 1.4rem !important;
    color: #111 !important;
    border-bottom: none !important;
    padding-top: 25px !important;
}
.cart-collaterals .cart_totals tr.order-total td {
    font-family: var(--font-heading), 'DM Serif Display', serif !important;
    font-size: 1.8rem !important;
    color: var(--color-primary, #F96A00) !important;
    border-bottom: none !important;
    padding-top: 25px !important;
}

/* Botão Laranja "Continuar para Finalização" */
.wc-proceed-to-checkout {
    padding: 0 !important;
    margin-top: 25px !important;
}
.wc-proceed-to-checkout a.checkout-button {
    background-color: var(--color-primary, #F96A00) !important;
    color: #ffffff !important;
    border-radius: 50px !important;
    height: 52px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    width: 100% !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}
.wc-proceed-to-checkout a.checkout-button:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 20px rgba(249, 106, 0, 0.25) !important; 
}

/* Responsividade Mobile */
@media (max-width: 900px) {
    body.woocommerce-cart .woocommerce {
        flex-direction: column !important;
        gap: 30px !important;
    }
    .cart-collaterals {
        width: 100% !important;
        min-width: 100% !important;
    }
    .coupon {
        flex-direction: column !important;
        width: 100% !important;
    }
    .coupon input.input-text, .coupon button.button {
        width: 100% !important;
    }
}

/* ==========================================================================
   NOTIFICAÇÕES WOOCOMMERCE (FLUTUANTE NO RODAPÉ)
   ========================================================================== */








@keyframes slideUpPopup {
    from {
        transform: translate(-50%, 150%);
        opacity: 0;
    }
    to {
        transform: translate(-50%, 0);
        opacity: 1;
    }
}

/* Esconde o botão de atualizar carrinho original */
button[name="update_cart"] {
    display: none !important;
}
/* ==========================================================================
   5. WOOCOMMERCE - PRODUTO INDIVIDUAL (Retrato Pet)
   ========================================================================== */

body.single-product {
    background-color: #FFFFFF;
}

.rp-container {
    max-width: 1200px;
    margin: 40px auto 120px auto;
    padding: 0 20px;
}

.rp-breadcrumb {
    font-size: 0.85rem;
    font-weight: 700;
    color: #a0a0a0;
    margin-bottom: 30px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.rp-breadcrumb a { color: #a0a0a0; }
.rp-breadcrumb .rp-current { color: var(--color-primary); }

.rp-product-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}


/* ==========================================
   IMAGEM ORIGINAL (Com bordas arredondadas)
   ========================================== */
#original-product-image {
    position: relative;
    border: none !important; 
    border-radius: 20px !important; 
    box-shadow: 0 10px 30px rgba(0,0,0,0.1) !important; 
    overflow: hidden !important; 
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
}

#original-product-image img {
    border-radius: 20px !important;
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 1000 / 1414 !important;
    object-fit: cover !important;
}

/* ==========================================
   PREVIEW REATIVO (SISTEMA DE CAMADAS)
   ========================================== */
.rp-preview-container {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    
    background-color: transparent !important;
    border: none !important; 
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.1), 0 10px 10px rgba(0, 0, 0, 0.05) !important;
}

.rp-layer-art,
.rp-layer-frame,
.rp-layer-name {
    grid-area: 1 / 1;
}

.rp-layer-art,
.rp-layer-frame {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.rp-layer-art { z-index: 1; }
.rp-layer-frame { z-index: 2; pointer-events: none; }

.rp-layer-name {
    z-index: 3;
    align-self: end;
    justify-self: center;
    margin-bottom: 12%; 
    font-family: 'DM Serif Display', Georgia, serif;
    font-size: 1.8rem;
    color: #2c2c2c;
    letter-spacing: 1px;
    opacity: 0; 
}

/* ==========================================
   BENEFÍCIOS E INFORMAÇÕES
   ========================================== */
.rp-product-benefits {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
    gap: 10px;
}

.rp-product-benefits span {
    background: #F5F0E6;
    padding: 10px 15px;
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 600;
    color: #555;
    text-align: center;
    flex: 1;
    box-shadow: 0 2px 10px rgba(0,0,0,0.02);
}

.rp-product-title {
    font-family: 'DM Serif Display', Georgia, serif !important;
    font-size: 3rem;
    color: #2c2c2c;
    margin-bottom: 10px;
}

.rp-product-price {
    font-size: 1.5rem;
    color: var(--color-primary);
    font-weight: 800;
    margin-bottom: 20px;
}

.rp-product-description {
    color: #665;
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 40px;
}

/* ==========================================
   GALERIA DE MINIATURAS
   ========================================== */
.rp-gallery-thumbnails {
    display: flex;
    gap: 12px;
    margin-top: 20px;
    justify-content: left;
    flex-wrap: wrap;
}

.rp-gallery-item {
    width: 65px;
    height: 65px;
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid transparent;
    transition: all 0.2s ease;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

.rp-gallery-item:hover {
    border-color: #F96A00; 
    transform: translateY(-2px);
}

.rp-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ==========================================
   SETAS DA GALERIA
   ========================================== */
.rp-gallery-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: none !important; 
    color: var(--color-primary) !important;
    border: none;
    font-size: 50px;
    font-weight: normal;
    cursor: pointer;
    z-index: 10;
    transition: all 0.2s ease;
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); 
    padding: 10px; 
}

.rp-gallery-arrow:hover {
    color: var(--color-primary) !important;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5); 
    transform: translateY(-50%) !important; 
    margin: 0 !important; 
}

.rp-gallery-arrow:active,
.rp-gallery-arrow:focus {
    color: var(--color-primary) !important;
    background: none !important;
    outline: none !important;
}

#rp-arrow-prev { 
    left: 5px; 
    opacity: 0.6; 
    transition: opacity 0.2s ease; 
}

#rp-arrow-next { 
    right: 5px; 
    opacity: 0.4; 
    transition: opacity 0.2s ease; 
}

/* Efeito para deixar 100% visível quando passar o mouse */
#rp-arrow-prev:hover, 
#rp-arrow-next:hover {
    opacity: 0.8;
}
/* ==========================================================================
   6. FORMULÁRIO PERSONALIZADO (Custom Fields)
   ========================================================================== */
.rp-custom-fields-container {
    display: flex;
    flex-direction: column;
    gap: 30px;
    margin-bottom: 40px;
}
.rp-step-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
}
.rp-step-number {
    background: var(--color-primary);
    color: #fff;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.9rem;
}
.rp-step-title {
    margin: 0;
    font-size: 1.1rem;
    color: #2c2c2c;
}
.rp-optional-tag {
    font-size: 0.7rem;
    color: #888;
    background: #e0e0e0;
    padding: 3px 8px;
    border-radius: 4px;
    margin-left: 10px;
    vertical-align: middle;
}

.rp-swatches { display: flex; flex-wrap: wrap; gap: 10px; }
.rp-swatch-label { cursor: pointer; }
.rp-swatch-label input { display: none; }
.rp-swatch-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 15px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 30px;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.2s;
    color: #555;
}
.rp-color-circle {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: inline-block;
}
.rp-swatch-label input:checked + .rp-swatch-btn {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 1px var(--color-primary);
    color: #222;
}

.rp-art-styles {
    display: flex !important;
    gap: 14px !important;
    align-items: flex-start !important;
}

.rp-art-style-label {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    cursor: pointer !important;
    width: 90px !important;
    position: relative;
}

.rp-art-style-label input {
    display: none !important;
}

.rp-art-card {
    width: 90px !important;
    height: 90px !important;
    margin: 0 auto !important;
    border: 2px solid transparent;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    box-sizing: border-box;
    transition: all 0.2s ease;
}

.rp-art-card img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 10px !important;
}

.rp-art-name {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin-top: 8px !important;
    font-family: var(--font-main), 'Inter', sans-serif !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    color: #4a4542 !important;
}

.rp-check-icon {
    position: absolute;
    top: 6px;
    right: 6px;
    background: var(--color-primary, #F96A00);
    color: #fff;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transform: scale(0.5);
    transition: all 0.2s ease;
    z-index: 2;
}

.rp-check-icon svg {
    width: 14px;
    height: 14px;
}

.rp-art-style-label input:checked + .rp-art-card {
    border-color: var(--color-primary, #F96A00) !important;
}

.rp-art-style-label input:checked + .rp-art-card .rp-check-icon {
    opacity: 1;
    transform: scale(1);
}

.rp-toggle-wrapper { display: flex; align-items: center; gap: 15px; }
.rp-switch { position: relative; display: inline-block; width: 46px; height: 24px; }
.rp-switch input { opacity: 0; width: 0; height: 0; }
.rp-slider {
    position: absolute; cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: #ccc; transition: .4s;
}
.rp-slider:before {
    position: absolute; content: "";
    height: 18px; width: 18px; left: 3px; bottom: 3px;
    background-color: white; transition: .4s;
}
.rp-switch input:checked + .rp-slider { background-color: var(--color-primary); }
.rp-switch input:checked + .rp-slider:before { transform: translateX(22px); }
.rp-slider.round { border-radius: 24px; }
.rp-slider.round:before { border-radius: 50%; }

.rp-toggle-text { font-size: 0.95rem; color: #444; }
.rp-toggle-text span { color: #888; font-size: 0.85rem;}
.rp-input-text {
    width: 100%;
    padding: 15px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    font-size: 1rem;
}

.rp-file-input { display: none; }
.rp-file-dropzone {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 40px 20px; border: 2px dashed #ccc; border-radius: 12px;
    background: #fff; cursor: pointer; transition: all 0.2s; text-align: center;
}
.rp-file-dropzone:hover, .rp-file-dropzone.highlight {
    border-color: var(--color-primary); background: #fdfaf6;
}
.rp-upload-icon {
    background: #fdf0e6; color: var(--color-primary);
    width: 48px; height: 48px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 15px;
}
.rp-upload-title { font-weight: 600; color: #333; margin-bottom: 5px; }
.rp-upload-subtitle { font-size: 0.8rem; color: #888; }

/* ==========================================================================
   7. STICKY BAR (Barra Flutuante Inferior)
   ========================================================================== */
.rp-sticky-bar {
    position: fixed;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(245, 240, 230, 0.95);
    backdrop-filter: blur(10px);
    padding: 20px 30px;
    border-radius: 20px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.1);
    display: flex;
    align-items: center;
    gap: 30px;
    z-index: 1000;
    width: 90%;
    max-width: 800px;
    border: 1px solid #e2dbd3;
}
.rp-sticky-left { display: flex; flex-direction: column; }
.rp-sticky-label { font-size: 0.75rem; font-weight: 700; color: #888; letter-spacing: 1px; }
.rp-sticky-price { font-size: 1.8rem; font-weight: 800; color: #2c2c2c; }
.rp-sticky-right {
    display: flex; align-items: center; gap: 15px; margin-left: auto;
}


.rp-sticky-right .quantity input::-webkit-outer-spin-button,
.rp-sticky-right .quantity input::-webkit-inner-spin-button {
    -webkit-appearance: none; margin: 0;
}
.rp-add-to-cart-btn {
    background: #e6ab86 !important;
    color: #fff !important;
    border-radius: 30px !important;
    padding: 15px 30px !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all 0.3s;
}
.rp-add-to-cart-btn:hover { background: var(--color-primary) !important; }

.rp-sticky-category {
    position: absolute; bottom: -25px; left: 50%;
    transform: translateX(-50%); font-size: 0.75rem; color: #888;
}
.rp-sticky-category span { color: var(--color-primary); }

@media (max-width: 991px) {
    .rp-product-grid { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    .rp-sticky-bar {
        bottom: 0; width: 100%; border-radius: 20px 20px 0 0;
        flex-direction: column; padding: 20px; gap: 15px;
    }
    .rp-sticky-right { width: 100%; justify-content: space-between; margin-left: 0; }
    .rp-add-to-cart-btn { flex: 1; text-align: center; }
    .rp-sticky-category { display: none; }
}

/* ==========================================================================
   8. FRONT PAGE (HOME)
   ========================================================================== */
.align-full-width {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    box-sizing: border-box !important;
}

.banner-slider-section {
    padding: 0;
    background-color: #ffffff;
}
.smart-slider-container {
    width: 100%;
    padding: 0;
    overflow: hidden;
}

.site-main {
    --rp-terracotta: var(--color-primary);
    --rp-text-dark: var(--color-text);
    --rp-text-light: var(--color-text-light);
    --rp-bg-card: #f6f3ef;
    --rp-border-card: #e8e2dc;
}

.section-tag {
    font-family: var(--font-main);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.25em;
    color: var(--rp-terracotta);
    margin-bottom: 20px;
    display: inline-block;
}

.new-hero-section {
    background: linear-gradient(180deg, #ffffff 0%, #fbfaf9 100%);
    padding: 55px 20px;
    text-align: center;
    border-bottom: 1px solid #eaeaea;
}
.new-hero-container {
    max-width: 1040px;
    margin: 0 auto;
    width: 100%;
}
.new-hero-title {
    font-family: var(--font-heading);
    font-size: 2.625rem;
    line-height: 1.15;
    color: var(--rp-text-dark);
    max-width: 900px;
    margin: 0 auto 26px;
}
.new-hero-title em { color: var(--rp-terracotta); font-style: italic; }
.new-hero-text {
    font-family: var(--font-main);
    font-weight: 300;
    font-size: 1.125rem;
    line-height: 1.5;
    color: var(--rp-text-light);
    max-width: 650px;
    margin: 0 auto 35px;
}
.new-hero-btn {
    display: inline-block;
    font-family: var(--font-main);
    font-size: 1rem;
    padding: 14px 32px;
    color: var(--rp-terracotta);
    background: transparent;
    border: 1px solid var(--rp-terracotta);
    border-radius: 50px;
    text-decoration: none;
    transition: all 0.3s ease;
}
.new-hero-btn:hover {
    background: var(--rp-terracotta);
    color: #ffffff;
}

.instagram-section {
    padding: 35px 10px;
    background-color: #ffffff;
    text-align: center;
    border-bottom: none !important;
}
.instagram-title {
    font-family: var(--font-heading);
    font-size: 2.625rem;
    line-height: 1.15;
    margin-bottom: 15px;
    color: var(--rp-text-dark);
}
.instagram-text {
    font-family: var(--font-main);
    font-weight: 300;
    color: var(--rp-text-light);
    margin-bottom: 35px;
    font-size: 1.125rem;
    line-height: 1.5;
}
.instagram-link {
    color: var(--rp-terracotta);
    font-weight: 600;
    text-decoration: none;
}
.ig-feed-container {
    max-width: 1200px;
    margin: 0 auto;
}

.gallery-banner-section {
    height: 420px;
    background-size: cover;
    background-position: center;
    background-attachment: scroll;
    position: relative;
}
.gallery-banner-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.08);
}

.new-how-section { background-color: #ffffff; padding: 45px 20px; text-align: center; }
.new-how-title-wrapper { margin-bottom: 35px; }
.new-how-title { font-family: var(--font-heading); font-size: 2.625rem; color: var(--rp-text-dark); line-height: 1.15; }
.new-how-title em { color: var(--rp-terracotta); font-style: italic; }

.steps-container { position: relative; max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.steps-line { position: absolute; top: 50px; left: 15%; right: 15%; height: 1px; background-color: #dcbfa9; z-index: 1; }

.new-step-card { 
  background: #ffffff; 
  padding: 25px 20px; 
  border-radius: 16px; 
  text-align: left; 
  position: relative; 
  z-index: 2; 
  border: 1px solid var(--rp-terracotta); 
  
  /* Sombra corrigida para evitar banding (edge duro) */
  box-shadow: 0 23px 68px rgba(60, 40, 30, 0.04);}
.new-step-icon { width: 50px; height: 50px; background-color: var(--rp-terracotta); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; margin-bottom: 15px; }
.new-step-number { font-family: var(--font-heading); font-size: 2.125rem; color: #BAA69C; line-height: 1; margin-bottom: 10px; }
.new-step-title { font-family: var(--font-heading); font-size: 1.5rem; color: var(--rp-text-dark); margin-bottom: 10px; }
.new-step-text { font-family: var(--font-main); font-weight: 300; font-size: 0.95rem; line-height: 1.5; color: var(--rp-text-light); }

@media (max-width: 900px) {
    .steps-container { grid-template-columns: 1fr; gap: 20px; }
    .steps-line { display: none; }
    .new-hero-title { font-size: 2rem; }
    .new-how-title, .instagram-title { font-size: 1.875rem; }
    .new-step-title { font-size: 1.3125rem; }
    .new-hero-text, .instagram-text { font-size: 0.95rem; }
    .new-step-text { font-size: 0.85rem; }
    .new-step-card { 
        text-align: center; 
        max-width: 340px; 
        margin: 0 auto; 
    }
    .new-step-icon { margin: 0 auto 20px; }
    .gallery-banner-section { height: 350px; }
}

/* ==========================================================================
   --- SECTION EQUIPE (Atenção em cada detalhe)
   ========================================================================== */
.rp-team-section {
    background-color: #ffffff;
    padding: 50px 20px;
    border-bottom: 1px solid #eaeaea;
}
.rp-team-container {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    /* First column exactly 1/3 (matching step cards), second column takes the rest */
    grid-template-columns: minmax(300px, 420px) 1fr; /* Foto maior que 1 terço */
    gap: 60px;
    align-items: center;
}
.rp-team-image-wrapper {
    padding: 15px; /* Spacing for the outline to breathe */
}
.rp-team-image-wrapper img {
    width: 100%;
    height: auto;
    border-radius: 20px;
    /* Outline dupla: 8px branco, seguido de 2px laranja (total 10px) para ficar bem fino */
    box-shadow: 0 0 0 10px #ffffff, 0 0 0 12px var(--color-primary, #F96A00);
    display: block;
    margin: 0 auto;
}
.rp-team-title {
    font-family: var(--font-heading);
    font-size: 2.625rem;
    color: var(--rp-text-dark);
    line-height: 1.15;
    margin-bottom: 25px;
}
.rp-team-text {
    font-family: var(--font-main);
    font-size: 1.125rem;
    font-weight: 300;
    line-height: 1.5;
    color: var(--rp-text-light);
    margin-bottom: 20px;
}

.rp-team-btn-outline {
    display: inline-block;
    font-family: var(--font-main);
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--color-primary, #F96A00);
    background-color: transparent;
    border: 1px solid var(--color-primary, #F96A00);
    border-radius: 40px;
    padding: 12px 32px;
    text-decoration: none;
    margin-top: 15px;
    transition: all 0.3s ease;
}
.rp-team-btn-outline:hover {
    background-color: var(--color-primary, #F96A00);
    color: #ffffff;
}


.rp-team-content { /* min-width removed to fix mobile overflow */ }

@media (max-width: 900px) {
    .rp-team-image-wrapper {
        max-width: 320px; /* Aumentado um pouco para celular */
        margin: 0 auto;
        padding: 10px; /* Reduz um pouco o padding no celular pra borda n ficar tao longe */
    }
    .rp-team-container {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 40px;
    }
    .rp-team-title {
        font-size: 2rem;
    }
        .rp-team-content {
        max-width: 340px;
        margin: 0 auto;
    }
    .rp-team-text {
        font-size: 0.95rem;
    }
    .rp-team-image-wrapper img {
        box-shadow: 0 0 0 5px #ffffff, 0 0 0 8px var(--color-primary, #F96A00);
    }
}


/* ==========================================================================
   9. FOOTER (RODAPÉ)
   ========================================================================== */
.site-footer {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    background: var(--color-primary);
    color: #ffffff;
    padding: 60px 0 30px 0;
    box-sizing: border-box;
    border-top: none !important;
    position: relative;
    margin-top: 120px !important;
}

/* Faixa de transição projetada acima do footer (RESTAURADA) */
.footer-transition-gradient {
    position: absolute;
    top: -160px;
    left: 0;
    width: 100%;
    height: 160px;
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 20%, rgba(249,106,0,0.1) 45%, rgba(249,106,0,0.4) 75%, #F96A00 100%);
    pointer-events: none;
    display: block !important;
}

.footer-container {
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

.footer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 40px;
    margin-bottom: 50px;
    align-items: start;
}

.footer-col {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.footer-divider-col {
    gap: 14px;
    border-left: 1px solid rgba(255, 255, 255, 0.25);
    padding-left: 32px;
    min-height: 120px;
}

/* Logo blindada contra o Elementor */
.footer-logo {
    height: 100px !important;
    width: auto !important;
    max-width: none !important;
    display: block !important;
    align-self: flex-start;
}

.footer-brand-text {
    font-family: var(--font-heading);
    font-style: italic;
    font-size: 2.2rem;
    font-weight: 400;
    color: #ffffff;
    white-space: nowrap;
    line-height: 1;
    display: inline-block;
    margin-top: -4px;
}

.footer-desc {
    font-family: var(--font-heading);
    font-style: italic;
    font-weight: 300;
    font-size: 0.95rem;
    line-height: 1.6;
    letter-spacing: 0.3px;
    color: rgba(255, 255, 255, 0.8);
    margin: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.footer-heading {
    color: #ffffff;
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.footer-links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.footer-links a {
    color: rgba(255, 255, 255, 0.9);
    text-decoration: none;
    font-size: 0.9rem;
    transition: opacity 0.2s ease;
}

.footer-links a:hover {
    opacity: 0.7;
}

.footer-text {
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.5;
}

.footer-text strong {
    color: #ffffff;
    font-weight: 600;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    padding-top: 24px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
}

.footer-copyright {
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.85rem;
    margin: 0;
}

.footer-bottom .social-icons {
    display: flex;
    align-items: center;
    gap: 12px;
}

.footer-bottom .social-link {
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    text-decoration: none;
    transition: background 0.2s ease, transform 0.2s ease;
}

.footer-bottom .social-link:hover {
    background: rgba(255, 255, 255, 0.4);
    transform: translateY(-2px);
}

@media (max-width: 768px) {
    .footer-divider-col {
        border-left: none;
        padding-left: 0;
    }
}
.whatsapp-card {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(37, 211, 102, 0.15);
    border: 1px solid rgba(37, 211, 102, 0.4);
    padding: 8px 18px 8px 8px;
    border-radius: 50px; /* Formato de pílula */
    text-decoration: none;
    transition: all 0.3s ease;
    width: fit-content;
    margin-bottom: 6px;
}

.whatsapp-card:hover {
    background: #25d366;
    border-color: #25d366;
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(37, 211, 102, 0.3);
}

.whatsapp-icon-box {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: #25d366;
    color: #ffffff;
    border-radius: 50%; /* Ícone perfeitamente redondo dentro da pílula */
    flex-shrink: 0;
    transition: background 0.3s ease, color 0.3s ease;
}

.whatsapp-card:hover .whatsapp-icon-box {
    background: #ffffff;
    color: #25d366;
}

.whatsapp-info {
    display: flex;
    flex-direction: column;
}

.whatsapp-label {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: rgba(255, 255, 255, 0.8);
    font-weight: 600;
}

.whatsapp-card:hover .whatsapp-label {
    color: rgba(255, 255, 255, 0.9);
}

.whatsapp-number {
    font-size: 0.9rem;
    font-weight: 700;
    color: #ffffff;
}
/* ==========================================================================
   10. WOOCOMMERCE - CAMPOS DE TEXTO E CATEGORIA (Produto)
   ========================================================================== */
.rp-single-product-layout input[type="text"],
.rp-single-product-layout input[type="file"],
.rp-single-product-layout select,
.rp-single-product-layout textarea {
    width: 100% !important;
    background-color: #F5F0E6 !important;
    border: 1.5px solid #e2dbd3 !important;
    border-radius: 10px !important;
    padding: 14px 18px !important;
    font-family: var(--font-main) !important;
    font-size: 0.95rem !important;
    color: var(--color-text) !important;
    outline: none !important;
    box-shadow: none !important;
    transition: all 0.25s ease !important;
    box-sizing: border-box !important;
}

.rp-single-product-layout input[type="text"]:focus,
.rp-single-product-layout select:focus,
.rp-single-product-layout textarea:focus {
    border-color: var(--color-primary) !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(249, 106, 0, 0.12) !important;
}

.rp-single-product-layout input[type="text"]::placeholder,
.rp-single-product-layout textarea::placeholder {
    color: #a09990 !important;
    font-weight: 300 !important;
}

.rp-single-product-layout label {
    font-family: var(--font-main) !important;
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    color: var(--color-text) !important;
    margin-bottom: 8px !important;
    display: block !important;
}

.rp-image-category {
    margin: 16px 0 12px;
    font-size: 0.95rem;
    color: #888;
    font-family: var(--font-main);
    text-align: center;
}

.rp-image-category strong {
    color: var(--color-primary);
    font-weight: 600;
}
/* ==========================================================================
   11. WOOCOMMERCE - CATÁLOGO (Loja)
   ========================================================================== */
.shop-custom-main {
    background-color: #ffffff;
    padding: 30px 10px;
    width: 100% !important;
    max-width: 100% !important;
}

.shop-custom-container {
    max-width: 95% !important;
    width: 70% !important;
    margin: 0 auto;
}

/* --- Cabeçalho da Loja --- */
.shop-custom-header {
    text-align: center;
    margin-bottom: 30px;
}

.shop-header-tag {
    font-family: var(--font-main);
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.25em;
    color: var(--color-primary);
    margin-bottom: 15px;
    display: inline-block;
    font-weight: 600;
}

.shop-header-title {
    font-family: var(--font-heading);
    font-size: 3.5rem;
    color: var(--color-text);
    line-height: 1.2;
    margin: 0 0 20px;
}

.shop-header-title em {
    color: var(--color-primary);
    font-style: italic;
}

.shop-header-desc {
    font-family: var(--font-main);
    font-weight: 300;
    font-size: 1.1rem;
    color: var(--color-text-light);
    max-width: 600px;
    margin: 0 auto;
}

/* --- Grid de Produtos --- */
.shop-custom-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    align-items: stretch;
}

/* --- Layout de Card --- */
.shop-product-card {
    background: #fdfbf7;
    border: 1px solid rgba(249, 106, 0, 0.2) !important;
    border-radius: 20px;
    padding: 16px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.shop-product-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(249, 106, 0, 0.12);
    border: 1px solid var(--color-primary) !important;
}

/* Imagem Compacta e Padronizada para os 3 Cards */
.product-image-wrapper {
    position: relative;
    height: 300px !important; /* Altura reduzida e limpa */
    background-color: #f4f4f4;
    border-radius: 12px;
    margin-bottom: 20px;
    overflow: hidden;
}

.product-image-link {
    display: block;
    width: 101%;
    height: 101%;
}

.product-image-wrapper img {
    width: 100%;
    height: 100%;
    border-radius: 12px;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.shop-product-card:hover .product-image-wrapper img {
    transform: scale(1.04);
}

/* Etiqueta "Mais Vendido" */
.shop-product-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    padding: 6px 14px;
    border-radius: 20px;
    font-family: var(--font-main);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    z-index: 2;
}

.badge-outline {
    background: rgba(249, 106, 0, 0.15);
    color: var(--color-primary);
    border: 1px solid rgba(249, 106, 0, 0.3);
}

.badge-solid {
    background: var(--color-primary);
    color: #ffffff;
}

.shop-product-info {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

/* Bloco de Tamanho (Pílula + Texto) */
.shop-product-size-wrapper {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.size-pill {
    background-color: #f5f5f5;
    color: #666;
    font-family: var(--font-main);
    font-size: 0.75rem;
    font-weight: 700;
    padding: 4px 8px;
    border-radius: 6px;
    letter-spacing: 1px;
}

.size-dim {
    font-family: var(--font-main);
    font-size: 0.85rem;
    color: #999;
}

/* Textos (Título e Descrição) */
.shop-product-title {
    font-family: var(--font-heading);
    font-size: 1.6rem;
    color: #1a1a1a;
    margin: 0 0 8px 0;
    line-height: 1.1;
}

.shop-product-desc {
    font-family: var(--font-main);
    font-size: 0.95rem;
    color: #777;
    margin-bottom: 20px;
    line-height: 1.4;
}

/* Caixa de Preço Full Width */
.shop-product-price {
    background-color: #fdfbf7;
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 16px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    box-sizing: border-box;
}

.shop-product-price .price-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 6px;
}

.shop-product-price del .woocommerce-Price-amount {
    font-family: var(--font-main);
    font-size: 1.05rem;
    color: #999;
    font-weight: 500;
    text-decoration: line-through;
    text-decoration-color: #999; 
}

.shop-product-price .discount-badge {
    background-color: rgba(239, 68, 68, 0.1);
    color: #ef4444;
    font-family: var(--font-main);
    font-size: 0.75rem;
    font-weight: 700;
    padding: 4px 8px;
    border-radius: 8px;
}

.shop-product-price ins {
    text-decoration: none;
}

.shop-product-price ins .woocommerce-Price-amount {
    font-family: var(--font-heading);
    font-size: 2.2rem;
    color: var(--color-primary);
    font-weight: 700;
    line-height: 1;
    margin-bottom: 6px;
    display: block;
}

.shop-product-price .price-savings {
    font-family: var(--font-main);
    font-size: 0.85rem;
    font-weight: 600;
    color: #1a1a1a;
}

.shop-product-price > .woocommerce-Price-amount {
    font-family: var(--font-heading);
    font-size: 1.8rem;
    color: #1a1a1a;
    font-weight: 700;
}

/* Funcionalidade da Moldura */
.shop-product-feature {
    font-family: var(--font-main);
    font-size: 0.9rem;
    color: #888;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.shop-product-feature span {
    color: var(--color-primary);
}

/* Botão Minimalista */
.shop-custom-btn {
    text-align: center;
    width: 100%;
    padding: 14px;
    border-radius: 12px;
    border: 1px solid var(--color-primary);
    background-color: var(--color-primary);
    color: #fff !important;
    font-family: var(--font-main);
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    box-sizing: border-box;
    transition: all 0.3s ease;
    margin-top: auto;
}

.shop-custom-btn:hover {
    border-color: var(--color-primary-hover);
    background-color: var(--color-primary-hover);
    color: #fff !important;
}

/* Ajustes Responsivos */
@media (max-width: 992px) {
    .shop-custom-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 768px) {
    .shop-custom-header h1,
    .shop-header-title {
        font-size: 2.4rem !important;
    }
    .product-image-wrapper {
        height: 200px !important; /* Altura compacta no mobile */
    }
    .shop-custom-grid {
        grid-template-columns: 1fr !important;
    }
    .shop-custom-container {
        width: 90% !important;
    }
}
/* ==========================================================================
   12. WOOCOMMERCE - CARRINHO VAZIO E LINKS
   ========================================================================== */

/* 1. Remove linhas/sublinhados indesejados de botões e links no carrinho */
.wp-block-woocommerce-cart a,
.wp-block-woocommerce-cart a:hover,
.wp-block-woocommerce-cart a:focus {
    text-decoration: none !important;
    box-shadow: none !important;
    border-bottom: none !important;
}

/* 2. Oculta os textos e imagens originais do Woo no carrinho vazio */
.wc-block-cart__empty-cart__title,
.wc-block-cart__empty-cart-image,
.wc-empty-cart-icon {
    display: none !important;
}

/* 3. Estilização do Card do Carrinho Vazio */
.rp-empty-cart-container {
    background: #ffffff !important;
    border-radius: 16px !important;
    padding: 60px 30px !important;
    max-width: 600px !important;
    margin: 40px auto 80px auto !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

/* 4. Ícone Laranja em SVG */
.rp-empty-cart-icon {
    width: 90px !important;
    height: 90px !important;
    background-color: #FFF0E6 !important;
    border-radius: 50% !important;
    margin-bottom: 25px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F96A00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='21' r='1'%3E%3C/circle%3E%3Ccircle cx='20' cy='21' r='1'%3E%3C/circle%3E%3Cpath d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'%3E%3C/path%3E%3C/svg%3E") !important;
    background-size: 40px !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/* 5. Título */
.rp-empty-cart-title {
    font-family: var(--font-heading), 'DM Serif Display', serif !important;
    font-size: 2.2rem !important;
    color: #333 !important;
    margin-bottom: 15px !important;
    line-height: 1.2 !important;
    border: none !important;
}

/* 6. Descrição */
.rp-empty-cart-desc {
    font-family: var(--font-main), 'Inter', sans-serif !important;
    font-size: 1.05rem !important;
    color: #888 !important;
    max-width: 450px !important;
    line-height: 1.6 !important;
    margin-bottom: 30px !important;
}

/* 7. Botão */
.rp-empty-cart-btn {
    background-color: var(--color-primary, #F96A00) !important;
    color: #ffffff !important;
    border-radius: 30px !important;
    padding: 16px 40px !important;
    font-family: var(--font-main), 'Inter', sans-serif !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
    display: inline-block !important;
    transition: all 0.3s ease !important;
}

.rp-empty-cart-btn:hover {
    transform: translateY(-2px) !important;
}   
/* ==========================================================================
   13 -WOOCOMMERCE - CHECKOUT CLÁSSICO (ESTÉTICA DO PROTÓTIPO FIGMA)
   ========================================================================== */

/* ==========================================
   1. CONFIGURAÇÕES GERAIS E LAYOUT
   ========================================== */
body.woocommerce-checkout .woocommerce {
    max-width: 1000px !important;
    margin: 0 auto !important;
}

body.woocommerce-checkout .site-main {
    background-color: #ffffff !important;
}

/* Formulário Principal em Flexbox (Desktop) */
form.woocommerce-checkout {
    display: flex !important;
    flex-direction: row !important;
    gap: 40px !important;
    align-items: flex-start !important;
    margin-top: 30px !important;
}

/* ==========================================
   2. LADO ESQUERDO: FORMULÁRIOS DE DADOS
   ========================================== */
#customer_details.col2-set {
    flex: 1 !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

#customer_details .col-1,
#customer_details .col-2 {
    width: 100% !important;
    float: none !important;
    max-width: 100% !important;
}

/* Títulos das seções */
#customer_details h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3 {
    font-family: var(--font-heading), 'DM Serif Display', serif !important;
    font-size: 1.6rem !important;
    color: var(--color-text, #222) !important;
    margin-bottom: 20px !important;
    border-bottom: none !important;
    font-weight: normal !important;
}

    font-family: var(--font-heading), 'DM Serif Display', serif !important;
    color: var(--color-text, #222) !important;
    font-weight: normal !important;
}

/* Labels e Campos */
.woocommerce form .form-row label {
    display: block !important;
    font-family: var(--font-main), 'Inter', sans-serif !important;
    font-size: 0.9rem !important;
    font-weight: 500 !important;
    color: #475569 !important;
    margin-bottom: 6px !important;
}

.woocommerce form .form-row .required {
    color: var(--color-primary, #F96A00) !important;
    text-decoration: none !important;
    font-weight: bold;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row select,
.woocommerce form .form-row textarea,
.select2-container--default .select2-selection--single {
    width: 100% !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    padding: 0 14px !important;
    border-radius: 8px !important;
    border: 1px solid #e2e8f0 !important;
    background-color: #ffffff !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.02) !important;
    outline: none !important;
    font-size: 0.95rem !important;
    transition: all 0.2s ease !important;
    box-sizing: border-box !important;
}

/* Foco nos campos */
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row select:focus,
.woocommerce form .form-row textarea:focus,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--color-primary, #F96A00) !important;
    box-shadow: inset 0 0 0 1px var(--color-primary, #F96A00), 0 0 0 4px rgba(249, 106, 0, 0.15) !important;
}

/* Ocultar telefone nativo e campos inúteis do Brasil */
#billing_phone_field, #billing_country_field, #shipping_country_field,
.woocommerce form .form-row[style*="display: none"],
.woocommerce form .form-row[style*="none"] {
    display: none !important;
}

/* Grid de Endereços */
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    margin: 0 -10px !important;
}

.woocommerce form .form-row {
    padding: 0 10px !important;
    margin-bottom: 15px !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
}

/* Complemento visível e formatado */
#billing_address_2_field label, #shipping_address_2_field label {
    font-size: 0.9rem !important;
    position: static !important;
    clip: auto !important;
    clip-path: none !important;
    width: auto !important;
    height: auto !important;
    margin: 0 0 6px 0 !important;
    overflow: visible !important;
    color: #475569 !important;
}
#billing_address_2_field label::before, #shipping_address_2_field label::before {
    display: none !important;
}

/* Larguras dos Campos (Cobrança e Entrega) */
#billing_first_name_field, #shipping_first_name_field { width: 50% !important; order: 1; }
#billing_last_name_field, #shipping_last_name_field { width: 50% !important; order: 2; }
#billing_persontype_field { width: 50% !important; order: 3; }
#billing_cpf_field, #billing_cnpj_field { width: 50% !important; order: 4; }
#billing_postcode_field, #shipping_postcode_field { width: 35% !important; order: 5; }
#billing_neighborhood_field, #shipping_neighborhood_field { width: 65% !important; order: 6; }
#billing_address_1_field, #shipping_address_1_field { width: 100% !important; order: 7; }
#billing_number_field, #shipping_number_field { width: 35% !important; order: 8; }
#billing_address_2_field, #shipping_address_2_field { width: 65% !important; order: 9; }
#billing_city_field, #shipping_city_field { width: 50% !important; order: 10; }
#billing_state_field, #shipping_state_field { width: 50% !important; order: 11; }
#billing_cellphone_field { width: 100% !important; order: 12; }
#billing_email_field { width: 100% !important; order: 13; }

/* ==========================================
   3. LADO DIREITO: RESUMO E PAGAMENTO (DOIS CARDS SEPARADOS)
   ========================================== */
#order_review_heading { display: none !important; }

/* Wrapper Invisível que empilha a Tabela e o Pagamento */
#order_review {
    width: 400px !important;
    min-width: 400px !important;
    margin-top: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important; /* Espaço entre o Resumo e o Pagamento */
}

/* CARD 1: TABELA DE RESUMO */
table.woocommerce-checkout-review-order-table {
    background-color: #ffffff !important;
    border: 1px solid #eaeaea !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
    width: 100% !important;
    margin: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
}

table.woocommerce-checkout-review-order-table th,
table.woocommerce-checkout-review-order-table td {
    border: none !important;
    background: transparent !important;
    padding-left: 25px !important;
    padding-right: 25px !important;
}

table.woocommerce-checkout-review-order-table tbody td {
    border-bottom: 1px solid #f1f5f9 !important;
}

table.woocommerce-checkout-review-order-table thead th {
    text-transform: uppercase;
    font-size: 0.75rem !important;
    letter-spacing: 1px;
    color: #94a3b8 !important;
    padding-top: 25px !important;
    padding-bottom: 12px !important;
    border-bottom: 2px solid #e2e8f0 !important;
}

table.woocommerce-checkout-review-order-table thead th.product-name { text-align: left !important; }
table.woocommerce-checkout-review-order-table thead th.product-total { text-align: right !important; }

/* Imagem e Nome do Produto */
table.woocommerce-checkout-review-order-table td.product-name {
    padding-top: 16px !important;
    padding-bottom: 16px !important;
}

.checkout-product-thumb {
    width: 55px !important; height: 55px !important;
    object-fit: cover !important;
    border-radius: 8px !important;
    display: block !important;
}

/* Variações e atributos (pequenos e em bloco) */
table.woocommerce-checkout-review-order-table td.product-name dl.variation {
    margin: 6px 0 0 0 !important;
    font-size: 0.78rem !important;
    color: #64748b !important;
    line-height: 1.4 !important;
}

table.woocommerce-checkout-review-order-table td.product-name dl.variation dt,
table.woocommerce-checkout-review-order-table td.product-name dl.variation dd {
    display: block !important;
    float: none !important;      /* Mata o flutuamento padrão do WooCommerce */
    clear: both !important;      /* Força a quebra de linha real */
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
}

/* Previne que o WooCommerce adicione margens extras se usar parágrafos */
table.woocommerce-checkout-review-order-table td.product-name dl.variation p {
    margin: 0 !important;
    padding: 0 !important;
}

table.woocommerce-checkout-review-order-table td.product-name dl.variation dt {
    font-weight: 600 !important;
    color: #475569 !important;
    margin-top: 4px !important;
}

table.woocommerce-checkout-review-order-table td.product-name dl.variation dd {
    margin-bottom: 2px !important;
}

/* Preço do item, Subtotal e Frete */
table.woocommerce-checkout-review-order-table td.product-total {
    padding-top: 16px !important;
    text-align: right !important;
    vertical-align: top !important;
    font-weight: 600 !important;
    color: #111111 !important;
}

.woocommerce-checkout-review-order-table .cart-subtotal th,
.woocommerce-checkout-review-order-table .shipping th {
    color: #888 !important; font-size: 0.95rem !important;
    font-weight: normal !important; padding-top: 12px !important; padding-bottom: 12px !important;
}
.woocommerce-checkout-review-order-table .cart-subtotal td,
.woocommerce-checkout-review-order-table .shipping td {
    padding-top: 12px !important; padding-bottom: 12px !important; text-align: right !important;
}

/* Total Geral */
.woocommerce-checkout-review-order-table .order-total th {
    font-family: var(--font-heading), 'DM Serif Display', serif !important;
    font-size: 1.6rem !important; color: #111 !important;
    padding-top: 25px !important; padding-bottom: 25px !important;
}
.woocommerce-checkout-review-order-table .order-total td {
    font-family: var(--font-heading), 'DM Serif Display', serif !important;
    font-size: 1.8rem !important; color: #111 !important;
    text-align: right !important;
    padding-top: 25px !important; padding-bottom: 25px !important;
}

/* CARD 2: CAIXA DE PAGAMENTO */
#payment {
    background-color: #ffffff !important;
    border: 1px solid #eaeaea !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
    padding: 25px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#payment ul.payment_methods { padding: 0 !important; margin: 0 0 20px 0 !important; }
#payment ul.payment_methods li {
    border-radius: 12px !important;
    border: 1px solid #e2e8f0 !important;
    padding: 14px 16px !important;
    margin-bottom: 10px !important;
    background: #ffffff !important;
    list-style: none !important;
}
#payment ul.payment_methods li:has(input:checked) {
    background-color: #fffaf5 !important;
    border-color: var(--color-primary, #F96A00) !important;
    box-shadow: 0 0 0 1.5px var(--color-primary, #F96A00) !important;
}
#payment div.payment_box {
    background-color: transparent !important;
    padding: 10px 0 5px 28px !important;
    font-size: 0.875rem !important;
    color: var(--color-text-light, #666) !important;
    box-shadow: none !important;
    margin: 10px 0 0 0 !important;
}

/* Remove a setinha (triângulo) padrão do WooCommerce */
#payment div.payment_box::before {
    display: none !important;
}

/* ==========================================
   4. CUPOM DE DESCONTO
   ========================================== */
.woocommerce-form-coupon-toggle .woocommerce-info {
    background-color: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
    padding: 12px 16px !important;
    margin-bottom: 5px !important;
    font-size: 0 !important;
    display: flex !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.02) !important;
}
.woocommerce-form-coupon-toggle .woocommerce-info::before { display: none !important; }
.woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon {
    color: #334155 !important; font-size: 0.95rem !important; font-weight: 500 !important;
    text-decoration: none !important; width: 100% !important;
    display: flex !important; justify-content: space-between !important; align-items: center !important;
}
/* coupon ::before hack removed */
.woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon::after {
    content: "" !important; display: block !important;
    width: 6px; height: 6px; border-right: 2px solid #64748b; border-bottom: 2px solid #64748b;
    transform: rotate(45deg); margin-bottom: 2px;
}
form.checkout_coupon {
    background-color: #ffffff !important; border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important; padding: 10px !important;
    margin-bottom: 20px !important; margin-top: 0 !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.02) !important;
    display: flex !important; gap: 10px !important; align-items: center !important;
}
/* Permite que o JavaScript do WooCommerce oculte a caixa de cupom */
form.checkout_coupon[style*="display: none"],
form.checkout_coupon[style*="none"] { 
    display: none !important; 
}
form.checkout_coupon p.form-row { margin: 0 !important; padding: 0 !important; }
form.checkout_coupon p.form-row-first { flex: 1 !important; width: 100% !important; }
form.checkout_coupon p.form-row-last { width: auto !important; }
form.checkout_coupon button.button {
    height: 42px !important; border-radius: 50px !important;
    background-color: var(--color-primary, #F96A00) !important; color: #fff !important;
    padding: 0 24px !important; font-weight: 600 !important;
    border: none !important; cursor: pointer !important; white-space: nowrap !important;
}

/* ==========================================
   5. BOTÃO DE FINALIZAR E TERMOS
   ========================================== */
#place_order {
    background-color: var(--color-primary, #F96A00) !important;
    color: #ffffff !important;
    border-radius: 50px !important;
    height: 52px !important;
    padding: 0 25px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    width: 100% !important;
    border: none !important;
    cursor: pointer !important;
    margin-top: 20px !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}
#place_order:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 20px rgba(249, 106, 0, 0.25) !important; 
}

input[type="radio"], input[type="checkbox"] {
    appearance: none !important; -webkit-appearance: none !important;
    width: 20px !important; height: 20px !important;
    border-radius: 50% !important; border: 2px solid #94a3b8 !important;
    background-color: #ffffff !important; cursor: pointer !important;
    vertical-align: middle !important; margin-right: 8px !important;
}
input[type="checkbox"] { border-radius: 4px !important; }
input[type="radio"]:checked, input[type="checkbox"]:checked {
    border: 2px solid var(--color-primary, #F96A00) !important;
    background-color: var(--color-primary, #F96A00) !important;
    box-shadow: inset 0 0 0 4px #ffffff !important;
}
.woocommerce-terms-and-conditions-link,
.woocommerce-privacy-policy-text a {
    color: var(--color-primary, #F96A00) !important;
    text-decoration: underline !important; font-weight: 600 !important;
    transition: color 0.3s ease !important;
}

.woocommerce-terms-and-conditions-link:hover,
.woocommerce-privacy-policy-text a:hover {
    color: var(--color-primary-hover, #D95A00) !important;
}

/* ==========================================
   6. RESPONSIVIDADE E POSIÇÕES FIXAS
   ========================================== */
@media (min-width: 901px) {
    body.woocommerce-checkout .woocommerce { position: relative !important; }
    form.woocommerce-checkout { margin-top: 0 !important; }
    .woocommerce-form-coupon-toggle {
        position: absolute !important; top: 0 !important; right: 0 !important;
        width: 400px !important; max-width: 400px !important; margin: 0 !important;
    }
    form.checkout_coupon {
        position: absolute !important; top: 50px !important; right: 0 !important;
        width: 400px !important; max-width: 400px !important; z-index: 999 !important;
    }
    /* Abre buraco para o botão do cupão */
    #order_review { margin-top: 55px !important; }
}

@media (max-width: 900px) {
    form.woocommerce-checkout { flex-direction: column !important; width: 100% !important; }
    #customer_details, #order_review { width: 100% !important; min-width: 100% !important; }
    .woocommerce form .form-row { width: 100% !important; order: unset !important; }
}
/* ==========================================
   QUEM SOMOS
   ========================================== */
   .rp-about-wrapper {
    max-width: 900px;
    margin: 40px auto;
    padding: 0 20px;
    font-family: var(--font-main, 'Inter', sans-serif);
    color: #2c2c2c;
}

.rp-about-hero {
    text-align: center;
    margin-bottom: 60px;
}

.rp-about-tag {
    display: inline-block;
    font-size: 0.85rem;
    font-weight: 700;
    color: #f96a00;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 15px;
}

.rp-about-title {
    font-family: 'DM Serif Display', Georgia, serif;
    font-size: 2.5rem;
    line-height: 1.2;
    color: #2c2c2c;
    margin-bottom: 20px;
}

.rp-about-lead {
    font-size: 1.1rem;
    color: #665;
    line-height: 1.6;
    max-width: 700px;
    margin: 0 auto;
}

.rp-about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
    background: #F9F6F0;
    padding: 40px;
    border-radius: 16px;
    /* Sombra elegante em camadas com um leve tom quente */
    box-shadow: 0 15px 35px rgba(249, 106, 0, 0.06), 0 5px 15px rgba(0, 0, 0, 0.04);
    /* Borda sutil opcional para refinar o acabamento */
    border: 1px solid rgba(249, 106, 0, 0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Efeito suave ao passar o mouse por cima do card */
.rp-about-grid:hover {
    transform: translateY(-3px);
    box-shadow: 0 20px 40px rgba(249, 106, 0, 0.1), 0 8px 50px rgba(0, 0, 0, 0.06);
}

.rp-about-image-box img.rp-about-img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
    display: block;
}

.rp-about-text-box h3 {
    font-family: 'DM Serif Display', Georgia, serif;
    font-size: 1.8rem;
    color: #2c2c2c;
    margin-bottom: 15px;
}

.rp-about-text-box p {
    font-size: 1rem;
    color: #665;
    line-height: 1.6;
    margin-bottom: 15px;
}

/* Responsivo para celulares */
@media (max-width: 768px) {
    .rp-about-grid {
        grid-template-columns: 1fr;
        padding: 20px;
    }
    .rp-about-title {
        font-size: 2rem;
    }
}
/* ==========================================
   MENSAGEM FINAL - QUEM SOMOS
   ========================================== */
.rp-mensagem-final {
  text-align: center;
  margin-top: 80px;
  margin-bottom: 40px;
}

.rp-mensagem-final p {
  font-family: 'DM Serif Display', Georgia, serif;
  font-size: 2.3rem;
  color: #2c2c2c;
  line-height: 1.5;
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); 
}

.rp-mensagem-final p .rp-highlight-primary {
  color: var(--color-primary);
}

/* ==========================================================================
   OCULTAR FRETE FORA DO CHECKOUT (Carrinho e Produto)
   ========================================================================== */
.woocommerce-cart .cart-totals tr.shipping,
.woocommerce-cart .woocommerce-shipping-calculator,
.woocommerce-cart #calc_shipping_country_field,
#woocommerce-correios-calculo-de-frete-na-pagina-do-produto,
.single-product .shipping-calculator,
.single-product .melhor-envio-calculator {
    display: none !important;
}

/* ==========================================================================
   ESTILO DOS METODOS DE FRETE (Modernizar/Tirar negrito)
   ========================================================================== */
ul#shipping_method li label {
    font-weight: 400 !important;
    color: #4a5568 !important;
    font-size: 0.9rem !important;
    line-height: 1.6 !important;
}

/* ==========================================================================
   AJUSTE DE LARGURA DA TABELA (Prevenir que o texto do produto esprema)
   ========================================================================== */
table.woocommerce-checkout-review-order-table th.product-name,
table.woocommerce-checkout-review-order-table td.product-name {
    width: 60% !important;
}
table.woocommerce-checkout-review-order-table th.product-total,
table.woocommerce-checkout-review-order-table td.product-total {
    width: 40% !important;
    word-break: break-word !important;
}
ul#shipping_method li label {
    white-space: normal !important;
}

/* ==========================================
   7. CORREÇÃO CHECKBOX MERCADO PAGO
   ========================================== */
.woocommerce-checkout #payment input[type="checkbox"] {
    appearance: none !important; -webkit-appearance: none !important;
    display: inline-block !important; box-sizing: border-box !important;
    width: 20px !important; height: 20px !important;
    min-width: 20px !important; max-width: none !important;
    flex-shrink: 0 !important; padding: 0 !important;
    border: 2px solid #94a3b8 !important;
    background-color: #ffffff !important;
    opacity: 1 !important; visibility: visible !important;
    border-radius: 4px !important; margin: 0 8px 0 0 !important;
}

.woocommerce-checkout #payment input[type="checkbox"]:checked {
    border: 2px solid var(--color-primary, #F96A00) !important;
    background-color: var(--color-primary, #F96A00) !important;
    box-shadow: inset 0 0 0 4px #ffffff !important;
}

/* ==========================================
   TELA DE OBRIGADO (THANK YOU PAGE)
========================================== */
.rp-thankyou-banner {
    background-color: transparent;
    border: none;
    padding: 10px 20px 30px 20px;
    text-align: center;
    margin-bottom: 20px;
    border-bottom: 1px solid #f1f5f9;
}

.rp-thankyou-banner h2 {
    color: var(--color-primary, #F96A00) !important;
    font-size: 2rem !important;
    margin-bottom: 10px !important;
    font-family: var(--font-heading), 'DM Serif Display', serif !important;
}

.rp-thankyou-banner p {
    color: #475569;
    font-size: 1.1rem;
    margin-bottom: 25px;
}

.rp-whatsapp-btn {
    display: inline-block;
    background-color: #25D366;
    color: #ffffff !important;
    font-weight: bold;
    font-size: 1.1rem;
    padding: 12px 24px;
    border-radius: 50px;
    text-decoration: none !important;
    transition: all 0.3s ease;
    box-shadow: 0 4px 10px rgba(37, 211, 102, 0.3);
}

.rp-whatsapp-btn:hover {
    background-color: #1ebe57;
    transform: translateY(-3px);
    box-shadow: 0 6px 15px rgba(37, 211, 102, 0.4);
}

/* Limpa o visual feio padrao do aviso de sucesso */
p.woocommerce-notice--success.woocommerce-thankyou-order-received {
    border-top-color: transparent !important;
    background-color: transparent !important;
    padding: 0 !important;
}
p.woocommerce-notice--success.woocommerce-thankyou-order-received::before {
    display: none !important;
}

/* ==========================================
   TELA DE OBRIGADO - DETALHES DO PEDIDO (FIGMA STYLE)
========================================== */

/* Container principal (fundo transparente para no quebrar o bege do site) */
.woocommerce-order {
    background: transparent !important;
    border: none;
    padding: 0;
    box-shadow: none !important;
    margin-bottom: 50px;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

/* 1. TOPO: Resumo do Pedido (Nmero, Data, Email, Total, Pagamento) */
ul.woocommerce-order-overview.order_details {
    display: flex;
    justify-content: space-between;
    background: #ffffff;
    border: 1px solid #eaeaea;
    border-radius: 12px;
    padding: 20px 0;
    list-style: none;
    margin-bottom: 50px;
}
ul.woocommerce-order-overview.order_details li {
    flex: 1;
    border-right: 1px solid #eaeaea;
    padding: 0 30px;
    font-family: var(--font-main), 'Inter', sans-serif;
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--color-primary, #F96A00);
    text-transform: uppercase;
    letter-spacing: 1px;
}
ul.woocommerce-order-overview.order_details li:last-child {
    border-right: none;
}
ul.woocommerce-order-overview.order_details li strong {
    display: block;
    margin-top: 8px;
    font-size: 0.95rem;
    color: #111;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
}

/* 2. TITULOS DE SECAO (SEU PEDIDO e COBRANCA/ENTREGA) */
.woocommerce-order-details__title,
.woocommerce-customer-details h2 {
    font-family: var(--font-heading), 'DM Serif Display', serif !important;
    font-size: 2.2rem !important;
    color: #2c2c2c !important;
    border-bottom: none !important;
    margin-bottom: 25px !important;
    position: relative;
    padding-bottom: 0 !important;
}
.woocommerce-order-details__title::before {
    content: "SEU PEDIDO";
    display: block;
    font-family: var(--font-main), sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--color-primary, #F96A00);
    letter-spacing: 2px;
    margin-bottom: 10px;
    text-transform: uppercase;
}

/* Design da Tabela */
.woocommerce-order table.shop_table {
    border: none !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    width: 100%;
    margin-bottom: 30px;
    border-radius: 8px;
    overflow: hidden;
}

/* Cabeçalho da tabela (Produto / Total) */
.woocommerce-order table.shop_table th {
    background-color: #f8fafc !important;
    color: #334155 !important;
    font-family: var(--font-main), 'Inter', sans-serif !important;
    font-weight: 700 !important;
    padding: 16px 20px !important;
    border-bottom: 2px solid #e2e8f0 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
}

/* Linhas da tabela */
.woocommerce-order table.shop_table td {
    padding: 20px !important;
    border-bottom: 1px solid #f1f5f9 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    color: #475569 !important;
    font-family: var(--font-main), 'Inter', sans-serif !important;
    font-size: 0.95rem;
    vertical-align: top;
}

/* Remove borda do último item para não encavalar com o rodapé da tabela */
.woocommerce-order table.shop_table tbody tr:last-child td {
    border-bottom: none !important;
}

/* Rodapé da Tabela (Subtotal, Frete, Pagamento, Total) */
.woocommerce-order table.shop_table tfoot th,
.woocommerce-order table.shop_table tfoot td {
    border-top: 1px solid #e2e8f0 !important;
    border-bottom: none !important;
    background-color: #ffffff !important;
}

.woocommerce-order table.shop_table tfoot th {
    color: #334155 !important;
    font-weight: 600 !important;
    text-align: left;
}

.woocommerce-order table.shop_table tfoot td {
    color: #0f172a !important;
    font-weight: 500 !important;
}

/* Destaque para o valor TOTAL final */
.woocommerce-order table.shop_table tfoot tr:last-child th,
.woocommerce-order table.shop_table tfoot tr:last-child td {
    font-size: 1.2rem;
    color: var(--color-primary, #F96A00) !important;
    font-weight: 700 !important;
    border-top: 2px solid #e2e8f0 !important;
    padding-top: 20px !important;
}

/* Links na tabela (Nome do Produto) */
.woocommerce-order table.shop_table td.product-name a {
    color: var(--color-primary, #F96A00) !important;
    font-weight: 700;
    text-decoration: none !important;
    font-size: 1.05rem;
    display: inline-block;
    margin-bottom: 8px;
}

.woocommerce-order table.shop_table td.product-name a:hover {
    color: var(--color-primary-hover, #D95A00) !important;
    text-decoration: underline !important;
}

/* Metadados (Moldura, Cor, Vidro) */
.woocommerce-order table.shop_table ul.wc-item-meta {
    list-style: none !important;
    padding: 0 !important;
    margin: 10px 0 0 0 !important;
    font-size: 0.85rem;
    background: #f8fafc;
    padding: 12px 15px !important;
    border-radius: 6px;
    border: 1px dashed #cbd5e1;
}

.woocommerce-order table.shop_table ul.wc-item-meta li {
    margin-bottom: 6px !important;
    color: #64748b !important;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.woocommerce-order table.shop_table ul.wc-item-meta li:last-child {
    margin-bottom: 0 !important;
}

.woocommerce-order table.shop_table ul.wc-item-meta li strong,
.woocommerce-order table.shop_table ul.wc-item-meta li p.wc-item-meta-label {
    color: #334155 !important;
    font-weight: 600 !important;
    margin: 0 !important;
}

/* 4. ENDERECOS DE COBRANCA E ENTREGA */
.woocommerce-customer-details {
    margin-top: 50px;
}
.woocommerce-customer-details .col2-set {
    display: flex;
    gap: 30px;
    width: 100%;
}
.woocommerce-customer-details .col-1,
.woocommerce-customer-details .col-2 {
    flex: 1;
    width: 100% !important;
    float: none !important;
}
.woocommerce-customer-details .woocommerce-column--billing-address h2::before {
    content: "COBRANÇA";
    display: block;
    font-family: var(--font-main), sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--color-primary, #F96A00);
    letter-spacing: 2px;
    margin-bottom: 10px;
}
.woocommerce-customer-details .woocommerce-column--shipping-address h2::before {
    content: "ENTREGA";
    display: block;
    font-family: var(--font-main), sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--color-primary, #F96A00);
    letter-spacing: 2px;
    margin-bottom: 10px;
}
.woocommerce-customer-details address {
    background: #ffffff;
    border: 1px solid #eaeaea;
    border-radius: 12px;
    padding: 30px;
    font-style: normal;
    font-family: var(--font-main), 'Inter', sans-serif;
    font-size: 0.85rem;
    color: #888888;
    line-height: 1.8;
}
.woocommerce-customer-details address::first-line {
    font-size: 0.9rem;
    color: #333333;
    font-weight: 700;
    text-transform: uppercase;
}
.woocommerce-customer-details address p {
    margin: 0 !important;
    padding: 0 !important;
}

/* Mobile Adjustments */
@media (max-width: 768px) {
    ul.woocommerce-order-overview.order_details {
        flex-direction: column;
        padding: 20px;
    }
    ul.woocommerce-order-overview.order_details li {
        border-right: none;
        border-bottom: 1px solid #eaeaea;
        padding: 15px 0;
    }
    ul.woocommerce-order-overview.order_details li:last-child {
        border-bottom: none;
    }
    .woocommerce-order table.shop_table th, 
    .woocommerce-order table.shop_table td {
        padding: 12px 10px !important;
    }
    .woocommerce-customer-details .col2-set {
        flex-direction: column;
    }
}

/* Esconder instrucoes duplicadas e quebradas do Pix embaixo da tabela */
.woocommerce-order table.shop_table.order_details ~ img,
.woocommerce-order table.shop_table.order_details ~ p,
.woocommerce-order table.shop_table.order_details ~ br { display: none !important; }

/* Oculta o Pix QUEBRADO (textos perdidos) entre a tabela e os endereços */
.woocommerce-order table.shop_table.order_details ~ * { display: none !important; }
.woocommerce-order table.shop_table.order_details ~ section.woocommerce-customer-details { display: block !important; }





/* ==========================================
   BLOQUEIO DE ROLAGEM HORIZONTAL
========================================== */
html, body {
    overflow-x: clip !important;
    position: relative !important;
}

/* ==========================================
   POSICIONAMENTO DA CAIXA DE ERRO (DIREITA)
========================================== */
/* Transforma o flexbox do checkout em um Grid para controlar a posição do aviso */
form.woocommerce-checkout {
    display: grid !important;
    grid-template-columns: 1fr 450px !important;
    grid-template-rows: min-content auto !important;
    column-gap: 40px !important;
    row-gap: 20px !important;
    align-items: start !important;
}

#customer_details {
    grid-column: 1 / 2 !important;
    grid-row: 1 / 3 !important; /* Ocupa as duas linhas na esquerda */
}

.woocommerce-NoticeGroup {
    grid-column: 2 / 3 !important;
    grid-row: 1 / 2 !important; /* Ocupa o topo da direita (acima do resumo) */
    width: 100% !important;
    margin: 0 !important;
}

#order_review {
    grid-column: 2 / 3 !important;
    grid-row: 2 / 3 !important; /* Fica logo abaixo da caixa de erro */
    width: 100% !important;
    margin: 0 !important;
}

/* Restaura o layout em colunas para celulares */
@media (max-width: 900px) {
    form.woocommerce-checkout {
        display: flex !important;
        flex-direction: column !important;
    }
    .woocommerce-NoticeGroup {
        order: -1 !important; /* No celular, o erro deve aparecer no topo de tudo */
        width: 100% !important;
    }
    #customer_details {
        order: 2 !important;
    }
    #order_review {
        order: 3 !important;
    }
}

/* ==========================================
   POSICIONAMENTO DO BOTÃO REMOVER (CARRINHO)
========================================== */
table.shop_table.cart tbody tr {
    position: relative !important;
}
table.shop_table.cart td.product-remove {
    position: absolute !important;
    right: 0 !important;
    bottom: 25px !important; /* Mesma distância do padding inferior da linha */
    width: auto !important;
    border: none !important;
    padding: 0 10px 0 0 !important;
    text-align: right !important;
}
/* No desktop, o X vai para a direita. Para evitar sobreposição, empurramos a área de variações um pouco para cima se necessário, ou apenas deixamos o X no canto inferior direito livre. */

table.shop_table.cart th.product-remove {
    display: none !important;
    width: 0 !important;
    padding: 0 !important;
}

/* ==========================================
   FIX DO BOTÃO REMOVER (MOBILE)
========================================== */
@media (max-width: 768px) {
    table.shop_table.cart tbody tr {
        padding-top: 45px !important; /* Cria um teto seguro para o X */
    }
    table.shop_table.cart td.product-remove {
        bottom: auto !important;
        top: 10px !important; /* Joga o X para o topo do card */
        right: 10px !important;
    }
}

/* ==========================================
   POSICIONAMENTO DO AVISO DE CUPOM NO CARRINHO
========================================== */
body.woocommerce-cart .woocommerce {
    display: grid !important;
    grid-template-columns: 1fr 400px !important;
    grid-template-rows: min-content auto !important;
    column-gap: 60px !important;
    row-gap: 20px !important;
    align-items: start !important;
}

body.woocommerce-cart .woocommerce-notices-wrapper {
    grid-column: 2 / 3 !important;
    grid-row: 1 / 2 !important;
    width: 100% !important;
    margin: 0 !important;
}

body.woocommerce-cart form.woocommerce-cart-form {
    grid-column: 1 / 2 !important;
    grid-row: 1 / 3 !important;
    width: 100% !important;
}

body.woocommerce-cart .cart-collaterals {
    grid-column: 2 / 3 !important;
    grid-row: 2 / 3 !important;
    width: 100% !important;
    margin: 0 !important;
}

@media (max-width: 900px) {
    body.woocommerce-cart .woocommerce {
        display: flex !important;
        flex-direction: column !important;
    }
    body.woocommerce-cart .woocommerce-notices-wrapper {
        order: -1 !important;
        width: 100% !important;
        margin-bottom: 20px !important;
    }
    body.woocommerce-cart form.woocommerce-cart-form {
        order: 2 !important;
    }
    body.woocommerce-cart .cart-collaterals {
        order: 3 !important;
    }
}

/* ==========================================================================
   12. WOOCOMMERCE - CARRINHO VAZIO PADRÃO (NOVO DESIGN)
   ========================================================================== */

/* 1. O Container Principal (Card) */
body.woocommerce-cart .woocommerce:has(.cart-empty) {
    background: transparent !important;
    border-radius: 16px !important;
    padding: 60px 30px !important;
    max-width: 600px !important;
    margin: 40px auto 80px auto !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    box-shadow: none !important;
}

/* 2. O Título (Aproveitando a div padrão do WooCommerce) */
body.woocommerce-cart .woocommerce:has(.cart-empty) .cart-empty {
    font-family: var(--font-heading), 'DM Serif Display', serif !important;
    font-size: 2.2rem !important;
    color: #333 !important;
    line-height: 1.2 !important;
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    box-shadow: none !important;
    margin-bottom: 25px !important;
}

/* 3. O Ícone Laranja em SVG (Substituindo o ícone padrão pelo ::before) */
body.woocommerce-cart .woocommerce:has(.cart-empty) .cart-empty::before {
    content: "" !important;
    display: block !important;
    width: 90px !important;
    height: 90px !important;
    background-color: #FFF0E6 !important;
    border-radius: 50% !important;
    margin: 0 auto 25px auto !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F96A00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='21' r='1'%3E%3C/circle%3E%3Ccircle cx='20' cy='21' r='1'%3E%3C/circle%3E%3Cpath d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'%3E%3C/path%3E%3C/svg%3E") !important;
    background-size: 40px !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    position: static !important;
}

/* 4. A Descrição Customizada (Adicionada via ::after) */
body.woocommerce-cart .woocommerce:has(.cart-empty) .cart-empty::after {
    content: "Você ainda não escolheu nenhum produto para eternizar o seu pet. Que tal dar uma olhada nas nossas opções?" !important;
    display: block !important;
    font-family: var(--font-main), 'Inter', sans-serif !important;
    font-size: 1.05rem !important;
    color: #888 !important;
    max-width: 450px !important;
    line-height: 1.6 !important;
    margin: 15px auto 0 auto !important;
    font-weight: normal !important;
}

/* 5. O Botão de Retorno */
body.woocommerce-cart .woocommerce:has(.cart-empty) .return-to-shop {
    margin: 0 !important;
}
body.woocommerce-cart .woocommerce:has(.cart-empty) .return-to-shop .button {
    background-color: var(--color-primary, #F96A00) !important;
    color: #ffffff !important;
    border-radius: 30px !important;
    padding: 16px 40px !important;
    font-family: var(--font-main), 'Inter', sans-serif !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
    display: inline-block !important;
    transition: all 0.3s ease !important;
}

body.woocommerce-cart .woocommerce:has(.cart-empty) .return-to-shop .button:hover {
    transform: translateY(-2px) !important;
}

/* ==========================================
   OCULTAR BOTÃO "VER CARRINHO" REDUNDANTE
========================================== */
body.woocommerce-cart .woocommerce-message .button.wc-forward {
    display: none !important;
}

/* ==========================================
   AUTO-OCULTAR AVISOS (CARRINHO E CHECKOUT)
========================================== */
body.woocommerce-cart .woocommerce-message,
body.woocommerce-cart .woocommerce-error,
body.woocommerce-cart .woocommerce-info,
body.woocommerce-checkout .woocommerce-message,
body.woocommerce-checkout .woocommerce-error,
body.woocommerce-checkout .woocommerce-info {
    animation: rpFadeOutNotice 8s ease-in-out forwards !important;
    overflow: hidden !important;
}

@keyframes rpFadeOutNotice {
    0% { 
        opacity: 1; 
        max-height: 500px; 
    }
    85% { 
        opacity: 1; 
        max-height: 500px; 
        margin-bottom: 2em; 
        padding-top: 1em; 
        padding-bottom: 1em; 
    }
    100% { 
        opacity: 0; 
        max-height: 0; 
        margin-bottom: 0; 
        padding-top: 0; 
        padding-bottom: 0; 
        border-top-width: 0;
        border-bottom-width: 0;
        visibility: hidden; 
    }
}

/* ==========================================
   FIX: IMPEDIR QUE O CARRINHO VAZIO SUMA
========================================== */
body.woocommerce-cart .cart-empty.woocommerce-info {
    animation: none !important;
    overflow: visible !important;
    max-height: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* ==========================================
   CUSTOMIZAÇÃO DO MERCADO PAGO - SUCESSO PIX (100% CSS)
========================================== */

/* 1. Remove a borda/outline apenas do card de aprovação */
.woocommerce-order .mp-pix-approved-card {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* 2. Oculta o título original e injeta o novo texto instantaneamente */
.woocommerce-order .mp-pix-approved-title {
    font-size: 0 !important;
    color: transparent !important;
    margin-bottom: 10px !important;
    display: block !important;
}

.woocommerce-order .mp-pix-approved-title::after {
    content: "Oba! Pagamento aprovado com sucesso! 🎉" !important;
    font-size: 2.2rem !important;
    color: var(--color-primary, #F96A00) !important;
    font-family: var(--font-heading), 'DM Serif Display', serif !important;
    display: block !important;
    visibility: visible !important;
    line-height: 1.2 !important;
}

/* 3. Substitui o texto da descrição (Seu pagamento com PIX foi aprovado...) */
/* Como a descrição geralmente é um <p> ou <span> logo abaixo do título: */
.woocommerce-order .mp-pix-approved-card > p,
.woocommerce-order .mp-pix-approved-card > span,
.woocommerce-order .mp-pix-approved-card > div:not(.mp-pix-approved-title) {
    font-size: 0 !important;
    color: transparent !important;
    display: block !important;
}

.woocommerce-order .mp-pix-approved-card > p::after,
.woocommerce-order .mp-pix-approved-card > span::after,
.woocommerce-order .mp-pix-approved-card > div:not(.mp-pix-approved-title)::after {
    content: "Nossa equipe já recebeu o seu pedido e iremos te enviar uma mensagem no WhatsApp em breve para confirmar a sua arte." !important;
    font-size: 1.15rem !important;
    color: #475569 !important;
    font-family: var(--font-main), 'Inter', sans-serif !important;
    display: block !important;
    visibility: visible !important;
    line-height: 1.6 !important;
}

/* ==========================================
   CORREO DO "SEM NMERO" (MERCADO PAGO BOLETO)
========================================== */
/* Puxa o container do Mercado Pago para baixo (tira a flutuao) */


/* Limpa o fundo branco e ajeita o texto */


/* ==========================================
   REDUZIR ESPAÇAMENTO ENTRE CAMPOS (MERCADO PAGO)
========================================== */
/* Reduz o espaço abaixo do campo de CPF */
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-input-document {
    margin-bottom: 15px !important; 
}
/* Reduz o espaço entre todas as linhas de endereço (CEP, Cidade, Rua, etc) */
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container > div {
    margin-bottom: 15px !important; 
}
/* Exceção de segurança: Mantém o espaço apenas da última linha (Número) 
   para garantir que o texto "Sem número" e os erros de validação não encavalem */
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-input-row:last-child,
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-input-number {
    margin-bottom: 35px !important; 
}
/* ==========================================
   CONSERTO DEFINITIVO DO GRID NO CELULAR (MERCADO PAGO)
========================================== */
/* 1. Força as linhas a quebrarem no celular para não esmagar os campos */
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-input-row {
    flex-wrap: wrap !important;
    gap: 15px !important;
}

/* 2. Força as colunas (Estado, Bairro, Número) a terem um tamanho mínimo e dividirem o espaço */
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-input-column,
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-input-number {
    flex: 1 1 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* 3. Garante que os inputs de texto preencham suas colunas sem vazar */
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container input[type="text"],
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container select {
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 4. Afasta o botão "Sem número" para não morder a borda da caixa */







/* ==========================================
   SOLUÇÃO DEFINITIVA: CHECKBOX ANCORADO FORA DA CAIXA
========================================== */
/* 1. Impede qualquer tipo de corte (guilhotina) nos containers pais */
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-input-column,
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-input-number {
    position: relative !important;
    overflow: visible !important; 
    clip-path: none !important;
    margin-bottom: 40px !important; /* Cria um buraco invisível embaixo para o botão caber sem morder o Complemento */
}

/* 2. Arranca o botão de dentro da caixa e crava ele 55px para baixo do topo (não se move se a caixa encolher) */









#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container {
    overflow: visible !important;
}

/* 3. A SOLUÇÃO MÁXIMA: Falso Checkbox desenhado direto no Texto */
/* Oculta o verdadeiro checkbox que o Mercado Pago tenta apagar, mas o deixa clicável cobrindo todo o texto */


#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-number-toggle-checkbox input,
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-number-toggle-checkbox [type="checkbox"],
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-number-toggle-checkbox svg {
    position: absolute !important;
    opacity: 0 !important; 
    width: 100% !important;
    height: 100% !important;
    z-index: 10 !important;
    cursor: pointer !important;
    left: 0 !important;
    top: 0 !important;
}

/* Desenha o checkbox falso pendurado na letra P. Como o P não some, o checkbox nunca some! */




/* Quando o input verdadeiro (invisível) for marcado, muda a cor do nosso checkbox falso */


/* Ajuste de Alinhamento e Espaçamento do Texto (Para não amassar nem centralizar) */




/* ALINHAMENTO DEFINITIVO DA CAIXA E DO TEXTO */
/* O wrapper inteiro fica ancorado na extrema esquerda, e dá 32px de espaço interno para o texto não ser esmagado */
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-number-toggle-checkbox {
    position: absolute !important;
    top: 55px !important; 
    left: 0 !important;
    right: auto !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    background: transparent !important;
    margin: 0 !important;
    padding: 0 0 0 32px !important; /* Espaço para a caixinha falsa na esquerda */
    box-sizing: border-box !important;
    transform: none !important;
    z-index: 99 !important;
}

#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-number-toggle-checkbox p {
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
    transform: none !important;
}

/* Ocultar input verdadeiro cobrindo todo o wrapper */
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-number-toggle-checkbox input,
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-number-toggle-checkbox [type="checkbox"],
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-number-toggle-checkbox svg {
    position: absolute !important;
    opacity: 0 !important; 
    width: 100% !important;
    height: 100% !important;
    z-index: 10 !important;
    cursor: pointer !important;
    left: 0 !important;
    top: 0 !important;
    margin: 0 !important;
}

/* Desenhar a caixinha falsa no próprio wrapper, travada na extrema esquerda (left: 0) */
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-number-toggle-checkbox::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 20px !important;
    height: 20px !important;
    border-radius: 4px !important;
    border: 2px solid #94a3b8 !important;
    background-color: #ffffff !important;
    box-sizing: border-box !important;
    transition: all 0.2s ease !important;
}

/* Cor da caixinha quando marcado (Laranja) */
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-number-toggle-checkbox:has(input:checked)::before,
#mp-checkout-ticket-root .mp-checkout-ticket-content .mp-checkout-ticket-address-container .mp-checkout-ticket-billing-number-toggle-checkbox:has([type="checkbox"]:checked)::before {
    border: 2px solid var(--color-primary, #F96A00) !important;
    background-color: var(--color-primary, #F96A00) !important;
    box-shadow: inset 0 0 0 4px #ffffff !important;
}







/* Ocultar a mensagem de erro fornecida (mp-helper-message) dentro do boleto */
#mp-checkout-ticket-root .mp-helper-message,
#mp-checkout-ticket-root .mp-helper-icon {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

.rp-sticky-right .quantity {
    display: none !important;
}
/* ==========================================
   BOTAO DE COPIAR PIX E CAIXA DE TEXTO DO PIX
========================================== */
.woocommerce-order #copy_qr_code,
.woocommerce-order .copy_qr_code,
.woocommerce-order .mp-btn-copy,
.woocommerce-order button[onclick*="copy"],
.woocommerce-order button[onclick*="copiar"],
.woocommerce-order .mp-checkout-ticket-content button,
.woocommerce-order button.copy-button {
    background-color: var(--color-primary, #F96A00) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 12px 28px !important;
    font-family: var(--font-main), 'Inter', sans-serif !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(249, 106, 0, 0.2) !important;
    text-transform: none !important;
    gap: 8px !important;
    margin-left: 10px !important;
}
.woocommerce-order #copy_qr_code:hover,
.woocommerce-order .copy_qr_code:hover,
.woocommerce-order .mp-btn-copy:hover,
.woocommerce-order button[onclick*="copy"]:hover,
.woocommerce-order button[onclick*="copiar"]:hover,
.woocommerce-order .mp-checkout-ticket-content button:hover,
.woocommerce-order button.copy-button:hover {
    background-color: var(--color-primary-hover, #D95A00) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(249, 106, 0, 0.3) !important;
}

.woocommerce-order input[type="text"][id*="pix"],
.woocommerce-order input[type="text"][value*="br.gov.bcb.pix"],
.woocommerce-order .mp-checkout-ticket-content input[type="text"] {
    border: 1px solid #eaeaea !important;
    border-radius: 50px !important;
    padding: 12px 20px !important;
    font-family: var(--font-main) !important;
    font-size: 0.85rem !important;
    color: #888888 !important;
    background: #fcfcfc !important;
}
/* ==========================================
   CORRECAO DO ICONE DE EMAIL/TELEFONE NOS ENDERECOS
========================================== */
.woocommerce-customer-details address p.woocommerce-customer-details--phone,
.woocommerce-customer-details address p.woocommerce-customer-details--email {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    text-indent: 0 !important;
    margin-top: 8px !important;
}
.woocommerce-customer-details address p.woocommerce-customer-details--phone::before,
.woocommerce-customer-details address p.woocommerce-customer-details--email::before,
.woocommerce-customer-details address p.woocommerce-customer-details--phone svg,
.woocommerce-customer-details address p.woocommerce-customer-details--email svg,
.woocommerce-customer-details address p.woocommerce-customer-details--phone i,
.woocommerce-customer-details address p.woocommerce-customer-details--email i {
    position: static !important;
    margin: 0 !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
}

