/* ==========================================
   SOKO IMARA - DESKTOP SHOP
   ========================================== */

.desktop-shop-page{
    background:#f8f9fb;
    min-height:100vh;
    padding:25px 0 60px;
}

.desktop-shop-page .container{
    max-width:1500px;
    width:95%;
}

/* ==========================================
   BREADCRUMB
   ========================================== */

.shop-breadcrumb{
    padding:18px 0 10px;
}

.breadcrumb{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:14px;
}

.breadcrumb a{
    color:#6c757d;
    text-decoration:none;
}

.breadcrumb a:hover{
    color:#e5a100;
}

.breadcrumb span{
    color:#6c757d;
}

.separator{
    font-size:12px;
}
/* ==========================================
   SHOP HEADER
   ========================================== */

.shop-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:30px;
}

.shop-header-left{
    display:flex;
    flex-direction:column;
}

.shop-header-left h1{
    margin:0;
    font-size:28px;
    font-weight:700;
    line-height:1.2;
    color:#111827;
}

.shop-header-left p{
    margin:8px 0 0;
    font-size:18px;
    color:#6b7280;
    font-weight:400;
}

.shop-header-right{
    display:flex;
    align-items:center;
    gap:14px;
}

.shop-header-right label{
    font-size:16px;
    color:#374151;
    font-weight:500;
    margin:0;
}

.shop-sort{
    width:170px;
    height:42px;
    border:1px solid #e5e7eb;
    border-radius:6px;
    background:#fff;
    padding:0 14px;
    font-size:15px;
    color:#374151;
    outline:none;
    cursor:pointer;
    transition:.2s;
}

.shop-sort:hover{
    border-color:#d1d5db;
}

.shop-sort:focus{
    border-color:#f4b400;
}
/* ==========================================
   ACTIVE FILTER TAGS
   ========================================== */

.shop-filter-tags{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:24px;
    flex-wrap:wrap;
}

.filter-tag{
    display:flex;
    align-items:center;
    gap:10px;

    height:42px;

    padding:0 18px;

    background:#fff;

    border:1px solid #e5e7eb;

    border-radius:8px;

    font-size:15px;

    color:#374151;

    cursor:pointer;

    transition:.2s;
}

.filter-tag:hover{
    border-color:#d1d5db;
}

.filter-tag span{

    font-size:18px;

    color:#6b7280;

    line-height:1;
}

.clear-filters{

    color:#f4b400;

    text-decoration:none;

    font-weight:600;

    font-size:15px;
}

.clear-filters:hover{

    text-decoration:underline;
}
/* ==========================================
   SIDEBAR HEADER
   ========================================== */

.sidebar-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-bottom:18px;
}

.sidebar-header h3{

    margin:0;

    font-size:30px;

    font-weight:700;

    color:#111827;
}

.sidebar-clear{

    color:#f4b400;

    font-size:14px;

    font-weight:600;

    text-decoration:none;
}

.sidebar-clear:hover{

    text-decoration:underline;
}

.sidebar-divider{

    border:none;

    border-top:1px solid #ececec;

    margin:0 0 25px;
}
/* ==========================================
   SHOP LAYOUT
   ========================================== */

.shop-layout{
    display:grid;
    grid-template-columns:300px 1fr;
    gap:35px;
    align-items:start;
}

.shop-sidebar{
    width:300px;
}

.shop-content{
    min-width:0;
}
/* ==========================================
   FILTER GROUP
   ========================================== */

.filter-group{

    margin-bottom:30px;
}

.filter-group-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-bottom:18px;
}

.filter-group-header h4{

    margin:0;

    font-size:18px;

    font-weight:700;

    color:#1f2937;
}

.filter-toggle{

    border:none;

    background:none;

    padding:0;

    cursor:pointer;

    color:#6b7280;

    font-size:14px;
}

.filter-options{

    display:flex;

    flex-direction:column;

    gap:12px;
}

.filter-option{

    display:flex;

    justify-content:space-between;

    align-items:center;

    cursor:pointer;

    margin:0;
}

.filter-left{

    display:flex;

    align-items:center;

    gap:10px;
}

.filter-left input{

    width:18px;

    height:18px;

    cursor:pointer;
}

