/* Custom Styles for BowieCudris Homepage */
:root {
    --font-heading: 'EB Garamond', serif;
    --font-body: 'Inter', sans-serif;
    --color-text: #333333;
    --color-bg: #ffffff;
    --color-border: #e0e0e0;
}

.main-navigation ul li.current-menu-item > a,
.main-navigation ul li.current_page_item > a,
.main-navigation ul li.current-menu-ancestor > a {
    color: #004d40 !important;
}

body {
    font-family: var(--font-body);
    color: var(--color-text);
    background: var(--color-bg);
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
    width: 100%;
}

html {
    overflow-x: hidden;
    width: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-heading);
    font-weight: 500;
}

a {
    text-decoration: none;
    color: inherit;
    transition: color 0.3s;
}

a:hover {
    color: #666;
}

/* =========================================
   HEADER
   ========================================= */
.site-header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    padding: 15px 30px;
    background: #ffffff;
    transition: all 0.4s ease;
}

/* Base colors for all pages */
.site-header a,
.site-header .main-navigation a,
.site-header .header-icons a,
.site-header .header-lang a {
    color: #000000;
    transition: color 0.4s ease;
}

.site-header .custom-logo {
    filter: none;
    max-width: 250px;
    height: auto;
    transition: filter 0.4s ease;
}

/* HOMEPAGE SPECIAL STATE (Transparent over Hero) */
.home .site-header:not(.is-scrolled) {
    background: transparent;
}

.home .site-header:not(.is-scrolled) a,
.home .site-header:not(.is-scrolled) .main-navigation a,
.home .site-header:not(.is-scrolled) .header-icons a,
.home .site-header:not(.is-scrolled) .header-lang a {
    color: #ffffff;
}

.home .site-header:not(.is-scrolled) .custom-logo {
    filter: brightness(0) invert(1);
}

/* ONLY DESKTOP: Sticky header behavior */
@media screen and (min-width: 769px) {
    .site-header {
        position: fixed;
        top: 0 !important;
        margin: 0 !important;
    }

    /* Fix gap when admin bar is present */
    .admin-bar .site-header {
        top: 32px !important;
    }

    /* Scrolled state (Standard look) */
    .site-header.is-scrolled {
        background: #ffffff;
        padding: 10px 30px;
        /* Slimmer on scroll */
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    }
}

@media screen and (max-width: 782px) {

    /* Admin bar spacing for mobile header (still absolute) */
    .admin-bar .site-header {
        top: 46px !important;
    }
}

.site-branding .custom-logo {
    max-width: 280px;
    height: auto;
    display: inline-block;
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-left,
.header-right {
    flex: 1.5;
    /* Increased to give more room to side elements */
}

.main-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 15px;
    /* Reduced from 20px */
    white-space: nowrap;
    /* Prevent wrapping */
}

.main-navigation a {
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
    font-size: 12px;
    letter-spacing: 1.5px;
}

.site-branding {
    flex: 1;
    /* Decreased from 2 (total flex space is now balanced) */
    text-align: center;
}

.site-title-logo {
    font-family: var(--font-heading);
    font-size: 28px;
    font-weight: 600;
    letter-spacing: 5px;
    margin: 0;
}

.site-title-logo span {
    font-weight: 400;
    font-style: italic;
    font-size: 24px;
    text-transform: lowercase;
}

.site-subtitle-logo {
    display: block;
    font-family: var(--font-body);
    font-size: 9px;
    letter-spacing: 4px;
    text-transform: uppercase;
    margin-top: 5px;
}

.header-right {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 30px;
}

.header-icons {
    display: flex;
    gap: 15px;
    align-items: center;
}

.header-icons a {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.header-icons .count {
    position: absolute;
    top: -6px;
    left: 12px;
    font-size: 9px;
    background: #004d40;
    color: #fff;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    margin: 0;
    padding: 0;
}

.header-icons .amount {
    font-size: 11px;
    margin-left: 5px;
}

.header-lang {
    font-size: 11px;
    letter-spacing: 2px;
    font-family: 'Lato', sans-serif;
}

.header-mobile {
    display: none;
}

/* =========================================
   SEARCH OVERLAY
   ========================================= */
.bsp-search-overlay {
    font-family: 'Lato', sans-serif;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgba(255, 255, 255, 0.98);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}
.bsp-search-overlay.active {
    opacity: 1;
    visibility: visible;
}
.bsp-search-close {
    position: absolute;
    top: 30px;
    right: 40px;
    cursor: pointer;
    color: #000;
    transition: transform 0.3s;
}
.bsp-search-close:hover {
    transform: rotate(90deg);
}
.bsp-search-container {
    width: 100%;
    max-width: 800px;
    padding: 0 40px;
    position: relative;
}
.bsp-search-form {
    display: flex;
    align-items: center;
    border-bottom: 2px solid #000;
    padding-bottom: 10px;
}
.bsp-search-input {
    width: 100%;
    border: none;
    background: transparent;
    font-size: 24px;
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    color: #000;
    outline: none;
}
.bsp-search-input::placeholder {
    color: #999;
}
.bsp-search-submit {
    background: none;
    border: none;
    cursor: pointer;
    color: #000;
    padding: 0 10px;
}
.bsp-search-submit:hover {
    color: #666;
}
.bsp-search-results {
    margin-top: 30px;
    max-height: 50vh;
    overflow-y: auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.bsp-search-results.loading {
    opacity: 0.5;
}
.bsp-search-item {
    display: flex;
    align-items: center;
    gap: 20px;
    text-decoration: none;
    color: #000;
    padding: 10px;
    transition: background 0.2s;
}
.bsp-search-item:hover {
    background: #f9f9f9;
}
.bsp-search-item img {
    width: 60px;
    height: auto;
    object-fit: cover;
}
.bsp-search-item-info {
    display: flex;
    flex-direction: column;
}
.bsp-search-item-title {
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 5px;
}
.bsp-search-item-price {
    font-size: 14px;
    color: #666;
}
.bsp-search-no-results {
    font-size: 16px;
    color: #777;
    text-align: center;
    padding: 20px;
}

/* =========================================
   HERO CAROUSEL
   ========================================= */
.hero-section {
    position: relative;
    height: 100vh;
    min-height: 600px;
    overflow: hidden;
}

.hero-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 30%;
    /* Only covers the top portion where the menu is */
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%);
    z-index: 5;
    /* Above images, below header content */
    pointer-events: none;
}

.hero-carousel {
    width: 100%;
    height: 100%;
}

.hero-picture img {
    width: 100%;
    height: 100vh;
    object-fit: cover;
    display: block;
}

.hero-content {
    position: absolute;
    bottom: 80px; /* Increased from 40px to separate from dots */
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    color: #ffffff;
    z-index: 10;
}

.hero-title {
    font-family: 'Spectral', serif;
    font-size: 58px; /* Changed from 32px to 58px */
    letter-spacing: 2px;
    margin: 0;
    text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
}

