/* ==============================================
   TRIMZPRO BRAND DESIGN SYSTEM
   Primary gold: #C8A44A
   Dark:         #111 / #1a1a1a
   Body font:    Albert Sans
   Heading font: Young Serif (.font-young-serif)
   ============================================== */

/* Override theme primary color (was red #db1215) */
:root {
    --primary: #C8A44A;
    --red_1: #C8A44A;
    --brand-gold: #C8A44A;
    --brand-gold-light: rgba(200, 164, 74, 0.12);
    --brand-dark: #111111;
}

/* Buttons that use --primary */
.tf-btn.btn-fill,
.btn-fill {
    background-color: var(--brand-gold) !important;
    border-color: var(--brand-gold) !important;
    color: #fff !important;
}

.tf-btn.btn-fill:hover,
.btn-fill:hover {
    background-color: #b8932e !important;
    border-color: #b8932e !important;
}

/* Sale/badge accent */
.badge-sale,
.product-sale-badge,
.count-box-sale {
    background-color: var(--brand-gold) !important;
}

/* Star ratings global */
.icon-star,
.bi-star-fill {
    color: var(--brand-gold) !important;
}

/* Links & active states */
a.item-link:hover,
.item-link.active,
.menu-item.active > a {
    color: var(--brand-gold) !important;
}

/* Global heading font */
h1, h2, h3, h4, h5, h6,
.title {
    font-family: 'Young Serif', 'Georgia', serif;
}

/* Remove monospace from any badge-text */
.badge-text {
    font-family: 'Albert Sans', sans-serif !important;
}

@media (min-width: 768px) {
    .logo-header img {
        width: 264px;
    }
}

.list-product-btn .box-icon .icon {
    font-size: 14px;
    font-weight: 500;
    height: 13px;
}










.variant-picker-values {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.variant-picker-values input[type="radio"] {
    position: absolute;
    opacity: 0;
}

.variant-picker-values label {
    cursor: pointer;
    transition: all 0.2s ease;
}

.variant-picker-values label.style-text {
    padding: 8px 12px;
    border-radius: 4px;
    border: 1px solid #ddd;
    display: inline-block;
}

.variant-picker-values input[type="radio"]:checked+label.style-text {
    border-color: #000;
    background-color: #f5f5f5;
}

.variant-picker-values input[type="radio"]:disabled+label.style-text {
    opacity: 0.5;
    cursor: not-allowed;
    text-decoration: line-through;
    border-color: #eee;
    background-color: #fafafa;
}

.variant-picker-values label.hover-tooltip {
    position: relative;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    overflow: hidden;
}

.variant-picker-values label.hover-tooltip .btn-checkbox {
    display: block;
    width: 100%;
    height: 100%;
}

.variant-picker-values label.hover-tooltip .tooltip {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: #000;
    color: #fff;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    visibility: hidden;
    opacity: 0;
    transition: all 0.2s ease;
}

.variant-picker-values label.hover-tooltip:hover .tooltip {
    visibility: visible;
    opacity: 1;
    bottom: calc(100% + 5px);
}

.stock-status {
    font-size: 14px;
}

.stock-status .text-success {
    color: #28a745;
}

.stock-status .text-danger {
    color: #dc3545;
}

/* Add to your existing styles */
.variant-picker-values input[type="radio"]:disabled+label {
    opacity: 0.6;
    cursor: not-allowed;
    position: relative;
}

.variant-picker-values input[type="radio"]:disabled+label .out-of-stock-badge {
    position: absolute;
    bottom: -18px;
    left: 0;
    right: 0;
    font-size: 10px;
    color: #dc3545;
    text-align: center;
}

.out-of-stock {
    text-decoration: line-through;
    opacity: 0.7;
}

@media (min-width: 768px) {
    .logo-header img {
        width: 142px;
    }
}

@media only screen and (max-width: 1200px) {
    .tf-top-bar_wrap .top-bar-contact {
        display: none !important;
    }
}

@media (min-width: 992px) {
    .tf-sw-collection .swiper-wrapper {
        justify-content: center;
    }
}

@media (min-width: 768px) {
    .logo-header img {
        width: 107px;
    }
}

.flat-categorie .swiper {
    width: 100%;
    overflow: hidden;
}

.flat-categorie .swiper-wrapper {
    align-items: stretch;
}

.flat-categorie .swiper-slide {
    height: auto;
    flex-shrink: 0;
}

.flat-categorie .collection-item {
    width: 100%;
}

.flat-categorie .collection-image img {
    width: 100%;
    display: block;
    border-radius: 12px;
    object-fit: cover;
}



.bg_yellow-my {
    background-color: #1d5b8a !important;
}

.bg_yellow-my,
.bg_yellow-my * {
    color: #fff !important;
}


.bg_body_my {
    background-color: #fff !important;
}

.bg_body_my .flat-spacing-7,
.bg_body_my .container,
.bg_body_my .wrap-carousel {
    background: transparent !important;
}


@media (min-width: 768px) {
    .logo-header img {
        width: 160px;
    }
}


.header-dark-abs.header-bg {
    background-color: #1a1a1a;
}

/* Synchronize mega-menu background with header background */
.header-bg .sub-menu.mega-menu,
.header-solid .sub-menu.mega-menu {
    background-color: #1a1a1a !important;
    border: none !important;
}

.header-absolute:not(.header-bg) .sub-menu.mega-menu {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Ensure text and links in mega-menu are readable on dark background */
.header-bg .sub-menu.mega-menu *,
.header-solid .sub-menu.mega-menu * {
    color: #fff !important;
}

/* On transparent header, keep text white (assuming it's over a dark banner) */
.header-absolute .sub-menu.mega-menu * {
    color: #fff !important;
}

/* Solid header background for non-homepage pages — glass effect applied below */
.header-solid {
    margin-bottom: 0px !important;
}

.d-blockhero {
    display: block !important;
    height: 100%;
}

@media only screen and (max-width: 767px) {
    #header .nav-icon .nav-account, #header .nav-icon .nav-wishlist, #header .nav-icon .nav-compare {
        display: block !important;
    }
}



/* =========================
   HEADER - TRIMZPRO CUSTOM
   Transparent by default
   Blur only on scroll
   Bold uppercase nav/icons
   ========================= */

/* =========================
   HEADER - IMPROVED LOGIC
   HOME:
   - transparent by default
   - blur on scroll

   INNER PAGES:
   - soft glass/light transparent by default
   - stronger glass on scroll
   ========================= */

#header,
#header.header-default,
#header .px_15,
#header .lg-px_40 {
    transition: background 0.3s ease, box-shadow 0.3s ease, backdrop-filter 0.3s ease;
}

