/* _content/SupportAppAMR/Components/Analytics/MowSettings/MowSettingsActionHero.razor.rz.scp.css */
.mow-hero-header[b-kaxqvb8aud] {
    background: var(--rcm-black);
    padding: 12px 24px;
}

[b-kaxqvb8aud] .mow-hero-header-text {
    color: var(--rcm-white) !important;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.mow-hero-body[b-kaxqvb8aud] {
    padding: 20px 24px;
}

[b-kaxqvb8aud] .mow-hero-label {
    color: var(--rcm-dark-gray) !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

[b-kaxqvb8aud] .mow-hero-paper {
    border-radius: 0;
    overflow: hidden;
    border: 1px solid var(--rcm-light-gray);
}

[b-kaxqvb8aud] .mow-text-black { color: var(--rcm-black); }
[b-kaxqvb8aud] .mow-hero-sub { color: var(--rcm-dark-gray); }

[b-kaxqvb8aud] .mow-hero-chip {
    width: max-content;
    border-color: var(--chip-accent);
    color: var(--chip-accent);
}

@media (max-width: 600px) {
    .mow-hero-body[b-kaxqvb8aud] {
        padding: 16px;
    }
}
/* _content/SupportAppAMR/Components/Analytics/MowSettings/MowSettingsComparison.razor.rz.scp.css */
.mow-comparison-section[b-a27xwh94fb] { margin-top: 24px; }

.mow-section-header[b-a27xwh94fb] {
    background: var(--rcm-black);
    padding: 10px 20px;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
}

[b-a27xwh94fb] .mow-section-header-text {
    color: var(--rcm-white) !important;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.mow-cmp-controls[b-a27xwh94fb] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

[b-a27xwh94fb] .mow-cmp-select {
    min-width: 160px;
    background: var(--rcm-white);
    border-radius: 0;
}
[b-a27xwh94fb] .mow-cmp-select-wide { min-width: 180px; }

[b-a27xwh94fb] .mow-cmp-sessioncount { color: var(--rcm-medium-gray); }

[b-a27xwh94fb] .mow-cmp-paper {
    border-radius: 0;
    border: 1px solid var(--rcm-light-gray);
    border-top: none;
    padding: 0;
}

.mow-cmp-subhdr[b-a27xwh94fb] {
    padding: 14px 20px 6px 20px;
    border-bottom: 1px solid var(--rcm-light-gray);
}
.mow-cmp-subhdr-divided[b-a27xwh94fb] { border-top: 2px solid var(--rcm-light-gray); }

[b-a27xwh94fb] .mow-cmp-subhdr-text {
    color: var(--rcm-dark-gray);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 700;
}

.mow-cmp-heatwrap[b-a27xwh94fb] { padding: 12px 20px 16px 20px; overflow-x: auto; }
[b-a27xwh94fb] .mow-cmp-heattable { margin: 0; }

.mow-cmp-th[b-a27xwh94fb] { background: var(--rcm-surface-gray); }
.mow-cmp-th-center[b-a27xwh94fb] { text-align: center; }
.mow-cmp-td-speed[b-a27xwh94fb] { font-weight: 700; }
.mow-cmp-heatcount[b-a27xwh94fb] { font-size: calc(0.7rem + 1px); opacity: 0.68; }

@media (max-width: 600px) {
    .mow-section-header[b-a27xwh94fb] { padding: 8px 16px; }
}
/* _content/SupportAppAMR/Components/Analytics/MowSettings/MowSettingsDeepDive.razor.rz.scp.css */
[b-5gygm64sas] .mud-tabs-toolbar {
    min-height: 48px;
}

[b-5gygm64sas] .mud-tab {
    min-width: 120px;
    padding: 12px 20px;
    font-size: calc(0.875rem + 1px);
    font-weight: 600;
    letter-spacing: 0.02em;
}

.mow-deepdive-section[b-5gygm64sas] { margin-top: 24px; }
[b-5gygm64sas] .mow-icon-mid { vertical-align: middle; }
[b-5gygm64sas] .mow-deepdive-paper { border-radius: 0; overflow: hidden; }

.mow-bool-row[b-5gygm64sas] {
    display: flex;
    align-items: center;
    gap: 0;
    padding: 12px 0;
    border-bottom: 1px solid var(--rcm-surface-gray);
}
.mow-bool-name[b-5gygm64sas] { width: 160px; flex-shrink: 0; font-weight: 700; color: var(--rcm-black); font-size: calc(0.9rem + 1px); }
.mow-bool-body[b-5gygm64sas] { flex: 1; min-width: 0; }
.mow-bool-bar-row[b-5gygm64sas] { display: flex; align-items: center; gap: 8px; }
.mow-bool-bar-row-mb[b-5gygm64sas] { margin-bottom: 4px; }
.mow-bool-onoff[b-5gygm64sas] { width: 30px; font-size: calc(0.8rem + 1px); color: var(--rcm-dark-gray); }
.mow-bool-track[b-5gygm64sas] { flex: 1; background: var(--rcm-surface-gray); border-radius: 0; height: 16px; overflow: hidden; }
.mow-bool-fill[b-5gygm64sas] { width: var(--w); height: 100%; background: var(--fill); border-radius: 0; }
.mow-bool-val[b-5gygm64sas] { font-size: calc(0.8rem + 1px); width: 80px; }
.mow-bool-eff[b-5gygm64sas] { font-size: calc(0.8rem + 1px); width: 50px; }
.mow-bool-count[b-5gygm64sas] { font-size: calc(0.75rem + 1px); color: var(--rcm-medium-gray); }
.mow-bool-verdict[b-5gygm64sas] { margin-top: 6px; }

.mow-eff-win[b-5gygm64sas] { color: var(--rcm-good); }
.mow-eff-lose[b-5gygm64sas] { color: var(--rcm-medium-gray); }

[b-5gygm64sas] .mow-bool-verdict-chip { border-color: var(--verdict); color: var(--verdict); }
[b-5gygm64sas] .mow-grid-cell-sm { font-size: calc(0.85rem + 1px); }
/* _content/SupportAppAMR/Components/Analytics/MowSettings/MowSettingsInsights.razor.rz.scp.css */
.mow-insights-section[b-refw07t6vf] { margin-top: 24px; }

.mow-section-header[b-refw07t6vf] {
    background: var(--rcm-black);
    padding: 10px 20px;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
}

[b-refw07t6vf] .mow-section-header-text {
    color: var(--rcm-white) !important;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

[b-refw07t6vf] .mow-showall-btn {
    color: var(--rcm-white) !important;
    text-transform: none;
}

[b-refw07t6vf] .mow-insights-paper {
    border-radius: 0;
    border: 1px solid var(--rcm-light-gray);
    border-top: none;
}

.mow-insights-grouphdr[b-refw07t6vf] {
    padding: 16px 20px 8px 20px;
    border-bottom: 1px solid var(--rcm-light-gray);
}

[b-refw07t6vf] .mow-grouphdr-text {
    color: var(--rcm-dark-gray);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 700;
}

.mow-insight-row[b-refw07t6vf] {
    display: flex;
    border-bottom: 1px solid var(--rcm-surface-gray);
    padding: 12px 20px 12px 0;
    cursor: pointer;
    transition: background-color 0.15s;
}

.mow-insight-row:hover[b-refw07t6vf] {
    background-color: rgba(0, 0, 0, 0.02);
}

.mow-insight-accent[b-refw07t6vf] {
    width: 4px;
    flex-shrink: 0;
    border-radius: 0;
    margin: 0 16px 0 20px;
    background: var(--accent);
}

.mow-insight-main[b-refw07t6vf] { flex: 1; min-width: 0; }
.mow-insight-toprow[b-refw07t6vf] { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.mow-insight-titlewrap[b-refw07t6vf] { flex: 1; min-width: 0; cursor: pointer; }
.mow-insight-desc-wrap[b-refw07t6vf] { cursor: pointer; }

[b-refw07t6vf] .mow-text-black { color: var(--rcm-black); }
[b-refw07t6vf] .mow-insight-actions { flex-shrink: 0; }
[b-refw07t6vf] .mow-insight-drill { color: var(--rcm-red); }
[b-refw07t6vf] .mow-insight-chip { flex-shrink: 0; border-color: var(--accent); color: var(--accent); }
[b-refw07t6vf] .mow-insight-desc { color: var(--rcm-dark-gray); margin-top: 2px; }
[b-refw07t6vf] .mow-insight-evidence { color: var(--rcm-medium-gray); margin-top: 4px; }

@media (max-width: 600px) {
    .mow-section-header[b-refw07t6vf] { padding: 8px 16px; }
    .mow-insight-row[b-refw07t6vf] { padding: 10px 12px 10px 0; }
    .mow-insight-accent[b-refw07t6vf] { margin: 0 10px 0 12px; }
}
/* _content/SupportAppAMR/Components/Analytics/Sessions/SessionEventDrawer.razor.rz.scp.css */

[b-vnzlnuswi8] .sed-lh-11 { line-height: 1.1; }
[b-vnzlnuswi8] .sed-lh-12 { line-height: 1.2; }

.analytics-events-drawer[b-vnzlnuswi8] {
    display: flex;
    height: 100%;
}

.analytics-events-drawer-rail[b-vnzlnuswi8] {
    display: flex;
    align-items: center;
    border-right: 1px solid rgba(0, 0, 0, .08);
    background: rgba(0, 0, 0, .02);
}

.analytics-events-drawer-body[b-vnzlnuswi8] {
    flex: 1;
    overflow-y: auto;
}

.analytics-events-drawer-body[b-vnzlnuswi8]  .mud-drawer-header {
    min-height: 0;
    padding: 12px 16px;
}

.analytics-events-drawer[b-vnzlnuswi8]  .analytics-bordered {
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 0;
}

.analytics-events-drawer[b-vnzlnuswi8]  .analytics-eff-bar {
    width: 80px;
    height: 8px;
    border-radius: 0;
}

.analytics-events-drawer[b-vnzlnuswi8]  .analytics-map-shell {
    border-radius: 0;
    overflow: hidden;
}

.analytics-events-drawer[b-vnzlnuswi8]  .analytics-events-map {
    height: 560px;
    width: 100%;
}

.analytics-events-drawer[b-vnzlnuswi8]  .analytics-muted {
    opacity: .6;
}

.analytics-events-drawer[b-vnzlnuswi8]  .timeline-row-selected > td {
    background: rgba(var(--cc-red-rgb), .06);
}

.analytics-events-drawer[b-vnzlnuswi8]  .timeline-row-selected > td:first-child {
    box-shadow: inset 4px 0 0 0 var(--rcm-red);
}
/* _content/SupportAppAMR/Components/Analytics/Shared/AnalyticsLoadingSkeleton.razor.rz.scp.css */
.analytics-skeleton[b-gza1l1krvz] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-top: 8px;
}

.analytics-skeleton-kpis[b-gza1l1krvz] {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.analytics-skeleton-kpi[b-gza1l1krvz] {
    flex: 1 1 160px;
}
/* _content/SupportAppAMR/Components/Layout/MainLayout.razor.rz.scp.css */

.layout-signedout[b-6h6joe3axf] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: var(--cc-bg);
}

.layout-signedout-header[b-6h6joe3axf] {
    position: relative;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--cc-sp-6);
    height: var(--cc-header-h);
    padding: 0 var(--cc-sp-8);
    background: var(--cc-header-bg);
}

.layout-signedout-header[b-6h6joe3axf]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--cc-red);
}

.layout-signedout-login[b-6h6joe3axf] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: var(--cc-sp-4);
    height: 38px;
    padding: 0 var(--cc-sp-7);
    border-radius: var(--cc-radius-md);
    background: var(--cc-red);
    color: var(--cc-white);
    font-family: var(--cc-font-heading);
    font-size: var(--cc-fs-sm);
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color 0.15s ease;
}

.layout-signedout-login:hover[b-6h6joe3axf] {
    background: var(--cc-red-hover);
    color: var(--cc-white);
}

.layout-signedout-login:focus-visible[b-6h6joe3axf] {
    outline: 2px solid var(--cc-white);
    outline-offset: 2px;
}

.layout-signedout-main[b-6h6joe3axf] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: var(--cc-sp-7) var(--cc-sp-8);
}

@media (max-width: 599.98px) {
    .layout-signedout-main[b-6h6joe3axf] {
        padding: var(--cc-sp-6);
    }
}

@media (max-width: 599.98px) {
    .layout-signedout-header[b-6h6joe3axf] {
        gap: var(--cc-sp-5);
        padding: 0 var(--cc-sp-6);
    }

    .layout-signedout-divider[b-6h6joe3axf],
    .layout-signedout-title[b-6h6joe3axf] {
        display: none;
    }
}

#blazor-error-ui[b-6h6joe3axf] {
    background: var(--cc-warning-tint);
    color: var(--cc-warning-text);
    border-top: 1px solid var(--cc-warning);
    bottom: 0;
    display: none;
    left: 0;
    padding: var(--cc-sp-5) var(--cc-sp-8);
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .reload[b-6h6joe3axf] {
    color: var(--cc-warning-text);
    font-weight: 700;
}

#blazor-error-ui .dismiss[b-6h6joe3axf] {
    cursor: pointer;
    position: absolute;
    right: var(--cc-sp-6);
    top: var(--cc-sp-5);
}
/* _content/SupportAppAMR/Components/Layout/NavMenu.razor.rz.scp.css */
/* ===== Nav Menu Wrapper ===== */
.nav-menu-wrapper[b-wozod69l02] {
    padding: 0;
}

/* ===== User Profile Section ===== */
.sidebar-user-section[b-wozod69l02] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 16px 12px;
    border-bottom: 1px solid #EBEBEB;
    margin-bottom: 4px;
}

.sidebar-user-avatar[b-wozod69l02] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #B3B3B3;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 12px;
    flex-shrink: 0;
}

.sidebar-user-avatar.role-superadmin[b-wozod69l02] {
    background: var(--cc-red);
}

.sidebar-user-avatar.role-cs[b-wozod69l02] {
    background: #3b82f6;
}

.sidebar-user-avatar.role-sales[b-wozod69l02] {
    background: #22c55e;
}

.sidebar-user-avatar.role-dealer[b-wozod69l02] {
    background: #f59e0b;
}

.sidebar-user-info[b-wozod69l02] {
    flex: 1;
    min-width: 0;
}

.sidebar-user-name[b-wozod69l02] {
    font-weight: 600;
    font-size: 14px;
    color: #000;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sidebar-user-role[b-wozod69l02] {
    font-size: 12px;
    color: #B3B3B3;
    font-weight: 500;
}

/* ===== Section Labels ===== */
.nav-section-label[b-wozod69l02] {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #4D4D4D;
    padding: 12px 16px 4px;
}

/* ===== Section Dividers ===== */
.nav-section-divider[b-wozod69l02] {
    height: 1px;
    background: #EBEBEB;
    margin: 4px 0;
}
/* _content/SupportAppAMR/Components/Layout/OuterLayout.razor.rz.scp.css */

.auth-shell[b-rlh5xs47sz] {
    display: flex;
    flex-direction: column;
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
    background: var(--cc-black);
}

.auth-header[b-rlh5xs47sz] {
    position: relative;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 16px;
    height: 78px;
    padding: 0 var(--cc-sp-8);
    background: var(--cc-black);
}

.auth-header[b-rlh5xs47sz]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--cc-red);
}

.auth-header-logo[b-rlh5xs47sz] {
    display: inline-flex;
    align-items: center;
}

.auth-header-logo img[b-rlh5xs47sz] {
    height: 48px;
    width: auto;
    display: block;
}

.auth-header-divider[b-rlh5xs47sz] {
    width: 1px;
    height: 28px;
    background: rgba(255, 255, 255, 0.18);
    flex-shrink: 0;
    margin: 0 10px;
}

.auth-header-label[b-rlh5xs47sz] {
    white-space: nowrap;
    pointer-events: none;
    font-family: var(--cc-font-display);
    font-size: 14.5px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--cc-white);
    white-space: nowrap;
    pointer-events: none;
}

.auth-header[b-rlh5xs47sz]  .auth-header-back-button {
    color: var(--cc-white);
    margin-left: auto;
}

.auth-main[b-rlh5xs47sz] {
    flex: 1;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    background:
        url('Images/Login_Background_Pattern.png') center / cover no-repeat,
        var(--cc-bg);
}

.auth-footer[b-rlh5xs47sz] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 60px;
    padding: 0 var(--cc-sp-8);
    background: var(--cc-light-gray);
    border-top: 1px solid var(--cc-gray-300);
    font-size: var(--cc-fs-sm);
    color: var(--cc-dark-gray);
}

/* One row while there is room; wraps between groups, never through the support pair. */
.auth-footer-line[b-rlh5xs47sz] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: var(--cc-sp-2) var(--cc-sp-4);
    text-align: center;
}

.auth-footer-line a[b-rlh5xs47sz] {
    color: var(--cc-dark-gray);
    text-decoration: none;
    font-weight: 600;
}

.auth-footer-line a:hover[b-rlh5xs47sz] {
    color: var(--cc-red);
}

.auth-footer-sep[b-rlh5xs47sz] {
    color: var(--cc-medium-gray);
}

/* Set by Scripts/rowSeparators.js when the line wraps and leaves this separator
   at a row's start or end. visibility (not display) so the row doesn't re-flow. */
.auth-footer-sep.is-row-edge[b-rlh5xs47sz] {
    visibility: hidden;
}

/* Phone + email travel together as a single flex item, so the line above breaks
   around them. They only split apart if the viewport is narrower than the pair. */
.auth-footer-support[b-rlh5xs47sz] {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: var(--cc-sp-2) var(--cc-sp-3);
}

/* Title switches from centered (wide) to right-pinned at 800px. */
@media (max-width: 800px) {
    .auth-header-label[b-rlh5xs47sz] {
        left: auto;
        right: var(--cc-sp-8);
        transform: translateY(-50%);
    }
}

@media (max-width: 599.98px) {
    .auth-header[b-rlh5xs47sz] {
        height: 64px;
        padding-left: var(--cc-sp-6);
        padding-right: var(--cc-sp-6);
    }

    .auth-header-logo img[b-rlh5xs47sz] {
        height: clamp(30px, 5.5vw, 48px);
    }

    .auth-header-label[b-rlh5xs47sz] {
        right: var(--cc-sp-6);
        letter-spacing: 0.12em;
        font-size: var(--cc-fs-sm);
    }

    .auth-footer[b-rlh5xs47sz] {
        height: auto;
        padding: var(--cc-sp-5) var(--cc-sp-6);
        font-size: var(--cc-fs-xs);
    }

    .auth-footer-line[b-rlh5xs47sz] {
        gap: var(--cc-sp-3) var(--cc-sp-4);
    }
}

/* Very narrow phones (e.g. 360px) — nudge the label down a step so it
   clears the logo. iPhone SE (375px) and up keep the full-size label. */
@media (max-width: 360px) {
    .auth-header-label[b-rlh5xs47sz] {
        font-size: var(--cc-fs-xs);
    }
}
/* _content/SupportAppAMR/Components/Pages/AccessDenied.razor.rz.scp.css */
/* Access Denied sits on the shared .cc-accept-* card (cc-components.css); the
   only page-specific rule is the dot between the two support contacts — same
   treatment as OuterLayout's footer separator. */
.cc-accept-support-sep[b-cw64z7mgtr] {
    margin: 0 var(--cc-sp-3);
    color: var(--cc-gray-400);
}
/* _content/SupportAppAMR/Components/Pages/Admin/Branches.razor.rz.scp.css */
/* ===== Branches page — scoped styles ===== */

/* Actions column width — must pierce MudTh via ::deep */
[b-7kp4uy0xf2] .mud-th-actions {
    width: 100px;
}
/* _content/SupportAppAMR/Components/Pages/Admin/BranchForm.razor.rz.scp.css */
/* ===== BranchForm — scoped styles ===== */

/* Row inside MudSelectItem for company picker:
   flex layout with space-between + gap to show the Dealer kind tag. */
.select-item-row[b-fswyx9vgpa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cc-sp-4); /* 8px */
    width: 100%;
}
/* _content/SupportAppAMR/Components/Pages/Admin/Companies.razor.rz.scp.css */
/* ===== Companies page — scoped styles ===== */

/* Actions column width — must pierce MudTh via ::deep */
[b-5b52xmc7zm] .mud-th-actions {
    width: 100px;
}
/* _content/SupportAppAMR/Components/Pages/Admin/CompanyForm.razor.rz.scp.css */
/* ===== CompanyForm — scoped styles ===== */

/* Extra top gap before the Address eyebrow divider. */
.eyebrow-address[b-uecfcgy9ca] {
    margin-top: var(--cc-sp-2); /* 4px */
}

[b-uecfcgy9ca] .mud-tf-state {
    max-width: 140px;
}

[b-uecfcgy9ca] .mud-tf-zip {
    max-width: 120px;
}

[b-uecfcgy9ca] .mud-cs-country {
    max-width: 220px;
}
/* _content/SupportAppAMR/Components/Pages/Admin/Dealers.razor.rz.scp.css */
/* Actions column width — Class lands on the MudTh root */
.dlr-table[b-hrwihdmb01]  .dlr-actions-col {
    width: 100px;
}

.dlr-inline[b-hrwihdmb01] {
    display: inline-block;
}
/* _content/SupportAppAMR/Components/Pages/Admin/InviteUserForm.razor.rz.scp.css */
/* Row inside company MudSelectItem — name + dealer tag side-by-side */
.cc-select-company-row[b-7p70zfk18s] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cc-sp-4);
    width: 100%;
}
/* _content/SupportAppAMR/Components/Pages/Admin/Machines.razor.rz.scp.css */
/* Actions column width — Class lands on the MudTh root */
.mch-table[b-we4ioap57g]  .mch-actions-col {
    width: 130px;
}

/* Last-online relative timestamp cell */
.mch-last-online[b-we4ioap57g] {
    font-size: 13.5px;
}
/* _content/SupportAppAMR/Components/Pages/Admin/Machines/MachineCurrentLocation.razor.rz.scp.css */
/* "Currently at" location card */
.mcl-card[b-zdsn4l9qw8] {
    margin-top: var(--cc-sp-2);
    padding: var(--cc-sp-5) var(--cc-sp-6);
    border: 1px solid var(--cc-light-gray);
    border-radius: var(--cc-radius-md);
    background: var(--cc-bg);
}

.mcl-line[b-zdsn4l9qw8] {
    font-size: var(--cc-fs-sm);
    color: var(--cc-medium-gray);
    margin-top: 2px;
}

.mcl-label[b-zdsn4l9qw8] {
    color: var(--cc-dark-gray);
    font-weight: 600;
}
/* _content/SupportAppAMR/Components/Pages/Admin/MachineTransferForm.razor.rz.scp.css */
/* ===== MachineTransferForm — scoped styles ===== */

.select-item-row[b-n1z1lcanjx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cc-sp-4); /* 8px */
    width: 100%;
}
/* _content/SupportAppAMR/Components/Pages/Admin/MyDealer.razor.rz.scp.css */
/* ===== MyDealer page — scoped styles ===== */

[b-wk7em1g7j3] .mud-paper-radius-lg {
    border-radius: var(--cc-radius-lg) !important;
}
/* _content/SupportAppAMR/Components/Pages/Admin/Roles.razor.rz.scp.css */
/* Actions column width — ::deep needed because MudTh is a Mud component */
[b-qt4cr10rpf] .roles-col-actions {
    width: 100px;
}
/* _content/SupportAppAMR/Components/Pages/Admin/Roles/PermissionGrantGrid.razor.rz.scp.css */
/* Constrain the permission search field width via ::deep (MudTextField root) */
[b-52pscyzjso] .perm-search-field {
    max-width: 200px;
}
/* _content/SupportAppAMR/Components/Pages/Admin/Users.razor.rz.scp.css */
/* Actions column width — applied via ::deep because MudTh is a Mud component */
[b-mratpnjlax] .users-col-actions {
    width: 130px;
}

/* Phone column floor. The number itself is kept on one line by
   Components/Shared/CopyText.razor.css, which is what actually stops the
   three-line wrap; this only keeps the column from collapsing to the width of
   the word "PHONE" on a page where every user happens to have no number, so the
   columns don't shift around as you page through. Sized for the widest value the
   formatter emits — "(920) 559-1223" plus the copy button. */
[b-mratpnjlax] .users-col-phone {
    min-width: 168px;
}

/* Company name cell: bold black text */
.cc-company-name[b-mratpnjlax] {
    font-weight: 600;
    color: var(--cc-black);
}
/* _content/SupportAppAMR/Components/Pages/Admin/Users/InviteUserResult.razor.rz.scp.css */
/* MudPaper wrapping the accept-invite link */
[b-wpbhirccjt] .invite-link-paper {
    word-break: break-all;
    border-radius: var(--cc-radius-md);
}

/* Uppercase label above the link */
[b-wpbhirccjt] .invite-link-label {
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 700;
}

[b-wpbhirccjt] .invite-link-url {
    margin-top: var(--cc-sp-2);
}
/* _content/SupportAppAMR/Components/Pages/Admin/Users/RolePillSelector.razor.rz.scp.css */
.cc-role-eyebrow[b-rpmvjk0hix] {
    margin-bottom: var(--cc-sp-4);
}
/* _content/SupportAppAMR/Components/Pages/AllEvents.razor.rz.scp.css */
.ae-page[b-52qrcsyq20] {
    display: flex;
    flex-direction: column;

    /* Page-local scale for the few values the --cc-* scales don't cover:
       the shared map/panel height (must match between the two columns) and
       the sub-12px uppercase label sizes. */
    --ae-panel-h: 650px;
    --ae-fs-micro: 10px;      /* metric tile labels */
    --ae-fs-mini: 11px;       /* section labels + table head */
    --ae-dot: 8px;            /* status / mow-type dot */
    --ae-dot-legend: 9px;     /* legend chip dot */
}

.ae-title[b-52qrcsyq20] {
    font-size: calc(1.5rem + 1px);
    line-height: 1.2;
    margin: 0;
}

/* ---------------- Filters (MudSelect) ----------------
   Class= lands on the MudSelect root (a child component), so reach it with
   ::deep and size it like the old native selects. */
.ae-filters[b-52qrcsyq20] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: var(--cc-sp-4);
    margin-bottom: var(--cc-sp-5);
}

.ae-filters[b-52qrcsyq20]  .ae-select-mud {
    flex: 1 1 220px;
    min-width: 200px;
}

.allevents-spinner-wrap[b-52qrcsyq20] {
    min-height: 100px;
    margin: var(--cc-sp-6) 0;
}

/* ---------------- Path legend / filter toggles ---------------- */
.ae-legend[b-52qrcsyq20] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--cc-sp-2);
    margin-bottom: var(--cc-sp-2);
}

.ae-legend-btn[b-52qrcsyq20] {
    display: inline-flex;
    align-items: center;
    gap: var(--cc-sp-3);
    padding: var(--cc-sp-1) var(--cc-sp-5);
    border: 1px solid transparent;
    border-radius: var(--cc-radius-lg);
    background: var(--cc-medium-gray);
    color: var(--cc-white);
    font-family: var(--cc-font-medium);
    font-size: var(--cc-fs-xs);
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.15s, background 0.15s;
}

.ae-legend-dot[b-52qrcsyq20] {
    width: var(--ae-dot-legend);
    height: var(--ae-dot-legend);
    border-radius: 50%;
    background: var(--cc-white);
}

/* MudIcon renders its own <svg>, so the scope attribute never lands on it — reach it via ::deep */
.ae-legend-btn[b-52qrcsyq20]  .ae-legend-icon {
    font-size: var(--cc-fs-md);
}

.ae-legend-btn--autonomous[b-52qrcsyq20] { background: var(--cc-path-autonomous); border-color: var(--cc-path-autonomous); }
.ae-legend-btn--manual[b-52qrcsyq20]     { background: var(--cc-path-manual);     border-color: var(--cc-path-manual); }
.ae-legend-btn--driving[b-52qrcsyq20]    { background: var(--cc-path-driving);    border-color: var(--cc-path-driving); }
.ae-legend-btn--events[b-52qrcsyq20]     { background: var(--cc-red);             border-color: var(--cc-red); }

/* Toggled off — desaturate to the neutral gray and dim */
.ae-legend-btn.is-off[b-52qrcsyq20] {
    background: var(--cc-medium-gray);
    border-color: var(--cc-medium-gray);
    opacity: 0.55;
}

/* ---------------- Toolbar: slider + collapse ---------------- */
.ae-toolbar[b-52qrcsyq20] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-2);
    padding: var(--cc-sp-1) var(--cc-sp-2);
    background: var(--cc-bg);
    border: 1px solid var(--cc-border-subtle);
    border-radius: var(--cc-radius-md);
    margin-bottom: var(--cc-sp-2);
}

.ae-toolbar-count[b-52qrcsyq20] {
    font-size: var(--cc-fs-xs);
    color: var(--cc-dark-gray);
    white-space: nowrap;
    min-width: 55px;
}

/* MudSlider — fill the middle of the toolbar and recolor to brand red by
   pointing the local error-palette var at --cc-red (Color="Error"). */
.ae-toolbar[b-52qrcsyq20]  .ae-slider {
    flex: 1;
    min-width: 60px;
    margin: 0;
    --mud-palette-error: var(--cc-red);
}

.ae-toolbar-label[b-52qrcsyq20] {
    font-size: var(--cc-fs-xs);
    color: var(--cc-dark-gray);
    white-space: nowrap;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* MudIconButton collapse toggle — pinned to the right end */
.ae-toolbar[b-52qrcsyq20]  .ae-collapse-btn {
    margin-left: auto;
    color: var(--cc-dark-gray);
}

/* ---------------- Split layout: map + events ---------------- */
.ae-split[b-52qrcsyq20] {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: var(--cc-sp-6);
    padding-bottom: var(--cc-sp-6);
}

.ae-split.is-collapsed[b-52qrcsyq20] {
    grid-template-columns: 1fr;
}

@media (max-width: 960px) {
    .ae-split[b-52qrcsyq20] {
        grid-template-columns: 1fr;
    }
}

.ae-map[b-52qrcsyq20] {
    height: var(--ae-panel-h);
    width: 100%;
    border-radius: var(--cc-radius-md);
}

.ae-events-col[b-52qrcsyq20] {
    display: flex;
    flex-direction: column;
    height: var(--ae-panel-h);
    min-width: 0;
}

/* ---------------- Session summary card (MudPaper) ---------------- */
.ae-events-col[b-52qrcsyq20]  .ae-session-card {
    border: 1px solid var(--cc-light-gray);
    border-radius: var(--cc-radius-lg);
    background: var(--cc-white);
    overflow: hidden;
    margin-bottom: var(--cc-sp-2);
}

.ae-session-head[b-52qrcsyq20] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--cc-sp-3);
    padding: var(--cc-sp-5) var(--cc-sp-6);
    border-bottom: 1px solid var(--cc-border-subtle);
}

.ae-session-head-main[b-52qrcsyq20] { min-width: 0; }

.ae-session-title[b-52qrcsyq20] {
    display: flex;
    gap: var(--cc-sp-3);
    align-items: flex-start;
    font-size: var(--cc-fs-md);
    font-weight: 700;
    line-height: 1.25;
}

.ae-session-title[b-52qrcsyq20]  .ae-session-title-icon {
    color: var(--cc-red);
    font-size: 1em; /*Keeps icon the same height as the text*/
    margin-top: var(--cc-sp-1); /*old Font Awesome rule*/
}

.ae-session-meta[b-52qrcsyq20] {
    display: flex;
    gap: var(--cc-sp-6);
    flex-wrap: wrap;
    margin-top: var(--cc-sp-2);
    font-size: var(--cc-fs-xs);
    color: var(--cc-slate);
}

.ae-session-meta[b-52qrcsyq20]  .ae-session-meta-icon {
    font-size: 1em;
}

.ae-session-meta strong[b-52qrcsyq20] { color: var(--cc-black); font-weight: 600; }

.ae-mowtype-dot[b-52qrcsyq20] {
    display: inline-block;
    width: var(--ae-dot);
    height: var(--ae-dot);
    margin-right: var(--cc-sp-2);
    border-radius: 50%;
    background: var(--dot, var(--cc-gray-400));
}

/* Metric tiles — 1px gap over the border color paints the hairline grid */
.ae-metric-grid[b-52qrcsyq20] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
    gap: 1px;
    background: var(--cc-border-subtle);
}

.ae-metric[b-52qrcsyq20] {
    background: var(--cc-white);
    padding: var(--cc-sp-4) var(--cc-sp-6);
}

.ae-metric-label[b-52qrcsyq20] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-2);
    font-size: var(--ae-fs-micro);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--cc-slate);
}

.ae-metric-label[b-52qrcsyq20]  .ae-metric-label-icon {
    font-size: 1em;
}

.ae-metric-value[b-52qrcsyq20] {
    font-size: var(--cc-fs-xl);
    font-weight: 700;
    line-height: 1.1;
    margin-top: var(--cc-sp-1);
}

.ae-metric-unit[b-52qrcsyq20] {
    font-size: var(--ae-fs-mini);
    font-weight: 600;
    color: var(--cc-slate);
}

.ae-session-foot[b-52qrcsyq20] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-3);
    flex-wrap: wrap;
    padding: var(--cc-sp-4) var(--cc-sp-6);
    border-top: 1px solid var(--cc-border-subtle);
    background: var(--cc-bg);
    font-size: var(--cc-fs-xs);
}

.ae-session-foot[b-52qrcsyq20]  .ae-session-foot-icon {
    font-size: 1.5em;
    
}

.ae-foot-spacer[b-52qrcsyq20] { flex: 1; }

/* ---------------- MudChip pills (mow type + pause/fault) ----------------
   Strip MudChip's default chrome and repaint as the Command Center pills. */
.ae-session-head[b-52qrcsyq20]  .ae-mowtype-chip.mud-chip,
.ae-session-foot[b-52qrcsyq20]  .ae-chip.mud-chip {
    height: auto;
    min-height: 0;
    margin: 0;
    padding: var(--cc-sp-2) var(--cc-sp-5);
    border-radius: 999px;
    font-family: var(--cc-font-medium);
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    white-space: nowrap;
}

.ae-session-head[b-52qrcsyq20]  .ae-mowtype-chip.mud-chip {
    background: var(--cc-bg) !important;
    color: var(--cc-dark-gray) !important;
    border: 1px solid var(--cc-light-gray);
}

.ae-session-foot[b-52qrcsyq20]  .ae-chip--warning.mud-chip {
    background: color-mix(in srgb, var(--cc-warning) 16%, transparent) !important;
    color: var(--cc-warning-text) !important;
}

.ae-session-foot[b-52qrcsyq20]  .ae-chip--critical.mud-chip {
    background: color-mix(in srgb, var(--cc-danger) 14%, transparent) !important;
    color: var(--cc-danger-text) !important;
}

/* ---------------- Events table (MudTable) ---------------- */
.ae-events-label[b-52qrcsyq20] {
    font-size: var(--ae-fs-mini);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--cc-slate);
    font-weight: 600;
    margin-bottom: var(--cc-sp-2);
}

/* MudTable owns the inner scroll (FixedHeader + Height="100%"), so this
   wrapper just gives it a definite, flexible height to fill. */
.ae-events-scroll[b-52qrcsyq20] {
    flex: 1 1 0;
    min-height: 0;
    overflow-y: hidden;
}

.ae-events-scroll[b-52qrcsyq20]  .ae-event-mudtable {
    background: transparent;
    font-size: var(--cc-fs-sm);
    height: 100%;             
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.ae-events-scroll[b-52qrcsyq20]  .ae-event-mudtable .mud-table-container {
    flex: 1 1 0;
    min-height: 0;
    overflow-y: auto;
}

/* Header cells */
.ae-events-scroll[b-52qrcsyq20]  .ae-event-mudtable thead th {
    background: var(--cc-white);
    text-align: left;
    padding: var(--cc-sp-3) var(--cc-sp-4);
    border-bottom: 1px solid var(--cc-light-gray);
    font-family: var(--cc-font-heading);
    font-size: var(--ae-fs-mini);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--cc-medium-gray);
}

.ae-events-scroll[b-52qrcsyq20]  .ae-event-mudtable thead th.ae-col-id { width: 36px; }

/* Body cells */
.ae-events-scroll[b-52qrcsyq20]  .ae-event-mudtable tbody td {
    padding: var(--cc-sp-3) var(--cc-sp-4);
    border-bottom: 1px solid var(--cc-border-subtle);
    vertical-align: top;
}

/* Rows — click-to-select, hover, and slider-active highlight */
.ae-events-scroll[b-52qrcsyq20]  .ae-event-mudtable tbody tr {
    cursor: pointer;
    transition: background 0.1s;
}

.ae-events-scroll[b-52qrcsyq20]  .ae-event-mudtable tbody tr:hover {
    background: var(--cc-hover-surface) !important;
}

.ae-events-scroll[b-52qrcsyq20]  .ae-event-mudtable tbody tr.is-active {
    background: var(--cc-warning-tint) !important;
    font-weight: 600;
}

.ae-dot[b-52qrcsyq20] {
    display: inline-block;
    width: var(--ae-dot);
    height: var(--ae-dot);
    border-radius: 50%;
    margin-right: var(--cc-sp-3);
    vertical-align: middle;
    background: var(--dot, var(--cc-gray-400));
}

/* These two ride on MudTd's Class=, so they land on a <td> rendered by MudTd and
   never carry this component's scope attribute — reach them with ::deep.
   .ae-muted stays unscoped: it's on a span in the RowTemplate, which is ours. */
.ae-events-scroll[b-52qrcsyq20]  .ae-nowrap { white-space: nowrap; }
.ae-events-scroll[b-52qrcsyq20]  .ae-wrap { white-space: normal; word-break: break-word; }
.ae-muted[b-52qrcsyq20] { color: var(--cc-medium-gray); }
/* _content/SupportAppAMR/Components/Pages/AnalyticsDashboard.razor.rz.scp.css */
/* KPI card left-border accents */
[b-96zn8q4tp7] .kpi-card-primary {
    border-left: 4px solid var(--mud-palette-primary);
}

[b-96zn8q4tp7] .kpi-card-error {
    border-left: 4px solid var(--mud-palette-error);
}

[b-96zn8q4tp7] .kpi-card-success {
    border-left: 4px solid var(--mud-palette-success);
}

