/*
 * STIMULTEAM digital UI layer.
 * Loaded last so the legacy application keeps its structure and behavior
 * while receiving a cohesive, responsive visual system.
 */

:root {
    --st-font-sans: "Manrope", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --st-canvas: #f3f5f8;
    --st-surface: #ffffff;
    --st-surface-raised: #ffffff;
    --st-surface-muted: #f7f8fb;
    --st-surface-hover: #f0f2f7;
    --st-ink: #151b2b;
    --st-ink-soft: #49536a;
    --st-ink-muted: #7a8499;
    --st-line: #dfe3ec;
    --st-line-strong: #cfd5e1;
    --st-sidebar: #ffffff;
    --st-sidebar-raised: #eef4ff;
    --st-sidebar-text: #5d667a;
    --st-sidebar-strong: #1b2233;
    --st-tree-line: #aeb7c7;
    --st-accent-base: #78a5ff;
    --st-accent: #78a5ff;
    --st-accent-fill: #4875c9;
    --st-accent-strong: #416fc5;
    --st-accent-contrast: #ffffff;
    --st-accent-soft: #eaf1ff;
    --st-accent-rgb: 120, 165, 255;
    --st-theme-primary: var(--st-accent);
    --st-theme-purple: var(--st-accent);
    --st-ui-accent: var(--st-accent);
    --st-ui-accent-soft: var(--st-accent-soft);
    --st-success: #168a61;
    --st-warning: #c07816;
    --st-danger: #cc3f50;
    --st-info: #3478c8;
    --st-radius-sm: 10px;
    --st-radius-md: 14px;
    --st-radius-lg: 20px;
    --st-shadow-sm: 0 1px 2px rgba(20, 27, 43, .04), 0 6px 18px rgba(20, 27, 43, .05);
    --st-shadow-md: 0 14px 38px rgba(20, 27, 43, .10);
    --st-shadow-float: 0 20px 60px rgba(10, 16, 31, .18);
    --st-ease-out: cubic-bezier(.23, 1, .32, 1);
    --st-ease-in-out: cubic-bezier(.77, 0, .175, 1);
    --st-navbar-height: 64px;
    --st-sidebar-width: 216px;
    --st-sidebar-collapsed-width: 48px;
    --st-noise-texture: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240' viewBox='0 0 240 240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.34' numOctaves='3' seed='12' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
}

html[data-bs-theme="dark"] {
    --st-canvas: #0b101b;
    --st-surface: #131a28;
    --st-surface-raised: #171f30;
    --st-surface-muted: #1b2435;
    --st-surface-hover: #222d41;
    --st-ink: #edf1f8;
    --st-ink-soft: #b4bed0;
    --st-ink-muted: #8692a8;
    --st-line: #293448;
    --st-line-strong: #38455b;
    --st-sidebar: #080d17;
    --st-sidebar-raised: #141c2d;
    --st-sidebar-text: #9da9c0;
    --st-sidebar-strong: #ffffff;
    --st-tree-line: #45536a;
    --st-accent-base: #6546c7;
    --st-accent: #9b8ade;
    --st-accent-fill: #6546c7;
    --st-accent-strong: #b9aceb;
    --st-accent-contrast: #ffffff;
    --st-accent-soft: rgba(101, 70, 199, .22);
    --st-accent-rgb: 101, 70, 199;
    --st-shadow-sm: 0 1px 2px rgba(0, 0, 0, .18), 0 8px 24px rgba(0, 0, 0, .14);
    --st-shadow-md: 0 16px 42px rgba(0, 0, 0, .30);
    --st-shadow-float: 0 24px 70px rgba(0, 0, 0, .45);
}

html {
    background: var(--st-canvas);
    color-scheme: light;
    scroll-behavior: smooth;
    scrollbar-gutter: stable;
}

html[data-bs-theme="dark"] { color-scheme: dark; }

body,
button,
input,
select,
textarea {
    font-family: var(--st-font-sans);
}

body {
    color: var(--st-ink);
    font-size: 14px;
    font-variation-settings: "wght" 450;
    letter-spacing: -.006em;
}

::selection {
    background: rgba(var(--st-accent-rgb), .2);
    color: var(--st-ink);
}

a {
    color: var(--st-accent);
    text-decoration-thickness: 1px;
    text-underline-offset: .18em;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--st-ink);
    font-family: var(--st-font-sans);
    font-weight: 720;
    letter-spacing: -.035em;
}

h1 { font-size: clamp(1.75rem, 2.1vw, 2.35rem); line-height: 1.08; }
h2 { font-size: clamp(1.2rem, 1.55vw, 1.5rem); line-height: 1.18; }
h3 { font-size: 1.08rem; line-height: 1.25; }

body.site-shell {
    background-color: var(--st-canvas);
    background-image:
        var(--st-noise-texture),
        radial-gradient(circle at 92% -10%, rgba(var(--st-accent-rgb), .10), transparent 38%),
        linear-gradient(145deg, var(--st-canvas), color-mix(in srgb, var(--st-accent) 3%, var(--st-canvas)));
    background-position: center, center, center;
    background-repeat: repeat, no-repeat, no-repeat;
    background-size: 240px 240px, 100% 100%, 100% 100%;
    background-blend-mode: soft-light, normal, normal;
    height: auto !important;
    min-height: 100vh;
    min-height: 100dvh;
}

.site-layout {
    gap: 0;
    min-height: calc(100dvh - var(--st-navbar-height));
    padding: 0;
}

.site-main {
    animation: st-page-enter 240ms var(--st-ease-out) both;
    padding: 28px clamp(22px, 2.5vw, 42px) 52px;
    width: calc(100% - var(--st-sidebar-width));
}

.site-main > .mb-3.mt-3:empty { display: none; }