.filter-left span{

    font-size:15px;

    color:#374151;
}

.filter-count{

    font-size:14px;

    color:#6b7280;
}

.filter-view-more{

    display:inline-flex;

    align-items:center;

    gap:6px;

    margin-top:8px;

    color:#f4b400;

    font-size:14px;

    font-weight:600;

    text-decoration:none;
}

.filter-view-more:hover{

    text-decoration:underline;
}
/* ==========================================
   FILTER SEARCH
   ========================================== */

.filter-search{

    position:relative;

    margin-bottom:18px;
}

.filter-search i{

    position:absolute;

    left:14px;

    top:50%;

    transform:translateY(-50%);

    color:#9ca3af;

    font-size:14px;
}

.filter-search input{

    width:100%;

    height:44px;

    padding:0 14px 0 40px;

    border:1px solid #e5e7eb;

    border-radius:8px;

    font-size:14px;

    outline:none;

    transition:.2s;
}

.filter-search input:focus{

    border-color:#f4b400;
}
/* ==========================================
   PRICE RANGE
   ========================================== */

.price-inputs{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:12px;

    margin-bottom:22px;
}

.price-field label{

    display:block;

    margin-bottom:8px;

    font-size:13px;

    font-weight:600;

    color:#6b7280;
}

.price-field input{

    width:100%;

    height:44px;

    border:1px solid #e5e7eb;

    border-radius:8px;

    padding:0 12px;

    font-size:14px;

    outline:none;

    transition:.2s;
}

.price-field input:focus{

    border-color:#f4b400;
}

.price-slider-placeholder{

    position:relative;

    height:22px;

    margin-top:10px;
}

.slider-line{

    position:absolute;

    left:0;

    right:0;

    top:10px;

    height:4px;

    background:#e5e7eb;

    border-radius:50px;
}

.slider-fill{

    position:absolute;

    left:15%;

    right:20%;

    top:10px;

    height:4px;

    background:#f4b400;

    border-radius:50px;
}

.slider-thumb{

    position:absolute;

    top:4px;

    width:16px;

    height:16px;

    background:#fff;

    border:3px solid #f4b400;

    border-radius:50%;
}

.slider-thumb-left{

    left:15%;
}

.slider-thumb-right{

    right:20%;
}
.radio-option{

    display:flex;

    align-items:center;

    gap:12px;

    cursor:pointer;

    padding:6px 0;

    font-size:15px;

    color:#374151;
}

.radio-option input{

    width:18px;

    height:18px;

    cursor:pointer;
}

.radio-option span{

    flex:1;
}
/* ==========================================
   APPLY FILTER BUTTON
   ========================================== */

.apply-filter-btn{

    width:100%;

    height:54px;

    margin-top:18px;

    border:0;

    border-radius:10px;

    background:#F4B400;

    color:#fff;

    font-size:16px;

    font-weight:700;

    letter-spacing:.2px;

    cursor:pointer;

    display:flex;

    align-items:center;

    justify-content:center;

    transition:all .25s ease;

    box-shadow:0 8px 20px rgba(244,180,0,.18);
}

.apply-filter-btn:hover{

    background:#E0A300;

    transform:translateY(-1px);

    box-shadow:0 12px 24px rgba(244,180,0,.25);
}

.apply-filter-btn:active{

    transform:translateY(0);
}
/* ==========================================
   PRODUCT GRID
   ========================================== */

.products-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:24px;
}

/* =====================================================
   PRODUCT GRID
===================================================== */

.products-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(240px,1fr));
    gap:22px;
}

/* =====================================================
   PRODUCT CARD
===================================================== */

.product-card{
    background:#fff;
    border:1px solid #ececec;
    border-radius:12px;
    overflow:hidden;
    transition:.3s ease;
    box-shadow:0 2px 10px rgba(0,0,0,.06);
    display:flex;
    flex-direction:column;
    height:100%;
}

.product-card:hover{
    transform:translateY(-4px);
    box-shadow:0 10px 24px rgba(0,0,0,.12);
}

.product-card a{
    display:flex;
    flex-direction:column;
    height:100%;
    color:inherit;
    text-decoration:none;
}

/* =====================================================
   IMAGE
===================================================== */