#header {
    z-index: 999;
    border: none !important;
    box-shadow: none !important;
}

    #header .wrapper-header {
        min-height: 84px;
    }

    /* =========================
   HOME PAGE
   ========================= */
    #header.header-absolute,
    #header.header-default.header-absolute {
        background: transparent !important;
        box-shadow: none !important;
    }

        #header.header-absolute .px_15,
        #header.header-absolute .lg-px_40 {
            background: transparent !important;
            box-shadow: none !important;
        }

        #header.header-absolute.scrolled .px_15,
        #header.header-absolute.scrolled .lg-px_40 {
            background: rgba(255, 255, 255, 0.14) !important;
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
            border-radius: 0 0 14px 14px;
        }

    /* =========================
   INNER PAGES
   ========================= */
    #header.header-solid,
    #header.header-default.header-solid,
    #header.header-white.header-solid,
    #header.header-default.header-white.header-dark-abs.header-solid {
        background: transparent !important;
        box-shadow: none !important;
    }

        /* Softer non-home default background */
        #header.header-solid .px_15,
        #header.header-solid .lg-px_40 {
            background: rgba(255, 255, 255, 0.55) !important;
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(6px);
            box-shadow: 0 4px 18px rgba(0, 0, 0, 0.05);
            border-radius: 0 0 14px 14px;
        }

        /* Stronger on scroll */
        #header.header-solid.scrolled .px_15,
        #header.header-solid.scrolled .lg-px_40 {
            background: rgba(255, 255, 255, 0.78) !important;
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            box-shadow: 0 10px 28px rgba(0, 0, 0, 0.09);
            border-radius: 0 0 14px 14px;
        }

    /* =========================
   NAV LINKS
   ========================= */
    #header .item-link,
    #header .box-nav-ul .item-link,
    #header .menu-item > a {
        color: #111 !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: 1px;
        font-size: 14px;
        line-height: 1;
        transition: all 0.25s ease;
    }

        #header .item-link:hover,
        #header .box-nav-ul .item-link:hover,
        #header .menu-item > a:hover,
        #header .item-link.active,
        #header .menu-item.active > a {
            color: #000 !important;
        }

    /* Text readability on homepage */
    #header.header-absolute .item-link,
    #header.header-absolute .nav-icon-item,
    #header.header-absolute .nav-account span {
        text-shadow: 0 1px 2px rgba(255, 255, 255, 0.55);
    }

    #header.scrolled .item-link,
    #header.scrolled .nav-icon-item,
    #header.scrolled .nav-account span {
        text-shadow: none;
    }

    /* =========================
   RIGHT ICONS / TEXT
   ========================= */
    #header .nav-icon-item,
    #header .nav-icon a,
    #header .nav-account a,
    #header .nav-cart a {
        color: #111 !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.8px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        transition: all 0.25s ease;
    }

        #header .nav-icon-item:hover,
        #header .nav-icon a:hover,
        #header .nav-account a:hover,
        #header .nav-cart a:hover {
            color: #000 !important;
        }

        #header .nav-icon-item i,
        #header .nav-icon a i,
        #header .nav-account a i,
        #header .nav-cart a i {
            color: #111 !important;
            font-size: 22px;
            font-weight: 800 !important;
            line-height: 1;
        }

        #header .nav-account span,
        #header .nav-icon-item span {
            color: #111 !important;
            font-weight: 700 !important;
            text-transform: uppercase !important;
            letter-spacing: 0.8px;
        }

    /* Cart badge */
    #header .count-box {
        background: #111 !important;
        color: #fff !important;
        border: 2px solid #fff !important;
        font-weight: 700 !important;
        box-shadow: 0 3px 10px rgba(0, 0, 0, 0.18);
    }

    /* Mobile */
    #header .btn-mobile {
        color: #111 !important;
        display: inline-flex;
        align-items: center;
    }

        #header .btn-mobile svg path {
            fill: #111 !important;
        }

    /* Logo */
    #header .logo-header .logo {
        max-height: 58px;
        width: auto;
    }

    /* Remove theme overlays */
    #header::before,
    #header::after,
    #header .wrapper-header::before,
    #header .wrapper-header::after {
        background: transparent !important;
        box-shadow: none !important;
    }

