/* ============================================================
   NIJEE DESKTOP V5
   Target-locked marketplace desktop shell
   ============================================================ */

@media (max-width: 1199px) {

    .nijee-desktop-v5,
    .nijee-v5-sidebar {
        display: none !important;
    }

}


@media (min-width: 1200px) {

    .nijee-desktop-v5 {
        position: relative;
        z-index: 900;

        width: 100%;

        background: #ffffff;

        border-bottom: 1px solid #eee9f4;
    }


    .nijee-v5-main-row {
        min-height: 76px;

        display: grid;

        grid-template-columns:
            38px
            178px
            minmax(360px, 1fr)
            132px
            66px
            58px
            66px;

        align-items: center;

        gap: 15px;

        padding:
            8px
            28px;
    }


    .nijee-v5-menu-button {
        width: 34px;
        height: 40px;

        display: flex;

        flex-direction: column;

        align-items: center;
        justify-content: center;

        gap: 5px;

        padding: 0;

        border: 0;

        background: transparent;
    }


    .nijee-v5-menu-button span {
        width: 24px;
        height: 2px;

        display: block;

        border-radius: 20px;

        background: #18162a;
    }


    .nijee-v5-logo {
        display: flex;

        align-items: center;
    }


    .nijee-v5-logo img {
        display: block;

        width: auto;

        max-width: 172px;
        max-height: 58px;

        object-fit: contain;
    }


    .nijee-v5-search {
        height: 50px;

        display: grid;

        grid-template-columns:
            48px
            minmax(0, 1fr)
            155px
            54px;

        align-items: center;

        overflow: hidden;

        border:
            1px solid
            #d9c7e8;

        border-radius: 10px;

        background: #ffffff;
    }


    .nijee-v5-search >
    .fa-magnifying-glass {
        color: #747087;

        font-size: 18px;

        text-align: center;
    }


    .nijee-v5-search input {
        width: 100%;
        height: 100%;

        min-width: 0;

        padding: 0 10px;

        border: 0 !important;

        background: transparent !important;

        color: #201d31;

        font-size: 14px;

        outline: 0 !important;

        box-shadow: none !important;
    }


    .nijee-v5-search select {
        height: 100%;

        padding: 0 13px;

        border: 0;
        border-left: 1px solid #eee8f3;

        background: #ffffff;

        color: #282438;

        font-size: 13px;

        outline: 0;
    }


    .nijee-v5-search button {
        height: 100%;

        border: 0;

        background:
            linear-gradient(
                135deg,
                #7c1fd1,
                #ec168c
            );

        color: #ffffff;

        font-size: 18px;
    }


    .nijee-v5-delivery {
        display: grid;

        grid-template-columns:
            28px
            minmax(0, 1fr)
            16px;

        align-items: center;

        gap: 5px;

        color: #211d30 !important;

        text-decoration: none !important;
    }


    .nijee-v5-delivery >
    .fa-location-dot {
        color: #9b16df;

        font-size: 22px;
    }


    .nijee-v5-delivery span {
        min-width: 0;

        display: flex;

        flex-direction: column;
    }


    .nijee-v5-delivery small {
        color: #777186;

        font-size: 10px;
    }


    .nijee-v5-delivery strong {
        overflow: hidden;

        font-size: 12px;

        white-space: nowrap;

        text-overflow: ellipsis;
    }


    .nijee-v5-action {
        display: flex;

        flex-direction: column;

        align-items: center;

        justify-content: center;

        gap: 4px;

        color: #211c31 !important;

        font-size: 10px;

        text-decoration: none !important;
    }


    .nijee-v5-icon {
        position: relative;

        min-width: 32px;
        height: 28px;

        display: flex;

        align-items: center;

        justify-content: center;

        color: #c715c9;

        font-size: 23px;
    }


    .nijee-v5-count {
        position: absolute;

        top: -8px;
        right: -5px;

        min-width: 18px;
        height: 18px;

        display: flex;

        align-items: center;
        justify-content: center;

        padding: 0 4px;

        border: 2px solid #ffffff;

        border-radius: 999px;

        background: #ff3b4f;

        color: #ffffff;

        font-size: 9px;

        font-weight: 800;
    }


    .nijee-v5-sub-row {
        min-height: 44px;

        display: flex;

        align-items: center;

        gap: 36px;

        padding:
            0
            28px;

        border-top:
            1px solid
            #f3eff6;

        background: #ffffff;
    }


    .nijee-v5-sub-row a,
    .nijee-v5-all-categories {
        color: #282339 !important;

        font-size: 12px;

        font-weight: 600;

        text-decoration: none !important;
    }


    .nijee-v5-all-categories {
        min-height: 34px;

        display: inline-flex;

        align-items: center;

        gap: 9px;

        padding:
            7px
            18px;

        border: 0;

        border-radius: 7px;

        background:
            linear-gradient(
                135deg,
                #741ccc,
                #a71ee0
            );

        color: #ffffff !important;
    }


    .nijee-v5-sidebar {
        position: fixed;

        top: 120px;
        bottom: 0;
        left: 0;

        z-index: 750;

        width: 246px;

        flex-direction: column;

        gap: 2px;

        overflow-y: auto;

        padding:
            15px
            14px
            25px;

        border-right:
            1px solid
            #eee9f4;

        background:
            #ffffff;

        scrollbar-width: thin;
    }


    .nijee-v5-sidebar-title {
        margin-bottom: 8px;

        padding:
            4px
            10px;

        color: #777186;

        font-size: 11px;

        font-weight: 700;

        text-transform: uppercase;

        letter-spacing: .06em;
    }


    .nijee-v5-sidebar-item {
        min-height: 47px;

        display: grid;

        grid-template-columns:
            30px
            minmax(0, 1fr)
            12px;

        align-items: center;

        gap: 8px;

        padding:
            7px
            10px;

        border-radius: 8px;

        color: #2b2639 !important;

        font-size: 12px;

        font-weight: 600;

        text-decoration: none !important;
    }


    .nijee-v5-sidebar-item:hover,
    .nijee-v5-sidebar-item.is-active {
        background:
            linear-gradient(
                90deg,
                #faf2ff,
                #fff6fb
            );

        color: #861bd6 !important;
    }


    .nijee-v5-sidebar-dot {
        width: 27px;
        height: 27px;

        display: flex;

        align-items: center;
        justify-content: center;

        border-radius: 50%;

        background: #f5eef9;

        color: #8d1bd9;

        font-size: 12px;

        font-weight: 800;
    }


    .nijee-v5-sidebar-item >
    .fa-chevron-right {
        color: #847d91;

        font-size: 10px;
    }


    .nijee-v5-see-all {
        min-height: 40px;

        display: flex;

        align-items: center;
        justify-content: center;

        margin-top: 8px;

        border:
            1px solid
            #a928dc;

        border-radius: 7px;

        color: #8120bd !important;

        font-size: 12px;

        font-weight: 700;

        text-decoration: none !important;
    }


    /*
     * Hide old desktop header visually.
     * Mobile V4 remains untouched.
     */

    .nijee-main-header
    .container.d-none.d-xl-block,

    .header-bottom
    .top-menu-categories-cont
    .d-none.d-xl-flex {

        display: none !important;
    }

}

