/**
 * Global responsive fixes — all screen sizes & RTL
 * Loaded blocking after custom.css
 */

/* ── Prevent horizontal scroll ── */
html {
    overflow-x: clip;
    scroll-behavior: smooth;
}

body {
    overflow-x: hidden;
    max-width: 100%;
}

/* ── Media & embeds ── */
img,
video,
iframe,
svg,
canvas {
    max-width: 100%;
    height: auto;
}

/* ── Owl carousel: stop nav arrows causing overflow ── */
.owl-carousel {
    overflow: hidden;
}

.owl-carousel .owl-stage-outer {
    overflow: hidden;
}

.owl-nav {
    width: 100% !important;
    left: 0 !important;
    right: 0;
    padding-inline: 4px;
    pointer-events: none;
}

.owl-nav button {
    pointer-events: auto;
}

@media (max-width: 767px) {
    .featured_deal .owl-stage-outer,
    .flash-deal-slider .owl-stage-outer,
    .feature-product .owl-stage-outer {
        overflow: hidden !important;
    }
}

/* Featured products carousel (class-based, not #id) */
@media (max-width: 539px) {
    .featured_products_listSlide.owl-theme .owl-nav .owl-prev {
        transform: translateX(-10px);
    }

    .featured_products_listSlide.owl-theme .owl-nav .owl-next {
        transform: translateX(10px);
    }
}

@media (max-width: 360px) {
    .featured_products_listSlide.owl-carousel {
        max-width: 100%;
    }
}

/* ── RTL: mobile drawers & sidebars ── */
@media (max-width: 767px) {
    html[dir="rtl"] #navbarCollapse {
        right: auto;
        left: 0;
    }

    html[dir="rtl"] .logout-btn {
        right: auto;
        left: 0;
    }
}

@media (max-width: 991px) {
    html[dir="rtl"] #shop-sidebar {
        right: auto;
        left: 0;
        border-radius: 0 0.5rem 0.5rem 0;
        transform: translateX(-100%);
    }

    html[dir="rtl"] #shop-sidebar.active {
        transform: translateX(0);
    }

    html[dir="rtl"] .profile-aside-overlay {
        left: auto;
        right: 0;
        width: calc(100vw - min(320px, 100%));
    }
}

/* ── Header category arrow spacing (RTL) ── */
html[dir="rtl"] .__ml-50px {
    margin-left: 0 !important;
    margin-inline-start: 50px;
}

@media (max-width: 767px) {
    html[dir="rtl"] .__ml-50px {
        margin-inline-start: 0 !important;
    }
}

/* ── Product list sort / filter on mobile ── */
@media (max-width: 991px) {
    .sort-by-wrap,
    .filter-by-wrap {
        width: 100%;
    }
}

@media (min-width: 992px) {
    .sort-by-wrap,
    .filter-by-wrap {
        width: auto;
    }
}

/* ── Product list / search header ── */
.search-page-header {
    flex-wrap: wrap !important;
    gap: 0.75rem;
}

.search-page-header .sorting-item {
    min-width: 0;
}

@media (max-width: 991px) {
    .search-page-header .search-page-controls {
        width: 100%;
        flex-wrap: wrap !important;
    }

    .search-page-header .search-page-controls-inner {
        width: 100%;
        flex-direction: column;
        align-items: stretch !important;
    }

    .search-page-header .sorting-item {
        width: 100%;
    }

    .search-page-header .product-list-filter-input {
        width: 100%;
        max-width: 100%;
    }

    .search-page-header .search-page-button-input {
        min-width: 0;
    }
}

/* ── Cookie consent banner ── */
.cookie-section .text-wrapper {
    width: 100%;
    max-width: 100%;
    flex: 1 1 100%;
}

.cookie-section .container > .d-flex {
    flex-wrap: wrap;
    gap: 1rem;
}

@media (max-width: 575px) {
    .cookie-section {
        padding: 16px 0;
    }

    .cookie-section .btn-wrapper {
        width: 100%;
        justify-content: stretch;
    }

    .cookie-section .btn-wrapper .btn {
        flex: 1 1 auto;
        text-align: center;
    }
}

/* ── Floating action buttons (RTL) ── */
html[dir="rtl"] .__floating-btn,
html[dir="rtl"] .floating-btn-grp {
    right: auto;
    left: 16px;
}

/* ── Containers & grids ── */
@media (max-width: 575px) {
    .container,
    .container-fluid {
        padding-left: 12px;
        padding-right: 12px;
    }
}

.row > [class*="col-"] {
    min-width: 0;
}

/* ── Product cards ── */
.product-single-hover,
.flash_deal_product,
.feature-product {
    min-width: 0;
}

/* ── Forms & inputs ── */
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea,
.form-control {
    max-width: 100%;
}

/* ── Tables ── */
.table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 767px) {
    .table td,
    .table th {
        font-size: 0.8125rem;
        padding: 0.5rem 0.35rem;
        white-space: nowrap;
    }

    .table-responsive .table td,
    .table-responsive .table th {
        white-space: normal;
    }
}

/* ── Modals ── */
@media (max-width: 575px) {
    .modal-dialog {
        margin: 0.5rem auto;
        max-width: calc(100% - 1rem);
    }
}

/* ── Typography overflow ── */
h1, h2, h3, h4, h5, h6,
p, span, a, label {
    overflow-wrap: break-word;
    word-wrap: break-word;
}

/* ── Mega menu desktop only ── */
@media (max-width: 991px) {
    .category-menu-wrap.d-none.d-xl-block {
        display: none !important;
    }
}

/* ── Hero & banners ── */
/* Hero slider sizing is owned by modern-home.css (aspect-ratio based) */
@media (max-width: 575px) {
    .promotional-banner-slider .__slide-img {
        max-height: 180px;
        object-fit: cover;
    }
}

/* ── Cart & checkout ── */
@media (max-width: 767px) {
    .cart_information,
    .__cart-total {
        padding: 12px;
    }

    .checkout-steps {
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
    }
}

/* ── Product details ── */
@media (max-width: 767px) {
    .cz-product-gallery,
    .product-details-content {
        min-width: 0;
    }

    .product-details-sticky {
        max-width: 100%;
    }
}

/* ── Vendor shop header ── */
@media (max-width: 575px) {
    .search-page-header .nav-tabs .nav-link h3 {
        font-size: 13px;
    }
}

/* ── Footer newsletter (extra safety) ── */
@media (max-width: 767px) {
    .ja-footer-tagline {
        max-width: 100%;
    }

    .ja-footer-bottom {
        flex-direction: column;
        text-align: center;
        gap: 0.5rem;
    }
}

/* ── Auth & profile pages ── */
@media (max-width: 575px) {
    .profile-sidebar,
    .__customer-profile {
        min-width: 0;
    }
}

/* ── Breadcrumb ── */
@media (max-width: 575px) {
    .breadcrumb {
        font-size: 0.75rem;
        flex-wrap: wrap;
    }
}

/* ── Topbar ── */
@media (max-width: 575px) {
    .topbar {
        font-size: 0.75rem;
    }

    .topbar .container {
        padding-left: 8px;
        padding-right: 8px;
    }
}

/* ── Navbar tool icons spacing on very small screens ── */
@media (max-width: 360px) {
    .navbar-tool-icon-box {
        width: 2rem;
        height: 2rem;
    }

    .navbar-brand img {
        max-height: 32px;
    }
}