.ev-side {
    padding-top: 58px;
    transition: width 180ms ease, padding 180ms ease;
}

.ev-side__toggle {
    position: absolute;
    top: 14px;
    right: 12px;
    z-index: 20;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border: 1px solid var(--ev-line-2);
    border-radius: 9px;
    background: var(--ev-inset);
    color: var(--ev-ink-2);
    box-shadow: 0 4px 12px -8px rgba(20, 40, 90, 0.45);
    cursor: pointer;
    transition: color 150ms ease, background 150ms ease, border-color 150ms ease, transform 150ms ease;
}

.ev-side__toggle:hover,
.ev-side__toggle:focus-visible {
    color: var(--ev-accent);
    border-color: var(--ev-accent);
    background: var(--ev-accent-soft);
    transform: translateY(-1px);
    outline: 3px solid color-mix(in srgb, var(--ev-accent) 38%, transparent);
    outline-offset: 3px;
}

.navbar .logo:focus-visible,
.main-menu > li:focus-visible,
.dropdown-menu li:focus-visible,
.ev-side__link:focus-visible {
    outline: 3px solid var(--ev-accent);
    outline-offset: 3px;
}

.main-menu > li[role="link"],
.navbar .logo[role="link"] {
    cursor: pointer;
}

.main-menu .more-dropdown__trigger {
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    line-height: inherit;
    text-align: inherit;
    cursor: pointer;
    box-shadow: none;
}

.main-menu .more-dropdown__trigger:focus-visible {
    outline: 3px solid var(--ev-accent);
    outline-offset: 5px;
    border-radius: 6px;
}

.ev-side__toggle i {
    transition: transform 180ms ease;
}

.ev-shell.is-side-collapsed .ev-side {
    width: 64px;
    padding: 58px 6px 16px;
    border-right-color: color-mix(in srgb, var(--ev-accent) 12%, var(--ev-line));
    background: color-mix(in srgb, var(--ev-surface) 96%, var(--ev-accent-soft));
}

.ev-shell.is-side-collapsed .ev-side__toggle {
    left: 50%;
    right: auto;
    width: 34px;
    height: 34px;
    transform: translateX(-50%);
    border-color: color-mix(in srgb, var(--ev-accent) 28%, var(--ev-line));
    background: var(--ev-accent-soft);
    color: var(--ev-accent);
    box-shadow: none;
}

.ev-shell.is-side-collapsed .ev-side__toggle:hover,
.ev-shell.is-side-collapsed .ev-side__toggle:focus-visible {
    transform: translateX(-50%) translateY(-1px);
    background: var(--ev-accent);
    color: #fff;
}

.ev-shell.is-side-collapsed .ev-side__toggle i {
    transform: rotate(180deg);
}

.ev-shell.is-side-collapsed .ev-side__sec,
.ev-shell.is-side-collapsed .ev-side__promo {
    display: none;
}

.ev-shell.is-side-collapsed .ev-side__link {
    width: 44px;
    min-height: 40px;
    margin-inline: auto;
    padding: 0;
    justify-content: center;
    gap: 0;
    overflow: hidden;
    font-size: 0;
    border-radius: 10px;
}

.ev-shell.is-side-collapsed .ev-side__link:hover {
    transform: none;
}

.ev-shell.is-side-collapsed .ev-side__link i {
    width: 18px;
    flex: 0 0 18px;
    font-size: 14px;
}

.ev-shell.is-side-collapsed .ev-side__link::before,
.ev-shell.is-side-collapsed .ev-side__link:hover::before,
.ev-shell.is-side-collapsed .ev-side__link.is-active::before {
    display: none;
}

