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

.main-content[b-pww4pd7ogi] {
    flex: 1;
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-md);
    width: 100%;
}

@media (max-width: 768px) {
    .main-content[b-pww4pd7ogi] {
        padding: var(--space-sm);
    }
}

@media (max-width: 480px) {
    .main-content[b-pww4pd7ogi] {
        padding: var(--space-xs);
    }
}
/* _content/StatusTracker/Components/Layout/SiteFooter.razor.rz.scp.css */
.site-footer[b-17x4jqza0p] {
    border-top: 1px solid var(--color-border);
    padding: var(--space-sm) var(--space-md);
}

.footer-content[b-17x4jqza0p] {
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--color-muted);
}
/* _content/StatusTracker/Components/Layout/SiteHeader.razor.rz.scp.css */
.site-header[b-4792mvf01i] {
    position: sticky;
    top: 0;
    z-index: 100;
    background-color: var(--color-surface);
    border-bottom: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
}

.header-content[b-4792mvf01i] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--space-sm) var(--space-md);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.site-title[b-4792mvf01i] {
    font-family: var(--font-display);
    font-size: var(--text-2xl);
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--color-ink);
    text-decoration: none;
    line-height: 1;
}

.site-title:hover[b-4792mvf01i] {
    color: var(--color-ink);
    text-decoration: none;
}

.nav-meta[b-4792mvf01i] {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: 0.10em;
    color: var(--color-muted);
}

.live-indicator[b-4792mvf01i] {
    display: flex;
    align-items: center;
    gap: var(--space-2xs);
}

.separator[b-4792mvf01i] {
    color: var(--color-rule);
}

.last-updated[b-4792mvf01i] {
    color: var(--color-muted);
}

.mobile-menu[b-4792mvf01i] {
    display: none;
}

@media (max-width: 900px) {
    .header-content[b-4792mvf01i] {
        padding: var(--space-xs) var(--space-sm);
    }

    .last-updated[b-4792mvf01i] {
        display: none;
    }

    .separator[b-4792mvf01i] {
        display: none;
    }
}

@media (max-width: 768px) {
    .nav-meta[b-4792mvf01i] {
        display: none;
    }

    .mobile-menu[b-4792mvf01i] {
        display: flex;
        align-items: center;
    }
}

@media (max-width: 480px) {
    .header-content[b-4792mvf01i] {
        padding: var(--space-2xs) var(--space-xs);
    }

    .site-title[b-4792mvf01i] {
        font-size: var(--text-lg);
    }
}
/* _content/StatusTracker/Components/Pages/EndpointDetail.razor.rz.scp.css */
/* Loading / not-found states */
.detail-loading[b-32q4jrp5hj] {
    display: flex;
    justify-content: center;
    padding: var(--space-xl) 0;
}

.not-found-message[b-32q4jrp5hj] {
    margin-top: var(--space-md);
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    border-left: 4px solid var(--color-unknown);
    background-color: var(--color-surface);
    color: var(--color-muted);
    font-size: var(--text-sm);
}

/* Back link spacing */
.back-link[b-32q4jrp5hj] {
    display: inline-block;
    margin-bottom: var(--space-sm);
}

/* Detail header */
.detail-header[b-32q4jrp5hj] {
    margin-bottom: var(--space-md);
}

.detail-title-row[b-32q4jrp5hj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-sm);
    flex-wrap: wrap;
}

.detail-title-block[b-32q4jrp5hj] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2xs);
    min-width: 0;
}

.detail-name[b-32q4jrp5hj] {
    font-family: var(--font-display);
    font-size: var(--text-3xl);
    font-weight: 800;
    color: var(--color-ink);
    margin: 0;
    line-height: 1.1;
}

.detail-url[b-32q4jrp5hj] {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--color-muted);
    word-break: break-all;
}

/* Metrics strip label / value overrides (scoped) */
.metric-label[b-32q4jrp5hj] {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.10em;
    color: var(--color-muted);
    margin-bottom: var(--space-2xs);
}

.metric-value[b-32q4jrp5hj] {
    font-family: var(--font-display);
    font-size: var(--text-2xl);
    font-weight: 800;
    color: var(--color-ink);
    line-height: 1.1;
}

/* Spacing below metrics strip */
.metrics-strip[b-32q4jrp5hj] {
    margin-bottom: var(--space-md);
}

/* Cards (chart, uptime bar, table) */
.detail-card[b-32q4jrp5hj] {
    background-color: var(--color-surface);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--color-border);
    padding: var(--space-md);
    margin-bottom: var(--space-md);
}

.card-header[b-32q4jrp5hj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-sm);
    margin-bottom: var(--space-sm);
    flex-wrap: wrap;
}

.card-title[b-32q4jrp5hj] {
    font-family: var(--font-display);
    font-size: var(--text-lg);
    font-weight: 700;
    color: var(--color-ink);
}

/* Chart states */
.chart-empty[b-32q4jrp5hj],
.chart-loading[b-32q4jrp5hj] {
    padding: var(--space-md) 0;
    text-align: center;
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    color: var(--color-muted);
}

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

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

