:root {
    --brand-900: #0e3b43;
    --brand-700: #16616d;
    --brand-500: #26828f;
    --accent-500: #e89d2c;
    --accent-100: rgba(232, 157, 44, 0.14);
    --surface: #f4f7f8;
    --card: #ffffff;
    --border: #d5e0e3;
    --text: #12333b;
    --muted: #5d7880;
}

[data-theme="dark"] {
    color-scheme: dark;
    --surface: #0d1b24;
    --card: #112234;
    --border: #1c3347;
    --text: #dce8ec;
    --muted: #7a9aaa;
    --accent-100: rgba(232, 157, 44, 0.1);
}

html {
    font-size: 14px;
}

body {
    font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-feature-settings: "rlig" 1, "calt" 1;
    min-height: 100vh;
    color: var(--text);
    background-color: var(--surface);
}

.site-header {
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.navbar-brand {
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--brand-900);
}

.nav-brand-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: var(--brand-700);
    color: #fff;
    flex-shrink: 0;
}

.nav-link {
    color: var(--text);
    font-weight: 500;
}

/* Nav links with icons */
.nav-link-icon {
    display: inline-flex !important;
    align-items: center;
    gap: 5px;
    border-radius: 7px;
    padding: 6px 10px !important;
    font-size: 0.8125rem;
    transition: background 0.12s, color 0.12s;
}
.nav-link-icon:hover {
    background: rgba(22, 97, 109, 0.07);
    color: var(--brand-700) !important;
}
.nav-link-icon.active {
    background: rgba(22, 97, 109, 0.1);
    color: var(--brand-700) !important;
    font-weight: 600;
}
.nav-link-icon svg { flex-shrink: 0; opacity: 0.75; }
.nav-link-icon.active svg { opacity: 1; }

@media (max-width: 1199px) {
    .nav-link-label { display: none; }
    .nav-link-icon { gap: 0; padding: 7px !important; }
}
@media (min-width: 1200px) {
    .nav-link-label { display: inline; }
}

[data-theme="dark"] .site-header {
    background: rgba(13, 27, 36, 0.92);
}
[data-theme="dark"] .nav-link-icon:hover {
    background: rgba(22, 97, 109, 0.18);
}
[data-theme="dark"] .nav-link-icon.active {
    background: rgba(22, 97, 109, 0.22);
}

.btn-primary {
    background: var(--brand-700);
    border-color: var(--brand-700);
}

.btn-primary:hover,
.btn-primary:focus {
    background: var(--brand-900);
    border-color: var(--brand-900);
}

.eyebrow {
    font-size: 0.8rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--brand-500);
    font-weight: 700;
}

.hero-card {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 1.5rem;
    padding: 2rem;
    border: 1px solid var(--border);
    border-radius: 1.25rem;
    background: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(240,247,248,0.95));
}

.hero-metric-grid {
    display: grid;
    gap: 1rem;
}

.metric-card,
.summary-card,
.section-card {
    border: 1px solid var(--border);
    border-radius: 1rem;
    background: var(--card);
    padding: 1rem 1.25rem;
    box-shadow: 0 10px 30px rgba(18, 51, 59, 0.06);
}

.metric-card span,
.summary-card span {
    display: block;
    color: var(--muted);
    font-size: 0.85rem;
}

.metric-card strong,
.summary-card strong {
    display: block;
    font-size: 1.1rem;
    margin-top: 0.35rem;
}

.summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
}

.ro-meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
}

.ro-meta div {
    padding: 0.85rem 1rem;
    border-radius: 0.85rem;
    border: 1px solid var(--border);
    background: #fff;
}

.ro-meta span {
    display: block;
    color: var(--muted);
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.table thead th {
    white-space: nowrap;
}

.print-shell {
    background: white;
    padding: 1.5rem;
}

.portal-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.9fr);
    gap: 1.5rem;
    padding: 2rem;
    border: 1px solid rgba(22, 97, 109, 0.12);
    border-radius: 1.5rem;
    background:
        radial-gradient(circle at top left, rgba(38, 130, 143, 0.12), transparent 30%),
        linear-gradient(135deg, rgba(255,255,255,0.98), rgba(241,247,248,0.96));
    box-shadow: 0 22px 50px rgba(18, 51, 59, 0.08);
    overflow: hidden;
}

.portal-title {
    font-size: clamp(2.25rem, 4vw, 3.8rem);
    line-height: 1.05;
    font-weight: 750;
    letter-spacing: -0.04em;
    max-width: 11ch;
}

.portal-subtitle {
    max-width: 60ch;
    color: var(--muted);
    font-size: 1.05rem;
}

.portal-actions {
    display: flex;
    gap: 0.9rem;
    flex-wrap: wrap;
}

.portal-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.portal-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.55rem 0.9rem;
    border-radius: 999px;
    background: rgba(22, 97, 109, 0.08);
    color: var(--brand-900);
    font-size: 0.85rem;
    font-weight: 600;
}

.portal-hero-panel {
    position: relative;
    display: flex;
    align-items: stretch;
}

.hero-panel-glow {
    position: absolute;
    inset: 0.75rem;
    border-radius: 1.35rem;
    background: linear-gradient(180deg, rgba(232, 157, 44, 0.15), rgba(38, 130, 143, 0.1));
    filter: blur(20px);
}

.hero-panel-card {
    position: relative;
    width: 100%;
    padding: 1.4rem;
    border: 1px solid rgba(22, 97, 109, 0.15);
    border-radius: 1.35rem;
    background: rgba(255,255,255,0.92);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.8);
}

.panel-label {
    display: inline-flex;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
    background: var(--accent-100);
    color: #8a5600;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.hero-stat-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.hero-stat-tile {
    padding: 1rem;
    border-radius: 1rem;
    border: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(247,250,250,0.95));
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.hero-stat-tile:hover,
.feature-card:hover,
.band-item:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 28px rgba(18, 51, 59, 0.09);
}

.hero-stat-tile strong {
    display: block;
    font-size: 1.8rem;
    line-height: 1;
    color: var(--brand-900);
}

.hero-stat-tile span {
    display: block;
    margin-top: 0.5rem;
    color: var(--muted);
    font-size: 0.85rem;
}

.hero-stat-tile.accent {
    background: linear-gradient(160deg, rgba(232,157,44,0.16), rgba(22,97,109,0.08));
}

.feature-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.feature-card {
    padding: 1.25rem;
    border: 1px solid var(--border);
    border-radius: 1.2rem;
    background: rgba(255,255,255,0.95);
    box-shadow: 0 12px 30px rgba(18, 51, 59, 0.06);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.feature-card:hover {
    border-color: rgba(22, 97, 109, 0.28);
}

.feature-card h2 {
    margin: 1rem 0 0.55rem;
    font-size: 1.1rem;
}

.feature-card p {
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.feature-icon {
    width: 2.75rem;
    height: 2.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.85rem;
    background: linear-gradient(135deg, rgba(22,97,109,0.12), rgba(232,157,44,0.18));
    color: var(--brand-900);
    font-weight: 800;
    letter-spacing: 0.08em;
}

.business-band {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
    gap: 1.5rem;
    align-items: start;
    padding: 1.6rem;
    border: 1px solid var(--border);
    border-radius: 1.35rem;
    background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(246,249,250,0.96));
    box-shadow: 0 14px 32px rgba(18, 51, 59, 0.06);
}

.business-band-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.band-item {
    padding: 1rem;
    border-radius: 1rem;
    border: 1px solid var(--border);
    background: #fff;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.band-item strong {
    display: block;
    margin-bottom: 0.45rem;
}

.band-item span {
    color: var(--muted);
    line-height: 1.5;
}

.portal-login-body,
.portal-login-body[data-theme="dark"] {
    background: #ffffff;
    color: #545765;
}

.login-main {
    width: 100%;
    max-width: none;
    padding: 0;
    margin: 0;
}

.portal-login-body .site-page-shell,
.portal-login-body .site-main {
    min-height: 100vh;
}

.login-shell {
    position: relative;
    min-height: 100vh;
    width: 100%;
    overflow: hidden;
    background: #ffffff;
}

.login-shell::before {
    content: "";
    position: absolute;
    top: -56px;
    left: -28px;
    width: clamp(220px, 21vw, 300px);
    height: clamp(160px, 16vw, 220px);
    border-bottom-right-radius: 220px 150px;
    background: radial-gradient(circle at 62% 44%, #ece7ff 0%, #dbd4ff 100%);
    z-index: 0;
}

.login-wave {
    position: absolute;
    inset: auto 0 -1px 0;
    height: clamp(180px, 23vw, 300px);
    z-index: 0;
    pointer-events: none;
}

.login-wave svg,
.login-wave path {
    display: block;
    width: 100%;
    height: 100%;
}

.login-wave path {
    fill: url("#");
    fill: #6d4de0;
}

.login-grid {
    position: relative;
    z-index: 1;
    min-height: 100vh;
    display: grid;
    grid-template-columns: minmax(0, 55%) minmax(360px, 45%);
    align-items: stretch;
    gap: 2rem;
    padding: 2rem clamp(1.5rem, 4vw, 4rem) 7.5rem;
}

.login-brand-panel {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 100%;
    padding-right: 1rem;
}

.login-brand-mark {
    position: relative;
    width: fit-content;
}

.login-brand-blob {
    position: absolute;
    width: 150px;
    height: 150px;
    left: -18px;
    top: -28px;
    border-radius: 50%;
    background: #e7e1ff;
    z-index: 0;
}

.login-brand-link {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.login-brand-image {
    width: auto;
    max-width: min(320px, 24vw);
    max-height: 64px;
    display: block;
}

.login-illustration {
    align-self: end;
    width: min(100%, 720px);
    margin-top: auto;
    margin-bottom: 0.4rem;
}

.login-illustration-image {
    width: 100%;
    height: auto;
    display: block;
}

.login-form-panel {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.login-form-wrap {
    width: min(100%, 360px);
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
}

.login-profile-badge {
    width: 96px;
    height: 96px;
    margin: 0 auto 1.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #a5a7b1;
    background: #f2f2f5;
}

.login-profile-badge svg {
    width: 42px;
    height: 42px;
}

.login-form-head {
    text-align: center;
    margin-bottom: 1.8rem;
}

.login-form-display {
    margin: 0;
    font-size: clamp(2rem, 3.6vw, 2.8rem);
    font-weight: 800;
    letter-spacing: 0.08em;
    color: #545765;
}

.login-form-intro {
    display: none;
}

.login-alert {
    border: 0;
    border-radius: 14px;
    background: rgba(209, 75, 127, 0.08);
    color: #d14b7f;
}

.login-form-body .alert:empty {
    display: none;
}

.login-field-wrap {
    position: relative;
}

.login-field-icon {
    position: absolute;
    right: 1rem;
    left: auto;
    top: 50%;
    transform: translateY(-50%);
    width: 1.1rem;
    height: 1.1rem;
    color: #7c7f8d;
    pointer-events: none;
    z-index: 2;
}

.login-field-icon svg {
    display: block;
    width: 100%;
    height: 100%;
}

.login-input {
    box-shadow: none;
}

.login-input-modern {
    min-height: 52px;
    padding: 12px 52px 12px 20px;
    border-radius: 999px;
    border: 0;
    background: #f1f2f6;
    color: #545765;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.login-input-modern::placeholder {
    color: #666a76;
    opacity: 1;
}

.login-input-modern:focus {
    background: #ece9fb;
    box-shadow: 0 0 0 2px rgba(111, 73, 217, 0.14);
}

.login-password-wrap .login-input-modern {
    padding-right: 5.6rem;
}

.password-toggle {
    border-color: transparent;
}

.password-toggle-modern {
    position: absolute;
    right: 2.7rem;
    top: 50%;
    transform: translateY(-50%);
    min-width: auto;
    padding: 0;
    border: 0;
    background: transparent;
    color: #7c7f8d;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    z-index: 2;
}

.password-toggle-modern:hover,
.password-toggle-modern:focus {
    color: #6f49d9;
    box-shadow: none;
}

.login-field-error {
    display: inline-block;
    margin-top: 0.55rem;
    color: #d14b7f !important;
}

.login-assist-row {
    margin: 0.25rem 0 1.2rem;
    text-align: center;
}

.login-assist-note {
    display: block;
    color: #8a8d98;
    font-size: 0.82rem;
    line-height: 1.5;
}

.login-submit {
    font-weight: 700;
}

.login-submit-modern {
    min-height: 52px;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(90deg, #8c66ef 0%, #6f49d9 100%);
    color: #ffffff;
    letter-spacing: 0.08em;
    box-shadow: none;
}

.login-submit-modern:hover,
.login-submit-modern:focus {
    background: linear-gradient(90deg, #7c56e8 0%, #613ccf 100%);
    box-shadow: none;
}

.login-submit.is-loading {
    opacity: 0.92;
}

@media (max-width: 1199px) {
    .feature-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .business-band,
    .portal-hero,
    .hero-card {
        grid-template-columns: 1fr;
    }

    .login-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding-bottom: 8rem;
    }

    .login-form-panel {
        justify-content: flex-start;
    }

    .login-form-wrap {
        width: min(100%, 400px);
    }
}

@media (max-width: 991px) {
    .business-band-grid {
        grid-template-columns: 1fr;
    }

    .hero-stat-grid {
        grid-template-columns: 1fr 1fr;
    }

    .login-grid {
        padding-top: 1.5rem;
    }

    .login-illustration {
        width: min(100%, 560px);
    }
}

@media (max-width: 767px) {
    .feature-card-grid,
    .hero-stat-grid {
        grid-template-columns: 1fr;
    }

    .portal-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .login-grid {
        padding: 1.25rem 1rem 6.8rem;
    }

    .login-brand-blob {
        width: 118px;
        height: 118px;
        left: -12px;
        top: -18px;
    }

    .login-brand-image {
        max-width: 176px;
        max-height: 44px;
    }

    .login-illustration {
        width: 100%;
    }

    .login-form-panel {
        justify-content: center;
    }

    .login-form-wrap {
        width: 100%;
    }

    .login-profile-badge {
        width: 84px;
        height: 84px;
    }
}
.account-dropdown-toggle {
    border-radius: 999px;
    padding: 0.4rem 0.75rem 0.4rem 0.45rem;
}

.account-avatar {
    width: 2rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(22, 97, 109, 0.12);
    color: var(--brand-900);
    font-weight: 800;
}

.account-dropdown .dropdown-menu {
    min-width: 220px;
    border-radius: 1rem;
    border-color: var(--border);
}

.account-panel {
    max-width: 100%;
}

.profile-kv {
    display: grid;
    gap: 0.9rem;
}

.profile-kv div {
    padding: 0.9rem 1rem;
    border: 1px solid var(--border);
    border-radius: 0.9rem;
    background: #fff;
}

.profile-kv span {
    display: block;
    color: var(--muted);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 0.3rem;
}

.profile-kv strong {
    display: block;
    color: var(--brand-900);
}

.account-input {
    border-radius: 0.9rem 0 0 0.9rem;
}.historical-panel {
    background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(246,249,250,0.95));
}

.table .text-end {
    font-variant-numeric: tabular-nums;
}

.chart-shell {
    position: relative;
    width: 100%;
    min-height: 220px;
    overflow: hidden;
}

.chart-shell-sm {
    height: 240px;
}

.chart-shell-md {
    height: 300px;
}

.chart-shell-lg {
    height: 360px;
}

.chart-shell canvas {
    display: block;
    width: 100% !important;
    height: 100% !important;
}

.historical-panel {
    overflow: hidden;
}

@media (max-width: 767px) {
    .chart-shell-sm,
    .chart-shell-md,
    .chart-shell-lg {
        height: 260px;
    }
}

.indent-compose-shell {
    display: grid;
    gap: 1.25rem;
}

.indent-lock-banner {
    border-radius: 1rem;
    border-color: rgba(232, 157, 44, 0.35);
    background: rgba(232, 157, 44, 0.14);
}

.indent-summary-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 180px)) minmax(280px, 1fr);
    gap: 1rem;
    align-items: stretch;
}

.indent-summary-metric,
.indent-summary-datebox,
.indent-entry-card {
    border: 1px solid var(--border);
    border-radius: 1rem;
    background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(246,249,250,0.96));
    box-shadow: 0 10px 28px rgba(18, 51, 59, 0.06);
}

.indent-summary-metric {
    padding: 1rem 1.1rem;
}

.indent-summary-metric span {
    display: block;
    color: var(--muted);
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.indent-summary-metric strong {
    display: block;
    margin-top: 0.4rem;
    font-size: 1.2rem;
    color: var(--brand-900);
}

.indent-summary-datebox {
    padding: 1rem 1.1rem;
}

.indent-date-input,
.indent-number-input,
.indent-remarks-input {
    border-radius: 0.85rem;
    border-color: var(--border);
}

.indent-number-input {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.indent-entry-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.indent-entry-card {
    padding: 1.15rem 1.25rem;
}

.indent-section-header {
    margin-bottom: 1rem;
}

.indent-field-grid {
    display: grid;
    gap: 1rem;
}

.indent-field-grid-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.indent-field-grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.indent-field label {
    display: block;
    margin-bottom: 0.45rem;
    color: var(--muted);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 700;
}

.indent-remarks-input {
    min-height: 132px;
    resize: vertical;
}

.indent-submit-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border: 1px solid var(--border);
    border-radius: 1rem;
    background: rgba(244,247,248,0.9);
}

@media (max-width: 1199px) {
    .indent-summary-strip,
    .indent-entry-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .indent-summary-strip,
    .indent-entry-grid,
    .indent-field-grid-4,
    .indent-field-grid-2 {
        grid-template-columns: 1fr;
    }

    .indent-submit-bar {
        flex-direction: column;
        align-items: stretch;
    }
}

.indent-page-title {
    font-size: clamp(1.85rem, 3vw, 2.6rem);
    letter-spacing: -0.03em;
}

.indent-page-subtitle {
    max-width: 72ch;
    line-height: 1.6;
}

.indent-master-card {
    padding: 1.35rem 1.45rem;
    background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(247,250,250,0.98));
    box-shadow: 0 18px 36px rgba(18, 51, 59, 0.06);
}

.indent-summary-strip {
    gap: 1.1rem;
}

.indent-summary-metric,
.indent-summary-datebox,
.indent-entry-card {
    border: 1px solid rgba(17, 57, 65, 0.09);
    border-radius: 1.15rem;
    background: linear-gradient(180deg, rgba(255,255,255,0.99), rgba(247,250,250,0.97));
    box-shadow: 0 18px 34px rgba(18, 51, 59, 0.05);
}

.indent-summary-metric {
    padding: 1.15rem 1.2rem;
}

.indent-summary-metric.accent {
    background: linear-gradient(160deg, rgba(22,97,109,0.12), rgba(232,157,44,0.18));
    border-color: rgba(22,97,109,0.18);
}

.indent-summary-metric span {
    font-size: 0.74rem;
    font-weight: 700;
}

.indent-summary-metric strong {
    margin-top: 0.45rem;
    font-size: 1.3rem;
}

.indent-summary-datebox {
    padding: 1.15rem 1.2rem;
    background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(241,247,248,0.96));
}

.indent-date-input,
.indent-number-input,
.indent-remarks-input {
    min-height: 50px;
    border-radius: 0.95rem;
    border-color: rgba(17, 57, 65, 0.12);
    box-shadow: inset 0 1px 2px rgba(18, 51, 59, 0.03);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.indent-date-input:focus,
.indent-number-input:focus,
.indent-remarks-input:focus {
    border-color: rgba(22, 97, 109, 0.45);
    box-shadow: 0 0 0 0.28rem rgba(22, 97, 109, 0.1);
}

.indent-number-input::placeholder,
.indent-remarks-input::placeholder {
    color: #91a4aa;
}

.indent-entry-grid {
    gap: 1.15rem;
}

.indent-entry-card {
    position: relative;
    padding: 1.35rem 1.35rem 1.25rem;
    overflow: hidden;
}

.indent-entry-card::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 4px;
    background: linear-gradient(90deg, rgba(22,97,109,0.8), rgba(232,157,44,0.72));
    opacity: 0.9;
}

.indent-entry-card-featured {
    background: linear-gradient(180deg, rgba(255,255,255,0.99), rgba(239,247,248,0.96));
}

.indent-entry-card-locked {
    background: linear-gradient(180deg, rgba(255,255,255,0.99), rgba(248,244,237,0.96));
}

.indent-card-title {
    color: var(--brand-900);
    font-size: 1.14rem;
    letter-spacing: -0.01em;
}

.indent-card-copy {
    font-size: 0.92rem;
    line-height: 1.55;
}

.indent-section-header {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 1rem;
    margin-bottom: 1rem;
}

.indent-field {
    display: grid;
    gap: 0.35rem;
}

.indent-field label {
    color: #49656c;
    font-size: 0.76rem;
    letter-spacing: 0.07em;
}

.indent-number-readonly {
    background: rgba(241, 246, 247, 0.95);
    color: var(--brand-900);
    font-weight: 700;
}

.indent-helper-note {
    min-height: 1.25rem;
    color: var(--muted);
    font-size: 0.82rem;
}

.indent-locked-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
    background: rgba(232, 157, 44, 0.16);
    color: #835000;
    font-size: 0.78rem;
    font-weight: 700;
    white-space: nowrap;
}

.indent-remarks-card {
    background: linear-gradient(180deg, rgba(255,255,255,0.99), rgba(246,249,250,0.98));
}

.indent-remarks-input {
    min-height: 140px;
}

.indent-submit-bar {
    border-radius: 1.15rem;
    border-color: rgba(17, 57, 65, 0.09);
    box-shadow: 0 14px 26px rgba(18, 51, 59, 0.05);
    background: linear-gradient(180deg, rgba(244,247,248,0.95), rgba(252,253,253,0.96));
}

.indent-primary-btn,
.indent-secondary-btn {
    min-height: 46px;
    padding-inline: 1.2rem;
    border-radius: 0.9rem;
    font-weight: 700;
}

.indent-secondary-btn {
    border-color: rgba(17, 57, 65, 0.12);
    color: var(--brand-900);
    background: rgba(255,255,255,0.9);
}

.indent-secondary-btn:hover,
.indent-secondary-btn:focus {
    background: rgba(241,247,248,0.96);
    border-color: rgba(22, 97, 109, 0.24);
    color: var(--brand-900);
}

.indent-primary-btn:hover,
.indent-primary-btn:focus {
    box-shadow: 0 10px 18px rgba(22, 97, 109, 0.18);
}

.indent-primary-btn:disabled,
.indent-secondary-btn:disabled {
    opacity: 0.7;
}

@media (max-width: 767px) {
    .indent-entry-card,
    .indent-master-card,
    .indent-submit-bar,
    .indent-summary-metric,
    .indent-summary-datebox {
        padding-inline: 1rem;
    }

    .indent-section-header {
        flex-direction: column;
    }
}

.profile-complete-alert {
    border-radius: 1rem;
    border-color: rgba(232, 157, 44, 0.28);
    background: linear-gradient(180deg, rgba(255,250,242,0.98), rgba(255,245,226,0.96));
    color: #704300;
    box-shadow: 0 12px 24px rgba(140, 90, 0, 0.08);
}

.account-contact-input {
    min-height: 50px;
    border-radius: 0.95rem;
    border-color: rgba(17, 57, 65, 0.12);
    box-shadow: inset 0 1px 2px rgba(18, 51, 59, 0.03);
}

.account-contact-input:focus {
    border-color: rgba(22, 97, 109, 0.42);
    box-shadow: 0 0 0 0.26rem rgba(22, 97, 109, 0.1);
}

.indent-compose-shell {
    gap: 1.5rem;
}

.indent-summary-strip {
    position: relative;
    padding: 0.2rem;
    border-radius: 1.35rem;
    background: linear-gradient(120deg, rgba(22,97,109,0.12), rgba(232,157,44,0.16));
    box-shadow: 0 24px 44px rgba(18, 51, 59, 0.08);
}

.indent-summary-metric,
.indent-summary-datebox {
    backdrop-filter: blur(6px);
}

.indent-summary-metric {
    border-radius: 1.1rem;
}

.indent-summary-metric strong {
    letter-spacing: -0.02em;
}

.indent-summary-datebox .form-label {
    color: var(--brand-900);
    letter-spacing: 0.01em;
}

.indent-master-card {
    border-radius: 1.3rem;
}

.indent-master-card .ro-meta div {
    border-radius: 1rem;
    background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(247,250,250,0.94));
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.85);
}

.indent-master-card .portal-chip {
    background: rgba(255,255,255,0.82);
    border: 1px solid rgba(17, 57, 65, 0.08);
}

.indent-entry-card {
    border-radius: 1.25rem;
    border-color: rgba(17, 57, 65, 0.11);
    box-shadow: 0 20px 34px rgba(18, 51, 59, 0.06);
}

.indent-entry-card::before {
    height: 5px;
}

.indent-entry-card::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.78);
}

.indent-card-title {
    font-size: 1.18rem;
    font-weight: 700;
}

.indent-card-copy {
    font-size: 0.88rem;
    color: #62777d;
}

.indent-field label {
    margin-bottom: 0.5rem;
    font-size: 0.74rem;
    color: #4e666d;
}

.indent-number-input,
.indent-date-input,
.indent-remarks-input {
    background: linear-gradient(180deg, rgba(255,255,255,0.99), rgba(248,250,251,0.97));
}

.indent-number-input:hover,
.indent-date-input:hover,
.indent-remarks-input:hover {
    border-color: rgba(22, 97, 109, 0.24);
}

.indent-number-readonly {
    background: linear-gradient(180deg, rgba(244,248,249,0.98), rgba(238,243,244,0.98));
    border-style: dashed;
}

.indent-locked-pill {
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.65);
}

.indent-helper-note {
    padding: 0.7rem 0.85rem;
    border-radius: 0.85rem;
    background: rgba(255,255,255,0.76);
    border: 1px solid rgba(17, 57, 65, 0.08);
}

.indent-remarks-card {
    border-radius: 1.3rem;
}

.indent-remarks-input {
    min-height: 150px;
}

.indent-submit-bar {
    padding: 1.15rem 1.35rem;
    align-items: center;
}

.indent-primary-btn {
    min-width: 150px;
    background: linear-gradient(180deg, var(--brand-700), var(--brand-900));
    border: none;
}

.indent-primary-btn:hover,
.indent-primary-btn:focus {
    background: linear-gradient(180deg, var(--brand-900), #0a2f35);
}

.indent-secondary-btn {
    min-width: 124px;
}

.indent-lock-banner {
    border-left: 5px solid var(--accent-500);
    padding: 1rem 1.1rem;
}

.table-sort-link {
    color: inherit;
    text-decoration: none;
}

.table-sort-link:hover,
.table-sort-link:focus {
    color: var(--brand-700);
    text-decoration: underline;
}

.sort-icon {
    font-size: .7em;
    vertical-align: middle;
}

.sort-icon-neutral {
    opacity: .35;
}

.sort-icon-asc,
.sort-icon-desc {
    color: var(--brand-700);
    opacity: 1;
}

.otp-shell {
    min-height: calc(100vh - 180px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.otp-card {
    width: min(980px, 100%);
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(340px, 1.15fr);
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 1.75rem;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(15, 23, 42, 0.12);
}

.otp-side {
    padding: 2.5rem;
    background: linear-gradient(160deg, #0f766e 0%, #0f4c81 100%);
    color: #fff;
}

.otp-title {
    font-size: clamp(2rem, 3vw, 2.5rem);
    line-height: 1.1;
    margin: 0;
}

.otp-text {
    color: rgba(255, 255, 255, 0.86);
    max-width: 36ch;
}

.otp-mobile-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.85rem 1.1rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.18);
    font-weight: 600;
}

/* -- Dealer UI Enhancements ----------------------------------- */

/* Status badges */
.status-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.38rem;
    padding: 0.28rem 0.7rem;
    border-radius: 999px;
    font-size: 0.73rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: nowrap;
    line-height: 1.4;
}

.status-badge::before {
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
    flex-shrink: 0;
    opacity: 0.85;
}

.status-pending  { background: rgba(232,157,44,0.16);  color: #7a4500; }
.status-modified { background: rgba(37,99,235,0.12);   color: #1e40af; }
.status-suppressed { background: rgba(100,116,139,0.14); color: #475569; }
.status-reviewed   { background: rgba(22,163,74,0.14);  color: #15803d; }
.status-finalized  { background: rgba(13,148,136,0.14); color: #0f766e; }

/* Summary card � lock/open variant */
.summary-card-dealer {
    position: relative;
    overflow: hidden;
    transition: box-shadow 0.18s ease, transform 0.18s ease;
}

.summary-card-dealer:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 32px rgba(18, 51, 59, 0.1);
}

.summary-card-dealer .scd-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 0.65rem;
    font-size: 1.1rem;
    margin-bottom: 0.6rem;
}

.summary-card-dealer span {
    display: block;
    color: var(--muted);
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.07em;
}

.summary-card-dealer strong {
    display: block;
    font-size: 1.35rem;
    margin-top: 0.3rem;
    letter-spacing: -0.02em;
    color: var(--brand-900);
}

.summary-card-dealer.scd-locked strong { color: #b91c1c; }
.summary-card-dealer.scd-open   strong { color: #15803d; }
.summary-card-dealer.scd-count  strong { color: var(--brand-700); }

.summary-card-dealer.scd-locked .scd-icon {
    background: rgba(185,28,28,0.1);
    color: #b91c1c;
}

.summary-card-dealer.scd-open .scd-icon {
    background: rgba(21,128,61,0.1);
    color: #15803d;
}

.summary-card-dealer.scd-count .scd-icon {
    background: rgba(22,97,109,0.1);
    color: var(--brand-700);
}

/* Section header with lock badge */
.section-lock-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.05em;
}

.section-lock-badge.locked {
    background: rgba(185,28,28,0.1);
    color: #b91c1c;
}

.section-lock-badge.open {
    background: rgba(21,128,61,0.1);
    color: #15803d;
}

/* Table empty state */
.table-empty-row td {
    padding: 2.8rem 1rem !important;
    text-align: center;
    border: none;
}

.table-empty-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.table-empty-icon {
    font-size: 2rem;
    opacity: 0.3;
    line-height: 1;
}

.table-empty-text {
    color: var(--muted);
    font-size: 0.88rem;
}

/* Action buttons in tables */
.btn-action-edit {
    border-radius: 0.6rem;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.3rem 0.65rem;
    border-color: rgba(22,97,109,0.25);
    color: var(--brand-700);
    background: rgba(22,97,109,0.06);
    transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
}

.btn-action-edit:hover {
    background: rgba(22,97,109,0.14);
    border-color: rgba(22,97,109,0.4);
    color: var(--brand-900);
    box-shadow: 0 4px 10px rgba(22,97,109,0.12);
}

.btn-action-suppress {
    border-radius: 0.6rem;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.3rem 0.65rem;
    border-color: rgba(185,28,28,0.2);
    color: #b91c1c;
    background: rgba(185,28,28,0.05);
    transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
}

.btn-action-suppress:hover {
    background: rgba(185,28,28,0.12);
    border-color: rgba(185,28,28,0.38);
    color: #991b1b;
    box-shadow: 0 4px 10px rgba(185,28,28,0.1);
}

/* Dashboard hero strip */
.dealer-hero-strip {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
    margin-top: 0.75rem;
}

.dealer-hero-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.28rem 0.75rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    border: 1px solid transparent;
}

.dealer-hero-chip.chip-locked {
    background: rgba(185,28,28,0.08);
    border-color: rgba(185,28,28,0.18);
    color: #b91c1c;
}

.dealer-hero-chip.chip-open {
    background: rgba(21,128,61,0.08);
    border-color: rgba(21,128,61,0.18);
    color: #15803d;
}

.dealer-hero-chip.chip-neutral {
    background: rgba(22,97,109,0.07);
    border-color: rgba(22,97,109,0.15);
    color: var(--brand-700);
}

/* Edit page section cards */
.edit-section-label {
    display: inline-flex;
    align-items: center;
    padding: 0.22rem 0.65rem;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    background: rgba(22,97,109,0.1);
    color: var(--brand-700);
    margin-bottom: 0.75rem;
}

/* RO details info banner on dashboard */
.ro-detail-banner {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 0.85rem 1.1rem;
    border-radius: 1rem;
    background: linear-gradient(135deg, rgba(22,97,109,0.06), rgba(232,157,44,0.08));
    border: 1px solid rgba(22,97,109,0.12);
    margin-bottom: 0.75rem;
}

.ro-detail-banner-item {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.ro-detail-banner-item span {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--muted);
    font-weight: 600;
}

.ro-detail-banner-item strong {
    font-size: 0.88rem;
    color: var(--brand-900);
}

/* Divider between RO detail items */
.ro-detail-banner-item + .ro-detail-banner-item {
    padding-left: 1rem;
    border-left: 1px solid rgba(22,97,109,0.14);
}

/* Table row hover */
.table-hover tbody tr:hover td {
    background: rgba(22, 97, 109, 0.04);
}

/* Historical monthly table row striping */
.table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-accent-bg: rgba(22, 97, 109, 0.025);
}

/* Create indent CTA button � more prominent */
.btn-create-indent {
    background: linear-gradient(135deg, var(--brand-700), var(--brand-900));
    border: none;
    border-radius: 0.95rem;
    font-weight: 700;
    padding: 0.6rem 1.4rem;
    box-shadow: 0 8px 18px rgba(22,97,109,0.22);
    transition: box-shadow 0.2s, transform 0.2s;
}

.btn-create-indent:hover,
.btn-create-indent:focus {
    background: linear-gradient(135deg, var(--brand-900), #0a2f35);
    box-shadow: 0 14px 28px rgba(22,97,109,0.28);
    transform: translateY(-2px);
    color: #fff;
}

/* -- End Dealer UI Enhancements ------------------------------- */

.otp-form-panel {
    padding: 2.5rem;
    background: #f8fafc;
}

.otp-input {
    letter-spacing: 0.35rem;
    font-weight: 700;
    text-align: center;
}

@media (max-width: 991.98px) {
    .portal-authenticated .site-header,
    .portal-authenticated .site-header-fixed,
    .portal-authenticated .site-header-fixed .navbar {
        z-index: 1073;
    }
    .otp-card {
        grid-template-columns: 1fr;
    }
}

.manager-row-actions .btn {
    white-space: nowrap;
}

.manager-control-modal {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 1.25rem;
    box-shadow: 0 28px 70px rgba(15, 23, 42, 0.16);
}

.manager-reset-kv {
    display: grid;
    gap: 0.9rem;
    margin: 0;
}

.manager-reset-kv div {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 1rem;
    align-items: baseline;
    padding: 0.85rem 1rem;
    border-radius: 0.9rem;
    background: rgba(248, 250, 252, 0.95);
    border: 1px solid rgba(148, 163, 184, 0.16);
}

.manager-reset-kv dt {
    margin: 0;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #475569;
}

.manager-reset-kv dd {
    margin: 0;
    font-weight: 700;
    color: #0f172a;
}

.submission-records-card {
    overflow: visible;
}

.submission-review-form {
    padding: 1rem 1.1rem;
    border-radius: 1rem;
    background: linear-gradient(180deg, rgba(248,250,252,0.92), rgba(241,245,249,0.92));
    border: 1px solid rgba(148,163,184,0.16);
}

.bulk-action-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 0.85rem 1rem;
    border-radius: 1rem;
    background: rgba(255,255,255,0.92);
    border: 1px solid rgba(148,163,184,0.14);
}

.bulk-selected-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.75rem;
    border-radius: 999px;
    background: rgba(15,118,110,0.08);
    color: #0f4c81;
    font-weight: 600;
}

.submission-records-table-wrap {
    max-height: 70vh;
    overflow: auto;
    border-radius: 1rem;
    border: 1px solid rgba(148,163,184,0.14);
}

.submission-records-table {
    width: max-content;
    min-width: 2160px;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.92rem;
}

.submission-records-table thead th {
    position: static;
    background: #f8fafc;
    vertical-align: middle;
    white-space: nowrap;
}

.submission-records-table .sr-head-checkbox,
.submission-records-table .sr-cell-checkbox {
    text-align: center;
    vertical-align: middle;
}

.submission-records-table tbody tr.row-suppressed td {
    background: rgba(220, 38, 38, 0.08);
}

.submission-records-table tbody tr.row-modified td {
    background: rgba(14,165,233,0.08);
}

.submission-records-table td,
.submission-records-table th {
    padding: 0.7rem 0.75rem;
}

.submission-records-table .remarks-cell {
    min-width: 220px;
    max-width: 320px;
}


.ajax-shell {
    position: relative;
    transition: opacity 0.18s ease;
}

.ajax-shell-loading {
    opacity: 0.6;
    pointer-events: none;
}

.ajax-shell-loading::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.45);
}

.ajax-shell-loading::before {
    content: "";
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    width: 1.1rem;
    height: 1.1rem;
    border: 2px solid rgba(22, 97, 109, 0.18);
    border-top-color: var(--brand-700);
    border-radius: 50%;
    animation: portal-spin 0.8s linear infinite;
    z-index: 2;
}

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

.portal-toast-container {
    z-index: 1085;
}

.summary-card-action {
    width: 100%;
    text-align: left;
    background: transparent;
    border: 0;
    padding: 0;
    color: inherit;
}

.filter-chip-button,
.table-filter-link {
    border: 0;
    background: transparent;
    color: var(--brand-700);
    font-weight: 600;
    padding: 0;
    text-decoration: underline;
    text-underline-offset: 0.18rem;
}

.filter-chip-button:hover,
.table-filter-link:hover {
    color: var(--brand-900);
}

.inline-status-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.inline-status-actions .btn {
    min-width: 5.5rem;
}

.session-card-grid {
    display: grid;
    gap: 1rem;
}

.session-card {
    padding: 1rem 1.1rem;
    border: 1px solid var(--border);
    border-radius: 1rem;
    background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(246,250,250,0.96));
    box-shadow: 0 10px 24px rgba(18, 51, 59, 0.05);
}