/* Responsive */
@media (max-width: 1199px) {
    #header .wrapper-header {
        min-height: 76px;
    }

    #header .item-link,
    #header .box-nav-ul .item-link,
    #header .menu-item > a {
        font-size: 13px;
        letter-spacing: 0.8px;
    }

    #header .nav-icon-item i,
    #header .nav-icon a i,
    #header .nav-account a i,
    #header .nav-cart a i {
        font-size: 20px;
    }

    #header .logo-header .logo {
        max-height: 52px;
    }
}

@media (max-width: 767px) {
    #header .wrapper-header {
        min-height: 70px;
    }

    #header .logo-header .logo {
        max-height: 46px;
    }

    #header.header-absolute.scrolled .px_15,
    #header.header-absolute.scrolled .lg-px_40,
    #header.header-solid .px_15,
    #header.header-solid .lg-px_40,
    #header.header-solid.scrolled .px_15,
    #header.header-solid.scrolled .lg-px_40 {
        border-radius: 0 0 10px 10px;
    }
}
/* Cart icon container */
#header .nav-cart {
    position: relative;
}

    #header .nav-cart .nav-icon-item {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* Count badge */
    #header .nav-cart .count-box {
        position: absolute;
        top: -8px;
        right: -10px;
        min-width: 20px;
        height: 20px;
        padding: 0 5px;
        border-radius: 999px;
        background: #111 !important;
        color: #fff !important;
        font-size: 11px;
        font-weight: 700 !important;
        line-height: 20px;
        text-align: center;
        display: inline-block;
        border: 2px solid #fff;
        box-shadow: 0 4px 10px rgba(0,0,0,0.18);
        z-index: 2;
    }

    /* Better icon sizing */
    #header .nav-cart .nav-icon-item i {
        font-size: 22px;
        line-height: 1;
    }

.card-product {
    background-color: #f0f0f0;
    padding: 4px;
    border-radius: 16px;
}
@media only screen and (max-width: 767px) {
    .tf-slideshow .wrap-slider {
        height: 275px;
    }
}
.tvs-us-bg {
    background-color: #235784;
}