/*
Theme Name: BlackVille
Author: Black Ville
Description: A custom theme for BlackVille with Clean Tech design system and WooCommerce support.
Version: 1.4
*/

:root {
    --bg-global: #F5F5F7;
    --text-primary: #000000;
    --text-secondary: #444444;
    --white: #FFFFFF;
    --glass-bg: rgba(255, 255, 255, 0.90);
    --glass-border: rgba(255, 255, 255, 0.5);
    --font-primary: 'Inter', system-ui, -apple-system, sans-serif;
}

/* MOBILE FIRST: Anti-Overflow */
* {
    box-sizing: border-box;
}

html,
body {
    overflow-x: hidden;
    width: 100%;
    margin: 0;
    padding: 0;
    max-width: 100%;
}

body {
    background-color: var(--bg-global);
    color: var(--text-primary);
    font-family: var(--font-primary);
    line-height: 1.6;
}

/* Espaçamento para o Header Fixo (Desktop) */
@media (min-width: 768px) {
    body {
        padding-top: 100px;
        /* Altura do header para empurrar conteúdo */
    }

    /* HOMEPAGE STANDARDIZATION (110px RULE) */
    body.home {
        padding-top: 110px !important;
    }

    body.home .site-header {
        background-color: #000 !important;
        position: fixed !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }
}

/* Glassmorphism */
.glass-panel {
    background: var(--glass-bg);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--glass-border);
}

/* ===== HEADER (FLOATING) ===== */
/* ===== HEADER ===== */
.site-header {
    position: relative;
    /* Mobile: Não flutua para não cobrir imagem */
    width: 100%;
    z-index: 1000;
    background: #fff;
    /* Fundo sólido no mobile */
}

@media (min-width: 768px) {
    .site-header {
        position: fixed;
        /* Desktop: Flutua transparente */
        top: 0;
        background: transparent;
        transition: background 0.3s ease;
    }
}

.site-header.scrolled {
    /* Background controlado por CSS dinâmico em theme-helpers.php */
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.top-bar {
    background-color: #000;
    color: #fff;
    padding: 10px 3%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.7rem;
    font-weight: 500;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    flex-wrap: wrap;
}

.top-bar a {
    color: #fff;
    text-decoration: none;
    margin-left: 8px;
    opacity: 0.9;
}

.social-icons {
    display: flex;
    gap: 10px;
}

.promo-text {
    font-size: 0.65rem;
    text-align: center;
    flex: 1;
}

.top-links {
    display: flex;
    gap: 8px;
}

.main-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 3%;
    /* Background controlado por CSS dinâmico */
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    /* Linha fina branca em cima */
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    /* Linha fina branca em baixo */
    color: #fff;
}

.site-logo a {
    font-size: 1.4rem;
    font-weight: 800;
    color: #fff;
    /* Texto logo branco fallback */
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: -0.05em;
    display: flex;
    /* Garante alinhamento imagem */
    align-items: center;
}

.main-nav ul {
    display: flex;
    gap: 1.5rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.main-nav a {
    color: #fff;
    /* Links Menu Brancos */
    text-decoration: none;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
}

.header-icons {
    display: flex;
    gap: 15px;
    align-items: center;
    color: #fff;
    /* Garante cor dos SVGs se usarem currentColor */
}

.header-icons a {
    color: #fff !important;
    /* Força bruta branco nos ícones */
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

/* LOGO RESPONSIVA */
.header-logo-img {
    height: 35px !important;
    /* Força Altura Desktop */
    width: auto !important;
    max-width: 200px !important;
    /* Força Trava de largura */
    display: block;
    object-fit: contain;
}

@media (max-width: 768px) {
    .header-logo-img {
        height: 22px !important;
        /* Força Altura Reduzida Mobile */
        max-width: 120px !important;
        /* Força Trava de largura mobile */
    }
}

.cart-count {
    position: absolute;
    top: -5px;
    right: -8px;
    background: #000;
    color: #fff;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    font-size: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}

/* ===== BANNER CAROUSEL (RESPONSIVE GRID STACK) ===== */
.banner-carousel-wrapper {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    -webkit-margin-start: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    -webkit-margin-end: calc(50% - 50vw);
    overflow: hidden;
    margin-top: 0;
}

@media (min-width: 768px) {
    .banner-carousel-wrapper {
        margin-top: 0;
        /* CORREÇÃO: Remove negative margin to prevent overlap */
    }
}

.banner-carousel {
    display: grid;
    grid-template-areas: "slide";
    width: 100%;
}

.banner-slide {
    grid-area: slide;
    opacity: 0;
    transition: opacity 1s ease-in-out;
    position: relative;
    width: 100%;
    z-index: 1;
}

.banner-slide.active {
    opacity: 1;
    z-index: 2;
}

.banner-image {
    width: 100%;
    height: 85vh;
    min-height: 500px;
    display: block;
    object-fit: cover;
    object-position: center center;
}

/* Mobile: Smaller but still impactful - crops instead of shrinking */
@media (max-width: 768px) {
    .banner-image {
        height: 55vh;
        min-height: 350px;
    }
}

/* Link Wrapper makes the image clickable */
.banner-link-wrapper {
    display: block;
    width: 100%;
    height: auto;
}

.banner-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    /* Sutil para contraste */
    z-index: 3;
    z-index: 3;
    pointer-events: none;
}

/* FULL CLICK AREA (Cobre tudo) */
.banner-full-click-area {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 20;
    /* Bem alto para pegar todos os cliques */
    cursor: pointer;
}

/* Content Centering with Absolute Position over Grid Item */
/* Content Centering - Método Full Height Flexbox (Mais robusto) */
.banner-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Ocupa todo o banner */
    z-index: 10;
    pointer-events: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* Garante centro vertical perfeito */
    padding: 20px;
    /* Margem de segurança para não colar nas bordas */
}

/* Re-enable pointer events for interactions */
.banner-content {
    /* O texto não bloqueia o clique no banner-full-click-area? 
       Como o link está com z-index 20 e o content Z-10, o link ganha se for transparente por cima.
       Mas o content precisa ser visível. Vamos colocar o link ABAIXO do content se quisermos selecionar texto? 
       O usuário quer CLICAR NO BANNER. 
       Entao o link deve estar SOBRE tudo.
    */
    z-index: 5;
    /* Texto abaixo do link clicável */
    pointer-events: none;
    /* Garante que nao bloqueia nada */
}

/* O botão é apenas visual agora, o clique é capturado pelo banner todo */
.banner-content .btn-banner {
    position: relative;
    z-index: 1;
    /* Visual */
}

.banner-content h1 {
    font-size: clamp(2rem, 6vw, 5rem);
    font-weight: 800;
    letter-spacing: -0.05em;
    margin: 0 0 1rem;
    line-height: 1.1;
    text-transform: uppercase;
}


.banner-description {
    font-size: clamp(1rem, 3vw, 1.5rem);
    margin: 0 0 2rem;
    max-width: 600px;
}

.btn-banner {
    display: inline-block;
    padding: 14px 36px;
    background: #000;
    color: #fff;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: transform 0.2s;
    cursor: pointer;
    margin-top: 25px;
    /* Margem adequada para o botão */
    font-size: 0.9rem;
}

@media (max-width: 768px) {
    .banner-content {
        padding: 5px;
        /* Reduz padding */
        width: 100%;
        height: 100%;
        justify-content: center;
        /* Garante centro vertical */
        gap: 5px;
        /* Espaço pequeno entre elementos */
    }

    .banner-content h1 {
        font-size: clamp(1.8rem, 6vw, 2.5rem);
        /* Fonte ajustada */
        margin-bottom: 0.2rem;
        line-height: 1;
    }

    .banner-description {
        display: block;
        /* RESTAURA descrição no mobile */
        font-size: 0.85rem;
        margin-bottom: 0.5rem;
        max-width: 90%;
        line-height: 1.2;
    }

    .btn-banner {
        padding: 8px 20px;
        /* Botão menor */
        font-size: 0.75rem;
        margin-top: 5px;
        /* Aproxima do título */
    }

    /* Esconder setas no mobile */
    .banner-nav,
    .owl-nav,
    .slick-arrow,
    .swiper-button-next,
    .swiper-button-prev {
        display: none !important;
    }

    /* Ajustar dots menores */
    .banner-dot {
        width: 6px;
        height: 6px;
        margin: 0 3px;
    }
}


.btn-banner:hover {
    transform: scale(1.05);
}

/* Alignment Styles */
.banner-content.align-left {
    text-align: left;
    margin-left: 0;
}

.banner-content.align-center {
    text-align: center;
    margin: 0 auto;
}

.banner-content.align-center .banner-description {
    margin-left: auto;
    margin-right: auto;
}

.banner-content.align-right {
    text-align: right;
    margin-left: auto;
}

.banner-content.align-right .banner-description {
    margin-left: auto;
}

/* Color Styles */
.banner-content.color-white h1,
.banner-content.color-white p {
    color: #fff;
}

.banner-content.color-white .btn-banner {
    background: #fff;
    color: #000;
}

.banner-content.color-black h1,
.banner-content.color-black p {
    color: #000;
}

.banner-content.color-black .btn-banner {
    background: #000;
    color: #fff;
}

/* Navigation Dots */
.banner-dots {
    position: absolute;
    bottom: 10px;
    /* Mais para baixo */
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    display: flex;
    gap: 6px;
    /* Menos espaço entre dots */
}

.banner-dot {
    width: 5px;
    /* Bem menores */
    height: 5px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: background 0.3s;
}

.banner-dot.active {
    background: #fff;
}

/* Navigation Arrows */
.banner-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    background: rgba(255, 255, 255, 0.3);
    border: none;
    width: 50px;
    height: 50px;
    font-size: 1.5rem;
    color: #fff;
    cursor: pointer;
    transition: background 0.3s;
    border-radius: 50%;
}

.banner-nav:hover {
    background: rgba(255, 255, 255, 0.5);
}

.banner-prev {
    left: 20px;
}

.banner-next {
    right: 20px;
}

/* ===== HERO ===== */
.hero-banner {
    background: linear-gradient(135deg, #e0e0e0 0%, #f5f5f7 100%);
    max-width: 100vw;
}

.btn-primary {
    display: inline-block;
    background: #000;
    color: #fff;
    padding: 12px 28px;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: transform 0.2s;
    font-size: 0.85rem;
}

.btn-primary:hover {
    transform: scale(1.05);
}

/* ===== MARQUEE ===== */
.trust-bar-marquee {
    background: #000;
    color: #fff;
    padding: 12px 0;
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
}

.marquee-content {
    display: inline-block;
    animation: marquee 25s linear infinite;
}

.marquee-content span {
    display: inline-block;
    margin: 0 3rem;
    font-weight: 600;
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

/* ===== PRODUCT GRID (CARROSSEL RESPONSIVO) ===== */
.product-showcase {
    width: 100%;
    max-width: 100vw;
    overflow: hidden;
}

.product-grid {
    display: flex;
    gap: 15px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 0 0 2rem 0;
    /* Espaço para scroll/sombra */
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
    /* Scroll suave no iOS */
}

.product-grid::-webkit-scrollbar {
    display: none;
}

.product-card {
    /* FIX: min-width garante que o card NUNCA seja esmagado */
    flex: 0 0 auto;
    width: 280px;
    /* Largura base ideal */
    min-width: 260px;
    /* Largura mínima absoluta */
    max-width: 90vw;
    /* Segurança para telas muito pequenas */

    scroll-snap-align: start;
    background-color: var(--white);
    border-radius: 8px;
    overflow: hidden;
    position: relative;
}

.product-card:hover {
    transform: translateY(-3px);
    transition: transform 0.3s;
}

/* Product Card Base Styles - mantidos */
.product-card {
    background-color: var(--white);
    border-radius: 8px;
    overflow: hidden;
    position: relative;
}

.product-card:hover {
    transform: translateY(-3px);
    transition: transform 0.3s;
}

/* Product Badge */
.product-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: #FF0000;
    color: #fff;
    padding: 4px 10px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    z-index: 10;
    border-radius: 3px;
}

.product-badge.bestseller {
    background: #FFD700;
    color: #000;
}

.card-image {
    height: 350px;
    width: 100%;
    background-color: #f0f0f0;
    background-size: cover;
    background-position: center;
}

.card-info {
    padding: 1rem;
}

.card-info h3 {
    margin: 0 0 0.5rem;
    font-size: 0.95rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.card-info h3 a {
    text-decoration: none;
    color: inherit;
}

.card-info .price {
    margin: 0 0 0.8rem;
    color: #000;
    font-weight: 700;
    font-size: 1rem;
}

/* Color Swatches */
.color-swatches {
    display: flex;
    gap: 6px;
    margin-bottom: 0.8rem;
    flex-wrap: wrap;
}

.color-swatch {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 2px solid #ddd;
    cursor: pointer;
    transition: transform 0.2s, border-color 0.2s;
}

.color-swatch:hover {
    transform: scale(1.15);
    border-color: #000;
}

/* Action Bar: Smart Button + Wishlist (80/20 Layout) */
.card-action-bar {
    display: flex;
    gap: 0.5rem;
    align-items: stretch;
}

/* Quick Buy Button */
.btn-quick-buy {
    flex: 1;
    /* Takes remaining space (80%) */
    padding: 12px 20px;
    background-color: var(--black);
    color: var(--white);
    border: none;
    font-weight: 700;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
    cursor: pointer;
    transition: background 0.3s, transform 0.2s;
    text-align: center;
}

.btn-quick-buy:hover {
    background: #333;
}

.btn-quick-buy.success {
    background: #28a745;
}

/* Smart Button States */
.color-swatch.active {
    border-color: #000;
    border-width: 4px;
    /* Mais grosso */
    transform: scale(1.2);
    /* Maior */
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1);
    /* Halo externo */
}

/* Size Swatches */
.size-swatches {
    display: flex;
    gap: 6px;
    margin-bottom: 0.8rem;
    flex-wrap: wrap;
}

.size-swatch {
    padding: 6px 12px;
    background: #fff;
    border: 2px solid #ddd;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 600;
    transition: all 0.2s;
}

.size-swatch:hover {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0;
}

/* ==================================================
   QUICK WISHLIST BUTTON (Image Overlay)
   ================================================== */
.product-image {
    position: relative;
    width: 100%;
    height: 350px;
    /* Force height to match original design */
    overflow: hidden;
    /* Ensure image doesn't overflow rounded corners */
    background-color: #f0f0f0;
    /* Fallback for transparency */
}

.product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s ease;
}