/* Full-width chart papers */
[b-96zn8q4tp7] .ad-full-width {
    width: 100%;
}
/* _content/SupportAppAMR/Components/Pages/Analytics/CoverageSimulator.razor.rz.scp.css */
[b-ebaqztf4t4] .cs-page {
    height: calc(100vh - 120px);
    min-height: 680px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

[b-ebaqztf4t4] .cs-toolbar {
    border-radius: var(--cs-radius);
    box-shadow: var(--cs-shadow-soft);
    overflow: hidden;
}

[b-ebaqztf4t4] .cs-toolbar-inner {
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

[b-ebaqztf4t4] .cs-title {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 220px;
}

[b-ebaqztf4t4] .cs-title h6 {
    margin: 0;
    font-weight: 700;
    letter-spacing: .2px;
}

[b-ebaqztf4t4] .cs-subtitle {
    font-size: calc(.78rem + 1px);
    opacity: .75;
    margin-top: -2px;
}

[b-ebaqztf4t4] .cs-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

[b-ebaqztf4t4] .cs-body {
    flex: 1;
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 12px;
    min-height: 520px;
}

@media (max-width: 900px) {
    [b-ebaqztf4t4] .cs-body {
        grid-template-columns: 1fr;
    }
    [b-ebaqztf4t4] .cs-left-panel {
        max-height: 250px;
    }
}

[b-ebaqztf4t4] .cs-left-panel {
    border-radius: var(--cs-radius);
    box-shadow: var(--cs-shadow);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--cs-border);
}

[b-ebaqztf4t4] .cs-panel-header {
    background: linear-gradient(135deg, var(--cs-red) 0%, var(--cs-red-dark) 100%);
    color: white;
    padding: 12px 14px;
    font-weight: 700;
    font-size: calc(0.85rem + 1px);
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: sticky;
    top: 0;
    z-index: 5;
}

[b-ebaqztf4t4] .cs-info-panels {
    padding: 6px 8px 0;
}

[b-ebaqztf4t4] .cs-expansion-panel {
    border-radius: 0 !important;
    margin-bottom: 4px !important;
    box-shadow: none !important;
    border: 1px solid rgba(0,0,0,.08);
}

[b-ebaqztf4t4] .cs-expansion-panel .mud-expand-panel-header {
    padding: 6px 12px !important;
    min-height: 36px !important;
    font-size: calc(0.8rem + 1px);
    font-weight: 600;
}

[b-ebaqztf4t4] .cs-expansion-panel .mud-expand-panel-content {
    padding: 4px 12px 10px !important;
}

[b-ebaqztf4t4] .cs-info-field {
    margin-bottom: 6px !important;
}

[b-ebaqztf4t4] .cs-info-field .mud-input-root {
    font-size: calc(0.82rem + 1px);
}

[b-ebaqztf4t4] .cs-cost-summary {
    margin-top: 8px;
    padding: 8px 10px;
    background: rgba(46, 125, 50, .06);
    border-radius: 0;
    font-size: calc(0.8rem + 1px);
}

[b-ebaqztf4t4] .cs-cost-row {
    display: flex;
    justify-content: space-between;
    padding: 3px 0;
}

[b-ebaqztf4t4] .cs-property-list {
    flex: 1;
    overflow-y: auto;
    padding: 8px;
}

[b-ebaqztf4t4] .cs-property-card {
    border-radius: 0;
    padding: 10px 12px;
    margin-bottom: 8px;
    cursor: pointer;
    border: 2px solid transparent;
    transition: all 0.15s ease;
    background: var(--mud-palette-surface);
}

[b-ebaqztf4t4] .cs-property-card:hover {
    border-color: var(--cs-blue);
    box-shadow: 0 2px 8px rgba(66,165,245,.2);
}

[b-ebaqztf4t4] .cs-property-card.selected {
    border-color: var(--rcm-blue-dark);
    background: rgba(25, 118, 210, 0.06);
    box-shadow: 0 2px 12px rgba(21,101,192,.15);
}

[b-ebaqztf4t4] .cs-stat-row {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 6px;
}

[b-ebaqztf4t4] .cs-stat-chip {
    font-size: calc(0.72rem + 1px);
    padding: 2px 8px;
    border-radius: 0;
    background: rgba(0,0,0,.05);
    white-space: nowrap;
    font-weight: 500;
}

[b-ebaqztf4t4] .cs-keepout-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: calc(0.78rem + 1px);
    padding: 3px 0;
    color: var(--rcm-gray-600);
}

[b-ebaqztf4t4] .cs-keepout-item .ko-name {
    display: flex;
    align-items: center;
    gap: 4px;
}

[b-ebaqztf4t4] .cs-keepout-item .ko-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--rcm-negative);
    flex-shrink: 0;
}

[b-ebaqztf4t4] .cs-mapWrap {
    position: relative;
    border-radius: var(--cs-radius);
    overflow: hidden;
    box-shadow: var(--cs-shadow);
    border: 1px solid var(--cs-border);
    background: var(--mud-palette-surface);
    min-height: 440px;
}

[b-ebaqztf4t4] .cs-map {
    width: 100%;
    height: 100%;
}

[b-ebaqztf4t4] .cs-search-wrap {
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    width: 340px;
    max-width: calc(100% - 24px);
}

[b-ebaqztf4t4] .cs-search-wrap input {
    width: 100%;
    padding: 10px 14px 10px 38px;
    border: none;
    border-radius: 0;
    box-shadow: 0 2px 12px rgba(0,0,0,.2);
    font-size: calc(0.9rem + 1px);
    background: white;
    outline: none;
}

[b-ebaqztf4t4] .cs-search-wrap input:focus {
    box-shadow: 0 2px 16px rgba(25,118,210,.35);
}

[b-ebaqztf4t4] .cs-search-icon {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--rcm-gray-400);
    font-size: 0.95rem;
    pointer-events: none;
}

[b-ebaqztf4t4] .cs-draw-hint {
    position: absolute;
    bottom: 14px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    padding: 8px 20px;
    border-radius: 0;
    background: rgba(0,0,0,.75);
    color: white;
    font-size: calc(0.82rem + 1px);
    font-weight: 600;
    pointer-events: none;
    animation: cs-pulse-b-ebaqztf4t4 1.5s ease-in-out infinite;
}

@keyframes cs-pulse-b-ebaqztf4t4 {
    0%, 100% { opacity: 1; }
    50% { opacity: .7; }
}

[b-ebaqztf4t4] .cs-bottom-bar {
    display: flex;
    gap: 20px;
    padding: 12px 20px;
    border-radius: var(--cs-radius);
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(12px);
    box-shadow: var(--cs-shadow);
    border: 1px solid var(--cs-border);
    flex-wrap: wrap;
    justify-content: center;
}

[b-ebaqztf4t4] .cs-bottom-stat {
    text-align: center;
    min-width: 100px;
}

[b-ebaqztf4t4] .cs-bottom-value {
    font-size: calc(1.3rem + 1px);
    font-weight: 700;
    color: var(--cs-red);
}

[b-ebaqztf4t4] .cs-bottom-label {
    font-size: calc(0.72rem + 1px);
    color: var(--rcm-gray-600);
    margin-top: 1px;
}

[b-ebaqztf4t4] .cs-bottom-value-green {
    color: var(--rcm-positive);
}

[b-ebaqztf4t4] .cs-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    text-align: center;
    color: var(--rcm-gray-400);
    gap: 8px;
}

[b-ebaqztf4t4] .cs-btn-red {
    background: linear-gradient(135deg, var(--rcm-red) 0%, var(--rcm-red-dark) 100%) !important;
    color: white !important;
    text-transform: none !important;
    font-weight: 600 !important;
    border-radius: 0 !important;
}

[b-ebaqztf4t4] .cs-btn-red:hover {
    box-shadow: 0 4px 16px rgba(var(--cc-red-rgb), .3) !important;
}

[b-ebaqztf4t4] .cs-name-field .mud-input-root {
    font-size: calc(0.85rem + 1px);
    font-weight: 600;
}

[b-ebaqztf4t4] .cs-drawer-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 16px 20px 14px;
    border-bottom: 2px solid rgba(var(--cc-red-rgb), .12);
    background: linear-gradient(135deg, rgba(var(--cc-red-rgb),.03) 0%, transparent 100%);
}

[b-ebaqztf4t4] .cs-drawer-header-text {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-ebaqztf4t4] .cs-drawer-close {
    margin-top: -4px;
    margin-right: -8px;
    color: var(--rcm-gray-450) !important;
}

[b-ebaqztf4t4] .cs-drawer-close:hover {
    color: var(--rcm-gray-800) !important;
    background: rgba(0,0,0,.06) !important;
}

[b-ebaqztf4t4] .cs-drawer-body {
    padding: 20px;
    overflow-y: auto;
    max-height: calc(100vh - 72px);
}

[b-ebaqztf4t4] .cs-drawer-section {
    margin-bottom: 20px;
    padding: 16px;
    background: rgba(0,0,0,.018);
    border-radius: 0;
    border: 1px solid rgba(0,0,0,.06);
}

[b-ebaqztf4t4] .cs-drawer-section-label {
    font-weight: 700 !important;
    color: #555 !important;
    text-transform: uppercase;
    letter-spacing: .4px;
    font-size: calc(0.7rem + 1px) !important;
    margin-bottom: 12px !important;
    display: block;
}

[b-ebaqztf4t4] .cs-drawer-field {
    margin-bottom: 12px !important;
}

[b-ebaqztf4t4] .cs-drawer-stat-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    background: white;
    border-radius: 0;
    font-size: calc(0.85rem + 1px);
    margin-bottom: 6px;
    border: 1px solid rgba(0,0,0,.05);
}

[b-ebaqztf4t4] .cs-drawer-stat-row:last-child {
    margin-bottom: 0;
}

[b-ebaqztf4t4] .cs-drawer-stat-row strong {
    color: var(--cs-red, var(--rcm-red));
    font-size: calc(0.95rem + 1px);
}

[b-ebaqztf4t4] .cs-cost-computed-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 10px;
    margin: 4px 0;
    background: rgba(0,0,0,.03);
    border-radius: 0;
    font-size: calc(0.8rem + 1px);
}

[b-ebaqztf4t4] .cs-cost-computed-row strong {
    color: var(--cs-red, var(--rcm-red));
}

[b-ebaqztf4t4] .cs-stripe-controls {
    margin-top: 6px;
    padding: 6px 8px;
    background: rgba(76, 175, 80, .06);
    border-radius: 0;
    border: 1px solid rgba(76, 175, 80, .15);
}

[b-ebaqztf4t4] .cs-roi-summary-cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 10px;
}

[b-ebaqztf4t4] .cs-roi-stat-card {
    padding: 14px 10px;
    background: white;
    border-radius: 0;
    text-align: center;
    border: 1px solid rgba(0,0,0,.07);
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
}

[b-ebaqztf4t4] .cs-roi-stat-value {
    font-size: calc(1.15rem + 1px);
    font-weight: 700;
    line-height: 1.3;
}

[b-ebaqztf4t4] .cs-roi-stat-label {
    font-size: calc(0.65rem + 1px);
    color: var(--rcm-gray-450);
    margin-top: 4px;
    text-transform: uppercase;
    letter-spacing: .3px;
}

[b-ebaqztf4t4] .cs-roi-table {
    width: 100%;
    border-collapse: collapse;
    font-size: calc(0.82rem + 1px);
}

[b-ebaqztf4t4] .cs-roi-table th {
    text-align: left;
    padding: 8px 10px;
    border-bottom: 2px solid rgba(0,0,0,.10);
    font-weight: 700;
    font-size: calc(0.72rem + 1px);
    text-transform: uppercase;
    color: var(--rcm-gray-600);
    letter-spacing: .3px;
    background: rgba(0,0,0,.02);
}

[b-ebaqztf4t4] .cs-roi-table td {
    padding: 7px 10px;
    border-bottom: 1px solid rgba(0,0,0,.05);
}

[b-ebaqztf4t4] .cs-roi-table tbody tr:hover {
    background: rgba(0,0,0,.015);
}

[b-ebaqztf4t4] .cs-roi-table td:nth-child(2),
[b-ebaqztf4t4] .cs-roi-table td:nth-child(3),
[b-ebaqztf4t4] .cs-roi-table td:nth-child(4),
[b-ebaqztf4t4] .cs-roi-table th:nth-child(2),
[b-ebaqztf4t4] .cs-roi-table th:nth-child(3),
[b-ebaqztf4t4] .cs-roi-table th:nth-child(4) {
    text-align: right;
}

[b-ebaqztf4t4] .cs-roi-table-total td {
    font-weight: 700;
    border-top: 2px solid rgba(0,0,0,.10);
    padding-top: 10px;
    background: rgba(0,0,0,.02);
}

[b-ebaqztf4t4] .cs-bottom-divider {
    width: 1px;
    align-self: stretch;
    background: rgba(0,0,0,.15);
    margin: 4px 4px;
}

[b-ebaqztf4t4] .cs-roi-story {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 16px 12px;
}

[b-ebaqztf4t4] .cs-roi-story-step {
    text-align: center;
    flex: 1;
    min-width: 0;
}

[b-ebaqztf4t4] .cs-roi-story-arrow {
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

[b-ebaqztf4t4] .cs-roi-story-highlight {
    font-size: calc(1.4rem + 1px);
    font-weight: 700;
    line-height: 1.3;
    margin-top: 4px;
}

[b-ebaqztf4t4] .cs-roi-stat-card-hero {
    padding: 18px 12px;
    background: white;
    border-radius: 0;
    text-align: center;
    border: 2px solid rgba(46, 125, 50, .15);
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
}

[b-ebaqztf4t4] .cs-roi-stat-value-hero {
    font-size: calc(1.6rem + 1px);
    font-weight: 800;
    line-height: 1.2;
}

[b-ebaqztf4t4] .cs-proposal-name-field { max-width: 200px; }
[b-ebaqztf4t4] .cs-proposal-name-field .mud-input-root { font-size: var(--rcm-text-sm); }

[b-ebaqztf4t4] .cs-cost-subhead { font-weight: 700 !important; color: var(--rcm-gray-600) !important; margin-bottom: 4px; }
[b-ebaqztf4t4] .cs-cost-subhead-spaced { font-weight: 700 !important; color: var(--rcm-gray-600) !important; margin: 8px 0 4px; }

[b-ebaqztf4t4] .cs-pos { color: var(--rcm-positive); }
[b-ebaqztf4t4] .cs-pos-strong { color: var(--rcm-positive-dark); }
[b-ebaqztf4t4] .cs-neg { color: var(--rcm-negative); }
[b-ebaqztf4t4] .cs-blue-dark { color: var(--rcm-blue-dark); }

/* Weight utilities (also applied to Mud roots, hence !important) */
[b-ebaqztf4t4] .cs-fw-600 { font-weight: 600 !important; }
[b-ebaqztf4t4] .cs-fw-700 { font-weight: 700 !important; }
[b-ebaqztf4t4] .cs-fw-800 { font-weight: 800 !important; }

[b-ebaqztf4t4] .cs-roi-cta { margin-top: 8px !important; width: 100% !important; text-transform: none !important; font-size: calc(.78rem + 1px) !important; }

[b-ebaqztf4t4] .cs-empty-icon { font-size: 2.5rem !important; opacity: .4; }
[b-ebaqztf4t4] .cs-empty-title { font-size: calc(.85rem + 1px); font-weight: 600; }
[b-ebaqztf4t4] .cs-empty-sub { font-size: calc(.75rem + 1px); }

[b-ebaqztf4t4] .cs-mt-6 { margin-top: 6px; }
[b-ebaqztf4t4] .cs-card-actions { margin-top: 8px; display: flex; gap: 6px; }
[b-ebaqztf4t4] .cs-bottom-stat-center { display: flex; align-items: center; }
[b-ebaqztf4t4] .cs-drawer-section-pad12 { padding: 12px; }

[b-ebaqztf4t4] .cs-nf-sm { font-size: calc(.8rem + 1px); }

[b-ebaqztf4t4] .cs-ko-remove { padding: 2px !important; }

[b-ebaqztf4t4] .cs-mini-btn { font-size: var(--rcm-text-xs) !important; text-transform: none !important; padding: 2px 8px !important; }
[b-ebaqztf4t4] .cs-analysis-btn { text-transform: none !important; font-size: calc(.75rem + 1px) !important; }

[b-ebaqztf4t4] .cs-stripe-label { font-size: var(--rcm-text-xs); color: var(--rcm-gray-600); }
[b-ebaqztf4t4] .cs-slider-flush { margin: 0 !important; }

[b-ebaqztf4t4] .cs-terrain-hint { color: var(--rcm-gray-450) !important; font-size: var(--rcm-text-xs); margin: -6px 0 8px 2px; }

[b-ebaqztf4t4] .cs-permo { font-size: var(--rcm-text-2xs); color: var(--rcm-gray-450); }
[b-ebaqztf4t4] .cs-story-arrow-icon { color: var(--rcm-gray-400) !important; font-size: 1.2rem !important; }

[b-ebaqztf4t4] .cs-invest-note { font-size: var(--rcm-text-sm); color: var(--rcm-gray-600); }
[b-ebaqztf4t4] .cs-invest-note-mt { margin-top: 10px; }
[b-ebaqztf4t4] .cs-invest-note-strong { font-size: var(--rcm-text-sm); color: var(--rcm-gray-800); font-weight: 600; }
[b-ebaqztf4t4] .cs-invest-note-roi { font-size: var(--rcm-text-sm); color: var(--rcm-positive); font-weight: 600; margin-top: 4px; }

[b-ebaqztf4t4] .cs-load-row { display: flex; justify-content: space-between; align-items: center; width: 100%; }
[b-ebaqztf4t4] .cs-load-actions { display: flex; gap: 4px; }
/* _content/SupportAppAMR/Components/Pages/Analytics/CustomerDashboard.razor.rz.scp.css */
/* `!important` on classes also defined in analytics-theme.css (kpi-card, kpi-icon)
   so this page's look wins regardless of load order. */

[b-vi6c0w2ef7] .rcm-card { border-radius: 0; overflow: hidden; }

[b-vi6c0w2ef7] .kpi-card {
    border-radius: 0 !important;
    border: 1px solid var(--rcm-light-gray) !important;
    overflow: hidden !important;
}

[b-vi6c0w2ef7] .kpi-primary { border-left: 4px solid var(--rcm-red) !important; }
[b-vi6c0w2ef7] .kpi-dark    { border-left: 4px solid var(--rcm-black) !important; }
[b-vi6c0w2ef7] .kpi-medium  { border-left: 4px solid var(--rcm-medium-gray) !important; }

[b-vi6c0w2ef7] .kpi-card-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    padding: 20px;
}

[b-vi6c0w2ef7] .kpi-icon {
    width: 48px !important;
    height: 48px !important;
    border-radius: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: rgba(0,0,0,0.04);
}

[b-vi6c0w2ef7] .kpi-icon-red    { background: var(--rcm-red) !important; }
[b-vi6c0w2ef7] .kpi-icon-black  { background: var(--rcm-black) !important; }
[b-vi6c0w2ef7] .kpi-icon-medium { background: var(--rcm-medium-gray) !important; }

[b-vi6c0w2ef7] .kpi-icon-glyph { color: var(--rcm-white); font-size: 22px; }
[b-vi6c0w2ef7] .kpi-overline   { color: var(--rcm-dark-gray); letter-spacing: 0.04em; }
[b-vi6c0w2ef7] .kpi-value      { font-weight: 700; color: var(--rcm-black); }

[b-vi6c0w2ef7] .kpi-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    min-width: 0;
}

[b-vi6c0w2ef7] .subtle { color: var(--mud-palette-text-secondary); }

[b-vi6c0w2ef7] .chart-shell { border-radius: 0; overflow: hidden; }

[b-vi6c0w2ef7] .weekly-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--rcm-light-gray);
    padding: 12px 20px;
}

