/* ==============================================================================
   TEMA VITRINE (Opção B, escolhida em 07/11/2026)
   Fundo cinza claro, conteúdo em cartões brancos arredondados, botões em pílula
   verde-escuro, letra Manrope. Só é carregado quando o tema ativo é "vitrine"
   (admin > Configurações, ou prévia com ?tema_previa=vitrine).
   ============================================================================== */

body.theme-vitrine {
    --vt-bg: #F4F5F7;
    --vt-card: #FFFFFF;
    --vt-ink: #111827;
    --vt-muted: #4B5563;
    --vt-line: #E5E7EB;
    --vt-verde: #1F5F4A;
    --vt-verde-esc: #174A39;
    --vt-verde-claro: #E7F1ED;

    /* Reaproveita as variáveis do tema base para o que não for sobrescrito abaixo */
    --primary: #1F5F4A;
    --primary-hover: #174A39;
    --primary-light: #E7F1ED;
    --primary-border: #C9DDD5;
    --dark: #111827;
    --dark-muted: #4B5563;
    --bg-page: #F4F5F7;
    --bg-card: #FFFFFF;
    --border-light: #E5E7EB;
    --cta-green: #1F5F4A;
    --cta-green-hover: #174A39;
    --cta-green-bg: #E7F1ED;
    --radius-md: 14px;
    --radius-lg: 20px;
    --shadow-hover: 0 10px 30px rgba(17, 24, 39, 0.10);

    background: var(--vt-bg);
    color: var(--vt-ink);
    font-family: 'Manrope', 'Plus Jakarta Sans', system-ui, sans-serif;
}

/* Títulos: Manrope em tudo (inclusive blocos com fonte escrita direto no HTML) */
body.theme-vitrine h1,
body.theme-vitrine h2,
body.theme-vitrine h3,
body.theme-vitrine h4,
body.theme-vitrine .section-title,
body.theme-vitrine .product-main-title,
body.theme-vitrine .brand-logo .logo-title {
    font-family: 'Manrope', system-ui, sans-serif !important;
    letter-spacing: -0.02em;
}