.product-image:hover img {
    transform: scale(1.05);
    /* Zoom effect on hover */
}

/* Quick Wishlist Button Overlay */
.wishlist-quick-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 32px;
    height: 32px;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    /* STRICTLY NO SHADOW */
    border: none !important;
    outline: none !important;
    cursor: pointer;
    z-index: 10;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    /* border-radius removed to avoid circle shape implication */
    transition: transform 0.2s ease;
}

.wishlist-quick-btn:hover {
    transform: scale(1.15);
}

.wishlist-quick-btn svg {
    width: 24px;
    height: 24px;
    stroke: #000;
    /* Black stroke by default */
    stroke-width: 2px;
    fill: transparent !important;
    /* Force transparent fill when not active */
    /* Hollow by default */
    transition: all 0.2s ease;
    filter: drop-shadow(0px 1px 2px rgba(255, 255, 255, 0.5));
    /* Subtle contrast for dark images */
}

/* Active State: Filled Heart (Black) */
.wishlist-quick-btn.active svg {
    fill: #000 !important;
    stroke: #000 !important;
}

.wishlist-quick-btn.loading {
    opacity: 0.7;
    pointer-events: none;
}

/* ==================================================
   ACTION BUTTONS (100% WIDTH)
   ================================================== */
.card-action-bar {
    display: flex;
    gap: 0;
    /* No gap needed for single button */
    margin-top: 15px;
}

.smart-btn {
    flex: 1;
    /* Take full width */
    background: #000;
    color: #fff;
    border: none;
    padding: 12px 0;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.3s;
    border-radius: 0;
    /* Sharp edges or match theme */
    display: flex;
    align-items: center;
    justify-content: center;
}

.smart-btn:hover {
    background: #333;
}

/* Remove old leftover wishlist-btn styles if any conflict */
.wishlist-btn {
    display: none !important;
}

/* ===== BRANDING SECTION ===== */
.branding-section {
    padding: 4rem 3%;
    background: #fff;
}

.branding-container {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    align-items: center;
}

.branding-image {
    width: 100%;
    height: 400px;
    background: #ccc;
    border-radius: 8px;
    background-size: cover;
    background-position: center;
}

.branding-content {
    width: 100%;
}

.branding-content h2 {
    font-size: 2rem;
    margin-bottom: 1rem;
    letter-spacing: -0.03em;
}

.branding-content p {
    font-size: 1.1rem;
    color: #444;
    line-height: 1.7;
    margin-bottom: 1.5rem;
}

/* ===================================================================
   TESTIMONIALS EDITORIAL - MINIMAL CLUB STYLE (COMPLETE REBUILD)
   Large cards with FULL background photos, huge names, luxury aesthetic
   ===================================================================*/

.testimonials-section {
    background: #000;
    padding: 80px 0;
}

.testimonials-title {
    text-align: center;
    color: #fff;
    font-size: clamp(0.9rem, 2.5vw, 1.2rem);
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.4em;
    margin: 0 0 50px 0;
}

.testimonials-swiper {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 20px 60px 20px;
}

/* CARD - Large with photo as FULL BACKGROUND like Minimal Club */
.testimonial-card {
    position: relative;
    width: 100%;
    height: 550px;
    min-height: 500px;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    border-radius: 8px;
    overflow: hidden;
    filter: grayscale(100%);
    transition: filter 0.4s ease;
    cursor: pointer;
}

.testimonial-card:hover {
    filter: grayscale(60%);
}

/* OVERLAY - Dark gradient at bottom for text readability */
.testimonial-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top,
            rgba(0, 0, 0, 0.92) 0%,
            rgba(0, 0, 0, 0.75) 35%,
            rgba(0, 0, 0, 0.4) 65%,
            rgba(0, 0, 0, 0.1) 85%,
            transparent 100%);
    z-index: 1;
}

/* CONTENT - Positioned at bottom of card */
.testimonial-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
    padding: 50px 35px;
}

/* QUOTE - Small italic text above name */
.testimonial-quote {
    font-size: clamp(0.9rem, 1.6vw, 1.05rem);
    font-style: italic;
    line-height: 1.65;
    color: #e8e8e8;
    margin: 0 0 25px 0;
    font-weight: 300;
}

/* NAME - HUGE bold uppercase - main focal point like Minimal Club */
.testimonial-name {
    font-size: clamp(1.8rem, 4vw, 3rem) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    color: #fff !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.15 !important;
}

/* TITLE/POSITION - Small subtitle below name */
.testimonial-title {
    font-size: clamp(0.75rem, 1.4vw, 0.9rem) !important;
    color: #aaa !important;
    font-weight: 400 !important;
    margin: 0 !important;
    text-transform: none !important;
    line-height: 1.4 !important;
}

/* SWIPER PAGINATION */
.testimonials-swiper .swiper-pagination {
    bottom: 25px;
}

.testimonials-swiper .swiper-pagination-bullet {
    background: #fff !important;
    opacity: 0.35 !important;
    width: 9px !important;
    height: 9px !important;
    margin: 0 6px !important;
}

.testimonials-swiper .swiper-pagination-bullet-active {
    opacity: 1 !important;
}

/* MOBILE RESPONSIVE */
@media (max-width: 767px) {
    .testimonials-section {
        padding: 60px 0;
    }

    .testimonials-title {
        margin-bottom: 35px;
        letter-spacing: 0.3em;
    }

    .testimonial-card {
        height: 500px;
        min-height: 450px;
        border-radius: 6px;
    }

    .testimonial-content {
        padding: 35px 25px;
    }

    .testimonial-badge {
        top: 18px;
        left: 18px;
        font-size: 1.1rem;
    }

    .testimonial-quote {
        font-size: 0.95rem;
        margin-bottom: 20px;
    }

    .testimonial-name {
        font-size: 2rem !important;
    }
}

/* TABLET */
@media (min-width: 768px) and (max-width: 1023px) {
    .testimonial-card {
        height: 520px;
    }

    .testimonial-content {
        padding: 40px 30px;
    }
}



/* ===================================================================
   ABOUT PAGE - PREMIUM LANDING PAGE
   Dark luxury design with hero, story, and founders sections
   ================================================================ */

.about-page {
    background: #0a0a0a;
    color: #fff;
    min-height: 100vh;
}

/* HERO SECTION */
.about-hero {
    position: relative;
    min-height: 65vh;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.about-hero-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 1;
}

.about-hero-content {
    position: relative;
    z-index: 2;
    max-width: 900px;
    padding: 0 20px;
}

.about-hero-title {
    font-size: clamp(2.5rem, 6vw, 5rem);
    font-weight: 300;
    margin: 0 0 20px 0;
    letter-spacing: 0.02em;
    color: #fff;
}

.about-hero-subtitle {
    font-size: clamp(1rem, 2vw, 1.5rem);
    font-weight: 300;
    color: #ddd;
    margin: 0;
    font-style: italic;
}

/* GENERIC CONTENT BLOCKS (Text + Image alternating) */
.about-block {
    max-width: 1300px;
    margin: 0 auto;
    padding: 100px 5%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}

/* Alternating layout - Image on left */
.about-block-alt {
    direction: rtl;
}

.about-block-alt>* {
    direction: ltr;
}

.about-block-title {
    font-size: clamp(1.8rem, 4vw, 3rem);
    font-weight: 300;
    margin: 0 0 30px 0;
    letter-spacing: 0.02em;
    color: #fff;
}

.about-block-content {
    font-size: clamp(1rem, 1.6vw, 1.15rem);
    line-height: 1.8;
    color: #ccc;
}

.about-block-content p {
    margin-bottom: 20px;
}

.about-block-image img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    filter: grayscale(50%);
    transition: filter 0.4s ease;
}

.about-block-image img:hover {
    filter: grayscale(20%);
}

/* Brand Enemy special styling */
.about-block-enemy {
    border-top: 1px solid #222;
    border-bottom: 1px solid #222;
    background: #050505;
}

/* MISSION/VISION/VALUES CARDS */
.about-mvv {
    padding: 100px 5%;
    background: #0f0f0f;
    border-top: 1px solid #222;
    border-bottom: 1px solid #222;
}

