/*
 * CraftGrid One — persistent desktop icon + label rail.
 * Desktop: compact labelled rail by default; hamburger expands it.
 * Mobile/tablet: existing Bootstrap offcanvas navigation stays unchanged.
 * This file is loaded after legacy theme CSS intentionally.
 */

@media (min-width: 992px) {
    :root {
        --cg-nav-rail-width: 96px;
        --cg-nav-expanded-width: 252px;
        --cg-nav-top: 76px;
        --cg-nav-transition: 220ms cubic-bezier(.2, .75, .25, 1);
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar {
        position: fixed !important;
        top: var(--cg-nav-top) !important;
        right: auto !important;
        bottom: 0 !important;
        left: 0 !important;
        display: block !important;
        box-sizing: border-box !important;
        width: var(--cg-nav-rail-width) !important;
        min-width: var(--cg-nav-rail-width) !important;
        max-width: var(--cg-nav-rail-width) !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        flex: 0 0 var(--cg-nav-rail-width) !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        transform: none !important;
        pointer-events: auto !important;
        z-index: 1040 !important;
        background: #17283d !important;
        border-right: 1px solid rgba(255,255,255,.08) !important;
        box-shadow: 3px 0 14px rgba(12,25,42,.13) !important;
        transition: width var(--cg-nav-transition), min-width var(--cg-nav-transition),
                    max-width var(--cg-nav-transition), flex-basis var(--cg-nav-transition),
                    box-shadow var(--cg-nav-transition) !important;
        will-change: width;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar > .erp-sidebar {
        position: absolute !important;
        inset: 0 !important;
        box-sizing: border-box !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 12px 6px 22px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        scrollbar-color: rgba(255,255,255,.24) transparent;
        background: linear-gradient(180deg, #17283d 0%, #1b3047 100%) !important;
        border: 0 !important;
        box-shadow: none !important;
        pointer-events: auto !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar > .erp-sidebar::-webkit-scrollbar {
        width: 4px;
    }
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar > .erp-sidebar::-webkit-scrollbar-thumb {
        border-radius: 8px;
        background: rgba(255,255,255,.24);
    }

    /* The rail is fixed, so reserve precisely its width in the workspace. */
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .craftgrid-main-row > main {
        box-sizing: border-box !important;
        width: calc(100% - var(--cg-nav-rail-width)) !important;
        min-width: 0 !important;
        max-width: calc(100% - var(--cg-nav-rail-width)) !important;
        flex: 0 0 calc(100% - var(--cg-nav-rail-width)) !important;
        margin-left: var(--cg-nav-rail-width) !important;
        transition: width var(--cg-nav-transition), max-width var(--cg-nav-transition),
                    flex-basis var(--cg-nav-transition), margin-left var(--cg-nav-transition) !important;
    }

    /* Collapsed rail: labels remain visible beneath their module icons. */
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-brand,
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-section-label,
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-subsection-label {
        display: none !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link,
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group-toggle {
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 3px !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 55px !important;
        height: auto !important;
        margin: 0 0 4px !important;
        padding: 6px 2px 5px !important;
        border: 0 !important;
        border-radius: 9px !important;
        text-align: center !important;
        white-space: normal !important;
        cursor: pointer;
        position: relative;
        line-height: 1.05 !important;
        overflow: hidden !important;
        color: #dbe7f5 !important;
        background: transparent;
        text-decoration: none !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link-content {
        box-sizing: border-box !important;
        display: flex !important;
        flex: 1 1 auto !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 3px !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link-content > i {
        display: inline-flex !important;
        flex: 0 0 auto !important;
        align-items: center !important;
        justify-content: center !important;
        width: 24px !important;
        min-width: 24px !important;
        height: 22px !important;
        margin: 0 !important;
        font-size: 1.12rem !important;
        line-height: 1 !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link-content > span:not(.cg-work-nav-badge) {
        display: -webkit-box !important;
        flex: 0 1 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        color: inherit !important;
        font-size: 9px !important;
        font-weight: 650 !important;
        letter-spacing: -.08px !important;
        line-height: 1.12 !important;
        text-align: center !important;
        text-overflow: ellipsis !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
    }

    /* Tiny badges/favorite/reorder controls cannot crowd the narrow rail. */
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-favorite-button,
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-drag-handle,
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .cg-work-nav-badge,
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-chevron {
        display: none !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group {
        display: block !important;
        width: 100% !important;
        margin: 0 0 4px !important;
        padding: 0 !important;
        border: 0 !important;
        overflow: visible !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group-toggle {
        list-style: none !important;
        user-select: none;
    }
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group-toggle::-webkit-details-marker {
        display: none !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group > .sidebar-submenu {
        display: none !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link:hover,
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group-toggle:hover {
        color: #fff !important;
        background: rgba(255,255,255,.085) !important;
        text-decoration: none !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link.active,
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group:has(.sidebar-submenu-link.active) > .sidebar-group-toggle {
        color: #fff !important;
        background: #1769c2 !important;
        box-shadow: inset 0 0 0 1px rgba(255,255,255,.09), 0 3px 9px rgba(0,0,0,.12) !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link.active:hover,
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group:has(.sidebar-submenu-link.active) > .sidebar-group-toggle:hover {
        background: #1d73d2 !important;
    }

    /* Expanded state: full-width navigation, with the page resizing beside it. */
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar {
        width: var(--cg-nav-expanded-width) !important;
        min-width: var(--cg-nav-expanded-width) !important;
        max-width: var(--cg-nav-expanded-width) !important;
        flex-basis: var(--cg-nav-expanded-width) !important;
        box-shadow: 8px 0 24px rgba(12,25,42,.18) !important;
    }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .craftgrid-main-row > main {
        width: calc(100% - var(--cg-nav-expanded-width)) !important;
        max-width: calc(100% - var(--cg-nav-expanded-width)) !important;
        flex-basis: calc(100% - var(--cg-nav-expanded-width)) !important;
        margin-left: var(--cg-nav-expanded-width) !important;
    }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-section-label {
        display: block !important;
        padding: 12px 10px 7px !important;
        color: #90a5bc !important;
        font-size: .66rem !important;
        font-weight: 750 !important;
        letter-spacing: .12em !important;
        line-height: 1.3 !important;
    }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-subsection-label {
        display: block !important;
    }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link,
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group-toggle {
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 10px !important;
        width: 100% !important;
        min-height: 43px !important;
        height: auto !important;
        padding: 9px 10px !important;
        margin: 0 0 3px !important;
        text-align: left !important;
        overflow: visible !important;
    }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link-content {
        flex-direction: row !important;
        justify-content: flex-start !important;
        gap: 10px !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        overflow: visible !important;
    }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link-content > i {
        width: 22px !important;
        min-width: 22px !important;
        height: auto !important;
        font-size: 1rem !important;
    }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link-content > span:not(.cg-work-nav-badge) {
        display: inline !important;
        width: auto !important;
        max-width: 100% !important;
        overflow: visible !important;
        font-size: .83rem !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        text-align: left !important;
        white-space: normal !important;
        text-overflow: clip !important;
        -webkit-line-clamp: unset !important;
        -webkit-box-orient: initial !important;
    }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-chevron {
        display: inline-block !important;
        margin-left: auto !important;
    }
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-favorite-button,
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-drag-handle {
        display: inline-flex !important;
    }
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .cg-work-nav-badge {
        display: inline-flex !important;
    }
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group > .sidebar-submenu {
        display: none !important;
    }
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group[open] > .sidebar-submenu {
        display: block !important;
    }
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group > .sidebar-submenu .sidebar-link {
        min-height: 37px !important;
        padding: 7px 10px 7px 28px !important;
        margin-bottom: 2px !important;
        border-radius: 7px !important;
    }
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group > .sidebar-submenu .sidebar-link-content {
        gap: 8px !important;
    }
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group > .sidebar-submenu .sidebar-link-content > span {
        font-size: .78rem !important;
    }
    html.craftgrid-sidebar-expanded body .craftgrid-sidebar-backdrop {
        display: none !important;
    }
}

@media (max-width: 991.98px) {
    /* Mobile uses #mobileSidebar; never show the desktop rail here. */
    .craftgrid-authenticated-shell .desktop-sidebar {
        display: none !important;
    }
    .craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .craftgrid-main-row > main {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin-left: 0 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .craftgrid-authenticated-shell .desktop-sidebar,
    .craftgrid-authenticated-shell .craftgrid-main-row > main {
        transition: none !important;
    }
}