.session-card-current {
    border-color: rgba(22, 97, 109, 0.32);
    box-shadow: 0 14px 28px rgba(22, 97, 109, 0.08);
}

.session-title-row {
    display: flex;
    gap: 0.6rem;
    align-items: center;
    flex-wrap: wrap;
}

.session-meta-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.85rem;
}

.session-meta-grid div {
    padding: 0.8rem 0.9rem;
    border-radius: 0.85rem;
    border: 1px solid rgba(213, 224, 227, 0.9);
    background: rgba(255, 255, 255, 0.92);
}

.session-meta-grid span {
    display: block;
    color: var(--muted);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.session-meta-grid strong {
    display: block;
    margin-top: 0.35rem;
    font-weight: 600;
    color: var(--text);
}

.session-agent {
    font-size: 0.84rem;
    line-height: 1.45;
    word-break: break-word;
}
.date-picker-field {
    position: relative;
}

.manager-date-input {
    padding-right: 3rem;
    cursor: pointer;
}

.date-picker-trigger {
    position: absolute;
    top: 50%;
    right: 0.6rem;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 0;
    background: transparent;
    color: #5f6f52;
    border-radius: 999px;
}

.date-picker-trigger:hover,
.date-picker-trigger:focus-visible {
    background: rgba(95, 111, 82, 0.1);
    color: #1f2a1c;
    outline: none;
}

.date-picker-trigger svg {
    width: 1rem;
    height: 1rem;
    fill: currentColor;
}

.date-format-text {
    font-size: 0.78rem;
    color: #6c757d;
}
.btn {
    --btn-shadow: 0 8px 18px rgba(18, 31, 38, 0.08);
    --btn-shadow-hover: 0 14px 28px rgba(18, 31, 38, 0.12);
    --btn-ring: 0 0 0 0.22rem rgba(36, 98, 110, 0.18);
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    min-height: 2.7rem;
    padding: 0.7rem 1.15rem;
    border-radius: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1.1;
    transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease, color 180ms ease, opacity 180ms ease;
    box-shadow: var(--btn-shadow);
}

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

.btn:active:not(:disabled):not(.disabled) {
    transform: translateY(0);
    box-shadow: 0 7px 14px rgba(18, 31, 38, 0.09);
}

.btn:focus-visible,
.btn-check:focus + .btn,
.btn:focus {
    box-shadow: var(--btn-shadow), var(--btn-ring);
}

.btn:disabled,
.btn.disabled {
    opacity: 0.58;
    box-shadow: none;
    transform: none;
}

.btn-sm {
    min-height: 2.2rem;
    padding: 0.48rem 0.82rem;
    border-radius: 0.78rem;
    font-size: 0.84rem;
    font-weight: 600;
}

.btn-primary,
.indent-primary-btn {
    color: #fff;
    border: 1px solid rgba(19, 85, 95, 0.18);
    background: linear-gradient(180deg, #1f7382 0%, #145764 100%);
}

.btn-primary:hover,
.btn-primary:focus,
.indent-primary-btn:hover,
.indent-primary-btn:focus {
    color: #fff;
    border-color: rgba(11, 57, 65, 0.26);
    background: linear-gradient(180deg, #186675 0%, #0d4650 100%);
}

.btn-success {
    color: #fff;
    border: 1px solid rgba(25, 104, 69, 0.2);
    background: linear-gradient(180deg, #2a9b66 0%, #1d7e51 100%);
}

.btn-success:hover,
.btn-success:focus {
    color: #fff;
    border-color: rgba(18, 82, 55, 0.28);
    background: linear-gradient(180deg, #24885a 0%, #176742 100%);
}

.btn-outline-primary {
    color: #165f6c;
    border: 1px solid rgba(22, 95, 108, 0.18);
    background: linear-gradient(180deg, rgba(255,255,255,0.96) 0%, rgba(240, 248, 250, 0.98) 100%);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary.active {
    color: #fff;
    border-color: rgba(22, 95, 108, 0.2);
    background: linear-gradient(180deg, #2a8190 0%, #165f6c 100%);
}

.btn-outline-secondary,
.indent-secondary-btn {
    color: #48545f;
    border: 1px solid rgba(73, 84, 95, 0.16);
    background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(244,246,248,0.98) 100%);
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.indent-secondary-btn:hover,
.indent-secondary-btn:focus {
    color: #17212b;
    border-color: rgba(73, 84, 95, 0.24);
    background: linear-gradient(180deg, rgba(250,251,252,1) 0%, rgba(232,236,240,1) 100%);
}

.btn-outline-success {
    color: #1f7e52;
    border: 1px solid rgba(31, 126, 82, 0.18);
    background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(239, 249, 243, 1) 100%);
}

.btn-outline-success:hover,
.btn-outline-success:focus {
    color: #fff;
    border-color: rgba(24, 101, 66, 0.22);
    background: linear-gradient(180deg, #2a9b66 0%, #1d7e51 100%);
}

.btn-outline-dark {
    color: #24313d;
    border: 1px solid rgba(36, 49, 61, 0.15);
    background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(238, 242, 246, 1) 100%);
}

.btn-outline-dark:hover,
.btn-outline-dark:focus {
    color: #fff;
    border-color: rgba(22, 29, 37, 0.2);
    background: linear-gradient(180deg, #425566 0%, #24313d 100%);
}

.btn-outline-danger {
    color: #aa3d47;
    border: 1px solid rgba(170, 61, 71, 0.16);
    background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(253, 243, 244, 1) 100%);
}

.btn-outline-danger:hover,
.btn-outline-danger:focus {
    color: #fff;
    border-color: rgba(148, 42, 53, 0.24);
    background: linear-gradient(180deg, #c3555f 0%, #97343f 100%);
}

.bulk-action-bar {
    gap: 1rem;
    padding: 0.95rem 1rem;
    border: 1px solid rgba(21, 57, 66, 0.07);
    border-radius: 1rem;
    background: linear-gradient(180deg, rgba(250, 252, 252, 0.98) 0%, rgba(242, 247, 248, 0.98) 100%);
}

.bulk-action-bar .btn {
    min-width: 9rem;
}

.inline-status-actions {
    gap: 0.45rem;
}

.inline-status-actions .btn,
.submission-records-table .btn-sm {
    min-width: 5.8rem;
    box-shadow: 0 5px 12px rgba(15, 27, 34, 0.08);
}

.submission-records-table .btn-sm:hover:not(:disabled):not(.disabled) {
    box-shadow: 0 10px 18px rgba(15, 27, 34, 0.12);
}

.submission-records-table td .btn + .btn,
.submission-records-table td form + form,
.submission-records-table td form + a,
.submission-records-table td a + a {
    margin-left: 0;
}

.bulk-selected-pill {
    display: inline-flex;
    align-items: center;
    min-height: 2.45rem;
    padding: 0.55rem 0.9rem;
    border-radius: 999px;
    background: rgba(21, 87, 98, 0.08);
    color: #0f4852;
    font-weight: 600;
}
.summary-card small {
    display: block;
    margin-top: 0.35rem;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 600;
}

.summary-card-alert {
    border-color: rgba(192, 117, 48, 0.24);
    background: linear-gradient(180deg, rgba(255,250,244,0.98), rgba(255,245,232,0.96));
}

.eyebrow {
    letter-spacing: 0.08em;
}

.table-warning-subtle {
    background: rgba(255, 245, 224, 0.72);
}

html {
    scroll-padding-top: 96px;
}

body {
    padding-top: 88px;
    padding-bottom: 78px;
}

.site-header-fixed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1030;
    min-height: 76px;
    box-shadow: 0 10px 26px rgba(18, 51, 59, 0.08);
}

.site-header-fixed .navbar {
    min-height: 76px;
}

.site-page-shell {
    min-height: calc(100vh - 166px);
}

.site-main {`r`n    position: relative;`r`n}

.site-footer-fixed {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1025;
    height: 58px;
    border-top: 1px solid rgba(17, 57, 65, 0.1);
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(12px);
    box-shadow: 0 -10px 26px rgba(18, 51, 59, 0.06);
}

.site-footer-link {
    border: 0;
    background: transparent;
    padding: 0.35rem 0.8rem;
    border-radius: 999px;
    color: var(--brand-900);
    font-weight: 700;
    letter-spacing: 0.01em;
    transition: background-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.site-footer-link:hover,
.site-footer-link:focus-visible {
    background: rgba(22, 97, 109, 0.08);
    color: var(--brand-700);
    transform: translateY(-1px);
    outline: none;
}

.cbc-labs-modal {
    border: 1px solid rgba(17, 57, 65, 0.1);
    border-radius: 1.35rem;
    box-shadow: 0 28px 60px rgba(18, 51, 59, 0.16);
}

.cbc-labs-modal .modal-header,
.cbc-labs-modal .modal-body,
.cbc-labs-modal .modal-footer {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.cbc-labs-modal .modal-title {
    color: var(--brand-900);
    font-size: 1.45rem;
    letter-spacing: -0.02em;
}

@media (max-width: 991px) {
    body {
        padding-top: 80px;
        padding-bottom: 74px;
    }

    .site-header-fixed,
    .site-header-fixed .navbar {
        min-height: 68px;
    }
}

@media (max-width: 767px) {
    body {
        padding-top: 76px;
        padding-bottom: 76px;
    }

    .site-footer-fixed {
        height: 62px;
    }

    .site-footer-link {
        font-size: 0.92rem;
        text-align: center;
    }
}

.dealer-field-error,
.indent-number-input.dealer-field-error,
.indent-number-input.input-validation-error {
    border-color: #c53d4b !important;
    background: linear-gradient(180deg, rgba(255, 246, 247, 0.98), rgba(255, 239, 241, 0.98)) !important;
    box-shadow: 0 0 0 0.26rem rgba(197, 61, 75, 0.14) !important;
}

.dealer-field-error:focus,
.indent-number-input.dealer-field-error:focus,
.indent-number-input.input-validation-error:focus {
    border-color: #b63542 !important;
    box-shadow: 0 0 0 0.28rem rgba(197, 61, 75, 0.18) !important;
}

.manager-page-modal {
    z-index: 1082;
}

.manager-page-modal .modal-dialog,
.manager-page-modal .modal-content,
.manager-page-modal .form-check,
.manager-page-modal .btn,
.manager-page-modal .btn-close,
.manager-page-modal .form-check-input,
.manager-page-modal .form-check-label {
    pointer-events: auto;
}

/* -- Manager UI Enhancements ----------------------------------- */

/* Manager KPI summary cards (fuel totals, status counts) */
.summary-card-manager {
    position: relative;
    overflow: hidden;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    padding: 1.25rem 1.5rem;
    border: 1px solid rgba(22,97,109,0.08);
    background: #fff;
    box-shadow: 0 2px 4px rgba(18,51,59,0.02);
}

.summary-card-manager::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: transparent;
    transition: background 0.25s ease;
}

.summary-card-manager:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(18, 51, 59, 0.08);
    border-color: rgba(22,97,109,0.15);
}

.summary-card-manager .scm-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 0.85rem;
    font-size: 1.25rem;
    margin-bottom: 0.75rem;
    background: rgba(22,97,109,0.08);
    color: var(--brand-700);
    transition: transform 0.3s ease;
}

.summary-card-manager:hover .scm-icon {
    transform: scale(1.1) rotate(5deg);
}

.summary-card-manager span {
    display: block;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 0.2rem;
}

.summary-card-manager strong {
    display: block;
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: var(--brand-900);
}

.summary-card-manager small {
    display: block;
    font-size: 0.75rem;
    color: var(--muted);
    margin-top: 0.3rem;
    font-weight: 500;
}

.summary-card-manager.scm-ms::before  { background: #16616d; }
.summary-card-manager.scm-hsd::before { background: #e89d2c; }
.summary-card-manager.scm-xp::before  { background: #5c8d89; }
.summary-card-manager.scm-xg::before  { background: #d65a31; }
.summary-card-manager.scm-total::before { background: var(--brand-600); }
.summary-card-manager.scm-alert::before { background: #dc2626; }
.summary-card-manager.scm-good::before  { background: #16a34a; }
.summary-card-manager.scm-warn::before  { background: #f59e0b; }

.summary-card-manager.scm-ms .scm-icon     { background: rgba(22,97,109,0.1);  color: #16616d; }
.summary-card-manager.scm-hsd .scm-icon    { background: rgba(232,157,44,0.12); color: #a06008; }
.summary-card-manager.scm-xp .scm-icon     { background: rgba(92,141,137,0.12); color: #3f6e6a; }
.summary-card-manager.scm-xg .scm-icon     { background: rgba(214,90,49,0.1);  color: #c04020; }
.summary-card-manager.scm-total .scm-icon  { background: rgba(22,97,109,0.08);   color: var(--brand-700); }
.summary-card-manager.scm-alert .scm-icon  { background: rgba(220,38,38,0.08);   color: #dc2626; }
.summary-card-manager.scm-good .scm-icon   { background: rgba(22,163,74,0.08);   color: #16a34a; }
.summary-card-manager.scm-warn .scm-icon   { background: rgba(245,158,11,0.12); color: #b45309; }

.summary-card-manager.scm-alert strong { color: #dc2626; }
.summary-card-manager.scm-good  strong { color: #16a34a; }
.summary-card-manager.scm-warn  strong { color: #b45309; }

/* Manager hero header chips */
.manager-hero-strip {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: wrap;
    margin-top: 0.7rem;
}

.manager-hero-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.26rem 0.72rem;
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 600;
    border: 1px solid transparent;
}

.manager-hero-chip.mhc-neutral {
    background: rgba(22,97,109,0.07);
    border-color: rgba(22,97,109,0.15);
    color: var(--brand-700);
}

.manager-hero-chip.mhc-count {
    background: rgba(232,157,44,0.1);
    border-color: rgba(232,157,44,0.22);
    color: #7a4a00;
}

/* Manager action toolbar (Export/Print/WhatsApp) */
.manager-action-toolbar {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
    padding: 0.75rem 1rem;
    border-radius: 1rem;
    background: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(246,249,250,0.95));
    border: 1px solid rgba(22,97,109,0.1);
    box-shadow: 0 6px 18px rgba(18,51,59,0.05);
    margin-bottom: 1.25rem;
}

.manager-action-toolbar .btn {
    border-radius: 0.75rem;
    font-weight: 600;
    font-size: 0.83rem;
    padding: 0.42rem 0.9rem;
}

/* Lock status indicator in filter area */
.manager-lock-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.32rem 0.72rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
}

.manager-lock-badge.locked {
    background: rgba(185,28,28,0.1);
    color: #b91c1c;
    border: 1px solid rgba(185,28,28,0.18);
}

.manager-lock-badge.open {
    background: rgba(21,128,61,0.1);
    color: #15803d;
    border: 1px solid rgba(21,128,61,0.18);
}

.manager-lock-badge.unset {
    background: rgba(100,116,139,0.1);
    color: #475569;
    border: 1px solid rgba(100,116,139,0.18);
}

/* Quick filter button group */
.manager-quick-filters {
    display: flex;
    gap: 0.45rem;
    flex-wrap: wrap;
}

.manager-quick-filters .btn {
    border-radius: 0.75rem;
    font-size: 0.82rem;
    font-weight: 600;
    padding: 0.38rem 0.85rem;
    transition: all 0.15s ease;
}

/* Details page � data field grid */
.details-field-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.85rem;
}

.details-field-item {
    padding: 0.85rem 1rem;
    border-radius: 0.9rem;
    border: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(247,250,250,0.95));
}

.details-field-item span {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--muted);
    margin-bottom: 0.3rem;
}

.details-field-item strong {
    display: block;
    font-size: 1rem;
    color: var(--brand-900);
}

.details-field-item.dfi-featured {
    background: linear-gradient(135deg, rgba(22,97,109,0.07), rgba(232,157,44,0.1));
    border-color: rgba(22,97,109,0.15);
}

.details-field-item.dfi-featured strong {
    font-size: 1.35rem;
    letter-spacing: -0.02em;
}

/* Details page � section divider header */
.details-section-label {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.9rem;
}

.details-section-label h3 {
    margin: 0;
}

.details-section-divider {
    flex: 1;
    height: 1px;
    background: var(--border);
}

/* RO Master active/inactive badge */
.ro-active-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.26rem 0.65rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
}

.ro-active-badge.active   { background: rgba(21,128,61,0.12);  color: #15803d; }
.ro-active-badge.blocked  { background: rgba(185,28,28,0.1);   color: #b91c1c; }
.ro-active-badge.force-on { background: rgba(232,157,44,0.14); color: #7a4500; }
.ro-active-badge.force-off{ background: rgba(100,116,139,0.1); color: #475569; }

/* Historical sales � trading area card highlight */
.trading-area-card {
    padding: 1rem 1.1rem;
    border-radius: 1rem;
    border: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(246,249,250,0.96));
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.trading-area-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 24px rgba(18,51,59,0.08);
}

.trading-area-card.tac-top {
    background: linear-gradient(135deg, rgba(22,97,109,0.08), rgba(22,97,109,0.03));
    border-color: rgba(22,97,109,0.2);
}

.trading-area-card.tac-low {
    background: linear-gradient(135deg, rgba(185,28,28,0.06), rgba(185,28,28,0.02));
    border-color: rgba(185,28,28,0.15);
}

.trading-area-card span {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--muted);
    margin-bottom: 0.3rem;
}

.trading-area-card strong {
    display: block;
    font-size: 1rem;
    color: var(--brand-900);
    line-height: 1.3;
}

.trading-area-card small {
    display: block;
    font-size: 0.78rem;
    color: var(--muted);
    margin-top: 0.25rem;
}

/* Summary card with small subtext (Historical) */
.summary-card small {
    display: block;
    font-size: 0.76rem;
    color: var(--muted);
    margin-top: 0.15rem;
}

.summary-card-alert {
    border-color: rgba(185,28,28,0.2);
    background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(254,242,242,0.95));
}

.summary-card-alert strong { color: #b91c1c; }
.summary-card-alert span   { color: #b91c1c; }

/* Submission table � row-finalized highlight */
.submission-records-table tbody tr.row-finalized td {
    background: rgba(13,148,136,0.05);
}

/* Status badges in submission table - smaller fit */
.submission-records-table .status-badge {
    font-size: 0.68rem;
    padding: 0.22rem 0.55rem;
}

/* Manager filter card - styled inputs */
.manager-filter-card {
    background: linear-gradient(135deg, #ffffff 0%, #f8fafb 100%);
    border: 1px solid rgba(22,97,109,0.08);
    box-shadow: 0 4px 20px rgba(18,51,59,0.04);
}

.manager-filter-card .form-control,
.manager-filter-card .form-select {
    border-radius: 0.75rem;
    border-color: rgba(17,57,65,0.12);
    font-size: 0.88rem;
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
    background-color: #fff;
    transition: all 0.2s ease;
}

.manager-filter-card .form-control:focus,
.manager-filter-card .form-select:focus {
    border-color: var(--brand-500);
    box-shadow: 0 0 0 0.25rem rgba(22,97,109,0.08);
    transform: translateY(-1px);
}

.manager-filter-card .form-label {
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--brand-700);
    margin-bottom: 0.45rem;
    opacity: 0.85;
}

/* Submission table enhancements */
.submission-records-table-wrap {
    max-height: 70vh;
    overflow: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    border-radius: 1rem;
    border: 1px solid rgba(22,97,109,0.1);
    box-shadow: 0 10px 30px rgba(18,51,59,0.06);
    background: #fff;
}

.submission-records-table {
    width: max-content;
    min-width: 2160px;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
}

.submission-records-table col.sr-col-select { width: 54px; }
.submission-records-table col.sr-col-date { width: 118px; }
.submission-records-table col.sr-col-sales { width: 150px; }
.submission-records-table col.sr-col-dealer { width: 112px; }
.submission-records-table col.sr-col-ro { width: 240px; }
.submission-records-table col.sr-col-fuel { width: 78px; }
.submission-records-table col.sr-col-stock { width: 92px; }
.submission-records-table col.sr-col-remarks { width: 240px; }
.submission-records-table col.sr-col-status { width: 110px; }
.submission-records-table col.sr-col-workflow { width: 210px; }
.submission-records-table col.sr-col-updated { width: 116px; }
.submission-records-table col.sr-col-actions { width: 250px; }

.submission-records-table thead th {
    position: static;
    background-color: #f1f5f9;
    color: var(--brand-900);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.85rem 0.75rem;
    vertical-align: middle;
    white-space: nowrap;
    border-bottom: 1px solid rgba(22,97,109,0.08);
    border-right: 1px solid rgba(22,97,109,0.06);
}

.submission-records-table thead tr:last-child th {
    border-bottom: 2px solid rgba(22,97,109,0.1);
}

.submission-records-table thead th:last-child,
.submission-records-table td:last-child {
    border-right: none;
}

.submission-records-table tbody tr {
    transition: background-color 0.15s ease;
}

.submission-records-table tbody tr:hover {
    background-color: rgba(22,97,109,0.02) !important;
}

.submission-records-table td {
    padding: 0.85rem 0.75rem;
    font-size: 0.85rem;
    border-right: 1px solid rgba(22,97,109,0.04);
}

.submission-records-table .sr-head-checkbox,
.submission-records-table .sr-cell-checkbox {
    text-align: center;
    vertical-align: middle;
}

.submission-records-table .sr-head-checkbox input,
.submission-records-table .sr-cell-checkbox input {
    margin: 0;
}

/* Section card with top accent for manager sections */
.section-card-accent {
    border-top: 3px solid var(--brand-700);
}

/* -- End Manager UI Enhancements ------------------------------- */

/* ── WhatsApp Modal ─────────────────────────────────────────── */
.wa-modal-dialog {
    max-width: 440px;
}

.wa-modal-content {
    border: none;
    border-radius: 1.4rem;
    overflow: hidden;
    box-shadow: 0 32px 80px rgba(15,23,42,0.18);
}

/* Header */
.wa-modal-header {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 22px 24px 18px;
    background: linear-gradient(135deg, #1a7a3c, #25a550);
    color: #fff;
}

.wa-modal-icon {
    font-size: 28px;
    line-height: 1;
    flex-shrink: 0;
}

.wa-modal-header-text {
    flex: 1;
}

.wa-modal-eyebrow {
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: rgba(255,255,255,0.72);
    margin-bottom: 2px;
}

.wa-modal-title {
    font-size: 17px;
    font-weight: 700;
    margin: 0;
    color: #fff;
    letter-spacing: -0.01em;
}

.wa-modal-close {
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.25);
    color: #fff;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s;
}

.wa-modal-close:hover {
    background: rgba(255,255,255,0.28);
}

/* Body */
.wa-modal-body {
    padding: 20px 24px;
    background: #f8faf9;
}

/* Preview card */
.wa-preview-card {
    background: #fff;
    border: 1px solid #d4e8d8;
    border-radius: 1rem;
    padding: 14px 16px;
    margin-bottom: 18px;
}

.wa-preview-label {
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #1a7a3c;
    margin-bottom: 10px;
}

.wa-preview-scope {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px dashed #d4e8d8;
}

.wa-preview-scope-item {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.wa-scope-key {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #6b8f74;
}

.wa-scope-val {
    font-size: 13px;
    font-weight: 700;
    color: #12333b;
}

/* Fuel summary grid inside preview */
.wa-fuel-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}

.wa-fuel-cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: #f0f9f2;
    border: 1px solid #c6e2cc;
    border-radius: 0.6rem;
    padding: 8px 4px 6px;
}

.wa-fuel-label {
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #1a7a3c;
    margin-bottom: 3px;
}

.wa-fuel-value {
    font-size: 16px;
    font-weight: 800;
    color: #12333b;
    line-height: 1;
    letter-spacing: -0.02em;
}

.wa-fuel-unit {
    font-size: 9px;
    font-weight: 600;
    color: #6b8f74;
    margin-top: 2px;
}

/* Recipient section */
.wa-recipient-section {
    margin-top: 4px;
}

.wa-input-label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: #12333b;
    margin-bottom: 8px;
}

.wa-input-group {
    display: flex;
    align-items: stretch;
    border: 1.5px solid #b0cbb5;
    border-radius: 0.75rem;
    overflow: hidden;
    background: #fff;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.wa-input-group:focus-within {
    border-color: #25a550;
    box-shadow: 0 0 0 3px rgba(37,165,80,0.12);
}

.wa-input-prefix {
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 700;
    color: #1a7a3c;
    background: #f0f9f2;
    border-right: 1.5px solid #b0cbb5;
    display: flex;
    align-items: center;
    white-space: nowrap;
    flex-shrink: 0;
}

.wa-input {
    flex: 1;
    border: none;
    outline: none;
    padding: 10px 14px;
    font-size: 14px;
    font-weight: 600;
    color: #12333b;
    background: transparent;
    letter-spacing: 0.03em;
}

.wa-input::placeholder {
    font-weight: 400;
    color: #9eb8a4;
    letter-spacing: 0;
}

.wa-input-hint {
    font-size: 11px;
    color: #6b8f74;
    margin-top: 6px;
}

.wa-validation-msg {
    font-size: 12px;
    color: #b91c1c;
    margin-top: 6px;
    font-weight: 600;
}

/* Footer */
.wa-modal-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 14px 24px 20px;
    background: #f8faf9;
    border-top: 1px solid #d4e8d8;
}

.wa-btn-cancel {
    background: transparent;
    border: 1.5px solid #b0cbb5;
    border-radius: 0.75rem;
    padding: 9px 20px;
    font-size: 13px;
    font-weight: 600;
    color: #4a6b52;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

.wa-btn-cancel:hover {
    background: #eaf3ec;
    border-color: #88b892;
}

.wa-btn-send {
    background: linear-gradient(135deg, #1a7a3c, #25a550);
    border: none;
    border-radius: 0.75rem;
    padding: 9px 22px;
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    cursor: pointer;
    letter-spacing: 0.01em;
    box-shadow: 0 4px 14px rgba(37,165,80,0.28);
    transition: opacity 0.15s, box-shadow 0.15s;
}

.wa-btn-send:hover {
    opacity: 0.92;
    box-shadow: 0 6px 20px rgba(37,165,80,0.36);
}
/* -- End WhatsApp Modal ---------------------------------------- */


.security-stepup-panel {
  border: 1px solid rgba(17, 57, 65, 0.12);
  border-radius: 1rem;
  padding: 1rem;
  background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(248,250,250,0.94));
}

.security-stepup-divider {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.security-stepup-divider::before,
.security-stepup-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: rgba(17, 57, 65, 0.12);
}

/* ═══════════════════════════════════════════════════════════════════
   MESSAGING MODULE
   ═══════════════════════════════════════════════════════════════════ */

/* Navbar unread badge */
.msg-nav-badge {
    position: absolute;
    top: 0.1rem;
    right: -0.35rem;
    font-size: 0.65rem;
    padding: 0.2em 0.45em;
    border-radius: 999px;
    line-height: 1;
    pointer-events: none;
}

/* ── Dealer chat card ── */
.msg-chat-card {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 220px);
    min-height: 420px;
    border: 1px solid var(--border);
    border-radius: 1.25rem;
    background: var(--card);
    overflow: hidden;
}

.msg-chat-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--border);
    background: rgba(244,247,248,0.7);
    flex-shrink: 0;
}

.msg-chat-avatar {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1rem;
    flex-shrink: 0;
    color: #fff;
}

.msg-avatar-manager { background: var(--brand-700); }
.msg-avatar-dealer  { background: var(--accent-500); color: var(--brand-900); }

.msg-chat-body {
    flex: 1;
    overflow-y: auto;
    padding: 1rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    scroll-behavior: smooth;
}

.msg-bubble {
    display: flex;
    flex-direction: column;
    max-width: 72%;
}

.msg-bubble-own {
    align-self: flex-end;
    align-items: flex-end;
}

.msg-bubble-other {
    align-self: flex-start;
    align-items: flex-start;
}

.msg-bubble-text {
    padding: 0.55rem 0.85rem;
    border-radius: 1.1rem;
    line-height: 1.5;
    word-break: break-word;
    white-space: pre-wrap;
    font-size: 0.9rem;
}

.msg-bubble-own .msg-bubble-text {
    background: var(--brand-700);
    color: #fff;
    border-bottom-right-radius: 0.3rem;
}

.msg-bubble-other .msg-bubble-text {
    background: #f0f4f5;
    color: var(--text);
    border-bottom-left-radius: 0.3rem;
}

.msg-bubble-meta {
    font-size: 0.72rem;
    color: var(--muted);
    margin-top: 0.2rem;
    padding: 0 0.1rem;
}

.msg-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    gap: 0.5rem;
    padding: 2rem;
    color: var(--muted);
    text-align: center;
}

.msg-empty-icon { font-size: 2.5rem; }

.msg-compose-area {
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border);
    background: rgba(244,247,248,0.6);
    flex-shrink: 0;
}

.msg-textarea {
    resize: none;
    border-radius: 0.75rem;
    font-size: 0.9rem;
    line-height: 1.4;
}

.msg-send-btn {
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 50%;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    align-self: flex-end;
}

.send-icon {
    font-size: 1.1rem;
    line-height: 1;
}

/* ── Manager two-panel layout ── */
.msg-manager-shell {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 1rem;
    height: calc(100vh - 200px);
    min-height: 480px;
}

.msg-left-panel {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--border);
    border-radius: 1.25rem;
    background: var(--card);
    overflow: hidden;
}

.msg-left-search {
    padding: 0.75rem;
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
}

.msg-left-list {
    flex: 1;
    overflow-y: auto;
}

.msg-dealer-item {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.75rem 0.9rem;
    cursor: pointer;
    border-bottom: 1px solid rgba(213,224,227,0.5);
    transition: background 0.15s;
}

.msg-dealer-item:hover,
.msg-dealer-item.active {
    background: rgba(22,97,109,0.07);
}

.msg-dealer-item.active {
    border-left: 3px solid var(--brand-700);
}

.msg-dealer-info {
    flex: 1;
    min-width: 0;
}

.msg-dealer-name { font-size: 0.875rem; }
.msg-dealer-code { font-size: 0.75rem; }
.msg-dealer-preview { font-size: 0.75rem; }
.msg-unread-badge { font-size: 0.7rem; flex-shrink: 0; }

/* Right panel */
.msg-right-panel {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.msg-right-panel .msg-chat-card {
    height: 100%;
}

/* Broadcast modal dealer picker */
.msg-dealer-picker-list {
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid var(--border);
    border-radius: 0.5rem;
    padding: 0.5rem 0.75rem;
}

.msg-picker-item {
    padding: 0.3rem 0;
    border-bottom: 1px solid rgba(213,224,227,0.4);
}
.msg-picker-item:last-child { border-bottom: none; }
.msg-picker-item.d-none { display: none !important; }

@media (max-width: 767px) {
    .msg-manager-shell {
        grid-template-columns: 1fr;
        height: auto;
    }
    .msg-left-panel {
        max-height: 260px;
    }
    .msg-chat-card {
        height: 420px;
    }
}

/* ── Notification prompt UI ── */

/* Denied banner */
.msg-notif-denied-banner {
    border-radius: 0.75rem;
    font-size: 0.875rem;
    background: rgba(255, 193, 7, 0.12);
    border-color: rgba(255, 193, 7, 0.4);
    color: var(--text);
}

.msg-notif-banner-icon {
    font-size: 1.1rem;
    flex-shrink: 0;
}

.msg-notif-how-btn {
    white-space: nowrap;
    font-size: 0.8rem;
    padding: 0.2rem 0.6rem;
    background: rgba(255, 193, 7, 0.3);
    border-color: rgba(255, 193, 7, 0.6);
    color: var(--text);
}

.msg-notif-how-btn:hover {
    background: rgba(255, 193, 7, 0.5);
    border-color: rgba(255, 193, 7, 0.8);
    color: var(--text);
}

/* Enable notifications modal – keep it compact */
#msgNotifPromptModal .modal-dialog {
    max-width: 360px;
}

.portal-hero-media-panel {
    min-height: 100%;
}

.hero-media-card {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.hero-media-frame,
.portal-visual-thumb,
.dealer-visual-hero,
.dealer-side-thumb {
    position: relative;
    overflow: hidden;
    border-radius: 1.15rem;
    background: linear-gradient(145deg, rgba(22,97,109,0.12), rgba(232,157,44,0.18));
}

.hero-media-frame {
    min-height: 260px;
    border: 1px solid rgba(22,97,109,0.14);
}

.hero-media-frame img,
.portal-visual-thumb img,
.dealer-visual-hero img,
.dealer-side-thumb img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.hero-media-fallback,
.portal-visual-fallback,
.dealer-visual-fallback {
    min-height: 100%;
    display: grid;
    place-items: center;
    color: var(--brand-900);
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 1rem;
    text-align: center;
}

.visual-meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    color: var(--muted);
    font-size: 0.82rem;
}

.visual-meta-row a {
    color: var(--brand-700);
    font-weight: 600;
    text-decoration: none;
}

.portal-visual-gallery {
    padding: 1.5rem;
    border: 1px solid rgba(22,97,109,0.12);
    border-radius: 1.4rem;
    background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(246,249,250,0.98));
    box-shadow: 0 14px 30px rgba(18, 51, 59, 0.06);
}

.portal-visual-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.portal-visual-card {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--border);
    border-radius: 1.15rem;
    overflow: hidden;
    background: rgba(255,255,255,0.96);
    box-shadow: 0 12px 24px rgba(18, 51, 59, 0.06);
}

.portal-visual-card-accent {
    background: linear-gradient(180deg, rgba(250,252,252,0.98), rgba(241,247,248,0.98));
}

.portal-visual-thumb {
    min-height: 190px;
}

.portal-visual-copy-block {
    padding: 1rem;
}

.portal-visual-kicker {
    display: inline-flex;
    margin-bottom: 0.55rem;
    color: var(--brand-700);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.portal-visual-copy-block h3 {
    font-size: 1rem;
    margin-bottom: 0.55rem;
}

.portal-visual-copy-block p {
    margin: 0;
    color: var(--muted);
    line-height: 1.5;
    font-size: 0.92rem;
}

.dealer-visual-showcase {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, 0.9fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.dealer-visual-main,
.dealer-side-card {
    border: 1px solid rgba(22,97,109,0.12);
    border-radius: 1.25rem;
    background: rgba(255,255,255,0.97);
    box-shadow: 0 14px 28px rgba(18, 51, 59, 0.06);
}

.dealer-visual-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.92fr);
    gap: 1rem;
    padding: 1.1rem;
}

.dealer-visual-copy {
    align-self: center;
}

.dealer-visual-hero {
    min-height: 260px;
}

.dealer-visual-meta {
    position: absolute;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    padding: 0.85rem 0.95rem;
    border-radius: 0.95rem;
    background: rgba(255,255,255,0.88);
    backdrop-filter: blur(10px);
}

.dealer-visual-meta strong {
    color: var(--brand-900);
}

.dealer-visual-meta span:last-child {
    color: var(--muted);
    font-size: 0.82rem;
}

.dealer-visual-side-grid {
    display: grid;
    gap: 1rem;
}

.dealer-side-card {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 0.9rem;
    padding: 0.8rem;
    align-items: center;
}

.dealer-side-thumb {
    min-height: 116px;
}

.dealer-side-copy span {
    display: inline-flex;
    margin-bottom: 0.45rem;
    color: var(--brand-700);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dealer-side-copy strong {
    display: block;
    margin-bottom: 0.35rem;
}

.dealer-side-copy small {
    color: var(--muted);
    line-height: 1.45;
}

@media (max-width: 1199.98px) {
    .portal-visual-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dealer-visual-showcase,
    .dealer-visual-main {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .portal-visual-grid,
    .dealer-side-card {
        grid-template-columns: 1fr;
    }

    .hero-media-frame,
    .portal-visual-thumb,
    .dealer-visual-hero,
    .dealer-side-thumb {
        min-height: 220px;
    }
}

.maintenance-body {
    min-height: 100vh;
    margin: 0;
    font-family: "Segoe UI Variable Text", "Trebuchet MS", "Lucida Sans", sans-serif;
    color: #f5f0e7;
    background:
        radial-gradient(circle at 12% 18%, rgba(255, 174, 92, 0.28), transparent 24%),
        radial-gradient(circle at 86% 22%, rgba(62, 185, 164, 0.2), transparent 24%),
        radial-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(135deg, #08131c 0%, #10263a 42%, #1d2338 100%);
    background-size: auto, auto, 30px 30px, auto;
}

.maintenance-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 2rem;
}

.maintenance-stage {
    position: relative;
    width: min(1180px, 100%);
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 2rem;
    background:
        linear-gradient(145deg, rgba(12, 21, 31, 0.9), rgba(17, 28, 41, 0.84)),
        linear-gradient(135deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02));
    box-shadow: 0 35px 90px rgba(0, 0, 0, 0.35);
    backdrop-filter: blur(18px);
}

.maintenance-orb {
    position: absolute;
    border-radius: 999px;
    filter: blur(18px);
    opacity: 0.78;
    pointer-events: none;
}

.maintenance-orb-a {
    width: 240px;
    height: 240px;
    top: -68px;
    right: -36px;
    background: radial-gradient(circle, rgba(255, 170, 88, 0.8), rgba(255, 170, 88, 0));
    animation: maintenanceOrbDrift 14s ease-in-out infinite;
}

.maintenance-orb-b {
    width: 320px;
    height: 320px;
    left: -90px;
    bottom: -140px;
    background: radial-gradient(circle, rgba(54, 190, 168, 0.54), rgba(54, 190, 168, 0));
    animation: maintenanceOrbDrift 18s ease-in-out infinite 2s reverse;
}

.maintenance-orb-c {
    width: 260px;
    height: 260px;
    top: 38%;
    left: 42%;
    background: radial-gradient(circle, rgba(160, 110, 255, 0.22), rgba(160, 110, 255, 0));
    animation: maintenanceOrbDrift 22s ease-in-out infinite 5s;
}

.maintenance-grid {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
    gap: 1.5rem;
    padding: 2.2rem;
}

.maintenance-copy {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    justify-content: center;
}

.maintenance-kicker {
    display: inline-flex;
    align-self: flex-start;
    padding: 0.45rem 0.82rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: #ffd18a;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.maintenance-status-pill {
    display: inline-flex;
    align-self: flex-start;
    padding: 0.5rem 0.9rem;
    border-radius: 999px;
    background: rgba(62, 185, 164, 0.12);
    border: 1px solid rgba(62, 185, 164, 0.22);
    color: #9cefe0;
    font-weight: 700;
}

.maintenance-body.active .maintenance-status-pill {
    background: rgba(255, 170, 88, 0.14);
    border-color: rgba(255, 170, 88, 0.28);
    color: #ffd18a;
}

.maintenance-body.restored .maintenance-status-pill {
    background: rgba(122, 231, 164, 0.12);
    border-color: rgba(122, 231, 164, 0.25);
    color: #b7ffd3;
}

.maintenance-title {
    margin: 0;
    font-size: clamp(2.8rem, 5vw, 5rem);
    line-height: 0.94;
    letter-spacing: -0.05em;
    max-width: 11ch;
    color: #fff6ea;
}

.maintenance-lead {
    margin: 0;
    max-width: 58ch;
    color: rgba(245, 240, 231, 0.8);
    font-size: 1.04rem;
    line-height: 1.75;
}

.maintenance-highlights {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.maintenance-highlight {
    display: flex;
    flex-direction: column;
    padding: 1rem 1.05rem;
    border-radius: 1.2rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.05);
    transition: border-color 0.2s ease, background 0.2s ease;
}

.maintenance-highlight:hover {
    border-color: rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.08);
}

.maintenance-highlight strong {
    display: block;
    margin-bottom: 0.45rem;
    color: #fff6ea;
}

.maintenance-highlight span {
    color: rgba(245, 240, 231, 0.72);
    line-height: 1.55;
}

.maintenance-panel {
    display: grid;
    gap: 1rem;
    padding: 1.3rem;
    border-radius: 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.04));
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
}

.maintenance-panel-label {
    display: inline-flex;
    padding: 0.35rem 0.68rem;
    border-radius: 999px;
    background: rgba(255, 209, 138, 0.1);
    color: #ffd18a;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.maintenance-panel-copy {
    margin: 0.75rem 0 0;
    color: rgba(245, 240, 231, 0.75);
    line-height: 1.6;
}

.maintenance-countdown-card {
    padding: 1.15rem;
    border-radius: 1.35rem;
    background:
        linear-gradient(160deg, rgba(255, 170, 88, 0.14), rgba(62, 185, 164, 0.08)),
        rgba(9, 15, 24, 0.62);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.maintenance-digits {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.8rem;
}

.maintenance-digit {
    padding: 1rem 0.7rem;
    border-radius: 1rem;
    text-align: center;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.07);
}

.maintenance-digit strong {
    display: block;
    font-size: clamp(1.8rem, 4vw, 2.6rem);
    line-height: 1;
    letter-spacing: -0.04em;
    color: #ffffff;
}

.maintenance-digit span {
    display: block;
    margin-top: 0.45rem;
    color: rgba(245, 240, 231, 0.72);
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.maintenance-meta-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.maintenance-meta-card {
    padding: 0.95rem 1rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.07);
}

.maintenance-meta-card span {
    display: block;
    color: rgba(245, 240, 231, 0.62);
    font-size: 0.73rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.maintenance-meta-card strong {
    display: block;
    margin-top: 0.4rem;
    color: #fff6ea;
    line-height: 1.45;
}

.maintenance-actions {
    display: flex;
    gap: 0.8rem;
    flex-wrap: wrap;
}

.maintenance-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0.85rem 1.2rem;
    border-radius: 999px;
    text-decoration: none;
    font-weight: 700;
    transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

.maintenance-button:hover {
    transform: translateY(-2px);
}

.maintenance-button-primary {
    background: linear-gradient(135deg, #ffb35c, #ef8d2f);
    color: #2b1805;
    box-shadow: 0 16px 28px rgba(239, 141, 47, 0.2);
}

.maintenance-button-primary:hover {
    background: linear-gradient(135deg, #ffc06e, #f5922a);
    box-shadow: 0 20px 38px rgba(239, 141, 47, 0.38);
}

.maintenance-button-secondary {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: #f5f0e7;
}

.maintenance-button-secondary:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.2);
}

.maintenance-button:active {
    transform: translateY(0px) scale(0.98);
}

@keyframes maintenanceFloat {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-8px); }
}

@keyframes maintenanceOrbDrift {
    0%, 100% { transform: translate(0px, 0px) scale(1); }
    25% { transform: translate(-14px, 9px) scale(1.06); }
    75% { transform: translate(9px, -14px) scale(0.94); }
}

@keyframes maintenancePulseDot {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.55; transform: scale(1.25); }
}

@keyframes maintenanceProgressShimmer {
    0% { left: -60px; opacity: 0; }
    20% { opacity: 1; }
    100% { left: 100%; opacity: 0; }
}

.maintenance-digit,
.maintenance-highlight {
    animation: maintenanceFloat 7s ease-in-out infinite;
}

.maintenance-digit:nth-child(2),
.maintenance-highlight:nth-child(2) {
    animation-delay: 0.35s;
}

.maintenance-digit:nth-child(3),
.maintenance-highlight:nth-child(3) {
    animation-delay: 0.7s;
}

/* Brand bar */
.maintenance-brand-bar {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 2.2rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    background: rgba(255, 255, 255, 0.02);
}

.maintenance-brand-logo {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    color: #fff6ea;
    font-weight: 800;
    font-size: 1rem;
    letter-spacing: -0.01em;
}

.maintenance-brand-logo svg {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    color: #ffb35c;
}

.maintenance-brand-badge {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: rgba(245, 240, 231, 0.42);
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Pulse dot */
.maintenance-pulse-dot {
    display: inline-block;
    vertical-align: middle;
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: currentColor;
    margin-right: 0.5rem;
    flex-shrink: 0;
    animation: maintenancePulseDot 2.2s ease-in-out infinite;
}

/* Highlight icons */
.maintenance-highlight-icon {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: rgba(255, 179, 92, 0.1);
    border: 1px solid rgba(255, 179, 92, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.7rem;
    color: #ffb35c;
    flex-shrink: 0;
}

.maintenance-highlight-icon svg {
    width: 16px;
    height: 16px;
}

/* Button icons */
.maintenance-btn-icon {
    width: 15px;
    height: 15px;
    margin-right: 0.45rem;
    flex-shrink: 0;
}

/* Progress bar */
.maintenance-progress-wrap {
    padding: 1rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.07);
}

.maintenance-progress-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.7rem;
    font-size: 0.71rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: rgba(245, 240, 231, 0.52);
}

.maintenance-progress-pct {
    font-size: 0.78rem;
    color: #ffb35c;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: none;
}

.maintenance-progress-track {
    height: 5px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    overflow: hidden;
}

.maintenance-progress-fill {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #36bea8 0%, #ffb35c 100%);
    transition: width 1s linear;
    position: relative;
    overflow: hidden;
    min-width: 0;
}

.maintenance-progress-fill::after {
    content: '';
    position: absolute;
    top: 0;
    left: -60px;
    bottom: 0;
    width: 60px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.55), transparent);
    animation: maintenanceProgressShimmer 2.8s ease-in-out infinite;
}

/* State-specific digit coloring */
.maintenance-body.active .maintenance-digit {
    background: rgba(255, 170, 88, 0.08);
    border-color: rgba(255, 170, 88, 0.15);
}

.maintenance-body.active .maintenance-digit strong {
    color: #ffd18a;
}

.maintenance-body.restored .maintenance-digit {
    background: rgba(122, 231, 164, 0.08);
    border-color: rgba(122, 231, 164, 0.15);
}

.maintenance-body.restored .maintenance-digit strong {
    color: #b7ffd3;
}

/* State-specific stage glow */
.maintenance-body.active .maintenance-stage {
    border-color: rgba(255, 170, 88, 0.22);
    box-shadow: 0 35px 90px rgba(0, 0, 0, 0.35), 0 0 70px rgba(255, 150, 50, 0.07);
}

.maintenance-body.restored .maintenance-stage {
    border-color: rgba(122, 231, 164, 0.22);
    box-shadow: 0 35px 90px rgba(0, 0, 0, 0.35), 0 0 70px rgba(54, 190, 120, 0.08);
}

@media (max-width: 1199px) {
    .maintenance-grid,
    .maintenance-highlights {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .maintenance-shell {
        padding: 1rem;
    }

    .maintenance-brand-bar {
        padding: 0.85rem 1.2rem;
    }

    .maintenance-brand-badge {
        display: none;
    }

    .maintenance-grid {
        padding: 1.2rem;
    }

    .maintenance-digits,
    .maintenance-meta-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .maintenance-actions {
        flex-direction: column;
    }

    .maintenance-button {
        width: 100%;
    }
}

/* ============================================================
   DARK THEME — structural overrides
   (CSS variable changes in :root / [data-theme="dark"] block
   handle most components; these target hardcoded backgrounds)
   ============================================================ */

[data-theme="dark"] body {
    background:
        radial-gradient(circle at top right, rgba(232, 157, 44, 0.06), transparent 22%),
        linear-gradient(180deg, #090f17 0%, #0d1b24 100%);
}

[data-theme="dark"] .site-header {
    background: rgba(8, 14, 22, 0.92);
    border-color: rgba(255, 255, 255, 0.07) !important;
}

[data-theme="dark"] .hero-card,
[data-theme="dark"] .portal-hero {
    background: linear-gradient(135deg, rgba(17, 34, 52, 0.97), rgba(13, 27, 36, 0.94));
    border-color: var(--border);
    box-shadow: 0 22px 50px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .hero-panel-card {
    background: rgba(14, 28, 42, 0.92);
    border-color: rgba(38, 130, 143, 0.2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .hero-stat-tile {
    background: linear-gradient(180deg, rgba(17, 34, 52, 0.97), rgba(13, 25, 38, 0.95));
    border-color: var(--border);
}

[data-theme="dark"] .feature-card {
    background: rgba(14, 28, 42, 0.95);
    border-color: var(--border);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22);
}

[data-theme="dark"] .business-band {
    background: linear-gradient(180deg, rgba(17, 34, 52, 0.96), rgba(12, 25, 38, 0.96));
    border-color: var(--border);
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.22);
}

[data-theme="dark"] .band-item {
    background: var(--card);
}

[data-theme="dark"] .login-card {
    background: rgba(13, 24, 36, 0.98);
    border-color: var(--border);
    box-shadow: 0 24px 50px rgba(0, 0, 0, 0.35);
}

[data-theme="dark"] .login-form-panel {
    background: rgba(10, 19, 30, 0.98);
}

[data-theme="dark"] .ro-meta div {
    background: var(--card);
}

[data-theme="dark"] .print-shell {
    background: var(--card);
    color: var(--text);
}

[data-theme="dark"] .metric-card,
[data-theme="dark"] .summary-card,
[data-theme="dark"] .section-card {
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.22);
}

[data-theme="dark"] .cbc-labs-modal {
    background: var(--card);
    color: var(--text);
}

[data-theme="dark"] .manager-control-modal {
    background: var(--card);
    color: var(--text);
}

/* ============================================================
   THEME PICKER BUTTON
   ============================================================ */

.theme-picker-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border-radius: 50%;
    border: 1px solid var(--border);
    background: transparent;
    color: var(--text);
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
    flex-shrink: 0;
}

.theme-picker-btn:hover {
    background: rgba(22, 97, 109, 0.08);
    border-color: rgba(22, 97, 109, 0.32);
    color: var(--brand-700);
}

.theme-picker-btn svg {
    width: 15px;
    height: 15px;
    pointer-events: none;
}

.theme-picker-menu {
    min-width: 140px;
    font-size: 0.875rem;
}

.theme-picker-option.active-choice {
    background: rgba(22, 97, 109, 0.1);
    color: var(--brand-700);
    font-weight: 600;
}

[data-theme="dark"] .theme-picker-btn {
    border-color: rgba(255, 255, 255, 0.14);
    color: var(--text);
}

[data-theme="dark"] .theme-picker-btn:hover {
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.24);
    color: #dce8ec;
}

[data-theme="dark"] .theme-picker-option.active-choice {
    background: rgba(38, 130, 143, 0.15);
    color: #7dd4de;
}

/* ============================================================
   DARK THEME — component-level overrides (hardcoded whites)
   ============================================================ */

[data-theme="dark"] .site-footer-fixed {
    background: rgba(8, 14, 22, 0.92);
    border-top-color: rgba(255, 255, 255, 0.07) !important;
}

/* Profile */
[data-theme="dark"] .profile-kv div {
    background: var(--card);
}

/* Historical sales panel */
[data-theme="dark"] .historical-panel {
    background: var(--card);
}

/* Indent form cards */
[data-theme="dark"] .indent-summary-metric,
[data-theme="dark"] .indent-summary-datebox,
[data-theme="dark"] .indent-entry-card {
    background: linear-gradient(180deg, rgba(18, 34, 50, 0.97), rgba(13, 25, 38, 0.96));
}

[data-theme="dark"] .indent-master-card .ro-meta div {
    background: var(--card);
    box-shadow: none;
}

[data-theme="dark"] .indent-master-card .portal-chip {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .indent-number-input,
[data-theme="dark"] .indent-date-input,
[data-theme="dark"] .indent-remarks-input {
    background: var(--card) !important;
}

[data-theme="dark"] .indent-number-readonly {
    background: rgba(255, 255, 255, 0.04) !important;
}

[data-theme="dark"] .indent-helper-note {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.07);
}

[data-theme="dark"] .indent-remarks-card {
    background: var(--card);
}

[data-theme="dark"] .indent-submit-bar {
    background: linear-gradient(180deg, rgba(17, 30, 44, 0.97), rgba(12, 22, 34, 0.97));
    border-color: rgba(255, 255, 255, 0.07);
}

[data-theme="dark"] .indent-secondary-btn {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.12);
    color: var(--text);
}

[data-theme="dark"] .indent-secondary-btn:hover,
[data-theme="dark"] .indent-secondary-btn:focus {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.2);
    color: var(--text);
}