.product-image{
    position:relative;
    aspect-ratio:1 / 1;
    background:#fff;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
    border-bottom:1px solid #f3f3f3;
}

.product-image img{
    width:100%;
    height:100%;
    object-fit:contain;
    padding:8px;
    transition:.3s ease;
}

.product-card:hover .product-image img{
    transform:scale(1.05);
}

/* =====================================================
   CONDITION BADGE
===================================================== */

.condition-badge{
    position:absolute;
    top:8px;
    left:8px;
    z-index:2;

    background:#28a745;
    color:#fff;

    font-size:10px;
    font-weight:700;

    padding:4px 10px;

    border-radius:20px;

    text-transform:uppercase;
}

.condition-badge.used{
    background:#f39c12;
}

/* =====================================================
   BODY
===================================================== */

.product-body{
    display:flex;
    flex-direction:column;
    flex:1;
    padding:10px;
}

/* =====================================================
   CATEGORY
===================================================== */

.product-category{
    font-size:10px;
    font-weight:700;
    color:#d89b00;
    text-transform:uppercase;
    margin-bottom:5px;
}

/* =====================================================
   TITLE
===================================================== */

.product-title{

    font-size:15px;

    font-weight:600;

    line-height:1.35;

    color:#222;

    margin:0 0 8px;

    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;

    min-height:40px;
}

/* =====================================================
   PRICE
===================================================== */

.product-price{

    font-size:18px;

    font-weight:700;

    color:#111;

    margin-bottom:8px;
}

/* =====================================================
   LOCATION
===================================================== */

.product-location{

    display:flex;

    align-items:center;

    gap:5px;

    font-size:12px;

    color:#666;

    margin-bottom:8px;
}

.product-location i{

    color:#f4a100;

    font-size:11px;
}

/* =====================================================
   SELLER
===================================================== */

.seller-info{

    margin-bottom:10px;
}

.seller-left{

    display:flex;

    align-items:center;

    gap:6px;

    flex-wrap:wrap;
}

.seller-name{

    font-size:12px;

    font-weight:600;

    color:#444;
}

/* =====================================================
   VERIFIED BADGE
===================================================== */

.verified-badge{

    display:inline-flex;

    align-items:center;

    gap:4px;

    padding:2px 8px;

    border-radius:20px;

    background:#ecf9f0;

    color:#1c8c44;

    font-size:10px;

    font-weight:700;
}

.verified-badge i{

    font-size:10px;
}

/* =====================================================
   DIVIDER
===================================================== */

.product-divider{

    height:1px;

    background:#eee;

    margin-top:auto;

    margin-bottom:8px;
}

/* =====================================================
   FOOTER
===================================================== */

.product-footer{

    display:flex;

    justify-content:flex-end;
}

/* =====================================================
   BUTTON
===================================================== */

.view-product-btn{

    display:inline-flex;

    align-items:center;

    gap:5px;

    font-size:12px;

    font-weight:600;

    color:#f4a100;

    transition:.3s;
}

.product-card:hover .view-product-btn{

    color:#d98b00;
}

.view-product-btn i{

    font-size:11px;
}












/* ==========================================================
   COLLAPSIBLE FILTERS
========================================================== */

.filter-group-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    cursor:pointer;
    user-select:none;
}

.filter-group-header h4{
    margin:0;
}

.filter-toggle{
    width:32px;
    height:32px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:none;
    background:transparent;
    cursor:pointer;
    padding:0;
}

.filter-toggle i{
    font-size:13px;
    transition:transform .3s ease;
}

.filter-options{
    overflow:hidden;
    max-height:5000px;
    opacity:1;
    transition:
        max-height .35s ease,
        opacity .25s ease,
        padding .25s ease,
        margin .25s ease;
}

.filter-options.collapsed{
    max-height:0;
    opacity:0;
    overflow:hidden;
    margin-top:0;
    padding-top:0;
    padding-bottom:0;
}

.filter-group-header.active .filter-toggle i{
    transform:rotate(180deg);
}
.hidden{
    display:none;
}
/* Sidebar Header */
.sidebar-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:24px;
}

.sidebar-header h3{
    margin:0;
    font-size:42px;
    font-weight:700;
    color:#1b2238;
    line-height:1;
}