[b-vi6c0w2ef7] .weekly-header-title {
    font-size: calc(0.82rem + 1px);
    font-weight: 700;
    color: var(--rcm-black);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

[b-vi6c0w2ef7] .week-tabs {
    display: flex;
    gap: 0;
    background: var(--rcm-light-gray);
    border-radius: 0;
    overflow: hidden;
    margin-bottom: 16px;
}

[b-vi6c0w2ef7] .week-tab {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 14px 12px;
    cursor: pointer;
    font-size: calc(0.88rem + 1px);
    font-weight: 600;
    color: var(--rcm-dark-gray);
    transition: all 0.15s ease;
    white-space: nowrap;
    border-right: 1px solid var(--rcm-medium-gray);
    border-radius: 0 !important;
}

[b-vi6c0w2ef7] .week-tab:last-child { border-right: none; }
[b-vi6c0w2ef7] .week-tab:hover { background: rgba(0,0,0,0.06); }

[b-vi6c0w2ef7] .week-tab-active,
[b-vi6c0w2ef7] .week-tab-active span {
    background: var(--rcm-black) !important;
    color: var(--rcm-white) !important;
}

[b-vi6c0w2ef7] .week-tab-active:hover { background: var(--rcm-black) !important; }

[b-vi6c0w2ef7] .mini-kpi-trend {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: calc(0.72rem + 1px);
    font-weight: 600;
    margin-top: 2px;
}

[b-vi6c0w2ef7] .trend-up, [b-vi6c0w2ef7] .trend-up span:first-child { color: var(--mud-palette-success) !important; }
[b-vi6c0w2ef7] .trend-down, [b-vi6c0w2ef7] .trend-down span:first-child { color: var(--mud-palette-error) !important; }
[b-vi6c0w2ef7] .trend-flat, [b-vi6c0w2ef7] .trend-flat span:first-child { color: var(--mud-palette-text-secondary) !important; opacity: 0.7; }
[b-vi6c0w2ef7] .mini-kpi-trend span.vs-label { color: var(--rcm-black) !important; opacity: 1; }

[b-vi6c0w2ef7] .mini-kpi-value { font-weight: 700; color: var(--rcm-black); }
[b-vi6c0w2ef7] .mini-kpi-empty { color: var(--rcm-medium-gray); }

[b-vi6c0w2ef7] .top-card { border-radius: 0; overflow: hidden; border: 1px solid var(--rcm-light-gray); }
[b-vi6c0w2ef7] .top-card-header { background: var(--rcm-light-gray); padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; }
[b-vi6c0w2ef7] .top-card-title { font-size: calc(0.82rem + 1px); font-weight: 700; color: var(--rcm-black); text-transform: uppercase; letter-spacing: 0.06em; }
[b-vi6c0w2ef7] .top-card-count { font-size: calc(0.68rem + 1px); font-weight: 700; color: var(--rcm-white); background: var(--rcm-red); padding: 2px 10px; border-radius: 0; line-height: 1.5; }
[b-vi6c0w2ef7] .top-card-body { padding: 0; }
[b-vi6c0w2ef7] .top-items-row { display: flex; flex-direction: row; }
[b-vi6c0w2ef7] .top-item {
    display: flex; align-items: center; gap: 14px; padding: 14px 16px;
    border-bottom: 3px solid transparent; cursor: default; transition: background 0.15s ease; flex: 1; min-width: 0;
}
[b-vi6c0w2ef7] .top-item + .top-item { border-left: 1px solid var(--rcm-light-gray); }
[b-vi6c0w2ef7] .top-item:hover { background: var(--rcm-light-gray); }
[b-vi6c0w2ef7] .top-item-first { border-bottom: 3px solid var(--rcm-red); }
[b-vi6c0w2ef7] .top-item-content { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
[b-vi6c0w2ef7] .top-item-name { font-size: calc(0.88rem + 1px); font-weight: 700; color: var(--rcm-black); text-transform: uppercase; letter-spacing: 0.02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
[b-vi6c0w2ef7] .top-item-stats { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
[b-vi6c0w2ef7] .top-item-stat { font-size: calc(0.78rem + 1px); font-weight: 500; color: var(--rcm-dark-gray); white-space: nowrap; }
[b-vi6c0w2ef7] .top-item-sep { color: var(--rcm-medium-gray); font-size: calc(0.72rem + 1px); }
[b-vi6c0w2ef7] .top-rank {
    display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px;
    border-radius: 0; font-size: calc(0.75rem + 1px); font-weight: 700; background: var(--rcm-light-gray); color: var(--rcm-dark-gray); flex-shrink: 0;
}
[b-vi6c0w2ef7] .top-rank-first { background: var(--rcm-red); color: var(--rcm-white); }
[b-vi6c0w2ef7] .top-card-empty { padding: 32px 16px; text-align: center; font-size: calc(0.78rem + 1px); color: var(--rcm-medium-gray); }
[b-vi6c0w2ef7] .muted-divider { opacity: 0.5; }
[b-vi6c0w2ef7] .mud-toggle-item { padding: 4px 20px !important; min-height: unset !important; }
/* _content/SupportAppAMR/Components/Pages/Analytics/FaultAnalysis.razor.rz.scp.css */
[b-1l9rbpc22g] .fault-kpi-card {
    border-radius: 0;
}

[b-1l9rbpc22g] .fault-chart-paper {
    border-radius: 0;
}
/* _content/SupportAppAMR/Components/Pages/Analytics/MachineOperators.razor.rz.scp.css */
[b-xzn036px0i] .mo-empty-icon    { font-size: 36px; color: var(--rcm-white); }
[b-xzn036px0i] .mo-icon-empty-40 { font-size: 40px; color: var(--rcm-medium-gray); }
[b-xzn036px0i] .mo-text-black    { color: var(--rcm-black); }
[b-xzn036px0i] .mo-empty-desc    { color: var(--rcm-dark-gray); max-width: 320px; }

.amr-kpi[b-xzn036px0i] {
    border: 1px solid rgba(0,0,0,0.08);
    background: rgba(255,255,255,0.92);
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    border-radius: 0;
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    transition: box-shadow 0.2s ease;
}

.amr-kpi:hover[b-xzn036px0i] {
    box-shadow: 0 6px 20px rgba(0,0,0,0.12);
}

.amr-kpi-primary[b-xzn036px0i] { border-left: 4px solid var(--rcm-red); }
.amr-kpi-info[b-xzn036px0i]    { border-left: 4px solid var(--rcm-black); }
.amr-kpi-warn[b-xzn036px0i]    { border-left: 4px solid var(--rcm-medium-gray); }
.amr-kpi-accent[b-xzn036px0i]  { border-left: 4px solid var(--rcm-red); }

.content-card[b-xzn036px0i] {
    border-radius: 0;
    border: 1px solid var(--rcm-light-gray);
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.content-card-header[b-xzn036px0i] {
    background: var(--rcm-light-gray);
    padding: 14px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.content-card-title[b-xzn036px0i] {
    font-size: calc(0.82rem + 1px);
    font-weight: 700;
    color: var(--rcm-black);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.content-card-body[b-xzn036px0i] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.map-container[b-xzn036px0i] {
    width: 100%;
    flex: 1;
    min-height: 300px;
    overflow: hidden;
}

.op-scroll[b-xzn036px0i] {
    overflow-y: auto;
    max-height: 400px;
}

.coord-badge[b-xzn036px0i] {
    font-size: calc(0.72rem + 1px);
    font-weight: 600;
    color: var(--rcm-dark-gray);
    background: rgba(0,0,0,0.06);
    padding: 3px 10px;
    border-radius: 0;
    font-family: monospace;
}

.session-count-badge[b-xzn036px0i] {
    font-size: calc(0.68rem + 1px);
    font-weight: 700;
    color: var(--rcm-white);
    background: var(--rcm-red);
    padding: 2px 10px;
    border-radius: 0;
    line-height: 1.5;
}

.op-row[b-xzn036px0i] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    cursor: pointer;
    transition: background 0.15s ease;
    border-bottom: 1px solid var(--rcm-light-gray);
}

.op-row:last-child[b-xzn036px0i] {
    border-bottom: none;
}

.op-row:hover[b-xzn036px0i] {
    background: var(--rcm-light-gray);
}

.op-row-first[b-xzn036px0i] {
    border-bottom: 3px solid var(--rcm-red);
}

.op-row-left[b-xzn036px0i] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.op-rank[b-xzn036px0i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 0;
    font-size: calc(0.75rem + 1px);
    font-weight: 700;
    background: var(--rcm-light-gray);
    color: var(--rcm-dark-gray);
    flex-shrink: 0;
}

.op-rank-first[b-xzn036px0i] {
    background: var(--rcm-red);
    color: var(--rcm-white);
}

.op-row-info[b-xzn036px0i] {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.op-row-name[b-xzn036px0i] {
    font-size: calc(0.88rem + 1px);
    font-weight: 700;
    color: var(--rcm-black);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.op-row-date[b-xzn036px0i] {
    font-size: calc(0.72rem + 1px);
    font-weight: 500;
    color: var(--rcm-dark-gray);
}

.content-empty[b-xzn036px0i] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 100%;
    min-height: 280px;
    padding: 24px;
}

.empty-state-container[b-xzn036px0i] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 50vh;
    padding: 40px 16px;
}

.empty-state-card[b-xzn036px0i] {
    border: 1px solid var(--rcm-light-gray);
    border-radius: 0;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 48px 40px;
    max-width: 420px;
    width: 100%;
}

.empty-state-icon-wrap[b-xzn036px0i] {
    width: 72px;
    height: 72px;
    background: var(--rcm-black);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 8px;
}

.subtle[b-xzn036px0i] {
    color: var(--rcm-dark-gray, #4d4d4d);
}

@media (max-width: 600px) {
    .amr-kpi[b-xzn036px0i] {
        padding: 10px 12px;
    }

    .op-row[b-xzn036px0i] {
        padding: 10px 12px;
    }

    .op-row-name[b-xzn036px0i] {
        font-size: calc(0.78rem + 1px);
    }
}
/* _content/SupportAppAMR/Components/Pages/Analytics/Milestones.razor.rz.scp.css */
/* Records & Milestones — consumes the analytics --rcm-* token scale.
   -------------------------------------------------------------------------
   Classes landing on a plain element written in this file are scoped normally.
   Classes passed as Class= to a MudBlazor component land on ITS root, which the
   scope attribute doesn't reach — those are anchored off `.analytics-page`
   (a real div here, so it is scoped) and reached with ::deep. */

.ms-header[b-rvr93chatr] {
    gap: 16px;
    margin-bottom: 20px;
}

.analytics-page[b-rvr93chatr]  .ms-subtitle,
.analytics-page[b-rvr93chatr]  .ms-muted {
    color: var(--rcm-dark-gray);
}

.analytics-page[b-rvr93chatr]  .ms-controls {
    flex-wrap: wrap;
}

.analytics-page[b-rvr93chatr]  .ms-timeframe-select {
    width: 180px;
}

.analytics-page[b-rvr93chatr]  .ms-rcm-toggle {
    white-space: nowrap;
}

/* ---- Overview strip ---- */

.analytics-page[b-rvr93chatr]  .ms-overview {
    border-radius: 0;
    border: 1px solid var(--rcm-light-gray);
    overflow: hidden;
}

.ms-overview-header[b-rvr93chatr] {
    background: var(--rcm-light-gray);
    padding: 14px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.ms-overview-title[b-rvr93chatr] {
    font-size: var(--rcm-text-sm);
    font-weight: 700;
    color: var(--rcm-black);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.ms-overview-range[b-rvr93chatr] {
    font-size: var(--rcm-text-2xs);
    font-weight: 700;
    color: var(--rcm-white);
    background: var(--rcm-red);
    padding: 2px 10px;
    line-height: 1.5;
}

.ms-kpi[b-rvr93chatr] {
    border: 1px solid var(--rcm-border);
    background: var(--rcm-white);
    box-shadow: var(--rcm-shadow-sm);
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ms-kpi-primary[b-rvr93chatr] { border-left: 4px solid var(--rcm-red); }
.ms-kpi-info[b-rvr93chatr]    { border-left: 4px solid var(--rcm-black); }
.ms-kpi-neutral[b-rvr93chatr] { border-left: 4px solid var(--rcm-medium-gray); }

/* ---- Sections ---- */

.ms-section[b-rvr93chatr] {
    margin-bottom: 28px;
}

.ms-section-header[b-rvr93chatr] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.ms-section-title[b-rvr93chatr] {
    font-family: var(--rcm-font-header);
    font-size: var(--rcm-text-sm);
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--rcm-black);
}

.ms-section-header[b-rvr93chatr]::after {
    content: "";
    flex: 1;
    height: 2px;
    background: var(--rcm-light-gray);
}

.ms-card-grid[b-rvr93chatr] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 16px;
}

/* ---- Card ---- */

.analytics-page[b-rvr93chatr]  .ms-card {
    border-radius: 0;
    border: 1px solid var(--rcm-light-gray);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}

.analytics-page[b-rvr93chatr]  .ms-card:hover {
    box-shadow: var(--rcm-shadow-sm);
}

.ms-card-head[b-rvr93chatr] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--rcm-light-gray);
}

.ms-card-icon[b-rvr93chatr] {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--rcm-light-gray);
    color: var(--rcm-red);
}

.ms-card-headings[b-rvr93chatr] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.ms-card-title[b-rvr93chatr] {
    font-family: var(--rcm-font-header);
    font-size: var(--rcm-text-md);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rcm-black);
}

.ms-card-caption[b-rvr93chatr] {
    font-size: var(--rcm-text-2xs);
    color: var(--rcm-gray-600);
    line-height: 1.35;
}

.ms-card-body[b-rvr93chatr] {
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.ms-card-value[b-rvr93chatr] {
    font-family: var(--rcm-font-header);
    font-size: calc(1.9rem + 1px);
    font-weight: 700;
    line-height: 1.1;
    color: var(--rcm-black);
}

.ms-card-narrative[b-rvr93chatr] {
    font-size: var(--rcm-text-md);
    font-weight: 700;
    color: var(--rcm-red);
    overflow-wrap: anywhere;
}

.ms-card-detail[b-rvr93chatr] {
    font-size: var(--rcm-text-xs);
    color: var(--rcm-dark-gray);
    overflow-wrap: anywhere;
}

/* ---- Runners-up ---- */

.ms-card-runners[b-rvr93chatr] {
    margin-top: auto;
    border-top: 1px solid var(--rcm-light-gray);
    background: var(--rcm-surface-gray);
    padding: 6px 14px 8px;
}

.ms-runner[b-rvr93chatr] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 3px 0;
    font-size: var(--rcm-text-xs);
}

.ms-runner-rank[b-rvr93chatr] {
    flex: 0 0 16px;
    font-weight: 700;
    color: var(--rcm-medium-gray);
}

.ms-runner-name[b-rvr93chatr] {
    flex: 1;
    color: var(--rcm-dark-gray);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ms-runner-value[b-rvr93chatr] {
    font-weight: 700;
    color: var(--rcm-black);
    white-space: nowrap;
}

/* ---- Empty state ---- */

.analytics-page[b-rvr93chatr]  .ms-empty {
    border: 1px dashed var(--rcm-medium-gray);
    text-align: center;
}

.analytics-page[b-rvr93chatr]  .ms-empty-icon {
    font-size: 42px;
    color: var(--rcm-medium-gray);
}
/* _content/SupportAppAMR/Components/Pages/Analytics/MowSettings.razor.rz.scp.css */
/* Child component styles live in their own .razor.css files under Components/Analytics/MowSettings/. */
/* _content/SupportAppAMR/Components/Pages/Analytics/PlanAnalytics.razor.rz.scp.css */
[b-ye3zigor9j] .pa-insight-card    { height: 100%; }
[b-ye3zigor9j] .pa-insight-primary { border-left: 4px solid var(--mud-palette-primary); }
[b-ye3zigor9j] .pa-insight-info    { border-left: 4px solid var(--mud-palette-info); }
[b-ye3zigor9j] .pa-insight-warn    { border-left: 4px solid var(--mud-palette-warning); }
[b-ye3zigor9j] .pa-progress-50     { width: 50px; }
[b-ye3zigor9j] .pa-italic          { font-style: italic; }
[b-ye3zigor9j] .pa-ico-12          { font-size: 13px; }
[b-ye3zigor9j] .pa-ellipsis        { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
[b-ye3zigor9j] .pa-cell-center     { text-align: center; }

[b-ye3zigor9j] .rcm-card {
    border-radius: 0;
    overflow: hidden;
}

[b-ye3zigor9j] .rcm-card-header {
    background: linear-gradient(135deg, var(--rcm-red) 0%, var(--rcm-red-dark) 100%);
}

[b-ye3zigor9j] .text-white {
    color: white;
}

[b-ye3zigor9j] .text-white-70 {
    color: rgba(255,255,255,0.8);
}

[b-ye3zigor9j] .plan-list-header {
    background: var(--rcm-black);
    padding: 16px;
}

[b-ye3zigor9j] .plan-header-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

[b-ye3zigor9j] .plan-header-label {
    font-size: calc(0.9rem + 1px);
    font-weight: 700;
    color: var(--rcm-white);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

[b-ye3zigor9j] .plan-header-count {
    font-size: calc(0.7rem + 1px);
    font-weight: 700;
    color: var(--rcm-white);
    background: var(--rcm-red);
    padding: 2px 10px;
    border-radius: 0;
}

[b-ye3zigor9j] .plan-header-controls {
    display: flex;
    align-items: center;
    gap: 8px;
}

[b-ye3zigor9j] .plan-search-field {
    flex: 1;
    min-width: 0;
}

[b-ye3zigor9j] .plan-search-field .mud-input-outlined {
    background: var(--rcm-dark-gray);
    border-radius: 0;
}

[b-ye3zigor9j] .plan-search-field .mud-input-outlined input {
    color: var(--rcm-white);
    font-size: calc(0.8rem + 1px);
}

[b-ye3zigor9j] .plan-search-field .mud-input-outlined input::placeholder {
    color: var(--rcm-medium-gray);
}

[b-ye3zigor9j] .plan-search-field .mud-input-adornment-start .mud-icon-root {
    color: var(--rcm-medium-gray);
}

[b-ye3zigor9j] .plan-sort-controls {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

[b-ye3zigor9j] .plan-sort-dropdown {
    width: 120px;
}

[b-ye3zigor9j] .plan-sort-dropdown .mud-input-outlined {
    background: var(--rcm-dark-gray);
    border-radius: 0;
}

[b-ye3zigor9j] .plan-sort-dropdown .mud-input-outlined .mud-input-slot {
    color: var(--rcm-white);
    font-size: calc(0.78rem + 1px);
}

[b-ye3zigor9j] .plan-sort-dropdown .mud-select-input {
    color: var(--rcm-white);
    font-size: calc(0.78rem + 1px);
}

[b-ye3zigor9j] .plan-sort-dropdown .mud-icon-root {
    color: var(--rcm-medium-gray);
}

[b-ye3zigor9j] .plan-header-controls .mud-icon-button {
    color: var(--rcm-medium-gray);
}

[b-ye3zigor9j] .plan-list-container {
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 100px);
}

[b-ye3zigor9j] .plan-list-scroll {
    overflow-y: auto;
    flex: 1;
}

[b-ye3zigor9j] .plan-group-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 17px 16px;
    background: var(--rcm-white);
    cursor: pointer;
    user-select: none;
    border-bottom: 1px solid var(--rcm-medium-gray);
    transition: background 0.15s ease;
}

[b-ye3zigor9j] .plan-group-header:hover {
    background: #e0e0e0;
}

[b-ye3zigor9j] .plan-group-header-expanded {
    background: var(--rcm-black);
    border-bottom: 1px solid var(--rcm-black);
}

[b-ye3zigor9j] .plan-group-header-expanded:hover {
    background: var(--rcm-black);
}

[b-ye3zigor9j] .plan-group-header-expanded .plan-group-name {
    color: var(--rcm-white);
}

[b-ye3zigor9j] .plan-group-header-expanded .mud-icon-root {
    color: var(--rcm-medium-gray) !important;
}

[b-ye3zigor9j] .plan-group-label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

[b-ye3zigor9j] .plan-group-name {
    font-size: calc(0.8rem + 1px);
    font-weight: 700;
    color: var(--rcm-black);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    vertical-align: middle;
}

[b-ye3zigor9j] .plan-group-count {
    font-size: calc(0.65rem + 1px);
    font-weight: 700;
    color: var(--rcm-white);
    background: var(--rcm-black);
    padding: 2px 8px;
    border-radius: 0;
    line-height: 1.5;
}

[b-ye3zigor9j] .plan-group-header-expanded .plan-group-count {
    background: var(--rcm-red);
    color: var(--rcm-white);
}

[b-ye3zigor9j] .plan-item-compact {
    padding: 10px 16px 10px 16px;
    cursor: pointer;
    border-left: 3px solid transparent;
    transition: all 0.15s ease;
}

[b-ye3zigor9j] .plan-item-compact:hover {
    background-color: rgba(0, 0, 0, 0.03);
}

[b-ye3zigor9j] .plan-item-compact + .plan-item-compact {
    border-top: 1px solid rgba(0,0,0,0.04);
}

[b-ye3zigor9j] .plan-item-compact-selected {
    background-color: rgba(var(--cc-red-rgb), 0.06);
    border-left: 3px solid var(--rcm-red);
}

[b-ye3zigor9j] .plan-item-compact-selected:hover {
    background-color: rgba(var(--cc-red-rgb), 0.09);
}

[b-ye3zigor9j] .plan-item-row-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

[b-ye3zigor9j] .plan-item-name {
    font-weight: 700;
    font-size: calc(0.88rem + 1px);
    color: var(--rcm-black);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

[b-ye3zigor9j] .plan-item-stats {
    display: flex;
    align-items: center;
    gap: 0;
    margin-top: 4px;
}

[b-ye3zigor9j] .plan-stat {
    font-size: calc(0.8rem + 1px);
    font-weight: 500;
    color: var(--rcm-dark-gray);
    white-space: nowrap;
}

[b-ye3zigor9j] .plan-stat-sep {
    color: var(--rcm-medium-gray);
    margin: 0 2px;
}

[b-ye3zigor9j] .plan-stat-divider {
    width: 1px;
    height: 12px;
    background: var(--rcm-medium-gray);
    margin: 0 10px;
}

[b-ye3zigor9j] .plan-item-location {
    font-size: calc(0.72rem + 1px);
    color: var(--rcm-medium-gray);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-left: auto;
    padding-left: 8px;
}

[b-ye3zigor9j] .session-row {
    cursor: pointer;
    transition: background-color 0.2s ease;
}

[b-ye3zigor9j] .session-row:hover {
    background-color: rgba(var(--cc-red-rgb), 0.04) !important;
}

[b-ye3zigor9j] .session-row-selected {
    background-color: rgba(var(--cc-red-rgb), 0.12) !important;
    border-left: 3px solid var(--rcm-red);
}

[b-ye3zigor9j] .rel {
    position: relative;
}

[b-ye3zigor9j] .minw-200 {
    min-width: 200px;
}

[b-ye3zigor9j] .detail-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    background: var(--rcm-black);
    padding: 20px 24px;
    gap: 16px;
}

[b-ye3zigor9j] .detail-header-left {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

[b-ye3zigor9j] .detail-plan-name {
    font-size: calc(1.1rem + 1px);
    font-weight: 700;
    color: var(--rcm-white);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

[b-ye3zigor9j] .detail-plan-meta {
    font-size: calc(0.8rem + 1px);
    color: var(--rcm-white);
}

[b-ye3zigor9j] .detail-plan-property {
    font-weight: 700;
}

[b-ye3zigor9j] .detail-plan-address {
    color: rgba(255, 255, 255, 0.75);
}

[b-ye3zigor9j] .detail-meta-sep {
    margin: 0 6px;
    color: rgba(255, 255, 255, 0.5);
}

[b-ye3zigor9j] .detail-creator {
    font-size: calc(0.72rem + 1px);
    color: var(--rcm-white);
    margin-top: 2px;
}

[b-ye3zigor9j] .detail-header-right {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
    background: var(--rcm-red);
    padding: 8px 16px;
    border-radius: 0;
}

[b-ye3zigor9j] .detail-completion-value {
    font-size: calc(1.5rem + 1px);
    font-weight: 700;
    color: var(--rcm-white);
    line-height: 1;
}

[b-ye3zigor9j] .detail-completion-label {
    font-size: calc(0.6rem + 1px);
    font-weight: 700;
    color: rgba(255,255,255,0.8);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-top: 2px;
}

[b-ye3zigor9j] .detail-progress-bar {
    height: 4px;
    background: var(--rcm-light-gray);
    width: 100%;
}

[b-ye3zigor9j] .detail-progress-fill {
    height: 100%;
    background: var(--rcm-red);
    transition: width 0.4s ease;
}

[b-ye3zigor9j] .detail-metrics-section {
    padding: 16px 24px 20px;
}

[b-ye3zigor9j] .detail-metrics-label {
    font-size: calc(0.68rem + 1px);
    font-weight: 700;
    color: var(--rcm-medium-gray);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 8px;
}

[b-ye3zigor9j] .detail-metric {
    padding: 12px 14px;
    border-radius: 0;
    background: var(--rcm-light-gray);
    border-left: 3px solid transparent;
    height: 100%;
}

[b-ye3zigor9j] .detail-metric-primary {
    border-left-color: var(--rcm-red);
}

[b-ye3zigor9j] .detail-metric-secondary {
    border-left-color: var(--rcm-dark-gray);
}

[b-ye3zigor9j] .detail-metric-label {
    display: block;
    font-size: calc(0.7rem + 1px);
    font-weight: 600;
    color: var(--rcm-dark-gray);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 4px;
}

[b-ye3zigor9j] .detail-metric-value {
    display: block;
    font-size: calc(1.15rem + 1px);
    font-weight: 700;
    color: var(--rcm-black);
}

[b-ye3zigor9j] .detail-metric-value-sm {
    font-size: calc(0.95rem + 1px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-ye3zigor9j] .detail-metric-sub {
    display: block;
    font-size: calc(0.66rem + 1px);
    font-weight: 600;
    color: var(--rcm-medium-gray);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-ye3zigor9j] .detail-info-section {
    border-top: 1px solid var(--rcm-light-gray);
    padding: 0;
}

[b-ye3zigor9j] .detail-info-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 24px;
    border-left: 3px solid var(--rcm-light-gray);
}

[b-ye3zigor9j] .detail-info-row + .detail-info-row {
    border-top: 1px solid var(--rcm-light-gray);
}

[b-ye3zigor9j] .detail-info-label {
    font-size: calc(0.72rem + 1px);
    font-weight: 700;
    color: var(--rcm-dark-gray);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    white-space: nowrap;
    min-width: 100px;
}

[b-ye3zigor9j] .detail-info-value {
    font-size: calc(0.82rem + 1px);
    color: var(--rcm-black);
}

[b-ye3zigor9j] .metric-value {
    font-weight: 700;
}

[b-ye3zigor9j] .metric-success-text {
    color: var(--rcm-good);
}

/* Fixed height so Google Maps can initialise; without it the div is zero-height and the JS init guard retries forever. */
[b-ye3zigor9j] .analytics-map-350 {
    height: 350px;
    width: 100%;
}

[b-ye3zigor9j] .analytics-empty-panel {
    min-height: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* _content/SupportAppAMR/Components/Pages/Analytics/ProductionCompare.razor.rz.scp.css */
[b-r58vf8raej] .mud-card { border-left: none !important; }

[b-r58vf8raej] .compare-panel-header {
    display: flex;
    align-items: center;
    gap: 0;
    background: var(--rcm-light-gray);
    padding: 4px 12px;
    border-bottom: 1px solid var(--rcm-border);
}

[b-r58vf8raej] .compare-panel-title {
    flex: 1;
    color: var(--rcm-black) !important;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--rcm-text-sm);
}

[b-r58vf8raej] .compare-toolbar-btn { min-width: 168px; }
/* _content/SupportAppAMR/Components/Pages/Analytics/ProductionSummary.razor.rz.scp.css */
[b-kjyl6r4tsi] .context-panel {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid var(--rcm-light-gray);
    border-radius: 0;
    overflow: hidden;
}

[b-kjyl6r4tsi] .context-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--rcm-light-gray);
}

[b-kjyl6r4tsi] .context-row:last-child { border-bottom: none; }

[b-kjyl6r4tsi] .context-row-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: calc(0.82rem + 1px);
    font-weight: 700;
    color: var(--rcm-black);
    letter-spacing: 0.02em;
    white-space: nowrap;
    margin-right: 4px;
}

[b-kjyl6r4tsi] .context-count-badge {
    font-size: calc(0.7rem + 1px);
    font-weight: 700;
    color: var(--rcm-white);
    background: var(--rcm-red);
    min-width: 22px;
    text-align: center;
    padding: 1px 8px;
    border-radius: 0;
    line-height: 1.6;
}

[b-kjyl6r4tsi] .chip-drill {
    font-size: calc(0.85rem + 1px) !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em;
    border-radius: 0 !important;
    padding: 0 14px !important;
    height: 32px !important;
    transition: transform 120ms ease, box-shadow 120ms ease;
}

[b-kjyl6r4tsi] .chip-drill:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0,0,0,.12);
}

[b-kjyl6r4tsi] .chip-more {
    font-size: calc(0.8rem + 1px) !important;
    font-weight: 600 !important;
    border-radius: 0 !important;
    padding: 0 14px !important;
    height: 32px !important;
    opacity: .85;
    border-style: dashed !important;
}

[b-kjyl6r4tsi] .ps-ico-red { color: var(--rcm-red); }
/* _content/SupportAppAMR/Components/Pages/Analytics/Properties.razor.rz.scp.css */
[b-hpke1kxhmm] .pm-page {
    height: calc(100vh - 120px);
    min-height: 680px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

[b-hpke1kxhmm] .pm-toolbar {
    border-radius: 0;
    overflow: hidden;
    background: var(--rcm-light-gray);
}

[b-hpke1kxhmm] .pm-toolbar-inner {
    padding: 10px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

[b-hpke1kxhmm] .pm-title {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

[b-hpke1kxhmm] .pm-title-text {
    font-size: calc(1rem + 1px);
    font-weight: 700;
    color: var(--rcm-red);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-hpke1kxhmm] .pm-title-impersonating {
    color: var(--rcm-red);
    text-decoration: underline;
    text-decoration-color: var(--rcm-medium-gray);
}

[b-hpke1kxhmm] .pm-plan-sublist {
    width: 100%;
    padding: 4px 0 2px 0;
    border-left: 2px solid var(--rcm-light-gray);
    margin-top: 8px;
    margin-left: 8px;
}

[b-hpke1kxhmm] .pm-plan-item {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    border-radius: 0;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

[b-hpke1kxhmm] .pm-plan-item:hover {
    background-color: rgba(var(--cc-red-rgb), 0.06);
}

[b-hpke1kxhmm] .pm-plan-item-name {
    font-size: calc(0.78rem + 1px);
    font-weight: 600;
    color: var(--rcm-black);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-hpke1kxhmm] .pm-plan-empty {
    font-size: calc(0.75rem + 1px);
    color: var(--rcm-medium-gray);
    padding: 4px 10px;
    font-style: italic;
}

[b-hpke1kxhmm] .pm-unassigned-nav {
    display: flex;
    align-items: center;
    gap: 11px;
    background: var(--rcm-white);
    border-radius: 0;
    padding: 9px 15px;
    border: 1px solid var(--rcm-medium-gray);
}

[b-hpke1kxhmm] .pm-unassigned-nav .mud-icon-button {
    background: var(--rcm-medium-gray) !important;
    color: var(--rcm-black) !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 0 !important;
}

[b-hpke1kxhmm] .pm-unassigned-nav .mud-icon-button:hover {
    background: var(--rcm-dark-gray) !important;
    color: var(--rcm-white) !important;
}

[b-hpke1kxhmm] .pm-unassigned-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.5;
    padding: 0 30px;
}

[b-hpke1kxhmm] .pm-unassigned-name {
    font-size: calc(0.82rem + 1px);
    font-weight: 700;
    color: var(--rcm-black);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
}

[b-hpke1kxhmm] .pm-unassigned-count {
    font-size: calc(0.65rem + 1px);
    font-weight: 600;
    color: var(--rcm-red);
    white-space: nowrap;
}

[b-hpke1kxhmm] .pm-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

[b-hpke1kxhmm] .pm-body {
    flex: 1;
    display: grid;
    grid-template-columns: 310px 1fr;
    gap: 12px;
    min-height: 520px;
}

@media (max-width: 900px) {
    [b-hpke1kxhmm] .pm-body {
        grid-template-columns: 1fr;
    }
    [b-hpke1kxhmm] .pm-left-panel {
        max-height: 250px;
    }
}

[b-hpke1kxhmm] .pm-left-panel {
    border-radius: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--rcm-light-gray);
    background: var(--rcm-white);
}

[b-hpke1kxhmm] .pm-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    background: var(--rcm-black);
}

[b-hpke1kxhmm] .pm-panel-title {
    font-size: calc(0.85rem + 1px);
    font-weight: 700;
    color: var(--rcm-white);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

[b-hpke1kxhmm] .pm-panel-count {
    font-size: calc(0.65rem + 1px);
    font-weight: 700;
    color: var(--rcm-white);
    background: var(--rcm-red);
    padding: 2px 10px;
    border-radius: 0;
}

[b-hpke1kxhmm] .pm-panel-search {
    padding: 8px 12px;
    background: var(--rcm-surface-gray);
    border-bottom: 1px solid var(--rcm-light-gray);
}

[b-hpke1kxhmm] .pm-search-field .mud-input-outlined {
    background: var(--rcm-white);
    border-radius: 0;
    font-size: calc(0.8rem + 1px);
}

[b-hpke1kxhmm] .pm-property-list {
    flex: 1;
    overflow-y: auto;
    padding: 0;
}

[b-hpke1kxhmm] .pm-property-item {
    padding: 14px 16px;
    cursor: pointer;
    border-left: 3px solid transparent;
    transition: all 0.15s ease;
    display: flex;
    flex-direction: column;
    gap: 0;
}

[b-hpke1kxhmm] .pm-property-item + .pm-property-item {
    border-top: 1px solid var(--rcm-light-gray);
}

[b-hpke1kxhmm] .pm-property-item:hover {
    background: var(--rcm-light-gray);
}

[b-hpke1kxhmm] .pm-property-item-selected {
    background: rgba(var(--cc-red-rgb), 0.06);
    border-left-color: var(--rcm-red);
}

[b-hpke1kxhmm] .pm-property-item-selected:hover {
    background: rgba(var(--cc-red-rgb), 0.09);
}

[b-hpke1kxhmm] .pm-property-header {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
}

[b-hpke1kxhmm] .pm-property-name {
    flex: 1;
    font-weight: 700;
    font-size: calc(0.85rem + 1px);
    color: var(--rcm-black);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-hpke1kxhmm] .pm-boundary-badge {
    font-weight: 600;
    font-size: calc(0.6rem + 1px);
    color: var(--rcm-white);
    background: var(--rcm-dark-gray);
    padding: 1px 6px;
    border-radius: 0;
    margin-left: 6px;
    vertical-align: middle;
}

[b-hpke1kxhmm] .pm-property-actions {
    display: flex;
    align-items: center;
    gap: 0;
    opacity: 0;
    transition: opacity 0.15s ease;
}

[b-hpke1kxhmm] .pm-property-item:hover .pm-property-actions,
[b-hpke1kxhmm] .pm-property-item-selected .pm-property-actions {
    opacity: 1;
}

[b-hpke1kxhmm] .pm-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    text-align: center;
    color: var(--rcm-gray-400);
    gap: 8px;
}

[b-hpke1kxhmm] .pm-mapWrap {
    position: relative;
    border-radius: var(--pm-radius);
    overflow: hidden;
    box-shadow: var(--pm-shadow);
    border: 1px solid var(--pm-border);
    background: var(--mud-palette-surface);
    min-height: 440px;
}

[b-hpke1kxhmm] .pm-map {
    width: 100%;
    height: 100%;
}

[b-hpke1kxhmm] .pm-unassigned-nav {
    position: absolute;
    top: 14px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    display: flex;
    align-items: center;
    gap: 11px;
    background: var(--rcm-white);
    border-radius: 0;
    padding: 9px 15px;
    border: 1px solid var(--rcm-medium-gray);
}

[b-hpke1kxhmm] .pm-unassigned-nav .mud-icon-button {
    background: var(--rcm-medium-gray) !important;
    color: var(--rcm-black) !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 0 !important;
}

[b-hpke1kxhmm] .pm-unassigned-nav .mud-icon-button:hover {
    background: var(--rcm-dark-gray) !important;
    color: var(--rcm-white) !important;
}

[b-hpke1kxhmm] .pm-unassigned-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.5;
    padding: 0 30px;
}

[b-hpke1kxhmm] .pm-unassigned-name {
    font-size: calc(0.82rem + 1px);
    font-weight: 700;
    color: var(--rcm-black);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
}

[b-hpke1kxhmm] .pm-unassigned-count {
    font-size: calc(0.65rem + 1px);
    font-weight: 600;
    color: var(--rcm-red);
    white-space: nowrap;
}

[b-hpke1kxhmm] .pm-draw-hint {
    position: absolute;
    bottom: 14px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    padding: 8px 20px;
    border-radius: 0;
    background: rgba(0,0,0,.75);
    color: white;
    font-size: calc(0.82rem + 1px);
    font-weight: 600;
    pointer-events: none;
    animation: pm-pulse-b-hpke1kxhmm 1.5s ease-in-out infinite;
}

@keyframes pm-pulse-b-hpke1kxhmm {
    0%, 100% { opacity: 1; }
    50% { opacity: .7; }
}

[b-hpke1kxhmm] .pm-editing-chip {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 10;
    padding: 6px 14px;
    border-radius: 0;
    background: rgba(255, 152, 0, 0.9);
    color: white;
    font-size: calc(0.8rem + 1px);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 2px 8px rgba(0,0,0,.2);
}

[b-hpke1kxhmm] .pm-bottom-bar {
    display: flex;
    gap: 24px;
    padding: 12px 20px;
    border-radius: 0;
    background: var(--rcm-light-gray);
    flex-wrap: wrap;
    align-items: center;
}

[b-hpke1kxhmm] .pm-bottom-stat {
    text-align: center;
    min-width: 100px;
}

[b-hpke1kxhmm] .pm-bottom-value {
    font-size: calc(1.3rem + 1px);
    font-weight: 700;
    color: var(--rcm-black);
}

[b-hpke1kxhmm] .pm-bottom-label {
    font-size: calc(0.68rem + 1px);
    font-weight: 600;
    color: var(--rcm-dark-gray);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-top: 2px;
}

[b-hpke1kxhmm] .pm-bottom-value.pm-bottom-value-name {
    font-size: calc(1rem + 1px);
}

[b-hpke1kxhmm] .pm-bottom-value.pm-bottom-value-area {
    color: var(--rcm-red);
}

[b-hpke1kxhmm] .pm-bottom-value.pm-bottom-value-editing {
    color: var(--rcm-orange);
}

[b-hpke1kxhmm] .pm-btn-red .mud-button-root,
[b-hpke1kxhmm] .pm-btn-red.mud-button-root {
    background: var(--rcm-red) !important;
    color: var(--rcm-white) !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    font-size: calc(0.78rem + 1px) !important;
    letter-spacing: 0.04em !important;
    border-radius: 0 !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

[b-hpke1kxhmm] .pm-btn-red .mud-button-root:hover,
[b-hpke1kxhmm] .pm-btn-red.mud-button-root:hover {
    background: var(--rcm-red-dark) !important;
    box-shadow: 0 4px 16px rgba(var(--cc-red-rgb), .3) !important;
}

[b-hpke1kxhmm] .pm-btn-cancel {
    color: var(--rcm-black) !important;
    border-color: var(--rcm-dark-gray) !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    font-size: calc(0.75rem + 1px) !important;
    letter-spacing: 0.04em !important;
    border-radius: 0 !important;
}

[b-hpke1kxhmm] .pm-btn-cancel:hover {
    background: rgba(0, 0, 0, 0.06) !important;
}

[b-hpke1kxhmm] .pm-name-field .mud-input-root {
    font-size: calc(0.85rem + 1px);
    font-weight: 600;
}

/* Reach the MudMenu activator button through ::deep; wrapper uses display:contents. */
.pm-add-wrap[b-hpke1kxhmm] { display: contents; }
.pm-add-wrap[b-hpke1kxhmm]  .mud-button-root:not(:disabled) {
    background-color: var(--cc-red) !important;
    color: var(--cc-white) !important;
}
.pm-add-wrap[b-hpke1kxhmm]  .mud-button-root:not(:disabled):hover {
    background-color: var(--cc-red-hover) !important;
}
.pm-add-wrap[b-hpke1kxhmm]  .mud-button-root:not(:disabled) .mud-icon-root {
    color: var(--cc-white) !important;
}
/* _content/SupportAppAMR/Components/Pages/Analytics/PropertyCoverage.razor.rz.scp.css */
[b-7fw6udmyg2] .pc-page {
    height: calc(100vh - 110px);
    min-height: 520px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-bottom: 48px;
    overflow: clip;
}

[b-7fw6udmyg2] .analytics-min-360 {
    min-height: 360px;
}

[b-7fw6udmyg2] .pc-toolbar {
    background: var(--rcm-white);
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 0;
    overflow: hidden;
}

[b-7fw6udmyg2] .pc-toolbar-inner {
    padding: 14px 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

[b-7fw6udmyg2] .pc-toolbar-label {
    font-size: calc(0.72rem + 1px);
    font-weight: 700;
    color: var(--rcm-dark-gray);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

[b-7fw6udmyg2] .pc-toolbar-spacer {
    flex: 1;
}

[b-7fw6udmyg2] .pc-date-picker .mud-input-outlined {
    background: var(--rcm-white);
    border-radius: 0;
}


[b-7fw6udmyg2] .pc-btn-panel {
    color: var(--rcm-dark-gray) !important;
    border-color: var(--rcm-dark-gray) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: calc(0.75rem + 1px) !important;
    letter-spacing: 0.04em !important;
    border-radius: 0 !important;
}

[b-7fw6udmyg2] .pc-btn-panel:hover {
    background: rgba(0,0,0,0.06) !important;
}

[b-7fw6udmyg2] .pc-btn-heatmap-active {
    background: var(--rcm-red) !important;
    color: var(--rcm-white) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: calc(0.75rem + 1px) !important;
    letter-spacing: 0.04em !important;
    border-radius: 0 !important;
}

[b-7fw6udmyg2] .pc-btn-heatmap-active:hover {
    background: var(--rcm-red-dark) !important;
}



[b-7fw6udmyg2] .pc-body {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    min-height: 0;
    overflow: clip;
}

@media (min-width: 1100px) {
    [b-7fw6udmyg2] .pc-body.panel-open {
        grid-template-columns: 1fr 380px;
        align-items: stretch;
    }
}

[b-7fw6udmyg2] .pc-mapWrap {
    position: relative;
    border-radius: var(--pc-radius);
    overflow: hidden;
    box-shadow: var(--pc-shadow);
    border: 1px solid var(--pc-border);
    background: var(--mud-palette-surface);
    min-height: 440px;
}

[b-7fw6udmyg2] .pc-map {
    width: 100%;
    height: 100%;
}

[b-7fw6udmyg2] .pc-overlay {
    position: absolute;
    z-index: 10;
    pointer-events: none;
    inset: 0;
}

[b-7fw6udmyg2] .pc-overlay > * { pointer-events: auto; }

[b-7fw6udmyg2] .pc-overlay-topLeft {
    position: absolute;
    top: 10px;
    left: 10px;
    display: grid;
    gap: 10px;
    width: min(260px, calc(100% - 20px));
}

[b-7fw6udmyg2] .pc-overlay-topRight {
    position: absolute;
    top: 10px;
    right: 10px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
    max-width: calc(100% - 20px);
}

[b-7fw6udmyg2] .pc-overlay-bottom {
    position: absolute;
    bottom: 10px;
    left: 10px;
    right: 10px;
    display: flex;
    justify-content: center;
}

[b-7fw6udmyg2] .pc-glass {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    background: var(--pc-blur-bg);
    border: 1px solid var(--pc-border);
    border-radius: 0;
    box-shadow: var(--pc-shadow-soft);
}

[b-7fw6udmyg2] .mud-theme-dark .pc-glass {
    background: var(--pc-blur-bg-dark);
    border-color: rgba(255,255,255,.12);
}

[b-7fw6udmyg2] .pc-summary {
    padding: 8px 10px;
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    width: min(780px, 100%);
}

[b-7fw6udmyg2] .pc-summaryItem {
    text-align: center;
    min-width: 84px;
    padding: 6px 8px;
    border-radius: 0;
}

[b-7fw6udmyg2] .pc-summaryValue {
    font-size: calc(1.1rem + 1px);
    font-weight: 800;
    line-height: 1.1;
    color: var(--rcm-black);
}

[b-7fw6udmyg2] .pc-summaryLabel {
    font-size: calc(.65rem + 1px);
    font-weight: 600;
    color: var(--rcm-dark-gray);
    text-transform: uppercase;
    letter-spacing: .6px;
    margin-top: 2px;
}

[b-7fw6udmyg2] .pc-rightPanel {
    border-radius: 0;
    overflow: hidden;
    background: var(--rcm-white);
    border: 1px solid var(--rcm-light-gray);
    display: flex;
    flex-direction: column;
    min-height: 0;
}

[b-7fw6udmyg2] .pc-panelHeader {
    padding: 12px 16px;
    background: var(--rcm-black);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

[b-7fw6udmyg2] .pc-panelTitle {
    font-size: calc(0.8rem + 1px);
    font-weight: 700;
    color: var(--rcm-white);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

[b-7fw6udmyg2] .pc-panelHeader-right {
    display: flex;
    align-items: center;
    gap: 8px;
}

[b-7fw6udmyg2] .pc-panelCount {
    font-size: calc(0.65rem + 1px);
    font-weight: 700;
    color: var(--rcm-white);
    background: var(--rcm-red);
    padding: 2px 10px;
    border-radius: 0;
}

[b-7fw6udmyg2] .pc-panelSearch {
    padding: 8px 12px;
    background: var(--rcm-surface-gray);
    border-bottom: 1px solid var(--rcm-light-gray);
}

[b-7fw6udmyg2] .pc-panelSearch .mud-input-outlined {
    background: var(--rcm-white);
    border-radius: 0;
}

[b-7fw6udmyg2] .pc-panelBody {
    padding: 10px 12px;
    overflow: auto;
    flex: 1;
}

[b-7fw6udmyg2] .pc-propCard {
    padding: 12px 14px;
    border-left: 3px solid transparent;
    transition: all 0.15s ease;
    margin-bottom: 0;
    border-bottom: 2px solid var(--rcm-medium-gray);
    cursor: pointer;
}

[b-7fw6udmyg2] .pc-propCard:hover {
    background: var(--rcm-surface-gray);
}

[b-7fw6udmyg2] .pc-propCardSelected {
    border-left-color: var(--rcm-red);
    background: rgba(var(--cc-red-rgb), 0.05);
}

[b-7fw6udmyg2] .pc-propCard-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

[b-7fw6udmyg2] .pc-propCard-headText {
    min-width: 0;
}

[b-7fw6udmyg2] .pc-propCard-focusBtn .mud-icon-root {
    color: var(--rcm-dark-gray);
}

[b-7fw6udmyg2] .pc-propCard-viewBtn .mud-icon-root {
    color: var(--pc-blue);
}

[b-7fw6udmyg2] .pc-propCard-name {
    font-size: calc(0.85rem + 1px);
    font-weight: 700;
    color: var(--rcm-black);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-7fw6udmyg2] .pc-propCard-subtitle {
    font-size: calc(0.72rem + 1px);
    color: var(--rcm-black);
    margin-top: 2px;
}

[b-7fw6udmyg2] .pc-section-label {
    font-size: calc(0.65rem + 1px);
    font-weight: 700;
    color: var(--rcm-medium-gray);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 8px;
    margin-bottom: 4px;
}

[b-7fw6udmyg2] .pc-statGrid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    margin-top: 6px;
}
@media (max-width: 520px) {
    [b-7fw6udmyg2] .pc-statGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

[b-7fw6udmyg2] .pc-stat {
    padding: 6px;
    border-radius: 0;
    background: var(--rcm-light-gray);
    text-align: center;
}

[b-7fw6udmyg2] .pc-statVal {
    font-weight: 700;
    font-size: calc(0.85rem + 1px);
    color: var(--rcm-black);
}

[b-7fw6udmyg2] .pc-statLbl {
    font-size: calc(0.62rem + 1px);
    font-weight: 600;
    color: var(--rcm-black);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-top: 2px;
}

[b-7fw6udmyg2] .pc-emptyState {
    display: grid;
    place-items: center;
    height: 100%;
    min-height: 320px;
    padding: 24px;
    text-align: center;
}

[b-7fw6udmyg2] .pc-floatStatus {
    position: absolute;
    bottom: 14px;
    right: 14px;
    z-index: 11;
    pointer-events: none;
}

[b-7fw6udmyg2] .pc-mapEmpty {
    position: absolute;
    inset: 0;
    z-index: 12;
    display: grid;
    place-items: center;
    padding: 24px;
    text-align: center;
    background: rgba(0, 0, 0, 0.55);
    color: var(--rcm-white);
}

[b-7fw6udmyg2] .pc-mapEmpty-icon {
    font-size: 56px;
    color: var(--rcm-white);
}

[b-7fw6udmyg2] .pc-mapEmpty-title {
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rcm-white);
}

[b-7fw6udmyg2] .pc-mapEmpty-desc {
    opacity: 0.9;
    max-width: 520px;
    color: var(--rcm-white);
}

[b-7fw6udmyg2] .pc-btn-empty-state {
    background: var(--rcm-red) !important;
    color: var(--rcm-white) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: calc(0.82rem + 1px) !important;
    letter-spacing: 0.04em !important;
    border-radius: 0 !important;
    padding: 10px 24px !important;
}

[b-7fw6udmyg2] .pc-btn-empty-state:hover {
    background: var(--rcm-red-dark) !important;
    box-shadow: 0 4px 16px rgba(var(--cc-red-rgb), .3) !important;
}

[b-7fw6udmyg2] .pc-mapStats {
    padding: 10px 12px;
}

[b-7fw6udmyg2] .pc-mapStatsRow {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: calc(0.85rem + 1px);
}
/* _content/SupportAppAMR/Components/Pages/Analytics/Sessions.razor.rz.scp.css */
/* The "Mowing Settings" popover card (.analytics-settings-card) is styled in
   analytics-theme.css — MudPopover is outside of .analytics-page, so
   scoped `::deep` rules (and the --rcm-* tokens) can't reach it. */

.analytics-page[b-bnqvqjx3ug]  .analytics-filter-toolbar {
    background: var(--rcm-white);
    border: 1px solid var(--rcm-border);
    border-radius: 0;
    padding: 12px 16px;
    margin-bottom: 16px;
}

.analytics-page[b-bnqvqjx3ug]  .analytics-company-select,
.analytics-page[b-bnqvqjx3ug]  .analytics-date-picker {
    min-width: 200px;
}

.analytics-page[b-bnqvqjx3ug]  .analytics-eff-bar {
    width: 80px;
    height: 6px;
    border-radius: 0;
}

.analytics-page[b-bnqvqjx3ug]  .analytics-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 48px 32px;
    gap: 10px;
    border: 1px dashed var(--rcm-medium-gray);
    background: rgba(0, 0, 0, 0.015);
}

.analytics-page[b-bnqvqjx3ug]  .analytics-empty-state-icon {
    width: 56px;
    height: 56px;
    border-radius: 0;
    background: var(--rcm-black);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 8px;
}

.analytics-page[b-bnqvqjx3ug]  .analytics-empty-state-icon .mud-icon-root {
    font-size: 28px;
    color: var(--rcm-white);
}

.analytics-page[b-bnqvqjx3ug]  .analytics-empty-state-title {
    font-weight: 700;
    font-size: calc(1rem + 1px);
    color: var(--rcm-black);
}

.analytics-page[b-bnqvqjx3ug]  .analytics-empty-state-desc {
    font-size: calc(.85rem + 1px);
    color: var(--rcm-dark-gray);
    max-width: 420px;
}

.analytics-page[b-bnqvqjx3ug]  .analytics-polygon-preview {
    width: 44px;
    height: 28px;
    display: block;
    cursor: pointer;
    transition: transform .2s ease;
    position: relative;
    z-index: 1;
}

.analytics-page[b-bnqvqjx3ug]  .analytics-polygon-preview:hover {
    transform: scale(2);
    z-index: 1000;
}

.analytics-page[b-bnqvqjx3ug]  .analytics-polygon-preview path {
    fill: rgba(25, 118, 210, .25);
    stroke: rgba(25, 118, 210, .9);
    stroke-width: 1.5;
}

.analytics-page[b-bnqvqjx3ug]  td:has(.analytics-polygon-preview) {
    overflow: visible;
}

.analytics-page[b-bnqvqjx3ug]  tr:has(.analytics-polygon-preview:hover) {
    z-index: 10;
    position: relative;
}

.analytics-page[b-bnqvqjx3ug]  .session-row-selected > td {
    background: rgba(var(--cc-red-rgb), .06);
}

.analytics-page[b-bnqvqjx3ug]  .session-row-selected > td:first-child {
    box-shadow: inset 4px 0 0 0 var(--rcm-red);
}

.analytics-page[b-bnqvqjx3ug]  .analytics-map-shell {
    border-radius: 0;
    overflow: hidden;
}

.analytics-page[b-bnqvqjx3ug]  .analytics-sessions-map {
    height: 650px;
    width: 100%;
}

.analytics-page[b-bnqvqjx3ug]  .analytics-muted {
    opacity: .5;
}

/* Dark text on the tinted pills for an AA-legible, consistent set. */
.analytics-page[b-bnqvqjx3ug]  .eff-chip.mud-chip-filled.mud-chip-color-success {
    background-color: var(--mud-palette-success) !important;
    color: var(--cc-black) !important;
}
.analytics-page[b-bnqvqjx3ug]  .eff-chip.mud-chip-filled.mud-chip-color-warning {
    background-color: var(--mud-palette-warning) !important;
    color: var(--cc-black) !important;
}
.analytics-page[b-bnqvqjx3ug]  .eff-chip.mud-chip-filled.mud-chip-color-error {
    color: var(--cc-black) !important;
}
/* _content/SupportAppAMR/Components/Pages/Analytics/WeeklyData.razor.rz.scp.css */
.overview-card[b-yqd6ge4nhz] {
    border-radius: 0;
    border: 1px solid var(--rcm-light-gray);
    overflow: hidden;
}

.overview-header[b-yqd6ge4nhz] {
    background: var(--rcm-light-gray);
    padding: 14px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.overview-header-title[b-yqd6ge4nhz] {
    font-size: calc(0.82rem + 1px);
    font-weight: 700;
    color: var(--rcm-black);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.overview-week-count[b-yqd6ge4nhz] {
    font-size: calc(0.68rem + 1px);
    font-weight: 700;
    color: var(--rcm-white);
    background: var(--rcm-red);
    padding: 2px 10px;
    border-radius: 0;
    line-height: 1.5;
}

.overview-kpi[b-yqd6ge4nhz] {
    border: 1px solid rgba(0,0,0,0.08);
    background: rgba(255,255,255,0.92);
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    border-radius: 0;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.overview-kpi-primary[b-yqd6ge4nhz] { border-left: 4px solid var(--rcm-red); }
.overview-kpi-info[b-yqd6ge4nhz]    { border-left: 4px solid var(--rcm-black); }
.overview-kpi-warn[b-yqd6ge4nhz]    { border-left: 4px solid var(--rcm-medium-gray); }
.overview-kpi-pace[b-yqd6ge4nhz]    { border-left: 4px solid var(--rcm-dark-gray); }
.overview-kpi-days[b-yqd6ge4nhz]    { border-left: 4px solid var(--rcm-gray-600); }
.overview-kpi-best[b-yqd6ge4nhz]    { border-left: 4px solid var(--rcm-red); }

.overview-kpi-icon[b-yqd6ge4nhz] {
    width: 32px;
    height: 32px;
    border-radius: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.04);
    margin-bottom: 4px;
}

.overview-kpi-sub[b-yqd6ge4nhz] {
    font-size: calc(0.68rem + 1px);
    font-weight: 600;
    color: var(--rcm-dark-gray);
    letter-spacing: 0.02em;
}


.week-scroll[b-yqd6ge4nhz] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    gap: 20px;
    padding-bottom: 16px;
}

.week-card[b-yqd6ge4nhz] {
    border-radius: 0;
    border: 1px solid var(--rcm-light-gray);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.2s ease;
}

.week-card:hover[b-yqd6ge4nhz] {
    box-shadow: 0 8px 24px rgba(0,0,0,0.10);
}

.week-card-header[b-yqd6ge4nhz] {
    background: var(--rcm-light-gray);
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.week-card-header-left[b-yqd6ge4nhz] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.week-card-header-right[b-yqd6ge4nhz] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
    flex-shrink: 0;
}

.week-card-date[b-yqd6ge4nhz] {
    font-family: var(--rcm-font-header);
    font-size: calc(0.82rem + 1px);
    font-weight: 700;
    color: var(--rcm-black);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.week-day-dots[b-yqd6ge4nhz] {
    display: flex;
    gap: 5px;
    align-items: center;
}

.day-dot[b-yqd6ge4nhz] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: transparent;
    border: 2px solid var(--rcm-medium-gray);
}

.day-dot-active[b-yqd6ge4nhz] {
    background: var(--rcm-red);
    border-color: var(--rcm-red);
}

.week-badge[b-yqd6ge4nhz] {
    font-size: calc(0.58rem + 1px);
    font-weight: 700;
    padding: 2px 10px;
    border-radius: 0;
    line-height: 1.5;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    flex-shrink: 0;
}

.week-badge-current[b-yqd6ge4nhz] {
    background: var(--rcm-red);
    color: var(--rcm-white);
}

.week-badge-best[b-yqd6ge4nhz] {
    background: var(--rcm-black);
    color: var(--rcm-white);
}

.week-card-stats[b-yqd6ge4nhz] {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.week-stat[b-yqd6ge4nhz] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px 14px;
    min-height: 68px;
    border-bottom: 1px solid rgba(0,0,0,0.04);
    border-right: 1px solid rgba(0,0,0,0.04);
}

.week-stat:nth-child(2n)[b-yqd6ge4nhz] {
    border-right: none;
}

.week-stat:nth-child(n+3)[b-yqd6ge4nhz] {
    border-bottom: none;
}

.week-stat-value[b-yqd6ge4nhz] {
    font-size: calc(0.92rem + 1px);
    font-weight: 700;
    color: var(--rcm-black);
    white-space: nowrap;
}

.week-stat-label[b-yqd6ge4nhz] {
    font-size: calc(0.6rem + 1px);
    font-weight: 600;
    color: var(--rcm-dark-gray);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.week-card-chart[b-yqd6ge4nhz] {
    flex: 1;
    padding: 12px 16px 8px;
    border-top: 1px solid var(--rcm-light-gray);
}

.week-trend[b-yqd6ge4nhz] {
    font-size: calc(0.65rem + 1px);
    font-weight: 700;
    line-height: 1;
}

.trend-up[b-yqd6ge4nhz] {
    color: var(--mud-palette-success, var(--rcm-positive)) !important;
}

.trend-down[b-yqd6ge4nhz] {
    color: var(--mud-palette-error, #d32f2f) !important;
}

.trend-flat[b-yqd6ge4nhz] {
    color: var(--rcm-medium-gray) !important;
}

.week-card-footer[b-yqd6ge4nhz] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 16px;
    border-top: 1px solid var(--rcm-light-gray);
    cursor: pointer;
    transition: background 0.15s ease;
    color: var(--rcm-dark-gray);
    margin-top: auto;
}

.week-card-footer:hover[b-yqd6ge4nhz] {
    background: rgba(var(--cc-red-rgb), 0.04);
    color: var(--rcm-red);
}

.week-card-footer:hover .mud-icon-root[b-yqd6ge4nhz] {
    color: var(--rcm-red) !important;
}

.week-card-footer-label[b-yqd6ge4nhz] {
    font-family: var(--rcm-font-header);
    font-size: calc(0.68rem + 1px);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

[b-yqd6ge4nhz] .nav-btn {
    color: var(--rcm-black) !important;
    border-radius: 0;
}

[b-yqd6ge4nhz] .nav-btn:hover {
    background: var(--rcm-light-gray) !important;
}

[b-yqd6ge4nhz] .today-btn {
    border-radius: 0 !important;
    border-color: var(--rcm-red) !important;
    color: var(--rcm-red) !important;
    font-size: calc(0.75rem + 1px);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 2px 14px;
    min-width: unset;
}

[b-yqd6ge4nhz] .today-btn:hover {
    background: rgba(var(--cc-red-rgb),0.06) !important;
}


[b-yqd6ge4nhz] .month-select {
    flex-shrink: 0;
}

[b-yqd6ge4nhz] .month-select .mud-input-outlined .mud-input-outlined-border {
    border-radius: 0;
    border-color: var(--rcm-medium-gray);
}

[b-yqd6ge4nhz] .month-select .mud-input-outlined:hover .mud-input-outlined-border {
    border-color: var(--rcm-black);
}

.empty-state[b-yqd6ge4nhz] {
    border-radius: 0;
    border: 1px solid var(--rcm-light-gray);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.subtle[b-yqd6ge4nhz] {
    color: var(--rcm-dark-gray);
}

[b-yqd6ge4nhz] .rcm-alert {
    border-radius: 0;
}

@media (max-width: 768px) {
    .week-scroll[b-yqd6ge4nhz] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .week-stat[b-yqd6ge4nhz] {
        padding: 8px 10px;
    }

    .week-stat-value[b-yqd6ge4nhz] {
        font-size: calc(0.82rem + 1px);
    }

    .overview-header-title[b-yqd6ge4nhz] {
        font-size: calc(0.72rem + 1px);
    }

    .overview-kpi[b-yqd6ge4nhz] {
        padding: 8px 10px;
    }

    .week-scroll[b-yqd6ge4nhz] {
        grid-template-columns: 1fr;
    }
}

[b-yqd6ge4nhz] .wd-select-year  { width: 100px; }
[b-yqd6ge4nhz] .wd-select-month { width: 140px; }
[b-yqd6ge4nhz] .wd-empty-icon   { font-size: 48px; color: var(--rcm-medium-gray); }
[b-yqd6ge4nhz] .wd-ico-red      { color: var(--rcm-red); }
[b-yqd6ge4nhz] .wd-ico-black    { color: var(--rcm-black); }
[b-yqd6ge4nhz] .wd-ico-dark     { color: var(--rcm-dark-gray); }
[b-yqd6ge4nhz] .wd-text-medgray { color: var(--rcm-medium-gray); }
/* _content/SupportAppAMR/Components/Pages/CustomerDetails.razor.rz.scp.css */
/* MudSelect filter columns inside the session data grid */
[b-eamsxcpcx6] .cd-filter-machine {
    min-width: 110px;
    margin-top: 2px;
}

[b-eamsxcpcx6] .cd-filter-operator {
    min-width: 130px;
    margin-top: 2px;
}

/* Customer map */
.cd-map[b-eamsxcpcx6] {
    height: 650px;
    width: 100%;
    border-radius: var(--cc-radius-lg);
    overflow: hidden;
}
/* _content/SupportAppAMR/Components/Pages/Dashboard.razor.rz.scp.css */
/* ===== Dashboard (Command Center) ===== */

.dash-page[b-y8cpjujqrl] {
    display: flex;
    flex-direction: column;
}

/* ===== Page Header ===== */
.dash-page-header[b-y8cpjujqrl] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
}

.dash-page-title[b-y8cpjujqrl] {
    font-size: var(--cc-fs-3xl);
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
}

.dash-quick-actions[b-y8cpjujqrl] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

/* ===== KPI grid ===== */
/* .dash-kpis sits on the MudGrid component root, which scoped CSS can't tag
   directly — reach it via ::deep from our own .dash-page wrapper. */
.dash-page[b-y8cpjujqrl]  .dash-kpis {
    margin-bottom: 36px;
}

.dash-page[b-y8cpjujqrl]  .dash-kpis .cc-kpi-tile-label .mud-icon-root { display: none; }

.dash-header-right[b-y8cpjujqrl] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.dash-filters[b-y8cpjujqrl] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}


@media (max-width: 860px) {
    .dash-filters[b-y8cpjujqrl] {
        margin-left: 0;
        width: 100%;
    }
}

/* ===== Table card ===== */
.dash-table-card[b-y8cpjujqrl] {
    margin-top: var(--cc-sp-8);
    margin-bottom: 8px;
}

/* Status tab strip inside the data card */
.dash-tabs[b-y8cpjujqrl] {
    display: flex;
    gap: 0;
    padding: 0 20px;
    border-bottom: 1px solid var(--cc-light-gray);
    overflow-x: auto;
    overflow-y: hidden;
}

.dash-tab[b-y8cpjujqrl] {
    padding: 11px 18px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--cc-medium-gray);
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -1px;
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.15s, border-color 0.15s, background 0.15s;
    font-family: var(--cc-font-heading);
}

.dash-tab:hover[b-y8cpjujqrl] {
    color: var(--cc-black);
    background: var(--cc-hover-surface);
}

.dash-tab.active[b-y8cpjujqrl] {
    color: var(--cc-red);
    border-bottom-color: var(--cc-red);
}

.dash-tab-count[b-y8cpjujqrl] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 18px;
    padding: 0 6px;
    margin-left: 6px;
    font-size: 12px;
    font-weight: 800;
    background: var(--cc-light-gray);
    color: var(--cc-dark-gray);
    border-radius: 9px;
}

.dash-tab.active .dash-tab-count[b-y8cpjujqrl] {
    background: var(--cc-red);
    color: var(--cc-white);
}

/* ===== Table cell helpers ===== */
.dash-serial[b-y8cpjujqrl] {
    font-weight: 800;
    letter-spacing: 0.02em;
}

.dash-muted[b-y8cpjujqrl] {
    color: var(--cc-medium-gray);
}

.dash-now[b-y8cpjujqrl] {
    font-weight: 700;
    color: var(--cc-success);
}

.dash-status[b-y8cpjujqrl] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
}

.dash-status-dot[b-y8cpjujqrl] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* Tri-state summary dot — colors come off the shared machine-state scale so this
   column can't drift from the Online AMRs indicator, the map legend, or Monitor. */
.dash-status-dot.online[b-y8cpjujqrl] { background: var(--cc-success); }
.dash-status-dot.offline[b-y8cpjujqrl] { background: var(--cc-state-offline); }
.dash-status-dot.fault[b-y8cpjujqrl] { background: var(--cc-state-faulted); }

.dash-columns[b-y8cpjujqrl] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 20px;
}

/* Page-level empty state — shown when the serial/company filter matches no machines. */
/* Card wrapper for the page-level "no machines match" state; the inner layout
   and typography come from the shared EmptyState component. */
.dash-filter-empty[b-y8cpjujqrl] {
    padding: 20px 24px;
    margin-bottom: 20px;
}

/* ===== Online mowers ===== */
.dash-online-card-full[b-y8cpjujqrl] {
    margin-bottom: 0;   /* spacing handled by the .dash-columns grid gap */
}

.dash-online-card-full .dash-online-list[b-y8cpjujqrl] {
    /* Grow with the viewport so more mowers show before scrolling; never shorter
       than the previous fixed height. ~110px/row, so a taller screen shows 6-8. */
    max-height: max(380px, calc(100dvh - 340px));
}

.map-legend-dot[b-y8cpjujqrl] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex-shrink: 0;
}

.dash-online-count[b-y8cpjujqrl] {
    font-size: 13px;
    font-weight: 800;
    color: var(--cc-medium-gray);
}

.dash-online-list[b-y8cpjujqrl] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.dash-online-row[b-y8cpjujqrl] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--cc-border-subtle);
    cursor: pointer;
    transition: background 0.1s ease;
}

.dash-online-row:hover[b-y8cpjujqrl] {
    background: var(--cc-hover-surface);
}

/* ===== Full-width fleet row (prominent telemetry) ===== */
.dash-fleet-row[b-y8cpjujqrl] {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--cc-border-subtle);
    cursor: pointer;
    transition: background 0.1s ease;
}