.checks-table thead th[b-32q4jrp5hj] {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.10em;
    color: var(--color-muted);
    text-align: left;
    padding: var(--space-xs) var(--space-sm);
    border-bottom: 1px solid var(--color-rule);
}

.checks-table tbody tr[b-32q4jrp5hj] {
    border-bottom: 1px solid var(--color-rule-light);
    transition: background-color 100ms;
}

.checks-table tbody tr:last-child[b-32q4jrp5hj] {
    border-bottom: none;
}

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

.checks-table tbody td[b-32q4jrp5hj] {
    padding: var(--space-xs) var(--space-sm);
    color: var(--color-ink);
    vertical-align: middle;
}

.col-timestamp[b-32q4jrp5hj] {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--color-ink-light);
    white-space: nowrap;
}

.utc-suffix[b-32q4jrp5hj] {
    color: var(--color-muted);
}

.col-status[b-32q4jrp5hj] {
    display: flex;
    align-items: center;
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    font-weight: 600;
}

.col-response[b-32q4jrp5hj] {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--color-ink-light);
    text-align: right;
}

.col-http[b-32q4jrp5hj] {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--color-ink-light);
    text-align: right;
}

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

/* Responsive adjustments */
@media (max-width: 640px) {
    .detail-title-row[b-32q4jrp5hj] {
        flex-direction: column;
        align-items: flex-start;
    }

    .detail-card[b-32q4jrp5hj] {
        padding: var(--space-sm);
    }
}

@media (max-width: 480px) {
    .detail-card[b-32q4jrp5hj] {
        padding: var(--space-xs);
    }

    /* Checks table: card layout on small phones */
    .checks-table thead[b-32q4jrp5hj] {
        display: none;
    }

    .checks-table tbody tr[b-32q4jrp5hj] {
        display: flex;
        flex-wrap: wrap;
        gap: var(--space-2xs) var(--space-sm);
        padding: var(--space-xs) var(--space-sm);
    }

    .checks-table tbody td[b-32q4jrp5hj] {
        padding: 0;
    }

    .checks-table tbody td[b-32q4jrp5hj]::before {
        content: attr(data-label) ": ";
        font-weight: 600;
        color: var(--color-muted);
    }

    .col-response[b-32q4jrp5hj],
    .col-http[b-32q4jrp5hj] {
        text-align: left;
    }
}
/* _content/StatusTracker/Components/Pages/Home.razor.rz.scp.css */
.dashboard-groups[b-zoedc0fbo9] {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    margin-top: var(--space-md);
}

.dashboard-loading[b-zoedc0fbo9] {
    display: flex;
    justify-content: center;
    padding: var(--space-xl) 0;
}

.dashboard-error[b-zoedc0fbo9] {
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-down);
    border-left-width: 4px;
    background-color: var(--color-surface);
    color: var(--color-down);
    font-size: var(--text-sm);
}
/* _content/StatusTracker/Components/Shared/EndpointGroup.razor.rz.scp.css */
/* Card container */
.endpoint-group[b-5v2465ni30] {
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
}

/* Clickable group header */
.group-header[b-5v2465ni30] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: var(--space-xs) var(--space-sm);
    background-color: var(--color-surface-alt);
    border: none;
    border-bottom: 1px solid var(--color-rule);
    cursor: pointer;
    text-align: left;
    transition: background-color 120ms var(--ease-out-expo);
}

.group-header:hover[b-5v2465ni30] {
    background-color: var(--color-rule-light);
}

/* Group name label */
.group-name[b-5v2465ni30] {
    font-family: var(--font-body);
    font-size: var(--text-sm);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-ink);
}

/* Endpoint count badge — inline, muted, mono */
.group-count[b-5v2465ni30] {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    font-weight: 400;
    color: var(--color-muted);
    margin-left: var(--space-xs);
    letter-spacing: 0;
    text-transform: none;
}

/* Chevron icon — rotates when collapsed */
.group-chevron[b-5v2465ni30] {
    color: var(--color-muted);
    display: flex;
    align-items: center;
    transition: transform 200ms var(--ease-out-expo);
}

.group-chevron--collapsed[b-5v2465ni30] {
    transform: rotate(-90deg);
}

/* Column headers row — reuses .endpoint-row grid, non-interactive */
.group-col-headers[b-5v2465ni30] {
    border-bottom: 1px solid var(--color-rule);
    pointer-events: none;
    cursor: default;
}

.group-col-headers:hover[b-5v2465ni30] {
    background-color: transparent;
}

/* Column header text */
.col-header-label[b-5v2465ni30] {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-muted);
    padding-right: var(--space-xs);
}

@media (max-width: 768px) {
    .group-header[b-5v2465ni30] {
        min-height: 48px;
        padding: var(--space-sm);
    }
}
/* _content/StatusTracker/Components/Shared/EndpointRow.razor.rz.scp.css */
/* Remove link underline and inherit text color */
a.endpoint-row[b-99uc4056ks] {
    text-decoration: none;
    color: inherit;
    display: grid; /* reinforce; the global class sets this but <a> needs it confirmed */
}

