/* Solar Linear navigation symbols. Keep the existing 30px slot so
   expanded and collapsed navigation retain their alignment. */
.system-heading-group {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.page .top-row .header-sidebar-toggle {
    --sidebar-toggle-ease: cubic-bezier(.32, .72, 0, 1);
    --sidebar-toggle-spring: linear(0, 0.0941 5.6%, 0.2736 11.1%, 0.4548 16.7%, 0.6076 22.2%, 0.7255 27.8%, 0.8119 33.3%, 0.8732 38.9%, 0.9156 44.4%, 0.9444 50%, 0.9636 55.6%, 0.9764 61.1%, 0.9848 66.7%, 0.9902 72.2%, 0.9938 77.8%, 0.9960 83.3%, 0.9975 88.9%, 0.9984 94.4%, 1 100%);
    display: inline-grid;
    place-items: center;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid #d9e5e7;
    border-radius: 13px;
    background: #ffffff !important;
    color: #0f5965 !important;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(16,24,40,.06), 0 8px 24px rgba(16,24,40,.08);
    transition: transform 587ms var(--sidebar-toggle-ease), background-color 300ms ease, box-shadow 587ms var(--sidebar-toggle-ease);
}

.page .top-row .header-sidebar-toggle:active { transform: scale(.94); transition-duration: 90ms; }

.page .top-row .header-sidebar-toggle:is(.is-active, :hover) {
    background: #ccfbf1 !important;
    border-color: #5eead4 !important;
    color: #064e48 !important;
}

.page .top-row .header-sidebar-toggle:focus-visible {
    outline: 2px solid #0f766e;
    outline-offset: 3px;
}

.header-sidebar-toggle .sidebar-menu-toggle-icon { width: 24px; height: 24px; overflow: visible; }
.header-sidebar-toggle .sidebar-menu-toggle-icon line {
    transform-origin: 12px 12px;
    transition: transform 587ms var(--sidebar-toggle-ease), opacity 200ms ease;
}
.header-sidebar-toggle .sidebar-menu-toggle-icon line:nth-child(1) { transform: translateY(-7px); }
.header-sidebar-toggle .sidebar-menu-toggle-icon line:nth-child(3) { transform: translateY(7px); }
html:not(.sidebar-collapsed) .header-sidebar-toggle .sidebar-menu-toggle-icon line:nth-child(1) { transform: rotate(45deg); }
html:not(.sidebar-collapsed) .header-sidebar-toggle .sidebar-menu-toggle-icon line:nth-child(2) { opacity: 0; transform: scaleX(.2); }
html:not(.sidebar-collapsed) .header-sidebar-toggle .sidebar-menu-toggle-icon line:nth-child(3) { transform: rotate(-45deg); }
@supports (transition-timing-function: linear(0, 1)) {
    .page .top-row .header-sidebar-toggle { --sidebar-toggle-ease: var(--sidebar-toggle-spring); }
}
@media (prefers-reduced-motion: reduce) {
    .page .top-row .header-sidebar-toggle,
    .header-sidebar-toggle .sidebar-menu-toggle-icon line { transition: none; }
    .page .top-row .header-sidebar-toggle:active { transform: none; }
}

html[data-theme="dark"] .page .top-row .header-sidebar-toggle {
    background: #163139 !important;
    border-color: #42616b !important;
    color: #d9f6f2 !important;
}

html[data-theme="dark"] .page .top-row .header-sidebar-toggle:is(.is-active, :hover) {
    background: #21514e !important;
    border-color: #5eead4 !important;
}

/* Pinned state mirrors the sidebar surface in both themes. */
html .page .top-row .header-sidebar-toggle.is-active {
    background: var(--primary, #0f766e) !important;
    border-color: var(--primary, #0f766e) !important;
    color: #ffffff !important;
}

html[data-theme="dark"] .page .top-row .header-sidebar-toggle.is-active {
    background: #14262e !important;
    border-color: #42616b !important;
    color: #ffffff !important;
}

.page-menu-icon {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 48px;
    height: 48px;
    margin-right: 14px;
    vertical-align: middle;
    color: #0f766e;
    background: linear-gradient(145deg, #effaf7, #e1f1ed);
    border: 1px solid #cde5df;
    border-radius: 15px;
    box-shadow: 0 2px 4px rgba(15, 76, 69, .04), inset 0 1px 0 rgba(255, 255, 255, .8);
}

.page-menu-icon-glyph {
    display: block;
    width: 28px;
    height: 28px;
    background-color: currentColor;
    -webkit-mask: var(--page-menu-icon) center / contain no-repeat;
    mask: var(--page-menu-icon) center / contain no-repeat;
}

.hr-tools-dialog-title > .page-menu-icon { margin: 0; }

.page .sidebar .solar-icon-credit {
    margin: 18px 16px 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, .2);
    font-size: 10px;
    line-height: 1.6;
}

.page .sidebar .solar-icon-credit a { color: #d5ece7; text-decoration: none; }
.page .sidebar .solar-icon-credit a:hover { color: #ffffff; text-decoration: underline; text-underline-offset: 3px; }
.page .sidebar .solar-icon-credit a:focus-visible { outline: 2px solid #ffffff; outline-offset: 3px; }
.page .sidebar .solar-icon-credit span { display: block; }

@media (min-width: 641px) {
    html.sidebar-collapsed .page .sidebar .solar-icon-credit { display: none; }
}

html[data-theme="dark"] .page-menu-icon {
    color: #8de0d1;
    background: linear-gradient(145deg, #203e3e, #183232);
    border-color: #355957;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12), inset 0 1px 0 rgba(255, 255, 255, .04);
}

@media screen {
    /* One shared text edge; the icon spans the title and its helper together. */
    .page-heading > div:has(> h1 > .page-menu-icon) {
        --heading-icon-size: 52px;
        display: grid;
        align-content: center;
        position: relative;
        min-height: var(--heading-icon-size);
        min-width: 0;
        padding-left: calc(var(--heading-icon-size) + 14px);
    }

    .page-heading > div:has(> h1 > .page-menu-icon) > h1 {
        position: static;
        margin: 0;
    }

    .page-heading > div:has(> h1 > .page-menu-icon) > p {
        margin: 4px 0 0;
    }

    .page-heading h1 > .page-menu-icon {
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: var(--heading-icon-size);
        height: var(--heading-icon-size);
        margin: 0;
    }
}

@media screen and (max-width: 640px) {
    .page-heading > div:has(> h1 > .page-menu-icon) {
        --heading-icon-size: 44px;
        padding-left: calc(var(--heading-icon-size) + 12px);
    }

    .page-heading h1 > .page-menu-icon { border-radius: 13px; }
    .page-heading .page-menu-icon-glyph { width: 25px; height: 25px; }
}

@media print {
    .page-menu-icon, .header-sidebar-toggle { display: none !important; }
}

@media (max-width: 640px) {
    .system-heading-group { display: contents; }
    .page .top-row .header-sidebar-toggle { display: none; }
}

.page:not(.login-only-layout) .sidebar .nav-icon {
    color: inherit !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    transition: color .18s ease !important;
}

/* Collapsed group entries are divs rather than navigation anchors. */
.page:not(.login-only-layout) .sidebar .nav-collapsed-category-icon > .nav-link {
    color: #ffffff !important;
}

/* Compact menu control, with a tinted pressed state for pinned navigation. */
.page:not(.login-only-layout) .sidebar .sidebar-lock-button {
    width: 32px !important;
    height: 32px !important;
    flex-basis: 32px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    color: #0f5965 !important;
    border: 1px solid rgba(255, 255, 255, .7) !important;
    box-shadow: none !important;
}

.page:not(.login-only-layout) .sidebar .sidebar-lock-button:not(.is-active):not(:hover):not(:focus-visible) {
    color: #0f5965 !important;
    border-color: rgba(255, 255, 255, .7) !important;
}

.page:not(.login-only-layout) .sidebar .sidebar-lock-button:is(.is-active, :hover, :focus-visible) {
    color: #064e48 !important;
    background: #ccfbf1 !important;
    border-color: #5eead4 !important;
}

.page:not(.login-only-layout) .sidebar .sidebar-menu-toggle-icon {
    width: 20px;
    height: 20px;
    display: block;
}

.page:not(.login-only-layout) .sidebar .sidebar-lock-button .lucide-icon {
    color: inherit !important;
    opacity: 1;
}

.page:not(.login-only-layout) .sidebar .sidebar-lock-button:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 2px;
}

/* Do not replace the pending-navigation spinner. */
.page:not(.login-only-layout) .sidebar .nav-link:not([data-menu-loading="true"]) .nav-icon::before,
.page:not(.login-only-layout) .sidebar .nav-reports-toggle .nav-icon::before {
    width: 22px;
    height: 22px;
    background-color: currentColor;
    -webkit-mask-image: var(--sidebar-menu-icon);
    mask-image: var(--sidebar-menu-icon);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

.sidebar .nav-icon.dashboard { --sidebar-menu-icon: url("../icons/solar/linear/home.svg"); }
.sidebar .nav-icon.employees { --sidebar-menu-icon: url("../icons/solar/linear/people.svg"); }
.sidebar .nav-icon.departments { --sidebar-menu-icon: url("../icons/solar/linear/building.svg"); }
.sidebar .nav-icon.positions { --sidebar-menu-icon: url("../icons/solar/linear/briefcase.svg"); }
.sidebar .nav-icon.recruitment { --sidebar-menu-icon: url("../icons/solar/linear/recruitment.svg"); }
.sidebar .nav-icon.salary { --sidebar-menu-icon: url("../icons/solar/linear/coins.svg"); }
.sidebar .nav-icon.organizational-structure { --sidebar-menu-icon: url("../icons/solar/linear/hierarchy.svg"); }
.sidebar .nav-icon.leave { --sidebar-menu-icon: url("../icons/solar/linear/calendar-check.svg"); }
.sidebar .nav-icon.leave-request { --sidebar-menu-icon: url("../icons/solar/linear/calendar-check.svg"); }
.sidebar .nav-icon.leave-ledger { --sidebar-menu-icon: url("../icons/solar/linear/clock.svg"); }
.sidebar .nav-icon.coc-cto { --sidebar-menu-icon: url("../icons/solar/linear/clock.svg"); }
.sidebar .nav-icon.reports { --sidebar-menu-icon: url("../icons/solar/linear/files.svg"); }
.sidebar .nav-icon.personnel-records { --sidebar-menu-icon: url("../icons/solar/linear/personnel-file.svg"); }
.sidebar .nav-icon.loyalty-pay { --sidebar-menu-icon: url("../icons/solar/linear/medal.svg"); }
.sidebar .nav-icon.retirement { --sidebar-menu-icon: url("../icons/solar/linear/shield-check.svg"); }
.sidebar .nav-icon.step-increment { --sidebar-menu-icon: url("../icons/solar/linear/steps.svg"); }
.sidebar .nav-icon.salary-adjustment { --sidebar-menu-icon: url("../icons/solar/linear/adjustment.svg"); }
.sidebar .nav-icon.contract-staff { --sidebar-menu-icon: url("../icons/solar/linear/badge.svg"); }
.sidebar .nav-icon.contract-reports { --sidebar-menu-icon: url("../icons/solar/linear/files.svg"); }
.sidebar .nav-icon.announcements { --sidebar-menu-icon: url("../icons/solar/linear/megaphone.svg"); }
.sidebar .nav-icon.users { --sidebar-menu-icon: url("../icons/solar/linear/user-settings.svg"); }
.sidebar .nav-icon.signatories { --sidebar-menu-icon: url("../icons/solar/linear/pen.svg"); }
.sidebar .nav-icon.activity-logs { --sidebar-menu-icon: url("../icons/solar/linear/history.svg"); }
.sidebar .nav-icon.devices { --sidebar-menu-icon: url("../icons/solar/linear/devices.svg"); }
.sidebar .nav-icon.signin { --sidebar-menu-icon: url("../icons/solar/linear/signin.svg"); }
.sidebar .nav-icon.signout { --sidebar-menu-icon: url("../icons/solar/linear/signout.svg"); }
.sidebar .nav-icon.hr-chatbot { --sidebar-menu-icon: url("../icons/solar/linear/message-circle.svg"); }