.dash-fleet-row:hover[b-y8cpjujqrl] {
    background: var(--cc-hover-surface);
}

/* Rows double as keyboard targets (role="button" + tabindex) — make focus visible. */
.dash-fleet-row:focus-visible[b-y8cpjujqrl],
.dash-online-row:focus-visible[b-y8cpjujqrl] {
    outline: 2px solid var(--cc-black);
    outline-offset: -2px;
}

.dash-fleet-icon[b-y8cpjujqrl] {
    width: 42px;
    height: 42px;
    object-fit: contain;
    flex-shrink: 0;
}

.dash-fleet-id[b-y8cpjujqrl] {
    width: 150px;
    flex-shrink: 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--cc-sp-3);
}

.dash-fleet-id .dash-online-company[b-y8cpjujqrl] {
    white-space: normal;
    overflow-wrap: anywhere;
}

/* Fixed-proportion columns so each metric keeps its position no matter the text.
   minmax(0, …fr) lets long values ellipsize instead of pushing neighbors around.
   Two explicit rows (values, then labels) with .dash-metric as display:contents:
   every label sits on the shared second row, so a value that wraps to two lines
   (a long Status string) can't drag its own label out of line with its neighbours.
   align-items:end bottom-aligns the values, so a wrapped Status grows upward and
   its last line still sits level with the single-line metrics beside it. */
.dash-fleet-metrics[b-y8cpjujqrl] {
    display: grid;
    grid-template-columns: 76px 70px 46px 54px 68px minmax(0, 1fr) minmax(0, 2fr);
    align-items: center;
    column-gap: 32px;
    flex: 1;
    min-width: 0;
    padding-left: 12px;
    border-left: none;
}

/* The wrapper only groups a value with its label for markup readability — the two
   children are the real grid items, placed on their own rows below. */
.dash-metric[b-y8cpjujqrl] {
    display: contents;
}

.dash-metric-value[b-y8cpjujqrl] {
    grid-row: 1;
    min-width: 0;
    font-size: 17px;
    font-weight: 800;
    color: var(--dash-metric-color, var(--cc-black));
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Mini plan-progress meter under the Progress value — same recipe as the
   fleet-map card's .cc-mapcard-bar, fill driven by the shared state token. */
.dash-progress-bar[b-y8cpjujqrl] {
    height: 4px;
    margin-top: var(--cc-sp-1);
    border-radius: var(--cc-radius-sm);
    background: var(--cc-light-gray);
    overflow: hidden;
}

.dash-progress-fill[b-y8cpjujqrl] {
    display: block;
    height: 100%;
    width: var(--dash-progress, 0%);
    border-radius: inherit;
    background: var(--dash-state, var(--cc-state-mowing));
    transition: width 0.3s ease;
}

.dash-metric-label[b-y8cpjujqrl] {
    grid-row: 2;
    min-width: 0;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--cc-medium-gray);
    margin-top: 1px;
}

/* Status can be longer prose / an error link — let it wrap within a wider cell */
/* Operator/Status grid tracks are minmax(0, …) so on mid-width rows these wrap rather
   than overflowing the grid into the trailing "view live" icon. */
.dash-metric-status[b-y8cpjujqrl] {
    max-width: 280px;
}

.dash-metric-status .dash-metric-value[b-y8cpjujqrl] {
    max-width: 280px;
    white-space: normal;
    overflow-wrap: anywhere;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.25;
}

.dash-status-text[b-y8cpjujqrl] {
    color: var(--cc-info);
}

/* Rendered as a real <button> for keyboard access — reset the button chrome so
   it still reads as an inline error link. */
.dash-status-error[b-y8cpjujqrl] {
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    text-align: left;
    color: var(--cc-red);
    text-decoration: underline;
    cursor: pointer;
}

.dash-status-error:hover[b-y8cpjujqrl] {
    color: var(--cc-red-hover);
}

/* Faulted KPI tile gets a red alert accent (tile lives in the KpiTile
   component, so reach it via ::deep). */
.dash-page[b-y8cpjujqrl]  .dash-kpi-alert {
    border-color: var(--cc-red) !important;
    box-shadow: 0 0 0 1px rgba(var(--cc-red-rgb), 0.35);
}

/* Status pill + stale badge (a shared .cc-pill.tone-warning) in the identity block */
.dash-fleet-tags[b-y8cpjujqrl] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

/* Stale row: telemetry hasn't refreshed recently */
.dash-fleet-row.stale[b-y8cpjujqrl] {
    opacity: 0.6;
}

.dash-fleet-row.stale .dash-fleet-icon[b-y8cpjujqrl] {
    filter: grayscale(0.7);
}

/* Trailing "view live" affordance — a real MudIconButton for focus + hit target;
   the icon inherits the row-hover color from this wrapper. */
.dash-fleet-action[b-y8cpjujqrl] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cc-medium-gray);
    transition: color 0.12s;
}

.dash-fleet-action[b-y8cpjujqrl]  .mud-icon-button {
    color: inherit;
}

.dash-fleet-row:hover .dash-fleet-action[b-y8cpjujqrl] {
    color: var(--cc-red);
}

/* Mid-width (laptop + open drawer): tighter metric gaps give Operator/Status room */
@media (max-width: 1400px) {
    .dash-fleet-metrics[b-y8cpjujqrl] {
        column-gap: var(--cc-sp-7);
    }
}

/* Mobile compaction */
@media (max-width: 600px) {
    .dash-fleet-icon[b-y8cpjujqrl] {
        width: 34px;
        height: 34px;
    }

    .dash-online-serial[b-y8cpjujqrl] {
        font-size: 15px;
    }

    .dash-metric-value[b-y8cpjujqrl] {
        font-size: 15px;
    }

    .dash-fleet-action[b-y8cpjujqrl] {
        align-self: flex-end;
    }

    /* One rule per record, BELOW its data — the record's own bottom edge. The
       inner lines (metrics border-top / .dash-down-secondary border-top) are
       dropped on phones so the only line in an entry is the one that ends it.
       Scoped through the list wrapper to outrank the single-class base rules
       further down the file. */
    .dash-online-list .dash-fleet-row[b-y8cpjujqrl] {
        border-bottom: 1px solid var(--cc-medium-gray);
    }

    .dash-mower-down-list .dash-mower-down-row[b-y8cpjujqrl] {
        border-bottom: 1px solid var(--cc-medium-gray);
    }

    .dash-online-list .dash-fleet-row:last-child[b-y8cpjujqrl],
    .dash-mower-down-list .dash-mower-down-row:last-child[b-y8cpjujqrl] {
        border-bottom: none;
    }

    /* Expanded case detail: no rule between the serial line and its fields. */
    .dash-mower-down-list .dash-down-secondary[b-y8cpjujqrl] {
        border-top: none;
    }

    /* ---- Down for Service: fit the phone width, no horizontal scroll ----
       The primary line (serial · status pill · "Updated N ago" · Salesforce ·
       chevron) is a nowrap flex row: the pill and the age can't shrink below
       their text, so together they overrun a phone and the list scrolls
       sideways. Let the line wrap instead, drop the spacer that only exists to
       push the trailing icons right on wide screens, and pin those icons to the
       end of whatever line they land on. */
    .dash-mower-down-list .dash-down-primary[b-y8cpjujqrl] {
        flex-wrap: wrap;
        gap: var(--cc-sp-2) var(--cc-sp-5);
    }

    .dash-mower-down-list .dash-down-primary-spacer[b-y8cpjujqrl] {
        display: none;
    }

    .dash-mower-down-list .dash-mower-down-sf[b-y8cpjujqrl] {
        margin-left: auto;
    }

    /* Icon only — the "Salesforce" label is the widest thing on the line and the
       icon plus its title attribute already say what the link does. */
    .dash-mower-down-list .dash-mower-down-sf-text[b-y8cpjujqrl] {
        display: none;
    }

    /* Case descriptions come from Salesforce free text — part numbers and pasted
       URLs have no break opportunity and would push the card wide on their own. */
    .dash-mower-down-list .dash-mower-down-desc[b-y8cpjujqrl] {
        overflow-wrap: anywhere;
    }
}

@media (max-width: 700px) {
    /* Keep the indicator + icon + identity inline on the first line, with the
       metrics wrapping to a full-width second line below. */
    .dash-fleet-row[b-y8cpjujqrl] {
        flex-wrap: wrap;
        align-items: center;
        gap: 8px 12px;
    }

    .dash-fleet-id[b-y8cpjujqrl] {
        width: auto;
        flex: 1 1 auto;
        min-width: 0;
    }

    .dash-online-indicator[b-y8cpjujqrl] {
        min-height: 42px;
    }

    /* Second line of the record. No border-top here — a line inside the entry
       reads as a separator between the mower and its own telemetry; the record
       is closed by the row's bottom border instead. */
    .dash-fleet-metrics[b-y8cpjujqrl] {
        flex-basis: 100%;
        display: flex;
        flex-wrap: wrap;
        gap: 12px 24px;
        padding-left: 0;
        border-left: none;
        padding-top: 10px;
    }

    /* In the wrapped flex layout Status needs a floor so it doesn't collapse. */
    .dash-metric-status[b-y8cpjujqrl] {
        min-width: 140px;
    }

    /* The whole row navigates to the monitor, so the trailing icon is redundant. */
    .dash-fleet-action[b-y8cpjujqrl] {
        display: none;
    }

}

.dash-online-indicator[b-y8cpjujqrl] {
    width: 4px;
    align-self: stretch;
    min-height: 36px;
    border-radius: 2px;
    flex-shrink: 0;
}

.dash-online-info[b-y8cpjujqrl] {
    flex: 1;
    min-width: 0;
}

.dash-online-serial[b-y8cpjujqrl] {
    font-weight: 800;
    font-size: var(--cc-fs-md);
    letter-spacing: 0.02em;
}

/* --cc-gray-500, not --cc-medium-gray or lighter: this is ~11px type on white
   and anything lighter fails WCAG AA contrast (same rule as .cc-mapcard-company). */
.dash-online-company[b-y8cpjujqrl] {
    font-size: var(--cc-fs-xs);
    color: var(--cc-gray-500);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* RC Mowers' own machines, flagged by OnlineCompanyClass(). Both classes land on
   the SAME element, so this has to be a compound selector — no space, no ::deep.
   ::deep reaches into a child COMPONENT's markup, and a descendant selector looks
   for .rcm-company nested inside .dash-online-company; neither ever matches here,
   which is why the label stayed gray. Two classes also out-specify the one-class
   rule above on their own, so no !important is needed. */
.dash-online-company.rcm-company[b-y8cpjujqrl] {
    color: var(--cc-red);
    font-weight: bold;
    text-transform: uppercase;
}

/* Branch · Server line under the company */
.dash-fleet-meta[b-y8cpjujqrl] {
    font-size: var(--cc-fs-2xs);
    color: var(--cc-gray-500);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dash-online-stats[b-y8cpjujqrl] {
    font-size: 12px;
    color: var(--cc-medium-gray);
    margin-top: 1px;
}

.dash-online-right[b-y8cpjujqrl] {
    margin-left: auto;
    text-align: right;
    flex-shrink: 0;
}

.dash-online-sub[b-y8cpjujqrl] {
    font-size: 12px;
    color: var(--cc-medium-gray);
    margin-top: 3px;
}

@media (max-width: 860px) {
    .dash-online-card-full .dash-online-list[b-y8cpjujqrl] { max-height: max(300px, calc(100dvh - 280px)); }
}

/* ===== Fleet map overlay (sits below chrome, right of drawer) ===== */
.mapmodal[b-y8cpjujqrl] {
    position: fixed;
    top: calc(var(--cc-header-h, 72px) + var(--cc-tab-bar-h, 52px));
    bottom: var(--cc-footer-h, 36px);
    left: var(--cc-drawer-w);   /* persistent drawer width — assumes the drawer is open */
    right: 0;
    z-index: 1050; /* below MudSelect popovers (~1200) so dropdowns show on top */
    background: var(--cc-white);
    display: flex;
    flex-direction: column;
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
    animation: mapmodalIn-b-y8cpjujqrl 0.18s ease-out;
    transition: left 0.2s ease;
}

/* Follow the actual drawer state (set on the layout root by MainLayout) rather
   than viewport width — the drawer can be collapsed manually at any width, and
   the overlay must reclaim the --cc-drawer-w gutter whenever it is closed. */
.cc-drawer-collapsed .mapmodal[b-y8cpjujqrl] {
    left: 0;
}

@keyframes mapmodalIn-b-y8cpjujqrl {
    from { opacity: 0; transform: scale(0.995); }
    to { opacity: 1; transform: scale(1); }
}

.mapmodal-topbar[b-y8cpjujqrl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 10px 16px;
    background: var(--cc-white);
    border-bottom: 1px solid var(--cc-light-gray);
    flex: 0 0 auto;
    flex-wrap: wrap;
}

.mapmodal-title[b-y8cpjujqrl] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: var(--cc-font-heading);
    font-weight: 800;
    font-size: 16px;
    letter-spacing: 0.02em;
}

.mapmodal-actions[b-y8cpjujqrl] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.mapmodal-body[b-y8cpjujqrl] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    overflow: hidden;
}

.mapmodal-map[b-y8cpjujqrl] {
    flex: 1;
    position: relative;
    min-width: 0;
    background: var(--cc-bg);
}

.mapmodal .map-container[b-y8cpjujqrl] {
    width: 100%;
    height: 100%;
}

.mapmodal-legend[b-y8cpjujqrl] {
    position: absolute;
    bottom: 12px;
    left: 12px;
    display: flex;
    gap: var(--cc-sp-3) var(--cc-sp-5);
    max-width: calc(100% - 24px);
    padding: 7px 14px;
    background: color-mix(in srgb, var(--cc-white) 96%, transparent);
    border-radius: var(--cc-radius-md);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    font-size: 12px;
    font-weight: 600;
    z-index: 5;
    flex-wrap: wrap;
}

.mapmodal-legend-item[b-y8cpjujqrl] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
    color: var(--cc-dark-gray);
}

.mapmodal-sidebar[b-y8cpjujqrl] {
    width: 320px;
    flex-shrink: 0;
    border-left: 1px solid var(--cc-light-gray);
    display: flex;
    flex-direction: column;
    background: var(--cc-white);
}

.mapmodal-sidebar-header[b-y8cpjujqrl] {
    padding: 12px 16px;
    border-bottom: 2px solid var(--cc-black);
    font-family: var(--cc-font-heading);
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    flex: 0 0 auto;
}

.mapmodal-sidebar-list[b-y8cpjujqrl] {
    flex: 1;
    overflow-y: auto;
}

/* Active (selected-on-map) mower row */
.mapmodal-sidebar .dash-online-row.active[b-y8cpjujqrl] {
    background: rgba(var(--cc-red-rgb), 0.06);
    box-shadow: inset 3px 0 0 var(--cc-red);
}

@media (max-width: 768px) {
    .mapmodal[b-y8cpjujqrl] {
        bottom: var(--cc-bottom-nav-total-h);
    }

    .mapmodal-topbar[b-y8cpjujqrl] {
        flex-direction: column;
        align-items: stretch;
    }

    .mapmodal-actions[b-y8cpjujqrl] {
        justify-content: space-between;
    }

    .mapmodal-body[b-y8cpjujqrl] {
        flex-direction: column;
    }

    .mapmodal-sidebar[b-y8cpjujqrl] {
        width: 100%;
        max-height: 42vh;
        border-left: none;
        border-top: 1px solid var(--cc-light-gray);
    }
}

@media (max-width: 600px) {
    /* Phones: at 42vh the list ate roughly half the modal and left the map too
       small to pan or read. Cap the list itself instead of the whole sidebar —
       the header stays put, the list scrolls, and every pixel saved goes to the
       map (.mapmodal-map is flex: 1). A row is ~88px here: four text lines
       (serial 14px / company 11.5 / meta 11 / stats 11) plus 10px padding top
       and bottom. Showing 1.75 of them keeps a row half-visible at the cut,
       which is the affordance that there's more to scroll. */
    .mapmodal-sidebar-list[b-y8cpjujqrl] {
        --mapmodal-row-h: 88px;
        max-height: calc(1.75 * var(--mapmodal-row-h));
    }
}

/* Smallest phones only: the five legend chips need ~373px to sit on one line, and
   wrapping to a second line costs more map than shrinking them does. Below that
   width, tighten every contributor (type, dot, both gap levels, padding, inset)
   just enough that the row still fits at 320px, and forbid the wrap outright so
   the saving can't be undone by a slightly wider label. Above 373px the legend is
   untouched. */
@media (max-width: 372.98px) {
    .mapmodal-legend[b-y8cpjujqrl] {
        left: var(--cc-sp-4);
        bottom: var(--cc-sp-4);
        gap: var(--cc-sp-3);
        padding: var(--cc-sp-3) var(--cc-sp-4);
        font-size: 10px;
        flex-wrap: nowrap;
    }

    .mapmodal-legend .mapmodal-legend-item[b-y8cpjujqrl] {
        gap: var(--cc-sp-1);
    }

    .mapmodal-legend .map-legend-dot[b-y8cpjujqrl] {
        width: 7px;
        height: 7px;
    }
}

/* ===== Responsive ===== */
@media (max-width: 860px) {
    .dash-page-header[b-y8cpjujqrl] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    /* align-items: flex-start above makes this group shrink-to-fit, which would
       size the filter row to the quick-action buttons and squeeze the search
       field. Stretch it so ".dash-filters { width: 100% }" means the real row. */
    .dash-header-right[b-y8cpjujqrl] {
        width: 100%;
        align-self: stretch;
    }

    .dash-quick-actions[b-y8cpjujqrl] {
        width: 100%;
        flex-wrap: wrap;
    }

    .cc-data-card-header[b-y8cpjujqrl] {
        flex-wrap: wrap;
    }
}

/* ===== Down for Service (Salesforce) ===== */
/* Keep the standard card-header padding (matches the Online Mowers card); the refresh
   button uses a negative block margin so it doesn't inflate the header height. */
.dash-mower-down-card .cc-data-card-header[b-y8cpjujqrl]  .mud-icon-button {
    padding: 3px;
    height: auto;
    width: auto;
    margin-block: -6px;
}

.dash-mower-down-count[b-y8cpjujqrl] {
    font-size: 13px;
    font-weight: 800;
    color: var(--cc-medium-gray);
}

.dash-mower-down-list[b-y8cpjujqrl] {
    max-height: 280px;
    overflow-y: auto;
}

/* Once a case is expanded, let the list grow to fit so the detail panel
   isn't trapped behind a scrollbar. */
.dash-mower-down-list.is-expanded[b-y8cpjujqrl] {
    max-height: none;
    overflow-y: visible;
}

.dash-mower-down-empty[b-y8cpjujqrl] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 96px;
    color: var(--cc-medium-gray);
    font-size: 14px;
    font-weight: 600;
}

.dash-mower-down-empty.ok[b-y8cpjujqrl] {
    color: var(--cc-success-text);
}

.dash-mower-down-row[b-y8cpjujqrl] {
    display: flex;
    align-items: stretch;
    gap: 14px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--cc-border-subtle);
}

.dash-mower-down-row:last-child[b-y8cpjujqrl] {
    border-bottom: none;
}

.dash-mower-down-indicator[b-y8cpjujqrl] {
    width: 4px;
    align-self: stretch;
    min-height: 34px;
    border-radius: 2px;
    background: var(--cc-red);
    flex-shrink: 0;
}

.dash-mower-down-content[b-y8cpjujqrl] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Primary scannable line: Serial · Status pill · age. A real <button> (it
   toggles the detail tier), so reset the button chrome to keep the row look. */
.dash-down-primary[b-y8cpjujqrl] {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    min-height: 34px;
    width: 100%;
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    text-align: left;
    color: inherit;
}
.dash-down-serial[b-y8cpjujqrl] {
    font-size: 16px;
    font-weight: 800;
    color: var(--cc-black);
}
.dash-down-age[b-y8cpjujqrl] {
    font-size: 13px;
    font-weight: 600;
    color: var(--cc-medium-gray);
    white-space: nowrap;
}
.dash-down-primary-spacer[b-y8cpjujqrl] { flex: 1; }
.dash-down-primary[b-y8cpjujqrl]  .dash-down-chevron {
    font-size: 21px;
    color: var(--cc-medium-gray);
}

/* Secondary detail tier — revealed on expand. */
.dash-down-secondary[b-y8cpjujqrl] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--cc-border-subtle);
}
.dash-down-detail-fields[b-y8cpjujqrl] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 40px;
}

.dash-mower-down-field[b-y8cpjujqrl] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.dash-mower-down-flabel[b-y8cpjujqrl] {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--cc-medium-gray);
    font-weight: 800;
}