.about-mvv-grid {
    max-width: 1300px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.mvv-card {
    background: #1a1a1a;
    padding: 50px 35px;
    border-radius: 8px;
    border-left: 3px solid #fff;
    transition: transform 0.3s ease, border-color 0.3s ease;
}

.mvv-card:hover {
    transform: translateY(-5px);
    border-left-color: #888;
}

.mvv-card-title {
    font-size: clamp(1.3rem, 2.5vw, 1.8rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #fff;
    margin: 0 0 20px 0;
}

.mvv-card-content {
    font-size: clamp(0.95rem, 1.4vw, 1.05rem);
    line-height: 1.7;
    color: #aaa;
}

.mvv-card-content p {
    margin-bottom: 15px;
}

/* RESPONSIVE - About Blocks */
@media (max-width: 768px) {
    .about-block {
        grid-template-columns: 1fr;
        gap: 50px;
        padding: 60px 5%;
    }

    .about-block-alt {
        direction: ltr;
    }

    .about-block-image {
        order: -1;
    }

    .about-mvv-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .mvv-card {
        padding: 35px 25px;
    }
}

/* FOUNDERS SECTION */
.about-founders {
    padding: 100px 5%;
    background: #000;
    border-top: 1px solid #222;
}

.about-founders-title {
    text-align: center;
    font-size: clamp(1.5rem, 3vw, 2.5rem);
    font-weight: 300;
    margin: 0 0 60px 0;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: #fff;
}

.about-founders-grid {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 60px;
}

.founder-card {
    text-align: center;
    background: transparent;
    padding: 0;
}

.founder-photo {
    width: 220px;
    height: 220px;
    margin: 0 auto 25px;
    border-radius: 8px;
    overflow: hidden;
}

.founder-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(100%);
    transition: filter 0.4s ease;
}

.founder-card:hover .founder-photo img {
    filter: grayscale(70%);
}

.founder-name {
    font-size: clamp(1.3rem, 2.2vw, 1.6rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #fff;
    margin: 0 0 10px 0;
}

.founder-role {
    font-size: clamp(0.85rem, 1.4vw, 0.95rem);
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 15px 0;
    font-weight: 600;
}

.founder-bio {
    font-size: clamp(0.9rem, 1.5vw, 1rem);
    line-height: 1.7;
    color: #aaa;
    margin: 0;
    max-width: 350px;
    margin: 0 auto;
}

/* MOBILE RESPONSIVE */
@media (max-width: 768px) {
    .about-hero {
        min-height: 50vh;
    }

    .about-story {
        grid-template-columns: 1fr;
        gap: 50px;
        padding: 60px 5%;
    }

    .about-story-image {
        order: -1;
    }

    .about-founders {
        padding: 60px 5%;
    }

    .about-founders-grid {
        gap: 50px;
    }

    .founder-photo {
        width: 180px;
        height: 180px;
    }
}


/* ===== BLOG SECTION ===== */
.blog-section {
    padding: 4rem 3%;
    background: #f9f9f9;
}

.blog-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}

.blog-card {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
}

.blog-image {
    height: 220px;
    background: #ddd;
    background-size: cover;
    background-position: center;
}

.blog-content {
    padding: 1.5rem;
}

.blog-content h3 {
    font-size: 1.2rem;
    margin: 0 0 0.5rem;
    color: #000;
}

.blog-content p {
    font-size: 0.9rem;
    line-height: 1.6;
    color: #666;
    margin-bottom: 1rem;
}

.blog-content a {
    color: #000;
    text-decoration: none;
    font-weight: 600;
}

.blog-content a:hover {
    text-decoration: underline;
}

/* ===== CONTACT POPUP ===== */
.contact-popup {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    animation: fadeIn 0.3s;
}

.contact-popup.active {
    display: flex;
    align-items: center;
    justify-content: center;
}

.contact-popup-content {
    background-color: #fff;
    padding: 2rem;
    border-radius: 8px;
    max-width: 400px;
    width: 90%;
    position: relative;
    animation: slideDown 0.3s;
}

.contact-popup-close {
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 2rem;
    font-weight: 300;
    cursor: pointer;
    color: #888;
    transition: color 0.2s;
}

.contact-popup-close:hover {
    color: #000;
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 1rem;
    background: #f5f5f5;
    border-radius: 6px;
    margin-bottom: 1rem;
}

.contact-item svg {
    flex-shrink: 0;
}

.contact-item a {
    color: #000;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.95rem;
}

.contact-item a:hover {
    text-decoration: underline;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===== TABLET & DESKTOP ===== */
@media (min-width: 768px) {
    .top-bar {
        padding: 10px 5%;
        font-size: 0.8rem;
    }

    .main-bar {
        padding: 1.2rem 5%;
    }

    .site-logo a {
        font-size: 1.8rem;
    }

    .main-nav ul {
        gap: 2.5rem;
    }

    .main-nav a {
        font-size: 0.95rem;
    }

    .product-card {
        flex: 0 0 28%;
        /* ~3.5 cards visible on desktop */
    }

    .branding-container {
        flex-direction: row;
        align-items: center;
    }

    .branding-image {
        flex: 1;
        height: 500px;
    }

    .branding-content {
        flex: 1;
    }

    .blog-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Larger desktops: 4.5 products visible */
@media (min-width: 1400px) {
    .product-card {
        flex: 0 0 22%;
        /* 4.5 cards: 5 × 22% + gaps = ~110%, cutting 5th at 50% */
    }
}

/* =========================================
   PAGE: WISHLIST (PRADA STYLE) - Phase 5
   ========================================= */

/* Grid Layout */
.bv-wishlist-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
    /* Reduced gap for tight, premium feel */
    margin-top: 40px;
}

/* Response Mobile */
@media (max-width: 768px) {
    .bv-wishlist-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .wishlist-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }

    .wishlist-actions {
        width: 100%;
        display: flex;
        justify-content: space-between;
    }
}

/* Card Design */
.bv-wishlist-card {
    position: relative;
    background: #fff;
    /* No border, clean look */
    display: flex;
    flex-direction: column;
}

.bv-wishlist-card .img-wrapper {
    position: relative;
    width: 100%;
    padding-bottom: 125%;
    /* 4:5 Aspect Ratio */
    background: #f4f4f4;
    overflow: hidden;
    display: block;
}

.bv-wishlist-card .img-wrapper img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.bv-wishlist-card:hover .img-wrapper img {
    transform: scale(1.03);
}

/* Naked Remove Icon */
.bv-remove-item {
    position: absolute;
    top: 10px;
    right: 10px;
    background: transparent !important;
    border: none !important;
    padding: 5px;
    cursor: pointer;
    z-index: 20;
    opacity: 0.7;
    transition: opacity 0.2s;
}

.bv-remove-item:hover {
    opacity: 1;
}

/* Card Details */
.bv-wishlist-card .card-details {
    padding: 15px 0 10px 10px;
    /* Added 10px left padding */
}

.bv-wishlist-card h3.product-title {
    font-size: 0.9rem;
    font-weight: 600;
    margin: 0 0 5px 0;
    line-height: 1.2;
}

.bv-wishlist-card h3.product-title a {
    color: #000;
    text-decoration: none;
}

.bv-wishlist-card .product-price {
    font-size: 0.9rem;
    color: #555;
    margin-bottom: 15px;
}

/* Add to Cart Button (Solid Black) */
.bv-btn-add-cart-single {
    background: #000;
    color: #fff;
    border: none;
    width: 100%;
    padding: 12px 0;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    letter-spacing: 0.05em;
    transition: background 0.2s;
}

.bv-btn-add-cart-single:hover {
    background: #333;
}

.bv-btn-disabled {
    background: #e0e0e0;
    color: #999;
    border: none;
    width: 100%;
    padding: 12px 0;
    font-size: 0.8rem;
    font-weight: 700;
    cursor: not-allowed;
    text-transform: uppercase;
}

/* --- WISHLIST CONFIGURATOR STYLES --- */

/* Swatches */
.bv-wishlist-swatch {
    cursor: pointer;
    transition: all 0.2s ease;
}

.color-swatch {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1px solid #ddd;
    position: relative;
}

.color-swatch.selected {
    border: 1px solid #000;
    box-shadow: 0 0 0 1px #fff, 0 0 0 3px #000;
    /* Double ring effect */
    transform: scale(1.1);
}

.size-swatch {
    padding: 5px 10px;
    border: 1px solid #ddd;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    background: #fff;
    min-width: 30px;
    text-align: center;
}

.size-swatch:hover {
    border-color: #999;
}

.size-swatch.selected {
    background: #000;
    color: #fff;
    border-color: #000;
}

/* Qty Stepper */
.bv-qty-stepper {
    display: flex;
    align-items: center;
    border: 1px solid #eee;
    height: 40px;
    background: #fff;
}

.qty-input:focus {
    outline: none;
}

/* Validation Feedback */
.validation-error {
    border: 1px solid #ff0000 !important;
    animation: shake 0.5s cubic-bezier(.36, .07, .19, .97) both;
}

@keyframes shake {

    10%,
    90% {
        transform: translate3d(-1px, 0, 0);
    }

    20%,
    80% {
        transform: translate3d(2px, 0, 0);
    }

    30%,
    50%,
    70% {
        transform: translate3d(-4px, 0, 0);
    }

    40%,
    60% {
        transform: translate3d(4px, 0, 0);
    }
}

/* Toast Notification (if not already present) */
.bv-toast {
    position: fixed;
    top: 20px;
    right: 20px;
    background: #000;
    color: #fff;
    padding: 15px 25px;
    z-index: 99999;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 600;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    animation: slideInToast 0.3s ease-out;
}

.bv-toast.error {
    background: #ff0000;
}

@keyframes slideInToast {
    from {
        transform: translateX(100%);
        opacity: 0;
    }

    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* ============================================
   PREMIUM CART DESIGN - Black Ville
   Ultra-clean minimalist layout (Farfetch/Prada inspired)
   ============================================ */

/* Main Wrapper */
.bv-premium-cart-wrapper {
    padding: 60px 3% 100px;
    max-width: 1400px;
    margin: 0 auto;
}

/* Empty State */
.bv-empty-cart-state {
    text-align: center;
    padding: 100px 20px;
}

.bv-empty-cart-state .empty-title {
    font-size: 1.8rem;
    font-weight: 300;
    letter-spacing: 0.1em;
    margin-bottom: 1rem;
}

.bv-empty-cart-state .empty-subtitle {
    color: #666;
    margin-bottom: 2rem;
    font-weight: 300;
}

.bv-btn-primary {
    display: inline-block;
    background: #000;
    color: #fff;
    padding: 15px 40px;
    text-decoration: none;
    font-weight: 500;
    letter-spacing: 0.05em;
    transition: opacity 0.2s;
}

.bv-btn-primary:hover {
    opacity: 0.8;
}

/* Asymmetric 2-Column Grid (65/35) */
.bv-premium-cart-grid {
    display: grid;
    grid-template-columns: 1fr 450px;
    gap: 80px;
    align-items: start;
}

/* LEFT COLUMN: Products */
.bv-cart-products-section {
    min-height: 400px;
}

.bv-cart-page-title {
    font-size: 1.4rem;
    font-weight: 300;
    letter-spacing: 0.15em;
    margin: 0 0 8px 0;
    text-transform: uppercase;
}

.bv-cart-item-count {
    font-size: 0.85rem;
    color: #999;
    font-weight: 300;
    margin: 0 0 40px 0;
}

/* Product List */
.bv-premium-cart-list {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* Product Card (Horizontal) */
.bv-premium-cart-item {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    padding: 40px 0;
    border-bottom: 1px solid #e5e5e5;
    position: relative;
}

.bv-premium-cart-item:first-child {
    padding-top: 0;
}

/* Image (120px clean) */
.bv-premium-item-image {
    flex-shrink: 0;
    width: 120px;
}

.bv-premium-item-image img {
    width: 100%;
    height: auto;
    display: block;
}

/* Product Info */
.bv-premium-item-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.bv-premium-it.drawer-title {
    font-size: 1rem;
    font-weight: 400;
    margin: 0;
    letter-spacing: 0.05em;
}

.drawer-close {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    color: #1a1a1a;
}

.drawer-body {
    padding: 30px;
    overflow-y: auto;
    flex: 1;
}

/* Filter Sections */
.filter-section {
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #eee;
}

.filter-title {
    font-size: 0.85rem;
    font-weight: 500;
    margin-bottom: 15px;
    letter-spacing: 0.05em;
    color: #1a1a1a;
}

/* Color Options */
.color-options {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.color-filter-swatch {
    cursor: pointer;
    position: relative;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 1px solid #ddd;
    overflow: hidden;
    transition: all 0.2s ease;
}

.color-filter-swatch input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.color-filter-swatch .swatch-color {
    display: block;
    width: 100%;
    height: 100%;
}

.color-filter-swatch .swatch-label {
    display: none;
    /* Hide label, visual only */
}

.color-filter-swatch.selected {
    transform: scale(1.1);
    border-color: #000;
    box-shadow: 0 0 0 1px #000;
}

/* Size Options */
.size-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.size-filter-btn {
    cursor: pointer;
    min-width: 40px;
    height: 40px;
    border: 1px solid #e5e5e5;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    transition: all 0.2s ease;
    padding: 0 10px;
}

.size-filter-btn input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    width: 0;
    height: 0;
}

.size-filter-btn:hover {
    border-color: #000;
}

.size-filter-btn.selected {
    background: #000;
    color: #fff;
    border-color: #000;
}

/* Price Inputs */
.price-inputs {
    display: flex;
    align-items: center;
    gap: 10px;
}

.price-input-group {
    flex: 1;
}

.price-input-group label {
    font-size: 0.75rem;
    color: #666;
    margin-bottom: 5px;
    display: block;
}

.price-field {
    display: flex;
    align-items: center;
    border: 1px solid #e5e5e5;
    padding: 0 10px;
    height: 40px;
}

.price-field span {
    font-size: 0.85rem;
    color: #666;
    margin-right: 5px;
}

.price-field input {
    border: none;
    padding: 0;
    height: 100%;
    width: 100%;
    font-size: 0.85rem;
    background: transparent;
}

.price-field input:focus {
    outline: none;
}

.price-separator {
    color: #999;
}

/* Filter Actions */
.filter-actions {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    align-items: center;
}

.btn-apply-filters {
    width: 100%;
    background: #000;
    color: #fff;
    border: none;
    height: 50px;
    font-size: 0.9rem;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: background 0.3s ease;
}

.btn-apply-filters:hover {
    background: #333;
}

.btn-clear-filters {
    color: #666;
    font-size: 0.85rem;
    text-decoration: underline;
    cursor: pointer;
}

.btn-clear-filters:hover {
    color: #000;
}

.bv-premium-item-title {
    font-size: 1rem;
    font-weight: 400;
    margin: 0;
    line-height: 1.4;
}

.bv-premium-item-title a {
    color: #000;
    text-decoration: none;
}

.bv-premium-item-title a:hover {
    opacity: 0.7;
}

/* Variations Meta (Cor: X | Tamanho: Y) */
.bv-premium-item-meta {
    font-size: 0.85rem;
    color: #999;
    font-weight: 300;
    margin: 0;
}

/* Controls Row */
.bv-premium-item-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 8px;
    gap: 20px;
}

/* Quantity Stepper (Minimal) */
.bv-premium-qty-stepper {
    display: flex;
    align-items: center;
    border: 1px solid #ddd;
    height: 40px;
}

.bv-premium-qty-stepper button {
    width: 40px;
    height: 100%;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 1.1rem;
    color: #000;
    transition: background 0.2s;
}

.bv-premium-qty-stepper button:hover {
    background: #f5f5f5;
}

.bv-premium-qty-stepper .qty-input,
.bv-premium-qty-stepper .qty-value {
    width: 40px;
    text-align: center;
    border: none;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    font-size: 0.9rem;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bv-premium-qty-stepper .qty-input {
    -moz-appearance: textfield;
    appearance: textfield;
}

.bv-premium-qty-stepper .qty-input::-webkit-outer-spin-button,
.bv-premium-qty-stepper .qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Unit Price */
.bv-premium-item-price {
    font-size: 1rem;
    font-weight: 400;
}

/* Remove Link (Elegant) */
.bv-premium-remove {
    font-size: 0.75rem;
    color: #999;
    text-decoration: none;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    transition: color 0.2s;
    margin-left: auto;
    padding-left: 20px;
    white-space: nowrap;
}

.bv-premium-remove:hover {
    color: #000;
}

/* RIGHT COLUMN: Sticky Summary */
.bv-cart-summary-section {
    position: relative;
}

.bv-premium-summary-sticky {
    position: sticky;
    top: 100px;
    background: #fafafa;
    padding: 40px 30px;
    border: 1px solid #e5e5e5;
}

.bv-summary-title {
    font-size: 1rem;
    font-weight: 400;
    letter-spacing: 0.15em;
    margin: 0 0 30px 0;
    text-transform: uppercase;
}

/* Summary Rows */
.bv-summary-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
    font-size: 0.9rem;
}

.bv-summary-label {
    color: #666;
    font-weight: 300;
}

.bv-summary-value {
    font-weight: 400;
}

/* Coupon Accordion */
.bv-coupon-accordion {
    margin: 30px 0;
    border-top: 1px solid #e5e5e5;
    padding-top: 20px;
}

.bv-coupon-toggle {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    font-size: 0.85rem;
    color: #666;
    text-align: left;
    transition: color 0.2s;
}

.bv-coupon-toggle:hover {
    color: #000;
}

.bv-coupon-toggle svg {
    transition: transform 0.3s;
}

.bv-coupon-toggle.active svg {
    transform: rotate(180deg);
}

.bv-coupon-panel {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.bv-coupon-panel.open {
    max-height: 200px;
    margin-top: 20px;
}

.bv-coupon-form {
    display: flex;
    gap: 10px;
}

.bv-coupon-input {
    flex: 1;
    border: 1px solid #ddd;
    padding: 10px 15px;
    font-size: 0.85rem;
}

.bv-coupon-submit {
    background: #000;
    color: #fff;
    border: none;
    padding: 10px 20px;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: opacity 0.2s;
}

.bv-coupon-submit:hover {
    opacity: 0.8;
}

/* Applied Coupons */
.bv-applied-coupons {
    margin: 15px 0;
}

.bv-applied-coupon {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f0f0f0;
    padding: 8px 12px;
    margin-bottom: 8px;
    font-size: 0.85rem;
}

.bv-remove-coupon {
    color: #999;
    text-decoration: none;
    font-size: 1.2rem;
    line-height: 1;
}

.bv-remove-coupon:hover {
    color: #000;
}

/* Total */
.bv-summary-total {
    display: flex;
    justify-content: space-between;
    margin: 30px 0;
    padding-top: 20px;
    border-top: 1px solid #e5e5e5;
    font-size: 1.1rem;
    font-weight: 500;
}

/* Checkout CTA (Black Solid) */
.bv-checkout-cta {
    display: block;
    width: 100%;
    background: #000;
    color: #fff;
    text-align: center;
    padding: 18px;
    text-decoration: none;
    font-weight: 500;
    letter-spacing: 0.1em;
    font-size: 0.85rem;
    transition: opacity 0.2s;
    margin-bottom: 15px;
}

.bv-checkout-cta:hover {
    opacity: 0.85;
}

.bv-summary-note {
    text-align: center;
    font-size: 0.75rem;
    color: #999;
    margin: 0;
    font-weight: 300;
}

/* Mobile Sticky CTA */
.bv-mobile-sticky-cta {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    border-top: 1px solid #e5e5e5;
    padding: 15px 20px;
    z-index: 1000;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
}

.bv-mobile-cta-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 600px;
    margin: 0 auto;
}

.bv-mobile-total {
    display: flex;
    flex-direction: column;
}

.bv-mobile-total-label {
    font-size: 0.7rem;
    color: #999;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.bv-mobile-total-value {
    font-size: 1.1rem;
    font-weight: 500;
}

.bv-mobile-checkout-btn {
    background: #000;
    color: #fff;
    padding: 12px 30px;
    text-decoration: none;
    font-size: 0.85rem;
    letter-spacing: 0.05em;
    font-weight: 500;
}

/* Responsive (Mobile) */
@media (max-width: 1024px) {
    .bv-premium-cart-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .bv-premium-summary-sticky {
        position: static;
        margin-top: 40px;
    }

    .bv-mobile-sticky-cta {
        display: block;
    }

    .bv-premium-cart-wrapper {
        padding-bottom: 120px;
    }
}

@media (max-width: 640px) {
    .bv-premium-cart-item {
        flex-direction: column;
        gap: 16px;
    }

    .bv-premium-item-image {
        width: 100%;
        max-width: 200px;
    }

    .bv-premium-remove {
        margin-left: 15px;
        padding-left: 15px;
        border-left: 1px solid #e5e5e5;
        order: 2;
    }

    .bv-premium-item-controls {
        flex-wrap: wrap;
        align-items: center;
        gap: 15px;
        width: 100%;
    }

    .bv-premium-qty-stepper {
        order: 0;
        flex: 0 0 auto;
    }

    .bv-premium-item-price {
        order: 1;
        flex: 1;
        text-align: right;
    }
}

/* ============================================
   PREMIUM COLLECTIONS GALLERY (PRADA STYLE)
   ============================================ */

/* Main Wrapper */
.bv-collections-wrapper {
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 3%;
}

/* ===== COLLECTION NAVIGATION (Horizontal) ===== */
.collection-nav {
    border-bottom: 1px solid #e5e5e5;
    margin-bottom: 60px;
    padding: 40px 0 0;
}

.collection-nav-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.category-links {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 40px;
}

.category-links li {
    margin: 0;
}

.category-links a {
    display: block;
    padding: 0 0 20px 0;
    font-size: 0.85rem;
    font-weight: 300;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #666;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
}

.category-links a:hover {
    color: #000;
}

.category-links li.active a {
    color: #000;
    font-weight: 400;
    border-bottom-color: #000;
}

/* Filter Toggle Button */
.filter-toggle-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    border: 1px solid #000;
    padding: 10px 20px;
    font-size: 0.75rem;
    font-weight: 400;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s ease;
}

.filter-toggle-btn:hover {
    background: #000;
    color: #fff;
}

.filter-toggle-btn:hover svg {
    stroke: #fff;
}

/* ===== PRODUCT GRID (Full Width, 4 Columns) ===== */
.bv-collections-content {
    margin-bottom: 80px;
}

.woocommerce ul.products {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px 30px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.woocommerce ul.products li.product {
    margin: 0;
    padding: 0;
    width: 100%;
}

/* Empty State */
.bv-empty-collections {
    text-align: center;
    padding: 100px 20px;
}

.bv-empty-collections .empty-title {
    font-size: 1.8rem;
    font-weight: 300;
    letter-spacing: 0.1em;
    margin-bottom: 1rem;
}

.bv-empty-collections .empty-subtitle {
    color: #666;
    margin-bottom: 2rem;
    font-weight: 300;
}

/* ===== OFF-CANVAS FILTER DRAWER ===== */
.filter-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9999;
    pointer-events: none;
}

.filter-drawer.active {
    pointer-events: auto;
}

.drawer-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: opacity 0.35s ease;
}

