/* Custom styles for the theme */
    :root {
        --bg-img: url('/images/background/bg.jpg');
        --primary: #f6f7f6; --promo-bg: #ffffff; --nav-bg: #f3f4f6;
        --product-price: #79c29b; --footer-bg: #111827; --star-color: #fbbf24;
    }
    .bg-primary { background-color: var(--primary) !important; }
    .text-primary { color: var(--primary) !important; }
    .border-primary { border-color: var(--primary) !important; }
    .star-filled { color: var(--star-color) !important; }
    .carousel-slide:not(.opacity-100) { pointer-events: none; }
.bg-color { 
  background-color: var(--bg-pri) !important; 
  background-image: var(--bg-img) !important;
  background-repeat: no-repeat !important;     /* 🚫 no repeat */
  background-size: cover !important;           /* ✅ fill area nicely */
  background-position: center center !important; /* 🎯 center image */
  background-attachment: fixed;                /* (optional) for parallax feel */
}


        body {
            font-family: "Inter", sans-serif;
            background-color: #f7f7f7;
            
        }
        .header-shadow {
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
        }
        .product-card {
            transition: transform 0.2s, box-shadow 0.2s;
        }
        .product-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
        }
        .brand-link {
            transition: background-color 0.2s;
        }
        /* Custom Spacing for Slider Content (for responsive design consistency) */
        .mb-40 { margin-bottom: 10rem; /* 160px */ }
        .mb-65 { margin-bottom: 16.25rem; /* 260px */ }
        .text-shadow-lg {
            text-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);
        }
        /* Mobile Menu Accordion Styles - Ensure the initial state is hidden and transition is smooth */
        .mobile-submenu {
            height: 0;
        }
        .mobile-submenu.expanded {
            height: auto;
        }
    .custom-scrollbar-hidden::-webkit-scrollbar {
    display: none;
}
.custom-scrollbar-hidden {
    -ms-overflow-style: none;
    scrollbar-width: none;
    user-select: none;
    cursor: grab;
}
.custom-scrollbar-hidden:active {
    cursor: grabbing;
}

/* New styles for Slick carousel */
.carausel-8-columns-cover {
    position: relative;
}
.carausel-8-columns {
    overflow: hidden;
}
.card-1 {
    width: 159px; /* Match provided code */
    margin-right: 10px; /* Space between slides */
}
.img-hover-scale {
    overflow: hidden;
    border-radius: 0.75rem; /* Tailwind rounded-xl */
}
.img-hover-scale img {
    transition: transform 0.3s ease;
    width: 100%;
    height: auto;
    max-height: 120px; /* Match your original max-h-16 */
    object-fit: contain;
}
.img-hover-scale:hover img {
    transform: scale(1.1); /* Zoom effect on hover */
}
.slick-slide {
    outline: none; /* Remove focus outline */
}