.dash-mower-down-fvalue[b-y8cpjujqrl] {
    font-size: var(--cc-fs-sm);
    font-weight: 600;
    color: var(--cc-black);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dash-mower-down-ftime[b-y8cpjujqrl] {
    margin-left: 6px;
    font-weight: 600;
    color: var(--cc-gray-500);
}

.dash-mower-down-descfield[b-y8cpjujqrl] {
    border-top: 1px dashed var(--cc-light-gray);
    padding-top: 8px;
}

.dash-mower-down-desc[b-y8cpjujqrl] {
    font-size: var(--cc-fs-sm);
    line-height: 1.4;
    color: var(--cc-dark-gray);
    max-width: 760px;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.dash-mower-down-sf[b-y8cpjujqrl] {
    flex-shrink: 0;
    align-self: center;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    font-weight: 700;
    color: var(--cc-sf-blue);
    text-decoration: none;
    white-space: nowrap;
}

.dash-mower-down-sf:hover[b-y8cpjujqrl] {
    text-decoration: underline;
}


.dash-online-indicator.is-mowing[b-y8cpjujqrl],    .map-legend-dot.is-mowing[b-y8cpjujqrl]    { background: var(--cc-state-mowing); }
.dash-online-indicator.is-idle[b-y8cpjujqrl],      .map-legend-dot.is-idle[b-y8cpjujqrl]      { background: var(--cc-state-idle); }
.dash-online-indicator.is-manual[b-y8cpjujqrl],    .map-legend-dot.is-manual[b-y8cpjujqrl]    { background: var(--cc-state-manual); }
.dash-online-indicator.is-recording[b-y8cpjujqrl], .map-legend-dot.is-recording[b-y8cpjujqrl] { background: var(--cc-state-recording); }
.dash-online-indicator.is-paused[b-y8cpjujqrl],    .map-legend-dot.is-paused[b-y8cpjujqrl]    { background: var(--cc-state-paused); }
.dash-online-indicator.is-faulted[b-y8cpjujqrl],   .map-legend-dot.is-faulted[b-y8cpjujqrl]   { background: var(--cc-state-faulted); }
.dash-online-indicator.is-ready[b-y8cpjujqrl],     .map-legend-dot.is-ready[b-y8cpjujqrl]     { background: var(--cc-state-ready); }
.dash-online-indicator.is-cleared[b-y8cpjujqrl],   .map-legend-dot.is-cleared[b-y8cpjujqrl]   { background: var(--cc-state-cleared); }
.dash-online-indicator.is-updating[b-y8cpjujqrl],  .map-legend-dot.is-updating[b-y8cpjujqrl]  { background: var(--cc-state-updating); }
.dash-online-indicator.is-offline[b-y8cpjujqrl],   .map-legend-dot.is-offline[b-y8cpjujqrl]   { background: var(--cc-state-offline); }

/* The unit identity dot itself is the shared .cc-unit-dot in cc-utilities.css
   (Monitor and the fleet-map marker card use the same one) — only its spacing
   beside the serial belongs to this page. */
.dash-online-serial .cc-unit-dot[b-y8cpjujqrl] { margin-right: 6px; }


/* Fixed widths — the boxes must not grow or shrink with the text inside them. */
.dash-filters[b-y8cpjujqrl]  .dash-filter-field {
    flex: 0 0 360px;
    width: 360px;
    min-width: 360px;
    max-width: 360px;
}
.mapmodal-actions[b-y8cpjujqrl]  .mapmodal-filter--search {
    flex: 0 0 320px;
    width: 320px;
    min-width: 320px;
    max-width: 320px;
}

/* Narrow screens: the fixed widths above would overrun a phone row, so the
   search boxes grow to fill it instead — never narrower than their placeholder
   (--cc-search-w), with min() keeping that floor inside a smaller container.
   Must stay AFTER the fixed-width rules: same specificity, so order decides. */
@media (max-width: 860px) {
    .dash-filters[b-y8cpjujqrl]  .dash-filter-field {
        flex: 1 1 var(--cc-search-w);
        width: auto;
        min-width: min(100%, var(--cc-search-w));
        max-width: none;
    }
}
@media (max-width: 768px) {
    .mapmodal-actions[b-y8cpjujqrl]  .mapmodal-filter--search {
        flex: 1 1 var(--cc-search-w);
        width: auto;
        min-width: min(100%, var(--cc-search-w));
        max-width: none;
    }
}
.mapmodal-actions[b-y8cpjujqrl]  .mapmodal-filter--online  { width: 120px; }
.mapmodal-actions[b-y8cpjujqrl]  .mapmodal-clear { flex: 0 0 auto; white-space: nowrap; }

/* ===== all-machines table: actions column / mower-down id row ===== */
.dash-table-card[b-y8cpjujqrl]  .dash-actions-col { width: 92px; text-align: right; }
.dash-mower-down-id[b-y8cpjujqrl] { gap: var(--cc-sp-3); }

/* ===== fleet-map marker card =================================================
   The Google InfoWindow that opens on a marker. Its markup is injected as raw
   HTML by wwwroot/Scripts/allMowersMap.js, so it never gets a CSS-isolation
   scope attribute — every rule has to reach it with ::deep from .mapmodal (the
   info window renders inside the map div). Google's own chrome is normalized
   first so the card can sit edge to edge inside the bubble. */

.mapmodal[b-y8cpjujqrl]  .gm-style-iw-c {
    padding: 0;
    border-radius: var(--cc-radius-lg);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
}

/* Google inlines overflow:auto + a max-height on the scroll wrapper. */
.mapmodal[b-y8cpjujqrl]  .gm-style-iw-d {
    overflow: hidden !important;
    max-height: none !important;
}

/* Newer Maps builds wrap the close button in its own flex row above the
   content; collapse that row and float the button over the card instead. The
   card header reserves --cc-mapcard-close-gutter so the title stays clear. */
.mapmodal[b-y8cpjujqrl]  .gm-style-iw-chr {
    height: 0;
    min-height: 0;
}

.mapmodal[b-y8cpjujqrl]  .gm-style-iw-c button.gm-ui-hover-effect {
    position: absolute !important; /* a flex child in the newer layout, absolute in the older */
    top: 0 !important;
    right: 0 !important;
    z-index: 2;
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard {
    --cc-mapcard-state: var(--cc-state-idle);
    --cc-mapcard-close-gutter: 30px;
    width: 252px;
    font-family: var(--cc-font-body);
    color: var(--cc-black);
    background: var(--cc-white);
}

/* State drives one custom property; the dot and the progress fill both read it,
   so the card, the Online AMRs list and the map legend share one scale. */
.mapmodal[b-y8cpjujqrl]  .cc-mapcard.is-mowing    { --cc-mapcard-state: var(--cc-state-mowing); }
.mapmodal[b-y8cpjujqrl]  .cc-mapcard.is-idle      { --cc-mapcard-state: var(--cc-state-idle); }
.mapmodal[b-y8cpjujqrl]  .cc-mapcard.is-manual    { --cc-mapcard-state: var(--cc-state-manual); }
.mapmodal[b-y8cpjujqrl]  .cc-mapcard.is-recording { --cc-mapcard-state: var(--cc-state-recording); }
.mapmodal[b-y8cpjujqrl]  .cc-mapcard.is-paused    { --cc-mapcard-state: var(--cc-state-paused); }
.mapmodal[b-y8cpjujqrl]  .cc-mapcard.is-faulted   { --cc-mapcard-state: var(--cc-state-faulted); }
.mapmodal[b-y8cpjujqrl]  .cc-mapcard.is-ready     { --cc-mapcard-state: var(--cc-state-ready); }
.mapmodal[b-y8cpjujqrl]  .cc-mapcard.is-cleared   { --cc-mapcard-state: var(--cc-state-cleared); }
.mapmodal[b-y8cpjujqrl]  .cc-mapcard.is-updating  { --cc-mapcard-state: var(--cc-state-updating); }
.mapmodal[b-y8cpjujqrl]  .cc-mapcard.is-offline   { --cc-mapcard-state: var(--cc-state-offline); }

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-head {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-4);
    padding: var(--cc-sp-5);
    padding-right: var(--cc-mapcard-close-gutter);
    border-bottom: 1px solid var(--cc-border-subtle);
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-glyph {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: var(--cc-radius-sm);
    background: var(--cc-bg);
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-glyph img {
    width: 26px;
    height: 26px;
    object-fit: contain;
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-heading {
    min-width: 0; /* lets the company name ellipsize instead of widening the card */
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-serial {
    font-family: var(--cc-font-heading);
    font-size: var(--cc-fs-md);
    line-height: 1.25;
}

/* --cc-gray-500 rather than the lighter --cc-medium-gray used by .dash-muted:
   this is 12px type on white and needs to stay legible over map imagery. */
.mapmodal[b-y8cpjujqrl]  .cc-mapcard-company {
    font-size: var(--cc-fs-xs);
    color: var(--cc-gray-500);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-status {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-3);
    padding: var(--cc-sp-4) var(--cc-sp-5) 0;
    font-size: var(--cc-fs-xs);
    font-weight: 700;
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-dot {
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--cc-mapcard-state);
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-pct {
    margin-left: auto;
    font-weight: 600;
    color: var(--cc-gray-500);
    font-variant-numeric: tabular-nums;
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-bar {
    height: 4px;
    margin: var(--cc-sp-3) var(--cc-sp-5) 0;
    border-radius: var(--cc-radius-sm);
    background: var(--cc-light-gray);
    overflow: hidden;
}

/* Width is the one genuinely data-driven value — set as a custom property on the
   element by allMowersMap.js and consumed here. */
.mapmodal[b-y8cpjujqrl]  .cc-mapcard-bar-fill {
    height: 100%;
    width: var(--cc-mapcard-pct, 0%);
    border-radius: inherit;
    background: var(--cc-mapcard-state);
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-rows {
    display: grid;
    gap: var(--cc-sp-2);
    padding: var(--cc-sp-5);
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: var(--cc-sp-5);
    align-items: baseline;
    font-size: var(--cc-fs-xs);
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-key {
    color: var(--cc-gray-500);
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-val {
    text-align: right;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Fault code links to /errors/code/{code} — the same target the fleet list uses. */
.mapmodal[b-y8cpjujqrl]  .cc-mapcard-link {
    color: var(--cc-red);
    text-decoration: none;
    font-variant-numeric: tabular-nums;
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-link:hover {
    text-decoration: underline;
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-foot {
    display: flex;
    gap: var(--cc-sp-3);
    padding: 0 var(--cc-sp-5) var(--cc-sp-5);
}

/* One shape for both actions. Live Monitor is an <a> (a plain URL, so Blazor's
   router handles it); Diagnostics stays a <button> because it has to stash the
   serial in sessionStorage first — so this resets both elements' defaults. */
.mapmodal[b-y8cpjujqrl]  .cc-mapcard-btn {
    flex: 1 1 0;
    padding: var(--cc-sp-4) var(--cc-sp-3);
    border: 1px solid transparent;
    border-radius: var(--cc-radius-sm);
    background: var(--cc-red);
    color: var(--cc-white);
    font-family: var(--cc-font-medium);
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-btn--ghost {
    background: var(--cc-white);
    border-color: var(--cc-gray-300);
    color: var(--cc-black);
}

/* Selectors stay mutually exclusive so neither hover state can outrank the other. */
.mapmodal[b-y8cpjujqrl]  .cc-mapcard-btn:not(.cc-mapcard-btn--ghost):hover:not(:disabled):not(.is-disabled) {
    background: var(--cc-red-hover);
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-btn--ghost:hover:not(:disabled) {
    background: var(--cc-hover-surface);
    border-color: var(--cc-gray-400);
}

/* Offline AMRs have nothing live to monitor or diagnose. .is-disabled covers the
   anchor, which can't carry the disabled attribute. */
.mapmodal[b-y8cpjujqrl]  .cc-mapcard-btn:disabled,
.mapmodal[b-y8cpjujqrl]  .cc-mapcard-btn.is-disabled {
    background: var(--cc-light-gray);
    border-color: transparent;
    color: var(--cc-gray-500);
    cursor: not-allowed;
}

.mapmodal[b-y8cpjujqrl]  .cc-mapcard-btn:focus-visible {
    outline: 2px solid var(--cc-black);
    outline-offset: 2px;
}
/* _content/SupportAppAMR/Components/Pages/Diagnostics/CaseDiagnostics.razor.rz.scp.css */
/* Error-code autocomplete min width. Class lands on the MudAutocomplete root,
   which doesn't carry this component's scoped-CSS attribute, so it goes through
   ::deep. No width token exists — keep px. Was inline Style="min-width: 280px;". */
.cc-case-search[b-5zzpwalk1x]  .cc-case-code-field {
    min-width: 280px;
}
/* _content/SupportAppAMR/Components/Pages/EngineHours.razor.rz.scp.css */
.eh-form-row[b-fk75xb6vnw]  .eh-serial-field {
    min-width: 200px;
}

.eh-form-row[b-fk75xb6vnw]  .eh-hours-field {
    min-width: 180px;
}

.eh-form-row[b-fk75xb6vnw]  .eh-submit-btn {
    align-self: stretch;
    margin: var(--cc-sp-3);
}
/* _content/SupportAppAMR/Components/Pages/Error.razor.rz.scp.css */
.cc-error-ref[b-u5q7tqb21d] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: var(--cc-sp-3);
    margin: var(--cc-sp-4) 0 0;
    font-size: var(--cc-fs-xs);
    color: var(--cc-medium-gray);
}

.cc-error-ref-label[b-u5q7tqb21d] {
    font-weight: 400;
}

.cc-error-ref-id[b-u5q7tqb21d] {
    color: var(--cc-danger-text);
    word-break: break-all;
    font-size: var(--cc-fs-xs);
}
/* _content/SupportAppAMR/Components/Pages/Errors/ErrorCategories.razor.rz.scp.css */
/* Category table column widths. These land on the <th> roots inside MudTable's
   rendered DOM, so they must go through ::deep. No exact width tokens — keep px. */
.cc-cat-card[b-gmrvecayld]  .cc-cat-col-order   { width: 110px; }
.cc-cat-card[b-gmrvecayld]  .cc-cat-col-active  { width: 110px; }
.cc-cat-card[b-gmrvecayld]  .cc-cat-col-inuse   { width: 90px; }
.cc-cat-card[b-gmrvecayld]  .cc-cat-col-actions { width: 150px; }

/* Order numeric field sizing — Class lands on the MudNumericField root. */
.cc-cat-card[b-gmrvecayld]  .cc-cat-order-field { max-width: 90px; }
/* _content/SupportAppAMR/Components/Pages/Errors/ErrorCodeDetail.razor.rz.scp.css */

.cc-section-toggle[b-lo8r5r2ycd] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-3);
    width: 100%;
    padding: 0;
    background: none;
    border: none;
    font: inherit;
    color: inherit;
    letter-spacing: inherit;
    text-align: left;
    cursor: pointer;
}

.cc-section-toggle-chevron[b-lo8r5r2ycd] { margin-left: auto; }
/* _content/SupportAppAMR/Components/Pages/Errors/ErrorCodeForm.razor.rz.scp.css */
/* Step-editor row indent. */
.cc-step-row[b-z1w9b0femu] {
    margin-left: calc(var(--cc-step-indent, 0) * var(--cc-sp-8));
}
/* _content/SupportAppAMR/Components/Pages/Errors/SystemErrors.razor.rz.scp.css */
/* Category tabs (All / IOB / LCD / …) stay on one line at every width, instead
   of the wrap that .cc-cat-tabs sets globally in cc-errors.css. These are plain
   elements in this .razor file, so they carry the scope attribute and no ::deep
   is needed — the scope alone outranks the global rule.
   The tab set is data-driven, so overflow-x is the safety net: if enough
   categories are added that they can't fit even condensed, the row scrolls
   sideways rather than clipping the last tabs out of reach. */
.cc-cat-tabs[b-pi6m46cuq3] {
    flex-wrap: nowrap;
    overflow-x: auto;
}

@media (max-width: 599.98px) {

    /* Condensed so the four tabs fit a phone without wrapping: the count badge
       and the horizontal padding cost more width here than the label text. */
    .cc-cat-tabs[b-pi6m46cuq3] {
        gap: 0;
    }

    .cc-cat-tab[b-pi6m46cuq3] {
        padding: var(--cc-sp-5) var(--cc-sp-3);
        font-size: var(--cc-fs-xs);
        gap: var(--cc-sp-2);
    }

    .cc-cat-tab-count[b-pi6m46cuq3] {
        min-width: 18px;
        height: 16px;
        padding: 0 var(--cc-sp-2);
    }

    .cc-page-head[b-pi6m46cuq3]  .cc-row-text {
        font-size: var(--cc-fs-xs);
        min-width: 0;
        flex: 0 1 auto;
        padding-inline: var(--cc-sp-2);
        line-height: 1.15;
        padding-block: var(--cc-sp-1);
    }

    .cc-page-head[b-pi6m46cuq3]  .cc-row-text .mud-button-icon-start {
        margin: var(--cc-sp-2);
    }

    .cc-page-head[b-pi6m46cuq3]  .cc-row-flex {
        flex: 1 1 100%;
        justify-content: center;
        align-items: center;
        flex-wrap: nowrap !important;
        min-width: 0;
        gap: var(--cc-sp-2);
    }
}
/* _content/SupportAppAMR/Components/Pages/Firmware.razor.rz.scp.css */
/* ICCID value with its carrier pill */
.fw-iccid[b-mmpzw84egy] {
    display: inline-flex;
    align-items: center;
    gap: var(--cc-sp-3);
}
/* _content/SupportAppAMR/Components/Pages/Help.razor.rz.scp.css */
.help-page[b-1yc5xbuxff] {
    padding: 1.5rem 1.5rem;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    position: relative;
}

/* Header Section — stays in the normal flow so it always occupies space above
   the cards. The cards then center in the remaining area below it, which makes
   it structurally impossible for them to overlap the title/subtitle (the
   earlier absolute-positioning approach let tall content ride up over it). */
.help-header[b-1yc5xbuxff] {
    text-align: center;
    max-width: 800px;
    margin: 0 auto 1rem;
    flex-shrink: 0;
}

.help-title[b-1yc5xbuxff] {
    font-size: calc(1.75rem + 1px);
    font-weight: 700;
    color: #000;
    margin-bottom: 0.25rem;
    font-family: var(--amr-font-title);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.help-subtitle[b-1yc5xbuxff] {
    font-size: calc(0.875rem + 1px);
    color: #666;
    margin: 0;
    font-family: var(--amr-font-body);
    line-height: 1.4;
}

/* Resources Grid — 3 columns (2 rows for all 6 cards) on desktop.
   Uses flex wrap with centered justification so a partial last row
   (e.g. 2 of 3 cards) centers on the page instead of left-aligning.
   Full rows still span the width exactly like a 3-column grid. */
.help-resources[b-1yc5xbuxff] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    flex: 1;
    /* Center the cards in the space below the header. "safe" keeps short
       content centered but, when the cards are too tall to fit, aligns them to
       the top of that space (and the page scrolls) instead of overflowing
       upward — so they never collide with the header. */
    align-content: safe center;
    /* Equal-height cards, per row, in pure CSS: flex items stretch to the
       tallest card on their line. */
    align-items: stretch;
}

/* Card takes a fixed 1/3 width so 3 fit per row; the 2rem accounts for the
   two 1rem gaps between three columns. */
.help-card[b-1yc5xbuxff] {
    flex: 0 0 calc((100% - 2rem) / 3);
    max-width: calc((100% - 2rem) / 3);
}

/* When exactly 4 cards are visible, drop to a 2x2 grid (1/2 width each)
   instead of 3-on-top + 1-centered. Any other count keeps the 1/3 layout
   (e.g. 5 cards → 3 on top, 2 centered). Desktop only — tablet/mobile
   breakpoints below already size cards for their column counts. */
@media (min-width: 993px) {
    .help-card:first-child:nth-last-child(4)[b-1yc5xbuxff],
    .help-card:first-child:nth-last-child(4) ~ .help-card[b-1yc5xbuxff] {
        flex-basis: calc((100% - 1rem) / 2 * 0.75);
        max-width: calc((100% - 1rem) / 2 * 0.75);
    }
}

/* Tablet / small laptop: 2 columns */
@media (max-width: 992px) {
    /* Below desktop, don't vertically center — stack the cards from the top
       so they sit directly under the header at their natural height. */
    .help-header[b-1yc5xbuxff] {
        max-width: none;
    }

    .help-resources[b-1yc5xbuxff] {
        flex: 0 1 auto;
        align-content: flex-start;
    }

    .help-card[b-1yc5xbuxff] {
        flex-basis: calc((100% - 1rem) / 2 * 0.75);
        max-width: calc((100% - 1rem) / 2 * 0.75);
    }
}

/* Mobile: single column — cards resize to full width and scroll vertically.
   (Header/vertical-centering reset is inherited from the ≤992px block above;
   each card stays at its natural content height — the equalizer JS skips
   this breakpoint.) */
@media (max-width: 600px) {
    .help-resources[b-1yc5xbuxff] {
        gap: 0.75rem;
    }

    .help-card[b-1yc5xbuxff] {
        flex-basis: 100%;
        max-width: 100%;
    }
}

/* Card Styling */
.help-card[b-1yc5xbuxff] {
    background: white;
    border-radius: 8px;
    padding: 1.25rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    transition: all 0.3s ease;
    border: 1px solid #e5e7eb;
    /* Height comes from the flex row: .help-resources { align-items: stretch }
       makes every card match the tallest card on its line. min-height:0 keeps
       the flex column from forcing a taller intrinsic height. */
    min-height: 0;
}

.help-card:hover[b-1yc5xbuxff] {
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}

.help-card-header[b-1yc5xbuxff] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    flex-shrink: 0;
}

.help-card-icon[b-1yc5xbuxff] {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f0f4f8;
    border-radius: 6px;
    color: var(--cc-red);
    position: relative;
    flex-shrink: 0;
}

.help-card-icon[b-1yc5xbuxff]  .help-card-icon-icon {
    font-size: 2.25em;
}

.beta-badge[b-1yc5xbuxff] {
    position: absolute;
    top: -8px;
    right: -8px;
    background: #ffa500;
    color: white;
    font-size: calc(0.65rem + 1px);
    font-weight: 700;
    padding: 0.25rem 0.5rem;
    border-radius: 12px;
    letter-spacing: 0.05em;
}

.help-card-title[b-1yc5xbuxff] {
    font-size: calc(0.95rem + 1px);
    font-weight: 700;
    color: #000;
    margin-bottom: 0;
    margin-top: 0;
    font-family: var(--amr-font-title);
    line-height: 1.2;
}

.help-card-description[b-1yc5xbuxff] {
    font-size: calc(0.8rem + 1px);
    color: #555;
    margin-bottom: 0.5rem;
    line-height: 1.4;
    flex-grow: 1;
    font-family: var(--amr-font-body);
}

.help-card-meta[b-1yc5xbuxff] {
    font-size: calc(0.75rem + 1px);
    color: #888;
    margin-bottom: 0.75rem;
    font-family: var(--amr-font-body);
}

.help-card-button[b-1yc5xbuxff] {
    display: inline-block;
    background: var(--cc-red);
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 4px;
    text-decoration: none;
    font-weight: 600;
    text-align: center;
    transition: all 0.3s ease;
    font-size: calc(0.8rem + 1px);
    font-family: var(--amr-font-body);
    border: 2px solid var(--cc-red);
    flex-shrink: 0;
}

.help-card-button:hover[b-1yc5xbuxff] {
    background: var(--cc-red-hover);
    border-color: var(--cc-red-hover);
    color: white;
    text-decoration: none;
}

.help-card-button:active[b-1yc5xbuxff] {
    background: #8a0a1d;
    border-color: #8a0a1d;
}

/* "Coming Soon" placeholder buttons: rendered as a real disabled <button>
   (not an hrefless <a>, which isn't focusable or interactive). Muted so it
   reads as unavailable, with no hover lift. */
.help-card-button:disabled[b-1yc5xbuxff],
.help-card-button:disabled:hover[b-1yc5xbuxff],
.help-card-button:disabled:active[b-1yc5xbuxff] {
    background: #e5e7eb;
    border-color: #e5e7eb;
    color: #9ca3af;
    cursor: not-allowed;
    transform: none;
}

/* AMR 1.2 download confirmation modal.
   Fixed overlay so the dialog lays on top of the cards instead of being an
   in-flow flex child of .help-page (which would push the cards up).
   No dimmed backdrop; the overlay stops at the top of the 60px layout footer
   so the bottom-anchored dialog sits above the footer rather than over it. */
.CcModal[b-1yc5xbuxff] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 60px;
    background: transparent;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    z-index: 1000;
    padding: 1rem;
    pointer-events: none;
}

.CcModal > *[b-1yc5xbuxff] {
    pointer-events: auto;
}

.amr-modal-dialog[b-1yc5xbuxff] {
    position: relative;
    background: white;
    border-radius: 8px;
    padding: 1.5rem;
    width: 100%;
    max-width: 420px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Focus-trap sentinels: focusable but visually absent. Tabbing onto one bounces
   focus to the opposite end of the dialog, keeping keyboard focus inside. */
.amr-modal-sentinel[b-1yc5xbuxff] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: 0;
    overflow: hidden;
    outline: none;
}

.amr-modal-close[b-1yc5xbuxff] {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    background: none;
    border: none;
    border-radius: 6px;
    font-size: calc(1.5rem + 1px);
    line-height: 1;
    color: #888;
    cursor: pointer;
    padding: 0;
    transition: background 0.2s ease, color 0.2s ease;
}

.amr-modal-close:hover[b-1yc5xbuxff] {
    background: #f0f4f8;
    color: #333;
}

.amr-modal-title[b-1yc5xbuxff] {
    margin: 0;
    padding-right: 1.5rem;
    font-size: calc(1.05rem + 1px);
    font-weight: 700;
    color: #000;
    font-family: var(--amr-font-title);
}

.amr-modal-message[b-1yc5xbuxff] {
    margin: 0;
    font-size: calc(0.85rem + 1px);
    color: #555;
    line-height: 1.5;
    font-family: var(--amr-font-body);
}

.amr-modal-actions[b-1yc5xbuxff] {
    display: flex;
    
}

.amr-modal-actions .help-card-button[b-1yc5xbuxff] {
    width: 100%;
    display: flex;
    
}

/* Contact Footer */
.help-footer[b-1yc5xbuxff] {
    background: #f8f9fa;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1400px;
    margin: 0 auto;
    flex-shrink: 0;
    font-size: calc(0.8rem + 1px);
}

@media (max-width: 768px) {
    .help-footer[b-1yc5xbuxff] {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
}

.help-footer-content[b-1yc5xbuxff] {
    flex: 1;
}

.help-footer-title[b-1yc5xbuxff] {
    font-size: calc(0.9rem + 1px);
    font-weight: 700;
    color: #000;
    margin: 0 0 0.25rem 0;
    font-family: var(--amr-font-title);
}

.help-footer-text[b-1yc5xbuxff] {
    color: #666;
    margin: 0;
    font-family: var(--amr-font-body);
    line-height: 1.4;
    font-size: calc(0.8rem + 1px);
}

.help-footer-contact[b-1yc5xbuxff] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

@media (max-width: 768px) {
    .help-footer-contact[b-1yc5xbuxff] {
        flex-direction: column;
        gap: 0.5rem;
    }
}

.help-contact-link[b-1yc5xbuxff] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--cc-red);
    text-decoration: none;
    font-weight: 600;
    font-family: var(--amr-font-body);
    transition: all 0.3s ease;
    font-size: calc(0.8rem + 1px);
}

.help-contact-link:hover[b-1yc5xbuxff] {
    color: var(--cc-red-hover);
    text-decoration: underline;
}

.help-contact-icon[b-1yc5xbuxff] {
    font-size: 0.9rem;
}

/* Responsive Adjustments */
@media (max-width: 1024px) {
    .help-page[b-1yc5xbuxff] {
        padding: 1rem 1rem;
    }
}

@media (max-width: 768px) {
    .help-page[b-1yc5xbuxff] {
        padding: 0.75rem 0.75rem;
    }
    
    .help-header[b-1yc5xbuxff] {
        margin-bottom: 0.75rem;
    }
    
    .help-title[b-1yc5xbuxff] {
        font-size: calc(1.25rem + 1px);
    }
    
    .help-subtitle[b-1yc5xbuxff] {
        font-size: calc(0.75rem + 1px);
    }
}
/* _content/SupportAppAMR/Components/Pages/Login.razor.rz.scp.css */


.login-page[b-7v85159aky] {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--cc-sp-6);
}

.login-page[b-7v85159aky]::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 62% 58% at 50% 46%,
        rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0) 70%);
    pointer-events: none;
}

.login-card[b-7v85159aky] {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 860px;
    max-height: 100%;
    min-height: 0;
    display: grid;
    grid-template-columns: 0.58fr 1fr;
    background: var(--cc-white);
    border: 1px solid var(--cc-gray-200);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--cc-shadow-card);
    animation: login-card-in-b-7v85159aky 0.45s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}

@keyframes login-card-in-b-7v85159aky {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: none; }
}

.login-rail[b-7v85159aky] {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: var(--cc-sp-8);
    background-color: var(--cc-black);
    
    background-image:
        /* scrim: darker at top (for the logo) and bottom, clear through the middle
           so the machine reads */
        linear-gradient(180deg,
            rgba(0, 0, 0, 0.62) 0%,
            rgba(0, 0, 0, 0.22) 26%,
            rgba(0, 0, 0, 0.04) 54%,
            rgba(0, 0, 0, 0.48) 100%),
        url('Images/AMR_Product.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-origin: border-box;
}

.login-rail[b-7v85159aky]::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: 4px;
    background: linear-gradient(180deg, var(--cc-red), var(--cc-red-hover));
}


.login-rail-logo[b-7v85159aky] {
    position: relative;
    z-index: 1;
}

.login-rail-logo img[b-7v85159aky] {
    display: block;
    width: 100%;
    max-width: 200px;
    height: auto;
    filter: drop-shadow(0 2px 10px rgba(0, 0, 0, 0.55));
}

/* ---- Right form pane ---- */
.login-pane[b-7v85159aky] {
    padding: 34px 40px 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.login-title[b-7v85159aky] {
    margin: 0;
    text-align: left;
    font-family: var(--cc-font-display);
    font-size: clamp(20px, 3.4dvh, 27px);
    font-weight: 800;
    letter-spacing: -0.015em;
    color: var(--cc-black);
    line-height: 1.15;
}

#login-form[b-7v85159aky] {
    margin-top: clamp(var(--cc-sp-5), 2.4dvh, 22px);
}

/* ---- Inline error banner (dark text on a red tint — light-surface pattern) ---- */
.login-error[b-7v85159aky] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-4);
    margin-bottom: var(--cc-sp-6);
    padding: var(--cc-sp-5) var(--cc-sp-6);
    border-radius: var(--cc-radius-md);
    background: rgba(var(--cc-red-rgb), 0.08);
    border: 1px solid rgba(var(--cc-red-rgb), 0.28);
    color: var(--cc-danger-text);
    font-size: var(--cc-fs-sm);
    font-weight: 600;
    line-height: 1.4;
}

.login-error i[b-7v85159aky] {
    font-size: var(--cc-fs-md);
    color: var(--cc-red);
    flex-shrink: 0;
}

/* ---- Field group ---- */
.login-field[b-7v85159aky] {
    margin-bottom: clamp(var(--cc-sp-4), 2dvh, var(--cc-sp-7));
}

.login-label[b-7v85159aky] {
    display: block;
    margin-bottom: var(--cc-sp-3);
    font-family: var(--cc-font-medium);
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--cc-dark-gray);
}

.login-input-wrap[b-7v85159aky] {
    position: relative;
    width: 100%;
}

.login-input[b-7v85159aky] {
    width: 100%;
    height: clamp(40px, 6.2dvh, 50px);
    padding: 0 var(--cc-sp-8) 0 42px;
    border: 1px solid var(--cc-gray-300);
    border-radius: 11px;
    background: #fbfbfc;
    color: var(--cc-black);
    font-size: var(--cc-fs-lg);
    transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}

.login-input.has-toggle[b-7v85159aky] {
    padding-right: 44px;
}

.login-input[b-7v85159aky]::placeholder {
    color: var(--cc-medium-gray);
}

.login-input:hover[b-7v85159aky] {
    border-color: var(--cc-gray-400);
}

.login-input:focus[b-7v85159aky] {
    outline: none;
    border-color: var(--cc-red);
    background: var(--cc-white);
    box-shadow: 0 0 0 4px rgba(var(--cc-red-rgb), 0.14);
}

.login-input:-webkit-autofill[b-7v85159aky],
.login-input:-webkit-autofill:hover[b-7v85159aky],
.login-input:-webkit-autofill:focus[b-7v85159aky] {
    -webkit-text-fill-color: var(--cc-black);
    -webkit-box-shadow: 0 0 0 1000px #fbfbfc inset;
    caret-color: var(--cc-black);
}

.login-input-icon[b-7v85159aky] {
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
    color: var(--cc-gray-400);
    font-size: var(--cc-fs-md);
    pointer-events: none;
}

.login-input-toggle[b-7v85159aky] {
    position: absolute;
    top: 50%;
    right: 6px;
    transform: translateY(-50%);
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: transparent;
    color: var(--cc-gray-400);
    cursor: pointer;
    border-radius: var(--cc-radius-sm);
    transition: color 0.16s ease, background 0.16s ease;
}

.login-input-toggle:hover[b-7v85159aky] {
    color: var(--cc-dark-gray);
    background: var(--cc-light-gray);
}

.login-label-row[b-7v85159aky] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cc-sp-4);
    margin-bottom: var(--cc-sp-3);
}

.login-label-row .login-label[b-7v85159aky] {
    margin-bottom: 0;
}

.login-capslock[b-7v85159aky] {
    display: inline-flex;
    align-items: center;
    gap: var(--cc-sp-2);
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    letter-spacing: 0.03em;
    color: var(--cc-warning-text);
    visibility: hidden;
}

.login-capslock.is-on[b-7v85159aky] {
    visibility: visible;
}

.login-capslock i[b-7v85159aky] {
    font-size: var(--cc-fs-xs);
}

.login-options[b-7v85159aky] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cc-sp-5);
    margin-bottom: clamp(var(--cc-sp-4), 2dvh, var(--cc-sp-7));
}

.login-remember[b-7v85159aky] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-3);
    cursor: pointer;
    user-select: none;
    font-size: var(--cc-fs-sm);
    font-weight: 600;
    color: var(--cc-dark-gray);
}

.login-checkbox[b-7v85159aky] {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: var(--cc-red);
    cursor: pointer;
}

.login-forgot[b-7v85159aky] {
    padding: 0;
    border: none;
    background: none;
    cursor: pointer;
    font-size: var(--cc-fs-xs);
    font-weight: 600;
    color: rgba(255, 255, 255, 0.60);
    text-decoration: none;
    transition: color 0.18s ease;
    font-size: var(--cc-fs-sm);
    font-weight: 700;
    color: var(--cc-red);
    transition: color 0.16s ease;
}

.login-forgot:hover[b-7v85159aky] {
    color: var(--cc-red-hover);
    text-decoration: underline;
}

/* ---- Keyboard focus visibility (dark outline reads on both the white pane
       and the red submit button) ---- */
.login-input-toggle:focus-visible[b-7v85159aky],
.login-forgot:focus-visible[b-7v85159aky],
.login-checkbox:focus-visible[b-7v85159aky],
.login-submit:focus-visible[b-7v85159aky] {
    outline: 2px solid var(--cc-black);
    outline-offset: 2px;
}

.login-error:focus-visible[b-7v85159aky] {
    outline: none;
}

/* ---- Submit — brand CTA ---- */
.login-submit[b-7v85159aky] {
    position: relative;
    width: 100%;
    height: clamp(42px, 6.4dvh, 52px);
    margin-top: var(--cc-sp-3);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: none;
    border-radius: 12px;
    background: linear-gradient(180deg, var(--cc-red), var(--cc-red-hover));
    color: var(--cc-white);
    font-family: var(--cc-font-heading);
    font-size: var(--cc-fs-lg);
    font-weight: 700;
    letter-spacing: 0.06em;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(var(--cc-red-rgb), 0.28);
    transition: transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease;
}

.login-submit:hover[b-7v85159aky] {
    transform: translateY(-1px);
    box-shadow: 0 12px 26px rgba(var(--cc-red-rgb), 0.34);
    filter: brightness(1.03);
}

.login-submit:active[b-7v85159aky] {
    transform: translateY(0);
}

.login-submit:disabled[b-7v85159aky] {
    background: var(--cc-medium-gray);
    box-shadow: none;
    filter: none;
    transform: none;
    cursor: not-allowed;
}

.btn-progress[b-7v85159aky] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 3px;
    overflow: hidden;
    opacity: 0;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    transition: opacity 0.18s ease;
}

.btn-progress[b-7v85159aky]::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 40%;
    background: rgba(255, 255, 255, 0.92);
    transform: translateX(-120%);
}

.login-submit.is-loading .btn-progress[b-7v85159aky] {
    opacity: 1;
}

.login-submit.is-loading .btn-progress[b-7v85159aky]::before {
    animation: login-progress-sweep-b-7v85159aky 1s ease-in-out infinite;
}

.login-submit.is-loading:disabled[b-7v85159aky] {
    background: linear-gradient(180deg, var(--cc-red), var(--cc-red-hover));
    filter: brightness(0.96);
    cursor: progress;
}

@keyframes login-progress-sweep-b-7v85159aky {
    0%   { transform: translateX(-120%); }
    100% { transform: translateX(320%); }
}

/* ---- Small print ---- */
.login-terms[b-7v85159aky] {
    margin: clamp(var(--cc-sp-5), 2dvh, 20px) 0 0 0;
    text-align: left;
    font-size: var(--cc-fs-xs);
    line-height: 1.55;
    color: var(--cc-medium-gray);
}

.login-terms a[b-7v85159aky] {
    color: var(--cc-dark-gray);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.login-terms a:hover[b-7v85159aky] {
    color: var(--cc-black);
}

@media (max-width: 767.98px) {
    .login-card[b-7v85159aky] {
        grid-template-columns: 1fr;
        max-width: 452px;
    }

    .login-rail[b-7v85159aky] {
        min-height: 0;
        padding: var(--cc-sp-7);
        background-color: var(--cc-dark-gray);
        background-image: none;
    }

    /* Red seam moves to the bottom edge of the stacked rail. */
    .login-rail[b-7v85159aky]::after {
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        width: auto;
        height: 4px;
        background: linear-gradient(90deg, var(--cc-red), var(--cc-red-hover));
    }

    .login-rail-logo[b-7v85159aky] {
        padding: 0;
    }

    .login-rail-logo img[b-7v85159aky] {
        max-width: 250px;
    }

    .login-pane[b-7v85159aky] {
        padding: clamp(var(--cc-sp-6), 3dvh, 34px) 40px clamp(var(--cc-sp-6), 2.6dvh, 30px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .login-input[b-7v85159aky],
    .login-input-toggle[b-7v85159aky],
    .login-submit[b-7v85159aky],
    .login-forgot[b-7v85159aky],
    .btn-progress[b-7v85159aky] {
        transition: none;
    }

    .login-card[b-7v85159aky] {
        animation: none;
    }

    .login-submit:hover[b-7v85159aky] {
        transform: none;
    }

    /* Reduced motion: show a static filled bar instead of the sweep. */
    .login-submit.is-loading .btn-progress[b-7v85159aky]::before {
        animation: none;
        width: 100%;
        transform: none;
    }
}
/* _content/SupportAppAMR/Components/Pages/Logs.razor.rz.scp.css */
.logs-context[b-6dkyxx1xjg] {
    justify-content: flex-start;
    gap: var(--cc-sp-5);
}

.logs-status-pill[b-6dkyxx1xjg] {
    display: inline-flex;
    align-items: center;
    gap: var(--cc-sp-4);
    height: 38px;
    padding: 0 var(--cc-sp-6);
    border: 1px solid var(--cc-light-gray);
    border-radius: var(--cc-radius-md);
    background: var(--cc-white);
    font-family: var(--cc-font-heading);
    font-size: var(--cc-fs-md);
    font-weight: 800;
    letter-spacing: 0.02em;
}

.logs-status-dot[b-6dkyxx1xjg] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--cc-medium-gray);
    display: inline-block;
}

.logs-status-pill.is-online[b-6dkyxx1xjg] { color: var(--cc-success-text); }
.logs-status-pill.is-online .logs-status-dot[b-6dkyxx1xjg] { background: var(--cc-success); }
.logs-status-pill.is-offline[b-6dkyxx1xjg] { color: var(--cc-medium-gray); }
.logs-status-pill.is-offline .logs-status-dot[b-6dkyxx1xjg] { background: var(--cc-state-offline); }

.logs-release[b-6dkyxx1xjg] {
    display: inline-flex;
    align-items: center;
    gap: var(--cc-sp-4);
    height: 38px;
    padding: 0 var(--cc-sp-6);
    border: 1px solid var(--cc-light-gray);
    border-radius: var(--cc-radius-md);
    background: var(--cc-white);
}

.logs-release-key[b-6dkyxx1xjg] {
    font-family: var(--cc-font-heading);
    font-size: var(--cc-fs-xs);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--cc-medium-gray);
}

.logs-release-value[b-6dkyxx1xjg] {
    font-family: "JetBrains Mono", "Fira Code", monospace;
    font-size: var(--cc-fs-md);
    font-weight: 700;
    color: var(--cc-black);
}

.logs-notice[b-6dkyxx1xjg] {
    margin: 0;
    font-size: var(--cc-fs-sm);
    color: var(--cc-dark-gray);
}

.logs-metric-grid[b-6dkyxx1xjg] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--cc-sp-5);
}

.logs-metric[b-6dkyxx1xjg] {
    min-height: 118px;
}

.logs-metric-value[b-6dkyxx1xjg] {
    font-size: var(--cc-fs-display-sm);
    color: var(--cc-black);
    overflow-wrap: anywhere;
}

.logs-metric.is-good[b-6dkyxx1xjg] { border-color: var(--cc-success); border-width: 3px; }
.logs-metric.is-warn[b-6dkyxx1xjg] { border-color: var(--cc-warning); border-width: 3px; }
.logs-metric.is-bad[b-6dkyxx1xjg]  { border-color: var(--cc-danger);  border-width: 3px; }

.logs-metric.is-good .logs-metric-value[b-6dkyxx1xjg] { color: var(--cc-success-text); }
.logs-metric.is-warn .logs-metric-value[b-6dkyxx1xjg] { color: var(--cc-warning-text); }
.logs-metric.is-bad  .logs-metric-value[b-6dkyxx1xjg] { color: var(--cc-danger-text); }

.logs-header-alert[b-6dkyxx1xjg] {
    color: var(--cc-red);
}

.logs-fault-name[b-6dkyxx1xjg] {
    font-size: var(--cc-fs-md);
    font-weight: 700;
    color: var(--cc-black);
    overflow-wrap: anywhere;
}

.logs-fault-detail[b-6dkyxx1xjg] {
    margin: 0;
    font-size: var(--cc-fs-sm);
    line-height: 1.6;
    color: var(--cc-dark-gray);
    white-space: pre-wrap;
    word-break: break-word;
}

.logs-fault-card[b-6dkyxx1xjg]  .mud-expand-panel {
    background: transparent;
    border-bottom: 1px solid var(--cc-border-subtle);
}

.logs-fault-card[b-6dkyxx1xjg]  .mud-expand-panel:last-child { border-bottom: none; }

.logs-workspace[b-6dkyxx1xjg] {
    --logs-card-h: 700px;

    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
    gap: var(--cc-sp-5);
}

@media (max-width: 1400px) {
    .logs-workspace[b-6dkyxx1xjg] { grid-template-columns: minmax(0, 1fr); }
}

.logs-tabcard[b-6dkyxx1xjg],
.logs-stream[b-6dkyxx1xjg] {
    height: var(--logs-card-h);
    display: flex;
    flex-direction: column;
}

.logs-tabcard[b-6dkyxx1xjg]  .mud-tabs,
.logs-tabcard[b-6dkyxx1xjg]  .mud-tabs-panels,
.logs-tabcard[b-6dkyxx1xjg]  .mud-tab-panel,
.logs-tabcard[b-6dkyxx1xjg]  .mud-data-grid,
.logs-stream[b-6dkyxx1xjg]  .mud-data-grid {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.logs-tabcard[b-6dkyxx1xjg]  .mud-table-container,
.logs-stream[b-6dkyxx1xjg]  .mud-table-container {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.logs-tabcard[b-6dkyxx1xjg]  .mud-tabs-tabbar {
    border-bottom: 2px solid var(--cc-black);
    min-height: 52px;
}

.logs-tabcard[b-6dkyxx1xjg]  .mud-tab {
    font-family: var(--cc-font-heading);
    font-size: var(--cc-fs-xs);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--cc-dark-gray);
    min-height: 52px;
}

.logs-tabcard[b-6dkyxx1xjg]  .mud-tab.mud-tab-active { color: var(--cc-red); }
.logs-tabcard[b-6dkyxx1xjg]  .mud-tab-slider { background-color: var(--cc-red) !important; }

.logs-search[b-6dkyxx1xjg] {
    padding: var(--cc-sp-5) var(--cc-sp-7);
    border-bottom: 1px solid var(--cc-border-subtle);
}

.logs-group-tabs[b-6dkyxx1xjg] {
    padding: 0 var(--cc-sp-5);
}

.logs-group-tabs[b-6dkyxx1xjg]  .cc-cat-tab {
    padding: var(--cc-sp-5) var(--cc-sp-5);
    font-size: var(--cc-fs-sm);
}

.logs-kv[b-6dkyxx1xjg] {
    margin: 0;
}

.logs-kv-row[b-6dkyxx1xjg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cc-sp-5);
    padding: var(--cc-sp-6) var(--cc-sp-7);
    border-bottom: 1px solid var(--cc-border-subtle);
}

.logs-kv-row:last-child[b-6dkyxx1xjg] { border-bottom: none; }

.logs-kv-row dt[b-6dkyxx1xjg] {
    font-family: var(--cc-font-heading);
    font-size: var(--cc-fs-xs);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--cc-dark-gray);
}

