/* _content/StatusTracker/Components/Layout/MainLayout.razor.rz.scp.css */
.app-layout[b-pww4pd7ogi] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* Pages own their measure: the dashboard renders a full-bleed system banner
   and then wraps content in .page-shell; admin pages use MudContainer. */
.main-content[b-pww4pd7ogi] {
    flex: 1;
    width: 100%;
    outline: none;
}
/* _content/StatusTracker/Components/Layout/SiteFooter.razor.rz.scp.css */
.site-footer[b-17x4jqza0p] {
    border-top: 1px solid var(--border);
    padding: 20px var(--s4);
    color: var(--text-muted);
    font-size: var(--text-meta);
}

.footer-inner[b-17x4jqza0p] {
    max-width: var(--content-measure);
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: var(--s2);
}

.footer-inner strong[b-17x4jqza0p] {
    color: var(--text);
}

@media (max-width: 520px) {
    .footer-inner[b-17x4jqza0p] {
        display: block;
    }

    .footer-inner > *[b-17x4jqza0p] {
        display: block;
        margin-bottom: var(--s1);
    }

    .footer-inner > .footer-sep[b-17x4jqza0p] {
        display: none;
    }
}
/* _content/StatusTracker/Components/Layout/SiteHeader.razor.rz.scp.css */
/* Deep navy header bar — the one fixed dark surface in light mode */
.site-header[b-4792mvf01i] {
    background: var(--header);
    color: var(--on-header);
}

.header-inner[b-4792mvf01i] {
    max-width: var(--content-measure);
    min-height: 64px;
    margin: 0 auto;
    padding: 10px var(--s4);
    display: flex;
    align-items: center;
    gap: 20px;
}

.wordmark[b-4792mvf01i] {
    display: flex;
    align-items: center;
    gap: var(--s3);
    min-height: var(--touch-target);
    color: var(--on-header);
    text-decoration: none;
}

.wordmark:hover[b-4792mvf01i] {
    color: var(--on-header);
    text-decoration: none;
}

.site-logo[b-4792mvf01i] {
    max-height: 28px;
    width: auto;
    display: block;
}

.site-name[b-4792mvf01i] {
    font-family: var(--font-display);
    font-size: var(--text-title);
    font-weight: 600;
    letter-spacing: 0.01em;
    white-space: nowrap;
}

.header-strip[b-4792mvf01i] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: var(--s4);
}

.header-status[b-4792mvf01i] {
    display: flex;
    align-items: center;
    gap: 7px;
    font-family: var(--font-mono);
    font-size: var(--text-label);
    letter-spacing: var(--tracking-label);
}

.header-actions[b-4792mvf01i] {
    display: flex;
    gap: var(--s2);
}

/* Tablet: two-row header — strip drops below the wordmark with a hairline */
@media (max-width: 760px) {
    .header-inner[b-4792mvf01i] {
        flex-wrap: wrap;
        gap: 4px 12px;
    }

    .header-strip[b-4792mvf01i] {
        order: 3;
        width: 100%;
        margin: 4px 0 0;
        padding-top: var(--s2);
        border-top: 1px solid var(--unknown);
        justify-content: space-between;
    }
}

@media (max-width: 520px) {
    .header-inner[b-4792mvf01i] {
        padding: var(--s3) var(--s4);
    }

    .header-strip[b-4792mvf01i] {
        flex-wrap: wrap;
        gap: var(--s2);
    }

    .header-actions[b-4792mvf01i] {
        margin-left: auto;
    }

    .site-name[b-4792mvf01i] {
        white-space: normal;
    }
}
/* _content/StatusTracker/Components/Pages/EndpointDetail.razor.rz.scp.css */
.detail-loading[b-32q4jrp5hj] {
    display: flex;
    justify-content: center;
}

/* The inspection view: a surface panel with an accent rule on top */
.detail-panel[b-32q4jrp5hj] {
    border-top: 4px solid var(--accent);
    background: var(--surface);
    padding: var(--s5);
    border-radius: var(--radius-panel);
}

.detail-head .back-button[b-32q4jrp5hj] {
    margin-bottom: 20px;
}

.detail-head .eyebrow[b-32q4jrp5hj] {
    margin-top: 0;
}

.detail-title-line[b-32q4jrp5hj] {
    display: flex;
    gap: var(--s3);
    align-items: center;
    flex-wrap: wrap;
}

.detail-title-line h1[b-32q4jrp5hj] {
    font-family: var(--font-display);
    font-size: var(--text-page);
    font-weight: 600;
    line-height: var(--leading-tight);
    margin: 0;
    color: var(--text);
    overflow-wrap: anywhere;
}

.detail-head code[b-32q4jrp5hj] {
    display: block;
    margin-top: var(--s1);
}