/* =========================================================
   NIJEE DESKTOP V5 — STEP 2 LAYOUT OWNERSHIP FIX
   One sidebar only: .nijee-v5-sidebar
========================================================= */

@media (min-width: 1200px) {

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

    /* V5 sidebar owns the desktop left rail */
    .nijee-v5-sidebar {
        width: 246px !important;
    }

    /* Main page now uses full desktop width */
    body .main {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        overflow: visible !important;
    }

    /* Homepage old desktop sidebar must not render */
    body .main .nijee-desktop-sidebar {
        display: none !important;
    }

    /* Remove old two-column homepage grid behavior */
    body .main .nijee-desktop-home-layout,
    body .main .nijee-desktop-home-shell {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Existing homepage main column now owns full available width */
    body .main .nijee-desktop-main-column {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Old desktop category navigation in header stays disabled */
    .header-area
    .top-menu-categories-cont {
        display: none !important;
    }

    /* Homepage category strip fills available content width */
    body .main .nijee-final-category-zone {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    body .main .nijee-final-category-zone > .container {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    /* Prevent children from creating page-level horizontal overflow */
    body .main img {
        max-width: 100%;
    }
}


/* =========================================================
   NIJEE DESKTOP V5 — HIDE MOBILE IMAGE SEARCH FILE INPUT
   Keep mobile image-search functionality untouched
========================================================= */

@media (min-width: 1200px) {

    .nijee-v4-image-input {
        display: none !important;
    }

}


/* =========================================================
   NIJEE — DYNAMIC POPULAR CATEGORIES
========================================================= */

.nijee-popular-categories {
    width: 100%;
    padding: 28px 0 30px;
    background: #ffffff;
    border-top: 1px solid #eeeeee;
}

.nijee-popular-categories-title {
    margin: 0 0 16px;
    color: #222222;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
}

.nijee-popular-categories-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 0;
}

.nijee-popular-categories-links a {
    position: relative;
    display: inline-block;
    padding: 0 10px;
    color: #555555;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.5;
    text-decoration: none;
}

.nijee-popular-categories-links a:first-child {
    padding-left: 0;
}

.nijee-popular-categories-links a:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 3px;
    right: 0;
    width: 1px;
    height: 14px;
    background: #d8d8d8;
}

.nijee-popular-categories-links a:hover {
    color: #8219d6;
    text-decoration: underline;
}

@media (max-width: 767px) {

    .nijee-popular-categories {
        padding: 22px 0 24px;
    }

    .nijee-popular-categories-title {
        margin-bottom: 14px;
        font-size: 18px;
    }

    .nijee-popular-categories-links a {
        padding-left: 8px;
        padding-right: 8px;
        font-size: 12px;
    }

}


/* =========================================================
   NIJEE DESKTOP V5 SEARCH AUTOCOMPLETE
   Scoped only to visible desktop V5 search
========================================================= */

@media (min-width: 1200px) {

    .nijee-v5-search {
        position: relative;
        overflow: visible;
        z-index: 10000;
    }

    .nijee-v5-search-suggestions {
        position: absolute;
        top: calc(100% + 6px);
        left: 0;
        right: 0;
        z-index: 100000;

        display: none;

        max-height: 420px;
        overflow-y: auto;

        background: #ffffff;
        border: 1px solid #e8e4eb;
        border-radius: 10px;

        box-shadow:
            0 16px 40px
            rgba(24, 17, 42, .16);
    }

    .nijee-v5-search-suggestions.is-open {
        display: block;
    }

    .nijee-v5-search-suggestion-item {
        width: 100%;
        min-height: 46px;

        display: flex;
        align-items: center;
        gap: 11px;

        padding: 10px 16px;

        border: 0;
        border-bottom: 1px solid #f1edf4;
        background: #ffffff;

        color: #242238;
        text-align: left;
        font-size: 14px;

        cursor: pointer;
    }

    .nijee-v5-search-suggestion-item:last-child {
        border-bottom: 0;
    }

    .nijee-v5-search-suggestion-item:hover {
        background: #faf5ff;
        color: #8219d6;
    }

    .nijee-v5-search-suggestion-item i {
        flex: 0 0 auto;
        color: #8219d6;
        font-size: 13px;
    }

    .nijee-v5-search-suggestion-item span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}