.logs-kv-row dd[b-6dkyxx1xjg] {
    margin: 0;
    font-size: var(--cc-fs-md);
    color: var(--cc-black);
}

.logs-stream[b-6dkyxx1xjg]  .logs-col-time { width: 130px; white-space: nowrap; }
.logs-stream[b-6dkyxx1xjg]  .logs-col-value { width: 130px; }
/* _content/SupportAppAMR/Components/Pages/Maintenance.razor.rz.scp.css */
/* ---------- page head tools ---------- */

.mt-head-tools[b-w6539i9pq3] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-3);
    flex-wrap: wrap;
}

.mt-search-wrap[b-w6539i9pq3]  .fleet-search {
    width: 380px;
    max-width: 100%;
}

/* Detail head actions — squared, uppercase-tracked buttons; All Machines is
   a black outline, Log Service keeps the brand fill. */
.mt-head-actions[b-w6539i9pq3]  .mud-button-root {
    border-radius: 0;
    font-weight: 700;
    letter-spacing: 0.06em;
    padding: var(--cc-sp-4) var(--cc-sp-7);
}

.mt-head-actions[b-w6539i9pq3]  .mt-btn-machines {
    border: 1px solid var(--cc-black);
    color: var(--cc-black);
}

/* Download-report icon button — squared outline matching the head buttons.
   Padding overrides the wide .mud-button-root rule above so it stays square. */
.mt-head-actions[b-w6539i9pq3]  .mt-report-btn {
    border: 1px solid var(--cc-black);
    border-radius: 0;
    color: var(--cc-black);
    padding: var(--cc-sp-4);
}

/* ---------- shared progress bar (board cards) ---------- */

.mt-bar[b-w6539i9pq3] {
    height: 6px;
    border-radius: var(--cc-radius-sm);
    background: var(--cc-light-gray);
    overflow: hidden;
}

.mt-bar > span[b-w6539i9pq3] {
    display: block;
    height: 100%;
    border-radius: inherit;
    width: calc(var(--mt-frac, 0) * 100%);
}

.mt-bar.is-danger  > span[b-w6539i9pq3] { background: var(--cc-danger); }
.mt-bar.is-warn    > span[b-w6539i9pq3] { background: var(--cc-warning-solid); }
.mt-bar.is-ok      > span[b-w6539i9pq3] { background: var(--cc-success-solid); }
.mt-bar.is-neutral > span[b-w6539i9pq3] { background: var(--cc-gray-400); }

/* ---------- board view ---------- */

.mt-board[b-w6539i9pq3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--cc-sp-3);
    align-items: start;
}

/* Open lanes on the page surface — the status color lives in the header's
   underline (and dot), the white cards float below. No gray-in-gray boxes. */
.mt-board-col[b-w6539i9pq3] {
    display: flex;
    flex-direction: column;
    gap: var(--cc-sp-2);
}

.mt-board-col-head[b-w6539i9pq3] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-2);
    padding: var(--cc-sp-1) var(--cc-sp-1) var(--cc-sp-2);
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--cc-black);
    border-bottom: 2px solid var(--cc-gray-300);
}

.mt-board-col-head.is-danger[b-w6539i9pq3]  { border-bottom-color: var(--cc-danger); }
.mt-board-col-head.is-warn[b-w6539i9pq3]    { border-bottom-color: var(--cc-warning-solid); }
.mt-board-col-head.is-ok[b-w6539i9pq3]      { border-bottom-color: var(--cc-success-solid); }
.mt-board-col-head.is-neutral[b-w6539i9pq3] { border-bottom-color: var(--cc-gray-400); }

.mt-board-dot[b-w6539i9pq3] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex: none;
}

.mt-board-dot.is-danger[b-w6539i9pq3]  { background: var(--cc-danger); }
.mt-board-dot.is-warn[b-w6539i9pq3]    { background: var(--cc-warning-solid); }
.mt-board-dot.is-ok[b-w6539i9pq3]      { background: var(--cc-success-solid); }
.mt-board-dot.is-neutral[b-w6539i9pq3] { background: var(--cc-gray-400); }

.mt-board-col-count[b-w6539i9pq3] {
    margin-left: auto;
    color: var(--cc-dark-gray);
}

.mt-board-empty[b-w6539i9pq3] {
    padding: var(--cc-sp-4);
    text-align: center;
    font-size: var(--cc-fs-sm);
    color: var(--cc-medium-gray);
    border: 1px dashed var(--cc-gray-300);
}

.mt-card[b-w6539i9pq3] {
    background: var(--cc-white);
    border: 1px solid var(--cc-border-subtle);
    border-radius: var(--cc-radius-md);
    padding: var(--cc-sp-3);
    display: flex;
    flex-direction: column;
    gap: var(--cc-sp-2);
    cursor: pointer;
    transition: box-shadow 120ms ease, transform 120ms ease, border-color 120ms ease;
}

.mt-card:hover[b-w6539i9pq3],
.mt-card:focus-visible[b-w6539i9pq3] {
    border-color: var(--cc-gray-400);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.10);
    transform: translateY(-1px);
}

.mt-card-top[b-w6539i9pq3] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--cc-sp-2);
}

.mt-card-serial[b-w6539i9pq3] {
    font-weight: 700;
    font-size: var(--cc-fs-md);
}

.mt-card-hours[b-w6539i9pq3] {
    font-size: var(--cc-fs-sm);
    color: var(--cc-dark-gray);
    font-variant-numeric: tabular-nums;
}

.mt-card-company[b-w6539i9pq3] {
    font-size: var(--cc-fs-sm);
    color: var(--cc-dark-gray);
}

.mt-card-foot[b-w6539i9pq3] {
    display: flex;
    justify-content: space-between;
    gap: var(--cc-sp-2);
    font-size: var(--cc-fs-xs);
    color: var(--cc-dark-gray);
}

.mt-card-branch[b-w6539i9pq3] {
    text-align: right;
    flex: none;
}

/* ---------- table view affordances ---------- */

.mt-overview[b-w6539i9pq3]  .mt-row {
    cursor: pointer;
}

/* Status chips — same uppercase treatment as the Admin tables
   (.cc-admin-context .mud-chip), which this page sits outside of. */
.mt-overview[b-w6539i9pq3]  .mud-chip {
    font-family: var(--cc-font-heading);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.mt-row-chevron[b-w6539i9pq3]  .mud-icon-root {
    color: var(--cc-medium-gray);
}

/* ---------- detail layout ---------- */

/* Side column is capped so the intervals table keeps the template's ~70/30 split
   on wide screens instead of splitting the page in half. */
.mt-detail-grid[b-w6539i9pq3] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
    gap: var(--cc-sp-3);
    align-items: start;
}

.mt-main[b-w6539i9pq3],
.mt-side[b-w6539i9pq3] {
    display: flex;
    flex-direction: column;
    gap: var(--cc-sp-3);
    min-width: 0;
}

@media (max-width: 960px) {
    .mt-detail-grid[b-w6539i9pq3] {
        grid-template-columns: 1fr;
    }

    .mt-search-wrap[b-w6539i9pq3]  .fleet-search {
        width: 100%;
    }
}

/* ---------- service intervals table ---------- */

.mt-ivl[b-w6539i9pq3] {
    display: flex;
    flex-direction: column;
}

/* Task column dominates (~55%), like the template; values right of it share
   the rest, action hugs the edge. */
.mt-ivl-cols[b-w6539i9pq3],
.mt-ivl-task[b-w6539i9pq3] {
    display: grid;
    grid-template-columns: minmax(0, 6fr) minmax(0, 2fr) minmax(0, 2fr) 80px;
    gap: var(--cc-sp-3);
    align-items: center;
    padding: var(--cc-sp-3) var(--cc-sp-5);
}

.mt-ivl-cols[b-w6539i9pq3] {
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--cc-dark-gray);
    background: var(--cc-bg);
    border-bottom: 1px solid var(--cc-border-subtle);
}

.mt-ivl-col-action[b-w6539i9pq3] {
    text-align: right;
}

/* Group rows sit on white with a colored status stripe — status is carried by
   color, not by a gray band. Inset shadow so the stripe adds no layout shift. */
.mt-ivl-group[b-w6539i9pq3] {
    /* full-width reset of the native button */
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cc-sp-3);
    width: 100%;
    padding: var(--cc-sp-4) var(--cc-sp-5);
    background: var(--cc-white);
    border: 0;
    border-top: 1px solid var(--cc-border-subtle);
    text-align: left;
    font: inherit;
    color: inherit;
    cursor: pointer;
}

.mt-ivl-group.is-danger[b-w6539i9pq3]  { box-shadow: inset 3px 0 0 var(--cc-danger); }
.mt-ivl-group.is-warn[b-w6539i9pq3]    { box-shadow: inset 3px 0 0 var(--cc-warning-solid); }
.mt-ivl-group.is-ok[b-w6539i9pq3]      { box-shadow: inset 3px 0 0 var(--cc-success-solid); }
.mt-ivl-group.is-neutral[b-w6539i9pq3] { box-shadow: inset 3px 0 0 var(--cc-gray-400); }

.mt-ivl-group:first-of-type[b-w6539i9pq3] {
    border-top: 0;
}

.mt-ivl-group:hover[b-w6539i9pq3] {
    background: var(--cc-hover-surface);
}

.mt-ivl-group-name[b-w6539i9pq3] {
    font-size: var(--cc-fs-lg);
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: var(--cc-sp-3);
    min-width: 0;
}

.mt-ivl-group-count[b-w6539i9pq3] {
    font-weight: 400;
    color: var(--cc-medium-gray);
}

.mt-ivl-group-end[b-w6539i9pq3] {
    display: inline-flex;
    align-items: center;
    gap: var(--cc-sp-4);
    flex: none;
}

.mt-ivl-group-summary[b-w6539i9pq3] {
    font-size: var(--cc-fs-md);
    color: var(--cc-dark-gray);
}

.mt-ivl-group.is-danger .mt-ivl-group-summary[b-w6539i9pq3] {
    color: var(--cc-danger-text);
    font-weight: 600;
}

/* CSS-only chevron; points down when collapsed, up when open. */
.mt-ivl-caret[b-w6539i9pq3] {
    width: 8px;
    height: 8px;
    flex: none;
    border-right: 2px solid var(--cc-medium-gray);
    border-bottom: 2px solid var(--cc-medium-gray);
    transform: rotate(45deg) translateY(-2px);
    transition: transform 120ms ease;
}

.mt-ivl-caret.is-open[b-w6539i9pq3] {
    transform: rotate(225deg) translateY(-2px);
}

.mt-ivl-task[b-w6539i9pq3] {
    border-top: 1px solid var(--cc-border-subtle);
    font-size: var(--cc-fs-lg);
    padding-top: var(--cc-sp-5);
    padding-bottom: var(--cc-sp-5);
}

.mt-ivl-task-name[b-w6539i9pq3] {
    font-weight: 700;
    min-width: 0;
}

.mt-ivl-last[b-w6539i9pq3] {
    color: var(--cc-dark-gray);
    font-variant-numeric: tabular-nums;
}

.mt-ivl-next[b-w6539i9pq3] {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    color: var(--cc-black);
}

.mt-ivl-next.is-danger[b-w6539i9pq3] {
    color: var(--cc-danger-text);
    font-weight: 700;
}

.mt-ivl-action[b-w6539i9pq3] {
    text-align: right;
}

/* LOG action — dark underlined link that turns brand-red on the row that
   needs attention (and on hover). */
.mt-ivl-log[b-w6539i9pq3] {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    font-size: var(--cc-fs-sm);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--cc-black);
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

.mt-ivl-log:hover[b-w6539i9pq3] {
    color: var(--cc-red-hover);
}

.mt-ivl-log.is-danger[b-w6539i9pq3] {
    color: var(--cc-danger-text);
}

@media (max-width: 700px) {
    .mt-ivl-cols[b-w6539i9pq3],
    .mt-ivl-task[b-w6539i9pq3] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 48px;
    }

    .mt-ivl-cols span:nth-child(2)[b-w6539i9pq3],
    .mt-ivl-last[b-w6539i9pq3] {
        display: none;
    }
}

/* ---------- red text-link (Log, All N records) ---------- */

.mt-link[b-w6539i9pq3] {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    font-size: var(--cc-fs-sm);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--cc-red);
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

.mt-link:hover[b-w6539i9pq3] {
    color: var(--cc-red-hover);
}

/* ---------- dealer card ---------- */

.mt-dealer-body[b-w6539i9pq3] {
    padding: var(--cc-sp-4);
    display: flex;
    flex-direction: column;
    gap: var(--cc-sp-2);
}

.mt-dealer-line[b-w6539i9pq3] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-2);
}

.mt-dealer-line[b-w6539i9pq3]  .mud-icon-root {
    color: var(--cc-medium-gray);
}

.mt-note[b-w6539i9pq3] {
    display: inline-flex;
    align-items: center;
    margin-left: var(--cc-sp-1);
    vertical-align: middle;
}

.mt-note[b-w6539i9pq3]  .mud-icon-root {
    color: var(--cc-medium-gray);
    font-size: 1rem;
}

/* ---------- recent work (full-width card under the grid) ---------- */

.mt-rw-cols[b-w6539i9pq3],
.mt-rw-row[b-w6539i9pq3] {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr) 220px;
    gap: var(--cc-sp-4);
    align-items: start;
    padding: var(--cc-sp-3) var(--cc-sp-5);
}

.mt-rw-cols[b-w6539i9pq3] {
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--cc-dark-gray);
    background: var(--cc-bg);
    border-bottom: 1px solid var(--cc-border-subtle);
}

.mt-rw-row[b-w6539i9pq3] {
    padding-top: var(--cc-sp-5);
    padding-bottom: var(--cc-sp-5);
    font-size: var(--cc-fs-lg);
}

.mt-rw-row + .mt-rw-row[b-w6539i9pq3] {
    border-top: 1px solid var(--cc-border-subtle);
}

.mt-rw-hours[b-w6539i9pq3] {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.mt-rw-title[b-w6539i9pq3] {
    color: var(--cc-black);
}

.mt-rw-note[b-w6539i9pq3] {
    margin-top: var(--cc-sp-1);
    font-size: var(--cc-fs-md);
    color: var(--cc-medium-gray);
}

.mt-rw-by[b-w6539i9pq3] {
    display: flex;
    flex-direction: column;
    gap: var(--cc-sp-1);
    font-size: var(--cc-fs-md);
    color: var(--cc-dark-gray);
}

@media (max-width: 700px) {
    .mt-rw-cols[b-w6539i9pq3],
    .mt-rw-row[b-w6539i9pq3] {
        grid-template-columns: 72px minmax(0, 1fr);
    }

    .mt-rw-cols span:nth-child(3)[b-w6539i9pq3] {
        display: none;
    }

    .mt-rw-by[b-w6539i9pq3] {
        grid-column: 2;
        flex-direction: row;
        flex-wrap: wrap;
        gap: var(--cc-sp-3);
    }
}

/* "All N records" header link — red like mt-link but not underlined. */
.mt-hist-link[b-w6539i9pq3] {
    text-decoration: none;
}

/* ---------- square off the Command Center chrome on this page ---------- */

.cc-data-card[b-w6539i9pq3],
.mt-card[b-w6539i9pq3],
.mt-bar[b-w6539i9pq3],
.mt-bar > span[b-w6539i9pq3] {
    border-radius: 0;
}
/* _content/SupportAppAMR/Components/Pages/Maintenance/LogServiceForm.razor.rz.scp.css */
/* ---- header: stacked eyebrow / serial / hours ---- */

.ls-header-stack[b-lqn281dl0n] {
    display: flex;
    flex-direction: column;
    gap: var(--cc-sp-2);
    min-width: 0;
}

.ls-eyebrow[b-lqn281dl0n] {
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--cc-medium-gray);
}

.ls-title[b-lqn281dl0n] {
    font-family: var(--cc-font-heading);
    font-size: var(--cc-fs-3xl);
    font-weight: 800;
    letter-spacing: 0.02em;
    line-height: 1.1;
    color: var(--cc-black);
}


.ls-body[b-lqn281dl0n] {
    padding: 0;
    display: flex;
}

.ls-layout[b-lqn281dl0n] {
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
}

.ls-rail[b-lqn281dl0n] {
    background: var(--cc-bg);
    border-right: 1px solid var(--cc-border-subtle);
    padding: var(--cc-sp-6) 0;
    display: flex;
    flex-direction: column;
}

.ls-rail-label[b-lqn281dl0n] {
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--cc-black);
    padding: 0 var(--cc-sp-6) var(--cc-sp-5);
}

.ls-rail-item[b-lqn281dl0n] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    background: none;
    border: 0;
    border-left: 3px solid transparent;
    font: inherit;
    font-size: var(--cc-fs-md);
    color: var(--cc-dark-gray);
    text-align: left;
    padding: var(--cc-sp-5) var(--cc-sp-6);
    cursor: pointer;
}

.ls-rail-item:hover[b-lqn281dl0n] {
    background: var(--cc-hover-surface);
}

.ls-rail-item.is-active[b-lqn281dl0n] {
    border-left-color: var(--cc-red);
    background: var(--cc-white);
    color: var(--cc-black);
    font-weight: 700;
}

.ls-pane[b-lqn281dl0n] {
    padding: var(--cc-sp-7) var(--cc-sp-8);
    display: flex;
    flex-direction: column;
    gap: var(--cc-sp-7);
    min-width: 0;
}

.ls-pane[b-lqn281dl0n]  .mud-input.mud-input-outlined,
.ls-pane[b-lqn281dl0n]  .mud-input-outlined-border {
    border-radius: 0;
}

/* ---- fields ---- */

.ls-fields[b-lqn281dl0n] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--cc-sp-5);
}

.ls-field[b-lqn281dl0n] {
    display: flex;
    flex-direction: column;
    gap: var(--cc-sp-3);
    min-width: 0;
}

.ls-field-label[b-lqn281dl0n] {
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--cc-black);
}

.ls-required[b-lqn281dl0n] {
    color: var(--cc-red);
}

.ls-optional[b-lqn281dl0n] {
    color: var(--cc-medium-gray);
    font-weight: 600;
}

/* The hour reading is the field that matters — emphasized border, big bold value. */
.ls-hour[b-lqn281dl0n]  .mud-input-outlined-border {
    border-color: var(--cc-black);
    border-width: 2px;
}

.ls-hour[b-lqn281dl0n]  input {
    font-weight: 700;
    font-size: var(--cc-fs-xl);
    font-variant-numeric: tabular-nums;
}

/* Sanity warning under the hour field — pulled up against the fields row
   (the pane's own gap is generous). */
.ls-hour-warning[b-lqn281dl0n] {
    margin-top: calc(-1 * var(--cc-sp-5));
    padding: var(--cc-sp-3) var(--cc-sp-4);
    background: var(--cc-warning-tint);
    color: var(--cc-warning-text);
    font-size: var(--cc-fs-sm);
    font-weight: 600;
}

/* ---- tasks ---- */

.ls-tasks-head[b-lqn281dl0n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: calc(-1 * var(--cc-sp-4));
}

.ls-tasks-label[b-lqn281dl0n] {
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--cc-black);
}

.ls-select-all[b-lqn281dl0n] {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--cc-red);
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

.ls-select-all:hover[b-lqn281dl0n] {
    color: var(--cc-red-hover);
}

.ls-tasks[b-lqn281dl0n] {
    display: flex;
    flex-direction: column;
    gap: var(--cc-sp-3);
    max-height: 42vh;
    overflow-y: auto;
}

.ls-task[b-lqn281dl0n] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-5);
    border: 1px solid var(--cc-border-subtle);
    padding: var(--cc-sp-5) var(--cc-sp-6);
    cursor: pointer;
}

.ls-task:hover[b-lqn281dl0n] {
    background: var(--cc-hover-surface);
}

.ls-task-check[b-lqn281dl0n] {
    width: 18px;
    height: 18px;
    flex: none;
    accent-color: var(--cc-black);
    cursor: pointer;
}

.ls-task-name[b-lqn281dl0n] {
    flex: 1;
    font-size: var(--cc-fs-lg);
    color: var(--cc-black);
}

.ls-task-note[b-lqn281dl0n] {
    font-size: var(--cc-fs-xs);
    color: var(--cc-medium-gray);
    text-align: right;
    flex: none;
    max-width: 45%;
}

/* ---- notes: extra breathing room after the tasks, and stretch to fill the
   fixed-height drawer so the leftover space reads as textarea, not dead zone. */

.ls-notes[b-lqn281dl0n] {
    margin-top: var(--cc-sp-5);
    flex: 1 1 auto;
    min-height: 0;
}

.ls-notes[b-lqn281dl0n]  .mud-input-control,
.ls-notes[b-lqn281dl0n]  .mud-input-control-input-container {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.ls-notes[b-lqn281dl0n]  .mud-input {
    flex: 1 1 auto;
    display: flex;
    min-height: 0;
}

.ls-notes[b-lqn281dl0n]  textarea.mud-input-slot {
    height: 100%;
    resize: none;
}

/* ---- footer ---- */

.ls-footer[b-lqn281dl0n] {
    background: var(--cc-bg);
}

.ls-marked[b-lqn281dl0n] {
    font-size: var(--cc-fs-sm);
    color: var(--cc-medium-gray);
}

.ls-footer[b-lqn281dl0n]  .mud-button-root {
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.06em;
    font-size: var(--cc-fs-sm);
    padding: var(--cc-sp-4) var(--cc-sp-7);
    border-radius: 0;
}

.ls-footer[b-lqn281dl0n]  .ls-btn-cancel {
    border: 1px solid var(--cc-black);
    color: var(--cc-black);
}
/* _content/SupportAppAMR/Components/Pages/Monitor.razor.rz.scp.css */
/* Height flows down from .mud-main-content — see the "Monitor: full-bleed map
   page" block in app.css. This wrapper just passes the container's content box
   through to the card; neither element re-derives the chrome height itself. */
.monitor-fullpage[b-sghhx4j61j] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding-bottom: var(--cc-sp-7);
}

.monitor-page[b-sghhx4j61j] {
    flex: 1;
    min-height: 0;
    position: relative;
    border-radius: var(--cc-radius-lg);
    overflow: hidden;
    border: 1px solid var(--cc-border-subtle);
    background: var(--cc-bg);
}

.monitor-map-wrapper[b-sghhx4j61j] {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.monitor-map[b-sghhx4j61j] {
    width: 100%;
    height: 100%;
}

/* ===== Shared floating-glass surface ===== */
.monitor-toolbar[b-sghhx4j61j],
.monitor-bubbles-container[b-sghhx4j61j],
.monitor-conn-banner[b-sghhx4j61j] {
    background: var(--cc-glass-surface);
    backdrop-filter: var(--cc-glass-blur);
    -webkit-backdrop-filter: var(--cc-glass-blur);
    border: 1px solid var(--cc-glass-hairline);
    box-shadow: var(--cc-glass-shadow);
}

.monitor-toolbar[b-sghhx4j61j] {
    position: absolute;
    top: var(--cc-sp-3);
    left: var(--cc-sp-3);
    z-index: 30;
    display: flex;
    align-items: center;
    gap: var(--cc-sp-1);
    padding: var(--cc-sp-1) var(--cc-sp-2);
    border-radius: var(--cc-radius-lg);
    max-width: calc(100% - var(--cc-sp-6));
}

.monitor-tool-btn[b-sghhx4j61j] {
    width: 34px;
    height: 34px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: var(--cc-radius-md);
    color: var(--cc-glass-text);
    font-size: var(--cc-fs-md);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}

.monitor-tool-btn:hover[b-sghhx4j61j] {
    background: var(--cc-glass-hover);
    color: var(--cc-glass-text-strong);
}

.monitor-tool-btn.active[b-sghhx4j61j] {
    color: var(--cc-red);
}

.monitor-toolbar-sep[b-sghhx4j61j] {
    width: 1px;
    align-self: stretch;
    margin: var(--cc-sp-1) var(--cc-sp-1);
    background: var(--cc-glass-divider);
}

.monitor-toolbar-title[b-sghhx4j61j] {
    color: var(--cc-glass-text-strong);
    font-weight: 800;
    font-size: var(--cc-fs-sm);
    letter-spacing: 0.02em;
    padding: 0 var(--cc-sp-1);
    white-space: nowrap;
}

.monitor-conn-dot[b-sghhx4j61j] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--cc-success);
    flex-shrink: 0;
}

.monitor-conn-dot.off[b-sghhx4j61j] {
    background: var(--cc-danger);
    animation: monitor-pulse-b-sghhx4j61j 1.5s ease-in-out infinite;
}

/* ===== Collapsible search inside the toolbar ===== */
.monitor-toolbar-search[b-sghhx4j61j] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-1);
    min-width: 0;
}

/* Input + clear button as one unit, so they move together. */
.monitor-search-field[b-sghhx4j61j] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-1);
    min-width: 0;
}

.monitor-search-input[b-sghhx4j61j] {
    /* Sized from its own placeholder ("Search by Serial Number or Company" = 34
       chars, measured in this input's font-size) plus horizontal padding, so the
       hint text is never clipped. The old 60vw cap cut it off on phones; the
       min-width floor holds the width while min() avoids overflowing a narrower
       toolbar. See the search-width tokens in cc-tokens.css. */
    width: calc(34ch + var(--cc-sp-5));
    min-width: min(100%, calc(34ch + var(--cc-sp-5)));
    max-width: 100%;
    height: 34px;
    background: var(--cc-glass-field);
    border: 1px solid var(--cc-glass-field-border);
    border-radius: var(--cc-radius-md);
    padding: 0 var(--cc-sp-2);
    color: var(--cc-glass-text-strong);
    font-size: var(--cc-fs-sm);
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.monitor-search-input[b-sghhx4j61j]::placeholder {
    color: var(--cc-glass-text-muted);
}

.monitor-search-input:focus[b-sghhx4j61j] {
    border-color: var(--cc-red);
    box-shadow: 0 0 0 3px rgba(var(--cc-red-rgb), 0.18);
}

.monitor-search-clear[b-sghhx4j61j] {
    width: 26px;
    height: 26px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: var(--cc-radius-sm);
    color: var(--cc-glass-text-muted);
    cursor: pointer;
    transition: color 0.15s;
}

.monitor-search-clear:hover[b-sghhx4j61j] {
    color: var(--cc-glass-text-strong);
}

/* ===== Disconnected floating pill (top-center) ===== */
.monitor-conn-banner[b-sghhx4j61j] {
    position: absolute;
    top: var(--cc-sp-3);
    left: 50%;
    transform: translateX(-50%);
    z-index: 40;
    display: flex;
    align-items: center;
    gap: var(--cc-sp-2);
    padding: var(--cc-sp-2) var(--cc-sp-4);
    border-radius: var(--cc-radius-lg);
    border-color: color-mix(in srgb, var(--cc-danger) 55%, transparent);
    color: var(--cc-glass-text-strong);
    font-size: var(--cc-fs-sm);
    font-weight: 600;
    animation: monitor-pulse-b-sghhx4j61j 2s ease-in-out infinite;
}

.monitor-conn-banner i[b-sghhx4j61j] {
    color: var(--cc-danger);
}

/* ===== Floating AMR List Panel ===== */
.monitor-bubbles-container[b-sghhx4j61j] {
    position: absolute;
    top: 64px;
    left: var(--cc-sp-3);
    bottom: var(--cc-sp-5);
    width: 200px;
    max-width: calc(100% - var(--cc-sp-6));
    border-radius: var(--cc-radius-lg);
    padding: var(--cc-sp-2) var(--cc-sp-1) var(--cc-sp-2) var(--cc-sp-2);
    z-index: 20;
    display: flex;
    flex-direction: column;
}

.monitor-list-matchcount[b-sghhx4j61j] {
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--cc-glass-text-strong);
    padding: 0 var(--cc-sp-4) var(--cc-sp-2);
    flex-shrink: 0;
}

/* ===== Empty State ===== */
.monitor-bubbles-empty[b-sghhx4j61j] {
    flex-shrink: 0;
    width: 178px;
    background: var(--cc-glass-surface-strong);
    border: 1px solid var(--cc-glass-border);
    border-radius: var(--cc-radius-lg);
    padding: var(--cc-sp-6) var(--cc-sp-5);
    position: relative;
    overflow: hidden;
}

.monitor-bubbles-empty[b-sghhx4j61j]  .cc-empty-state {
    padding: 0;
    color: var(--cc-glass-text-muted);
}

.monitor-bubbles-empty[b-sghhx4j61j]  .cc-empty-state-icon {
    box-sizing: border-box;
    width: 40px;
    height: 40px;
    padding: 9px;
    margin-bottom: var(--cc-sp-4);
    border-radius: 50%;
    background: var(--cc-glass-track-subtle);
    font-size: 22px !important;
    color: var(--cc-glass-text-muted);
}

.monitor-bubbles-empty[b-sghhx4j61j]  .cc-empty-state-title {
    font-size: var(--cc-fs-sm);
    line-height: 1.3;
    color: var(--cc-glass-text-strong);
}

.monitor-bubbles-empty[b-sghhx4j61j]  .cc-empty-state-description {
    margin-top: var(--cc-sp-3);
    max-width: none;
    font-size: var(--cc-fs-2xs);
    line-height: 1.45;
    color: var(--cc-glass-text-muted);
}

.monitor-bubbles-empty[b-sghhx4j61j]  .cc-empty-state .mud-button-root {
    width: 100%;
    min-width: 0;
    margin-top: var(--cc-sp-6) !important;
    padding: var(--cc-sp-3) var(--cc-sp-4) !important;
    border: 1px solid var(--cc-glass-border-strong);
    border-radius: var(--cc-radius-md);
    background: var(--cc-glass-hover);
    color: var(--cc-glass-text-strong) !important;
    font-size: var(--cc-fs-2xs);
    font-weight: 700;
    letter-spacing: 0.04em;
    white-space: nowrap;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.monitor-bubbles-empty[b-sghhx4j61j]  .cc-empty-state .mud-button-root:hover {
    background: var(--cc-glass-surface-hover);
    border-color: var(--cc-glass-text-muted);
}

.monitor-bubbles-empty[b-sghhx4j61j]  .cc-empty-state .mud-button-root .mud-icon-root {
    font-size: 15px !important;
    color: var(--cc-glass-text-muted);
}

/* ===== Bubble Scroll ===== */
.monitor-bubbles-scroll[b-sghhx4j61j] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 0px;
    padding-bottom: var(--cc-sp-5);
    scrollbar-width: thin;
    scrollbar-color: var(--cc-glass-divider) transparent;
    flex: 1;
    min-height: 0;
    /* Soften the hard clip when a card straddles the bottom edge mid-scroll;
       the bottom padding keeps the last card clear of the fade when fully scrolled. */
    -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - var(--cc-sp-6)), transparent);
    mask-image: linear-gradient(to bottom, #000 calc(100% - var(--cc-sp-6)), transparent);
}

.monitor-bubbles-scroll[b-sghhx4j61j]::-webkit-scrollbar {
    width: 4px;
}

.monitor-bubbles-scroll[b-sghhx4j61j]::-webkit-scrollbar-track {
    background: transparent;
}

.monitor-bubbles-scroll[b-sghhx4j61j]::-webkit-scrollbar-thumb {
    background: var(--cc-glass-divider);
    border-radius: 3px;
}

/* ===== Individual Bubble Card ===== */
.monitor-bubble[b-sghhx4j61j] {
    flex-shrink: 0;
    width: 178px;
    background: var(--cc-glass-surface-strong);
    border: 1px solid var(--cc-glass-border);
    border-left: 3px solid var(--state-border, var(--cc-slate));
    border-radius: 10px;
    padding: 10px 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    overflow: hidden;
}

.monitor-bubble:hover[b-sghhx4j61j] {
    background: var(--cc-glass-surface-hover);
    border-color: var(--cc-glass-border-strong);
    border-left-color: var(--state-border, var(--cc-slate));
    transform: translateY(-2px);
}

.monitor-bubble.selected[b-sghhx4j61j] {
    border-color: var(--accent-color, var(--cc-info));
    border-left-color: var(--state-border, var(--cc-slate));
    box-shadow: 0 0 12px color-mix(in srgb, var(--accent-color, var(--cc-info)) 40%, transparent),
                inset 0 0 0 1px var(--accent-color, var(--cc-info));
}

.monitor-bubble.faulted[b-sghhx4j61j] {
    background: var(--cc-glass-danger);
}

.monitor-bubble.mowing[b-sghhx4j61j] {
    animation: bubble-glow-b-sghhx4j61j 2s ease-in-out infinite;
}

@keyframes bubble-glow-b-sghhx4j61j {
    0%, 100% { box-shadow: 0 0 8px color-mix(in srgb, var(--accent-color, var(--cc-info)) 30%, transparent); }
    50% { box-shadow: 0 0 16px color-mix(in srgb, var(--accent-color, var(--cc-info)) 50%, transparent); }
}

.monitor-bubble-header[b-sghhx4j61j] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

.monitor-bubble-glyph[b-sghhx4j61j] {
    position: relative;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border-radius: var(--cc-radius-md);
    background: var(--cc-white);
}