/* Metrics strip spacing (grid itself lives in components.css) */
.metrics-strip[b-32q4jrp5hj] {
    margin: 20px 0 var(--s5);
}

.metrics-strip strong.degraded[b-32q4jrp5hj] {
    color: var(--degraded);
}

.metrics-strip strong.down[b-32q4jrp5hj] {
    color: var(--down);
}

/* Panels stack in a single column so the 90-cell ribbon keeps legible cells */
.panel + .panel[b-32q4jrp5hj] {
    margin-top: var(--s4);
}

.chart-panel figcaption[b-32q4jrp5hj] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--s3);
    margin-bottom: var(--s3);
    flex-wrap: wrap;
}

.chart-panel figcaption strong[b-32q4jrp5hj] {
    display: block;
}

.chart-panel small[b-32q4jrp5hj] {
    color: var(--text-muted);
    font-size: var(--text-meta);
}

/* Range picker: quiet mono tabs, accent underline on the pressed one */
.range-picker[b-32q4jrp5hj] {
    display: flex;
    gap: var(--s1);
    border-bottom: 1px solid var(--border);
}

.range-button[b-32q4jrp5hj] {
    min-height: var(--control-height);
    border: 0;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: var(--text-muted);
    padding: var(--s1) var(--s3);
    font-family: var(--font-mono);
    font-size: var(--text-label);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.range-button:hover[b-32q4jrp5hj] {
    color: var(--accent);
}

.range-button[aria-pressed="true"][b-32q4jrp5hj] {
    color: var(--text);
    border-bottom-color: var(--accent);
}

.chart-empty[b-32q4jrp5hj],
.chart-loading[b-32q4jrp5hj] {
    padding: var(--s5) 0;
    text-align: center;
    font-family: var(--font-mono);
    font-size: var(--text-meta);
    color: var(--text-muted);
}

/* Range-change busy state: the chart (or empty state) stays mounted and on
   screen — only dimmed, with a thin indeterminate bar pinned to its top —
   instead of being replaced by a spinner. See B21a in the review doc. */
.chart-wrap[b-32q4jrp5hj] {
    position: relative;
}

.chart-wrap--busy[b-32q4jrp5hj] {
    opacity: 0.55;
    transition: opacity 150ms ease;
}

.chart-wrap__busy-bar[b-32q4jrp5hj] {
    position: absolute;
    inset: 0 0 auto 0;
}

/* Uptime ribbon panel */
.section-label__name[b-32q4jrp5hj] {
    color: var(--text-muted);
    font-weight: 400;
}

.ribbon-detail[b-32q4jrp5hj]  .uptime-ribbon {
    margin: 18px 0 var(--s2);
}

/* Check history table */
.history-panel .panel-title[b-32q4jrp5hj] {
    margin-bottom: var(--s3);
}

.checks-table-wrapper[b-32q4jrp5hj] {
    overflow-x: auto;
}

.checks-table[b-32q4jrp5hj] {
    width: 100%;
    border-collapse: collapse;
    font-family: var(--font-mono);
    font-size: var(--text-label);
}

.checks-table th[b-32q4jrp5hj] {
    text-align: left;
    color: var(--text-muted);
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: var(--tracking-label);
}

.checks-table td[b-32q4jrp5hj],
.checks-table th[b-32q4jrp5hj] {
    padding: 9px 5px;
    border-top: 1px solid var(--border);
    color: var(--text);
    vertical-align: middle;
    white-space: nowrap;
}

/* History statuses read as words, not shouted labels */
.checks-table[b-32q4jrp5hj]  .status-word {
    text-transform: none;
    letter-spacing: 0;
}

.checks-table tbody tr:hover[b-32q4jrp5hj] {
    background: var(--surface-soft);
}

.checks-empty[b-32q4jrp5hj] {
    padding: var(--s5) 0;
    text-align: center;
    font-family: var(--font-mono);
    font-size: var(--text-meta);
    color: var(--text-muted);
}

/* Responsive */
@media (max-width: 760px) {
    .detail-panel[b-32q4jrp5hj] {
        padding: var(--s4);
    }

    .metrics-strip[b-32q4jrp5hj] {
        margin-inline: calc(-1 * var(--s4));
    }
}

@media (max-width: 520px) {
    .detail-panel[b-32q4jrp5hj] {
        padding: var(--s3);
    }

    .metrics-strip[b-32q4jrp5hj] {
        margin-inline: calc(-1 * var(--s3));
    }

    .checks-table td[b-32q4jrp5hj],
    .checks-table th[b-32q4jrp5hj] {
        font-size: 10px;
        padding: var(--s2) 3px;
    }
}
/* _content/StatusTracker/Components/Pages/Home.razor.rz.scp.css */
.dashboard-loading[b-zoedc0fbo9] {
    display: flex;
    justify-content: center;
}

/* Intro row: page title on the left, live readout on the right */
.intro-row[b-zoedc0fbo9] {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: var(--s4);
    margin-bottom: var(--s5);
}

.intro-row h1[b-zoedc0fbo9] {
    font-family: var(--font-display);
    font-size: var(--text-hero);
    font-weight: 600;
    line-height: var(--leading-tight);
    margin: 0;
    color: var(--text);
}

.intro-copy[b-zoedc0fbo9] {
    margin: 6px 0 0;
    color: var(--text-muted);
}

.live-readout[b-zoedc0fbo9] {
    display: flex;
    align-items: center;
    gap: 9px;
    font-family: var(--font-mono);
    font-size: var(--text-label);
    color: var(--text-body);
    white-space: nowrap;
}

.refresh-button[b-zoedc0fbo9] {
    margin-left: var(--s2);
}

/* Endpoint groups stack with a 16px rhythm */
.endpoint-groups[b-zoedc0fbo9] {
    display: flex;
    flex-direction: column;
    gap: var(--s4);
}

/* Incident history preview — hairline-separated strip under the groups */
.incident-history[b-zoedc0fbo9] {
    border-block: 1px solid var(--border);
    padding: var(--s4) 0;
    margin-top: var(--s4);
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--s4);
}