/* Clear Filters Button */
.clear-filters-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    min-width:140px;
    height:46px;
    padding:0 22px;

    border:1.5px solid #d8dee9;
    border-radius:12px;

    background:#fff;
    color:#6b7280;
    font-size:15px;
    font-weight:600;

    text-decoration:none;
    transition:.25s ease;
}

.clear-filters-btn:hover{
    background:#f8fafc;
    border-color:#d4a017;
    color:#d4a017;
}

.clear-filters-btn i{
    font-size:13px;
}
.shop-pagination {
    margin-top: 60px;
    display: flex;
    justify-content: center;
}
/* =========================================================
   SEARCHABLE DYNAMIC FILTERS
   ========================================================= */

.dynamic-filter-search {
    margin-bottom: 10px;
}

.dynamic-filter-search-input {
    width: 100%;
    height: 38px;
    padding: 8px 12px;
    border: 1px solid #d9dee7;
    border-radius: 8px;
    background: #fff;
    font-size: 13px;
    outline: none;
}

.dynamic-filter-search-input:focus {
    border-color: #0d6efd;
    box-shadow: 0 0 0 2px rgba(13, 110, 253, .08);
}

.dynamic-filter-options {
    max-height: 230px;
    overflow-y: auto;
}

.dynamic-filter-option {
    transition: opacity .15s ease;
}

.dynamic-filter-no-results {
    font-size: 12px;
    color: #777;
    padding: 8px 0;
}


/* =========================================================
   COMPACT SHOP PRODUCT CARDS
   Desktop only
========================================================= */

@media (min-width: 992px) {

    .product-card {
        height: 360px !important;
        max-height: 360px !important;
    }

    .product-card .product-image,
    .product-card .product-thumbnail,
    .product-card .card-image {
        height: 190px;
        overflow: hidden;
    }

    .product-card .product-image img,
    .product-card .product-thumbnail img,
    .product-card .card-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .product-card .product-info,
    .product-card .card-body {
        padding: 10px 12px;
    }

}


/* ==========================================================
   SOKO IMARA - MODERN STICKY DESKTOP FILTER
   Desktop only
========================================================== */