/* OTP page */
[data-theme="dark"] .otp-card {
    background: var(--card);
}

/* Manager summary cards */
[data-theme="dark"] .summary-card-manager {
    background: var(--card);
}

[data-theme="dark"] .manager-action-toolbar {
    background: linear-gradient(135deg, rgba(17, 30, 44, 0.97), rgba(13, 25, 38, 0.95));
    border-color: rgba(255, 255, 255, 0.07);
}

/* Details field items */
[data-theme="dark"] .details-field-item {
    background: linear-gradient(180deg, rgba(17, 34, 50, 0.97), rgba(13, 25, 38, 0.95));
}

/* Manager text fixes */
[data-theme="dark"] .manager-reset-kv dd { color: var(--text); }
[data-theme="dark"] .manager-reset-kv dt { color: var(--muted); }
[data-theme="dark"] .manager-hero-chip.mhc-count { color: #e8b96e; }
[data-theme="dark"] .ro-active-badge.force-on  { color: #e8b96e; }
[data-theme="dark"] .ro-active-badge.force-off { color: var(--muted); }

/* Submission table */
[data-theme="dark"] .submission-review-form {
    background: rgba(17, 30, 44, 0.95);
    border-color: var(--border);
}

[data-theme="dark"] .bulk-action-bar {
    background: rgba(255, 255, 255, 0.04);
    border-color: var(--border);
}

[data-theme="dark"] .bulk-selected-pill {
    color: #7ec8e3;
    background: rgba(38, 130, 143, 0.12);
}

[data-theme="dark"] .submission-records-table-wrap {
    background: var(--card);
    border-color: var(--border);
    box-shadow: none;
}

[data-theme="dark"] .submission-records-table thead th {
    background: rgba(10, 20, 32, 0.95);
    border-color: var(--border);
}

[data-theme="dark"] .submission-records-table tbody tr:hover {
    background-color: rgba(38, 130, 143, 0.05) !important;
}

/* Manager filter card */
[data-theme="dark"] .manager-filter-card {
    background: linear-gradient(135deg, rgba(17, 30, 44, 0.97), rgba(13, 25, 38, 0.95));
    border-color: rgba(255, 255, 255, 0.07);
}

[data-theme="dark"] .manager-filter-card .form-control,
[data-theme="dark"] .manager-filter-card .form-select {
    background-color: var(--card) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}

/* Session cards */
[data-theme="dark"] .session-card {
    background: linear-gradient(180deg, rgba(17, 34, 50, 0.97), rgba(13, 25, 38, 0.96));
}

[data-theme="dark"] .session-meta-grid div {
    background: var(--card);
    border-color: var(--border);
}

/* Ajax loading overlay */
[data-theme="dark"] .ajax-shell-loading::after {
    background: rgba(0, 0, 0, 0.35);
}

/* Trading area cards */
[data-theme="dark"] .trading-area-card {
    background: linear-gradient(180deg, rgba(17, 34, 50, 0.97), rgba(13, 25, 38, 0.96));
}

/* Alert summary card */
[data-theme="dark"] .summary-card-alert {
    background: linear-gradient(180deg, rgba(22, 10, 10, 0.97), rgba(17, 7, 7, 0.96));
    border-color: rgba(185, 28, 28, 0.25);
}

/* Profile complete alert */
[data-theme="dark"] .profile-complete-alert {
    background: linear-gradient(180deg, rgba(35, 22, 5, 0.97), rgba(28, 15, 2, 0.96));
    color: #e8b96e;
    border-color: rgba(232, 157, 44, 0.25);
}

/* WhatsApp modal */
[data-theme="dark"] .wa-modal-body {
    background: var(--card);
}

[data-theme="dark"] .wa-preview-card {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .wa-fuel-cell {
    background: rgba(38, 130, 143, 0.1);
    border-color: rgba(38, 130, 143, 0.18);
}

[data-theme="dark"] .wa-scope-val,
[data-theme="dark"] .wa-input-label,
[data-theme="dark"] .wa-fuel-value { color: var(--text); }

[data-theme="dark"] .wa-input-group {
    background: var(--card);
    border-color: var(--border);
}

[data-theme="dark"] .wa-input-prefix {
    background: rgba(255, 255, 255, 0.04);
    border-right-color: var(--border);
}

/* Chart canvas containers — ensure dark bg shows through */
[data-theme="dark"] .chart-shell {
    background: transparent;
}

.document-hero {
    align-items: stretch;
}

.document-hero-panel {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.document-stat-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.document-stat-card {
    padding: 1rem;
    border-radius: 1rem;
    border: 1px solid rgba(22, 97, 109, 0.14);
    background: linear-gradient(180deg, rgba(255,255,255,0.92), rgba(244, 249, 249, 0.88));
}

.document-stat-card span,
.document-meta-grid dt {
    display: block;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--muted);
}

.document-stat-card strong {
    display: block;
    margin-top: 0.45rem;
    font-size: 1.5rem;
    line-height: 1;
}

.document-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1.25rem;
}

.document-card {
    border: 1px solid rgba(22, 97, 109, 0.12);
    border-radius: 1.2rem;
    background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(248,251,251,0.94));
    padding: 1.25rem;
    box-shadow: 0 18px 40px rgba(18, 51, 59, 0.08);
}

.document-card-mandatory {
    box-shadow: 0 20px 45px rgba(232, 157, 44, 0.14);
    border-color: rgba(232, 157, 44, 0.32);
}

.document-meta-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0.85rem;
    margin: 0;
}

.document-meta-grid dd {
    margin: 0.25rem 0 0;
    font-weight: 600;
}

.document-note {
    padding: 0.8rem 0.95rem;
    border-radius: 0.85rem;
    background: rgba(22, 97, 109, 0.06);
}

.manager-note {
    background: rgba(232, 157, 44, 0.14);
}

.history-stack {
    display: grid;
    gap: 0.85rem;
    margin-top: 0.75rem;
}

.history-card {
    padding: 0.85rem 0.95rem;
    border-radius: 0.9rem;
    border: 1px solid rgba(22, 97, 109, 0.1);
    background: rgba(255,255,255,0.85);
}

.history-log-list {
    padding-left: 1rem;
    color: var(--muted);
    font-size: 0.85rem;
}

.empty-state-card {
    padding: 2rem;
    border-radius: 1rem;
    text-align: center;
    background: linear-gradient(180deg, rgba(255,255,255,0.94), rgba(242,246,246,0.95));
    border: 1px dashed rgba(22, 97, 109, 0.24);
}

.expiry-monitor-table .expiry-row-expired td {
    background: rgba(198, 40, 40, 0.12);
}

.expiry-monitor-table .expiry-row-near td {
    background: rgba(255, 167, 38, 0.14);
}

.response-context,
.review-context {
    line-height: 1.55;
}

@media (max-width: 991.98px) {
    .document-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .document-stat-grid {
        grid-template-columns: 1fr;
    }

    .document-card-grid {
        grid-template-columns: 1fr;
    }
}

.file-selection-status {
    padding: 0.75rem 0.9rem;
    border-radius: 0.85rem;
    border: 1px dashed rgba(22, 97, 109, 0.18);
    background: rgba(22, 97, 109, 0.04);
    color: var(--muted);
    font-size: 0.9rem;
}

.file-selection-status.is-ready {
    border-style: solid;
    border-color: rgba(34, 197, 94, 0.35);
    background: rgba(34, 197, 94, 0.12);
    color: #166534;
}

.file-selection-status.is-info {
    border-style: solid;
    border-color: rgba(232, 157, 44, 0.35);
    background: rgba(232, 157, 44, 0.12);
    color: #8a5b12;
}

.ro-documents-popup {
    border: 0;
    border-radius: 28px;
    overflow: hidden;
    background: linear-gradient(160deg, rgba(246, 241, 232, 0.96), rgba(255, 255, 255, 0.98));
    box-shadow: 0 28px 80px rgba(30, 41, 59, 0.18);
}

.ro-documents-popup .modal-header,
.ro-documents-popup .modal-footer {
    background: transparent;
}

.ro-documents-popup-lead {
    font-size: 1rem;
    color: #475569;
}

.ro-documents-popup-list {
    list-style: none;
    padding-left: 0;
    display: grid;
    gap: 0.75rem;
}