.btn-hero {
    display: inline-block;
    border: 1px solid #ffffff;
    padding: 12px 30px;
    font-size: 12px;
    letter-spacing: 2px;
    font-weight: 600;
    color: #ffffff;
    background: transparent;
    transition: all 0.3s ease;
    text-transform: uppercase;
    margin-top: 25px; /* Spacing between title and button */
}
.btn-hero:hover {
    background: #ffffff;
    color: #000000;
}

.hero-excerpt {
    font-family: 'EB Garamond', serif;
    font-size: 13px;
    text-transform: lowercase;
    margin: 5px 0 0;
}

.hero-link {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 20;
}

.swiper-button-prev,
.swiper-button-next {
    color: #0e0e0e !important;
    width: 45px !important;
    height: 45px !important;
    border: 1px solid #0e0e0e;
    border-radius: 50%;
    background: transparent;
    transition: all 0.3s ease;
    z-index: 50;
}

.swiper-button-prev::after,
.swiper-button-next::after {
    font-size: 14px !important;
    /* Smaller chevron size */
    font-weight: bold;
}

.swiper-button-prev:hover,
.swiper-button-next:hover {
    background: rgba(255, 255, 255, 0.2);
}

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

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

.hero-mobile-footer {
    display: none;
}

/* =========================================
   CATEGORIES SECTION
   ========================================= */
.categories-section {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 120px 20px;
    gap: 40px;
    max-width: 1200px;
    margin: 0 auto;
}

.categories-carousel {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
}

.categories-carousel .swiper-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 80px;
}

.categories-carousel .swiper-slide {
    width: auto !important;
    /* Allow natural width of cards on desktop */
}

.category-card {
    text-align: center;
    display: block;
    width: 300px;
    flex: 0 0 auto;
}

.categories-logo-divider.desktop-only {
    display: block !important;
}

.category-image img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.category-text {
    margin-top: 15px;
}

.category-text h3 {
    margin: 0;
    font-family: 'Spectral', serif;
    font-size: 40px;
}

.category-text span {
    font-size: 12px;
    font-family: var(--font-body);
    text-transform: lowercase;
}

.categories-logo-divider img {
    width: 80px;
    height: auto;
}

.category-item {
    display: none;
    /* Hidden on desktop as it's not a carousel */
    cursor: pointer;
    color: #333;
}

/* =========================================
   LA ISLA SECTION
   ========================================= */
.la-isla-section {
    padding: 0 0 100px;
}

.la-isla-container {
    display: flex;
    max-width: 1400px;
    margin: 0 auto;
    align-items: center;
    gap: 50px;
}

.la-isla-image {
    flex: 1;
}

.la-isla-image img {
    width: 100%;
    height: auto;
    display: block;
}

.la-isla-content {
    flex: 1;
    text-align: center;
    padding: 40px;
}

.la-isla-content h2 {
    font-family: 'Spectral', serif;
    font-size: 58px;
    letter-spacing: 10px;
    margin: 0 0 10px;
}

.la-isla-content .subtitle {
    font-size: 11px;
    font-weight: 500;
    display: block;
    margin-bottom: 20px;
    letter-spacing: 1px;
}

.la-isla-content .quote {
    font-family: var(--font-heading);
    font-size: 22px;
    font-style: italic;
    margin-bottom: 30px;
}

.la-isla-content .desc {
    font-size: 15px;
    line-height: 1.8;
    max-width: 400px;
    margin: 0 auto 40px;
    color: #555;
    font-family: var(--font-heading);
}

.btn-comprar {
    display: inline-block;
    border: 1px solid #333;
    padding: 12px 30px;
    font-size: 12px;
    letter-spacing: 2px;
    font-weight: 600;
    background: transparent;
    transition: all 0.3s ease;
}

.btn-comprar:hover {
    background: #333;
    color: #fff;
}

/* =========================================
   APPAREL SECTION
   ========================================= */
/* Moved body overflow to the top */

.apparel-section {
    text-align: center;
    padding: 100px 20px;
    max-width: 100%;
}

@media (min-width: 992px) {
    .apparel-section {
        overflow-x: hidden;
    }
    .apparel-carousel {
        overflow: hidden !important;
    }
}


.apparel-section .section-title {
    font-family: 'Spectral', serif;
    font-size: 58px;
    letter-spacing: 15px;
    margin-bottom: 20px;
    font-weight: 500;
    margin-right: -15px; /* Offset letter-spacing to ensure perfect centering */
    max-width: 100%;
    box-sizing: border-box;
    display: block;
    text-align: center;
}

.apparel-nav {
    display: flex;
    justify-content: space-between;
    padding: 0 40px;
    margin-bottom: 30px;
    font-size: 11px;
    text-transform: uppercase;
    font-family: var(--font-body);
    font-weight: 600;
}

.apparel-swiper-prev,
.apparel-swiper-next {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: opacity 0.3s;
}

.apparel-swiper-prev:hover,
.apparel-swiper-next:hover {
    opacity: 0.6;
}

.apparel-carousel {
    padding: 0 5px;
    /* Tiny padding for the container */
}

.apparel-carousel .swiper-slide {
    width: 25%;
    /* Show 4 items on desktop */
}

.product-card {
    text-align: left;
    padding: 0 5px;
    /* Minimal gap between items */
}

.product-image-link {
    display: block;
    width: 100%;
    margin-bottom: 12px;
}

.product-card img {
    width: 100%;
    aspect-ratio: 4 / 6;
    /* Long portrait aspect ratio */
    object-fit: cover;
    display: block;
}

.product-info {
    padding: 0 0 10px;
}

.product-title {
    font-family: var(--font-body);
    font-size: 12px;
    font-weight: 600;
    margin: 0 0 4px;
    letter-spacing: 0.5px;
    height: 15px; /* Added 3px to accommodate larger font */
    overflow: hidden;
}

.product-price {
    font-family: var(--font-body);
    font-size: 10.5px;
    display: block;
    color: #000;
    font-weight: 400;
}

.product-price .woocommerce-Price-amount {
    font-weight: 400;
}

@media (max-width: 768px) {
    .apparel-section {
        padding: 60px 0;
    }

    .apparel-carousel {
        overflow: visible;
        /* Show centered slides' siblings */
    }

    .apparel-carousel .swiper-slide {
        width: 90%;
        /* 90% centered slide = 5% visible for each side sibling */
    }
}

/* =========================================
   FOOTER
   ========================================= */
.site-footer {
    padding: 80px 40px;
    border-top: 1px solid var(--color-border);
    background: #fff;
    font-family: 'Lato', sans-serif;
}

.footer-container {
    max-width: 1400px;
    margin: 0 auto;
}

.footer-widget-area {
    display: flex;
    justify-content: space-between;
    margin-bottom: 80px;
}

.footer-widget {
    flex: 1;
}

.footer-widget.footer-info,
.footer-widget.footer-links,
.footer-widget.footer-company {
    text-align: left;
}

.footer-widget p {
    margin: 0 0 5px;
    color: #333;
    font-size: 13px;
}

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

.footer-widget ul li {
    margin-bottom: 8px;
}