/* Name cell: stacked layout */
.endpoint-name-cell[b-99uc4056ks] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    overflow: hidden;
    padding: 0 var(--space-xs);
}

.endpoint-name[b-99uc4056ks] {
    font-family: var(--font-body);
    font-size: var(--text-base);
    font-weight: 600;
    color: var(--color-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.endpoint-url[b-99uc4056ks] {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--color-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Status text */
.endpoint-status[b-99uc4056ks] {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.endpoint-status--up[b-99uc4056ks]       { color: var(--color-up); }
.endpoint-status--down[b-99uc4056ks]     { color: var(--color-down); }
.endpoint-status--degraded[b-99uc4056ks] { color: var(--color-degraded); }
.endpoint-status--unknown[b-99uc4056ks]  { color: var(--color-unknown); }

/* Mobile summary line — compact metrics shown on phones */
.endpoint-summary-mobile[b-99uc4056ks] {
    display: none;
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--color-ink-light);
}

@media (max-width: 768px) {
    .endpoint-summary-mobile[b-99uc4056ks] {
        display: block;
    }
}

/* Metric columns (response time, 24h, 7d) */
.endpoint-metric[b-99uc4056ks] {
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    color: var(--color-ink-light);
    text-align: right;
    padding-right: var(--space-xs);
}
/* _content/StatusTracker/Components/Shared/SystemBanner.razor.rz.scp.css */
.system-banner[b-1my05q77mp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--color-border);
    border-left-width: 4px;
    background-color: var(--color-surface);
    font-family: var(--font-body);
    gap: var(--space-sm);
    margin-bottom: var(--space-md);
}

.system-banner__body[b-1my05q77mp] {
    display: flex;
    align-items: center;
    gap: var(--space-xs);
}

.system-banner__icon[b-1my05q77mp] {
    font-size: var(--text-lg);
    line-height: 1;
    flex-shrink: 0;
}

.system-banner__message[b-1my05q77mp] {
    font-size: var(--text-base);
    font-weight: 600;
    color: var(--color-ink);
}

.system-banner__meta[b-1my05q77mp] {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--color-muted);
    white-space: nowrap;
}

/* Status variants — border-left color */
.system-banner--operational[b-1my05q77mp] {
    border-left-color: var(--color-up);
}

.system-banner--degraded[b-1my05q77mp] {
    border-left-color: var(--color-degraded);
}

.system-banner--disruption[b-1my05q77mp] {
    border-left-color: var(--color-down);
}

@media (max-width: 600px) {
    .system-banner[b-1my05q77mp] {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-2xs);
    }
}
/* _content/StatusTracker/Components/Shared/UptimeBar.razor.rz.scp.css */
/* Mini variant — overrides the global .uptime-bar defaults (36px / 2px gap) */
.uptime-bar--mini[b-0x3vx43owt] {
    height: 24px;
    gap: 1px;
}
/* _content/StatusTracker/Components/Shared/UptimeBarDetail.razor.rz.scp.css */
/* Uptime percentage header */
.uptime-detail-header[b-ni3fn4wjwi] {
    display: flex;
    align-items: baseline;
    gap: var(--space-xs);
    margin-bottom: var(--space-xs);
}

.uptime-percentage[b-ni3fn4wjwi] {
    font-family: var(--font-mono);
    font-size: var(--text-xl);
    font-weight: 700;
    line-height: 1;
}

.uptime-percentage--up[b-ni3fn4wjwi]      { color: var(--color-up); }
.uptime-percentage--degraded[b-ni3fn4wjwi] { color: var(--color-degraded); }
.uptime-percentage--down[b-ni3fn4wjwi]    { color: var(--color-down); }

.uptime-label[b-ni3fn4wjwi] {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--color-muted);
}

/* Tooltip on each segment via CSS ::after — no JS needed */
.uptime-segment[b-ni3fn4wjwi] {
    position: relative;
    height: 36px;
}

.uptime-segment:hover[b-ni3fn4wjwi]::after {
    content: attr(data-date);
    position: absolute;
    bottom: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%);
    background-color: var(--color-ink);
    color: var(--color-surface);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    white-space: nowrap;
    padding: 3px 7px;
    border-radius: var(--radius-sm);
    pointer-events: none;
    z-index: 10;
    /* Fade in */
    animation: tooltip-in-b-ni3fn4wjwi 120ms var(--ease-out-expo) both;
}

@keyframes tooltip-in-b-ni3fn4wjwi {
    from { opacity: 0; transform: translateX(-50%) translateY(4px); }
    to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .uptime-segment:hover[b-ni3fn4wjwi]::after {
        animation: none;
    }
}

/* Touch devices: disable hover tooltips */
@media (max-width: 768px) {
    .uptime-segment:hover[b-ni3fn4wjwi]::after {
        display: none;
    }
}

@media (max-width: 480px) {
    .uptime-bar[b-ni3fn4wjwi] {
        overflow: hidden;
        border-radius: var(--radius-sm);
    }
}

/* Legend */
.uptime-legend[b-ni3fn4wjwi] {
    display: flex;
    justify-content: space-between;
    margin-top: var(--space-xs);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--color-muted);
}