/*
   CraftGrid mobile navigation polish
   Presentation-only: keeps module text and drag/favourite/chevron controls
   separated on narrow off-canvas sidebars.
*/

@media (max-width: 991.98px) {
    .craftgrid-mobile-sidebar .erp-sidebar .sidebar-group-toggle {
        column-gap: 6px;
    }

    /* Give the module label a real shrinking width so long names cannot
       occupy the control area. */
    .craftgrid-mobile-sidebar .erp-sidebar .sidebar-group-toggle > .sidebar-link-content {
        flex: 1 1 auto;
        width: 0;
        min-width: 0;
        overflow: hidden;
    }

    .craftgrid-mobile-sidebar .erp-sidebar .sidebar-group-toggle > .sidebar-link-content > span {
        flex: 1 1 auto;
        min-width: 0;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* Keep the drag handle visually separated from a long module name. */
    .craftgrid-mobile-sidebar .erp-sidebar .sidebar-drag-handle {
        flex: 0 0 22px;
        width: 22px;
        min-width: 22px;
        height: 30px;
        margin-left: 3px;
        margin-right: 1px;
    }

    .craftgrid-mobile-sidebar .erp-sidebar .sidebar-favorite-button {
        flex: 0 0 30px;
        width: 30px;
        min-width: 30px;
        margin-left: 2px;
        margin-right: 2px;
    }

    .craftgrid-mobile-sidebar .erp-sidebar .sidebar-chevron {
        flex: 0 0 18px;
        width: 18px;
        min-width: 18px;
        margin-left: 2px;
    }
}

@media (max-width: 575.98px) {
    .craftgrid-mobile-sidebar .erp-sidebar .sidebar-group-toggle {
        padding-left: 10px;
        padding-right: 9px;
        column-gap: 4px;
    }

    .craftgrid-mobile-sidebar .erp-sidebar .sidebar-drag-handle {
        flex-basis: 20px;
        width: 20px;
        min-width: 20px;
        margin-left: 2px;
    }

    .craftgrid-mobile-sidebar .erp-sidebar .sidebar-favorite-button {
        flex-basis: 28px;
        width: 28px;
        min-width: 28px;
    }
}

/* ---------------------------------------------------------
   Mobile shell cleanup
   Keep the global-search trigger behind the Bootstrap offcanvas
   so it cannot visually overlap the mobile navigation header.
   Typography is intentionally mobile-only; desktop remains untouched.
   --------------------------------------------------------- */
@media (max-width: 991.98px) {
    .craftgrid-authenticated-shell .cg-header-global-search {
        z-index: 1030;
    }

    /* The expanded search overlay must still sit above the page content. */
    .craftgrid-authenticated-shell .cg-header-global-search.is-mobile-open {
        z-index: 1200;
    }

    .craftgrid-authenticated-shell .cg-header-global-search.is-mobile-open > .cg-global-search-bar,
    .craftgrid-authenticated-shell .cg-header-global-search.is-mobile-open > .cg-global-search-panel {
        z-index: 1200;
    }

    /* Use the native Windows/SaaS UI face on the narrow sidebar. It reads
       more naturally at touch size than the smaller Inter treatment used
       by the desktop navigation. */
    .craftgrid-authenticated-shell .craftgrid-mobile-sidebar .erp-sidebar,
    .craftgrid-authenticated-shell .craftgrid-mobile-sidebar .erp-sidebar .sidebar-group-toggle,
    .craftgrid-authenticated-shell .craftgrid-mobile-sidebar .erp-sidebar .sidebar-link,
    .craftgrid-authenticated-shell .craftgrid-mobile-sidebar .erp-sidebar .sidebar-submenu-link {
        font-family: "Segoe UI", Roboto, Arial, sans-serif;
    }

    .craftgrid-authenticated-shell .craftgrid-mobile-sidebar .erp-sidebar .sidebar-group-toggle > .sidebar-link-content > span,
    .craftgrid-authenticated-shell .craftgrid-mobile-sidebar .erp-sidebar .sidebar-link > span {
        font-size: 14px;
        line-height: 1.25;
        font-weight: 500;
    }
}

@media (max-width: 575.98px) {
    .craftgrid-authenticated-shell .craftgrid-mobile-sidebar .erp-sidebar .sidebar-group-toggle > .sidebar-link-content > span,
    .craftgrid-authenticated-shell .craftgrid-mobile-sidebar .erp-sidebar .sidebar-link > span {
        font-size: 14px;
    }
}

/* Keep the global search behind Bootstrap modals.
   On narrow viewports the search bar can be expanded to z-index 1200;
   that must not overlap Sales Visit modal headers, timers, or close buttons. */
@media (max-width: 991.98px) {
    body.modal-open .craftgrid-authenticated-shell .cg-header-global-search,
    body.modal-open .craftgrid-authenticated-shell .cg-header-global-search.is-mobile-open {
        z-index: 1030 !important;
    }

    body.modal-open .craftgrid-authenticated-shell .cg-header-global-search.is-mobile-open > .cg-global-search-bar,
    body.modal-open .craftgrid-authenticated-shell .cg-header-global-search.is-mobile-open > .cg-global-search-panel {
        z-index: 1030 !important;
    }
}