.footer-widget ul li a {
    color: #333;
    font-size: 13px;
    text-decoration: none;
    transition: opacity 0.3s;
}

.footer-widget ul li a:hover {
    opacity: 0.6;
}

.footer-coordinates {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-top: 100px;
}

.coord-left,
.coord-right {
    font-size: 28px;
    color: #333;
    font-weight: 400;
}

/* Hide mobile-only elements on desktop */
.mobile-bottom-bar,
.mobile-logo-section {
    display: none;
}

/* =========================================
   MOBILE RESPONSIVE
   ========================================= */
@media (max-width: 768px) {
    body {
        padding-bottom: 60px;
        /* Space for the fixed bottom bar */
    }

    .mobile-bottom-bar {
        display: flex;
        justify-content: space-around;
        align-items: center;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 60px;
        background: #ffffff;
        border-top: 1px solid var(--color-border);
        z-index: 9999; /* Higher z-index to stay above everything */
        box-sizing: border-box;
        font-family: 'Lato', sans-serif;
    }

    .mobile-bottom-bar a {
        color: var(--color-text);
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 1; /* Use flex: 1 instead of width: 100% to avoid overflow */
        height: 100%;
        min-width: 0;
    }

    .mobile-bottom-bar a:hover {
        color: #000;
    }

    .mobile-bottom-bar .count {
        position: absolute;
        top: 8px;
        right: 50%;
        margin-right: -15px;
        font-size: 9px;
        background: #004d40;
        color: #fff;
        border-radius: 50%;
        width: 15px;
        height: 15px;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }

    .header-container {
        display: none;
    }

    .header-mobile {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 5px 10px;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1000;
        color: #fff;
    }

    .mobile-lang {
        font-size: 12px;
        letter-spacing: 2px;
        font-weight: 600;
        font-family: 'Lato', sans-serif;
    }

    .hero-section,
    .hero-picture img {
        height: calc(100vh - 60px) !important;
        min-height: auto;
    }

    .hero-mobile-nav {
        position: absolute;
        top: 25%;
        left: 0;
        width: 100%;
        z-index: 50;
        /* Above images */
        text-align: center;
        pointer-events: none;
        /* Let clicks pass to the slides if needed, though links will be enabled */
    }

    .mobile-hero-menu ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .mobile-hero-menu li a {
        display: block;
        font-family: var(--font-heading);
        font-size: 28px;
        letter-spacing: 4px;
        line-height: 2;
        color: #ffffff;
        text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.5);
        pointer-events: auto;
        /* Enable links */
    }

    .hero-content {
        display: none;
        /* Hide individual slide content on mobile to use the fixed overlay */
    }

    .mobile-logo-section {
        display: block;
        padding: 40px 20px 20px;
        text-align: center;
        background: #fff;
    }

    .mobile-logo-container {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 5px;
    }

    .mobile-scroll-logo {
        max-width: 250px;
        height: auto;
        /* No filter needed here as the source image should be black by default 
           or we can use brightness(0) if it's white. 
           But since user said "this time black", 
           I'll ensure it doesn't have the invert filter of the header. */
    }

    .mobile-logo-section .site-subtitle-logo {
        font-family: var(--font-body);
        font-size: 9px;
        letter-spacing: 4px;
        color: #000;
        display: block;
    }

    /* .hero-mobile-footer was removed from HTML */

    .desktop-only {
        display: none !important;
    }

    .categories-section {
        padding: 60px 20px;
        gap: 15px;
        justify-content: space-between;
    }

    .categories-carousel {
        width: calc(100% - 80px);
        /* Leave room for arrows on sides */
        overflow: hidden;
        margin: 0;
    }

    .categories-carousel .swiper-wrapper {
        display: flex;
        justify-content: flex-start;
        align-items: stretch;
        gap: 0;
        /* Let Swiper handle spacing with slidesPerView */
    }

    .categories-carousel .swiper-slide {
        width: 100% !important;
        /* Force 1 slide per view on mobile */
        flex-shrink: 0;
    }

    .category-card {
        width: 100%;
        /* Take full width of slide */
        margin: 0 auto;
        flex: none;
    }

    .category-text h3 {
        font-size: 20px;
    }

    .category-item {
        display: flex;
        /* Show arrows on mobile */
        align-items: center;
        justify-content: center;
        width: 35px;
        height: 35px;
        border: 1px solid #333;
        border-radius: 50%;
        color: #333;
        z-index: 10;
        flex-shrink: 0;
    }

    .category-item svg {
        width: 18px;
        height: 18px;
    }

    .categories-logo-divider {
        display: none !important;
    }

    .la-isla-container {
        flex-direction: column;
        gap: 20px;
    }

    .la-isla-content {
        padding: 20px;
    }

    .la-isla-content h2 {
        font-size: 40px;
    }

    .la-isla-content .quote {
        font-size: 18px;
    }

    .apparel-section .section-title {
        font-size: 32px;
    }

    .apparel-container .woocommerce ul.products {
        flex-direction: column;
        gap: 30px;
    }

    .apparel-container .woocommerce ul.products li.product {
        text-align: center;
    }

    .footer-container {
        text-align: center;
        padding: 40px 0;
    }

    .footer-widget-area {
        flex-direction: column;
        gap: 60px;
        margin-bottom: 80px;
    }

    .footer-widget.footer-info,
    .footer-widget.footer-links,
    .footer-widget.footer-company {
        text-align: center;
    }

    .footer-widget p,
    .footer-widget ul li a {
        font-size: 11px;
    }

    .footer-coordinates {
        flex-direction: row;
        /* Horizontal in mobile as per image */
        justify-content: space-between;
        margin-top: 60px;
        padding: 0 20px;
    }

    .coord-left,
    .coord-right {
        font-size: 20px;
    }
}

/* =========================================
   SINGLE PRODUCT PAGE
   ========================================= */

/* Reset WooCommerce default 2-column layout */
.woocommerce #content div.product div.images,
.woocommerce div.product div.images,
.woocommerce-page #content div.product div.images,
.woocommerce-page div.product div.images,
.woocommerce #content div.product div.summary,
.woocommerce div.product div.summary,
.woocommerce-page #content div.product div.summary,
.woocommerce-page div.product div.summary {
    float: none !important;
    width: 100% !important;
    padding: 0;
}

/* Breadcrumbs Customization */
.woocommerce-breadcrumb {
    padding: 20px 40px;
    font-size: 11px;
    color: #333;
    letter-spacing: 2px;
    background: transparent;
    display: flex;
    justify-content: space-between;
}

.woocommerce-breadcrumb a {
    color: #333;
    text-transform: uppercase;
}

.woocommerce-breadcrumb::after {
    content: "Volver a Home";
    cursor: pointer;
    text-transform: capitalize;
}

/* Product Title */
.single-product .product_title {
    font-size: 45px;
    letter-spacing: 12px;
    text-align: center;
    margin: 120px auto 40px;
    font-weight: 500;
    text-transform: uppercase;
    font-family: var(--font-heading);
    color: #333;
}