.monitor-bubble-glyph img[b-sghhx4j61j] {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.monitor-bubble-overlay-icon[b-sghhx4j61j] {
    position: absolute;
    bottom: -2px;
    right: -2px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 8px;
    font-weight: bold;
    color: var(--cc-white);
    border: 1.5px solid var(--cc-glass-ring);
}

.monitor-bubble-overlay-icon.play[b-sghhx4j61j] {
    background: var(--cc-state-mowing);
    font-size: 6px;
}

.monitor-bubble-overlay-icon.pause[b-sghhx4j61j] {
    background: var(--cc-state-paused);
    font-size: 7px;
}

.monitor-bubble-overlay-icon.fault[b-sghhx4j61j] {
    background: var(--cc-state-faulted);
    font-size: 9px;
}


.monitor-bubble-serial[b-sghhx4j61j] {
    display: inline-flex;
    align-items: center;
    font-weight: 700;
    font-size: var(--cc-fs-md);
    color: var(--cc-glass-text-strong);
    white-space: nowrap;
}

.monitor-bubble-serial .cc-unit-dot[b-sghhx4j61j] { margin-right: 5px; }

.monitor-bubble-company[b-sghhx4j61j] {
    font-size: var(--cc-fs-2xs);
    color: var(--cc-glass-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: -1px;
    margin-bottom: 2px;
}

.monitor-bubble-state[b-sghhx4j61j] {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: var(--cc-fs-xs);
    color: var(--cc-glass-text-strong);
    margin-bottom: 6px;
    min-width: 0;
}

.monitor-bubble-state-dot[b-sghhx4j61j] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
    background: var(--state-border, var(--cc-slate));
}

.monitor-bubble-state-label[b-sghhx4j61j] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.monitor-bubble-pct[b-sghhx4j61j] {
    margin-left: auto;
    padding-left: 4px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.monitor-bubble-meter[b-sghhx4j61j] {
    width: 100%;
    height: 6px;
    background: var(--cc-glass-track);
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 3px;
}

.monitor-bubble-meter.is-thin[b-sghhx4j61j] {
    flex: 1;
    width: auto;
    height: 3px;
    background: var(--cc-glass-track-subtle);
    border-radius: 2px;
    margin-bottom: 0;
}

.monitor-bubble-meter-fill[b-sghhx4j61j] {
    display: block;
    height: 100%;
    border-radius: inherit;
    transition: width 0.3s ease, background 0.3s ease;
}

.monitor-bubble-meter-fill.is-progress[b-sghhx4j61j] {
    width: var(--bubble-progress, 0%);
    background: var(--state-border, var(--cc-slate));
}

.monitor-bubble-meter-fill.is-fuel[b-sghhx4j61j] {
    width: var(--bubble-fuel, 0%);
    background: var(--fuel-color, var(--cc-emerald));
}

.monitor-bubble-time[b-sghhx4j61j] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 6px;
    min-height: 1rem;
    font-size: var(--cc-fs-2xs);
    color: var(--cc-glass-text-strong);
}

.monitor-bubble-eta[b-sghhx4j61j] {
    margin-left: auto;
    font-size: var(--cc-fs-2xs);
    color: var(--cc-glass-text-muted);
}

/* Fuel gauge — icon + thin track + value, so it can't be mistaken for the
   plan-progress meter above it. Fill color comes from --fuel-color
   (emerald/amber/red scale — a different semantic than machine state). */
.monitor-bubble-fuel[b-sghhx4j61j] {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 4px;
}

.monitor-bubble-fuel[b-sghhx4j61j]  .monitor-bubble-fuel-icon {
    width: 12px;
    height: 12px;
    font-size: 12px;
    flex-shrink: 0;
    color: var(--cc-glass-text-muted);
}

.monitor-bubble-fuel-pct[b-sghhx4j61j] {
    flex-shrink: 0;
    min-width: 26px;
    text-align: right;
    font-size: var(--cc-fs-2xs);
    font-variant-numeric: tabular-nums;
    color: var(--cc-glass-text);
}

/* ===== Single-Mower Control Drawer ===== */
.control-panels-sidebar[b-sghhx4j61j] {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 340px;
    background: var(--cc-bg);
    border-left: 1px solid var(--cc-light-gray);
    z-index: 100;
    display: flex;
    flex-direction: column;
    animation: slideInPanel-b-sghhx4j61j 0.2s ease-out;
    pointer-events: auto;
}

@keyframes slideInPanel-b-sghhx4j61j {
    from { transform: translateX(100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

@keyframes slideUpPanel-b-sghhx4j61j {
    from { transform: translateY(100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

/* The single panel fills the drawer: header/address stay fixed, body scrolls. */
.control-panels-sidebar .mower-control-panel[b-sghhx4j61j] {
    flex: 1;
    min-height: 0;
    border: none;
    border-left: 3px solid var(--panel-state-color, var(--cc-slate));
    border-radius: 0;
    box-shadow: none;
}

@media (max-width: 1280px) {
    .control-panels-sidebar[b-sghhx4j61j] { width: 320px; }
}

@media (max-width: 1024px) {
    .control-panels-sidebar[b-sghhx4j61j] { width: 300px; }
}

/* ===== Mower Control Panel ===== */
.mower-control-panel[b-sghhx4j61j] {
    background: var(--cc-white);
    border: 1px solid var(--cc-light-gray);
    border-left: 3px solid var(--panel-state-color, var(--cc-slate));
    border-radius: var(--cc-radius-sm);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    flex-shrink: 0;
}

.control-panel-header[b-sghhx4j61j] {
    padding: 12px 16px;
    border-bottom: 1px solid var(--cc-light-gray);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mower-control-panel.collapsed .control-panel-header[b-sghhx4j61j] {
    border-bottom: none;
}

.control-panel-header-info[b-sghhx4j61j] {
    flex: 1;
    min-width: 0;
}

.control-panel-header h3[b-sghhx4j61j] {
    font-size: var(--cc-fs-md);
    font-weight: 800;
    letter-spacing: 0.02em;
    color: var(--cc-black);
    margin: 0;
}

.control-panel-company[b-sghhx4j61j] {
    font-size: var(--cc-fs-2xs);
    color: var(--cc-gray-500);
    margin-top: 1px;
}

.control-panel-operator[b-sghhx4j61j] {
    font-size: var(--cc-fs-2xs);
    color: var(--cc-medium-gray);
    margin-top: 2px;
}

.control-panel-address[b-sghhx4j61j] {
    font-size: var(--cc-fs-xs);
    color: var(--cc-black);
    padding: 4px 16px 8px;
    text-align: center;
    line-height: 1.3;
}

.control-panel-header-right[b-sghhx4j61j] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.control-panel-chip[b-sghhx4j61j] {
    font-size: 12px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 4px;
    background: var(--panel-state-color, var(--cc-slate));
    color: var(--cc-white);
    white-space: nowrap;
}

.control-panel-body[b-sghhx4j61j] {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    padding-bottom: 20px;
}

/* Support Actions tabbed area */
.support-tabs[b-sghhx4j61j] {
    display: flex;
    gap: 0;
    border-bottom: 1px solid var(--cc-light-gray);
    margin-bottom: 12px;
}

.support-tab[b-sghhx4j61j] {
    flex: 1;
    background: none;
    border: none;
    padding: 8px 6px;
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--cc-gray-500);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    transition: color 0.15s, border-color 0.15s;
}

.support-tab:hover[b-sghhx4j61j] {
    color: var(--cc-header-bg);
}

.support-tab.active[b-sghhx4j61j] {
    color: var(--cc-brand-text);
    border-bottom-color: var(--cc-red);
}

/* Uniform stacked support-action buttons */
.support-actions-list[b-sghhx4j61j] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Prominent diagnostics button anchored at the bottom of the group */
[b-sghhx4j61j] .support-diagnostics-btn {
    margin-top: 16px;
    height: 46px;
    font-size: calc(0.9rem + 1px);
    text-transform: none;
    font-weight: 700;
}

.control-panel-body[b-sghhx4j61j]  .monitor-action-btn {
    text-transform: none;
    font-weight: 600;
}

/* ===== Signal-strength bars (cell/Wi-Fi from flag bits, and E-Stop signal) ===== */
.monitor-bubble-header .cc-signal-bars[b-sghhx4j61j] { margin-left: auto; }
.monitor-bubble .cc-signal-bar[b-sghhx4j61j] { background: var(--cc-glass-border-strong); }
.monitor-bubble .cc-signal-bar.on[b-sghhx4j61j] { background: var(--cc-success); }

/* Mode-change reason line in the control drawer */
.control-panel-reason[b-sghhx4j61j] {
    font-size: var(--cc-fs-xs);
    color: var(--cc-gray-500);
    font-style: italic;
    margin-bottom: 12px;
}

/* Error link */
.control-panel-error-link[b-sghhx4j61j] {
    color: var(--cc-brand-text);
    font-size: var(--cc-fs-xs);
    font-weight: 600;
    cursor: pointer;
    text-decoration: underline;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.control-panel-error-link:hover[b-sghhx4j61j] {
    color: var(--cc-red-hover);
}

.control-panel-status-string[b-sghhx4j61j] {
    color: var(--health-color, var(--cc-info));
    font-size: var(--cc-fs-xs);
    margin-bottom: 12px;
}

/* Progress */
.control-panel-progress[b-sghhx4j61j] {
    margin-bottom: 16px;
}

.control-panel-progress-label[b-sghhx4j61j] {
    display: flex;
    justify-content: space-between;
    font-size: var(--cc-fs-2xs);
    color: var(--cc-medium-gray);
}

/* Control Groups */
.control-group[b-sghhx4j61j] {
    margin-bottom: 20px;
}

.control-group-label[b-sghhx4j61j] {
    font-size: var(--cc-fs-2xs);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--cc-medium-gray);
    margin-bottom: 8px;
}

.telemetry-grid[b-sghhx4j61j] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.telemetry-stat[b-sghhx4j61j] {
    background: var(--cc-bg);
    padding: 10px;
    text-align: center;
    border-radius: var(--cc-radius-sm);
}

.telemetry-stat-value[b-sghhx4j61j] {
    font-size: var(--cc-fs-xl);
    font-weight: 900;
    color: var(--tele-value-color, var(--cc-black));
}

.telemetry-stat-label[b-sghhx4j61j] {
    font-size: var(--cc-fs-2xs);
    color: var(--cc-medium-gray);
    font-weight: 600;
    margin-top: 2px;
}

@keyframes monitor-pulse-b-sghhx4j61j {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(1.15); }
}

/* The disconnect pill re-centers itself, so it needs a translate-preserving pulse. */
.monitor-conn-banner[b-sghhx4j61j] {
    animation-name: monitor-banner-pulse-b-sghhx4j61j;
}

@keyframes monitor-banner-pulse-b-sghhx4j61j {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* ===== Fault Flash Alert ===== */
.monitor-bubble.newly-faulted[b-sghhx4j61j] {
    animation: fault-flash-b-sghhx4j61j 0.6s ease-in-out infinite;
    transform: scale(1.05);
    box-shadow: 0 0 18px color-mix(in srgb, var(--cc-danger) 70%, transparent),
                0 0 6px color-mix(in srgb, var(--cc-danger) 50%, transparent);
    z-index: 10;
}

@keyframes fault-flash-b-sghhx4j61j {
    0%, 100% { background: color-mix(in srgb, var(--cc-danger) 70%, transparent); }
    50% { background: color-mix(in srgb, var(--cc-danger) 95%, transparent); }
}

/* ===== Responsive ===== */
@media (max-width: 1024px) {
    .monitor-bubble[b-sghhx4j61j] {
        width: 160px;
        padding: 8px 10px;
    }

    .telemetry-stat-value[b-sghhx4j61j] {
        font-size: 16px;
    }

    .telemetry-stat[b-sghhx4j61j] {
        padding: 8px;
    }

    .control-panel-header[b-sghhx4j61j] {
        padding: 10px 12px;
    }

    .control-panel-body[b-sghhx4j61j] {
        padding: 12px;
        padding-bottom: 16px;
    }
}

@media (max-width: 860px) {
    /* List becomes a bottom-anchored floating strip so it never fights the map */
    .monitor-bubbles-container[b-sghhx4j61j] {
        top: auto;
        left: var(--cc-sp-2);
        right: var(--cc-sp-2);
        bottom: var(--cc-sp-2);
        width: auto;
        max-width: none;
        max-height: 42%;
    }

    .monitor-bubbles-scroll[b-sghhx4j61j] {
        flex-direction: row;
        gap: 8px;
        overflow-x: auto;
        overflow-y: hidden;
        padding-right: var(--cc-sp-5);
        padding-bottom: 6px;
        /* Horizontal strip: fade the trailing edge instead of the bottom. */
        -webkit-mask-image: linear-gradient(to right, #000 calc(100% - var(--cc-sp-6)), transparent);
        mask-image: linear-gradient(to right, #000 calc(100% - var(--cc-sp-6)), transparent);
    }

    .monitor-bubble[b-sghhx4j61j] {
        width: 165px;
    }

    /* Drawer slides up as a bottom sheet for the one selected mower */
    .control-panels-sidebar[b-sghhx4j61j] {
        width: 100%;
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        max-height: 55%;
        border-left: none;
        border-top: 1px solid var(--cc-light-gray);
        box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.12);
        animation: slideUpPanel-b-sghhx4j61j 0.2s ease-out;
    }

    .control-panels-sidebar .mower-control-panel[b-sghhx4j61j] {
        border-left: none;
        border-top: 3px solid var(--panel-state-color, var(--cc-slate));
    }
}

@media (max-width: 600px) {
    .monitor-toolbar-title[b-sghhx4j61j] {
        display: none;
    }

    /* ---- Phones: the open search field gets its own toolbar line ----
       Inline, the 34-character placeholder can't share a row with the buttons.
       Let the toolbar wrap, then dissolve the search wrapper's box
       (display: contents) so the icon button and the field group become direct
       toolbar children: the button stays in the button row, and the field —
       ordered last and 100% wide — wraps onto a full-width line beneath it.
       The toolbar is absolutely positioned, so growing taller pushes nothing. */
    .monitor-toolbar[b-sghhx4j61j] {
        flex-wrap: wrap;
        row-gap: var(--cc-sp-3);
    }

    /* The toolbar is fit-content, so a wrapped field line would only be as wide as
       the button row — not enough for the placeholder, which defeats the point of
       moving it. Stretch the toolbar across the map only while the search is open
       (the .open class the markup already sets); closed, it stays a compact
       button cluster. */
    .monitor-toolbar:has(.monitor-toolbar-search.open)[b-sghhx4j61j] {
        width: calc(100% - var(--cc-sp-6));
    }

    .monitor-toolbar-search[b-sghhx4j61j] {
        display: contents;
    }

    .monitor-search-field[b-sghhx4j61j] {
        order: 1;
        flex: 1 1 100%;
    }

    /* Fill the new line instead of holding out for the placeholder's full width. */
    .monitor-search-input[b-sghhx4j61j] {
        flex: 1 1 auto;
        width: auto;
        min-width: 0;
    }

    .monitor-bubble[b-sghhx4j61j] {
        width: 150px;
        padding: 6px 8px;
    }

    .monitor-bubble-serial[b-sghhx4j61j] {
        font-size: var(--cc-fs-sm);
    }

    .monitor-bubble-glyph[b-sghhx4j61j] {
        width: 26px;
        height: 26px;
    }

    .monitor-bubble-glyph img[b-sghhx4j61j] {
        width: 20px;
        height: 20px;
    }

    .telemetry-grid[b-sghhx4j61j] {
        grid-template-columns: 1fr 1fr;
        gap: 6px;
    }

    .telemetry-stat-value[b-sghhx4j61j] {
        font-size: 15px;
    }

    .telemetry-stat-label[b-sghhx4j61j] {
        font-size: 11px;
    }

    .control-panel-header-right[b-sghhx4j61j] {
        gap: 4px;
    }

    .control-panel-chip[b-sghhx4j61j] {
        font-size: 11px;
        padding: 2px 6px;
    }

    .control-panels-sidebar[b-sghhx4j61j] {
        max-height: 62%;
    }
}

/* ===== Reduced motion ===== */
@media (prefers-reduced-motion: reduce) {
    .monitor-bubble.mowing[b-sghhx4j61j],
    .monitor-bubble.newly-faulted[b-sghhx4j61j],
    .monitor-conn-dot.off[b-sghhx4j61j],
    .monitor-conn-banner[b-sghhx4j61j],
    .control-panels-sidebar[b-sghhx4j61j] {
        animation: none !important;
    }

    .monitor-bubble.newly-faulted[b-sghhx4j61j] {
        transform: none;
    }

    .monitor-bubble[b-sghhx4j61j],
    .monitor-bubble-meter-fill[b-sghhx4j61j] {
        transition: none;
    }
}
/* _content/SupportAppAMR/Components/Pages/Monitor/MowerSettingsDialog.razor.rz.scp.css */
/* Dialog body min sizing (sits on the MudStack root → ::deep). */
[b-485vsnttfz] .settings-dialog-stack {
    min-width: 320px;
}
/* _content/SupportAppAMR/Components/Pages/Monitor/MowerUpdateDialog.razor.rz.scp.css */
/* Dialog body min sizing (sits on the MudStack root → ::deep). */
[b-egt3hmsw70] .update-dialog-stack {
    min-width: 360px;
}

/* "Latest" version line — color conveys update urgency (was inline Style). */
[b-egt3hmsw70] .update-latest--required {
    color: var(--cc-red);
    font-weight: 600;
}

[b-egt3hmsw70] .update-latest--available {
    color: #16a34a;
    font-weight: 600;
}

[b-egt3hmsw70] .update-latest--none {
    color: #64748b;
}

/* Management-version caption (#888 has no exact token). */
[b-egt3hmsw70] .update-mgmt-version {
    color: #888;
}

/* Scrollable changelog panel. */
.changelog-box[b-egt3hmsw70] {
    white-space: pre-wrap;
    font-size: calc(0.8rem + 1px);
    color: #333;
    max-height: 180px;
    overflow-y: auto;
    background: var(--cc-bg);
    border-radius: var(--cc-radius-sm);
    padding: 10px;
}
/* _content/SupportAppAMR/Components/Pages/NtripSettings.razor.rz.scp.css */
/* ---- Filter bar: company select + Refresh always share one line ----
   These rules hang off classes that are already in the rendered DOM
   (.cc-filter-bar here is scoped to this page only, so other pages using the
   shared bar are untouched). No new markup hooks on purpose — a .razor.css
   edit reaches the browser on a refresh, while a markup edit needs a rebuild. */
.cc-filter-bar[b-jktuukpvqp] {
    flex-wrap: nowrap;
}

/* Refresh keeps its intrinsic size; the select absorbs the difference. */
.cc-filter-bar[b-jktuukpvqp]  .mud-button-root {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* The company select's outer box. Targeted by MudBlazor's own classes rather
   than the .ntrip-company-filter Class, because which element that Class lands
   on is not the element carrying the width — this hits whichever it is. Safe to
   be this broad: the bar holds exactly one select, and .cc-filter-bar is scoped
   to this page. The page-scope attribute is also what outranks the app-wide
   ".cc-filter-bar .mud-select" fixed-240px rule in cc-components.css.
   Wide layouts keep that standard 240px — but shrinkable, not flex: 0 0 auto. */
.cc-filter-bar[b-jktuukpvqp]  .mud-select,
.cc-filter-bar[b-jktuukpvqp]  .mud-input-control {
    width: 240px;
    min-width: 0;
    max-width: 100%;
    flex: 0 1 auto;
}

/* A nested control fills its parent instead of re-asserting the 240px. */
.cc-filter-bar[b-jktuukpvqp]  .mud-select .mud-input-control {
    width: 100%;
}

/* Every inner wrapper carries an intrinsic min-content width. Until all of them
   are cleared the shrink can't propagate, and the select overflows the row to
   the left instead of giving the space back (see the same list in
   Patch.razor.css). MudBlazor already ellipsizes the .mud-input-slot text. */
.cc-filter-bar[b-jktuukpvqp]  .mud-input-control-input-container,
.cc-filter-bar[b-jktuukpvqp]  .mud-input,
.cc-filter-bar[b-jktuukpvqp]  .mud-input-slot {
    min-width: 0;
    max-width: 100%;
}

/* Tablet and below (same breakpoint as Patch.razor.css): the select stops
   sitting at a fixed 240px and stretches into whatever the row has left,
   giving the width back whenever the Refresh button needs more room. */
@media (max-width: 960px) {
    .cc-filter-bar[b-jktuukpvqp]  .mud-select,
    .cc-filter-bar[b-jktuukpvqp]  .mud-input-control {
        width: auto;
        flex: 1 1 auto;
    }

    .cc-filter-bar[b-jktuukpvqp]  .mud-select .mud-input-control {
        width: 100%;
    }
}

/* Port numeric field width — class sits on the MudNumericField root. */
[b-jktuukpvqp] .ntrip-port {
    max-width: 140px;
}

/* Settings column width on the machines table. */
.ntrip-settings-col[b-jktuukpvqp] {
    width: 130px;
}
/* _content/SupportAppAMR/Components/Pages/OwnersManual.razor.rz.scp.css */
.manual-page[b-qmls4f2f1n] {
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    /* The app shell clips overflow, so the manual page itself is the scroll container at every width. */
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.manual-container[b-qmls4f2f1n] {
    display: flex;
    max-width: 1400px;
    margin: 0 auto;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    min-height: 100%;
}

/* Mobile nav toggle — hidden on larger screens */
.manual-nav-toggle[b-qmls4f2f1n] {
    display: none;
}

/* Sidebar Styling */
.manual-sidebar[b-qmls4f2f1n] {
    flex-shrink: 0;
    width: 280px;
    background: #f8f9fa;
    border-right: 1px solid #e5e7eb;
    padding: 2rem 0;
    /* Stick to the top of the scrolling page and scroll internally only if the nav is taller than the viewport. */
    position: sticky;
    top: 0;
    align-self: flex-start;
    overflow-y: auto;
    max-height: calc(100vh - 138px);
}

.manual-sidebar-header[b-qmls4f2f1n] {
    padding: 0 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid var(--cc-red);
    padding-bottom: 1rem;
}

.manual-sidebar-title[b-qmls4f2f1n] {
    font-size: calc(1.25rem + 1px);
    font-weight: 700;
    color: #000;
    margin: 0 0 0.75rem 0;
    font-family: var(--amr-font-title);
}

.manual-download-btn[b-qmls4f2f1n] {
    width: 100%;
    padding: 0.6rem 0.75rem;
    background: var(--cc-red);
    color: white;
    text-decoration: none;
    border: none;
    border-radius: 4px;
    font-size: calc(0.8rem + 1px);
    font-weight: 600;
    font-family: var(--amr-font-body);
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
}

.manual-download-btn:hover[b-qmls4f2f1n] {
    background: var(--cc-red-hover);
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(196, 18, 48, 0.3);
}

.manual-download-btn:active[b-qmls4f2f1n] {
    transform: translateY(0);
    box-shadow: 0 1px 4px rgba(196, 18, 48, 0.3);
}

.download-icon[b-qmls4f2f1n] {
    font-size: 0.9rem;
}

.download-text[b-qmls4f2f1n] {
    white-space: nowrap;
}

.manual-nav-group[b-qmls4f2f1n] {
    margin-bottom: 1.5rem;
}

.manual-nav-label[b-qmls4f2f1n] {
    font-size: calc(0.85rem + 1px);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #666;
    padding: 0 1.5rem;
    margin: 0 0 0.75rem 0;
    font-family: var(--amr-font-medium);
}

.manual-nav-list[b-qmls4f2f1n] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.manual-nav-link[b-qmls4f2f1n] {
    display: block;
    padding: 0.75rem 1.5rem;
    color: #333;
    text-decoration: none;
    font-size: calc(0.95rem + 1px);
    transition: all 0.2s ease;
    border-left: 3px solid transparent;
    font-family: var(--amr-font-body);
}

.manual-nav-link:hover[b-qmls4f2f1n] {
    background-color: #efefef;
    color: var(--cc-red);
}

.manual-nav-link.active[b-qmls4f2f1n] {
    background-color: rgba(196, 18, 48, 0.1);
    color: var(--cc-red);
    border-left-color: var(--cc-red);
    font-weight: 600;
}

/* Content Area */
.manual-content[b-qmls4f2f1n] {
    flex: 1;
    min-width: 0;
    padding: 3rem;
}

.manual-section[b-qmls4f2f1n] {
    max-width: 900px;
}

.manual-content[b-qmls4f2f1n]  .manual-section-title {
    font-size: calc(2rem + 1px);
    font-weight: 700;
    color: #000;
    margin: 0 0 1rem 0;
    font-family: var(--amr-font-title);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    border-bottom: 3px solid var(--cc-red);
    padding-bottom: 1rem;
}

.manual-content[b-qmls4f2f1n]  .manual-section-subtitle {
    font-size: calc(1.5rem + 1px);
    font-weight: 600;
    color: var(--cc-red);
    margin: 2rem 0 1rem 0;
    font-family: var(--amr-font-title);
}

.manual-content[b-qmls4f2f1n]  .manual-section h3 {
    font-size: calc(1.1rem + 1px);
    font-weight: 600;
    color: #000;
    margin: 1.5rem 0 0.75rem 0;
    font-family: var(--amr-font-title);
}

.manual-content[b-qmls4f2f1n]  .manual-section h4 {
    font-size: calc(0.95rem + 1px);
    font-weight: 600;
    color: #333;
    margin: 1rem 0 0.5rem 0;
    font-family: var(--amr-font-title);
}

.manual-content[b-qmls4f2f1n]  .manual-section p {
    font-size: calc(0.95rem + 1px);
    line-height: 1.8;
    color: #555;
    margin: 0.75rem 0;
    font-family: var(--amr-font-body);
}

.manual-content[b-qmls4f2f1n]  .manual-section ul,
.manual-content[b-qmls4f2f1n]  .manual-section ol {
    margin: 1rem 0;
    padding-left: 1.5rem;
    font-family: var(--amr-font-body);
}

.manual-content[b-qmls4f2f1n]  .manual-section li {
    margin: 0.5rem 0;
    color: #555;
    line-height: 1.6;
}

.manual-content[b-qmls4f2f1n]  .manual-section strong {
    font-weight: 600;
    color: #000;
}

.manual-content[b-qmls4f2f1n]  .manual-alert {
    background-color: #fff3cd;
    border-left: 4px solid #ffc107;
    padding: 1rem 1rem 1rem 5.25rem;
    margin: 1.5rem 0;
    border-radius: 4px;
    position: relative;
}

.manual-content[b-qmls4f2f1n]  .manual-alert::before {
    content: "⚠️";
    position: absolute;
    left: 1rem;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 0.45rem;
    font-size: calc(3rem + 1px);
    line-height: 1;
}

.manual-content[b-qmls4f2f1n]  .manual-alert-title {
    font-weight: 700;
    color: #856404;
    margin: 0 0 0.5rem 0;
    font-family: var(--amr-font-medium);
}

.manual-content[b-qmls4f2f1n]  .manual-alert p {
    margin: 0;
    color: #856404;
}

.manual-content[b-qmls4f2f1n]  .manual-note {
    background-color: #e7f3ff;
    border-left: 4px solid #2196f3;
    padding: 1rem;
    margin: 1.5rem 0;
    border-radius: 4px;
}

.manual-content[b-qmls4f2f1n]  .manual-note-title {
    font-weight: 700;
    color: #0c5aa0;
    margin: 0 0 0.5rem 0;
    font-family: var(--amr-font-medium);
}

.manual-content[b-qmls4f2f1n]  .manual-note p {
    margin: 0;
    color: #0c5aa0;
}

.manual-content[b-qmls4f2f1n]  .manual-step {
    background: #f8f9fa;
    padding: 1rem;
    margin: 1rem 0;
    border-left: 3px solid var(--cc-red);
    border-radius: 4px;
}

.manual-content[b-qmls4f2f1n]  .manual-step strong {
    display: block;
    margin-bottom: 0.5rem;
    color: var(--cc-red);
}

.manual-content[b-qmls4f2f1n]  .manual-table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;
    font-size: calc(0.9rem + 1px);
}

.manual-content[b-qmls4f2f1n]  .manual-table th {
    background-color: #eceaea;
    border: 1px solid #ddd;
    padding: 0.75rem;
    font-weight: 600;
    color: #000;
    text-align: left;
    font-family: var(--amr-font-title);
}

.manual-content[b-qmls4f2f1n]  .manual-table td {
    border: 1px solid #ddd;
    padding: 0.75rem;
    color: #555;
    font-family: var(--amr-font-body);
}

.manual-content[b-qmls4f2f1n]  .manual-table tr:nth-child(even) {
    background-color: #faf8f8;
}

/* Safety decal definition tables */
.manual-content[b-qmls4f2f1n]  .decal-table th {
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.manual-content[b-qmls4f2f1n]  .decal-table .decal-icon {
    width: 110px;
    text-align: center;
    vertical-align: middle;
    background: #fff;
}

.manual-content[b-qmls4f2f1n]  .decal-table .decal-icon img {
    width: 80px;
    height: auto;
    display: block;
    margin: 0 auto;
}

.manual-content[b-qmls4f2f1n]  .decal-table td {
    vertical-align: middle;
}

.manual-content[b-qmls4f2f1n]  .manual-image {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
    margin: 1.5rem 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.manual-content[b-qmls4f2f1n]  .figure-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem 1.5rem;
    margin: 1.5rem 0;
    align-items: start;
}

.manual-content[b-qmls4f2f1n]  .figure-grid .manual-figure {
    margin: 0;
}

/* Click-through carousel for the controls overview figures */
.manual-content[b-qmls4f2f1n]  .carousel-title {
    text-align: center;
}
.manual-content[b-qmls4f2f1n]  .figure-carousel {
    margin: 1.5rem auto;
    max-width: 860px;
}

.manual-content[b-qmls4f2f1n]  .figure-carousel-viewport {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8f9fa;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 1.25rem 4.5rem;
    min-height: 300px;
}

/* Two-column slide: diagram on the left, its numbered key on the right */
.manual-content[b-qmls4f2f1n]  .figure-carousel-body {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(200px, 1fr);
    gap: 1.5rem;
    align-items: center;
    width: 100%;
}

.manual-content[b-qmls4f2f1n]  .figure-carousel .manual-figure {
    margin: 0;
    width: 100%;
}

.manual-content[b-qmls4f2f1n]  .figure-carousel .manual-figure img {
    max-height: 320px;
    width: auto;
    max-width: 100%;
    border: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* Per-figure numbered key (matches the callouts on the current diagram) */
.manual-content[b-qmls4f2f1n]  .figure-key-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.manual-content[b-qmls4f2f1n]  .figure-key-list li {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin: 0.5rem 0;
    font-size: calc(0.9rem + 1px);
    color: #333;
    line-height: 1.35;
    font-family: var(--amr-font-body);
}

.manual-content[b-qmls4f2f1n]  .figure-key-num {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    background: var(--cc-red);
    color: #fff;
    font-size: calc(0.8rem + 1px);
    font-weight: 700;
    font-family: var(--amr-font-medium);
}

.manual-content[b-qmls4f2f1n]  .figure-carousel-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    border: none;
    background: var(--cc-red);
    color: #fff;
    font-size: calc(1.75rem + 1px);
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    /* Optical centering: these glyphs sit low in their font box; border-box
       padding shifts the flex-centered glyph upward. */
    padding: 0 0 4px 0;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    transition: background 0.2s ease, transform 0.15s ease;
}

.manual-content[b-qmls4f2f1n]  .figure-carousel-nav:hover {
    background: var(--cc-red-hover);
    transform: translateY(-50%) scale(1.08);
}

.manual-content[b-qmls4f2f1n]  .figure-carousel-nav.prev {
    left: 0.75rem;
}

.manual-content[b-qmls4f2f1n]  .figure-carousel-nav.next {
    right: 0.75rem;
}

.manual-content[b-qmls4f2f1n]  .figure-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.manual-content[b-qmls4f2f1n]  .figure-carousel-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: none;
    background: #cbd5e1;
    padding: 0;
    cursor: pointer;
    transition: background 0.2s ease;
}

.manual-content[b-qmls4f2f1n]  .figure-carousel-dot:hover {
    background: #94a3b8;
}

.manual-content[b-qmls4f2f1n]  .figure-carousel-dot.active {
    background: var(--cc-red);
}

/* Clickable figure (opens the enlarged lightbox) */
.manual-content[b-qmls4f2f1n]  .figure-zoom-btn {
    position: relative;
    display: inline-block;
    padding: 0;
    border: none;
    background: none;
    cursor: zoom-in;
    line-height: 0;
}

.manual-content[b-qmls4f2f1n]  .figure-zoom-btn img {
    transition: transform 0.15s ease;
}

.manual-content[b-qmls4f2f1n]  .figure-zoom-btn:hover img,
.manual-content[b-qmls4f2f1n]  .figure-zoom-btn:focus-visible img {
    transform: scale(1.02);
}

/* Full-screen lightbox: enlarged figure over a gray sheen */
.manual-content[b-qmls4f2f1n]  .figure-lightbox {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: rgba(0, 0, 0, 0.7);
    animation: figure-lightbox-fade-b-qmls4f2f1n 0.15s ease;
}

@keyframes figure-lightbox-fade-b-qmls4f2f1n {
    from { opacity: 0; }
    to { opacity: 1; }
}

.manual-content[b-qmls4f2f1n]  .figure-lightbox-content {
    position: relative;
    max-width: 92vw;
    max-height: 92vh;
    background: #fff;
    border-radius: 8px;
    padding: 1.5rem;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.manual-content[b-qmls4f2f1n]  .figure-lightbox-content img {
    max-width: 100%;
    max-height: calc(92vh - 5rem);
    width: auto;
    height: auto;
    object-fit: contain;
}

.manual-content[b-qmls4f2f1n]  .figure-lightbox-caption {
    margin: 0.75rem 0 0 0;
    font-size: calc(0.9rem + 1px);
    font-style: italic;
    color: #666;
    font-family: var(--amr-font-body);
    text-align: center;
}

.manual-content[b-qmls4f2f1n]  .figure-lightbox-close {
    position: absolute;
    top: -0.9rem;
    right: -0.9rem;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%;
    border: 2px solid #fff;
    background: var(--cc-red);
    color: #fff;
    font-size: calc(1.5rem + 1px);
    line-height: 1;
    /* Optical centering: the × glyph sits low; nudge it up via border-box padding. */
    padding: 0 0 3px 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    transition: background 0.2s ease, transform 0.15s ease;
}

.manual-content[b-qmls4f2f1n]  .figure-lightbox-close:hover {
    background: var(--cc-red-hover);
    transform: scale(1.08);
}

.manual-content[b-qmls4f2f1n]  .manual-figure {
    margin: 1.5rem 0;
    text-align: center;
}

.manual-content[b-qmls4f2f1n]  .manual-figure img {
    max-width: 100%;
    height: auto;
    margin: 0 auto;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
}

.manual-content[b-qmls4f2f1n]  .manual-figure figcaption {
    margin-top: 0.5rem;
    font-style: italic;
    font-size: calc(0.85rem + 1px);
    color: #666;
    font-family: var(--amr-font-body);
}

.manual-content[b-qmls4f2f1n]  .control-figure {
    text-align: left;
}

.manual-content[b-qmls4f2f1n]  .control-figure img {
    max-width: 360px;
    border: none;
}

.manual-content[b-qmls4f2f1n]  .control-figure-sm img {
    max-width: 170px;
}

.manual-content[b-qmls4f2f1n]  .control-figure-xs img {
    max-width: 120px;
}

.manual-content[b-qmls4f2f1n]  .manual-figure.float-right {
    float: right;
    max-width: 320px;          /* cap so text has room beside it */
    margin: 0 0 1rem 1.5rem;   /* space below + to the left of the image */
    text-align: center;
}

/* Stack instead of wrap on narrow screens */
@media (max-width: 768px) {
    .manual-content[b-qmls4f2f1n]  .manual-figure.float-right {
        float: none;
        max-width: 100%;
        margin: 1.5rem 0;
    }
}

/* Grouped media card: step text + its figure read as one contained unit.
   The steps sit left, the figure sits in a white framed plate on the right,
   both vertically centered, inside a subtly tinted/bordered panel.
   Reusable: wrap any text block + figure in .manual-media-row. */
.manual-content[b-qmls4f2f1n]  .manual-media-row {
    display: flex;
    flex-direction: column;      /* figure sits below the text */
    align-items: stretch;
    gap: 1rem;
    margin: 1.5rem 0;
}

.manual-content[b-qmls4f2f1n]  .manual-media-text {
    margin: 0;                   /* list keeps its own <li> spacing */
}

.manual-content[b-qmls4f2f1n]  .manual-media-fig {
    align-self: flex-start;      /* pin the figure to the left below the text */
    margin: 0;
    text-align: center;          /* caption centers under the image */
}

.manual-content[b-qmls4f2f1n]  .manual-media-imgwrap {
    display: block;
}

.manual-content[b-qmls4f2f1n]  .manual-media-fig img {
    display: block;
    width: 200px;                /* fixed, readable size */
    max-width: 100%;
    height: auto;
    border: none;
}

/* Standalone figure pinned to the left, with its caption centered under the image.
   The figure shrinks to the image width so text-align:center lines the caption up. */
.manual-content[b-qmls4f2f1n]  .manual-figure.figure-left {
    width: fit-content;
    max-width: 100%;
    margin-left: 0;
    margin-right: auto;
    text-align: center;
}

.manual-content[b-qmls4f2f1n]  .manual-toc {
    background: #f8f9fa;
    padding: 1.5rem;
    border-radius: 4px;
    margin-bottom: 2rem;
}

.manual-content[b-qmls4f2f1n]  .manual-toc-title {
    font-weight: 700;
    margin-bottom: 1rem;
    color: #000;
    font-family: var(--amr-font-title);
}

.manual-content[b-qmls4f2f1n]  .manual-toc ul {
    margin: 0;
}

.manual-content[b-qmls4f2f1n]  .manual-toc a {
    color: #0066b3;
    text-decoration: none;
}

.manual-content[b-qmls4f2f1n]  .manual-toc a:hover {
    text-decoration: underline;
}

/* Responsive Design */
@media (max-width: 768px) {
    /* Stack the layout and collapse the sidebar into a popup toggled by the button. */
    .manual-container[b-qmls4f2f1n] {
        flex-direction: column;
        min-height: auto;
    }

    /* Show the red rounded popup toggle */
    .manual-nav-toggle[b-qmls4f2f1n] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        align-self: flex-start;
        margin: 1.5rem 0 1rem 0;
        padding: 0.55rem 0.95rem;
        background: var(--cc-red);
        color: #fff;
        border: none;
        border-radius: 0 8px 8px 0;
        font-size: calc(1.2rem + 1px);
        font-weight: 700;
        line-height: 1;
        font-family: var(--amr-font-body);
        cursor: pointer;
        user-select: none;
    }

    .manual-nav-toggle-icon[b-qmls4f2f1n] {
        display: inline-block;
        font-weight: 700;
        transition: transform 0.2s ease;
    }

    .manual-nav-toggle.open .manual-nav-toggle-icon[b-qmls4f2f1n] {
        transform: rotate(90deg);
    }

    /* Sidebar hidden until the toggle is opened, then shown as a popup card */
    .manual-sidebar[b-qmls4f2f1n] {
        display: none;
    }

    .manual-sidebar.open[b-qmls4f2f1n] {
        display: block;
        position: static;
        width: auto;
        max-height: none;
        margin: 0 1rem 1rem 1rem;
        border: 1px solid #e5e7eb;
        border-radius: 8px;
        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
    }

    .manual-content[b-qmls4f2f1n] {
        padding: 1.5rem;
    }

    .manual-content[b-qmls4f2f1n]  .manual-section-title {
        font-size: calc(1.5rem + 1px);
    }

    .manual-content[b-qmls4f2f1n]  .manual-section-subtitle {
        font-size: calc(1.1rem + 1px);
    }

    .manual-content[b-qmls4f2f1n]  .figure-grid {
        grid-template-columns: 1fr;
    }

    .manual-content[b-qmls4f2f1n]  .figure-carousel-body {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}

/* Scrollbar Styling */
.manual-sidebar[b-qmls4f2f1n]::-webkit-scrollbar {
    width: 6px;
}

.manual-sidebar[b-qmls4f2f1n]::-webkit-scrollbar-track {
    background: #e5e7eb;
}

.manual-sidebar[b-qmls4f2f1n]::-webkit-scrollbar-thumb {
    background: var(--cc-red);
    border-radius: 3px;
}

.manual-sidebar[b-qmls4f2f1n]::-webkit-scrollbar-thumb:hover {
    background: var(--cc-red-hover);
}
/* _content/SupportAppAMR/Components/Pages/Patch.razor.rz.scp.css */
/* ===== Patch Update page ===== */
/* Fixed width on desktop — the box never grows or shrinks with the text inside
   it. Phones release the lock (see the 599.98px block below). */
.cc-page-head[b-5cmpz7hryi]  .patch-select {
    flex: 0 0 340px;
    width: 340px;
    min-width: 340px;
    max-width: 340px;
    overflow: hidden;
}

.cc-page-head .patch-select-wrap[b-5cmpz7hryi] {
    flex: 0 0 260px;
    width: 260px;
    min-width: 260px;
    max-width: 260px;
    overflow: hidden;
}

.patch-select-wrap[b-5cmpz7hryi]  .mud-input-control,
.patch-select-wrap[b-5cmpz7hryi]  .mud-input-control-input-container,
.patch-select-wrap[b-5cmpz7hryi]  .mud-input {
    width: 100%;
    min-width: 0;
}

/* Clip long selected text with an ellipsis instead of letting it push width. */
.patch-select-wrap[b-5cmpz7hryi]  .patch-select-fixed .mud-input-slot,
.patch-select-wrap[b-5cmpz7hryi]  .patch-select-fixed input {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.cc-page-head[b-5cmpz7hryi]  .patch-head-actions {
    min-width: 0;
}

/* Update button sits next to the dropdowns in the page head */
.patch-action-row[b-5cmpz7hryi]  .patch-update-btn {
    min-width: 140px;
    height: 40px;
}

.cc-page-head .patch-action-row[b-5cmpz7hryi] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-4);
    flex: 0 0 auto;
    min-width: 0;
}

/* ===== Phones: company select on its own line, patch + Update on the next =====
   MudStack renders MudBlazor's flex utilities on its root (d-flex flex-row
   align-center) and those declare !important, so these overrides must too. The
   scoped selector outranks the bare .flex-row / .align-center utilities on
   specificity, which is what settles the !important-vs-!important tie — load
   order can't, since the styles bundle is linked before MudBlazor in App.razor. */
@media (max-width: 599.98px) {
    .cc-page-head[b-5cmpz7hryi]  .patch-head-actions {
        flex: 1 1 100%;
        flex-direction: column !important;
        align-items: stretch !important;
    }

    /* Search spans the stacked column; the floor keeps its hint readable. */
    .cc-page-head[b-5cmpz7hryi]  .patch-select {
        flex: 0 0 auto;
        width: auto;
        min-width: min(100%, var(--cc-search-w));
        max-width: none;
    }

    .cc-page-head .patch-action-row[b-5cmpz7hryi] {
        flex: 1 1 auto;
    }

    .cc-page-head .patch-select-wrap[b-5cmpz7hryi] {
        flex: 1 1 auto;
        width: auto;
        min-width: 0;
        max-width: none;
    }

    .patch-action-row[b-5cmpz7hryi]  .patch-update-btn {
        flex: 0 0 auto;
        min-width: 0;
    }
}

/* ===== Phones: selection checkbox moves left ===== */
@media (max-width: 960px) {
    .cc-data-card[b-5cmpz7hryi]  .mud-sm-table .mud-table-body .mud-table-row {
        display: grid;
        grid-template-columns: auto 1fr;
        align-items: center;
        border-bottom: 2px solid var(--cc-medium-gray);
    }

    .cc-data-card[b-5cmpz7hryi]  .mud-sm-table .mud-table-body .mud-table-row:last-child {
        border-bottom: none;
    }

    .cc-data-card[b-5cmpz7hryi]  .mud-sm-table .mud-table-body .mud-table-cell {
        border-bottom: none !important;
    }

    .cc-data-card[b-5cmpz7hryi]  .mud-sm-table .mud-table-body .mud-table-cell:first-child {
        grid-column: 1;
        padding-inline-end: var(--cc-sp-2) !important;
    }
    
    .cc-data-card[b-5cmpz7hryi]  .mud-sm-table .mud-table-body .mud-table-cell:first-child::before {
        content: none;
    }

    .cc-data-card[b-5cmpz7hryi]  .mud-sm-table .mud-table-body .mud-table-cell:not(:first-child) {
        grid-column: 2;
    }
}
/* _content/SupportAppAMR/Components/Pages/PresentationYtd.razor.rz.scp.css */
/* Brand palette: --cc-red accent · --cc-black · --cc-white ·
   --cc-light-gray / --cc-medium-gray / --cc-dark-gray grays.
   Color literals in this file were replaced with the tokens above; see
   wwwroot/cc-brand.css.

   PRE-EXISTING BUG, left as-is so this commit stays non-visual: the original
   header comment was never closed, so everything down to the end of the next
   comment (the HEADER banner below) has always been swallowed — including the
   .rcm-ytd-page rule, which has therefore never applied. Closing the comment
   properly would newly apply a white background, black text and 80px of bottom
   padding to the YTD page: a visual change, and one that belongs in its own
   commit. Kept explicitly commented out so the dead code is at least obvious.

::deep .rcm-ytd-page {
    background: #ffffff;
    color: #000000;
    padding-bottom: 80px;
}

*/

/* ============  HEADER ============ */
[b-0ww0zapbdx] .mag-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 40px;
    padding: 40px 56px 28px 56px;
    margin: -16px -16px 0 -16px;
    background: #ffffff;
    border-bottom: 6px solid var(--cc-red);
}

[b-0ww0zapbdx] .mag-overline {
    font-size: calc(0.75rem + 1px);
    letter-spacing: 0.32em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--cc-brand-text);
    margin-bottom: 18px;
}

[b-0ww0zapbdx] .mag-title {
    font-size: calc(2.75rem + 1px);
    line-height: 1;
    letter-spacing: -0.01em;
    text-transform: uppercase;
    font-weight: 800;
    margin: 0;
    color: #000000;
}

[b-0ww0zapbdx] .mag-header-meta {
    text-align: right;
    flex-shrink: 0;
}

[b-0ww0zapbdx] .mag-year {
    font-size: calc(4.5rem + 1px);
    font-weight: 800;
    line-height: 1;
    color: var(--cc-brand-text);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
}

[b-0ww0zapbdx] .mag-date {
    font-size: calc(0.75rem + 1px);
    letter-spacing: 0.2em;
    text-transform: uppercase;
    font-weight: 700;
    color: #4d4d4d;
    margin-top: 6px;
}

/* ============ STAT STRIP ============ */
[b-0ww0zapbdx] .stat-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    padding: 44px 56px;
    background: #ffffff;
    border-bottom: 1px solid #ebebeb;
    gap: 0;
}

[b-0ww0zapbdx] .stat-cell {
    padding: 0 40px;
    border-left: 1px solid #ebebeb;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

[b-0ww0zapbdx] .stat-cell:first-child {
    border-left: none;
    padding-left: 0;
}

[b-0ww0zapbdx] .stat-number {
    font-size: calc(3.5rem + 1px);
    font-weight: 800;
    line-height: 1;
    color: #000000;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
    margin-bottom: 10px;
}

[b-0ww0zapbdx] .stat-number--red {
    color: var(--cc-brand-text);
}

[b-0ww0zapbdx] .stat-label {
    font-size: calc(0.75rem + 1px);
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-weight: 700;
    color: #000000;
    margin-bottom: 4px;
}

[b-0ww0zapbdx] .stat-sub {
    font-size: calc(0.8rem + 1px);
    color: #4d4d4d;
    letter-spacing: 0.02em;
}

[b-0ww0zapbdx] .stat-sub-plain {
    color: #000000;
    margin-left: 4px;
}

[b-0ww0zapbdx] .chart-block--full {
    width: 100%;
}

/* ============ FEATURE SECTIONS ============ */
[b-0ww0zapbdx] .feature-section {
    padding: 56px 56px 0 56px;
}

[b-0ww0zapbdx] .feature-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    margin-bottom: 32px;
    padding-bottom: 20px;
    border-bottom: 1px solid #000000;
    flex-wrap: wrap;
}

[b-0ww0zapbdx] .feature-kicker {
    font-size: calc(0.7rem + 1px);
    letter-spacing: 0.28em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--cc-brand-text);
    margin-bottom: 8px;
}

[b-0ww0zapbdx] .feature-title {
    font-size: calc(2rem + 1px);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -0.005em;
    line-height: 1;
    color: #000000;
    margin: 0;
}

[b-0ww0zapbdx] .feature-search {
    min-width: 280px;
    max-width: 360px;
}

/* ============ CHART PAIR ============ */
[b-0ww0zapbdx] .chart-pair {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 40px;
    align-items: stretch;
}

[b-0ww0zapbdx] .chart-block {
    background: #ffffff;
    border: 1px solid #ebebeb;
    padding: 24px 28px;
    display: flex;
    flex-direction: column;
}

[b-0ww0zapbdx] .chart-block--wide {
    /* same styling; wider via grid column */
}

[b-0ww0zapbdx] .chart-block-head {
    margin-bottom: 8px;
    padding-bottom: 12px;
    border-bottom: 1px solid #ebebeb;
}

[b-0ww0zapbdx] .chart-block .feature-kicker {
    margin-bottom: 4px;
}

[b-0ww0zapbdx] .chart-block .feature-title {
    font-size: calc(1.25rem + 1px);
    letter-spacing: 0;
}

[b-0ww0zapbdx] .chart-note {
    font-size: calc(0.75rem + 1px);
    color: #4d4d4d;
    text-align: right;
    margin-top: 8px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    font-weight: 600;
}

[b-0ww0zapbdx] .chart-note strong {
    color: var(--cc-brand-text);
    font-weight: 800;
}

@media (max-width: 1100px) {
    [b-0ww0zapbdx] .chart-pair { grid-template-columns: 1fr; }
}

/* ============ RANKING TABLE ============ */
[b-0ww0zapbdx] .ytd-grid {
    background: #ffffff;
    border: 1px solid #ebebeb;
    border-radius: 0;
}

[b-0ww0zapbdx] .ytd-grid .mud-table-head th {
    background: #000000 !important;
    color: #ffffff !important;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-size: calc(0.72rem + 1px);
    font-weight: 700;
    border-bottom: 3px solid var(--cc-red) !important;
    padding-top: 14px;
    padding-bottom: 14px;
}

[b-0ww0zapbdx] .ytd-grid .mud-table-cell {
    font-size: calc(0.95rem + 1px);
    color: #000000;
    font-variant-numeric: tabular-nums;
    padding-top: 14px;
    padding-bottom: 14px;
}

[b-0ww0zapbdx] .ytd-grid .mud-table-row:hover td {
    background-color: #fafafa !important;
}

[b-0ww0zapbdx] .cell-hero {
    font-weight: 800;
    color: var(--cc-brand-text);
    font-size: calc(1.05rem + 1px);
    font-variant-numeric: tabular-nums;
}

[b-0ww0zapbdx] .roster {
    display: flex;
    flex-direction: column;
}

[b-0ww0zapbdx] .roster-item {
    display: grid;
    grid-template-columns: 80px 1fr;
    gap: 28px;
    padding: 20px 0;
    border-top: 1px solid #ebebeb;
    align-items: baseline;
}

[b-0ww0zapbdx] .roster-item:first-child {
    border-top: none;
    padding-top: 0;
}

[b-0ww0zapbdx] .roster-item--tier1 {
    border-top: 2px solid var(--cc-red);
    padding-top: 22px;
}

[b-0ww0zapbdx] .roster-item--tier1 + .roster-item--tier2 {
    border-top-color: #b3b3b3;
}

[b-0ww0zapbdx] .roster-rank {
    font-size: calc(2rem + 1px);
    font-weight: 800;
    color: #b3b3b3;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
}

[b-0ww0zapbdx] .roster-item--tier1 .roster-rank {
    color: var(--cc-brand-text);
    font-size: calc(2.75rem + 1px);
}

[b-0ww0zapbdx] .roster-item--tier2 .roster-rank {
    color: #000000;
}

[b-0ww0zapbdx] .roster-body {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

[b-0ww0zapbdx] .roster-name {
    font-size: calc(1.5rem + 1px);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    color: #000000;
    line-height: 1.1;
}

[b-0ww0zapbdx] .roster-item--tier1 .roster-name {
    font-size: calc(2rem + 1px);
}

[b-0ww0zapbdx] .roster-facts {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 10px;
    font-size: calc(0.95rem + 1px);
    color: #4d4d4d;
    line-height: 1.4;
}

[b-0ww0zapbdx] .roster-facts .fact {
    color: #000000;
    font-weight: 600;
}

[b-0ww0zapbdx] .roster-facts .fact-num {
    font-weight: 800;
    color: #000000;
    font-variant-numeric: tabular-nums;
    margin-right: 4px;
}

[b-0ww0zapbdx] .roster-facts .fact-unit {
    font-weight: 500;
    color: #4d4d4d;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: calc(0.72rem + 1px);
}

[b-0ww0zapbdx] .roster-facts .fact-sep {
    color: #b3b3b3;
    font-weight: 400;
}

/* YoY colors */
[b-0ww0zapbdx] .yoy-up { color: #0a8f4e !important; font-weight: 700; }
[b-0ww0zapbdx] .yoy-up .fact-num { color: #0a8f4e; }
[b-0ww0zapbdx] .yoy-down { color: var(--cc-brand-text) !important; font-weight: 700; }
[b-0ww0zapbdx] .yoy-down .fact-num { color: var(--cc-brand-text); }
[b-0ww0zapbdx] .yoy-flat { color: #4d4d4d !important; font-weight: 700; }

/* ============ RESPONSIVE ============ */
@media (max-width: 1200px) {
    [b-0ww0zapbdx] .mag-title { font-size: calc(2.25rem + 1px); }
    [b-0ww0zapbdx] .mag-year { font-size: calc(3.5rem + 1px); }
    [b-0ww0zapbdx] .stat-strip { grid-template-columns: repeat(2, 1fr); gap: 32px 0; }
    [b-0ww0zapbdx] .stat-cell { padding: 0 24px; }
    [b-0ww0zapbdx] .stat-cell:nth-child(3) { border-left: none; padding-left: 0; }
    [b-0ww0zapbdx] .stat-number { font-size: calc(2.75rem + 1px); }
}

@media (max-width: 800px) {
    [b-0ww0zapbdx] .mag-header { flex-direction: column; align-items: flex-start; padding: 28px 24px 20px 24px; gap: 20px; }
    [b-0ww0zapbdx] .mag-header-meta { text-align: left; }
    [b-0ww0zapbdx] .mag-title { font-size: calc(1.75rem + 1px); }
    [b-0ww0zapbdx] .stat-strip { grid-template-columns: 1fr; padding: 28px 24px; }
    [b-0ww0zapbdx] .stat-cell { padding: 0; border-left: none; border-top: 1px solid #ebebeb; padding-top: 20px; }
    [b-0ww0zapbdx] .stat-cell:first-child { border-top: none; padding-top: 0; }
    [b-0ww0zapbdx] .feature-section { padding: 40px 24px 0 24px; }
    [b-0ww0zapbdx] .feature-title { font-size: calc(1.5rem + 1px); }
    [b-0ww0zapbdx] .roster-item { grid-template-columns: 50px 1fr; gap: 16px; }
    [b-0ww0zapbdx] .roster-item--tier1 .roster-name { font-size: calc(1.5rem + 1px); }
    [b-0ww0zapbdx] .roster-item--tier1 .roster-rank { font-size: calc(2rem + 1px); }
}
/* _content/SupportAppAMR/Components/Pages/Release.razor.rz.scp.css */
/* ===== Release Channel page ===== */
/* Fixed width on desktop — same lock as .rel-select-wrap below, so the box never
   grows or shrinks with the text inside it. Phones release it (599.98px block). */
.cc-page-head[b-u5gb0s5mz1]  .rel-filter-select {
    flex: 0 0 340px;
    width: 340px;
    min-width: 340px;
    max-width: 340px;
    overflow: hidden;
}

.cc-page-head .rel-select-wrap[b-u5gb0s5mz1] {
    flex: 0 0 260px;
    width: 260px;
    min-width: 260px;
    max-width: 260px;
    overflow: hidden;
}

.rel-select-wrap[b-u5gb0s5mz1]  .mud-input-control,
.rel-select-wrap[b-u5gb0s5mz1]  .mud-input-control-input-container,
.rel-select-wrap[b-u5gb0s5mz1]  .mud-input {
    width: 100%;
    min-width: 0;
}

.cc-page-head[b-u5gb0s5mz1]  .rel-head-actions {
    min-width: 0;
}

.rel-action-row[b-u5gb0s5mz1]  .rel-update-btn {
    min-width: 140px;
    height: 40px;
}

.cc-page-head .rel-action-row[b-u5gb0s5mz1] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-4);
    flex: 0 0 auto;
    min-width: 0;
}

/* ===== Phones: company select on its own line, channel + Update on the next =====
   MudStack renders MudBlazor's flex utilities on its root (d-flex flex-row
   align-center) and those declare !important, so these overrides must too. The
   scoped selector outranks the bare .flex-row / .align-center utilities on
   specificity, which is what settles the !important-vs-!important tie — load
   order can't, since the styles bundle is linked before MudBlazor in App.razor. */
@media (max-width: 599.98px) {
    .cc-page-head[b-u5gb0s5mz1]  .rel-head-actions {
        flex: 1 1 100%;
        flex-direction: column !important;
        align-items: stretch !important;
    }

    /* Search spans the stacked column; the floor keeps its hint readable. */
    .cc-page-head[b-u5gb0s5mz1]  .rel-filter-select {
        flex: 0 0 auto;
        width: auto;
        min-width: min(100%, var(--cc-search-w));
        max-width: none;
    }

    .cc-page-head .rel-action-row[b-u5gb0s5mz1] {
        flex: 1 1 auto;
    }

    .cc-page-head .rel-select-wrap[b-u5gb0s5mz1] {
        flex: 1 1 auto;
        width: auto;
        min-width: 0;
        max-width: none;
    }

    .rel-action-row[b-u5gb0s5mz1]  .rel-update-btn {
        flex: 0 0 auto;
        min-width: 0;
    }
}

/* ===== Phones: selection checkbox moves left ===== */
@media (max-width: 960px) {
    .cc-data-card[b-u5gb0s5mz1]  .mud-sm-table .mud-table-body .mud-table-row {
        display: grid;
        grid-template-columns: auto 1fr;
        align-items: center;
        border-bottom: 2px solid var(--cc-medium-gray);
    }

    .cc-data-card[b-u5gb0s5mz1]  .mud-sm-table .mud-table-body .mud-table-row:last-child {
        border-bottom: none;
    }

    .cc-data-card[b-u5gb0s5mz1]  .mud-sm-table .mud-table-body .mud-table-cell {
        border-bottom: none !important;
    }

    .cc-data-card[b-u5gb0s5mz1]  .mud-sm-table .mud-table-body .mud-table-cell:first-child {
        grid-column: 1;
        padding-inline-end: var(--cc-sp-2) !important;
    }
    
    .cc-data-card[b-u5gb0s5mz1]  .mud-sm-table .mud-table-body .mud-table-cell:first-child::before {
        content: none;
    }

    .cc-data-card[b-u5gb0s5mz1]  .mud-sm-table .mud-table-body .mud-table-cell:not(:first-child) {
        grid-column: 2;
    }
}
/* _content/SupportAppAMR/Components/Shared/CaseDiagnosticCard.razor.rz.scp.css */
.cc-case[b-l1amh2b6zr] {
    border-radius: var(--cc-radius-md);
    overflow: hidden;
}

/* Header band */
.cc-case-head[b-l1amh2b6zr] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--cc-sp-4);
    padding: var(--cc-sp-4) var(--cc-sp-6);
    background: var(--cc-gray-100);
    border-bottom: 1px solid var(--cc-light-gray);
}

.cc-case-num[b-l1amh2b6zr] {
    font-weight: 700;
    font-size: var(--cc-fs-md);
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
}

.cc-case-code[b-l1amh2b6zr] {
    font-family: "JetBrains Mono", "Fira Code", monospace;
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    color: var(--cc-dark-gray);
    background: var(--cc-white);
    border: 1px solid var(--cc-light-gray);
    padding: 1px var(--cc-sp-3);
    border-radius: var(--cc-radius-sm);
    white-space: nowrap;
}

.cc-case-date[b-l1amh2b6zr] {
    margin-left: auto;
    font-size: var(--cc-fs-xs);
    color: var(--cc-medium-gray);
    white-space: nowrap;
}

/* Body */
.cc-case-body[b-l1amh2b6zr] {
    padding: var(--cc-sp-5) var(--cc-sp-6) var(--cc-sp-6);
}

.cc-case-subject[b-l1amh2b6zr] {
    font-size: var(--cc-fs-md);
    font-weight: 700;
    line-height: 1.4;
    color: var(--cc-black);
}

.cc-case-submeta[b-l1amh2b6zr] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--cc-sp-2) var(--cc-sp-6);
    margin-top: var(--cc-sp-2);
    font-size: var(--cc-fs-xs);
    color: var(--cc-dark-gray);
}

.cc-case-submeta-key[b-l1amh2b6zr] {
    color: var(--cc-medium-gray);
    margin-right: var(--cc-sp-1);
}

/* Content fields */
.cc-case-field[b-l1amh2b6zr] {
    margin-top: var(--cc-sp-5);
}

.cc-case-field-label[b-l1amh2b6zr] {
    font-size: var(--cc-fs-xs);
    font-weight: 700;
    color: var(--cc-medium-gray);
    margin-bottom: var(--cc-sp-1);
}

.cc-case-field-text[b-l1amh2b6zr] {
    white-space: pre-wrap;
    word-break: break-word;
    font-size: var(--cc-fs-md);
    line-height: 1.55;
    color: var(--cc-dark-gray);
}

.cc-case-field--key[b-l1amh2b6zr] {
    border-left: 2px solid var(--cc-red);
    padding-left: var(--cc-sp-5);
}

.cc-case-field--key .cc-case-field-label[b-l1amh2b6zr] {
    color: var(--cc-red);
}

.cc-case-field--key .cc-case-field-text[b-l1amh2b6zr] {
    color: var(--cc-black);
}

/* Comments thread */
.cc-case-comments[b-l1amh2b6zr] {
    margin-top: var(--cc-sp-6);
    padding-top: var(--cc-sp-5);
    border-top: 1px solid var(--cc-light-gray);
}

.cc-case-note[b-l1amh2b6zr] {
    margin-top: var(--cc-sp-4);
}

.cc-case-note-meta[b-l1amh2b6zr] {
    font-size: var(--cc-fs-xs);
    color: var(--cc-medium-gray);
}

.cc-case-note-text[b-l1amh2b6zr] {
    white-space: pre-wrap;
    word-break: break-word;
    font-size: var(--cc-fs-sm);
    line-height: 1.5;
    color: var(--cc-dark-gray);
}
/* _content/SupportAppAMR/Components/Shared/CcModal.razor.rz.scp.css */
.cc-modal[b-yc1jkcs2a4] {
    max-width: 92vw;
    border-radius: var(--cc-radius-lg);
    overflow: hidden;
}

.cc-modal-header[b-yc1jkcs2a4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--cc-sp-6) var(--cc-sp-7);
    border-bottom: 1px solid var(--cc-light-gray);
}

.cc-modal-body[b-yc1jkcs2a4] {
    padding: var(--cc-sp-7);
}

.cc-modal-body--scroll[b-yc1jkcs2a4] {
    max-height: 60vh;
    overflow: auto;
}

.cc-modal-footer[b-yc1jkcs2a4] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--cc-sp-4);
    padding: var(--cc-sp-5) var(--cc-sp-7);
    border-top: 1px solid var(--cc-light-gray);
}
/* _content/SupportAppAMR/Components/Shared/ChatPanel.razor.rz.scp.css */
/* "Ask Josh" / AMR AI Assistant — the docked card. Its launcher is the robot icon
   in the app header (Components/Layout/MainLayout.razor); there is no FAB any more.
   Tokens only; the literals are the z-index (no token scale) and the card's own
   380x600 dimensions. */

.cc-chat-widget[b-wcz49johbc] {
    position: fixed;
    right: var(--cc-sp-8);
    bottom: var(--cc-sp-8);
    z-index: 1400; /* above MudAppBar (~1300) */
}

/* The floating action button that used to live here is gone — the launcher is now
   the robot icon in the app header (MainLayout). A 56px fixed circle bottom-right
   sat on top of table rows and card controls on denser pages, which is a permanent
   obstruction in exchange for a button pressed occasionally. */

/* ---- Chat card (open state) ---- */
.cc-chat[b-wcz49johbc] {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 380px;
    max-width: calc(100vw - var(--cc-sp-8) * 2);
    height: 600px;
    max-height: calc(100vh - var(--cc-header-h) - var(--cc-sp-8));
    display: flex;
    flex-direction: column;
    background: var(--cc-white);
    border-radius: var(--cc-radius-lg);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
    overflow: hidden;
    transform-origin: left;
    opacity: 0;
    /* Closed state sits ABOVE the resting position, so opening slides the card down
       into view and closing retracts it back up toward the header launcher. */
    transform: translateY(-12px) scale(0.98);
    pointer-events: none;
    visibility: hidden;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}

.cc-chat.open[b-wcz49johbc] {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
    visibility: visible;
}

/* Header — dark chrome with a branded robot badge. */
.cc-chat-header[b-wcz49johbc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cc-sp-2);
    padding: var(--cc-sp-5) var(--cc-sp-6);
    background: var(--cc-header-bg);
    color: var(--cc-white);
    flex: 0 0 auto;
}

