/**
 * ============================================
 * FIX ALL RESPONSIVE ISSUES
 * ============================================
 * 1. Search bar visible on medium screens
 * 2. Cart sidebar properly positioned
 * 3. Price conversion fixes
 */

/* ============================================
 * 1. SEARCH BAR RESPONSIVE FIX
 * ============================================ */

/* Show search on all screens except very small mobiles */
.search-col {
    display: block !important;
}

/* Hide on very small screens only (< 576px) */
@media (max-width: 575px) {
    .search-col {
        display: none !important;
    }
}

/* Medium screens (tablets) - show with adjusted layout */
@media (min-width: 576px) and (max-width: 991px) {
    .search-col {
        display: block !important;
        order: 3 !important; /* Move search below navigation */
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding: 10px 15px !important;
        margin-top: 0 !important;
    }

    .product-search-one {
        max-width: 600px !important;
        margin: 0 auto !important;
    }

    .enhanced-search-form {
        width: 100% !important;
    }
}

/* Desktop - full width search */
@media (min-width: 992px) {
    .search-col {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
}

/* Small Desktop (992px - 1199px) - Force Search Visible */
@media (min-width: 992px) and (max-width: 1199px) {
    .search-col {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        flex: 1 1 auto !important;
    }

    .product-search-one,
    .enhanced-search-form {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
}

/* ============================================
 * 2. CART SIDEBAR POSITION FIX
 * ============================================ */

/* Ensure cart stays within viewport */
.cart-sidebar,
.cart-drawer,
.shopping-cart,
.side-cart {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    width: 100% !important;
    max-width: 420px !important;
    height: 100vh !important;
    max-height: 100vh !important;
    overflow: hidden !important;
    transform: translateX(100%) !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    z-index: 9999 !important;
    background: white !important;
    box-shadow: -5px 0 30px rgba(0, 0, 0, 0.3) !important;
}

/* When cart is open */
.cart-sidebar.active,
.cart-sidebar.show,
.cart-sidebar.open,
.cart-drawer.active,
.cart-drawer.show,
.shopping-cart.active,
.shopping-cart.show {
    transform: translateX(0) !important;
}

/* Prevent cart from going off-screen on mobile */
@media (max-width: 767px) {
    .cart-sidebar,
    .cart-drawer,
    .shopping-cart {
        max-width: 100% !important;
        width: 100% !important;
        left: 0 !important;
        right: 0 !important;
    }
}

/* Medium screens */
@media (min-width: 768px) and (max-width: 991px) {
    .cart-sidebar,
    .cart-drawer,
    .shopping-cart {
        max-width: 400px !important;
    }
}

/* Fix cart backdrop */
.cart-overlay-backdrop,
.cart-backdrop {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: rgba(0, 0, 0, 0.5) !important;
    z-index: 9998 !important;
    display: none !important;
}

.cart-overlay-backdrop.active,
.cart-overlay-backdrop.show,
.cart-backdrop.active,
.cart-backdrop.show {
    display: block !important;
}

/* Prevent body scroll when cart is open */
body.cart-open {
    overflow: hidden !important;
    position: fixed !important;
    width: 100% !important;
}

/* ============================================
 * 3. PRICE DISPLAY FIX
 * ============================================ */

/* Ensure price shows without conversion on homepage */
.price,
.product-price,
.price-tag,
.current-price {
    display: inline-block !important;
}

.price ins,
.product-price ins,
.price ins del {
    text-decoration: none !important;
    font-weight: 600 !important;
    color: #28a745 !important;
}

/* Remove any price conversion indicators */
.converted-price,
.price-converted {
    display: none !important;
}

/* ============================================
 * 4. RTL SUPPORT FOR CART
 * ============================================ */

[dir="rtl"] .cart-sidebar,
[dir="rtl"] .cart-drawer,
html[lang="ar"] .cart-sidebar,
html[lang="arabic"] .cart-sidebar,
body.ar .cart-sidebar {
    right: auto !important;
    left: 0 !important;
    transform: translateX(-100%) !important;
}

[dir="rtl"] .cart-sidebar.active,
[dir="rtl"] .cart-drawer.show,
html[lang="ar"] .cart-sidebar.show,
html[lang="arabic"] .cart-sidebar.show,
body.ar .cart-sidebar.show {
    transform: translateX(0) !important;
}

/* ============================================
 * 5. MOBILE HEADER ADJUSTMENTS
 * ============================================ */

@media (max-width: 991px) {
    /* Stack header elements properly */
    .header-row,
    .navbar-row {
        flex-wrap: wrap !important;
    }

    /* Logo takes priority */
    .logo-col {
        order: 1 !important;
        flex: 0 0 auto !important;
    }

    /* Icons on right */
    .icons-col {
        order: 2 !important;
        flex: 1 1 auto !important;
        justify-content: flex-end !important;
    }

    /* Menu button */
    .menu-col {
        order: 3 !important;
    }

    /* Search bar below */
    .search-col {
        order: 4 !important;
        width: 100% !important;
        flex: 0 0 100% !important;
    }
}

/* ============================================
 * 6. PREVENT HORIZONTAL SCROLL
 * ============================================ */

body,
html {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}

.container,
.container-fluid {
    overflow-x: hidden !important;
}

/* ============================================
 * 7. Z-INDEX HIERARCHY
 * ============================================ */

.cart-sidebar,
.cart-drawer { z-index: 9999 !important; }

.cart-overlay-backdrop,
.cart-backdrop { z-index: 9998 !important; }

header,
.header { z-index: 60 !important; }

.navbar { z-index: 50 !important; }

/* ============================================
 * 8. SMOOTH ANIMATIONS
 * ============================================ */

.cart-sidebar,
.cart-drawer,
.cart-overlay-backdrop {
    will-change: transform, opacity !important;
}

@media (prefers-reduced-motion: reduce) {
    .cart-sidebar,
    .cart-drawer,
    .cart-overlay-backdrop {
        transition: none !important;
    }
}

/* ============================================
 * 9. ACCESSIBILITY
 * ============================================ */

.cart-sidebar:focus-visible,
.cart-drawer:focus-visible {
    outline: 2px solid #28a745 !important;
    outline-offset: -2px !important;
}

/* ============================================
 * 10. HEADER SPACING FIX
 * ============================================ */

@media (min-width: 576px) and (max-width: 991px) {
    .search-col .product-search-one {
        padding: 8px 0 !important;
    }

    /* Ensure proper spacing */
    header .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    header .row > [class*="col-"] {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}