/* Product Gallery Override */
.woocommerce div.product div.images .woocommerce-product-gallery {
    position: relative;
    width: 100%;
    padding: 0 40px;
    box-sizing: border-box;
}

.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
    margin: 0;
}

.woocommerce div.product div.images .woocommerce-product-gallery__image img {
    width: 100%;
    height: auto;
    object-fit: cover;
    aspect-ratio: 3 / 4;
    /* Keep a nice proportion */
}

/* Desktop Gallery Nav Text */
.product-gallery-prev-text,
.product-gallery-next-text {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    font-size: 40px;
    letter-spacing: 5px;
    font-weight: 500;
    cursor: pointer;
    font-family: var(--font-body);
    transition: opacity 0.3s;
    text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.7);
}

.product-gallery-prev-text:hover,
.product-gallery-next-text:hover {
    opacity: 0.6;
}

.product-gallery-prev-text {
    left: 40px;
}

.product-gallery-next-text {
    right: 40px;
}

/* Product Summary Basics */
.woocommerce div.product div.summary {
    max-width: 1400px;
    margin: 40px auto;
    padding: 0 40px !important;
}

/* Summary Layout on Desktop */
@media screen and (min-width: 769px) {
    .summary-flex-layout {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 40px;
        margin-bottom: 60px;
    }
}

/* SINGLE PRODUCT DETAILS FONT SETTINGS */
.woocommerce div.product div.summary {
    font-family: var(--font-body);
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
    font-size: 15px;
    font-weight: 500;
    color: #333;
    font-family: var(--font-body);
}

/* Product Meta (SKU / Categories) */
.product_meta {
    font-size: 13px;
    color: #333;
    margin-bottom: 20px;
}

/* Add to Cart Button */
.woocommerce div.product form.cart .button.single_add_to_cart_button {
    background: transparent;
    border: 1px solid #333;
    color: #333;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 2px;
    padding: 15px 30px;
    border-radius: 0;
    transition: all 0.3s;
    width: auto;
    margin-top: 10px;
}

.woocommerce div.product form.cart .button.single_add_to_cart_button:hover {
    background: #333;
    color: #fff;
}

/* Variations Table */
.woocommerce div.product table.variations th {
    font-weight: 500;
    color: #333;
    font-size: 13px;
    text-align: left;
    padding-right: 20px;
}

/* Tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs {
    padding: 0;
    margin: 60px 0 40px;
    border: none;
    display: flex;
    justify-content: flex-start;
    gap: 40px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
    display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    color: #666;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 600;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: #000;
}

/* Desktop Summary Flow */
@media screen and (min-width: 769px) {
    /* Use grid to achieve the left/right split if needed, 
       but standard woocommerce html might need a template override.
       For now, we place tabs below standard summary. */
}

@media (max-width: 768px) {
    .woocommerce div.product div.images .woocommerce-product-gallery {
        padding: 0 20px;
    }

    .single-product .product_title {
        font-size: 40px;
        letter-spacing: 6px;
        margin: 20px auto 40px;
    }

    .woocommerce-breadcrumb {
        padding: 20px;
        margin-top: 60px;
    }

    .woocommerce div.product div.summary {
        padding: 0 20px !important;
    }

    /* Mobile Circular Arrows */
    .product-gallery-arrows-mobile {
        position: absolute;
        top: 50%;
        left: 0;
        width: 100%;
        transform: translateY(-50%);
        z-index: 10;
        display: flex;
        justify-content: space-between;
        padding: 0 20px;
        pointer-events: none;
    }

    .pg-prev,
    .pg-next {
        width: 40px;
        height: 40px;
        border: 1px solid #000;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        pointer-events: auto;
        background: transparent;
        color: #000;
        cursor: pointer;
    }
}

/* =========================================
   BOWIE SHOP ARCHIVE (Aesthetic Apparel)
   ========================================= */
.bowie-shop-container {
    padding: 100px 20px;
    max-width: 1400px;
    margin: 0 auto;
    overflow-x: hidden; /* Prevent horizontal scroll from elements inside */
    width: 100%;
    box-sizing: border-box;
}

.shop-toolbar {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 20px;
}

.toolbar-left {
    display: flex;
    align-items: center;
    gap: 40px;
}

.filter-toggle {
    cursor: pointer;
    text-transform: capitalize;
    font-family: var(--font-body);
    font-size: 15px;
    font-weight: 500;
    color: #333;
    letter-spacing: 0.5px;
    border: none;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

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

.filter-toggle .icon {
    font-size: 12px;
}

.view-switcher {
    display: flex;
    align-items: center;
    gap: 15px;
    font-family: var(--font-body);
    font-size: 15px;
    color: #333;
    font-weight: 500;
}

.view-icons {
    display: flex;
    gap: 5px;
    align-items: center;
}

.v-icon {
    display: block;
    width: 14px;
    height: 18px;
    background: #ccc;
    cursor: pointer;
    transition: background 0.3s;
}

.v-icon.v-1 {
    width: 6px;
}

.v-icon.v-2 {
    width: 14px;
    background: linear-gradient(to right, #ccc 4px, transparent 4px, transparent 6px, #ccc 6px, #ccc 10px, transparent 10px, transparent 12px, #ccc 12px);
}

.v-icon.active, .v-icon:hover {
    background: #000;
}

.v-icon.v-2.active, .v-icon.v-2:hover {
    background: linear-gradient(to right, #000 4px, transparent 4px, transparent 6px, #000 6px, #000 10px, transparent 10px, transparent 12px, #000 12px);
}

.bowie-filters-area {
    display: none;
    padding: 30px 0;
    border: none;
    background: transparent;
}

.bowie-filters-area.open {
    display: block;
}

.filters-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(100px, 1fr)) 260px; /* 6 cols for filters + 1 for button */
    gap: 10px;
    align-items: flex-start;
}

.filter-col h3 {
    font-size: 16px;
    font-weight: 700;
    font-family: var(--font-body);
    text-transform: capitalize;
    letter-spacing: 0.2px;
    margin-bottom: 15px;
    border-bottom: none;
    padding-bottom: 0;
    color: #000;
}

.filter-options label {
    display: flex;
    align-items: center;
    font-family: var(--font-body);
    font-size: 14px;
    margin-bottom: 8px;
    cursor: pointer;
    color: #333;
    line-height: 1.2;
}

.filter-options input[type="checkbox"] {
    width: 13px;
    height: 13px;
    margin-right: 8px;
    border: 1px solid #333;
    border-radius: 0;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
}

.filter-options input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 7px;
    height: 7px;
    background: #333;
}

.filter-col.filter-actions {
    display: flex;
    justify-content: flex-end;
    padding-top: 10px;
}

#apply-filters-btn {
    background: #fff;
    color: #000;
    border: 1px solid #000;
    padding: 15px 40px;
    font-size: 20px;
    font-weight: 400;
    font-family: var(--font-heading);
    letter-spacing: 5px;
    cursor: pointer;
    transition: background 0.3s, color 0.3s;
    width: 100%;
    margin-top: 5px;
}

