
:root {
    color-scheme: light dark;
    --app-brand: light-dark(#0b5fac, #69baff);
    --colorNeutralForegroundOnBrand: var(--app-on-brand);
    --app-on-brand: light-dark(#ffffff, #09243a);
    --app-brand-secondary: light-dark(#a35f00, #ffc24c);
    --app-accent: var(--app-brand-secondary);
    --app-accent-soft: light-dark(rgb(163 95 0 / .12), rgb(255 194 76 / .18));
    --app-accent-border: light-dark(#d6aa69, #8f6c2d);
    --app-brand-soft: light-dark(rgb(11 95 172 / .10), rgb(105 186 255 / .16));
    --app-brand-secondary-soft: light-dark(rgb(163 95 0 / .12), rgb(255 194 76 / .18));
    --app-background: light-dark(#f5f8fc, #0e1520);
    --app-surface: light-dark(#ffffff, #172230);
    --app-surface-muted: light-dark(#edf3fa, #202e3e);
    --app-surface-hover: light-dark(#e5eef8, #304459);
    --app-glass-surface: light-dark(rgb(255 255 255 / .62), rgb(23 34 48 / .68));
    --app-glass-surface-strong: light-dark(rgb(255 255 255 / .82), rgb(23 34 48 / .86));
    --app-glass-border: light-dark(rgb(11 95 172 / .17), rgb(216 238 255 / .20));
    --app-glass-shadow: light-dark(rgb(19 62 105 / .13), rgb(0 0 0 / .38));
    --app-foreground: light-dark(#153b64, #edf6ff);
    --app-foreground-muted: light-dark(#5b6f87, #a9bbcd);
    --app-border: light-dark(#d2e2f1, #354a5f);
    --app-grid-line: light-dark(rgb(11 95 172 / .08), rgb(237 246 255 / .08));
    --app-shadow-color: light-dark(rgb(19 62 105 / .13), rgb(0 0 0 / .34));
}

body {
    background: var(--app-background);
    color: var(--app-foreground);
}

.navmenu-icon {
    display: none;
}

.manage {
    width: 100dvw;
}

footer {
    background: var(--neutral-layer-4);
    color: var(--neutral-foreground-rest);
    align-items: center;
    padding: 10px 10px;
}

    footer a {
        color: var(--neutral-foreground-rest);
        text-decoration: none;
    }

        footer a:focus {
            outline: 1px dashed;
            outline-offset: 3px;
        }

        footer a:hover {
            text-decoration: underline;
        }

.alert {
    border: 1px dashed var(--accent-fill-rest);
    padding: 5px;
}


#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
    margin: 20px 0;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::before {
        content: "An error has occurred. "
    }

.loading-progress {
    position: relative;
    display: block;
    width: 8rem;
    height: 8rem;
    margin: 20vh auto 1rem auto;
}

    .loading-progress circle {
        fill: none;
        stroke: #e0e0e0;
        stroke-width: 0.6rem;
        transform-origin: 50% 50%;
        transform: rotate(-90deg);
    }

        .loading-progress circle:last-child {
            stroke: #1b6ec2;
            stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
            transition: stroke-dasharray 0.05s ease-in-out;
        }

.loading-progress-text {
    position: absolute;
    text-align: center;
    font-weight: bold;
    inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}

    .loading-progress-text:after {
        content: var(--blazor-load-percentage-text, "Loading");
    }

code {
    color: #c02d76;
}

a {
    color: inherit;
}

.dashboard-table {
    width: 100%;
    min-width: 720px;
    border-collapse: separate;
    border-spacing: 0;
    font-variant-numeric: tabular-nums;
}

.dashboard-table th,
.dashboard-table td { padding: .72rem .8rem; border-bottom: 1px solid var(--neutral-stroke-rest); text-align: right; white-space: nowrap; }
.dashboard-table thead th { position: sticky; top: 0; z-index: 2; background: var(--neutral-layer-3); color: var(--neutral-foreground-rest); font-size: .82rem; font-weight: 700; }
.dashboard-table th:first-child { position: sticky; left: 0; z-index: 1; min-width: 190px; text-align: left; background: var(--neutral-layer-1); }
.dashboard-table thead th:first-child { z-index: 3; background: var(--neutral-layer-3); }
.dashboard-table tbody tr:hover td,
.dashboard-table tbody tr:hover th { background: color-mix(in srgb, var(--accent-base-color) 5%, var(--neutral-layer-1)); }
.dashboard-table .total-cell { font-weight: 700; background: var(--neutral-layer-2); }
.dashboard-table .hospital-group th { position: static; padding-block: .55rem; background: color-mix(in srgb, var(--accent-base-color) 8%, var(--neutral-layer-1)); color: var(--accent-foreground-rest); }

.analytics-shell { width: min(100%, 1440px); margin-inline: auto; }
.analytics-loading { min-height: 280px; }
.analytics-filter { position: sticky; top: 0; z-index: 8; display: grid; grid-template-columns: minmax(280px, 2fr) minmax(150px, .6fr); gap: .75rem; padding: .9rem; border: 1px solid var(--neutral-stroke-rest); border-radius: .8rem; background: color-mix(in srgb, var(--neutral-layer-1) 94%, transparent); backdrop-filter: blur(12px); }
.analytics-filter label { display: grid; gap: .3rem; color: var(--neutral-foreground-hint); font-size: .8rem; font-weight: 700; }
.analytics-filter select { width: 100%; min-height: 44px; padding: .55rem .7rem; border: 1px solid var(--neutral-stroke-rest); border-radius: .5rem; background: var(--neutral-layer-1); color: var(--neutral-foreground-rest); font: inherit; }
.analytics-filter select:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent-base-color) 35%, transparent); outline-offset: 2px; }
.analytics-heading { display: flex; justify-content: space-between; align-items: end; gap: 1rem; margin: 1.5rem 0 1rem; }
.analytics-heading h2 { margin: .25rem 0; font-size: clamp(1.35rem, 3vw, 2rem); }
.analytics-heading p { margin: 0; color: var(--neutral-foreground-hint); }
.analytics-eyebrow { color: var(--accent-foreground-rest); font-size: .8rem; font-weight: 700; letter-spacing: .04em; }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1rem; }
.metric-card { display: grid; gap: .3rem; min-height: 118px; padding: 1rem; border: 1px solid var(--neutral-stroke-rest); border-radius: .8rem; background: var(--neutral-layer-1); }
.metric-card span, .metric-card small { color: var(--neutral-foreground-hint); }
.metric-card strong { align-self: end; font-size: clamp(1.5rem, 3vw, 2.15rem); line-height: 1; font-variant-numeric: tabular-nums; }
.metric-card .delta-up { color: #166534; }
.metric-card .delta-down { color: #b42318; }
.analytics-card { margin-block: 1rem; padding: 1rem; border: 1px solid var(--neutral-stroke-rest); border-radius: .8rem; background: var(--neutral-layer-1); }
.chart-card { min-height: 400px; }
.card-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: .75rem; }
.card-heading span { color: var(--neutral-foreground-hint); font-size: .8rem; font-weight: 700; }
.card-heading h3 { margin: .2rem 0 0; font-size: 1.1rem; }
.table-scroll { max-width: 100%; overflow: auto; border: 1px solid var(--neutral-stroke-rest); border-radius: .6rem; }
.table-scroll:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent-base-color) 35%, transparent); outline-offset: 2px; }
.table-legend { margin: .75rem 0 0; color: var(--neutral-foreground-hint); font-size: .82rem; }
.table-legend span { font-weight: 700; color: var(--neutral-foreground-rest); }
.status-badge { display: inline-flex; padding: .25rem .55rem; border-radius: 999px; font-size: .78rem; font-weight: 700; }
.status-badge.complete { background: #dcfce7; color: #166534; }
.status-badge.pending { background: #fff7ed; color: #9a3412; }
.analytics-monthly-grid .analytics-grid-number { text-align: end; font-variant-numeric: tabular-nums; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

@media (max-width: 1000px) { .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) {
    .analytics-filter { position: static; grid-template-columns: 1fr; }
    .analytics-heading { align-items: stretch; flex-direction: column; }
    .metric-grid { grid-template-columns: 1fr 1fr; }
    .metric-card { min-height: 105px; }
    .analytics-card { padding: .75rem; }
}
@media (max-width: 420px) { .metric-grid { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; } }

/* Keep every product on the same Playbook login composition. */
.identity-app-brand { display:inline-flex; width:fit-content; align-items:center; gap:.65rem; color:var(--app-foreground); font-weight:750; }
.identity-app-brand > img { display:block; width:2rem; height:2rem; flex:0 0 auto; object-fit:contain; }

body .login-alt-actions.login-alt-actions { grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:.65rem; }
body .login-alt-actions > .login-provider-block,
body .login-alt-actions > form { min-width:0; }
body .login-alt-actions button[value="Microsoft"] .app-button__label img,
body .login-alt-actions button[name="__passkeySubmit"] .app-button__icon { display:none; }
body .login-alt-actions button[value="Microsoft"]::before,
body .login-alt-actions button[name="__passkeySubmit"]::before { width:1rem; height:1rem; flex:0 0 auto; background:currentColor; content:""; mask-position:center; mask-repeat:no-repeat; mask-size:contain; -webkit-mask-position:center; -webkit-mask-repeat:no-repeat; -webkit-mask-size:contain; }
body .login-alt-actions button[value="Microsoft"]::before { mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 3h8v8H3zm10 0h8v8h-8zM3 13h8v8H3zm10 0h8v8h-8z'/%3E%3C/svg%3E"); -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 3h8v8H3zm10 0h8v8h-8zM3 13h8v8H3zm10 0h8v8h-8z'/%3E%3C/svg%3E"); }
body .login-alt-actions button[name="__passkeySubmit"]::before { mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.5 13a5.5 5.5 0 1 1 4.9-3H22v3h-2v2h-3v2h-4.1A5.5 5.5 0 0 1 8.5 13Zm0-3a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5Z'/%3E%3C/svg%3E"); -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.5 13a5.5 5.5 0 1 1 4.9-3H22v3h-2v2h-3v2h-4.1A5.5 5.5 0 0 1 8.5 13Zm0-3a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5Z'/%3E%3C/svg%3E"); }

@media (max-width:34rem) {
    body .login-alt-actions.login-alt-actions { grid-template-columns:1fr; }
}