.incident-history .eyebrow[b-zoedc0fbo9] {
    margin: 0;
}

.incident-history strong[b-zoedc0fbo9] {
    font-family: var(--font-display);
    font-size: var(--text-title);
    font-weight: 600;
    color: var(--text);
}

.incident-history__hint[b-zoedc0fbo9] {
    color: var(--text-muted);
    font-size: var(--text-meta);
}

.incident-list[b-zoedc0fbo9] {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    display: grid;
    gap: var(--s2);
}

.incident-item[b-zoedc0fbo9] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--s3);
}

.incident-item__title[b-zoedc0fbo9] {
    color: var(--text);
    font-weight: 600;
}

.incident-item__time[b-zoedc0fbo9] {
    font-size: var(--text-label);
    color: var(--text-muted);
}

@media (max-width: 760px) {
    .intro-row[b-zoedc0fbo9] {
        flex-direction: column;
        align-items: start;
        gap: var(--s4);
    }

    .live-readout[b-zoedc0fbo9] {
        width: 100%;
        justify-content: flex-start;
    }
}

@media (max-width: 520px) {
    .intro-row h1[b-zoedc0fbo9] {
        font-size: 28px;
    }

    .incident-history[b-zoedc0fbo9] {
        display: block;
    }

    .incident-history > *[b-zoedc0fbo9] {
        display: block;
        margin-bottom: 6px;
    }
}
/* _content/StatusTracker/Components/Shared/EndpointGroup.razor.rz.scp.css */
/* Hairline panel; the heading sits on a soft surface, records on the surface */
.endpoint-group[b-5v2465ni30] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-panel);
    overflow: hidden;
}

.group-heading[b-5v2465ni30] {
    width: 100%;
    min-height: var(--group-heading-height);
    border: 0;
    border-bottom: 1px solid var(--border);
    background: var(--surface-soft);
    color: var(--text);
    padding: var(--s2) var(--s4);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--s3);
    text-align: left;
    transition: background-color 120ms var(--ease-out-expo);
}

.group-heading:hover[b-5v2465ni30] {
    background: var(--accent-soft);
}

.group-heading > span:first-child[b-5v2465ni30] {
    display: flex;
    align-items: center;
    gap: var(--s3);
    min-width: 0;
}

.caret[b-5v2465ni30] {
    font-size: 18px;
    color: var(--accent);
    transition: transform 200ms var(--ease-out-expo);
}

.group-heading[aria-expanded="false"] .caret[b-5v2465ni30] {
    transform: rotate(-90deg);
}

.group-title[b-5v2465ni30] {
    font-family: var(--font-display);
    font-size: var(--text-title);
    font-weight: 600;
}

.group-count[b-5v2465ni30],
.group-health[b-5v2465ni30] {
    font-family: var(--font-mono);
    font-size: var(--text-label);
    color: var(--text-muted);
    white-space: nowrap;
}

.group-table[hidden][b-5v2465ni30] {
    display: none;
}

@media (max-width: 520px) {
    .group-heading[b-5v2465ni30] {
        padding: var(--s2) var(--s3);
    }

    .group-health[b-5v2465ni30] {
        display: none;
    }
}
/* _content/StatusTracker/Components/Shared/EndpointRow.razor.rz.scp.css */
/* Grid template is shared with the column head in components.css */
.endpoint-row[b-99uc4056ks] {
    min-height: var(--row-height);
    padding: 9px var(--s4);
    border-bottom: 1px solid var(--border);
    transition: background-color 120ms var(--ease-out-expo);
}