#apply-filters-btn:hover {
    background: #000;
    color: #fff;
}

/* Mobile Adjustments for Filters */
@media (max-width: 991px) {
    .filters-grid {
        grid-template-columns: 1fr;
        gap: 0;
    }
    
    .filter-col {
        border-bottom: 1px solid #eee;
    }
    
    .filter-col h3 {
        padding: 15px 0;
        margin: 0;
        cursor: pointer;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .filter-col h3::after {
        content: '+';
        font-size: 18px;
    }

    .filter-col.active h3::after {
        content: '-';
    }

    .filter-options {
        display: none !important;
        padding: 20px 0;
    }

    .filter-col.active .filter-options {
        display: block !important;
    }
}

/* Page-specific Mobile Cleaning (Shop/Archive & Single Product) */
@media (max-width: 991px) {
    .archive.woocommerce-page .woocommerce-breadcrumb,
    .archive.woocommerce-page .back-to-home,
    .archive.woocommerce-page .back-home-link,
    .single-product .woocommerce-breadcrumb,
    .single-product .back-to-home,
    .single-product .back-home-link {
        display: none !important;
    }


    /* Tienda Mobile Header Adjustment */
    .site-header {
        z-index: 10001 !important; /* Ensure it stays above toolbar */
    }

    .bowie-shop-container {
        padding-top: 130px !important; /* Significantly increased for more breathing room */
    }

    .shop-toolbar {
        margin-bottom: 30px !important; /* More space between filters and product grid */
    }

    .apparel-section {
        margin-top: 40px !important; /* Extra breathing room between the toolbar/filters and the products */
    }

    .header-mobile {
        z-index: 10002 !important;
    }

    /* Enforce visibility just like we previously tried but generically */
    .mobile-lang {
        display: block !important; 
    }

    .mobile-lang a {
        color: #000000 !important;
    }

    .mobile-crown-icon {
        height: 35px;
        width: auto;
        display: block;
        transition: filter 0.4s ease;
    }

    .mobile-logo-crown a {
        display: block;
    }

    /* Homepage hero state image filter */
    .home .site-header:not(.is-scrolled) .mobile-crown-icon {
        filter: brightness(0) invert(1);
    }
}

/* =========================================
   NEW SINGLE PRODUCT DESIGN (90S LOW RISE JEANS MOCKUP)
   ========================================= */

.mobile-only { display: none !important; }

@media (max-width: 991px) {
    .desktop-only { display: none !important; }
    .mobile-only { display: block !important; }
}

.bowie-single-product-page {
    font-family: var(--font-body);
    color: #333;
    padding-bottom: 80px;
    background: #fff;
    max-width: 1400px;
    margin: 0 auto;
}
/* Ensure no padding + width = overflow issues */
.bowie-single-product-page * {
    box-sizing: border-box;
}

/* Header */
.bsp-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 60px 80px 40px; /* Aumentado padding superior e inferior, y significativamente el lateral */
}
.bsp-nav-left, .bsp-nav-right {
    font-size: 13px;
    letter-spacing: 1px;
    font-weight: 500;
}
.bsp-nav-left a, .bsp-nav-right a {
    color: #333;
    text-decoration: none;
}
.bsp-nav-left .sep {
    margin: 0 5px;
    color: #333;
}
.bsp-cat {
    text-transform: capitalize;
}
.bsp-title {
    font-family: 'Spectral', serif;
    font-size: 48px;
    letter-spacing: 8px;
    text-transform: uppercase;
    margin: 0;
    text-align: center;
    flex-grow: 1;
    color: #000000;
}

/* Gallery / Swiper */
.bsp-gallery-wrapper {
    position: relative;
    width: 100%;
    margin-bottom: 40px;
}
.bsp-product-swiper {
    width: 100%;
}
.bsp-product-swiper .swiper-slide img {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 3 / 4;
    object-fit: cover;
    background: #f4f4f4;
}

/* Desktop OVERLAY CONTROLS */
.bsp-nav-d {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    font-family: var(--font-body);
    font-size: 20px;
    letter-spacing: 3px;
    color: #333;
    cursor: pointer;
    text-transform: uppercase;
}
.bsp-prev-d { left: 40px; }
.bsp-next-d { right: 40px; text-align: right; }
.bsp-prev-d:hover, .bsp-next-d:hover { color: #000; }

.bsp-nav-m {
    display: none;
}

/* Product Info */
.bsp-info-wrapper {
    padding: 0 40px;
    margin-bottom: 60px;
}
.bsp-info-grid {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 40px;
}
.bsp-info-left {
    flex: 1;
}
.bsp-info-right {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

/* Attributes */
.bsp-attr-row {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    font-size: 13px;
    font-weight: 600;
}
.bsp-attr-label {
    width: 60px;
    text-transform: capitalize;
}
.bsp-attr-boxes {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
}
.bsp-attr-boxes span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    border: 1px solid #aaa;
    font-weight: 400;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s;
    color: #333;
}
.bsp-attr-boxes span:hover, .bsp-attr-boxes span.selected {
    border-color: #000;
    font-weight: 600;
}
.bsp-attr-colors {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.bsp-attr-colors span {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 1px solid #ddd;
    cursor: pointer;
}
.bsp-attr-colors span.selected {
    border: 2px solid #000;
}
.bsp-ref-value {
    font-weight: 400;
    color: #444;
    letter-spacing: 1px;
}

/* Price & Buttons */
.bsp-price {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    letter-spacing: 0.5px;
    text-align: right;
    margin-bottom: 15px;
    width: 100%;
}
.bsp-price .woocommerce-Price-amount {
    font-weight: 600;
}
.bsp-sold-out {
    font-size: 14px;
    font-weight: 700;
    color: #c0392b;
    text-transform: uppercase;
    letter-spacing: 2px;
}

/* Actions Strip: Heart | Qty | Button joined together */
.bsp-actions-strip {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: flex-end;
    gap: 5px;
}
.bsp-heart-btn {
    cursor: pointer;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: none;
    border: none;
}

/* Quantity Selector */
.bsp-qty-wrapper {
    display: flex;
    align-items: center;
    border: 1px solid #333;
}
.bsp-qty-btn {
    background: none;
    border: none;
    width: 32px;
    height: 40px;
    font-size: 16px;
    cursor: pointer;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
}
.bsp-qty-btn:hover {
    background: #f0f0f0;
}
.bsp-qty-input {
    width: 32px;
    height: 40px;
    text-align: center;
    border: none;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-body);
    color: #333;
    background: transparent;
    -moz-appearance: textfield;
    appearance: textfield;
}
.bsp-qty-input::-webkit-outer-spin-button,
.bsp-qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.bsp-qty-input:disabled {
    opacity: 0.4;
}

/* Add to cart button (joined to qty) */
.bsp-btn-add {
    background: #fff;
    color: #333;
    border: 1px solid #333;
    padding: 12px 30px;
    font-family: var(--font-body);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s;
    white-space: nowrap;
}
.bsp-btn-add:hover {
    background: #333;
    color: #fff;
}
.bsp-btn-add.bsp-disabled,
.bsp-btn-add:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
}
.bsp-btn-outline {
    background: #fff;
    color: #333;
    border: 1px solid #333;
    padding: 12px 25px;
    font-family: var(--font-body);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s;
    text-decoration: none;
    display: inline-block;
}
.bsp-btn-outline:hover {
    background: #333;
    color: #fff;
}
.bsp-btn-outline.bsp-disabled,
.bsp-btn-outline:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
}
.bsp-size-btn.selected {
    border-color: #000;
    font-weight: 600;
    background: #000;
    color: #fff;
}
.bsp-color-swatch.selected {
    border: 2px solid #000 !important;
    box-shadow: 0 0 0 1px #fff, 0 0 0 3px #000;
}

