/* CraftGrid One — final compact shell implementation aligned with the approved mockup.
   Desktop only: shorter header and compact labeled icon rail by default.
   Mobile/off-canvas navigation remains governed by the existing mobile styles. */

@media (min-width: 992px) {
    :root {
        --cg-nav-rail-width: 96px;
        --cg-nav-expanded-width: 252px;
        --cg-nav-top: 60px;
    }

    /* 60px authenticated header: remove Bootstrap's vertical navbar padding,
       otherwise min-height alone still renders a substantially taller bar. */
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .craftgrid-topbar {
        box-sizing: border-box !important;
        height: 60px !important;
        min-height: 60px !important;
        max-height: 60px !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .craftgrid-topbar .container-fluid {
        box-sizing: border-box !important;
        height: 60px !important;
        min-height: 60px !important;
        max-height: 60px !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        align-items: center !important;
    }

    /* No horizontal second navigation row is rendered in this shell. Match the
       content viewport to the shorter header so pages do not lose 16px below. */
    body.craftgrid-authenticated-shell .craftgrid-app-shell {
        height: calc(100vh - 60px) !important;
        height: calc(100dvh - 60px) !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .craftgrid-mobile-menu {
        width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        margin-right: 8px !important;
        border-radius: 10px !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .cg-brand-grid-mark {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        padding: 5px !important;
        border-radius: 9px !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .craftgrid-brand {
        gap: 8px !important;
        align-items: center !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .cg-brand-copy strong {
        font-size: 1.02rem !important;
        line-height: 1.05 !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .cg-brand-copy small {
        font-size: .50rem !important;
        line-height: 1 !important;
        margin-top: 2px !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .cg-trial-header-pill,
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .cg-subscription-badge {
        padding: 4px 8px !important;
        font-size: 10px !important;
        line-height: 1.1 !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .cg-header-global-search {
        margin-left: 4px !important;
        margin-right: 7px !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .cg-header-global-search .cg-global-search-bar {
        min-height: 40px !important;
        height: 40px !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .craftgrid-icon-button {
        width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        padding: 0 !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .craftgrid-user-button {
        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;
        padding: 4px 9px !important;
        gap: 7px !important;
    }

    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .craftgrid-avatar {
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        flex-basis: 30px !important;
    }

    /* Keep the fixed rail directly beneath the shorter header. */
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar {
        top: 60px !important;
    }

    /* The expanded layout is narrower than the legacy panel; text gets more
       room because zero-count badges never occupy a place in the link. */
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar {
        width: 252px !important;
        min-width: 252px !important;
        max-width: 252px !important;
        flex-basis: 252px !important;
    }
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .craftgrid-main-row > main {
        width: calc(100% - 252px) !important;
        max-width: calc(100% - 252px) !important;
        flex-basis: calc(100% - 252px) !important;
        margin-left: 252px !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) {
        font-size: .80rem !important;
        line-height: 1.2 !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }

    /* Controls stay aligned at the right edge of module rows. */
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group-toggle {
        gap: 7px !important;
        padding-left: 9px !important;
        padding-right: 8px !important;
    }
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link-content {
        gap: 8px !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
    }
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-drag-handle {
        margin-left: auto !important;
        flex: 0 0 10px !important;
    }
    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group[data-cg-sortable-module="true"] > .sidebar-group-toggle > .sidebar-favorite-button {
        flex: 0 0 18px !important;
        width: 18px !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Ensure compact labels break at word boundaries instead of splitting
       'Management' or 'Accounting' at arbitrary letters. */
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link-content > span:not(.cg-work-nav-badge) {
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }
}

/* A hidden zero-count reminder badge must remain hidden even when legacy
   expanded-menu CSS applies display:inline-flex !important. */
body.craftgrid-authenticated-shell .desktop-sidebar .cg-work-nav-badge[hidden],
body.craftgrid-authenticated-shell .craftgrid-mobile-sidebar .cg-work-nav-badge[hidden],
html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell .desktop-sidebar .cg-work-nav-badge[hidden] {
    display: none !important;
    visibility: hidden !important;
}

@media (max-width: 991.98px) {
    /* Keep mobile's existing header sizing and drawer behavior intact. */
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .craftgrid-topbar {
        height: auto !important;
        max-height: none !important;
    }
    body.craftgrid-authenticated-shell:not(.craftgrid-login-layout) .craftgrid-topbar .container-fluid {
        height: auto !important;
        max-height: none !important;
    }
}


/* Approved sidebar mockup refinements: wider expanded panel and right-aligned controls. */
@media (min-width: 992px) {
    :root { --cg-nav-expanded-width: 252px; }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group[data-cg-sortable-module="true"] > .sidebar-group-toggle {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 18px 22px 14px !important;
        align-items: center !important;
        column-gap: 7px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group[data-cg-sortable-module="true"] > .sidebar-group-toggle > .sidebar-link-content {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 8px !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group[data-cg-sortable-module="true"] > .sidebar-group-toggle > .sidebar-link-content > i {
        flex: 0 0 22px !important;
        width: 22px !important;
        min-width: 22px !important;
    }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group[data-cg-sortable-module="true"] > .sidebar-group-toggle > .sidebar-link-content > span:not(.cg-work-nav-badge) {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        max-width: 106px !important;
        overflow: hidden !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
        line-height: 1.22 !important;
    }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group[data-cg-sortable-module="true"] > .sidebar-group-toggle > .sidebar-drag-handle {
        justify-self: center !important;
        align-self: center !important;
        width: 18px !important;
        min-width: 18px !important;
        height: 26px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: grab !important;
    }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group[data-cg-sortable-module="true"] > .sidebar-group-toggle > .sidebar-favorite-button {
        justify-self: center !important;
        width: 22px !important;
        min-width: 22px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html.craftgrid-sidebar-expanded body.craftgrid-authenticated-shell:not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group[data-cg-sortable-module="true"] > .sidebar-group-toggle > .sidebar-chevron {
        justify-self: center !important;
        width: 14px !important;
        margin: 0 !important;
    }
}



/* ===============================================================
   Option 1 — Professional Blue active navigation polish
   Fixes active Dashboard contrast in compact and expanded desktop
   navigation: soft blue surface + blue icon/text, same row geometry.
   Mobile/off-canvas styling is intentionally not changed.
   =============================================================== */
@media (min-width: 992px) {
    html body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link.active,
    html 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: #174f8a !important;
        background: #dcecff !important;
        background-image: none !important;
        border: 1px solid rgba(98, 157, 224, .34) !important;
        box-shadow: inset 3px 0 0 #2f80ed, 0 2px 7px rgba(34, 112, 199, .10) !important;
    }

    html body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link.active .sidebar-link-content,
    html 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 .sidebar-link-content,
    html body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link.active .sidebar-link-content > span:not(.cg-work-nav-badge),
    html body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link.active .sidebar-link-content > i,
    html 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 .sidebar-link-content > span:not(.cg-work-nav-badge),
    html 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 .sidebar-link-content > i {
        color: #174f8a !important;
    }

    html body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link.active:hover,
    html 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 {
        color: #123f70 !important;
        background: #cfe3ff !important;
        box-shadow: inset 3px 0 0 #2873d8, 0 3px 8px rgba(34, 112, 199, .13) !important;
    }

    html body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link.active:hover .sidebar-link-content > span:not(.cg-work-nav-badge),
    html body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link.active:hover .sidebar-link-content > i {
        color: #123f70 !important;
    }

    /* Keep module names calm and readable: reserve heavier weights for section headings. */
    html body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-link-content > span:not(.cg-work-nav-badge),
    html body.craftgrid-authenticated-shell:not(.craftgrid-login-layout):not(.craftgrid-subscription-gate-layout) .desktop-sidebar .sidebar-group-toggle .sidebar-link-content > span:not(.cg-work-nav-badge) {
        font-weight: 400 !important;
    }
}