.filter-drawer.active .drawer-overlay {
    opacity: 1;
}

.drawer-content {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 400px;
    max-width: 90%;
    background: #fff;
    transform: translateX(100%);
    transition: transform 0.35s ease;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.filter-drawer.active .drawer-content {
    transform: translateX(0);
}

.drawer-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px;
    border-bottom: 1px solid #e5e5e5;
}

.drawer-title {
    font-size: 1rem;
    font-weight: 400;
    letter-spacing: 0.15em;
    margin: 0;
    text-transform: uppercase;
}

.drawer-close {
    background: transparent;
    border: none;
    padding: 5px;
    cursor: pointer;
    transition: opacity 0.2s;
}

.drawer-close:hover {
    opacity: 0.6;
}

.drawer-body {
    flex: 1;
    overflow-y: auto;
    padding: 30px;
}

/* Check Options (Categories) */
.check-options {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.check-filter-item {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    font-size: 0.9rem;
    color: #333;
    transition: all 0.2s;
}

.check-filter-item:hover,
.check-filter-item.selected {
    color: #000;
    font-weight: 600;
}

.check-filter-item input {
    display: none;
    /* Hide radio */
}

/* Tags Options (Pills like Size but fluid width) */
.tags-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tag-filter-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 14px;
    border: 1px solid #ddd;
    background: #fff;
    color: #333;
    font-size: 0.8rem;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.2s;
    border-radius: 4px;
    /* Slight rounded for tags */
}

.tag-filter-btn:hover,
.tag-filter-btn.selected {
    border-color: #000;
    background: #000;
    color: #fff;
}

.tag-filter-btn input {
    display: none;
}


/* Prevent body scroll when drawer is open */
body.drawer-open {
    overflow: hidden;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1200px) {
    .woocommerce ul.products {
        grid-template-columns: repeat(3, 1fr);
        gap: 30px 20px;
    }
}

@media (max-width: 768px) {
    .collection-nav-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }

    .category-links {
        width: 100%;
        overflow-x: auto;
        gap: 25px;
        padding-bottom: 10px;
    }

    .category-links::-webkit-scrollbar {
        height: 2px;
    }

    .category-links::-webkit-scrollbar-track {
        background: #f5f5f5;
    }

    .category-links::-webkit-scrollbar-thumb {
        background: #000;
    }

    .filter-toggle-btn {
        width: 100%;
        justify-content: center;
    }

    .woocommerce ul.products {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px 15px;
    }
}


/* ===== PREMIUM ADD TO CART BUTTON (Home Style) ===== */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart {
    display: block !important;
    width: 100% !important;
    background: #000 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 12px 0 !important;
    text-align: center !important;
    font-size: 0.8rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    margin-top: 10px !important;
    /* Darken underline on hover */
}

/* Mobile: Keep text style but slightly more visible */
@media (max-width: 768px) {
    .smart-btn {
        color: #666 !important;
        border-bottom-color: #ccc !important;
    }
}

/* Fix Page Title Issues - Aggressive Hiding */
.woocommerce-products-header,
.woocommerce-products-header__title,
.page-title,
.entry-title,
.archive .entry-header {
    display: none !important;
}

/* Fix potential empty grid item (Uncategorized placeholder) */
.woocommerce ul.products li.product-category,
.woocommerce ul.products li.product.product-category,
.product-category {
    display: none !important;
    /* Hide category placeholders in product grid */
}

/* Ensure our custom title is visible */
h1.bv-collection-title {
    display: block !important;
}