/* Tabs */
.bsp-tabs-section {
    padding: 0 40px;
    margin-top: 20px;
    border-top: none; 
    /* mockup seems to have no top border on desktop, just clean space */
}
.bsp-desktop-tabs {
    list-style: none;
    padding: 0;
    margin: 0 0 30px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 40px;
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 15px;
}
.bsp-desktop-tabs li {
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    cursor: pointer;
    color: #999;
    transition: color 0.3s;
    white-space: nowrap;
}
.bsp-desktop-tabs li:hover, .bsp-desktop-tabs li.active {
    color: #000;
}
.bsp-tab-panel {
    display: none;
    font-size: 13px;
    line-height: 1.8;
    color: #333;
    max-width: 600px; /* limits reading width for description */
}
.bsp-tab-panel.active {
    display: block;
}
.bsp-tab-text {
    font-size: 13px;
    line-height: 1.8;
    color: #555;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word; /* Ensure long text/links wrap */
}
.bsp-tab-text p {
    margin-bottom: 10px;
}
.bsp-tab-guia-img {
    max-width: 100%;
}
.bsp-tab-guia-img img {
    max-width: 100%;
    height: auto;
}

/* WooCommerce Hides */
.bowie-single-product-page .woocommerce-tabs {
    display: none !important; 
}
.bowie-single-product-page .related.products {
    padding: 0 40px;
}
/* Hide default WooCommerce tab headings (the tab nav already shows the title) */
.bsp-tab-panel h2.woocommerce-Reviews-title,
.bsp-tab-panel h2 {
    display: none;
}

/* MOBILE FIXES */
@media (max-width: 991px) {
    .bsp-header {
        flex-direction: column;
        align-items: center;
        padding: 90px 20px 15px; /* Added padding top so breadcrumbs clear the site header */
        gap: 0;
    }
    
    /* Simulate the mockup header layout with JS/CSS */
    .bsp-header {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-areas: 
            "bread home"
            "title title";
    }
    .bsp-nav-left.mobile-only {
        grid-area: bread;
        text-align: left;
    }
    .bsp-nav-right.mobile-only {
        grid-area: home;
        text-align: right;
    }
    .bsp-title {
        grid-area: title;
        font-family: 'Spectral', serif;
        font-size: 40px;
        line-height: 1.1;
        letter-spacing: 4px;
        margin-top: 15px;
        text-align: center;
        word-break: break-word; /* Prevent long words from causing horizontal scroll */
        hyphens: auto;
    }

    .bsp-gallery-wrapper {
        margin-bottom: 25px;
    }
    
    .bsp-nav-d { display: none !important; }
    
    .bsp-nav-m {
        display: flex;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 35px;
        height: 35px;
        border: 1px solid #333;
        border-radius: 50%;
        align-items: center;
        justify-content: center;
        z-index: 10;
        background: transparent;
        color: #333;
        cursor: pointer;
    }
    .bsp-nav-m svg { width: 18px; height: 18px; }
    .bsp-prev-m { left: 15px; }
    .bsp-next-m { right: 15px; }

    .bsp-info-wrapper {
        padding: 0 20px;
        margin-bottom: 20px;
    }
    .bsp-info-grid {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }
    .bsp-info-right {
        width: 100%;
        max-width: 100%;
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas: 
            "price heart"
            "qty btn";
        row-gap: 20px;
        column-gap: 10px; /* Reduced gap to save horizontal space */
        align-items: center;
    }
    .bsp-price {
        grid-area: price;
        font-size: 14px;
        margin-bottom: 0;
        text-align: left;
    }
    .bsp-actions-strip {
        display: contents; 
    }
    .bsp-heart-btn {
        grid-area: heart;
        justify-self: end;
    }
    .bsp-qty-wrapper {
        grid-area: qty;
        width: 100%;
        max-width: 110px; /* Prevent it from growing too wide if price is wide */
        justify-content: space-between;
    }
    .bsp-qty-btn {
        width: 32px; /* Stay compact */
    }
    .bsp-qty-input {
        width: 100%;
        min-width: 0; /* Allow input to shrink below intrinsic size */
        flex: 1;
    }
    .bsp-btn-add {
        grid-area: btn;
        justify-self: stretch;
        padding: 12px 10px; /* Reduce padding significantly */
        font-size: 10px; /* Adjust font size to fit */
        white-space: normal; /* Allow text to wrap if absolutely necessary */
        line-height: 1.2;
        text-align: center;
        width: 100%; /* Force width constraints */
        min-width: 0; /* Let flex/grid shrink it below words min-width if needed */
        word-wrap: break-word;
    }
    
    .bsp-tabs-section {
        padding: 0 20px 40px;
        margin-top: 30px; /* Increased padding between buttons and accordion */
    }
    .bsp-accordion-header {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
        padding: 15px 0;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 1px;
        text-transform: uppercase;
        border-bottom: 1px solid #eaeaea;
        cursor: pointer;
    }
    .bsp-accordion-header .bsp-icon {
        font-size: 18px;
        font-weight: 300;
        line-height: 1;
    }
    .bsp-tab-panel {
        display: none !important;
        padding: 15px 0;
    }
    .bsp-tab-panel.open {
        display: block !important;
    }
}

/* =========================================
   INFORMATIONAL / LEGAL PAGES (Terms, Privacy, etc.)
   ========================================= */
.bowie-info-page {
    max-width: 800px;
    margin: 180px auto 100px; /* Space for fixed desktop header */
    padding: 0 40px;
    color: var(--color-text);
}

.info-page-header {
    text-align: center;
    margin-bottom: 70px;
}