.cc-chat-title[b-wcz49johbc] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-5);
    font-size: var(--cc-fs-lg);
    font-weight: 700;
}

.cc-chat-title-badge[b-wcz49johbc] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: var(--cc-radius-sm);
    background: var(--cc-red);
    color: var(--cc-white);
}

.cc-chat-header[b-wcz49johbc]  .mud-icon-button {
    color: var(--cc-white);
}

/* Message list. */
.cc-chat-body[b-wcz49johbc] {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: var(--cc-sp-6);
    display: flex;
    flex-direction: column;
    gap: var(--cc-sp-5);
    background: var(--cc-white);
}

.cc-chat-msg[b-wcz49johbc] {
    display: flex;
}

.cc-chat-msg.user[b-wcz49johbc] {
    justify-content: flex-end;
}

.cc-chat-msg.assistant[b-wcz49johbc] {
    justify-content: flex-start;
}

.cc-chat-bubble[b-wcz49johbc] {
    max-width: 85%;
    padding: var(--cc-sp-5) var(--cc-sp-6);
    border-radius: var(--cc-radius-lg);
    font-size: var(--cc-fs-sm);
    line-height: 1.45;
    word-wrap: break-word;
    overflow-wrap: anywhere;
}

.cc-chat-msg.assistant .cc-chat-bubble[b-wcz49johbc] {
    background: var(--cc-light-gray);
    color: var(--cc-black);
    border-top-left-radius: var(--cc-radius-sm);
}

.cc-chat-msg.user .cc-chat-bubble[b-wcz49johbc] {
    background: var(--cc-red);
    color: var(--cc-white);
    font-weight: 600;
    border-top-right-radius: var(--cc-radius-sm);
    white-space: pre-wrap; /* user text is plain — preserve their line breaks */
}

/* Markdown-rendered content in assistant bubbles. Injected HTML carries no
   scope attribute, so target it through ::deep. */
.cc-chat-bubble[b-wcz49johbc]  p {
    margin: 0 0 var(--cc-sp-5);
}

.cc-chat-bubble[b-wcz49johbc]  p:last-child {
    margin-bottom: 0;
}

.cc-chat-bubble[b-wcz49johbc]  ul,
.cc-chat-bubble[b-wcz49johbc]  ol {
    margin: 0 0 var(--cc-sp-5);
    padding-left: var(--cc-sp-8);
}

.cc-chat-bubble[b-wcz49johbc]  ul:last-child,
.cc-chat-bubble[b-wcz49johbc]  ol:last-child {
    margin-bottom: 0;
}

.cc-chat-bubble[b-wcz49johbc]  li {
    margin: var(--cc-sp-1) 0;
}

.cc-chat-bubble[b-wcz49johbc]  strong {
    font-weight: 700;
}

.cc-chat-bubble[b-wcz49johbc]  a {
    color: var(--cc-sf-blue);
}

.cc-chat-bubble[b-wcz49johbc]  code {
    font-family: ui-monospace, "Cascadia Code", Consolas, monospace;
    font-size: var(--cc-fs-sm);
    background: var(--cc-bg);
    padding: 0 var(--cc-sp-2);
    border-radius: var(--cc-radius-sm);
}

.cc-chat-bubble[b-wcz49johbc]  pre {
    background: var(--cc-bg);
    padding: var(--cc-sp-4);
    border-radius: var(--cc-radius-sm);
    overflow-x: auto;
    margin: 0 0 var(--cc-sp-5);
}

.cc-chat-bubble[b-wcz49johbc]  pre code {
    background: none;
    padding: 0;
}

.cc-chat-bubble[b-wcz49johbc]  h1,
.cc-chat-bubble[b-wcz49johbc]  h2,
.cc-chat-bubble[b-wcz49johbc]  h3,
.cc-chat-bubble[b-wcz49johbc]  h4 {
    font-size: var(--cc-fs-md);
    font-weight: 700;
    margin: 0 0 var(--cc-sp-4);
}

.cc-chat-error[b-wcz49johbc] {
    font-size: var(--cc-fs-sm);
    color: var(--cc-danger-text);
    background: var(--cc-light-gray);
    border-radius: var(--cc-radius-sm);
    padding: var(--cc-sp-4) var(--cc-sp-5);
}

/* Typing indicator. */
.cc-chat-typing[b-wcz49johbc] {
    display: inline-flex;
    gap: 4px;
    align-items: center;
}

.cc-chat-typing span[b-wcz49johbc] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--cc-gray-400);
    animation: cc-chat-blink-b-wcz49johbc 1.2s infinite ease-in-out both;
}

.cc-chat-typing span:nth-child(2)[b-wcz49johbc] { animation-delay: 0.2s; }
.cc-chat-typing span:nth-child(3)[b-wcz49johbc] { animation-delay: 0.4s; }

@keyframes cc-chat-blink-b-wcz49johbc {
    0%, 80%, 100% { opacity: 0.25; }
    40% { opacity: 1; }
}

/* Composer. */
.cc-chat-composer[b-wcz49johbc] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: var(--cc-sp-4);
    padding: var(--cc-sp-5);
    border-top: 1px solid var(--cc-border-subtle);
    background: var(--cc-white);
}

.cc-chat-input[b-wcz49johbc] {
    flex: 1 1 auto;
    resize: none;
    max-height: 120px;
    border: 1px solid var(--cc-gray-300);
    border-radius: var(--cc-radius-lg);
    padding: var(--cc-sp-5) var(--cc-sp-6);
    font-size: var(--cc-fs-sm);
    font-family: inherit;
    line-height: 1.4;
    color: var(--cc-black);
    background: var(--cc-white);
}

.cc-chat-input[b-wcz49johbc]::placeholder {
    color: var(--cc-medium-gray);
}

.cc-chat-input:focus[b-wcz49johbc] {
    outline: none;
    border-color: var(--cc-red);
}

.cc-chat-composer[b-wcz49johbc]  .cc-chat-send {
    flex: 0 0 auto;
    background: var(--cc-red);
    color: var(--cc-white);
    border-radius: var(--cc-radius-md);
    height: 40px;
    width: 40px;
}

.cc-chat-composer[b-wcz49johbc]  .cc-chat-send:hover {
    background: var(--cc-red-hover);
}

/* ---------------- PHONES / SMALL TABLETS: CHAT AS A PAGE ----------------
   Below the bottom-nav breakpoint the assistant stops being a floating card and
   fills the content region instead — flush between the tab bar and the bottom
   nav, both of which stay put and stay tappable. Squaring the corners and
   dropping the shadow is the point: it should read as the page area being
   replaced, not as a popup sitting on the page underneath.

   Insets (top/bottom/left/right) rather than a vh height, so the collapsing
   mobile URL bar can't push the composer below the fold. --cc-bottom-nav-total-h
   already carries the home-indicator inset, so the composer clears it. */
@media (max-width: 959.98px) {
    .cc-chat[b-wcz49johbc] {
        /* fixed, not absolute — escapes the widget's bottom-right corner offset
           and measures against the viewport instead. */
        position: fixed;
        top: calc(var(--cc-header-h) + var(--cc-tab-bar-h));
        bottom: var(--cc-bottom-nav-total-h);
        left: 0;
        right: 0;
        width: auto;
        height: auto;
        max-width: none;
        max-height: none;
        border-radius: 0;
        box-shadow: none;
        /* Rise into place instead of zooming out of the corner — a corner zoom
           reads as "popup", which is the thing being designed away. */
        transform-origin: center bottom;
        transform: translateY(var(--cc-sp-8));
    }

    .cc-chat.open[b-wcz49johbc] {
        transform: translateY(0);
    }

    /* 16px is the floor below which iOS Safari zooms the whole page on focus,
       jolting the layout every time the composer is tapped. --cc-fs-lg is 16px. */
    .cc-chat-input[b-wcz49johbc] {
        font-size: var(--cc-fs-lg);
    }

    /* The close button is the only way out — give it a full touch target. */
    .cc-chat-header[b-wcz49johbc]  .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }
}
/* _content/SupportAppAMR/Components/Shared/ConfirmDialog.razor.rz.scp.css */
/* ConfirmDialog — adds the Command Center header language on top of the shared
   .cc-dialog chrome: eyebrow above the title, an accent-railed callout for the
   value being applied, and a chip row for the affected records. */

.cc-confirm-head[b-na2la1vfmq] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-5);
}

/* Padding around the 24px Size.Medium glyph sizes the tile (40px). */
.cc-confirm-icon[b-na2la1vfmq] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--cc-sp-4);
    border-radius: var(--cc-radius-sm);
    background: var(--cc-black);
}

.cc-confirm-icon[b-na2la1vfmq]  .mud-icon-root {
    color: var(--cc-white);
}

.cc-confirm-icon.danger[b-na2la1vfmq] {
    background: var(--cc-danger);
}

/* .cc-dialog sets a 20px DinotBold uppercase title on the whole title slot;
   the eyebrow overrides the size/color for itself. */
.cc-confirm-eyebrow[b-na2la1vfmq] {
    font-family: var(--cc-font-heading);
    font-size: var(--cc-fs-xs);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: 0.1em;
    color: var(--cc-medium-gray);
    margin-bottom: var(--cc-sp-1);
}

.cc-confirm-target[b-na2la1vfmq] {
    margin-bottom: var(--cc-sp-6);
    padding: var(--cc-sp-5) var(--cc-sp-6);
    background: var(--cc-bg);
    border: 1px solid var(--cc-light-gray);
    border-left: 3px solid var(--cc-red);
    border-radius: 0 var(--cc-radius-sm) var(--cc-radius-sm) 0;
}

.cc-confirm-target-label[b-na2la1vfmq] {
    font-family: var(--cc-font-heading);
    font-size: var(--cc-fs-xs);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--cc-dark-gray);
}

.cc-confirm-target-value[b-na2la1vfmq] {
    margin-top: var(--cc-sp-1);
    font-family: var(--cc-font-medium);
    font-size: var(--cc-fs-lg);
    font-weight: 700;
    color: var(--cc-black);
    overflow-wrap: anywhere;
}

.cc-confirm-items-label[b-na2la1vfmq] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-4);
    margin-top: var(--cc-sp-7);
    font-family: var(--cc-font-heading);
    font-size: var(--cc-fs-xs);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--cc-medium-gray);
}

.cc-confirm-items-count[b-na2la1vfmq] {
    padding: var(--cc-sp-1) var(--cc-sp-3);
    border-radius: 999px;
    background: var(--cc-black);
    color: var(--cc-white);
    font-size: var(--cc-fs-xs);
    line-height: 1.2;
    letter-spacing: 0.04em;
}

/* Caps at five chip rows, then scrolls — a large selection must not push the
   confirm buttons off-screen. One row = chip font + padding + border. */
.cc-confirm-items[b-na2la1vfmq] {
    --confirm-chip-h: calc(var(--cc-fs-xs) + 2 * var(--cc-sp-3) + 2px);
    display: flex;
    flex-wrap: wrap;
    gap: var(--cc-sp-3);
    margin-top: var(--cc-sp-4);
    max-height: calc(5 * var(--confirm-chip-h) + 4 * var(--cc-sp-3) + 2 * var(--cc-sp-4));
    overflow-y: auto;
    padding: var(--cc-sp-4) var(--cc-sp-5);
    background: var(--cc-bg);
    border: 1px solid var(--cc-light-gray);
    border-radius: var(--cc-radius-md);
}

/* Matches the .cc-filter-chip pill in cc-components.css. */
.cc-confirm-item[b-na2la1vfmq] {
    display: inline-flex;
    align-items: center;
    padding: var(--cc-sp-3) var(--cc-sp-5);
    border-radius: 999px;
    background: var(--cc-white);
    border: 1px solid var(--cc-light-gray);
    font-family: var(--cc-font-medium);
    font-size: var(--cc-fs-xs);
    font-weight: 600;
    color: var(--cc-dark-gray);
    line-height: 1;
    white-space: nowrap;
}

@media (max-width: 599.98px) {
    .cc-confirm-icon[b-na2la1vfmq] { padding: var(--cc-sp-2); }
    .cc-confirm-items[b-na2la1vfmq] {
        max-height: calc(4 * var(--confirm-chip-h) + 3 * var(--cc-sp-3) + 2 * var(--cc-sp-4));
    }
}
/* _content/SupportAppAMR/Components/Shared/CopyText.razor.rz.scp.css */
/* A copyable value is an ATOMIC TOKEN, not prose.

   Without this file the .cc-copyable* classes in CopyText.razor were referenced
   but never styled anywhere, so the value was laid out as ordinary text. A
   formatted phone number — "(920) 559-1223" — carries two legal soft-wrap
   opportunities (the space and the hyphen), so in a squeezed table cell the
   browser happily broke it into "(920)" / "559-" / "1223": three lines for one
   phone number.

   The wrap is only half the damage. Because the value COULD break, the cell's
   min-content width was the widest fragment ("1223"), which told the auto table
   layout that this column was the cheapest one to compress — so it kept losing
   width to Email and Company. Making the value unbreakable raises the cell's
   min-content width to the whole string, and the layout algorithm then has to
   reserve real room for it. That is why nowrap, not a width, is the actual fix.

   Fixing it here rather than in a page's CSS fixes every caller at once: the
   phone columns on Users, Companies and Dealers all had the same bug.

   Note this is deliberately NOT solved by formatting the value with a
   non-breaking space (U+00A0) and non-breaking hyphen (U+2011). Value is what
   lands on the user's clipboard, and pasting invisible non-ASCII characters into
   a dialer or a CRM field is a worse bug than the one being fixed. */

.cc-copyable-text[b-1ia8yfwukg] {
    white-space: nowrap;
}

/* The copy button shares the cell with the text, so left to itself it competes
   for the same horizontal space. Pinning it means the value is never truncated
   to make room for its own copy affordance.
   ::deep because Class= on a MudIconButton lands on the component root, which
   scoped CSS cannot address directly. */
.cc-copyable[b-1ia8yfwukg]  .cc-copyable-btn {
    flex: 0 0 auto;
}
/* _content/SupportAppAMR/Components/Shared/CountrySelector.razor.rz.scp.css */
/* ===== Country Selector dropdown item row ===== */

/* MudStack inside ItemTemplate — width: 100% goes through ::deep */
[b-ivxpvgtfhk] .cs-item-row {
    width: 100%;
}

/* Flag emoji */
.cs-item-flag[b-ivxpvgtfhk] {
    font-size: 19px;
    line-height: 1;
}

/* Country name — fills remaining space */
.cs-item-name[b-ivxpvgtfhk] {
    flex: 1;
}
/* _content/SupportAppAMR/Components/Shared/FleetSearchBox.razor.rz.scp.css */
/* White rounded field, matching the Dashboard filter treatment. The MudAutocomplete
   root is a component boundary, so its internals are reached via ::deep. */
.fleet-search[b-d8czo4mkla]  .mud-input-control {
    background: var(--cc-white);
    border-radius: var(--cc-radius-md);
    width: 100%;
}

/* The box is a fixed-width field (pages lock the wrapper's width) — long picked
   labels clip with an ellipsis instead of stretching the control. */
.fleet-search[b-d8czo4mkla]  input {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.fleet-search[b-d8czo4mkla]  .mud-input.mud-input-outlined .mud-input-outlined-border {
    border-radius: var(--cc-radius-md);
    border-color: var(--cc-light-gray);
    transition: border-color 0.15s, box-shadow 0.15s;
}

.fleet-search[b-d8czo4mkla]  .mud-input.mud-input-outlined:hover:not(.mud-disabled) .mud-input-outlined-border {
    border-color: var(--cc-medium-gray);
}

.fleet-search[b-d8czo4mkla]  .mud-input.mud-input-outlined.mud-focused .mud-input-outlined-border {
    border-color: var(--cc-red) !important;
    border-width: 1px;
    box-shadow: 0 0 0 3px rgba(var(--cc-red-rgb), 0.12);
}

/* Suggestion rows (rendered inside the popover; the scope attribute travels
   with this component's template markup, so these still apply). */
.fleet-search-item[b-d8czo4mkla] {
    display: flex;
    align-items: center;
    gap: var(--cc-sp-4);
    min-width: 0;
    width: 100%;
}

.fleet-search-item[b-d8czo4mkla]  .fleet-search-item-icon {
    width: var(--cc-fs-xl);
    height: var(--cc-fs-xl);
    font-size: var(--cc-fs-xl);
    flex-shrink: 0;
    color: var(--cc-gray-500);
}

.fleet-search-item-mower[b-d8czo4mkla] {
    width: var(--cc-fs-2xl);
    height: var(--cc-fs-2xl);
    object-fit: contain;
    flex-shrink: 0;
}

.fleet-search-item-label[b-d8czo4mkla] {
    font-weight: 600;
    white-space: nowrap;
}

.fleet-search-item-sub[b-d8czo4mkla] {
    margin-left: auto;
    padding-left: var(--cc-sp-5);
    font-size: var(--cc-fs-xs);
    color: var(--cc-gray-500);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}