.ev-side__promo-head {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ev-side__status-mark {
    display: grid;
    width: 26px;
    height: 26px;
    place-items: center;
    border-radius: 8px;
    background: var(--ev-accent-soft);
    color: var(--ev-accent);
    font-size: 12px;
    flex: none;
}

.ev-side__promo-head > div {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.ev-side__promo-head > div span {
    color: var(--ev-ink-3);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.ev-side__promo-head > div strong { color: var(--ev-ink); font-size: 12px; }

.ev-side__status-pill {
    margin-left: auto;
    padding: 3px 6px;
    border-radius: 999px;
    background: var(--ev-good-soft);
    color: var(--ev-good);
    font-size: 9px;
    font-weight: 700;
}

.ev-side__status-list {
    display: grid;
    gap: 6px;
    margin-top: 11px;
    padding-top: 9px;
    border-top: 1px solid var(--ev-line);
}

.ev-side__status-list > div { display: flex; justify-content: space-between; gap: 8px; }
.ev-side__status-list span { color: var(--ev-ink-3); font-size: 10px; }
.ev-side__status-list strong { color: var(--ev-ink-2); font-size: 10px; font-weight: 600; }

.ev-side__next > p {
    margin: 10px 0 12px;
    color: var(--ev-ink-3);
    font-size: 10px;
    line-height: 1.45;
}

.ev-side__next-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 34px;
    padding: 8px 10px;
    border: 1px solid color-mix(in srgb, var(--ev-accent) 24%, var(--ev-line));
    border-radius: 9px;
    background: var(--ev-accent-soft);
    color: var(--ev-accent);
    font-size: 10px;
    font-weight: 750;
    text-decoration: none;
}

.ev-side__next-link:hover,
.ev-side__next-link:focus-visible {
    border-color: var(--ev-accent);
    background: color-mix(in srgb, var(--ev-accent) 14%, var(--ev-surface));
    outline: 2px solid color-mix(in srgb, var(--ev-accent) 32%, transparent);
    outline-offset: 2px;
}

.skip-link {
    position: fixed;
    z-index: 5000;
    top: 10px;
    left: 12px;
    padding: 9px 13px;
    border-radius: 8px;
    background: var(--ev-ink);
    color: var(--ev-surface);
    font-size: 12px;
    font-weight: 750;
    text-decoration: none;
    transform: translateY(-150%);
}

.skip-link:focus { transform: translateY(0); }

/* Keep the active rail inside the navigation button instead of on the shell edge. */
.ev-side:not(.is-side-collapsed) .ev-side__link::before,
.ev-side:not(.is-side-collapsed) .ev-side__link:hover::before,
.ev-side:not(.is-side-collapsed) .ev-side__link.is-active::before {
    left: 0;
}

.global-toast-wrap {
    position: fixed;
    top: 86px;
    right: 18px;
    z-index: 3000;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: min(410px, calc(100vw - 24px));
    pointer-events: none;
}

.global-toast {
    --toast-accent: #2563eb;
    --toast-soft: #eff6ff;
    pointer-events: auto;
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) 24px;
    align-items: start;
    gap: 11px;
    border: 1px solid color-mix(in srgb, var(--toast-accent) 25%, var(--ev-line));
    border-left: 4px solid var(--toast-accent);
    border-radius: 12px;
    padding: 13px 12px;
    background: var(--ev-surface);
    color: var(--ev-ink);
    box-shadow: var(--ev-shadow-pop);
    animation: platformToastIn 180ms ease-out;
    transition: opacity 160ms ease, transform 160ms ease;
}

.global-toast--success { --toast-accent: var(--ev-good); --toast-soft: var(--ev-good-soft); }
.global-toast--error { --toast-accent: var(--ev-crit); --toast-soft: var(--ev-crit-soft); }
.global-toast--warning { --toast-accent: var(--ev-warn); --toast-soft: var(--ev-warn-soft); }

.global-toast__icon {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    color: var(--toast-accent);
    background: var(--toast-soft);
}

.global-toast__content,
.global-toast__text,
.global-toast__title {
    display: block;
}

.global-toast__title {
    margin-bottom: 2px;
    font-size: 12px;
    font-weight: 750;
    color: var(--toast-accent);
}

.global-toast__text {
    font-size: 13px;
    line-height: 1.4;
    color: var(--ev-ink-2);
}

.global-toast__close {
    width: 24px;
    height: 24px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--ev-ink-3);
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
}

.global-toast__close:hover,
.global-toast__close:focus-visible {
    background: var(--ev-inset);
    color: var(--ev-ink);
    outline: 3px solid color-mix(in srgb, var(--ev-accent) 38%, transparent);
    outline-offset: 2px;
}

/* P7 accessibility baseline for every control rendered inside the app shell. */
.ev-shell :where(
    a[href],
    button,
    input,
    select,
    textarea,
    summary,
    [role="button"],
    [role="link"],
    [tabindex]:not([tabindex="-1"])
):focus-visible {
    outline: 3px solid color-mix(in srgb, var(--ev-accent) 44%, transparent);
    outline-offset: 3px;
}

.ev-shell :where(
    .ev-hero__title,
    .ev-hero__sub,
    .ev-sec__t,
    .ev-stat__label,
    .ev-table td,
    .ev-empty
) {
    overflow-wrap: anywhere;
}

/* Give the global footer a clear stopping edge against the light canvas. */
:root[data-theme="light"] .ev-footer {
    background: #f8fafc;
    border-top-color: #cbd5e1;
    color: #64748b;
    box-shadow: 0 -8px 20px -20px rgba(15, 23, 42, 0.72);
}

:root[data-theme="light"] .ev-footer .sig {
    color: #526078;
}

@keyframes platformToastIn {
    from { opacity: 0; transform: translateY(-7px) translateX(5px); }
    to { opacity: 1; transform: translateY(0) translateX(0); }
}

@media (max-width: 900px) {
    .ev-side__toggle { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .ev-shell {
        scroll-behavior: auto;
    }

    .ev-shell *,
    .ev-shell *::before,
    .ev-shell *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }

    .ev-side,
    .ev-side__toggle i,
    .main-menu > li,
    .main-menu > li::before,
    .dropdown-menu,
    .global-toast { transition: none; animation: none; }
}

@media (forced-colors: active) {
    .navbar .logo:focus-visible,
    .main-menu > li:focus-visible,
    .dropdown-menu li:focus-visible,
    .more-dropdown__trigger:focus-visible,
    .ev-side__link:focus-visible,
    .ev-side__toggle:focus-visible,
    .ev-shell :where(
        a[href],
        button,
        input,
        select,
        textarea,
        summary,
        [role="button"],
        [role="link"],
        [tabindex]:not([tabindex="-1"])
    ):focus-visible {
        outline-color: Highlight;
    }
}