.info-page-title {
    font-family: var(--font-heading);
    font-size: 42px;
    font-weight: 500;
    margin: 0;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.info-page-content {
    font-family: var(--font-body);
    font-size: 14px;
    line-height: 1.8;
}

.info-page-content h2,
.info-page-content h3,
.info-page-content h4 {
    font-family: var(--font-heading);
    margin-top: 50px;
    margin-bottom: 25px;
    font-weight: 600;
    letter-spacing: 1px;
}

.info-page-content h2 { font-size: 28px; }
.info-page-content h3 { font-size: 22px; }

.info-page-content p {
    margin-bottom: 24px;
    color: #444;
}

.info-page-content ul,
.info-page-content ol {
    margin-bottom: 24px;
    padding-left: 20px;
    color: #444;
}

.info-page-content li {
    margin-bottom: 12px;
}

.info-page-content a {
    text-decoration: underline;
    text-underline-offset: 3px;
    color: #000;
    transition: color 0.3s;
}

.info-page-content a:hover {
    color: #666;
}

/* Base adjustment for WordPress Block Editor (Gutenberg) inside info page */
.info-page-content .wp-block-separator {
    margin: 50px auto;
    border: none;
    border-top: 1px solid var(--color-border);
    max-width: 100px;
}

.info-page-content blockquote,
.info-page-content .wp-block-quote {
    border-left: 2px solid #000;
    padding-left: 25px;
    font-style: italic;
    margin: 40px 0;
    font-size: 17px;
    color: #000;
}

/* Mobile responsive informational pages */
@media (max-width: 991px) {
    .bowie-info-page {
        margin-top: 130px; /* Space under the mobile header */
        padding: 0 20px;
    }
    
    .info-page-header {
        margin-bottom: 50px;
    }

    .info-page-title {
        font-size: 32px;
    }
    
    .info-page-content {
        font-size: 13px;
    }

    .info-page-content h2 { font-size: 24px; }
    .info-page-content h3 { font-size: 20px; }
}

/* =========================================
   WOOCOMMERCE STANDARD PAGES (Cart, Checkout, My Account, Wishlist)
   ========================================= */

.bsp-woocommerce-page-template {
    font-family: 'Lato', sans-serif;
    color: #333;
}

.bsp-woocommerce-page-template h1,
.bsp-woocommerce-page-template h2,
.bsp-woocommerce-page-template h3,
.bsp-woocommerce-page-template h4,
.bsp-woocommerce-page-template h5,
.bsp-woocommerce-page-template h6,
.bsp-woocommerce-page-template .page-title {
    font-family: 'Spectral', serif;
    font-weight: 500;
}

.bsp-woocommerce-page-template .page-title {
    text-align: center;
    font-size: 42px;
    margin-bottom: 40px;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.bsp-woocommerce-page-template p,
.bsp-woocommerce-page-template span,
.bsp-woocommerce-page-template div {
    font-family: 'Lato', sans-serif;
}

/* Base link reset without breaking buttons completely */
.bsp-woocommerce-page-template a:not(.button) {
    text-decoration: none;
    box-shadow: none;
    border: none;
    color: inherit;
    transition: opacity 0.3s;
}

.bsp-woocommerce-page-template a:not(.button):hover {
    opacity: 0.6;
}

/* Container Spacing for Desktop */
.bsp-wc-page-container {
    max-width: 1400px;
    margin: 180px auto 100px; /* Space for sticky header */
    padding: 0 40px;
}

/* Mobile Spacing */
@media (max-width: 991px) {
    .bsp-wc-page-container {
        margin-top: 130px;
        padding: 0 20px;
    }
    
    .bsp-woocommerce-page-template .page-title {
        font-size: 32px;
    }
}

/* =========================================
   CART & CHECKOUT SPECIFIC
   ========================================= */
.wc-proceed-to-checkout a.checkout-button,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce-page .wc-proceed-to-checkout a.checkout-button,
a.checkout-button.button.alt.wc-forward,
body:not(.woocommerce-block-theme-has-button-styles) .wc-block-components-button:not(.is-link),
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: none !important;
    padding: 20px 30px !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    border-radius: 0 !important;
    transition: all 0.3s ease !important;
    display: block !important;
    text-align: center !important;
    font-family: 'Lato', sans-serif !important;
    font-size: 14px !important;
    margin-top: 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    line-height: 1 !important;
}

.wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
a.checkout-button.button.alt.wc-forward:hover,
body:not(.woocommerce-block-theme-has-button-styles) .wc-block-components-button:not(.is-link):hover,
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover {
    background-color: #333333 !important;
    color: #ffffff !important;
    opacity: 1 !important;
}

/* =========================================
   MY ACCOUNT LOGIN / REGISTER (Not Logged In)
   ========================================= */

.woocommerce-account #customer_login {
    display: flex;
    justify-content: space-between;
    gap: 60px;
    margin-top: 40px;
}

.woocommerce-account #customer_login .u-column1,
.woocommerce-account #customer_login .u-column2 {
    flex: 1;
    width: 50%;
}

.woocommerce-account #customer_login h2 {
    font-family: 'Spectral', serif;
    font-size: 28px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 400;
    margin-bottom: 30px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 20px;
}

.woocommerce-account #customer_login label {
    display: block;
    font-family: 'Lato', sans-serif;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
    margin-bottom: 8px;
    color: #666;
}

.woocommerce-account #customer_login .required {
    color: #cc0000;
    text-decoration: none;
}

.woocommerce-account #customer_login input[type="text"],
.woocommerce-account #customer_login input[type="email"],
.woocommerce-account #customer_login input[type="password"] {
    width: 100%;
    padding: 15px;
    border: 1px solid #e0e0e0;
    margin-bottom: 25px;
    font-family: 'Lato', sans-serif;
    font-size: 14px;
    box-sizing: border-box;
    background: transparent;
    outline: none;
}

/* Explanatory text under inputs */
.woocommerce-account #customer_login p:not(.form-row) {
    font-family: 'EB Garamond', serif;
    font-size: 16px;
    line-height: 1.6;
    color: #555;
    margin-bottom: 20px;
}

.woocommerce-account #customer_login .woocommerce-privacy-policy-text p {
    font-family: 'EB Garamond', serif;
    font-size: 16px;
}

.woocommerce-account #customer_login .button {
    width: 100%;
    background: #000;
    color: #fff;
    padding: 18px;
    font-family: 'Lato', sans-serif;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 700;
    border: none;
    cursor: pointer;
    transition: background 0.3s;
    margin-top: 10px;
}

.woocommerce-account #customer_login .button:hover {
    background: #333;
}

/* Lost password link */
.woocommerce-account #customer_login .woocommerce-LostPassword {
    text-align: center;
    margin-top: 20px;
}

.woocommerce-account #customer_login .woocommerce-LostPassword a {
    font-family: 'EB Garamond', serif;
    font-style: italic;
    font-size: 16px;
    color: #888;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Checkbox container */
.woocommerce-account #customer_login .woocommerce-form-login__rememberme {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: 'EB Garamond', serif;
    font-size: 16px;
    color: #333;
    text-transform: none;
    font-weight: 400;
    margin-bottom: 20px;
    cursor: pointer;
}

.woocommerce-account #customer_login .woocommerce-form-login__rememberme input {
    margin: 0;
    cursor: pointer;
}

/* Mobile responsive login forms */
@media (max-width: 768px) {
    .woocommerce-account #customer_login {
        flex-direction: column;
        gap: 40px;
    }
    
    .woocommerce-account #customer_login .u-column1,
    .woocommerce-account #customer_login .u-column2 {
        width: 100%;
    }
}

/* =========================================
   MOBILE WISHLIST STYLES
   ========================================= */
