/* ================================================================
   CYALLA HOME PAGE - CLEAN MOBILE OVERRIDE CSS
   Optimized version - removed duplicates and conflicts
   This file MUST load LAST to override all other styles
   ================================================================ */

/* ================================================================
   MOBILE HEADER - GREEN TOP BAR + SIMPLE WHITE HEADER
   ================================================================ */

@media (max-width: 767px) {
    /* Hide desktop header elements */
    .header-main,
    .header-rightside-nav,
    .sidebar-icon-nav,
    .navigation-menu,
    #categorymenudiv,
    .cart-desktop {
        display: none !important;
    }

    /* ============================================
       GREEN TOP BAR - #388E3C
       ============================================ */
    .header-topbar.headermoosttop {
        background: #388E3C !important;
        padding: 8px 0 !important;
        height: 37px !important;
        position: sticky !important;
        top: 0 !important;
        z-index: 1000 !important;
    }

    .header-topbar-inner {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 0 15px !important;
        max-width: 100% !important;
    }

    /* Free delivery text - left side */
    .header-topbar-inner .delivery-text,
    .header-topbar-inner .free-delivery-text {
        color: #fff !important;
        font-size: 12px !important;
        font-weight: 400 !important;
        letter-spacing: 0.3px !important;
        flex: 1 !important;
    }

    /* Right side icons group */
    .header-topbar-inner .topbar-right,
    .header-topbar-inner .header-right-icons {
        display: flex !important;
        align-items: center !important;
        gap: 12px !important;
    }

    /* User icon in green bar */
    .header-topbar-inner .user-icon,
    .header-topbar-inner .account-icon {
        width: 20px !important;
        height: 20px !important;
        color: #fff !important;
        cursor: pointer !important;
    }

    /* Currency dropdown in green bar */
    .header-topbar-inner .currency-dropdown,
    .header-topbar-inner select {
        background: transparent !important;
        color: #fff !important;
        border: none !important;
        font-size: 12px !important;
        font-weight: 500 !important;
        padding: 0 !important;
        outline: none !important;
        cursor: pointer !important;
    }

    .header-topbar-inner .currency-dropdown option {
        background: #388E3C !important;
        color: #fff !important;
    }

    /* ============================================
       WHITE MAIN HEADER
       ============================================ */
    .main-header {
        background: #fff !important;
        padding: 12px 0 !important;
        border-bottom: 1px solid #e5e5e5 !important;
        position: sticky !important;
        top: 37px !important;
        z-index: 999 !important;
    }

    .main-header .container {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding-left: 12px !important;
        padding-right: 6px !important;
    }

    /* Show only mobile shell, hide desktop shell */
    .main-header .container > div.desktop-header-shell {
        display: none !important;
    }
    .main-header .container > div.mobile-header-shell {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

    /* Logo - Left side */
    .main-header .logo,
    .main-header .site-logo,
    .main-header .brand-logo {
        display: flex !important;
        align-items: center !important;
        flex: 0 0 auto !important;
    }

    .main-header .logo img,
    .main-header .site-logo img,
    .main-header .brand-logo img {
        height: 32px !important;
        width: auto !important;
        max-width: 120px !important;
        object-fit: contain !important;
    }

    /* Hide text logo if exists */
    .main-header .logo-text,
    .main-header .site-name {
        display: none !important;
    }

    /* Right side icons group */
    .main-header .header-icons,
    .main-header .header-right,
    .main-header .mobile-icons {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        flex: 0 0 auto !important;
        margin-right: 0 !important;
    }

    /* Search icon */
    .main-header .search-icon,
    .main-header .icon-search {
        width: 24px !important;
        height: 24px !important;
        color: #F37021 !important;
        stroke: #F37021 !important;
        cursor: pointer !important;
        position: relative !important;
        padding: 0 !important;
    }

    /* Cart icon with badge */
    .main-header .cart-icon,
    .main-header .icon-cart {
        width: 24px !important;
        height: 24px !important;
        color: #F37021 !important;
        stroke: #F37021 !important;
        cursor: pointer !important;
        position: relative !important;
        padding: 0 !important;
    }

    /* Cart badge */
    .main-header .cart-badge,
    .main-header .cart-count {
        position: absolute !important;
        top: -8px !important;
        right: -8px !important;
        background: #F37021 !important;
        color: #fff !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        min-width: 18px !important;
        height: 18px !important;
        border-radius: 50% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 4px !important;
        line-height: 1 !important;
    }

    /* Hamburger menu icon */
    .main-header .menu-icon,
    .main-header .hamburger,
    .main-header .mobile-menu-toggle {
        width: 24px !important;
        height: 24px !important;
        color: #F37021 !important;
        stroke: #F37021 !important;
        cursor: pointer !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-around !important;
        padding: 0 !important;
    }

    .main-header .menu-icon span,
    .main-header .hamburger span {
        width: 100% !important;
        height: 2px !important;
        background: #F37021 !important;
        border-radius: 2px !important;
        display: block !important;
    }

    /* Make all header icons use consistent orange color */
    .main-header svg,
    .main-header path {
        stroke: #F37021 !important;
    }

    /* Hide cart sidebar on mobile */
    #sidebar-right,
    .sidebar_overlay {
        display: none !important;
    }

    /* Search overlay mobile */
    .search-overlay {
        z-index: 99999 !important;
        background: rgba(0, 0, 0, 0.5) !important;
    }

    .search-overlay .search-box {
        background: #fff !important;
        border-radius: 12px !important;
        padding: 20px !important;
        margin: 20px !important;
    }

    .search-overlay input[type="search"],
    .search-overlay input[type="text"] {
        width: 100% !important;
        padding: 12px 40px 12px 16px !important;
        border: 2px solid #F37021 !important;
        border-radius: 8px !important;
        font-size: 14px !important;
        outline: none !important;
    }

    .search-overlay .close-search,
    .search-overlay .search-close {
        position: absolute !important;
        top: 10px !important;
        right: 10px !important;
        width: 32px !important;
        height: 32px !important;
        background: #F37021 !important;
        color: #fff !important;
        border-radius: 50% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: pointer !important;
        font-size: 20px !important;
        border: none !important;
    }
}

/* ================================================================
   MOBILE WIDTH FIX - HIGHEST PRIORITY
   ================================================================ */

@media (max-width: 767px) {
    /* Reset any width constraints from other stylesheets */
    html {
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100vw !important;
    }

    body {
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100vw !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Wrapper and main containers */
    .wraper,
    .wrapper,
    body .wraper,
    body .wrapper {
        width: 100% !important;
        max-width: 100vw !important;
        overflow-x: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Page content wrapper */
    .page-content-wraper,
    body .page-content-wraper {
        width: 100% !important;
        max-width: 100vw !important;
        overflow-x: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
    }
}

/* ================================================================
   CRITICAL MOBILE FIXES ONLY
   ================================================================ */

/* Container fix for mobile - STRONGEST OVERRIDE */
@media (max-width: 767px) {
    body .container,
    .container,
    div.container,
    .page-content-wraper .container {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* Force full width on all rows */
    .row {
        margin-left: -15px !important;
        margin-right: -15px !important;
        width: auto !important;
        max-width: none !important;
    }

    /* Remove any fixed widths on columns */
    [class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
    }
}

/* ================================================================
   HERO SLIDER - MOBILE UPDATED DESIGN (Reference Image Style)
   ================================================================ */

@media (max-width: 767px) {
    .slider-area {
        margin-bottom: 16px !important;
        border-radius: 14px !important;
        overflow: hidden !important;
        margin-left: 10px !important;
        margin-right: 10px !important;
        margin-top: 8px !important;
    }

    .home-slider {
        height: 300px !important;
        border-radius: 14px !important;
        overflow: hidden !important;
        position: relative !important;
    }

    .slides {
        display: flex !important;
        transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    .slide {
        min-width: 100% !important;
        height: 300px !important;
        background-size: cover !important;
        background-position: center center !important;
        background-repeat: no-repeat !important;
        position: relative !important;
        flex-shrink: 0 !important;
    }

    .slide::after {
        content: "" !important;
        position: absolute !important;
        inset: 0 !important;
        background: linear-gradient(180deg, rgba(0,0,0,0.08) 0%, rgba(0,0,0,0.58) 100%) !important;
        z-index: 1 !important;
    }

    /* Limited Time Offer Badge - Top Left White Pill */
    .slide .caption::before {
        content: "🎁 Limited Time Offer" !important;
        position: absolute !important;
        top: -225px !important;
        left: 0 !important;
        background: rgba(255, 255, 255, 0.95) !important;
        padding: 6px 12px !important;
        border-radius: 20px !important;
        font-size: 10px !important;
        font-weight: 600 !important;
        color: #333 !important;
        z-index: 10 !important;
        border: 1px solid rgba(0,0,0,0.08) !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
        display: inline-block !important;
    }

    .slider-area .caption {
        position: absolute !important;
        bottom: 16px !important;
        left: 14px !important;
        right: 14px !important;
        top: auto !important;
        transform: none !important;
        max-width: 100% !important;
        text-align: left !important;
        padding: 0 !important;
        z-index: 5 !important;
    }

    .slider-title {
        font-size: 22px !important;
        line-height: 1.2 !important;
        margin-bottom: 8px !important;
        font-weight: 700 !important;
        color: #fff !important;
        text-shadow: 2px 2px 12px rgba(0,0,0,0.7) !important;
    }

    .slider-title span {
        color: #FF9933 !important;
    }

    .slider-subtitle {
        font-size: 12px !important;
        margin-bottom: 12px !important;
        color: #fff !important;
        text-shadow: 1px 1px 6px rgba(0,0,0,0.6) !important;
        line-height: 1.4 !important;
        max-width: 100% !important;
        display: -webkit-box !important;
        line-clamp: 2 !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    /* Slider action buttons container */
    .slider-actions {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        align-items: flex-start !important;
    }

    /* Start Gifting Button - Orange */
    .btn-slider {
        font-size: 13px !important;
        font-weight: 600 !important;
        padding: 10px 16px !important;
        background: #FF6B35 !important;
        color: #fff !important;
        border: none !important;
        border-radius: 8px !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 8px !important;
        box-shadow: 0 4px 16px rgba(255, 107, 53, 0.4) !important;
        text-decoration: none !important;
        transition: all 0.3s ease !important;
    }

    .btn-slider:active {
        transform: scale(0.96) !important;
        box-shadow: 0 2px 8px rgba(255, 107, 53, 0.3) !important;
    }

    .btn-slider svg {
        width: 18px !important;
        height: 18px !important;
    }

    /* Delivered in 5 Days - White Pill */
    .delivery-info {
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        background: rgba(255, 255, 255, 0.95) !important;
        padding: 8px 16px !important;
        border-radius: 20px !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        color: #333 !important;
        box-shadow: 0 2px 10px rgba(0,0,0,0.15) !important;
        backdrop-filter: blur(4px) !important;
    }

    .delivery-info .check-icon {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .delivery-info .check-icon::before {
        content: "✓" !important;
        color: #00C853 !important;
        font-weight: 700 !important;
        font-size: 14px !important;
    }

    /* Navigation arrows - White circles */
    .arrow {
        width: 40px !important;
        height: 40px !important;
        background: rgba(255, 255, 255, 0.9) !important;
        border-radius: 50% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 24px !important;
        color: #333 !important;
        border: none !important;
        box-shadow: 0 2px 12px rgba(0,0,0,0.2) !important;
        z-index: 10 !important;
        position: absolute !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        cursor: pointer !important;
        transition: all 0.2s ease !important;
    }

    .arrow.prev { left: 12px !important; }
    .arrow.next { right: 12px !important; }

    .arrow:active {
        background: rgba(255, 255, 255, 1) !important;
        transform: translateY(-50%) scale(0.9) !important;
    }

    /* Dots pagination - Bottom center */
    .dots {
        position: absolute !important;
        bottom: 12px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        display: flex !important;
        justify-content: center !important;
        gap: 6px !important;
        z-index: 10 !important;
    }

    .dot {
        width: 8px !important;
        height: 8px !important;
        background: rgba(255, 255, 255, 0.5) !important;
        border-radius: 50% !important;
        border: none !important;
        cursor: pointer !important;
        transition: all 0.3s ease !important;
    }

    /* Active dot style */
    .dot[aria-selected="true"],
    input[name="slides"]:checked ~ .dots label.dot {
        background: #fff !important;
        width: 24px !important;
        border-radius: 4px !important;
    }

    /* Hide radio inputs */
    .home-slider input[type="radio"] {
        display: none !important;
    }
}

/* ================================================================
   SECTION HEADINGS - MOBILE
   ================================================================ */

@media (max-width: 767px) {
    .section-heading,
    body .section-heading {
        font-size: 18px !important;
        text-align: center !important;
        margin-bottom: 6px !important;
        width: 100% !important;
    }

    .section-heading-p,
    body .section-heading-p {
        font-size: 13px !important;
        text-align: center !important;
        margin-bottom: 15px !important;
        width: 100% !important;
    }

    .section-padding-b,
    body .section-padding-b {
        padding: 20px 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* All sections should be full width */
    section,
    body section {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }
}

/* ================================================================
   PRODUCT GRID - MOBILE 2 COLUMNS
   ================================================================ */

@media (max-width: 767px) {
    /* Remove any container constraints */
    .testimonial-group,
    body .testimonial-group,
    div.testimonial-group {
        padding: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Force 2 column grid for mobile */
    .product-grid-5col,
    body .product-grid-5col,
    div.product-grid-5col {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
        padding: 0 12px !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Ensure all grid children fit the grid */
    .product-grid-5col > *,
    .product-grid-5col > div,
    .product-grid-5col > .product-item {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        float: none !important;
        display: block !important;
    }

    /* Override any column classes */
    .product-grid-5col [class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* ================================================================
   PRODUCT CARD - MOBILE COMPACT DESIGN (2 per row)
   ================================================================ */

@media (max-width: 767px) {
    .product-item {
        width: 100% !important;
        border-radius: 12px !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
        border: 1px solid #e8e8e8 !important;
        background: #fff !important;
        overflow: hidden !important;
        position: relative !important;
    }

    .product-item:hover {
        transform: none !important;
    }

    .product-item:active {
        transform: scale(0.98) !important;
    }

    /* Product image wrapper */
    .product-img-wrap {
        aspect-ratio: 1 / 1 !important;
        background: #fafafa !important;
        position: relative !important;
        overflow: hidden !important;
    }

    .product-img-wrap img.img-card {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    /* Discount badge - top left with dark background */
    .discount-badge {
        position: absolute !important;
        top: 10px !important;
        left: 10px !important;
        background: rgba(0, 0, 0, 0.8) !important;
        color: #fff !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        padding: 6px 12px !important;
        border-radius: 6px !important;
        z-index: 3 !important;
    }

    /* HOT badge - top right with orange background */
    .badge-hot {
        position: absolute !important;
        top: 10px !important;
        right: 10px !important;
        background: #FF6B35 !important;
        color: #fff !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        padding: 6px 12px !important;
        border-radius: 6px !important;
        z-index: 3 !important;
        display: flex !important;
        align-items: center !important;
        gap: 4px !important;
    }

    /* SKU badge - center top of image with gray background */
    .sku-badge {
        position: absolute !important;
        top: 10px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        background: rgba(108, 117, 125, 0.9) !important;
        color: #fff !important;
        font-size: 10px !important;
        font-weight: 600 !important;
        padding: 4px 10px !important;
        border-radius: 4px !important;
        z-index: 2 !important;
        letter-spacing: 0.5px !important;
    }

    /* Countdown timer - bottom left of image */
    .countdown-timer {
        position: absolute !important;
        bottom: 10px !important;
        left: 10px !important;
        background: rgba(255, 255, 255, 0.95) !important;
        padding: 6px 12px !important;
        border-radius: 20px !important;
        font-size: 11px !important;
        font-weight: 600 !important;
        color: #333 !important;
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
        z-index: 3 !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
    }

    .countdown-timer svg {
        width: 16px !important;
        height: 16px !important;
        stroke: #333 !important;
    }

    /* Hide old product tags */
    .product-tags {
        display: none !important;
    }

    /* Hide hover operations on mobile */
    .hover-ops {
        display: none !important;
    }

    /* Compact product body */
    .prd-body {
        padding: 12px !important;
    }

    /* Product title - 2 lines max */
    .prd-title {
        margin-bottom: 8px !important;
    }

    .prd-title a {
        font-size: 12px !important;
        line-height: 1.4 !important;
        display: -webkit-box !important;
        line-clamp: 2 !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        color: #333 !important;
        font-weight: 500 !important;
        text-decoration: none !important;
    }

    /* Stars and reviews compact */
    .stars-row {
        font-size: 11px !important;
        margin-bottom: 10px !important;
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
    }

    .stars-row .stars {
        display: flex !important;
        align-items: center !important;
        gap: 2px !important;
    }

    .stars-row .star {
        color: #FFB800 !important;
        font-size: 12px !important;
    }

    .stars-row .star.empty {
        color: #ddd !important;
    }

    .stars-row .rating-val {
        font-weight: 700 !important;
        color: #333 !important;
        font-size: 13px !important;
    }

    .stars-row .review-count {
        font-size: 11px !important;
        color: #999 !important;
    }

    .modern-product-card {
        margin-bottom: 18px !important;
        height: 100% !important;
    }

    .modern-product-card .product-card-shell {
        background: #fff !important;
        border: 1px solid rgba(28, 28, 30, 0.08) !important;
        border-radius: 10px !important;
        overflow: hidden !important;
        box-shadow: 0 10px 20px rgba(28, 28, 30, 0.08) !important;
        display: flex !important;
        flex-direction: column !important;
        height: 100% !important;
        min-height: 360px !important;
    }

    .modern-product-card .product-card-media {
        position: relative !important;
        height: 185px !important;
        padding: 10px !important;
        background: radial-gradient(circle at top, rgba(255,255,255,0.18), transparent 38%), linear-gradient(180deg, #53433d 0%, #c8b2a1 100%) !important;
    }

    .modern-product-card .product-media-link {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        height: 100% !important;
        border-radius: 14px !important;
        overflow: hidden !important;
    }

    .modern-product-card .product-media-link img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
    }

    .modern-product-card .product-badge-row {
        position: absolute !important;
        top: 12px !important;
        left: 12px !important;
        right: 12px !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: flex-start !important;
        gap: 8px !important;
        z-index: 2 !important;
    }

    .modern-product-card .product-badge {
        display: inline-flex !important;
        align-items: center !important;
        padding: 6px 12px !important;
        border-radius: 999px !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        letter-spacing: 0.4px !important;
        text-transform: uppercase !important;
        color: #fff !important;
        background: linear-gradient(135deg, #f37021, #ff9f43) !important;
    }

    .modern-product-card .product-tag--new,
    .modern-product-card .product-tag--green {
        background: linear-gradient(135deg, #22c55e, #16a34a) !important;
    }

    .modern-product-card .product-icon-btn {
        width: 34px !important;
        height: 34px !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: rgba(255, 255, 255, 0.95) !important;
        color: #1c1c1e !important;
        box-shadow: 0 8px 18px rgba(28, 28, 30, 0.12) !important;
    }

    .modern-product-card .product-timer-pill {
        position: absolute !important;
        left: 12px !important;
        bottom: 12px !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        padding: 7px 12px !important;
        border-radius: 999px !important;
        background: rgba(255, 255, 255, 0.96) !important;
        color: #1c1c1e !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        box-shadow: 0 8px 18px rgba(28, 28, 30, 0.12) !important;
    }

    .modern-product-card .product-card-body {
        padding: 14px 14px 16px !important;
        display: flex !important;
        flex-direction: column !important;
        flex: 1 1 auto !important;
    }

    .modern-product-card .product-stock-pill {
        display: inline-flex !important;
        margin-bottom: 10px !important;
        padding: 4px 10px !important;
        border-radius: 999px !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
    }

    .modern-product-card .product-stock-pill.is-available {
        background: #ecfdf3 !important;
        color: #047857 !important;
        width: auto !important;
    }

    .modern-product-card .product-stock-pill.is-empty {
        background: #fef2f2 !important;
        color: #b91c1c !important;
    }

    .modern-product-card .product-card-title {
        min-height: 44px !important;
        max-height: 44px !important;
        margin-bottom: 0 !important;
        overflow: hidden !important;
    }

    .modern-product-card .product-card-title a {
        font-size: 16px !important;
        line-height: 1.35 !important;
        color: #1c1c1e !important;
        font-weight: 600 !important;
    }

    .modern-product-card .compact-rating {
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
        margin-bottom: 10px !important;
        color: #6b7280 !important;
    }

    .modern-product-card .compact-rating .rating-val {
        color: #1c1c1e !important;
        font-weight: 700 !important;
    }

    .modern-product-card .compact-rating .review-count {
        font-size: 11px !important;
        color: #6b7280 !important;
        white-space: nowrap !important;
    }

    .modern-product-card .price-now {
        font-size: 20px !important;
        font-weight: 700 !important;
    }

    .modern-product-card .price-old {
        font-size: 12px !important;
    }

    .modern-product-card .product-card-actions {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
        margin-top: auto !important;
    }

    .modern-product-card .discount-chip {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 66px !important;
        padding: 7px 12px !important;
        border: 1px solid #1c1c1e !important;
        border-radius: 10px !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        color: #1c1c1e !important;
        background: #fff !important;
    }

    .modern-product-card .discount-chip.neutral {
        border-color: #d1d5db !important;
        color: #4b5563 !important;
    }

    .modern-product-card .btn-cart-icon {
        width: 40px !important;
        height: 35px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 1px solid #e5e7eb !important;
        border-radius: 12px !important;
        background: #fff !important;
        color: #1c1c1e !important;
        font-size: 18px !important;
        box-shadow: 0 8px 18px rgba(28, 28, 30, 0.08) !important;
        transition: all 0.2s ease !important;
    }

    /* Price section */
    .price-row {
        display: flex !important;
        align-items: baseline !important;
        gap: 6px !important;
        margin-bottom: 12px !important;
        flex-wrap: wrap !important;
    }

    .price-currency {
        font-size: 12px !important;
        font-weight: 600 !important;
        color: #333 !important;
    }

    .price-now {
        font-size: 18px !important;
        font-weight: 700 !important;
        color: #333 !important;
    }

    .price-old {
        font-size: 13px !important;
        color: #999 !important;
        text-decoration: line-through !important;
    }

    /* Add to Cart button - outline style with orange border */
    .btn-cart-outline {
        width: 100% !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        padding: 12px !important;
        background: #fff !important;
        border: 2px solid #FF6B35 !important;
        border-radius: 8px !important;
        color: #FF6B35 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        cursor: pointer !important;
        transition: all 0.3s ease !important;
    }

    .btn-cart-outline svg {
        width: 20px !important;
        height: 20px !important;
        stroke: #FF6B35 !important;
    }

    .btn-cart-outline:active {
        background: #FF6B35 !important;
        color: #fff !important;
    }

    .btn-cart-outline:active svg {
        stroke: #fff !important;
    }

    /* View All Button */
    .btn-view-all {
        width: 100% !important;
        max-width: 280px !important;
        margin: 20px auto 0 !important;
        font-size: 13px !important;
        padding: 12px 24px !important;
        border-radius: 8px !important;
    }
}

/* ================================================================
   CATEGORY SLIDER - MOBILE
   ================================================================ */

@media (max-width: 767px) {
    /* Category Section Container */
    .category-section,
    #shopby-cat {
        padding: 30px 0 !important;
        background: #fff !important;
        overflow: hidden !important;
    }

    .category-section .section-heading {
        font-size: 24px !important;
        font-weight: 700 !important;
        text-align: center !important;
        margin-bottom: 8px !important;
        color: #333 !important;
    }

    .category-section .section-heading-p {
        font-size: 14px !important;
        text-align: center !important;
        color: #666 !important;
        margin-bottom: 24px !important;
    }

    /* Category Slider Wrapper */
    .category-slider-wrapper {
        position: relative !important;
        width: 100% !important;
        overflow: hidden !important;
    }

    /* Category Cards Container - Horizontal Scroll */
    .category-cards-container {
        display: flex !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory !important;
        scroll-behavior: smooth !important;
        -webkit-overflow-scrolling: touch !important;
        gap: 16px !important;
        padding: 0 16px 20px 16px !important;
        scrollbar-width: none !important;
    }

    .category-cards-container::-webkit-scrollbar {
        display: none !important;
    }

    /* Category Card */
    .category-card {
        position: relative !important;
        flex: 0 0 85% !important;
        min-width: 85% !important;
        height: 340px !important;
        border-radius: 16px !important;
        overflow: hidden !important;
        scroll-snap-align: center !important;
        text-decoration: none !important;
        display: block !important;
        box-shadow: 0 4px 16px rgba(0,0,0,0.12) !important;
        transition: transform 0.2s ease !important;
    }

    .category-card:active {
        transform: scale(0.98) !important;
    }

    /* Category Card Image - Enhanced with fallback */
    .category-card-image {
        position: relative !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 340px !important;
        background-size: cover !important;
        background-position: center !important;
        background-repeat: no-repeat !important;
        /* Fallback gradient if image fails to load */
        background-color: #667eea !important;
        background-image: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    }

    /* Ensure the background image overrides the gradient when loaded */
    .category-card-image[style*="background-image"] {
        background-blend-mode: normal !important;
    }

    /* Overlay Gradient */
    .category-card-overlay {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        background: linear-gradient(
            to bottom,
            rgba(0,0,0,0.05) 0%,
            rgba(0,0,0,0.3) 40%,
            rgba(0,0,0,0.7) 100%
        ) !important;
    }

    /* Category Card Content */
    .category-card-content {
        position: absolute !important;
        bottom: 24px !important;
        left: 24px !important;
        right: 24px !important;
        z-index: 2 !important;
    }

    /* Category Title */
    .category-card-title {
        font-size: 26px !important;
        font-weight: 700 !important;
        color: #fff !important;
        margin: 0 0 8px 0 !important;
        text-shadow: 2px 2px 12px rgba(0,0,0,0.6) !important;
        line-height: 1.2 !important;
    }

    /* Product Count */
    .category-card-count {
        font-size: 15px !important;
        color: #fff !important;
        margin: 0 0 18px 0 !important;
        opacity: 0.95 !important;
        text-shadow: 1px 1px 6px rgba(0,0,0,0.5) !important;
    }

    /* Shop Now Button */
    .category-card-btn {
        display: inline-flex !important;
        align-items: center !important;
        gap: 8px !important;
        padding: 12px 24px !important;
        background: #fff !important;
        color: #333 !important;
        border: none !important;
        border-radius: 8px !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        cursor: pointer !important;
        transition: all 0.3s ease !important;
        box-shadow: 0 4px 16px rgba(0,0,0,0.25) !important;
    }

    .category-card:active .category-card-btn {
        background: #FF6B35 !important;
        color: #fff !important;
        transform: scale(0.95) !important;
    }

    .category-card-btn svg {
        width: 20px !important;
        height: 20px !important;
        stroke: currentColor !important;
    }

    /* Category Dots Pagination */
    .category-dots {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 6px !important;
        margin-top: 16px !important;
        padding: 0 16px !important;
    }

    .category-dot {
        width: 8px !important;
        height: 8px !important;
        border-radius: 50% !important;
        background: #ddd !important;
        cursor: pointer !important;
        transition: all 0.3s ease !important;
        border: none !important;
        padding: 0 !important;
    }

    .category-dot.active {
        width: 24px !important;
        border-radius: 4px !important;
        background: #FF6B35 !important;
    }

    /* Old category styles - hide */
    .cat-viewport,
    .cat-nav,
    .cat-slides,
    .cat-slide,
    .cat-grid,
    .cat-card {
        display: none !important;
    }
}

/* ================================================================
   FESTIVAL BUNDLES - MOBILE
   ================================================================ */

@media (max-width: 767px) {
    .festival-bundles {
        padding: 20px 0 !important;
    }

    .fb-container {
        padding: 0 15px !important;
    }

    .fb-head {
        flex-direction: column !important;
        gap: 12px !important;
        margin-bottom: 15px !important;
    }

    .fb-head h2 {
        font-size: 18px !important;
    }

    .fb-grid {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }

    .fb-card {
        min-height: 180px !important;
        padding: 20px 15px !important;
        border-radius: 16px !important;
    }

    .fb-left h3 {
        font-size: 16px !important;
    }

    .pill {
        font-size: 9px !important;
        padding: 4px 10px !important;
    }
}

/* ================================================================
   TRACKING & EARN POINTS - MOBILE
   ================================================================ */

@media (max-width: 767px) {
    .track-and-earn {
        padding: 20px 0 !important;
        background: #f8f8f8 !important;
    }

    .ta-grid {
        flex-direction: column !important;
        gap: 15px !important;
    }

    .track-card,
    .earn-card {
        padding: 20px !important;
        border-radius: 16px !important;
    }

    .track-card h2 {
        font-size: 18px !important;
    }

    .track-form input[type="text"] {
        width: 100% !important;
        padding: 12px 12px 12px 40px !important;
        font-size: 13px !important;
    }

    .btn-order {
        width: 100% !important;
        padding: 12px 20px !important;
        font-size: 13px !important;
        background: #d0936a !important;
    }

    .earn-card {
        background: linear-gradient(135deg, #ffcc00 0%, #ff9900 100%) !important;
        min-height: 250px !important;
    }

    .earn-card h3 {
        font-size: 20px !important;
    }

    .btn-outline,
    .btn-solid {
        min-width: 130px !important;
        padding: 10px 14px !important;
        font-size: 12px !important;
    }
}

/* ================================================================
   VENDORS - MOBILE
   ================================================================ */

@media (max-width: 767px) {
    .vendors {
        padding: 26px 0 !important;
        background: #fff !important;
        overflow: hidden !important;
    }

    .vendors .container {
        padding: 0 16px !important;
    }

    .vendors .section-heading {
        font-size: 24px !important;
        font-weight: 700 !important;
        margin-bottom: 8px !important;
        color: #1c1c1e !important;
    }

    .vendors .section-heading-p {
        font-size: 14px !important;
        margin-bottom: 20px !important;
        color: #6b7280 !important;
    }

    .vendors-container {
        position: relative !important;
        width: 100% !important;
        overflow: hidden !important;
    }

    .vendor-slider {
        overflow-x: auto !important;
        scroll-snap-type: x mandatory !important;
        scroll-behavior: smooth !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
    }

    .vendor-slider::-webkit-scrollbar {
        display: none !important;
    }

    .slider-track {
        display: flex !important;
        align-items: stretch !important;
        gap: 16px !important;
        padding: 0 16px 18px 16px !important;
    }

    .vendor-card {
        position: relative !important;
        flex: 0 0 84% !important;
        min-width: 84% !important;
        width: 84% !important;
        min-height: 330px !important;
        padding: 18px 16px !important;
        border-radius: 16px !important;
        flex-shrink: 0 !important;
        scroll-snap-align: center !important;
        background: linear-gradient(180deg, #fff8f3 0%, #ffffff 42%) !important;
        border: 1px solid #f3e2d6 !important;
        box-shadow: 0 4px 16px rgba(0,0,0,0.10) !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        text-decoration: none !important;
        overflow: hidden !important;
    }

    .vendor-card:active {
        transform: scale(0.98) !important;
    }

    .vendor-card .logo {
        width: 82px !important;
        height: 82px !important;
        margin: 0 auto 12px !important;
        border-radius: 20px !important;
        background: #fff !important;
        box-shadow: 0 8px 18px rgba(28, 28, 30, 0.10) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: hidden !important;
    }

    .curved-logo {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        border-radius: 18px !important;
    }

    .vendor-card h4 {
        font-size: 16px !important;
        font-weight: 700 !important;
        color: #1c1c1e !important;
        line-height: 1.3 !important;
        margin-bottom: 4px !important;
    }

    .vendor-card .sub {
        font-size: 12px !important;
        color: #6b7280 !important;
        margin-bottom: 12px !important;
    }

    .vendor-card .vendor-info {
        width: 100% !important;
        margin-top: 4px !important;
        padding: 12px !important;
        border-radius: 12px !important;
        background: #fafafa !important;
        border: 1px solid #f1f1f1 !important;
    }

    .vendor-card .meta {
        list-style: none !important;
        margin: 0 0 10px 0 !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
    }

    .vendor-card .meta li {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        font-size: 12px !important;
        line-height: 1.35 !important;
        color: #4b5563 !important;
        text-align: left !important;
    }

    .vendor-card .meta .icon,
    .vendor-card .meta .icon-verified {
        width: 16px !important;
        height: 16px !important;
        flex: 0 0 16px !important;
    }

    .vendor-card .rating {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 8px !important;
        margin-top: 8px !important;
        padding-top: 10px !important;
        border-top: 1px solid #ececec !important;
    }

    .vendor-card .stars {
        display: inline-flex !important;
        align-items: center !important;
        gap: 2px !important;
        color: #f59e0b !important;
        font-size: 14px !important;
        letter-spacing: 1px !important;
    }

    .vendor-card .score {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 4px 8px !important;
        border-radius: 999px !important;
        background: #fff3e8 !important;
        color: #f37021 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
    }

    .vendor-card .cta {
        width: 100% !important;
        margin-top: 14px !important;
        padding: 12px 16px !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        border-radius: 10px !important;
        background: #f37021 !important;
        color: #fff !important;
        border: none !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        box-shadow: 0 6px 16px rgba(243, 112, 33, 0.25) !important;
    }

    .vendor-card .cta:active {
        background: #d95f17 !important;
        transform: scale(0.98) !important;
    }

    .vendor-card .btn-icon {
        width: 14px !important;
        height: 14px !important;
        object-fit: contain !important;
        filter: brightness(0) invert(1) !important;
    }

    .vendors .col-md-12 {
        margin-top: 10px !important;
        padding: 0 16px !important;
    }

    .mobiview-all {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        border-radius: 10px !important;
        background: #fff !important;
        color: #f37021 !important;
        border: 2px solid #f37021 !important;
        box-shadow: none !important;
    }
}
/* ================================================================
   CATEGORY DROPDOWN FIX - MOBILE
   ================================================================ */

@media (max-width: 991px) {
    .nav-dropdown {
        position: static !important;
        box-shadow: none !important;
        border: none !important;
        background: transparent !important;
    }
    
    .nav-dropdown li.has-children > .nav-dropdown {
        margin-left: 15px !important;
        padding-left: 10px !important;
        border-left: 2px solid #f0f0f0 !important;
    }

    .nav-dropdown > li > a {
        padding: 10px 15px !important;
        font-size: 14px !important;
    }
}

/* ================================================================
   TOUCH OPTIMIZATION
   ================================================================ */

@media (max-width: 767px) {
    /* Larger touch targets */
    button,
    a.btn,
    .op {
        min-height: 44px !important;
        min-width: 44px !important;
    }

    /* Better tap highlighting */
    * {
        -webkit-tap-highlight-color: rgba(208, 147, 106, 0.2) !important;
    }

    /* Disable desktop hover on touch */
    .product-item:hover,
    .vendor-card:hover,
    .cat-card:hover {
        transform: none !important;
    }
}

/* ================================================================
   FOOTER - MOBILE REDESIGN
   ================================================================ */

@media (max-width: 767px) {
    #footerele,
    #footerele.footer {
        display: block !important;
        visibility: visible !important;
        min-height: auto !important;
        position: relative !important;
        overflow: hidden !important;
        background: linear-gradient(rgba(16, 20, 27, 0.90), rgba(22, 25, 33, 0.94)), url('../img/footerback.png') center center / cover no-repeat !important;
    }

    #footerele .container {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #footerele .footer_top {
        display: block !important;
        visibility: visible !important;
        padding: 30px 0 18px !important;
    }

    #footerele .footer_top > .row:first-child {
        display: flex !important;
        flex-direction: column !important;
        margin: 0 !important;
    }

    #footerele .footer_top > .row.align-items-center.mt-4 {
        order: -1 !important;
        margin-top: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 16px !important;
    }

    #footerele .footer_top [class*='col-lg-'],
    #footerele .footer_top [class*='col-md-'],
    #footerele .footer_top [class*='col-'] {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin-right: 0 !important;
        padding-left: 22px !important;
        padding-right: 22px !important;
    }

    #footerele .single_footer {
        text-align: center !important;
        margin-bottom: 26px !important;
    }

    #footerele .logo-img {
        display: block !important;
        height: auto !important;
        max-width: 220px !important;
        margin: 0 auto 16px !important;
    }

    #footerele .single_footer p {
        max-width: 340px !important;
        margin: 0 auto 10px !important;
        font-size: 14px !important;
        line-height: 1.55 !important;
        color: rgba(255,255,255,0.92) !important;
    }

    #footerele .single_footer h3,
    #footerele .social-connect h6,
    #footerele .payment-support span {
        text-align: center !important;
        color: #ffab2e !important;
        font-size: 18px !important;
        font-weight: 700 !important;
        line-height: 1.3 !important;
        margin-bottom: 14px !important;
        text-transform: none !important;
    }

    #footerele .single_footer .row,
    #footerele .payment-support .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    #footerele .single_footer ul {
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #footerele .single_footer ul li {
        margin-bottom: 12px !important;
        line-height: 1.45 !important;
    }

    #footerele .single_footer ul li a {
        color: rgba(255,255,255,0.94) !important;
        font-size: 15px !important;
        font-weight: 500 !important;
    }

    #footerele .payment-support {
        text-align: center !important;
        padding: 0 22px !important;
    }

    #footerele .payment-icons {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 12px !important;
        justify-items: center !important;
        align-items: center !important;
        padding-top: 8px !important;
    }

    #footerele .payment-icons img {
        width: 58px !important;
        height: 38px !important;
        object-fit: contain !important;
        background: rgba(255,255,255,0.95) !important;
        border-radius: 8px !important;
        padding: 8px !important;
        box-shadow: 0 6px 16px rgba(0,0,0,0.18) !important;
    }

    #footerele .social-connect {
        padding-top: 8px !important;
    }

    #footerele .social-icons {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 18px !important;
        flex-wrap: wrap !important;
    }

    #footerele .social-icons .social {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        border: none !important;
        background: transparent !important;
        color: #fff !important;
        padding: 0 !important;
    }

    #footerele .social-icons .social i {
        font-size: 22px !important;
        color: #fff !important;
    }

    #footerele .social-icons img[alt='TikTok'] {
        width: 20px !important;
        height: 20px !important;
        filter: brightness(0) invert(1) !important;
    }

    #footerele .footer_mob_bottom {
        display: none !important;
    }

    .footer-copyright {
        background: #f37021 !important;
        padding: 14px 16px !important;
    }

    .footer-copyright .container {
        padding: 0 !important;
    }

    .footer-copyright .footer-sub {
        margin: 0 !important;
        text-align: center !important;
        color: #fff !important;
        font-size: 13px !important;
        line-height: 1.7 !important;
    }

    .footer-copyright .footer-text {
        color: #fff !important;
        font-style: italic !important;
        text-decoration: none !important;
    }
}