@media (min-width: 992px) {

    /* ------------------------------------------------------
       SIDEBAR POSITION
    ------------------------------------------------------ */

    .shop-sidebar {
        position: sticky;
        top: 20px;
        align-self: start;
        width: 300px;
        height: calc(100vh - 40px);
        min-height: 0;
    }


    /* ------------------------------------------------------
       FILTER CARD
    ------------------------------------------------------ */

    .shop-filter-sidebar {
        width: 100%;
        height: 100%;
        max-height: calc(100vh - 40px);

        background: #ffffff;

        border: 1px solid #e8ebf0;
        border-radius: 14px;

        padding: 20px 18px;

        box-shadow:
            0 4px 18px rgba(15, 23, 42, 0.06);

        overflow-y: auto;
        overflow-x: hidden;

        scrollbar-width: thin;
        scrollbar-color: #d7dbe2 transparent;

        box-sizing: border-box;
    }


    /* ------------------------------------------------------
       CUSTOM SCROLLBAR
    ------------------------------------------------------ */

    .shop-filter-sidebar::-webkit-scrollbar {
        width: 5px;
    }

    .shop-filter-sidebar::-webkit-scrollbar-track {
        background: transparent;
    }

    .shop-filter-sidebar::-webkit-scrollbar-thumb {
        background: #d5d9e0;
        border-radius: 20px;
    }

    .shop-filter-sidebar::-webkit-scrollbar-thumb:hover {
        background: #b8bec8;
    }


    /* ------------------------------------------------------
       FILTER SECTION
    ------------------------------------------------------ */

    .shop-filter-sidebar .filter-section {
        margin: 0;
        padding: 0 0 18px;
        margin-bottom: 18px;

        border-bottom: 1px solid #eef0f3;
    }

    .shop-filter-sidebar .filter-section:last-of-type {
        border-bottom: none;
    }


    /* ------------------------------------------------------
       SECTION HEADINGS
    ------------------------------------------------------ */

    .shop-filter-sidebar .filter-section-title {
        margin: 0 0 10px;
        padding: 0;
    }

    .shop-filter-sidebar .filter-section-title h4 {
        margin: 0;

        font-size: 15px;
        line-height: 1.3;

        font-weight: 700;

        color: #172033;
        letter-spacing: -0.1px;
    }


    /* ------------------------------------------------------
       FILTER OPTIONS
    ------------------------------------------------------ */

    .shop-filter-sidebar .filter-options {
        display: flex;
        flex-direction: column;

        gap: 7px;

        margin: 0;
        padding: 0;
    }


    /* ------------------------------------------------------
       CHECKBOX / RADIO ROW
    ------------------------------------------------------ */

    .shop-filter-sidebar .filter-checkbox {
        display: flex;
        align-items: center;

        gap: 9px;

        margin: 0;
        padding: 3px 0;

        color: #566176;

        font-size: 13px;
        line-height: 1.4;

        font-weight: 400;

        cursor: pointer;

        transition:
            color .15s ease,
            transform .15s ease;
    }

    .shop-filter-sidebar .filter-checkbox:hover {
        color: #172033;
    }


    /* ------------------------------------------------------
       CHECKBOX / RADIO INPUT
    ------------------------------------------------------ */

    .shop-filter-sidebar .filter-checkbox input {
        width: 15px;
        height: 15px;

        margin: 0;

        flex: 0 0 15px;

        accent-color: #d99a00;

        cursor: pointer;
    }


    .shop-filter-sidebar .filter-checkbox span {
        font-size: 13px;
        color: inherit;
    }


    /* ------------------------------------------------------
       VIEW MORE
    ------------------------------------------------------ */

    .shop-filter-sidebar .shop-view-toggle {
        margin-top: 7px;

        padding: 0;

        border: none;
        background: transparent;

        color: #c98d00;

        font-size: 12px;
        font-weight: 700;

        cursor: pointer;

        transition: color .15s ease;
    }

    .shop-filter-sidebar .shop-view-toggle:hover {
        color: #9d6e00;
        text-decoration: underline;
    }


    /* ------------------------------------------------------
       SELECT BOXES
    ------------------------------------------------------ */

    .shop-filter-sidebar .shop-search-select,
    .shop-filter-sidebar select.form-select {
        width: 100%;
        height: 40px;

        padding: 0 34px 0 11px;

        border: 1px solid #dfe3e9;
        border-radius: 8px;

        background-color: #ffffff;

        color: #3d4759;

        font-size: 13px;
        font-weight: 400;

        outline: none;

        box-shadow: none;

        transition:
            border-color .15s ease,
            box-shadow .15s ease;
    }

    .shop-filter-sidebar .shop-search-select:hover,
    .shop-filter-sidebar select.form-select:hover {
        border-color: #cbd1da;
    }

    .shop-filter-sidebar .shop-search-select:focus,
    .shop-filter-sidebar select.form-select:focus {
        border-color: #d99a00;

        box-shadow:
            0 0 0 3px rgba(217, 154, 0, 0.10);
    }


    /* ------------------------------------------------------
       LOCATION SEARCH
    ------------------------------------------------------ */

    .shop-filter-sidebar .shop-location-search {
        margin-bottom: 9px;
    }

    .shop-filter-sidebar .shop-location-search input {
        width: 100%;
        height: 39px;

        padding: 0 11px;

        border: 1px solid #dfe3e9;
        border-radius: 8px;

        background: #ffffff;

        color: #3d4759;

        font-size: 13px;

        outline: none;

        box-shadow: none;

        transition:
            border-color .15s ease,
            box-shadow .15s ease;
    }

    .shop-filter-sidebar .shop-location-search input::placeholder {
        color: #9aa2af;
        opacity: 1;
    }

    .shop-filter-sidebar .shop-location-search input:focus {
        border-color: #d99a00;

        box-shadow:
            0 0 0 3px rgba(217, 154, 0, 0.10);
    }


    /* ------------------------------------------------------
       PRICE RANGE
    ------------------------------------------------------ */

    .shop-filter-sidebar .price-filter-row {
        display: grid;

        grid-template-columns: 1fr 1fr;

        gap: 8px;

        margin: 0;
    }

    .shop-filter-sidebar .price-filter-row input {
        width: 100%;
        height: 39px;

        padding: 0 9px;

        border: 1px solid #dfe3e9;
        border-radius: 8px;

        background: #ffffff;

        color: #3d4759;

        font-size: 13px;

        outline: none;

        box-shadow: none;

        box-sizing: border-box;

        transition:
            border-color .15s ease,
            box-shadow .15s ease;
    }

    .shop-filter-sidebar .price-filter-row input::placeholder {
        color: #9aa2af;
    }

    .shop-filter-sidebar .price-filter-row input:focus {
        border-color: #d99a00;

        box-shadow:
            0 0 0 3px rgba(217, 154, 0, 0.10);
    }


    /* ------------------------------------------------------
       DYNAMIC ATTRIBUTE SEARCH
    ------------------------------------------------------ */

    .shop-filter-sidebar .dynamic-filter-search {
        margin-bottom: 8px;
    }

    .shop-filter-sidebar .dynamic-filter-search-input {
        width: 100%;
        height: 36px;

        padding: 0 10px;

        border: 1px solid #dfe3e9;
        border-radius: 8px;

        background: #ffffff;

        color: #3d4759;

        font-size: 12px;

        outline: none;

        box-shadow: none;

        box-sizing: border-box;
    }

    .shop-filter-sidebar .dynamic-filter-search-input::placeholder {
        color: #9aa2af;
    }

    .shop-filter-sidebar .dynamic-filter-search-input:focus {
        border-color: #d99a00;

        box-shadow:
            0 0 0 3px rgba(217, 154, 0, 0.10);
    }


    /* ------------------------------------------------------
       DYNAMIC OPTIONS
    ------------------------------------------------------ */

    .shop-filter-sidebar .dynamic-filter-options {
        gap: 6px;
    }


    /* ------------------------------------------------------
       NO RESULTS
    ------------------------------------------------------ */

    .shop-filter-sidebar .dynamic-filter-no-results {
        padding: 7px 0;

        color: #9aa2af;

        font-size: 12px;
    }


    /* ------------------------------------------------------
       APPLY / RESET AREA
    ------------------------------------------------------ */

    .shop-filter-sidebar .filter-actions {
        padding-top: 4px;

        background: #ffffff;
    }

    .shop-filter-sidebar .filter-actions .btn {
        min-height: 40px;

        border-radius: 8px;

        font-size: 13px;
        font-weight: 700;

        box-shadow: none;

        transition:
            transform .15s ease,
            box-shadow .15s ease;
    }

    .shop-filter-sidebar .filter-actions .btn-primary {
        background: #d99a00;
        border-color: #d99a00;
        color: #ffffff;
    }

    .shop-filter-sidebar .filter-actions .btn-primary:hover {
        background: #bd8500;
        border-color: #bd8500;

        transform: translateY(-1px);

        box-shadow:
            0 4px 10px rgba(217, 154, 0, 0.18);
    }

    .shop-filter-sidebar .filter-actions .btn-outline-secondary {
        border-color: #e1e4e9;

        color: #687386;

        background: #ffffff;
    }

    .shop-filter-sidebar .filter-actions .btn-outline-secondary:hover {
        background: #f7f8fa;

        border-color: #d4d8df;

        color: #303a4c;
    }


    /* ------------------------------------------------------
       COMPACT SIDEBAR WIDTH
    ------------------------------------------------------ */

    .shop-layout {
        grid-template-columns: 285px 1fr;
        gap: 28px;
    }

    .shop-sidebar {
        width: 285px;
    }


    /* ------------------------------------------------------
       SHOP CONTENT
    ------------------------------------------------------ */

    .shop-content {
        min-width: 0;
    }

}


/* ==========================================================
   LARGE DESKTOP
========================================================== */

@media (min-width: 1400px) {

    .shop-layout {
        grid-template-columns: 295px 1fr;
        gap: 30px;
    }

    .shop-sidebar {
        width: 295px;
    }

}


/* ==========================================================
   IMPORTANT: MOBILE IS NOT TOUCHED
========================================================== */

@media (max-width: 991px) {

    .shop-sidebar {
        position: static;
        width: 100%;
        height: auto;
    }

    .shop-filter-sidebar {
        height: auto;
        max-height: none;
        overflow: visible;
    }

}