/* Jade doux (E2). Shared by the public and administration hosts. */
:root,
:root[data-theme="light"] {
    color-scheme: light;
    --narc-color-primary: #397b6b;
    --narc-color-primary-hover: #2d6557;
    --narc-color-on-primary: #ffffff;
    --narc-color-secondary: #e8eeea;
    --narc-color-secondary-hover: #dce6df;
    --narc-color-on-secondary: #315f53;
    --narc-color-surface: #fffefa;
    --narc-color-surface-muted: #f7f5ef;
    --narc-color-text: #282c29;
    --narc-color-text-muted: #636b65;
    --narc-color-border: #d8dcd5;
    --narc-color-disabled: #e7e8e2;
    --narc-color-focus: #397b6b40;
    --narc-color-success: #26734e;
    --narc-color-info: #356d85;
    --narc-color-warning: #8a610f;
    --narc-color-danger: #b13d43;
    --narc-color-on-status: #ffffff;
    --narc-table-row-hover-background: #eef2ed;
    --narc-shadow-sm: 0 2px 10px #232b2407;
    --narc-radius-md: 8px;
    --narc-radius-lg: 12px;
    --narc-font-family: 'Segoe UI', ui-sans-serif, system-ui, sans-serif;
    --narc-chart-color-secondary: #8092ae;
    --narc-chart-color-accent: #9e7c9e;
    --narc-chart-color-neutral: #7c8780;
    --narc-chart-grid: #e1e4dc;
    --narc-chart-tooltip-background: #282c29;
    --narc-progress-track: #e7e8e2;
    --app-accent-soft: #e8eeea;
    --app-accent-text: #315f53;
    --app-surface-raised: #eeeee7;
    --app-illustration-filter: none;
}
:root[data-theme="dark"] {
    color-scheme: dark;
    --narc-color-primary: #a3c9ba;
    --narc-color-primary-hover: #bcdbce;
    --narc-color-on-primary: #203b32;
    --narc-color-secondary: #3a4942;
    --narc-color-secondary-hover: #46574e;
    --narc-color-on-secondary: #d3e4da;
    --narc-color-surface: #303330;
    --narc-color-surface-muted: #272827;
    --narc-color-text: #f1f0e9;
    --narc-color-text-muted: #b3bbb3;
    --narc-color-border: #50564f;
    --narc-color-disabled: #41463f;
    --narc-color-focus: #a3c9ba55;
    --narc-color-success: #85cda3;
    --narc-color-info: #9bc9dd;
    --narc-color-warning: #e4c477;
    --narc-color-danger: #f0a1a4;
    --narc-color-on-status: #232824;
    --narc-table-row-hover-background: #383e38;
    --narc-shadow-sm: 0 2px 12px #00000012;
    --narc-alert-info-background: #283e49;
    --narc-alert-info-border: #4c7b90;
    --narc-alert-info-text: #b6d9e8;
    --narc-alert-success-background: #293f31;
    --narc-alert-success-border: #527e61;
    --narc-alert-success-text: #b2ddbf;
    --narc-alert-warning-background: #443b28;
    --narc-alert-warning-border: #8e7947;
    --narc-alert-warning-text: #ebd49b;
    --narc-alert-danger-background: #4a2e32;
    --narc-alert-danger-border: #965e65;
    --narc-alert-danger-text: #f4b9be;
    --narc-chart-grid: #50564f;
    --narc-chart-tooltip-background: #171b18;
    --narc-chart-color-secondary: #a5b5d1;
    --narc-chart-color-accent: #c9a7c9;
    --narc-chart-color-neutral: #b3bbb3;
    --narc-progress-track: #41463f;
    --narc-progress-info: #78b9d0;
    --narc-progress-success: #85cda3;
    --narc-progress-warning: #e4c477;
    --narc-progress-danger: #f0a1a4;
    --app-accent-soft: #364940;
    --app-accent-text: #c3dfd0;
    --app-surface-raised: #363b35;
    --app-illustration-filter: invert(1) brightness(1.7);
}
body { background: var(--narc-color-surface-muted); color: var(--narc-color-text); }
::selection { background: var(--narc-color-primary); color: var(--narc-color-on-primary); }
:focus-visible { outline: 3px solid var(--narc-color-primary); outline-offset: 3px; }
.theme-picker { display: inline-flex; align-items: center; gap: .5rem; font: 500 .75rem/1.4 var(--narc-font-family); color: var(--narc-color-text-muted); flex-shrink: 0; }
.theme-picker select { font: inherit; color: var(--narc-color-text); background: var(--narc-color-surface); border: 1px solid var(--narc-color-border); border-radius: 6px; padding: .5rem .4rem; min-height: 36px; cursor: pointer; }
.brand-building { width: 38px; height: 38px; object-fit: contain; filter: var(--app-illustration-filter); }
.civic-building { position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 260px; opacity: .8; filter: var(--app-illustration-filter); }
.admin-shell__header { min-height: 3.5rem; box-sizing: border-box; flex-wrap: wrap; }
.admin-shell__header > .theme-picker { margin-left: auto; }
.admin-shell__brand { display: inline-flex; align-items: center; gap: .5rem; font-family: Georgia, 'Times New Roman', serif; }
.admin-shell__menu { top: 3.5rem; padding-top: 1.5rem; }
.admin-shell__main { padding-top: 2rem; }
.admin-menu .admin-menu__link[aria-current="page"] { background: var(--app-accent-soft); color: var(--app-accent-text); }
.admin-stat { box-shadow: var(--narc-shadow-sm); }
.admin-page-header h1 { letter-spacing: -.035em; }
#blazor-error-ui { background: var(--narc-alert-warning-background); color: var(--narc-alert-warning-text); color-scheme: inherit; }
#components-reconnect-modal { background: var(--narc-color-surface); color: var(--narc-color-text); border: 1px solid var(--narc-color-border); }
@media (max-width: 800px) { .admin-shell__menu { position: static; } }
@media (max-width: 760px) {
    .theme-picker > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
    .theme-picker select { max-width: 90px; }
    .civic-building { width: 112px; top: 20px; transform: none; opacity: .3; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0s !important; animation-duration: 0s !important; } }

.login-card { display: grid; gap: 1.25rem; width: min(24rem, 90vw); box-sizing: border-box; padding: 2rem; background: var(--narc-color-surface); border: 1px solid var(--narc-color-border); border-radius: var(--narc-radius-lg); }
.login-card h1 { margin: 0; font: 600 1.8rem/1.2 Georgia, serif; }
.login-card input[type="password"] { box-sizing: border-box; margin-top: .5rem; padding: .75rem; font: inherit; background: var(--narc-input-background); border: 1px solid var(--narc-color-border); border-radius: 6px; color: var(--narc-color-text); }
.login-card button { font: 600 .9rem/1.4 var(--narc-font-family); padding: .75rem; border: 0; border-radius: 6px; background: var(--narc-color-primary); color: var(--narc-color-on-primary); cursor: pointer; }
.login-card .theme-picker { justify-self: end; }

.narc-button--ghost { --narc-button-primary-background-hover: var(--app-accent-soft); }