/* Reserve document scrollbar space only when the page actually scrolls. */
html { scrollbar-gutter: auto; }

/* Animate live content only: document snapshots hold up input during a page
   swap. The shell stays fully visible, and nothing waits for this reveal. */
@media (prefers-reduced-motion: no-preference) {
    .page-company-app .app-content > .main {
        animation: sovado-main-reveal 90ms ease-out;
    }

    /* Keep the animation name: removing/re-adding it would replay the entry
       effect whenever an in-page dialog closes. Hidden dialogs do not count. */
    .page-company-app .app-content > .main:has(dialog[open], [role="dialog"][aria-modal="true"]:not([hidden]), [data-auto-open-dialog], [data-open-on-load], [data-auto-open-review], [data-dashboard-welcome], [data-voice-intro][data-autoplay="true"]) {
        animation-duration: 0s;
    }
}

@keyframes sovado-main-reveal {
    from { opacity: .94; }
    to { opacity: 1; }
}

.navigation-loader {
    position: fixed;
    z-index: 80;
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    margin: -26px 0 0 -26px;
    border: 1px solid var(--os-color-border, var(--line));
    border-radius: 16px;
    background: var(--os-color-surface-elevated, var(--surface));
    color: var(--os-color-accent-text, var(--brand));
    box-shadow: 0 4px 18px #10182812;
    pointer-events: none;
    animation: sovado-loader-reveal 80ms ease-out;
}

.navigation-loader[hidden] { display: none; }

.navigation-loader-ring {
    width: 24px;
    height: 24px;
    border: 2px solid var(--os-color-border, var(--line));
    border-top-color: currentColor;
    border-right-color: currentColor;
    border-radius: 50%;
    animation: sovado-loader-spin 650ms linear infinite;
}

.navigation-loader-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

@keyframes sovado-loader-reveal {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes sovado-loader-spin {
    to { transform: rotate(360deg); }
}

html.sidebar-transitioning .app-shell {
    transition: grid-template-columns .2s ease;
}

html.sidebar-transitioning .sidebar {
    transition: width .2s ease, padding .2s ease;
}

.nav-item[data-addon-nav] {
    overflow-wrap: anywhere;
}

.sidebar-collapse-toggle {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #fff;
    color: #667085;
    cursor: pointer;
    transition: color .15s ease, background .15s ease, border-color .15s ease;
}

.sidebar-collapse-toggle:hover {
    border-color: #c8d4ea;
    background: #f7f9fc;
    color: var(--brand);
}

.sidebar-expand-icon {
    display: none;
}

.nav-beta-badge {
    margin-left: auto;
    padding: 2px 6px;
    border: 1px solid rgba(165, 180, 252, .28);
    border-radius: 999px;
    background: rgba(99, 102, 241, .2);
    color: #c7d2fe;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .04em;
    line-height: 1.4;
    text-transform: uppercase;
}

.sidebar-group-pinned > summary {
    cursor: default;
    pointer-events: none;
    user-select: none;
}

.sidebar-group-pinned > summary span {
    display: none;
}

.wg-beta-notice {
    display: flex;
    align-items: center;
    gap: 9px;
    width: fit-content;
    margin: 0 0 18px;
    color: #667085;
    font-size: 12px;
}

.wg-beta-notice span {
    padding: 3px 8px;
    border-radius: 999px;
    background: #eef2ff;
    color: #4338ca;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.wg-beta-notice p {
    margin: 0;
}

.sidebar-collapse-toggle:focus-visible,
.nav-item:focus-visible {
    outline: 3px solid #93b4ff;
    outline-offset: 2px;
}

@media (min-width: 981px) {
    html.sidebar-collapsed .app-shell {
        grid-template-columns: 72px minmax(0, 1fr);
    }

    html.sidebar-collapsed .sidebar {
        width: 72px;
        padding: 18px 10px;
        overflow-x: hidden;
    }

    html.sidebar-collapsed .sidebar .brand-mark {
        justify-content: center;
        padding: 0 0 18px;
    }

    html.sidebar-collapsed .sidebar .brand-mark > span:last-child,
    html.sidebar-collapsed .company-switcher,
    html.sidebar-collapsed .nav-label,
    html.sidebar-collapsed .sidebar-group > summary,
    html.sidebar-collapsed .sidebar-subscription {
        display: none;
    }

    html.sidebar-collapsed .sidebar-navigation {
        gap: 2px;
        margin-top: 0;
    }

    html.sidebar-collapsed .sidebar-group {
        padding: 0;
        border: 0;
    }

    html.sidebar-collapsed details.sidebar-group:not([open]) > div,
    html.sidebar-collapsed .sidebar-group > div {
        display: grid;
        gap: 2px;
        padding: 0;
    }

    html.sidebar-collapsed .nav-item {
        width: 44px;
        min-height: 42px;
        justify-content: center;
        gap: 0;
        margin: 0 auto;
        padding: 0;
        font-size: 0;
    }

    html.sidebar-collapsed .nav-item .nav-icon {
        width: auto;
        font-size: 15px;
    }

    html.sidebar-collapsed .nav-beta-badge {
        display: none;
    }

    html.sidebar-collapsed .nav-item.active {
        background: #ffffff18;
        box-shadow: inset 3px 0 0 #7da2ff;
    }

    html.sidebar-collapsed .sidebar-collapse-icon {
        display: none;
    }

    html.sidebar-collapsed .sidebar-expand-icon {
        display: inline;
    }

}

@media (max-width: 980px) {
    /* The shared toolbar (90) and its menus (95) stay behind the open drawer. */
    .page-company-app .mobile-menu-backdrop {
        z-index: 99;
    }

    .page-company-app .sidebar {
        z-index: 100;
    }

    .sidebar-collapse-toggle {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .navigation-loader,
    .navigation-loader-ring {
        animation: none;
    }

    html.sidebar-transitioning .app-shell,
    html.sidebar-transitioning .sidebar,
    .sidebar-collapse-toggle {
        transition: none;
    }
}
.nav-item.is-locked{color:#98a2b3}.nav-item.is-locked:hover{color:#475467;background:#f8fafc}.nav-lock-badge{display:inline-grid;place-items:center;margin-left:auto;color:#98a2b3;font-size:10px}.nav-item.is-locked .nav-icon{color:#98a2b3}

.page-company-app .settings-subnav .settings-subnav-logout button {
    appearance: none;
    border-color: var(--os-color-border);
    background: transparent;
    color: var(--os-color-text-secondary);
}

.page-company-app .settings-subnav .settings-subnav-logout button :is(i, span) {
    color: inherit;
}

.page-company-app .settings-subnav .settings-subnav-logout button:is(:hover, :focus-visible) {
    background: var(--os-color-danger-soft);
    color: var(--os-color-danger);
}