@media (max-width: 768px) {
    .bsp-wishlist-container table.shop_table_responsive tbody tr {
        position: relative;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        padding: 20px 0;
        border-bottom: 1px solid #e0e0e0;
    }

    /* Hide the price as requested */
    .bsp-wishlist-container table.shop_table_responsive .product-price {
        display: none !important;
    }

    /* Hide table headers */
    .bsp-wishlist-container table.shop_table_responsive thead {
        display: none;
    }

    /* Remove column positioned to the right */
    .bsp-wishlist-container table.shop_table_responsive .product-remove {
        position: absolute;
        top: 20px;
        right: 0;
        width: auto !important;
        border: none !important;
        padding: 0 !important;
        display: flex !important;
        justify-content: flex-end;
        align-items: flex-start;
        z-index: 10;
        text-align: right !important;
    }

    .bsp-wishlist-container table.shop_table_responsive .product-remove::before {
        display: none !important; /* hide default WC pseudo labels */
    }

    .bsp-wishlist-container .product-remove a.remove {
        color: #999 !important;
        font-size: 24px;
        font-weight: 300;
        display: block;
        line-height: 1;
    }

    /* Image column */
    .bsp-wishlist-container table.shop_table_responsive .product-thumbnail {
        width: 80px !important;
        padding: 0 !important;
        border: none !important;
        display: block !important;
        text-align: left !important;
    }
    
    .bsp-wishlist-container table.shop_table_responsive .product-thumbnail::before {
        display: none !important;
    }

    .bsp-wishlist-container .product-thumbnail img {
        width: 100%;
        height: auto;
    }

    /* Name column next to image */
    .bsp-wishlist-container table.shop_table_responsive .product-name {
        flex: 1;
        padding-left: 15px !important;
        padding-right: 30px !important; /* space for the trash icon */
        border: none !important;
        display: block !important;
        text-align: left !important;
    }

    .bsp-wishlist-container table.shop_table_responsive .product-name::before {
        display: none !important;
    }

    .bsp-wishlist-container .product-name a {
        font-size: 14px;
        font-weight: 500;
        font-family: 'Lato', sans-serif;
    }

    /* Add to cart column full width at bottom */
    .bsp-wishlist-container table.shop_table_responsive .product-add-to-cart {
        width: 100% !important;
        padding: 15px 0 0 !important;
        border: none !important;
        display: block !important;
        text-align: left !important;
    }

    .bsp-wishlist-container table.shop_table_responsive .product-add-to-cart::before {
        display: none !important;
    }

    .bsp-wishlist-container .product-add-to-cart .button {
        width: 100%;
        text-align: center;
        box-sizing: border-box;
    }
}

/* =========================================
   TOAST NOTIFICATIONS & BADGES
   ========================================= */

/* Hide empty badges */
.header-icons .count.empty-badge,
.mobile-bottom-bar .count.empty-badge {
    display: none !important;
}

/* Toast Container */
#bsp-toast-container {
    position: fixed;
    top: 30px;
    right: 30px;
    z-index: 99999;
    display: flex;
    flex-direction: column;
    gap: 10px;
    pointer-events: none;
}

/* Toast Notification */
.bsp-toast {
    background: #000;
    color: #fff;
    padding: 15px 30px;
    font-family: 'Lato', sans-serif;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 600;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    transform: translateY(-20px);
    opacity: 0;
    transition: all 0.3s ease;
    pointer-events: auto;
}

.bsp-toast.show {
    transform: translateY(0);
    opacity: 1;
}

@media (max-width: 768px) {
    #bsp-toast-container {
        top: 20px;
        right: 20px;
        left: 20px;
        align-items: center;
    }
    
    .bsp-toast {
        width: 100%;
        text-align: center;
        box-sizing: border-box;
    }
}

/* =========================================
   404 PAGE
   ========================================= */
.error-404-custom {
    width: 100vw;
    height: calc(100vh - 100px);
    min-height: 600px;
    overflow: hidden;
    margin-top: 0; /* Changed to 0 so it's flush with the relative header */
    position: relative;
    z-index: 1;
}

/* Ensure the header on 404 behaves like a block element, solid white and visible */
body.error404 .site-header {
    position: relative !important; /* Force document flow so there's no pixel gap */
    top: 0 !important; /* Prevent admin-bar offset from pushing it down */
    margin-top: 0 !important;
    background: #ffffff !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
}

.admin-bar body.error404 .site-header {
    top: 0 !important; /* explicitly override mobile/desktop admin-bar offsets */
}

body.error404 .site-header a,
body.error404 .site-header .main-navigation a,
body.error404 .site-header .header-icons a,
body.error404 .site-header .header-lang a {
    color: #1a1a1a !important;
}

body.error404 .site-header .custom-logo {
    filter: none !important;
}

.error-404-split {
    display: flex;
    width: 100%;
    height: 100%;
}

.error-404-image {
    flex: 1;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.error-404-content-wrap {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    padding: 100px 40px; /* accommodate header */
}

.error-404-content {
    max-width: 500px;
    text-align: center;
}

.error-title {
    font-family: 'Spectral', serif;
    font-size: 36px;
    font-weight: 400;
    line-height: 1.3;
    margin-bottom: 30px;
    color: #1a1a1a;
}

.error-desc {
    font-family: 'EB Garamond', serif;
    font-size: 18px;
    line-height: 1.5;
    margin-bottom: 40px;
    color: #4a4a4a;
}

.error-hours {
    font-family: 'Inter', sans-serif;
    font-size: 11px;
    margin-bottom: 50px;
}

.error-hours .day-label {
    font-weight: 700;
    color: #1a1a1a;
}

.error-hours .col-label {
    font-weight: 700;
    color: #1a1a1a;
}

.error-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    font-family: 'Inter', sans-serif;
}

.error-email-link {
    font-size: 11px;
    font-weight: 600;
    color: #4a4a4a;
    text-decoration: underline;
    text-transform: none; /* email looks better normal case, but in image it's regular letters */
    text-underline-offset: 4px;
}

.error-email-link:hover {
    color: #000;
}

.btn-contactar {
    display: inline-block;
    border: 1px solid #1a1a1a;
    padding: 12px 25px;
    font-size: 11px;
    letter-spacing: 1px;
    font-weight: 600;
    color: #1a1a1a;
    background: transparent;
    transition: all 0.3s ease;
    text-transform: uppercase;
}

.btn-contactar:hover {
    background: #1a1a1a;
    color: #fff;
}

/* Mobile adjustments */
@media (max-width: 991px) {
    .error-404-custom {
        height: auto;
        min-height: auto;
        margin-top: 0;
    }
    .error-404-split {
        flex-direction: column;
    }
    .error-404-image {
        min-height: 60vh;
        width: 100%;
    }
    .error-404-content-wrap {
        min-height: 50vh;
        padding: 60px 20px;
    }
    .error-title {
        font-size: 28px;
    }
    .error-desc {
        font-size: 16px;
    }
    .error-actions {
        flex-direction: column;
        gap: 20px;
    }
}