/**
 * Header listing search layout — loaded LAST in layouts/frontend.blade.php
 * Theme flex (style.css) + flex quirks fight min-width:0; grid is stable.
 */

@media (min-width: 992px) {
    /* [ All categories (auto) | Search (fills rest) ] */
    .haeder-default .header-left .mainmenu-nav .mainmenu {
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr) !important;
        align-items: center !important;
        width: 100% !important;
        min-width: 0 !important;
        gap: 0 8px;
        flex-wrap: unset !important;
    }

    .haeder-default .header-left .mainmenu-nav .mainmenu > li.with-megamenu {
        flex: unset !important;
        width: auto !important;
        max-width: none !important;
    }

    .haeder-default .header-left .mainmenu-nav .mainmenu > li.sq-mainmenu-search-item {
        flex: unset !important;
        display: flex !important;
        align-items: stretch !important;
        min-width: 0 !important;
        width: 100% !important;
        max-width: none !important;
    }

    .haeder-default .header-left .mainmenu-nav .mainmenu > li.sq-mainmenu-search-item > .sq-header-search-with-icon {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: 100% !important;
        max-width: none !important;
    }

    .haeder-default .header-left .mainmenu-nav .mainmenu > li.sq-mainmenu-search-item .sq-header-search-input-wrap {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
    }
}

/* ID beats stray theme rules on input[type=search] */
#sq-listing-search-input {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* RTL: keep megamenu at outer edge, search still grows — swap columns */
@media (min-width: 992px) {
    [dir="rtl"] .haeder-default .header-left .mainmenu-nav .mainmenu {
        grid-template-columns: minmax(0, 1fr) auto !important;
    }

    [dir="rtl"] .haeder-default .header-left .mainmenu-nav .mainmenu > li.with-megamenu {
        grid-column: 2;
    }

    [dir="rtl"] .haeder-default .header-left .mainmenu-nav .mainmenu > li.sq-mainmenu-search-item {
        grid-column: 1;
    }
}