@keyframes st-page-enter {
    from { opacity: 0; transform: translateY(7px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Top bar */
.site-navbar.top {
    -webkit-backdrop-filter: blur(18px) saturate(130%);
    backdrop-filter: blur(18px) saturate(130%);
    background: color-mix(in srgb, var(--st-canvas) 82%, transparent);
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--st-line) 76%, transparent);
    border-radius: 0;
    box-shadow: none;
    color: var(--st-ink);
    margin: 0;
    min-height: var(--st-navbar-height);
    padding: 8px clamp(14px, 1.6vw, 24px);
    position: sticky !important;
    top: 0;
    isolation: isolate;
    z-index: 1045;
}

@media (min-width: 992px) {
    .site-navbar.top { padding-left: 1px; }
}

html[data-bs-theme="dark"] .site-navbar.top {
    background: color-mix(in srgb, var(--st-canvas) 84%, transparent);
    border-color: var(--st-line);
}

.site-navbar__inner { min-height: 47px; }

.site-brand {
    align-items: center;
    color: var(--st-ink) !important;
    display: inline-flex;
    letter-spacing: -.02em !important;
    margin-left: 4px;
    padding: 0 !important;
    text-decoration: none;
}

.site-brand__word {
    font-size: clamp(1.38rem, 1.6vw, 1.55rem);
    font-weight: 900;
    letter-spacing: -.025em;
    transform-origin: left center;
    transition: letter-spacing 240ms var(--st-ease-out), transform 240ms var(--st-ease-out), color 180ms ease;
}

.site-brand:active .site-brand__word,
.site-brand.is-brand-pressed .site-brand__word {
    transform: scale(.95);
    transition-duration: 90ms;
}

.site-brand__env {
    background: var(--st-accent-soft);
    border: 1px solid rgba(var(--st-accent-rgb), .22);
    border-radius: 999px;
    color: var(--st-accent-strong);
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .09em;
    padding: 5px 7px;
}

.site-navbar__actions { gap: 9px; }

.site-menu-toggle,
.top-action,
.top-user-button,
.sidebar__close {
    background: var(--st-surface-muted);
    border-color: var(--st-line);
    color: var(--st-ink-soft);
    transition: transform 140ms var(--st-ease-out), background-color 180ms ease,
        border-color 180ms ease, color 180ms ease, box-shadow 180ms ease;
}

.site-menu-toggle,
.top-action,
.sidebar__close {
    border-radius: 11px;
    height: 40px;
    min-height: 40px;
    width: 40px;
}

.site-menu-toggle {
    background: var(--st-surface);
    border-color: var(--st-line);
    box-shadow: 0 1px 2px rgba(20, 27, 43, .04);
}

.top-user-button {
    background: var(--st-surface);
    border-color: var(--st-line);
    border-radius: 13px;
    padding: 3px 8px 3px 4px;
}

.top-user {
    border: 2px solid var(--st-surface);
    box-shadow: 0 0 0 1px var(--st-line);
    height: 36px;
    width: 36px;
}

.top-user-copy {
    color: var(--st-ink);
    font-size: .7rem;
    font-weight: 650;
    line-height: 1.28;
}

.top-user-copy span:last-child { color: var(--st-ink-muted); }
.top-action__badge { border-color: var(--st-surface); }

.theme-toggle {
    background: var(--st-surface);
    border-color: var(--st-line);
    box-shadow: none;
    transition: transform 140ms var(--st-ease-out), background-color 180ms ease,
        border-color 180ms ease, box-shadow 180ms ease;
}

.theme-toggle__thumb { transition: transform 220ms var(--st-ease-out), background-color 180ms ease; }

/* Optical correction for the asymmetric Material moon glyph. */
.theme-toggle .theme-toggle__moon { transform: translate(2px, -50%); }

/* Sidebar */
.sidebar {
    --bs-offcanvas-width: var(--st-sidebar-width);
    background: color-mix(in srgb, var(--st-surface) 42%, var(--st-canvas)) !important;
    border: 0 !important;
    border-radius: 0;
    border-right: 1px solid color-mix(in srgb, var(--st-line) 76%, transparent) !important;
    box-shadow: none;
    color: var(--st-sidebar-text);
    flex-basis: var(--st-sidebar-width);
    height: calc(100dvh - var(--st-navbar-height));
    top: var(--st-navbar-height);
    width: var(--st-sidebar-width);
}

.sidebar__body {
    padding: 14px 10px 12px;
    scrollbar-color: var(--st-line-strong) transparent;
}

.sidebar__nav { gap: 5px; }

.sidebar__root {
    border-bottom: 1px solid color-mix(in srgb, var(--st-line) 72%, transparent);
    margin-bottom: 3px !important;
    padding-bottom: 8px !important;
}

.sidebar__process-links + .sidebar__quick-links {
    border-top: 1px solid color-mix(in srgb, var(--st-line) 72%, transparent);
    margin-top: 3px !important;
    padding-top: 8px;
}

.sidebar__root a,
.sidebar__quick-links a,
.sidebar__footer a,
.sidebar .accordion-button {
    border: 1px solid transparent;
    border-radius: 12px !important;
    color: var(--st-sidebar-text) !important;
    font-size: .84rem;
    font-weight: 640;
    gap: 11px;
    min-height: 44px;
    padding: 10px 12px !important;
    transition: transform 150ms var(--st-ease-out), background-color 180ms ease,
        border-color 180ms ease, color 180ms ease;
}

.sidebar__root a .material-icons-outlined,
.sidebar__quick-links a .material-icons-outlined,
.sidebar__footer a .material-icons-outlined,
.sidebar .accordion-button .material-icons-outlined {
    color: var(--st-ink-muted);
    font-size: 20px;
}

.sidebar a.active .material-icons-outlined,
.sidebar a[aria-current="page"] .material-icons-outlined { color: var(--st-accent); }

.sidebar__label {
    max-width: 176px;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: max-width 260ms var(--st-ease-out), opacity 150ms ease;
}

.sidebar .accordion-button::after {
    filter: none;
    opacity: .45;
}

html[data-bs-theme="dark"] .sidebar .accordion-button::after { filter: brightness(0) invert(1); }

.sidebar .accordion-body { padding: 3px 0 4px 18px; }

.sidebar .accordion-body ul { gap: 3px; }

.sidebar .accordion-body a {
    border-left: 1px solid var(--st-line);
    border-radius: 0 9px 9px 0;
    color: var(--st-ink-muted) !important;
    font-size: .77rem;
    min-height: 36px;
    padding: 8px 10px 8px 14px;
}

.sidebar a.active,
.sidebar a[aria-current="page"],
.sidebar .accordion-button:not(.collapsed) {
    background: linear-gradient(90deg, rgba(var(--st-accent-rgb), .13), rgba(var(--st-accent-rgb), .055)) !important;
    border-color: rgba(var(--st-accent-rgb), .13);
    box-shadow: none;
    color: var(--st-sidebar-strong) !important;
}

.sidebar a.active::before,
.sidebar a[aria-current="page"]::before {
    display: none;
}

.sidebar__footer {
    border-color: var(--st-line);
    padding-top: 8px;
}

.sidebar__footer a { font-size: .75rem; }

.sidebar__mobile-header {
    background: var(--st-sidebar);
    border-color: var(--st-line);
    justify-content: space-between;
}

.sidebar__mobile-brand { color: var(--st-sidebar-strong) !important; font-size: .88rem; }
.sidebar .sidebar__mobile-brand,
.sidebar .sidebar__mobile-brand.active,
.sidebar .sidebar__mobile-brand[aria-current="page"] {
    background: transparent !important;
    border-color: transparent !important;
    color: var(--st-sidebar-strong) !important;
}
.sidebar .sidebar__mobile-brand::before { display: none; }

.sidebar__close {
    background: var(--st-surface-muted);
    border-color: var(--st-line);
    color: var(--st-ink);
    flex: 0 0 40px;
    padding: 0;
}

.sidebar__close .material-icons-outlined {
    display: block;
    height: 18px;
    position: relative;
    width: 18px;
    font-size: 0;
}

.sidebar__close .material-icons-outlined::before,
.sidebar__close .material-icons-outlined::after {
    background: currentColor;
    border-radius: 2px;
    content: "";
    height: 2px;
    left: 1px;
    position: absolute;
    top: 8px;
    width: 16px;
}

.sidebar__close .material-icons-outlined::before { transform: rotate(45deg); }
.sidebar__close .material-icons-outlined::after { transform: rotate(-45deg); }

html[data-bs-theme="dark"] .sidebar a.active,
html[data-bs-theme="dark"] .sidebar a[aria-current="page"],
html[data-bs-theme="dark"] .sidebar .accordion-button:not(.collapsed) {
    background: linear-gradient(90deg, rgba(var(--st-accent-rgb), .19), rgba(var(--st-accent-rgb), .07)) !important;
    color: #fff !important;
}

@media (min-width: 992px) {
    .sidebar {
        flex: 0 0 var(--st-sidebar-width);
        overflow: hidden;
        transition: flex-basis 280ms var(--st-ease-out), width 280ms var(--st-ease-out);
    }

    .site-main { transition: width 280ms var(--st-ease-out); }

    html.site-sidebar-collapsed .sidebar {
        --bs-offcanvas-width: var(--st-sidebar-collapsed-width);
        flex-basis: var(--st-sidebar-collapsed-width);
        width: var(--st-sidebar-collapsed-width);
    }

    html.site-sidebar-collapsed .site-main {
        width: calc(100% - var(--st-sidebar-collapsed-width));
    }

    html.site-sidebar-collapsed .sidebar__body { padding-inline: 0; }
    html.site-sidebar-collapsed .sidebar__nav { gap: 7px; }
    html.site-sidebar-collapsed .sidebar__nav::before { display: none; }

    html.site-sidebar-collapsed .sidebar__label {
        max-width: 0;
        opacity: 0;
        pointer-events: none;
        width: auto;
    }

    html.site-sidebar-collapsed .sidebar .accordion-header { display: none; }
    html.site-sidebar-collapsed .sidebar .accordion-collapse {
        display: block !important;
        height: auto !important;
        visibility: visible !important;
    }

    html.site-sidebar-collapsed .sidebar .accordion-body { padding: 0 !important; }
    html.site-sidebar-collapsed .sidebar .accordion-body ul { gap: 7px; }

    html.site-sidebar-collapsed .sidebar__root a,
    html.site-sidebar-collapsed .sidebar__quick-links a,
    html.site-sidebar-collapsed .sidebar__footer a,
    html.site-sidebar-collapsed .sidebar .accordion-body a {
        border-left: 1px solid transparent;
        border-radius: 11px !important;
        gap: 11px;
        justify-content: flex-start;
        min-height: 46px;
        padding: 11px 12px !important;
    }

    html.site-sidebar-collapsed .sidebar__external { display: none; }

    html.site-sidebar-collapsed .sidebar__root a .material-icons-outlined,
    html.site-sidebar-collapsed .sidebar__quick-links a .material-icons-outlined,
    html.site-sidebar-collapsed .sidebar__footer a .material-icons-outlined,
    html.site-sidebar-collapsed .sidebar .accordion-body a .material-icons-outlined {
        flex-basis: 21px;
        font-size: 21px;
        height: 21px;
        width: 21px;
    }

    html.site-sidebar-collapsed .sidebar a:active { transform: scale(.94) !important; }
}

/* Intentional, restrained interaction feedback */
.interaction-ripple { display: none !important; }

:where(.btn, button, .sidebar a, .dropdown-item, .nav-link, .sort-label) {
    transition: transform 140ms var(--st-ease-out), background-color 180ms ease,
        border-color 180ms ease, color 180ms ease, box-shadow 180ms ease,
        opacity 180ms ease;
}

.btn:not(:disabled):active,
button:not(:disabled):active,
.sidebar a:active,
.dropdown-item:active,
.nav-link:active,
.sort-label:active {
    filter: none;
    transform: scale(.975) !important;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    box-shadow: 0 0 0 3px rgba(var(--st-accent-rgb), .24) !important;
    outline: 2px solid transparent !important;
}

/* Buttons */
.btn {
    align-items: center;
    border-radius: 10px;
    display: inline-flex;
    font-size: .78rem;
    font-weight: 680;
    gap: 7px;
    justify-content: center;
    letter-spacing: -.01em;
    min-height: 40px;
    padding: 9px 15px;
}

.btn-sm { min-height: 36px; padding: 7px 12px; }

.btn-purple,
a.btn-purple,
button.btn-purple {
    background: var(--st-accent-fill) !important;
    border-color: var(--st-accent-fill) !important;
    box-shadow: 0 8px 18px rgba(var(--st-accent-rgb), .2);
    color: var(--st-accent-contrast) !important;
}

.btn-primary {
    background: var(--st-accent-fill);
    border-color: var(--st-accent-fill);
    color: var(--st-accent-contrast);
}

.btn-light,
.btn-outline-secondary {
    background: var(--st-surface);
    border-color: var(--st-line-strong);
    color: var(--st-ink-soft);
}

.btn-dark {
    background: #11182a;
    border-color: #11182a;
}

.btn-danger { background: var(--st-danger); border-color: var(--st-danger); }
.btn:disabled, .btn.disabled { box-shadow: none; cursor: not-allowed; opacity: .55; }

/* Page hierarchy */
.breadcrumb {
    align-items: center;
    color: var(--st-ink-muted);
    font-size: .71rem;
    margin: 0 0 14px;
}

.breadcrumb a { color: var(--st-ink-muted); text-decoration: none; }
.breadcrumb-item.active { color: #a1a9b8; }
.breadcrumb-item + .breadcrumb-item::before { color: #b2b9c6; }

.site-main > h1,
.site-main > nav + h1 {
    margin-bottom: 18px !important;
}

.site-main > .d-flex.mb-3.align-items-center {
    align-items: center !important;
    flex-wrap: wrap;
    gap: 9px;
    margin-bottom: 20px !important;
}

.site-main > .d-flex.mb-3.align-items-center > h1 {
    flex: 1 1 100%;
    margin: 0 0 5px !important;
}

.nav_block {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    list-style: none;
    margin: 0 0 0 3px;
    padding: 0;
}

.nav_block li { margin: 0; }

.nav_block a {
    align-items: center;
    background: transparent;
    border: 1px solid var(--st-line);
    border-radius: 10px;
    color: var(--st-ink-soft);
    display: inline-flex;
    font-size: .76rem;
    font-weight: 630;
    min-height: 36px;
    padding: 7px 11px;
    text-decoration: none;
}

/* Cards and data surfaces */
.card {
    background: var(--st-surface);
    border: 1px solid var(--st-line);
    border-radius: var(--st-radius-lg);
    box-shadow: var(--st-shadow-sm);
    color: var(--st-ink);
    overflow: clip;
}

.card-body { padding: clamp(17px, 2vw, 24px); }

.card-header,
.card-footer {
    background: var(--st-surface-muted);
    border-color: var(--st-line);
    padding: 14px 20px;
}

.card-body > .d-flex.justify-content-between.align-items-center {
    align-items: center !important;
    gap: 8px 12px;
}

.card-body > .d-flex.justify-content-between.align-items-center > h2,
.card-body > .d-flex.justify-content-between.align-items-center > h3,
.card-body > .d-flex.justify-content-between.align-items-center > .d-flex:first-child {
    min-width: 0;
}

.card-body > .d-flex.justify-content-between.align-items-center > a,
.card-body > .d-flex.justify-content-between.align-items-center > .d-flex a {
    color: var(--st-ink-soft);
    font-size: .7rem;
    font-weight: 590;
    text-decoration: none;
    white-space: nowrap;
}

.card-body > .d-flex.justify-content-between.align-items-center > a.text-purple {
    color: var(--st-accent) !important;
    font-weight: 680;
}

.badge {
    border-radius: 999px !important;
    font-size: .64rem;
    font-weight: 720;
    letter-spacing: .01em;
    padding: .42em .62em;
}

.bg-purple,
.text-bg-purple { background-color: var(--st-accent-fill) !important; color: var(--st-accent-contrast) !important; }
.text-purple { color: var(--st-accent) !important; }
.text-bg-warning, .bg-warning { background-color: #f0a33a !important; color: #2c1a03 !important; }
.text-bg-success, .bg-success { background-color: var(--st-success) !important; color: #fff !important; }
.text-bg-danger, .bg-danger { background-color: var(--st-danger) !important; color: #fff !important; }

.table-responsive {
    border: 1px solid var(--st-line);
    border-radius: var(--st-radius-md);
    scrollbar-color: var(--st-line-strong) transparent;
}

.card .table-responsive {
    border-left: 0;
    border-radius: 0;
    border-right: 0;
    margin: 16px 0 -8px;
}

.table {
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--st-line);
    --bs-table-color: var(--st-ink-soft);
    color: var(--st-ink-soft);
    font-size: .76rem;
    margin-bottom: 0;
}

.table > :not(caption) > * > * { padding: 12px 11px; vertical-align: middle; }

.table > tbody > tr:first-child > td,
.table > thead > tr > th {
    background: var(--st-surface-muted);
    color: var(--st-ink-muted);
    font-size: .62rem;
    font-weight: 720;
    letter-spacing: .045em;
    line-height: 1.3;
    text-transform: uppercase;
}

.table > tbody > tr:not(:first-child) {
    transition: background-color 160ms ease;
}

.table > tbody > tr:last-child > td { border-bottom: 0; }
.table .stretched-link::after { z-index: 1; }

.st-empty-row td {
    background: var(--st-surface) !important;
    color: var(--st-ink-muted);
    padding: 22px 12px !important;
    text-align: center;
}

.st-empty-state {
    align-items: center;
    display: inline-flex;
    font-size: .72rem;
    gap: 7px;
}

.st-empty-state .material-icons-outlined { font-size: 18px; }

/* Forms */
.form-label,
label:not(.form-check-label) {
    color: var(--st-ink-soft);
    font-size: .74rem;
    font-weight: 650;
}

.form-control,
.form-select,
.input-group-text {
    background-color: var(--st-surface);
    border-color: var(--st-line-strong);
    border-radius: 10px;
    color: var(--st-ink);
    min-height: 44px;
    transition: background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.form-control:focus,
.form-select:focus {
    background: var(--st-surface);
    border-color: rgba(var(--st-accent-rgb), .72);
    box-shadow: 0 0 0 3px rgba(var(--st-accent-rgb), .13);
    color: var(--st-ink);
}

.form-control::placeholder { color: var(--st-ink-muted); opacity: .8; }

.form-check-input:checked {
    background-color: var(--st-accent);
    border-color: var(--st-accent);
}

.form-text { color: var(--st-ink-muted); font-size: .68rem; }

.modal-content,
.dropdown-menu,
.offcanvas,
.accordion-item {
    background: var(--st-surface);
    border-color: var(--st-line);
    color: var(--st-ink);
}

.modal-content { border-radius: var(--st-radius-lg); box-shadow: var(--st-shadow-float); }

.site-notifications,
.site-user-menu,
.dropdown-menu {
    border-radius: 14px;
    box-shadow: var(--st-shadow-md);
}

.dropdown-item { border-radius: 9px; color: var(--st-ink-soft); }

.alert {
    border: 1px solid currentColor;
    border-radius: 12px;
    font-size: .78rem;
}

/* Login */
html:has(body.auth-page) {
    background: #edf2f8;
    scrollbar-gutter: auto;
}

html[data-bs-theme="dark"]:has(body.auth-page) { background: #0b101b; }

body.auth-page,
body.bg-fill.auth-page {
    align-items: stretch;
    background: #edf2f8 !important;
    background-image: none !important;
    display: block;
    min-height: 100dvh;
    padding: clamp(18px, 3.5vw, 54px);
}

html[data-bs-theme="dark"] body.auth-page,
html[data-bs-theme="dark"] body.bg-fill.auth-page {
    background: #0b101b !important;
}

.auth-shell {
    background: var(--st-surface);
    border: 1px solid #d7deea;
    border-radius: 26px;
    box-shadow: 0 28px 75px rgba(32, 45, 68, .14);
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr);
    margin: 0 auto;
    max-width: 1180px;
    min-height: min(760px, calc(100dvh - clamp(36px, 7vw, 108px)));
    overflow: hidden;
    position: relative;
}

html[data-bs-theme="dark"] .auth-shell {
    border-color: #2c3748;
    box-shadow: 0 32px 90px rgba(0, 0, 0, .34);
}

.auth-brand-pane {
    background: #e5edfc;
    color: var(--st-ink);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    padding: clamp(34px, 5vw, 68px);
    position: relative;
}

html[data-bs-theme="dark"] .auth-brand-pane {
    background: #151d2d;
}

.auth-brand-word {
    color: var(--st-ink);
    font-size: clamp(1.55rem, 2.25vw, 2rem);
    font-weight: 900;
    letter-spacing: .045em;
    line-height: 1;
    position: relative;
    z-index: 1;
}

.auth-brand-word--mobile { display: none; }

.auth-brand-copy { max-width: 560px; position: relative; z-index: 1; }

.auth-brand-copy__eyebrow,
.page-eyebrow {
    color: #4e64c8;
    font-size: .65rem;
    font-weight: 780;
    letter-spacing: .14em;
    margin-bottom: 13px;
    text-transform: uppercase;
}

html[data-bs-theme="dark"] .auth-brand-copy__eyebrow { color: #a99cff; }

.auth-brand-copy h2 {
    color: var(--st-ink);
    font-size: clamp(2.35rem, 4.1vw, 4.35rem);
    font-weight: 720;
    letter-spacing: -.055em;
    line-height: 1.02;
    margin: 0 0 24px;
    max-width: 620px;
}

.auth-brand-copy p {
    color: var(--st-ink-muted);
    font-size: clamp(.96rem, 1.4vw, 1.14rem);
    line-height: 1.65;
    margin: 0;
    max-width: 500px;
}

.auth-brand-features {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 28px;
}

.auth-brand-features span {
    background: rgba(255, 255, 255, .48);
    border: 1px solid rgba(72, 88, 124, .16);
    border-radius: 999px;
    color: var(--st-ink-soft);
    font-size: .66rem;
    font-weight: 650;
    letter-spacing: .025em;
    padding: 8px 11px;
}

html[data-bs-theme="dark"] .auth-brand-features span {
    background: rgba(255, 255, 255, .035);
    border-color: rgba(255, 255, 255, .11);
}

.auth-brand-footer {
    color: var(--st-ink-muted);
    font-size: .66rem;
    letter-spacing: .04em;
    position: relative;
    z-index: 1;
}

.auth-form-pane {
    background: var(--st-surface);
    display: flex;
    flex-direction: column;
    padding: clamp(24px, 3vw, 38px) clamp(32px, 5vw, 76px) clamp(32px, 5vw, 76px);
}

.auth-form-toolbar {
    align-items: center;
    display: flex;
    justify-content: flex-end;
    min-height: 32px;
    width: 100%;
}

.auth-theme-control {
    align-items: center;
    color: var(--st-ink-muted);
    display: flex;
    font-size: .68rem;
    font-weight: 650;
    gap: 10px;
}

.auth-form-stage {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    justify-content: center;
    padding-top: 26px;
    width: 100%;
}

.auth-card { max-width: 410px; width: 100%; }

.auth-card__status {
    align-items: center;
    color: var(--st-ink-muted);
    display: flex;
    font-size: .67rem;
    font-weight: 650;
    gap: 7px;
    margin-bottom: 24px;
}

.auth-card__status::before {
    background: #33b780;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(51, 183, 128, .12);
    content: "";
    height: 7px;
    width: 7px;
}

.auth-card h1 {
    font-size: clamp(1.75rem, 3vw, 2.25rem);
    margin: 0 0 8px !important;
}

.auth-card__intro {
    color: var(--st-ink-muted);
    line-height: 1.55;
    margin: 0 0 28px;
}

.auth-card .form-floating { margin-bottom: 14px !important; }

.auth-card .form-floating > .form-control {
    border-radius: 12px;
    min-height: 54px;
    padding-left: 16px;
}

.auth-card .form-floating > label { color: var(--st-ink-muted); padding-left: 16px; }

.auth-card .btn-purple {
    font-size: .8rem;
    min-height: 50px;
    width: 100%;
}

.auth-card__actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.auth-card__actions a {
    font-size: .73rem;
    font-weight: 640;
    text-decoration: none;
}

.auth-card__actions--restore { align-items: flex-start; }

.auth-card__back {
    align-items: center;
    display: inline-flex;
    gap: 6px;
}

.auth-card__back .material-icons-outlined {
    font-size: 16px;
    line-height: 1;
}

.auth-card__secure {
    align-items: center;
    border-top: 1px solid var(--st-line);
    color: var(--st-ink-muted);
    display: flex;
    font-size: .65rem;
    gap: 7px;
    margin-top: 28px;
    padding-top: 18px;
}

.auth-card__secure .material-icons-outlined { font-size: 16px; }

/* Team canvas */
.team-workspace {
    display: grid;
    gap: 16px;
    grid-template-rows: auto minmax(0, 1fr);
    height: calc(100dvh - var(--st-navbar-height) - 60px);
}

.team-structure-heading {
    align-items: flex-end;
    margin: 0;
}

.team-structure-heading__copy { min-width: 0; }
.team-structure-heading h1 { margin: 0 0 7px; }

.team-structure-heading p {
    color: var(--st-ink-muted);
    line-height: 1.55;
    margin: 0;
}

.team-structure-export__button,
.team-structure-export__status { box-shadow: none; }

.team-structure-zoom {
    align-items: center;
    display: flex;
    gap: 4px;
}

.team-structure-zoom button {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 9px;
    color: var(--st-ink-soft);
    display: inline-flex;
    height: 34px;
    justify-content: center;
    min-height: 34px;
    padding: 0;
    width: 34px;
}

.team-structure-zoom button[data-tree-fit] { font-size: .66rem; font-weight: 700; padding: 0 10px; width: auto; }
.team-structure-zoom .material-icons-outlined { font-size: 18px; }

.team-structure-view-shell {
    min-height: 0;
    min-width: 0;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.team-structure-zoom--overlay {
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    background: color-mix(in srgb, var(--st-surface) 68%, transparent);
    border: 1px solid color-mix(in srgb, var(--st-line-strong) 72%, transparent);
    border-radius: 13px;
    bottom: 14px;
    box-shadow: 0 8px 24px rgba(20, 27, 43, .11);
    opacity: .4;
    padding: 4px;
    position: absolute;
    right: 14px;
    transition: opacity 220ms ease, background-color 220ms ease, box-shadow 220ms ease;
    z-index: 4;
}

.team-structure-zoom--overlay:focus-within { opacity: 1; }

.team-structure-view {
    background-color: var(--st-surface);
    border: 1px solid var(--st-line);
    border-radius: var(--st-radius-lg);
    box-shadow: var(--st-shadow-sm);
    cursor: grab;
    height: 100%;
    min-height: 0;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-color: var(--st-line-strong) transparent;
    width: 100%;
}

.team-structure-view.is-dragging { cursor: grabbing; user-select: none; }
.team-structure-view.is-dragging a { pointer-events: none; }
.team-structure-tree { height: 100%; min-height: 100%; }
.team-structure-tree #apexTreeWrapper { min-height: 100%; }
.team-structure-tree svg { display: block; }
.team-structure-tree svg path {
    stroke: var(--st-tree-line) !important;
    stroke-opacity: .92;
    stroke-width: 1.2px !important;
}

.team-structure-tree .user-team-img {
    border: 3px solid var(--st-surface);
    box-shadow: 0 0 0 1px var(--st-line-strong), 0 5px 14px rgba(20, 27, 43, .14);
}

.team-structure-tree .team-node-card {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 4px;
    height: 100%;
    justify-content: center;
    min-width: 0;
    width: 100%;
}

.team-structure-tree .team-employee-link {
    align-items: center;
    border-radius: 14px;
    color: inherit;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 112px;
    padding: 5px 7px;
    text-decoration: none;
    transform-origin: center;
    transition: background-color 180ms ease, box-shadow 180ms ease,
        filter 140ms ease, transform 180ms var(--st-ease-out);
    width: min(100%, 184px);
}

.team-structure-tree .team-employee-link:active {
    filter: saturate(1.08);
    transform: translateY(1px) scale(.955);
    transition-duration: 80ms;
}

.team-structure-tree .team-node-card__copy { min-width: 0; }

.team-structure-tree .user_name { color: var(--st-ink); font-weight: 720; }
.team-structure-tree .post { color: var(--st-ink-soft); }
.team-structure-tree .department { color: var(--st-accent); font-weight: 650; }

.staff-bitrix-link {
    align-items: center;
    background: color-mix(in srgb, var(--st-accent) 9%, var(--st-surface));
    border: 1px solid color-mix(in srgb, var(--st-accent) 24%, var(--st-line));
    border-radius: 11px;
    color: var(--st-accent-strong) !important;
    display: inline-flex;
    font-size: .78rem;
    font-weight: 720;
    gap: 7px;
    min-height: 36px;
    padding: 8px 11px;
    text-decoration: none;
    transition: background-color 180ms ease, border-color 180ms ease,
        box-shadow 180ms ease, transform 160ms var(--st-ease-out);
}

.staff-bitrix-link .material-icons-outlined { font-size: 17px; }

/* The Power of Attorney header follows the active theme accent. */
.poa-page .poa-page-header .poa-header-actions .btn-outline-secondary,
.poa-page .poa-page-header .poa-header-actions .btn-outline-primary {
    border-color: var(--poa-border);
    color: var(--poa-text) !important;
    background: var(--poa-surface);
}

.poa-page .poa-page-header .poa-header-actions .btn-outline-secondary:hover,
.poa-page .poa-page-header .poa-header-actions .btn-outline-secondary:focus,
.poa-page .poa-page-header .poa-header-actions .btn-outline-primary:hover,
.poa-page .poa-page-header .poa-header-actions .btn-outline-primary:focus {
    border-color: var(--st-accent);
    color: var(--st-accent-strong) !important;
    background: var(--poa-surface);
}

html[data-bs-theme="dark"] .poa-page {
    --poa-blue: var(--st-accent);
    --poa-purple: var(--st-accent);
    --poa-hover: rgba(var(--st-accent-rgb), .075);
    --poa-text: var(--st-ink);
    --poa-muted: var(--st-ink-muted);
    --poa-border: var(--st-line);
    --poa-soft: var(--st-surface-muted);
    --poa-surface: var(--st-surface);
    --poa-surface-alt: var(--st-surface-raised);
    --poa-shadow: var(--st-shadow-sm);
}

html[data-bs-theme="dark"] .poa-table-wrap {
    background: var(--poa-surface);
}

html[data-bs-theme="dark"] .poa-table thead th {
    background: var(--st-surface-muted);
    border-color: var(--st-line);
    color: var(--st-ink-muted);
}

html[data-bs-theme="dark"] .poa-table tbody td {
    background-color: transparent;
    border-color: var(--st-line);
    color: var(--st-ink);
}

html[data-bs-theme="dark"] .poa-number-cell a {
    color: var(--st-ink) !important;
}

html[data-bs-theme="dark"] .poa-page .poa-page-header {
    border-color: var(--poa-border);
    background-color: var(--poa-surface);
    background-image:
        var(--st-noise-texture),
        linear-gradient(122deg, var(--poa-surface) 0%, color-mix(in srgb, var(--st-accent) 7%, var(--poa-surface)) 58%, color-mix(in srgb, var(--st-accent) 14%, var(--poa-surface)) 100%);
    background-position: center, center;
    background-repeat: repeat, no-repeat;
    background-size: 220px 220px, 100% 100%;
    background-blend-mode: soft-light, normal;
    box-shadow: 0 16px 38px rgba(0, 0, 0, .24);
}

html[data-bs-theme="dark"] .poa-page .poa-page-header h1 { color: var(--poa-text); }
html[data-bs-theme="dark"] .poa-page .poa-page-header p { color: var(--poa-muted); }
html[data-bs-theme="dark"] .poa-page .poa-page-header .poa-eyebrow { color: var(--st-accent); }

html[data-bs-theme="dark"] .poa-page .poa-page-header .btn-purple,
html[data-bs-theme="dark"] .poa-page .poa-page-header .btn-primary {
    border-color: var(--st-accent) !important;
    color: #fff !important;
    background: var(--st-accent) !important;
}

/* Shared textured banner language for the Power of Attorney flow. */
.poa-page .poa-page-header,
.poa-create .poa-hero,
.poa-create .poa-route-preview,
.poa-page .poa-route-preview {
    background-color: var(--poa-surface, var(--st-surface));
    background-image:
        var(--st-noise-texture),
        linear-gradient(122deg,
            var(--poa-surface, var(--st-surface)) 0%,
            color-mix(in srgb, var(--st-accent) 7%, var(--poa-surface, var(--st-surface))) 58%,
            color-mix(in srgb, var(--st-accent) 14%, var(--poa-surface, var(--st-surface))) 100%);
    background-position: center, center;
    background-repeat: repeat, no-repeat;
    background-size: 220px 220px, 100% 100%;
    background-blend-mode: soft-light, normal;
}

.poa-create .poa-hero {
    border: 1px solid var(--poa-line);
    border-radius: 20px;
    color: var(--poa-ink);
    box-shadow: 0 14px 34px color-mix(in srgb, var(--poa-ink) 9%, transparent);
}

.poa-create .poa-hero::after { display: none; }
.poa-create .poa-hero h1 { color: var(--poa-ink); }
.poa-create .poa-hero p { color: var(--poa-muted); }
.poa-create .poa-hero .poa-eyebrow { color: var(--st-accent-strong); }
.poa-create .poa-draft-badge {
    border-color: color-mix(in srgb, var(--st-accent) 28%, var(--poa-line));
    color: var(--st-accent-strong);
    background: color-mix(in srgb, var(--st-accent) 10%, var(--poa-surface));
}
.poa-create .poa-draft-badge__dot {
    background: var(--st-accent);
    box-shadow: 0 0 0 4px rgba(var(--st-accent-rgb), .13);
}

.poa-create .poa-route-preview,
.poa-page .poa-route-preview {
    align-items: center;
    border: 1px solid color-mix(in srgb, var(--st-accent) 30%, var(--poa-line, var(--st-line)));
    border-radius: 18px;
    display: flex;
    gap: 16px;
    min-height: 112px;
    overflow: hidden;
    padding: 22px 24px;
    position: relative;
    transition: border-color 220ms ease, box-shadow 220ms ease, transform 180ms var(--st-ease-out);
}

.poa-create .poa-route-preview__icon,
.poa-page .poa-route-preview__icon {
    align-items: center;
    background: #5647d7;
    border: 1px solid rgba(255, 255, 255, .38);
    border-radius: 14px;
    box-shadow: 0 9px 20px rgba(54, 43, 155, .28), 0 0 0 1px rgba(54, 43, 155, .18);
    color: #fff;
    display: flex;
    flex: 0 0 50px;
    height: 50px;
    justify-content: center;
    width: 50px;
}

.poa-create .poa-route-preview__icon .material-icons-outlined,
.poa-page .poa-route-preview__icon .material-icons-outlined { color: inherit; font-size: 25px; }
.poa-create .poa-route-preview__copy strong,
.poa-page .poa-route-preview__copy strong { color: var(--st-accent-strong); }

.poa-create .poa-route-preview[data-route="simplified"] .poa-route-preview__icon,
.poa-page .poa-route-preview[data-route="simplified"] .poa-route-preview__icon {
    background: #147a57;
    box-shadow: 0 9px 20px rgba(20, 122, 87, .25), 0 0 0 1px rgba(20, 122, 87, .18);
}

.poa-create .poa-route-preview[data-route="special"] .poa-route-preview__icon,
.poa-page .poa-route-preview[data-route="special"] .poa-route-preview__icon {
    background: #97470f;
    box-shadow: 0 9px 20px rgba(151, 71, 15, .26), 0 0 0 1px rgba(151, 71, 15, .18);
}

.poa-create .poa-route-preview.is-route-changing { animation: poa-route-change 240ms var(--st-ease-out); }

@keyframes poa-route-change {
    0% { transform: scale(.987); }
    55% { transform: scale(1.006); }
    100% { transform: scale(1); }
}

/* Hover only where a precise pointer actually exists */
@media (hover: hover) and (pointer: fine) {
    a:hover { color: var(--st-accent-strong); }

    .site-brand:hover .site-brand__word {
        color: var(--st-accent-strong);
        letter-spacing: -.012em;
        transform: translateY(-1px) scale(1.025);
    }

    .site-menu-toggle:hover,
    .top-action:hover,
    .top-user-button:hover,
    .theme-toggle:hover {
        background: var(--st-surface-hover);
        border-color: var(--st-line-strong);
        box-shadow: none;
        color: var(--st-ink);
        transform: translateY(-1px);
    }

    .sidebar__root a:hover,
    .sidebar__quick-links a:hover,
    .sidebar__footer a:hover,
    .sidebar .accordion-button:hover,
    .sidebar .accordion-body a:hover {
        background: var(--st-surface-hover);
        color: var(--st-sidebar-strong) !important;
        transform: translateX(2px);
    }

    html.site-sidebar-collapsed .sidebar__root a:hover,
    html.site-sidebar-collapsed .sidebar__quick-links a:hover,
    html.site-sidebar-collapsed .sidebar__footer a:hover,
    html.site-sidebar-collapsed .sidebar .accordion-body a:hover {
        transform: translateY(-1px);
    }

    .btn:not(:disabled):hover {
        box-shadow: var(--st-shadow-sm);
        transform: translateY(-1px);
    }

    .btn-purple:not(:disabled):hover {
        background: var(--st-accent-strong) !important;
        border-color: var(--st-accent-strong) !important;
        box-shadow: 0 10px 24px rgba(var(--st-accent-rgb), .26);
    }

    .nav_block a:hover,
    .dropdown-item:hover,
    .team-structure-zoom button:hover {
        background: var(--st-surface-hover);
        border-color: var(--st-line-strong);
        color: var(--st-ink);
    }

    .team-structure-zoom--overlay:hover { opacity: 1; }

    .team-structure-tree .team-employee-link:hover {
        background: color-mix(in srgb, var(--st-accent) 7%, transparent);
        transform: translateY(-1px);
    }

    .team-structure-tree .team-employee-link:active,
    .team-structure-tree .team-employee-link:hover:active {
        filter: saturate(1.08);
        transform: translateY(1px) scale(.955);
        transition-duration: 80ms;
    }

    .staff-bitrix-link:hover {
        background: color-mix(in srgb, var(--st-accent) 15%, var(--st-surface));
        border-color: color-mix(in srgb, var(--st-accent) 42%, var(--st-line));
        box-shadow: 0 8px 20px rgba(var(--st-accent-rgb), .14);
        transform: translateY(-1px);
    }

    .table > tbody > tr:not(:first-child):hover { background: rgba(var(--st-accent-rgb), .045); }
}

/* Responsive behavior */
@media (max-width: 1199.98px) {
    .card-body > .d-flex.justify-content-between.align-items-center {
        align-items: flex-start !important;
        flex-wrap: wrap;
    }

    .card-body > .d-flex.justify-content-between.align-items-center > h2,
    .card-body > .d-flex.justify-content-between.align-items-center > h3,
    .card-body > .d-flex.justify-content-between.align-items-center > .d-flex:first-child {
        flex: 1 1 100%;
    }
}

@media (max-width: 991.98px) {
    :root { --st-navbar-height: 64px; }

    .site-main {
        padding: 22px clamp(14px, 3.5vw, 26px) 42px;
        width: 100%;
    }

    .site-layout {
        gap: 0;
        padding: 0;
    }

    .sidebar {
        border-left: 0 !important;
        border-radius: 0 22px 22px 0;
        background: var(--st-surface) !important;
        box-shadow: 16px 0 42px rgba(20, 27, 43, .16);
        height: 100dvh;
        max-width: min(88vw, 320px);
        top: 0;
        width: min(88vw, 320px);
    }

    body.auth-page,
    body.bg-fill.auth-page { padding: 0; }

    .auth-shell {
        border: 0;
        border-radius: 0;
        display: block;
        max-width: none;
        min-height: 100dvh;
    }

    .auth-brand-pane { display: none; }

    .auth-form-pane {
        min-height: 100dvh;
        padding: 22px clamp(22px, 8vw, 72px) 34px;
    }

    .auth-form-toolbar { justify-content: space-between; }

    .auth-brand-word--mobile {
        display: block;
        font-size: clamp(1.18rem, 3vw, 1.45rem);
    }

    .auth-form-stage {
        align-items: flex-start;
        flex: 0 0 auto;
        padding-top: clamp(62px, 10vh, 84px);
    }

    .auth-card { margin: 0 auto; max-width: 520px; }
}

@media (max-width: 767.98px) {
    body.auth-page,
    body.bg-fill.auth-page { padding: 0; }

    .auth-shell {
        border: 0;
        border-radius: 0;
        display: block;
        max-width: none;
        min-height: 100dvh;
    }

    .auth-brand-pane { display: none; }

    .auth-form-pane {
        min-height: 100dvh;
        padding: 22px clamp(22px, 8vw, 46px) 34px;
    }

    .auth-form-toolbar { justify-content: space-between; }

    .auth-brand-word--mobile {
        display: block;
        font-size: clamp(1.18rem, 5.2vw, 1.38rem);
    }

    .auth-form-stage {
        align-items: flex-start;
        flex: 0 0 auto;
        padding-top: clamp(62px, 10vh, 84px);
    }
    .auth-card { margin: 0; max-width: none; }

    .team-structure-heading { align-items: stretch; gap: 14px; }
    .team-structure-export { justify-content: flex-start; }
    .team-workspace { height: calc(100dvh - var(--st-navbar-height) - 44px); }

    .site-navbar .top-user-copy,
    .site-navbar .top-user-chevron { display: none !important; }

    .site-navbar .top-user {
        flex: 0 0 32px;
        height: 32px;
        width: 32px;
    }
}

@media (max-width: 575.98px) {
    .site-navbar.top {
        border-radius: 0;
        margin: 0;
        min-height: var(--st-navbar-height);
        padding: 8px 10px;
        top: 0;
    }
    .site-navbar__inner { gap: 6px; }
    .site-navbar__start, .site-navbar__actions { gap: 5px; }

    .site-brand { margin-left: 2px; }
    .site-brand__word { font-size: clamp(1.08rem, 4.8vw, 1.18rem); }
    .site-brand__env { font-size: .52rem; padding: 4px 6px; }

    .poa-page .poa-page-header,
    .poa-create .poa-hero,
    .poa-create .poa-route-preview,
    .poa-page .poa-route-preview,
    html[data-bs-theme="dark"] .poa-page .poa-page-header {
        background-size: 180px 180px, 100% 100%;
    }

    .site-menu-toggle,
    .top-action,
    .top-user-button { height: 40px; min-height: 40px; width: 40px; }

    .site-navbar .theme-toggle { height: 30px; width: 48px; }
    .site-main { padding-left: 12px; padding-right: 12px; }

    .site-main > .d-flex.mb-3.align-items-center {
        align-items: stretch !important;
    }

    .site-main > .d-flex.mb-3.align-items-center > div:first-child {
        display: flex;
        flex: 1 1 100%;
        flex-wrap: wrap;
        gap: 7px;
    }

    .site-main > .d-flex.mb-3.align-items-center .btn {
        flex: 1 1 140px;
        margin: 0 !important;
        white-space: nowrap;
    }

    .nav_block { flex: 1 1 100%; margin: 0; }
    .nav_block li { flex: 1 1 130px; }
    .nav_block a { justify-content: center; text-align: center; width: 100%; }

    .card { border-radius: 16px; }
    .card-body { padding: 16px; }

    .card-body > .d-flex.justify-content-between.align-items-center > a,
    .card-body > .d-flex.justify-content-between.align-items-center > .d-flex a {
        background: var(--st-surface-muted);
        border: 1px solid var(--st-line);
        border-radius: 999px;
        padding: 6px 8px;
    }

    .card-body > .d-flex.justify-content-between.align-items-center > .d-flex:first-child {
        align-items: flex-start !important;
        flex-wrap: wrap;
        gap: 7px;
    }

    .card-body > .d-flex.justify-content-between.align-items-center > .d-flex:first-child h2,
    .card-body > .d-flex.justify-content-between.align-items-center > .d-flex:first-child h3 {
        flex: 1 1 calc(100% - 44px);
    }

    .card .table-responsive { margin-left: 0; margin-right: 0; }
    .table-responsive > .table { min-width: 680px; }
    .table > :not(caption) > * > * { padding: 11px 9px; }

    .st-empty-state {
        justify-content: center;
        position: sticky;
        left: 12px;
        width: calc(100vw - 80px);
    }

    .team-structure-zoom--overlay { bottom: 10px; right: 10px; }
}

@media (max-width: 390px) {
    body.site-shell { background-size: 190px 190px, 100% 100%, 100% 100%, 100% 100%; }
    .site-brand__word { font-size: clamp(1.02rem, 4.35vw, 1.08rem); }
    .site-brand__env { display: none; }
    .site-navbar__actions { margin-left: auto; }
    .auth-form-pane { padding-left: 20px; padding-right: 20px; }
    .auth-form-stage { padding-top: clamp(52px, 9vh, 68px); }
}

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

    .site-main { animation: none; }
    .poa-create .poa-route-preview.is-route-changing { animation: none; }
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

/* 2026 dual-theme palette: cloud blue in light mode, muted violet in dark mode. */
:root {
    --st-link: #416fc5;
    --st-status-neutral-bg: #eef1f5;
    --st-status-neutral-text: #596577;
    --st-status-neutral-border: #dce2e9;
    --st-status-review-bg: #fff3dc;
    --st-status-review-text: #846020;
    --st-status-review-border: #f0ddae;
    --st-status-success-bg: #e6f4ed;
    --st-status-success-text: #326f57;
    --st-status-success-border: #c9e5d7;
    --st-status-danger-bg: #f9e9ec;
    --st-status-danger-text: #934a56;
    --st-status-danger-border: #edcdd3;
    --st-status-info-bg: #e7efff;
    --st-status-info-text: #3c659f;
    --st-status-info-border: #cbdafb;
    --st-select-active-text: #315ca8;
    --bs-primary-rgb: 120, 165, 255;
    --bs-link-color: var(--st-link);
    --bs-link-hover-color: #315ca8;
}

html[data-bs-theme="dark"] {
    --st-link: #b9aceb;
    --st-status-neutral-bg: #242c39;
    --st-status-neutral-text: #bcc5d2;
    --st-status-neutral-border: #364151;
    --st-status-review-bg: #3b3122;
    --st-status-review-text: #e4c680;
    --st-status-review-border: #584a30;
    --st-status-success-bg: #1b382f;
    --st-status-success-text: #98d4b9;
    --st-status-success-border: #295444;
    --st-status-danger-bg: #41282e;
    --st-status-danger-text: #e7a7b0;
    --st-status-danger-border: #5d3841;
    --st-status-info-bg: rgba(101, 70, 199, .24);
    --st-status-info-text: #c7bbee;
    --st-status-info-border: rgba(155, 138, 222, .34);
    --st-select-active-text: #c7bbee;
    --bs-primary-rgb: 101, 70, 199;
    --bs-link-color: var(--st-link);
    --bs-link-hover-color: #d0c7f2;
}

a:not(.btn):not(.badge),
.text-purple,
.card-body > .d-flex.justify-content-between.align-items-center > a.text-purple {
    color: var(--st-link) !important;
}

.btn-primary,
.btn-purple,
a.btn-purple,
button.btn-purple,
.poa-page .btn-purple,
.poa-submit-button {
    background: var(--st-accent-fill) !important;
    border-color: var(--st-accent-fill) !important;
    color: var(--st-accent-contrast) !important;
    text-shadow: none !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-purple:hover,
.btn-purple:focus,
.btn-purple:active,
.poa-page .btn-purple:hover,
.poa-page .btn-purple:focus,
.poa-submit-button:hover,
.poa-submit-button:focus {
    background: color-mix(in srgb, var(--st-accent-fill) 86%, var(--st-ink)) !important;
    border-color: color-mix(in srgb, var(--st-accent-fill) 86%, var(--st-ink)) !important;
    color: var(--st-accent-contrast) !important;
}

.btn-outline-primary {
    border-color: var(--st-accent) !important;
    color: var(--st-accent-strong) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    background: var(--st-accent-fill) !important;
    border-color: var(--st-accent-fill) !important;
    color: var(--st-accent-contrast) !important;
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.poa-page .form-control:focus,
.poa-page .form-select:focus {
    border-color: var(--st-accent) !important;
    box-shadow: 0 0 0 .2rem rgba(var(--st-accent-rgb), .16) !important;
}

.form-check-input:checked,
.page-item.active .page-link,
.pagination .active > .page-link {
    background-color: var(--st-accent-fill) !important;
    border-color: var(--st-accent-fill) !important;
    color: var(--st-accent-contrast) !important;
}

/* Pastel status chips keep semantics without neon Bootstrap fills. */
.badge.text-bg-secondary,
.badge.bg-secondary,
.badge.text-bg-light,
.badge.bg-light,
.badge-soft-light {
    background: var(--st-status-neutral-bg) !important;
    border: 1px solid var(--st-status-neutral-border) !important;
    color: var(--st-status-neutral-text) !important;
}

.badge.text-bg-warning,
.badge.bg-warning,
.badge-soft-warning {
    background: var(--st-status-review-bg) !important;
    border: 1px solid var(--st-status-review-border) !important;
    color: var(--st-status-review-text) !important;
}

.badge.text-bg-success,
.badge.bg-success,
.badge-soft-success {
    background: var(--st-status-success-bg) !important;
    border: 1px solid var(--st-status-success-border) !important;
    color: var(--st-status-success-text) !important;
}

.badge.text-bg-danger,
.badge.bg-danger,
.badge-soft-danger {
    background: var(--st-status-danger-bg) !important;
    border: 1px solid var(--st-status-danger-border) !important;
    color: var(--st-status-danger-text) !important;
}

.badge.text-bg-primary,
.badge.bg-primary,
.badge.text-bg-purple,
.badge.bg-purple,
.badge.text-bg-info,
.badge.bg-info,
.badge-soft-primary,
.badge-soft-info {
    background: var(--st-status-info-bg) !important;
    border: 1px solid var(--st-status-info-border) !important;
    color: var(--st-status-info-text) !important;
}

/* Powers of Attorney inherits the site palette instead of carrying a blue-only skin. */
.poa-page,
.poa-create {
    --poa-blue: var(--st-accent);
    --poa-purple: var(--st-accent);
    --poa-primary: var(--st-accent);
    --poa-primary-dark: var(--st-accent-strong);
    --poa-primary-soft: var(--st-accent-soft);
    --poa-route-standard-icon: var(--st-accent-fill);
    --poa-route-standard-text: var(--st-accent-strong);
}

.poa-guide > summary:focus-visible,
.poa-filter-panel > summary:focus-visible,
.poa-choice:has(input:focus-visible) {
    outline-color: rgba(var(--st-accent-rgb), .28) !important;
}

.poa-guide-steps > div > span,
.poa-section-number,
.poa-section__icon,
.poa-context-card__icon,
.poa-representative__avatar,
.poa-summary__route {
    background: var(--st-accent-soft) !important;
    color: var(--st-accent-strong) !important;
}

.poa-dot--blue,
.poa-dot--info,
.poa-dot--purple,
.poa-stepper__item.is-active > span,
.poa-route-preview[data-route="standard"] .poa-route-preview__icon {
    background: var(--st-accent-fill) !important;
}

.poa-stepper__item.is-active > span,
.poa-route-preview[data-route="standard"] .poa-route-preview__icon {
    color: var(--st-accent-contrast) !important;
    box-shadow: 0 7px 16px rgba(var(--st-accent-rgb), .24) !important;
}

.poa-route-preview[data-route="standard"] {
    border-color: color-mix(in srgb, var(--st-accent) 34%, var(--poa-line)) !important;
    background-image: var(--st-noise-texture), linear-gradient(130deg, var(--st-accent-soft), var(--poa-surface)) !important;
}

.poa-status--neutral { background: var(--st-status-neutral-bg) !important; color: var(--st-status-neutral-text) !important; }
.poa-status--warning { background: var(--st-status-review-bg) !important; color: var(--st-status-review-text) !important; }
.poa-status--success { background: var(--st-status-success-bg) !important; color: var(--st-status-success-text) !important; }
.poa-status--danger { background: var(--st-status-danger-bg) !important; color: var(--st-status-danger-text) !important; }
.poa-status--info,
.poa-status--blue,
.poa-status--purple { background: var(--st-status-info-bg) !important; color: var(--st-status-info-text) !important; }

.poa-chain-step--active .poa-chain-marker,
.poa-document-icon,
.poa-current-action > .material-icons-outlined,
.poa-section-heading > div > .material-icons-outlined,
.poa-action-title > .material-icons-outlined {
    border-color: color-mix(in srgb, var(--st-accent) 34%, var(--st-line)) !important;
    color: var(--st-accent-strong) !important;
    background: var(--st-accent-soft) !important;
}

.poa-chain-step--active .poa-chain-marker {
    box-shadow: 0 0 0 4px rgba(var(--st-accent-rgb), .14) !important;
}

.poa-page .poa-page-header .btn-primary,
.poa-page .poa-page-header .btn-purple,
html[data-bs-theme="dark"] .poa-page .poa-page-header .btn-primary,
html[data-bs-theme="dark"] .poa-page .poa-page-header .btn-purple {
    background: var(--st-accent-fill) !important;
    border-color: var(--st-accent-fill) !important;
    color: var(--st-accent-contrast) !important;
}

html[data-bs-theme="dark"] .poa-page,
html[data-bs-theme="dark"] .poa-create {
    --poa-hover: rgba(var(--st-accent-rgb), .12);
    --poa-route-standard-icon: var(--st-accent-fill);
    --poa-route-standard-text: var(--st-accent-strong);
}

html[data-bs-theme="dark"] .poa-route-preview,
html[data-bs-theme="dark"] .poa-page .alert-primary,
html[data-bs-theme="dark"] .poa-page .alert-info,
html[data-bs-theme="dark"] .poa-current-action {
    background-color: color-mix(in srgb, var(--st-accent-base) 14%, var(--st-surface)) !important;
    border-color: color-mix(in srgb, var(--st-accent) 30%, var(--st-line)) !important;
    color: var(--st-ink) !important;
}

html[data-bs-theme="dark"] .poa-table tbody tr:hover,
html[data-bs-theme="dark"] .table {
    --bs-table-hover-bg: rgba(var(--st-accent-rgb), .10);
}

html[data-bs-theme="dark"] .alert-primary {
    background: rgba(var(--st-accent-rgb), .20) !important;
    border-color: rgba(155, 138, 222, .34) !important;
    color: #c7bbee !important;
}

html[data-bs-theme="dark"] .progress-bar.bg-primary,
html[data-bs-theme="dark"] .bg-primary:not(.badge),
html[data-bs-theme="dark"] .text-bg-primary:not(.badge) {
    background-color: var(--st-accent-fill) !important;
    color: var(--st-accent-contrast) !important;
}

html[data-bs-theme="dark"] .poa-page .poa-page-header,
html[data-bs-theme="dark"] .poa-create .poa-hero {
    background-color: color-mix(in srgb, var(--st-accent-base) 16%, var(--st-surface-raised)) !important;
    background-image:
        var(--st-noise-texture),
        radial-gradient(circle at 88% 4%, rgba(var(--st-accent-rgb), .34), transparent 38%),
        radial-gradient(circle at 12% 112%, rgba(155, 138, 222, .12), transparent 42%),
        linear-gradient(122deg,
            color-mix(in srgb, var(--st-accent-base) 16%, var(--st-surface-raised)) 0%,
            color-mix(in srgb, var(--st-accent-base) 30%, var(--st-surface-raised)) 58%,
            color-mix(in srgb, var(--st-accent-base) 42%, var(--st-surface-raised)) 100%) !important;
    background-position: center, center, center, center;
    background-repeat: repeat, no-repeat, no-repeat, no-repeat;
    background-size: 220px 220px, 100% 100%, 100% 100%, 100% 100%;
    background-blend-mode: soft-light, normal, normal, normal;
    border-color: color-mix(in srgb, var(--st-accent) 24%, var(--st-line)) !important;
}

.poa-submit-button,
.poa-route-preview__icon,
.poa-stepper__item.is-active > span {
    box-shadow: 0 8px 18px rgba(var(--st-accent-rgb), .24) !important;
}

/* Header and navigation typography stay neutral; accent marks state and action. */
.site-navbar .site-brand,
.site-navbar .site-brand__word {
    color: var(--st-ink) !important;
}

.sidebar .sidebar__root a,
.sidebar .sidebar__quick-links a,
.sidebar .sidebar__footer a,
.sidebar .accordion-button,
.sidebar .accordion-body a {
    color: var(--st-sidebar-text) !important;
}

.sidebar a.active,
.sidebar a[aria-current="page"],
.sidebar .accordion-button:not(.collapsed) {
    color: var(--st-sidebar-strong) !important;
}

@media (hover: hover) and (pointer: fine) {
    .site-navbar .site-brand:hover .site-brand__word {
        color: var(--st-accent-strong) !important;
    }

    .sidebar .sidebar__root a:hover,
    .sidebar .sidebar__quick-links a:hover,
    .sidebar .sidebar__footer a:hover,
    .sidebar .accordion-button:hover,
    .sidebar .accordion-body a:hover {
        color: var(--st-sidebar-strong) !important;
    }
}

/* Theme-aware custom single-select: the native control remains the form value source. */
.st-select-native {
    clip-path: inset(50%) !important;
    height: 1px !important;
    margin: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    position: absolute !important;
    width: 1px !important;
}

.st-select-trigger {
    align-items: center;
    background: var(--st-surface);
    border: 1px solid var(--st-line-strong);
    border-radius: 12px;
    color: var(--st-ink);
    cursor: pointer;
    display: flex;
    font: inherit;
    gap: 10px;
    justify-content: space-between;
    min-height: 44px;
    padding: 10px 12px;
    text-align: left;
    transition: background-color 180ms ease, border-color 180ms ease,
        box-shadow 180ms ease, transform 160ms var(--st-ease-out);
    width: 100%;
}

.form-floating > .st-select-trigger {
    height: calc(3.5rem + 2px);
    min-height: calc(3.5rem + 2px);
    padding: 1.625rem 2.55rem .625rem .75rem;
}

.st-select-trigger__value {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.st-select-trigger.is-placeholder .st-select-trigger__value { color: var(--st-ink-muted); }

.st-select-trigger__chevron {
    color: var(--st-ink-muted);
    flex: 0 0 20px;
    font-size: 20px !important;
    line-height: 1;
    transition: color 180ms ease, transform 220ms var(--st-ease-out);
}

.st-select-trigger:hover {
    background: color-mix(in srgb, var(--st-accent) 4%, var(--st-surface));
    border-color: color-mix(in srgb, var(--st-accent) 42%, var(--st-line-strong));
}

.st-select-trigger:focus-visible,
.st-select-trigger[aria-expanded="true"] {
    background: var(--st-surface);
    border-color: var(--st-accent);
    box-shadow: 0 0 0 3px rgba(var(--st-accent-rgb), .15) !important;
    outline: 2px solid transparent !important;
}

.st-select-trigger[aria-expanded="true"] .st-select-trigger__chevron {
    color: var(--st-accent-strong);
    transform: rotate(180deg);
}

.st-select-trigger.is-invalid {
    border-color: var(--st-danger) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--st-danger) 13%, transparent) !important;
}

.st-select-trigger:disabled {
    background: var(--st-surface-muted);
    color: var(--st-ink-muted);
    cursor: not-allowed;
    opacity: .68;
}

.st-select-menu {
    background: color-mix(in srgb, var(--st-surface) 98%, transparent);
    border: 1px solid color-mix(in srgb, var(--st-accent) 22%, var(--st-line));
    border-radius: 16px;
    box-shadow: var(--st-shadow-float);
    color: var(--st-ink);
    opacity: 0;
    overflow: hidden;
    padding: 6px;
    pointer-events: none;
    position: fixed;
    transform: translateY(-7px);
    transform-origin: center top;
    transition: opacity 150ms ease, transform 210ms var(--st-ease-out),
        visibility 0s linear 210ms;
    visibility: hidden;
    will-change: opacity, transform;
    z-index: 1095;
}

.st-select-menu[data-placement="top"] {
    transform: translateY(7px);
    transform-origin: center bottom;
}

.st-select-menu.is-open {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
    transition-delay: 0s;
    visibility: visible;
}

.st-select-menu__scroll {
    box-sizing: border-box;
    border-radius: 11px;
    max-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: color-mix(in srgb, var(--st-accent) 50%, var(--st-line-strong)) transparent;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    width: 100%;
}

.st-select-menu__search {
    align-items: center;
    background: color-mix(in srgb, var(--st-accent) 5%, var(--st-surface));
    border: 0;
    border-radius: 11px;
    display: flex;
    gap: 7px;
    margin-bottom: 6px;
    min-height: 42px;
    padding: 0 10px;
}

.st-select-menu__search .material-icons-outlined {
    color: var(--st-accent-strong);
    flex: 0 0 auto;
    font-size: 18px;
}

.st-select-menu__search input {
    appearance: none;
    background: transparent;
    border: 0;
    color: var(--st-ink);
    font: inherit;
    font-size: .8rem;
    min-width: 0;
    outline: 0;
    padding: 9px 0;
    width: 100%;
}

.st-select-menu__search,
.st-select-menu__search:focus-within,
.st-select-menu__search input,
.st-select-menu__search input:focus,
.st-select-menu__search input:focus-visible {
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
}

.st-select-menu__search input::placeholder { color: var(--st-ink-muted); }
.st-select-option[hidden] { display: none; }

/* Accountant cue: payment order explicitly requested by the invoice author. */
.schet-payment-order-required { box-shadow: inset 3px 0 0 var(--st-status-review-text); }
.schet-payment-order-badge {
    align-items: center; background: var(--st-status-review-bg); border: 1px solid var(--st-status-review-border);
    border-radius: 999px; color: var(--st-status-review-text); display: inline-flex; flex: 0 0 auto; font-size: .58rem;
    font-weight: 750; gap: .22rem; line-height: 1.2; margin-left: .45rem; padding: .22rem .42rem; white-space: nowrap;
}
.schet-payment-order-badge .material-icons-outlined { font-size: .8rem; }
.schet-payment-order-alert {
    align-items: flex-start; background: var(--st-status-review-bg); border: 1px solid var(--st-status-review-border);
    border-radius: 13px; color: var(--st-status-review-text); display: flex; gap: .65rem; margin-bottom: 1rem; padding: .8rem .9rem;
}
.schet-payment-order-alert > .material-icons-outlined { font-size: 1.3rem; }
.schet-payment-order-alert strong, .schet-payment-order-alert small { display: block; }
.schet-payment-order-alert strong { font-size: .78rem; }
.schet-payment-order-alert small { color: color-mix(in srgb, var(--st-status-review-text) 78%, var(--st-ink-muted)); font-size: .68rem; margin-top: .15rem; }
.schet-payment-order-alert.is-complete { background: var(--st-status-success-bg); border-color: var(--st-status-success-border); color: var(--st-status-success-text); }
.schet-payment-order-alert.is-complete small { color: color-mix(in srgb, var(--st-status-success-text) 78%, var(--st-ink-muted)); }

@media (max-width: 575.98px) {
    .schet-payment-order-badge { margin: .35rem 0 0; }
}

.st-select-menu__scroll::-webkit-scrollbar { width: 10px; }

.st-select-menu__scroll::-webkit-scrollbar-track {
    background: transparent;
    margin-block: 7px;
}

.st-select-menu__scroll::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--st-accent) 58%, var(--st-line-strong));
    background-clip: content-box;
    border: 2px solid transparent;
    border-radius: 999px;
    min-height: 34px;
}

.st-select-menu__scroll::-webkit-scrollbar-thumb:hover {
    background: color-mix(in srgb, var(--st-accent) 74%, var(--st-line-strong));
    background-clip: content-box;
}

.st-select-menu__group {
    color: var(--st-ink-muted);
    font-size: .65rem;
    font-weight: 760;
    letter-spacing: .055em;
    padding: 9px 10px 5px;
    text-transform: uppercase;
}

.st-select-option {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 11px;
    color: var(--st-ink-soft);
    cursor: pointer;
    display: flex;
    font-family: inherit;
    font-size: .8rem;
    font-weight: 580;
    justify-content: space-between;
    line-height: 1.3;
    min-height: 39px;
    padding: 9px 34px 9px 11px;
    position: relative;
    text-align: left;
    transition: background-color 140ms ease, border-color 140ms ease,
        color 140ms ease, transform 140ms var(--st-ease-out);
    width: 100%;
}

.st-select-option::after {
    color: var(--st-accent-strong);
    content: "check";
    font-family: "Material Icons Outlined";
    font-size: 17px;
    opacity: 0;
    position: absolute;
    right: 10px;
    transform: scale(.72);
    transition: opacity 140ms ease, transform 170ms var(--st-ease-out);
}

.st-select-option:hover,
.st-select-option:focus-visible {
    background: color-mix(in srgb, var(--st-accent) 9%, var(--st-surface));
    border-color: color-mix(in srgb, var(--st-accent) 18%, var(--st-line));
    color: var(--st-ink);
    outline: none;
}

.st-select-option:active { transform: scale(.985); }

.st-select-option.is-selected {
    background: var(--st-accent-soft);
    border-color: color-mix(in srgb, var(--st-accent) 28%, var(--st-line));
    color: var(--st-select-active-text);
    font-weight: 720;
}

.st-select-option.is-selected::after { opacity: 1; transform: scale(1); }

.st-select-option:disabled {
    color: var(--st-ink-muted);
    cursor: not-allowed;
    opacity: .48;
}

/* Slightly stronger light-theme status surfaces for white invoice tables. */
html[data-bs-theme="light"] {
    --st-status-neutral-bg: #e5eaf1;
    --st-status-neutral-text: #465469;
    --st-status-neutral-border: #cbd4e0;
    --st-status-review-bg: #ffebc2;
    --st-status-review-text: #735012;
    --st-status-review-border: #e7ca85;
    --st-status-success-bg: #d9eee3;
    --st-status-success-text: #246047;
    --st-status-success-border: #afd6c3;
    --st-status-danger-bg: #f6dde2;
    --st-status-danger-text: #823b48;
    --st-status-danger-border: #e3b7c0;
    --st-status-info-bg: #dce8ff;
    --st-status-info-text: #31588f;
    --st-status-info-border: #b5caf2;
}

@media (max-width: 575.98px) {
    .st-select-option { min-height: 44px; padding-bottom: 11px; padding-top: 11px; }
    .st-select-menu { border-radius: 15px; padding: 5px; }

    #form .form-group.d-flex.flex-nowrap {
        flex-wrap: wrap !important;
        gap: 8px;
    }

    #form .form-group.d-flex.flex-nowrap > .form-floating.w-75,
    #form .form-group.d-flex.flex-nowrap > .form-floating.w-25 {
        margin-right: 0 !important;
        width: 100% !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .st-select-menu,
    .st-select-trigger__chevron,
    .st-select-option,
    .st-select-option::after { transition-duration: .01ms !important; }
}

/* Theme-accent actions share one tactile gradient and restrained film grain. */
.btn-primary,
.btn-purple,
a.btn-purple,
button.btn-purple,
.poa-page .btn-purple,
.poa-submit-button {
    background-color: var(--st-accent-fill) !important;
    background-image:
        var(--st-noise-texture),
        linear-gradient(135deg, #6592e6 0%, #4f7dd4 54%, #416bbd 100%) !important;
    background-position: center, center !important;
    background-repeat: repeat, no-repeat !important;
    background-size: 180px 180px, 100% 100% !important;
    background-blend-mode: soft-light, normal !important;
    border-color: color-mix(in srgb, var(--st-accent-fill) 82%, var(--st-ink)) !important;
    box-shadow: 0 8px 20px rgba(var(--st-accent-rgb), .22) !important;
    color: #fff !important;
}

html[data-bs-theme="dark"] .btn-primary,
html[data-bs-theme="dark"] .btn-purple,
html[data-bs-theme="dark"] a.btn-purple,
html[data-bs-theme="dark"] button.btn-purple,
html[data-bs-theme="dark"] .poa-page .btn-purple,
html[data-bs-theme="dark"] .poa-submit-button {
    background-image:
        var(--st-noise-texture),
        linear-gradient(135deg, #8169d8 0%, #6b4dca 54%, #573aad 100%) !important;
    border-color: color-mix(in srgb, var(--st-accent) 58%, var(--st-line-strong)) !important;
}

.btn-primary:not(:disabled):hover,
.btn-primary:not(:disabled):focus,
.btn-primary:not(:disabled):active,
.btn-purple:not(:disabled):hover,
.btn-purple:not(:disabled):focus,
.btn-purple:not(:disabled):active,
.poa-page .btn-purple:not(:disabled):hover,
.poa-page .btn-purple:not(:disabled):focus,
.poa-submit-button:not(:disabled):hover,
.poa-submit-button:not(:disabled):focus {
    background-image:
        var(--st-noise-texture),
        linear-gradient(135deg, #74a0ed 0%, #5c87dc 54%, #4974c6 100%) !important;
    box-shadow: 0 11px 26px rgba(var(--st-accent-rgb), .28) !important;
    color: #fff !important;
}

html[data-bs-theme="dark"] .btn-primary:not(:disabled):hover,
html[data-bs-theme="dark"] .btn-primary:not(:disabled):focus,
html[data-bs-theme="dark"] .btn-primary:not(:disabled):active,
html[data-bs-theme="dark"] .btn-purple:not(:disabled):hover,
html[data-bs-theme="dark"] .btn-purple:not(:disabled):focus,
html[data-bs-theme="dark"] .btn-purple:not(:disabled):active,
html[data-bs-theme="dark"] .poa-page .btn-purple:not(:disabled):hover,
html[data-bs-theme="dark"] .poa-page .btn-purple:not(:disabled):focus,
html[data-bs-theme="dark"] .poa-submit-button:not(:disabled):hover,
html[data-bs-theme="dark"] .poa-submit-button:not(:disabled):focus {
    background-image:
        var(--st-noise-texture),
        linear-gradient(135deg, #917ce1 0%, #775bd2 54%, #6244b8 100%) !important;
}

.btn-outline-primary:not(:disabled):hover,
.btn-outline-primary:not(:disabled):focus,
.btn-outline-primary:not(:disabled):active {
    background-color: var(--st-accent-fill) !important;
    background-image:
        var(--st-noise-texture),
        linear-gradient(135deg, #6592e6 0%, #4f7dd4 54%, #416bbd 100%) !important;
    background-position: center, center !important;
    background-repeat: repeat, no-repeat !important;
    background-size: 180px 180px, 100% 100% !important;
    background-blend-mode: soft-light, normal !important;
    color: #fff !important;
}

html[data-bs-theme="dark"] .btn-outline-primary:not(:disabled):hover,
html[data-bs-theme="dark"] .btn-outline-primary:not(:disabled):focus,
html[data-bs-theme="dark"] .btn-outline-primary:not(:disabled):active {
    background-image:
        var(--st-noise-texture),
        linear-gradient(135deg, #8169d8 0%, #6b4dca 54%, #573aad 100%) !important;
}

/* One icon canvas across workflow modules: no baseline nudges or uneven glyph boxes. */
.workflow-page .material-icons-outlined,
.poa-page .material-icons-outlined {
    font-style: normal;
    text-align: center;
    vertical-align: 0 !important;
}

.workflow-page .btn > .material-icons-outlined,
.poa-page .btn > .material-icons-outlined {
    display: inline-grid !important;
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    margin: 0 !important;
    place-items: center;
    position: static;
    font-size: 18px !important;
    line-height: 1 !important;
}

.workflow-guide__icon,
.workflow-guide__chevron,
.workflow-guide__note > .material-icons-outlined,
.workflow-page .st-empty-state > .material-icons-outlined,
.poa-guide-icon,
.poa-guide .poa-chevron,
.poa-filter-panel > summary > .material-icons-outlined,
.poa-guide-note > .material-icons-outlined,
.poa-alert > .material-icons-outlined,
.poa-empty-state > .material-icons-outlined,
.poa-current-action > .material-icons-outlined,
.poa-section-heading > div > .material-icons-outlined,
.poa-action-title > .material-icons-outlined,
.poa-representative-card > .material-icons-outlined,
.poa-document-icon {
    display: grid !important;
    place-items: center;
    line-height: 1 !important;
    text-align: center;
    vertical-align: 0 !important;
}

.workflow-guide__chevron,
.poa-guide .poa-chevron,
.poa-filter-panel > summary > .poa-chevron {
    width: 22px;
    height: 22px;
}

.poa-guide-note > .material-icons-outlined,
.poa-alert > .material-icons-outlined,
.workflow-guide__note > .material-icons-outlined,
.workflow-page .st-empty-state > .material-icons-outlined {
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
}

.poa-page .poa-page-header .poa-header-actions .btn {
    min-height: 40px !important;
    padding: 8px 12px !important;
    border-radius: 10px;
    line-height: 1.2 !important;
}

.poa-page .poa-page-header .poa-header-actions .btn > .material-icons-outlined {
    flex-basis: 18px !important;
    width: 18px !important;
    height: 18px !important;
    font-size: 18px !important;
    line-height: 1 !important;
}

@media (max-width: 767.98px) {
    .poa-page .poa-page-header .poa-header-actions .btn { min-height: 44px !important; }
}

.workflow-page .workflow-hero__actions .btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.poa-page .poa-guide--success > summary > .poa-guide-icon {
    color: var(--st-status-success-text) !important;
    background: color-mix(in srgb, var(--st-status-success-text) 13%, var(--st-status-success-bg)) !important;
}

.poa-page .poa-guide--success > summary .poa-chevron {
    color: var(--st-status-success-text) !important;
}
