html, body {
    height: 100%;
    margin: 0;
}

:root {
    --brand-gradient: linear-gradient(100deg, #8F48E9 0%, #EF60E5 55%, #F6A7F1 100%);

    /* Client Alerts job statuses — the single source of their colors (paired with labels and
       icons in JobStatuses.cs). Semantic, so exempt from the brand palette (brand/brand.md).
       Fill = marks/borders/icons, bg = tag background, ink = text. */
    --status-failed: #D9636E;
    --status-failed-bg: #FBE9EA;
    --status-failed-ink: #A12A2A;
    --status-late: #E0A53A;
    --status-late-bg: #FEF4DC;
    --status-late-ink: #8A5A00;
    --status-stuck: #5B8DEF;
    --status-stuck-bg: #E8EFFC;
    --status-stuck-ink: #1F4FA8;
    --status-recovered: #3FA34D;
    --status-recovered-bg: #E7F6E7;
    --status-recovered-ink: #0A6E0A;
}

/* App-wide chrome, matching the "601 Analytics Production Theme" used by the org's other
   internal dashboards (brand/brand.md > UI chrome). */
.brand-appbar {
    position: relative;
    overflow: hidden;
}

.brand-appbar::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--brand-gradient);
    z-index: 1;
}

.brand-appbar::after {
    content: "";
    position: absolute;
    inset: auto -8% -85px auto;
    width: 300px;
    height: 150px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(239, 96, 229, .32), rgba(143, 72, 233, 0) 70%);
    pointer-events: none;
}

#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;
}

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

/* Roadmap drag: the floating "+2 weeks" tip lives on <body> (created by Roadmap.razor.js), so it
   can't use the page's scoped CSS. */
.rm-drag-tip {
    position: fixed;
    z-index: 2000;
    padding: 4px 9px;
    border-radius: 7px;
    background: #15151B;
    color: #fff;
    font: 700 11.5px/1.3 Roboto, sans-serif;
    pointer-events: none;
    box-shadow: 0 4px 14px rgba(21, 21, 27, .25);
}

body.rm-dragging,
body.rm-dragging * {
    cursor: grabbing !important;
    user-select: none !important;
}

/* Daily Plan / Product Support Plan filter dropdowns. MudSelect sizes its popover to the
   (fixed-width) field, which wraps longer names onto two lines; let it grow wider instead.
   Global, not scoped: the popover renders in MudPopoverProvider, outside the page. */
.plan-filter-popover {
    min-width: 260px !important;
}

.plan-filter-popover .mud-list-item-text {
    white-space: nowrap;
}

/* Sidebar: guide / data-dictionary entries whose page doesn't exist yet (NavCatalog without Href). */
.nav-soon-label {
    white-space: normal;
}

.nav-soon {
    margin-left: 8px;
    padding: 1px 6px;
    border-radius: 99px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    background: #F3ECFD;
    color: #8F48E9;
}

/* Long labels such as "Databricks / Azure Kubernetes" wrap instead of being clipped. */
.mud-drawer .mud-nav-link-text {
    white-space: normal;
}

/* Weekly Client Update's "Download PDF" prints the page (landscape letter): only its sheet goes on paper, so the
   app chrome is hidden and the content loses the room kept for the app bar and drawer. */
@page weekly-update {
    size: letter landscape;
    margin: 10mm;
}

@media print {
    /* On body, not the sheet: switching page type mid-document would force a page break. */
    body:has(.wu-page) {
        page: weekly-update;
    }

    body:has(.wu-page) .mud-appbar,
    body:has(.wu-page) .mud-drawer,
    body:has(.wu-page) .mud-overlay,
    body:has(.wu-page) #blazor-error-ui {
        display: none !important;
    }

    body:has(.wu-page),
    body:has(.wu-page) .mud-layout {
        background: #fff !important;
    }

    body:has(.wu-page) .mud-main-content {
        margin: 0 !important;
        padding: 0 !important;
    }
}