.ro-documents-popup-list li,
.ro-documents-popup-empty {
    padding: 0.95rem 1rem;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(148, 163, 184, 0.24);
    color: #0f172a;
    font-weight: 600;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.ro-documents-popup-list li::before {
    content: "";
    display: inline-block;
    width: 0.7rem;
    height: 0.7rem;
    margin-right: 0.75rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #f97316, #facc15);
    box-shadow: 0 0 0 4px rgba(249, 115, 22, 0.12);
}

.ro-documents-popup-btn {
    min-width: 180px;
}

[data-theme="dark"] .ro-documents-popup {
    background: linear-gradient(160deg, rgba(15, 23, 42, 0.96), rgba(30, 41, 59, 0.98));
    box-shadow: 0 28px 80px rgba(2, 6, 23, 0.55);
}

[data-theme="dark"] .ro-documents-popup-lead {
    color: #cbd5e1;
}

[data-theme="dark"] .ro-documents-popup-list li,
[data-theme="dark"] .ro-documents-popup-empty {
    background: rgba(15, 23, 42, 0.78);
    border-color: rgba(148, 163, 184, 0.18);
    color: #e2e8f0;
}

.ro-documents-popup-shell {
    display: grid;
    gap: 1.5rem;
    align-items: center;
}

.ro-documents-popup-media {
    padding: 1.25rem;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(148, 163, 184, 0.2);
}

.ro-documents-popup-image {
    display: block;
    width: 100%;
    max-width: 460px;
    margin: 0 auto;
}

.ro-documents-popup-copy {
    display: grid;
    gap: 0.95rem;
}

.ro-documents-popup .modal-footer {
    justify-content: stretch;
}

@media (min-width: 992px) {
    .ro-documents-popup-shell {
        grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    }

    .ro-documents-popup-btn {
        min-width: 220px;
    }
}

@media (max-width: 991.98px) {
    .ro-documents-popup-media {
        padding: 1.1rem;
    }

    .ro-documents-popup-image {
        max-width: 520px;
    }

    .ro-documents-popup-btn {
        width: 100%;
    }
}

[data-theme="dark"] .ro-documents-popup-media {
    background: rgba(15, 23, 42, 0.64);
    border-color: rgba(148, 163, 184, 0.16);
}

/* ============================================================
   Dealer Dashboard Enhanced UI
   ============================================================ */

/* Page header */
.dd-fuel-icon-wrap {
    width: 48px; height: 48px;
    border-radius: 14px;
    background: rgba(22, 97, 109, 0.1);
    display: flex; align-items: center; justify-content: center;
    color: #16616d;
    flex-shrink: 0;
}
.dd-chip-row { display: flex; flex-wrap: wrap; gap: 8px; }
.dd-chip {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 5px 13px;
    border-radius: 100px;
    font-size: 0.8125rem; font-weight: 500;
    border: 1px solid;
    line-height: 1.4;
}
.dd-chip-neutral { background: var(--surface); border-color: var(--border); color: var(--muted); }
.dd-chip-open    { background: rgba(22, 163, 74, 0.1); border-color: rgba(22, 163, 74, 0.3); color: #15803d; }
.dd-chip-locked  { background: rgba(220, 38, 38, 0.1); border-color: rgba(220, 38, 38, 0.3); color: #b91c1c; }

/* RO banner */
.dd-ro-banner {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 18px 20px;
}
.dd-ro-items {
    display: flex; flex-wrap: wrap; gap: 20px 32px;
}
.dd-ro-item { display: flex; flex-direction: column; gap: 2px; min-width: 100px; }
.dd-ro-label { font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); }
.dd-ro-value { font-size: 0.875rem; font-weight: 600; color: var(--text); }
.dd-ro-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: flex-start; }

/* Stat cards */
.dstat-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
}
@media (min-width: 992px) {
    .dstat-grid { grid-template-columns: repeat(4, 1fr); }
}
.dstat-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 18px 18px 16px;
    transition: box-shadow 0.15s;
}
.dstat-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.06); }
.dstat-top { display: flex; justify-content: space-between; align-items: flex-start; }
.dstat-icon {
    width: 40px; height: 40px;
    border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.dstat-icon-ms     { background: rgba(22, 97, 109, 0.1); color: #16616d; }
.dstat-icon-hsd    { background: rgba(232, 157, 44, 0.12); color: #c07a10; }
.dstat-icon-open   { background: rgba(22, 163, 74, 0.1); color: #15803d; }
.dstat-icon-locked { background: rgba(220, 38, 38, 0.1); color: #b91c1c; }
.dstat-trend { font-size: 0.75rem; font-weight: 600; }
.dstat-trend-up      { color: #15803d; }
.dstat-trend-down    { color: #b91c1c; }
.dstat-trend-neutral { color: var(--muted); }
.dstat-body { margin-top: 14px; }
.dstat-value {
    font-size: 1.5rem; font-weight: 700;
    letter-spacing: -0.03em;
    color: var(--text); line-height: 1.1;
}
.dstat-label { font-size: 0.8125rem; font-weight: 500; color: var(--text); margin-top: 3px; }
.dstat-desc  { font-size: 0.75rem; color: var(--muted); margin-top: 2px; }

/* Indent panel */
.dd-indent-panel {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 14px;
    overflow: hidden;
}
.dd-indent-panel-head { padding: 20px 20px 0; }
.dd-indent-panel-body { padding: 16px 20px 20px; }
.dd-tab-nav {
    background: var(--surface);
    border-radius: 8px;
    padding: 4px;
    display: inline-flex;
    gap: 4px;
    margin-bottom: 0;
}
.dd-tab-btn {
    padding: 6px 14px;
    border: none;
    background: transparent;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    color: var(--muted);
    transition: all 0.15s;
    white-space: nowrap;
    display: inline-flex; align-items: center;
}
.dd-tab-btn.active {
    background: var(--card);
    color: var(--text);
    box-shadow: 0 1px 4px rgba(0,0,0,0.1);
}
.dd-tab-btn:hover:not(.active) { color: var(--text); }
.dd-count-badge {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 20px; height: 20px; padding: 0 5px;
    border-radius: 10px;
    background: rgba(22, 97, 109, 0.12);
    color: #16616d;
    font-size: 0.6875rem; font-weight: 700;
    margin-left: 6px;
}

/* New status badge for dealer dashboard */
.dd-status-badge {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 3px 10px;
    border-radius: 100px;
    font-size: 0.75rem; font-weight: 600;
    border: 1px solid;
    white-space: nowrap;
}
.dd-status-pending   { background: rgba(234,179,8,0.12); color: #92400e; border-color: rgba(234,179,8,0.35); }
.dd-status-modified  { background: rgba(59,130,246,0.1); color: #1d4ed8; border-color: rgba(59,130,246,0.3); }
.dd-status-reviewed  { background: rgba(139,92,246,0.1); color: #6d28d9; border-color: rgba(139,92,246,0.3); }
.dd-status-finalized { background: rgba(22,163,74,0.1); color: #15803d; border-color: rgba(22,163,74,0.3); }
.dd-status-suppressed{ background: var(--surface); color: var(--muted); border-color: var(--border); }

/* Table header */
.dd-data-table thead th {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--muted);
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
    background: transparent;
}
.dd-data-table tbody td { padding: 10px 12px; font-size: 0.875rem; }

/* Chart card */
.dd-chart-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 14px;
    overflow: hidden;
    display: flex; flex-direction: column;
}
.dd-chart-card-head { padding: 20px 20px 0; }
.dd-chart-card-body { padding: 16px 20px 20px; flex: 1; }
.dd-chart-tabs {
    display: inline-flex; gap: 4px;
    background: var(--surface);
    border-radius: 8px;
    padding: 4px;
}
.dd-chart-tab {
    padding: 5px 12px;
    border: none;
    background: transparent;
    border-radius: 6px;
    font-size: 0.8125rem; font-weight: 500;
    cursor: pointer;
    color: var(--muted);
    transition: all 0.15s;
    white-space: nowrap;
}
.dd-chart-tab.active {
    background: var(--card);
    color: var(--text);
    box-shadow: 0 1px 4px rgba(0,0,0,0.1);
}
.dd-chart-tab:hover:not(.active) { color: var(--text); }
.dd-year-select { min-width: 90px; border-radius: 8px; font-size: 0.875rem; }

/* Activity feed */
.dd-activity-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 14px;
    overflow: hidden;
    display: flex; flex-direction: column;
}
.dd-activity-head { padding: 20px; border-bottom: 1px solid var(--border); }
.dd-activity-scroll {
    flex: 1;
    max-height: 440px;
    overflow-y: auto;
    padding: 0 16px 16px;
}
.dd-activity-scroll::-webkit-scrollbar { width: 4px; }
.dd-activity-scroll::-webkit-scrollbar-track { background: transparent; }
.dd-activity-scroll::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
.dd-group-label {
    font-size: 0.6875rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.08em;
    color: var(--muted);
    padding: 14px 4px 6px;
}
.dd-activity-row {
    display: flex; align-items: center; gap: 10px;
    padding: 9px 8px;
    border-radius: 10px;
    transition: background 0.1s;
}
.dd-activity-row:hover { background: var(--surface); }
.dd-activity-icon {
    width: 34px; height: 34px;
    border-radius: 9px;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.dd-activity-icon-ms    { background: rgba(22, 97, 109, 0.1); color: #16616d; }
.dd-activity-icon-hsd   { background: rgba(232, 157, 44, 0.12); color: #c07a10; }
.dd-activity-icon-mixed { background: rgba(22, 97, 109, 0.07); color: #16616d; }
.dd-activity-info { flex: 1; min-width: 0; }
.dd-activity-qty  { font-size: 0.8125rem; font-weight: 600; color: var(--text); }
.dd-activity-date-line { font-size: 0.71875rem; color: var(--muted); margin-top: 1px; }

/* ---- Dark theme overrides ---- */
[data-theme="dark"] .dd-chip-open   { color: #4ade80; }
[data-theme="dark"] .dd-chip-locked { color: #f87171; }
[data-theme="dark"] .dstat-icon-open   { background: rgba(74,222,128,0.1); color: #4ade80; }
[data-theme="dark"] .dstat-icon-locked { background: rgba(248,113,113,0.1); color: #f87171; }
[data-theme="dark"] .dstat-trend-up    { color: #4ade80; }
[data-theme="dark"] .dstat-trend-down  { color: #f87171; }
[data-theme="dark"] .dstat-icon-hsd    { background: rgba(232,157,44,0.12); color: #e89d2c; }
[data-theme="dark"] .dd-status-pending   { color: #fbbf24; border-color: rgba(251,191,36,0.3); }
[data-theme="dark"] .dd-status-modified  { color: #60a5fa; border-color: rgba(96,165,250,0.3); }
[data-theme="dark"] .dd-status-reviewed  { color: #a78bfa; border-color: rgba(167,139,250,0.3); }
[data-theme="dark"] .dd-status-finalized { color: #4ade80; border-color: rgba(74,222,128,0.3); }
[data-theme="dark"] .dd-activity-icon-hsd  { color: #e89d2c; }
[data-theme="dark"] .dd-activity-icon-mixed { color: #5bb8c4; }
[data-theme="dark"] .dd-count-badge { background: rgba(22,97,109,0.2); color: #5bb8c4; }
[data-theme="dark"] .dd-tab-btn.active { box-shadow: 0 1px 4px rgba(0,0,0,0.25); }
[data-theme="dark"] .dd-chart-tab.active { box-shadow: 0 1px 4px rgba(0,0,0,0.25); }

/* ---- Dark theme overrides — Dealer/Documents & Document Control ---- */
[data-theme="dark"] .document-stat-card {
    background: var(--card);
    border-color: rgba(22, 97, 109, 0.22);
}

[data-theme="dark"] .document-card {
    background: var(--card);
    border-color: rgba(22, 97, 109, 0.2);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.28);
}

[data-theme="dark"] .document-card-mandatory {
    box-shadow: 0 20px 45px rgba(232, 157, 44, 0.1);
    border-color: rgba(232, 157, 44, 0.28);
}

[data-theme="dark"] .history-card {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(22, 97, 109, 0.16);
}

[data-theme="dark"] .empty-state-card {
    background: var(--card);
    border-color: rgba(22, 97, 109, 0.22);
}

[data-theme="dark"] .document-note {
    background: rgba(22, 97, 109, 0.14);
    color: var(--text);
}

[data-theme="dark"] .manager-note {
    background: rgba(232, 157, 44, 0.12);
    color: var(--text);
}

[data-theme="dark"] .file-selection-status {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.12);
}

[data-theme="dark"] .file-selection-status.is-ready {
    color: #4ade80;
    border-color: rgba(74, 222, 128, 0.32);
    background: rgba(74, 222, 128, 0.08);
}

[data-theme="dark"] .file-selection-status.is-info {
    color: #fbbf24;
    border-color: rgba(251, 191, 36, 0.32);
    background: rgba(251, 191, 36, 0.08);
}

[data-theme="dark"] .response-context,
[data-theme="dark"] .review-context {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: var(--text);
}

[data-theme="dark"] .badge.bg-light,
[data-theme="dark"] .badge.text-bg-light {
    background-color: rgba(255, 255, 255, 0.12) !important;
    color: var(--text) !important;
}

[data-theme="dark"] .expiry-monitor-table .expiry-row-expired td {
    background: rgba(248, 113, 113, 0.1);
}

[data-theme="dark"] .expiry-monitor-table .expiry-row-near td {
    background: rgba(251, 191, 36, 0.1);
}


.approval-queue-shell {
    display: grid;
    gap: 0.65rem;
}

.approval-queue-header,
.approval-queue-row {
    display: grid;
    grid-template-columns: 1.2fr 1.35fr 1fr 0.9fr 1fr 1.25fr 1fr;
    gap: 0.75rem;
    align-items: center;
}

.approval-queue-header {
    padding: 0 1rem;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.approval-queue-item {
    border: 1px solid rgba(22, 97, 109, 0.12);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 10px 28px rgba(18, 51, 59, 0.06);
    overflow: hidden;
}

.approval-queue-row {
    width: 100%;
    padding: 0.9rem 1rem;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
}

.approval-queue-row:hover,
.approval-queue-row[aria-expanded="true"] {
    background: rgba(22, 97, 109, 0.055);
}

.queue-cell {
    min-width: 0;
}

.queue-cell strong,
.queue-cell small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.queue-cell strong {
    font-size: 0.92rem;
    font-weight: 700;
}

.queue-cell small {
    margin-top: 0.2rem;
    color: var(--muted);
    font-size: 0.78rem;
}

.approval-detail-panel {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(340px, 0.95fr);
    gap: 1rem;
    padding: 1rem;
    border-top: 1px solid rgba(22, 97, 109, 0.1);
    background: linear-gradient(180deg, rgba(248,251,251,0.95), rgba(255,255,255,0.98));
}

.approval-detail-main {
    display: grid;
    align-content: start;
    gap: 0.85rem;
}

.approval-detail-section {
    padding: 1rem;
    border: 1px solid rgba(22, 97, 109, 0.1);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.88);
}

.approval-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
    margin: 0;
}

.approval-detail-grid dt {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.approval-detail-grid dd {
    margin: 0.25rem 0 0;
    font-weight: 700;
}

.approval-action-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.approval-preview-panel {
    min-height: 480px;
    border: 1px solid rgba(22, 97, 109, 0.14);
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
}

.approval-preview-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 0.9rem;
    border-bottom: 1px solid rgba(22, 97, 109, 0.1);
    background: rgba(22, 97, 109, 0.055);
}

.approval-preview-fallback {
    font-size: 0.82rem;
    font-weight: 700;
}

.approval-preview-empty {
    display: grid;
    min-height: 420px;
    place-items: center;
    padding: 1.5rem;
    color: var(--muted);
    text-align: center;
}

.approval-preview-frame {
    display: block;
    width: 100%;
    height: 640px;
    border: 0;
    background: #fff;
}

[data-theme="dark"] .approval-queue-item,
[data-theme="dark"] .approval-detail-section,
[data-theme="dark"] .approval-preview-panel {
    background: rgba(9, 21, 27, 0.92);
    border-color: var(--border);
}

[data-theme="dark"] .approval-queue-row:hover,
[data-theme="dark"] .approval-queue-row[aria-expanded="true"],
[data-theme="dark"] .approval-preview-toolbar {
    background: rgba(255, 255, 255, 0.055);
}

[data-theme="dark"] .approval-detail-panel {
    background: rgba(9, 21, 27, 0.75);
    border-top-color: var(--border);
}

@media (max-width: 1199.98px) {
    .approval-queue-header {
        display: none;
    }

    .approval-queue-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .approval-detail-panel {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .approval-queue-row,
    .approval-detail-grid {
        grid-template-columns: 1fr;
    }

    .approval-detail-panel {
        padding: 0.75rem;
    }

    .approval-preview-panel {
        min-height: 360px;
    }

    .approval-preview-frame {
        height: 420px;
    }
}

.ro-approval-shell {
    display: grid;
    gap: 0.75rem;
}

.ro-approval-group {
    border: 1px solid rgba(22, 97, 109, 0.12);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 10px 28px rgba(18, 51, 59, 0.06);
    overflow: hidden;
}

.ro-approval-row {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) minmax(280px, 1.2fr) auto;
    gap: 1rem;
    align-items: center;
    width: 100%;
    padding: 1rem;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
}

.ro-approval-row:hover,
.ro-approval-row[aria-expanded="true"] {
    background: rgba(22, 97, 109, 0.055);
}

.ro-cell {
    min-width: 0;
}

.ro-cell strong,
.ro-cell small,
.ro-document-row strong,
.ro-document-row small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ro-cell strong,
.ro-document-row strong {
    font-size: 0.94rem;
    font-weight: 700;
}

.ro-cell small,
.ro-document-row small {
    margin-top: 0.2rem;
    color: var(--muted);
    font-size: 0.78rem;
}

.ro-status-stack {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.ro-expand-indicator {
    color: var(--accent);
    font-size: 0.85rem;
    font-weight: 700;
}

.ro-document-workspace {
    display: grid;
    grid-template-columns: minmax(420px, 0.95fr) minmax(0, 1.35fr);
    gap: 1rem;
    padding: 1rem;
    border-top: 1px solid rgba(22, 97, 109, 0.1);
    background: linear-gradient(180deg, rgba(248,251,251,0.95), rgba(255,255,255,0.98));
}

.ro-document-list {
    align-self: start;
    border: 1px solid rgba(22, 97, 109, 0.1);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.88);
    overflow: hidden;
}

.ro-document-header,
.ro-document-row {
    display: grid;
    grid-template-columns: 1.4fr 1fr 0.85fr 1fr 1.05fr 0.8fr;
    gap: 0.65rem;
    align-items: center;
}

.ro-document-header {
    padding: 0.75rem 0.9rem;
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    background: rgba(22, 97, 109, 0.055);
}

.ro-document-row {
    width: 100%;
    padding: 0.85rem 0.9rem;
    border: 0;
    border-top: 1px solid rgba(22, 97, 109, 0.08);
    background: transparent;
    color: inherit;
    text-align: left;
}

.ro-document-row:hover,
.ro-document-row.is-selected {
    background: rgba(22, 97, 109, 0.075);
}

.ro-document-detail-area {
    min-width: 0;
}

.ro-document-detail {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(360px, 1.05fr);
    gap: 1rem;
}

.approval-preview-image {
    display: block;
    width: 100%;
    max-height: 640px;
    object-fit: contain;
    background: #fff;
}

.approval-preview-error {
    display: grid;
    min-height: 420px;
    place-items: center;
    padding: 1.5rem;
    color: #9f1d1d;
    font-weight: 700;
    text-align: center;
}

[data-theme="dark"] .ro-approval-group,
[data-theme="dark"] .ro-document-list {
    background: rgba(9, 21, 27, 0.92);
    border-color: var(--border);
}

[data-theme="dark"] .ro-approval-row:hover,
[data-theme="dark"] .ro-approval-row[aria-expanded="true"],
[data-theme="dark"] .ro-document-header,
[data-theme="dark"] .ro-document-row:hover,
[data-theme="dark"] .ro-document-row.is-selected {
    background: rgba(255, 255, 255, 0.055);
}

[data-theme="dark"] .ro-document-workspace {
    background: rgba(9, 21, 27, 0.75);
    border-top-color: var(--border);
}

@media (max-width: 1399.98px) {
    .ro-document-workspace,
    .ro-document-detail {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 991.98px) {
    .ro-approval-row {
        grid-template-columns: 1fr;
    }

    .ro-document-header {
        display: none;
    }

    .ro-document-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .ro-document-workspace {
        padding: 0.75rem;
    }

    .ro-document-row {
        grid-template-columns: 1fr;
    }
}

.approval-pagination-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.85rem 1rem;
    border: 1px solid rgba(22, 97, 109, 0.12);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.92);
}

@media (max-width: 767.98px) {
    .approval-pagination-bar {
        align-items: flex-start;
        flex-direction: column;
    }
}

.approval-queue-region {
    position: relative;
}

.approval-queue-region.is-loading .approval-pagination-bar,
.approval-queue-region.is-loading .ro-approval-shell {
    opacity: 0.45;
    pointer-events: none;
}

.approval-queue-loader {
    position: absolute;
    inset: 0;
    z-index: 20;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 5rem;
    background: rgba(248, 250, 252, 0.46);
    backdrop-filter: blur(2px);
    border-radius: 8px;
}

.approval-loader-card {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 240px;
    padding: 0.9rem 1.1rem;
    border: 1px solid rgba(22, 97, 109, 0.16);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.14);
    color: #164e63;
    font-weight: 700;
}

.approval-loader-spinner {
    width: 1.35rem;
    height: 1.35rem;
    border: 3px solid rgba(22, 97, 109, 0.16);
    border-top-color: #16616d;
    border-radius: 999px;
    animation: approval-loader-spin 0.8s linear infinite;
}

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


.manager-admin-page {
    --mad-bg: #eef3ff;
    --mad-surface: #ffffff;
    --mad-line: rgba(67, 90, 138, 0.12);
    --mad-text: #20263a;
    --mad-muted: #7a849d;
    --mad-blue: #315efb;
    --mad-indigo: #8c52ff;
    --mad-green: #61c4a6;
    --mad-cyan: #54c6eb;
    --mad-warm: #ffb648;
}

.manager-admin-hero {
    display: flex;
    justify-content: space-between;
    gap: 1.5rem;
    align-items: flex-end;
}

.manager-admin-title {
    margin: 0.4rem 0 0;
    font-size: clamp(2rem, 3.6vw, 3rem);
    font-weight: 800;
    letter-spacing: -0.04em;
    color: var(--mad-text);
}

.manager-admin-subtitle {
    margin: 0.6rem 0 0;
    max-width: 62ch;
    color: var(--mad-muted);
}

.manager-admin-hero-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: flex-end;
}

.manager-admin-hero-tags span {
    padding: 0.75rem 1rem;
    border-radius: 999px;
    background: rgba(255,255,255,0.92);
    border: 1px solid var(--mad-line);
    color: #53607d;
    font-size: 0.82rem;
    font-weight: 700;
    box-shadow: 0 10px 22px rgba(34, 58, 120, 0.08);
}

.manager-admin-shell {
    border-radius: 2rem;
    max-width: 100%;
    overflow-x: clip;
}

.manager-admin-grid {
    display: grid;
    grid-template-columns: minmax(220px, 250px) minmax(0, 1fr);
    gap: 1.5rem;
    padding: 1.5rem;
    border-radius: 2rem;
    max-width: 100%;
    overflow: hidden;
    background: linear-gradient(180deg, #f1f4ff 0%, #eef2fb 100%);
}

.manager-admin-grid > *,
.manager-admin-main,
.manager-admin-toolbar,
.manager-admin-toolbar-actions,
.manager-admin-panel-grid-top,
.manager-admin-chart-grid,
.manager-admin-panel,
.manager-admin-table-wrap {
    min-width: 0;
}

.manager-admin-sidebar,
.manager-admin-panel {
    background: rgba(255,255,255,0.94);
    border: 1px solid var(--mad-line);
    box-shadow: 0 18px 36px rgba(41, 66, 124, 0.08);
}

.manager-admin-sidebar {
    border-radius: 1.6rem;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.manager-admin-brand {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(86, 103, 148, 0.12);
}

.manager-admin-brand-icon {
    width: 2.55rem;
    height: 2.55rem;
    border-radius: 0.9rem;
    display: grid;
    place-items: center;
    background: linear-gradient(180deg, #476efc 0%, #294edb 100%);
    color: #fff;
    font-weight: 800;
}

.manager-admin-brand strong,
.manager-admin-brand span { display:block; }
.manager-admin-brand span { color: var(--mad-muted); font-size: 0.82rem; }

.manager-admin-nav {
    display: grid;
    gap: 0.5rem;
}

.manager-admin-nav-item {
    padding: 0.8rem 0.95rem;
    border-radius: 0.95rem;
    color: #56617a;
    font-weight: 700;
    text-decoration: none;
}

.manager-admin-nav-item:hover,
.manager-admin-nav-item.active {
    color: var(--mad-blue);
    background: rgba(49, 94, 251, 0.1);
}

.manager-admin-sidebar-card {
    padding: 1rem;
    border-radius: 1.1rem;
    background: #f9fbff;
    border: 1px solid rgba(82, 104, 156, 0.1);
}

.manager-admin-mini-list { margin: 0.75rem 0 0; padding-left: 1rem; color: var(--mad-muted); }
.manager-admin-mini-list li + li { margin-top: 0.45rem; }

.manager-admin-sidebar-accent {
    margin-top: auto;
    color: #fff;
    background: linear-gradient(180deg, #4a6efb 0%, #2244c7 100%);
    box-shadow: 0 18px 30px rgba(36, 68, 199, 0.28);
}

.manager-admin-sidebar-accent .eyebrow,
.manager-admin-sidebar-accent p { color: rgba(255,255,255,0.8); }
.manager-admin-sidebar-number { display:block; font-size: 2.25rem; font-weight: 800; margin: 0.35rem 0; }

.manager-admin-main { display: grid; gap: 1.25rem; }

.manager-admin-toolbar,
.manager-admin-panel {
    border-radius: 1.5rem;
}

.manager-admin-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 1.25rem;
    align-items: flex-start;
    padding: 1.4rem 1.55rem;
    background: rgba(255,255,255,0.86);
    border: 1px solid var(--mad-line);
    box-shadow: 0 14px 28px rgba(41, 66, 124, 0.06);
}

.manager-admin-toolbar h2,
.manager-admin-panel-head h3 { margin: 0; color: var(--mad-text); font-weight: 800; }
.manager-admin-toolbar p,
.manager-admin-panel-head p { margin: 0.35rem 0 0; color: var(--mad-muted); }

.manager-admin-toolbar-actions { display:flex; flex-wrap:wrap; gap:0.75rem; justify-content:flex-end; }
.manager-admin-btn { border-radius: 0.95rem; font-weight: 700; padding: 0.8rem 1rem; }
.manager-admin-btn-primary { background: linear-gradient(180deg, #476efc 0%, #274fe3 100%); color:#fff; border:none; }
.manager-admin-btn-soft { background: rgba(97, 196, 166, 0.12); color: #188f68; border:1px solid rgba(97, 196, 166, 0.2); }
.manager-admin-btn-outline { background:#fff; color:#42506e; border:1px solid rgba(81, 99, 141, 0.18); }
.manager-admin-btn-danger { background: rgba(255, 111, 145, 0.12); color:#d14a72; border:1px solid rgba(255, 111, 145, 0.2); }

.manager-admin-stat-grid,
.manager-admin-chart-grid {
    display: grid;
    gap: 1rem;
}

.manager-admin-stat-grid {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.manager-admin-stat-card {
    padding: 1.15rem 1.2rem;
    border-radius: 1.25rem;
    color: #fff;
    box-shadow: 0 18px 30px rgba(29, 49, 101, 0.18);
}

.manager-admin-stat-card span,
.manager-admin-stat-card small { display:block; color: rgba(255,255,255,0.8); }
.manager-admin-stat-card strong { display:block; font-size: 1.9rem; font-weight: 800; margin: 0.3rem 0; }
.manager-admin-stat-card-primary { background: linear-gradient(180deg, #2f5af5 0%, #2748cb 100%); }
.manager-admin-stat-card-blue { background: linear-gradient(180deg, #55c6eb 0%, #339ec8 100%); }
.manager-admin-stat-card-green { background: linear-gradient(180deg, #6ac9ab 0%, #42a987 100%); }
.manager-admin-stat-card-purple { background: linear-gradient(180deg, #a176ff 0%, #7e4ef2 100%); }
.manager-admin-stat-card-warm { background: linear-gradient(180deg, #ffbf5d 0%, #f39c23 100%); }

.manager-admin-panel-grid-top {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(320px, 0.75fr);
    gap: 1rem;
}

.manager-admin-panel {
    padding: 1.25rem;
}

.manager-admin-panel-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
}

.manager-admin-quick-row { display:flex; flex-wrap:wrap; gap:0.5rem; }
.manager-admin-cutoff-card {
    padding: 1rem;
    border-radius: 1.1rem;
    background: #f7f9ff;
    border: 1px solid rgba(81, 99, 141, 0.12);
    margin-bottom: 1rem;
}
.manager-admin-cutoff-head { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; }

.manager-admin-summary-stack { display:grid; gap:0.8rem; }
.manager-admin-summary-item {
    padding: 0.95rem 1rem;
    border-radius: 1rem;
    background: #f8faff;
    border: 1px solid rgba(81, 99, 141, 0.1);
}
.manager-admin-summary-item span { display:block; color: var(--mad-muted); font-size:0.8rem; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; }
.manager-admin-summary-item strong { display:block; margin-top:0.35rem; font-size:1.25rem; color:var(--mad-text); }
.manager-admin-ring-card { padding: 0.5rem; border-radius:1.2rem; background:#fff; border:1px solid rgba(81,99,141,0.1); }

.manager-admin-chart-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.manager-admin-panel-chart-wide { grid-column: span 1; }
.manager-admin-panel-chart-lg .chart-shell,
.manager-admin-panel-chart-wide .chart-shell,
.manager-admin-ring-card .chart-shell { min-height: 260px; }

.manager-admin-records-panel { padding-bottom: 1rem; }
.manager-admin-bulk-bar {
    padding: 0.95rem 1rem;
    border-radius: 1rem;
    background: #f7f9ff;
    border: 1px solid rgba(81, 99, 141, 0.12);
}
.manager-admin-table-wrap {
    border-radius: 1.2rem;
    border: 1px solid rgba(81,99,141,0.12);
    background: #fff;
}
.manager-admin-table thead th {
    background: #f4f7ff;
}
.manager-admin-lock-state {
    margin-top: 1rem;
    padding: 0.85rem 1rem;
    border-radius: 0.95rem;
    font-weight: 700;
}
.manager-admin-lock-state.open { background: rgba(97, 196, 166, 0.13); color: #1c8b68; }
.manager-admin-lock-state.locked { background: rgba(255, 111, 145, 0.13); color: #d14a72; }
.manager-admin-lock-state.unset { background: rgba(84, 98, 135, 0.08); color: #627089; }

@media (max-width: 1399px) {
    .manager-admin-stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1199px) {
    .manager-admin-grid,
    .manager-admin-panel-grid-top,
    .manager-admin-chart-grid { grid-template-columns: 1fr; }
    .manager-admin-sidebar { order: 2; }
    .manager-admin-main { order: 1; }
}

@media (max-width: 767px) {
    .manager-admin-hero,
    .manager-admin-toolbar { flex-direction: column; align-items: stretch; }
    .manager-admin-stat-grid { grid-template-columns: 1fr; }
    .manager-admin-grid { padding: 1rem; border-radius: 1.2rem; }
    .manager-admin-toolbar-actions { justify-content: stretch; }
    .manager-admin-toolbar-actions > * { width: 100%; }
}


.site-main-fluid {
    width: 100%;
    max-width: 100%;
    padding-left: 1rem;
    padding-right: 1rem;
}


[data-theme="dark"] .manager-admin-page {
    --mad-bg: #0b1220;
    --mad-surface: #121c30;
    --mad-line: rgba(123, 150, 206, 0.16);
    --mad-text: #f2f6ff;
    --mad-muted: #9aa8c7;
}

[data-theme="dark"] .manager-admin-title {
    color: #f5f8ff;
}

[data-theme="dark"] .manager-admin-subtitle,
[data-theme="dark"] .manager-admin-brand span,
[data-theme="dark"] .manager-admin-mini-list,
[data-theme="dark"] .manager-admin-toolbar p,
[data-theme="dark"] .manager-admin-panel-head p,
[data-theme="dark"] .manager-admin-summary-item span,
[data-theme="dark"] .manager-admin-lock-state.unset,
[data-theme="dark"] .manager-admin-nav-item {
    color: #97a6c8;
}

[data-theme="dark"] .manager-admin-hero-tags span {
    background: rgba(18, 28, 48, 0.88);
    border-color: rgba(123, 150, 206, 0.14);
    color: #b2bfdc;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.28);
}

[data-theme="dark"] .manager-admin-grid {
    background: linear-gradient(180deg, #0c1526 0%, #0a1220 100%);
}

[data-theme="dark"] .manager-admin-sidebar,
[data-theme="dark"] .manager-admin-panel,
[data-theme="dark"] .manager-admin-toolbar {
    background: rgba(16, 25, 42, 0.92);
    border-color: rgba(123, 150, 206, 0.12);
    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.28);
}

[data-theme="dark"] .manager-admin-brand {
    border-bottom-color: rgba(123, 150, 206, 0.12);
}

[data-theme="dark"] .manager-admin-brand strong,
[data-theme="dark"] .manager-admin-toolbar h2,
[data-theme="dark"] .manager-admin-panel-head h3,
[data-theme="dark"] .manager-admin-summary-item strong {
    color: #f5f8ff;
}

[data-theme="dark"] .manager-admin-nav-item:hover,
[data-theme="dark"] .manager-admin-nav-item.active {
    color: #dbe6ff;
    background: rgba(71, 110, 252, 0.2);
}

[data-theme="dark"] .manager-admin-sidebar-card,
[data-theme="dark"] .manager-admin-cutoff-card,
[data-theme="dark"] .manager-admin-summary-item,
[data-theme="dark"] .manager-admin-ring-card,
[data-theme="dark"] .manager-admin-bulk-bar,
[data-theme="dark"] .manager-admin-table-wrap {
    background: rgba(18, 28, 48, 0.82);
    border-color: rgba(123, 150, 206, 0.12);
}

[data-theme="dark"] .manager-admin-btn-outline {
    background: rgba(18, 28, 48, 0.96);
    color: #d8e2f8;
    border-color: rgba(123, 150, 206, 0.18);
}

[data-theme="dark"] .manager-admin-btn-soft {
    background: rgba(97, 196, 166, 0.16);
    color: #9de2ca;
    border-color: rgba(97, 196, 166, 0.22);
}

[data-theme="dark"] .manager-admin-btn-danger {
    background: rgba(255, 111, 145, 0.16);
    color: #ffb4c8;
    border-color: rgba(255, 111, 145, 0.24);
}

[data-theme="dark"] .manager-admin-lock-state.open {
    background: rgba(97, 196, 166, 0.16);
    color: #9ee1ca;
}

[data-theme="dark"] .manager-admin-lock-state.locked {
    background: rgba(255, 111, 145, 0.16);
    color: #ffb3c8;
}

[data-theme="dark"] .manager-admin-table,
[data-theme="dark"] .manager-admin-table td,
[data-theme="dark"] .manager-admin-table th,
[data-theme="dark"] .manager-admin-table .text-dark,
[data-theme="dark"] .manager-admin-table .table-filter-link {
    color: #e8eefc;
}

[data-theme="dark"] .manager-admin-table thead th {
    background: #16233a;
    border-color: rgba(123, 150, 206, 0.12);
}

[data-theme="dark"] .manager-admin-table tbody td {
    background: transparent;
    border-color: rgba(123, 150, 206, 0.08);
}

[data-theme="dark"] .manager-admin-table tbody tr:hover td {
    background: rgba(71, 110, 252, 0.08);
}

[data-theme="dark"] .manager-admin-table .remarks-cell,
[data-theme="dark"] .manager-admin-table .workflow-cell,
[data-theme="dark"] .manager-admin-table .text-secondary,
[data-theme="dark"] .manager-admin-table .small {
    color: #9aa8c7 !important;
}

[data-theme="dark"] .manager-admin-panel input,
[data-theme="dark"] .manager-admin-panel select,
[data-theme="dark"] .manager-admin-panel .form-control,
[data-theme="dark"] .manager-admin-panel .form-select {
    background: #0f1728;
    color: #f1f5ff;
    border-color: rgba(123, 150, 206, 0.16);
}

[data-theme="dark"] .manager-admin-panel input::placeholder {
    color: #8190b0;
}

[data-theme="dark"] .manager-admin-panel .date-format-text,
[data-theme="dark"] .manager-admin-panel .form-text {
    color: #90a0c2;
}

.portal-body.portal-authenticated {
    overflow-x: hidden;
}


.portal-authenticated .site-header,
.portal-authenticated .site-header-fixed,
.portal-authenticated .site-header-fixed .navbar {
    overflow: visible;
}

.portal-header-shell {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.portal-header-shell > .navbar-brand {
    flex-shrink: 0;
}

.portal-authenticated .site-header {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.portal-authenticated .site-header-fixed {
    z-index: 1050;
}

.portal-authenticated .site-header-fixed .container {
    overflow: visible;
    max-width: 100%;
    padding-left: 1rem;
    padding-right: 1rem;
}

.portal-authenticated .navbar {
    min-height: 64px;
}

.portal-authenticated .navbar-brand {
    position: relative;
    z-index: 1061;
}

.portal-sidebar-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    box-shadow: 0 10px 20px rgba(0,0,0,0.06);
}

.portal-authenticated .portal-sidebar {
    position: fixed;
    top: 64px;
    left: 0;
    bottom: 0;
    width: 270px;
    display: flex !important;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem 1rem 1.25rem;
    overflow-y: auto;
    background: rgba(255,255,255,0.96);
    border-right: 1px solid var(--border);
    box-shadow: 18px 0 40px rgba(15, 23, 42, 0.06);
    z-index: 1060;
}

.portal-sidebar-nav {
    width: 100%;
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 0.4rem;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.portal-authenticated .portal-sidebar .nav-item,
.portal-authenticated .portal-sidebar .dropdown {
    width: 100%;
}

.portal-authenticated .portal-sidebar .nav-link,
.portal-authenticated .portal-sidebar .dropdown-item {
    color: var(--text);
}

.portal-authenticated .portal-sidebar .nav-link-icon {
    width: 100%;
    justify-content: flex-start;
    gap: 0.8rem;
    padding: 0.9rem 1rem !important;
    border-radius: 1rem;
    font-size: 0.95rem;
    font-weight: 700;
}

.portal-authenticated .portal-sidebar .nav-link-label {
    display: inline !important;
}

.portal-authenticated .portal-sidebar .nav-link-icon svg {
    width: 18px;
    height: 18px;
}

.portal-authenticated .portal-sidebar .dropdown-toggle::after {
    margin-left: auto;
}

.portal-authenticated .portal-sidebar .dropdown-menu {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    margin: 0.15rem 0 0.35rem;
    padding: 0.25rem 0 0.1rem 0.9rem;
    background: transparent;
    border: 0;
    box-shadow: none !important;
}

.portal-authenticated .portal-sidebar .dropdown-item {
    border-radius: 0.85rem;
    padding: 0.7rem 0.9rem;
    font-size: 0.88rem;
    font-weight: 600;
    white-space: normal;
}

.portal-sidebar-tools {
    width: 100%;
    margin-top: auto;
    padding-top: 0.8rem;
    border-top: 1px solid var(--border);
    flex-direction: column;
    align-items: stretch !important;
}

.portal-sidebar-tools .dropdown,
.portal-sidebar-tools > a,
.portal-sidebar-tools > form,
.portal-sidebar-tools > .btn {
    width: 100%;
}

.portal-sidebar-tools .theme-picker-btn,
.portal-sidebar-tools .account-dropdown-toggle,
.portal-sidebar-tools .btn-primary {
    width: 100%;
    justify-content: center;
    border-radius: 0.95rem;
}

.portal-authenticated .site-page-shell {
    padding-top: 64px;
    padding-left: 270px;
}

.portal-authenticated .site-footer-fixed {
    left: 270px;
}

.portal-sidebar-overlay {
    position: fixed;
    inset: 64px 0 0 0;
    background: rgba(4, 12, 24, 0.45);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
    z-index: 1055;
}

[data-theme="dark"] .portal-sidebar-toggle {
    background: #122033;
    border-color: #24384d;
    color: #dce8ec;
    box-shadow: 0 10px 20px rgba(0,0,0,0.25);
}

[data-theme="dark"] .portal-authenticated .portal-sidebar {
    background: rgba(10, 18, 30, 0.98);
    border-right-color: #1c3347;
    box-shadow: 18px 0 42px rgba(0,0,0,0.28);
}

[data-theme="dark"] .portal-sidebar-tools {
    border-top-color: #1c3347;
}

[data-theme="dark"] .portal-authenticated .portal-sidebar .dropdown-item {
    color: #dce8ec;
}

[data-theme="dark"] .portal-sidebar-overlay {
    background: rgba(2, 8, 18, 0.62);
}

@media (max-width: 991.98px) {
    .portal-authenticated .site-header,
    .portal-authenticated .site-header-fixed,
    .portal-authenticated .site-header-fixed .navbar {
        z-index: 1080;
    }

    .portal-authenticated .portal-sidebar {
        z-index: 1072;
        width: min(86vw, 320px);
        background: #ffffff;
        transform: translateX(-100%);
        transition: transform 0.24s ease;
    }

    [data-theme="dark"] .portal-authenticated .portal-sidebar {
        background: #0b1523;
    }

    .portal-sidebar-overlay {
        z-index: 1071;
        backdrop-filter: blur(2px);
        -webkit-backdrop-filter: blur(2px);
    }

    .portal-body.sidebar-open {
        overflow: hidden;
        touch-action: none;
    }

    .portal-authenticated .site-page-shell,
    .portal-authenticated .site-footer-fixed {
        padding-left: 0;
        left: 0;
    }

    .portal-body.sidebar-open .portal-sidebar {
        transform: translateX(0);
    }

    .portal-body.sidebar-open .portal-sidebar-overlay {
        opacity: 1;
        pointer-events: auto;
    }
}

        display: none;
    }
}




.portal-sidebar-toggle-icon {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    width: 18px;
    height: 18px;
}

.portal-sidebar-toggle-icon span {
    display: block;
    width: 18px;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    transition: transform 0.18s ease, opacity 0.18s ease;
}

.portal-body.sidebar-open .portal-sidebar-toggle-icon span:nth-child(1),
.portal-body.sidebar-collapsed .portal-sidebar-toggle-icon span:nth-child(1) {
    transform: translateY(6px) rotate(45deg);
}

.portal-body.sidebar-open .portal-sidebar-toggle-icon span:nth-child(2),
.portal-body.sidebar-collapsed .portal-sidebar-toggle-icon span:nth-child(2) {
    opacity: 0;
}

.portal-body.sidebar-open .portal-sidebar-toggle-icon span:nth-child(3),
.portal-body.sidebar-collapsed .portal-sidebar-toggle-icon span:nth-child(3) {
    transform: translateY(-6px) rotate(-45deg);
}

.portal-sidebar-nav {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
}

.portal-sidebar-tools {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.manager-admin-grid-solo {
    grid-template-columns: 1fr;
}

.manager-admin-grid-solo .manager-admin-main {
    order: 1;
}
.historical-admin-page {
    display: grid;
    gap: 1.5rem;
}

.historical-admin-grid {
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.historical-admin-main {
    display: grid;
    gap: 1.25rem;
}

.historical-admin-toolbar-meta {
    align-items: center;
}

.historical-admin-meta-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0.75rem 1rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(83, 100, 141, 0.12);
    color: var(--mad-text);
    font-size: 0.84rem;
    font-weight: 700;
    box-shadow: 0 10px 28px rgba(53, 77, 122, 0.08);
}

.historical-admin-filter-panel .form-control,
.historical-admin-filter-panel .form-select {
    min-height: 48px;
}

.historical-admin-filter-note {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.7rem 1rem;
    border-radius: 999px;
    background: rgba(49, 94, 251, 0.08);
    color: #3652c8;
    font-size: 0.84rem;
    font-weight: 700;
}

.historical-admin-stat-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.historical-admin-panel-grid {
    grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr);
}

.historical-admin-highlights {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.historical-admin-highlight {
    border-radius: 1.3rem;
    padding: 1rem 1.1rem;
    border: 1px solid rgba(88, 108, 156, 0.12);
    background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(244,247,255,0.98) 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.8);
}

.historical-admin-highlight span,
.historical-admin-highlight small {
    display: block;
}

.historical-admin-highlight span {
    color: var(--mad-muted);
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.historical-admin-highlight strong {
    display: block;
    margin: 0.45rem 0 0.35rem;
    color: var(--mad-text);
    font-size: 1.08rem;
    font-weight: 800;
}

.historical-admin-highlight small {
    color: var(--mad-muted);
    font-weight: 600;
}

.historical-admin-highlight-top {
    background: linear-gradient(180deg, rgba(85, 198, 235, 0.12) 0%, rgba(255,255,255,0.98) 100%);
}

.historical-admin-highlight-total {
    background: linear-gradient(180deg, rgba(106, 201, 171, 0.14) 0%, rgba(255,255,255,0.98) 100%);
}

.historical-admin-highlight-low {
    background: linear-gradient(180deg, rgba(255, 191, 93, 0.18) 0%, rgba(255,255,255,0.98) 100%);
}

.historical-admin-chart-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.historical-admin-chart-span-2 {
    grid-column: span 2;
}

.historical-admin-chart-span-3 {
    grid-column: span 3;
}

.historical-admin-table thead th {
    white-space: nowrap;
}

[data-theme="dark"] .historical-admin-meta-chip {
    background: rgba(20, 32, 58, 0.9);
    border-color: rgba(120, 144, 199, 0.18);
    color: #eef4ff;
    box-shadow: none;
}

[data-theme="dark"] .historical-admin-filter-note {
    background: rgba(64, 96, 223, 0.16);
    color: #c8d6ff;
}

[data-theme="dark"] .historical-admin-highlight {
    background: linear-gradient(180deg, rgba(15, 25, 48, 0.96) 0%, rgba(12, 20, 39, 0.96) 100%);
    border-color: rgba(109, 128, 174, 0.16);
    box-shadow: none;
}

[data-theme="dark"] .historical-admin-highlight strong {
    color: #f3f6ff;
}

[data-theme="dark"] .historical-admin-highlight span,
[data-theme="dark"] .historical-admin-highlight small {
    color: #93a1c7;
}

@media (max-width: 1199.98px) {
    .historical-admin-stat-grid,
    .historical-admin-highlights,
    .historical-admin-chart-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .historical-admin-panel-grid,
    .historical-admin-chart-span-2,
    .historical-admin-chart-span-3 {
        grid-template-columns: 1fr;
        grid-column: span 1;
    }
}

@media (max-width: 767.98px) {
    .historical-admin-stat-grid,
    .historical-admin-highlights,
    .historical-admin-chart-grid {
        grid-template-columns: 1fr;
    }

    .historical-admin-toolbar-meta {
        justify-content: stretch;
    }

    .historical-admin-meta-chip,
    .historical-admin-filter-note {
        width: 100%;
        justify-content: flex-start;
    }
}
.historical-admin-page .manager-admin-hero {
    background: linear-gradient(135deg, rgba(238, 244, 255, 0.96) 0%, rgba(245, 241, 255, 0.96) 48%, rgba(241, 249, 246, 0.98) 100%);
}

.historical-admin-page .manager-admin-hero-tags span {
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(99, 118, 199, 0.14);
}

.historical-admin-filter-panel {
    background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(247,249,255,0.98) 100%);
}

.historical-admin-filter-panel .manager-admin-btn-primary {
    background: linear-gradient(180deg, #5b74ff 0%, #315efb 100%);
}

.historical-admin-meta-chip {
    background: linear-gradient(180deg, rgba(255,255,255,0.96) 0%, rgba(242,246,255,0.96) 100%);
    border-color: rgba(83, 100, 141, 0.1);
}

.historical-admin-filter-note {
    background: linear-gradient(180deg, rgba(49, 94, 251, 0.12) 0%, rgba(140, 82, 255, 0.1) 100%);
    color: #304ab8;
}

.historical-admin-highlight-top {
    background: linear-gradient(180deg, rgba(49, 94, 251, 0.12) 0%, rgba(255,255,255,0.98) 100%);
}

.historical-admin-highlight-total {
    background: linear-gradient(180deg, rgba(97, 196, 166, 0.14) 0%, rgba(255,255,255,0.98) 100%);
}

.historical-admin-highlight-low {
    background: linear-gradient(180deg, rgba(140, 82, 255, 0.14) 0%, rgba(255,255,255,0.98) 100%);
}

[data-theme="dark"] .historical-admin-page .manager-admin-hero {
    background: linear-gradient(135deg, rgba(10, 16, 32, 0.98) 0%, rgba(18, 22, 47, 0.98) 45%, rgba(12, 26, 35, 0.98) 100%);
}

[data-theme="dark"] .historical-admin-page .manager-admin-hero-tags span {
    background: rgba(18, 29, 54, 0.94);
    border-color: rgba(112, 133, 190, 0.16);
}

[data-theme="dark"] .historical-admin-filter-panel {
    background: linear-gradient(180deg, rgba(12,20,39,0.96) 0%, rgba(15,25,48,0.96) 100%);
}
.historical-admin-grid-board {
    gap: 1rem;
}

.historical-admin-filter-panel-compact {
    padding: 1.1rem 1.2rem;
}

.historical-admin-panel-head-tight {
    margin-bottom: 0.9rem;
}

.historical-board-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 1rem;
}

.historical-board-panel,
.historical-board-kpi {
    min-width: 0;
}

.historical-board-kpi {
    display: grid;
    align-content: center;
    min-height: 132px;
    padding: 1.2rem 1.25rem;
    border-radius: 1.45rem;
    color: #fff;
}

.historical-board-kpi span,
.historical-board-kpi small {
    display: block;
    color: rgba(255,255,255,0.82);
}

.historical-board-kpi strong {
    display: block;
    margin: 0.35rem 0;
    font-size: 2rem;
    font-weight: 800;
}

.historical-board-kpi-ms {
    grid-column: span 2;
    background: linear-gradient(180deg, #315efb 0%, #2748cb 100%);
}

.historical-board-kpi-hsd {
    grid-column: span 2;
    background: linear-gradient(180deg, #8c52ff 0%, #6a32db 100%);
}

.historical-board-donut {
    grid-column: span 3;
}

.historical-board-yoy {
    grid-column: span 5;
}

.historical-board-trend {
    grid-column: span 7;
}

.historical-board-highlights {
    grid-column: span 5;
}

.historical-board-ranking {
    grid-column: span 5;
}

.historical-board-sales-area {
    grid-column: span 3;
}

.historical-board-scope {
    grid-column: span 2;
}

.historical-board-topms {
    grid-column: span 3;
}

.historical-board-tophsd {
    grid-column: span 4;
}

.historical-board-fuelsplit {
    grid-column: span 5;
}

.historical-board-panel-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.85rem;
}

.historical-board-panel-head h3 {
    margin: 0.15rem 0 0;
    color: var(--mad-text);
    font-size: 1.05rem;
    font-weight: 800;
}

.historical-board-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    background: rgba(49, 94, 251, 0.08);
    color: #315efb;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.historical-chart-expand-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid rgba(49, 94, 251, 0.22);
    border-radius: 8px;
    background: #ffffff;
    color: #315efb;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05);
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

.historical-chart-expand-btn:hover,
.historical-chart-expand-btn:focus {
    background: #f4f7ff;
    border-color: rgba(49, 94, 251, 0.42);
    color: #2748cb;
    transform: translateY(-1px);
}

.historical-chart-modal-dialog {
    width: min(1180px, calc(100vw - 2rem));
    max-width: none;
}

.historical-chart-modal-content {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: min(84vh, 780px);
    min-width: min(760px, calc(100vw - 2rem));
    min-height: 520px;
    max-width: calc(100vw - 2rem);
    max-height: calc(100vh - 2rem);
    resize: both;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
}

.historical-chart-modal-content .modal-header {
    align-items: center;
    padding: 1rem 1.2rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    background: #f8fafc;
}

.historical-chart-modal-content .modal-title {
    margin-top: 0.1rem;
    color: #0f172a;
    font-size: 1.05rem;
    font-weight: 800;
}

.historical-chart-modal-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.historical-chart-modal-actions .btn {
    min-width: 54px;
    border-radius: 8px;
    font-size: 0.75rem;
    font-weight: 800;
}

.historical-chart-modal-content .btn-close {
    border-radius: 8px;
    opacity: 0.65;
}

.historical-chart-modal-content .btn-close:focus {
    box-shadow: 0 0 0 0.18rem rgba(49, 94, 251, 0.16);
}

.historical-chart-modal-body {
    flex: 1 1 auto;
    min-height: 0;
    padding: 1rem 1.2rem 1.2rem;
    background: #f8fafc;
    overflow: auto;
}

.historical-expanded-chart-shell {
    position: relative;
    height: 100%;
    min-height: 0;
    width: 100%;
    padding: 1rem;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 8px;
    background:
        linear-gradient(#ffffff, #ffffff) padding-box,
        linear-gradient(135deg, rgba(49, 94, 251, 0.18), rgba(85, 198, 235, 0.16)) border-box;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.9),
        0 10px 28px rgba(15, 23, 42, 0.06);
}

.historical-expanded-chart-shell::before {
    content: "";
    position: absolute;
    inset: 1rem;
    border-radius: 6px;
    background-image:
        linear-gradient(rgba(15, 23, 42, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(15, 23, 42, 0.035) 1px, transparent 1px);
    background-size: 64px 64px;
    pointer-events: none;
}

.historical-expanded-chart-shell canvas {
    position: relative;
    z-index: 1;
    display: block;
    width: 100% !important;
    height: 100% !important;
}

.historical-chart-modal-content::after {
    content: "";
    position: absolute;
    right: 6px;
    bottom: 6px;
    width: 16px;
    height: 16px;
    background:
        linear-gradient(135deg, transparent 0 50%, rgba(49, 94, 251, 0.45) 50% 58%, transparent 58% 100%),
        linear-gradient(135deg, transparent 0 68%, rgba(49, 94, 251, 0.32) 68% 76%, transparent 76% 100%);
    pointer-events: none;
}

.historical-admin-highlights-compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

.historical-admin-highlights-compact .historical-admin-highlight {
    min-height: 120px;
}

.historical-board-summary-stack {
    height: 100%;
}

.historical-admin-records-panel {
    padding-bottom: 0.5rem;
}

.historical-admin-table-compact thead th,
.historical-admin-table-compact tbody td {
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
}

.historical-admin-table-compact thead th {
    font-size: 0.75rem;
}

.historical-admin-table-compact tbody td {
    font-size: 0.86rem;
}

[data-theme="dark"] .historical-board-chip {
    background: rgba(98, 121, 255, 0.18);
    color: #d7e0ff;
}

[data-theme="dark"] .historical-chart-expand-btn {
    border-color: rgba(148, 163, 184, 0.26);
    background: #172338;
    color: #d7e0ff;
    box-shadow: none;
}

[data-theme="dark"] .historical-chart-expand-btn:hover,
[data-theme="dark"] .historical-chart-expand-btn:focus {
    background: #1f2d46;
    border-color: rgba(148, 163, 184, 0.42);
    color: #ffffff;
}

[data-theme="dark"] .historical-chart-modal-content,
[data-theme="dark"] .historical-chart-modal-body,
[data-theme="dark"] .historical-expanded-chart-shell {
    border-color: rgba(148, 163, 184, 0.18);
}

[data-theme="dark"] .historical-chart-modal-body {
    background: #0b1220;
}

[data-theme="dark"] .historical-expanded-chart-shell {
    background:
        linear-gradient(#101827, #101827) padding-box,
        linear-gradient(135deg, rgba(125, 154, 255, 0.28), rgba(85, 198, 235, 0.18)) border-box;
    box-shadow: 0 16px 42px rgba(0, 0, 0, 0.25);
}

[data-theme="dark"] .historical-expanded-chart-shell::before {
    background-image:
        linear-gradient(rgba(226, 232, 240, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(226, 232, 240, 0.045) 1px, transparent 1px);
}

[data-theme="dark"] .historical-chart-modal-content .modal-header {
    background: #111c2e;
    border-bottom-color: rgba(148, 163, 184, 0.16);
}

[data-theme="dark"] .historical-chart-modal-content .modal-title {
    color: #e5edf7;
}

[data-theme="dark"] .historical-chart-modal-content::after {
    background:
        linear-gradient(135deg, transparent 0 50%, rgba(215, 224, 255, 0.55) 50% 58%, transparent 58% 100%),
        linear-gradient(135deg, transparent 0 68%, rgba(215, 224, 255, 0.38) 68% 76%, transparent 76% 100%);
}

@media (max-width: 1399.98px) {
    .historical-board-grid {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }

    .historical-board-kpi-ms,
    .historical-board-kpi-hsd,
    .historical-board-donut,
    .historical-board-sales-area,
    .historical-board-scope,
    .historical-board-topms,
    .historical-board-tophsd {
        grid-column: span 4;
    }

    .historical-board-yoy,
    .historical-board-trend,
    .historical-board-highlights,
    .historical-board-ranking,
    .historical-board-fuelsplit {
        grid-column: span 8;
    }

    .historical-admin-highlights-compact {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .historical-chart-modal-dialog {
        max-width: calc(100vw - 0.75rem);
        width: calc(100vw - 0.75rem);
        margin-inline: 0.375rem;
    }

    .historical-chart-modal-content {
        resize: vertical;
        min-width: 0;
        min-height: 420px;
        height: 78vh;
    }

    .historical-chart-modal-content .modal-header,
    .historical-chart-modal-body {
        padding-inline: 0.85rem;
    }

    .historical-chart-modal-actions {
        gap: 0.35rem;
    }

    .historical-chart-modal-actions .btn {
        min-width: 46px;
        padding-inline: 0.45rem;
    }

    .historical-expanded-chart-shell {
        min-height: 0;
        height: 100%;
    }
}

@media (max-width: 991.98px) {
    .historical-board-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .historical-board-grid > * {
        grid-column: span 2;
    }
}

@media (max-width: 575.98px) {
    .historical-admin-highlights-compact {
        grid-template-columns: 1fr;
    }
}
.dealer-admin-page {
    display: grid;
    gap: 1.5rem;
}

.dealer-admin-hero {
    display: flex;
    justify-content: space-between;
    gap: 1.5rem;
    align-items: flex-start;
    padding: 2rem 2.2rem;
    border-radius: 1.8rem;
    background: linear-gradient(135deg, rgba(239, 244, 255, 0.98) 0%, rgba(246, 241, 255, 0.98) 50%, rgba(239, 250, 245, 0.98) 100%);
    border: 1px solid rgba(102, 119, 173, 0.1);
    box-shadow: 0 24px 50px rgba(59, 82, 128, 0.08);
}

.dealer-admin-title {
    margin: 0.35rem 0 0;
    color: var(--mad-text);
    font-size: clamp(2rem, 3vw, 2.7rem);
    line-height: 1.05;
    font-weight: 850;
}

.dealer-admin-subtitle {
    max-width: 760px;
    margin: 0.65rem 0 0;
    color: var(--mad-muted);
}

.dealer-admin-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    align-items: center;
    justify-content: flex-end;
}

.dealer-admin-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0.7rem 1rem;
    border-radius: 999px;
    font-size: 0.84rem;
    font-weight: 700;
    border: 1px solid rgba(96, 111, 166, 0.12);
    background: rgba(255,255,255,0.86);
    color: var(--mad-text);
}

.dealer-admin-chip-open { color: #17845f; background: rgba(97, 196, 166, 0.12); border-color: rgba(97, 196, 166, 0.2); }
.dealer-admin-chip-locked { color: #cf4c73; background: rgba(255, 111, 145, 0.12); border-color: rgba(255, 111, 145, 0.2); }
.dealer-admin-chip-neutral { color: #47546f; }
.dealer-admin-cta { white-space: nowrap; }

.dealer-admin-shell { min-width: 0; }

.dealer-admin-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 1rem;
}

.dealer-admin-panel,
.dealer-admin-alert-panel,
.dealer-admin-stat-grid,
.dealer-admin-analytics-grid {
    min-width: 0;
}

.dealer-admin-panel {
    background: #fff;
    border: 1px solid rgba(90, 109, 150, 0.09);
    border-radius: 1.5rem;
    box-shadow: 0 18px 38px rgba(55, 76, 118, 0.07);
    padding: 1.35rem;
}

.dealer-admin-panel-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
}

.dealer-admin-panel-head h2 {
    margin: 0.15rem 0 0;
    color: var(--mad-text);
    font-size: 1.2rem;
    font-weight: 800;
}

.dealer-admin-panel-head p {
    margin: 0.35rem 0 0;
    color: var(--mad-muted);
}

.dealer-admin-kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.55rem 0.85rem;
    border-radius: 999px;
    background: rgba(49, 94, 251, 0.08);
    color: #315efb;
    font-size: 0.76rem;
    font-weight: 800;
}

.dealer-admin-panel-ro { grid-column: span 5; }
.dealer-admin-panel-status { grid-column: span 3; }
.dealer-admin-panel-map { grid-column: span 4; }

.dealer-admin-ro-grid,
.dealer-admin-facility-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.85rem;
}

.dealer-admin-ro-grid > div,
.dealer-admin-facility-grid > div,
.dealer-admin-status-item,
.dealer-admin-summary-card {
    padding: 0.9rem 1rem;
    border-radius: 1.1rem;
    background: linear-gradient(180deg, rgba(248,250,255,0.98) 0%, rgba(243,246,255,0.98) 100%);
    border: 1px solid rgba(92, 110, 149, 0.09);
}

.dealer-admin-ro-grid span,
.dealer-admin-facility-grid span,
.dealer-admin-status-item span {
    display: block;
    color: var(--mad-muted);
    font-size: 0.76rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.dealer-admin-ro-grid strong,
.dealer-admin-facility-grid strong,
.dealer-admin-status-item strong {
    display: block;
    margin-top: 0.35rem;
    color: var(--mad-text);
    font-weight: 800;
}

.dealer-admin-tag-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 1rem;
}

.dealer-admin-tag {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 0.8rem;
    border-radius: 999px;
    background: rgba(49, 94, 251, 0.08);
    color: #315efb;
    font-size: 0.78rem;
    font-weight: 700;
}

.dealer-admin-status-stack {
    display: grid;
    gap: 0.8rem;
}

.dealer-admin-status-item small {
    display: block;
    margin-top: 0.2rem;
    color: var(--mad-muted);
}

.dealer-admin-status-item.open { background: linear-gradient(180deg, rgba(97,196,166,0.12) 0%, rgba(255,255,255,0.98) 100%); }
.dealer-admin-status-item.locked { background: linear-gradient(180deg, rgba(255,111,145,0.12) 0%, rgba(255,255,255,0.98) 100%); }
.dealer-admin-status-item.neutral { background: linear-gradient(180deg, rgba(140,82,255,0.1) 0%, rgba(255,255,255,0.98) 100%); }

.dealer-admin-map-canvas {
    width: 100%;
    height: 360px;
    border-radius: 1rem;
    overflow: hidden;
    background: #eef2f7;
}

.dealer-admin-alert-panel {
    grid-column: 1 / -1;
    padding: 1rem 1.2rem;
    border-radius: 1.25rem;
    font-weight: 600;
}

.dealer-admin-alert-panel.info { background: rgba(56, 189, 248, 0.1); color: #0d6992; border: 1px solid rgba(56, 189, 248, 0.18); }
.dealer-admin-alert-panel.danger { background: rgba(255, 111, 145, 0.12); color: #c53f69; border: 1px solid rgba(255, 111, 145, 0.2); }

.dealer-admin-stat-grid {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.dealer-admin-stat-grid-historical {
    margin-top: -0.2rem;
}

.dealer-admin-stat-card {
    border-radius: 1.45rem;
    padding: 1.2rem 1.25rem;
    color: #fff;
    box-shadow: 0 18px 36px rgba(35, 51, 96, 0.14);
}

.dealer-admin-stat-card span,
.dealer-admin-stat-card small {
    display: block;
    color: rgba(255,255,255,0.82);
}

.dealer-admin-stat-card strong {
    display: block;
    margin: 0.35rem 0;
    font-size: 1.95rem;
    font-weight: 850;
}

.dealer-admin-stat-card-primary { background: linear-gradient(180deg, #315efb 0%, #2748cb 100%); }
.dealer-admin-stat-card-blue { background: linear-gradient(180deg, #55c6eb 0%, #339ec8 100%); }
.dealer-admin-stat-card-green { background: linear-gradient(180deg, #6ac9ab 0%, #42a987 100%); }
.dealer-admin-stat-card-purple { background: linear-gradient(180deg, #8c52ff 0%, #6a32db 100%); }
.dealer-admin-stat-card-warm { background: linear-gradient(180deg, #ffbf5d 0%, #f39c23 100%); }

.dealer-admin-panel-indent { grid-column: 1 / -1; }
.dealer-admin-tab-nav { margin-bottom: 1rem; }
.dealer-admin-pane-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.85rem;
}

.dealer-admin-analytics-grid {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 1rem;
}

.dealer-admin-panel-chart-main { grid-column: span 7; }
.dealer-admin-panel-activity { grid-column: span 5; }
.dealer-admin-panel-monthly { grid-column: 1 / -1; }
.dealer-admin-panel-activity-only { grid-column: 1 / -1; }
.dealer-admin-panel-facilities { grid-column: 1 / -1; }

.dealer-admin-chart-tabs { margin-bottom: 0.9rem; }
.dealer-admin-chart-body { min-width: 0; }
.dealer-admin-activity-scroll { max-height: 560px; }
.dealer-admin-table thead th { white-space: nowrap; }

[data-theme="dark"] .dealer-admin-hero {
    background: linear-gradient(135deg, rgba(10,16,32,0.98) 0%, rgba(18,22,47,0.98) 48%, rgba(11,26,36,0.98) 100%);
    border-color: rgba(109, 128, 174, 0.14);
    box-shadow: none;
}

[data-theme="dark"] .dealer-admin-title { color: #f4f7ff; }
[data-theme="dark"] .dealer-admin-subtitle { color: #9aa8ce; }
[data-theme="dark"] .dealer-admin-chip,
[data-theme="dark"] .dealer-admin-panel,
[data-theme="dark"] .dealer-admin-ro-grid > div,
[data-theme="dark"] .dealer-admin-facility-grid > div,
[data-theme="dark"] .dealer-admin-status-item,
[data-theme="dark"] .dealer-admin-kicker,
[data-theme="dark"] .dealer-admin-tag {
    box-shadow: none;
}

[data-theme="dark"] .dealer-admin-chip {
    background: rgba(18, 29, 54, 0.94);
    border-color: rgba(112, 133, 190, 0.16);
    color: #eef4ff;
}

[data-theme="dark"] .dealer-admin-panel {
    background: rgba(12,20,39,0.96);
    border-color: rgba(109, 128, 174, 0.16);
}

[data-theme="dark"] .dealer-admin-panel-head h2,
[data-theme="dark"] .dealer-admin-ro-grid strong,
[data-theme="dark"] .dealer-admin-facility-grid strong,
[data-theme="dark"] .dealer-admin-status-item strong { color: #f3f6ff; }

[data-theme="dark"] .dealer-admin-panel-head p,
[data-theme="dark"] .dealer-admin-ro-grid span,
[data-theme="dark"] .dealer-admin-facility-grid span,
[data-theme="dark"] .dealer-admin-status-item span,
[data-theme="dark"] .dealer-admin-status-item small { color: #93a1c7; }

[data-theme="dark"] .dealer-admin-ro-grid > div,
[data-theme="dark"] .dealer-admin-facility-grid > div,
[data-theme="dark"] .dealer-admin-status-item {
    background: linear-gradient(180deg, rgba(15,25,48,0.96) 0%, rgba(12,20,39,0.96) 100%);
    border-color: rgba(109, 128, 174, 0.16);
}

@media (max-width: 1399.98px) {
    .dealer-admin-panel-ro { grid-column: span 6; }
    .dealer-admin-panel-status { grid-column: span 6; }
    .dealer-admin-panel-map { grid-column: 1 / -1; }
    .dealer-admin-panel-chart-main,
    .dealer-admin-panel-activity { grid-column: span 6; }
}

@media (max-width: 991.98px) {
    .dealer-admin-hero { flex-direction: column; }
    .dealer-admin-grid,
    .dealer-admin-analytics-grid { grid-template-columns: 1fr; }
    .dealer-admin-panel-ro,
    .dealer-admin-panel-status,
    .dealer-admin-panel-map,
    .dealer-admin-panel-chart-main,
    .dealer-admin-panel-activity,
    .dealer-admin-panel-monthly,
    .dealer-admin-panel-activity-only,
    .dealer-admin-panel-facilities { grid-column: span 1; }
    .dealer-admin-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 575.98px) {
    .dealer-admin-hero,
    .dealer-admin-panel { padding: 1rem; }
    .dealer-admin-stat-grid { grid-template-columns: 1fr; }
    .dealer-admin-hero-actions { justify-content: stretch; }
    .dealer-admin-chip,
    .dealer-admin-cta { width: 100%; }
}
.dealer-new-page {
    display: grid;
    gap: 1.5rem;
    max-width: 1280px;
    margin: 0 auto;
}

.dealer-new-hero {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
    padding: 2rem 2.15rem;
    border-radius: 1.8rem;
    background: linear-gradient(135deg, rgba(230, 244, 255, 0.98) 0%, rgba(244, 250, 255, 0.98) 58%, rgba(255, 255, 255, 0.98) 100%);
    border: 1px solid rgba(122, 181, 232, 0.22);
    box-shadow: 0 22px 48px rgba(70, 118, 173, 0.08);
}

.dealer-new-title {
    margin: 0.35rem 0 0;
    font-size: clamp(2rem, 3vw, 2.8rem);
    line-height: 1.04;
    font-weight: 850;
    color: #16365f;
}

.dealer-new-subtitle {
    margin: 0.7rem 0 0;
    max-width: 760px;
    color: #5a7190;
}

.dealer-new-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    justify-content: flex-end;
    align-items: center;
}

.dealer-new-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0.7rem 1rem;
    border-radius: 999px;
    font-size: 0.84rem;
    font-weight: 700;
    background: rgba(255,255,255,0.88);
    border: 1px solid rgba(121, 150, 194, 0.16);
    color: #39516f;
}

.dealer-new-chip-open { color: #167a8e; background: rgba(85, 198, 235, 0.14); border-color: rgba(85, 198, 235, 0.2); }
.dealer-new-chip-locked { color: #c14d71; background: rgba(255, 111, 145, 0.12); border-color: rgba(255, 111, 145, 0.2); }
.dealer-new-chip-neutral { color: #455c7b; }

.dealer-new-alert {
    padding: 1rem 1.2rem;
    border-radius: 1.2rem;
    font-weight: 600;
    border: 1px solid transparent;
}

.dealer-new-alert-warning { background: rgba(255, 191, 93, 0.15); border-color: rgba(255, 191, 93, 0.25); color: #8b5c11; }
.dealer-new-alert-info { background: rgba(85, 198, 235, 0.12); border-color: rgba(85, 198, 235, 0.2); color: #0f6e8f; }
.dealer-new-alert-danger { background: rgba(255, 111, 145, 0.12); border-color: rgba(255, 111, 145, 0.2); color: #c13f67; }

.dealer-new-stat-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 1rem;
}

.dealer-new-stat-card {
    padding: 1.15rem 1.2rem;
    border-radius: 1.4rem;
    border: 1px solid rgba(124, 151, 191, 0.12);
    box-shadow: 0 18px 34px rgba(70, 98, 140, 0.06);
}

.dealer-new-stat-card span,
.dealer-new-stat-card small {
    display: block;
}

.dealer-new-stat-card span {
    color: #6480a3;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.dealer-new-stat-card strong {
    display: block;
    margin: 0.45rem 0 0.3rem;
    color: #17375f;
    font-size: 1.25rem;
    font-weight: 800;
}

.dealer-new-stat-card small {
    color: #7991b1;
}

.dealer-new-stat-card-white {
    background: #fff;
}

.dealer-new-stat-card-sky {
    background: linear-gradient(180deg, #55c6eb 0%, #3aaad1 100%);
    color: #fff;
}

.dealer-new-stat-card-sky span,
.dealer-new-stat-card-sky strong,
.dealer-new-stat-card-sky small { color: rgba(255,255,255,0.92); }

.dealer-new-stat-card-sky-soft {
    background: linear-gradient(180deg, rgba(85, 198, 235, 0.18) 0%, rgba(255,255,255,0.98) 100%);
}

.dealer-new-form-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 1rem;
}

.dealer-new-panel-full { grid-column: 1 / -1; }
.dealer-new-panel { grid-column: span 6; }

.dealer-new-panel {
    background: #fff;
    border: 1px solid rgba(122, 151, 196, 0.12);
    border-radius: 1.5rem;
    box-shadow: 0 18px 36px rgba(70, 98, 140, 0.06);
    padding: 1.35rem;
    min-width: 0;
}

.dealer-new-panel-ly {
    background: linear-gradient(180deg, rgba(244,249,255,0.98) 0%, rgba(255,255,255,0.98) 100%);
}

.dealer-new-panel-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
}

.dealer-new-panel-head h2 {
    margin: 0.12rem 0 0;
    font-size: 1.18rem;
    font-weight: 800;
    color: #18375f;
}

.dealer-new-panel-head p {
    margin: 0.35rem 0 0;
    color: #68809f;
}

.dealer-new-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0.45rem 0.8rem;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.dealer-new-pill.open { background: rgba(85, 198, 235, 0.14); color: #0f799c; }
.dealer-new-pill.locked { background: rgba(255, 111, 145, 0.12); color: #bf496d; }
.dealer-new-pill.neutral { background: rgba(49, 94, 251, 0.08); color: #315efb; }

.dealer-new-date-grid,
.dealer-new-context-grid,
.dealer-new-field-grid {
    display: grid;
    gap: 1rem;
}

.dealer-new-date-grid {
    grid-template-columns: minmax(240px, 320px) repeat(2, minmax(0, 1fr));
    align-items: stretch;
}

.dealer-new-date-card,
.dealer-new-context-grid > div,
.dealer-new-field-card {
    padding: 1rem;
    border-radius: 1.15rem;
    background: linear-gradient(180deg, rgba(246,250,255,0.98) 0%, rgba(255,255,255,0.98) 100%);
    border: 1px solid rgba(127, 159, 202, 0.12);
}

.dealer-new-date-card span,
.dealer-new-context-grid span,
.dealer-new-field-card label {
    display: block;
    color: #6680a2;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.dealer-new-date-card strong,
.dealer-new-context-grid strong {
    display: block;
    margin-top: 0.35rem;
    color: #18375f;
    font-size: 1rem;
    font-weight: 800;
}

.dealer-new-date-card small {
    display: block;
    margin-top: 0.3rem;
    color: #7a91af;
}

.dealer-new-context-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dealer-new-field-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dealer-new-field-grid-two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dealer-new-field-card-sky {
    background: linear-gradient(180deg, rgba(232, 246, 255, 0.98) 0%, rgba(255,255,255,0.98) 100%);
}

.dealer-new-field-card-readonly {
    background: linear-gradient(180deg, rgba(244,249,255,0.98) 0%, rgba(251,253,255,0.98) 100%);
}

.dealer-new-input {
    min-height: 48px;
    border-radius: 0.95rem;
    border-color: rgba(123, 156, 198, 0.18);
    background: #fff;
}

.dealer-new-input:focus {
    border-color: rgba(85, 198, 235, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(85, 198, 235, 0.18);
}

.dealer-new-textarea {
    min-height: 140px;
}

.dealer-new-submit-panel {
    grid-column: 1 / -1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1.2rem 1.35rem;
    border-radius: 1.5rem;
    background: linear-gradient(180deg, rgba(239,248,255,0.96) 0%, rgba(255,255,255,0.98) 100%);
    border: 1px solid rgba(123, 157, 200, 0.14);
}

.dealer-new-submit-actions {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

[data-theme="dark"] .dealer-new-hero {
    background: linear-gradient(135deg, rgba(10,18,32,0.98) 0%, rgba(14,25,45,0.98) 58%, rgba(12,20,39,0.98) 100%);
    border-color: rgba(101, 129, 170, 0.18);
    box-shadow: none;
}

[data-theme="dark"] .dealer-new-title { color: #f4f8ff; }
[data-theme="dark"] .dealer-new-subtitle,
[data-theme="dark"] .dealer-new-panel-head p,
[data-theme="dark"] .dealer-new-date-card span,
[data-theme="dark"] .dealer-new-date-card small,
[data-theme="dark"] .dealer-new-context-grid span,
[data-theme="dark"] .dealer-new-field-card label { color: #95a6c7; }

[data-theme="dark"] .dealer-new-chip,
[data-theme="dark"] .dealer-new-panel,
[data-theme="dark"] .dealer-new-stat-card,
[data-theme="dark"] .dealer-new-date-card,
[data-theme="dark"] .dealer-new-context-grid > div,
[data-theme="dark"] .dealer-new-field-card,
[data-theme="dark"] .dealer-new-submit-panel {
    box-shadow: none;
}

[data-theme="dark"] .dealer-new-chip {
    background: rgba(18, 29, 54, 0.94);
    border-color: rgba(112, 133, 190, 0.16);
    color: #eef4ff;
}

[data-theme="dark"] .dealer-new-panel,
[data-theme="dark"] .dealer-new-submit-panel {
    background: rgba(12,20,39,0.96);
    border-color: rgba(109, 128, 174, 0.16);
}

[data-theme="dark"] .dealer-new-panel-ly,
[data-theme="dark"] .dealer-new-date-card,
[data-theme="dark"] .dealer-new-context-grid > div,
[data-theme="dark"] .dealer-new-field-card {
    background: linear-gradient(180deg, rgba(15,25,48,0.96) 0%, rgba(12,20,39,0.96) 100%);
    border-color: rgba(109, 128, 174, 0.16);
}

[data-theme="dark"] .dealer-new-panel-head h2,
[data-theme="dark"] .dealer-new-date-card strong,
[data-theme="dark"] .dealer-new-context-grid strong,
[data-theme="dark"] .dealer-new-stat-card strong { color: #f3f6ff; }

[data-theme="dark"] .dealer-new-input {
    background: rgba(11, 20, 39, 0.98);
    border-color: rgba(109, 128, 174, 0.18);
    color: #f3f6ff;
}

[data-theme="dark"] .dealer-new-input::placeholder { color: #7f91b4; }

@media (max-width: 1399.98px) {
    .dealer-new-stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dealer-new-date-grid { grid-template-columns: 1fr 1fr; }
    .dealer-new-date-grid > :first-child { grid-column: 1 / -1; }
}

@media (max-width: 991.98px) {
    .dealer-new-hero { flex-direction: column; }
    .dealer-new-form-grid { grid-template-columns: 1fr; }
    .dealer-new-panel { grid-column: span 1; }
    .dealer-new-context-grid,
    .dealer-new-field-grid,
    .dealer-new-field-grid-two,
    .dealer-new-stat-grid,
    .dealer-new-date-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dealer-new-submit-panel { flex-direction: column; align-items: stretch; }
    .dealer-new-submit-actions { justify-content: stretch; }
}

@media (max-width: 575.98px) {
    .dealer-new-hero,
    .dealer-new-panel,
    .dealer-new-submit-panel { padding: 1rem; }
    .dealer-new-stat-grid,
    .dealer-new-context-grid,
    .dealer-new-field-grid,
    .dealer-new-field-grid-two,
    .dealer-new-date-grid { grid-template-columns: 1fr; }
    .dealer-new-hero-actions,
    .dealer-new-submit-actions { justify-content: stretch; }
    .dealer-new-hero-actions > *,
    .dealer-new-submit-actions > * { width: 100%; }
}

.dealer-new-page {
    width: 100%;
    max-width: none;
}

.dealer-new-stat-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.dealer-new-form-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dealer-new-panel,
.dealer-new-panel-full,
.dealer-new-submit-panel {
    grid-column: span 1;
}

.dealer-new-panel-full,
.dealer-new-submit-panel {
    grid-column: 1 / -1;
}

.dealer-new-date-grid {
    grid-template-columns: minmax(260px, 360px) repeat(2, minmax(0, 1fr));
}

.dealer-new-context-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (min-width: 1400px) {
    .dealer-new-page {
        width: 100%;
        max-width: none;
    }

    .dealer-new-form-grid {
        grid-template-columns: 1.08fr 1.08fr 0.84fr;
    }

    .dealer-new-panel {
        min-height: 100%;
    }
}
.manager-detail-page {
    display: grid;
    gap: 1.5rem;
}

.manager-detail-hero {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
    padding: 1.9rem 2rem;
    border-radius: 1.8rem;
    background: linear-gradient(135deg, rgba(240, 245, 255, 0.98) 0%, rgba(248, 243, 255, 0.98) 52%, rgba(244, 250, 246, 0.98) 100%);
    border: 1px solid rgba(110, 127, 181, 0.1);
    box-shadow: 0 22px 46px rgba(59, 82, 128, 0.08);
}

.manager-detail-title {
    margin: 0.35rem 0 0;
    color: var(--mad-text);
    font-size: clamp(2rem, 3vw, 2.8rem);
    line-height: 1.04;
    font-weight: 850;
}

.manager-detail-subtitle {
    margin: 0.65rem 0 0;
    max-width: 760px;
    color: var(--mad-muted);
}

.manager-detail-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    justify-content: flex-end;
    align-items: center;
}

.manager-detail-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0.7rem 1rem;
    border-radius: 999px;
    font-size: 0.84rem;
    font-weight: 700;
    border: 1px solid rgba(112, 131, 176, 0.12);
    background: rgba(255,255,255,0.88);
}

.manager-detail-chip.open { color: #17845f; background: rgba(97, 196, 166, 0.12); border-color: rgba(97, 196, 166, 0.2); }
.manager-detail-chip.locked { color: #cf4c73; background: rgba(255, 111, 145, 0.12); border-color: rgba(255, 111, 145, 0.2); }

.manager-detail-stat-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1rem;
}

.manager-detail-stat-card {
    padding: 1.15rem 1.2rem;
    border-radius: 1.4rem;
    color: #fff;
    box-shadow: 0 18px 36px rgba(35, 51, 96, 0.14);
}

.manager-detail-stat-card span,
.manager-detail-stat-card small {
    display: block;
    color: rgba(255,255,255,0.82);
}

.manager-detail-stat-card strong {
    display: block;
    margin: 0.35rem 0;
    font-size: 1.55rem;
    font-weight: 850;
}

.manager-detail-stat-card-primary { background: linear-gradient(180deg, #315efb 0%, #2748cb 100%); }
.manager-detail-stat-card-blue { background: linear-gradient(180deg, #55c6eb 0%, #339ec8 100%); }
.manager-detail-stat-card-green { background: linear-gradient(180deg, #6ac9ab 0%, #42a987 100%); }
.manager-detail-stat-card-purple { background: linear-gradient(180deg, #8c52ff 0%, #6a32db 100%); }
.manager-detail-stat-card-warm { background: linear-gradient(180deg, #ffbf5d 0%, #f39c23 100%); }

.manager-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(320px, 0.78fr);
    gap: 1rem;
}

.manager-detail-panel {
    background: #fff;
    border: 1px solid rgba(90, 109, 150, 0.09);
    border-radius: 1.5rem;
    box-shadow: 0 18px 38px rgba(55, 76, 118, 0.07);
    padding: 1.35rem;
    min-width: 0;
}

.manager-detail-section-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.manager-detail-section-card {
    padding: 1.1rem;
    border-radius: 1.25rem;
    border: 1px solid rgba(92, 110, 149, 0.09);
    background: linear-gradient(180deg, rgba(248,250,255,0.98) 0%, rgba(243,246,255,0.98) 100%);
}

.manager-detail-section-card-accent {
    background: linear-gradient(180deg, rgba(49, 94, 251, 0.08) 0%, rgba(255,255,255,0.98) 100%);
}

.manager-detail-section-card-soft {
    background: linear-gradient(180deg, rgba(244,249,255,0.98) 0%, rgba(255,255,255,0.98) 100%);
}

.manager-detail-section-card-full {
    grid-column: 1 / -1;
}

.manager-detail-section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 0.95rem;
}

.manager-detail-section-head h2 {
    margin: 0.15rem 0 0;
    font-size: 1.12rem;
    font-weight: 800;
    color: var(--mad-text);
}

.manager-detail-section-head p {
    margin: 0.35rem 0 0;
    color: var(--mad-muted);
}

.manager-detail-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 0.4rem 0.75rem;
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background: rgba(49, 94, 251, 0.08);
    color: #315efb;
}

.manager-detail-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.manager-detail-field-grid-two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.manager-detail-field-item {
    padding: 0.95rem 1rem;
    border-radius: 1rem;
    background: #fff;
    border: 1px solid rgba(102, 121, 166, 0.08);
}

.manager-detail-field-item span {
    display: block;
    color: var(--mad-muted);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.03em;
}

.manager-detail-field-item strong {
    display: block;
    margin-top: 0.35rem;
    color: var(--mad-text);
    font-size: 1.05rem;
    font-weight: 800;
}

.manager-detail-field-item.featured {
    background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(239,245,255,0.98) 100%);
}

.manager-detail-field-item.muted {
    opacity: 0.92;
}

.manager-detail-remarks-box {
    padding: 1rem 1.1rem;
    border-radius: 1rem;
    background: rgba(49, 94, 251, 0.05);
    border: 1px solid rgba(49, 94, 251, 0.1);
    color: var(--mad-text);
}

.manager-detail-form {
    display: grid;
    gap: 0.2rem;
}

.manager-detail-input {
    min-height: 48px;
    border-radius: 0.95rem;
    border-color: rgba(112, 131, 176, 0.16);
}

.manager-detail-input:focus {
    border-color: rgba(49, 94, 251, 0.45);
    box-shadow: 0 0 0 0.2rem rgba(49, 94, 251, 0.14);
}

.manager-detail-textarea {
    min-height: 150px;
    resize: vertical;
}

.manager-detail-audit-card {
    display: grid;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: 1.1rem;
    background: linear-gradient(180deg, rgba(248,250,255,0.98) 0%, rgba(243,246,255,0.98) 100%);
    border: 1px solid rgba(92, 110, 149, 0.09);
}

.manager-detail-audit-card span {
    display: block;
    color: var(--mad-muted);
    font-size: 0.76rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.manager-detail-audit-card strong {
    display: block;
    margin-top: 0.3rem;
    color: var(--mad-text);
    font-weight: 800;
}

[data-theme="dark"] .manager-detail-hero {
    background: linear-gradient(135deg, rgba(10,16,32,0.98) 0%, rgba(18,22,47,0.98) 52%, rgba(12,26,35,0.98) 100%);
    border-color: rgba(109, 128, 174, 0.14);
    box-shadow: none;
}

[data-theme="dark"] .manager-detail-title { color: #f4f7ff; }
[data-theme="dark"] .manager-detail-subtitle,
[data-theme="dark"] .manager-detail-section-head p,
[data-theme="dark"] .manager-detail-field-item span,
[data-theme="dark"] .manager-detail-audit-card span { color: #93a1c7; }

[data-theme="dark"] .manager-detail-chip,
[data-theme="dark"] .manager-detail-panel,
[data-theme="dark"] .manager-detail-section-card,
[data-theme="dark"] .manager-detail-field-item,
[data-theme="dark"] .manager-detail-audit-card {
    box-shadow: none;
}

[data-theme="dark"] .manager-detail-chip {
    background: rgba(18, 29, 54, 0.94);
    border-color: rgba(112, 133, 190, 0.16);
    color: #eef4ff;
}

[data-theme="dark"] .manager-detail-panel,
[data-theme="dark"] .manager-detail-section-card,
[data-theme="dark"] .manager-detail-audit-card {
    background: rgba(12,20,39,0.96);
    border-color: rgba(109, 128, 174, 0.16);
}

[data-theme="dark"] .manager-detail-field-item,
[data-theme="dark"] .manager-detail-remarks-box {
    background: linear-gradient(180deg, rgba(15,25,48,0.96) 0%, rgba(12,20,39,0.96) 100%);
    border-color: rgba(109, 128, 174, 0.16);
}

[data-theme="dark"] .manager-detail-section-head h2,
[data-theme="dark"] .manager-detail-field-item strong,
[data-theme="dark"] .manager-detail-audit-card strong,
[data-theme="dark"] .manager-detail-remarks-box {
    color: #f3f6ff;
}

[data-theme="dark"] .manager-detail-input {
    background: rgba(11, 20, 39, 0.98);
    border-color: rgba(109, 128, 174, 0.18);
    color: #f3f6ff;
}

@media (max-width: 1199.98px) {
    .manager-detail-stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .manager-detail-grid { grid-template-columns: 1fr; }
}

@media (max-width: 767.98px) {
    .manager-detail-hero { flex-direction: column; padding: 1.2rem; }
    .manager-detail-stat-grid,
    .manager-detail-section-grid,
    .manager-detail-field-grid,
    .manager-detail-field-grid-two { grid-template-columns: 1fr; }
    .manager-detail-panel { padding: 1rem; }
    .manager-detail-hero-actions { justify-content: stretch; }
    .manager-detail-hero-actions > * { width: 100%; }
}
.historical-admin-page .manager-admin-hero {
    background: linear-gradient(135deg, rgba(233, 245, 255, 0.98) 0%, rgba(243, 250, 255, 0.98) 55%, rgba(255, 255, 255, 0.98) 100%);
}

.historical-admin-page .manager-admin-hero-tags span {
    background: rgba(255, 255, 255, 0.95);
    border-color: rgba(117, 177, 230, 0.16);
}

.historical-admin-filter-panel {
    background: linear-gradient(180deg, rgba(255,255,255,0.99) 0%, rgba(245,250,255,0.99) 100%);
}

.historical-admin-filter-panel .manager-admin-btn-primary {
    background: linear-gradient(180deg, #66cfee 0%, #3fb8df 100%);
}

.historical-admin-meta-chip {
    background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(240,248,255,0.98) 100%);
    border-color: rgba(117, 177, 230, 0.14);
}

.historical-admin-filter-note {
    background: linear-gradient(180deg, rgba(85, 198, 235, 0.14) 0%, rgba(188, 239, 255, 0.18) 100%);
    color: #156f8d;
}

.historical-admin-highlight-top {
    background: linear-gradient(180deg, rgba(85, 198, 235, 0.14) 0%, rgba(255,255,255,0.99) 100%);
}

.historical-admin-highlight-total {
    background: linear-gradient(180deg, rgba(119, 217, 243, 0.16) 0%, rgba(255,255,255,0.99) 100%);
}

.historical-admin-highlight-low {
    background: linear-gradient(180deg, rgba(188, 239, 255, 0.26) 0%, rgba(255,255,255,0.99) 100%);
}

.historical-board-chip {
    background: rgba(85, 198, 235, 0.12);
    color: #1490b7;
}

[data-theme="dark"] .historical-admin-page .manager-admin-hero {
    background: linear-gradient(135deg, rgba(9, 20, 33, 0.98) 0%, rgba(11, 28, 43, 0.98) 55%, rgba(12, 20, 39, 0.98) 100%);
}

.ta-intelligence-page {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.ta-intelligence-hero {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
    padding: 2rem 2.2rem;
    border-radius: 28px;
    background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(232,244,255,.92));
    border: 1px solid rgba(148, 163, 184, .18);
    box-shadow: 0 24px 48px rgba(15, 23, 42, .08);
}

.ta-intelligence-title {
    margin: .55rem 0 .55rem;
    font-size: clamp(2rem, 3.2vw, 3rem);
    line-height: 1.05;
    font-weight: 800;
    color: #0f172a;
}

.ta-intelligence-subtitle {
    max-width: 60rem;
    margin: 0;
    color: #64748b;
    font-size: 1rem;
}

.ta-intelligence-hero-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    justify-content: flex-end;
}

.ta-intelligence-hero-tags span {
    padding: .7rem 1rem;
    border-radius: 999px;
    background: rgba(255,255,255,.88);
    border: 1px solid rgba(148, 163, 184, .22);
    color: #475569;
    font-size: .82rem;
    font-weight: 700;
}

.ta-intelligence-filter-card,
.ta-intelligence-chart-card,
.ta-intelligence-table-card,
.ta-intelligence-focus-card,
.ta-intelligence-map-card {
    border: 1px solid rgba(148, 163, 184, .18);
    box-shadow: 0 18px 38px rgba(15, 23, 42, .06);
}

.ta-intelligence-kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
}

.ta-intelligence-kpi-card {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    padding: 1.2rem 1.25rem;
    border-radius: 22px;
    color: #fff;
    box-shadow: 0 18px 34px rgba(15, 23, 42, .12);
}

.ta-intelligence-kpi-card strong {
    font-size: 1.8rem;
    line-height: 1;
}

.ta-intelligence-kpi-card small {
    opacity: .86;
}

.ta-intelligence-kpi-card.tone-primary { background: linear-gradient(135deg, #315efb, #1d4ed8); }
.ta-intelligence-kpi-card.tone-sky { background: linear-gradient(135deg, #55c6eb, #0ea5e9); }
.ta-intelligence-kpi-card.tone-warning { background: linear-gradient(135deg, #ffbf52, #f59e0b); }
.ta-intelligence-kpi-card.tone-success { background: linear-gradient(135deg, #4ec8a8, #10b981); }
.ta-intelligence-kpi-card.tone-purple { background: linear-gradient(135deg, #8c52ff, #6d28d9); }

.ta-intelligence-board {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.ta-intelligence-board .chart-span-2 {
    grid-column: span 2;
}

.ta-intelligence-chart-shell {
    position: relative;
    width: 100%;
}

.ta-chart-xl { min-height: 340px; }
.ta-chart-lg { min-height: 280px; }
.ta-chart-md { min-height: 260px; }

.ta-intelligence-table thead th {
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #64748b;
    background: #f8fbff;
    white-space: nowrap;
}

.ta-intelligence-table tbody td {
    vertical-align: middle;
}

.ta-intelligence-mini-list {
    display: flex;
    flex-direction: column;
    gap: .8rem;
}

.ta-intelligence-mini-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: .95rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(148, 163, 184, .18);
    background: rgba(248, 250, 252, .92);
}

.ta-intelligence-mini-item.warning { background: linear-gradient(135deg, rgba(255,247,214,.9), rgba(255,255,255,.95)); }
.ta-intelligence-mini-item.danger { background: linear-gradient(135deg, rgba(254,226,226,.85), rgba(255,255,255,.95)); }

.ta-intelligence-focus-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
}

.ta-intelligence-focus-metrics > div {
    padding: .95rem 1rem;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(239,248,255,.95), rgba(255,255,255,.95));
    border: 1px solid rgba(148, 163, 184, .18);
}

.ta-intelligence-focus-metrics span {
    display: block;
    font-size: .75rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.ta-intelligence-focus-metrics strong {
    display: block;
    margin-top: .35rem;
    font-size: 1.05rem;
    color: #0f172a;
}

.ta-intelligence-rca-block {
    padding: 1rem 1rem 1.1rem;
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(248,250,252,.96), rgba(255,255,255,.96));
    border: 1px solid rgba(148, 163, 184, .18);
}

.ta-intelligence-rca-list {
    display: grid;
    gap: .8rem;
}

.ta-intelligence-rca-item {
    padding: .8rem .9rem;
    border-radius: 16px;
    background: rgba(236, 245, 255, .95);
    color: #334155;
    border: 1px solid rgba(125, 211, 252, .26);
}

.ta-intelligence-map {
    width: 100%;
    min-height: 460px;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, .18);
    background: #eef2f7;
}

@media (max-width: 1400px) {
    .ta-intelligence-board {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ta-intelligence-board .chart-span-2 {
        grid-column: span 2;
    }
}

@media (max-width: 992px) {
    .ta-intelligence-hero {
        flex-direction: column;
        padding: 1.4rem 1.35rem;
    }

    .ta-intelligence-hero-tags {
        justify-content: flex-start;
    }

    .ta-intelligence-board,
    .ta-intelligence-board .chart-span-2 {
        grid-template-columns: 1fr;
        grid-column: auto;
    }
}

@media (max-width: 768px) {
    .ta-intelligence-focus-metrics {
        grid-template-columns: 1fr;
    }

    .ta-intelligence-map {
        min-height: 360px;
    }
}

.edod-hero,
.edod-panel {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.9rem;
    background: var(--card);
    box-shadow: 0 14px 35px rgba(15, 23, 42, 0.07);
}

.edod-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 1.35rem;
}

.edod-hero-polished {
    background:
        linear-gradient(135deg, rgba(14, 116, 144, 0.13), rgba(34, 197, 94, 0.08)),
        var(--card);
}

.edod-hero-polished .healthcheck-hero-copy h1 {
    font-size: clamp(1.8rem, 3vw, 3rem);
}

.edod-hero h1,
.edod-manager-head h2 {
    margin: 0;
    color: var(--brand-900);
    font-weight: 850;
}

.edod-panel {
    padding: 1.25rem;
}

.edod-submission-panel {
    padding: 1.35rem;
}

.edod-panel-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.edod-panel-head h2 {
    margin: 0;
    color: var(--brand-900);
    font-size: 1.35rem;
    font-weight: 850;
}

.edod-panel-head p {
    margin: 0.3rem 0 0;
    color: var(--muted);
}

.edod-upload-list,
.edod-manager-list,
.edod-file-list {
    display: grid;
    gap: 0.85rem;
}

.edod-upload-list > div {
    position: relative;
    padding: 1rem 1rem 1rem 3.2rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.75rem;
    background: rgba(248, 250, 252, 0.82);
}

.edod-upload-list-polished > div {
    display: grid;
    grid-template-columns: 2.4rem minmax(0, 1fr);
    gap: 0.9rem;
    padding: 1rem;
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.96), rgba(255, 255, 255, 0.96));
    transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.edod-upload-list-polished > div:hover {
    border-color: rgba(14, 116, 144, 0.35);
    box-shadow: 0 12px 28px rgba(14, 116, 144, 0.1);
    transform: translateY(-1px);
}

.edod-upload-list-polished > div > span {
    position: static;
    width: 2.35rem;
    height: 2.35rem;
    margin-top: 0.1rem;
}

.edod-upload-list-polished label {
    color: var(--brand-900);
    font-weight: 850;
}

.edod-upload-list-polished p {
    margin: -0.15rem 0 0.65rem;
    color: var(--muted);
    font-size: 0.93rem;
}

.edod-upload-list > div > span {
    position: absolute;
    left: 0.9rem;
    top: 1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 999px;
    background: #0e7490;
    color: #fff;
    font-weight: 800;
}

.edod-upload-list small {
    display: block;
    margin-top: 0.3rem;
    color: var(--muted);
}

.edod-file-list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.7rem;
    background: rgba(248, 250, 252, 0.9);
    text-decoration: none;
}

.edod-file-list span {
    color: var(--brand-900);
    font-weight: 700;
}

.edod-file-list strong {
    color: #0e7490;
    white-space: nowrap;
}

.edod-meta,
.edod-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 0.75rem;
}

.edod-meta div,
.edod-stats div {
    padding: 0.8rem;
    border-radius: 0.7rem;
    background: rgba(248, 250, 252, 0.9);
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.edod-meta span,
.edod-stats span {
    display: block;
    color: var(--muted);
    font-size: 0.82rem;
}

.edod-meta strong,
.edod-stats strong {
    display: block;
    margin-top: 0.25rem;
    color: var(--brand-900);
    font-weight: 850;
}

.edod-filter {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr) auto;
    gap: 0.75rem;
}

.edod-manager-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.edod-manager-head p {
    margin: 0.25rem 0 0;
    color: var(--muted);
}

.edod-review-form textarea {
    resize: vertical;
}

.edod-guide {
    min-height: auto;
}

.edod-locked-state {
    display: grid;
    grid-template-columns: 4rem minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
    padding: 1rem;
    border-radius: 0.85rem;
    background: rgba(240, 253, 250, 0.9);
    border: 1px solid rgba(14, 116, 144, 0.14);
}

.edod-locked-state h3 {
    margin: 0;
    color: var(--brand-900);
    font-weight: 850;
}

.edod-locked-state p {
    margin: 0.25rem 0 0;
    color: var(--muted);
}

.edod-declaration-body {
    display: grid;
    gap: 1rem;
    padding: 1.15rem 1.25rem;
    overflow: auto;
    background: rgba(248, 250, 252, 0.72);
}

.edod-declaration-person,
.edod-declaration-body p {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.75rem;
    background: rgba(255, 255, 255, 0.94);
}

.edod-declaration-person {
    padding: 0.85rem;
}

.edod-declaration-person span {
    display: block;
    color: var(--muted);
    font-size: 0.82rem;
}

.edod-declaration-person strong {
    display: block;
    color: var(--brand-900);
    font-size: 1.05rem;
}

.edod-declaration-body p {
    margin: 0;
    padding: 1rem;
    color: var(--brand-900);
    line-height: 1.6;
    font-weight: 650;
}

[data-theme="dark"] .edod-hero,
[data-theme="dark"] .edod-panel {
    border-color: rgba(148, 163, 184, 0.18);
    background: var(--card);
}

[data-theme="dark"] .edod-upload-list > div,
[data-theme="dark"] .edod-file-list a,
[data-theme="dark"] .edod-meta div,
[data-theme="dark"] .edod-stats div,
[data-theme="dark"] .edod-locked-state,
[data-theme="dark"] .edod-declaration-body,
[data-theme="dark"] .edod-declaration-person,
[data-theme="dark"] .edod-declaration-body p {
    border-color: rgba(148, 163, 184, 0.18);
    background: rgba(15, 23, 42, 0.62);
}

@media (max-width: 768px) {
    .edod-hero,
    .edod-filter,
    .edod-manager-head {
        grid-template-columns: 1fr;
    }

    .edod-manager-head {
        display: grid;
    }

    .edod-filter .btn {
        width: 100%;
    }

    .edod-panel-head,
    .edod-locked-state {
        grid-template-columns: 1fr;
        display: grid;
    }

    .edod-upload-list-polished > div {
        grid-template-columns: 1fr;
    }
}

.edod-scroll-progress {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1100;
    width: 100%;
    height: 3px;
    transform: scaleX(0);
    transform-origin: left center;
    background: linear-gradient(90deg, #0e7490, #22c55e);
}

.edod-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
    gap: 1.25rem;
    align-items: start;
}

.edod-main {
    min-width: 0;
}

.edod-side {
    min-width: 0;
}

.edod-sticky {
    position: sticky;
    top: 5.5rem;
    display: grid;
    gap: 1rem;
}

.edod-status-card {
    min-width: 230px;
    padding: 1rem;
    border: 1px solid rgba(14, 116, 144, 0.16);
    border-radius: 0.9rem;
    background: rgba(255, 255, 255, 0.76);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

.edod-status-card span,
.edod-status-card small {
    display: block;
    color: var(--muted);
}

.edod-status-card strong {
    display: block;
    margin: 0.25rem 0;
    color: #0f766e;
    font-size: 1.55rem;
    font-weight: 900;
}

.edod-upload-grid {
    display: grid;
    gap: 1rem;
}

.edod-upload-card {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem 1rem;
    align-items: start;
    min-height: 8.25rem;
    padding: 1.1rem;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 0.95rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.9));
    cursor: pointer;
    transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.edod-upload-card:hover,
.edod-upload-card:focus-within {
    transform: translateY(-2px);
    border-color: rgba(14, 116, 144, 0.46);
    box-shadow: 0 18px 36px rgba(14, 116, 144, 0.13);
}

.edod-upload-card.has-file {
    border-color: rgba(34, 197, 94, 0.55);
    background:
        linear-gradient(180deg, rgba(240, 253, 244, 0.94), rgba(255, 255, 255, 0.94));
}

.edod-upload-card input[type="file"] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.edod-upload-index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 999px;
    background: #0e7490;
    color: #fff;
    font-weight: 900;
}

.edod-upload-title,
.edod-upload-copy,
.edod-upload-action,
.edod-upload-card .text-danger {
    grid-column: 2;
}

.edod-upload-title {
    color: var(--brand-900);
    font-size: 1.08rem;
    font-weight: 900;
}

.edod-upload-copy {
    margin-top: -0.45rem;
    color: var(--muted);
}

.edod-upload-action {
    display: inline-flex;
    width: fit-content;
    max-width: 100%;
    padding: 0.45rem 0.7rem;
    border-radius: 999px;
    background: rgba(14, 116, 144, 0.1);
    color: #0e7490;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.edod-upload-card.has-file .edod-upload-action {
    background: rgba(34, 197, 94, 0.14);
    color: #15803d;
}

.edod-declaration-preview {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(180px, 260px);
    gap: 1rem;
    align-items: center;
    margin-top: 1rem;
    background: linear-gradient(135deg, rgba(14, 116, 144, 0.09), rgba(34, 197, 94, 0.07));
}

.edod-declaration-preview h2 {
    margin: 0;
    color: var(--brand-900);
    font-size: 1.2rem;
    font-weight: 900;
}

.edod-declaration-preview p {
    margin: 0.25rem 0 0;
    color: var(--muted);
}

.edod-declaration-mini {
    padding: 0.8rem;
    border-radius: 0.75rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.8);
}

.edod-declaration-mini span {
    display: block;
    color: var(--muted);
    font-size: 0.82rem;
}

.edod-declaration-mini strong {
    display: block;
    color: var(--brand-900);
    font-weight: 900;
}

.edod-submit-bar {
    position: sticky;
    bottom: 0.75rem;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.1rem;
    padding: 0.9rem;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 0.9rem;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 18px 38px rgba(15, 23, 42, 0.14);
    backdrop-filter: blur(8px);
}

.edod-submit-bar span,
.edod-submit-bar small {
    display: block;
}

.edod-submit-bar span {
    color: var(--brand-900);
    font-weight: 900;
}

.edod-submit-bar small {
    color: var(--muted);
}

.edod-timeline {
    display: grid;
    gap: 0.8rem;
}

.edod-timeline-item {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: 0.7rem;
    align-items: center;
    padding: 0.75rem;
    border-radius: 0.75rem;
    background: rgba(248, 250, 252, 0.9);
}

.edod-timeline-item span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    background: rgba(14, 116, 144, 0.12);
    color: #0e7490;
    font-weight: 900;
}

.edod-timeline-item.active span {
    background: #0e7490;
    color: #fff;
}

.edod-timeline-item strong {
    color: var(--brand-900);
}

[data-theme="dark"] .edod-status-card,
[data-theme="dark"] .edod-upload-card,
[data-theme="dark"] .edod-declaration-preview,
[data-theme="dark"] .edod-declaration-mini,
[data-theme="dark"] .edod-submit-bar,
[data-theme="dark"] .edod-timeline-item {
    border-color: rgba(148, 163, 184, 0.18);
    background: rgba(15, 23, 42, 0.72);
}

@media (max-width: 992px) {
    .edod-workspace,
    .edod-hero,
    .edod-declaration-preview {
        grid-template-columns: 1fr;
    }

    .edod-sticky {
        position: static;
    }
}

@media (max-width: 640px) {
    .edod-upload-card {
        grid-template-columns: 1fr;
    }

    .edod-upload-title,
    .edod-upload-copy,
    .edod-upload-action,
    .edod-upload-card .text-danger {
        grid-column: 1;
    }

    .edod-submit-bar {
        align-items: stretch;
        flex-direction: column;
    }

    .edod-submit-bar .btn {
        width: 100%;
    }
}

.edod-manager-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(420px, 560px);
    gap: 1.25rem;
    align-items: center;
    padding: 1.35rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.9rem;
    background:
        linear-gradient(135deg, rgba(14, 116, 144, 0.13), rgba(34, 197, 94, 0.08)),
        var(--card);
    box-shadow: 0 14px 35px rgba(15, 23, 42, 0.07);
}

.edod-manager-hero h1 {
    margin: 0;
    color: var(--brand-900);
    font-size: clamp(1.8rem, 3vw, 2.8rem);
    font-weight: 900;
}

.edod-manager-hero p {
    max-width: 62ch;
    margin: 0.45rem 0 0;
    color: var(--muted);
}

.edod-manager-stat-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.65rem;
}

.edod-block-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.85rem;
    background: rgba(255, 255, 255, 0.78);
}

.edod-block-toggle span,
.edod-block-toggle strong,
.edod-block-toggle small {
    display: block;
}

.edod-block-toggle span {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.edod-block-toggle strong {
    color: var(--brand-900);
    font-size: 1.1rem;
    font-weight: 900;
}

.edod-block-toggle small {
    color: var(--muted);
}

.edod-manager-stat {
    padding: 0.85rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.8rem;
    background: rgba(255, 255, 255, 0.78);
    text-decoration: none;
    transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

button.edod-manager-stat {
    width: 100%;
    text-align: left;
    font: inherit;
    cursor: pointer;
}

.edod-manager-stat:hover,
.edod-manager-stat.active {
    transform: translateY(-1px);
    border-color: rgba(14, 116, 144, 0.4);
    box-shadow: 0 12px 24px rgba(14, 116, 144, 0.1);
}

.edod-manager-stat.muted {
    background: rgba(248, 250, 252, 0.72);
}

.edod-manager-stat span,
.edod-manager-stat strong {
    display: block;
}

.edod-manager-stat span {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.edod-manager-stat strong {
    margin-top: 0.25rem;
    color: var(--brand-900);
    font-size: 1.45rem;
    font-weight: 900;
}

.edod-manager-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
}

.edod-manager-search {
    display: flex;
    gap: 0.65rem;
}

.edod-manager-tabs {
    display: inline-flex;
    gap: 0.35rem;
    padding: 0.3rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 999px;
    background: rgba(248, 250, 252, 0.85);
}

.edod-manager-tabs a {
    padding: 0.45rem 0.75rem;
    border-radius: 999px;
    color: var(--muted);
    font-weight: 800;
    text-decoration: none;
}

.edod-manager-tabs a.active {
    background: #0e7490;
    color: #fff;
}

.edod-review-queue {
    display: grid;
    gap: 1rem;
}

.edod-review-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
    gap: 1rem;
    padding: 1rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.9rem;
    background: var(--card);
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
}

.edod-review-title {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.edod-review-title h2 {
    margin: 0;
    color: var(--brand-900);
    font-size: 1.28rem;
    font-weight: 900;
}

.edod-review-title p {
    margin: 0.25rem 0 0;
    color: var(--muted);
}

.edod-review-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
    margin-top: 1rem;
}

.edod-review-meta div {
    padding: 0.75rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.7rem;
    background: rgba(248, 250, 252, 0.9);
}

.edod-review-meta span,
.edod-review-meta strong {
    display: block;
}

.edod-review-meta span {
    color: var(--muted);
    font-size: 0.78rem;
}

.edod-review-meta strong {
    margin-top: 0.2rem;
    color: var(--brand-900);
    font-weight: 850;
}

.edod-review-meta a {
    color: var(--brand);
    text-decoration: none;
}

.edod-review-meta a:hover {
    text-decoration: underline;
}

.edod-review-docs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
    margin-top: 1rem;
}

.edod-review-docs a {
    display: grid;
    gap: 0.45rem;
    min-height: 5.2rem;
    padding: 0.85rem;
    border: 1px solid rgba(14, 116, 144, 0.16);
    border-radius: 0.75rem;
    background: rgba(240, 253, 250, 0.72);
    text-decoration: none;
}

.edod-review-docs span {
    color: var(--brand-900);
    font-weight: 850;
}

.edod-review-docs strong {
    align-self: end;
    color: #0e7490;
    font-size: 0.88rem;
}

.edod-manager-declaration {
    margin-top: 1rem;
    padding: 0.85rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.75rem;
    background: rgba(248, 250, 252, 0.9);
}

.edod-manager-declaration summary {
    color: var(--brand-900);
    font-weight: 850;
    cursor: pointer;
}

.edod-manager-declaration p {
    margin: 0.75rem 0 0;
    color: var(--muted);
    line-height: 1.55;
}

.edod-review-action {
    padding: 1rem;
    border-radius: 0.8rem;
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.96), rgba(255, 255, 255, 0.96));
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.edod-review-action h3 {
    margin: 0;
    color: var(--brand-900);
    font-weight: 900;
}

.edod-review-action p {
    margin: 0.35rem 0 0.85rem;
    color: var(--muted);
}

.edod-review-buttons {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.65rem;
    margin-top: 0.75rem;
}

.edod-empty-state {
    padding: 2rem;
    border: 1px dashed rgba(15, 23, 42, 0.18);
    border-radius: 0.9rem;
    background: rgba(248, 250, 252, 0.85);
    text-align: center;
}

.edod-empty-state span {
    color: #0e7490;
    font-weight: 900;
    text-transform: uppercase;
}

.edod-empty-state h2 {
    margin: 0.4rem 0;
    color: var(--brand-900);
    font-weight: 900;
}

.edod-empty-state p {
    margin: 0;
    color: var(--muted);
}

.edod-preview-modal {
    position: fixed;
    inset: 0;
    z-index: 1085;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: rgba(15, 23, 42, 0.68);
    backdrop-filter: blur(6px);
}

.edod-preview-modal[hidden] {
    display: none;
}

.edod-preview-dialog {
    width: min(1120px, 96vw);
    height: min(840px, 92vh);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 0.9rem;
    background: var(--card);
    box-shadow: 0 30px 90px rgba(15, 23, 42, 0.38);
    overflow: hidden;
}

.edod-preview-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    background: linear-gradient(135deg, rgba(14, 116, 144, 0.12), rgba(34, 197, 94, 0.08));
}

.edod-preview-head h2 {
    margin: 0.2rem 0 0;
    color: var(--brand-900);
    font-size: 1.2rem;
    font-weight: 900;
}

.edod-preview-frame-wrap {
    min-height: 0;
    padding: 0.75rem;
    background: rgba(15, 23, 42, 0.06);
}

.edod-preview-frame-wrap iframe {
    width: 100%;
    height: 100%;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 0.7rem;
    background: #fff;
}

.edod-summary-detail-wrap {
    min-height: 0;
    max-height: min(65vh, 620px);
    overflow: auto;
    padding: 1rem;
    background:
        linear-gradient(180deg, rgba(248, 250, 252, 0.92), rgba(255, 255, 255, 0.96)),
        radial-gradient(circle at top right, rgba(14, 116, 144, 0.12), transparent 32rem);
}

.edod-summary-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 1rem;
    border: 1px solid rgba(14, 116, 144, 0.14);
    border-radius: 0.8rem;
    background: rgba(255, 255, 255, 0.9);
}

.edod-summary-panel-head h3 {
    margin: 0.15rem 0 0;
    color: var(--brand-900);
    font-size: 1.1rem;
    font-weight: 900;
}

.edod-summary-panel-head > strong {
    min-width: 3.25rem;
    padding: 0.45rem 0.7rem;
    border-radius: 999px;
    background: rgba(14, 116, 144, 0.1);
    color: var(--brand-900);
    font-size: 1.2rem;
    line-height: 1;
    text-align: center;
}

.edod-summary-list {
    display: grid;
    gap: 0.75rem;
}

.edod-summary-row {
    display: grid;
    grid-template-columns: minmax(220px, 1.1fr) minmax(360px, 1.6fr);
    gap: 1rem;
    padding: 1rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.85rem;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
}

.edod-summary-code {
    display: inline-flex;
    width: fit-content;
    padding: 0.28rem 0.55rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.06);
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 800;
}

.edod-summary-row h4 {
    margin: 0.55rem 0 0.25rem;
    color: var(--brand-900);
    font-size: 1rem;
    font-weight: 900;
}

.edod-summary-row p {
    margin: 0;
    color: var(--muted);
    font-size: 0.9rem;
}

.edod-summary-row-meta {
    display: grid;
    grid-template-columns: auto minmax(120px, 1fr) minmax(150px, 1fr) minmax(70px, auto);
    align-items: center;
    gap: 0.65rem;
}

.edod-summary-row-meta div {
    min-width: 0;
    padding: 0.55rem 0.65rem;
    border-radius: 0.65rem;
    background: rgba(248, 250, 252, 0.9);
}

.edod-summary-row-meta div span,
.edod-summary-row-meta div strong {
    display: block;
}

.edod-summary-row-meta div span {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
}

.edod-summary-row-meta div strong {
    overflow-wrap: anywhere;
    color: var(--text);
    font-size: 0.86rem;
    font-weight: 850;
}

.edod-preview-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 0.9rem 1.1rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

[data-theme="dark"] .edod-manager-hero,
[data-theme="dark"] .edod-review-card,
[data-theme="dark"] .edod-review-action,
[data-theme="dark"] .edod-preview-dialog {
    border-color: rgba(148, 163, 184, 0.18);
    background: var(--card);
}

[data-theme="dark"] .edod-manager-stat,
[data-theme="dark"] .edod-block-toggle,
[data-theme="dark"] .edod-manager-tabs,
[data-theme="dark"] .edod-review-meta div,
[data-theme="dark"] .edod-review-docs a,
[data-theme="dark"] .edod-manager-declaration,
[data-theme="dark"] .edod-empty-state {
    border-color: rgba(148, 163, 184, 0.18);
    background: rgba(15, 23, 42, 0.62);
}

[data-theme="dark"] .edod-summary-detail-wrap {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.94), rgba(30, 41, 59, 0.96));
}

[data-theme="dark"] .edod-summary-panel-head,
[data-theme="dark"] .edod-summary-row,
[data-theme="dark"] .edod-summary-row-meta div {
    border-color: rgba(148, 163, 184, 0.18);
    background: rgba(15, 23, 42, 0.72);
}

[data-theme="dark"] .edod-summary-code,
[data-theme="dark"] .edod-summary-panel-head > strong {
    background: rgba(148, 163, 184, 0.14);
}

@media (max-width: 1180px) {
    .edod-manager-hero,
    .edod-review-card {
        grid-template-columns: 1fr;
    }

    .edod-manager-stat-grid {
        grid-template-columns: repeat(5, minmax(100px, 1fr));
        overflow-x: auto;
    }
}

@media (max-width: 768px) {
    .edod-manager-toolbar,
    .edod-manager-search,
    .edod-review-title,
    .edod-review-meta,
    .edod-review-docs {
        grid-template-columns: 1fr;
    }

    .edod-manager-search,
    .edod-review-title {
        display: grid;
    }

    .edod-manager-tabs {
        overflow-x: auto;
        border-radius: 0.8rem;
    }

    .edod-review-buttons {
        grid-template-columns: 1fr;
    }

    .edod-preview-dialog {
        width: 96vw;
        height: 90vh;
    }

    .edod-summary-row,
    .edod-summary-row-meta {
        grid-template-columns: 1fr;
    }

    .edod-summary-panel-head {
        align-items: flex-start;
    }

    .edod-preview-actions {
        flex-direction: column-reverse;
    }

    .edod-preview-actions .btn {
        width: 100%;
    }
}

html[data-theme='dark'] .ta-intelligence-hero {
    background: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.92));
    border-color: rgba(148, 163, 184, .14);
}

html[data-theme='dark'] .ta-intelligence-title,
html[data-theme='dark'] .ta-intelligence-focus-metrics strong {
    color: #f8fafc;
}

html[data-theme='dark'] .ta-intelligence-subtitle,
html[data-theme='dark'] .ta-intelligence-table thead th,
html[data-theme='dark'] .ta-intelligence-mini-item .text-secondary,
html[data-theme='dark'] .ta-intelligence-focus-metrics span {
    color: #cbd5e1 !important;
}

html[data-theme='dark'] .ta-intelligence-hero-tags span,
html[data-theme='dark'] .ta-intelligence-mini-item,
html[data-theme='dark'] .ta-intelligence-focus-metrics > div,
html[data-theme='dark'] .ta-intelligence-rca-block,
html[data-theme='dark'] .ta-intelligence-rca-item,
html[data-theme='dark'] .ta-intelligence-filter-card,
html[data-theme='dark'] .ta-intelligence-chart-card,
html[data-theme='dark'] .ta-intelligence-table-card,
html[data-theme='dark'] .ta-intelligence-focus-card,
html[data-theme='dark'] .ta-intelligence-map-card {
    background: rgba(15, 23, 42, .92);
    border-color: rgba(148, 163, 184, .14);
    color: #e2e8f0;
}
.ta-intelligence-comparison-card {
    border: 1px solid rgba(148, 163, 184, .18);
    box-shadow: 0 18px 38px rgba(15, 23, 42, .06);
}

.ta-intelligence-comparison-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.ta-intelligence-comparison-panel {
    padding: 1rem;
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(248,250,252,.96), rgba(255,255,255,.96));
    border: 1px solid rgba(148, 163, 184, .18);
}

.ta-intelligence-comparison-panel.is-focus {
    border-color: rgba(49, 94, 251, .28);
    box-shadow: inset 0 0 0 1px rgba(49, 94, 251, .12);
}

.ta-intelligence-comparison-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .8rem;
}

.ta-intelligence-comparison-metrics > div,
.ta-intelligence-tab-note {
    padding: .85rem .95rem;
    border-radius: 16px;
    background: rgba(239, 248, 255, .95);
    border: 1px solid rgba(125, 211, 252, .26);
}

.ta-intelligence-comparison-metrics span {
    display: block;
    font-size: .74rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.ta-intelligence-comparison-metrics strong {
    display: block;
    margin-top: .3rem;
    color: #0f172a;
}

.ta-intelligence-tabs {
    gap: .55rem;
}

.ta-intelligence-tabs .nav-link {
    border-radius: 999px;
    padding: .55rem 1rem;
    color: #475569;
    background: rgba(248, 250, 252, .95);
    border: 1px solid rgba(148, 163, 184, .18);
    font-weight: 700;
}

.ta-intelligence-tabs .nav-link.active {
    color: #fff;
    background: linear-gradient(135deg, #315efb, #0ea5e9);
    border-color: transparent;
}

.ta-intelligence-tab-content {
    min-height: 320px;
}

html[data-theme='dark'] .ta-intelligence-comparison-panel,
html[data-theme='dark'] .ta-intelligence-comparison-metrics > div,
html[data-theme='dark'] .ta-intelligence-tab-note,
html[data-theme='dark'] .ta-intelligence-tabs .nav-link {
    background: rgba(15, 23, 42, .92);
    border-color: rgba(148, 163, 184, .14);
    color: #e2e8f0;
}

html[data-theme='dark'] .ta-intelligence-comparison-metrics strong {
    color: #f8fafc;
}

@media (max-width: 1200px) {
    .ta-intelligence-comparison-grid {
        grid-template-columns: 1fr;
    }
}

    .portal-body.sidebar-open {
        overflow: hidden;
        touch-action: none;
    }
.ta-focus-modal {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: rgba(15, 23, 42, .52);
    backdrop-filter: blur(8px);
}

.ta-focus-modal.is-open {
    display: flex;
}

.ta-focus-modal__dialog {
    width: min(1280px, 96vw);
    max-height: 92vh;
}

.ta-focus-modal__content {
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(247,250,255,.98));
    border: 1px solid rgba(148, 163, 184, .22);
    border-radius: 28px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .22);
    overflow: hidden;
}

.ta-focus-modal__header,
.ta-focus-modal__body {
    padding: 1.35rem 1.5rem;
}

.ta-focus-modal__body {
    max-height: calc(92vh - 98px);
    overflow: auto;
}

.ta-focus-modal__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid rgba(148, 163, 184, .14);
}

.ta-focus-modal__close {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    border: 1px solid rgba(148, 163, 184, .24);
    background: #fff;
    color: #0f172a;
    font-size: 1.7rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

html[data-theme='dark'] .ta-focus-modal__content {
    background: rgba(15, 23, 42, .98);
    border-color: rgba(148, 163, 184, .18);
}

html[data-theme='dark'] .ta-focus-modal__close {
    background: rgba(30, 41, 59, .96);
    color: #f8fafc;
    border-color: rgba(148, 163, 184, .18);
}

@media (max-width: 768px) {
    .ta-focus-modal {
        padding: .75rem;
    }

    .ta-focus-modal__dialog {
        width: 100%;
        max-height: 96vh;
    }

    .ta-focus-modal__header,
    .ta-focus-modal__body {
        padding: 1rem;
    }
}
.ta-product-watch-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 112px;
    padding: .42rem .8rem;
    border-radius: 999px;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .02em;
    border: 1px solid transparent;
    color: #fff;
}

.ta-product-watch-badge.is-ms-soft {
    background: linear-gradient(135deg, #ef4444, #dc2626);
}

.ta-product-watch-badge.is-hsd-soft {
    background: linear-gradient(135deg, #f59e0b, #ea580c);
}

.ta-product-watch-badge.is-soft {
    background: linear-gradient(135deg, #f97316, #ea580c);
}

.ta-product-watch-badge.is-ms-support {
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
}

.ta-product-watch-badge.is-hsd-support {
    background: linear-gradient(135deg, #0891b2, #0e7490);
}

.ta-product-watch-badge.is-support {
    background: linear-gradient(135deg, #0ea5e9, #0284c7);
}

.ta-product-watch-badge.is-balanced {
    background: linear-gradient(135deg, #64748b, #475569);
}
.ta-compare-checklist {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
    max-height: 198px;
    overflow: auto;
    padding: .8rem;
    border: 1px solid rgba(148, 163, 184, .18);
    border-radius: 16px;
    background: rgba(248, 250, 252, .92);
}

.ta-compare-checklist__item {
    display: flex;
    align-items: flex-start;
    gap: .55rem;
    padding: .55rem .65rem;
    border-radius: 12px;
    background: #fff;
    border: 1px solid rgba(148, 163, 184, .14);
    cursor: pointer;
    font-size: .85rem;
    line-height: 1.35;
}

.ta-compare-checklist__item input {
    margin-top: .15rem;
    flex: 0 0 auto;
}

.ta-compare-checklist__item span {
    color: #0f172a;
}

html[data-theme='dark'] .ta-compare-checklist {
    background: rgba(15, 23, 42, .92);
    border-color: rgba(148, 163, 184, .18);
}

html[data-theme='dark'] .ta-compare-checklist__item {
    background: rgba(30, 41, 59, .92);
    border-color: rgba(148, 163, 184, .14);
}

html[data-theme='dark'] .ta-compare-checklist__item span {
    color: #e2e8f0;
}

@media (max-width: 768px) {
    .ta-compare-checklist {
        grid-template-columns: 1fr;
    }
}

.automation-admin-hero {
    background: linear-gradient(135deg, rgba(15, 118, 110, 0.12), rgba(37, 99, 235, 0.08), rgba(245, 158, 11, 0.08));
}

.automation-kpi-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.automation-kpi-card {
    position: relative;
    overflow: hidden;
}

.automation-kpi-card small {
    display: block;
    margin-top: 0.4rem;
    color: var(--muted);
}

.automation-kpi-card::after {
    content: "";
    position: absolute;
    inset: auto -30px -30px auto;
    width: 96px;
    height: 96px;
    border-radius: 50%;
    opacity: 0.12;
    background: currentColor;
}

.automation-kpi-card.tone-teal { color: #0f766e; }
.automation-kpi-card.tone-gold { color: #b45309; }
.automation-kpi-card.tone-blue { color: #1d4ed8; }
.automation-kpi-card.tone-red { color: #b91c1c; }
.automation-kpi-card.tone-slate { color: #334155; }
.automation-kpi-card.tone-amber { color: #d97706; }




/* 2026-05-07 viewport fix */
.portal-login-body {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    overflow: hidden;
}

.portal-login-body .site-page-shell,
.portal-login-body .site-main,
.portal-login-body .login-shell,
.portal-login-body .login-grid {
    min-height: 100dvh !important;
}

.portal-login-body .site-page-shell,
.portal-login-body .site-main {
    width: 100%;
    overflow: hidden;
}

.login-shell {
    height: 100dvh;
}

.login-grid {
    height: 100dvh;
    padding-top: clamp(1rem, 2.2vw, 2rem);
    padding-bottom: clamp(5.5rem, 9vw, 7.5rem);
    overflow: hidden;
}

.login-brand-panel,
.login-form-panel {
    min-height: 0;
}

.login-illustration {
    margin-bottom: 0;
}

@media (max-width: 1199px) {
    .portal-login-body {
        overflow-y: auto;
        overflow-x: hidden;
    }

    .login-grid {
        height: auto;
        min-height: 100dvh !important;
        padding-bottom: 6.5rem;
    }
}

/* 2026-05-07 mobile and dark-mode fix */
.portal-login-body[data-theme="dark"] {
    background: #0f1220 !important;
    color: #e6e8f2 !important;
}

.portal-login-body[data-theme="dark"] .site-page-shell,
.portal-login-body[data-theme="dark"] .site-main,
.portal-login-body[data-theme="dark"] .login-shell {
    background: #0f1220 !important;
}

.portal-login-body[data-theme="dark"] .login-shell::before {
    background: radial-gradient(circle at 62% 44%, #2b2450 0%, #1c1836 100%) !important;
}

.portal-login-body[data-theme="dark"] .login-brand-blob {
    background: #262044 !important;
}

.portal-login-body[data-theme="dark"] .login-form-display,
.portal-login-body[data-theme="dark"] .login-brand-link,
.portal-login-body[data-theme="dark"] .login-input-modern,
.portal-login-body[data-theme="dark"] .login-field-icon,
.portal-login-body[data-theme="dark"] .password-toggle-modern {
    color: #e6e8f2 !important;
}

.portal-login-body[data-theme="dark"] .login-assist-note,
.portal-login-body[data-theme="dark"] .login-field-error,
.portal-login-body[data-theme="dark"] .login-brand-image + span,
.portal-login-body[data-theme="dark"] .login-brand-link span:last-child {
    color: #b8bdd3 !important;
}

.portal-login-body[data-theme="dark"] .login-profile-badge {
    background: #1c2036 !important;
    color: #c3c7da !important;
}

.portal-login-body[data-theme="dark"] .login-input-modern {
    background: #1b2138 !important;
}

.portal-login-body[data-theme="dark"] .login-input-modern::placeholder {
    color: #b7bdd2 !important;
}

.portal-login-body[data-theme="dark"] .login-input-modern:focus {
    background: #232a46 !important;
    box-shadow: 0 0 0 2px rgba(140, 102, 239, 0.22) !important;
}

@media (max-width: 767px) {
    .portal-login-body,
    .portal-login-body .site-page-shell,
    .portal-login-body .site-main,
    .portal-login-body .login-shell {
        overflow-x: hidden !important;
    }

    .portal-login-body {
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    .login-shell {
        min-height: 100dvh;
        height: auto;
    }

    .login-wave {
        height: 92px;
    }

    .login-grid {
        display: flex;
        flex-direction: column;
        min-height: 100dvh !important;
        height: auto;
        gap: 1rem;
        padding: 1rem 1rem 6rem;
        overflow: visible;
    }

    .login-form-panel {
        order: 1;
        justify-content: center;
        align-items: flex-start;
    }

    .login-brand-panel {
        order: 2;
        justify-content: flex-start;
        min-height: auto;
        padding-right: 0;
        gap: 0.75rem;
    }

    .login-form-wrap {
        width: min(100%, 360px);
        margin: 0 auto;
    }

    .login-profile-badge {
        width: 72px;
        height: 72px;
        margin-bottom: 1rem;
    }

    .login-form-head {
        margin-bottom: 1rem;
    }

    .login-form-display {
        font-size: 1.7rem;
        letter-spacing: 0.06em;
    }

    .login-input-modern,
    .login-submit-modern {
        min-height: 50px;
    }

    .login-assist-row {
        margin: 0.15rem 0 0.9rem;
    }

    .login-brand-mark {
        width: 100%;
        margin-bottom: 0.2rem;
    }

    .login-brand-blob {
        width: 100px;
        height: 100px;
        left: -8px;
        top: -14px;
    }

    .login-brand-image {
        max-width: 152px;
        max-height: 38px;
    }

    .login-illustration {
        width: min(100%, 320px);
        margin: 0 auto;
        align-self: center;
    }

    .login-illustration-image {
        max-height: 220px;
        object-fit: contain;
    }
}

/* 2026-05-07 final mobile hard override */
@media (max-width: 767px) {
    .portal-login-body,
    .portal-login-body .site-page-shell,
    .portal-login-body .site-main,
    .portal-login-body .login-shell {
        min-height: 100svh !important;
        height: auto !important;
        overflow-x: hidden !important;
    }

    .portal-login-body {
        overflow-y: auto !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .portal-login-body .site-main.login-main {
        padding: 0 !important;
    }

    .login-shell::before {
        width: 92px !important;
        height: 92px !important;
        top: -10px !important;
        left: -8px !important;
        border-bottom-right-radius: 120px 90px !important;
    }

    .login-wave {
        height: 72px !important;
        z-index: 0 !important;
    }

    .login-grid {
        display: block !important;
        min-height: 100svh !important;
        height: auto !important;
        padding: 0.85rem 0.85rem calc(1.25rem + env(safe-area-inset-bottom, 0px)) !important;
        overflow: visible !important;
    }

    .login-brand-panel {
        display: block !important;
        min-height: auto !important;
        padding-right: 0 !important;
        margin-top: 0 !important;
    }

    .login-brand-mark {
        margin-bottom: 0.75rem !important;
    }

    .login-brand-blob {
        width: 84px !important;
        height: 84px !important;
        left: -4px !important;
        top: -8px !important;
    }

    .login-brand-image {
        max-width: 138px !important;
        max-height: 34px !important;
    }

    .login-illustration,
    .login-illustration-image {
        display: none !important;
    }

    .login-form-panel {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        position: relative !important;
        z-index: 2 !important;
    }

    .login-form-wrap {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .login-profile-badge {
        width: 64px !important;
        height: 64px !important;
        margin: 0 auto 0.9rem !important;
    }

    .login-profile-badge svg {
        width: 32px !important;
        height: 32px !important;
    }

    .login-form-head {
        margin-bottom: 0.85rem !important;
    }

    .login-form-display {
        font-size: 1.45rem !important;
        letter-spacing: 0.05em !important;
    }

    .login-alert {
        margin-bottom: 0.85rem !important;
        font-size: 0.82rem !important;
    }

    .login-field-wrap {
        margin-bottom: 0 !important;
    }

    .login-input-modern {
        min-height: 48px !important;
        font-size: 14px !important;
        padding: 10px 48px 10px 16px !important;
    }

    .login-field-icon {
        right: 0.9rem !important;
        width: 1rem !important;
        height: 1rem !important;
    }

    .password-toggle-modern {
        right: 2.45rem !important;
        font-size: 0.68rem !important;
    }

    .login-field-error {
        margin-top: 0.35rem !important;
        font-size: 0.76rem !important;
    }

    .login-assist-row {
        margin: 0.15rem 0 0.75rem !important;
    }

    .login-assist-note {
        font-size: 0.75rem !important;
        line-height: 1.4 !important;
    }

    .login-submit,
    .login-submit-modern,
    #loginSubmit {
        display: block !important;
        width: 100% !important;
        min-height: 50px !important;
        margin-top: 0 !important;
        position: relative !important;
        z-index: 3 !important;
        border-radius: 999px !important;
    }
}

/* 2026-05-07 mobile visual cleanup */
@media (max-width: 767px) {
    .portal-login-body,
    .portal-login-body[data-theme="dark"],
    .portal-login-body .site-page-shell,
    .portal-login-body .site-main,
    .portal-login-body .login-shell,
    .portal-login-body .login-grid,
    .portal-login-body .login-brand-panel,
    .portal-login-body .login-form-panel,
    .portal-login-body .login-form-panel-modern,
    .portal-login-body .login-form-wrap {
        background: #ffffff !important;
        color: #545765 !important;
        box-shadow: none !important;
        border: 0 !important;
    }

    .portal-login-body .login-shell::before,
    .portal-login-body .login-brand-blob {
        opacity: 0.75;
    }

    .portal-login-body .login-wave {
        position: fixed !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        height: 64px !important;
        z-index: 0 !important;
    }

    .portal-login-body .login-grid {
        padding: 0.75rem 0.75rem 5.25rem !important;
    }

    .portal-login-body .login-brand-panel {
        margin-bottom: 0.35rem !important;
    }

    .portal-login-body .login-brand-mark {
        margin-bottom: 0.35rem !important;
    }

    .portal-login-body .login-form-panel,
    .portal-login-body .login-form-panel-modern {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .portal-login-body .login-form-wrap {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .portal-login-body .login-form-body {
        margin: 0 !important;
    }

    .portal-login-body .login-profile-badge {
        background: #f2f2f5 !important;
        color: #a5a7b1 !important;
    }

    .portal-login-body .login-illustration,
    .portal-login-body .login-illustration-image,
    .portal-login-body .login-assist-row {
        display: none !important;
    }

    .portal-login-body .login-form-display {
        margin-bottom: 0.1rem !important;
    }

    .portal-login-body .mb-3 {
        margin-bottom: 0.95rem !important;
    }

    .portal-login-body .login-submit,
    .portal-login-body .login-submit-modern,
    .portal-login-body #loginSubmit {
        margin-top: 0.35rem !important;
    }
}
/* 2026-05-07 mobile-only login stabilization */
@media (max-width: 767px) {
    .portal-login-body,
    .portal-login-body[data-theme="dark"],
    .portal-login-body .site-page-shell,
    .portal-login-body .site-main.login-main,
    .portal-login-body .login-shell,
    .portal-login-body .login-grid,
    .portal-login-body .login-brand-panel,
    .portal-login-body .login-form-panel,
    .portal-login-body .login-form-panel-modern,
    .portal-login-body .login-form-wrap {
        background: #ffffff !important;
        color: #545765 !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    .portal-login-body,
    .portal-login-body .site-page-shell,
    .portal-login-body .site-main.login-main,
    .portal-login-body .login-shell {
        min-height: 100svh !important;
        height: auto !important;
        overflow-x: hidden !important;
    }

    .portal-login-body {
        padding: 0 !important;
        overflow-y: auto !important;
    }

    .portal-login-body .site-main.login-main {
        padding: 0 !important;
    }

    .portal-login-body .login-shell {
        overflow: hidden !important;
    }

    .portal-login-body .login-shell::before {
        width: 96px !important;
        height: 96px !important;
        top: -12px !important;
        left: -10px !important;
        border-bottom-right-radius: 120px 88px !important;
        opacity: 0.9 !important;
    }

    .portal-login-body .login-grid {
        min-height: 100svh !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-start !important;
        gap: 0 !important;
        padding: 0.9rem 1rem calc(5.4rem + env(safe-area-inset-bottom, 0px)) !important;
    }

    .portal-login-body .login-brand-panel {
        display: block !important;
        min-height: auto !important;
        padding: 0 !important;
        margin: 0 0 0.65rem 0 !important;
        order: 1 !important;
    }

    .portal-login-body .login-brand-mark {
        width: fit-content !important;
        margin: 0 !important;
    }

    .portal-login-body .login-brand-blob {
        width: 82px !important;
        height: 82px !important;
        left: -5px !important;
        top: -8px !important;
        background: #e7e1ff !important;
    }

    .portal-login-body .login-brand-image {
        max-width: 128px !important;
        max-height: 34px !important;
    }

    .portal-login-body .login-illustration,
    .portal-login-body .login-illustration-image,
    .portal-login-body .login-assist-row {
        display: none !important;
    }

    .portal-login-body .login-form-panel,
    .portal-login-body .login-form-panel-modern {
        display: flex !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        order: 2 !important;
        position: relative !important;
        z-index: 2 !important;
        background: transparent !important;
    }

    .portal-login-body .login-form-wrap {
        width: min(100%, 360px) !important;
        max-width: 100% !important;
        margin: 1rem auto 0 !important;
        padding: 0 !important;
        background: transparent !important;
    }

    .portal-login-body .login-profile-badge {
        width: 72px !important;
        height: 72px !important;
        margin: 0 auto 0.9rem !important;
        background: #f2f2f5 !important;
        color: #a5a7b1 !important;
    }

    .portal-login-body .login-profile-badge svg {
        width: 34px !important;
        height: 34px !important;
    }

    .portal-login-body .login-form-head {
        margin-bottom: 1rem !important;
    }

    .portal-login-body .login-form-display {
        font-size: 1.7rem !important;
        letter-spacing: 0.06em !important;
        color: #545765 !important;
    }

    .portal-login-body .login-alert {
        margin-bottom: 0.8rem !important;
        padding: 0.7rem 0.9rem !important;
        font-size: 0.82rem !important;
        border-radius: 14px !important;
    }

    .portal-login-body .mb-3 {
        margin-bottom: 0.95rem !important;
    }

    .portal-login-body .login-field-wrap {
        position: relative !important;
    }

    .portal-login-body .login-input-modern {
        min-height: 52px !important;
        padding: 12px 54px 12px 18px !important;
        border-radius: 999px !important;
        background: #f1f2f6 !important;
        color: #545765 !important;
        font-size: 15px !important;
        font-weight: 700 !important;
    }

    .portal-login-body .login-input-modern::placeholder {
        color: #666a76 !important;
        opacity: 1 !important;
    }

    .portal-login-body .login-input-modern:focus {
        background: #ece9fb !important;
        box-shadow: 0 0 0 2px rgba(111, 73, 217, 0.14) !important;
    }

    .portal-login-body .login-password-wrap .login-input-modern {
        padding-right: 5.8rem !important;
    }

    .portal-login-body .login-field-icon {
        right: 0.95rem !important;
        width: 1rem !important;
        height: 1rem !important;
        color: #7c7f8d !important;
    }

    .portal-login-body .password-toggle-modern {
        right: 2.55rem !important;
        font-size: 0.68rem !important;
        color: #7c7f8d !important;
    }

    .portal-login-body .login-field-error {
        display: inline-block !important;
        margin-top: 0.4rem !important;
        font-size: 0.76rem !important;
        color: #d14b7f !important;
    }

    .portal-login-body .login-submit,
    .portal-login-body .login-submit-modern,
    .portal-login-body #loginSubmit {
        display: block !important;
        width: 100% !important;
        min-height: 52px !important;
        margin-top: 0.35rem !important;
        border: 0 !important;
        border-radius: 999px !important;
        background: linear-gradient(90deg, #8c66ef 0%, #6f49d9 100%) !important;
        color: #ffffff !important;
        box-shadow: none !important;
        position: relative !important;
        z-index: 3 !important;
    }

    .portal-login-body .login-wave {
        position: fixed !important;
        inset: auto 0 0 0 !important;
        height: 88px !important;
        z-index: 0 !important;
        pointer-events: none !important;
    }
}

@media (max-width: 420px) {
    .portal-login-body .login-grid {
        padding: 0.8rem 0.85rem calc(5rem + env(safe-area-inset-bottom, 0px)) !important;
    }

    .portal-login-body .login-form-wrap {
        margin-top: 0.85rem !important;
    }

    .portal-login-body .login-profile-badge {
        width: 68px !important;
        height: 68px !important;
    }

    .portal-login-body .login-form-display {
        font-size: 1.55rem !important;
    }
}
/* 2026-05-08 login route theme isolation */
.portal-login-body,
.portal-login-body[data-theme="dark"],
.portal-login-body .site-page-shell,
.portal-login-body .site-main,
.portal-login-body .login-shell,
.portal-login-body .login-brand-panel,
.portal-login-body .login-form-panel,
.portal-login-body .login-form-panel-modern,
.portal-login-body .login-form-wrap {
    background: #ffffff !important;
    color: #545765 !important;
    border: 0 !important;
    box-shadow: none !important;
}

.portal-login-body[data-theme="dark"] .login-shell::before {
    background: radial-gradient(circle at 62% 44%, #ece7ff 0%, #dbd4ff 100%) !important;
}

.portal-login-body[data-theme="dark"] .login-brand-blob {
    background: #e7e1ff !important;
}

.portal-login-body[data-theme="dark"] .login-form-panel,
.portal-login-body[data-theme="dark"] .login-form-panel-modern,
.portal-login-body[data-theme="dark"] .login-form-wrap {
    background: transparent !important;
}

.portal-login-body[data-theme="dark"] .login-form-display,
.portal-login-body[data-theme="dark"] .login-assist-note,
.portal-login-body[data-theme="dark"] .login-field-icon,
.portal-login-body[data-theme="dark"] .password-toggle-modern,
.portal-login-body[data-theme="dark"] .login-input-modern,
.portal-login-body[data-theme="dark"] .login-input-modern::placeholder,
.portal-login-body[data-theme="dark"] .login-brand-link {
    color: #545765 !important;
}

.portal-login-body[data-theme="dark"] .login-profile-badge {
    background: #f2f2f5 !important;
    color: #a5a7b1 !important;
}

.portal-login-body[data-theme="dark"] .login-input-modern {
    background: #f1f2f6 !important;
}

.portal-login-body[data-theme="dark"] .login-input-modern:focus {
    background: #ece9fb !important;
    box-shadow: 0 0 0 2px rgba(111, 73, 217, 0.14) !important;
}
/* 2026-05-08 desktop login composition refinement */
@media (min-width: 768px) {
    .portal-login-body,
    .portal-login-body .site-page-shell,
    .portal-login-body .site-main.login-main,
    .portal-login-body .login-shell,
    .portal-login-body .login-grid {
        min-height: 100dvh !important;
    }

    .portal-login-body {
        overflow: hidden !important;
    }

    .portal-login-body .login-shell {
        background: #ffffff !important;
    }

    .portal-login-body .login-shell::before {
        top: -42px !important;
        left: -18px !important;
        width: clamp(180px, 16vw, 240px) !important;
        height: clamp(140px, 13vw, 190px) !important;
        border-bottom-right-radius: 170px 135px !important;
    }

    .portal-login-body .login-grid {
        grid-template-columns: minmax(0, 56%) minmax(380px, 44%) !important;
        align-items: stretch !important;
        gap: clamp(2rem, 4vw, 5rem) !important;
        padding: 1.2rem clamp(2.25rem, 4.2vw, 4.75rem) 4.75rem !important;
    }

    .portal-login-body .login-brand-panel {
        padding-right: 0 !important;
    }

    .portal-login-body .login-brand-mark {
        margin-top: 0.1rem !important;
    }

    .portal-login-body .login-brand-blob {
        width: 128px !important;
        height: 128px !important;
        left: -14px !important;
        top: -18px !important;
    }

    .portal-login-body .login-brand-image {
        max-width: 148px !important;
        max-height: 42px !important;
    }

    .portal-login-body .login-illustration {
        width: min(100%, 540px) !important;
        margin: auto 0 0 clamp(4rem, 9vw, 10rem) !important;
        align-self: flex-start !important;
    }

    .portal-login-body .login-illustration-image {
        width: 100% !important;
        max-height: 48vh !important;
        object-fit: contain !important;
    }

    .portal-login-body .login-form-panel,
    .portal-login-body .login-form-panel-modern {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 clamp(1rem, 3vw, 3.5rem) 1.5rem 0 !important;
        background: transparent !important;
    }

    .portal-login-body .login-form-wrap {
        width: min(100%, 350px) !important;
        margin: 0 auto 0 0 !important;
        padding-top: 3rem !important;
        background: transparent !important;
    }

    .portal-login-body .login-profile-badge {
        width: 74px !important;
        height: 74px !important;
        margin: 0 auto 1rem !important;
    }

    .portal-login-body .login-profile-badge svg {
        width: 34px !important;
        height: 34px !important;
    }

    .portal-login-body .login-form-head {
        margin-bottom: 1.2rem !important;
    }

    .portal-login-body .login-form-display {
        font-size: clamp(2rem, 2.3vw, 2.5rem) !important;
        letter-spacing: 0.08em !important;
    }

    .portal-login-body .mb-3 {
        margin-bottom: 1rem !important;
    }

    .portal-login-body .login-input-modern {
        min-height: 50px !important;
    }

    .portal-login-body .login-assist-row {
        margin: 0.25rem 0 1rem !important;
    }

    .portal-login-body .login-assist-note {
        font-size: 0.76rem !important;
        line-height: 1.45 !important;
    }

    .portal-login-body .login-wave {
        height: clamp(92px, 11vw, 138px) !important;
    }
}

@media (min-width: 1200px) {
    .portal-login-body .login-grid {
        grid-template-columns: minmax(0, 58%) minmax(400px, 42%) !important;
        padding-right: clamp(3rem, 5vw, 6.5rem) !important;
    }

    .portal-login-body .login-illustration {
        width: min(100%, 590px) !important;
        margin-left: clamp(6rem, 12vw, 13rem) !important;
    }

    .portal-login-body .login-form-wrap {
        width: min(100%, 360px) !important;
    }
}


/* =========================================================
   Market Analytics 2026 Refresh
   Scope: /Manager/MarketAnalytics only
   ========================================================= */
.market-analytics-page {
    --market-ink: #102a43;
    --market-muted: #64748b;
    --market-line: rgba(15, 23, 42, .10);
    --market-primary: #14515a;
    --market-primary-2: #0f3f47;
    --market-amber: #e09a2d;
    --market-surface: rgba(255, 255, 255, .92);
    --market-soft: #f4f8fb;
    --market-radius: 24px;
    color: var(--market-ink);
}

.market-hero-panel {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 320px);
    gap: 1.5rem;
    padding: clamp(1.5rem, 3vw, 2.5rem);
    border: 1px solid rgba(255, 255, 255, .65);
    border-radius: 30px;
    background:
        radial-gradient(circle at 12% 18%, rgba(224, 154, 45, .28), transparent 28%),
        radial-gradient(circle at 82% 10%, rgba(99, 179, 237, .24), transparent 30%),
        linear-gradient(135deg, #0d3d46 0%, #14515a 48%, #0f766e 100%);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .18);
    isolation: isolate;
}

.market-hero-panel::after {
    content: "";
    position: absolute;
    inset: auto -12% -42% 46%;
    height: 260px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .13);
    transform: rotate(-8deg);
    z-index: -1;
}

.market-hero-copy h1 {
    max-width: 850px;
    margin: .35rem 0 .75rem;
    color: #fff;
    font-size: clamp(2rem, 4vw, 4rem);
    font-weight: 850;
    letter-spacing: -.055em;
    line-height: .98;
}

.market-hero-copy p {
    max-width: 920px;
    margin: 0;
    color: rgba(255, 255, 255, .82);
    font-size: 1rem;
    line-height: 1.7;
}

.market-kicker {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    color: var(--market-amber);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .14em;
}

.market-kicker::before {
    content: "";
    width: .55rem;
    height: .55rem;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0 0 0 5px rgba(224, 154, 45, .16);
}

.market-hero-badges {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    margin-top: 1.35rem;
}

.market-hero-badges span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: .4rem .85rem;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    color: #fff;
    background: rgba(255, 255, 255, .12);
    backdrop-filter: blur(10px);
    font-size: .85rem;
    font-weight: 700;
}

.market-hero-metric {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 210px;
    padding: 1.35rem;
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 26px;
    color: #fff;
    background: rgba(255, 255, 255, .13);
    backdrop-filter: blur(16px);
}

.market-hero-metric span,
.market-hero-metric small {
    color: rgba(255, 255, 255, .76);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.market-hero-metric strong {
    margin: .35rem 0;
    font-size: clamp(3rem, 7vw, 5.75rem);
    line-height: 1;
    letter-spacing: -.08em;
}

.market-control-deck,
.market-chart-card,
.market-table-card,
.market-product-card,
.market-kpi-card,
.market-insight-strip,
.market-ai-panel,
.market-ppt-panel,
.market-empty-state {
    border: 1px solid var(--market-line);
    background: var(--market-surface);
    box-shadow: 0 16px 42px rgba(15, 23, 42, .08);
}

.market-control-deck {
    padding: 1.25rem;
    border-radius: var(--market-radius);
}

.market-control-heading {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.market-control-heading h2,
.market-section-title h2,
.market-chart-head h2,
.market-empty-state h2 {
    margin: .2rem 0 0;
    color: var(--market-ink);
    font-weight: 820;
    letter-spacing: -.035em;
}

.market-control-heading p,
.market-section-title span,
.market-chart-head small,
.market-empty-state p {
    color: var(--market-muted);
}

.market-filter-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: .9rem;
    align-items: end;
}

.market-product-switch {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
    padding: .45rem;
    border: 1px solid var(--market-line);
    border-radius: 22px;
    background: #f8fafc;
}

.market-product-btn {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    align-items: flex-start;
    min-height: 64px;
    padding: .85rem 1rem;
    border: 0;
    border-radius: 18px;
    color: var(--market-muted);
    background: transparent;
    text-align: left;
    transition: transform .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
}

.market-product-btn span {
    font-weight: 850;
    font-size: 1.05rem;
}

.market-product-btn small {
    font-weight: 700;
}

.market-product-btn:hover,
.market-product-btn.is-active {
    color: #fff;
    background: linear-gradient(135deg, var(--market-primary), #0f766e);
    box-shadow: 0 12px 28px rgba(20, 81, 90, .24);
    transform: translateY(-1px);
}

.market-field {
    grid-column: span 2;
}

.market-field-wide {
    grid-column: span 3;
}

.market-field-small {
    grid-column: span 1;
}

.market-action-field {
    grid-column: span 2;
}

.market-field label {
    margin-bottom: .35rem;
    color: var(--market-muted);
    font-size: .76rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.market-field .form-control,
.market-field .form-select {
    min-height: 46px;
    border-radius: 15px;
    border-color: rgba(15, 23, 42, .12);
    background-color: #fff;
    box-shadow: none;
}

.market-field .form-control:focus,
.market-field .form-select:focus {
    border-color: rgba(20, 81, 90, .55);
    box-shadow: 0 0 0 .22rem rgba(20, 81, 90, .12);
}

.market-refresh-btn {
    min-height: 46px;
    border: 0;
    border-radius: 15px;
    background: linear-gradient(135deg, var(--market-primary), #0f766e);
    box-shadow: 0 14px 30px rgba(20, 81, 90, .22);
    font-weight: 800;
}

.market-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.market-kpi-card {
    position: relative;
    overflow: hidden;
    padding: 1.15rem;
    border-radius: 22px;
}

.market-kpi-card::after {
    content: "";
    position: absolute;
    inset: auto -24px -38px auto;
    width: 105px;
    height: 105px;
    border-radius: 999px;
    background: rgba(20, 81, 90, .08);
}

.market-kpi-card.kpi-primary {
    color: #fff;
    background: linear-gradient(135deg, var(--market-primary), #0f766e);
}

.market-kpi-card.kpi-primary span,
.market-kpi-card.kpi-primary small {
    color: rgba(255, 255, 255, .76);
}

.market-kpi-card span,
.market-mini-insight span,
.market-card-main-metric span,
.market-metric-pairs span {
    display: block;
    color: var(--market-muted);
    font-size: .76rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .075em;
}

.market-kpi-card strong {
    display: block;
    margin: .35rem 0;
    font-size: clamp(1.6rem, 3vw, 2.45rem);
    line-height: 1;
    letter-spacing: -.05em;
}

.market-kpi-card small {
    color: var(--market-muted);
    font-weight: 700;
}

.market-insight-strip {
    display: grid;
    grid-template-columns: minmax(240px, 1.2fr) repeat(3, minmax(0, 1fr));
    gap: 1rem;
    align-items: center;
    padding: 1.1rem;
    border-radius: var(--market-radius);
}

.market-mini-insight {
    min-height: 96px;
    padding: 1rem;
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 18px;
    background: #f8fafc;
}

.market-mini-insight strong {
    display: block;
    margin: .35rem 0 .15rem;
    font-size: 1.05rem;
    color: var(--market-ink);
}

.market-mini-insight small {
    color: var(--market-muted);
    font-weight: 700;
}

.market-ai-panel {
    display: grid;
    grid-template-columns: minmax(220px, .8fr) minmax(0, 1.4fr);
    gap: 1rem;
    align-items: start;
    padding: 1.1rem;
    border-radius: var(--market-radius);
}

.market-ai-copy h2 {
    margin: .2rem 0 .35rem;
    color: var(--market-ink);
    font-size: 1.2rem;
    font-weight: 820;
}

.market-ai-copy p {
    margin: 0;
    color: var(--market-muted);
    font-weight: 700;
    line-height: 1.55;
}

.market-ai-form {
    min-width: 0;
}

.market-ai-chat {
    min-width: 0;
}

.market-ai-thread {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    max-height: 390px;
    overflow-y: auto;
    padding: .85rem;
    border: 1px solid rgba(20, 81, 90, .16);
    border-radius: 16px;
    background: #f8fafc;
}

.market-ai-empty {
    color: var(--market-muted);
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
    padding: 1.4rem .75rem;
}

.market-ai-message {
    display: flex;
    flex-direction: column;
    max-width: min(86%, 720px);
}

.market-ai-message.user {
    align-self: flex-end;
}

.market-ai-message.assistant {
    align-self: flex-start;
}

.market-ai-bubble {
    padding: .75rem .9rem;
    border-radius: 14px;
    color: var(--market-ink);
    background: #fff;
    border: 1px solid rgba(15, 23, 42, .08);
    font-weight: 650;
    line-height: 1.55;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.market-ai-message.user .market-ai-bubble {
    color: #fff;
    background: var(--market-primary);
    border-color: var(--market-primary);
}

.market-ai-message.is-error .market-ai-bubble {
    background: #fff7f5;
    border-color: rgba(201, 107, 90, .35);
}

.market-ai-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    margin: 0 0 .25rem .15rem;
    color: var(--market-muted);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.market-ai-clear-form {
    grid-column: 2;
    justify-self: end;
}

.market-ai-presets {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    margin-bottom: .65rem;
}

.market-ai-presets button {
    min-height: 32px;
    padding: .3rem .65rem;
    border: 1px solid rgba(20, 81, 90, .18);
    border-radius: 999px;
    background: #eef6f7;
    color: var(--market-primary);
    font-size: .78rem;
    font-weight: 800;
}

.market-ai-presets button:hover {
    color: #fff;
    background: var(--market-primary);
}

.market-ai-input-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .75rem;
    align-items: stretch;
}

.market-ai-input-row textarea {
    min-height: 86px;
    resize: vertical;
    border-radius: 16px;
    border-color: rgba(15, 23, 42, .12);
    box-shadow: none;
}

.market-ai-input-row textarea:focus {
    border-color: rgba(20, 81, 90, .55);
    box-shadow: 0 0 0 .22rem rgba(20, 81, 90, .12);
}

.market-ai-submit {
    align-self: stretch;
    min-width: 112px;
    border: 0;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--market-primary), #0f766e);
    box-shadow: 0 14px 30px rgba(20, 81, 90, .18);
    font-weight: 800;
}

.market-ppt-panel {
    display: grid;
    grid-template-columns: minmax(220px, .8fr) minmax(0, 1.4fr);
    gap: 1rem;
    align-items: start;
    padding: 1.1rem;
    border-radius: var(--market-radius);
}

.market-ppt-actions {
    display: grid;
    gap: .85rem;
    min-width: 0;
}

.market-ppt-form {
    margin: 0;
}

.market-ppt-custom-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .75rem;
    align-items: stretch;
}

.market-ppt-custom-grid textarea {
    min-height: 76px;
    resize: vertical;
    border-radius: 16px;
    border-color: rgba(15, 23, 42, .12);
}

.market-ppt-submit {
    min-height: 46px;
    min-width: 155px;
    border-radius: 16px;
    font-weight: 800;
}

.market-section-title,
.market-chart-head,
.market-product-card-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
}

.market-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.market-product-card {
    position: relative;
    overflow: hidden;
    padding: 1.15rem;
    border-radius: 24px;
}

.market-product-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 5px;
    background: linear-gradient(90deg, var(--market-primary), #0f766e, var(--market-amber));
}

.market-product-card.is-secondary::before {
    background: linear-gradient(90deg, var(--market-amber), #fbbf24);
}

.market-product-card-head span {
    color: var(--market-muted);
    font-size: .75rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .09em;
}

.market-product-card-head h3 {
    margin: .15rem 0 0;
    font-size: 1.1rem;
    font-weight: 850;
}

.market-product-card-head em {
    padding: .35rem .7rem;
    border-radius: 999px;
    color: #8a5a06;
    background: #fff7e6;
    font-size: .74rem;
    font-style: normal;
    font-weight: 800;
}

.market-card-main-metric strong {
    display: block;
    margin: .25rem 0 1rem;
    font-size: 2.4rem;
    line-height: 1;
    letter-spacing: -.06em;
}

.market-metric-pairs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
}

.market-metric-pairs div {
    padding: .75rem;
    border: 1px solid rgba(15, 23, 42, .07);
    border-radius: 16px;
    background: #f8fafc;
}

.market-metric-pairs strong {
    display: block;
    margin-top: .18rem;
    font-size: 1rem;
}

.market-chart-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.market-chart-card {
    padding: 1.1rem;
    border-radius: 24px;
}

.market-chart-card.market-chart-wide {
    grid-column: span 1;
}

.market-analytics-page .chart-shell {
    min-height: 320px;
    padding: .85rem;
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 20px;
    background: linear-gradient(180deg, #fff, #f8fafc);
}

.market-analytics-page .chart-shell-lg {
    min-height: 390px;
}

.market-table-card {
    overflow: hidden;
    border-radius: 24px;
}

.market-table-scroll {
    max-height: 560px;
}

.market-ro-scroll {
    max-height: 680px;
}

.market-analytics-table {
    min-width: 1080px;
    font-size: .91rem;
}

.market-analytics-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    border: 0;
    color: #fff;
    background: linear-gradient(135deg, var(--market-primary), var(--market-primary-2));
    font-size: .76rem;
    text-transform: uppercase;
    letter-spacing: .055em;
    white-space: nowrap;
}

.market-analytics-table thead th a {
    color: #fff;
    text-decoration: none;
}

.market-analytics-table tbody td {
    border-color: rgba(15, 23, 42, .07);
    vertical-align: middle;
}

.market-analytics-table tbody tr:hover td {
    background: rgba(20, 81, 90, .045);
}

.market-row-primary td {
    background: rgba(20, 81, 90, .075) !important;
}

.market-row-total td {
    background: rgba(224, 154, 45, .12) !important;
}

.market-company-pill,
.market-product-chip {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: .25rem .6rem;
    border-radius: 999px;
    background: #eef6f7;
    color: var(--market-primary);
    font-weight: 850;
    white-space: nowrap;
}

.market-product-chip {
    background: #fff7e6;
    color: #9a650c;
}

.market-empty-state {
    padding: 3rem 1.25rem;
    border-radius: 26px;
    text-align: center;
}

.market-empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    margin-bottom: 1rem;
    border-radius: 24px;
    background: #eef6f7;
    font-size: 2rem;
}

@media (max-width: 1199.98px) {
    .market-filter-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .market-field,
    .market-field-small,
    .market-action-field { grid-column: span 2; }
    .market-field-wide { grid-column: span 3; }
    .market-kpi-grid,
    .market-insight-strip,
    .market-ai-panel,
    .market-ppt-panel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .market-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .market-ai-clear-form { grid-column: 1 / -1; }
}

@media (max-width: 991.98px) {
    .market-hero-panel { grid-template-columns: 1fr; }
    .market-hero-metric { min-height: auto; }
    .market-chart-grid { grid-template-columns: 1fr; }
}

@media (max-width: 767.98px) {
    .market-hero-panel,
    .market-control-deck,
    .market-chart-card,
    .market-table-card,
    .market-product-card,
    .market-kpi-card,
    .market-insight-strip,
    .market-ai-panel,
    .market-ppt-panel { border-radius: 18px; }
    .market-control-heading,
    .market-section-title,
    .market-chart-head { flex-direction: column; }
    .market-filter-grid,
    .market-kpi-grid,
    .market-insight-strip,
    .market-ai-panel,
    .market-ppt-panel,
    .market-summary-grid { grid-template-columns: 1fr; }
    .market-ai-input-row { grid-template-columns: 1fr; }
    .market-ai-clear-form { grid-column: 1; justify-self: stretch; }
    .market-ai-message { max-width: 96%; }
    .market-ppt-custom-grid { grid-template-columns: 1fr; }
    .market-ai-submit { min-height: 46px; }
    .market-field,
    .market-field-wide,
    .market-field-small,
    .market-action-field { grid-column: 1 / -1; }
    .market-product-switch { grid-template-columns: 1fr; }
    .market-analytics-table { font-size: .84rem; }
}

/* Manager dispatch ledger dashboard */
.manager-ledger-page {
    --ledger-bg: #F2F4F8;
    --ledger-surface: #FFFFFF;
    --ledger-ink: #1A2332;
    --ledger-muted: #6B7589;
    --fuel-ms: #2563EB;
    --fuel-hsd: #D97706;
    --fuel-xp: #0D9488;
    --fuel-xg: #7C3AED;
    --signal-ok: #059669;
    --signal-warn: #D97706;
    --signal-risk: #DC2626;
    font-family: "Source Sans 3", "Inter", sans-serif;
}

.manager-ledger-page .manager-admin-page {
    --mad-bg: var(--ledger-bg);
    --mad-text: var(--ledger-ink);
    --mad-muted: var(--ledger-muted);
}

.manager-ledger-hero {
    display: flex;
    justify-content: space-between;
    gap: 1.5rem;
    align-items: flex-end;
    flex-wrap: wrap;
}

.manager-ledger-kicker {
    display: block;
    font-family: "DM Sans", sans-serif;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ledger-muted);
}

.manager-ledger-title {
    margin: 0.35rem 0 0;
    font-family: "DM Sans", sans-serif;
    font-size: clamp(1.5rem, 2.8vw, 2.25rem);
    font-weight: 800;
    letter-spacing: -0.03em;
    color: var(--ledger-ink);
    max-width: 48ch;
}

.manager-ledger-subtitle {
    margin: 0.5rem 0 0;
    color: var(--ledger-muted);
    max-width: 56ch;
}

.manager-ledger-hero-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: flex-end;
}

.manager-ledger-hero-chips span {
    padding: 0.5rem 0.85rem;
    border-radius: 999px;
    background: var(--ledger-surface);
    border: 1px solid rgba(26, 35, 50, 0.1);
    color: var(--ledger-muted);
    font-size: 0.8rem;
    font-weight: 600;
}

.manager-ledger-hero-chips .chip-locked { color: var(--signal-risk); border-color: rgba(220, 38, 38, 0.25); }
.manager-ledger-hero-chips .chip-open { color: var(--signal-ok); border-color: rgba(5, 150, 105, 0.25); }

.manager-ledger-strip {
    padding: 1rem 1.25rem;
    border-radius: 1rem;
    background: var(--ledger-surface);
    border: 1px solid rgba(26, 35, 50, 0.08);
    box-shadow: 0 8px 24px rgba(26, 35, 50, 0.06);
}

.manager-ledger-strip-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.manager-ledger-fuel-rows {
    display: grid;
    gap: 1rem;
}

.manager-ledger-fuel-row {
    display: grid;
    grid-template-columns: 4rem minmax(0, 1fr);
    gap: 0.75rem;
    align-items: start;
}

.manager-ledger-fuel-label {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-family: "DM Sans", sans-serif;
    font-weight: 700;
    font-size: 0.85rem;
    color: var(--ledger-ink);
}

.fuel-dot {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    flex-shrink: 0;
}

.fuel-dot-ms { background: var(--fuel-ms); }
.fuel-dot-hsd { background: var(--fuel-hsd); }

.manager-ledger-gauge-track {
    position: relative;
    height: 0.55rem;
    border-radius: 999px;
    background: rgba(26, 35, 50, 0.08);
    overflow: hidden;
}

.manager-ledger-gauge-bar {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    border-radius: 999px;
    min-width: 2px;
    transition: width 0.3s ease;
}

.manager-ledger-gauge-bar.gauge-plan { background: var(--fuel-ms); opacity: 0.95; z-index: 3; }
.manager-ledger-fuel-row[data-fuel="hsd"] .gauge-plan { background: var(--fuel-hsd); }
.manager-ledger-gauge-bar.gauge-stock { background: rgba(26, 35, 50, 0.35); z-index: 2; max-width: 100% !important; }
.manager-ledger-gauge-bar.gauge-vish { background: var(--fuel-xp); z-index: 1; opacity: 0.75; }

.manager-ledger-gauge-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1.25rem;
    margin-top: 0.45rem;
    font-size: 0.78rem;
    color: var(--ledger-muted);
}

.manager-ledger-gauge-legend strong {
    font-variant-numeric: tabular-nums;
    color: var(--ledger-ink);
}

.manager-ledger-attention-rail {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.manager-ledger-attention-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0.85rem;
    border-radius: 999px;
    border: 1px solid rgba(26, 35, 50, 0.12);
    background: var(--ledger-surface);
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ledger-ink);
}

button.manager-ledger-attention-pill {
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

button.manager-ledger-attention-pill:hover,
button.manager-ledger-attention-pill.active {
    background: rgba(37, 99, 235, 0.08);
    border-color: rgba(37, 99, 235, 0.35);
}

.manager-ledger-attention-pill.pill-warn {
    border-color: rgba(217, 119, 6, 0.35);
    color: #9a3412;
    background: rgba(217, 119, 6, 0.08);
}

.manager-ledger-attention-pill.pill-muted {
    color: var(--ledger-muted);
    background: transparent;
}

.manager-ledger-attention-pill.pill-locked { color: var(--signal-risk); }
.manager-ledger-attention-pill.pill-open { color: var(--signal-ok); }

.manager-ledger-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.manager-ledger-stat-card {
    padding: 1rem 1.1rem;
    border-radius: 0.85rem;
    background: var(--ledger-surface);
    border: 1px solid rgba(26, 35, 50, 0.08);
    box-shadow: 0 4px 16px rgba(26, 35, 50, 0.04);
}

.manager-ledger-stat-card span {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--ledger-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.manager-ledger-stat-card strong {
    display: block;
    margin-top: 0.35rem;
    font-family: "DM Sans", sans-serif;
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--ledger-ink);
}

.manager-ledger-stat-card small {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.75rem;
    color: var(--ledger-muted);
}

.manager-ledger-stat-card[data-kpi-filter] {
    cursor: pointer;
    transition: border-color 0.15s, transform 0.15s;
}

.manager-ledger-stat-card[data-kpi-filter]:hover {
    border-color: rgba(37, 99, 235, 0.35);
    transform: translateY(-1px);
}

.manager-ledger-stat-card.fuel-ms strong { color: var(--fuel-ms); }
.manager-ledger-stat-card.fuel-hsd strong { color: var(--fuel-hsd); }
.manager-ledger-stat-card.fuel-xp strong { color: var(--fuel-xp); }
.manager-ledger-stat-card.fuel-xg strong { color: var(--fuel-xg); }

.ledger-num {
    font-variant-numeric: tabular-nums;
}

.manager-ledger-suppressed-note {
    padding: 0.6rem 0.85rem;
    border-radius: 0.5rem;
    background: rgba(220, 38, 38, 0.06);
    color: #991b1b;
    font-size: 0.85rem;
    font-weight: 600;
}

.manager-ledger-filter-details {
    border: none;
}

.manager-ledger-filter-summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    cursor: pointer;
    list-style: none;
    padding: 0;
}

.manager-ledger-filter-summary::-webkit-details-marker { display: none; }

.manager-ledger-filter-chevron {
    width: 1.25rem;
    height: 1.25rem;
    background: currentColor;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") center/contain no-repeat;
    opacity: 0.5;
}

.manager-ledger-filter-details[open] .manager-ledger-filter-chevron {
    transform: rotate(180deg);
}

.manager-ledger-filter-body {
    padding-top: 0.5rem;
}

.manager-ledger-col-picker {
    position: relative;
}

.manager-ledger-col-menu {
    display: none;
    position: absolute;
    right: 0;
    top: calc(100% + 0.35rem);
    z-index: 20;
    min-width: 200px;
    padding: 0.75rem;
    border-radius: 0.65rem;
    background: var(--ledger-surface);
    border: 1px solid rgba(26, 35, 50, 0.12);
    box-shadow: 0 12px 32px rgba(26, 35, 50, 0.12);
}

.manager-ledger-col-menu.show {
    display: grid;
    gap: 0.35rem;
}

.manager-ledger-col-option {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    cursor: pointer;
    margin: 0;
}

.manager-ledger-table-wrap {
    max-height: none;
}

.manager-ledger-table .sticky-col {
    position: sticky;
    background: var(--ledger-surface);
    z-index: 2;
}

.manager-ledger-table thead .sticky-col {
    z-index: 3;
    background: #f8f9fb;
}

.manager-ledger-table .sticky-col-1 { left: 0; min-width: 2.5rem; }
.manager-ledger-table .sticky-col-2 { left: 2.5rem; min-width: 6.5rem; }
.manager-ledger-table .sticky-col-3 { left: 9rem; min-width: 10rem; box-shadow: 4px 0 8px rgba(26, 35, 50, 0.04); }

.manager-ledger-table .record-row {
    cursor: pointer;
}

.manager-ledger-table .record-row-open {
    background: rgba(37, 99, 235, 0.04) !important;
}

.stock-variance-badge {
    display: inline-flex;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    white-space: nowrap;
}

.stock-badge-ok { background: rgba(5, 150, 105, 0.1); color: var(--signal-ok); }
.stock-badge-warn { background: rgba(217, 119, 6, 0.12); color: #9a3412; }
.stock-badge-risk { background: rgba(220, 38, 38, 0.1); color: var(--signal-risk); }

.record-drawer-row td {
    padding: 0 !important;
    border: 0 !important;
    background: rgba(242, 244, 248, 0.6);
}

.manager-ledger-drawer {
    padding: 1rem 1.25rem 1.25rem;
}

.manager-ledger-drawer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem 1.5rem;
}

.manager-ledger-drawer h4 {
    font-family: "DM Sans", sans-serif;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ledger-muted);
    margin: 0 0 0.5rem;
}

.manager-ledger-dl {
    margin: 0;
    display: grid;
    gap: 0.35rem;
}

.manager-ledger-dl div {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: 0.85rem;
}

.manager-ledger-dl dt {
    color: var(--ledger-muted);
    font-weight: 500;
}

.manager-ledger-dl dd {
    margin: 0;
    text-align: right;
    font-weight: 600;
    color: var(--ledger-ink);
}

.drawer-variance-note {
    margin-top: 0.5rem;
    padding: 0.4rem 0.6rem;
    border-radius: 0.4rem;
    font-size: 0.78rem;
    font-weight: 600;
}

.manager-ledger-drawer-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(26, 35, 50, 0.08);
}

.manager-ledger-suppression,
.manager-ledger-remarks {
    margin-top: 0.75rem;
    padding: 0.65rem 0.85rem;
    border-radius: 0.5rem;
    background: rgba(220, 38, 38, 0.06);
    font-size: 0.85rem;
}

.manager-ledger-remarks {
    background: rgba(26, 35, 50, 0.04);
}

.record-expand-btn {
    min-width: 2rem;
    padding: 0.15rem 0.35rem;
    line-height: 1;
}

@media (max-width: 1199.98px) {
    .manager-ledger-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767.98px) {
    .manager-ledger-stat-grid { grid-template-columns: 1fr; }
    .manager-ledger-fuel-row { grid-template-columns: 1fr; }
    .manager-ledger-table .sticky-col-2,
    .manager-ledger-table .sticky-col-3 { position: static; box-shadow: none; }
    .manager-ledger-filter-details:not([open]) .manager-ledger-filter-body { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .manager-ledger-gauge-bar,
    .manager-ledger-stat-card[data-kpi-filter] { transition: none; }
}

/* ===== Manager Dashboard Pro (dash-pro) ===== */
.dash-pro-main {
    background: linear-gradient(180deg, #eef2f8 0%, #f8fafc 42%, #f1f5f9 100%) !important;
}

.dash-pro-page {
    --dash-ink: #0f172a;
    --dash-muted: #64748b;
    --dash-line: rgba(15, 23, 42, 0.08);
    --dash-ms: #3b82f6;
    --dash-hsd: #f59e0b;
    --dash-xp: #14b8a6;
    --dash-xg: #8b5cf6;
    font-family: "DM Sans", "Source Sans 3", "Inter", sans-serif;
}

.dash-pro-hero-panel {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 340px);
    gap: 1.25rem;
    padding: clamp(1.35rem, 2.5vw, 2.25rem);
    border-radius: 28px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background:
        radial-gradient(circle at 8% 20%, rgba(59, 130, 246, 0.35), transparent 32%),
        radial-gradient(circle at 88% 12%, rgba(245, 158, 11, 0.28), transparent 28%),
        linear-gradient(135deg, #0f172a 0%, #1e3a5f 45%, #1e40af 100%);
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.22);
    isolation: isolate;
}

.dash-pro-hero-panel::after {
    content: "";
    position: absolute;
    inset: auto -15% -45% 50%;
    height: 240px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    transform: rotate(-6deg);
    z-index: 0;
    pointer-events: none;
}

.dash-pro-hero-copy,
.dash-pro-hero-metrics {
    position: relative;
    z-index: 1;
}

.dash-pro-hero-copy h1 {
    margin: 0.4rem 0 0.65rem;
    color: #fff;
    font-size: clamp(1.65rem, 3.2vw, 2.75rem);
    font-weight: 800;
    letter-spacing: -0.035em;
    line-height: 1.08;
    max-width: 52ch;
}

.dash-pro-hero-copy p {
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.95rem;
    line-height: 1.65;
    max-width: 58ch;
}

.dash-pro-kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: #93c5fd;
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}

.dash-pro-kicker::before {
    content: "";
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0 0 0 4px rgba(147, 197, 253, 0.2);
}

.dash-pro-hero-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1.1rem;
}

.dash-pro-hero-badges span {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0.35rem 0.8rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    color: #fff;
    font-size: 0.78rem;
    font-weight: 700;
}

.dash-pro-hero-badges .badge-locked { background: rgba(239, 68, 68, 0.2); border-color: rgba(252, 165, 165, 0.35); }
.dash-pro-hero-badges .badge-open { background: rgba(16, 185, 129, 0.18); border-color: rgba(110, 231, 183, 0.35); }
.dash-pro-hero-badges .badge-alert { background: rgba(245, 158, 11, 0.22); border-color: rgba(253, 224, 71, 0.35); }

.dash-pro-hero-metrics {
    display: grid;
    gap: 0.75rem;
    align-content: center;
}

.dash-pro-hero-metric {
    padding: 1.1rem 1.25rem;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(14px);
    color: #fff;
}

.dash-pro-hero-metric-primary {
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.32);
}

.dash-pro-hero-metric span,
.dash-pro-hero-metric small {
    display: block;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
}

.dash-pro-hero-metric strong {
    display: block;
    margin: 0.25rem 0;
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1;
}

.dash-pro-shell {
    border-radius: 0 !important;
    background: transparent !important;
}

.dash-pro-grid {
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.dash-pro-main-inner {
    gap: 1.35rem;
}

.dash-pro-meta-bar {
    display: grid;
    gap: 1rem;
}

.dash-pro-action-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 1.1rem 1.35rem;
    border-radius: 20px;
    background: #fff;
    border: 1px solid var(--dash-line);
    box-shadow: 0 12px 40px rgba(15, 23, 42, 0.06);
}

.dash-pro-action-copy h2 {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--dash-ink);
}

.dash-pro-action-copy p {
    margin: 0.25rem 0 0;
    font-size: 0.85rem;
    color: var(--dash-muted);
}

.dash-pro-action-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.dash-pro-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0.55rem 1rem;
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 700;
    border: 1px solid transparent;
    cursor: pointer;
    transition: transform 0.15s, box-shadow 0.15s;
}

.dash-pro-btn:hover { transform: translateY(-1px); }

.dash-pro-btn-primary {
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    color: #fff;
    box-shadow: 0 8px 24px rgba(37, 99, 235, 0.35);
}

.dash-pro-btn-soft {
    background: rgba(16, 185, 129, 0.1);
    color: #047857;
    border-color: rgba(16, 185, 129, 0.25);
}

.dash-pro-btn-outline {
    background: #fff;
    color: #334155;
    border-color: rgba(15, 23, 42, 0.12);
}

.dash-pro-attention-rail {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.dash-pro-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0.85rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    border: 1px solid var(--dash-line);
    background: #fff;
    color: var(--dash-ink);
}

button.dash-pro-pill { cursor: pointer; }
button.dash-pro-pill:hover { box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08); }

.dash-pro-pill-warn { background: #fff7ed; color: #c2410c; border-color: #fed7aa; }
.dash-pro-pill-accent { background: #eff6ff; color: #1d4ed8; border-color: #bfdbfe; }
.dash-pro-pill-danger { background: #fef2f2; color: #b91c1c; border-color: #fecaca; }
.dash-pro-pill-success { background: #ecfdf5; color: #047857; border-color: #a7f3d0; }

.dash-pro-stock-panel {
    padding: 1.25rem 1.35rem;
    border-radius: 20px;
    background: #fff;
    border: 1px solid var(--dash-line);
    box-shadow: 0 12px 40px rgba(15, 23, 42, 0.05);
}

.dash-pro-section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
}

.dash-pro-section-head h3 {
    margin: 0.15rem 0 0;
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--dash-ink);
}

.dash-pro-section-label {
    display: block;
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--dash-muted);
}

.dash-pro-section-desc {
    margin: 0.25rem 0 0;
    font-size: 0.82rem;
    color: var(--dash-muted);
}

.dash-pro-section-meta {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--dash-muted);
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    background: #f1f5f9;
}

.dash-pro-stock-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.dash-pro-stock-card {
    padding: 1rem 1.1rem;
    border-radius: 16px;
    border: 1px solid var(--dash-line);
    background: linear-gradient(180deg, #fafbfc 0%, #fff 100%);
}

.fuel-ms-card { border-top: 3px solid var(--dash-ms); }
.fuel-hsd-card { border-top: 3px solid var(--dash-hsd); }

.dash-pro-stock-card-head {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin-bottom: 0.85rem;
    font-size: 0.9rem;
    font-weight: 800;
    color: var(--dash-ink);
}

.dash-pro-stock-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
}

.dash-pro-stock-metrics div span {
    display: block;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--dash-muted);
}

.dash-pro-stock-metrics div strong {
    display: block;
    margin-top: 0.15rem;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--dash-ink);
}

.dash-pro-stock-metrics div small {
    font-size: 0.68rem;
    color: var(--dash-muted);
    font-weight: 600;
}

.dash-pro-stock-bar {
    margin-top: 0.85rem;
    height: 6px;
    border-radius: 999px;
    background: #e2e8f0;
    overflow: hidden;
}

.dash-pro-stock-bar-fill {
    height: 100%;
    border-radius: 999px;
    transition: width 0.4s ease;
}

.bar-ms-plan { background: linear-gradient(90deg, #3b82f6, #60a5fa); }
.bar-hsd-plan { background: linear-gradient(90deg, #f59e0b, #fbbf24); }

.dash-pro-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
}

.dash-pro-kpi-card {
    position: relative;
    overflow: hidden;
    padding: 1rem 1.05rem 1rem 1.05rem;
    border-radius: 18px;
    background: #fff;
    border: 1px solid var(--dash-line);
    box-shadow: 0 8px 28px rgba(15, 23, 42, 0.04);
    transition: transform 0.15s, box-shadow 0.15s;
}

.dash-pro-kpi-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: #cbd5e1;
}

.dash-pro-kpi-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.08);
}

.dash-pro-kpi-card[data-kpi-filter] { cursor: pointer; }

.dash-pro-kpi-icon {
    display: inline-flex;
    width: 1.75rem;
    height: 1.75rem;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.45rem;
    border-radius: 8px;
    background: #f1f5f9;
    color: #64748b;
    font-size: 0.85rem;
    font-weight: 800;
}

.dash-pro-kpi-card span:not(.dash-pro-kpi-icon) {
    display: block;
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--dash-muted);
}

.dash-pro-kpi-card strong {
    display: block;
    margin-top: 0.3rem;
    font-size: 1.45rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: var(--dash-ink);
}

.dash-pro-kpi-card small {
    display: block;
    margin-top: 0.15rem;
    font-size: 0.72rem;
    color: var(--dash-muted);
}

.kpi-ms::before { background: var(--dash-ms); }
.kpi-hsd::before { background: var(--dash-hsd); }
.kpi-xp::before { background: var(--dash-xp); }
.kpi-xg::before { background: var(--dash-xg); }
.kpi-workflow::before { background: #6366f1; }
.kpi-queue::before { background: #f59e0b; }
.kpi-tomorrow::before { background: #0ea5e9; }

.kpi-ms strong { color: var(--dash-ms); }
.kpi-hsd strong { color: var(--dash-hsd); }
.kpi-xp strong { color: var(--dash-xp); }
.kpi-xg strong { color: var(--dash-xg); }

.dash-pro-panel {
    border-radius: 20px !important;
    border: 1px solid var(--dash-line) !important;
    box-shadow: 0 10px 36px rgba(15, 23, 42, 0.05) !important;
    background: #fff !important;
}

.dash-pro-panel-summary h3 {
    margin: 0.15rem 0 0;
    font-size: 1rem;
    font-weight: 800;
}

.dash-pro-split-grid {
    gap: 1rem !important;
}

.dash-pro-summary-panel .manager-admin-summary-stack {
    gap: 0.65rem;
}

.dash-pro-chart-grid {
    gap: 1rem !important;
}

.dash-pro-chart-card {
    border-radius: 20px !important;
    transition: box-shadow 0.15s;
}

.dash-pro-chart-card:hover {
    box-shadow: 0 16px 48px rgba(15, 23, 42, 0.08) !important;
}

.dash-pro-chart-card .manager-admin-panel-head h3 {
    font-size: 0.95rem;
}

.dash-pro-records-panel {
    border-radius: 22px !important;
    overflow: hidden;
}

.dash-pro-page .manager-ledger-table thead th {
    background: linear-gradient(180deg, #f8fafc, #f1f5f9);
    color: #475569;
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 2px solid #e2e8f0;
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
}

.dash-pro-page .manager-ledger-table tbody tr.record-row:nth-child(4n+1) {
    background: rgba(248, 250, 252, 0.6);
}

.dash-pro-page .manager-ledger-table tbody tr.record-row:hover {
    background: rgba(59, 130, 246, 0.04);
}

.dash-pro-page .manager-ledger-drawer {
    background: linear-gradient(180deg, #f8fafc, #fff);
    border-top: 1px solid #e2e8f0;
}

@media (max-width: 1199.98px) {
    .dash-pro-hero-panel { grid-template-columns: 1fr; }
    .dash-pro-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dash-pro-stock-grid { grid-template-columns: 1fr; }
}

@media (max-width: 767.98px) {
    .dash-pro-kpi-grid { grid-template-columns: 1fr; }
    .dash-pro-action-bar { flex-direction: column; align-items: stretch; }
    .dash-pro-stock-metrics { grid-template-columns: 1fr; }
}
.manager-ai-widget {
    position: fixed;
    right: 22px;
    bottom: 58px;
    z-index: 1090;
    font-family: var(--bs-font-sans-serif);
}

.manager-ai-fab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 68px;
    height: 46px;
    border: 0;
    border-radius: 999px;
    color: #fff;
    background: #0f766e;
    box-shadow: 0 16px 34px rgba(15, 118, 110, 0.28);
    font-weight: 800;
    letter-spacing: 0;
}

.manager-ai-fab:hover,
.manager-ai-fab:focus-visible {
    background: #115e59;
    outline: 3px solid rgba(20, 184, 166, 0.22);
}

.manager-ai-panel {
    position: absolute;
    right: 0;
    bottom: 58px;
    width: min(400px, calc(100vw - 28px));
    height: min(580px, calc(100vh - 132px));
    display: grid;
    grid-template-rows: auto 1fr auto;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
}

.manager-ai-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 14px 12px;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    background: #f8fafc;
}

.manager-ai-title {
    color: #0f172a;
    font-size: 0.98rem;
    font-weight: 800;
}

.manager-ai-scope {
    margin-top: 2px;
    color: #64748b;
    font-size: 0.76rem;
    font-weight: 700;
}

.manager-ai-actions {
    display: inline-flex;
    gap: 6px;
}

.manager-ai-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 8px;
    color: #334155;
    background: #fff;
}

.manager-ai-icon-btn:hover,
.manager-ai-icon-btn:focus-visible {
    color: #0f766e;
    border-color: rgba(15, 118, 110, 0.28);
}

.manager-ai-messages {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-height: 0;
    padding: 14px;
    overflow-y: auto;
    background: #f8fafc;
}

.manager-ai-message {
    max-width: 92%;
}

.manager-ai-message-user {
    align-self: flex-end;
}

.manager-ai-message-assistant,
.manager-ai-message-system {
    align-self: flex-start;
}

.manager-ai-message-body {
    white-space: pre-wrap;
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 0.88rem;
    line-height: 1.45;
}

.manager-ai-message-user .manager-ai-message-body {
    color: #fff;
    background: #0f766e;
}

.manager-ai-message-assistant .manager-ai-message-body {
    color: #1e293b;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.manager-ai-message-system .manager-ai-message-body {
    color: #475569;
    background: #eef6f5;
    border: 1px solid rgba(15, 118, 110, 0.12);
}

.manager-ai-message-meta {
    margin-top: 4px;
    padding: 0 4px;
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 700;
}

.manager-ai-form {
    display: grid;
    grid-template-columns: 1fr 42px;
    gap: 8px;
    padding: 12px;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    background: #fff;
}

.manager-ai-input {
    width: 100%;
    min-height: 42px;
    max-height: 112px;
    resize: vertical;
    border: 1px solid rgba(15, 23, 42, 0.16);
    border-radius: 10px;
    padding: 9px 10px;
    color: #0f172a;
    background: #fff;
    font-size: 0.9rem;
    line-height: 1.35;
}

.manager-ai-input:focus {
    border-color: rgba(15, 118, 110, 0.55);
    box-shadow: 0 0 0 3px rgba(20, 184, 166, 0.14);
    outline: 0;
}

.manager-ai-send {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 10px;
    color: #fff;
    background: #0f766e;
}

.manager-ai-send:hover,
.manager-ai-send:focus-visible {
    background: #115e59;
}

.manager-ai-busy .manager-ai-send {
    opacity: 0.7;
}

.manager-ai-table-card,
.manager-ai-chart-card {
    width: 100%;
    background: #ffffff;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 8px;
    padding: 0.75rem;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.manager-ai-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.65rem;
}

.manager-ai-card-title {
    color: #0f172a;
    font-size: 0.82rem;
    font-weight: 800;
}

.manager-ai-card-actions,
.manager-ai-chart-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    justify-content: flex-end;
}

.manager-ai-card-btn {
    border: 1px solid rgba(15, 118, 110, 0.22);
    border-radius: 6px;
    background: #f0fdfa;
    color: #0f766e;
    font-size: 0.7rem;
    font-weight: 800;
    line-height: 1;
    padding: 0.38rem 0.48rem;
}

.manager-ai-chart-shell {
    position: relative;
    min-height: 220px;
}

.manager-ai-chart-shell canvas,
.manager-ai-expanded-chart-shell canvas {
    width: 100% !important;
    height: 100% !important;
}

.manager-ai-table-wrap {
    max-height: 240px;
    overflow: auto;
}

.manager-ai-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.74rem;
}

.manager-ai-table th,
.manager-ai-table td {
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    padding: 0.42rem 0.45rem;
    white-space: nowrap;
}

.manager-ai-table th {
    position: sticky;
    top: 0;
    color: #475569;
    font-weight: 800;
    background: #f8fafc;
}

.manager-ai-chart-modal-content {
    border: 0;
    border-radius: 10px;
    background: #ffffff;
}

.manager-ai-chart-modal-body {
    min-height: 68vh;
}

.manager-ai-expanded-chart-shell {
    position: relative;
    min-height: 66vh;
}

[data-theme="dark"] .manager-ai-panel {
    border-color: rgba(148, 163, 184, 0.16);
    background: #111827;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.42);
}

[data-theme="dark"] .manager-ai-header,
[data-theme="dark"] .manager-ai-messages {
    background: #0f172a;
}

[data-theme="dark"] .manager-ai-title,
[data-theme="dark"] .manager-ai-input {
    color: #e5edf5;
}

[data-theme="dark"] .manager-ai-scope,
[data-theme="dark"] .manager-ai-message-meta {
    color: #94a3b8;
}

[data-theme="dark"] .manager-ai-icon-btn,
[data-theme="dark"] .manager-ai-form,
[data-theme="dark"] .manager-ai-input,
[data-theme="dark"] .manager-ai-message-assistant .manager-ai-message-body {
    color: #dbe7ef;
    background: #111827;
    border-color: rgba(148, 163, 184, 0.18);
}

[data-theme="dark"] .manager-ai-message-system .manager-ai-message-body {
    color: #cbd5e1;
    background: rgba(20, 184, 166, 0.08);
}

[data-theme="dark"] .manager-ai-table-card,
[data-theme="dark"] .manager-ai-chart-card,
[data-theme="dark"] .manager-ai-chart-modal-content {
    background: #111827;
    border-color: rgba(148, 163, 184, 0.22);
}

[data-theme="dark"] .manager-ai-card-title {
    color: #e5e7eb;
}

[data-theme="dark"] .manager-ai-card-btn {
    background: rgba(20, 184, 166, 0.1);
    border-color: rgba(45, 212, 191, 0.28);
    color: #99f6e4;
}

[data-theme="dark"] .manager-ai-table th {
    background: #0f172a;
    color: #cbd5e1;
}

[data-theme="dark"] .manager-ai-table th,
[data-theme="dark"] .manager-ai-table td {
    border-color: rgba(148, 163, 184, 0.16);
    color: #e5e7eb;
}

@media (max-width: 575.98px) {
    .manager-ai-widget {
        right: 12px;
        bottom: 54px;
    }

    .manager-ai-panel {
        right: -4px;
        bottom: 56px;
        width: calc(100vw - 16px);
        height: min(72vh, 620px);
    }
}

/* Pre monsoon health check */
.healthcheck-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 300px);
    gap: 1.25rem;
    align-items: stretch;
    padding: 1.5rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.9rem;
    background: linear-gradient(135deg, rgba(14, 116, 144, 0.12), rgba(34, 197, 94, 0.08)), var(--card);
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.08);
}

.healthcheck-hero h1 {
    margin: 0.4rem 0;
    font-size: clamp(1.65rem, 3vw, 2.5rem);
    font-weight: 800;
    color: var(--brand-900);
    letter-spacing: 0;
}

.healthcheck-hero p,
.healthcheck-conditional-head p,
.healthcheck-guide p {
    color: var(--muted);
}

.healthcheck-identity {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-top: 1rem;
}

.healthcheck-identity span {
    display: inline-flex;
    align-items: center;
    min-height: 2rem;
    padding: 0.35rem 0.7rem;
    border: 1px solid rgba(14, 116, 144, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    color: #0f5968;
    font-size: 0.85rem;
    font-weight: 700;
}

.healthcheck-status-panel {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.25rem;
    padding: 1.1rem;
    border-radius: 0.8rem;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(14, 116, 144, 0.14);
}

.healthcheck-status-panel span,
.healthcheck-status-panel small,
.healthcheck-result-grid span,
.healthcheck-remarks span {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.healthcheck-status-panel strong {
    color: #0f766e;
    font-size: 1.6rem;
    font-weight: 800;
}

.healthcheck-form-card,
.healthcheck-guide,
.healthcheck-complete {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.9rem;
    background: var(--card);
    box-shadow: 0 14px 35px rgba(15, 23, 42, 0.07);
}

.healthcheck-form-card,
.healthcheck-guide,
.healthcheck-complete {
    padding: 1.35rem;
}

.healthcheck-question {
    display: grid;
    gap: 1rem;
}

.healthcheck-step {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    margin-bottom: 0.65rem;
    border-radius: 999px;
    background: #0e7490;
    color: #fff;
    font-size: 0.82rem;
    font-weight: 800;
}

.healthcheck-question-title {
    display: block;
    color: var(--brand-900);
    font-size: 1.25rem;
    font-weight: 800;
}

.healthcheck-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.healthcheck-choice-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.healthcheck-choice {
    min-height: 5.5rem;
    padding: 1rem;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 0.75rem;
    background: rgba(248, 250, 252, 0.9);
    cursor: pointer;
    transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.healthcheck-choice strong,
.healthcheck-choice span {
    display: block;
}

.healthcheck-choice strong {
    color: var(--brand-900);
    font-size: 1.1rem;
    font-weight: 800;
}

.healthcheck-choice span {
    margin-top: 0.3rem;
    color: var(--muted);
    font-size: 0.92rem;
}

.healthcheck-choice:hover,
.healthcheck-choice-input:focus + .healthcheck-choice {
    border-color: rgba(14, 116, 144, 0.48);
    box-shadow: 0 10px 24px rgba(14, 116, 144, 0.12);
    transform: translateY(-1px);
}

.healthcheck-choice-input:checked + .healthcheck-choice {
    border-color: #0e7490;
    background: rgba(14, 116, 144, 0.1);
    box-shadow: inset 0 0 0 1px rgba(14, 116, 144, 0.2);
}

.healthcheck-conditional {
    margin-top: 1.35rem;
    padding: 1.1rem;
    border: 1px solid rgba(14, 116, 144, 0.14);
    border-radius: 0.85rem;
    background: linear-gradient(180deg, rgba(240, 253, 250, 0.9), rgba(255, 255, 255, 0.95));
}

.healthcheck-conditional-head {
    display: flex;
    gap: 0.8rem;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.healthcheck-conditional-head .healthcheck-step {
    flex: 0 0 auto;
    margin-bottom: 0;
}

.healthcheck-conditional-head h2,
.healthcheck-guide h2,
.healthcheck-complete h2 {
    margin: 0;
    color: var(--brand-900);
    font-size: 1.25rem;
    font-weight: 800;
}

.healthcheck-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    margin-top: 1.35rem;
}

.healthcheck-modal-open {
    overflow: hidden;
}

.edod-processing-overlay {
    position: fixed;
    inset: 0;
    z-index: 2100;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: rgba(15, 23, 42, 0.52);
    backdrop-filter: blur(4px);
}

.edod-processing-overlay[hidden] {
    display: none;
}

.edod-processing-dialog {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    width: min(420px, 100%);
    padding: 1.1rem 1.25rem;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 24px 55px rgba(15, 23, 42, 0.22);
    color: #0f172a;
}

.edod-processing-spinner {
    width: 1.45rem;
    height: 1.45rem;
    flex: 0 0 auto;
    border: 3px solid #dbeafe;
    border-top-color: #2563eb;
    border-radius: 50%;
    animation: edod-processing-spin 0.75s linear infinite;
}

@keyframes edod-processing-spin {
    to {
        transform: rotate(360deg);
    }
}

.healthcheck-ack-modal {
    position: fixed;
    inset: 0;
    z-index: 1080;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: rgba(15, 23, 42, 0.62);
    backdrop-filter: blur(5px);
}

.healthcheck-ack-modal[hidden] {
    display: none;
}

.healthcheck-ack-dialog {
    width: min(880px, 100%);
    max-height: min(86vh, 780px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto auto;
    border-radius: 0.9rem;
    border: 1px solid rgba(15, 23, 42, 0.12);
    background: var(--card);
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.32);
    overflow: hidden;
}

.healthcheck-ack-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.2rem 1.25rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    background: linear-gradient(135deg, rgba(14, 116, 144, 0.12), rgba(34, 197, 94, 0.08));
}

.healthcheck-ack-head h2 {
    margin: 0.25rem 0 0;
    color: var(--brand-900);
    font-size: 1.3rem;
    font-weight: 850;
}

.healthcheck-ack-close {
    width: 2.25rem;
    height: 2.25rem;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.82);
    color: var(--brand-900);
    font-size: 1.1rem;
    font-weight: 800;
    line-height: 1;
}

.healthcheck-ack-list {
    display: grid;
    gap: 0.7rem;
    padding: 1rem 1.25rem;
    overflow: auto;
    background: rgba(248, 250, 252, 0.72);
}

.healthcheck-ack-list p {
    position: relative;
    margin: 0;
    padding: 0.78rem 0.85rem 0.78rem 2.35rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0.7rem;
    background: rgba(255, 255, 255, 0.94);
    color: var(--brand-900);
    line-height: 1.45;
}

.healthcheck-ack-list p::before {
    content: "";
    position: absolute;
    left: 0.85rem;
    top: 1.02rem;
    width: 0.62rem;
    height: 0.62rem;
    border-radius: 999px;
    background: #0e7490;
    box-shadow: 0 0 0 4px rgba(14, 116, 144, 0.12);
}

.healthcheck-ack-check {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
    align-items: flex-start;
    padding: 1rem 1.25rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    color: var(--brand-900);
    font-weight: 800;
}

.healthcheck-ack-check input {
    width: 1.25rem;
    height: 1.25rem;
    margin-top: 0.12rem;
    accent-color: #0e7490;
}

.healthcheck-ack-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.25rem 1.2rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.healthcheck-guide {
    height: 100%;
}

.healthcheck-guide-list {
    display: grid;
    gap: 0.75rem;
    margin-top: 1rem;
}

.healthcheck-guide-list div {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: 0.65rem;
    align-items: center;
    padding: 0.75rem;
    border-radius: 0.7rem;
    background: rgba(248, 250, 252, 0.9);
}

.healthcheck-guide-list span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    background: rgba(34, 197, 94, 0.14);
    color: #15803d;
    font-weight: 800;
}

.healthcheck-guide-list strong {
    color: var(--brand-900);
    font-size: 0.94rem;
}

.healthcheck-complete {
    display: grid;
    grid-template-columns: 4rem minmax(0, 1fr);
    gap: 1rem;
}

.healthcheck-complete-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: 4rem;
    border-radius: 999px;
    background: rgba(34, 197, 94, 0.16);
    color: #15803d;
    font-size: 2rem;
    font-weight: 900;
}

.healthcheck-result-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.75rem;
}

.healthcheck-result-grid div,
.healthcheck-remarks {
    padding: 0.85rem;
    border-radius: 0.7rem;
    background: rgba(248, 250, 252, 0.95);
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.healthcheck-result-grid strong {
    display: block;
    margin-top: 0.25rem;
    color: var(--brand-900);
    font-weight: 800;
}

.healthcheck-remarks p {
    margin: 0.35rem 0 0;
    color: var(--brand-900);
}

[data-theme="dark"] .healthcheck-hero,
[data-theme="dark"] .healthcheck-form-card,
[data-theme="dark"] .healthcheck-guide,
[data-theme="dark"] .healthcheck-complete,
[data-theme="dark"] .healthcheck-ack-dialog {
    border-color: rgba(148, 163, 184, 0.18);
    background: var(--card);
}

[data-theme="dark"] .healthcheck-identity span,
[data-theme="dark"] .healthcheck-status-panel,
[data-theme="dark"] .healthcheck-choice,
[data-theme="dark"] .healthcheck-conditional,
[data-theme="dark"] .healthcheck-guide-list div,
[data-theme="dark"] .healthcheck-result-grid div,
[data-theme="dark"] .healthcheck-remarks,
[data-theme="dark"] .healthcheck-ack-list,
[data-theme="dark"] .healthcheck-ack-list p,
[data-theme="dark"] .healthcheck-ack-close {
    border-color: rgba(148, 163, 184, 0.18);
    background: rgba(15, 23, 42, 0.62);
}

[data-theme="dark"] .healthcheck-identity span {
    color: #67e8f9;
}

@media (max-width: 768px) {
    .healthcheck-hero,
    .healthcheck-complete {
        grid-template-columns: 1fr;
    }

    .healthcheck-choice-grid {
        grid-template-columns: 1fr;
    }

    .healthcheck-actions {
        flex-direction: column-reverse;
    }

    .healthcheck-ack-actions {
        flex-direction: column-reverse;
    }

    .healthcheck-actions .btn {
        width: 100%;
    }

    .healthcheck-ack-actions .btn {
        width: 100%;
    }
}