.endpoint-row:last-child[b-99uc4056ks] {
    border-bottom: 0;
}

.endpoint-row:hover[b-99uc4056ks] {
    background: var(--surface-soft);
}

.service-identity[b-99uc4056ks] {
    min-width: 0;
}

.service-name[b-99uc4056ks] {
    display: flex;
    align-items: center;
    gap: 9px;
}

.service-name h3[b-99uc4056ks] {
    font-family: var(--font-display);
    font-size: var(--text-subhead);
    font-weight: 600;
    margin: 0;
    color: var(--text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.service-name h3 a[b-99uc4056ks] {
    color: inherit;
    text-decoration: none;
}

.service-name h3 a:hover[b-99uc4056ks] {
    color: var(--accent-hover);
}

.service-identity code[b-99uc4056ks] {
    display: block;
    margin-top: 2px;
}

.service-identity p[b-99uc4056ks] {
    margin: 3px 0 0;
    color: var(--text-muted);
    font-size: var(--text-label);
}

.service-identity p.meta-warn[b-99uc4056ks] {
    color: var(--degraded);
}

.metric[b-99uc4056ks] {
    font-family: var(--font-mono);
    font-size: var(--text-meta);
    color: var(--text);
    white-space: nowrap;
}

.metric[b-99uc4056ks]::before {
    display: none;
}

.mobile-label[b-99uc4056ks] {
    display: none;
}

.detail-button[b-99uc4056ks] {
    justify-self: end;
}

/* Phone: stacked service record. Identity spans the full width, status and
   metrics form a labelled second row, the ribbon stays first-class below. */
@media (max-width: 520px) {
    .endpoint-row[b-99uc4056ks] {
        grid-template-columns: minmax(0, 1fr) auto auto auto;
        padding: var(--s3);
        gap: var(--s2);
    }

    .service-identity[b-99uc4056ks] {
        grid-column: 1 / -1;
        margin-bottom: var(--s1);
    }

    .service-status[b-99uc4056ks] {
        grid-column: 1;
        grid-row: 2;
        display: block !important;
    }

    .response[b-99uc4056ks] {
        grid-column: 2;
        grid-row: 2;
    }

    .uptime:not(.week)[b-99uc4056ks] {
        grid-column: 3;
        grid-row: 2;
    }

    .uptime.week[b-99uc4056ks] {
        display: none !important;
    }

    .ribbon-wrap[b-99uc4056ks] {
        grid-column: 1 / -1;
        margin-top: 6px;
    }

    .mobile-label[b-99uc4056ks] {
        display: block;
        font-family: var(--font-mono);
        font-size: 10px;
        color: var(--text-muted);
        text-transform: uppercase;
        letter-spacing: var(--tracking-label);
        margin-bottom: 6px;
    }

    .detail-button[b-99uc4056ks] {
        grid-column: 4;
        grid-row: 2;
        justify-self: stretch;
        padding-inline: var(--s2);
    }

    .metric[b-99uc4056ks]::before {
        display: inline;
        content: '';
        margin-right: var(--s1);
        color: var(--text-muted);
        font-size: 10px;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

    .response[b-99uc4056ks]::before {
        content: 'Response';
    }

    .uptime:not(.week)[b-99uc4056ks]::before {
        content: '24h';
    }
}
/* _content/StatusTracker/Components/Shared/SystemBanner.razor.rz.scp.css */
/* Full-bleed strip directly under the header. Content aligns to the 1120px
   measure via the padding formula; the tint runs edge to edge. */
.system-banner[b-1my05q77mp] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: var(--s3);
    padding: var(--s3) max(var(--s4), calc((100% - var(--content-measure)) / 2));
    border-bottom: 1px solid var(--border);
    background: var(--up-soft);
    color: var(--text);
}

.system-banner--degraded[b-1my05q77mp] { background: var(--degraded-soft); }
.system-banner--down[b-1my05q77mp]     { background: var(--down-soft); }
.system-banner--unknown[b-1my05q77mp]  { background: var(--unknown-soft); }

.system-banner__text[b-1my05q77mp] {
    min-width: 0;
}

.system-banner strong[b-1my05q77mp] {
    display: block;
    font-family: var(--font-display);
    font-size: var(--text-title);
    font-weight: 600;
}

.system-banner p[b-1my05q77mp] {
    margin: 2px 0 0;
    color: var(--text-body);
}

.banner-word[b-1my05q77mp] {
    margin-left: auto;
}

@media (max-width: 520px) {
    .system-banner[b-1my05q77mp] {
        padding: 10px var(--s4);
        align-items: flex-start;
    }

    .system-banner p[b-1my05q77mp] {
        font-size: 13px;
        line-height: 1.35;
    }

    .banner-word[b-1my05q77mp] {
        display: none;
    }
}