/* ---------- Aviso da prévia ---------- */
.vt-previa-aviso {
    background: #FEF3C7;
    color: #78350F;
    font-size: 0.85rem;
    text-align: center;
    padding: 8px 16px;
}
.vt-previa-aviso a { color: #78350F; font-weight: 700; text-decoration: underline; }

/* ---------- Faixa de aviso e topo ---------- */
body.theme-vitrine .top-bar {
    background: var(--vt-ink);
    font-size: 0.8rem;
}
body.theme-vitrine .top-bar strong { color: #6EE7B7; }

body.theme-vitrine .header-main {
    background: var(--vt-card);
    backdrop-filter: none;
    border-bottom: 1px solid var(--vt-line);
}
body.theme-vitrine .navbar-container {
    padding-top: 14px;
    padding-bottom: 14px;
}
body.theme-vitrine .brand-logo .logo-title {
    font-weight: 800;
    font-size: 1.5rem;
    letter-spacing: -0.03em;
    text-transform: lowercase;
}
body.theme-vitrine .brand-logo .logo-title span { color: var(--vt-verde); }
body.theme-vitrine .brand-logo .logo-subtitle { letter-spacing: 1.5px; font-weight: 600; }

body.theme-vitrine .search-wrapper { max-width: 520px; }
body.theme-vitrine .search-input {
    height: 48px;
    background: #FFFFFF;
    border: 1.5px solid #D1D5DB;
    font-size: 0.92rem;
}
body.theme-vitrine .search-input:focus {
    border-color: var(--vt-verde);
    box-shadow: 0 0 0 3px rgba(31, 95, 74, 0.15);
}

/* No topo ficam só conta, WhatsApp e carrinho; simulador e cores vão para a barra de categorias */
body.theme-vitrine .nav-actions .nav-link-orcamento,
body.theme-vitrine .nav-actions .nav-link-mostruario,
body.theme-vitrine .nav-actions .nav-link-garantia,
body.theme-vitrine .nav-actions .nav-link-rastreio { display: none; }
body.theme-vitrine .nav-link-item { color: var(--vt-ink) !important; }
body.theme-vitrine .btn-nav-whatsapp {
    background: var(--vt-verde-claro);
    color: var(--vt-verde);
    border-color: transparent;
    height: 44px;
}
body.theme-vitrine .btn-nav-whatsapp:hover { background: var(--vt-verde); color: #FFFFFF; }
body.theme-vitrine .cart-button-trigger {
    background: var(--vt-bg);
    border-color: transparent;
    height: 44px;
    font-weight: 700;
}
body.theme-vitrine .cart-button-trigger:hover { background: var(--vt-verde-claro); color: var(--vt-verde); }
body.theme-vitrine .cart-badge { background: var(--vt-verde); }

/* Barra de categorias */
.vt-cats { border-top: 1px solid var(--vt-line); background: var(--vt-card); }
.vt-cats-inner {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    gap: 26px;
    overflow-x: auto;
    scrollbar-width: none;
    font-size: 0.9rem;
    font-weight: 600;
}
.vt-cats-inner::-webkit-scrollbar { display: none; }
.vt-cats-inner a {
    padding: 13px 0;
    color: var(--vt-ink);
    white-space: nowrap;
    border-bottom: 2px solid transparent;
    text-decoration: none;
}
.vt-cats-inner a:hover { color: var(--vt-verde); border-bottom-color: var(--vt-verde); }
.vt-cats-inner a.vt-cats-destaque { color: var(--vt-verde); }

/* ---------- Botões ---------- */
.vt-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 52px;
    padding: 0 26px;
    border-radius: 999px;
    font: inherit;
    font-weight: 700;
    font-size: 0.95rem;
    border: 0;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.2s;
}
.vt-btn-verde { background: var(--vt-verde); color: #FFFFFF; }
.vt-btn-verde:hover { background: var(--vt-verde-esc); color: #FFFFFF; }
.vt-btn-branco { background: #FFFFFF; color: var(--vt-ink); }
.vt-btn-branco:hover { background: var(--vt-verde-claro); }

body.theme-vitrine .btn-cta-main,
body.theme-vitrine .btn-primary,
body.theme-vitrine .product-add-to-cart {
    background: var(--vt-verde);
    border-radius: 999px;
    box-shadow: none;
}
body.theme-vitrine .btn-cta-main:hover,
body.theme-vitrine .btn-primary:hover,
body.theme-vitrine .product-add-to-cart:hover { background: var(--vt-verde-esc); }
body.theme-vitrine .btn-secondary { border-radius: 999px; }

/* ---------- Destaque da página inicial ---------- */
.vt-hero-wrap { max-width: 1320px; margin: 0 auto; padding: 20px 20px 0; }
.vt-hero {
    position: relative;
    border-radius: 28px;
    overflow: hidden;
    min-height: 480px;
    display: flex;
    align-items: flex-end;
    background: #1F2937;
}
.vt-hero > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.vt-hero::after { content: ""; position: absolute; inset: 0; background: rgba(17, 24, 39, 0.45); }
.vt-hero-txt {
    position: relative;
    z-index: 1;
    padding: 44px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 640px;
    color: #FFFFFF;
}
.vt-hero-txt h1 {
    margin: 0;
    font-size: clamp(2.1rem, 5vw, 3.9rem);
    line-height: 1.03;
    font-weight: 800;
    letter-spacing: -0.035em;
    color: #FFFFFF;
    text-wrap: balance;
}
.vt-hero-txt p { margin: 0; font-size: 1.1rem; line-height: 1.5; color: #F3F4F6; }
.vt-hero-btns { display: flex; flex-wrap: wrap; gap: 12px; }

.vt-bloco { max-width: 1320px; margin: 0 auto; padding: 48px 20px 0; }
.vt-h2 { margin: 0 0 18px; font-size: 1.75rem; font-weight: 800; color: var(--vt-ink); }
.vt-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.vt-tile {
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-weight: 700;
    font-size: 1rem;
    color: var(--vt-ink);
    text-decoration: none;
}
.vt-tile div { border-radius: 20px; overflow: hidden; background: var(--vt-card); aspect-ratio: 1 / 1; }
.vt-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; }
.vt-tile:hover img { transform: scale(1.04); }
.vt-tile:hover { color: var(--vt-verde); }

/* Faixa de diferenciais: cartões brancos */
body.theme-vitrine .features-strip { background: transparent; border: 0; }
body.theme-vitrine .feature-card { background: var(--vt-card); border-radius: 20px; border: 0; }

/* ---------- Seções e títulos ---------- */
body.theme-vitrine .section-header { text-align: left; max-width: none; margin-bottom: 22px; }
body.theme-vitrine .section-tag { color: var(--vt-verde); letter-spacing: 0.08em; font-weight: 800; }
body.theme-vitrine .section-title { font-size: 1.75rem; font-weight: 800; }
body.theme-vitrine .catalog-section { max-width: 1320px; }

/* ---------- Cartões de produto ---------- */
body.theme-vitrine .products-grid {
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 16px;
}
body.theme-vitrine .product-card {
    border: 0;
    border-radius: 20px;
    padding: 12px;
    background: var(--vt-card);
}
body.theme-vitrine .product-card:hover { transform: none; box-shadow: var(--shadow-hover); }
body.theme-vitrine .product-thumb-wrapper {
    border-radius: 14px;
    border-bottom: 0;
    background: #FFFFFF;
}
/* contain: as fotos de fundo branco não ficam cortadas */
body.theme-vitrine .product-thumb { object-fit: contain; padding: 0; }
body.theme-vitrine .product-card:hover .product-thumb { transform: scale(1.03); }
body.theme-vitrine .badge-deal,
body.theme-vitrine .badge-custom {
    background: var(--vt-verde);
    color: #FFFFFF;
    border-radius: 999px;
    padding: 5px 10px;
    text-transform: none;
    letter-spacing: 0;
    backdrop-filter: none;
}
body.theme-vitrine .product-details { padding: 14px 4px 4px; }
body.theme-vitrine .product-card-title { font-size: 0.95rem; font-weight: 600; }
body.theme-vitrine .product-card-title a { color: var(--vt-ink); }
body.theme-vitrine .product-price-box { border-top: 0; padding-top: 6px; }
body.theme-vitrine .price-pix-val { color: var(--vt-ink); font-size: 1.3rem; }
body.theme-vitrine .price-pix-tag { background: var(--vt-verde-claro); color: var(--vt-verde); border-radius: 999px; }
body.theme-vitrine .btn-card-atc {
    background: #FFFFFF;
    color: var(--vt-verde);
    border: 1.5px solid var(--vt-verde);
    border-radius: 999px;
    height: 44px;
    padding: 0 12px;
}
body.theme-vitrine .btn-card-atc:hover { background: var(--vt-verde); color: #FFFFFF; }

/* ---------- Diferenciais (4 cartões) ---------- */
.vt-difs { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.vt-dif {
    background: var(--vt-card);
    border-radius: 20px;
    padding: 20px;
    display: flex;
    gap: 14px;
    align-items: flex-start;
    color: var(--vt-verde);
}
.vt-dif svg { flex: none; }
.vt-dif b { display: block; color: var(--vt-ink); font-size: 0.98rem; }
.vt-dif span { display: block; color: var(--vt-muted); font-size: 0.86rem; line-height: 1.45; margin-top: 3px; }

/* ---------- Sob medida em 3 passos ---------- */
.vt-eyebrow {
    display: inline-block;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--vt-verde);
}
.vt-passos { background: var(--vt-card); margin-top: 56px; }
.vt-passos-in {
    max-width: 1320px;
    margin: 0 auto;
    padding: 52px 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 36px;
    align-items: center;
}
.vt-passos-intro { flex: 1 1 320px; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.vt-passos-intro h2 { margin: 0 0 6px; font-size: 2rem; line-height: 1.12; font-weight: 800; color: var(--vt-ink); text-wrap: balance; }
.vt-passos-lista { flex: 2 1 520px; display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; }
.vt-passo { background: var(--vt-bg); border-radius: 20px; padding: 22px; display: flex; flex-direction: column; gap: 8px; }
.vt-num {
    width: 40px; height: 40px; border-radius: 999px;
    background: var(--vt-verde); color: #FFFFFF;
    display: grid; place-items: center; font-weight: 800;
}
.vt-passo b { font-size: 1rem; color: var(--vt-ink); }
.vt-passo p { margin: 0; font-size: 0.88rem; color: var(--vt-muted); line-height: 1.5; }

/* ---------- Amostras + garantia ---------- */
.vt-ultimo { padding-bottom: 56px; }
.vt-duo { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; }
.vt-card-amostras,
.vt-card-garantia {
    border-radius: 28px;
    padding: 34px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}
.vt-card-amostras { background: var(--vt-verde-claro); }
.vt-card-garantia { background: var(--vt-card); }
.vt-duo h2 { margin: 0; font-size: 1.6rem; font-weight: 800; color: var(--vt-ink); text-wrap: balance; }
.vt-duo p { margin: 0 0 6px; color: #374151; line-height: 1.6; }
.vt-card-garantia ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
.vt-card-garantia li { position: relative; padding-left: 28px; color: #374151; line-height: 1.5; font-size: 0.93rem; }
.vt-card-garantia li::before {
    content: "";
    position: absolute; left: 0; top: 3px;
    width: 18px; height: 18px; border-radius: 999px;
    background: var(--vt-verde-claro) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231F5F4A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-8'/%3E%3C/svg%3E") center / 12px no-repeat;
}
.vt-card-garantia li b { color: var(--vt-ink); }
.vt-link { color: var(--vt-verde); font-weight: 700; text-decoration: none; margin-top: 4px; }
.vt-link:hover { text-decoration: underline; }

/* ---------- Depoimentos ---------- */
body.theme-vitrine .reviews-section { background: transparent; border: 0; }
body.theme-vitrine .review-card { background: var(--vt-card); border: 0; border-radius: 20px; box-shadow: none; }
body.theme-vitrine .review-verified { color: var(--vt-verde); background: var(--vt-verde-claro); border-radius: 999px; }

/* ---------- Página de produto ---------- */
body.theme-vitrine .product-details-grid > div:last-child {
    background: var(--vt-card);
    border-radius: 28px;
    padding: clamp(18px, 3vw, 32px);
}
body.theme-vitrine .main-photo-container { border: 0; }
body.theme-vitrine .product-category-badge {
    background: var(--vt-verde-claro);
    color: var(--vt-verde);
    border-color: transparent;
}
body.theme-vitrine .main-photo-container,
body.theme-vitrine .gallery-thumb-btn { border-radius: 20px; }
body.theme-vitrine .gallery-thumb-btn { border-radius: 14px; }
body.theme-vitrine .gallery-thumb-btn.active { border-color: var(--vt-verde); }
body.theme-vitrine .product-main-title { font-weight: 800; }
body.theme-vitrine .mdf-option-card,
body.theme-vitrine .medida-option-card { border-radius: 14px; }
body.theme-vitrine .product-add-to-cart { height: 56px; font-weight: 800; }

/* ---------- Carrinho lateral ---------- */
body.theme-vitrine .cart-drawer { background: var(--vt-bg); border-radius: 24px 0 0 24px; }
body.theme-vitrine .drawer-header,
body.theme-vitrine .drawer-footer { background: var(--vt-card); border-color: var(--vt-line); }
body.theme-vitrine .drawer-header h3 { font-weight: 800; }
body.theme-vitrine .drawer-close { border-radius: 999px; }
body.theme-vitrine .shipping-progress-box { background: var(--vt-card); border-radius: 16px; margin: 12px; border: 0; }
body.theme-vitrine .drawer-item {
    background: var(--vt-card);
    border-radius: 18px;
    border: 0;
    padding: 12px;
    margin: 0 12px 10px;
}
body.theme-vitrine .drawer-item-img { border-radius: 12px; }
body.theme-vitrine .btn-checkout-drawer {
    background: var(--vt-verde);
    border-radius: 999px;
    min-height: 54px;
    font-weight: 800;
    box-shadow: none;
}
body.theme-vitrine .btn-checkout-drawer:hover { background: var(--vt-verde-esc); }
body.theme-vitrine .drawer-pix-call { background: var(--vt-verde-claro); color: var(--vt-verde); border-radius: 12px; border: 0; }

/* ---------- Finalizar compra (checkout) ---------- */
body.theme-vitrine.checkout-page { background: var(--vt-bg); }
body.theme-vitrine .checkout-header { background: var(--vt-card); border-bottom-color: var(--vt-line); }
body.theme-vitrine .checkout-card,
body.theme-vitrine .order-summary-card {
    border: 0;
    border-radius: 24px;
    box-shadow: none;
    padding: clamp(18px, 3vw, 28px);
}
body.theme-vitrine .checkout-card-title { font-weight: 800; }
body.theme-vitrine .step-number { background: var(--vt-verde); width: 32px; height: 32px; }
body.theme-vitrine .form-control {
    background: #FFFFFF;
    border: 1.5px solid #D1D5DB;
    border-radius: 12px;
    min-height: 48px;
    font-size: 16px; /* evita o zoom automático do iPhone ao tocar no campo */
}
body.theme-vitrine .form-control:focus { border-color: var(--vt-verde); box-shadow: 0 0 0 3px rgba(31, 95, 74, 0.15); }
body.theme-vitrine .payment-tab { border-radius: 16px; border-color: var(--vt-line); background: #FFFFFF; }
body.theme-vitrine .payment-tab.active { border-color: var(--vt-verde); background: var(--vt-verde-claro); color: var(--vt-verde); }
body.theme-vitrine .pix-benefit-box { border-radius: 16px; border-style: solid; border-color: transparent; }
body.theme-vitrine .summary-item-img { border-radius: 12px; }
body.theme-vitrine .btn-finalize-order {
    background: var(--vt-verde);
    border-radius: 999px;
    min-height: 58px;
    box-shadow: none;
}
body.theme-vitrine .btn-finalize-order:hover { background: var(--vt-verde-esc); }

/* ---------- Rodapé ---------- */
body.theme-vitrine .footer-main { background: var(--vt-ink); }

/* ---------- Celular ---------- */
@media (max-width: 640px) {
    /* Faixa de aviso em uma linha só, deslizando para o lado */
    body.theme-vitrine .top-bar {
        justify-content: flex-start;
        white-space: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
        font-size: 0.75rem;
    }
    body.theme-vitrine .top-bar::-webkit-scrollbar { display: none; }

    /* Topo no celular: logo à esquerda, conta e carrinho à direita na mesma linha, busca embaixo.
       O WhatsApp sai do topo porque já existe o botão verde flutuante e o da barra de baixo. */
    body.theme-vitrine .navbar-container { flex-wrap: wrap; justify-content: space-between; row-gap: 10px; }
    body.theme-vitrine .brand-logo .logo-title { font-size: 1.3rem; }
    body.theme-vitrine .nav-actions { gap: 6px; }
    body.theme-vitrine .nav-actions .btn-nav-whatsapp { display: none; }
    body.theme-vitrine .nav-actions .nav-link-auth {
        width: 44px;
        height: 44px;
        justify-content: center;
        border-radius: 999px;
        background: var(--vt-bg);
    }
    body.theme-vitrine .nav-actions .nav-link-auth span { display: none; }
    body.theme-vitrine .cart-button-trigger { width: auto; min-width: 44px; padding: 0 12px; }
    body.theme-vitrine .search-wrapper { margin: 0; }
    body.theme-vitrine .search-input { height: 46px; font-size: 16px; }
    .vt-cats-inner { padding: 0 14px; gap: 20px; }
    body.theme-vitrine .cart-drawer { border-radius: 0; }
    .vt-hero { min-height: 420px; border-radius: 22px; }
    .vt-hero-txt { padding: 26px 22px; }
    .vt-hero-btns .vt-btn { flex: 1 1 100%; }
    .vt-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    body.theme-vitrine .products-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    body.theme-vitrine .product-card { padding: 8px; border-radius: 16px; }
}

@media (prefers-reduced-motion: reduce) {
    .vt-tile img, .vt-btn { transition: none; }
}