/* ================================================================
   END OF CLEAN MOBILE OVERRIDE CSS
   ================================================================ */


/* ================================================================
   PRODUCT GRID - SEE MORE TOGGLE
   Desktop: show 5 (1 row), Mobile: show 4
   ================================================================ */

/* Desktop: hide items beyond 5 when collapsed */
.prd-grid-collapsed .product-item:nth-child(n+6) {
    display: none !important;
}

/* Mobile: hide items beyond 4 when collapsed */
@media (max-width: 767px) {
    .prd-grid-collapsed .product-item:nth-child(n+5) {
        display: none !important;
    }
}

/* See More button as button element */
.btn-view-all-modern {
    cursor: pointer;
    background: none;
    border: 1px solid #1c1c1e;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}


/* ================================================================
   MOBILE HEADER - CLEAN STYLES FOR .mbl-* CLASSES
   ================================================================ */

/* Base: desktop shows desktop shell, hides mobile shell */
.main-header .container > div.desktop-header-shell { display: flex !important; }
.main-header .container > div.mobile-header-shell  { display: none !important; }

@media (max-width: 767px) {

    /* Hide desktop shell completely */
    .main-header .container > div.desktop-header-shell { display: none !important; }
    .header-topbar .desktop-topbar-shell              { display: none !important; }

    /* Show mobile shell as a clean flex row */
    .main-header .container > div.mobile-header-shell {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        padding: 0 !important;
    }

    /* Logo */
    .mbl-logo-link {
        display: flex !important;
        align-items: center !important;
        text-decoration: none !important;
        flex-shrink: 0 !important;
    }
    .mbl-logo-link img {
        height: 30px !important;
        width: auto !important;
        max-width: 110px !important;
        object-fit: contain !important;
    }

    /* Right icons container */
    .mbl-header-icons {
        display: flex !important;
        align-items: center !important;
        gap: 0 !important;
        flex-shrink: 0 !important;
    }

    /* Each icon button */
    .mbl-icon-btn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: none !important;
        border: none !important;
        padding: 7px !important;
        cursor: pointer !important;
        text-decoration: none !important;
        position: relative !important;
    }
    .mbl-icon-btn svg {
        display: block !important;
        width: 22px !important;
        height: 22px !important;
        flex-shrink: 0 !important;
    }

    /* Cart badge */
    .mbl-icon-btn .cart-badge,
    .mbl-icon-btn .cart-count {
        position: absolute !important;
        top: 2px !important;
        right: 2px !important;
        background: #F37021 !important;
        color: #fff !important;
        border-radius: 50% !important;
        width: 16px !important;
        height: 16px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 9px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        pointer-events: none !important;
    }

    /* Account dropdown wrapper */
    .mbl-account-wrap {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
    }

    /* Account dropdown menu - fixed position to escape sticky header stacking context */
    .mbl-account-menu {
        position: fixed !important;
        top: 70px !important;
        right: 12px !important;
        background: #fff !important;
        border: 1px solid #e5e5e5 !important;
        border-radius: 12px !important;
        box-shadow: 0 6px 20px rgba(0,0,0,0.18) !important;
        min-width: 185px !important;
        z-index: 999999 !important;
        padding: 8px 0 !important;
    }
    .mbl-account-menu a {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        padding: 11px 16px !important;
        color: #1c1c1e !important;
        text-decoration: none !important;
        font-size: 14px !important;
        font-weight: 500 !important;
    }
    .mbl-account-menu a:hover {
        background: #fef6f0 !important;
    }

    /* Mobile search overlay */
    .mbl-search-overlay {
        display: none;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        background: rgba(0,0,0,0.72) !important;
        z-index: 99999 !important;
        align-items: flex-start !important;
        justify-content: center !important;
        padding-top: 70px !important;
    }
    .mbl-search-overlay.open {
        display: flex !important;
    }
}