/* ===== PRODUCT BADGES (Premium Rectangle Style) ===== */
.woocommerce span.onsale,
.onsale,
.badge {
    position: absolute;
    top: 10px;
    left: 10px;
    right: auto;
    background: #000 !important;
    color: #fff !important;
    padding: 4px 8px !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border-radius: 0 !important;
    min-width: auto !important;
    min-height: auto !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}

/* Title Styling */
.bv-collection-title {
    font-size: 1.5rem !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    margin-bottom: 40px !important;
    text-align: left !important;
    display: block;
}

/* ===== MATCH HOME PAGE PRODUCT CARD DESIGN ===== */

/* Product Titles - Black like Home */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2 {
    color: #000 !important;
    font-weight: 400 !important;
    font-size: 0.9rem !important;
    text-decoration: none !important;
    margin: 10px 0 5px !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title:hover,
.woocommerce ul.products li.product h2:hover {
    color: #000 !important;
}

/* Product Prices - Match Home Style */
.woocommerce ul.products li.product .price {
    color: #000 !important;
    font-weight: 700 !important;
    font-size: 1rem !important;
    margin: 5px 0 !important;
}

.woocommerce ul.products li.product .price del {
    color: #999 !important;
    font-weight: 400 !important;
}

.woocommerce ul.products li.product .price ins {
    text-decoration: none !important;
    color: #000 !important;
    /* Black color matching wishlist */
}


/* ===================================================================
   WISHLIST-STYLE SWATCHES - Enhanced Visual Feedback
   Applied to Shop and Home product cards
   ================================================================ */

/* Color Swatches - Outer Ring (Visible even on black colors) */
.color-swatches .color-swatch {
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    border: 0.8px solid #ddd !important;
    display: inline-block !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    position: relative !important;
}

.color-swatches .color-swatch.active,
.color-swatches .color-swatch:hover {
    /* Double box-shadow: white inner ring + black outer ring */
    box-shadow: 0 0 0 1px #fff, 0 0 0 3px #000 !important;
    transform: scale(1.1) !important;
}

/* Size Swatches - White to Black flip */
.size-swatches .size-swatch {
    background-color: #fff !important;
    border: 0.8px solid #ddd !important;
    color: #000 !important;
    border-radius: 4px !important;
    padding: 5px 10px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.size-swatches .size-swatch.active,
.size-swatches .size-swatch:hover {
    background-color: #000 !important;
    border-color: #000 !important;
    color: #fff !important;
}


/* ===================================================================
   UNIVERSAL SALE PRICE COLORS
   Applied to all pages (Home, Shop, Single Product, etc.)
   ================================================================ */

/* Sale Price - Black (matching wishlist) */
.price ins .woocommerce-Price-amount,
.price ins {
    color: #000 !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

/* Original Price (struck through) - Grey */
.price del .woocommerce-Price-amount,
.price del {
    color: #999 !important;
    font-weight: 400 !important;
}

/* ===================================================================
   FIX: Remove gap between product image and info on Shop page
   ================================================================ */

/* Remove WooCommerce default margin and ensure image fills container */
.woocommerce ul.products li.product a img {
    margin-bottom: 0 !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* ===================================================================
   GHOST BUTTONS - Mobile-First Responsive (Luxo + Usabilidade)
   ================================================================ */

/* Base: Mobile-first (SEMPRE VISÍVEL) com estilo outline */
.product-card .btn-ghost,
button.btn-ghost,
a.btn-ghost {
    display: block !important;
    background: transparent !important;
    border: 1px solid #000 !important;
    color: #000 !important;
    padding: 10px 20px !important;
    font-size: 0.75rem !important;
    font-weight: 400 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    cursor: pointer !important;
    width: 100% !important;
    text-align: center !important;
    box-sizing: border-box !important;

    /* Mobile: Sempre visível */
    opacity: 1 !important;
    transform: translateY(0) !important;
    transition: opacity 0.3s ease, transform 0.3s ease, background 0.2s ease, color 0.2s ease !important;
}

/* Mobile: Hover sutil (apenas darkening da borda) */
.product-card .btn-ghost:hover,
button.btn-ghost:hover,
a.btn-ghost:hover {
    border-color: #333 !important;
    background: transparent !important;
    color: #000 !important;
}

/* Desktop (≥768px): Animação Premium - Invisível até hover */
@media (min-width: 768px) {

    .product-card .btn-ghost,
    button.btn-ghost,
    a.btn-ghost {
        /* Estado inicial desktop: invisível e deslocado para baixo */
        opacity: 0 !important;
        transform: translateY(10px) !important;
        pointer-events: none !important;
    }

    /* Revelar APENAS no hover do card com animação suave */
    .product-card:hover .btn-ghost {
        opacity: 1 !important;
        transform: translateY(0) !important;
        pointer-events: auto !important;
    }

    /* Hover do botão: inverter cores (efeito premium) */
    .product-card .btn-ghost:hover,
    button.btn-ghost:hover,
    a.btn-ghost:hover {
        background: #000 !important;
        color: #fff !important;
        border-color: #000 !important;
    }
}

/* Rule removed: .btn-quick-buy.smart-btn:not(.btn-ghost) { display: none !important; } */

/* Garantir que vari\u00e1veis com swatches n\u00e3o mostrem ghost button */
.product-card:has(.smart-btn[data-state="select-color"]) .btn-ghost {
    display: none !important;
}

/* ===================================================================
   SHOP / ARCHIVE PAGE GRID LAYOUT
   Specific for /shop/, categories, etc. (ul.products)
   Does NOT affect Home (.product-grid)
   ================================================================ */

/* Selector de alta especificidade para garantir que sobrescreva padr\u00f5es */
body.woocommerce-page:not(.home) ul.products,
body.archive.woocommerce ul.products,
.elementor-widget-woocommerce-products ul.products {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    /* Mobile: 2 colunas */
    gap: 15px !important;
    width: 100% !important;
    margin: 0 0 40px 0 !important;
    padding: 0 !important;
}

/* Ajuste fino para telas muito pequenas (<380px) para evitar overflow */
@media (max-width: 380px) {

    body.woocommerce-page:not(.home) ul.products,
    body.archive.woocommerce ul.products,
    .elementor-widget-woocommerce-products ul.products {
        column-gap: 8px !important;
        /* Gap menor para caber melhor */
    }
}

/* Tablet (768px+): 3 colunas */
@media (min-width: 768px) {

    body.woocommerce-page:not(.home) ul.products,
    body.archive.woocommerce ul.products,
    .elementor-widget-woocommerce-products ul.products {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 20px !important;
    }
}

/* Desktop (1024px+): 4 colunas */
@media (min-width: 1024px) {

    body.woocommerce-page:not(.home) ul.products,
    body.archive.woocommerce ul.products,
    .elementor-widget-woocommerce-products ul.products {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}

/* Reset de itens de lista para funcionarem no Grid */
body.woocommerce-page:not(.home) ul.products li.product,
body.archive.woocommerce ul.products li.product {
    width: 100% !important;
    /* O Grid define a largura */
    min-width: 0 !important;
    /* CRITICAL FIX: Permite encolher em telas pequenas */
    margin: 0 !important;
    float: none !important;
    clear: none !important;
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
}

/* Garantir altura uniforme das imagens na Shop */
body.woocommerce-page:not(.home) ul.products li.product .product-image,
body.archive.woocommerce ul.products li.product .product-image {
    height: 350px !important;
    /* Altura fixa container Desktop */
    width: 100% !important;
}

body.woocommerce-page:not(.home) ul.products li.product .product-image img,
body.archive.woocommerce ul.products li.product .product-image img {
    height: 100% !important;
    /* Imagem ocupa 100% do container */
    object-fit: cover !important;
    width: 100% !important;
}

/* Ajuste mobile para imagens e container */
@media (max-width: 767px) {

    body.woocommerce-page:not(.home) ul.products li.product .product-image,
    body.archive.woocommerce ul.products li.product .product-image {
        height: 250px !important;
        /* Altura reduzida container Mobile */
    }
}

/* ===================================================================
   MOBILE HEADER REFINEMENTS (PREMIUM & STICKY)
   ================================================================ */

/* Default State (Desktop): Hide Mobile Elements */
.mobile-left-controls,
.mobile-user-icon,
.mobile-menu-drawer,
.mobile-socials,
.search-overlay {
    display: none !important;
}

.desktop-search-icon {
    display: flex !important;
}

/* MOBILE STYLES (<768px) */
@media (max-width: 767px) {

    /* 1. Hide Top Bar & Desktop Elements */
    .top-bar {
        display: none !important;
    }

    .desktop-search-icon {
        display: none !important;
    }

    .main-nav {
        display: none !important;
        /* Hide standard menu */
    }

    /* 2. Sticky Header (Fixed for robustness) */
    .site-header {
        position: fixed !important;
        /* Changed from sticky to fixed */
        top: 0;
        left: 0;
        z-index: 9999;
        background: #000;
        /* Black background */
        width: 100%;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
        transition: transform 0.3s ease;
    }

    /* Push content down so it doesn't hide behind fixed header */
    body {
        padding-top: 60px;
    }

    .main-bar {
        background: #000 !important;
        border: none !important;
        height: 60px;
        padding: 0 15px !important;
        display: grid !important;
        grid-template-columns: 1fr auto 1fr;
        align-items: center;
        backdrop-filter: none !important;
    }

    /* 3. Left Controls */
    .mobile-left-controls {
        display: flex !important;
        gap: 15px;
        align-items: center;
    }

    .mobile-left-controls button {
        background: none;
        border: none;
        color: #fff;
        padding: 0;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* 4. Logo */
    .site-logo {
        grid-column: 2;
        display: flex;
        justify-content: center;
        width: 100%;
    }

    .header-logo-img {
        height: 24px !important;
        width: auto !important;
        max-width: 120px !important;
        object-fit: contain;
    }

    /* 5. Right Icons */
    .header-icons {
        display: flex !important;
        gap: 15px !important;
        justify-content: flex-end;
        align-items: center;
        grid-column: 3;
    }

    .mobile-user-icon {
        display: flex !important;
        color: #fff !important;
    }

    .wishlist-icon,
    .cart-icon,
    .site-header .header-icons a {
        color: #fff !important;
    }

    /* 6. Mobile Menu Drawer */
    .mobile-menu-drawer {
        display: block !important;
        position: fixed;
        top: 0;
        left: -100%;
        width: 85%;
        max-width: 320px;
        height: 100vh;
        background: #fff;
        /* White Drawer */
        z-index: 10000;
        transition: left 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        box-shadow: 2px 0 10px rgba(0, 0, 0, 0.2);
        display: flex;
        flex-direction: column;
    }

    .mobile-menu-drawer.active {
        left: 0;
    }

    .mobile-menu-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 20px;
        border-bottom: 1px solid #eee;
        background: #000;
        color: #fff;
    }

    .mobile-menu-title {
        font-weight: 700;
        text-transform: uppercase;
        font-size: 1rem;
        letter-spacing: 1px;
    }

    #mobile-menu-close {
        background: none;
        border: none;
        color: #fff;
        font-size: 1.5rem;
        cursor: pointer;
        padding: 5px;
    }

    .mobile-menu-content {
        padding: 20px;
        overflow-y: auto;
        flex: 1;
        background: #fff;
    }

    /* Force Menu Items Visibility */
    .mobile-nav-list,
    .mobile-fallback-menu {
        list-style: none;
        padding: 0;
        margin: 0;
        width: 100%;
    }

    .mobile-nav-list li,
    .mobile-fallback-menu li {
        margin-bottom: 0;
    }

    .mobile-nav-list li a,
    .mobile-fallback-menu li a {
        text-decoration: none;
        color: #000 !important;
        /* Force Black text */
        font-size: 1rem;
        font-weight: 500;
        text-transform: uppercase;
        display: block;
        padding: 15px 0;
    }

    .mobile-socials {
        display: flex !important;
        gap: 15px;
        margin-top: 30px;
        padding-top: 20px;
        border-top: 1px solid #eee;
        justify-content: center;
    }

    /* Override desktop white icons to black for mobile */
    .mobile-socials svg {
        fill: #000 !important;
    }

    .mobile-socials svg path {
        fill: #000 !important;
    }

    .mobile-socials a:hover {
        opacity: 0.7;
    }

    /* 7. Search Overlay */
    .search-overlay {
        display: block !important;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.9);
        z-index: 10001;
        display: flex;
        align-items: center;
        justify-content: center;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.3s;
    }

    .search-overlay.active {
        opacity: 1;
        pointer-events: auto;
    }

    .search-form {
        position: relative;
        width: 80%;
    }

    .search-form input {
        width: 100%;
        background: transparent;
        border: none;
        border-bottom: 2px solid #fff;
        color: #fff;
        font-size: 1.5rem;
        padding: 10px 40px 10px 0;
        outline: none;
    }

    .search-form button {
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        background: none;
        border: none;
        color: #fff;
        cursor: pointer;
    }

    #mobile-search-close {
        position: absolute;
        top: 20px;
        right: 20px;
        background: none;
        border: none;
        color: #000;
        font-size: 3rem;
        cursor: pointer;
        background: #fff;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

/* ===== GLOBAL: HIDE WOOCOMMERCE DEFAULT NOTICES ===== */
/* 
 * DISABLED: This was blocking login error notices.
 * Keep visible on pages like My Account. Toast handles cart pages.
 *
.woocommerce-message,
.woocommerce-error,
.woocommerce-info,
.woocommerce-notices-wrapper {
    display: none !important;
}
*/

/* --- UTILITY: VISIBILITY --- */
@media (max-width: 767px) {
    .hide-on-mobile {
        display: none !important;
    }
}

@media (min-width: 768px) {
    .hide-on-desktop {
        display: none !important;
    }
}

/* --- UTILITY: TEXT ALIGNMENT --- */
.text-align-left {
    text-align: left !important;
    align-items: flex-start !important;
}

.text-align-center {
    text-align: center !important;
    align-items: center !important;
}

.text-align-right {
    text-align: right !important;
    align-items: flex-end !important;
}

/* =========================================
   CHAMELEON COLLECTIONS SECTION
   ========================================= */
.chameleon-section {
    width: 100%;
    overflow: hidden;
    position: relative;
}

/* --- SCENARIO A: HERO SPLIT --- */
.layout-hero-split {
    display: flex;
    flex-direction: column;
    height: auto;
}

@media (min-width: 992px) {
    .layout-hero-split {
        flex-direction: row;
        height: 85vh;
        min-height: 600px;
    }
}

.hero-text-side {
    background: #000;
    color: #fff;
    width: 100%;
    padding: 4rem 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* Default: Left Align (per user request) */
    align-items: flex-start;
    text-align: left;
}

@media (min-width: 992px) {
    .hero-text-side {
        width: 50%;
    }
}

.hero-image-side {
    width: 100%;
    height: 500px;
    /* Mobile height */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

@media (min-width: 992px) {
    .hero-image-side {
        width: 50%;
        height: 100%;
    }
}

.hero-subtitle {
    display: block;
    font-size: 0.9rem;
    letter-spacing: 0.2em;
    margin-bottom: 1rem;
    color: #ccc;
    font-weight: 300;
    font-family: var(--primary-font, 'Inter', sans-serif);
}

.hero-title {
    font-family: var(--heading-font, 'Inter', sans-serif);
    font-size: clamp(2.5rem, 5vw, 5rem);
    font-weight: 100;
    /* Thin */
    line-height: 1.1;
    margin-bottom: 2rem;
    color: #fff;
    text-transform: uppercase;
}

.btn-hero-ghost {
    display: inline-block;
    padding: 1rem 3rem;
    border: 1px solid #fff;
    color: #fff;
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 0.2em;
    transition: all 0.3s ease;
    text-decoration: none;
    background: transparent;
}

.btn-hero-ghost:hover {
    background: #fff;
    color: #000;
}

/* --- SCENARIO B: SPLIT SCREEN --- */
.layout-split-screen {
    display: flex;
    flex-direction: column;
}

@media (min-width: 768px) {
    .layout-split-screen {
        flex-direction: row;
        height: 85vh;
        min-height: 600px;
    }
}

.split-item {
    position: relative;
    width: 100%;
    height: 500px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    /* Default: Center vertically, Left horizontally */
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    overflow: hidden;
    transition: transform 0.6s ease;
}

@media (min-width: 768px) {
    .split-item {
        width: 50%;
        height: 100%;
        justify-content: flex-end;
        /* Bottom align on desktop by default? Or keep logic? 
                                      User wanted Left align text. 
                                      Let's keep justify-content flex-end (bottom) but align-items flex-start (left) for text. */
        padding-bottom: 4rem;
        align-items: flex-start;
    }
}



.split-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
    z-index: 1;
    pointer-events: none;
}

.split-content {
    position: relative;
    z-index: 2;
    /* Default: Left Align */
    text-align: left;
    color: #fff;
    padding: 2rem;
    pointer-events: none;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    /* Default Left */
}

.split-content .btn-split-ghost {
    pointer-events: auto;
}

.split-subtitle {
    display: block;
    font-size: 0.8rem;
    letter-spacing: 0.2em;
    margin-bottom: 0.5rem;
    color: #e0e0e0;
}

.split-title {
    font-size: 2.5rem;
    font-weight: 100;
    margin-bottom: 1.5rem;
    text-transform: uppercase;
    color: #fff;
    line-height: 1.1;
}

.btn-split-ghost {
    display: inline-block;
    padding: 0.8rem 2.5rem;
    border: 1px solid rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    color: #fff;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.15em;
    transition: all 0.3s;
    text-decoration: none;
}

.btn-split-ghost:hover {
    background: #fff;
    color: #000;
    border-color: #fff;
}

.full-link-overlay {
    position: absolute;
    inset: 0;
    z-index: 3;
}

/* --- SCENARIO C: SLIDER --- */
.layout-swiper-container {
    padding: 0;
    background: transparent;
}

.bv-collections-swiper {
    width: 100%;
    padding-bottom: 3rem;
}

.bv-collections-swiper .swiper-slide {
    height: auto;
    aspect-ratio: 3/4;
    min-height: 300px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    /* ... rest ... */
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    /* Bottom */
    align-items: flex-start;
    /* Default Left */
    padding-bottom: 3rem;
}

.slide-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
    z-index: 1;
}

.slide-content {
    position: relative;
    z-index: 2;
    /* Default: Left Align */
    text-align: left;
    color: #fff;
    width: 100%;
    padding: 0 2rem;
    /* Add padding for left align */
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.slide-subtitle {
    display: block;
    font-size: 0.75rem;
    letter-spacing: 0.15em;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}

.slide-title {
    font-size: 2rem;
    font-weight: 300;
    margin-bottom: 1rem;
    text-transform: uppercase;
}

.btn-slide-ghost {
    display: inline-block;
    padding: 0.6rem 2rem;
    border: 1px solid #fff;
    color: #fff;
    text-transform: uppercase;
    font-size: 0.7rem;
    letter-spacing: 0.1em;
}

.swiper-pagination-bullet {
    background: #fff !important;
    opacity: 0.5;
}

.swiper-pagination-bullet-active {
    opacity: 1;
}

/* ===================================================================
   CONTACT PAGE - PREMIUM CONCIERGE STYLE
   Strict overrides for form plugins to maintain luxury aesthetic
   ================================================================ */

.contact-page {
    background: #0a0a0a;
    color: #fff;
    min-height: 100vh;
}

/* HERO SECTION */
.contact-hero {
    position: relative;
    min-height: 50vh;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-color: #000;
}

.contact-hero-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1;
}

.contact-hero-content {
    position: relative;
    z-index: 2;
    padding: 0 20px;
}

.contact-hero-title {
    font-size: clamp(2.5rem, 5vw, 4.5rem);
    font-weight: 300;
    margin: 0 0 15px 0;
    letter-spacing: 0.05em;
    color: #fff;
    text-transform: uppercase;
}

.contact-hero-subtitle {
    font-size: clamp(1rem, 1.5vw, 1.2rem);
    font-weight: 300;
    color: #ccc;
    margin: 0;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

/* MAIN CONTENT GRID */
.contact-main {
    padding: 80px 5%;
    max-width: 1400px;
    margin: 0 auto;
}

.contact-container {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 80px;
}

/* LEFT: INFO INFO */
.contact-info {
    padding-top: 20px;
}

.contact-item {
    display: flex;
    gap: 25px;
    margin-bottom: 50px;
    align-items: flex-start;
    background: transparent !important;
    /* Force no background */
}

.contact-icon {
    width: 50px;
    height: 50px;
    border: 1px solid #333;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    flex-shrink: 0;
    background: transparent !important;
    /* Force no background (Fix Visual Bug) */
}

.contact-details h3 {
    font-size: 0.9rem;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 0 0 10px 0;
}

.contact-details p,
.contact-details a {
    font-size: 1.1rem;
    color: #fff;
    line-height: 1.5;
    text-decoration: none;
    font-weight: 300;
}

.contact-link {
    display: inline-block;
    margin-top: 5px;
    font-size: 0.9rem !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #fff;
    padding-bottom: 2px;
}

.contact-link:hover {
    color: #ccc;
    border-color: #ccc;
}

/* RIGHT: FORM WRAPPER (STRICT OVERRIDES) */
.contact-form-col {
    background: #111;
    padding: 50px;
    border: 1px solid #222;
}

.form-title {
    font-size: 1.8rem;
    margin-bottom: 30px;
    font-weight: 300;
}

/* FORCE STYLE ON ANY FORM PLUGIN inside .blackville-form-wrapper */
.blackville-form-wrapper input[type="text"],
.blackville-form-wrapper input[type="email"],
.blackville-form-wrapper input[type="tel"],
.blackville-form-wrapper input[type="url"],
.blackville-form-wrapper textarea,
.blackville-form-wrapper select {
    background: transparent !important;
    border: 1px solid #333 !important;
    color: #fff !important;
    border-radius: 0 !important;
    padding: 15px !important;
    font-size: 1rem !important;
    font-family: inherit !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-bottom: 20px !important;
    outline: none !important;
}

.blackville-form-wrapper input:focus,
.blackville-form-wrapper textarea:focus {
    border-color: #fff !important;
    background: #151515 !important;
}

.blackville-form-wrapper label {
    display: block !important;
    margin-bottom: 8px !important;
    font-size: 0.85rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    color: #aaa !important;
}

.blackville-form-wrapper input[type="submit"],
.blackville-form-wrapper button[type="submit"],
.wpcf7-submit {
    background: #fff !important;
    color: #000 !important;
    border: none !important;
    padding: 15px 40px !important;
    font-size: 0.9rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.15em !important;
    cursor: pointer !important;
    width: auto !important;
    border-radius: 0 !important;
    transition: all 0.3s ease !important;
}

.blackville-form-wrapper input[type="submit"]:hover,
.blackville-form-wrapper button[type="submit"]:hover,
.wpcf7-submit:hover {
    background: #ccc !important;
    transform: translateY(-2px);
}

.placeholder-form {
    padding: 40px;
    border: 1px dashed #333;
    text-align: center;
    color: #666;
}

/* MAP SECTION */
.contact-map {
    width: 100%;
    height: 500px;
    background: #1a1a1a;
}

.contact-map iframe {
    width: 100%;
    height: 100%;
    border: 0;
    /* GRAYSCALE FILTER - makes map black & white */
    filter: grayscale(100%) invert(90%) contrast(120%);
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

.contact-map iframe:hover {
    opacity: 1;
}

/* RESPONSIVE */
@media (max-width: 900px) {
    .contact-container {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .contact-form-col {
        padding: 30px;
    }

    .contact-hero {
        min-height: 40vh;
    }
}

/* ========================
   FOOTER STYLES (Refactored)
   ======================== */
.site-footer {
    background-color: #111;
    color: #ccc;
    font-size: 0.95rem;
    position: relative;
    z-index: 10;
}

.footer-container {
    max-width: 100%;
    /* Full width to match header */
    margin: 0 auto;
    padding: 80px 3%;
    /* Match header padding */
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
    border-top: 1px solid #222;
}

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

.footer-logo {
    height: auto !important;
    width: auto !important;
    max-width: 200px !important;
    max-height: 60px !important;
    margin-bottom: 20px;
    display: block;
    object-fit: contain;
}

.footer-logo-text {
    color: #fff;
    font-size: 1.5rem;
    margin-bottom: 20px;
    letter-spacing: 0.1em;
}

.footer-about-text {
    line-height: 1.6;
    color: #888;
    font-size: 0.9rem;
}

.footer-col h3.footer-title {
    color: #fff;
    font-size: 1.1rem;
    margin-bottom: 25px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 600;
}

.footer-menu {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-menu li {
    margin-bottom: 12px;
}

.footer-menu a {
    color: #888;
    text-decoration: none;
    transition: color 0.3s;
    font-size: 0.95rem;
}

.footer-menu a:hover {
    color: #fff;
    padding-left: 5px;
    /* Subtle interaction */
}

/* Newsletter */
.footer-newsletter-form {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.footer-newsletter-form input {
    flex: 1;
    padding: 12px;
    background: #000;
    border: 1px solid #333;
    color: #fff;
    font-size: 0.9rem;
    border-radius: 0;
    outline: none;
}

.footer-newsletter-form input:focus {
    border-color: #fff;
}

.footer-newsletter-form button {
    background: #fff;
    color: #000;
    border: none;
    padding: 12px 20px;
    font-weight: bold;
    cursor: pointer;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 0.05em;
    transition: all 0.3s ease;
}

.footer-newsletter-form button:hover {
    background: #ccc;
}

/* Bottom Bar */
.footer-bottom {
    background: #000;
    padding: 30px 5%;
    border-top: 1px solid #1a1a1a;
}

.footer-bottom-content {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.footer-copyright {
    color: #666;
    font-size: 0.85rem;
}

.footer-social a {
    color: #fff;
    margin-left: 20px;
    text-decoration: none;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    opacity: 0.7;
    transition: opacity 0.3s;
}

.footer-social a:hover {
    opacity: 1;
}

/* ========================
   CRITICAL MOBILE FIX
   ======================== */
@media (max-width: 768px) {
    .footer-container {
        grid-template-columns: 1fr;
        /* Stack vertically */
        gap: 50px;
        /* Generous gap for spacing */
        padding: 60px 20px;
        text-align: left;
    }

    .footer-col {
        border-bottom: 1px solid #1a1a1a;
        /* Visual separation */
        padding-bottom: 30px;
    }

    .footer-col:last-child {
        border-bottom: none;
        padding-bottom: 0;
    }

    .footer-newsletter-form {
        flex-direction: column;
    }

    .footer-newsletter-form input {
        width: 100%;
        /* Full width for easy tap */
        box-sizing: border-box;
        height: 50px;
    }

    .footer-newsletter-form button {
        width: 100%;
        height: 50px;
        margin-top: 5px;
    }

    .footer-bottom-content {
        flex-direction: column;
        text-align: center;
        gap: 15px;
    }

    .footer-social a {
        margin: 0 10px;
    }
}

/* ========================
   JOURNAL / BLOG STYLES
   ======================== */
.journal-cover {
    padding-bottom: 60px;
    background-color: #f9f9f9;
}

.journal-header {
    text-align: center;
    padding: 80px 20px 60px;
    max-width: 900px;
    margin: 0 auto;
}

h1.journal-title {
    font-size: clamp(2.5rem, 5vw, 4.5rem);
    letter-spacing: -0.05em;
    margin-bottom: 15px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.journal-subtitle {
    font-size: 1.2rem;
    color: #555;
    font-style: italic;
    font-family: 'Times New Roman', Times, serif;
    /* Editorial vibe */
    margin: 0;
}

.journal-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

/* === FEATURED POST (HERO) === */
.journal-featured-post {
    display: grid;
    grid-template-columns: 1.3fr 0.7fr;
    gap: 60px;
    margin-bottom: 100px;
    align-items: center;
}

.featured-img {
    width: 100%;
    height: 550px;
    object-fit: cover;
    display: block;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    /* Soft shadow */
}

.featured-content {
    padding-right: 20px;
}

.journal-cat {
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 0.15em;
    font-weight: 700;
    border-bottom: 1px solid #000;
    padding-bottom: 5px;
    margin-bottom: 25px;
    display: inline-block;
}

.featured-title {
    font-size: clamp(2rem, 3.5vw, 3rem);
    margin: 20px 0;
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.featured-title a {
    text-decoration: none;
    color: #000;
    transition: color 0.3s;
}

.featured-title a:hover {
    color: #555;
}

.featured-excerpt {
    font-size: 1.15rem;
    color: #444;
    margin-bottom: 30px;
    font-family: 'Times New Roman', Times, serif;
    line-height: 1.6;
}

.featured-meta {
    font-size: 0.85rem;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.btn-journal-read {
    display: inline-block;
    padding: 12px 30px;
    background: #000;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    font-weight: 600;
    transition: all 0.3s;
}

.btn-journal-read:hover {
    background: #444;
    transform: translateY(-2px);
}

/* === GRID LAYOUT === */
.journal-feed.layout-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.journal-card .card-img-wrapper {
    overflow: hidden;
    margin-bottom: 20px;
    position: relative;
    aspect-ratio: 16/9;
    /* Landscape Video/Blog Ratio */
    background-color: #f0f0f0;
}

.journal-card .card-img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    /* Ensures it covers the area, might crop slightly but better for grid */
    transition: transform 0.5s ease;
}

.journal-card:hover .card-img {
    transform: scale(1.05);
}

.card-title {
    font-size: 1.4rem;
    margin: 10px 0;
    line-height: 1.3;
}

.card-title a {
    text-decoration: none;
    color: #000;
}

.card-excerpt {
    font-size: 0.95rem;
    color: #555;
    line-height: 1.5;
    margin-bottom: 15px;
    font-family: 'Times New Roman', Times, serif;
    /* Editorial touch */
}

.journal-cat-small {
    font-size: 0.7rem;
    text-transform: uppercase;
    color: #888;
    letter-spacing: 0.1em;
    display: block;
    margin-bottom: 8px;
}

.card-meta {
    margin-top: 15px;
    font-size: 0.8rem;
    color: #666;
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #eee;
    padding-top: 15px;
}

.read-more-link a {
    text-decoration: none;
    color: #000;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.75rem;
}

/* === LIST LAYOUT === */
.journal-feed.layout-list {
    display: flex;
    flex-direction: column;
    gap: 60px;
    max-width: 800px;
    margin: 0 auto;
}

.journal-feed.layout-list .journal-card {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 30px;
    align-items: center;
}

.journal-feed.layout-list .card-img-wrapper {
    aspect-ratio: 16/9;
    margin-bottom: 0;
}

/* === SINGLE POST (ARTICLE) === */
.journal-single .journal-article-header {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
    padding: 60px 20px 40px;
}

.journal-article-title {
    font-size: clamp(2.5rem, 5vw, 3.8rem);
    line-height: 1.1;
    margin: 20px 0;
    font-weight: 800;
    letter-spacing: -0.03em;
}

.journal-meta-top,
.journal-meta-bottom {
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #777;
    margin-bottom: 10px;
}

.journal-cat-label {
    font-weight: 700;
    color: #000;
}

.journal-hero-image {
    width: 100%;
    height: 70vh;
    overflow: hidden;
    margin-bottom: 60px;
}

.journal-hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.journal-content-wrapper {
    max-width: 740px;
    margin: 0 auto;
    padding: 0 20px;
}

.journal-serif-text {
    font-family: 'Merriweather', 'Georgia', serif;
    font-size: 1.25rem;
    line-height: 1.8;
    color: #222;
}

.journal-serif-text p {
    margin-bottom: 1.8em;
}

.journal-serif-text h2,
.journal-serif-text h3 {
    font-family: var(--font-primary);
    /* Sans for headings inside serif body */
    margin-top: 2em;
    margin-bottom: 1em;
    font-weight: 700;
}

/* DROP CAP */
.has-drop-cap>p:first-of-type::first-letter {
    float: left;
    font-size: 5rem;
    line-height: 0.8;
    font-weight: 800;
    margin-right: 15px;
    margin-top: 5px;
    font-family: var(--font-primary);
    color: #000;
}

/* AUTHOR BOX */
.journal-author-box {
    margin-top: 80px;
    padding: 40px;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    gap: 30px;
    border-radius: 4px;
}

.author-avatar img {
    border-radius: 50%;
    width: 80px;
    height: 80px;
    object-fit: cover;
}

.author-name {
    margin: 0 0 10px;
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.author-bio {
    margin: 0;
    font-size: 0.95rem;
    color: #555;
    line-height: 1.6;
}

/* SHARE */
.journal-share-section {
    margin-top: 60px;
    padding-top: 30px;
    border-top: 1px solid #eee;
    display: flex;
    align-items: center;
    gap: 15px;
}

.share-btn {
    padding: 8px 16px;
    border: 1px solid #ddd;
    text-decoration: none;
    color: #555;
    font-size: 0.8rem;
    text-transform: uppercase;
    border-radius: 20px;
    transition: all 0.2s;
}

.share-btn:hover {
    background: #000;
    color: #fff;
    border-color: #000;
}

/* RELATED */
.journal-related-section {
    background: #fafafa;
    padding: 80px 0;
    margin-top: 80px;
}

.related-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 3%;
}

.related-wrapper h3 {
    text-align: center;
    margin-bottom: 40px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.related-card img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    margin-bottom: 15px;
}

.related-card h4 a {
    text-decoration: none;
    color: #000;
    font-size: 1.2rem;
}

/* RESPONSIVE JOURNAL */
@media (max-width: 900px) {
    .journal-featured-post {
        grid-template-columns: 1fr;
        gap: 30px;
        margin-bottom: 60px;
    }

    .featured-img {
        height: 350px;
    }

    .journal-feed.layout-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .related-grid {
        grid-template-columns: 1fr;
    }

    .journal-header {
        padding: 40px 20px;
    }

    .journal-hero-image {
        height: 400px;
    }
}

/* === LOGIN PAGE (SPLIT SCREEN) === */
.bv-login-split-screen {
    display: flex;
    min-height: 100vh;
    background: #111;
    /* Dark fallback */
    width: 100%;
}

.bv-login-image {
    width: 50%;
    background-size: cover;
    background-position: center;
    position: relative;
}

.bv-login-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.2);
    /* Slight overlay */
}

.bv-login-form-wrapper {
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0a0a0a;
    /* Deep Black/Gray */
    color: #fff;
    padding: 40px;
}

.bv-login-content {
    width: 100%;
    max-width: 420px;
}

/* FIX: Forçar exibição de erros APENAS na página Minha Conta */
.bv-login-split-screen .woocommerce-notices-wrapper,
.bv-login-content .woocommerce-notices-wrapper {
    display: block !important;
}

.bv-login-split-screen .woocommerce-error,
.bv-login-split-screen .woocommerce-message,
.bv-login-split-screen .woocommerce-info,
.bv-login-content .woocommerce-error,
.bv-login-content .woocommerce-message,
.bv-login-content .woocommerce-info {
    display: block !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    background: #d63638 !important;
    color: #fff !important;
    padding: 15px 20px !important;
    margin-bottom: 20px !important;
    border-radius: 4px !important;
    font-size: 0.9rem !important;
    line-height: 1.5 !important;
}

.bv-login-header {
    margin-bottom: 40px;
}

.bv-login-header h2 {
    font-size: 2rem;
    color: #fff;
    margin-bottom: 10px;
    font-weight: 300;
}

.bv-login-header p {
    color: #888;
    font-size: 0.95rem;
}

/* TABS */
.bv-login-tabs {
    display: flex;
    gap: 30px;
    margin-bottom: 40px;
    border-bottom: 1px solid #333;
}

.bv-tab-btn {
    background: none;
    border: none;
    color: #555;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding-bottom: 15px;
    cursor: pointer;
    transition: all 0.3s;
    position: relative;
    outline: none;
}

.bv-tab-btn.active {
    color: #fff;
}

.bv-tab-btn.active::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 2px;
    background: #fff;
}

/* FORMS */
.bv-form-box {
    display: none;
    animation: fadeIn 0.4s ease;
}

.bv-form-box.active {
    display: block;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* GHOST INPUTS */
.ghost-input {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid #444 !important;
    color: #fff !important;
    padding: 15px 0 !important;
    border-radius: 0 !important;
    font-size: 1rem !important;
    transition: border-color 0.3s !important;
}

.ghost-input:focus {
    border-bottom-color: #fff !important;
    outline: none !important;
    box-shadow: none !important;
}

.woocommerce-form-row label {
    margin-bottom: 0px;
    font-size: 0.8rem;
    color: #999;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* BUTTONS */
.bv-login-form-wrapper button[type="submit"] {
    width: 100%;
    border-radius: 0;
    padding: 15px;
    background: #fff;
    color: #000;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-top: 20px;
    border: 1px solid #fff;
    transition: all 0.3s;
}

.bv-login-form-wrapper button[type="submit"]:hover {
    background: transparent;
    color: #fff;
}

.bv-login-form-wrapper a {
    color: #888;
}

/* SOCIAL LOGIN OVERRIDES (GENERIC) */
.social-login-btn,
.fb-login-button,
.google-login-button {
    filter: grayscale(100%) contrast(1.2) !important;
    transition: filter 0.3s;
}

.social-login-btn:hover {
    filter: grayscale(0%) !important;
}

/* RESPONSIVE */
@media (max-width: 900px) {
    .bv-login-split-screen {
        flex-direction: column;
    }

    .bv-login-image {
        display: none;
        /* Hide image on mobile to focus on login */
    }

    .bv-login-form-wrapper {
        width: 100%;
        min-height: 100vh;
        padding: 20px;
    }
}

/* === DASHBOARD (LOGGED IN) === */
.bv-dashboard-container {
    display: flex;
    max-width: 1300px;
    margin: 60px auto;
    padding: 0 4%;
    gap: 50px;
    min-height: 60vh;
}

.bv-dashboard-sidebar {
    width: 260px;
    flex-shrink: 0;
    padding-right: 20px;
    border-right: 1px solid #eee;
}

.bv-sidebar-header h3 {
    font-size: 1.2rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 30px;
    padding-bottom: 15px;
    border-bottom: 2px solid #000;
}

.woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.woocommerce-MyAccount-navigation li {
    margin-bottom: 0;
}

.woocommerce-MyAccount-navigation li a {
    display: block;
    padding: 15px 0;
    color: #666;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #eee;
    transition: all 0.2s;
}

.woocommerce-MyAccount-navigation li a:hover {
    color: #000;
    padding-left: 10px;
}

.woocommerce-MyAccount-navigation li.is-active a {
    color: #000;
    font-weight: 700;
    border-bottom-color: #000;
}

.bv-dashboard-content {
    flex: 1;
}

.bv-dashboard-content p {
    font-size: 1rem;
    color: #444;
    line-height: 1.6;
}

.woocommerce-MyAccount-content strong {
    color: #000;
}

/* RESPONSIVE DASHBOARD */
@media (max-width: 900px) {
    .bv-dashboard-container {
        flex-direction: column;
        gap: 30px;
    }

    .bv-dashboard-sidebar {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid #eee;
        padding-bottom: 20px;
    }

    .bv-sidebar-header h3 {
        margin-bottom: 15px;
    }

    .woocommerce-MyAccount-navigation ul {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .woocommerce-MyAccount-navigation li a {
        border-bottom: none;
        background: #f5f5f5;
        padding: 8px 15px;
        border-radius: 4px;
        font-size: 0.8rem;
    }

    .woocommerce-MyAccount-navigation li.is-active a {
        background: #000;
        color: #fff;
    }
}

/* === PAGINATION (PREMIUM) === */
.woocommerce-pagination,
.navigation.pagination {
    margin-top: 60px;
    text-align: center;
}

.woocommerce-pagination ul,
.nav-links {
    display: flex;
    justify-content: center;
    gap: 10px;
    border: none !important;
    list-style: none;
    padding: 0;
}

.woocommerce-pagination ul li,
.nav-links li {
    border: none !important;
    overflow: hidden;
    margin: 0;
}

.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span,
.page-numbers {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    background: #f5f5f5;
    color: #000;
    text-decoration: none;
    font-size: 1rem;
    font-weight: 500;
    transition: all 0.3s ease;
    border-radius: 0;
    /* Square premium look */
    border: 1px solid #eee;
}

.woocommerce-pagination ul li a:hover,
.woocommerce-pagination ul li span.current,
.page-numbers.current,
.page-numbers:hover {
    background: #000;
    color: #fff;
    border-color: #000;
}

/* Next/Prev Arrow Adjustments */
.woocommerce-pagination ul li a.next,
.woocommerce-pagination ul li a.prev,
.next.page-numbers,
.prev.page-numbers {
    width: auto;
    padding: 0 20px;
}

/* === AJAX SEARCH OVERLAY === */
.bv-search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.95);
    z-index: 99999;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 100px;
    overflow-y: auto;
}

.bv-search-overlay.active {
    opacity: 1;
    visibility: visible;
}

#ajax-search-close {
    position: absolute;
    top: 30px;
    right: 30px;
    background: none;
    border: none;
    color: #fff;
    font-size: 3rem;
    cursor: pointer;
    line-height: 1;
}

.bv-search-container {
    width: 100%;
    max-width: 1000px;
    padding: 0 20px;
}

.bv-search-form {
    position: relative;
    margin-bottom: 60px;
    text-align: center;
}

.bv-search-input {
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 2px solid #333;
    color: #fff;
    font-size: 2.5rem;
    padding: 20px 0;
    text-align: center;
    border-radius: 0;
    outline: none !important;
}

.bv-search-input:focus {
    border-bottom-color: #fff;
}

/* Spinner */
.ajax-search-spinner {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    opacity: 0;
    transition: opacity 0.2s;
}

.ajax-search-spinner.visible {
    opacity: 1;
}

.ajax-search-spinner .spinner {
    animation: rotate 2s linear infinite;
    width: 100%;
    height: 100%;
}

.ajax-search-spinner .path {
    stroke: #fff;
    stroke-linecap: round;
    animation: dash 1.5s ease-in-out infinite;
}

@keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}

@keyframes dash {
    0% {
        stroke-dasharray: 1, 150;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 90, 150;
        stroke-dashoffset: -35;
    }

    100% {
        stroke-dasharray: 90, 150;
        stroke-dashoffset: -124;
    }
}

/* Results Grid */
.bv-search-results {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    padding-bottom: 50px;
}

.ajax-result-item {
    display: block;
    text-decoration: none;
    color: #fff;
    transition: opacity 0.3s;
}

.ajax-result-item:hover {
    opacity: 0.8;
}

.result-img {
    aspect-ratio: 3/4;
    overflow: hidden;
    margin-bottom: 15px;
    background: #111;
}

.result-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.result-info {
    text-align: center;
}

.result-title {
    display: block;
    font-size: 0.9rem;
    text-transform: uppercase;
    margin-bottom: 5px;
    letter-spacing: 0.05em;
}

.result-price {
    display: block;
    font-size: 0.85rem;
    color: #888;
}

.no-results {
    color: #666;
    text-align: center;
    font-size: 1.2rem;
}

/* Mobile Search */
@media (max-width: 768px) {
    .bv-search-input {
        font-size: 1.5rem;
    }

    .bv-search-results {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }
}

/* Kit Product Title Adjustment */
.product-type-grouped .product-info-wrapper .product-title {
    padding-top: 60px;
}

/* Variable Product Spacing Adjustment */
.product-type-variable .product-info-wrapper .product-title {
    padding-top: 60px;
}

/* Fix Related Products Alignment */
.single-product .related.products {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
    width: 100%;
}

/* Fix Unwanted Top Padding on Single Product Pages */
.single-product .site-main,
.single-product .content-area,
.single-product #primary,
.single-product .product-layout-grid {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Hide breadcrumbs on single product to prevent spacing issues */
.single-product .woocommerce-breadcrumb {
    display: none;
}

/* ==================================
   FIX: Empty Product Slot in Grid
   ================================== */
/* WooCommerce adds ::before and ::after for clearfix which become
   grid items when display:grid is used, stealing the first cell.
   This disables them to prevent the empty slot issue. */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
ul.products::before,
ul.products::after,
.products::before,
.products::after {
    content: none !important;
}

/* Force Smart Button Visibility */
.smart-btn.visible-forced {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}


/* Fix Simple Product Card Layout - Remove 'View Cart' link */
.product-card .added_to_cart,
.product-card a.added_to_cart {
    display: none !important;
}

.product-card .btn-add-to-cart {
    width: 100%;
    justify-content: center;
}

/* OUT OF STOCK STYLING (Red X) */
.size-swatch.disabled,
.color-swatch.disabled,
.swatch.disabled {
    opacity: 0.5;
    cursor: not-allowed !important;
    position: relative;
    color: #ccc !important;
    border-color: #eee !important;
}

.size-swatch.disabled::after,
.color-swatch.disabled::after,
.swatch.disabled::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 1px;
    background-color: #ff0000;
    transform: translate(-50%, -50%) rotate(45deg);
    pointer-events: none;
}

.size-swatch.disabled::before,
.color-swatch.disabled::before,
.swatch.disabled::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 1px;
    background-color: #ff0000;
    transform: translate(-50%, -50%) rotate(-45deg);
    pointer-events: none;
}

/* Wishlist Out-of-Stock Swatches */
.bv-wishlist-swatch.size-swatch.out-of-stock {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
    position: relative;
    text-decoration: line-through;
    background-color: #f0f0f0 !important;
    color: #999 !important;
    border-color: #ddd !important;
}

.bv-wishlist-swatch.size-swatch.out-of-stock .oos-x {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.2em;
    color: #cc0000;
    font-weight: bold;
    pointer-events: none;
}

.bv-wishlist-swatch.size-swatch {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 36px;
    padding: 0 12px;
    border: 1px solid #ddd;
    background: #fff;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.85rem;
    position: relative;
}

.bv-wishlist-swatch.size-swatch:not(.out-of-stock):hover {
    border-color: #000;
}

.bv-wishlist-swatch.size-swatch.selected {
    background: #000;
    color: #fff;
    border-color: #000;
}

.bv-wishlist-swatch.color-swatch {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 2px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
}

.bv-wishlist-swatch.color-swatch:hover,
.bv-wishlist-swatch.color-swatch.selected {
    border-color: #000;
    transform: scale(1.1);
}

/* Product Card Out-of-Stock Button */
.btn-out-of-stock,
.btn-ghost.btn-out-of-stock {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
    background-color: #ccc !important;
    color: #666 !important;
    border-color: #ccc !important;
}

/* Product Card Size Swatches - Out of Stock */
.product-card .size-swatch.out-of-stock,
.size-swatches .size-swatch.out-of-stock {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
    position: relative;
    text-decoration: line-through;
    background-color: #f0f0f0 !important;
    color: #999 !important;
    border-color: #ddd !important;
}

.product-card .size-swatch.out-of-stock .oos-x,
.size-swatches .size-swatch.out-of-stock .oos-x {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.1em;
    color: #cc0000;
    font-weight: bold;
    pointer-events: none;
}

/* Product Card Size Swatches - Base Styles */
.product-card .size-swatch,
.size-swatches .size-swatch {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 32px;
    padding: 0 10px;
    border: 1px solid #ddd;
    background: #fff;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.8rem;
    position: relative;
}

.product-card .size-swatch:not(.out-of-stock):hover,
.size-swatches .size-swatch:not(.out-of-stock):hover {
    border-color: #000;
}

.product-card .size-swatch.active,
.size-swatches .size-swatch.active {
    background: #000;
    color: #fff;
    border-color: #000;
}

/* --- Mobile Wishlist Optimizations --- */
@media (max-width: 768px) {
    .bv-wishlist-grid {
        display: grid;
        grid-template-columns: 1fr !important;
        /* Force 1 column */
        gap: 30px;
    }

    /* Stack quantity and add-to-cart button vertically */
    .product-card .card-action-bar {
        flex-direction: column;
        gap: 10px;
        align-items: stretch;
        /* Full width items */
    }

    .product-card .quantity {
        width: 100% !important;
        margin-right: 0 !important;
        justify-content: center;
        /* Center +/- buttons */
        height: 40px;
    }

    .product-card .btn-quick-buy,
    .product-card .btn-add-to-cart {
        width: 100% !important;
        margin-left: 0 !important;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 0.85rem;
    }
}

/* ========================
   WOOCOMMERCE NOTICES
   ======================== */
.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
    padding: 15px 20px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 0;
    list-style: none inside !important;
    color: #fff;
    font-size: 0.9rem;
    font-weight: 500;
}

.woocommerce-error li,
.woocommerce-info li,
.woocommerce-message li {
    margin-bottom: 5px;
}

.woocommerce-error {
    background-color: #b00;
    /* Dark Red */
    border-color: #900;
}

.woocommerce-message {
    background-color: #2e7d32;
    /* Green */
    border-color: #1b5e20;
}

.woocommerce-info {
    background-color: #0277bd;
    /* Blue */
    border-color: #01579b;
}

.woocommerce-error a,
.woocommerce-info a,
.woocommerce-message a {
    color: #fff;
    text-decoration: underline;
    font-weight: 700;
}