@import '_content/BlazorDateRangePicker/BlazorDateRangePicker.iitr8bszy4.bundle.scp.css';

/* /Components/CustomComponents/CatalogueSkeletonCard.razor.rz.scp.css */
/* =====================================================================
   CatalogueSkeletonCard scoped styles
   Variables are declared on .catalogue-skel-card (NOT :root) per project
   memory feedback_blazor_scoped_css_root_selector.md — scoped CSS rewrites
   :root to :root[b-xxxxx] which never matches at runtime, silently dropping
   the custom-property declarations and leaving heights at zero.
   --------------------------------------------------------------------- */

.catalogue-skel-card[b-uk7bm2lejm] {
    --skel-image-height: 220px;
    --skel-distance-height: 36px;
    display: flex;
    flex-direction: column;
    max-width: 300px;
    min-width: 230px;
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    background: var(--mud-palette-surface);
    box-shadow: var(--mud-elevation-1);
    box-sizing: border-box;
}

/* Tablet — mirrors .rental-card .image-container height: 200px @ <=959px */
@media (max-width: 1279px) {
    .catalogue-skel-card[b-uk7bm2lejm] {
        --skel-image-height: 200px;
        --skel-distance-height: 32px;
    }
}

/* Mobile — mirrors .rental-card .image-container height: 180px @ <=599px
   and .rental-card .distance-slot min-height: 28px @ <=599px */
@media (max-width: 599px) {
    .catalogue-skel-card[b-uk7bm2lejm] {
        --skel-image-height: 180px;
        --skel-distance-height: 28px;
    }
}

/* Banner: force MudSkeleton's wrapper to fill the 44px banner slot regardless
   of MudBlazor defaults. ::deep is required because MudSkeleton renders its
   own root span, and only the companion .razor.css form supports ::deep
   per project memory feedback_blazor_deep_selector_in_inline_style.md. */
.catalogue-skel-card__banner[b-uk7bm2lejm]  .mud-skeleton-rect,
.catalogue-skel-card__banner.mud-skeleton[b-uk7bm2lejm] {
    border-radius: 0;
}

/* Image area: height comes from the CSS variable so the breakpoint media
   queries above flow through without needing per-breakpoint Height="..."
   attributes on the Razor side. */
.catalogue-skel-card__image-skeleton[b-uk7bm2lejm] {
    height: var(--skel-image-height) !important;
    border-radius: 0 !important;
}

.catalogue-skel-card__image-skeleton[b-uk7bm2lejm]  .mud-skeleton-rect {
    height: var(--skel-image-height) !important;
    border-radius: 0 !important;
}

.catalogue-skel-card__body[b-uk7bm2lejm] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    padding: 12px;
    gap: 6px;
}

/* Push the pricing line to the bottom of the body so it visually anchors
   like the real card's .pricing-section + card-actions row. */
.catalogue-skel-card__price-line[b-uk7bm2lejm] {
    margin-top: auto;
}

/* Distance reservation: empty div sized via CSS variable. The live card's
   .distance-slot also reserves a constant slot whether distance is loaded
   or not — see rental-card.css:710-724. */
.catalogue-skel-card__distance-slot[b-uk7bm2lejm] {
    min-height: var(--skel-distance-height);
    flex-shrink: 0;
    border-top: 1px solid rgba(53, 160, 174, 0.08);
    background: linear-gradient(135deg, rgba(53, 160, 174, 0.02) 0%, rgba(53, 160, 174, 0.05) 100%);
}

/* Tablet body padding parity with .rental-card .card-content (10px @ <=959px) */
@media (max-width: 959px) {
    .catalogue-skel-card__body[b-uk7bm2lejm] {
        padding: 10px;
    }
}

/* Mobile body padding parity with .rental-card .card-content (8px @ <=599px) */
@media (max-width: 599px) {
    .catalogue-skel-card__body[b-uk7bm2lejm] {
        padding: 8px;
        gap: 4px;
    }
}

/* Reduced motion — covered server-side by switching Animation.Wave to
   Animation.False on every MudSkeleton, but also belt-and-braces here in
   case the JS check is unavailable (SSR, JS disconnected, etc.). */
@media (prefers-reduced-motion: reduce) {
    .catalogue-skel-card[b-uk7bm2lejm],
    .catalogue-skel-card *[b-uk7bm2lejm] {
        animation: none !important;
        transition: none !important;
    }
}
/* /Components/CustomComponents/MobileBottomSheet.razor.rz.scp.css */
/*
   MobileBottomSheet companion CSS — scoped via Blazor's b-xxxxx attribute.
   Variables MUST live on a class that renders (`.mbs-shell`), NOT :root,
   per memory feedback_blazor_scoped_css_root_selector.md.

   Z-index discipline:
     1320 — backdrop (above page, below sheet body)
     1340 — sheet body
     1350 — MobileCategoryNav drawer (sits above us by design)
     1400 — MudDialog (confirm dialogs work above the sheet)
     2000 — MudSnackbar (always on top)

   Brand tokens: primary #35a0ae, surface #ffffff, Montserrat font, 8px radii,
   text-transform: none on buttons.
*/

.mbs-shell[b-zq6xqfk1r2] {
    --mbs-primary: #35a0ae;
    --mbs-border: #e8ecf1;
    --mbs-surface: #ffffff;
    --mbs-text: #0f172a;
    --mbs-text-muted: #64748b;
    --mbs-handle: #d4d4d4;
    --mbs-backdrop: rgba(0, 0, 0, 0.42);
    --mbs-shadow: 0 -8px 32px rgba(0, 0, 0, 0.4);
    --mbs-radius: 16px;
    --mbs-z-backdrop: 1320;
    --mbs-z-body: 1340;
    --mbs-drag-y: 0px;

    position: fixed;
    inset: 0;
    z-index: var(--mbs-z-body);
    font-family: 'Montserrat', sans-serif;
    color: var(--mbs-text);
    /* Children opt back in to pointer events so taps fall through to the page
       outside our visual surfaces. */
    pointer-events: none;
}

.mbs-backdrop[b-zq6xqfk1r2] {
    position: absolute;
    inset: 0;
    background-color: var(--mbs-backdrop);
    z-index: var(--mbs-z-backdrop);
    pointer-events: auto;
    animation: mbs-fade-in-b-zq6xqfk1r2 240ms ease-out;
}

.mbs-shell.mbs-closing .mbs-backdrop[b-zq6xqfk1r2] {
    animation: mbs-fade-out-b-zq6xqfk1r2 240ms ease-in forwards;
}

.mbs-body[b-zq6xqfk1r2] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--mbs-surface);
    border-top-left-radius: var(--mbs-radius);
    border-top-right-radius: var(--mbs-radius);
    box-shadow: var(--mbs-shadow);
    display: flex;
    flex-direction: column;
    z-index: var(--mbs-z-body);
    pointer-events: auto;
    animation: mbs-slide-up-b-zq6xqfk1r2 280ms cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
    overflow: hidden;
    /* Drag composes via the CSS variable so it co-exists with the keyframe
       entrance (the keyframe runs once on open; afterwards the variable
       drives runtime drag offset). */
    transform: translateY(var(--mbs-drag-y, 0));
    transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
    padding-top: max(0px, env(safe-area-inset-top));
}

.mbs-body--dragging[b-zq6xqfk1r2] {
    /* During active drag the transition is suspended so every touchmove
       updates the position instantly without easing lag. */
    transition: none;
}

.mbs-shell.mbs-closing .mbs-body[b-zq6xqfk1r2] {
    animation: mbs-slide-down-b-zq6xqfk1r2 280ms cubic-bezier(0.32, 0, 0.67, 0) forwards;
}

/* Height variants — dvh first for browsers that support it (iOS Safari 15.4+,
   Chrome 108+, Firefox 101+), vh fallback for older. */
.mbs-shell.mbs--auto .mbs-body[b-zq6xqfk1r2] {
    max-height: 90vh;
    max-height: 90dvh;
}

.mbs-shell.mbs--half .mbs-body[b-zq6xqfk1r2] {
    height: 50vh;
    height: 50dvh;
}

.mbs-shell.mbs--full .mbs-body[b-zq6xqfk1r2] {
    height: 100vh;
    height: 100dvh;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

/* === Handle (drag affordance + swipe-close target) === */

.mbs-handle-region[b-zq6xqfk1r2] {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 8px 0 4px;
    cursor: grab;
    flex-shrink: 0;
    touch-action: none;
    -webkit-user-select: none;
    user-select: none;
}

.mbs-handle-region:active[b-zq6xqfk1r2] {
    cursor: grabbing;
}

.mbs-handle[b-zq6xqfk1r2] {
    width: 36px;
    height: 4px;
    border-radius: 2px;
    background-color: var(--mbs-handle);
}

/* === Header === */

.mbs-header[b-zq6xqfk1r2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 16px 12px;
    border-bottom: 1px solid var(--mbs-border);
    flex-shrink: 0;
}

.mbs-title[b-zq6xqfk1r2] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--mbs-text);
    margin: 0;
    line-height: 1.3;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-right: 12px;
}

.mbs-close[b-zq6xqfk1r2] {
    width: 36px;
    height: 36px;
    min-width: 44px;
    min-height: 44px;
    border-radius: 50%;
    border: 0;
    background: transparent;
    color: var(--mbs-text-muted);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 160ms ease, color 160ms ease;
    flex-shrink: 0;
    -webkit-tap-highlight-color: transparent;
}

.mbs-close:hover[b-zq6xqfk1r2],
.mbs-close:focus-visible[b-zq6xqfk1r2] {
    background-color: rgba(15, 23, 42, 0.06);
    color: var(--mbs-text);
    outline: 2px solid var(--mbs-primary);
    outline-offset: 2px;
}

.mbs-close-icon[b-zq6xqfk1r2] {
    width: 20px;
    height: 20px;
}

/* === Content (scrollable region) === */

.mbs-content[b-zq6xqfk1r2] {
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    padding: 16px;
    outline: none;
}

/* iOS form-zoom prevention — any text input inside the sheet uses 16px to
   prevent automatic zoom on focus. Mirrors the MobileCategoryNav rule. */
.mbs-content[b-zq6xqfk1r2]  input[type="text"],
.mbs-content[b-zq6xqfk1r2]  input[type="number"],
.mbs-content[b-zq6xqfk1r2]  input[type="email"],
.mbs-content[b-zq6xqfk1r2]  input[type="tel"],
.mbs-content[b-zq6xqfk1r2]  input[type="search"],
.mbs-content[b-zq6xqfk1r2]  input[type="password"],
.mbs-content[b-zq6xqfk1r2]  textarea {
    font-size: 16px;
}

/* === Footer (sticky CTA region) === */

.mbs-footer[b-zq6xqfk1r2] {
    flex-shrink: 0;
    padding: 12px 16px;
    padding-bottom: max(16px, env(safe-area-inset-bottom));
    background-color: var(--mbs-surface);
    border-top: 1px solid var(--mbs-border);
    box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.06);
}

/* Defensive brand alignment: any MudButton consumers drop into the footer
   meets WCAG 2.5.5 (44px) and the platform's button conventions
   (text-transform: none, 8px radius, Montserrat). ::deep is valid here
   because this is a companion .razor.css. */
.mbs-footer[b-zq6xqfk1r2]  .mud-button-root {
    min-height: 44px;
    text-transform: none;
    border-radius: 8px;
    font-family: 'Montserrat', sans-serif;
}

/* === Animations === */

@keyframes mbs-slide-up-b-zq6xqfk1r2 {
    from {
        transform: translateY(100%);
    }
    to {
        transform: translateY(var(--mbs-drag-y, 0));
    }
}

@keyframes mbs-slide-down-b-zq6xqfk1r2 {
    from {
        transform: translateY(var(--mbs-drag-y, 0));
    }
    to {
        transform: translateY(100%);
    }
}

@keyframes mbs-fade-in-b-zq6xqfk1r2 {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes mbs-fade-out-b-zq6xqfk1r2 {
    from { opacity: 1; }
    to { opacity: 0; }
}

/* === Reduced motion — disable entrance/exit animations and drag spring-back === */

@media (prefers-reduced-motion: reduce) {
    .mbs-body[b-zq6xqfk1r2],
    .mbs-shell.mbs-closing .mbs-body[b-zq6xqfk1r2],
    .mbs-backdrop[b-zq6xqfk1r2],
    .mbs-shell.mbs-closing .mbs-backdrop[b-zq6xqfk1r2] {
        animation: none;
    }

    .mbs-body[b-zq6xqfk1r2] {
        transition: none;
    }
}

/* === Compact-screen tuning (≤ 360px Galaxy Fold / iPhone SE) === */

@media (max-width: 360px) {
    .mbs-header[b-zq6xqfk1r2] {
        padding: 8px 12px 10px;
    }

    .mbs-content[b-zq6xqfk1r2] {
        padding: 12px;
    }

    .mbs-footer[b-zq6xqfk1r2] {
        padding-left: 12px;
        padding-right: 12px;
    }
}
/* /Components/CustomComponents/RentalDateSelector.razor.rz.scp.css */
/*
   RentalDateSelector — mobile-only style overrides applied when IsMobile=true.

   The desktop styles live in the existing inline <style> block inside
   RentalDateSelector.razor (1900+ LOC). This companion file ONLY contains
   rules scoped to .rds-mobile-shell so desktop pixel-level rendering is
   guaranteed unchanged.

   Variables MUST live on a class that renders (`.rds-mobile-shell`), NOT
   :root — Blazor scoped-CSS rewrites :root to :root[b-xxxxx] which never
   matches (per memory feedback_blazor_scoped_css_root_selector.md).

   Brand: primary teal #35a0ae, secondary #EF412c, Montserrat font.
*/

.rds-mobile-shell[b-3wqz9x8yht] {
    --rds-dot-partial: #EF412c;
    --rds-dot-start: #FFD54F;
    --rds-dot-no-delivery: #ff9800;
    --rds-primary: #35a0ae;
    --rds-text: #0f172a;
    --rds-text-muted: #64748b;
    --rds-border: #e8ecf1;
    --rds-cell-min: 48px;

    font-family: 'Montserrat', sans-serif;
}

/* === Calendar wrapper — strip desktop padding === */

.rds-mobile-shell .block-calendar-wrapper[b-3wqz9x8yht] {
    padding: 0;
}

.rds-mobile-shell .block-calendar-months[b-3wqz9x8yht] {
    flex-direction: column;
    gap: 16px;
    max-width: 100%;
    margin: 0;
}

.rds-mobile-shell .block-calendar-month[b-3wqz9x8yht] {
    max-width: 100%;
    width: 100%;
}

/* === Month header (single-month nav buttons) — 44×44 touch targets === */

.rds-mobile-shell .single-month-header[b-3wqz9x8yht] {
    padding: 0 4px 12px;
    gap: 8px;
}

.rds-mobile-shell .single-month-header .single-nav-button[b-3wqz9x8yht] {
    min-width: 44px;
    min-height: 44px;
}

.rds-mobile-shell .month-title[b-3wqz9x8yht] {
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--rds-primary);
}

/* === Weekday headers === */

.rds-mobile-shell .weekday-header[b-3wqz9x8yht] {
    font-size: 0.6875rem;
    font-weight: 700;
    padding: 4px 0;
    color: var(--rds-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* === Date grid — the headline fix for "squished" === */

.rds-mobile-shell .block-calendar-dates[b-3wqz9x8yht] {
    gap: 4px;
}

.rds-mobile-shell .date-block[b-3wqz9x8yht] {
    /* WCAG 2.5.5 minimum touch target. The existing inline rule was 45px,
       below the 44px minimum once 2px grid gap is subtracted. */
    min-height: var(--rds-cell-min);
    min-width: 44px;
    padding: 6px 4px;
    /* Override the desktop aspect-ratio: 1 so cells can grow slightly taller
       than wide on narrow viewports — keeps the day number legible. */
    aspect-ratio: auto;
    border-radius: 10px;
    border-width: 1.5px;
}

.rds-mobile-shell .date-number[b-3wqz9x8yht] {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1;
}

/* Hide per-cell price labels on mobile — too dense at 375px. The footer
   summary surface (rendered by RentalBookingPanel) shows the live price
   estimate instead. */
.rds-mobile-shell .date-price[b-3wqz9x8yht] {
    display: none;
}

/* Hide the stacked indicator-icon cluster; replace with a single colored dot
   via ::after on the relevant state classes. */
.rds-mobile-shell .date-indicators[b-3wqz9x8yht] {
    display: none;
}

.rds-mobile-shell .date-block.partial[b-3wqz9x8yht]::after,
.rds-mobile-shell .date-block.start-date[b-3wqz9x8yht]::after {
    content: '';
    position: absolute;
    bottom: 5px;
    right: 5px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    z-index: 3;
    box-shadow: 0 0 0 1.5px rgba(255, 255, 255, 0.9);
}

.rds-mobile-shell .date-block.partial[b-3wqz9x8yht]::after {
    background: var(--rds-dot-partial);
}

.rds-mobile-shell .date-block.start-date[b-3wqz9x8yht]::after {
    background: var(--rds-dot-start);
}

/* Touch users have no hover state — kill desktop hover animations so they
   don't fire on tap (`:hover` activates briefly on touch devices). */
.rds-mobile-shell .date-block.hovered[b-3wqz9x8yht],
.rds-mobile-shell .date-block.in-hover-range[b-3wqz9x8yht] {
    animation: none;
    transform: none;
}

.rds-mobile-shell .date-block.in-hover-range[b-3wqz9x8yht]::after {
    animation: none;
    display: none;
}

/* Selected/start/end states — keep brand-tinted but flatten the pulse so it
   doesn't fight the bottom-sheet's own animations. */
.rds-mobile-shell .date-block.selected[b-3wqz9x8yht] {
    animation: none;
    box-shadow: 0 2px 8px rgba(53, 160, 174, 0.25);
}

/* === Legend (above the calendar) — compact horizontal === */

.rds-mobile-shell .legend-row[b-3wqz9x8yht] {
    gap: 8px;
    justify-content: flex-start;
}

.rds-mobile-shell .legend-label[b-3wqz9x8yht] {
    font-size: 0.6875rem;
}

.rds-mobile-shell .legend-block[b-3wqz9x8yht] {
    width: 14px;
    height: 14px;
    border-radius: 3px;
}

/* === Calendar header (title + caption row) === */

.rds-mobile-shell .calendar-header-compact[b-3wqz9x8yht] {
    padding: 12px 4px;
    background: transparent;
    border-bottom: 1px solid var(--rds-border);
}

.rds-mobile-shell .calendar-title[b-3wqz9x8yht] {
    font-size: 1rem;
}

/* === Reduced motion === */

@media (prefers-reduced-motion: reduce) {
    .rds-mobile-shell .date-block.selected[b-3wqz9x8yht] {
        animation: none;
        transition: none;
    }
}

/* === Ultra-narrow tuning (≤ 360px Galaxy Fold / iPhone SE) === */

@media (max-width: 360px) {
    .rds-mobile-shell .block-calendar-dates[b-3wqz9x8yht] {
        gap: 3px;
    }

    .rds-mobile-shell .date-block[b-3wqz9x8yht] {
        min-height: 44px;
        min-width: 40px;
        padding: 4px 2px;
        border-radius: 8px;
    }

    .rds-mobile-shell .date-number[b-3wqz9x8yht] {
        font-size: 0.9375rem;
    }

    .rds-mobile-shell .month-title[b-3wqz9x8yht] {
        font-size: 1rem;
    }
}
/* /Components/CustomComponents/RentlyLogoSpinner.razor.rz.scp.css */
/*
   RentlyLogoSpinner companion CSS — scoped via Blazor's b-xxxxx attribute.
   The wrapper carries --rently-spinner-size inline so the stage can size
   itself independently of the flex column (a caption underneath would
   otherwise squeeze the stage in a column flex container).
   No :root / html / body selectors per feedback_blazor_scoped_css_root_selector.md.
*/

.rently-spinner[b-k0elh2x9f7] {
    --rently-spinner-size: 64px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    perspective: calc(var(--rently-spinner-size) * 8);
    position: relative;
    font-family: 'Montserrat', sans-serif;
}

.rently-spinner__stage[b-k0elh2x9f7] {
    position: relative;
    width: var(--rently-spinner-size);
    height: var(--rently-spinner-size);
    transform-style: preserve-3d;
    animation: rently-spinner-flip-b-k0elh2x9f7 1600ms cubic-bezier(0.5, 0, 0.5, 1) infinite;
    will-change: transform;
}

.rently-spinner__face[b-k0elh2x9f7] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
    filter: drop-shadow(0 4px 8px rgba(53, 160, 174, 0.12));
}

.rently-spinner__face--back[b-k0elh2x9f7] {
    transform: rotateY(180deg);
}

.rently-spinner__caption[b-k0elh2x9f7] {
    margin-top: 0.5rem;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.5;
    color: #424242;
    text-align: center;
}

.rently-spinner__sr-only[b-k0elh2x9f7] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@keyframes rently-spinner-flip-b-k0elh2x9f7 {
    from { transform: rotateY(0deg); }
    to   { transform: rotateY(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .rently-spinner__stage[b-k0elh2x9f7] {
        animation: rently-spinner-fade-in-b-k0elh2x9f7 240ms ease-out forwards;
        opacity: 0;
    }

    .rently-spinner__face--back[b-k0elh2x9f7] {
        display: none;
    }
}

@keyframes rently-spinner-fade-in-b-k0elh2x9f7 {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/* /Components/Gamification/TrustAccessSummary.razor.rz.scp.css */
.trust-access-summary[b-5c4b8r1nmy] {
    border-radius: 18px;
    border: 1px solid var(--mud-palette-lines-default);
    background: linear-gradient(180deg, rgba(18, 73, 80, 0.05) 0%, rgba(18, 73, 80, 0) 80%);
}

.trust-access-summary .trust-access-chiprow .mud-chip[b-5c4b8r1nmy] {
    margin-right: 0.4rem;
    margin-bottom: 0.35rem;
}

.trust-access-highlight-list[b-5c4b8r1nmy] {
    padding-left: 0.25rem;
}

.trust-access-highlight-list .mud-list-item[b-5c4b8r1nmy] {
    padding: 0.25rem 0;
}

.trust-access-metrics .trust-access-metric[b-5c4b8r1nmy] {
    border-radius: 14px;
    border: 1px dashed rgba(18, 73, 80, 0.15);
}

.trust-access-persona-list .trust-access-persona-row[b-5c4b8r1nmy] {
    gap: 0.6rem;
}

.trust-access-persona-copy[b-5c4b8r1nmy] {
    max-width: 60%;
}

.trust-access-footer[b-5c4b8r1nmy] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

@media (max-width: 960px) {
    .trust-access-persona-copy[b-5c4b8r1nmy] {
        max-width: 100%;
    }
}
/* /Components/Gamification/TrustOnboardingPrompt.razor.rz.scp.css */
.trust-onboarding-card[b-whq6752wne] {
    padding: 1.5rem;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(11, 122, 117, 0.08), rgba(18, 73, 80, 0.05));
}

.trust-onboarding-title[b-whq6752wne] {
    font-weight: 600;
    color: #124950;
}

.trust-onboarding-subtitle[b-whq6752wne] {
    color: #616161;
    font-family: 'Montserrat', sans-serif;
}

.trust-onboarding-step-desc[b-whq6752wne] {
    color: #616161;
    font-family: 'Montserrat', sans-serif;
}

.trust-onboarding-checkpoint-help[b-whq6752wne] {
    color: #757575;
    font-family: 'Montserrat', sans-serif;
}

.trust-onboarding-chip[b-whq6752wne] {
    margin-bottom: 0.25rem;
}

.trust-onboarding-alert[b-whq6752wne] {
    margin-top: 0.5rem;
    border-radius: 12px;
}

.trust-onboarding-step-list[b-whq6752wne] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.trust-onboarding-step[b-whq6752wne] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 1rem;
    align-items: flex-start;
    padding: 1rem;
    border-radius: 16px;
    background-color: rgba(255, 255, 255, 0.9);
    box-shadow: 0 4px 12px rgba(18, 73, 80, 0.08);
}

.trust-onboarding-step-complete[b-whq6752wne] {
    border-left: 4px solid rgba(46, 125, 50, 0.8);
}

.trust-onboarding-step-pending[b-whq6752wne] {
    border-left: 4px solid rgba(249, 168, 37, 0.6);
}

.trust-onboarding-step-indicator[b-whq6752wne] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    color: white;
    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.08);
}

.trust-onboarding-step-icon[b-whq6752wne] {
    font-size: 1.4rem;
}

.trust-onboarding-step-body[b-whq6752wne] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.trust-onboarding-step-title[b-whq6752wne] {
    font-weight: 600;
    color: #124950;
}

.trust-onboarding-checkpoints[b-whq6752wne] {
    margin-top: 0.25rem;
    padding-left: 0;
}

.trust-onboarding-checkpoint-item[b-whq6752wne] {
    padding-left: 0;
    min-height: unset;
}

.trust-onboarding-step-status[b-whq6752wne] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
}

@media (max-width: 768px) {
    .trust-onboarding-step[b-whq6752wne] {
        grid-template-columns: auto 1fr;
        grid-template-rows: auto auto;
    }

    .trust-onboarding-step-status[b-whq6752wne] {
        grid-column: 1 / span 2;
        justify-content: flex-end;
    }
}
/* /Components/Gamification/TrustSummaryCard.razor.rz.scp.css */
.trust-summary-card[b-mdy86fa5ys] {
    border-radius: 16px;
    padding: 1.25rem;
    background: linear-gradient(135deg, rgba(11, 122, 117, 0.08), rgba(11, 122, 117, 0.02));
    backdrop-filter: blur(6px);
}

.trust-summary-grid[b-mdy86fa5ys] {
    margin-top: 0.5rem;
}

.trust-summary-list .mud-list-item[b-mdy86fa5ys] {
    padding-left: 0;
}

.trust-summary-milestone[b-mdy86fa5ys] {
    border-radius: 12px;
    background-color: rgba(255, 193, 7, 0.08);
    border: 1px solid rgba(255, 193, 7, 0.24);
}

.trust-summary-footer[b-mdy86fa5ys] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}

.trust-summary-actions[b-mdy86fa5ys] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

@media (max-width: 600px) {
    .trust-summary-card[b-mdy86fa5ys] {
        padding: 1rem;
    }

    .trust-summary-milestone[b-mdy86fa5ys] {
        margin-top: 0.5rem;
    }
}
/* /Components/Layout/AdminLayout.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   AdminLayout responsive collapse
   Test-205 (2026-05-05): close site-wide INFO-01 from Test-204.
   The Radzen sidebar is fixed at 300px and never collapses
   on small viewports, leaving every admin page rendered ~60%
   offscreen on mobile. At ≤959.98px we hide the sidebar
   entirely and let the body grid cell fill the viewport.
   The standard MainNav drawer (which already includes admin
   nav) becomes the sole navigation entry point on mobile.
   ═══════════════════════════════════════════════════════ */

@media (max-width: 959.98px) {
    /* Hide the admin sidebar — column collapses to 0 */
    [b-udvpb0yvrp] .rz-sidebar {
        display: none !important;
        width: 0 !important;
        min-width: 0 !important;
    }

    /* Reset RadzenLayout grid so the body fills the viewport.
       Default template was: 'rz-sidebar rz-header' / 'rz-sidebar rz-body'
       New template:        'rz-header' / 'rz-body' */
    [b-udvpb0yvrp] .rz-layout {
        grid-template-areas: "rz-header" "rz-body" !important;
        grid-template-columns: 1fr !important;
    }

    /* Belt-and-braces — body should never be left-offset by the sidebar */
    [b-udvpb0yvrp] .rz-body {
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
}
/* /Components/Layout/AdminSidebar.razor.rz.scp.css */
/* ─── Admin Sidebar User Block ─── */
.adm-sidebar-user[b-d11h1ppahp] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    margin: 0 0.625rem 0.375rem;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(53, 160, 174, 0.06) 0%, rgba(53, 160, 174, 0.02) 100%);
    border: 1px solid rgba(53, 160, 174, 0.1);
}

.adm-sidebar-user__info[b-d11h1ppahp] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    gap: 0.05rem;
}

.adm-sidebar-user__name[b-d11h1ppahp] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}

.adm-sidebar-user__role[b-d11h1ppahp] {
    font-size: 0.7rem;
    color: #64748b;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
/* /Components/Layout/MaintenanceLayout.razor.rz.scp.css */
/* ============================================================
   MaintenanceLayout — minimal Rently chrome for /maintenance.

   Design intent: mirror the canonical MainLayout white-appbar
   pattern instead of the previous dark navy bar so the page
   reads as a real Rently page during a planned outage, not a
   generic 500-style error screen.

   Tokens are scoped to .ml-shell (NOT :root) per
   feedback_blazor_scoped_css_root_selector.md — Blazor scoped
   CSS rewrites :root into :root[b-xxxxx] which never matches.

   ::deep selectors are anchored to .ml-header-wrap (a plain
   page-rendered element) — passing Class onto a Radzen/Mud
   child component does NOT carry the [b-xxxxx] scope onto its
   root, per feedback_blazor_scoped_css_class_on_mud_child.md.
   ============================================================ */

.ml-shell[b-j9eiboo9rz] {
    --ml-bar-bg: #ffffff;
    --ml-bar-bg-hover: rgba(53, 160, 174, 0.08);
    --ml-bar-text: #424242;
    --ml-bar-text-muted: #616161;
    --ml-bar-divider: #e0e0e0;
    --ml-primary: #35a0ae;
    --ml-primary-dark: #256f7a;
    --ml-primary-soft: rgba(53, 160, 174, 0.12);
    --ml-warning: #f59e0b;
    --ml-warning-soft: rgba(245, 158, 11, 0.14);
    --ml-radius: 8px;
    --ml-bar-height: 64px;

    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #fafafa;
    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* =========================================================
   White RadzenHeader, mirrors MainLayout pattern.
   ========================================================= */
.ml-header-wrap[b-j9eiboo9rz] {
    flex: 0 0 auto;
    width: 100%;
    background-color: #ffffff;
    border-bottom: 1px solid var(--ml-bar-divider);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.ml-header-wrap[b-j9eiboo9rz]  .rz-header {
    background-color: #ffffff !important;
    color: var(--ml-bar-text);
    box-shadow: none;
    padding: 0;
    min-height: var(--ml-bar-height);
}

.ml-appbar-inner[b-j9eiboo9rz] {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    min-height: var(--ml-bar-height);
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 8px 24px;
}

.ml-spacer[b-j9eiboo9rz] {
    flex: 1 1 auto;
}

/* =========================================================
   Brand: tagline logo on the left.
   Sized to match MainNav (height: 46) for visual continuity.
   ========================================================= */
.ml-brand[b-j9eiboo9rz] {
    display: inline-flex;
    align-items: center;
    color: var(--ml-bar-text);
    text-decoration: none;
    padding: 4px 8px;
    border-radius: var(--ml-radius);
    transition: background-color 200ms ease;
}

.ml-brand:hover[b-j9eiboo9rz],
.ml-brand:focus-visible[b-j9eiboo9rz] {
    background-color: var(--ml-bar-bg-hover);
}

.ml-brand:focus-visible[b-j9eiboo9rz] {
    outline: 2px solid var(--ml-primary);
    outline-offset: 2px;
}

.ml-brand-logo[b-j9eiboo9rz] {
    height: 46px;
    width: auto;
    display: block;
}

/* =========================================================
   Status chip — teal-tinted pill that subtly tells visitors
   what they're looking at without screaming "ERROR".
   ========================================================= */
.ml-status-chip[b-j9eiboo9rz] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    border-radius: 999px;
    background-color: var(--ml-warning-soft);
    border: 1px solid rgba(245, 158, 11, 0.32);
    color: #b45309;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

.ml-status-dot[b-j9eiboo9rz] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #f59e0b;
    box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.18);
    animation: ml-status-pulse-b-j9eiboo9rz 2s ease-in-out infinite;
}

@keyframes ml-status-pulse-b-j9eiboo9rz {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.55; }
}

.ml-status-chip-icon[b-j9eiboo9rz]  .mud-icon-root {
    color: #b45309;
    width: 16px;
    height: 16px;
}

/* =========================================================
   Greeting + auth actions (right side of header)
   ========================================================= */
.ml-greeting[b-j9eiboo9rz] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--ml-bar-text-muted);
    white-space: nowrap;
}

.ml-logout-form[b-j9eiboo9rz] {
    margin: 0;
    padding: 0;
}

.ml-action-btn[b-j9eiboo9rz] {
    appearance: none;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    text-decoration: none;
    padding: 0 16px;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: var(--ml-radius);
    cursor: pointer;
    transition: background-color 200ms ease, border-color 200ms ease, color 200ms ease, box-shadow 200ms ease;
}

.ml-action-btn--filled[b-j9eiboo9rz] {
    background-color: var(--ml-primary);
    border: 1px solid var(--ml-primary);
    color: #ffffff;
}

.ml-action-btn--filled:hover[b-j9eiboo9rz],
.ml-action-btn--filled:focus-visible[b-j9eiboo9rz] {
    background-color: var(--ml-primary-dark);
    border-color: var(--ml-primary-dark);
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(53, 160, 174, 0.28);
}

.ml-action-btn--outline[b-j9eiboo9rz] {
    background-color: transparent;
    border: 1px solid var(--ml-bar-divider);
    color: var(--ml-bar-text);
}

.ml-action-btn--outline:hover[b-j9eiboo9rz],
.ml-action-btn--outline:focus-visible[b-j9eiboo9rz] {
    background-color: var(--ml-bar-bg-hover);
    border-color: var(--ml-primary);
    color: var(--ml-primary-dark);
}

.ml-action-btn:focus-visible[b-j9eiboo9rz] {
    outline: 2px solid var(--ml-primary);
    outline-offset: 2px;
}

.ml-action-btn-icon[b-j9eiboo9rz]  .mud-icon-root {
    width: 18px;
    height: 18px;
    color: inherit;
}

/* =========================================================
   Body — let the page own its own height + background.
   ========================================================= */
.ml-body[b-j9eiboo9rz] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 960px) {
    .ml-appbar-inner[b-j9eiboo9rz] {
        padding: 8px 16px;
        gap: 12px;
    }

    .ml-brand-logo[b-j9eiboo9rz] {
        height: 40px;
    }
}

@media (max-width: 599px) {
    .ml-appbar-inner[b-j9eiboo9rz] {
        padding: 8px 12px;
        gap: 8px;
    }

    .ml-brand-logo[b-j9eiboo9rz] {
        height: 36px;
    }

    .ml-status-chip-label[b-j9eiboo9rz] {
        display: none;
    }

    .ml-status-chip[b-j9eiboo9rz] {
        padding: 6px 8px;
    }

    .ml-greeting[b-j9eiboo9rz] {
        display: none;
    }

    .ml-action-btn[b-j9eiboo9rz] {
        padding: 0 12px;
    }

    .ml-action-btn-label[b-j9eiboo9rz] {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ml-brand[b-j9eiboo9rz],
    .ml-action-btn[b-j9eiboo9rz],
    .ml-status-dot[b-j9eiboo9rz] {
        transition: none !important;
        animation: none !important;
    }
}
/* /Components/Layout/SuccessAmbassadorLayoutNoMaxWidth.razor.rz.scp.css */
/* Success Ambassador layout responsive reflow.
   Default Radzen grid reserves a 300px sidebar column which renders
   off-screen on phones (narrow viewports) and severely cramps tablets.
   Below 960px we collapse to a single-column layout and hide the
   sidebar. The MainNav hamburger already offers navigation for those
   widths; a dedicated SA drawer will follow in a later pass. */

@media (max-width: 959.98px) {
    .sa-layout-root .sa-layout-grid[b-vwylwpnb48] {
        grid-template-areas: 'rz-header' 'rz-body' !important;
        grid-template-columns: 1fr !important;
    }

    /* ::deep reaches the RadzenSidebar rendered inside the child
       SuccessAmbassadorSidebar component (scoped CSS otherwise stops
       at the component boundary). */
    .sa-layout-root[b-vwylwpnb48]  .rz-sidebar {
        display: none !important;
    }

    .sa-layout-root[b-vwylwpnb48]  .rz-body {
        padding-left: 0 !important;
    }
}
/* /Components/Pages/Account/Lockout.razor.rz.scp.css */
/* ============================================================
   Lockout (Test-202) — Rently Account Lockout Page
   Tokens scoped to .lp-wrapper (NOT :root — scoped-CSS silent-fail
   gotcha per feedback_blazor_scoped_css_root_selector.md).
   ::deep selectors anchored to plain page-rendered elements
   (NOT classes passed into MudBlazor children — see
   feedback_blazor_scoped_css_class_on_mud_child.md).
   Mirrors Maintenance/Error token system for consistency.
   ============================================================ */

.lp-wrapper[b-td8v0ssyp6] {
    --lp-primary: #35a0ae;
    --lp-primary-dark: #256f7a;
    --lp-primary-darker: #1b4f57;
    --lp-primary-soft: rgba(53, 160, 174, 0.08);
    --lp-primary-soft-strong: rgba(53, 160, 174, 0.18);
    --lp-warning: #f59e0b;
    --lp-success: #16a34a;
    --lp-ink: #0f1e21;
    --lp-muted: #64748b;
    --lp-border: #e2e8f0;
    --lp-border-strong: #cbd5e1;
    --lp-surface: #ffffff;
    --lp-surface-raised: #f8fafc;
    --lp-bg: #f8fafc;
    --lp-radius: 8px;
    --lp-radius-lg: 16px;
    --lp-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 3px rgba(15, 23, 42, 0.06);
    --lp-shadow-md: 0 4px 6px rgba(15, 23, 42, 0.05), 0 10px 15px rgba(15, 23, 42, 0.05);
    --lp-transition: 200ms ease;

    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--lp-ink);
    min-height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    background-color: var(--lp-bg);
}

/* =========================================================
   Hero band — full-bleed teal gradient
   ========================================================= */
.lp-hero-band[b-td8v0ssyp6] {
    background: linear-gradient(135deg, var(--lp-primary-dark) 0%, var(--lp-primary) 60%, #5db2be 100%);
    color: #ffffff;
    padding: 56px 24px 64px;
    position: relative;
    overflow: hidden;
}

.lp-hero-band[b-td8v0ssyp6]::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 85% 20%, rgba(255, 255, 255, 0.14) 0%, transparent 42%),
        radial-gradient(circle at 15% 85%, rgba(255, 255, 255, 0.10) 0%, transparent 42%);
    pointer-events: none;
}

.lp-hero-inner[b-td8v0ssyp6] {
    max-width: 720px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    text-align: center;
}

.lp-hero-icon-frame[b-td8v0ssyp6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.16);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, 0.22);
    margin: 0 auto 20px;
}

.lp-hero-icon-frame[b-td8v0ssyp6]  .mud-icon-root {
    color: #ffffff;
    width: 36px;
    height: 36px;
}

.lp-hero-title[b-td8v0ssyp6] {
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(1.875rem, 2.5vw + 1rem, 2.5rem);
    font-weight: 700;
    line-height: 1.15;
    margin: 0 0 12px;
    color: #ffffff;
    letter-spacing: -0.015em;
}

.lp-hero-subtitle[b-td8v0ssyp6] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.94);
    margin: 0 auto;
    max-width: 540px;
}

/* =========================================================
   Content area — calm, narrow column
   ========================================================= */
.lp-content[b-td8v0ssyp6] {
    max-width: 640px;
    width: 100%;
    margin: -32px auto 0;
    padding: 0 24px 64px;
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 16px;
    flex: 1;
}

.lp-info-card[b-td8v0ssyp6] {
    background: var(--lp-surface);
    border-radius: var(--lp-radius-lg);
    box-shadow: var(--lp-shadow-md);
    padding: 28px 24px;
    border: 1px solid var(--lp-border);
}

.lp-info-card-row[b-td8v0ssyp6] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.lp-info-card-body[b-td8v0ssyp6] {
    min-width: 0;
    flex: 1 1 auto;
}

.lp-info-card-icon-frame[b-td8v0ssyp6] {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--lp-primary-soft);
}

.lp-info-card-icon-frame[b-td8v0ssyp6]  .mud-icon-root {
    color: var(--lp-primary-dark);
    width: 24px;
    height: 24px;
}

.lp-info-card-icon-frame--warning[b-td8v0ssyp6] {
    background: rgba(245, 158, 11, 0.12);
}

.lp-info-card-icon-frame--warning[b-td8v0ssyp6]  .mud-icon-root {
    color: #b45309;
}

.lp-info-card-icon-frame--success[b-td8v0ssyp6] {
    background: rgba(22, 163, 74, 0.12);
}

.lp-info-card-icon-frame--success[b-td8v0ssyp6]  .mud-icon-root {
    color: var(--lp-success);
}

.lp-info-card-title[b-td8v0ssyp6] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.0625rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--lp-ink);
    margin: 0 0 6px;
}

.lp-info-card-text[b-td8v0ssyp6] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.55;
    color: var(--lp-muted);
    margin: 0;
}

.lp-info-card-text + .lp-info-card-text[b-td8v0ssyp6] {
    margin-top: 8px;
}

.lp-info-card-text strong[b-td8v0ssyp6] {
    color: var(--lp-ink);
    font-weight: 600;
}

/* =========================================================
   Action row — anchors styled as buttons. Plain <a href>
   keeps navigation reliable even when interactive circuit
   is degraded — important for an auth-failure page that
   may render before SignalR attaches.
   ========================================================= */
.lp-action-row[b-td8v0ssyp6] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 20px;
}

.lp-btn[b-td8v0ssyp6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 20px;
    border-radius: var(--lp-radius);
    border: 1px solid transparent;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.2;
    text-transform: none;
    letter-spacing: 0;
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--lp-transition), border-color var(--lp-transition), color var(--lp-transition), box-shadow var(--lp-transition);
}

.lp-btn:focus-visible[b-td8v0ssyp6] {
    outline: 2px solid var(--lp-primary);
    outline-offset: 2px;
}

.lp-btn--filled[b-td8v0ssyp6] {
    background-color: var(--lp-primary);
    color: #ffffff;
}

.lp-btn--filled:hover[b-td8v0ssyp6] {
    background-color: var(--lp-primary-dark);
    color: #ffffff;
}

.lp-btn--outlined[b-td8v0ssyp6] {
    background-color: transparent;
    border-color: var(--lp-border-strong);
    color: var(--lp-ink);
}

.lp-btn--outlined:hover[b-td8v0ssyp6] {
    border-color: var(--lp-primary);
    background-color: var(--lp-primary-soft);
    color: var(--lp-primary-dark);
}

.lp-btn-icon[b-td8v0ssyp6]  .mud-icon-root {
    width: 20px;
    height: 20px;
    color: inherit;
}

/* =========================================================
   Footnote — support link for unauthorised-attempt reports
   ========================================================= */
.lp-footnote[b-td8v0ssyp6] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--lp-muted);
    margin: 8px 0 0;
    text-align: center;
}

.lp-footnote a[b-td8v0ssyp6] {
    color: var(--lp-primary-dark);
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* =========================================================
   Responsive — tablet (≤960) and mobile (≤599)
   ========================================================= */
@media (max-width: 960px) {
    .lp-hero-band[b-td8v0ssyp6] {
        padding: 44px 20px 56px;
    }

    .lp-content[b-td8v0ssyp6] {
        padding: 0 16px 48px;
    }
}

@media (max-width: 599px) {
    .lp-hero-band[b-td8v0ssyp6] {
        padding: 36px 16px 48px;
    }

    .lp-hero-icon-frame[b-td8v0ssyp6] {
        width: 64px;
        height: 64px;
        margin-bottom: 16px;
    }

    .lp-hero-icon-frame[b-td8v0ssyp6]  .mud-icon-root {
        width: 32px;
        height: 32px;
    }

    .lp-hero-title[b-td8v0ssyp6] {
        font-size: 1.625rem;
    }

    .lp-hero-subtitle[b-td8v0ssyp6] {
        font-size: 0.9375rem;
    }

    .lp-content[b-td8v0ssyp6] {
        padding: 0 12px 40px;
        gap: 12px;
    }

    .lp-info-card[b-td8v0ssyp6] {
        padding: 22px 18px;
    }

    .lp-info-card-row[b-td8v0ssyp6] {
        gap: 12px;
    }

    .lp-info-card-title[b-td8v0ssyp6] {
        font-size: 1rem;
    }

    .lp-info-card-text[b-td8v0ssyp6] {
        font-size: 0.9rem;
    }

    .lp-action-row[b-td8v0ssyp6] {
        flex-direction: column;
    }

    .lp-btn[b-td8v0ssyp6] {
        width: 100%;
    }
}

/* =========================================================
   Reduced motion guard
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
    .lp-btn[b-td8v0ssyp6] {
        transition: none !important;
    }
}
/* /Components/Pages/Account/Organization/OrganizationInvites.razor.rz.scp.css */
/* Organization Invites - scoped styles (Test-184, 2026-04-19) */

[b-g6lfjms7uo] .page-title-h1 {
    font-family: 'Montserrat', sans-serif;
    color: #1d707b;
    font-weight: 600;
    margin: 0;
}

[b-g6lfjms7uo] .invites-action-bar {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

/* Defense against Rently MudTheme Secondary=#EF412c (red) trap on body text */
[b-g6lfjms7uo] .invites-subtitle,
[b-g6lfjms7uo] .invites-meta {
    font-family: 'Montserrat', sans-serif;
    color: #616161 !important;
}

[b-g6lfjms7uo] .invites-subtitle {
    font-size: 0.95rem;
}

[b-g6lfjms7uo] .invites-meta {
    font-size: 0.875rem;
}

/* Invitation card */
[b-g6lfjms7uo] .invitation-card {
    border-radius: 8px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

[b-g6lfjms7uo] .invitation-card .mud-card-content {
    padding: 20px;
}

[b-g6lfjms7uo] .invitation-card .invite-org-name {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    color: #212121;
}

[b-g6lfjms7uo] .invitation-card .invite-fallback-avatar {
    background-color: #35a0ae;
    color: #ffffff;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
    [b-g6lfjms7uo] .invitation-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    }
}

/* Accept / Decline buttons - WCAG 2.5.8 target size + Rently brand */
[b-g6lfjms7uo] .invite-action-btn {
    min-height: 44px;
    border-radius: 8px !important;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    text-transform: none;
}

/* Empty state */
[b-g6lfjms7uo] .invites-empty-card {
    background-color: #ffffff;
    border-radius: 8px;
}

[b-g6lfjms7uo] .invites-empty-icon {
    font-size: 72px !important;
    color: #757575;
    width: 72px;
    height: 72px;
}

[b-g6lfjms7uo] .invites-empty-title {
    font-family: 'Montserrat', sans-serif;
    color: #1d707b;
    font-weight: 600;
}

[b-g6lfjms7uo] .invites-empty-text {
    font-family: 'Montserrat', sans-serif;
    color: #616161;
    text-align: center;
    max-width: 420px;
}

/* History section */
[b-g6lfjms7uo] .invites-history-heading {
    font-family: 'Montserrat', sans-serif;
    color: #1d707b;
    font-weight: 600;
    margin-top: 12px;
}

[b-g6lfjms7uo] .invites-history-table {
    border-radius: 8px;
    overflow: hidden;
}

[b-g6lfjms7uo] .invites-history-table thead th {
    background-color: #f5f5f5;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    color: #424242;
}

[b-g6lfjms7uo] .invites-history-table tbody td {
    font-family: 'Montserrat', sans-serif;
    color: #424242;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

/* Mobile breakpoint - stack action bar, stretch buttons */
@media (max-width: 599px) {
    [b-g6lfjms7uo] .invites-action-bar {
        flex-direction: column;
        align-items: stretch;
    }

    [b-g6lfjms7uo] .invite-action-btn {
        width: 100%;
    }

    [b-g6lfjms7uo] .invitation-card .mud-card-actions {
        flex-direction: column;
        gap: 8px;
    }

    [b-g6lfjms7uo] .invites-history-table td,
    [b-g6lfjms7uo] .invites-history-table th {
        padding: 8px;
        font-size: 0.85rem;
    }

    [b-g6lfjms7uo] .invites-empty-icon {
        font-size: 56px !important;
        width: 56px;
        height: 56px;
    }
}

@media (prefers-reduced-motion: reduce) {
    [b-g6lfjms7uo] .invitation-card,
    [b-g6lfjms7uo] .invitation-card * {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}
/* /Components/Pages/Account/Profile.razor.rz.scp.css */
[b-i4qet2vy2q] .profile-dashboard-container {
    padding-bottom: 2rem;
}

[b-i4qet2vy2q] .trust-journey-card {
    border-radius: 18px;
    padding: 2rem;
    background: linear-gradient(135deg, rgba(11, 122, 117, 0.08), rgba(53, 160, 174, 0.04));
    box-shadow: var(--mud-elevation-2);
}

[b-i4qet2vy2q] .profile-trust-step-card {
    border-radius: 16px;
    padding: 1.25rem;
    border: 1px solid rgba(11, 122, 117, 0.12);
    background-color: var(--mud-palette-surface);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

[b-i4qet2vy2q] .profile-trust-step-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--mud-elevation-6);
}

[b-i4qet2vy2q] .profile-trust-step-card-complete {
    border-color: rgba(76, 175, 80, 0.35);
}

[b-i4qet2vy2q] .profile-trust-step-card-pending {
    border-color: rgba(239, 108, 0, 0.35);
}

[b-i4qet2vy2q] .profile-trust-step-avatar {
    box-shadow: 0 10px 24px rgba(11, 122, 117, 0.18);
}

[b-i4qet2vy2q] .profile-trust-step-checkpoints .mud-list-item {
    padding-left: 0;
}

[b-i4qet2vy2q] .profile-trust-step-checkpoints .mud-icon {
    font-size: 1.1rem;
}

[b-i4qet2vy2q] .profile-reward-highlights {
    margin-bottom: 1.5rem;
}

[b-i4qet2vy2q] .profile-highlight-card {
    border-radius: 18px;
    padding: 1.5rem;
    background-color: var(--mud-palette-surface);
    box-shadow: var(--mud-elevation-2);
    height: 100%;
}

[b-i4qet2vy2q] .profile-highlight-card .mud-chip {
    border-radius: 999px;
}

[b-i4qet2vy2q] .profile-highlight-baseline {
    background: linear-gradient(135deg, rgba(11, 122, 117, 0.12), rgba(11, 122, 117, 0.04));
}

[b-i4qet2vy2q] .profile-highlight-rewards {
    background: linear-gradient(135deg, rgba(53, 160, 174, 0.12), rgba(53, 160, 174, 0.04));
}

[b-i4qet2vy2q] .profile-highlight-momentum {
    background: linear-gradient(135deg, rgba(33, 150, 243, 0.12), rgba(33, 150, 243, 0.05));
}

[b-i4qet2vy2q] .profile-highlight-checkpoints {
    margin-top: 0.5rem;
}

[b-i4qet2vy2q] .profile-highlight-chips {
    margin-top: 0.75rem;
}

@media (max-width: 960px) {
    [b-i4qet2vy2q] .trust-journey-card {
        padding: 1.5rem;
    }

    [b-i4qet2vy2q] .profile-highlight-card {
        padding: 1.25rem;
    }
}

[b-i4qet2vy2q] .profile-trust-summary {
    border-radius: 18px;
    border: 1px solid rgba(33, 150, 243, 0.18);
    background: linear-gradient(135deg, rgba(53, 160, 174, 0.12), rgba(53, 160, 174, 0.03));
    padding: 1.5rem;
}

[b-i4qet2vy2q] .profile-trust-summary .trust-access-metrics .trust-access-metric {
    border: 1px solid rgba(53, 160, 174, 0.18);
    border-radius: 16px;
}

[b-i4qet2vy2q] .profile-trust-summary .trust-access-persona-list {
    margin-top: 0.75rem;
}

[b-i4qet2vy2q] .profile-trust-summary-skeleton {
    border-radius: 18px;
    opacity: 0.85;
}

[b-i4qet2vy2q] .profile-subtitle-muted {
    color: rgba(0, 0, 0, 0.6) !important;
}

@media (max-width: 600px) {
    [b-i4qet2vy2q] .profile-action-btn {
        min-height: 44px;
    }
}
/* /Components/Pages/Admin/AdminFiles/AdminFileManagementPage.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   File Management — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard / DatabaseMigrations standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-f1119fkukk] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-f1119fkukk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-f1119fkukk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-f1119fkukk] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-f1119fkukk] .adm-breadcrumbs {
    padding: 0;
}

[b-f1119fkukk] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-f1119fkukk] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-f1119fkukk] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-f1119fkukk] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-f1119fkukk] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-f1119fkukk] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--green[b-f1119fkukk] {
    background: #22c55e;
}

.adm-status-pill__dot--red[b-f1119fkukk] {
    background: #ef4444;
}

.adm-status-pill__time[b-f1119fkukk] {
    color: #64748b;
    font-size: 0.7rem;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-f1119fkukk] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem 1.5rem 1rem;
    flex-wrap: wrap;
}

.adm-page-header__title[b-f1119fkukk] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.adm-page-header__icon[b-f1119fkukk] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, #35a0ae 0%, #2a8290 100%);
    color: #ffffff;
    flex-shrink: 0;
}

.adm-page-header__h1[b-f1119fkukk] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
    line-height: 1.3;
}

.adm-page-header__sub[b-f1119fkukk] {
    font-size: 0.85rem;
    color: #64748b;
    margin: 0.25rem 0 0;
    max-width: 500px;
}

.adm-page-header__tools[b-f1119fkukk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

[b-f1119fkukk] .adm-refresh-btn {
    min-width: 36px;
    min-height: 36px;
    color: #64748b;
}

[b-f1119fkukk] .adm-back-btn {
    border-color: #e2e8f0;
    color: #475569;
    text-transform: none;
    border-radius: 8px;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-f1119fkukk] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    padding: 0 1.5rem 1rem;
}

.adm-kpi[b-f1119fkukk] {
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    padding: 1rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.adm-kpi__top[b-f1119fkukk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-kpi__label[b-f1119fkukk] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.adm-kpi__value[b-f1119fkukk] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-f1119fkukk] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    padding: 0 1.5rem 1.5rem;
}

.adm-detail-card[b-f1119fkukk] {
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    padding: 0.875rem 1rem;
    border-left: 3px solid var(--card-bar, #35a0ae);
}

.adm-detail-card__label[b-f1119fkukk] {
    font-size: 0.72rem;
    font-weight: 500;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.adm-detail-card__value[b-f1119fkukk] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
    margin-top: 0.25rem;
}

/* ═══════════════════════════════════════════════════════
   CONTENT / TABS
   ═══════════════════════════════════════════════════════ */
.adm-content[b-f1119fkukk] {
    padding: 0 1.5rem 1.5rem;
}

[b-f1119fkukk] .adm-tabs .mud-tabs-header {
    background: #ffffff;
    border-radius: 10px 10px 0 0;
    border: 1px solid #e8ecf1;
    border-bottom: none;
}

[b-f1119fkukk] .adm-tabs .mud-tab {
    text-transform: none;
    font-weight: 500;
    font-size: 0.85rem;
    color: #64748b;
    min-height: 44px;
}

[b-f1119fkukk] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-f1119fkukk] .adm-tabs .mud-tabs-toolbar-content .mud-tab-slider {
    background: #35a0ae;
}

.adm-tab-content[b-f1119fkukk] {
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-top: none;
    border-radius: 0 0 10px 10px;
    padding: 1.25rem;
}

/* ─── Tab Toolbar ─── */
.adm-tab-toolbar[b-f1119fkukk] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

[b-f1119fkukk] .adm-search-field {
    flex: 1;
    min-width: 200px;
    max-width: 400px;
}

[b-f1119fkukk] .adm-search-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #e2e8f0;
}

[b-f1119fkukk] .adm-upload-btn {
    text-transform: none;
    border-radius: 8px;
    font-weight: 500;
    min-height: 40px;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
[b-f1119fkukk] .adm-table {
    border-radius: 8px;
    overflow: hidden;
}

[b-f1119fkukk] .adm-table .mud-table-head .mud-table-cell {
    font-size: 0.72rem;
    font-weight: 600;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    padding: 0.75rem 1rem;
}

[b-f1119fkukk] .adm-table .mud-table-body .mud-table-cell {
    font-size: 0.85rem;
    color: #334155;
    padding: 0.625rem 1rem;
    border-bottom: 1px solid #f1f5f9;
}

[b-f1119fkukk] .adm-table-row--clickable {
    cursor: pointer;
}

[b-f1119fkukk] .adm-table-row--clickable:hover {
    background: #f8fafc !important;
}

/* File name cell */
.adm-file-name-cell[b-f1119fkukk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-file-name[b-f1119fkukk] {
    font-weight: 500;
    color: #1e293b;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 300px;
}

/* Type badges */
.adm-type-badge[b-f1119fkukk] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.adm-type-badge--image[b-f1119fkukk] {
    background: #f3e8ff;
    color: #7c3aed;
}

.adm-type-badge--doc[b-f1119fkukk] {
    background: #dbeafe;
    color: #2563eb;
}

/* ═══════════════════════════════════════════════════════
   STATES
   ═══════════════════════════════════════════════════════ */
.adm-loading[b-f1119fkukk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    padding: 2rem;
}

.adm-error-state[b-f1119fkukk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    padding: 2rem;
}

.adm-empty-state[b-f1119fkukk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 200px;
    padding: 2rem;
    border: 2px dashed #e2e8f0;
    border-radius: 10px;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 960px
   ═══════════════════════════════════════════════════════ */
@media (max-width: 960px) {
    .adm-kpi-strip[b-f1119fkukk] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-f1119fkukk] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-page-header[b-f1119fkukk] {
        flex-direction: column;
        padding: 1rem;
    }

    .adm-page-header__tools[b-f1119fkukk] {
        width: 100%;
        justify-content: flex-end;
    }

    [b-f1119fkukk] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }

    [b-f1119fkukk] .adm-upload-btn {
        min-height: 44px;
    }

    .adm-tab-toolbar[b-f1119fkukk] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-f1119fkukk] .adm-search-field {
        max-width: 100%;
    }

    .adm-file-name[b-f1119fkukk] {
        max-width: 200px;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 600px
   ═══════════════════════════════════════════════════════ */
@media (max-width: 600px) {
    .adm-kpi-strip[b-f1119fkukk] {
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
        padding: 0 0.75rem 0.75rem;
    }

    .adm-kpi__value[b-f1119fkukk] {
        font-size: 1.25rem;
    }

    .adm-detail-grid[b-f1119fkukk] {
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
        padding: 0 0.75rem 0.75rem;
    }

    .adm-actionbar[b-f1119fkukk] {
        padding: 0.5rem 0.75rem;
    }

    .adm-content[b-f1119fkukk] {
        padding: 0 0.75rem 0.75rem;
    }

    .adm-tab-content[b-f1119fkukk] {
        padding: 0.75rem;
    }

    .adm-page-header__h1[b-f1119fkukk] {
        font-size: 1.25rem;
    }

    .adm-file-name[b-f1119fkukk] {
        max-width: 140px;
    }

    [b-f1119fkukk] .adm-table .mud-table-body .mud-table-cell {
        font-size: 0.8rem;
        padding: 0.5rem 0.75rem;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 2000px+ (2K displays)
   ═══════════════════════════════════════════════════════ */
@media (min-width: 2000px) {
    .adm-kpi-strip[b-f1119fkukk] {
        max-width: 1600px;
    }

    .adm-detail-grid[b-f1119fkukk] {
        max-width: 1600px;
    }

    .adm-content[b-f1119fkukk] {
        max-width: 1600px;
    }
}
/* /Components/Pages/Admin/AgentApplications/AgentApplications.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Agent Applications — Nordic Control Panel
   Inherits from AnalyticsDashboard design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-s9ln9y9kn3] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-s9ln9y9kn3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-s9ln9y9kn3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-s9ln9y9kn3] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-s9ln9y9kn3] .adm-breadcrumbs {
    padding: 0;
}

[b-s9ln9y9kn3] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-s9ln9y9kn3] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-s9ln9y9kn3] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-s9ln9y9kn3] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-s9ln9y9kn3] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-s9ln9y9kn3] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-s9ln9y9kn3] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-s9ln9y9kn3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-s9ln9y9kn3] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-s9ln9y9kn3] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-s9ln9y9kn3] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-s9ln9y9kn3] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-s9ln9y9kn3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-s9ln9y9kn3] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-s9ln9y9kn3] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-s9ln9y9kn3] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-s9ln9y9kn3] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-s9ln9y9kn3] {
    border-right: none;
}

.adm-kpi:hover[b-s9ln9y9kn3] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-s9ln9y9kn3] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-s9ln9y9kn3] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-s9ln9y9kn3] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-s9ln9y9kn3] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-s9ln9y9kn3] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-s9ln9y9kn3] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-s9ln9y9kn3] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-s9ln9y9kn3] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-s9ln9y9kn3] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-s9ln9y9kn3] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-s9ln9y9kn3] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-s9ln9y9kn3] .adm-tabs {
    background: transparent;
}

[b-s9ln9y9kn3] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-s9ln9y9kn3] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-s9ln9y9kn3] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-s9ln9y9kn3] .adm-tabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-s9ln9y9kn3] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-s9ln9y9kn3] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-s9ln9y9kn3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-s9ln9y9kn3] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-s9ln9y9kn3] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-s9ln9y9kn3] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-s9ln9y9kn3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-s9ln9y9kn3] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-s9ln9y9kn3] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-s9ln9y9kn3] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLES
   ═══════════════════════════════════════════════════════ */
[b-s9ln9y9kn3] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-s9ln9y9kn3] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-s9ln9y9kn3] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-s9ln9y9kn3] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-s9ln9y9kn3] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-s9ln9y9kn3] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ─── Empty State ─── */
.adm-empty-state[b-s9ln9y9kn3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 1.5rem;
}

/* ─── Chip contrast fixes (WCAG AA) ─── */
[b-s9ln9y9kn3] .adm-table .mud-chip-color-warning {
    color: #92400e !important;
}

[b-s9ln9y9kn3] .adm-table .mud-chip-color-success {
    color: #15803d !important;
}

[b-s9ln9y9kn3] .adm-table .mud-chip-color-error {
    color: #991b1b !important;
}

[b-s9ln9y9kn3] .adm-table .mud-chip-color-info {
    color: #1e40af !important;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-s9ln9y9kn3] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-s9ln9y9kn3] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-s9ln9y9kn3] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-s9ln9y9kn3] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-s9ln9y9kn3] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-s9ln9y9kn3] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-tab-toolbar[b-s9ln9y9kn3] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-s9ln9y9kn3] {
        width: 100%;
        margin-left: 0;
        flex-wrap: wrap;
    }

    [b-s9ln9y9kn3] .adm-filter-field {
        max-width: 100%;
        width: 100%;
        min-width: 0;
    }

    /* Mobile touch targets 44px */
    [b-s9ln9y9kn3] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }

    /* Refresh button touch target */
    [b-s9ln9y9kn3] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-s9ln9y9kn3] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-s9ln9y9kn3] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-s9ln9y9kn3] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-s9ln9y9kn3] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-tab-toolbar[b-s9ln9y9kn3] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-s9ln9y9kn3] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    /* Overflow for table on mobile */
    [b-s9ln9y9kn3] .adm-table .mud-table-container {
        overflow-x: auto;
    }
}
/* /Components/Pages/Admin/AgentApplications/ViewAgentApplication.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   View Agent Application Dialog — Nordic Style
   ═══════════════════════════════════════════════════════ */

.app-detail-shell[b-vv59tzmigu] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* ─── Status Banner ─── */
.app-status-banner[b-vv59tzmigu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 600;
}

.app-status-banner--pending[b-vv59tzmigu] {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
}

.app-status-banner--approved[b-vv59tzmigu] {
    background: #dcfce7;
    color: #15803d;
    border: 1px solid #bbf7d0;
}

.app-status-banner--rejected[b-vv59tzmigu] {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.app-status-date[b-vv59tzmigu] {
    margin-left: auto;
    font-size: 0.78rem;
    font-weight: 400;
    opacity: 0.8;
}

/* ─── Tabs override ─── */
[b-vv59tzmigu] .mud-tabs-toolbar {
    min-height: auto;
}

[b-vv59tzmigu] .mud-tab {
    text-transform: none;
    font-weight: 500;
    font-size: 0.85rem;
    padding: 0.625rem 1rem;
    color: #64748b;
}

[b-vv59tzmigu] .mud-tab:hover {
    color: #35a0ae;
}

[b-vv59tzmigu] .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-vv59tzmigu] .mud-tab-slider {
    background: #35a0ae;
}

/* ─── Section ─── */
.app-section[b-vv59tzmigu] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* ─── Field Grid ─── */
.app-field-grid[b-vv59tzmigu] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
}

.app-field[b-vv59tzmigu] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.app-field--full[b-vv59tzmigu] {
    grid-column: 1 / -1;
}

.app-field__label[b-vv59tzmigu] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 600;
}

.app-field__value[b-vv59tzmigu] {
    font-size: 0.875rem;
    color: #1e293b;
    line-height: 1.5;
}

.app-field__value--masked[b-vv59tzmigu] {
    cursor: help;
    color: #475569;
}

.app-field__value--multiline[b-vv59tzmigu] {
    white-space: pre-wrap;
    word-break: break-word;
    background: #f8f9fb;
    border: 1px solid #e8ecf1;
    border-radius: 6px;
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    color: #334155;
    max-height: 120px;
    overflow-y: auto;
}

/* ─── Checklist Grid ─── */
.app-check-grid[b-vv59tzmigu] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.625rem;
}

.app-check-item[b-vv59tzmigu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: #334155;
    padding: 0.5rem 0.75rem;
    background: #f8f9fb;
    border: 1px solid #e8ecf1;
    border-radius: 6px;
}

/* ─── Meta ─── */
.app-meta[b-vv59tzmigu] {
    display: flex;
    justify-content: flex-end;
    font-size: 0.75rem;
    color: #94a3b8;
    padding-top: 0.25rem;
}

/* ─── Responsive ─── */
@media (max-width: 600px) {
    .app-field-grid[b-vv59tzmigu] {
        grid-template-columns: 1fr;
    }

    .app-check-grid[b-vv59tzmigu] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Admin/Analytics/AnalyticsDashboard.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Rently Admin Design System — "Nordic Control Panel"
   Light-mode enterprise dashboard with flat hierarchy,
   action bars, and functional density.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-g8z3nd5s20] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR — Top-level breadcrumb + status row
   Sits flush at the top like a real admin toolbar.
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-g8z3nd5s20] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-g8z3nd5s20] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-g8z3nd5s20] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-g8z3nd5s20] .adm-breadcrumbs {
    padding: 0;
}

[b-g8z3nd5s20] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-g8z3nd5s20] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-g8z3nd5s20] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-g8z3nd5s20] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-g8z3nd5s20] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-g8z3nd5s20] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-g8z3nd5s20] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-g8z3nd5s20] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__time[b-g8z3nd5s20] {
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER — Title + Date controls
   Clean white section below the action bar.
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-g8z3nd5s20] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-g8z3nd5s20] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-g8z3nd5s20] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-g8z3nd5s20] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-g8z3nd5s20] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-g8z3nd5s20] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Date Picker */
[b-g8z3nd5s20] .adm-date-picker {
    max-width: 250px;
    min-width: 190px;
}

[b-g8z3nd5s20] .adm-date-picker .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-g8z3nd5s20] .adm-date-picker .mud-input {
    color: #334155 !important;
    font-size: 0.85rem;
}

[b-g8z3nd5s20] .adm-date-picker .mud-input-label {
    color: #64748b !important;
}

/* Refresh Button */
[b-g8z3nd5s20] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-g8z3nd5s20] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP — Compact metric tiles below header
   Horizontal row sitting on the page background.
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-g8z3nd5s20] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-g8z3nd5s20] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-g8z3nd5s20] {
    border-right: none;
}

.adm-kpi:hover[b-g8z3nd5s20] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-g8z3nd5s20] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-g8z3nd5s20] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

/* Semantic KPI icon colors — replaces the old inline Style="color: #..." literals.
   #f97316 (warm orange) is used for "Page Views" instead of brand red #EF412c
   so the metric tile doesn't accidentally signal "error" alongside a positive number. */
[b-g8z3nd5s20] .adm-kpi__icon--users    { color: #35a0ae; }
[b-g8z3nd5s20] .adm-kpi__icon--sessions { color: #3b82f6; }
[b-g8z3nd5s20] .adm-kpi__icon--views    { color: #f97316; }
[b-g8z3nd5s20] .adm-kpi__icon--engagement { color: #f59e0b; }

.adm-kpi__label[b-g8z3nd5s20] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-g8z3nd5s20] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* Live variant */
.adm-kpi--live[b-g8z3nd5s20] {
    background: rgba(34, 197, 94, 0.03);
}

.adm-kpi--live:hover[b-g8z3nd5s20] {
    background: rgba(34, 197, 94, 0.06);
}

/* ─── Pulse Dot ─── */
.adm-pulse-dot[b-g8z3nd5s20] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #22c55e;
    animation: adm-pulse-b-g8z3nd5s20 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.4);
}

.adm-pulse-dot--lg[b-g8z3nd5s20] {
    width: 14px;
    height: 14px;
}

@keyframes adm-pulse-b-g8z3nd5s20 {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.45);
    }
    50% {
        box-shadow: 0 0 0 8px rgba(34, 197, 94, 0);
    }
}

/* Respect users who've requested reduced motion — disables the pulse + any other
   transitions on hover/active states. Test-156 / Test-200 precedent. */
@media (prefers-reduced-motion: reduce) {
    .adm-pulse-dot[b-g8z3nd5s20] {
        animation: none;
    }

    .adm-kpi[b-g8z3nd5s20],
    .adm-detail-card[b-g8z3nd5s20],
    .adm-realtime-page__bar[b-g8z3nd5s20] {
        transition: none;
    }
}

/* ═══════════════════════════════════════════════════════
   PREVIEW BANNER
   ═══════════════════════════════════════════════════════ */
.adm-preview-banner[b-g8z3nd5s20] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem 1.5rem;
    background: #fefce8;
    border-bottom: 1px solid #fde68a;
    color: #92400e;
    font-size: 0.82rem;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   ERROR PANEL — Recovery affordance when API fetch fails
   Banded panel with retry button, shown above the tabs.
   ═══════════════════════════════════════════════════════ */
.adm-error-panel[b-g8z3nd5s20] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 1.125rem 1.5rem;
    margin: 1rem 1.5rem;
    border-radius: 12px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-left: 4px solid #dc2626;
}

[b-g8z3nd5s20] .adm-error-panel__icon {
    font-size: 2rem !important;
    color: #dc2626;
    flex-shrink: 0;
}

.adm-error-panel__body[b-g8z3nd5s20] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1;
    min-width: 0;
}

.adm-error-panel__title[b-g8z3nd5s20] {
    font-size: 1rem;
    font-weight: 600;
    color: #7f1d1d;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-error-panel__message[b-g8z3nd5s20] {
    font-size: 0.85rem;
    color: #7f1d1d;
    line-height: 1.5;
    margin: 0;
    max-width: 64ch;
}

[b-g8z3nd5s20] .adm-error-panel__btn {
    align-self: flex-start;
    border-radius: 8px !important;
    text-transform: none !important;
    min-height: 44px;
    margin-top: 0.25rem;
}

/* MudProgressLinear consistent radius across all loading states */
[b-g8z3nd5s20] .adm-progress-linear {
    border-radius: 4px;
}

/* Audience pie/donut/bar chart consistent height */
[b-g8z3nd5s20] .adm-pie-chart {
    height: 250px;
}

/* Behavior tab inline arrow icon between Referrer→Page columns */
[b-g8z3nd5s20] .adm-flow-arrow {
    color: #64748b;
}

/* ═══════════════════════════════════════════════════════
   ONBOARDING — Setup required state
   ═══════════════════════════════════════════════════════ */
.adm-onboard[b-g8z3nd5s20] {
    display: flex;
    gap: 2.5rem;
    align-items: flex-start;
    padding: 2rem 1.5rem;
    margin: 1rem 1.5rem;
    border-radius: 12px;
    background: #ffffff;
    border: 1px dashed rgba(53, 160, 174, 0.3);
}

.adm-onboard__left[b-g8z3nd5s20] {
    flex: 0 0 340px;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.adm-onboard__icon-wrap[b-g8z3nd5s20] {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: rgba(53, 160, 174, 0.06);
    margin-bottom: 0.25rem;
}

/* Onboarding text/icon scoped classes — replaces previous inline Styles */
[b-g8z3nd5s20] .adm-onboard__cloud-icon {
    font-size: 3rem !important;
    color: #35a0ae;
}

[b-g8z3nd5s20] .adm-onboard__title {
    color: #1e293b;
    font-size: 1.25rem;
    font-weight: 600;
}

[b-g8z3nd5s20] .adm-onboard__body {
    color: #64748b;
    line-height: 1.6;
    max-width: 380px;
}

[b-g8z3nd5s20] .adm-onboard__step-body-text {
    color: #64748b;
}

/* Realtime hero text colors — replaces inline Styles */
[b-g8z3nd5s20] .adm-realtime-hero__heading {
    color: #475569;
    font-weight: 500;
}

[b-g8z3nd5s20] .adm-realtime-hero__caption {
    color: #64748b;
}

.adm-onboard__steps[b-g8z3nd5s20] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.adm-onboard__step[b-g8z3nd5s20] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 0.75rem 0;
}

.adm-onboard__step-num[b-g8z3nd5s20] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #35a0ae;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.82rem;
    flex-shrink: 0;
}

.adm-onboard__step-body[b-g8z3nd5s20] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.adm-onboard__step-connector[b-g8z3nd5s20] {
    width: 2px;
    height: 14px;
    background: rgba(53, 160, 174, 0.15);
    margin-left: 14px;
    border-radius: 1px;
}

.adm-code-block[b-g8z3nd5s20] {
    background: #0f172a;
    color: #e2e8f0;
    border-radius: 8px;
    padding: 1rem 1.25rem;
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.8rem;
    line-height: 1.6;
    overflow-x: auto;
    white-space: pre;
    border: 1px solid rgba(51, 65, 85, 0.6);
    margin-top: 0.5rem;
}

/* ═══════════════════════════════════════════════════════
   TABS — Flat tabs sitting directly on page bg
   ═══════════════════════════════════════════════════════ */
[b-g8z3nd5s20] .adm-tabs {
    background: transparent;
}

[b-g8z3nd5s20] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-g8z3nd5s20] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-g8z3nd5s20] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-g8z3nd5s20] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-g8z3nd5s20] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-g8z3nd5s20] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR — Per-tab action bar
   Each tab gets its own header with title + tools.
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-g8z3nd5s20] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-g8z3nd5s20] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-g8z3nd5s20] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-g8z3nd5s20] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-g8z3nd5s20] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-g8z3nd5s20] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-g8z3nd5s20] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-g8z3nd5s20] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS — Inline section dividers
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-g8z3nd5s20] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-g8z3nd5s20] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-g8z3nd5s20] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS — Overview tab metric cards
   Flat cards with left accent bar.
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-g8z3nd5s20] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-g8z3nd5s20] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-g8z3nd5s20] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-g8z3nd5s20] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
    background: #94a3b8; /* fallback when no semantic modifier is applied */
}

/* Semantic detail-card colors — accent bar + icon both pull from one variable per metric,
   keeping bar-and-icon visually paired. Page Views moved off brand-red #EF412c to warm
   orange so positive metrics never read as "error". Bounce Rate keeps red because high
   bounce IS a negative signal — color reinforces meaning here. */
.adm-detail-card--users      .adm-detail-card__bar[b-g8z3nd5s20] { background: #35a0ae; }
.adm-detail-card--new-users  .adm-detail-card__bar[b-g8z3nd5s20] { background: #16a34a; }
.adm-detail-card--sessions   .adm-detail-card__bar[b-g8z3nd5s20] { background: #3b82f6; }
.adm-detail-card--views      .adm-detail-card__bar[b-g8z3nd5s20] { background: #f97316; }
.adm-detail-card--duration   .adm-detail-card__bar[b-g8z3nd5s20] { background: #f59e0b; }
.adm-detail-card--bounce     .adm-detail-card__bar[b-g8z3nd5s20] { background: #dc2626; }

[b-g8z3nd5s20] .adm-detail-card--users      .adm-detail-card__icon { color: #35a0ae; }
[b-g8z3nd5s20] .adm-detail-card--new-users  .adm-detail-card__icon { color: #16a34a; }
[b-g8z3nd5s20] .adm-detail-card--sessions   .adm-detail-card__icon { color: #3b82f6; }
[b-g8z3nd5s20] .adm-detail-card--views      .adm-detail-card__icon { color: #f97316; }
[b-g8z3nd5s20] .adm-detail-card--duration   .adm-detail-card__icon { color: #f59e0b; }
[b-g8z3nd5s20] .adm-detail-card--bounce     .adm-detail-card__icon { color: #dc2626; }

.adm-detail-card__data[b-g8z3nd5s20] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-g8z3nd5s20] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-g8z3nd5s20] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   CHART PANELS — Clean chart containers
   ═══════════════════════════════════════════════════════ */
.adm-chart-row[b-g8z3nd5s20] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-chart-panel[b-g8z3nd5s20] {
    border-radius: 10px;
    padding: 1.25rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
}

.adm-chart-panel__header[b-g8z3nd5s20] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.875rem;
}

.adm-audience-grid[b-g8z3nd5s20] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0.75rem;
    padding: 0 1.5rem 0.5rem;
}

/* ═══════════════════════════════════════════════════════
   TABLES — Clean flat tables
   ═══════════════════════════════════════════════════════ */
[b-g8z3nd5s20] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-g8z3nd5s20] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-g8z3nd5s20] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-g8z3nd5s20] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-g8z3nd5s20] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-g8z3nd5s20] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ─── Event Tag ─── */
.adm-event-tag[b-g8z3nd5s20] {
    display: inline-block;
    padding: 0.175rem 0.5rem;
    border-radius: 4px;
    background: rgba(53, 160, 174, 0.07);
    color: #0e7490;
    font-size: 0.8rem;
    font-weight: 500;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
}

/* ─── Monospace ─── */
.adm-mono[b-g8z3nd5s20] {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #334155;
}

/* ═══════════════════════════════════════════════════════
   REALTIME TAB
   ═══════════════════════════════════════════════════════ */
.adm-realtime-hero[b-g8z3nd5s20] {
    padding: 2.5rem 1.5rem;
    text-align: center;
    background: linear-gradient(180deg, rgba(34, 197, 94, 0.03) 0%, #ffffff 100%);
    border-bottom: 1px solid #f1f5f9;
}

.adm-realtime-hero__content[b-g8z3nd5s20] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.375rem;
}

.adm-realtime-hero__ring[b-g8z3nd5s20] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(22, 163, 74, 0.06);
    margin-bottom: 0.375rem;
}

.adm-realtime-hero__counter[b-g8z3nd5s20] {
    font-size: 4rem;
    font-weight: 800;
    color: #0f172a;
    line-height: 1;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
}

/* ─── Realtime Bar Chart ─── */
.adm-realtime-pages[b-g8z3nd5s20] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0.5rem 1.5rem 1.5rem;
}

.adm-realtime-page[b-g8z3nd5s20] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.5rem 0;
}

.adm-realtime-page__title[b-g8z3nd5s20] {
    flex: 0 0 180px;
    font-size: 0.85rem;
    color: #334155;
    font-weight: 500;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.adm-realtime-page__bar-wrap[b-g8z3nd5s20] {
    flex: 1;
    height: 26px;
    background: #f3f4f6;
    border-radius: 4px;
    overflow: hidden;
}

.adm-realtime-page__bar[b-g8z3nd5s20] {
    height: 100%;
    background: linear-gradient(90deg, #35a0ae, #5db2be);
    border-radius: 4px;
    min-width: 4px;
    transition: width 0.4s ease;
}

.adm-realtime-page__count[b-g8z3nd5s20] {
    flex: 0 0 40px;
    font-size: 0.875rem;
    font-weight: 700;
    color: #0f172a;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-g8z3nd5s20] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-g8z3nd5s20] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-g8z3nd5s20] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-g8z3nd5s20] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-chart-row[b-g8z3nd5s20] {
        grid-template-columns: 1fr;
    }

    .adm-audience-grid[b-g8z3nd5s20] {
        grid-template-columns: 1fr;
    }

    .adm-onboard[b-g8z3nd5s20] {
        flex-direction: column;
        gap: 1.5rem;
        margin: 0.75rem;
    }

    .adm-onboard__left[b-g8z3nd5s20] {
        flex: none;
    }

    .adm-page-header[b-g8z3nd5s20] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-g8z3nd5s20] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-g8z3nd5s20] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-realtime-page__title[b-g8z3nd5s20] {
        flex: 0 0 120px;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-g8z3nd5s20] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-g8z3nd5s20] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-g8z3nd5s20] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-g8z3nd5s20] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-g8z3nd5s20] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-g8z3nd5s20] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-g8z3nd5s20] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-g8z3nd5s20] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-chart-row[b-g8z3nd5s20] {
        padding: 0 0.875rem 1rem;
    }

    .adm-audience-grid[b-g8z3nd5s20] {
        padding: 0 0.875rem 0.5rem;
    }

    .adm-section-header[b-g8z3nd5s20],
    .adm-tab-toolbar[b-g8z3nd5s20] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-g8z3nd5s20] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    [b-g8z3nd5s20] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    .adm-tab-toolbar[b-g8z3nd5s20] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-g8z3nd5s20] {
        width: 100%;
        margin-left: 0;
    }

    .adm-realtime-hero__counter[b-g8z3nd5s20] {
        font-size: 3rem;
    }

    .adm-realtime-hero[b-g8z3nd5s20] {
        padding: 1.75rem 0.875rem;
    }

    .adm-realtime-pages[b-g8z3nd5s20] {
        padding: 0.5rem 0.875rem 1.25rem;
    }

    .adm-realtime-page[b-g8z3nd5s20] {
        flex-wrap: wrap;
    }

    .adm-realtime-page__title[b-g8z3nd5s20] {
        flex: 0 0 100%;
        text-align: left;
    }

    .adm-onboard[b-g8z3nd5s20] {
        padding: 1.25rem;
        margin: 0.5rem;
    }

    [b-g8z3nd5s20] .adm-date-picker {
        max-width: 100%;
        flex: 1;
    }
}
/* /Components/Pages/Admin/Assistants/Assistants.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Assistants Index — Nordic Control Panel shell + hero grid.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-984eawksp6] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

/* ─── Action bar ─── */
.adm-actionbar[b-984eawksp6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-984eawksp6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-984eawksp6] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

[b-984eawksp6] .adm-breadcrumbs {
    padding: 0;
}

[b-984eawksp6] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-984eawksp6] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-984eawksp6] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-984eawksp6] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

.adm-status-pill[b-984eawksp6] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-984eawksp6] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-984eawksp6] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

/* ─── Page header ─── */
.adm-page-header[b-984eawksp6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-984eawksp6] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-984eawksp6] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-984eawksp6] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-984eawksp6] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
    max-width: 720px;
}

/* ─── Section header ─── */
.adm-section-header[b-984eawksp6] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-984eawksp6] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-984eawksp6] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ─── Hero grid ─── */
.ast-index-grid[b-984eawksp6] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1rem;
    padding: 0 1.5rem 2rem;
}

@media (max-width: 960px) {
    .adm-page-header[b-984eawksp6] {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-984eawksp6] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-984eawksp6] {
        padding: 1rem 0.875rem;
    }

    .adm-section-header[b-984eawksp6] {
        padding: 0.875rem 0.875rem 0.5rem;
    }

    .ast-index-grid[b-984eawksp6] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1.5rem;
        gap: 0.75rem;
    }
}
/* /Components/Pages/Admin/Assistants/Curator.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Curator workspace — Nordic shell + character accent.
   ═══════════════════════════════════════════════════════ */

.adm-shell[b-8cuh4pcimc] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

.adm-shell--curator[b-8cuh4pcimc] {
    --ast-accent: #a855f7;
}

.adm-status-pill[b-8cuh4pcimc] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-8cuh4pcimc] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-8cuh4pcimc] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.adm-status-pill__dot--warn[b-8cuh4pcimc] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__dot--off[b-8cuh4pcimc] {
    background: #94a3b8;
}

.adm-kpi-strip[b-8cuh4pcimc] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-8cuh4pcimc] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
}

.adm-kpi:last-child[b-8cuh4pcimc] {
    border-right: none;
}

.adm-kpi__top[b-8cuh4pcimc] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-8cuh4pcimc] .adm-kpi__icon {
    color: var(--ast-accent) !important;
    opacity: 0.8;
    font-size: 1rem !important;
}

.adm-kpi__label[b-8cuh4pcimc] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-8cuh4pcimc] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.adm-section-header[b-8cuh4pcimc] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.5rem;
}

.adm-section-header__title[b-8cuh4pcimc] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-8cuh4pcimc] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

@media (max-width: 960px) {
    .adm-kpi-strip[b-8cuh4pcimc] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-8cuh4pcimc] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-8cuh4pcimc] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 600px) {
    .adm-kpi[b-8cuh4pcimc] {
        padding: 0.875rem 1rem;
    }

    .adm-kpi__value[b-8cuh4pcimc] {
        font-size: 1.25rem;
    }

    .adm-section-header[b-8cuh4pcimc] {
        padding: 0.875rem 0.875rem 0.5rem;
    }
}
/* /Components/Pages/Admin/Assistants/Pulse.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Pulse workspace — Nordic shell + character accent.
   ═══════════════════════════════════════════════════════ */

.adm-shell[b-7edu2hj663] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

.adm-shell--pulse[b-7edu2hj663] {
    --ast-accent: #EF412c;
}

.adm-status-pill[b-7edu2hj663] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-7edu2hj663] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-7edu2hj663] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.adm-status-pill__dot--warn[b-7edu2hj663] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__dot--off[b-7edu2hj663] {
    background: #94a3b8;
}

.adm-kpi-strip[b-7edu2hj663] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-7edu2hj663] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
}

.adm-kpi:last-child[b-7edu2hj663] {
    border-right: none;
}

.adm-kpi__top[b-7edu2hj663] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-7edu2hj663] .adm-kpi__icon {
    color: var(--ast-accent) !important;
    opacity: 0.8;
    font-size: 1rem !important;
}

.adm-kpi__label[b-7edu2hj663] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-7edu2hj663] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.adm-section-header[b-7edu2hj663] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.5rem;
}

.adm-section-header__title[b-7edu2hj663] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-7edu2hj663] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

@media (max-width: 960px) {
    .adm-kpi-strip[b-7edu2hj663] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-7edu2hj663] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-7edu2hj663] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 600px) {
    .adm-kpi[b-7edu2hj663] {
        padding: 0.875rem 1rem;
    }

    .adm-kpi__value[b-7edu2hj663] {
        font-size: 1.125rem;
    }

    .adm-section-header[b-7edu2hj663] {
        padding: 0.875rem 0.875rem 0.5rem;
    }
}
/* /Components/Pages/Admin/Assistants/Resolve.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Resolve workspace — Nordic shell + character accent.
   Adds an inputs panel above the toolbar.
   ═══════════════════════════════════════════════════════ */

.adm-shell[b-14hwvccezk] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

.adm-shell--resolve[b-14hwvccezk] {
    --ast-accent: #10b981;
}

/* ─── Status pill ─── */
.adm-status-pill[b-14hwvccezk] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-14hwvccezk] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-14hwvccezk] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.adm-status-pill__dot--warn[b-14hwvccezk] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__dot--off[b-14hwvccezk] {
    background: #94a3b8;
}

/* ─── KPI strip ─── */
.adm-kpi-strip[b-14hwvccezk] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-14hwvccezk] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
}

.adm-kpi:last-child[b-14hwvccezk] {
    border-right: none;
}

.adm-kpi__top[b-14hwvccezk] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-14hwvccezk] .adm-kpi__icon {
    color: var(--ast-accent) !important;
    opacity: 0.75;
    font-size: 1rem !important;
}

.adm-kpi__label[b-14hwvccezk] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-14hwvccezk] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ─── Section header ─── */
.adm-section-header[b-14hwvccezk] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.5rem;
}

.adm-section-header__title[b-14hwvccezk] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-14hwvccezk] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ─── Inputs panel ─── */
.resolve-inputs[b-14hwvccezk] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    padding: 0.75rem 1.5rem 1rem;
}

.resolve-input-row[b-14hwvccezk] {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 0.75rem;
}

.resolve-input[b-14hwvccezk] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.resolve-input--narrow[b-14hwvccezk] {
    max-width: 180px;
}

.resolve-input__label[b-14hwvccezk] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #334155;
    letter-spacing: 0.01em;
}

[b-14hwvccezk] .resolve-input__field .mud-input-outlined-border {
    border-radius: 8px;
}

[b-14hwvccezk] .resolve-input__field .mud-input.mud-input-outlined .mud-input-slot {
    background: #ffffff;
}

.resolve-input__help[b-14hwvccezk] {
    font-size: 0.72rem;
    color: #64748b;
}

/* ─── Responsive ─── */
@media (max-width: 960px) {
    .adm-kpi-strip[b-14hwvccezk] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-14hwvccezk] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-14hwvccezk] {
        border-top: 1px solid #f1f5f9;
    }

    .resolve-input-row[b-14hwvccezk] {
        grid-template-columns: 1fr;
    }

    .resolve-input--narrow[b-14hwvccezk] {
        max-width: none;
    }
}

@media (max-width: 600px) {
    .adm-kpi[b-14hwvccezk] {
        padding: 0.875rem 1rem;
    }

    .adm-kpi__value[b-14hwvccezk] {
        font-size: 1.25rem;
    }

    .adm-section-header[b-14hwvccezk] {
        padding: 0.875rem 0.875rem 0.5rem;
    }

    .resolve-inputs[b-14hwvccezk] {
        padding: 0.5rem 0.875rem 0.875rem;
    }
}
/* /Components/Pages/Admin/Assistants/Sentinel.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Sentinel workspace — Nordic shell + character accent.
   ═══════════════════════════════════════════════════════ */

.adm-shell[b-sr4bcp33nx] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

.adm-shell--sentinel[b-sr4bcp33nx] {
    --ast-accent: #f59e0b;
}

.adm-status-pill[b-sr4bcp33nx] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-sr4bcp33nx] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-sr4bcp33nx] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.adm-status-pill__dot--warn[b-sr4bcp33nx] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__dot--off[b-sr4bcp33nx] {
    background: #94a3b8;
}

.adm-kpi-strip[b-sr4bcp33nx] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-sr4bcp33nx] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
}

.adm-kpi:last-child[b-sr4bcp33nx] {
    border-right: none;
}

.adm-kpi__top[b-sr4bcp33nx] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-sr4bcp33nx] .adm-kpi__icon {
    color: var(--ast-accent) !important;
    opacity: 0.85;
    font-size: 1rem !important;
}

.adm-kpi__label[b-sr4bcp33nx] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-sr4bcp33nx] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.adm-section-header[b-sr4bcp33nx] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.5rem;
}

.adm-section-header__title[b-sr4bcp33nx] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-sr4bcp33nx] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

@media (max-width: 960px) {
    .adm-kpi-strip[b-sr4bcp33nx] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-sr4bcp33nx] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-sr4bcp33nx] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 600px) {
    .adm-kpi[b-sr4bcp33nx] {
        padding: 0.875rem 1rem;
    }

    .adm-kpi__value[b-sr4bcp33nx] {
        font-size: 1.25rem;
    }

    .adm-section-header[b-sr4bcp33nx] {
        padding: 0.875rem 0.875rem 0.5rem;
    }
}
/* /Components/Pages/Admin/Assistants/Shared/AssistantFindingList.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   AssistantFindingList — Render the AssistantFinding[] envelope
   into a vertical stack of cards. Severity drives the left bar
   and icon colour.
   ═══════════════════════════════════════════════════════ */

.ast-findings[b-ole7l81bdd] {
    padding: 0;
    --ast-accent: #35a0ae;
}

.ast-findings__list[b-ole7l81bdd] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    padding: 1rem 1.5rem;
}

.ast-findings__empty[b-ole7l81bdd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem 2rem;
    color: #94a3b8;
    font-size: 0.85rem;
    text-align: center;
}

.ast-finding[b-ole7l81bdd] {
    position: relative;
    display: flex;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    overflow: hidden;
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.ast-finding:hover[b-ole7l81bdd] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
}

.ast-finding__bar[b-ole7l81bdd] {
    width: 4px;
    flex-shrink: 0;
    background: #94a3b8;
}

.ast-finding--ok .ast-finding__bar[b-ole7l81bdd] {
    background: #16a34a;
}

.ast-finding--info .ast-finding__bar[b-ole7l81bdd] {
    background: #3b82f6;
}

.ast-finding--warning .ast-finding__bar[b-ole7l81bdd] {
    background: #f59e0b;
}

.ast-finding--critical .ast-finding__bar[b-ole7l81bdd] {
    background: #dc2626;
}

.ast-finding--critical[b-ole7l81bdd] {
    border-color: rgba(239, 68, 68, 0.2);
}

.ast-finding__body[b-ole7l81bdd] {
    flex: 1;
    padding: 0.875rem 1.125rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
}

.ast-finding__head[b-ole7l81bdd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.ast-finding__title-row[b-ole7l81bdd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

[b-ole7l81bdd] .ast-finding__icon .mud-icon-root {
    flex-shrink: 0;
}

.ast-finding--ok[b-ole7l81bdd]  .ast-finding__icon .mud-icon-root {
    color: #15803d;
}

.ast-finding--info[b-ole7l81bdd]  .ast-finding__icon .mud-icon-root {
    color: #1d4ed8;
}

.ast-finding--warning[b-ole7l81bdd]  .ast-finding__icon .mud-icon-root {
    color: #b45309;
}

.ast-finding--critical[b-ole7l81bdd]  .ast-finding__icon .mud-icon-root {
    color: #dc2626;
}

.ast-finding__title[b-ole7l81bdd] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.3;
}

.ast-finding__sev[b-ole7l81bdd] {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    background: rgba(100, 116, 139, 0.1);
    color: #64748b;
    white-space: nowrap;
}

.ast-finding--ok .ast-finding__sev[b-ole7l81bdd] {
    background: rgba(22, 163, 74, 0.1);
    color: #15803d;
}

.ast-finding--info .ast-finding__sev[b-ole7l81bdd] {
    background: rgba(59, 130, 246, 0.1);
    color: #1d4ed8;
}

.ast-finding--warning .ast-finding__sev[b-ole7l81bdd] {
    background: rgba(245, 158, 11, 0.1);
    color: #b45309;
}

.ast-finding--critical .ast-finding__sev[b-ole7l81bdd] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

.ast-finding__text[b-ole7l81bdd] {
    font-size: 0.82rem;
    color: #475569;
    line-height: 1.5;
    margin: 0;
}

.ast-finding__meta[b-ole7l81bdd] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.ast-finding__chip[b-ole7l81bdd] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.225rem 0.5rem;
    border-radius: 4px;
    font-size: 0.72rem;
    color: #475569;
    background: #f8fafc;
    border: 1px solid #e8ecf1;
    text-decoration: none;
}

.ast-finding__chip strong[b-ole7l81bdd] {
    color: #1e293b;
    font-weight: 600;
}

.ast-finding__chip--link[b-ole7l81bdd] {
    color: var(--ast-accent);
    border-color: color-mix(in srgb, var(--ast-accent) 25%, transparent);
    background: color-mix(in srgb, var(--ast-accent) 4%, #ffffff);
}

.ast-finding__chip--link:hover[b-ole7l81bdd] {
    background: color-mix(in srgb, var(--ast-accent) 8%, #ffffff);
}

.ast-finding__actions[b-ole7l81bdd] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.25rem;
}

.ast-finding__cta[b-ole7l81bdd] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.4rem 0.875rem;
    border-radius: 6px;
    background: var(--ast-accent);
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 600;
    text-decoration: none;
    transition: filter 0.15s ease;
    min-height: 32px;
    border: none;
    cursor: pointer;
    font-family: inherit;
}

.ast-finding__cta:hover:not(:disabled)[b-ole7l81bdd] {
    filter: brightness(0.92);
}

.ast-finding__cta:disabled[b-ole7l81bdd] {
    opacity: 0.7;
    cursor: not-allowed;
}

@media (max-width: 600px) {
    .ast-findings__list[b-ole7l81bdd] {
        padding: 0.75rem 0.875rem;
    }

    .ast-finding__cta[b-ole7l81bdd] {
        min-height: 44px;
        padding: 0.625rem 1rem;
    }
}
/* /Components/Pages/Admin/Assistants/Shared/AssistantHeader.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   AssistantHeader — Character identity strip at the top of each
   assistant workspace. Replaces the icon-only adm-page-header
   with a mascot avatar + accent gradient.
   ═══════════════════════════════════════════════════════ */

.ast-header[b-6xguglix42] {
    position: relative;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    overflow: hidden;
    --ast-accent: #35a0ae;
}

.ast-header__bar[b-6xguglix42] {
    height: 4px;
    background: linear-gradient(90deg,
        var(--ast-accent) 0%,
        color-mix(in srgb, var(--ast-accent) 60%, #ffffff) 50%,
        var(--ast-accent) 100%);
}

.ast-header__row[b-6xguglix42] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    flex-wrap: wrap;
}

.ast-header__title[b-6xguglix42] {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-width: 0;
}

.ast-header__avatar[b-6xguglix42] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--ast-accent) 10%, #ffffff);
    border: 2px solid color-mix(in srgb, var(--ast-accent) 30%, transparent);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}

.ast-header__avatar img[b-6xguglix42] {
    width: 80%;
    height: 80%;
    object-fit: contain;
}

.ast-header__text[b-6xguglix42] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.ast-header__name[b-6xguglix42] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.ast-header__subtitle[b-6xguglix42] {
    font-size: 0.82rem;
    color: var(--ast-accent);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin: 0.15rem 0 0;
}

.ast-header__right[b-6xguglix42] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

@media (max-width: 600px) {
    .ast-header__row[b-6xguglix42] {
        padding: 1rem 0.875rem;
        gap: 1rem;
    }

    .ast-header__avatar[b-6xguglix42] {
        width: 52px;
        height: 52px;
    }

    .ast-header__name[b-6xguglix42] {
        font-size: 1.25rem;
    }

    .ast-header__right[b-6xguglix42] {
        width: 100%;
        margin-left: 0;
        justify-content: flex-start;
    }
}
/* /Components/Pages/Admin/Assistants/Shared/AssistantHeroCard.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   AssistantHeroCard — Used on the /admin/assistants index grid.
   Accent color flows through --ast-accent inline custom property.
   ═══════════════════════════════════════════════════════ */

.ast-hero-card[b-z5lk8d7h9h] {
    position: relative;
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 12px;
    overflow: hidden;
    text-decoration: none;
    transition: transform 0.15s ease, box-shadow 0.2s ease, border-color 0.15s ease;
    min-height: 240px;
    cursor: pointer;
    --ast-accent: #35a0ae;
}

.ast-hero-card:hover[b-z5lk8d7h9h] {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
    border-color: color-mix(in srgb, var(--ast-accent) 35%, transparent);
}

.ast-hero-card:focus-visible[b-z5lk8d7h9h] {
    outline: 2px solid var(--ast-accent);
    outline-offset: 2px;
}

.ast-hero-card--coming-soon[b-z5lk8d7h9h] {
    cursor: not-allowed;
    opacity: 0.7;
}

.ast-hero-card--coming-soon:hover[b-z5lk8d7h9h] {
    transform: none;
    box-shadow: none;
    border-color: #e8ecf1;
}

.ast-hero-card__bar[b-z5lk8d7h9h] {
    height: 4px;
    background: var(--ast-accent);
    flex-shrink: 0;
}

.ast-hero-card__body[b-z5lk8d7h9h] {
    display: flex;
    flex-direction: column;
    padding: 1.25rem 1.25rem 1rem;
    gap: 0.5rem;
    flex: 1;
}

.ast-hero-card__avatar[b-z5lk8d7h9h] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--ast-accent) 10%, #ffffff);
    border: 2px solid color-mix(in srgb, var(--ast-accent) 30%, transparent);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
    margin-bottom: 0.5rem;
}

.ast-hero-card__avatar img[b-z5lk8d7h9h] {
    width: 80%;
    height: 80%;
    object-fit: contain;
}

.ast-hero-card__head[b-z5lk8d7h9h] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.ast-hero-card__name[b-z5lk8d7h9h] {
    font-size: 1.125rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    letter-spacing: -0.01em;
}

.ast-hero-card__subtitle[b-z5lk8d7h9h] {
    font-size: 0.78rem;
    color: var(--ast-accent);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.ast-hero-card__desc[b-z5lk8d7h9h] {
    font-size: 0.85rem;
    color: #475569;
    line-height: 1.5;
    margin: 0;
    flex: 1;
}

.ast-hero-card__cta[b-z5lk8d7h9h] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: auto;
    padding-top: 0.5rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--ast-accent);
}

.ast-hero-card__badge[b-z5lk8d7h9h] {
    display: inline-block;
    padding: 0.25rem 0.625rem;
    background: rgba(100, 116, 139, 0.1);
    color: #64748b;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 4px;
    margin-top: auto;
    width: fit-content;
}

@media (max-width: 600px) {
    .ast-hero-card[b-z5lk8d7h9h] {
        min-height: auto;
    }

    .ast-hero-card__body[b-z5lk8d7h9h] {
        padding: 1rem 1rem 0.875rem;
    }

    .ast-hero-card__avatar[b-z5lk8d7h9h] {
        width: 56px;
        height: 56px;
    }
}
/* /Components/Pages/Admin/Assistants/Shared/AssistantNarrationBubble.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   AssistantNarrationBubble — Speech-bubble showing the
   character's personality line. Tone drives the trim colour.
   ═══════════════════════════════════════════════════════ */

.ast-bubble[b-x6x7m0p612] {
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
    padding: 1rem 1.5rem;
    --ast-accent: #35a0ae;
}

.ast-bubble__avatar[b-x6x7m0p612] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--ast-accent) 10%, #ffffff);
    border: 2px solid color-mix(in srgb, var(--ast-accent) 30%, transparent);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}

.ast-bubble__avatar img[b-x6x7m0p612] {
    width: 80%;
    height: 80%;
    object-fit: contain;
}

.ast-bubble__balloon[b-x6x7m0p612] {
    position: relative;
    flex: 1;
    background: #ffffff;
    border: 1px solid color-mix(in srgb, var(--ast-accent) 18%, #e8ecf1);
    border-left: 3px solid var(--ast-accent);
    border-radius: 12px;
    padding: 0.875rem 1.125rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    animation: ast-bubble-pop-b-x6x7m0p612 0.2s ease-out;
}

.ast-bubble__balloon[b-x6x7m0p612]::before {
    content: '';
    position: absolute;
    left: -8px;
    top: 16px;
    width: 14px;
    height: 14px;
    background: #ffffff;
    border-left: 1px solid color-mix(in srgb, var(--ast-accent) 18%, #e8ecf1);
    border-bottom: 1px solid color-mix(in srgb, var(--ast-accent) 18%, #e8ecf1);
    transform: rotate(45deg);
}

.ast-bubble--success .ast-bubble__balloon[b-x6x7m0p612] {
    border-left-color: #16a34a;
    background: linear-gradient(to right, rgba(22, 163, 74, 0.04) 0%, #ffffff 40%);
}

.ast-bubble--warning .ast-bubble__balloon[b-x6x7m0p612] {
    border-left-color: #f59e0b;
    background: linear-gradient(to right, rgba(245, 158, 11, 0.04) 0%, #ffffff 40%);
}

.ast-bubble--error .ast-bubble__balloon[b-x6x7m0p612] {
    border-left-color: #dc2626;
    background: linear-gradient(to right, rgba(239, 68, 68, 0.04) 0%, #ffffff 40%);
}

.ast-bubble__text[b-x6x7m0p612] {
    margin: 0;
    font-size: 0.95rem;
    color: #1e293b;
    line-height: 1.5;
    font-family: 'Montserrat', sans-serif;
    font-style: italic;
}

.ast-bubble__summary[b-x6x7m0p612] {
    margin: 0.35rem 0 0;
    font-size: 0.78rem;
    color: #64748b;
    line-height: 1.4;
}

@keyframes ast-bubble-pop-b-x6x7m0p612 {
    from {
        opacity: 0;
        transform: translateY(-2px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 600px) {
    .ast-bubble[b-x6x7m0p612] {
        padding: 0.875rem 0.875rem;
        gap: 0.625rem;
    }

    .ast-bubble__avatar[b-x6x7m0p612] {
        width: 38px;
        height: 38px;
    }

    .ast-bubble__text[b-x6x7m0p612] {
        font-size: 0.875rem;
    }
}
/* /Components/Pages/Admin/Assistants/Shared/AssistantQuickActions.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   AssistantQuickActions — Row of deep-link chips that send
   the admin from an assistant page to its underlying full tool.
   ═══════════════════════════════════════════════════════ */

.ast-quick[b-tib82zqogy] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 0.875rem 1.5rem;
    background: #ffffff;
    border-top: 1px solid #e8ecf1;
    flex-wrap: wrap;
    --ast-accent: #35a0ae;
}

.ast-quick__label[b-tib82zqogy] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
    flex-shrink: 0;
}

.ast-quick__row[b-tib82zqogy] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.ast-quick__chip[b-tib82zqogy] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.45rem 0.75rem;
    border-radius: 6px;
    background: #f8fafc;
    border: 1px solid #e8ecf1;
    color: #475569;
    text-decoration: none;
    font-size: 0.78rem;
    font-weight: 500;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
    min-height: 32px;
}

.ast-quick__chip:hover[b-tib82zqogy] {
    background: color-mix(in srgb, var(--ast-accent) 6%, #ffffff);
    color: var(--ast-accent);
    border-color: color-mix(in srgb, var(--ast-accent) 30%, transparent);
}

.ast-quick__chip:focus-visible[b-tib82zqogy] {
    outline: 2px solid var(--ast-accent);
    outline-offset: 2px;
}

@media (max-width: 600px) {
    .ast-quick[b-tib82zqogy] {
        padding: 0.75rem 0.875rem;
    }

    .ast-quick__chip[b-tib82zqogy] {
        min-height: 44px;
    }
}
/* /Components/Pages/Admin/Assistants/Shared/AssistantToolBar.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   AssistantToolBar — Grid of clickable tool tiles.
   ═══════════════════════════════════════════════════════ */

.ast-toolbar[b-egu7vj1zkf] {
    padding: 0;
    --ast-accent: #35a0ae;
}

.ast-toolbar__grid[b-egu7vj1zkf] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.ast-toolbar__empty[b-egu7vj1zkf] {
    padding: 2rem 1.5rem;
    text-align: center;
    color: #94a3b8;
    font-size: 0.85rem;
}

.ast-tool-card[b-egu7vj1zkf] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.4rem;
    padding: 1rem 1.125rem;
    border-radius: 10px;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
    min-height: 110px;
    font-family: inherit;
}

.ast-tool-card:hover:not(:disabled)[b-egu7vj1zkf] {
    border-color: color-mix(in srgb, var(--ast-accent) 30%, transparent);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
    transform: translateY(-1px);
}

.ast-tool-card:focus-visible[b-egu7vj1zkf] {
    outline: 2px solid var(--ast-accent);
    outline-offset: 2px;
}

.ast-tool-card:disabled[b-egu7vj1zkf] {
    opacity: 0.55;
    cursor: not-allowed;
}

.ast-tool-card--busy[b-egu7vj1zkf] {
    background: color-mix(in srgb, var(--ast-accent) 4%, #ffffff);
    border-color: color-mix(in srgb, var(--ast-accent) 40%, transparent);
}

.ast-tool-card__icon[b-egu7vj1zkf] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: color-mix(in srgb, var(--ast-accent) 10%, #ffffff);
    color: var(--ast-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

[b-egu7vj1zkf] .ast-tool-card__icon .mud-icon-root {
    color: var(--ast-accent);
}

.ast-tool-card__label[b-egu7vj1zkf] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.3;
}

.ast-tool-card__desc[b-egu7vj1zkf] {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.4;
}

@media (max-width: 600px) {
    .ast-toolbar__grid[b-egu7vj1zkf] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .ast-tool-card[b-egu7vj1zkf] {
        min-height: 44px;
    }
}
/* /Components/Pages/Admin/Assistants/Trace.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Trace workspace — Nordic shell + character accent.
   Adm-* subset only (header is delegated to AssistantHeader).
   ═══════════════════════════════════════════════════════ */

.adm-shell[b-yjwn71r3mv] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

.adm-shell--trace[b-yjwn71r3mv] {
    --ast-accent: #3b82f6;
}

/* ─── Status pill (used inside AssistantHeader's RightContent) ─── */
.adm-status-pill[b-yjwn71r3mv] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-yjwn71r3mv] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-yjwn71r3mv] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.adm-status-pill__dot--warn[b-yjwn71r3mv] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__dot--off[b-yjwn71r3mv] {
    background: #94a3b8;
}

.adm-status-pill__time[b-yjwn71r3mv] {
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

/* ─── KPI strip ─── */
.adm-kpi-strip[b-yjwn71r3mv] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-yjwn71r3mv] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
}

.adm-kpi:last-child[b-yjwn71r3mv] {
    border-right: none;
}

.adm-kpi__top[b-yjwn71r3mv] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-yjwn71r3mv] .adm-kpi__icon {
    color: var(--ast-accent) !important;
    opacity: 0.75;
    font-size: 1rem !important;
}

.adm-kpi__label[b-yjwn71r3mv] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-yjwn71r3mv] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ─── Section header ─── */
.adm-section-header[b-yjwn71r3mv] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.5rem;
}

.adm-section-header__title[b-yjwn71r3mv] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-yjwn71r3mv] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ─── Responsive ─── */
@media (max-width: 960px) {
    .adm-kpi-strip[b-yjwn71r3mv] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-yjwn71r3mv] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-yjwn71r3mv] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 600px) {
    .adm-kpi-strip[b-yjwn71r3mv] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi[b-yjwn71r3mv] {
        padding: 0.875rem 1rem;
    }

    .adm-kpi__value[b-yjwn71r3mv] {
        font-size: 1.25rem;
    }

    .adm-section-header[b-yjwn71r3mv] {
        padding: 0.875rem 0.875rem 0.5rem;
    }
}
/* /Components/Pages/Admin/Badges/AddBadge.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   AddBadge Dialog — Nordic Control Panel Design
   ═══════════════════════════════════════════════════════ */

.adm-dialog[b-frguolgx7j] {
    padding: 0.5rem 0;
}

.adm-form-grid[b-frguolgx7j] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.adm-form-group[b-frguolgx7j] {
    display: flex;
    flex-direction: column;
}

.adm-form-row[b-frguolgx7j] {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.adm-form-meta[b-frguolgx7j] {
    gap: 1rem;
    padding-top: 0.5rem;
    border-top: 1px solid #f1f5f9;
}

.adm-dialog-actions[b-frguolgx7j] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 1.25rem;
    margin-top: 0.5rem;
    border-top: 1px solid #e8ecf1;
}

[b-frguolgx7j] .adm-dialog-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
}
/* /Components/Pages/Admin/Badges/Badges.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Badges — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + Tags standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-tmtyuud3pc] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-tmtyuud3pc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-tmtyuud3pc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-tmtyuud3pc] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-tmtyuud3pc] .adm-breadcrumbs {
    padding: 0;
}

[b-tmtyuud3pc] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-tmtyuud3pc] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-tmtyuud3pc] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-tmtyuud3pc] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-tmtyuud3pc] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-tmtyuud3pc] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-tmtyuud3pc] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-tmtyuud3pc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-tmtyuud3pc] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-tmtyuud3pc] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-tmtyuud3pc] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-tmtyuud3pc] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-tmtyuud3pc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add Button */
[b-tmtyuud3pc] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
}

/* Refresh Button */
[b-tmtyuud3pc] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-tmtyuud3pc] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-tmtyuud3pc] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-tmtyuud3pc] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-tmtyuud3pc] {
    border-right: none;
}

.adm-kpi:hover[b-tmtyuud3pc] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-tmtyuud3pc] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-tmtyuud3pc] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-tmtyuud3pc] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-tmtyuud3pc] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-tmtyuud3pc] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-tmtyuud3pc] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-tmtyuud3pc] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   TABLE SECTION
   ═══════════════════════════════════════════════════════ */
.adm-table-container[b-tmtyuud3pc] {
    padding: 0 1.5rem 1.5rem;
}

[b-tmtyuud3pc] .adm-search-field {
    margin-bottom: 0.75rem;
    max-width: 360px;
}

[b-tmtyuud3pc] .adm-search-field .mud-input-outlined-border {
    border-color: #e2e8f0 !important;
    border-radius: 8px !important;
}

[b-tmtyuud3pc] .adm-search-field .mud-input-outlined-border:hover {
    border-color: #35a0ae !important;
}

[b-tmtyuud3pc] .adm-search-field .mud-input-adorment-start {
    color: #94a3b8;
}

[b-tmtyuud3pc] .adm-search-field input::placeholder {
    color: #94a3b8 !important;
    font-size: 0.82rem;
}

/* MudTable styling */
[b-tmtyuud3pc] .adm-table {
    border-radius: 10px !important;
    border: 1px solid #e8ecf1 !important;
    overflow: hidden;
    box-shadow: none !important;
}

[b-tmtyuud3pc] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-tmtyuud3pc] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-tmtyuud3pc] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-tmtyuud3pc] .adm-table .mud-table-body tr {
    cursor: pointer;
    transition: background 0.12s ease;
}

[b-tmtyuud3pc] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-tmtyuud3pc] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-tmtyuud3pc] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-tmtyuud3pc] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

.adm-badge-name[b-tmtyuud3pc] {
    font-weight: 500;
    color: #1e293b;
}

.adm-badge-desc[b-tmtyuud3pc] {
    color: #57667a;
    font-size: 0.8rem;
}

/* Chip styling */
[b-tmtyuud3pc] .adm-chip {
    font-size: 0.7rem !important;
    height: 22px !important;
    font-weight: 600 !important;
}

/* WCAG AA contrast fix: white on default green (#4CAF50) = 2.78:1 → #2e7d32 = ~5.5:1 */
[b-tmtyuud3pc] .adm-chip.mud-chip-filled.mud-chip-color-success {
    background-color: #2e7d32 !important;
}

/* Empty state */
.adm-empty-state[b-tmtyuud3pc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #94a3b8;
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-tmtyuud3pc] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-tmtyuud3pc] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-tmtyuud3pc] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-tmtyuud3pc] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-tmtyuud3pc] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-tmtyuud3pc] {
        grid-template-columns: repeat(2, 1fr);
    }

    [b-tmtyuud3pc] .adm-search-field {
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-tmtyuud3pc] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-tmtyuud3pc] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-tmtyuud3pc] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-tmtyuud3pc] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-tmtyuud3pc] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-table-container[b-tmtyuud3pc] {
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-tmtyuud3pc] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    /* WCAG touch target fix: min 44px on mobile */
    [b-tmtyuud3pc] .adm-add-btn {
        min-height: 44px !important;
        padding: 8px 16px !important;
    }

    [b-tmtyuud3pc] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/Badges/EditBadge.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   EditBadge Dialog — Nordic Control Panel Design
   ═══════════════════════════════════════════════════════ */

.adm-dialog[b-wiqk4yivbm] {
    padding: 0.5rem 0;
}

.adm-form-grid[b-wiqk4yivbm] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.adm-form-group[b-wiqk4yivbm] {
    display: flex;
    flex-direction: column;
}

.adm-form-row[b-wiqk4yivbm] {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.adm-form-meta[b-wiqk4yivbm] {
    gap: 1rem;
    padding-top: 0.5rem;
    border-top: 1px solid #f1f5f9;
}

.adm-dialog-actions[b-wiqk4yivbm] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 1.25rem;
    margin-top: 0.5rem;
    border-top: 1px solid #e8ecf1;
}

[b-wiqk4yivbm] .adm-dialog-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
}
/* /Components/Pages/Admin/Blog/BlogEditor.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Blog Editor — "Nordic Control Panel" Design System
   Matches ManageBlogs + SiteGeneralSettings standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-6k3t99q925] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-6k3t99q925] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-6k3t99q925] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-6k3t99q925] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-6k3t99q925] .adm-breadcrumbs {
    padding: 0;
}

[b-6k3t99q925] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-6k3t99q925] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-6k3t99q925] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-6k3t99q925] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-6k3t99q925] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-6k3t99q925] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--create[b-6k3t99q925] {
    background: #3b82f6;
    box-shadow: 0 0 6px rgba(59, 130, 246, 0.4);
}

.adm-status-pill__dot--edit[b-6k3t99q925] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__dot--unsaved[b-6k3t99q925] {
    background: #ef4444;
    box-shadow: 0 0 6px rgba(239, 68, 68, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-6k3t99q925] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-6k3t99q925] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-6k3t99q925] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-6k3t99q925] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-6k3t99q925] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-6k3t99q925] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Cancel Button */
[b-6k3t99q925] .adm-cancel-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.8rem !important;
    color: #475569 !important;
    border-color: #d1d5db !important;
    min-height: 36px;
    letter-spacing: 0 !important;
    box-shadow: none !important;
}

[b-6k3t99q925] .adm-cancel-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Save Button */
[b-6k3t99q925] .adm-save-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
    min-height: 36px;
}

/* ═══════════════════════════════════════════════════════
   FORM CONTENT AREA
   ═══════════════════════════════════════════════════════ */
.adm-form-content[b-6k3t99q925] {
    padding: 1.25rem 1.5rem 2rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* ═══════════════════════════════════════════════════════
   FORM CARDS — Section cards with accent bars
   ═══════════════════════════════════════════════════════ */
.adm-form-card[b-6k3t99q925] {
    position: relative;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-form-card:hover[b-6k3t99q925] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-form-card__bar[b-6k3t99q925] {
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-form-card__header[b-6k3t99q925] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 1rem 1.25rem 0;
    margin-left: 4px;
}

.adm-form-card__header-icon[b-6k3t99q925] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    flex-shrink: 0;
}

.adm-form-card__header-title[b-6k3t99q925] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #1e293b;
    font-family: 'Montserrat', sans-serif;
    margin: 0;
}

.adm-form-card__body[b-6k3t99q925] {
    padding: 0.875rem 1.25rem 1.25rem;
    margin-left: 4px;
}

/* ═══════════════════════════════════════════════════════
   SLUG PREVIEW
   ═══════════════════════════════════════════════════════ */
.adm-slug-preview[b-6k3t99q925] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 0.375rem;
    font-size: 0.75rem;
    color: #64748b;
    font-family: 'Courier New', Consolas, monospace;
}

.adm-slug-preview__label[b-6k3t99q925] {
    color: #64748b;
    font-weight: 500;
}

.adm-slug-preview__url[b-6k3t99q925] {
    color: #256f7a; /* WCAG AA: #35a0ae too light at 0.75rem; #256f7a = ~5.8:1 */
    word-break: break-all;
}

/* ═══════════════════════════════════════════════════════
   CHARACTER COUNTER
   ═══════════════════════════════════════════════════════ */
.adm-char-count[b-6k3t99q925] {
    font-size: 0.72rem;
    color: #64748b;
    margin-top: 0.25rem;
    text-align: right;
}

/* ═══════════════════════════════════════════════════════
   TAG CHIPS
   ═══════════════════════════════════════════════════════ */
.adm-tags-area[b-6k3t99q925] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.adm-tags-label[b-6k3t99q925] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #475569;
}

[b-6k3t99q925] .adm-tag-chip {
    font-size: 0.75rem !important;
    height: 26px !important;
    font-weight: 500 !important;
    border-radius: 6px !important;
}

.adm-tag-input-row[b-6k3t99q925] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

[b-6k3t99q925] .adm-tag-input {
    flex: 1;
    min-width: 120px;
}

[b-6k3t99q925] .adm-tag-input .mud-input-outlined-border {
    border-color: #e2e8f0 !important;
    border-radius: 8px !important;
}

[b-6k3t99q925] .adm-tag-input .mud-input-outlined-border:hover {
    border-color: #35a0ae !important;
}

[b-6k3t99q925] .adm-tag-add-btn {
    border-radius: 8px !important;
    min-width: 36px !important;
    min-height: 36px !important;
}

/* ═══════════════════════════════════════════════════════
   FEATURE REQUEST CHIPS
   ═══════════════════════════════════════════════════════ */
.adm-feature-label-row[b-6k3t99q925] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.adm-feature-label[b-6k3t99q925] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #475569;
}

[b-6k3t99q925] .adm-feature-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.78rem !important;
    letter-spacing: 0 !important;
    padding: 2px 10px !important;
    box-shadow: none !important;
}

[b-6k3t99q925] .adm-feature-chip {
    font-size: 0.75rem !important;
    height: 26px !important;
    font-weight: 500 !important;
    border-radius: 6px !important;
}

/* ═══════════════════════════════════════════════════════
   IMAGE PREVIEW
   ═══════════════════════════════════════════════════════ */
.adm-image-preview[b-6k3t99q925] {
    margin-top: 0.625rem;
    padding: 0.75rem;
    border: 1px dashed #d1d5db;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 120px;
    background: #fafbfc;
    transition: border-color 0.15s ease;
}

.adm-image-preview:hover[b-6k3t99q925] {
    border-color: #35a0ae;
}

.adm-image-preview img[b-6k3t99q925] {
    max-height: 200px;
    max-width: 100%;
    object-fit: contain;
    border-radius: 4px;
}

/* ═══════════════════════════════════════════════════════
   PUBLISHING TOGGLES
   ═══════════════════════════════════════════════════════ */
.adm-toggle-grid[b-6k3t99q925] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.adm-toggle-item[b-6k3t99q925] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.adm-toggle-desc[b-6k3t99q925] {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.4;
    padding-left: 0.25rem;
}

[b-6k3t99q925] .adm-toggle-switch {
    margin: 0;
}

/* ═══════════════════════════════════════════════════════
   FORM FIELD OVERRIDES — Consistent styling
   ═══════════════════════════════════════════════════════ */
[b-6k3t99q925] .adm-form-card .mud-input-outlined-border {
    border-color: #e2e8f0 !important;
    border-radius: 8px !important;
}

[b-6k3t99q925] .adm-form-card .mud-input-outlined-border:hover {
    border-color: #35a0ae !important;
}

[b-6k3t99q925] .adm-form-card .mud-input-label {
    font-size: 0.84rem !important;
    color: #475569 !important;
}

[b-6k3t99q925] .adm-form-card .mud-input-helper-text {
    font-size: 0.72rem !important;
    color: #64748b !important;
}

[b-6k3t99q925] .adm-form-card .mud-input-counter {
    font-size: 0.72rem !important;
    color: #64748b !important;
}

/* ═══════════════════════════════════════════════════════
   DIALOG OVERRIDES
   ═══════════════════════════════════════════════════════ */
[b-6k3t99q925] .adm-dialog-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.82rem !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
}

[b-6k3t99q925] .adm-dialog-btn-primary {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.82rem !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
}

/* Feature request dialog list */
[b-6k3t99q925] .adm-fr-list {
    max-height: 400px;
    overflow-y: auto;
}

.adm-fr-item-row[b-6k3t99q925] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 0.75rem;
}

.adm-fr-item-info[b-6k3t99q925] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-fr-item-title[b-6k3t99q925] {
    font-size: 0.84rem;
    color: #334155;
    font-weight: 500;
}

.adm-fr-item-meta[b-6k3t99q925] {
    font-size: 0.72rem;
    color: #64748b;
}

.adm-fr-selected-count[b-6k3t99q925] {
    font-size: 0.82rem;
    font-weight: 500;
    color: #35a0ae;
    margin-top: 0.5rem;
}

.adm-fr-empty[b-6k3t99q925] {
    text-align: center;
    padding: 1.5rem 1rem;
    font-size: 0.84rem;
    color: #64748b;
}

/* Unsaved changes dialog */
.adm-unsaved-text[b-6k3t99q925] {
    font-size: 0.875rem;
    color: #334155;
    line-height: 1.6;
}

/* ═══════════════════════════════════════════════════════
   SEARCH FIELD
   ═══════════════════════════════════════════════════════ */
[b-6k3t99q925] .adm-search-field .mud-input-outlined-border {
    border-color: #e2e8f0 !important;
    border-radius: 8px !important;
}

[b-6k3t99q925] .adm-search-field .mud-input-outlined-border:hover {
    border-color: #35a0ae !important;
}

[b-6k3t99q925] .adm-search-field input::placeholder {
    color: #64748b !important;
    font-size: 0.82rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-toggle-grid[b-6k3t99q925] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-6k3t99q925] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-6k3t99q925] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-toggle-grid[b-6k3t99q925] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-6k3t99q925] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-6k3t99q925] {
        padding: 1rem 0.875rem;
    }

    .adm-page-header__tools[b-6k3t99q925] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-6k3t99q925] .adm-cancel-btn,
    [b-6k3t99q925] .adm-save-btn {
        width: 100%;
        min-height: 44px !important;
    }

    .adm-form-content[b-6k3t99q925] {
        padding: 0.875rem 0.875rem 1.5rem;
        gap: 1rem;
    }

    .adm-form-card__header[b-6k3t99q925] {
        padding: 0.875rem 0.875rem 0;
    }

    .adm-form-card__body[b-6k3t99q925] {
        padding: 0.75rem 0.875rem 1rem;
    }

    .adm-toggle-grid[b-6k3t99q925] {
        grid-template-columns: 1fr;
        gap: 0.875rem;
    }

    .adm-tag-input-row[b-6k3t99q925] {
        flex-direction: row;
    }

    /* WCAG touch target fix: min 44px on mobile */
    [b-6k3t99q925] .adm-tag-add-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    [b-6k3t99q925] .adm-feature-add-btn {
        min-height: 44px !important;
        padding: 8px 12px !important;
    }

    [b-6k3t99q925] .adm-dialog-btn,
    [b-6k3t99q925] .adm-dialog-btn-primary {
        min-height: 44px !important;
    }

    .adm-image-preview[b-6k3t99q925] {
        min-height: 100px;
    }

    .adm-image-preview img[b-6k3t99q925] {
        max-height: 160px;
    }
}
/* /Components/Pages/Admin/Blog/ManageBlogs.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Blog Management — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + Badges standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-699oe0j763] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-699oe0j763] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-699oe0j763] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-699oe0j763] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-699oe0j763] .adm-breadcrumbs {
    padding: 0;
}

[b-699oe0j763] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-699oe0j763] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-699oe0j763] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-699oe0j763] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-699oe0j763] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-699oe0j763] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-699oe0j763] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-699oe0j763] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-699oe0j763] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-699oe0j763] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-699oe0j763] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-699oe0j763] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-699oe0j763] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add Button */
[b-699oe0j763] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
}

/* Refresh Button */
[b-699oe0j763] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-699oe0j763] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-699oe0j763] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-699oe0j763] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-699oe0j763] {
    border-right: none;
}

.adm-kpi:hover[b-699oe0j763] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-699oe0j763] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-699oe0j763] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-699oe0j763] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-699oe0j763] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-699oe0j763] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-699oe0j763] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-699oe0j763] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   TABLE SECTION
   ═══════════════════════════════════════════════════════ */
.adm-table-container[b-699oe0j763] {
    padding: 0 1.5rem 1.5rem;
}

/* ─── Filter Row ─── */
.adm-filter-row[b-699oe0j763] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
}

[b-699oe0j763] .adm-search-field {
    flex: 1;
    min-width: 200px;
    max-width: 360px;
}

[b-699oe0j763] .adm-search-field .mud-input-outlined-border {
    border-color: #e2e8f0 !important;
    border-radius: 8px !important;
}

[b-699oe0j763] .adm-search-field .mud-input-outlined-border:hover {
    border-color: #35a0ae !important;
}

[b-699oe0j763] .adm-search-field .mud-input-adorment-start {
    color: #94a3b8;
}

[b-699oe0j763] .adm-search-field input::placeholder {
    color: #94a3b8 !important;
    font-size: 0.82rem;
}

[b-699oe0j763] .adm-filter-select {
    min-width: 150px;
    max-width: 180px;
}

[b-699oe0j763] .adm-filter-select .mud-input-outlined-border {
    border-color: #e2e8f0 !important;
    border-radius: 8px !important;
}

[b-699oe0j763] .adm-filter-select .mud-input-outlined-border:hover {
    border-color: #35a0ae !important;
}

[b-699oe0j763] .adm-clear-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.78rem !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
    min-height: 36px;
}

[b-699oe0j763] .adm-clear-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
    color: #35a0ae !important;
}

/* MudTable styling */
[b-699oe0j763] .adm-table {
    border-radius: 10px !important;
    border: 1px solid #e8ecf1 !important;
    overflow: hidden;
    box-shadow: none !important;
}

[b-699oe0j763] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-699oe0j763] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-699oe0j763] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-699oe0j763] .adm-table .mud-table-body tr {
    transition: background 0.12s ease;
}

[b-699oe0j763] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-699oe0j763] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-699oe0j763] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-699oe0j763] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

/* Post title and summary */
.adm-post-title[b-699oe0j763] {
    display: block;
    font-weight: 600;
    color: #1e293b;
    font-size: 0.84rem;
}

.adm-post-summary[b-699oe0j763] {
    display: block;
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #64748b;
    font-size: 0.78rem;
    margin-top: 0.125rem;
}

/* Chip styling */
[b-699oe0j763] .adm-chip {
    font-size: 0.7rem !important;
    height: 22px !important;
    font-weight: 600 !important;
}

/* WCAG AA contrast fix: white on default green (#4CAF50) = 2.78:1 → #2e7d32 = ~5.5:1 */
[b-699oe0j763] .adm-chip.mud-chip-filled.mud-chip-color-success {
    background-color: #2e7d32 !important;
}

/* WCAG AA contrast fix: white on default amber (#FF9800) = 2.56:1 → #e65100 = ~4.6:1 */
[b-699oe0j763] .adm-chip.mud-chip-filled.mud-chip-color-warning {
    background-color: #e65100 !important;
}

/* Empty state */
.adm-empty-state[b-699oe0j763] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 2rem;
    border-radius: 10px;
    border: 1px dashed #d1d5db;
    background: #ffffff;
}

.adm-empty-state__title[b-699oe0j763] {
    font-size: 1rem;
    font-weight: 600;
    color: #475569;
}

.adm-empty-state__desc[b-699oe0j763] {
    font-size: 0.85rem;
    color: #94a3b8;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-699oe0j763] {
        grid-template-columns: repeat(4, 1fr);
    }

    .adm-kpi:nth-child(4n)[b-699oe0j763] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+5)[b-699oe0j763] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-699oe0j763] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-699oe0j763] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-699oe0j763] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(4n)[b-699oe0j763] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(3n)[b-699oe0j763] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-699oe0j763] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-filter-row[b-699oe0j763] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-699oe0j763] .adm-search-field {
        max-width: 100%;
    }

    [b-699oe0j763] .adm-filter-select {
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-699oe0j763] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-699oe0j763] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-699oe0j763] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3n)[b-699oe0j763] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-699oe0j763] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-699oe0j763] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:last-child:nth-child(odd)[b-699oe0j763] {
        grid-column: 1 / -1;
    }

    .adm-table-container[b-699oe0j763] {
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-699oe0j763] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    /* WCAG touch target fix: min 44px on mobile */
    [b-699oe0j763] .adm-add-btn {
        min-height: 44px !important;
        padding: 8px 16px !important;
    }

    [b-699oe0j763] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    .adm-post-summary[b-699oe0j763] {
        max-width: 200px;
    }
}
/* /Components/Pages/Admin/BrandIdentity/TemplateManagement.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Template Management — Nordic Control Panel
   Inherits from AnalyticsDashboard design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-wbzjoe690v] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-wbzjoe690v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-wbzjoe690v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-wbzjoe690v] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-wbzjoe690v] .adm-breadcrumbs {
    padding: 0;
}

[b-wbzjoe690v] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-wbzjoe690v] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-wbzjoe690v] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-wbzjoe690v] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-wbzjoe690v] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-wbzjoe690v] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-wbzjoe690v] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-wbzjoe690v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-wbzjoe690v] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-wbzjoe690v] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-wbzjoe690v] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-wbzjoe690v] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-wbzjoe690v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add Button */
[b-wbzjoe690v] .adm-add-btn {
    font-weight: 600;
    font-size: 0.82rem;
    letter-spacing: 0.01em;
}

/* Refresh Button */
[b-wbzjoe690v] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-wbzjoe690v] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-wbzjoe690v] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-wbzjoe690v] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-wbzjoe690v] {
    border-right: none;
}

.adm-kpi:hover[b-wbzjoe690v] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-wbzjoe690v] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-wbzjoe690v] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-wbzjoe690v] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-wbzjoe690v] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-wbzjoe690v] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-wbzjoe690v] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-wbzjoe690v] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-wbzjoe690v] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-wbzjoe690v] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-wbzjoe690v] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-wbzjoe690v] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-wbzjoe690v] .adm-tabs {
    background: transparent;
}

[b-wbzjoe690v] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-wbzjoe690v] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-wbzjoe690v] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-wbzjoe690v] .adm-tabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-wbzjoe690v] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-wbzjoe690v] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-wbzjoe690v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-wbzjoe690v] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-wbzjoe690v] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-wbzjoe690v] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-wbzjoe690v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-wbzjoe690v] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-wbzjoe690v] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-wbzjoe690v] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TEMPLATE CARD GRID
   ═══════════════════════════════════════════════════════ */
.adm-card-grid[b-wbzjoe690v] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-template-card[b-wbzjoe690v] {
    position: relative;
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.2s ease, transform 0.15s ease;
}

.adm-template-card:hover[b-wbzjoe690v] {
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
    transform: translateY(-1px);
}

.adm-template-card__bar[b-wbzjoe690v] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
    z-index: 1;
}

/* ─── Badges ─── */
.adm-template-card__badges[b-wbzjoe690v] {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    display: flex;
    gap: 0.25rem;
    z-index: 2;
}

/* ─── Preview Area ─── */
.adm-template-card__preview[b-wbzjoe690v] {
    height: 160px;
    background: #f8f9fb;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-bottom: 1px solid #f1f5f9;
}

.adm-template-card__grid-preview[b-wbzjoe690v] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 1rem;
    width: 100%;
}

.adm-template-card__empty-preview[b-wbzjoe690v] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

/* ─── Body ─── */
.adm-template-card__body[b-wbzjoe690v] {
    padding: 0.875rem 1rem;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.adm-template-card__name[b-wbzjoe690v] {
    font-size: 0.9rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
    line-height: 1.3;
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.adm-template-card__desc[b-wbzjoe690v] {
    font-size: 0.78rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.adm-template-card__meta[b-wbzjoe690v] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.375rem;
}

.adm-template-card__meta-item[b-wbzjoe690v] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.72rem;
    color: #64748b;
    font-weight: 500;
}

/* ─── Actions ─── */
.adm-template-card__actions[b-wbzjoe690v] {
    display: flex;
    align-items: center;
    gap: 0.125rem;
    padding: 0.375rem 0.75rem;
    border-top: 1px solid #f1f5f9;
    background: #fafbfc;
}

/* ─── Action Icons ─── */
[b-wbzjoe690v] .adm-action-edit {
    color: #35a0ae !important;
}

[b-wbzjoe690v] .adm-action-delete {
    color: #dc2626 !important;
}

/* ─── Empty State ─── */
.adm-empty-state[b-wbzjoe690v] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 1.5rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-card-grid[b-wbzjoe690v] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-detail-grid[b-wbzjoe690v] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-card-grid[b-wbzjoe690v] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-page-header[b-wbzjoe690v] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-wbzjoe690v] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-wbzjoe690v] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-wbzjoe690v] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-wbzjoe690v] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-tab-toolbar[b-wbzjoe690v] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-wbzjoe690v] {
        width: 100%;
        margin-left: 0;
        flex-wrap: wrap;
    }

    [b-wbzjoe690v] .adm-filter-field {
        max-width: 100%;
        width: 100%;
        min-width: 0;
    }

    /* Touch targets 44px */
    [b-wbzjoe690v] .adm-template-card__actions .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }

    /* Refresh button touch target */
    [b-wbzjoe690v] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-wbzjoe690v] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-wbzjoe690v] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-wbzjoe690v] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-card-grid[b-wbzjoe690v] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-detail-grid[b-wbzjoe690v] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-tab-toolbar[b-wbzjoe690v] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-wbzjoe690v] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }
}
/* /Components/Pages/Admin/Categories/Categories.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Categories — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + SiteConfiguration standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-7xccwkldpc] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-7xccwkldpc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-7xccwkldpc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-7xccwkldpc] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-7xccwkldpc] .adm-breadcrumbs {
    padding: 0;
}

[b-7xccwkldpc] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-7xccwkldpc] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-7xccwkldpc] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-7xccwkldpc] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-7xccwkldpc] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-7xccwkldpc] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-7xccwkldpc] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-7xccwkldpc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-7xccwkldpc] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-7xccwkldpc] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-7xccwkldpc] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-7xccwkldpc] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-7xccwkldpc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button — 44×44 WCAG 2.5.5 floor */
[b-7xccwkldpc] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-7xccwkldpc] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-7xccwkldpc] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae !important;
    outline-offset: 2px !important;
}

/* Loading bar */
[b-7xccwkldpc] .adm-progress {
    border-radius: 0;
}

/* ═══════════════════════════════════════════════════════
   ERROR / RETRY PANEL
   ═══════════════════════════════════════════════════════ */
.adm-error-panel[b-7xccwkldpc] {
    margin: 1.25rem 1.5rem;
    padding: 2rem 1.5rem;
    border-radius: 12px;
    border: 1px dashed rgba(53, 160, 174, 0.4);
    background: #ffffff;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

[b-7xccwkldpc] .adm-error-panel__icon {
    font-size: 3.5rem !important;
    color: #5c6b73 !important;
    margin-bottom: 0.5rem;
}

.adm-error-panel__title[b-7xccwkldpc] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-error-panel__body[b-7xccwkldpc] {
    font-size: 0.85rem;
    color: #5e6b78;
    line-height: 1.5;
    margin: 0 0 0.5rem;
    max-width: 480px;
}

[b-7xccwkldpc] .adm-error-panel__btn {
    border-radius: 8px !important;
    text-transform: none !important;
    min-height: 44px !important;
    font-weight: 600 !important;
    font-family: 'Montserrat', sans-serif !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-7xccwkldpc] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-7xccwkldpc] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-7xccwkldpc] {
    border-right: none;
}

.adm-kpi:hover[b-7xccwkldpc] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-7xccwkldpc] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-7xccwkldpc] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.85;
}

/* Semantic KPI icon colors — purges inline Style="color:#..." */
[b-7xccwkldpc] .adm-kpi__icon--total { color: #35a0ae !important; }   /* Rently teal */
[b-7xccwkldpc] .adm-kpi__icon--hierarchy { color: #3b82f6 !important; } /* Info blue (was Rently red brand-trap, fixed Test-218 B-1) */
[b-7xccwkldpc] .adm-kpi__icon--tags { color: #16a34a !important; }    /* Success green */
[b-7xccwkldpc] .adm-kpi__icon--featured { color: #06b6d4 !important; } /* Cyan (was amber brand-trap, fixed Test-218 B-2) */

.adm-kpi__label[b-7xccwkldpc] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-7xccwkldpc] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-7xccwkldpc] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-7xccwkldpc] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-7xccwkldpc] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   ACTION CARDS — Category module navigation
   ═══════════════════════════════════════════════════════ */
.adm-actions-grid[b-7xccwkldpc] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1.5rem;
}

a.adm-action-card[b-7xccwkldpc] {
    text-decoration: none;
    color: inherit;
}

.adm-action-card[b-7xccwkldpc] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    cursor: pointer;
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.adm-action-card:hover[b-7xccwkldpc] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
    border-color: rgba(53, 160, 174, 0.25);
}

.adm-action-card:focus-visible[b-7xccwkldpc] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06), 0 0 0 2px rgba(53, 160, 174, 0.35);
    border-color: rgba(53, 160, 174, 0.25);
    outline: none;
}

.adm-action-card__icon[b-7xccwkldpc] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    flex-shrink: 0;
}

/* Semantic action-card icon colors (background + foreground) — purges inline Style="background:rgba(...);color:#..." */
.adm-action-card--general .adm-action-card__icon[b-7xccwkldpc] { background: rgba(53, 160, 174, 0.1); color: #35a0ae; }
.adm-action-card--hierarchy .adm-action-card__icon[b-7xccwkldpc] { background: rgba(59, 130, 246, 0.1); color: #3b82f6; } /* was Rently red brand-trap, fixed Test-218 B-3 */
.adm-action-card--tags .adm-action-card__icon[b-7xccwkldpc] { background: rgba(59, 130, 246, 0.1); color: #3b82f6; }
.adm-action-card--featured .adm-action-card__icon[b-7xccwkldpc] { background: rgba(6, 182, 212, 0.1); color: #06b6d4; } /* was amber brand-trap, fixed Test-218 B-2 */
.adm-action-card--io .adm-action-card__icon[b-7xccwkldpc] { background: rgba(139, 92, 246, 0.1); color: #8b5cf6; }

[b-7xccwkldpc] .adm-action-card__chevron {
    color: #94a3b8 !important;
    flex-shrink: 0;
}

.adm-action-card__body[b-7xccwkldpc] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    flex: 1;
}

.adm-action-card__title[b-7xccwkldpc] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.3;
}

.adm-action-card__desc[b-7xccwkldpc] {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.4;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS — Category overview metrics
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-7xccwkldpc] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1.5rem;
}

.adm-detail-card[b-7xccwkldpc] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-7xccwkldpc] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-7xccwkldpc] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
    background: #cbd5e1; /* default fallback if no variant class */
}

/* Semantic detail-card variants — purges inline style="background:#..." on bar + Style="color:#..." on icon */
.adm-detail-card--total .adm-detail-card__bar[b-7xccwkldpc] { background: #35a0ae; }
.adm-detail-card--hierarchy .adm-detail-card__bar[b-7xccwkldpc] { background: #3b82f6; } /* was Rently red brand-trap, fixed Test-218 B-1 */
.adm-detail-card--tags .adm-detail-card__bar[b-7xccwkldpc] { background: #16a34a; }
.adm-detail-card--featured .adm-detail-card__bar[b-7xccwkldpc] { background: #06b6d4; } /* was amber brand-trap, fixed Test-218 B-2 */

[b-7xccwkldpc] .adm-detail-card--total .adm-detail-card__icon { color: #35a0ae !important; }
[b-7xccwkldpc] .adm-detail-card--hierarchy .adm-detail-card__icon { color: #3b82f6 !important; }
[b-7xccwkldpc] .adm-detail-card--tags .adm-detail-card__icon { color: #16a34a !important; }
[b-7xccwkldpc] .adm-detail-card--featured .adm-detail-card__icon { color: #06b6d4 !important; }

.adm-detail-card__data[b-7xccwkldpc] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-7xccwkldpc] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-7xccwkldpc] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-7xccwkldpc] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-actions-grid[b-7xccwkldpc] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-7xccwkldpc] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-7xccwkldpc] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-7xccwkldpc] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-actions-grid .adm-action-card:last-child:nth-child(odd)[b-7xccwkldpc] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 960px) {
    .adm-actions-grid[b-7xccwkldpc] {
        grid-template-columns: 1fr;
    }

    .adm-page-header[b-7xccwkldpc] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-7xccwkldpc] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-7xccwkldpc] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-7xccwkldpc] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-7xccwkldpc] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-7xccwkldpc] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-7xccwkldpc] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-7xccwkldpc] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-7xccwkldpc] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-detail-grid[b-7xccwkldpc] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-actions-grid[b-7xccwkldpc] {
        padding: 0 0.875rem 1.25rem;
    }

    .adm-section-header[b-7xccwkldpc] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-error-panel[b-7xccwkldpc] {
        margin: 1rem 0.875rem;
        padding: 1.5rem 1rem;
    }
}

/* ═══════════════════════════════════════════════════════
   REDUCED MOTION
   ═══════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-7xccwkldpc],
    .adm-action-card[b-7xccwkldpc],
    .adm-detail-card[b-7xccwkldpc] {
        transition: none !important;
    }

    .adm-status-pill__dot--on[b-7xccwkldpc] {
        box-shadow: none !important;
    }
}
/* /Components/Pages/Admin/Categories/CategoryEditorDialog.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Category Editor Dialog — Nordic Control Panel
   Scoped to CategoryEditorDialog component.
   ═══════════════════════════════════════════════════════ */

.adm-dialog-title[b-a5pmv19z7o] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.adm-dialog-section[b-a5pmv19z7o] {
    margin-bottom: 1.25rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #f1f5f9;
}

.adm-dialog-section:last-child[b-a5pmv19z7o],
.adm-dialog-section--last[b-a5pmv19z7o] {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.adm-dialog-section__title[b-a5pmv19z7o] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 0.75rem;
}

/* Toggle Grid */
.adm-toggle-grid[b-a5pmv19z7o] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.adm-toggle-row[b-a5pmv19z7o] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 0;
    border-bottom: 1px solid #f8f9fb;
}

.adm-toggle-row:last-child[b-a5pmv19z7o] {
    border-bottom: none;
}

.adm-toggle-row__info[b-a5pmv19z7o] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.adm-toggle-row__label[b-a5pmv19z7o] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #1e293b;
}

.adm-toggle-row__hint[b-a5pmv19z7o] {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.3;
}

/* Image Grid */
.adm-image-row[b-a5pmv19z7o] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.adm-image-slot[b-a5pmv19z7o] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.adm-image-slot__label[b-a5pmv19z7o] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.adm-image-slot__preview[b-a5pmv19z7o] {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
}

.adm-image-slot__img[b-a5pmv19z7o] {
    width: 100%;
    height: 80px;
    object-fit: cover;
    display: block;
}

[b-a5pmv19z7o] .adm-image-slot__remove {
    position: absolute !important;
    top: 4px;
    right: 4px;
    background: rgba(255, 255, 255, 0.9) !important;
    width: 24px !important;
    height: 24px !important;
}

/* ═══════════════════ Responsive ═══════════════════ */
@media (max-width: 600px) {
    .adm-image-row[b-a5pmv19z7o] {
        grid-template-columns: 1fr;
    }

    .adm-image-slot__img[b-a5pmv19z7o] {
        height: 120px;
    }
}
/* /Components/Pages/Admin/Categories/CategoryHierarchy.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Category Hierarchy — "Nordic Control Panel" Design System
   Extends the standard with a 3-panel drag-and-drop layout.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-7uug2k2w2m] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-7uug2k2w2m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-7uug2k2w2m] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-7uug2k2w2m] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

[b-7uug2k2w2m] .adm-breadcrumbs {
    padding: 0;
}

[b-7uug2k2w2m] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-7uug2k2w2m] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-7uug2k2w2m] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-7uug2k2w2m] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

.adm-status-pill[b-7uug2k2w2m] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-7uug2k2w2m] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-7uug2k2w2m] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--off[b-7uug2k2w2m] {
    background: #94a3b8;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-7uug2k2w2m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-7uug2k2w2m] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-7uug2k2w2m] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-7uug2k2w2m] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-7uug2k2w2m] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-7uug2k2w2m] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

[b-7uug2k2w2m] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-7uug2k2w2m] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-7uug2k2w2m] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
}

[b-7uug2k2w2m] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-7uug2k2w2m] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-7uug2k2w2m] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-7uug2k2w2m] {
    border-right: none;
}

.adm-kpi:hover[b-7uug2k2w2m] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-7uug2k2w2m] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-7uug2k2w2m] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-7uug2k2w2m] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-7uug2k2w2m] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-7uug2k2w2m] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-7uug2k2w2m] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-7uug2k2w2m] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-7uug2k2w2m] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-7uug2k2w2m] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-7uug2k2w2m] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-7uug2k2w2m] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* Error State */
.adm-error-state[b-7uug2k2w2m] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1rem;
    background: #ffffff;
}

/* ═══════════════════════════════════════════════════════
   THREE-PANEL LAYOUT
   ═══════════════════════════════════════════════════════ */
.adm-panel-grid[b-7uug2k2w2m] {
    display: grid;
    grid-template-columns: 1fr 1.5fr 0.7fr;
    gap: 0.75rem;
    padding: 1rem 1.5rem 1.5rem;
    min-height: 500px;
}

.adm-panel[b-7uug2k2w2m] {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    overflow: hidden;
}

.adm-panel__header[b-7uug2k2w2m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.875rem 1rem;
    border-bottom: 1px solid #e8ecf1;
    background: #f8fafc;
    flex-wrap: wrap;
}

.adm-panel__title[b-7uug2k2w2m] {
    font-size: 0.85rem;
    font-weight: 700;
    color: #1e293b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0;
}

.adm-panel__count[b-7uug2k2w2m] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 22px;
    padding: 0 0.5rem;
    border-radius: 11px;
    background: rgba(53, 160, 174, 0.1);
    color: #35a0ae;
    font-size: 0.72rem;
    font-weight: 700;
}

.adm-panel__header-tools[b-7uug2k2w2m] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.adm-selected-badge[b-7uug2k2w2m] {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    border-radius: 12px;
    background: rgba(37, 99, 235, 0.1);
    color: #2563eb;
    font-size: 0.7rem;
    font-weight: 600;
}

.adm-panel__filters[b-7uug2k2w2m] {
    padding: 0.5rem 0.75rem 0;
}

[b-7uug2k2w2m] .adm-filter-chips {
    gap: 0.25rem;
}

[b-7uug2k2w2m] .adm-filter-chips .mud-chip {
    font-size: 0.72rem;
    height: 28px;
    border-radius: 14px;
}

.adm-panel__search[b-7uug2k2w2m] {
    padding: 0.5rem 0.75rem;
}

.adm-panel__body[b-7uug2k2w2m] {
    flex: 1;
    overflow-y: auto;
    min-height: 300px;
    max-height: 550px;
    padding: 0.5rem;
}

.adm-panel__loading[b-7uug2k2w2m] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
}

.adm-panel__empty[b-7uug2k2w2m] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 1rem;
    color: #64748b;
    font-size: 0.82rem;
    text-align: center;
}

/* ═══════════════════════════════════════════════════════
   DRAG ITEMS (Available Categories panel)
   ═══════════════════════════════════════════════════════ */
[b-7uug2k2w2m] .adm-drag-list {
    padding: 0 !important;
}

[b-7uug2k2w2m] .adm-drag-item-wrap {
    padding: 0 !important;
    margin-bottom: 0.25rem;
}

.adm-drag-item[b-7uug2k2w2m] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.625rem;
    border-radius: 6px;
    background: #f8fafc;
    border: 1px solid #e8ecf1;
    cursor: grab;
    transition: all 0.15s ease;
}

.adm-drag-item:hover[b-7uug2k2w2m] {
    background: rgba(53, 160, 174, 0.04);
    border-color: rgba(53, 160, 174, 0.2);
}

.adm-drag-item:active[b-7uug2k2w2m] {
    opacity: 0.6;
    cursor: grabbing;
}

[b-7uug2k2w2m] .adm-drag-handle {
    color: #94a3b8 !important;
    flex-shrink: 0;
}

.adm-drag-item__name[b-7uug2k2w2m] {
    flex: 1;
    font-size: 0.82rem;
    font-weight: 500;
    color: #334155;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ═══════════════════════════════════════════════════════
   HIERARCHY TREE (Centre panel)
   ═══════════════════════════════════════════════════════ */
.adm-tree-body[b-7uug2k2w2m] {
    position: relative;
    transition: background 0.2s ease;
}

.adm-tree-body--drop-active[b-7uug2k2w2m] {
    background: rgba(53, 160, 174, 0.04) !important;
}

.adm-drop-hint[b-7uug2k2w2m] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.5rem;
    border-radius: 6px;
    background: rgba(37, 99, 235, 0.06);
    border: 1px dashed #2563eb;
    color: #2563eb;
    font-size: 0.78rem;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   BULK DROP ZONE
   ═══════════════════════════════════════════════════════ */
.adm-bulk-drop[b-7uug2k2w2m] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    margin: 0.5rem 0.5rem 0.5rem;
    border-radius: 8px;
    border: 2px dashed #d1d5db;
    background: #f8fafc;
    color: #94a3b8;
    font-size: 0.78rem;
    font-weight: 500;
    transition: all 0.2s ease;
    min-height: 48px;
}

.adm-bulk-drop--active[b-7uug2k2w2m] {
    border-color: #35a0ae;
    color: #35a0ae;
    background: rgba(53, 160, 174, 0.04);
}

.adm-bulk-drop--dragging[b-7uug2k2w2m] {
    border-color: #2563eb;
    background: rgba(37, 99, 235, 0.08);
    color: #2563eb;
}

/* ═══════════════════════════════════════════════════════
   ACTIONS PANEL (right)
   ═══════════════════════════════════════════════════════ */
.adm-actions-body[b-7uug2k2w2m] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    padding: 1rem !important;
}

.adm-action-divider[b-7uug2k2w2m] {
    height: 1px;
    background: #e8ecf1;
    margin: 0.25rem 0;
}

.adm-tips[b-7uug2k2w2m] {
    background: #f8fafc;
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    padding: 0.75rem;
}

.adm-tips__title[b-7uug2k2w2m] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #475569;
    margin: 0 0 0.5rem;
}

.adm-tips__list[b-7uug2k2w2m] {
    margin: 0;
    padding-left: 1rem;
    list-style: disc;
}

.adm-tips__list li[b-7uug2k2w2m] {
    font-size: 0.78rem;
    color: #64748b;
    line-height: 1.6;
}

.adm-selected-info[b-7uug2k2w2m] {
    background: #f8fafc;
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.adm-selected-info__label[b-7uug2k2w2m] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
}

.adm-selected-info__name[b-7uug2k2w2m] {
    font-size: 0.88rem;
    font-weight: 600;
    color: #1e293b;
}

.adm-selected-info__desc[b-7uug2k2w2m] {
    font-size: 0.78rem;
    color: #64748b;
    line-height: 1.4;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-panel-grid[b-7uug2k2w2m] {
        grid-template-columns: 1fr 1.5fr;
    }

    .adm-panel--actions[b-7uug2k2w2m] {
        grid-column: 1 / -1;
    }

    .adm-actions-body[b-7uug2k2w2m] {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .adm-action-divider[b-7uug2k2w2m] {
        width: 1px;
        height: 36px;
        margin: 0;
    }

    .adm-detail-grid[b-7uug2k2w2m] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-7uug2k2w2m] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-7uug2k2w2m] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-7uug2k2w2m] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-7uug2k2w2m] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-7uug2k2w2m] {
        margin-left: 0;
        width: 100%;
        justify-content: flex-start;
    }

    [b-7uug2k2w2m] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    [b-7uug2k2w2m] .adm-add-btn {
        min-height: 44px !important;
    }

    .adm-panel-grid[b-7uug2k2w2m] {
        grid-template-columns: 1fr;
    }

    .adm-panel--actions[b-7uug2k2w2m] {
        grid-column: auto;
    }

    .adm-actions-body[b-7uug2k2w2m] {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .adm-detail-grid[b-7uug2k2w2m] {
        grid-template-columns: 1fr;
    }

    .adm-kpi-strip[b-7uug2k2w2m] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-panel__body[b-7uug2k2w2m] {
        min-height: 200px;
        max-height: 400px;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-7uug2k2w2m] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-7uug2k2w2m] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-7uug2k2w2m] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-7uug2k2w2m] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-7uug2k2w2m] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi__value[b-7uug2k2w2m] {
        font-size: 1.25rem;
    }

    .adm-detail-grid[b-7uug2k2w2m] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-panel-grid[b-7uug2k2w2m] {
        padding: 0.75rem 0.875rem 1rem;
    }
}
/* /Components/Pages/Admin/Categories/CategoryHierarchyTreeItem.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Category Hierarchy Tree Item — Nordic Design System
   ═══════════════════════════════════════════════════════ */

.adm-tree-node[b-5302u9rrs7] {
    transition: all 0.15s ease;
}

.adm-tree-node--drop > .adm-tree-node__row[b-5302u9rrs7] {
    background: rgba(34, 197, 94, 0.08) !important;
    border-color: #22c55e !important;
}

.adm-tree-node__row[b-5302u9rrs7] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.375rem 0.5rem;
    margin-bottom: 0.125rem;
    border-radius: 6px;
    border: 1px solid transparent;
    background: #f8fafc;
    cursor: grab;
    transition: all 0.15s ease;
}

.adm-tree-node__row:hover[b-5302u9rrs7] {
    background: rgba(53, 160, 174, 0.04);
    border-color: #e8ecf1;
}

.adm-tree-node__row:active[b-5302u9rrs7] {
    opacity: 0.6;
    cursor: grabbing;
}

.adm-tree-node__row--highlight[b-5302u9rrs7] {
    background: rgba(53, 160, 174, 0.08);
    border-color: rgba(53, 160, 174, 0.2);
}

.adm-tree-node__row--highlight .adm-tree-node__name[b-5302u9rrs7] {
    font-weight: 700;
}

[b-5302u9rrs7] .adm-tree-drag {
    color: #94a3b8 !important;
    flex-shrink: 0;
    transition: transform 0.15s ease;
}

[b-5302u9rrs7] .adm-tree-drag:hover {
    transform: scale(1.1);
}

.adm-tree-spacer[b-5302u9rrs7] {
    width: 34px;
    flex-shrink: 0;
}

.adm-tree-node__name[b-5302u9rrs7] {
    flex: 1;
    font-size: 0.82rem;
    font-weight: 500;
    color: #334155;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.adm-tree-badge[b-5302u9rrs7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 20px;
    padding: 0 0.4rem;
    border-radius: 10px;
    background: rgba(37, 99, 235, 0.1);
    color: #2563eb;
    font-size: 0.68rem;
    font-weight: 700;
    flex-shrink: 0;
}

.adm-tree-children[b-5302u9rrs7] {
    margin-left: 2rem;
    padding-left: 0.5rem;
    border-left: 1px solid #e8ecf1;
}
/* /Components/Pages/Admin/Categories/CategoryImportExport.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Category Import/Export — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard / SearchHistories standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-tseyxvs1zm] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-tseyxvs1zm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-tseyxvs1zm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-tseyxvs1zm] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-tseyxvs1zm] .adm-breadcrumbs {
    padding: 0;
}

[b-tseyxvs1zm] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-tseyxvs1zm] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-tseyxvs1zm] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-tseyxvs1zm] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-tseyxvs1zm] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-tseyxvs1zm] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-tseyxvs1zm] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.adm-status-pill__dot--warn[b-tseyxvs1zm] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__time[b-tseyxvs1zm] {
    color: #576573;
    font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-tseyxvs1zm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-tseyxvs1zm] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-tseyxvs1zm] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-tseyxvs1zm] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-tseyxvs1zm] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-tseyxvs1zm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-tseyxvs1zm] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-tseyxvs1zm] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Back / Outlined buttons */
[b-tseyxvs1zm] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
}

[b-tseyxvs1zm] .adm-back-btn:hover {
    border-color: rgba(53, 160, 174, 0.3) !important;
    color: #35a0ae !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-tseyxvs1zm] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-tseyxvs1zm] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-tseyxvs1zm] {
    border-right: none;
}

.adm-kpi:hover[b-tseyxvs1zm] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-tseyxvs1zm] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-tseyxvs1zm] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-tseyxvs1zm] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-tseyxvs1zm] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-tseyxvs1zm] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-tseyxvs1zm] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-tseyxvs1zm] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-detail-grid[b-tseyxvs1zm] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-tseyxvs1zm] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-tseyxvs1zm] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-tseyxvs1zm] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-tseyxvs1zm] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-tseyxvs1zm] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-tseyxvs1zm] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-tseyxvs1zm] .adm-tabs {
    background: transparent;
}

[b-tseyxvs1zm] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-tseyxvs1zm] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-tseyxvs1zm] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-tseyxvs1zm] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-tseyxvs1zm] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-tseyxvs1zm] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-tseyxvs1zm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-tseyxvs1zm] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-tseyxvs1zm] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-tseyxvs1zm] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-tseyxvs1zm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* ═══════════════════════════════════════════════════════
   IMPORT/EXPORT PANELS
   ═══════════════════════════════════════════════════════ */
.adm-panel-wrap[b-tseyxvs1zm] {
    padding: 1rem 1.5rem;
}

.adm-form-card[b-tseyxvs1zm] {
    border-radius: 10px;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
}

.adm-form-card__header[b-tseyxvs1zm] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #f1f5f9;
}

.adm-form-card__accent[b-tseyxvs1zm] {
    width: 3px;
    height: 24px;
    border-radius: 2px;
    flex-shrink: 0;
}

.adm-form-card__title[b-tseyxvs1zm] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #1e293b;
    font-family: 'Montserrat', sans-serif;
}

.adm-form-card__body[b-tseyxvs1zm] {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.adm-form-card__desc[b-tseyxvs1zm] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.5;
}

/* Upload zone */
.adm-upload-zone[b-tseyxvs1zm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 2rem 1.5rem;
    border: 2px dashed #d1d5db;
    border-radius: 10px;
    background: #fafbfc;
    transition: border-color 0.2s ease, background 0.2s ease;
    cursor: pointer;
    text-align: center;
}

.adm-upload-zone:hover[b-tseyxvs1zm] {
    border-color: #35a0ae;
    background: rgba(53, 160, 174, 0.03);
}

.adm-upload-zone__text[b-tseyxvs1zm] {
    font-size: 0.85rem;
    color: #475569;
    font-weight: 500;
}

.adm-upload-zone__hint[b-tseyxvs1zm] {
    font-size: 0.75rem;
    color: #94a3b8;
}

/* Preview table */
.adm-preview-wrap[b-tseyxvs1zm] {
    padding: 0 1.25rem 1.25rem;
}

[b-tseyxvs1zm] .adm-preview-table {
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #e8ecf1;
}

[b-tseyxvs1zm] .adm-preview-table .mud-table-head th {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    background: #f8f9fb;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 0.75rem;
}

[b-tseyxvs1zm] .adm-preview-table .mud-table-body td {
    font-size: 0.82rem;
    color: #334155;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #f1f5f9;
}

/* Export options */
[b-tseyxvs1zm] .adm-radio-group .mud-radio {
    margin-bottom: 0.25rem;
}

[b-tseyxvs1zm] .adm-radio-group .mud-typography {
    font-size: 0.85rem;
    color: #334155;
}

/* Action buttons */
[b-tseyxvs1zm] .adm-action-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 40px;
    letter-spacing: 0;
}

/* Export stats alert */
.adm-export-stats[b-tseyxvs1zm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    border-radius: 8px;
    background: rgba(53, 160, 174, 0.06);
    border: 1px solid rgba(53, 160, 174, 0.15);
    font-size: 0.82rem;
    color: #256f7a;
}

/* CSV format hint */
.adm-csv-hint[b-tseyxvs1zm] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-radius: 8px;
    background: #f8f9fb;
    border: 1px solid #e8ecf1;
}

.adm-csv-hint__title[b-tseyxvs1zm] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.adm-csv-hint__code[b-tseyxvs1zm] {
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
    font-size: 0.78rem;
    color: #1e293b;
    background: #ffffff;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
    overflow-x: auto;
}

/* Status badges */
.adm-status-badge[b-tseyxvs1zm] {
    display: inline-block;
    padding: 0.15rem 0.625rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.adm-status-badge--success[b-tseyxvs1zm] {
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
}

.adm-status-badge--error[b-tseyxvs1zm] {
    background: rgba(239, 68, 68, 0.08);
    color: #dc2626;
}

/* ═══════════════════════════════════════════════════════
   LOADING STATE
   ═══════════════════════════════════════════════════════ */
.adm-loading[b-tseyxvs1zm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 4rem 2rem;
}

.adm-loading__text[b-tseyxvs1zm] {
    font-size: 0.85rem;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   ERROR STATE
   ═══════════════════════════════════════════════════════ */
.adm-error-state[b-tseyxvs1zm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 4rem 2rem;
}

.adm-error-state__text[b-tseyxvs1zm] {
    font-size: 0.85rem;
    color: #64748b;
    font-weight: 500;
    text-align: center;
    max-width: 400px;
}

/* ═══════════════════════════════════════════════════════
   EMPTY STATE
   ═══════════════════════════════════════════════════════ */
.adm-empty-state[b-tseyxvs1zm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 3rem 2rem;
}

.adm-empty-state__title[b-tseyxvs1zm] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
}

.adm-empty-state__text[b-tseyxvs1zm] {
    font-size: 0.82rem;
    color: #64748b;
    text-align: center;
    max-width: 350px;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — Tablet (max-width: 960px)
   ═══════════════════════════════════════════════════════ */
@media (max-width: 960px) {
    .adm-kpi-strip[b-tseyxvs1zm] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-tseyxvs1zm] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-page-header[b-tseyxvs1zm] {
        padding: 1rem 1.25rem;
    }

    .adm-page-header__tools[b-tseyxvs1zm] {
        width: 100%;
        justify-content: flex-end;
    }

    [b-tseyxvs1zm] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }

    [b-tseyxvs1zm] .adm-back-btn {
        min-height: 44px;
    }

    [b-tseyxvs1zm] .adm-action-btn {
        min-height: 44px;
    }

    .adm-tab-toolbar[b-tseyxvs1zm] {
        padding: 1rem 1.25rem;
    }

    .adm-tab-toolbar__right[b-tseyxvs1zm] {
        width: 100%;
    }

    .adm-panel-wrap[b-tseyxvs1zm] {
        padding: 1rem 1.25rem;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — Mobile (max-width: 600px)
   ═══════════════════════════════════════════════════════ */
@media (max-width: 600px) {
    .adm-actionbar[b-tseyxvs1zm] {
        padding: 0.5rem 1rem;
    }

    .adm-page-header[b-tseyxvs1zm] {
        padding: 1rem;
        gap: 1rem;
    }

    .adm-page-header__title[b-tseyxvs1zm] {
        gap: 0.75rem;
    }

    .adm-page-header__h1[b-tseyxvs1zm] {
        font-size: 1.125rem;
    }

    .adm-page-header__sub[b-tseyxvs1zm] {
        font-size: 0.75rem;
    }

    .adm-page-header__tools[b-tseyxvs1zm] {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .adm-kpi-strip[b-tseyxvs1zm] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi__value[b-tseyxvs1zm] {
        font-size: 1.25rem;
    }

    .adm-section-header[b-tseyxvs1zm] {
        padding: 0.75rem 1rem 0.5rem;
    }

    .adm-detail-grid[b-tseyxvs1zm] {
        grid-template-columns: 1fr;
        padding: 0 1rem 0.75rem;
    }

    .adm-tab-toolbar[b-tseyxvs1zm] {
        padding: 0.75rem 1rem;
    }

    .adm-panel-wrap[b-tseyxvs1zm] {
        padding: 0.75rem 1rem;
    }

    .adm-upload-zone[b-tseyxvs1zm] {
        padding: 1.5rem 1rem;
    }

    [b-tseyxvs1zm] .adm-upload-zone .mud-button-root {
        min-height: 44px;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 2K+ (min-width: 2000px)
   ═══════════════════════════════════════════════════════ */
@media (min-width: 2000px) {
    .adm-page-header__h1[b-tseyxvs1zm] {
        font-size: 1.5rem;
    }

    .adm-kpi__value[b-tseyxvs1zm] {
        font-size: 1.75rem;
    }

    .adm-detail-card__number[b-tseyxvs1zm] {
        font-size: 1.5rem;
    }
}
/* /Components/Pages/Admin/Categories/CategoryTagRelationshipItem.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Category-Tag Relationship Item — Nordic Scoped CSS
   ═══════════════════════════════════════════════════════ */

.cat-tag-item[b-9b1nf5ht2n] {
    transition: all 0.2s ease;
}

.cat-tag-row[b-9b1nf5ht2n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.5rem 0.625rem;
    margin-bottom: 2px;
    border-radius: 6px;
    border: 2px solid transparent;
    transition: all 0.2s ease;
    flex-wrap: wrap;
}

.cat-tag-row:hover[b-9b1nf5ht2n] {
    background: rgba(53, 160, 174, 0.03);
}

.cat-tag-row--highlighted[b-9b1nf5ht2n] {
    background: rgba(53, 160, 174, 0.06);
    border-color: rgba(53, 160, 174, 0.15);
}

/* C-2 FIX: Drag-over visual feedback via local state */
.cat-tag-row--drag-over[b-9b1nf5ht2n] {
    background: rgba(53, 160, 174, 0.08) !important;
    border: 2px dashed #35a0ae !important;
}

.cat-tag-row__left[b-9b1nf5ht2n] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    min-width: 0;
    flex: 1;
}

.cat-tag-row__spacer[b-9b1nf5ht2n] {
    width: 32px;
    flex-shrink: 0;
}

/* Expand/collapse button */
[b-9b1nf5ht2n] .cat-tag-row__expand-btn {
    color: #475569 !important;
}

.cat-tag-row__name[b-9b1nf5ht2n] {
    font-size: 0.82rem;
    color: #334155;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cat-tag-row__name--bold[b-9b1nf5ht2n] {
    font-weight: 700;
    color: #1e293b;
}

/* C-1 FIX: Click-to-assign button for mobile/touch fallback */
[b-9b1nf5ht2n] .cat-tag-row__assign-btn {
    color: #35a0ae !important;
    opacity: 0.7;
    transition: opacity 0.15s ease;
}

[b-9b1nf5ht2n] .cat-tag-row__assign-btn:hover {
    opacity: 1;
}

.cat-tag-row__right[b-9b1nf5ht2n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.cat-tag-chips[b-9b1nf5ht2n] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

/* Tag chip styling */
[b-9b1nf5ht2n] .cat-tag-chip {
    background: rgba(53, 160, 174, 0.1) !important;
    color: #256f7a !important;
    border-radius: 12px !important;
    font-size: 0.72rem !important;
    height: 26px !important;
}

/* H-1 FIX: WCAG contrast — #94a3b8 → #64748b (4.76:1 on white) */
.cat-tag-row__hint[b-9b1nf5ht2n] {
    font-size: 0.72rem;
    color: #64748b;
    font-style: italic;
}

/* M-3 FIX: Badge font size 0.65rem → 0.72rem for readability */
.cat-tag-row__sub-badge[b-9b1nf5ht2n] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.5rem;
    border-radius: 10px;
    background: rgba(37, 99, 235, 0.08);
    color: #1d4ed8;
    font-size: 0.72rem;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0;
}

.cat-tag-children[b-9b1nf5ht2n] {
    margin-left: 2rem;
    border-left: 1px solid #e8ecf1;
    padding-left: 0.5rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 960px
   ═══════════════════════════════════════════════════════ */
@media (max-width: 960px) {
    .cat-tag-row[b-9b1nf5ht2n] {
        min-height: 44px;
    }

    .cat-tag-children[b-9b1nf5ht2n] {
        margin-left: 1rem;
    }

    /* H-4 FIX: Expand/collapse button 44px touch target */
    [b-9b1nf5ht2n] .cat-tag-row__expand-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    /* H-3 FIX: Tag chip height for touch targets */
    [b-9b1nf5ht2n] .cat-tag-chip {
        height: 32px !important;
    }

    /* C-1: Assign button 44px touch target */
    [b-9b1nf5ht2n] .cat-tag-row__assign-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 600px
   ═══════════════════════════════════════════════════════ */
@media (max-width: 600px) {
    .cat-tag-row__right[b-9b1nf5ht2n] {
        width: 100%;
        padding-left: 2rem;
    }

    .cat-tag-children[b-9b1nf5ht2n] {
        margin-left: 0.5rem;
    }
}
/* /Components/Pages/Admin/Categories/CategoryTagRelationships.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Category-Tag Relationships — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + Categories standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-bjd5umvuz3] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-bjd5umvuz3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-bjd5umvuz3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-bjd5umvuz3] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-bjd5umvuz3] .adm-breadcrumbs {
    padding: 0;
}

[b-bjd5umvuz3] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-bjd5umvuz3] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-bjd5umvuz3] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-bjd5umvuz3] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-bjd5umvuz3] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-bjd5umvuz3] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* M-1 FIX: WCAG non-text contrast — #22c55e → #16a34a (3.36:1 on #f1f5f9) */
.adm-status-pill__dot--on[b-bjd5umvuz3] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.adm-status-pill__dot--off[b-bjd5umvuz3] {
    background: #94a3b8;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-bjd5umvuz3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-bjd5umvuz3] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-bjd5umvuz3] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-bjd5umvuz3] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-bjd5umvuz3] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-bjd5umvuz3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-bjd5umvuz3] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-bjd5umvuz3] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Add Button */
[b-bjd5umvuz3] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
}

/* Back Button */
[b-bjd5umvuz3] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-bjd5umvuz3] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-bjd5umvuz3] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-bjd5umvuz3] {
    border-right: none;
}

.adm-kpi:hover[b-bjd5umvuz3] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-bjd5umvuz3] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-bjd5umvuz3] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-bjd5umvuz3] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-bjd5umvuz3] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-bjd5umvuz3] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-bjd5umvuz3] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-bjd5umvuz3] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-bjd5umvuz3] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-bjd5umvuz3] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-bjd5umvuz3] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-bjd5umvuz3] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* Error State */
.adm-error-state[b-bjd5umvuz3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1rem;
    background: #ffffff;
}

/* ═══════════════════════════════════════════════════════
   THREE-PANEL LAYOUT
   ═══════════════════════════════════════════════════════ */
.adm-panel-grid[b-bjd5umvuz3] {
    display: grid;
    grid-template-columns: 1fr 1.5fr 0.7fr;
    gap: 0.75rem;
    padding: 1rem 1.5rem 1.5rem;
    min-height: 500px;
}

.adm-panel[b-bjd5umvuz3] {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    overflow: hidden;
}

.adm-panel__header[b-bjd5umvuz3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.875rem 1rem;
    border-bottom: 1px solid #e8ecf1;
    background: #f8fafc;
    flex-wrap: wrap;
}

.adm-panel__title[b-bjd5umvuz3] {
    font-size: 0.85rem;
    font-weight: 700;
    color: #1e293b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0;
}

.adm-panel__count[b-bjd5umvuz3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 22px;
    padding: 0 0.5rem;
    border-radius: 11px;
    background: rgba(53, 160, 174, 0.1);
    color: #256f7a;
    font-size: 0.72rem;
    font-weight: 700;
}

.adm-panel__header-tools[b-bjd5umvuz3] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.adm-panel__search[b-bjd5umvuz3] {
    padding: 0.5rem 0.75rem;
}

.adm-panel__body[b-bjd5umvuz3] {
    flex: 1;
    overflow-y: auto;
    min-height: 300px;
    max-height: 550px;
    padding: 0.5rem;
}

.adm-panel__body--actions[b-bjd5umvuz3] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.75rem;
}

.adm-panel__loading[b-bjd5umvuz3] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
}

.adm-panel__empty[b-bjd5umvuz3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 1rem;
    text-align: center;
}

/* ═══════════════════════════════════════════════════════
   TAG ITEMS (Left Panel)
   ═══════════════════════════════════════════════════════ */
.adm-tag-item[b-bjd5umvuz3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.625rem;
    margin-bottom: 2px;
    border-radius: 6px;
    cursor: grab;
    transition: all 0.15s ease;
    border: 1px solid transparent;
}

.adm-tag-item:hover[b-bjd5umvuz3] {
    background: rgba(53, 160, 174, 0.04);
    border-color: rgba(53, 160, 174, 0.15);
}

.adm-tag-item:active[b-bjd5umvuz3] {
    opacity: 0.6;
    cursor: grabbing;
}

.adm-tag-item__drag[b-bjd5umvuz3] {
    color: #94a3b8;
    flex-shrink: 0;
}

.adm-tag-item__name[b-bjd5umvuz3] {
    flex: 1;
    font-size: 0.82rem;
    color: #334155;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* H-2 FIX: WCAG contrast — #2563eb → #1d4ed8 (5.39:1 on white) */
/* M-3 FIX: font size 0.65rem → 0.72rem for readability */
.adm-tag-item__badge[b-bjd5umvuz3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 18px;
    padding: 0 0.375rem;
    border-radius: 9px;
    background: rgba(37, 99, 235, 0.1);
    color: #1d4ed8;
    font-size: 0.72rem;
    font-weight: 700;
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════
   SELECTED TAG CARD (Right Panel)
   ═══════════════════════════════════════════════════════ */
.adm-selected-tag-card[b-bjd5umvuz3] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.75rem;
    border-radius: 8px;
    background: #f8fafc;
    border: 1px solid #e8ecf1;
}

.adm-selected-tag-card__label[b-bjd5umvuz3] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
}

.adm-selected-tag-card__chip[b-bjd5umvuz3] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.625rem;
    border-radius: 16px;
    background: rgba(53, 160, 174, 0.1);
    color: #256f7a;
    font-size: 0.82rem;
    font-weight: 600;
    width: fit-content;
}

/* Action Divider */
.adm-action-divider[b-bjd5umvuz3] {
    height: 1px;
    background: #e8ecf1;
}

/* ═══════════════════════════════════════════════════════
   TIPS CARD (Right Panel)
   ═══════════════════════════════════════════════════════ */
.adm-tips-card[b-bjd5umvuz3] {
    display: flex;
    gap: 0.5rem;
    padding: 0.75rem;
    border-radius: 8px;
    background: rgba(180, 83, 9, 0.04);
    border: 1px solid rgba(180, 83, 9, 0.12);
}

.adm-tips-card__content[b-bjd5umvuz3] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.adm-tips-card__title[b-bjd5umvuz3] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #b45309;
}

.adm-tips-card__list[b-bjd5umvuz3] {
    margin: 0;
    padding: 0 0 0 1rem;
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.6;
}

.adm-tips-card__list li[b-bjd5umvuz3] {
    margin-bottom: 0.125rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 1280px
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-bjd5umvuz3] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-bjd5umvuz3] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-bjd5umvuz3] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-bjd5umvuz3] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-panel-grid[b-bjd5umvuz3] {
        grid-template-columns: 1fr 1.5fr;
    }

    /* Right panel moves below on medium screens */
    .adm-panel:last-child[b-bjd5umvuz3] {
        grid-column: 1 / -1;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 960px
   ═══════════════════════════════════════════════════════ */
@media (max-width: 960px) {
    .adm-page-header[b-bjd5umvuz3] {
        padding: 1rem;
    }

    .adm-page-header__title[b-bjd5umvuz3] {
        width: 100%;
    }

    .adm-page-header__tools[b-bjd5umvuz3] {
        width: 100%;
        justify-content: flex-end;
    }

    .adm-detail-grid[b-bjd5umvuz3] {
        padding: 0.75rem 1rem;
    }

    .adm-panel-grid[b-bjd5umvuz3] {
        grid-template-columns: 1fr;
        padding: 0.75rem 1rem 1rem;
        min-height: auto;
    }

    .adm-panel__body[b-bjd5umvuz3] {
        min-height: 200px;
        max-height: 400px;
    }

    [b-bjd5umvuz3] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }

    [b-bjd5umvuz3] .adm-add-btn {
        min-height: 44px;
    }

    .adm-tag-item[b-bjd5umvuz3] {
        min-height: 44px;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 600px
   ═══════════════════════════════════════════════════════ */
@media (max-width: 600px) {
    .adm-actionbar[b-bjd5umvuz3] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-bjd5umvuz3] {
        padding: 0.75rem 0.875rem;
    }

    .adm-page-header__h1[b-bjd5umvuz3] {
        font-size: 1.125rem;
    }

    .adm-kpi-strip[b-bjd5umvuz3] {
        grid-template-columns: 1fr 1fr;
    }

    .adm-kpi__value[b-bjd5umvuz3] {
        font-size: 1.25rem;
    }

    .adm-detail-grid[b-bjd5umvuz3] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-panel-grid[b-bjd5umvuz3] {
        padding: 0.75rem 0.875rem 1rem;
    }
}
/* /Components/Pages/Admin/Categories/FeaturedCategories.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Featured Categories — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + Categories standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-agns0kotu3] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-agns0kotu3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-agns0kotu3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-agns0kotu3] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-agns0kotu3] .adm-breadcrumbs {
    padding: 0;
}

[b-agns0kotu3] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-agns0kotu3] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-agns0kotu3] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-agns0kotu3] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-agns0kotu3] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-agns0kotu3] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-agns0kotu3] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--off[b-agns0kotu3] {
    background: #94a3b8;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-agns0kotu3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-agns0kotu3] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-agns0kotu3] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-agns0kotu3] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-agns0kotu3] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-agns0kotu3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-agns0kotu3] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-agns0kotu3] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Back / Retry Button */
[b-agns0kotu3] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-agns0kotu3] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-agns0kotu3] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-agns0kotu3] {
    border-right: none;
}

.adm-kpi:hover[b-agns0kotu3] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-agns0kotu3] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-agns0kotu3] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-agns0kotu3] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-agns0kotu3] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-agns0kotu3] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-agns0kotu3] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-agns0kotu3] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-agns0kotu3] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-agns0kotu3] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-agns0kotu3] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-agns0kotu3] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   DUAL-PANEL LAYOUT
   ═══════════════════════════════════════════════════════ */
.adm-panel-grid[b-agns0kotu3] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    padding: 1rem 1.5rem 1.5rem;
    min-height: 450px;
}

.adm-panel[b-agns0kotu3] {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    overflow: hidden;
}

.adm-panel__header[b-agns0kotu3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.875rem 1rem;
    border-bottom: 1px solid #e8ecf1;
    background: #f8fafc;
    flex-wrap: wrap;
}

.adm-panel__title[b-agns0kotu3] {
    font-size: 0.85rem;
    font-weight: 700;
    color: #1e293b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0;
}

.adm-panel__count[b-agns0kotu3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 22px;
    padding: 0 0.5rem;
    border-radius: 11px;
    background: rgba(53, 160, 174, 0.1);
    color: #256f7a;
    font-size: 0.72rem;
    font-weight: 700;
}

.adm-panel__header-left[b-agns0kotu3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-panel__hint[b-agns0kotu3] {
    font-size: 0.75rem;
    color: #64748b;
}

.adm-panel__search[b-agns0kotu3] {
    padding: 0.5rem 0.75rem;
}

[b-agns0kotu3] .adm-panel-search-field {
    font-size: 0.85rem;
}

[b-agns0kotu3] .adm-panel-search-field .mud-input-adornment-start {
    color: #64748b;
}

.adm-panel__body[b-agns0kotu3] {
    flex: 1;
    overflow-y: auto;
    min-height: 350px;
    max-height: 550px;
    padding: 0.5rem;
}

.adm-panel__loading[b-agns0kotu3] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
}

.adm-panel__empty[b-agns0kotu3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 1rem;
    color: #64748b;
    font-size: 0.82rem;
    text-align: center;
}

/* ═══════════════════════════════════════════════════════
   AVAILABLE CATEGORIES — DRAG ITEMS
   ═══════════════════════════════════════════════════════ */
.adm-drag-item[b-agns0kotu3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.625rem;
    margin-bottom: 0.25rem;
    border-radius: 6px;
    background: #f8fafc;
    border: 1px solid #e8ecf1;
    cursor: grab;
    transition: all 0.15s ease;
}

.adm-drag-item:hover[b-agns0kotu3] {
    background: rgba(53, 160, 174, 0.04);
    border-color: rgba(53, 160, 174, 0.2);
}

.adm-drag-item:active[b-agns0kotu3] {
    cursor: grabbing;
}

.adm-drag-item--dragging[b-agns0kotu3] {
    opacity: 0.5;
}

[b-agns0kotu3] .adm-drag-handle {
    color: #94a3b8 !important;
    flex-shrink: 0;
}

.adm-drag-item__name[b-agns0kotu3] {
    flex: 1;
    font-size: 0.82rem;
    font-weight: 500;
    color: #334155;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ═══════════════════════════════════════════════════════
   FEATURED CATEGORIES — DROP ZONE & ITEMS
   ═══════════════════════════════════════════════════════ */
.adm-drop-zone[b-agns0kotu3] {
    transition: all 0.2s ease;
    border: 2px dashed transparent;
    border-radius: 0;
}

.adm-drop-zone--active[b-agns0kotu3] {
    background: rgba(53, 160, 174, 0.03) !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

.adm-drop-hint[b-agns0kotu3] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    margin-top: 0.5rem;
    border-radius: 6px;
    background: rgba(53, 160, 174, 0.06);
    border: 1px dashed #35a0ae;
    color: #35a0ae;
    font-size: 0.78rem;
    font-weight: 500;
}

.adm-featured-item[b-agns0kotu3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.625rem;
    margin-bottom: 0.25rem;
    border-radius: 6px;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    transition: all 0.15s ease;
}

.adm-featured-item:hover[b-agns0kotu3] {
    background: rgba(99, 102, 241, 0.03);
    border-color: rgba(99, 102, 241, 0.15);
}

.adm-featured-item__rank[b-agns0kotu3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    background: rgba(99, 102, 241, 0.1);
    color: #6366f1;
    font-size: 0.72rem;
    font-weight: 700;
    flex-shrink: 0;
}

.adm-featured-item__name[b-agns0kotu3] {
    flex: 1;
    font-size: 0.82rem;
    font-weight: 500;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.adm-featured-item__actions[b-agns0kotu3] {
    display: flex;
    align-items: center;
    gap: 0.125rem;
    flex-shrink: 0;
}

[b-agns0kotu3] .adm-order-btn {
    color: #475569 !important;
    border-radius: 6px !important;
}

[b-agns0kotu3] .adm-order-btn:hover:not(:disabled) {
    color: #35a0ae !important;
    background: rgba(53, 160, 174, 0.06) !important;
}

[b-agns0kotu3] .adm-remove-btn {
    color: #64748b !important;
    border-radius: 6px !important;
}

[b-agns0kotu3] .adm-remove-btn:hover:not(:disabled) {
    color: #ef4444 !important;
    background: rgba(239, 68, 68, 0.06) !important;
}

/* Error State */
.adm-error-state[b-agns0kotu3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1rem;
    background: #ffffff;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-agns0kotu3] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-agns0kotu3] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-agns0kotu3] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-agns0kotu3] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-agns0kotu3] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-agns0kotu3] {
        margin-left: 0;
        width: 100%;
        justify-content: flex-start;
    }

    [b-agns0kotu3] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    .adm-panel-grid[b-agns0kotu3] {
        grid-template-columns: 1fr;
    }

    .adm-panel__body[b-agns0kotu3] {
        min-height: 250px;
        max-height: 400px;
    }

    .adm-detail-grid[b-agns0kotu3] {
        grid-template-columns: 1fr;
    }

    .adm-kpi-strip[b-agns0kotu3] {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Touch targets 44px for tablet+ */
    [b-agns0kotu3] .adm-order-btn,
    [b-agns0kotu3] .adm-remove-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-agns0kotu3] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-agns0kotu3] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-agns0kotu3] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-agns0kotu3] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-agns0kotu3] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi__value[b-agns0kotu3] {
        font-size: 1.25rem;
    }

    .adm-detail-grid[b-agns0kotu3] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-panel-grid[b-agns0kotu3] {
        padding: 0.75rem 0.875rem 1rem;
    }

    .adm-panel__body[b-agns0kotu3] {
        min-height: 200px;
        max-height: 350px;
    }
}
/* /Components/Pages/Admin/Categories/GeneralCategories.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   General Categories — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + Categories standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-wsb62sqqha] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-wsb62sqqha] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-wsb62sqqha] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-wsb62sqqha] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-wsb62sqqha] .adm-breadcrumbs {
    padding: 0;
}

[b-wsb62sqqha] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-wsb62sqqha] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-wsb62sqqha] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-wsb62sqqha] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-wsb62sqqha] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-wsb62sqqha] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-wsb62sqqha] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--off[b-wsb62sqqha] {
    background: #94a3b8;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-wsb62sqqha] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-wsb62sqqha] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-wsb62sqqha] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-wsb62sqqha] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-wsb62sqqha] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-wsb62sqqha] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-wsb62sqqha] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-wsb62sqqha] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Add Button */
[b-wsb62sqqha] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
}

/* Back Button */
[b-wsb62sqqha] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-wsb62sqqha] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-wsb62sqqha] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-wsb62sqqha] {
    border-right: none;
}

.adm-kpi:hover[b-wsb62sqqha] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-wsb62sqqha] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-wsb62sqqha] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-wsb62sqqha] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-wsb62sqqha] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-wsb62sqqha] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-wsb62sqqha] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-wsb62sqqha] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-wsb62sqqha] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-wsb62sqqha] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-wsb62sqqha] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-wsb62sqqha] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   FILTER ROW
   ═══════════════════════════════════════════════════════ */
.adm-filter-row[b-wsb62sqqha] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

[b-wsb62sqqha] .adm-search {
    max-width: 400px;
}

[b-wsb62sqqha] .adm-search .mud-input-adornment-start {
    color: #64748b;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
.adm-table-wrap[b-wsb62sqqha] {
    padding: 0 1.5rem 1.5rem;
    background: #f8f9fb;
}

[b-wsb62sqqha] .adm-table {
    background: #ffffff;
    border-radius: 10px;
    border: 1px solid #e8ecf1;
    overflow: hidden;
}

[b-wsb62sqqha] .adm-table .mud-table-head .mud-table-cell {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #475569;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    padding: 0.75rem 1rem;
}

[b-wsb62sqqha] .adm-table .mud-table-body .mud-table-cell {
    font-size: 0.85rem;
    color: #334155;
    padding: 0.625rem 1rem;
    border-bottom: 1px solid #f1f5f9;
}

[b-wsb62sqqha] .adm-table .mud-table-body .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.03) !important;
    cursor: pointer;
}

[b-wsb62sqqha] .adm-table .mud-table-body .mud-table-row:last-child .mud-table-cell {
    border-bottom: none;
}

[b-wsb62sqqha] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
    font-size: 0.8rem;
    color: #64748b;
}

/* Cell styles */
.adm-cell-name[b-wsb62sqqha] {
    font-weight: 600;
    color: #1e293b;
}

.adm-cell-desc[b-wsb62sqqha] {
    color: #64748b;
    font-size: 0.82rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-width: 300px;
}

.adm-cell-muted[b-wsb62sqqha] {
    color: #94a3b8;
    font-style: italic;
    font-size: 0.82rem;
}

.adm-tag-chips[b-wsb62sqqha] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.adm-actions-cell[b-wsb62sqqha] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.125rem;
}

/* Empty State */
.adm-empty-state[b-wsb62sqqha] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 2.5rem 1rem;
}

/* Error State */
.adm-error-state[b-wsb62sqqha] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1rem;
    background: #ffffff;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-wsb62sqqha] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-wsb62sqqha] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-wsb62sqqha] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-wsb62sqqha] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-wsb62sqqha] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-wsb62sqqha] {
        margin-left: 0;
        width: 100%;
        justify-content: flex-start;
    }

    [b-wsb62sqqha] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    [b-wsb62sqqha] .adm-add-btn {
        min-height: 44px !important;
    }

    .adm-detail-grid[b-wsb62sqqha] {
        grid-template-columns: 1fr;
    }

    .adm-kpi-strip[b-wsb62sqqha] {
        grid-template-columns: repeat(2, 1fr);
    }

    [b-wsb62sqqha] .adm-search {
        max-width: 100%;
    }

    .adm-table-wrap[b-wsb62sqqha] {
        overflow-x: auto;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-wsb62sqqha] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-wsb62sqqha] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-wsb62sqqha] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-wsb62sqqha] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-wsb62sqqha] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi__value[b-wsb62sqqha] {
        font-size: 1.25rem;
    }

    .adm-detail-grid[b-wsb62sqqha] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-filter-row[b-wsb62sqqha] {
        padding: 0.5rem 0.875rem;
    }

    .adm-table-wrap[b-wsb62sqqha] {
        padding: 0 0.875rem 1rem;
        overflow-x: auto;
    }
}
/* /Components/Pages/Admin/Communications/CommunicationsControlCenter.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Communications Control Center — "Nordic Control Panel"
   Matches AnalyticsDashboard + DiscountTypes standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-qi8pvoid8n] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-qi8pvoid8n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-qi8pvoid8n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-qi8pvoid8n] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-qi8pvoid8n] .adm-breadcrumbs {
    padding: 0;
}

[b-qi8pvoid8n] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-qi8pvoid8n] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-qi8pvoid8n] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-qi8pvoid8n] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* WCAG fix: disabled breadcrumb contrast */
[b-qi8pvoid8n] .adm-breadcrumbs .mud-breadcrumbs-li:last-child {
    color: #94a3b8 !important;
}

/* Status Pill */
.adm-status-pill[b-qi8pvoid8n] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-qi8pvoid8n] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-qi8pvoid8n] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-qi8pvoid8n] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-qi8pvoid8n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-qi8pvoid8n] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-qi8pvoid8n] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-qi8pvoid8n] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-qi8pvoid8n] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-qi8pvoid8n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Buttons */
[b-qi8pvoid8n] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
}

[b-qi8pvoid8n] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-qi8pvoid8n] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-qi8pvoid8n] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-qi8pvoid8n] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-qi8pvoid8n] {
    border-right: none;
}

.adm-kpi:hover[b-qi8pvoid8n] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-qi8pvoid8n] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-qi8pvoid8n] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-qi8pvoid8n] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-qi8pvoid8n] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-qi8pvoid8n] .adm-tabs {
    background: transparent;
}

[b-qi8pvoid8n] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-qi8pvoid8n] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-qi8pvoid8n] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-qi8pvoid8n] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-qi8pvoid8n] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-qi8pvoid8n] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-qi8pvoid8n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-qi8pvoid8n] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-qi8pvoid8n] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-qi8pvoid8n] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-qi8pvoid8n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
    flex-wrap: wrap;
}

/* ═══════════════════════════════════════════════════════
   TABLE SECTION
   ═══════════════════════════════════════════════════════ */
.adm-table-container[b-qi8pvoid8n] {
    padding: 0 1.5rem 1.5rem;
    overflow-x: auto;
}

[b-qi8pvoid8n] .adm-table {
    border-radius: 10px !important;
    border: 1px solid #e8ecf1 !important;
    overflow: hidden;
    box-shadow: none !important;
}

[b-qi8pvoid8n] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-qi8pvoid8n] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-qi8pvoid8n] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-qi8pvoid8n] .adm-table .mud-table-body tr {
    cursor: pointer;
    transition: background 0.12s ease;
}

[b-qi8pvoid8n] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-qi8pvoid8n] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-qi8pvoid8n] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

/* Row highlight states */
[b-qi8pvoid8n] .adm-table .mud-table-body tr.adm-row--active {
    background: rgba(53, 160, 174, 0.06) !important;
    border-left: 3px solid #35a0ae;
}

[b-qi8pvoid8n] .adm-table .mud-table-body tr.adm-row--recent {
    background: rgba(53, 160, 174, 0.04) !important;
}

/* ═══════════════════════════════════════════════════════
   CONTENT GRID — Editor + Preview split
   ═══════════════════════════════════════════════════════ */
[b-qi8pvoid8n] .adm-content-grid {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   EDITOR SURFACE
   ═══════════════════════════════════════════════════════ */
.adm-editor-surface[b-qi8pvoid8n] {
    padding: 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-editor-header[b-qi8pvoid8n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

.adm-editor-title[b-qi8pvoid8n] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0 0 1rem;
    font-family: 'Montserrat', sans-serif;
}

.adm-editor-actions[b-qi8pvoid8n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid #f1f5f9;
}

/* Monospace field for template bodies */
[b-qi8pvoid8n] .adm-monospace-field textarea {
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace !important;
    font-size: 0.82rem !important;
    line-height: 1.5 !important;
    tab-size: 2 !important;
}

/* ═══════════════════════════════════════════════════════
   PREVIEW SURFACE
   ═══════════════════════════════════════════════════════ */
.adm-preview-surface[b-qi8pvoid8n] {
    padding: 1.5rem;
    background: #ffffff;
    border-left: 1px solid #e8ecf1;
    min-height: 300px;
}

.adm-preview-header[b-qi8pvoid8n] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.adm-preview-title[b-qi8pvoid8n] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-preview-label[b-qi8pvoid8n] {
    display: block;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 600;
    margin: 0.75rem 0 0.375rem;
}

.adm-preview-subject[b-qi8pvoid8n] {
    font-size: 0.95rem;
    font-weight: 500;
    color: #1e293b;
    margin: 0.25rem 0 0.75rem;
}

.adm-preview-pane[b-qi8pvoid8n] {
    background: #f8fafc;
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    padding: 1rem;
    min-height: 80px;
    overflow: auto;
    max-height: 400px;
    font-size: 0.85rem;
    color: #334155;
    line-height: 1.6;
}

.adm-preview-pane--compact[b-qi8pvoid8n] {
    min-height: 40px;
    margin-bottom: 0.5rem;
}

.adm-code-pane[b-qi8pvoid8n] {
    background: #1e293b;
    border-radius: 8px;
    padding: 1rem;
    overflow: auto;
    max-height: 300px;
    margin-bottom: 0.5rem;
}

.adm-code-pane pre[b-qi8pvoid8n] {
    margin: 0;
    color: #e2e8f0;
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    font-size: 0.78rem;
    line-height: 1.5;
    white-space: pre-wrap;
    word-break: break-word;
}

/* Inner tabs (within editor/preview) */
[b-qi8pvoid8n] .adm-inner-tabs .mud-tabs-toolbar {
    background: transparent;
    min-height: auto;
    padding: 0;
    border-bottom: 1px solid #f1f5f9;
}

[b-qi8pvoid8n] .adm-inner-tabs .mud-tab {
    font-size: 0.8rem;
    padding: 0.625rem 1rem;
    text-transform: none;
    color: #64748b;
    min-width: auto;
}

[b-qi8pvoid8n] .adm-inner-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-qi8pvoid8n] .adm-inner-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

/* ═══════════════════════════════════════════════════════
   SEND NOW — Mode selector cards
   ═══════════════════════════════════════════════════════ */
.adm-send-grid[b-qi8pvoid8n] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
}

.adm-send-card[b-qi8pvoid8n] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #ffffff;
    cursor: pointer;
    transition: all 0.15s ease;
    text-align: left;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
}

.adm-send-card:hover[b-qi8pvoid8n] {
    border-color: rgba(53, 160, 174, 0.4);
    background: rgba(53, 160, 174, 0.02);
}

.adm-send-card--active[b-qi8pvoid8n] {
    border-color: #35a0ae;
    background: rgba(53, 160, 174, 0.04);
    box-shadow: 0 0 0 1px rgba(53, 160, 174, 0.2);
}

[b-qi8pvoid8n] .adm-send-card__icon {
    font-size: 1.75rem !important;
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-send-card__title[b-qi8pvoid8n] {
    display: block;
    font-size: 0.9rem;
    font-weight: 600;
    color: #1e293b;
}

.adm-send-card__desc[b-qi8pvoid8n] {
    display: block;
    font-size: 0.78rem;
    color: #64748b;
    margin-top: 0.15rem;
}

/* ═══════════════════════════════════════════════════════
   TOKEN ROW
   ═══════════════════════════════════════════════════════ */
.adm-token-row[b-qi8pvoid8n] {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 0.75rem;
    align-items: center;
    margin-bottom: 0.5rem;
}

.adm-token-wrap[b-qi8pvoid8n] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    padding: 0.5rem 0;
}

/* ═══════════════════════════════════════════════════════
   TYPE / DATA STYLES
   ═══════════════════════════════════════════════════════ */
.adm-type-name[b-qi8pvoid8n] {
    font-weight: 500;
    color: #1e293b;
}

.adm-type-desc[b-qi8pvoid8n] {
    color: #57667a;
    font-size: 0.8rem;
}

.adm-icon-cell[b-qi8pvoid8n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Chip styling */
[b-qi8pvoid8n] .adm-chip {
    font-size: 0.7rem !important;
    height: 22px !important;
    font-weight: 600 !important;
}

/* WCAG AA contrast fix: white on default green (#4CAF50) = 2.78:1 -> #2e7d32 = ~5.5:1 */
[b-qi8pvoid8n] .mud-chip-filled.mud-chip-color-success {
    background-color: #2e7d32 !important;
    color: #ffffff !important;
}

/* Empty state */
.adm-empty-state[b-qi8pvoid8n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #64748b;
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-qi8pvoid8n] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-qi8pvoid8n] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-qi8pvoid8n] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-actionbar[b-qi8pvoid8n] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .adm-actionbar__right[b-qi8pvoid8n] {
        margin-left: 0;
        flex-wrap: wrap;
    }

    .adm-page-header[b-qi8pvoid8n] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-qi8pvoid8n] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-kpi-strip[b-qi8pvoid8n] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-send-grid[b-qi8pvoid8n] {
        grid-template-columns: 1fr;
    }

    .adm-token-row[b-qi8pvoid8n] {
        grid-template-columns: 1fr 1fr auto;
    }

    .adm-preview-surface[b-qi8pvoid8n] {
        border-left: none;
        border-top: 1px solid #e8ecf1;
    }

    /* WCAG: table action icons need 44px touch targets */
    [b-qi8pvoid8n] .adm-table .mud-table-body .mud-icon-button {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-qi8pvoid8n] {
        padding: 0.5rem 0.875rem;
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-actionbar__right[b-qi8pvoid8n] {
        margin-left: 0;
        flex-wrap: wrap;
        gap: 0.375rem;
    }

    .adm-page-header[b-qi8pvoid8n] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-qi8pvoid8n] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-qi8pvoid8n] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-qi8pvoid8n] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-table-container[b-qi8pvoid8n] {
        padding: 0 0.875rem 1rem;
    }

    .adm-tab-toolbar[b-qi8pvoid8n] {
        flex-direction: column;
        align-items: flex-start;
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-tab-toolbar__right[b-qi8pvoid8n] {
        width: 100%;
        margin-left: 0;
    }

    [b-qi8pvoid8n] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    .adm-editor-surface[b-qi8pvoid8n],
    .adm-preview-surface[b-qi8pvoid8n] {
        padding: 1rem 0.875rem;
    }

    .adm-send-grid[b-qi8pvoid8n] {
        padding: 0.875rem;
        gap: 0.75rem;
    }

    .adm-token-row[b-qi8pvoid8n] {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }

    /* WCAG touch target fix: min 44px on mobile */
    [b-qi8pvoid8n] .adm-add-btn {
        min-height: 44px !important;
        padding: 8px 16px !important;
    }

    [b-qi8pvoid8n] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    /* WCAG: table action icons need 44px touch targets on mobile */
    [b-qi8pvoid8n] .adm-table .mud-table-body .mud-icon-button {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/CourierProviders/CourierProviders.razor.rz.scp.css */
/* =====================================================
   ADMIN SHELL — ported from ServiceDiagnostics.razor.css
   (Blazor scoped CSS requires per-component copies; every
   selector gets rewritten with this file's [b-xxxxx]
   attribute and therefore only matches elements that are
   rendered inside CourierProviders.razor.)
   ===================================================== */

/* ─── Shell ─── */
.adm-shell[b-xbl4aw1fla] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-xbl4aw1fla] .adm-breadcrumbs {
    padding: 0;
}

[b-xbl4aw1fla] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-xbl4aw1fla] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-xbl4aw1fla] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-xbl4aw1fla] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-xbl4aw1fla] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-xbl4aw1fla] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-xbl4aw1fla] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.adm-status-pill__dot--warn[b-xbl4aw1fla] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__dot--off[b-xbl4aw1fla] {
    background: #94a3b8;
}

.adm-status-pill__time[b-xbl4aw1fla] {
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-xbl4aw1fla] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-xbl4aw1fla] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-xbl4aw1fla] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-xbl4aw1fla] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-xbl4aw1fla] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-xbl4aw1fla] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-xbl4aw1fla] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-xbl4aw1fla] {
    border-right: none;
}

.adm-kpi:hover[b-xbl4aw1fla] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-xbl4aw1fla] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-xbl4aw1fla] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-xbl4aw1fla] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-xbl4aw1fla] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-xbl4aw1fla] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-xbl4aw1fla] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-xbl4aw1fla] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-xbl4aw1fla] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-xbl4aw1fla] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-xbl4aw1fla] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-xbl4aw1fla] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-xbl4aw1fla] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-xbl4aw1fla] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-xbl4aw1fla] .adm-tabs {
    background: transparent;
}

[b-xbl4aw1fla] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-xbl4aw1fla] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-xbl4aw1fla] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-xbl4aw1fla] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-xbl4aw1fla] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-xbl4aw1fla] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-xbl4aw1fla] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-xbl4aw1fla] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-xbl4aw1fla] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Back / Outlined buttons */
[b-xbl4aw1fla] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
}

[b-xbl4aw1fla] .adm-back-btn:hover {
    border-color: rgba(53, 160, 174, 0.3) !important;
    color: #35a0ae !important;
}

/* ═══════════════════════════════════════════════════════
   RUN BAR — Progress and action strip
   ═══════════════════════════════════════════════════════ */
.adm-run-bar[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.875rem 1.5rem;
    background: #ffffff;
    border-top: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-run-bar__progress[b-xbl4aw1fla] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    flex: 1;
    min-width: 200px;
}

.adm-run-bar__text[b-xbl4aw1fla] {
    font-size: 0.78rem;
    color: #475569;
    font-weight: 500;
}

[b-xbl4aw1fla] .adm-run-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    background: #35a0ae !important;
    color: #ffffff !important;
    min-height: 36px;
    padding: 0 1.25rem !important;
}

[b-xbl4aw1fla] .adm-run-btn:hover {
    background: #2d8a96 !important;
}

[b-xbl4aw1fla] .adm-run-btn:disabled {
    background: #e2e8f0 !important;
    color: #94a3b8 !important;
}

/* ═══════════════════════════════════════════════════════
   RESULT CARDS — Diagnostic results grid
   ═══════════════════════════════════════════════════════ */
.adm-result-grid[b-xbl4aw1fla] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-result-card[b-xbl4aw1fla] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-result-card:hover[b-xbl4aw1fla] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-result-card__bar[b-xbl4aw1fla] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-result-card__header[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.adm-result-card__title-row[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.adm-result-card__name[b-xbl4aw1fla] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.adm-result-card__status[b-xbl4aw1fla] {
    display: inline-block;
    padding: 0.175rem 0.5rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.adm-result-card__status--completed[b-xbl4aw1fla] {
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
}

.adm-result-card__status--partiallycompleted[b-xbl4aw1fla] {
    background: rgba(245, 158, 11, 0.08);
    color: #b45309;
}

.adm-result-card__status--failed[b-xbl4aw1fla] {
    background: rgba(239, 68, 68, 0.08);
    color: #dc2626;
}

.adm-result-card__status--running[b-xbl4aw1fla] {
    background: rgba(53, 160, 174, 0.08);
    color: #0e7490;
}

/* Action buttons */
.adm-result-card__actions[b-xbl4aw1fla] {
    display: flex;
    gap: 0;
    border-top: 1px solid #f1f5f9;
    margin: 0.25rem -1.125rem -1rem;
}

.adm-result-card__action[b-xbl4aw1fla] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding: 0.5rem;
    border: none;
    background: transparent;
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    min-height: 36px;
}

.adm-result-card__action:hover[b-xbl4aw1fla] {
    background: rgba(53, 160, 174, 0.04);
    color: #35a0ae;
}

.adm-result-card__action + .adm-result-card__action[b-xbl4aw1fla] {
    border-left: 1px solid #f1f5f9;
}

/* Table styling */
[b-xbl4aw1fla] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-xbl4aw1fla] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-xbl4aw1fla] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-xbl4aw1fla] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-xbl4aw1fla] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

/* Monospace text */
.adm-mono[b-xbl4aw1fla] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.82rem;
    color: #334155;
}

/* Status chip */
.adm-status-chip[b-xbl4aw1fla] {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.adm-status-chip--success[b-xbl4aw1fla] {
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
}

.adm-status-chip--warning[b-xbl4aw1fla] {
    background: rgba(245, 158, 11, 0.08);
    color: #b45309;
}

.adm-status-chip--failed[b-xbl4aw1fla] {
    background: rgba(239, 68, 68, 0.08);
    color: #dc2626;
}

/* Loading / Error states */
.adm-loading-state[b-xbl4aw1fla],
.adm-error-state[b-xbl4aw1fla] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 4rem 2rem;
    text-align: center;
}

/* Empty state */
.adm-empty-state[b-xbl4aw1fla] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem 2rem;
    text-align: center;
    color: #64748b;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — admin shell
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-result-grid[b-xbl4aw1fla] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-xbl4aw1fla] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-result-grid[b-xbl4aw1fla] {
        grid-template-columns: 1fr;
    }

    .adm-kpi-strip[b-xbl4aw1fla] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-xbl4aw1fla] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-xbl4aw1fla] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-page-header[b-xbl4aw1fla] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-xbl4aw1fla] {
        margin-left: 0;
        width: 100%;
    }

    .adm-tab-toolbar[b-xbl4aw1fla] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-xbl4aw1fla] {
        width: 100%;
        margin-left: 0;
    }

    /* Touch targets ≥ 44px */
    .adm-result-card__action[b-xbl4aw1fla] {
        min-height: 44px;
    }

    [b-xbl4aw1fla] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-xbl4aw1fla] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-xbl4aw1fla] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-xbl4aw1fla] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi__value[b-xbl4aw1fla] {
        font-size: 1.25rem;
    }

    .adm-detail-grid[b-xbl4aw1fla] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-result-grid[b-xbl4aw1fla] {
        padding: 0.75rem 0.875rem;
    }

    .adm-section-header[b-xbl4aw1fla],
    .adm-tab-toolbar[b-xbl4aw1fla],
    .adm-run-bar[b-xbl4aw1fla] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-xbl4aw1fla] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }
}

/* ═══════════════ COURIER-PROVIDERS SPECIFIC OVERRIDES ═══════════════ */
.courier-providers-kpi-strip[b-xbl4aw1fla] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    padding: 16px 24px;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

@media (max-width: 1024px) {
    .courier-providers-kpi-strip[b-xbl4aw1fla] { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 600px) {
    .courier-providers-kpi-strip[b-xbl4aw1fla] { grid-template-columns: 1fr; }
}

.courier-provider-grid[b-xbl4aw1fla] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 16px;
    padding: 20px 24px;
}

.courier-provider-card[b-xbl4aw1fla] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 20px;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.courier-provider-card:hover[b-xbl4aw1fla] {
    border-color: #35a0ae;
    box-shadow: 0 2px 8px rgba(53, 160, 174, 0.08);
}

.courier-provider-card--disabled[b-xbl4aw1fla] {
    background: #fafbfc;
    opacity: 0.85;
}

.courier-provider-card__header[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.courier-provider-card__logo[b-xbl4aw1fla] {
    width: 44px;
    height: 44px;
    border-radius: 8px;
    background: #f1f5f9;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #35a0ae;
    flex-shrink: 0;
}

.courier-provider-card__title[b-xbl4aw1fla] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0;
}

.courier-provider-card__key[b-xbl4aw1fla] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.72rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.courier-provider-card__description[b-xbl4aw1fla] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.45;
    margin: 0;
}

.courier-provider-card__toggles[b-xbl4aw1fla] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
    background: #f8f9fb;
    border-radius: 8px;
}

.courier-provider-card__toggle-row[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.82rem;
}

.courier-provider-card__toggle-label[b-xbl4aw1fla] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #334155;
    font-weight: 500;
}

.courier-provider-card__chips[b-xbl4aw1fla] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.courier-provider-card__chip[b-xbl4aw1fla] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    font-size: 0.7rem;
    font-weight: 500;
    color: #475569;
    background: #f1f5f9;
    border-radius: 999px;
}

.courier-provider-card__chip--success[b-xbl4aw1fla] { color: #166534; background: #dcfce7; }
.courier-provider-card__chip--warn[b-xbl4aw1fla]    { color: #92400e; background: #fef3c7; }
.courier-provider-card__chip--error[b-xbl4aw1fla]   { color: #991b1b; background: #fee2e2; }

.courier-provider-card__actions[b-xbl4aw1fla] {
    display: flex;
    gap: 8px;
    margin-top: auto;
}

.courier-provider-card__last-test[b-xbl4aw1fla] {
    font-size: 0.72rem;
    color: #94a3b8;
}

.courier-quote-preview-form[b-xbl4aw1fla] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    padding: 20px 24px;
}

@media (max-width: 768px) {
    .courier-quote-preview-form[b-xbl4aw1fla] { grid-template-columns: 1fr; }
}

.courier-quote-preview-results[b-xbl4aw1fla] {
    padding: 12px 24px 24px;
}

.courier-history-table[b-xbl4aw1fla] {
    padding: 12px 24px 24px;
}
/* /Components/Pages/Admin/Database/DatabaseMigrations.razor.rz.scp.css */
/* ═══════════════════════════════════════���═══════════════
   Database Migrations — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard / ServiceDiagnostics standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-wgtv1e586r] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-wgtv1e586r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-wgtv1e586r] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-wgtv1e586r] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-wgtv1e586r] .adm-breadcrumbs {
    padding: 0;
}

[b-wgtv1e586r] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-wgtv1e586r] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-wgtv1e586r] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-wgtv1e586r] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-wgtv1e586r] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-wgtv1e586r] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-wgtv1e586r] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.adm-status-pill__dot--warn[b-wgtv1e586r] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__dot--off[b-wgtv1e586r] {
    background: #94a3b8;
}

.adm-status-pill__time[b-wgtv1e586r] {
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-wgtv1e586r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-wgtv1e586r] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-wgtv1e586r] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-wgtv1e586r] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-wgtv1e586r] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-wgtv1e586r] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-wgtv1e586r] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-wgtv1e586r] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Back / Outlined buttons */
[b-wgtv1e586r] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
}

[b-wgtv1e586r] .adm-back-btn:hover {
    border-color: rgba(53, 160, 174, 0.3) !important;
    color: #35a0ae !important;
}

/* Apply button */
[b-wgtv1e586r] .adm-apply-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-wgtv1e586r] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-wgtv1e586r] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-wgtv1e586r] {
    border-right: none;
}

.adm-kpi:hover[b-wgtv1e586r] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi--warn[b-wgtv1e586r] {
    background: rgba(245, 158, 11, 0.03);
}

.adm-kpi--warn:hover[b-wgtv1e586r] {
    background: rgba(245, 158, 11, 0.06);
}

.adm-kpi__top[b-wgtv1e586r] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-wgtv1e586r] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-wgtv1e586r] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-wgtv1e586r] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-wgtv1e586r] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-wgtv1e586r] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-wgtv1e586r] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-wgtv1e586r] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-wgtv1e586r] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-wgtv1e586r] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-wgtv1e586r] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-wgtv1e586r] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-wgtv1e586r] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__number--text[b-wgtv1e586r] {
    font-size: 0.95rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.adm-detail-card__label[b-wgtv1e586r] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-wgtv1e586r] .adm-tabs {
    background: transparent;
}

[b-wgtv1e586r] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-wgtv1e586r] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-wgtv1e586r] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-wgtv1e586r] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-wgtv1e586r] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-wgtv1e586r] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-wgtv1e586r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-wgtv1e586r] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-wgtv1e586r] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-wgtv1e586r] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-wgtv1e586r] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* ═══════════════════════════════════════════════════════
   SEARCH FIELD
   ═══════════════════════════════════════════════════════ */
[b-wgtv1e586r] .adm-search-field {
    max-width: 240px;
    min-width: 180px;
}

[b-wgtv1e586r] .adm-search-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-wgtv1e586r] .adm-search-field .mud-input {
    color: #334155 !important;
    font-size: 0.85rem;
}

[b-wgtv1e586r] .adm-search-field .mud-input-label {
    color: #64748b !important;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
.adm-table-wrap[b-wgtv1e586r] {
    padding: 0 1.5rem 1rem;
}

[b-wgtv1e586r] .adm-migration-table {
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #e8ecf1;
}

[b-wgtv1e586r] .adm-migration-table .mud-table-head th {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    background: #f8f9fb;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.75rem 1rem;
}

[b-wgtv1e586r] .adm-migration-table .mud-table-body td {
    font-size: 0.85rem;
    color: #334155;
    padding: 0.625rem 1rem;
    border-bottom: 1px solid #f1f5f9;
}

[b-wgtv1e586r] .adm-migration-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-wgtv1e586r] .adm-migration-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
    font-size: 0.8rem;
}

.adm-migration-id[b-wgtv1e586r] {
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
    font-size: 0.78rem;
    color: #475569;
    background: #f1f5f9;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
}

/* ═══════════════════════════════════════════════════════
   STATUS BADGES
   ═══════════════════════════════════════════════════════ */
.adm-status-badge[b-wgtv1e586r] {
    display: inline-block;
    padding: 0.15rem 0.625rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.adm-status-badge--applied[b-wgtv1e586r] {
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
}

.adm-status-badge--pending[b-wgtv1e586r] {
    background: rgba(245, 158, 11, 0.08);
    color: #b45309;
}

.adm-muted[b-wgtv1e586r] {
    color: #94a3b8;
}

/* ═══════════════════════════════════════════════════════
   LOADING STATE
   ═══════════════════════════════════════════════════════ */
.adm-loading[b-wgtv1e586r] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 4rem 2rem;
}

.adm-loading__text[b-wgtv1e586r] {
    font-size: 0.85rem;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   ERROR STATE
   ═══════════════════════════════════════════════════════ */
.adm-error-state[b-wgtv1e586r] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 4rem 2rem;
}

.adm-error-state__text[b-wgtv1e586r] {
    font-size: 0.85rem;
    color: #64748b;
    font-weight: 500;
    text-align: center;
    max-width: 400px;
}

/* ═══════════════════════════════════════════════════════
   EMPTY STATE
   ═══════════════════════════════════════════════════════ */
.adm-empty-state[b-wgtv1e586r] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 3rem 2rem;
}

.adm-empty-state__title[b-wgtv1e586r] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
}

.adm-empty-state__text[b-wgtv1e586r] {
    font-size: 0.82rem;
    color: #64748b;
    text-align: center;
    max-width: 350px;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — Tablet (max-width: 960px)
   ═══════════════════════════════════════════════════════ */
@media (max-width: 960px) {
    .adm-kpi-strip[b-wgtv1e586r] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-wgtv1e586r] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-page-header[b-wgtv1e586r] {
        padding: 1rem 1.25rem;
    }

    .adm-page-header__tools[b-wgtv1e586r] {
        width: 100%;
        justify-content: flex-end;
    }

    [b-wgtv1e586r] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }

    [b-wgtv1e586r] .adm-back-btn {
        min-height: 44px;
    }

    [b-wgtv1e586r] .adm-apply-btn {
        min-height: 44px;
    }

    .adm-tab-toolbar[b-wgtv1e586r] {
        padding: 1rem 1.25rem;
    }

    .adm-tab-toolbar__right[b-wgtv1e586r] {
        width: 100%;
    }

    [b-wgtv1e586r] .adm-search-field {
        max-width: 100%;
        min-width: 0;
        flex: 1;
    }

    .adm-table-wrap[b-wgtv1e586r] {
        padding: 0 1.25rem 1rem;
        overflow-x: auto;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — Mobile (max-width: 600px)
   ═══════════════════════════════════════════════════════ */
@media (max-width: 600px) {
    .adm-actionbar[b-wgtv1e586r] {
        padding: 0.5rem 1rem;
    }

    .adm-page-header[b-wgtv1e586r] {
        padding: 1rem;
        gap: 1rem;
    }

    .adm-page-header__title[b-wgtv1e586r] {
        gap: 0.75rem;
    }

    .adm-page-header__h1[b-wgtv1e586r] {
        font-size: 1.125rem;
    }

    .adm-page-header__sub[b-wgtv1e586r] {
        font-size: 0.75rem;
    }

    .adm-page-header__tools[b-wgtv1e586r] {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .adm-kpi-strip[b-wgtv1e586r] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi__value[b-wgtv1e586r] {
        font-size: 1.25rem;
    }

    .adm-section-header[b-wgtv1e586r] {
        padding: 0.75rem 1rem 0.5rem;
    }

    .adm-detail-grid[b-wgtv1e586r] {
        grid-template-columns: 1fr;
        padding: 0 1rem 0.75rem;
    }

    .adm-tab-toolbar[b-wgtv1e586r] {
        padding: 0.75rem 1rem;
    }

    .adm-table-wrap[b-wgtv1e586r] {
        padding: 0 1rem 0.75rem;
    }

    [b-wgtv1e586r] .adm-tabs .mud-tabs-toolbar {
        padding: 0 1rem;
    }

    [b-wgtv1e586r] .adm-tabs .mud-tab {
        padding: 0.75rem 1rem;
        font-size: 0.8rem;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 2K+ (min-width: 2000px)
   ═══════════════════════════════════════════════════════ */
@media (min-width: 2000px) {
    .adm-page-header__h1[b-wgtv1e586r] {
        font-size: 1.5rem;
    }

    .adm-kpi__value[b-wgtv1e586r] {
        font-size: 1.75rem;
    }

    .adm-detail-card__number[b-wgtv1e586r] {
        font-size: 1.5rem;
    }
}
/* /Components/Pages/Admin/Diagnostics/ExternalServiceDiagnostics.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   External Service Diagnostics — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard / ServiceDiagnostics standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-lkivokc1gt] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-lkivokc1gt] .adm-breadcrumbs {
    padding: 0;
}

[b-lkivokc1gt] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-lkivokc1gt] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-lkivokc1gt] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-lkivokc1gt] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-lkivokc1gt] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-lkivokc1gt] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-lkivokc1gt] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.adm-status-pill__dot--warn[b-lkivokc1gt] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__dot--off[b-lkivokc1gt] {
    background: #94a3b8;
}

.adm-status-pill__time[b-lkivokc1gt] {
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-lkivokc1gt] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-lkivokc1gt] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-lkivokc1gt] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-lkivokc1gt] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-lkivokc1gt] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-lkivokc1gt] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-lkivokc1gt] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-lkivokc1gt] {
    border-right: none;
}

.adm-kpi:hover[b-lkivokc1gt] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-lkivokc1gt] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-lkivokc1gt] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-lkivokc1gt] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-lkivokc1gt] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-lkivokc1gt] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-lkivokc1gt] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-lkivokc1gt] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-lkivokc1gt] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-lkivokc1gt] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-lkivokc1gt] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-lkivokc1gt] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-lkivokc1gt] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-lkivokc1gt] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   SERVICE CARDS — Selection grid
   ═══════════════════════════════════════════════════════ */
.adm-service-grid[b-lkivokc1gt] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-service-card[b-lkivokc1gt] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    border-radius: 10px;
    padding: 1rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    cursor: pointer;
    transition: all 0.15s ease;
    min-height: 100px;
}

.adm-service-card:hover[b-lkivokc1gt] {
    border-color: rgba(53, 160, 174, 0.3);
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-service-card--selected[b-lkivokc1gt] {
    border-color: #35a0ae;
    background: rgba(53, 160, 174, 0.03);
}

.adm-service-card--disabled[b-lkivokc1gt] {
    opacity: 0.5;
    pointer-events: none;
}

.adm-service-card__header[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.adm-service-card__check[b-lkivokc1gt] {
    flex-shrink: 0;
}

.adm-service-card__name[b-lkivokc1gt] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.3;
}

.adm-service-card__desc[b-lkivokc1gt] {
    font-size: 0.72rem;
    color: #64748b;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.adm-service-card__badge[b-lkivokc1gt] {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    width: fit-content;
}

.adm-service-card__badge--unavailable[b-lkivokc1gt] {
    background: rgba(239, 68, 68, 0.08);
    color: #dc2626;
}

/* ═══════════════════════════════════════════════════════
   RUN BAR — Progress and action strip
   ═══════════════════════════════════════════════════════ */
.adm-run-bar[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.875rem 1.5rem;
    background: #ffffff;
    border-top: 1px solid #e8ecf1;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-run-bar__left[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.adm-run-bar__progress[b-lkivokc1gt] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    flex: 1;
    min-width: 200px;
}

.adm-run-bar__text[b-lkivokc1gt] {
    font-size: 0.78rem;
    color: #475569;
    font-weight: 500;
}

.adm-run-bar__actions[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

[b-lkivokc1gt] .adm-run-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    background: #35a0ae !important;
    color: #ffffff !important;
    min-height: 36px;
    padding: 0 1.25rem !important;
}

[b-lkivokc1gt] .adm-run-btn:hover {
    background: #2d8a96 !important;
}

[b-lkivokc1gt] .adm-run-btn:disabled {
    background: #e2e8f0 !important;
    color: #94a3b8 !important;
}

[b-lkivokc1gt] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
}

[b-lkivokc1gt] .adm-back-btn:hover {
    border-color: rgba(53, 160, 174, 0.3) !important;
    color: #35a0ae !important;
}

/* Live API warning */
.adm-live-warning[b-lkivokc1gt] {
    margin: 0 1.5rem;
    padding: 0.75rem 1rem;
    background: rgba(245, 158, 11, 0.06);
    border: 1px solid rgba(245, 158, 11, 0.2);
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.adm-live-warning__text[b-lkivokc1gt] {
    font-size: 0.78rem;
    color: #92400e;
    line-height: 1.5;
}

/* ═══════════════════════════════════════════════════════
   RUNNING PROGRESS BAR
   ═══════════════════════════════════════════════════════ */
.adm-progress-bar[b-lkivokc1gt] {
    margin: 0 1.5rem;
    padding: 1rem 1.25rem;
    background: rgba(53, 160, 174, 0.04);
    border: 1px solid rgba(53, 160, 174, 0.12);
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.adm-progress-bar__header[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.adm-progress-bar__service[b-lkivokc1gt] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #0e7490;
}

.adm-progress-bar__step[b-lkivokc1gt] {
    font-size: 0.75rem;
    color: #475569;
}

/* ═══════════════════════════════════════════════════════
   RESULT CARDS — Diagnostic results grid
   ═══════════════════════════════════════════════════════ */
.adm-result-grid[b-lkivokc1gt] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-result-card[b-lkivokc1gt] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-result-card:hover[b-lkivokc1gt] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-result-card__bar[b-lkivokc1gt] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-result-card__header[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.adm-result-card__title-row[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.adm-result-card__name[b-lkivokc1gt] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.adm-result-card__status[b-lkivokc1gt] {
    display: inline-block;
    padding: 0.175rem 0.5rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.adm-result-card__status--completed[b-lkivokc1gt] {
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
}

.adm-result-card__status--partiallycompleted[b-lkivokc1gt] {
    background: rgba(245, 158, 11, 0.08);
    color: #b45309;
}

.adm-result-card__status--failed[b-lkivokc1gt] {
    background: rgba(239, 68, 68, 0.08);
    color: #dc2626;
}

.adm-result-card__status--running[b-lkivokc1gt] {
    background: rgba(53, 160, 174, 0.08);
    color: #0e7490;
}

/* Success rate bar */
.adm-result-card__rate[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-result-card__rate-bar[b-lkivokc1gt] {
    flex: 1;
    height: 6px;
    background: #f1f5f9;
    border-radius: 3px;
    overflow: hidden;
}

.adm-result-card__rate-fill[b-lkivokc1gt] {
    height: 100%;
    border-radius: 3px;
    transition: width 0.4s ease;
}

.adm-result-card__rate-fill--good[b-lkivokc1gt] {
    background: #16a34a;
}

.adm-result-card__rate-fill--warn[b-lkivokc1gt] {
    background: #f59e0b;
}

.adm-result-card__rate-fill--bad[b-lkivokc1gt] {
    background: #ef4444;
}

.adm-result-card__rate-text[b-lkivokc1gt] {
    font-size: 0.72rem;
    font-weight: 700;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
    min-width: 32px;
    text-align: right;
}

/* Stats row */
.adm-result-card__stats[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.adm-result-card__stat[b-lkivokc1gt] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.72rem;
    color: #64748b;
}

/* Step list */
.adm-result-card__steps[b-lkivokc1gt] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding-top: 0.25rem;
    border-top: 1px solid #f1f5f9;
}

.adm-result-card__step-item[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.72rem;
}

.adm-result-card__step-name[b-lkivokc1gt] {
    color: #334155;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.adm-result-card__step-time[b-lkivokc1gt] {
    color: #64748b;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.adm-result-card__step-error[b-lkivokc1gt] {
    font-size: 0.7rem;
    color: #dc2626;
    padding-left: 1.25rem;
    line-height: 1.3;
}

.adm-result-card__step-more[b-lkivokc1gt] {
    font-size: 0.7rem;
    color: #94a3b8;
    padding-left: 1.25rem;
}

/* Action buttons */
.adm-result-card__actions[b-lkivokc1gt] {
    display: flex;
    gap: 0;
    border-top: 1px solid #f1f5f9;
    margin: 0.25rem -1.125rem -1rem;
}

.adm-result-card__action[b-lkivokc1gt] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding: 0.5rem;
    border: none;
    background: transparent;
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    min-height: 36px;
}

.adm-result-card__action:hover[b-lkivokc1gt] {
    background: rgba(53, 160, 174, 0.04);
    color: #35a0ae;
}

.adm-result-card__action + .adm-result-card__action[b-lkivokc1gt] {
    border-left: 1px solid #f1f5f9;
}

/* ═══════════════════════════════════════════════════════
   BREAKDOWN PANEL — Detailed analysis
   ═══════════════════════════════════════════════════════ */
.adm-breakdown[b-lkivokc1gt] {
    margin: 1rem 1.5rem;
    border-radius: 10px;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
}

.adm-breakdown__header[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e8ecf1;
}

.adm-breakdown__title-row[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.adm-breakdown__title[b-lkivokc1gt] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-breakdown__content[b-lkivokc1gt] {
    padding: 1.25rem;
}

.adm-breakdown__summary-grid[b-lkivokc1gt] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.adm-breakdown__summary-card[b-lkivokc1gt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    padding: 1rem;
    background: #f8f9fb;
    border-radius: 8px;
    border: 1px solid #e8ecf1;
}

.adm-breakdown__summary-value[b-lkivokc1gt] {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-breakdown__summary-label[b-lkivokc1gt] {
    font-size: 0.72rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 500;
}

/* Insight alerts */
.adm-insight-list[b-lkivokc1gt] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

/* Step detail cards */
.adm-step-card[b-lkivokc1gt] {
    border-radius: 8px;
    border: 1px solid #e8ecf1;
    padding: 0.875rem 1rem;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 0.625rem;
}

.adm-step-card__header[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.adm-step-card__name[b-lkivokc1gt] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
}

.adm-step-card__meta[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.adm-step-card__metric[b-lkivokc1gt] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.72rem;
    color: #64748b;
}

.adm-step-card__metric strong[b-lkivokc1gt] {
    color: #334155;
}

.adm-step-card__substep[b-lkivokc1gt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.75rem;
    background: #f8f9fb;
    border-radius: 6px;
    font-size: 0.75rem;
}

.adm-step-card__substep-name[b-lkivokc1gt] {
    color: #475569;
    font-weight: 500;
    min-width: 100px;
}

.adm-step-card__substep-value[b-lkivokc1gt] {
    color: #334155;
    flex: 1;
}

.adm-step-card__substep-msg[b-lkivokc1gt] {
    color: #64748b;
    font-size: 0.7rem;
}

/* Status chips */
.adm-status-chip[b-lkivokc1gt] {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.adm-status-chip--success[b-lkivokc1gt] {
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
}

.adm-status-chip--warning[b-lkivokc1gt] {
    background: rgba(245, 158, 11, 0.08);
    color: #b45309;
}

.adm-status-chip--failed[b-lkivokc1gt] {
    background: rgba(239, 68, 68, 0.08);
    color: #dc2626;
}

/* Code block */
.adm-code-block[b-lkivokc1gt] {
    background: #0f172a;
    color: #e2e8f0;
    border-radius: 8px;
    padding: 1rem 1.25rem;
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.8rem;
    line-height: 1.6;
    overflow-x: auto;
    white-space: pre;
    border: 1px solid rgba(51, 65, 85, 0.6);
    max-height: 400px;
}

/* Loading / Error / Empty states */
.adm-loading-state[b-lkivokc1gt],
.adm-error-state[b-lkivokc1gt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 4rem 2rem;
    text-align: center;
}

.adm-empty-state[b-lkivokc1gt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem 2rem;
    text-align: center;
    color: #64748b;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-service-grid[b-lkivokc1gt] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-result-grid[b-lkivokc1gt] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-lkivokc1gt] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-breakdown__summary-grid[b-lkivokc1gt] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-service-grid[b-lkivokc1gt] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-result-grid[b-lkivokc1gt] {
        grid-template-columns: 1fr;
    }

    .adm-kpi-strip[b-lkivokc1gt] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-lkivokc1gt] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-lkivokc1gt] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-page-header[b-lkivokc1gt] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-lkivokc1gt] {
        margin-left: 0;
        width: 100%;
    }

    .adm-run-bar[b-lkivokc1gt] {
        flex-direction: column;
        align-items: stretch;
    }

    .adm-run-bar__actions[b-lkivokc1gt] {
        margin-left: 0;
        justify-content: flex-end;
    }

    .adm-breakdown[b-lkivokc1gt] {
        margin: 0.75rem;
    }

    .adm-breakdown__summary-grid[b-lkivokc1gt] {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Touch targets >= 44px */
    .adm-result-card__action[b-lkivokc1gt] {
        min-height: 44px;
    }

    [b-lkivokc1gt] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }

    .adm-service-card[b-lkivokc1gt] {
        min-height: 44px;
    }

    .adm-live-warning[b-lkivokc1gt] {
        margin: 0 0.75rem;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-lkivokc1gt] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-lkivokc1gt] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-lkivokc1gt] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi__value[b-lkivokc1gt] {
        font-size: 1.25rem;
    }

    .adm-detail-grid[b-lkivokc1gt] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-service-grid[b-lkivokc1gt] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-result-grid[b-lkivokc1gt] {
        padding: 0.75rem 0.875rem;
    }

    .adm-section-header[b-lkivokc1gt],
    .adm-run-bar[b-lkivokc1gt] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-breakdown[b-lkivokc1gt] {
        margin: 0.5rem;
    }

    .adm-breakdown__content[b-lkivokc1gt] {
        padding: 0.875rem;
    }

    .adm-breakdown__summary-grid[b-lkivokc1gt] {
        grid-template-columns: 1fr 1fr;
    }

    .adm-live-warning[b-lkivokc1gt] {
        margin: 0 0.875rem;
    }

    .adm-code-block[b-lkivokc1gt] {
        font-size: 0.72rem;
        padding: 0.75rem;
    }

    .adm-progress-bar[b-lkivokc1gt] {
        margin: 0 0.875rem;
    }
}
/* /Components/Pages/Admin/Diagnostics/LinkScanner.razor.rz.scp.css */
/* =====================================================
   ADMIN SHELL — ported from ServiceDiagnostics.razor.css
   (Blazor scoped CSS requires per-component copies; every
   selector gets rewritten with this file's [b-xxxxx]
   attribute and therefore only matches elements that are
   rendered inside LinkScanner.razor.)
   ===================================================== */

/* ─── Shell ─── */
.adm-shell[b-p8jrxz0oh6] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-p8jrxz0oh6] .adm-breadcrumbs {
    padding: 0;
}

[b-p8jrxz0oh6] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-p8jrxz0oh6] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-p8jrxz0oh6] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-p8jrxz0oh6] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-p8jrxz0oh6] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-p8jrxz0oh6] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-p8jrxz0oh6] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.adm-status-pill__dot--warn[b-p8jrxz0oh6] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__dot--off[b-p8jrxz0oh6] {
    background: #94a3b8;
}

.adm-status-pill__time[b-p8jrxz0oh6] {
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-p8jrxz0oh6] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-p8jrxz0oh6] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-p8jrxz0oh6] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-p8jrxz0oh6] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-p8jrxz0oh6] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-p8jrxz0oh6] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-p8jrxz0oh6] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-p8jrxz0oh6] {
    border-right: none;
}

.adm-kpi:hover[b-p8jrxz0oh6] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-p8jrxz0oh6] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-p8jrxz0oh6] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-p8jrxz0oh6] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-p8jrxz0oh6] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-p8jrxz0oh6] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-p8jrxz0oh6] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-p8jrxz0oh6] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-p8jrxz0oh6] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-p8jrxz0oh6] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-p8jrxz0oh6] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-p8jrxz0oh6] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-p8jrxz0oh6] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-p8jrxz0oh6] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-p8jrxz0oh6] .adm-tabs {
    background: transparent;
}

[b-p8jrxz0oh6] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-p8jrxz0oh6] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-p8jrxz0oh6] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-p8jrxz0oh6] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-p8jrxz0oh6] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-p8jrxz0oh6] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-p8jrxz0oh6] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-p8jrxz0oh6] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-p8jrxz0oh6] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Back / Outlined buttons */
[b-p8jrxz0oh6] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
}

[b-p8jrxz0oh6] .adm-back-btn:hover {
    border-color: rgba(53, 160, 174, 0.3) !important;
    color: #35a0ae !important;
}

/* ═══════════════════════════════════════════════════════
   RUN BAR — Progress and action strip
   ═══════════════════════════════════════════════════════ */
.adm-run-bar[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.875rem 1.5rem;
    background: #ffffff;
    border-top: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-run-bar__progress[b-p8jrxz0oh6] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    flex: 1;
    min-width: 200px;
}

.adm-run-bar__text[b-p8jrxz0oh6] {
    font-size: 0.78rem;
    color: #475569;
    font-weight: 500;
}

[b-p8jrxz0oh6] .adm-run-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    background: #35a0ae !important;
    color: #ffffff !important;
    min-height: 36px;
    padding: 0 1.25rem !important;
}

[b-p8jrxz0oh6] .adm-run-btn:hover {
    background: #2d8a96 !important;
}

[b-p8jrxz0oh6] .adm-run-btn:disabled {
    background: #e2e8f0 !important;
    color: #94a3b8 !important;
}

/* ═══════════════════════════════════════════════════════
   RESULT CARDS — Diagnostic results grid
   ═══════════════════════════════════════════════════════ */
.adm-result-grid[b-p8jrxz0oh6] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-result-card[b-p8jrxz0oh6] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-result-card:hover[b-p8jrxz0oh6] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-result-card__bar[b-p8jrxz0oh6] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-result-card__header[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.adm-result-card__title-row[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.adm-result-card__name[b-p8jrxz0oh6] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.adm-result-card__status[b-p8jrxz0oh6] {
    display: inline-block;
    padding: 0.175rem 0.5rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.adm-result-card__status--completed[b-p8jrxz0oh6] {
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
}

.adm-result-card__status--partiallycompleted[b-p8jrxz0oh6] {
    background: rgba(245, 158, 11, 0.08);
    color: #b45309;
}

.adm-result-card__status--failed[b-p8jrxz0oh6] {
    background: rgba(239, 68, 68, 0.08);
    color: #dc2626;
}

.adm-result-card__status--running[b-p8jrxz0oh6] {
    background: rgba(53, 160, 174, 0.08);
    color: #0e7490;
}

/* Action buttons */
.adm-result-card__actions[b-p8jrxz0oh6] {
    display: flex;
    gap: 0;
    border-top: 1px solid #f1f5f9;
    margin: 0.25rem -1.125rem -1rem;
}

.adm-result-card__action[b-p8jrxz0oh6] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding: 0.5rem;
    border: none;
    background: transparent;
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    min-height: 36px;
}

.adm-result-card__action:hover[b-p8jrxz0oh6] {
    background: rgba(53, 160, 174, 0.04);
    color: #35a0ae;
}

.adm-result-card__action + .adm-result-card__action[b-p8jrxz0oh6] {
    border-left: 1px solid #f1f5f9;
}

/* Table styling */
[b-p8jrxz0oh6] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-p8jrxz0oh6] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-p8jrxz0oh6] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-p8jrxz0oh6] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-p8jrxz0oh6] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

/* Monospace text */
.adm-mono[b-p8jrxz0oh6] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.82rem;
    color: #334155;
}

/* Status chip */
.adm-status-chip[b-p8jrxz0oh6] {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.adm-status-chip--success[b-p8jrxz0oh6] {
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
}

.adm-status-chip--warning[b-p8jrxz0oh6] {
    background: rgba(245, 158, 11, 0.08);
    color: #b45309;
}

.adm-status-chip--failed[b-p8jrxz0oh6] {
    background: rgba(239, 68, 68, 0.08);
    color: #dc2626;
}

/* Loading / Error states */
.adm-loading-state[b-p8jrxz0oh6],
.adm-error-state[b-p8jrxz0oh6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 4rem 2rem;
    text-align: center;
}

/* Empty state */
.adm-empty-state[b-p8jrxz0oh6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem 2rem;
    text-align: center;
    color: #64748b;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — admin shell
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-result-grid[b-p8jrxz0oh6] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-p8jrxz0oh6] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-result-grid[b-p8jrxz0oh6] {
        grid-template-columns: 1fr;
    }

    .adm-kpi-strip[b-p8jrxz0oh6] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-p8jrxz0oh6] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-p8jrxz0oh6] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-page-header[b-p8jrxz0oh6] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-p8jrxz0oh6] {
        margin-left: 0;
        width: 100%;
    }

    .adm-tab-toolbar[b-p8jrxz0oh6] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-p8jrxz0oh6] {
        width: 100%;
        margin-left: 0;
    }

    /* Touch targets ≥ 44px */
    .adm-result-card__action[b-p8jrxz0oh6] {
        min-height: 44px;
    }

    [b-p8jrxz0oh6] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-p8jrxz0oh6] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-p8jrxz0oh6] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-p8jrxz0oh6] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi__value[b-p8jrxz0oh6] {
        font-size: 1.25rem;
    }

    .adm-detail-grid[b-p8jrxz0oh6] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-result-grid[b-p8jrxz0oh6] {
        padding: 0.75rem 0.875rem;
    }

    .adm-section-header[b-p8jrxz0oh6],
    .adm-tab-toolbar[b-p8jrxz0oh6],
    .adm-run-bar[b-p8jrxz0oh6] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-p8jrxz0oh6] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }
}

/* =====================================================
   LINK SCANNER — page-specific rules
   ===================================================== */

/* ─── Status pill fail variant (broken links present) ─── */
.adm-status-pill__dot--fail[b-p8jrxz0oh6] {
    background: #dc2626;
    box-shadow: 0 0 6px rgba(220, 38, 38, 0.4);
}

/* ─── KPI strip: 6 columns for this page ─── */
.link-scanner-kpi-strip[b-p8jrxz0oh6] {
    grid-template-columns: repeat(6, 1fr);
}

/* Alert variant for KPI cards with broken count > 0 */
.adm-kpi--alert[b-p8jrxz0oh6] {
    background: rgba(220, 38, 38, 0.03);
}

.adm-kpi--alert .adm-kpi__value[b-p8jrxz0oh6] {
    color: #dc2626;
}

/* ═══════════════════════════════════════════════════════
   SCAN OPTIONS (Tab 1)
   ═══════════════════════════════════════════════════════ */
.link-scanner-options[b-p8jrxz0oh6] {
    display: flex;
    flex-direction: column;
    gap: 1.125rem;
    padding: 1rem 1.5rem;
}

.link-scanner-option-row[b-p8jrxz0oh6] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.link-scanner-option-help[b-p8jrxz0oh6] {
    font-size: 0.78rem;
    color: #64748b;
    line-height: 1.5;
    padding-left: 3.5rem;
}

/* ═══════════════════════════════════════════════════════
   RESULTS (Tab 2)
   ═══════════════════════════════════════════════════════ */
.link-scanner-filter-toolbar[b-p8jrxz0oh6] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    padding: 0.875rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
}

.link-scanner-chip-filter-row[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    flex-wrap: wrap;
}

.link-scanner-chip-filter-label[b-p8jrxz0oh6] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    min-width: 60px;
}

.link-scanner-search-wrap[b-p8jrxz0oh6] {
    max-width: 480px;
}

/* Severity extensions to status chips (Info + Ok + Broken) */
.adm-result-card__status--broken[b-p8jrxz0oh6] {
    background: rgba(239, 68, 68, 0.08);
    color: #dc2626;
}

.adm-result-card__status--warning[b-p8jrxz0oh6] {
    background: rgba(245, 158, 11, 0.08);
    color: #b45309;
}

.adm-result-card__status--info[b-p8jrxz0oh6] {
    background: rgba(59, 130, 246, 0.08);
    color: #1d4ed8;
}

.adm-result-card__status--ok[b-p8jrxz0oh6] {
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
}

/* Category pill next to severity */
.link-scanner-category-pill[b-p8jrxz0oh6] {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    background: rgba(53, 160, 174, 0.08);
    color: #0e7490;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Monospace target link */
.link-scanner-monospace-target[b-p8jrxz0oh6] {
    display: block;
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.78rem;
    color: #0f172a;
    background: #f8f9fb;
    border: 1px solid #e8ecf1;
    border-radius: 6px;
    padding: 0.375rem 0.5rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.link-scanner-monospace-target-inline[b-p8jrxz0oh6] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.72rem;
    color: #0e7490;
    background: rgba(53, 160, 174, 0.06);
    border-radius: 4px;
    padding: 0.1rem 0.375rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 260px;
}

/* Source file:line row */
.link-scanner-source-row[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    min-width: 0;
}

.link-scanner-source-text[b-p8jrxz0oh6] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.72rem;
    color: #475569;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.link-scanner-reason[b-p8jrxz0oh6] {
    font-size: 0.8rem;
    color: #334155;
    line-height: 1.45;
}

.link-scanner-role-chip[b-p8jrxz0oh6] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.15rem 0.5rem;
    background: rgba(147, 51, 234, 0.08);
    color: #7e22ce;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    width: fit-content;
}

.link-scanner-line-context[b-p8jrxz0oh6] {
    background: #0f172a;
    color: #e2e8f0;
    border-radius: 6px;
    padding: 0.5rem 0.75rem;
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.72rem;
    line-height: 1.5;
    overflow-x: auto;
    white-space: pre;
    margin: 0;
}

.link-scanner-empty-state[b-p8jrxz0oh6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem 2rem;
    text-align: center;
    color: #64748b;
}

.link-scanner-pagination[b-p8jrxz0oh6] {
    display: flex;
    justify-content: center;
    padding: 1rem 1.5rem 1.5rem;
}

/* ═══════════════════════════════════════════════════════
   EXTERNAL AUDIT (Tab 3)
   ═══════════════════════════════════════════════════════ */
.link-scanner-external-body[b-p8jrxz0oh6] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    padding: 1rem 1.5rem;
}

.link-scanner-category-summary[b-p8jrxz0oh6] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.link-scanner-category-summary__pill[b-p8jrxz0oh6] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.3rem 0.625rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 20px;
    font-size: 0.75rem;
    color: #475569;
}

.link-scanner-category-summary__pill strong[b-p8jrxz0oh6] {
    color: #0f172a;
    font-weight: 600;
}

.link-scanner-unknown-alert[b-p8jrxz0oh6] {
    font-size: 0.82rem;
}

.link-scanner-host-panels[b-p8jrxz0oh6] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

[b-p8jrxz0oh6] .link-scanner-host-panel {
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    background: #ffffff;
    overflow: hidden;
}

[b-p8jrxz0oh6] .link-scanner-host-panel .mud-expand-panel-header {
    padding: 0.625rem 0.875rem;
}

.link-scanner-host-header[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    flex: 1;
    flex-wrap: wrap;
}

.link-scanner-host-name[b-p8jrxz0oh6] {
    font-size: 0.88rem;
    font-weight: 600;
    color: #1e293b;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
}

.link-scanner-host-scheme[b-p8jrxz0oh6] {
    font-size: 0.7rem;
    color: #64748b;
    background: #f1f5f9;
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.link-scanner-host-category[b-p8jrxz0oh6] {
    font-size: 0.7rem;
    color: #0e7490;
    background: rgba(53, 160, 174, 0.08);
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    font-weight: 600;
}

.link-scanner-host-uses[b-p8jrxz0oh6] {
    font-size: 0.75rem;
    color: #475569;
    margin-left: auto;
}

.link-scanner-host-status[b-p8jrxz0oh6] {
    font-size: 0.7rem;
    color: #64748b;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

/* Reachability dot */
.link-scanner-reachability-dot[b-p8jrxz0oh6] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
    display: inline-block;
}

.link-scanner-reachability-dot--on[b-p8jrxz0oh6] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.link-scanner-reachability-dot--off[b-p8jrxz0oh6] {
    background: #dc2626;
    box-shadow: 0 0 6px rgba(220, 38, 38, 0.4);
}

.link-scanner-reachability-dot--unknown[b-p8jrxz0oh6] {
    background: #94a3b8;
}

.link-scanner-host-uses-list[b-p8jrxz0oh6] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0.5rem 0.25rem 0.75rem;
}

.link-scanner-host-use-row[b-p8jrxz0oh6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
}

.link-scanner-host-use-row:hover[b-p8jrxz0oh6] {
    background: rgba(53, 160, 174, 0.04);
}

/* ═══════════════════════════════════════════════════════
   ROUTE REGISTRY (Tab 4)
   ═══════════════════════════════════════════════════════ */
.link-scanner-route-search[b-p8jrxz0oh6] {
    padding: 0.875rem 1.5rem 0;
    max-width: 520px;
}

.link-scanner-route-table-wrap[b-p8jrxz0oh6] {
    padding: 0.875rem 1.5rem 1.5rem;
}

.link-scanner-component-type[b-p8jrxz0oh6] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.78rem;
    color: #334155;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .link-scanner-kpi-strip[b-p8jrxz0oh6] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 960px) {
    .link-scanner-kpi-strip[b-p8jrxz0oh6] {
        grid-template-columns: repeat(2, 1fr);
    }

    .link-scanner-kpi-strip .adm-kpi:nth-child(2n)[b-p8jrxz0oh6] {
        border-right: none;
    }

    .link-scanner-kpi-strip .adm-kpi:nth-child(n+3)[b-p8jrxz0oh6] {
        border-top: 1px solid #f1f5f9;
    }

    .link-scanner-host-header[b-p8jrxz0oh6] {
        gap: 0.375rem;
    }

    .link-scanner-host-uses[b-p8jrxz0oh6] {
        margin-left: 0;
    }

    .link-scanner-option-help[b-p8jrxz0oh6] {
        padding-left: 0;
    }
}

@media (max-width: 600px) {
    .link-scanner-kpi-strip[b-p8jrxz0oh6] {
        grid-template-columns: 1fr 1fr;
    }

    .link-scanner-filter-toolbar[b-p8jrxz0oh6],
    .link-scanner-external-body[b-p8jrxz0oh6],
    .link-scanner-options[b-p8jrxz0oh6],
    .link-scanner-pagination[b-p8jrxz0oh6] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .link-scanner-route-search[b-p8jrxz0oh6],
    .link-scanner-route-table-wrap[b-p8jrxz0oh6] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .link-scanner-monospace-target-inline[b-p8jrxz0oh6] {
        max-width: 160px;
    }

    .link-scanner-chip-filter-label[b-p8jrxz0oh6] {
        min-width: auto;
    }

    /* Touch targets */
    .adm-result-card__action[b-p8jrxz0oh6] {
        min-height: 44px;
    }
}
/* /Components/Pages/Admin/Diagnostics/ServiceDiagnostics.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Service Diagnostics — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-e9b1hhfo4q] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-e9b1hhfo4q] .adm-breadcrumbs {
    padding: 0;
}

[b-e9b1hhfo4q] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-e9b1hhfo4q] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-e9b1hhfo4q] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-e9b1hhfo4q] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-e9b1hhfo4q] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-e9b1hhfo4q] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-e9b1hhfo4q] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.adm-status-pill__dot--warn[b-e9b1hhfo4q] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__dot--off[b-e9b1hhfo4q] {
    background: #94a3b8;
}

.adm-status-pill__time[b-e9b1hhfo4q] {
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-e9b1hhfo4q] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-e9b1hhfo4q] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-e9b1hhfo4q] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-e9b1hhfo4q] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-e9b1hhfo4q] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-e9b1hhfo4q] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-e9b1hhfo4q] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-e9b1hhfo4q] {
    border-right: none;
}

.adm-kpi:hover[b-e9b1hhfo4q] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-e9b1hhfo4q] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-e9b1hhfo4q] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-e9b1hhfo4q] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-e9b1hhfo4q] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-e9b1hhfo4q] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-e9b1hhfo4q] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-e9b1hhfo4q] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-e9b1hhfo4q] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-e9b1hhfo4q] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-e9b1hhfo4q] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-e9b1hhfo4q] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-e9b1hhfo4q] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-e9b1hhfo4q] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-e9b1hhfo4q] .adm-tabs {
    background: transparent;
}

[b-e9b1hhfo4q] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-e9b1hhfo4q] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-e9b1hhfo4q] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-e9b1hhfo4q] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-e9b1hhfo4q] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-e9b1hhfo4q] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-e9b1hhfo4q] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-e9b1hhfo4q] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-e9b1hhfo4q] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Back / Outlined buttons */
[b-e9b1hhfo4q] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
}

[b-e9b1hhfo4q] .adm-back-btn:hover {
    border-color: rgba(53, 160, 174, 0.3) !important;
    color: #35a0ae !important;
}

/* ═══════════════════════════════════════════════════════
   SERVICE CARDS — Selection grid
   ═══════════════════════════════════════════════════════ */
.adm-service-grid[b-e9b1hhfo4q] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-service-card[b-e9b1hhfo4q] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    border-radius: 10px;
    padding: 1rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    cursor: pointer;
    transition: all 0.15s ease;
    min-height: 100px;
}

.adm-service-card:hover[b-e9b1hhfo4q] {
    border-color: rgba(53, 160, 174, 0.3);
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-service-card--selected[b-e9b1hhfo4q] {
    border-color: #35a0ae;
    background: rgba(53, 160, 174, 0.03);
}

.adm-service-card--disabled[b-e9b1hhfo4q] {
    opacity: 0.5;
    pointer-events: none;
}

.adm-service-card__header[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.adm-service-card__check[b-e9b1hhfo4q] {
    flex-shrink: 0;
}

.adm-service-card__name[b-e9b1hhfo4q] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.3;
}

.adm-service-card__desc[b-e9b1hhfo4q] {
    font-size: 0.72rem;
    color: #64748b;
    line-height: 1.4;
}

.adm-service-card__badge[b-e9b1hhfo4q] {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    width: fit-content;
}

.adm-service-card__badge--unavailable[b-e9b1hhfo4q] {
    background: rgba(239, 68, 68, 0.08);
    color: #dc2626;
}

/* ═══════════════════════════════════════════════════════
   RUN BAR — Progress and action strip
   ═══════════════════════════════════════════════════════ */
.adm-run-bar[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.875rem 1.5rem;
    background: #ffffff;
    border-top: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-run-bar__progress[b-e9b1hhfo4q] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    flex: 1;
    min-width: 200px;
}

.adm-run-bar__text[b-e9b1hhfo4q] {
    font-size: 0.78rem;
    color: #475569;
    font-weight: 500;
}

[b-e9b1hhfo4q] .adm-run-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    background: #35a0ae !important;
    color: #ffffff !important;
    min-height: 36px;
    padding: 0 1.25rem !important;
}

[b-e9b1hhfo4q] .adm-run-btn:hover {
    background: #2d8a96 !important;
}

[b-e9b1hhfo4q] .adm-run-btn:disabled {
    background: #e2e8f0 !important;
    color: #94a3b8 !important;
}

/* ═══════════════════════════════════════════════════════
   RESULT CARDS — Diagnostic results grid
   ═══════════════════════════════════════════════════════ */
.adm-result-grid[b-e9b1hhfo4q] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-result-card[b-e9b1hhfo4q] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-result-card:hover[b-e9b1hhfo4q] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-result-card__bar[b-e9b1hhfo4q] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-result-card__header[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.adm-result-card__title-row[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.adm-result-card__name[b-e9b1hhfo4q] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.adm-result-card__status[b-e9b1hhfo4q] {
    display: inline-block;
    padding: 0.175rem 0.5rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.adm-result-card__status--completed[b-e9b1hhfo4q] {
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
}

.adm-result-card__status--partiallycompleted[b-e9b1hhfo4q] {
    background: rgba(245, 158, 11, 0.08);
    color: #b45309;
}

.adm-result-card__status--failed[b-e9b1hhfo4q] {
    background: rgba(239, 68, 68, 0.08);
    color: #dc2626;
}

.adm-result-card__status--running[b-e9b1hhfo4q] {
    background: rgba(53, 160, 174, 0.08);
    color: #0e7490;
}

/* Running state */
.adm-result-card__running[b-e9b1hhfo4q] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0.5rem 0.625rem;
    background: rgba(53, 160, 174, 0.04);
    border-radius: 6px;
}

.adm-result-card__step[b-e9b1hhfo4q] {
    font-size: 0.75rem;
    color: #0e7490;
    font-weight: 500;
}

/* Success rate bar */
.adm-result-card__rate[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-result-card__rate-bar[b-e9b1hhfo4q] {
    flex: 1;
    height: 6px;
    background: #f1f5f9;
    border-radius: 3px;
    overflow: hidden;
}

.adm-result-card__rate-fill[b-e9b1hhfo4q] {
    height: 100%;
    border-radius: 3px;
    transition: width 0.4s ease;
}

.adm-result-card__rate-fill--good[b-e9b1hhfo4q] {
    background: #16a34a;
}

.adm-result-card__rate-fill--warn[b-e9b1hhfo4q] {
    background: #f59e0b;
}

.adm-result-card__rate-fill--bad[b-e9b1hhfo4q] {
    background: #ef4444;
}

.adm-result-card__rate-text[b-e9b1hhfo4q] {
    font-size: 0.72rem;
    font-weight: 700;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
    min-width: 32px;
    text-align: right;
}

/* Stats row */
.adm-result-card__stats[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.adm-result-card__stat[b-e9b1hhfo4q] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.72rem;
    color: #64748b;
}

/* Data transfer row */
.adm-result-card__data-row[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    font-size: 0.72rem;
    color: #0e7490;
    padding: 0.25rem 0;
}

/* Step list */
.adm-result-card__steps[b-e9b1hhfo4q] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding-top: 0.25rem;
    border-top: 1px solid #f1f5f9;
}

.adm-result-card__step-item[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.72rem;
}

.adm-result-card__step-name[b-e9b1hhfo4q] {
    color: #334155;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.adm-result-card__step-time[b-e9b1hhfo4q] {
    color: #64748b;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.adm-result-card__step-more[b-e9b1hhfo4q] {
    font-size: 0.7rem;
    color: #94a3b8;
    padding-left: 1.25rem;
}

/* Action buttons */
.adm-result-card__actions[b-e9b1hhfo4q] {
    display: flex;
    gap: 0;
    border-top: 1px solid #f1f5f9;
    margin: 0.25rem -1.125rem -1rem;
}

.adm-result-card__action[b-e9b1hhfo4q] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding: 0.5rem;
    border: none;
    background: transparent;
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    min-height: 36px;
}

.adm-result-card__action:hover[b-e9b1hhfo4q] {
    background: rgba(53, 160, 174, 0.04);
    color: #35a0ae;
}

.adm-result-card__action + .adm-result-card__action[b-e9b1hhfo4q] {
    border-left: 1px solid #f1f5f9;
}

/* ═══════════════════════════════════════════════════════
   BREAKDOWN PANEL — Detailed analysis
   ═══════════════════════════════════════════════════════ */
.adm-breakdown[b-e9b1hhfo4q] {
    margin: 1rem 1.5rem;
    border-radius: 10px;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
}

.adm-breakdown__header[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e8ecf1;
}

.adm-breakdown__title-row[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.adm-breakdown__title[b-e9b1hhfo4q] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-breakdown__content[b-e9b1hhfo4q] {
    padding: 1.25rem;
}

.adm-breakdown__stat-grid[b-e9b1hhfo4q] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
}

.adm-breakdown__stat-block[b-e9b1hhfo4q] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.adm-breakdown__stat-title[b-e9b1hhfo4q] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

/* Table styling */
[b-e9b1hhfo4q] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-e9b1hhfo4q] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-e9b1hhfo4q] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-e9b1hhfo4q] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-e9b1hhfo4q] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

/* Distribution bars */
.adm-dist-row[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.adm-dist-label[b-e9b1hhfo4q] {
    font-size: 0.82rem;
    color: #334155;
    font-weight: 500;
    width: 72px;
    flex-shrink: 0;
}

.adm-dist-bar-wrap[b-e9b1hhfo4q] {
    flex: 1;
    height: 22px;
    background: #f1f5f9;
    border-radius: 4px;
    overflow: hidden;
    position: relative;
}

.adm-dist-bar[b-e9b1hhfo4q] {
    height: 100%;
    border-radius: 4px;
    min-width: 2px;
    transition: width 0.4s ease;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 0.375rem;
}

.adm-dist-bar--pass[b-e9b1hhfo4q] {
    background: #16a34a;
}

.adm-dist-bar--warn[b-e9b1hhfo4q] {
    background: #f59e0b;
}

.adm-dist-bar--fail[b-e9b1hhfo4q] {
    background: #ef4444;
}

.adm-dist-text[b-e9b1hhfo4q] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #ffffff;
    white-space: nowrap;
}

/* Insight alerts */
.adm-insight-list[b-e9b1hhfo4q] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Code block */
.adm-code-block[b-e9b1hhfo4q] {
    background: #0f172a;
    color: #e2e8f0;
    border-radius: 8px;
    padding: 1rem 1.25rem;
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.8rem;
    line-height: 1.6;
    overflow-x: auto;
    white-space: pre;
    border: 1px solid rgba(51, 65, 85, 0.6);
    max-height: 400px;
}

/* Monospace text */
.adm-mono[b-e9b1hhfo4q] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.82rem;
    color: #334155;
}

/* Status chip */
.adm-status-chip[b-e9b1hhfo4q] {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.adm-status-chip--success[b-e9b1hhfo4q] {
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
}

.adm-status-chip--warning[b-e9b1hhfo4q] {
    background: rgba(245, 158, 11, 0.08);
    color: #b45309;
}

.adm-status-chip--failed[b-e9b1hhfo4q] {
    background: rgba(239, 68, 68, 0.08);
    color: #dc2626;
}

/* Loading / Error states */
.adm-loading-state[b-e9b1hhfo4q],
.adm-error-state[b-e9b1hhfo4q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 4rem 2rem;
    text-align: center;
}

/* Empty state */
.adm-empty-state[b-e9b1hhfo4q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem 2rem;
    text-align: center;
    color: #64748b;
}

/* Step detail cards in breakdown */
.adm-step-card[b-e9b1hhfo4q] {
    border-radius: 8px;
    border: 1px solid #e8ecf1;
    padding: 0.875rem 1rem;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 0.625rem;
}

.adm-step-card__header[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.adm-step-card__name[b-e9b1hhfo4q] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
}

.adm-step-card__meta[b-e9b1hhfo4q] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.adm-step-card__metric[b-e9b1hhfo4q] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.72rem;
    color: #64748b;
}

.adm-step-card__metric strong[b-e9b1hhfo4q] {
    color: #334155;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-service-grid[b-e9b1hhfo4q] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-result-grid[b-e9b1hhfo4q] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-e9b1hhfo4q] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-breakdown__stat-grid[b-e9b1hhfo4q] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 960px) {
    .adm-service-grid[b-e9b1hhfo4q] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-result-grid[b-e9b1hhfo4q] {
        grid-template-columns: 1fr;
    }

    .adm-kpi-strip[b-e9b1hhfo4q] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-e9b1hhfo4q] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-e9b1hhfo4q] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-page-header[b-e9b1hhfo4q] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-e9b1hhfo4q] {
        margin-left: 0;
        width: 100%;
    }

    .adm-tab-toolbar[b-e9b1hhfo4q] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-e9b1hhfo4q] {
        width: 100%;
        margin-left: 0;
    }

    .adm-breakdown[b-e9b1hhfo4q] {
        margin: 0.75rem;
    }

    /* Touch targets ≥ 44px */
    .adm-result-card__action[b-e9b1hhfo4q] {
        min-height: 44px;
    }

    [b-e9b1hhfo4q] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }

    .adm-service-card[b-e9b1hhfo4q] {
        min-height: 44px;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-e9b1hhfo4q] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-e9b1hhfo4q] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-e9b1hhfo4q] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi__value[b-e9b1hhfo4q] {
        font-size: 1.25rem;
    }

    .adm-detail-grid[b-e9b1hhfo4q] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-service-grid[b-e9b1hhfo4q] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-result-grid[b-e9b1hhfo4q] {
        padding: 0.75rem 0.875rem;
    }

    .adm-section-header[b-e9b1hhfo4q],
    .adm-tab-toolbar[b-e9b1hhfo4q],
    .adm-run-bar[b-e9b1hhfo4q] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-e9b1hhfo4q] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    .adm-breakdown[b-e9b1hhfo4q] {
        margin: 0.5rem;
    }

    .adm-breakdown__content[b-e9b1hhfo4q] {
        padding: 0.875rem;
    }

    .adm-code-block[b-e9b1hhfo4q] {
        font-size: 0.72rem;
        padding: 0.75rem;
    }
}
/* /Components/Pages/Admin/Discounts/Discounts.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Discounts — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + Badges standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-its14mnjkq] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-its14mnjkq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-its14mnjkq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-its14mnjkq] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-its14mnjkq] .adm-breadcrumbs {
    padding: 0;
}

[b-its14mnjkq] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-its14mnjkq] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-its14mnjkq] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-its14mnjkq] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-its14mnjkq] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-its14mnjkq] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-its14mnjkq] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-its14mnjkq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-its14mnjkq] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-its14mnjkq] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-its14mnjkq] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-its14mnjkq] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-its14mnjkq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add Button */
[b-its14mnjkq] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
}

/* Refresh Button */
[b-its14mnjkq] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-its14mnjkq] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-its14mnjkq] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-its14mnjkq] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-its14mnjkq] {
    border-right: none;
}

.adm-kpi:hover[b-its14mnjkq] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-its14mnjkq] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-its14mnjkq] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-its14mnjkq] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-its14mnjkq] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-its14mnjkq] .adm-tabs {
    background: transparent;
}

[b-its14mnjkq] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-its14mnjkq] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-its14mnjkq] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-its14mnjkq] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-its14mnjkq] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-its14mnjkq] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-its14mnjkq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-its14mnjkq] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-its14mnjkq] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-its14mnjkq] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-its14mnjkq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-its14mnjkq] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-its14mnjkq] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-its14mnjkq] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLE SECTION
   ═══════════════════════════════════════════════════════ */
.adm-table-container[b-its14mnjkq] {
    padding: 0 1.5rem 1.5rem;
    overflow-x: auto;
}

/* MudTable styling */
[b-its14mnjkq] .adm-table {
    border-radius: 10px !important;
    border: 1px solid #e8ecf1 !important;
    overflow: hidden;
    box-shadow: none !important;
}

[b-its14mnjkq] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-its14mnjkq] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-its14mnjkq] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-its14mnjkq] .adm-table .mud-table-body tr {
    transition: background 0.12s ease;
}

[b-its14mnjkq] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-its14mnjkq] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-its14mnjkq] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-its14mnjkq] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

/* ═══════════════════════════════════════════════════════
   DISCOUNT-SPECIFIC STYLES
   ═══════════════════════════════════════════════════════ */
.adm-user-name[b-its14mnjkq] {
    font-weight: 500;
    color: #1e293b;
    display: block;
}

.adm-user-email[b-its14mnjkq] {
    font-size: 0.75rem;
    color: #64748b;
    display: block;
}

.adm-store-name[b-its14mnjkq] {
    font-weight: 500;
    color: #1e293b;
}

/* Chip styling */
[b-its14mnjkq] .adm-chip {
    font-size: 0.7rem !important;
    height: 22px !important;
    font-weight: 600 !important;
}

/* WCAG AA contrast fix: white on default green (#4CAF50) = 2.78:1 -> #2e7d32 = ~5.5:1 */
[b-its14mnjkq] .adm-chip.mud-chip-filled.mud-chip-color-success {
    background-color: #2e7d32 !important;
}

/* Empty state */
.adm-empty-state[b-its14mnjkq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #94a3b8;
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-its14mnjkq] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-its14mnjkq] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-its14mnjkq] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-its14mnjkq] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-its14mnjkq] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-kpi-strip[b-its14mnjkq] {
        grid-template-columns: repeat(2, 1fr);
    }

    [b-its14mnjkq] .adm-filter-field {
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-its14mnjkq] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-its14mnjkq] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-its14mnjkq] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-its14mnjkq] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-its14mnjkq] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-table-container[b-its14mnjkq] {
        padding: 0 0.875rem 1rem;
    }

    .adm-tab-toolbar[b-its14mnjkq] {
        flex-direction: column;
        align-items: flex-start;
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-tab-toolbar__right[b-its14mnjkq] {
        width: 100%;
        margin-left: 0;
    }

    [b-its14mnjkq] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    [b-its14mnjkq] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    /* WCAG touch target fix: min 44px on mobile */
    [b-its14mnjkq] .adm-add-btn {
        min-height: 44px !important;
        padding: 8px 16px !important;
    }

    [b-its14mnjkq] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/DiscountTypes/AddDiscountType.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   AddDiscountType Dialog — Nordic Control Panel Design
   ═══════════════════════════════════════════════════════ */

.adm-dialog[b-nsk87xvhqj] {
    padding: 0.5rem 0;
}

.adm-form-grid[b-nsk87xvhqj] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.adm-form-group[b-nsk87xvhqj] {
    display: flex;
    flex-direction: column;
}

.adm-form-row[b-nsk87xvhqj] {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.adm-form-meta[b-nsk87xvhqj] {
    gap: 1rem;
    padding-top: 0.5rem;
    border-top: 1px solid #f1f5f9;
}

.adm-dialog-actions[b-nsk87xvhqj] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 1.25rem;
    margin-top: 0.5rem;
    border-top: 1px solid #e8ecf1;
}

[b-nsk87xvhqj] .adm-dialog-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
}
/* /Components/Pages/Admin/DiscountTypes/DiscountTypes.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Discount Types — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + Discounts + Badges standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-24tzhtabq8] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-24tzhtabq8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-24tzhtabq8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-24tzhtabq8] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-24tzhtabq8] .adm-breadcrumbs {
    padding: 0;
}

[b-24tzhtabq8] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-24tzhtabq8] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-24tzhtabq8] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-24tzhtabq8] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-24tzhtabq8] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-24tzhtabq8] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-24tzhtabq8] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-24tzhtabq8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-24tzhtabq8] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-24tzhtabq8] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-24tzhtabq8] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-24tzhtabq8] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-24tzhtabq8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add Button */
[b-24tzhtabq8] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
}

/* Refresh Button */
[b-24tzhtabq8] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-24tzhtabq8] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-24tzhtabq8] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-24tzhtabq8] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-24tzhtabq8] {
    border-right: none;
}

.adm-kpi:hover[b-24tzhtabq8] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-24tzhtabq8] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-24tzhtabq8] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-24tzhtabq8] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-24tzhtabq8] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-24tzhtabq8] .adm-tabs {
    background: transparent;
}

[b-24tzhtabq8] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-24tzhtabq8] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-24tzhtabq8] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-24tzhtabq8] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-24tzhtabq8] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-24tzhtabq8] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-24tzhtabq8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-24tzhtabq8] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-24tzhtabq8] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-24tzhtabq8] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-24tzhtabq8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-24tzhtabq8] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-24tzhtabq8] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-24tzhtabq8] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLE SECTION
   ═══════════════════════════════════════════════════════ */
.adm-table-container[b-24tzhtabq8] {
    padding: 0 1.5rem 1.5rem;
    overflow-x: auto;
}

/* MudTable styling */
[b-24tzhtabq8] .adm-table {
    border-radius: 10px !important;
    border: 1px solid #e8ecf1 !important;
    overflow: hidden;
    box-shadow: none !important;
}

[b-24tzhtabq8] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-24tzhtabq8] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-24tzhtabq8] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-24tzhtabq8] .adm-table .mud-table-body tr {
    cursor: pointer;
    transition: background 0.12s ease;
}

[b-24tzhtabq8] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-24tzhtabq8] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-24tzhtabq8] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-24tzhtabq8] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

/* ═══════════════════════════════════════════════════════
   DISCOUNT TYPE-SPECIFIC STYLES
   ═══════════════════════════════════════════════════════ */
.adm-type-name[b-24tzhtabq8] {
    font-weight: 500;
    color: #1e293b;
}

.adm-type-desc[b-24tzhtabq8] {
    color: #57667a;
    font-size: 0.8rem;
}

.adm-amount[b-24tzhtabq8] {
    font-weight: 500;
    color: #1e293b;
    font-variant-numeric: tabular-nums;
}

/* Chip styling */
[b-24tzhtabq8] .adm-chip {
    font-size: 0.7rem !important;
    height: 22px !important;
    font-weight: 600 !important;
}

/* WCAG AA contrast fix: white on default green (#4CAF50) = 2.78:1 -> #2e7d32 = ~5.5:1 */
[b-24tzhtabq8] .adm-chip.mud-chip-filled.mud-chip-color-success {
    background-color: #2e7d32 !important;
}

/* Empty state */
.adm-empty-state[b-24tzhtabq8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #64748b; /* WCAG AA fix: #94a3b8 was 2.56:1, #64748b is 5.03:1 on white */
    font-size: 0.85rem;
}

/* WCAG fix: disabled breadcrumb contrast (MudBlazor default is ~1.40:1) */
[b-24tzhtabq8] .adm-breadcrumbs .mud-breadcrumbs-li:last-child {
    color: #94a3b8 !important; /* slate-400, ~3.5:1 on white — sufficient for decorative/disabled */
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-24tzhtabq8] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-24tzhtabq8] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-24tzhtabq8] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-24tzhtabq8] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-24tzhtabq8] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-kpi-strip[b-24tzhtabq8] {
        grid-template-columns: repeat(2, 1fr);
    }

    [b-24tzhtabq8] .adm-filter-field {
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-24tzhtabq8] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-24tzhtabq8] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-24tzhtabq8] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-24tzhtabq8] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-24tzhtabq8] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-table-container[b-24tzhtabq8] {
        padding: 0 0.875rem 1rem;
    }

    .adm-tab-toolbar[b-24tzhtabq8] {
        flex-direction: column;
        align-items: flex-start;
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-tab-toolbar__right[b-24tzhtabq8] {
        width: 100%;
        margin-left: 0;
    }

    [b-24tzhtabq8] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    [b-24tzhtabq8] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    /* WCAG touch target fix: min 44px on mobile */
    [b-24tzhtabq8] .adm-add-btn {
        min-height: 44px !important;
        padding: 8px 16px !important;
    }

    [b-24tzhtabq8] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/DiscountTypes/EditDiscountType.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   EditDiscountType Dialog — Nordic Control Panel Design
   ═══════════════════════════════════════════════════════ */

.adm-dialog[b-ttfnfiskdj] {
    padding: 0.5rem 0;
}

.adm-form-grid[b-ttfnfiskdj] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.adm-form-group[b-ttfnfiskdj] {
    display: flex;
    flex-direction: column;
}

.adm-form-row[b-ttfnfiskdj] {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.adm-form-meta[b-ttfnfiskdj] {
    gap: 1rem;
    padding-top: 0.5rem;
    border-top: 1px solid #f1f5f9;
}

.adm-dialog-actions[b-ttfnfiskdj] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 1.25rem;
    margin-top: 0.5rem;
    border-top: 1px solid #e8ecf1;
}

[b-ttfnfiskdj] .adm-dialog-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
}
/* /Components/Pages/Admin/Emails/EmailTemplateAssignmentDialog.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   EmailTemplateAssignmentDialog — Nordic Dialog
   ═══════════════════════════════════════════════════════ */

.adm-dialog[b-rxag7zzr3o] {
    padding: 0.5rem 0;
}

.adm-form-grid[b-rxag7zzr3o] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.adm-form-group[b-rxag7zzr3o] {
    display: flex;
    flex-direction: column;
}

.adm-form-row[b-rxag7zzr3o] {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.adm-dialog-actions[b-rxag7zzr3o] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 1.25rem;
    margin-top: 0.5rem;
    border-top: 1px solid #e8ecf1;
}

[b-rxag7zzr3o] .adm-dialog-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
}
/* /Components/Pages/Admin/Emails/EmailTemplateAssignments.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Email Template Assignments — "Nordic Control Panel"
   Matches AnalyticsDashboard + NotificationTemplateAssignments standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-3aekqunyoc] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-3aekqunyoc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-3aekqunyoc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-3aekqunyoc] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-3aekqunyoc] .adm-breadcrumbs {
    padding: 0;
}

[b-3aekqunyoc] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-3aekqunyoc] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-3aekqunyoc] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-3aekqunyoc] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-3aekqunyoc] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-3aekqunyoc] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-3aekqunyoc] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-3aekqunyoc] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-3aekqunyoc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-3aekqunyoc] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-3aekqunyoc] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-3aekqunyoc] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-3aekqunyoc] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-3aekqunyoc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add Button */
[b-3aekqunyoc] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
}

/* Seed Button */
[b-3aekqunyoc] .adm-seed-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
}

[b-3aekqunyoc] .adm-seed-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Refresh Button */
[b-3aekqunyoc] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-3aekqunyoc] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-3aekqunyoc] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-3aekqunyoc] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-3aekqunyoc] {
    border-right: none;
}

.adm-kpi:hover[b-3aekqunyoc] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-3aekqunyoc] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-3aekqunyoc] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-3aekqunyoc] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-3aekqunyoc] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-3aekqunyoc] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-3aekqunyoc] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-3aekqunyoc] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   TABLE SECTION
   ═══════════════════════════════════════════════════════ */
.adm-table-container[b-3aekqunyoc] {
    padding: 0 1.5rem 1.5rem;
}

[b-3aekqunyoc] .adm-search-field {
    margin-bottom: 0.75rem;
    max-width: 360px;
}

[b-3aekqunyoc] .adm-search-field .mud-input-outlined-border {
    border-color: #e2e8f0 !important;
    border-radius: 8px !important;
}

[b-3aekqunyoc] .adm-search-field .mud-input-outlined-border:hover {
    border-color: #35a0ae !important;
}

[b-3aekqunyoc] .adm-search-field .mud-input-adorment-start {
    color: #94a3b8;
}

[b-3aekqunyoc] .adm-search-field input::placeholder {
    color: #94a3b8 !important;
    font-size: 0.82rem;
}

/* MudTable styling */
[b-3aekqunyoc] .adm-table {
    border-radius: 10px !important;
    border: 1px solid #e8ecf1 !important;
    overflow: hidden;
    box-shadow: none !important;
}

[b-3aekqunyoc] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-3aekqunyoc] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-3aekqunyoc] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-3aekqunyoc] .adm-table .mud-table-body tr {
    cursor: pointer;
    transition: background 0.12s ease;
}

[b-3aekqunyoc] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-3aekqunyoc] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-3aekqunyoc] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-3aekqunyoc] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

/* ─── Monospace (trigger keys) ─── */
.adm-mono[b-3aekqunyoc] {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #334155;
}

/* Chip styling */
[b-3aekqunyoc] .adm-chip {
    font-size: 0.7rem !important;
    height: 22px !important;
    font-weight: 600 !important;
}

/* WCAG AA contrast fix: white on default green (#4CAF50) = 2.78:1 → #2e7d32 = ~5.5:1 */
[b-3aekqunyoc] .adm-chip.mud-chip-filled.mud-chip-color-success {
    background-color: #2e7d32 !important;
}

/* Empty state */
/* WCAG AA: #64748b on white = ~4.6:1 contrast (passes) */
.adm-empty-state[b-3aekqunyoc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #64748b;
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-3aekqunyoc] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-3aekqunyoc] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-3aekqunyoc] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-3aekqunyoc] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-3aekqunyoc] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-kpi-strip[b-3aekqunyoc] {
        grid-template-columns: repeat(2, 1fr);
    }

    [b-3aekqunyoc] .adm-search-field {
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-3aekqunyoc] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-3aekqunyoc] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-3aekqunyoc] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-3aekqunyoc] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-3aekqunyoc] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-table-container[b-3aekqunyoc] {
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-3aekqunyoc] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    /* WCAG touch target fix: min 44px on mobile */
    [b-3aekqunyoc] .adm-add-btn {
        min-height: 44px !important;
        padding: 8px 16px !important;
    }

    [b-3aekqunyoc] .adm-seed-btn {
        min-height: 44px !important;
        padding: 8px 16px !important;
    }

    [b-3aekqunyoc] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/Emails/EmailTemplates.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Email Templates — Nordic Control Panel Design
   Extends the adm-* base classes from AnalyticsDashboard
   with page-specific etm-* classes.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-q3luxcxf30] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-q3luxcxf30] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-q3luxcxf30] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-q3luxcxf30] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-q3luxcxf30] .adm-breadcrumbs {
    padding: 0;
}

[b-q3luxcxf30] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #475569;
}

[b-q3luxcxf30] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-q3luxcxf30] .adm-breadcrumbs a {
    color: #475569 !important;
    text-decoration: none;
}

[b-q3luxcxf30] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-q3luxcxf30] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-q3luxcxf30] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-q3luxcxf30] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-q3luxcxf30] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-q3luxcxf30] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-q3luxcxf30] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-q3luxcxf30] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-q3luxcxf30] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-q3luxcxf30] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-q3luxcxf30] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* ═══════════════════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════════════════ */
[b-q3luxcxf30] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    padding: 0.375rem 1rem !important;
    min-height: 36px;
}

[b-q3luxcxf30] .adm-outline-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    color: #475569 !important;
    border-color: #d1d5db !important;
    padding: 0.375rem 1rem !important;
    min-height: 36px;
}

[b-q3luxcxf30] .adm-outline-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-q3luxcxf30] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-q3luxcxf30] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-q3luxcxf30] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-q3luxcxf30] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-q3luxcxf30] {
    border-right: none;
}

.adm-kpi:hover[b-q3luxcxf30] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-q3luxcxf30] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-q3luxcxf30] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-q3luxcxf30] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-q3luxcxf30] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   ERROR ALERT
   ═══════════════════════════════════════════════════════ */
.etm-error-alert[b-q3luxcxf30] {
    margin: 0.75rem 1.5rem;
    border-radius: 8px;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header__title[b-q3luxcxf30] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-q3luxcxf30] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   TABLES
   ═══════════════════════════════════════════════════════ */
[b-q3luxcxf30] .adm-table {
    background: #ffffff;
    border-radius: 0;
    box-shadow: none;
}

[b-q3luxcxf30] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-q3luxcxf30] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-q3luxcxf30] .adm-table .mud-table-row {
    cursor: pointer;
}

[b-q3luxcxf30] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-q3luxcxf30] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-q3luxcxf30] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
    font-size: 0.78rem;
}

/* Active row */
[b-q3luxcxf30] .etm-row--active {
    background: rgba(53, 160, 174, 0.06) !important;
    border-left: 3px solid #35a0ae;
}

/* ═══════════════════════════════════════════════════════
   DUAL-PANEL LAYOUT
   ═══════════════════════════════════════════════════════ */
.etm-layout[b-q3luxcxf30] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: calc(100vh - 320px);
}

/* ─── List Panel ─── */
.etm-list-panel[b-q3luxcxf30] {
    background: #ffffff;
    border-right: 1px solid #e8ecf1;
    display: flex;
    flex-direction: column;
}

.etm-list-header[b-q3luxcxf30] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.etm-list-header__left[b-q3luxcxf30] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.etm-list-header__right[b-q3luxcxf30] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

[b-q3luxcxf30] .etm-search-field {
    max-width: 280px;
    min-width: 200px;
}

[b-q3luxcxf30] .etm-search-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-q3luxcxf30] .etm-search-field .mud-input {
    font-size: 0.85rem;
}

/* ─── Editor Panel ─── */
.etm-editor-panel[b-q3luxcxf30] {
    background: #f8f9fb;
    display: flex;
    flex-direction: column;
}

.etm-editor-card[b-q3luxcxf30] {
    display: flex;
    flex-direction: column;
    flex: 1;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.etm-editor-header[b-q3luxcxf30] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f1f5f9;
}

.etm-editor-header__title[b-q3luxcxf30] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    line-height: 1.4;
}

.etm-editor-header__meta[b-q3luxcxf30] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.25rem;
}

.etm-editor-header__sub[b-q3luxcxf30] {
    font-size: 0.78rem;
    color: #64748b;
}

/* Editor Tabs */
[b-q3luxcxf30] .etm-editor-tabs {
    background: transparent;
}

[b-q3luxcxf30] .etm-editor-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    padding: 0 1rem;
    min-height: auto;
}

[b-q3luxcxf30] .etm-editor-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.75rem 1rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.82rem;
    cursor: pointer;
}

[b-q3luxcxf30] .etm-editor-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-q3luxcxf30] .etm-editor-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-q3luxcxf30] .etm-editor-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

[b-q3luxcxf30] .etm-tab-content {
    padding: 0;
}

/* Editor Footer */
.etm-editor-footer[b-q3luxcxf30] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1.5rem;
    background: #fafbfc;
    border-top: 1px solid #f1f5f9;
}

/* ─── Cell Styles ─── */
.etm-cell-name[b-q3luxcxf30] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
}

.etm-cell-subject[b-q3luxcxf30] {
    color: #64748b;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}

.etm-cell-date[b-q3luxcxf30] {
    color: #64748b;
    font-size: 0.8rem;
    font-variant-numeric: tabular-nums;
}

/* ─── Status Chips ─── */
[b-q3luxcxf30] .etm-chip--active {
    color: #15803d !important;
    background: rgba(22, 163, 74, 0.08) !important;
}

[b-q3luxcxf30] .etm-chip--disabled {
    color: #64748b !important;
    background: rgba(100, 116, 139, 0.08) !important;
}

/* ─── Variable Bar ─── */
.etm-variable-bar[b-q3luxcxf30] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 0;
    border-top: 1px solid #f1f5f9;
    margin-top: 0.75rem;
}

.etm-variable-bar__label[b-q3luxcxf30] {
    color: #64748b;
    white-space: nowrap;
    padding-top: 0.375rem;
}

.etm-variable-chips[b-q3luxcxf30] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

[b-q3luxcxf30] .etm-variable-chip {
    cursor: pointer !important;
    border-radius: 8px !important;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.75rem !important;
}

[b-q3luxcxf30] .etm-variable-chip:hover {
    background: rgba(53, 160, 174, 0.08) !important;
}

/* ─── Body Field ─── */
[b-q3luxcxf30] .etm-body-field textarea {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    line-height: 1.6;
}

/* ─── Preview Pane ─── */
.etm-preview-pane[b-q3luxcxf30] {
    padding: 1.5rem;
    min-height: 300px;
}

.etm-preview-subject[b-q3luxcxf30] {
    padding: 0.75rem 1rem;
    background: #f8f9fb;
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    margin-bottom: 1rem;
    font-size: 0.85rem;
    color: #334155;
}

.etm-preview-body[b-q3luxcxf30] {
    padding: 1rem;
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    min-height: 200px;
    font-size: 0.875rem;
    line-height: 1.6;
    color: #1e293b;
    overflow: auto;
}

/* ═══════════════════════════════════════════════════════
   EMPTY STATES
   ═══════════════════════════════════════════════════════ */
.etm-empty-state[b-q3luxcxf30] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    padding: 3rem 2rem;
    text-align: center;
}

.etm-empty-state--compact[b-q3luxcxf30] {
    padding: 2rem 1.5rem;
}

.etm-empty-state__title[b-q3luxcxf30] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
}

.etm-empty-state__sub[b-q3luxcxf30] {
    font-size: 0.82rem;
    color: #64748b;
    max-width: 300px;
    line-height: 1.5;
}

.etm-empty-editor[b-q3luxcxf30] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem 2rem;
    min-height: 400px;
    text-align: center;
}

.etm-empty-editor__title[b-q3luxcxf30] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
}

.etm-empty-editor__sub[b-q3luxcxf30] {
    font-size: 0.85rem;
    color: #64748b;
    max-width: 280px;
    line-height: 1.5;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-q3luxcxf30] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2)[b-q3luxcxf30] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-q3luxcxf30] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-q3luxcxf30] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-q3luxcxf30] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .etm-layout[b-q3luxcxf30] {
        grid-template-columns: 1fr;
    }

    .etm-list-panel[b-q3luxcxf30] {
        border-right: none;
        border-bottom: 1px solid #e8ecf1;
    }

    .etm-empty-editor[b-q3luxcxf30] {
        min-height: 200px;
    }

    [b-q3luxcxf30] .etm-search-field {
        max-width: 100%;
        width: 100%;
    }

    .etm-list-header[b-q3luxcxf30] {
        flex-direction: column;
        align-items: flex-start;
    }

    .etm-list-header__right[b-q3luxcxf30] {
        width: 100%;
        margin-left: 0;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-q3luxcxf30] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-q3luxcxf30] {
        padding: 1rem 0.875rem;
    }

    .adm-page-header__tools[b-q3luxcxf30] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-q3luxcxf30] .adm-add-btn,
    [b-q3luxcxf30] .adm-outline-btn {
        min-height: 44px;
        width: 100%;
    }

    [b-q3luxcxf30] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }

    .etm-list-header[b-q3luxcxf30] {
        padding: 0.875rem;
    }

    .etm-editor-header[b-q3luxcxf30] {
        padding: 0.875rem;
    }

    .etm-editor-footer[b-q3luxcxf30] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-q3luxcxf30] .etm-editor-footer .mud-button-root {
        min-height: 44px;
    }

    .etm-preview-pane[b-q3luxcxf30] {
        padding: 0.875rem;
    }

    .etm-variable-bar[b-q3luxcxf30] {
        flex-direction: column;
        gap: 0.5rem;
    }
}
/* /Components/Pages/Admin/Emails/SendEmail.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Send Email — Nordic Control Panel Extension
   Extends the adm-* base classes from AnalyticsDashboard
   with page-specific se-* classes for the dual-mode
   email/notification testing workspace.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-ryw9cbcr8v] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-ryw9cbcr8v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-ryw9cbcr8v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-ryw9cbcr8v] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-ryw9cbcr8v] .adm-breadcrumbs {
    padding: 0;
}

[b-ryw9cbcr8v] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #475569;
}

[b-ryw9cbcr8v] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-ryw9cbcr8v] .adm-breadcrumbs a {
    color: #475569 !important;
    text-decoration: none;
}

[b-ryw9cbcr8v] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-ryw9cbcr8v] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-ryw9cbcr8v] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-ryw9cbcr8v] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-ryw9cbcr8v] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-ryw9cbcr8v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-ryw9cbcr8v] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-ryw9cbcr8v] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-ryw9cbcr8v] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-ryw9cbcr8v] {
    font-size: 0.82rem;
    color: #475569;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-ryw9cbcr8v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* ═══════════════════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════════════════ */
[b-ryw9cbcr8v] .adm-tool-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.82rem !important;
    border-color: #d1d5db !important;
}

[b-ryw9cbcr8v] .adm-tool-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
    color: #35a0ae !important;
}

[b-ryw9cbcr8v] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-ryw9cbcr8v] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-ryw9cbcr8v] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-ryw9cbcr8v] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-ryw9cbcr8v] {
    border-right: none;
}

.adm-kpi:hover[b-ryw9cbcr8v] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-ryw9cbcr8v] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-ryw9cbcr8v] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-ryw9cbcr8v] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-ryw9cbcr8v] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   MODE SWITCHER — Email / Notification toggle cards
   ═══════════════════════════════════════════════════════ */
.se-mode-strip[b-ryw9cbcr8v] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.se-mode-card[b-ryw9cbcr8v] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 1rem 1.5rem;
    cursor: pointer;
    border-right: 1px solid #f1f5f9;
    transition: all 0.15s ease;
    background: transparent;
    border-bottom: 3px solid transparent;
}

.se-mode-card:last-child[b-ryw9cbcr8v] {
    border-right: none;
}

.se-mode-card:hover[b-ryw9cbcr8v] {
    background: rgba(53, 160, 174, 0.02);
}

.se-mode-card--active[b-ryw9cbcr8v] {
    background: rgba(53, 160, 174, 0.04);
    border-bottom-color: #35a0ae;
}

.se-mode-card__icon[b-ryw9cbcr8v] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #f1f5f9;
    color: #64748b;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.se-mode-card--active .se-mode-card__icon[b-ryw9cbcr8v] {
    background: rgba(53, 160, 174, 0.1);
    color: #35a0ae;
}

.se-mode-card__title[b-ryw9cbcr8v] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.se-mode-card--active .se-mode-card__title[b-ryw9cbcr8v] {
    color: #256f7a;
}

.se-mode-card__sub[b-ryw9cbcr8v] {
    font-size: 0.75rem;
    color: #64748b;
    margin: 0.1rem 0 0;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-ryw9cbcr8v] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-ryw9cbcr8v] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-ryw9cbcr8v] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DUAL-PANEL LAYOUT — Form + Preview side by side
   ═══════════════════════════════════════════════════════ */
.se-layout[b-ryw9cbcr8v] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: calc(100vh - 360px);
}

.se-layout--full[b-ryw9cbcr8v] {
    grid-template-columns: 1fr;
}

/* ─── Form Panel ─── */
.se-form-panel[b-ryw9cbcr8v] {
    background: #ffffff;
    border-right: 1px solid #e8ecf1;
    display: flex;
    flex-direction: column;
}

.se-form-header[b-ryw9cbcr8v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.se-form-header__left[b-ryw9cbcr8v] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.se-form-header__right[b-ryw9cbcr8v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Form Fields */
.se-form-body[b-ryw9cbcr8v] {
    padding: 1.25rem 1.5rem;
    flex: 1;
    overflow-y: auto;
}

.se-form-section[b-ryw9cbcr8v] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.25rem;
    background: #ffffff;
    border-radius: 8px;
    border: 1px solid #e8ecf1;
    margin-bottom: 1rem;
}

[b-ryw9cbcr8v] .se-form-section .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-ryw9cbcr8v] .se-form-section .mud-input {
    font-size: 0.875rem;
    color: #334155 !important;
}

[b-ryw9cbcr8v] .se-form-section .mud-input-label {
    color: #64748b !important;
}

[b-ryw9cbcr8v] .se-form-section .mud-select .mud-input-outlined .mud-input-outlined-border {
    border-radius: 8px;
}

/* Token Area */
.se-token-area[b-ryw9cbcr8v] {
    padding: 1rem;
    border-radius: 8px;
    background: rgba(248, 250, 252, 0.8);
    border: 1px dashed rgba(148, 163, 184, 0.5);
}

.se-token-chips[b-ryw9cbcr8v] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

[b-ryw9cbcr8v] .se-token-chips .mud-chip {
    border-radius: 8px !important;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.75rem !important;
}

.se-token-row[b-ryw9cbcr8v] {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 0.75rem;
    align-items: center;
}

/* Recipients Box */
.se-recipients-box[b-ryw9cbcr8v] {
    padding: 1rem;
    border-radius: 8px;
    background: rgba(53, 160, 174, 0.04);
    border: 1px dashed rgba(53, 160, 174, 0.2);
}

.se-recipients-box--admin[b-ryw9cbcr8v] {
    background: rgba(244, 67, 54, 0.04);
    border-color: rgba(244, 67, 54, 0.2);
}

.se-recipients-box--store[b-ryw9cbcr8v] {
    background: rgba(239, 65, 44, 0.04);
    border-color: rgba(239, 65, 44, 0.2);
}

.se-recipients-chips[b-ryw9cbcr8v] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

[b-ryw9cbcr8v] .se-recipients-chips .mud-chip {
    border-radius: 8px !important;
}

/* Form Footer */
.se-form-footer[b-ryw9cbcr8v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1.5rem;
    background: #fafbfc;
    border-top: 1px solid #f1f5f9;
}

[b-ryw9cbcr8v] .se-form-footer .mud-button-root {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    min-height: 44px !important;
    font-size: 0.875rem !important;
}

/* ─── Preview Panel ─── */
.se-preview-panel[b-ryw9cbcr8v] {
    background: #f8f9fb;
    display: flex;
    flex-direction: column;
}

.se-preview-header[b-ryw9cbcr8v] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
}

.se-preview-header__title[b-ryw9cbcr8v] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    line-height: 1.4;
}

.se-preview-header__sub[b-ryw9cbcr8v] {
    font-size: 0.78rem;
    color: #64748b;
}

/* Preview Tabs */
[b-ryw9cbcr8v] .se-preview-tabs {
    background: transparent;
}

[b-ryw9cbcr8v] .se-preview-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    padding: 0 1rem;
    min-height: auto;
}

[b-ryw9cbcr8v] .se-preview-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.75rem 1rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.82rem;
    cursor: pointer;
}

[b-ryw9cbcr8v] .se-preview-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-ryw9cbcr8v] .se-preview-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-ryw9cbcr8v] .se-preview-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

/* Preview Pane */
.se-preview-pane[b-ryw9cbcr8v] {
    padding: 1.5rem;
    min-height: 300px;
    overflow: auto;
}

.se-preview-subject[b-ryw9cbcr8v] {
    padding: 0.75rem 1rem;
    background: #f8f9fb;
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    margin-bottom: 1rem;
    font-size: 0.85rem;
    color: #334155;
}

.se-preview-body[b-ryw9cbcr8v] {
    padding: 1rem;
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    min-height: 200px;
    font-size: 0.875rem;
    line-height: 1.6;
    color: #1e293b;
    overflow: auto;
}

.se-code-pane[b-ryw9cbcr8v] {
    padding: 1rem;
    background: #1e293b;
    border-radius: 8px;
    overflow: auto;
    max-height: 300px;
}

.se-code-pane pre[b-ryw9cbcr8v] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.78rem;
    line-height: 1.6;
    color: #e2e8f0;
    margin: 0;
    white-space: pre-wrap;
    word-break: break-word;
}

/* ─── Empty Preview ─── */
.se-empty-preview[b-ryw9cbcr8v] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem 2rem;
    min-height: 400px;
    text-align: center;
}

.se-empty-preview__title[b-ryw9cbcr8v] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
}

.se-empty-preview__sub[b-ryw9cbcr8v] {
    font-size: 0.85rem;
    color: #64748b;
    max-width: 280px;
    line-height: 1.5;
}

/* ═══════════════════════════════════════════════════════
   ERROR ALERT
   ═══════════════════════════════════════════════════════ */
.se-error-alert[b-ryw9cbcr8v] {
    margin: 0.75rem 1.5rem;
    border-radius: 8px;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-ryw9cbcr8v] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2)[b-ryw9cbcr8v] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-ryw9cbcr8v] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-ryw9cbcr8v] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-ryw9cbcr8v] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .se-layout[b-ryw9cbcr8v],
    .se-layout--full[b-ryw9cbcr8v] {
        grid-template-columns: 1fr;
    }

    .se-form-panel[b-ryw9cbcr8v] {
        border-right: none;
        border-bottom: 1px solid #e8ecf1;
    }

    .se-empty-preview[b-ryw9cbcr8v] {
        min-height: 200px;
    }

    .se-mode-strip[b-ryw9cbcr8v] {
        grid-template-columns: 1fr;
    }

    .se-mode-card[b-ryw9cbcr8v] {
        border-right: none;
        border-bottom: 1px solid #f1f5f9;
    }

    .se-mode-card:last-child[b-ryw9cbcr8v] {
        border-bottom: none;
    }

    .se-token-row[b-ryw9cbcr8v] {
        grid-template-columns: 1fr;
    }

    .se-form-body[b-ryw9cbcr8v] {
        padding: 1rem;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-ryw9cbcr8v] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-ryw9cbcr8v] {
        padding: 1rem 0.875rem;
    }

    .adm-page-header__tools[b-ryw9cbcr8v] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-ryw9cbcr8v] .adm-tool-btn {
        min-height: 44px;
        width: 100%;
        justify-content: center !important;
    }

    [b-ryw9cbcr8v] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }

    .adm-kpi-strip[b-ryw9cbcr8v] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-ryw9cbcr8v] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-ryw9cbcr8v] {
        border-top: 1px solid #f1f5f9;
    }

    .se-form-body[b-ryw9cbcr8v] {
        padding: 0.875rem;
    }

    .se-form-section[b-ryw9cbcr8v] {
        padding: 1rem;
    }

    .se-form-footer[b-ryw9cbcr8v] {
        flex-direction: column;
        align-items: stretch;
        padding: 0.875rem;
    }

    .se-preview-pane[b-ryw9cbcr8v] {
        padding: 0.875rem;
    }

    .se-form-header[b-ryw9cbcr8v] {
        padding: 0.875rem;
    }

    .se-preview-header[b-ryw9cbcr8v] {
        padding: 0.875rem;
    }
}
/* /Components/Pages/Admin/Features/ManageFeaturePolls.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Feature Polls — Nordic Control Panel
   Inherits from AnalyticsDashboard design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-1ylgtqwqkh] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-1ylgtqwqkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-1ylgtqwqkh] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-1ylgtqwqkh] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-1ylgtqwqkh] .adm-breadcrumbs {
    padding: 0;
}

[b-1ylgtqwqkh] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-1ylgtqwqkh] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-1ylgtqwqkh] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-1ylgtqwqkh] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-1ylgtqwqkh] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-1ylgtqwqkh] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-1ylgtqwqkh] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-1ylgtqwqkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-1ylgtqwqkh] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-1ylgtqwqkh] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-1ylgtqwqkh] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-1ylgtqwqkh] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-1ylgtqwqkh] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Create Button */
[b-1ylgtqwqkh] .adm-create-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em;
    font-size: 0.85rem !important;
}

/* Refresh Button */
[b-1ylgtqwqkh] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-1ylgtqwqkh] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-1ylgtqwqkh] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-1ylgtqwqkh] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-1ylgtqwqkh] {
    border-right: none;
}

.adm-kpi:hover[b-1ylgtqwqkh] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-1ylgtqwqkh] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-1ylgtqwqkh] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-1ylgtqwqkh] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-1ylgtqwqkh] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-1ylgtqwqkh] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-1ylgtqwqkh] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-1ylgtqwqkh] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-1ylgtqwqkh] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-1ylgtqwqkh] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-1ylgtqwqkh] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__number--text[b-1ylgtqwqkh] {
    font-size: 0.85rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 140px;
}

.adm-detail-card__label[b-1ylgtqwqkh] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-1ylgtqwqkh] .adm-tabs {
    background: transparent;
}

[b-1ylgtqwqkh] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-1ylgtqwqkh] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-1ylgtqwqkh] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-1ylgtqwqkh] .adm-tabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-1ylgtqwqkh] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-1ylgtqwqkh] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-1ylgtqwqkh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-1ylgtqwqkh] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-1ylgtqwqkh] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-1ylgtqwqkh] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-1ylgtqwqkh] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-1ylgtqwqkh] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-1ylgtqwqkh] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-1ylgtqwqkh] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLES
   ═══════════════════════════════════════════════════════ */
[b-1ylgtqwqkh] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-1ylgtqwqkh] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-1ylgtqwqkh] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-1ylgtqwqkh] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-1ylgtqwqkh] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-1ylgtqwqkh] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ─── Poll Title & Description ─── */
.adm-poll-title[b-1ylgtqwqkh] {
    font-weight: 600;
    color: #1e293b;
    font-size: 0.85rem;
    line-height: 1.3;
}

.adm-poll-desc[b-1ylgtqwqkh] {
    font-size: 0.78rem;
    color: #64748b;
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.4;
    margin-top: 0.125rem;
}

/* ─── Empty State ─── */
.adm-empty-state[b-1ylgtqwqkh] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 1.5rem;
}

/* ─── Chip contrast fixes (WCAG AA) ─── */
[b-1ylgtqwqkh] .adm-table .mud-chip-color-warning {
    color: #92400e !important;
}

[b-1ylgtqwqkh] .adm-table .mud-chip-color-success {
    color: #15803d !important;
}

[b-1ylgtqwqkh] .adm-table .mud-chip-color-error {
    color: #991b1b !important;
}

[b-1ylgtqwqkh] .adm-table .mud-chip-color-info {
    color: #1e40af !important;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-1ylgtqwqkh] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-1ylgtqwqkh] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-1ylgtqwqkh] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-1ylgtqwqkh] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-1ylgtqwqkh] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-1ylgtqwqkh] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-tab-toolbar[b-1ylgtqwqkh] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-1ylgtqwqkh] {
        width: 100%;
        margin-left: 0;
        flex-wrap: wrap;
    }

    [b-1ylgtqwqkh] .adm-filter-field {
        max-width: 100%;
        width: 100%;
        min-width: 0;
    }

    /* Mobile touch targets 44px */
    [b-1ylgtqwqkh] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }

    /* Refresh button touch target */
    [b-1ylgtqwqkh] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-1ylgtqwqkh] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-1ylgtqwqkh] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-1ylgtqwqkh] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-1ylgtqwqkh] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-tab-toolbar[b-1ylgtqwqkh] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-1ylgtqwqkh] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    /* Overflow for table on mobile */
    [b-1ylgtqwqkh] .adm-table .mud-table-container {
        overflow-x: auto;
    }
}
/* /Components/Pages/Admin/Features/ManageFeatureRequests.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Feature Requests — Nordic Control Panel
   Inherits from AnalyticsDashboard design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-ppxjxgylcl] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-ppxjxgylcl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-ppxjxgylcl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-ppxjxgylcl] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-ppxjxgylcl] .adm-breadcrumbs {
    padding: 0;
}

[b-ppxjxgylcl] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-ppxjxgylcl] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-ppxjxgylcl] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-ppxjxgylcl] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-ppxjxgylcl] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-ppxjxgylcl] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-ppxjxgylcl] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-ppxjxgylcl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-ppxjxgylcl] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-ppxjxgylcl] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-ppxjxgylcl] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-ppxjxgylcl] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-ppxjxgylcl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-ppxjxgylcl] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-ppxjxgylcl] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-ppxjxgylcl] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-ppxjxgylcl] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-ppxjxgylcl] {
    border-right: none;
}

.adm-kpi:hover[b-ppxjxgylcl] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-ppxjxgylcl] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-ppxjxgylcl] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-ppxjxgylcl] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-ppxjxgylcl] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-ppxjxgylcl] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-ppxjxgylcl] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-ppxjxgylcl] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-ppxjxgylcl] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-ppxjxgylcl] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-ppxjxgylcl] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-ppxjxgylcl] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-ppxjxgylcl] .adm-tabs {
    background: transparent;
}

[b-ppxjxgylcl] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-ppxjxgylcl] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-ppxjxgylcl] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-ppxjxgylcl] .adm-tabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-ppxjxgylcl] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-ppxjxgylcl] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-ppxjxgylcl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-ppxjxgylcl] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-ppxjxgylcl] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-ppxjxgylcl] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-ppxjxgylcl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-ppxjxgylcl] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-ppxjxgylcl] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-ppxjxgylcl] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* Category filter */
[b-ppxjxgylcl] .adm-category-filter {
    max-width: 200px;
    min-width: 160px;
}

[b-ppxjxgylcl] .adm-category-filter .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-ppxjxgylcl] .adm-category-filter .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLES
   ═══════════════════════════════════════════════════════ */
[b-ppxjxgylcl] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-ppxjxgylcl] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-ppxjxgylcl] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-ppxjxgylcl] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-ppxjxgylcl] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-ppxjxgylcl] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ─── Request Title & Description ─── */
.adm-req-title[b-ppxjxgylcl] {
    font-weight: 600;
    color: #1e293b;
    font-size: 0.85rem;
    line-height: 1.3;
}

.adm-req-desc[b-ppxjxgylcl] {
    font-size: 0.78rem;
    color: #64748b;
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.4;
    margin-top: 0.125rem;
}

/* ─── Category Tag ─── */
.adm-category-tag[b-ppxjxgylcl] {
    display: inline-block;
    padding: 0.175rem 0.5rem;
    border-radius: 4px;
    background: rgba(53, 160, 174, 0.07);
    color: #0e7490;
    font-size: 0.8rem;
    font-weight: 500;
}

/* ─── Empty State ─── */
.adm-empty-state[b-ppxjxgylcl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 1.5rem;
}

/* ─── Chip contrast fixes (WCAG AA) ─── */
[b-ppxjxgylcl] .adm-table .mud-chip-color-warning {
    color: #92400e !important;
}

[b-ppxjxgylcl] .adm-table .mud-chip-color-success {
    color: #15803d !important;
}

[b-ppxjxgylcl] .adm-table .mud-chip-color-error {
    color: #991b1b !important;
}

[b-ppxjxgylcl] .adm-table .mud-chip-color-info {
    color: #1e40af !important;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-ppxjxgylcl] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-ppxjxgylcl] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-ppxjxgylcl] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-ppxjxgylcl] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-ppxjxgylcl] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-ppxjxgylcl] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-tab-toolbar[b-ppxjxgylcl] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-ppxjxgylcl] {
        width: 100%;
        margin-left: 0;
        flex-wrap: wrap;
    }

    [b-ppxjxgylcl] .adm-filter-field,
    [b-ppxjxgylcl] .adm-category-filter {
        max-width: 100%;
        width: 100%;
        min-width: 0;
    }

    /* Mobile touch targets 44px */
    [b-ppxjxgylcl] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }

    /* Refresh button touch target */
    [b-ppxjxgylcl] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-ppxjxgylcl] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-ppxjxgylcl] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-ppxjxgylcl] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-ppxjxgylcl] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-tab-toolbar[b-ppxjxgylcl] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-ppxjxgylcl] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    /* Overflow for table on mobile */
    [b-ppxjxgylcl] .adm-table .mud-table-container {
        overflow-x: auto;
    }
}
/* /Components/Pages/Admin/Finance/FinanceReports.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Finance Reports — Nordic Control Panel
   Scoped styles extending the admin design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-y4nqgyzfv4] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════ ACTION BAR ═══════════════════ */
.adm-actionbar[b-y4nqgyzfv4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-y4nqgyzfv4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-y4nqgyzfv4] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-y4nqgyzfv4] .adm-breadcrumbs {
    padding: 0;
}

[b-y4nqgyzfv4] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-y4nqgyzfv4] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-y4nqgyzfv4] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-y4nqgyzfv4] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-y4nqgyzfv4] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill--warn[b-y4nqgyzfv4] {
    background: #fef3c7;
    border-color: #fde68a;
    color: #92400e;
}

.adm-status-pill__dot[b-y4nqgyzfv4] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-y4nqgyzfv4] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-y4nqgyzfv4] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════ PAGE HEADER ═══════════════════ */
.adm-page-header[b-y4nqgyzfv4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-y4nqgyzfv4] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-y4nqgyzfv4] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-y4nqgyzfv4] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-y4nqgyzfv4] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-y4nqgyzfv4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Export Button */
[b-y4nqgyzfv4] .adm-export-btn {
    color: #475569 !important;
    border-color: #d1d5db !important;
}

[b-y4nqgyzfv4] .adm-export-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Refresh Button */
[b-y4nqgyzfv4] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-y4nqgyzfv4] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════ ERROR BANNER ═══════════════════ */
.adm-error-banner[b-y4nqgyzfv4] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem 1.5rem;
    background: #fef2f2;
    border-bottom: 1px solid #fecaca;
    color: #b91c1c;
    font-size: 0.82rem;
    font-weight: 500;
}

/* ═══════════════════ KPI STRIP ═══════════════════ */
.adm-kpi-strip[b-y4nqgyzfv4] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-y4nqgyzfv4] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-y4nqgyzfv4] {
    border-right: none;
}

.adm-kpi:hover[b-y4nqgyzfv4] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-y4nqgyzfv4] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-y4nqgyzfv4] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-y4nqgyzfv4] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-y4nqgyzfv4] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════ DETAIL CARDS ═══════════════════ */
.adm-detail-grid[b-y4nqgyzfv4] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-y4nqgyzfv4] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-y4nqgyzfv4] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-y4nqgyzfv4] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-y4nqgyzfv4] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-y4nqgyzfv4] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-y4nqgyzfv4] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════ TABS ═══════════════════ */
[b-y4nqgyzfv4] .adm-tabs {
    background: transparent;
}

[b-y4nqgyzfv4] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-y4nqgyzfv4] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-y4nqgyzfv4] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-y4nqgyzfv4] .adm-tabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-y4nqgyzfv4] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-y4nqgyzfv4] {
    padding: 0;
}

/* ═══════════════════ TAB TOOLBAR ═══════════════════ */
.adm-tab-toolbar[b-y4nqgyzfv4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-y4nqgyzfv4] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-y4nqgyzfv4] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-y4nqgyzfv4] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-y4nqgyzfv4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-y4nqgyzfv4] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-y4nqgyzfv4] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-y4nqgyzfv4] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════ TABLES ═══════════════════ */
[b-y4nqgyzfv4] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-y4nqgyzfv4] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-y4nqgyzfv4] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-y4nqgyzfv4] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-y4nqgyzfv4] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-y4nqgyzfv4] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ─── Monospace ─── */
.adm-mono[b-y4nqgyzfv4] {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
}

/* ─── Empty State ─── */
.adm-empty-state[b-y4nqgyzfv4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1.5rem;
    color: #64748b;
    font-size: 0.875rem;
}

/* ═══════════════════ MUD CHIP WCAG FIX ═══════════════════ */
[b-y4nqgyzfv4] .mud-chip-color-success {
    background-color: #15803d !important;
    color: #ffffff !important;
}

[b-y4nqgyzfv4] .mud-chip-color-error {
    background-color: #b91c1c !important;
    color: #ffffff !important;
}

[b-y4nqgyzfv4] .mud-chip-color-warning {
    background-color: #b45309 !important;
    color: #ffffff !important;
}

[b-y4nqgyzfv4] .mud-chip-color-info {
    background-color: #1d4ed8 !important;
    color: #ffffff !important;
}

/* ═══════════════════ RESPONSIVE ═══════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-y4nqgyzfv4] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-y4nqgyzfv4] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-y4nqgyzfv4] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-y4nqgyzfv4] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-y4nqgyzfv4] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-y4nqgyzfv4] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-y4nqgyzfv4] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-y4nqgyzfv4] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-y4nqgyzfv4] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-y4nqgyzfv4] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-y4nqgyzfv4] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-y4nqgyzfv4] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-y4nqgyzfv4] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-y4nqgyzfv4] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-y4nqgyzfv4] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-tab-toolbar[b-y4nqgyzfv4] {
        flex-direction: column;
        align-items: flex-start;
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-tab-toolbar__right[b-y4nqgyzfv4] {
        width: 100%;
        margin-left: 0;
    }

    [b-y4nqgyzfv4] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    [b-y4nqgyzfv4] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    [b-y4nqgyzfv4] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    [b-y4nqgyzfv4] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/Finance/WalletExplorer.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Wallet Explorer — Nordic Control Panel
   Scoped styles extending the admin design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-jnuc5xawo0] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════ ACTION BAR ═══════════════════ */
.adm-actionbar[b-jnuc5xawo0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-jnuc5xawo0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-jnuc5xawo0] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-jnuc5xawo0] .adm-breadcrumbs {
    padding: 0;
}

[b-jnuc5xawo0] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-jnuc5xawo0] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-jnuc5xawo0] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-jnuc5xawo0] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-jnuc5xawo0] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill--warn[b-jnuc5xawo0] {
    background: #fef3c7;
    border-color: #fde68a;
    color: #92400e;
}

.adm-status-pill__dot[b-jnuc5xawo0] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-jnuc5xawo0] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-jnuc5xawo0] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════ PAGE HEADER ═══════════════════ */
.adm-page-header[b-jnuc5xawo0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-jnuc5xawo0] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-jnuc5xawo0] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-jnuc5xawo0] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-jnuc5xawo0] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-jnuc5xawo0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-jnuc5xawo0] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-jnuc5xawo0] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════ ERROR BANNER ═══════════════════ */
.adm-error-banner[b-jnuc5xawo0] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem 1.5rem;
    background: #fef2f2;
    border-bottom: 1px solid #fecaca;
    color: #b91c1c;
    font-size: 0.82rem;
    font-weight: 500;
}

/* ═══════════════════ KPI STRIP ═══════════════════ */
.adm-kpi-strip[b-jnuc5xawo0] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-jnuc5xawo0] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-jnuc5xawo0] {
    border-right: none;
}

.adm-kpi:hover[b-jnuc5xawo0] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-jnuc5xawo0] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-jnuc5xawo0] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-jnuc5xawo0] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-jnuc5xawo0] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════ DETAIL CARDS ═══════════════════ */
.adm-detail-grid[b-jnuc5xawo0] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-jnuc5xawo0] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-jnuc5xawo0] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-jnuc5xawo0] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-jnuc5xawo0] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-jnuc5xawo0] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-jnuc5xawo0] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════ TABS ═══════════════════ */
[b-jnuc5xawo0] .adm-tabs {
    background: transparent;
}

[b-jnuc5xawo0] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-jnuc5xawo0] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-jnuc5xawo0] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-jnuc5xawo0] .adm-tabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-jnuc5xawo0] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-jnuc5xawo0] {
    padding: 0;
}

/* ═══════════════════ TAB TOOLBAR ═══════════════════ */
.adm-tab-toolbar[b-jnuc5xawo0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-jnuc5xawo0] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-jnuc5xawo0] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-jnuc5xawo0] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-jnuc5xawo0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-jnuc5xawo0] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-jnuc5xawo0] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-jnuc5xawo0] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════ TABLES ═══════════════════ */
[b-jnuc5xawo0] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-jnuc5xawo0] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-jnuc5xawo0] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-jnuc5xawo0] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-jnuc5xawo0] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-jnuc5xawo0] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ─── Monospace ─── */
.adm-mono[b-jnuc5xawo0] {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
}

/* ─── Empty State ─── */
.adm-empty-state[b-jnuc5xawo0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1.5rem;
    color: #64748b;
    font-size: 0.875rem;
}

/* ═══════════════════ BALANCE CELLS ═══════════════════ */
.adm-balance-cell[b-jnuc5xawo0] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.adm-balance-cell__row[b-jnuc5xawo0] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.82rem;
}

.adm-balance-cell__label[b-jnuc5xawo0] {
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 500;
    min-width: 48px;
}

.adm-balance-cell__value[b-jnuc5xawo0] {
    font-weight: 600;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.adm-balance-cell__value--pending[b-jnuc5xawo0] {
    color: #b45309;
}

.adm-balance-cell__value--held[b-jnuc5xawo0] {
    color: #b91c1c;
}

/* ═══════════════════ OWNER CELL ═══════════════════ */
.adm-owner-cell__name[b-jnuc5xawo0] {
    font-weight: 500;
    color: #1e293b;
}

.adm-owner-cell__detail[b-jnuc5xawo0] {
    font-size: 0.78rem;
    color: #64748b;
}

/* ═══════════════════ MUD CHIP WCAG FIX ═══════════════════ */
[b-jnuc5xawo0] .mud-chip-color-success {
    background-color: #15803d !important;
    color: #ffffff !important;
}

[b-jnuc5xawo0] .mud-chip-color-error {
    background-color: #b91c1c !important;
    color: #ffffff !important;
}

[b-jnuc5xawo0] .mud-chip-color-warning {
    background-color: #b45309 !important;
    color: #ffffff !important;
}

[b-jnuc5xawo0] .mud-chip-color-info {
    background-color: #1d4ed8 !important;
    color: #ffffff !important;
}

/* ═══════════════════ DIALOG ═══════════════════ */
[b-jnuc5xawo0] .adm-dialog .mud-dialog-title {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 1.1rem;
    color: #0f172a;
}

.adm-dialog-balance-grid[b-jnuc5xawo0] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    margin-top: 0.5rem;
}

.adm-dialog-balance-item[b-jnuc5xawo0] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.adm-dialog-balance-item__label[b-jnuc5xawo0] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

.adm-dialog-balance-item__value[b-jnuc5xawo0] {
    font-size: 1rem;
    font-weight: 600;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.adm-dialog-section[b-jnuc5xawo0] {
    padding: 1rem;
    background: #f8f9fb;
    border-radius: 8px;
    border: 1px solid #e8ecf1;
}

.adm-dialog-section__title[b-jnuc5xawo0] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #1e293b;
    margin-bottom: 0.5rem;
}

/* ═══════════════════ RESPONSIVE ═══════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-jnuc5xawo0] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-jnuc5xawo0] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-jnuc5xawo0] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-jnuc5xawo0] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-jnuc5xawo0] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-jnuc5xawo0] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-jnuc5xawo0] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-dialog-balance-grid[b-jnuc5xawo0] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-jnuc5xawo0] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-jnuc5xawo0] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-jnuc5xawo0] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-jnuc5xawo0] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-jnuc5xawo0] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-jnuc5xawo0] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-jnuc5xawo0] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-jnuc5xawo0] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-tab-toolbar[b-jnuc5xawo0] {
        flex-direction: column;
        align-items: flex-start;
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-tab-toolbar__right[b-jnuc5xawo0] {
        width: 100%;
        margin-left: 0;
    }

    [b-jnuc5xawo0] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    [b-jnuc5xawo0] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    [b-jnuc5xawo0] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    [b-jnuc5xawo0] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/Finance/WalletMaintenance.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Wallet Maintenance — Nordic Control Panel
   Scoped styles extending the admin design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-eg1x1k4btj] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════ ACTION BAR ═══════════════════ */
.adm-actionbar[b-eg1x1k4btj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-eg1x1k4btj] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-eg1x1k4btj] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-eg1x1k4btj] .adm-breadcrumbs {
    padding: 0;
}

[b-eg1x1k4btj] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-eg1x1k4btj] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-eg1x1k4btj] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-eg1x1k4btj] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-eg1x1k4btj] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill--warn[b-eg1x1k4btj] {
    background: #fef3c7;
    border-color: #fde68a;
    color: #92400e;
}

.adm-status-pill__dot[b-eg1x1k4btj] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-eg1x1k4btj] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-eg1x1k4btj] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════ PAGE HEADER ═══════════════════ */
.adm-page-header[b-eg1x1k4btj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-eg1x1k4btj] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-eg1x1k4btj] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-eg1x1k4btj] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-eg1x1k4btj] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-eg1x1k4btj] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-eg1x1k4btj] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-eg1x1k4btj] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Run Backfill Button */
[b-eg1x1k4btj] .adm-run-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    font-size: 0.85rem !important;
    padding: 0.375rem 1rem !important;
}

/* ═══════════════════ ERROR BANNER ═══════════════════ */
.adm-error-banner[b-eg1x1k4btj] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem 1.5rem;
    background: #fef2f2;
    border-bottom: 1px solid #fecaca;
    color: #b91c1c;
    font-size: 0.82rem;
    font-weight: 500;
}

/* ═══════════════════ KPI STRIP ═══════════════════ */
.adm-kpi-strip[b-eg1x1k4btj] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-eg1x1k4btj] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-eg1x1k4btj] {
    border-right: none;
}

.adm-kpi:hover[b-eg1x1k4btj] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-eg1x1k4btj] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-eg1x1k4btj] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-eg1x1k4btj] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-eg1x1k4btj] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════ SECTION HEADERS ═══════════════════ */
.adm-section-header[b-eg1x1k4btj] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-eg1x1k4btj] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-eg1x1k4btj] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════ DETAIL CARDS ═══════════════════ */
.adm-detail-grid[b-eg1x1k4btj] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-eg1x1k4btj] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-eg1x1k4btj] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-eg1x1k4btj] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-eg1x1k4btj] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-eg1x1k4btj] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-eg1x1k4btj] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════ WARNINGS PANEL ═══════════════════ */
.adm-warnings-panel[b-eg1x1k4btj] {
    margin: 0 1.5rem 1rem;
    border-radius: 10px;
    background: #fffbeb;
    border: 1px solid #fde68a;
    overflow: hidden;
}

.adm-warnings-panel__header[b-eg1x1k4btj] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.125rem;
    background: #fef3c7;
    border-bottom: 1px solid #fde68a;
    color: #92400e;
    font-size: 0.85rem;
    font-weight: 600;
}

.adm-warnings-panel__list[b-eg1x1k4btj] {
    margin: 0;
    padding: 0.75rem 1.125rem 0.75rem 2rem;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.adm-warnings-panel__list li[b-eg1x1k4btj] {
    font-size: 0.82rem;
    color: #92400e;
    line-height: 1.5;
}

/* ═══════════════════ EMPTY STATE ═══════════════════ */
.adm-empty-state[b-eg1x1k4btj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1.5rem;
    color: #64748b;
    font-size: 0.875rem;
}

/* ═══════════════════ RESPONSIVE ═══════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-eg1x1k4btj] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-eg1x1k4btj] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-eg1x1k4btj] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-eg1x1k4btj] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-eg1x1k4btj] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-eg1x1k4btj] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-eg1x1k4btj] {
        grid-template-columns: repeat(3, 1fr);
    }

    /* Touch targets >= 44px for tablet devices */
    [b-eg1x1k4btj] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    [b-eg1x1k4btj] .adm-run-btn {
        min-height: 44px !important;
    }

    [b-eg1x1k4btj] .adm-retry-btn {
        min-height: 44px !important;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-eg1x1k4btj] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-eg1x1k4btj] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-eg1x1k4btj] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-eg1x1k4btj] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-eg1x1k4btj] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-eg1x1k4btj] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-eg1x1k4btj] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-eg1x1k4btj] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-section-header[b-eg1x1k4btj] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-warnings-panel[b-eg1x1k4btj] {
        margin-left: 0.875rem;
        margin-right: 0.875rem;
    }
}
/* /Components/Pages/Admin/Gamification/AchievementAuthoringStudio.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Achievement Studio — Nordic Control Panel Design
   Follows AnalyticsDashboard.razor.css patterns exactly.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-5p0oo1djte] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-5p0oo1djte] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-5p0oo1djte] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-5p0oo1djte] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

[b-5p0oo1djte] .adm-breadcrumbs {
    padding: 0;
}

[b-5p0oo1djte] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-5p0oo1djte] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-5p0oo1djte] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-5p0oo1djte] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

.adm-status-pill[b-5p0oo1djte] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-5p0oo1djte] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-5p0oo1djte] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-5p0oo1djte] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-5p0oo1djte] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-5p0oo1djte] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-5p0oo1djte] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-5p0oo1djte] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-5p0oo1djte] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Buttons */
[b-5p0oo1djte] .adm-add-btn {
    text-transform: none !important;
    font-weight: 600;
    font-size: 0.82rem;
    border-radius: 8px !important;
    letter-spacing: 0;
    min-height: 36px;
}

[b-5p0oo1djte] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-5p0oo1djte] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-5p0oo1djte] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-5p0oo1djte] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-5p0oo1djte] {
    border-right: none;
}

.adm-kpi:hover[b-5p0oo1djte] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-5p0oo1djte] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-5p0oo1djte] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-5p0oo1djte] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-5p0oo1djte] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   ALERT BAR
   ═══════════════════════════════════════════════════════ */
.adm-alert-bar[b-5p0oo1djte] {
    padding: 0.75rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-alert-bar--inline[b-5p0oo1djte] {
    padding: 0 0 0.75rem;
    background: transparent;
    border-bottom: none;
}

[b-5p0oo1djte] .adm-alert {
    border-radius: 8px !important;
}

/* ═══════════════════════════════════════════════════════
   CONTENT AREA — Dual Panel Layout
   ═══════════════════════════════════════════════════════ */
.adm-content[b-5p0oo1djte] {
    padding: 0;
}

.adm-panel[b-5p0oo1djte] {
    background: #ffffff;
    min-height: 400px;
}

.adm-panel--left[b-5p0oo1djte] {
    border-right: 1px solid #e8ecf1;
}

.adm-panel__body[b-5p0oo1djte] {
    padding: 1.25rem 1.5rem 2rem;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-5p0oo1djte] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
    border-bottom: 1px solid #f1f5f9;
}

.adm-section-header__title[b-5p0oo1djte] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__sub[b-5p0oo1djte] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
    margin: 0;
}

/* ═══════════════════════════════════════════════════════
   FIELD ELEMENTS
   ═══════════════════════════════════════════════════════ */
.adm-field-group[b-5p0oo1djte] {
    margin-bottom: 1.25rem;
}

.adm-field-label[b-5p0oo1djte] {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.5rem;
}

.adm-hint[b-5p0oo1djte] {
    font-size: 0.78rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0;
}

.adm-hint--success[b-5p0oo1djte] {
    color: #16a34a;
}

/* Switch rows */
.adm-switch-row[b-5p0oo1djte] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-wrap: wrap;
}

.adm-switch-label[b-5p0oo1djte] {
    font-size: 0.875rem;
    color: #334155;
}

.adm-switch-label--locked[b-5p0oo1djte] {
    color: #94a3b8;
    font-style: italic;
}

/* Select group headers */
[b-5p0oo1djte] .adm-select-group-header {
    font-weight: 600 !important;
    text-transform: uppercase;
    font-size: 0.75rem !important;
    color: #64748b !important;
    pointer-events: none;
}

.adm-select-option[b-5p0oo1djte] {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.adm-select-option__label[b-5p0oo1djte] {
    font-size: 0.875rem;
    color: #334155;
}

.adm-select-option__desc[b-5p0oo1djte] {
    font-size: 0.75rem;
    color: #94a3b8;
}

/* ═══════════════════════════════════════════════════════
   BADGE ICON PICKER
   ═══════════════════════════════════════════════════════ */
[b-5p0oo1djte] .badge-icon-trigger.mud-button-root {
    padding: 0;
    width: 100%;
    justify-content: flex-start;
    background: transparent;
    text-transform: none;
}

.badge-icon-surface[b-5p0oo1djte] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 8px;
    border: 1px solid #d1d5db;
    background: #ffffff;
    padding: 0.75rem 1rem;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    cursor: pointer;
}

.badge-icon-surface:hover[b-5p0oo1djte] {
    border-color: #35a0ae;
    box-shadow: 0 0 0 3px rgba(53, 160, 174, 0.08);
}

.badge-icon-surface__inner[b-5p0oo1djte] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

[b-5p0oo1djte] .badge-icon-avatar {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.badge-icon-meta[b-5p0oo1djte] {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.badge-icon-meta__name[b-5p0oo1djte] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #334155;
}

.badge-icon-meta__hint[b-5p0oo1djte] {
    font-size: 0.75rem;
    color: #94a3b8;
}

/* ═══════════════════════════════════════════════════════
   TABLE (matches Nordic adm-table pattern)
   ═══════════════════════════════════════════════════════ */
[b-5p0oo1djte] .adm-table .mud-table-head {
    background: #f8f9fb;
}

[b-5p0oo1djte] .adm-table .mud-table-head .mud-table-cell {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #475569;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #e8ecf1;
}

[b-5p0oo1djte] .adm-table .mud-table-body .mud-table-cell {
    padding: 0.75rem 1rem;
    vertical-align: top;
    border-bottom: 1px solid #f1f5f9;
    font-size: 0.85rem;
    color: #334155;
}

[b-5p0oo1djte] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

/* Cell text */
.adm-cell-primary[b-5p0oo1djte] {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.4;
}

.adm-cell-secondary[b-5p0oo1djte] {
    display: block;
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.4;
}

.adm-mono[b-5p0oo1djte] {
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.72rem;
}

/* Condition stack */
.adm-condition-stack[b-5p0oo1djte] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.adm-condition-item[b-5p0oo1djte] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
}

.adm-condition-item__content[b-5p0oo1djte] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.adm-compound-operator[b-5p0oo1djte] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding-top: 0.25rem;
    border-top: 1px dashed #e2e8f0;
}

[b-5p0oo1djte] .adm-compound-select {
    max-width: 200px;
}

/* Source stack */
.adm-source-stack[b-5p0oo1djte] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.adm-source-item[b-5p0oo1djte] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* Empty state */
.adm-empty-state[b-5p0oo1djte] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 2rem 1rem;
}

.adm-empty-state__text[b-5p0oo1djte] {
    font-size: 0.85rem;
    color: #64748b;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE BREAKPOINTS
   ═══════════════════════════════════════════════════════ */
@media (max-width: 960px) {
    .adm-page-header[b-5p0oo1djte] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .adm-page-header__tools[b-5p0oo1djte] {
        margin-left: 0;
        width: 100%;
        justify-content: flex-start;
    }

    .adm-kpi-strip[b-5p0oo1djte] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-5p0oo1djte] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-5p0oo1djte] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-panel--left[b-5p0oo1djte] {
        border-right: none;
        border-bottom: 1px solid #e8ecf1;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-5p0oo1djte] {
        padding: 0.5rem 1rem;
    }

    .adm-page-header[b-5p0oo1djte] {
        padding: 1rem;
    }

    .adm-kpi-strip[b-5p0oo1djte] {
        grid-template-columns: 1fr 1fr;
    }

    .adm-kpi[b-5p0oo1djte] {
        padding: 0.75rem 1rem;
    }

    .adm-kpi__value[b-5p0oo1djte] {
        font-size: 1.25rem;
    }

    .adm-alert-bar[b-5p0oo1djte] {
        padding: 0.5rem 1rem;
    }

    .adm-panel__body[b-5p0oo1djte] {
        padding: 1rem;
    }

    .adm-section-header[b-5p0oo1djte] {
        padding: 0.75rem 1rem 0.5rem;
    }

    .adm-switch-row[b-5p0oo1djte] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .badge-icon-surface[b-5p0oo1djte] {
        padding: 0.5rem 0.75rem;
    }

    .badge-icon-meta__hint[b-5p0oo1djte] {
        display: none;
    }
}
/* /Components/Pages/Admin/Gamification/Dialogs/DiscountSimulationDialog.razor.rz.scp.css */
.discount-simulation-dialog[b-y2v5jbcjfb] {
    max-width: 1024px;
}

.discount-simulation-dialog .simulation-card[b-y2v5jbcjfb] {
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(11, 122, 117, 0.07), rgba(11, 122, 117, 0.02));
    border: 1px solid rgba(11, 122, 117, 0.12);
}

.discount-simulation-dialog .simulation-summary-grid .mud-text.h6[b-y2v5jbcjfb] {
    font-weight: 700;
}

.discount-simulation-dialog .simulation-breakdown .mud-list-item[b-y2v5jbcjfb] {
    padding-left: 0;
}

@media (max-width: 600px) {
    .discount-simulation-dialog[b-y2v5jbcjfb] {
        padding: 0 8px;
    }

    .discount-simulation-dialog .simulation-card[b-y2v5jbcjfb] {
        padding: 18px;
    }
}
/* /Components/Pages/Admin/Gamification/GamificationDashboard.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Gamification Command Center — "Nordic Control Panel"
   Matches AnalyticsDashboard + Stores + OrderManagement standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-v8rhpvp8bm] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-v8rhpvp8bm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-v8rhpvp8bm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-v8rhpvp8bm] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-v8rhpvp8bm] .adm-breadcrumbs {
    padding: 0;
}

[b-v8rhpvp8bm] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-v8rhpvp8bm] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-v8rhpvp8bm] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-v8rhpvp8bm] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-v8rhpvp8bm] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-v8rhpvp8bm] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-v8rhpvp8bm] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-v8rhpvp8bm] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-v8rhpvp8bm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-v8rhpvp8bm] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-v8rhpvp8bm] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-v8rhpvp8bm] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-v8rhpvp8bm] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-v8rhpvp8bm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
    flex-wrap: wrap;
}

/* Refresh Button */
[b-v8rhpvp8bm] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-v8rhpvp8bm] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Action Buttons */
[b-v8rhpvp8bm] .adm-action-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-size: 0.8rem !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    padding: 0.375rem 1rem !important;
    box-shadow: none !important;
}

[b-v8rhpvp8bm] .adm-action-btn:hover {
    box-shadow: 0 2px 6px rgba(53, 160, 174, 0.2) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-v8rhpvp8bm] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-v8rhpvp8bm] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-v8rhpvp8bm] {
    border-right: none;
}

.adm-kpi:hover[b-v8rhpvp8bm] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-v8rhpvp8bm] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-v8rhpvp8bm] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-v8rhpvp8bm] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-v8rhpvp8bm] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.adm-kpi__detail[b-v8rhpvp8bm] {
    font-size: 0.72rem;
    color: #64748b;
    font-weight: 400;
}

.adm-kpi__detail--success[b-v8rhpvp8bm] {
    color: #16a34a;
}

.adm-kpi__detail--warn[b-v8rhpvp8bm] {
    color: #d97706;
}

.adm-kpi__detail--error[b-v8rhpvp8bm] {
    color: #dc2626;
}

/* ═══════════════════════════════════════════════════════
   SIGNAL SUMMARY — Compact chip row below KPI
   ═══════════════════════════════════════════════════════ */
.adm-signal-summary[b-v8rhpvp8bm] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-signal-chip[b-v8rhpvp8bm] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.625rem;
    border-radius: 6px;
    background: #f8fafc;
    border: 1px solid #e8ecf1;
    font-size: 0.75rem;
    font-weight: 500;
    color: #475569;
    white-space: nowrap;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-v8rhpvp8bm] .adm-tabs {
    background: transparent;
}

[b-v8rhpvp8bm] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-v8rhpvp8bm] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-v8rhpvp8bm] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-v8rhpvp8bm] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-v8rhpvp8bm] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-v8rhpvp8bm] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-v8rhpvp8bm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-v8rhpvp8bm] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-v8rhpvp8bm] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-v8rhpvp8bm] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-v8rhpvp8bm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
    flex-wrap: wrap;
}

/* ═══════════════════════════════════════════════════════
   FILTER ROW
   ═══════════════════════════════════════════════════════ */
.adm-filter-row[b-v8rhpvp8bm] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

[b-v8rhpvp8bm] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-v8rhpvp8bm] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-v8rhpvp8bm] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

[b-v8rhpvp8bm] .adm-filter-select {
    min-width: 180px;
    max-width: 220px;
}

[b-v8rhpvp8bm] .adm-filter-select .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-v8rhpvp8bm] .adm-filter-select .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
[b-v8rhpvp8bm] .adm-table {
    border-radius: 0 !important;
    border: none !important;
    overflow: hidden;
    box-shadow: none !important;
    background: #ffffff;
}

[b-v8rhpvp8bm] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-v8rhpvp8bm] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-v8rhpvp8bm] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
    vertical-align: top;
}

[b-v8rhpvp8bm] .adm-table .mud-table-body tr {
    transition: background 0.12s ease;
}

[b-v8rhpvp8bm] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-v8rhpvp8bm] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-v8rhpvp8bm] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-v8rhpvp8bm] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

/* ═══════════════════════════════════════════════════════
   SECTION CARD — Flat card panels inside tabs
   ═══════════════════════════════════════════════════════ */
.adm-section[b-v8rhpvp8bm] {
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
}

.adm-section__title[b-v8rhpvp8bm] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section__sub[b-v8rhpvp8bm] {
    font-size: 0.78rem;
    color: #64748b;
    margin: 0.1rem 0 0;
}

/* Card grid for metric panels */
.adm-card-grid[b-v8rhpvp8bm] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0;
}

.adm-card-panel[b-v8rhpvp8bm] {
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    border-right: 1px solid #f1f5f9;
}

.adm-card-panel:nth-child(2n)[b-v8rhpvp8bm] {
    border-right: none;
}

.adm-card-panel__title[b-v8rhpvp8bm] {
    font-size: 0.88rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-card-panel__sub[b-v8rhpvp8bm] {
    font-size: 0.75rem;
    color: #64748b;
    margin: 0.1rem 0 0;
}

/* ═══════════════════════════════════════════════════════
   TITLE CARDS — Grid of gamification title cards
   ═══════════════════════════════════════════════════════ */
.adm-title-grid[b-v8rhpvp8bm] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
}

.adm-title-card[b-v8rhpvp8bm] {
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    padding: 1.25rem;
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
    background: #ffffff;
}

.adm-title-card:hover[b-v8rhpvp8bm] {
    box-shadow: 0 2px 8px rgba(53, 160, 174, 0.08);
    border-color: rgba(53, 160, 174, 0.25);
}

.adm-title-card__header[b-v8rhpvp8bm] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.adm-title-card__name[b-v8rhpvp8bm] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #0f172a;
}

.adm-title-card__status[b-v8rhpvp8bm] {
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

/* Chip groups */
[b-v8rhpvp8bm] .adm-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

[b-v8rhpvp8bm] .adm-chip-row .mud-chip {
    font-size: 0.72rem !important;
    height: 26px !important;
}

/* ═══════════════════════════════════════════════════════
   WEIGHT EDITOR — Trust scoring config
   ═══════════════════════════════════════════════════════ */
.adm-weight-item[b-v8rhpvp8bm] {
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
}

.adm-weight-editor[b-v8rhpvp8bm] {
    padding: 1.25rem;
    border-radius: 10px;
    border: 1px dashed #d1d5db;
    background: #fafbfc;
}

[b-v8rhpvp8bm] .adm-weight-input {
    max-width: 120px;
}

/* Progress bar for weights */
[b-v8rhpvp8bm] .adm-weight-bar {
    margin-top: 0.375rem;
}

/* ═══════════════════════════════════════════════════════
   METRIC CARD — Small stat tiles inside sections
   ═══════════════════════════════════════════════════════ */
.adm-metric-grid[b-v8rhpvp8bm] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 0.75rem;
}

.adm-metric-card[b-v8rhpvp8bm] {
    padding: 1rem;
    border-radius: 10px;
    border: 1px solid #e8ecf1;
    background: #fafbfc;
    transition: border-color 0.15s ease;
}

.adm-metric-card:hover[b-v8rhpvp8bm] {
    border-color: rgba(53, 160, 174, 0.25);
}

.adm-metric-card__value[b-v8rhpvp8bm] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
}

/* ═══════════════════════════════════════════════════════
   CHART PANEL
   ═══════════════════════════════════════════════════════ */
.adm-chart-row[b-v8rhpvp8bm] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0;
}

.adm-chart-panel[b-v8rhpvp8bm] {
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    border-right: 1px solid #f1f5f9;
}

.adm-chart-panel:nth-child(2n)[b-v8rhpvp8bm] {
    border-right: none;
}

.adm-chart-panel__title[b-v8rhpvp8bm] {
    font-size: 0.88rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

/* ═══════════════════════════════════════════════════════
   EMPTY STATE
   ═══════════════════════════════════════════════════════ */
.adm-empty-state[b-v8rhpvp8bm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 1.5rem;
    color: #64748b;
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   ALERT BANNER
   ═══════════════════════════════════════════════════════ */
.adm-alert-banner[b-v8rhpvp8bm] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem 1.5rem;
    font-size: 0.82rem;
    font-weight: 500;
}

.adm-alert-banner--warn[b-v8rhpvp8bm] {
    background: #fefce8;
    border-bottom: 1px solid #fde68a;
    color: #92400e;
}

.adm-alert-banner--info[b-v8rhpvp8bm] {
    background: #eff6ff;
    border-bottom: 1px solid #bfdbfe;
    color: #1e40af;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 1280px
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-v8rhpvp8bm] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-v8rhpvp8bm] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-v8rhpvp8bm] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-title-grid[b-v8rhpvp8bm] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-card-grid[b-v8rhpvp8bm],
    .adm-chart-row[b-v8rhpvp8bm] {
        grid-template-columns: 1fr;
    }

    .adm-card-panel[b-v8rhpvp8bm],
    .adm-chart-panel[b-v8rhpvp8bm] {
        border-right: none;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 960px
   ═══════════════════════════════════════════════════════ */
@media (max-width: 960px) {
    .adm-page-header[b-v8rhpvp8bm] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-v8rhpvp8bm] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-title-grid[b-v8rhpvp8bm] {
        grid-template-columns: repeat(2, 1fr);
    }

    [b-v8rhpvp8bm] .adm-filter-field,
    [b-v8rhpvp8bm] .adm-filter-select {
        max-width: 100%;
        width: 100%;
    }

    [b-v8rhpvp8bm] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    .adm-signal-summary[b-v8rhpvp8bm] {
        gap: 0.5rem;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 600px
   ═══════════════════════════════════════════════════════ */
@media (max-width: 600px) {
    .adm-actionbar[b-v8rhpvp8bm] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-v8rhpvp8bm] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-v8rhpvp8bm] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-v8rhpvp8bm] {
        border-right: none;
    }

    .adm-kpi:nth-child(odd):not(:first-child)[b-v8rhpvp8bm] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-title-grid[b-v8rhpvp8bm] {
        grid-template-columns: 1fr;
        padding: 1rem 0.875rem;
    }

    .adm-section[b-v8rhpvp8bm],
    .adm-card-panel[b-v8rhpvp8bm],
    .adm-chart-panel[b-v8rhpvp8bm] {
        padding: 1rem 0.875rem;
    }

    .adm-filter-row[b-v8rhpvp8bm] {
        padding: 0.625rem 0.875rem;
        gap: 0.5rem;
    }

    [b-v8rhpvp8bm] .adm-filter-field,
    [b-v8rhpvp8bm] .adm-filter-select {
        max-width: 100%;
        min-width: 100%;
        width: 100%;
    }

    .adm-signal-summary[b-v8rhpvp8bm] {
        padding: 0.5rem 0.875rem;
        gap: 0.375rem;
    }

    .adm-signal-chip[b-v8rhpvp8bm] {
        font-size: 0.68rem;
    }

    .adm-alert-banner[b-v8rhpvp8bm] {
        padding: 0.5rem 0.875rem;
        font-size: 0.75rem;
    }

    .adm-tab-toolbar[b-v8rhpvp8bm] {
        padding: 0.75rem 0.875rem;
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-v8rhpvp8bm] {
        width: 100%;
        margin-left: 0;
    }

    [b-v8rhpvp8bm] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.5rem;
    }

    [b-v8rhpvp8bm] .adm-tabs .mud-tab {
        padding: 0.75rem 0.75rem;
        font-size: 0.8rem;
    }

    [b-v8rhpvp8bm] .adm-action-btn {
        width: 100%;
        justify-content: center;
    }

    .adm-metric-grid[b-v8rhpvp8bm] {
        grid-template-columns: 1fr 1fr;
    }

    .adm-weight-item[b-v8rhpvp8bm] {
        padding: 0.875rem;
    }

    .adm-chart-row[b-v8rhpvp8bm] {
        grid-template-columns: 1fr;
    }

    .adm-chart-panel[b-v8rhpvp8bm] {
        border-right: none;
    }
}
/* /Components/Pages/Admin/Gamification/JourneyEditor.razor.rz.scp.css */
.journey-editor-dialog[b-4iw2ae1ip0] {
    min-width: 600px;
}

.journey-editor-dialog .dialog-hero[b-4iw2ae1ip0] {
    background: linear-gradient(90deg, rgba(53, 160, 174, 0.12), rgba(53, 160, 174, 0));
    padding: 1rem 1.25rem;
    border-radius: 16px;
}

.journey-editor-dialog .journey-step-panel[b-4iw2ae1ip0] {
    border-radius: 14px;
    background: rgba(53, 160, 174, 0.05);
    margin-bottom: 0.5rem;
}

.journey-editor-dialog .journey-step-order-controls[b-4iw2ae1ip0] {
    gap: 0.375rem;
}

.journey-editor-dialog .journey-step-order-chip[b-4iw2ae1ip0] {
    font-weight: 600;
    letter-spacing: 0.02em;
}
/* /Components/Pages/Admin/IdentityVerification/AdminIdentityReviews.razor.rz.scp.css */
/* ===================================================
   Admin Identity Reviews - "Nordic Control Panel"
   Matches AnalyticsDashboard admin design standard.
   =================================================== */

/* --- Shell --- */
.adm-shell[b-m2eej6zajy] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ===================================================
   ACTION BAR
   =================================================== */
.adm-actionbar[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-m2eej6zajy] .adm-breadcrumbs {
    padding: 0;
}

[b-m2eej6zajy] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-m2eej6zajy] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-m2eej6zajy] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-m2eej6zajy] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-m2eej6zajy] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill--warn[b-m2eej6zajy] {
    background: #fefce8;
    border-color: #fde68a;
    color: #92400e;
}

.adm-status-pill__dot[b-m2eej6zajy] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-m2eej6zajy] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-m2eej6zajy] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ===================================================
   PAGE HEADER
   =================================================== */
.adm-page-header[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-m2eej6zajy] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-m2eej6zajy] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-m2eej6zajy] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh / tool buttons */
[b-m2eej6zajy] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-m2eej6zajy] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ===================================================
   KPI STRIP
   =================================================== */
.adm-kpi-strip[b-m2eej6zajy] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-m2eej6zajy] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-m2eej6zajy] {
    border-right: none;
}

.adm-kpi:hover[b-m2eej6zajy] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi--alert[b-m2eej6zajy] {
    background: rgba(239, 68, 68, 0.03);
}

.adm-kpi--alert:hover[b-m2eej6zajy] {
    background: rgba(239, 68, 68, 0.06);
}

.adm-kpi__top[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-m2eej6zajy] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-m2eej6zajy] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-m2eej6zajy] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ===================================================
   SECTION HEADERS
   =================================================== */
.adm-section-header[b-m2eej6zajy] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-m2eej6zajy] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-m2eej6zajy] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ===================================================
   DETAIL CARDS
   =================================================== */
.adm-detail-grid[b-m2eej6zajy] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-m2eej6zajy] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-m2eej6zajy] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-m2eej6zajy] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-m2eej6zajy] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-m2eej6zajy] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-m2eej6zajy] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ===================================================
   TAB TOOLBAR
   =================================================== */
.adm-tab-toolbar[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-m2eej6zajy] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-m2eej6zajy] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-m2eej6zajy] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-m2eej6zajy] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-m2eej6zajy] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-m2eej6zajy] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ===================================================
   FILTER BAR
   =================================================== */
.adm-filter-bar[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

[b-m2eej6zajy] .adm-filter-select {
    max-width: 180px;
    min-width: 140px;
}

[b-m2eej6zajy] .adm-filter-select .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-m2eej6zajy] .adm-filter-select .mud-input {
    font-size: 0.85rem;
}

[b-m2eej6zajy] .adm-filter-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
}

/* ===================================================
   BULK ACTIONS BAR
   =================================================== */
.adm-bulk-bar[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: rgba(53, 160, 174, 0.06);
    border-bottom: 1px solid rgba(53, 160, 174, 0.15);
    flex-wrap: wrap;
}

.adm-bulk-bar__text[b-m2eej6zajy] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #0e7490;
}

.adm-bulk-bar__actions[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* ===================================================
   TABLE
   =================================================== */
[b-m2eej6zajy] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-m2eej6zajy] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-m2eej6zajy] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #5f6b7a;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-m2eej6zajy] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-m2eej6zajy] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-m2eej6zajy] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ===================================================
   TABLE CELL COMPONENTS
   =================================================== */

/* User cell */
.adm-user-cell[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-user-name[b-m2eej6zajy] {
    font-weight: 500;
    color: #1e293b;
    display: block;
    font-size: 0.85rem;
}

.adm-user-id[b-m2eej6zajy] {
    font-size: 0.72rem;
    color: #64748b;
    display: block;
}

/* Action buttons */
.adm-action-buttons[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    gap: 0.125rem;
    justify-content: center;
}

/* Monospace */
.adm-mono[b-m2eej6zajy] {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #334155;
}

/* Chip */
[b-m2eej6zajy] .adm-chip {
    font-size: 0.72rem !important;
    height: 24px !important;
    text-transform: none;
}

/* WCAG AA contrast fix: white on MudBlazor Warning (#FF9800) = 2.56:1 -> #e65100 = ~4.6:1 */
[b-m2eej6zajy] .mud-chip-filled.mud-chip-color-warning {
    background-color: #e65100 !important;
}

/* WCAG AA contrast fix: white on MudBlazor Error (#F44336) = 3.0:1 -> #c62828 = ~5.9:1 */
[b-m2eej6zajy] .mud-chip-filled.mud-chip-color-error {
    background-color: #c62828 !important;
}

/* WCAG AA contrast fix: white on MudBlazor Success (#4CAF50) = 2.96:1 -> #15803d = ~5.8:1 */
[b-m2eej6zajy] .mud-chip-filled.mud-chip-color-success {
    background-color: #15803d !important;
}

/* Empty state */
.adm-empty-state[b-m2eej6zajy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2.5rem 1rem;
    color: #64748b;
    font-size: 0.875rem;
}

/* ===================================================
   DIALOG
   =================================================== */
.adm-dialog-content[b-m2eej6zajy] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Status banner */
.adm-dialog-status[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.75rem 1rem;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 500;
}

.adm-dialog-status--success[b-m2eej6zajy] {
    background: rgba(22, 163, 74, 0.06);
    color: #16a34a;
    border: 1px solid rgba(22, 163, 74, 0.15);
}

.adm-dialog-status--error[b-m2eej6zajy] {
    background: rgba(239, 68, 68, 0.06);
    color: #b91c1c;
    border: 1px solid rgba(239, 68, 68, 0.15);
}

.adm-dialog-status--warning[b-m2eej6zajy] {
    background: rgba(245, 158, 11, 0.06);
    color: #92400e;
    border: 1px solid rgba(245, 158, 11, 0.15);
}

.adm-dialog-status--info[b-m2eej6zajy] {
    background: rgba(53, 160, 174, 0.06);
    color: #0e7490;
    border: 1px solid rgba(53, 160, 174, 0.15);
}

/* Dialog sections */
.adm-dialog-section[b-m2eej6zajy] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.adm-dialog-section__header[b-m2eej6zajy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f1f5f9;
}

.adm-dialog-section__header .adm-dialog-section__title[b-m2eej6zajy] {
    padding-bottom: 0;
    border-bottom: none;
}

.adm-dialog-section__title[b-m2eej6zajy] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f1f5f9;
    font-family: 'Montserrat', sans-serif;
}

/* Dialog grid */
.adm-dialog-grid[b-m2eej6zajy] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.adm-dialog-field[b-m2eej6zajy] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.adm-dialog-field__label[b-m2eej6zajy] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 600;
}

.adm-dialog-field__value[b-m2eej6zajy] {
    font-size: 0.85rem;
    color: #1e293b;
    word-break: break-word;
}

/* Timeline items */
.adm-timeline-item[b-m2eej6zajy] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-timeline-date[b-m2eej6zajy] {
    font-weight: 600;
    font-size: 0.85rem;
    color: #1e293b;
}

.adm-timeline-detail[b-m2eej6zajy] {
    font-size: 0.78rem;
    color: #64748b;
}

/* ===================================================
   RESPONSIVE
   =================================================== */
@media (max-width: 1280px) {
    .adm-detail-grid[b-m2eej6zajy] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-m2eej6zajy] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-m2eej6zajy] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-m2eej6zajy] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-m2eej6zajy] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-m2eej6zajy] {
        margin-left: 0;
        width: 100%;
    }

    .adm-dialog-grid[b-m2eej6zajy] {
        grid-template-columns: 1fr;
    }

    .adm-filter-bar[b-m2eej6zajy] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-m2eej6zajy] .adm-filter-select {
        max-width: 100%;
    }

    .adm-bulk-bar[b-m2eej6zajy] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-bulk-bar__actions[b-m2eej6zajy] {
        margin-left: 0;
        flex-wrap: wrap;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-m2eej6zajy] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-m2eej6zajy] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-m2eej6zajy] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-m2eej6zajy] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-m2eej6zajy],
    .adm-tab-toolbar[b-m2eej6zajy],
    .adm-filter-bar[b-m2eej6zajy] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-tab-toolbar[b-m2eej6zajy] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-m2eej6zajy] {
        width: 100%;
        margin-left: 0;
    }

    [b-m2eej6zajy] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    .adm-bulk-bar[b-m2eej6zajy] {
        padding: 0.625rem 0.875rem;
    }

    /* WCAG touch target fix: ensure 44px minimum on mobile */
    [b-m2eej6zajy] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    [b-m2eej6zajy] .adm-filter-btn {
        min-height: 44px !important;
    }

    [b-m2eej6zajy] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    .adm-action-buttons[b-m2eej6zajy] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Admin/Identity/ApplicationRoles.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Application Roles — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard / ApplicationUsers (Test-204/205/206) admin standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-se0i0khdru] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-se0i0khdru] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-se0i0khdru] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-se0i0khdru] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-se0i0khdru] .adm-breadcrumbs {
    padding: 0;
}

[b-se0i0khdru] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-se0i0khdru] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-se0i0khdru] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-se0i0khdru] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-se0i0khdru] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-se0i0khdru] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-se0i0khdru] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-se0i0khdru] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-se0i0khdru] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-se0i0khdru] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-se0i0khdru] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-se0i0khdru] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-se0i0khdru] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add Button — 44px touch target per WCAG 2.5.5 */
[b-se0i0khdru] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
    font-size: 0.82rem !important;
    min-height: 44px !important;
    padding: 0.4rem 1rem !important;
}

/* Refresh Button */
[b-se0i0khdru] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-se0i0khdru] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Progress bar */
[b-se0i0khdru] .adm-progress {
    border-radius: 0 !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-se0i0khdru] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-se0i0khdru] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-se0i0khdru] {
    border-right: none;
}

.adm-kpi:hover[b-se0i0khdru] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-se0i0khdru] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-se0i0khdru] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.85;
}

/* Semantic icon colours — replaces inline Style="color:#..." (Test-206 H-1 pattern). */
[b-se0i0khdru] .adm-kpi__icon--total { color: #35a0ae !important; }            /* brand teal — primary metric */
[b-se0i0khdru] .adm-kpi__icon--assignments { color: #8b5cf6 !important; }      /* violet — neutral aggregation */
[b-se0i0khdru] .adm-kpi__icon--largest { color: #16a34a !important; }          /* green — "biggest" reads positive */

.adm-kpi__label[b-se0i0khdru] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-se0i0khdru] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.adm-kpi__value--text[b-se0i0khdru] {
    font-size: 1.1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ═══════════════════════════════════════════════════════
   ERROR ALERT
   ═══════════════════════════════════════════════════════ */
.adm-alert-wrap[b-se0i0khdru] {
    padding: 0.75rem 1.5rem;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR — Search/filter bar above table
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-se0i0khdru] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-se0i0khdru] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-se0i0khdru] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-se0i0khdru] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-se0i0khdru] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-se0i0khdru] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-se0i0khdru] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-se0i0khdru] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
[b-se0i0khdru] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-se0i0khdru] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-se0i0khdru] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-se0i0khdru] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-se0i0khdru] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-se0i0khdru] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* Header alignment helpers — replaces inline Style="text-align:center" / Style="width:50px" */
[b-se0i0khdru] .adm-table .adm-th-center,
[b-se0i0khdru] .adm-table .adm-td-center {
    text-align: center;
}

[b-se0i0khdru] .adm-table .adm-th-action {
    width: 50px;
}

/* ─── Role Name Cell ─── */
.adm-role-name-cell[b-se0i0khdru] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

[b-se0i0khdru] .adm-role-icon {
    color: #64748b;
    font-size: 1.125rem !important;
}

.adm-role-name[b-se0i0khdru] {
    font-weight: 500;
    color: #1e293b;
}

/* System role badge — visual cue alongside disabled delete */
.adm-role-system-badge[b-se0i0khdru] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    border-radius: 999px;
    background: rgba(53, 160, 174, 0.08);
    color: #1d707b;
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
    margin-left: 0.25rem;
}

/* ─── Count Chip ─── */
[b-se0i0khdru] .adm-count-chip {
    margin: 0 !important;
    height: 24px !important;
    font-size: 0.75rem !important;
}

.adm-zero-count[b-se0i0khdru] {
    color: #64748b;
    font-size: 0.875rem;
}

/* ─── Delete Button — 44px touch when enabled, dimmed when disabled (system role) ─── */
[b-se0i0khdru] .adm-delete-btn {
    min-width: 44px !important;
    min-height: 44px !important;
}

[b-se0i0khdru] .adm-delete-btn.mud-button-disabled {
    opacity: 0.35 !important;
    cursor: not-allowed;
}

/* ─── Empty State — semantic spans (Test-206 H-1 / ACC pattern) ─── */
.adm-empty-state[b-se0i0khdru] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2.5rem 1rem;
    text-align: center;
}

[b-se0i0khdru] .adm-empty-state__icon {
    color: #94a3b8;
}

.adm-empty-state__title[b-se0i0khdru] {
    font-size: 1rem;
    font-weight: 500;
    color: #475569;
    font-family: 'Montserrat', sans-serif;
}

.adm-empty-state__body[b-se0i0khdru] {
    font-size: 0.875rem;
    color: #64748b;
    font-family: 'Montserrat', sans-serif;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 960px) {
    .adm-page-header[b-se0i0khdru] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-se0i0khdru] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-se0i0khdru] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2)[b-se0i0khdru] {
        border-right: none;
    }

    .adm-kpi:nth-child(3)[b-se0i0khdru] {
        grid-column: 1 / -1;
        border-right: none;
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-se0i0khdru] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-se0i0khdru] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-se0i0khdru] {
        grid-template-columns: 1fr;
    }

    .adm-kpi[b-se0i0khdru] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+2)[b-se0i0khdru] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(3)[b-se0i0khdru] {
        grid-column: auto;
    }

    .adm-alert-wrap[b-se0i0khdru] {
        padding: 0.5rem 0.875rem;
    }

    .adm-tab-toolbar[b-se0i0khdru] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-se0i0khdru] {
        width: 100%;
        margin-left: 0;
    }

    [b-se0i0khdru] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    .adm-status-pill[b-se0i0khdru] {
        font-size: 0.7rem;
    }

    /* Mobile stacked-row treatment (Test-206 M-5 parity). */
    [b-se0i0khdru] .adm-table .mud-table-cell {
        padding: 0.5rem 0.875rem !important;
    }

    [b-se0i0khdru] .adm-table .mud-table-cell::before {
        font-weight: 600 !important;
        color: #475569 !important;
    }

    [b-se0i0khdru] .adm-table .adm-td-center {
        text-align: right;
    }
}

/* ═══════════════════════════════════════════════════════
   Reduced motion (Test-206 L-2 parity)
   ═══════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-se0i0khdru] {
        transition: none;
    }
}
/* /Components/Pages/Admin/Identity/ApplicationUsers.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Application Users — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard as the admin page standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-uyu8xefeen] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-uyu8xefeen] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-uyu8xefeen] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-uyu8xefeen] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-uyu8xefeen] .adm-breadcrumbs {
    padding: 0;
}

[b-uyu8xefeen] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-uyu8xefeen] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-uyu8xefeen] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-uyu8xefeen] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-uyu8xefeen] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-uyu8xefeen] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-uyu8xefeen] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-uyu8xefeen] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-uyu8xefeen] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-uyu8xefeen] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-uyu8xefeen] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-uyu8xefeen] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-uyu8xefeen] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add User Button */
[b-uyu8xefeen] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
    font-size: 0.82rem !important;
}

/* Refresh Button */
[b-uyu8xefeen] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px;
    min-height: 44px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-uyu8xefeen] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-uyu8xefeen] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-uyu8xefeen] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-uyu8xefeen] {
    border-right: none;
}

.adm-kpi:hover[b-uyu8xefeen] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-uyu8xefeen] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-uyu8xefeen] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-uyu8xefeen] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-uyu8xefeen] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   ERROR ALERT
   ═══════════════════════════════════════════════════════ */
.adm-alert-wrap[b-uyu8xefeen] {
    padding: 0.75rem 1.5rem;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR — Search/filter bar above table
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-uyu8xefeen] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-uyu8xefeen] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-uyu8xefeen] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-uyu8xefeen] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-uyu8xefeen] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-uyu8xefeen] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-uyu8xefeen] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-uyu8xefeen] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
[b-uyu8xefeen] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-uyu8xefeen] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-uyu8xefeen] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-uyu8xefeen] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-uyu8xefeen] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-uyu8xefeen] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* Clickable row cursor */
[b-uyu8xefeen] .adm-clickable-row {
    cursor: pointer;
}

/* ─── Username styling ─── */
.adm-username[b-uyu8xefeen] {
    font-weight: 500;
    color: #1e293b;
}

/* ─── Monospace ─── */
.adm-mono[b-uyu8xefeen] {
    display: inline-block;
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    max-width: 250px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #334155;
}

/* ─── Empty State ─── */
.adm-empty-state[b-uyu8xefeen] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2.5rem 1rem;
    text-align: center;
}

[b-uyu8xefeen] .adm-empty-state__icon {
    color: #94a3b8;
}

.adm-empty-state__title[b-uyu8xefeen] {
    font-size: 1rem;
    font-weight: 500;
    color: #475569;
    font-family: 'Montserrat', sans-serif;
}

.adm-empty-state__body[b-uyu8xefeen] {
    font-size: 0.875rem;
    color: #64748b;
    font-family: 'Montserrat', sans-serif;
}

/* ─── Role Chips & cell ─── */
[b-uyu8xefeen] .adm-role-chip {
    margin: 1px !important;
    height: 22px !important;
    font-size: 0.7rem !important;
}

.adm-roles-cell[b-uyu8xefeen] {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    align-items: center;
}

.adm-roles-empty[b-uyu8xefeen] {
    color: #94a3b8;
    font-size: 0.85rem;
}

/* ─── Status icons ─── */
[b-uyu8xefeen] .adm-status-icon {
    font-size: 18px !important;
}

[b-uyu8xefeen] .adm-status-icon--ok {
    color: #16a34a !important;
}

[b-uyu8xefeen] .adm-status-icon--bad {
    color: #dc2626 !important;
}

/* ─── Header / cell alignment helpers (replaces inline Style="text-align:center;") ─── */
[b-uyu8xefeen] .adm-table .adm-th-center,
[b-uyu8xefeen] .adm-table .adm-td-center {
    text-align: center;
}

[b-uyu8xefeen] .adm-table .adm-th-action {
    width: 50px;
}

/* ─── KPI icon brand variants (replaces inline Style="color:#xxx") ─── */
[b-uyu8xefeen] .adm-kpi__icon--total { color: #35a0ae !important; }
[b-uyu8xefeen] .adm-kpi__icon--verified { color: #16a34a !important; }
[b-uyu8xefeen] .adm-kpi__icon--email { color: #3b82f6 !important; }
[b-uyu8xefeen] .adm-kpi__icon--phone { color: #f59e0b !important; }
/* Identity KPI: was #EF412c (Rently brand red — Test-204 brand-trap precedent: positive metric must not signal error).
   Swapped for warm-amber-violet #8b5cf6 to differentiate from Phone (#f59e0b) and clearly read as a verification step. */
[b-uyu8xefeen] .adm-kpi__icon--identity { color: #8b5cf6 !important; }

/* Add User button must clear WCAG 2.5.5 (44x44) at every viewport — Size.Medium gives ~36px,
   we lock min-height to 44px so the touch target is always compliant. */
[b-uyu8xefeen] .adm-add-btn {
    min-height: 44px;
    padding: 0.4rem 1rem !important;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-uyu8xefeen] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-uyu8xefeen] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-uyu8xefeen] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-uyu8xefeen] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-uyu8xefeen] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-uyu8xefeen] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-uyu8xefeen] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-uyu8xefeen] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-uyu8xefeen] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-uyu8xefeen] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-uyu8xefeen] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-uyu8xefeen] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-uyu8xefeen] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-uyu8xefeen] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-uyu8xefeen] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-uyu8xefeen] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-uyu8xefeen] {
        grid-column: 1 / -1;
    }

    .adm-alert-wrap[b-uyu8xefeen] {
        padding: 0.5rem 0.875rem;
    }

    .adm-tab-toolbar[b-uyu8xefeen] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-uyu8xefeen] {
        width: 100%;
        margin-left: 0;
    }

    [b-uyu8xefeen] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    /* On mobile MudTable's Breakpoint.Sm collapse renders each row as
       label-on-left / value-on-right pairs. With value-only icons, the labels
       get plenty of breathing room but the pair must still align cleanly. */
    [b-uyu8xefeen] .adm-table .mud-table-cell {
        padding: 0.5rem 0.875rem !important;
    }

    [b-uyu8xefeen] .adm-table .mud-table-cell::before {
        font-weight: 600;
        color: #475569;
    }

    /* Centered status cells flow back to right-aligned in stacked mobile mode */
    [b-uyu8xefeen] .adm-table .adm-td-center {
        text-align: right;
    }

    .adm-roles-cell[b-uyu8xefeen] {
        justify-content: flex-end;
    }

    /* Action bar status pill should stay readable on narrow widths */
    .adm-status-pill[b-uyu8xefeen] {
        font-size: 0.7rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-uyu8xefeen] {
        transition: none;
    }
}
/* /Components/Pages/Admin/Identity/UserEditorDialog.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   User Editor Dialog — Nordic Control Panel
   Scoped to UserEditorDialog component.
   ═══════════════════════════════════════════════════════ */

.adm-dialog-title[b-8hchfmq3vd] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* ─── Form Cards with Accent Bar ─── */
.adm-form-card[b-8hchfmq3vd] {
    display: flex;
    border-radius: 8px;
    border: 1px solid #e8ecf1;
    background: #ffffff;
    margin-bottom: 1rem;
    overflow: hidden;
}

.adm-form-card--last[b-8hchfmq3vd] {
    margin-bottom: 0;
}

.adm-form-card__bar[b-8hchfmq3vd] {
    width: 4px;
    flex-shrink: 0;
}

.adm-form-card__bar--teal[b-8hchfmq3vd] {
    background: #35a0ae;
}

.adm-form-card__bar--blue[b-8hchfmq3vd] {
    background: #3b82f6;
}

.adm-form-card__bar--purple[b-8hchfmq3vd] {
    background: #8b5cf6;
}

.adm-form-card__bar--amber[b-8hchfmq3vd] {
    background: #f59e0b;
}

.adm-form-card__body[b-8hchfmq3vd] {
    flex: 1;
    padding: 1rem 1.25rem;
}

/* ─── Section Title ─── */
.adm-dialog-section__title[b-8hchfmq3vd] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 0.75rem;
}

/* ─── Two-Column Row ─── */
.adm-form-row[b-8hchfmq3vd] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

/* ─── Role Preview ─── */
.adm-role-preview[b-8hchfmq3vd] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    margin-top: 0.75rem;
}

[b-8hchfmq3vd] .adm-role-chip {
    margin: 0 !important;
    height: 24px !important;
    font-size: 0.72rem !important;
}

/* ─── Toggle Grid ─── */
.adm-toggle-grid[b-8hchfmq3vd] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.adm-toggle-row[b-8hchfmq3vd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 0;
    border-bottom: 1px solid #f8f9fb;
}

.adm-toggle-row:last-child[b-8hchfmq3vd] {
    border-bottom: none;
}

.adm-toggle-row__info[b-8hchfmq3vd] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.adm-toggle-row__label[b-8hchfmq3vd] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #1e293b;
}

.adm-toggle-row__hint[b-8hchfmq3vd] {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.3;
}

/* ═══════════════════ Responsive ═══════════════════ */
@media (max-width: 960px) {
    /* Ensure dialog action buttons meet 44px touch target on tablet/mobile */
    [b-8hchfmq3vd] .mud-dialog-actions .mud-button-root {
        min-height: 44px !important;
    }
}

@media (max-width: 600px) {
    .adm-form-row[b-8hchfmq3vd] {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .adm-form-card__body[b-8hchfmq3vd] {
        padding: 0.875rem 1rem;
    }

    .adm-toggle-row[b-8hchfmq3vd] {
        gap: 0.5rem;
    }
}
/* /Components/Pages/Admin/Index.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Admin Dashboard — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard as the admin page standard.
   Test-205 (2026-05-05) refresh: refresh button 44×44 WCAG,
   inline-style → semantic CSS class migration, status-pill
   timestamp slot, prefers-reduced-motion guard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-lwlp8fdkxs] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-lwlp8fdkxs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-lwlp8fdkxs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-lwlp8fdkxs] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-lwlp8fdkxs] .adm-breadcrumbs {
    padding: 0;
}

[b-lwlp8fdkxs] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-lwlp8fdkxs] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-lwlp8fdkxs] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-lwlp8fdkxs] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-lwlp8fdkxs] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-lwlp8fdkxs] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-lwlp8fdkxs] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__time[b-lwlp8fdkxs] {
    font-variant-numeric: tabular-nums;
    color: #64748b;
    border-left: 1px solid #e2e8f0;
    padding-left: 0.5rem;
    margin-left: 0.125rem;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-lwlp8fdkxs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-lwlp8fdkxs] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-lwlp8fdkxs] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-lwlp8fdkxs] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-lwlp8fdkxs] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-lwlp8fdkxs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button — 44×44 WCAG 2.5.5 touch target */
[b-lwlp8fdkxs] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    width: 44px;
    height: 44px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-lwlp8fdkxs] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-lwlp8fdkxs] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

/* Loading bar */
.adm-progress[b-lwlp8fdkxs] {
    border-radius: 0;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-lwlp8fdkxs] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-lwlp8fdkxs] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-lwlp8fdkxs] {
    border-right: none;
}

.adm-kpi:hover[b-lwlp8fdkxs] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-lwlp8fdkxs] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-lwlp8fdkxs] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.85;
}

/* Per-KPI icon colours — was inline style="color: …" */
.adm-kpi--tickets[b-lwlp8fdkxs]  .adm-kpi__icon { color: #f59e0b; }
.adm-kpi--users[b-lwlp8fdkxs]  .adm-kpi__icon { color: #35a0ae; }
.adm-kpi--stores[b-lwlp8fdkxs]  .adm-kpi__icon { color: #3b82f6; }
.adm-kpi--rentals[b-lwlp8fdkxs]  .adm-kpi__icon { color: #16a34a; }
.adm-kpi--ambassadors[b-lwlp8fdkxs]  .adm-kpi__icon { color: #f59e0b; }

.adm-kpi__label[b-lwlp8fdkxs] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-lwlp8fdkxs] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-lwlp8fdkxs] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-lwlp8fdkxs] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-lwlp8fdkxs] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS — Ticket breakdown cards
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-lwlp8fdkxs] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-lwlp8fdkxs] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-lwlp8fdkxs] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-lwlp8fdkxs] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

/* Bar colours — was inline style="background: …".
   Switched open from brand red #EF412c → amber #f59e0b
   per Test-204 brand-red-trap precedent. */
.adm-detail-card__bar--open[b-lwlp8fdkxs] { background: #f59e0b; }
.adm-detail-card__bar--closed[b-lwlp8fdkxs] { background: #16a34a; }

[b-lwlp8fdkxs] .adm-detail-card__icon--open { color: #f59e0b !important; }
[b-lwlp8fdkxs] .adm-detail-card__icon--closed { color: #16a34a !important; }

.adm-detail-card__data[b-lwlp8fdkxs] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-lwlp8fdkxs] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-lwlp8fdkxs] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

.adm-detail-card__meta[b-lwlp8fdkxs] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-left: auto;
    flex-shrink: 0;
}

/* ─── Badge chips ─── */
.adm-badge[b-lwlp8fdkxs] {
    display: inline-block;
    padding: 0.125rem 0.5rem;
    border-radius: 10px;
    font-size: 0.68rem;
    font-weight: 600;
    white-space: nowrap;
}

.adm-badge--open[b-lwlp8fdkxs] {
    background: rgba(245, 158, 11, 0.1);
    color: #b45309;
}

.adm-badge--closed[b-lwlp8fdkxs] {
    background: rgba(22, 163, 74, 0.08);
    color: #16a34a;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
.adm-table-wrap[b-lwlp8fdkxs] {
    padding: 0 1.5rem 1.5rem;
}

[b-lwlp8fdkxs] .adm-table {
    background: #ffffff;
    border-radius: 10px;
    border: 1px solid #e8ecf1;
    overflow: hidden;
}

[b-lwlp8fdkxs] .adm-table .mud-table-container {
    border-radius: 10px;
}

[b-lwlp8fdkxs] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-lwlp8fdkxs] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-lwlp8fdkxs] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-lwlp8fdkxs] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* Table cell helpers — was inline color styles */
[b-lwlp8fdkxs] .adm-table__row-icon { color: #64748b !important; }
.adm-table__zero[b-lwlp8fdkxs] { color: #6b7280; }
.adm-table__closed[b-lwlp8fdkxs] { color: #15803d; font-weight: 500; }

/* ═══════════════════════════════════════════════════════
   QUICK ACTION CARDS
   ═══════════════════════════════════════════════════════ */
.adm-actions-grid[b-lwlp8fdkxs] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1.5rem;
}

a.adm-action-card[b-lwlp8fdkxs] {
    text-decoration: none;
    color: inherit;
}

.adm-action-card[b-lwlp8fdkxs] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    cursor: pointer;
    transition: box-shadow 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
    min-height: 74px;
}

.adm-action-card:hover[b-lwlp8fdkxs] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
    border-color: rgba(53, 160, 174, 0.25);
    transform: translateY(-1px);
}

.adm-action-card:focus-visible[b-lwlp8fdkxs] {
    box-shadow: 0 0 0 2px rgba(53, 160, 174, 0.3);
    border-color: rgba(53, 160, 174, 0.4);
    outline: none;
}

.adm-action-card__icon[b-lwlp8fdkxs] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    flex-shrink: 0;
}

/* Per-action icon styling — was inline style="background:…; color:…" */
.adm-action-card__icon--analytics[b-lwlp8fdkxs] { background: rgba(53, 160, 174, 0.08); color: #35a0ae; }
.adm-action-card__icon--users[b-lwlp8fdkxs] { background: rgba(59, 130, 246, 0.08); color: #3b82f6; }
.adm-action-card__icon--brand[b-lwlp8fdkxs] { background: rgba(239, 65, 44, 0.08); color: #EF412c; }
.adm-action-card__icon--verify[b-lwlp8fdkxs] { background: rgba(22, 163, 74, 0.08); color: #16a34a; }
.adm-action-card__icon--diagnostics[b-lwlp8fdkxs] { background: rgba(245, 158, 11, 0.08); color: #f59e0b; }
.adm-action-card__icon--support[b-lwlp8fdkxs] { background: rgba(139, 92, 246, 0.08); color: #8b5cf6; }

.adm-action-card__body[b-lwlp8fdkxs] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    flex: 1;
}

.adm-action-card__title[b-lwlp8fdkxs] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.3;
}

.adm-action-card__desc[b-lwlp8fdkxs] {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.4;
}

[b-lwlp8fdkxs] .adm-action-card__chevron {
    color: #94a3b8 !important;
    transition: transform 0.15s ease;
}

.adm-action-card:hover[b-lwlp8fdkxs]  .adm-action-card__chevron {
    transform: translateX(2px);
    color: #35a0ae !important;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-lwlp8fdkxs] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-actions-grid[b-lwlp8fdkxs] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-lwlp8fdkxs] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-lwlp8fdkxs] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-lwlp8fdkxs] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-actions-grid[b-lwlp8fdkxs] {
        grid-template-columns: 1fr;
    }

    .adm-page-header[b-lwlp8fdkxs] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-lwlp8fdkxs] {
        margin-left: 0;
        width: 100%;
        justify-content: flex-end;
    }

    .adm-kpi-strip[b-lwlp8fdkxs] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-lwlp8fdkxs] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-lwlp8fdkxs] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-lwlp8fdkxs] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-lwlp8fdkxs] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-lwlp8fdkxs] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-lwlp8fdkxs] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-lwlp8fdkxs] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-lwlp8fdkxs] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-lwlp8fdkxs] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-lwlp8fdkxs] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-lwlp8fdkxs] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-lwlp8fdkxs] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-lwlp8fdkxs] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-actions-grid[b-lwlp8fdkxs] {
        padding: 0 0.875rem 1.25rem;
    }

    .adm-section-header[b-lwlp8fdkxs] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-table-wrap[b-lwlp8fdkxs] {
        padding: 0 0.875rem 1.25rem;
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .adm-action-card[b-lwlp8fdkxs],
    [b-lwlp8fdkxs] .adm-action-card__chevron,
    .adm-detail-card[b-lwlp8fdkxs],
    .adm-kpi[b-lwlp8fdkxs] {
        transition: none !important;
    }

    .adm-action-card:hover[b-lwlp8fdkxs] {
        transform: none;
    }
}
/* /Components/Pages/Admin/Insurance/InsuranceHub.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Insurance Hub — Nordic Control Panel
   Scoped styles for /admin/insurance-hub
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-5nytcrrqeq] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════ ACTION BAR ═══════════════════ */
.adm-actionbar[b-5nytcrrqeq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-5nytcrrqeq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-5nytcrrqeq] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

[b-5nytcrrqeq] .adm-breadcrumbs {
    padding: 0;
}

[b-5nytcrrqeq] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-5nytcrrqeq] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-5nytcrrqeq] .adm-breadcrumbs a {
    color: #475569 !important;
    text-decoration: none;
}

[b-5nytcrrqeq] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* ─── Status Pill ─── */
.adm-status-pill[b-5nytcrrqeq] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-5nytcrrqeq] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-5nytcrrqeq] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-5nytcrrqeq] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════ PAGE HEADER ═══════════════════ */
.adm-page-header[b-5nytcrrqeq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-5nytcrrqeq] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-5nytcrrqeq] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-5nytcrrqeq] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-5nytcrrqeq] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-5nytcrrqeq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

[b-5nytcrrqeq] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-5nytcrrqeq] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════ KPI STRIP ═══════════════════ */
.adm-kpi-strip[b-5nytcrrqeq] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-5nytcrrqeq] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-5nytcrrqeq] {
    border-right: none;
}

.adm-kpi:hover[b-5nytcrrqeq] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-5nytcrrqeq] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-5nytcrrqeq] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-5nytcrrqeq] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-5nytcrrqeq] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════ SECTION HEADER ═══════════════════ */
.adm-section-header[b-5nytcrrqeq] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-5nytcrrqeq] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-5nytcrrqeq] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════ DETAIL CARDS ═══════════════════ */
.adm-detail-grid[b-5nytcrrqeq] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-5nytcrrqeq] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-5nytcrrqeq] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-5nytcrrqeq] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-5nytcrrqeq] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-5nytcrrqeq] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-5nytcrrqeq] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════ TABS ═══════════════════ */
[b-5nytcrrqeq] .adm-tabs {
    background: transparent;
}

[b-5nytcrrqeq] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-5nytcrrqeq] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-5nytcrrqeq] .adm-tabs .mud-tab:hover {
    color: #2d8a96;
    background: transparent;
}

[b-5nytcrrqeq] .adm-tabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-5nytcrrqeq] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-5nytcrrqeq] {
    padding: 0;
}

/* ─── Tab Toolbar ─── */
.adm-tab-toolbar[b-5nytcrrqeq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-5nytcrrqeq] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-5nytcrrqeq] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-5nytcrrqeq] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-5nytcrrqeq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

[b-5nytcrrqeq] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-5nytcrrqeq] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-5nytcrrqeq] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════ TABLES ═══════════════════ */
[b-5nytcrrqeq] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-5nytcrrqeq] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-5nytcrrqeq] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-5nytcrrqeq] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-5nytcrrqeq] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-5nytcrrqeq] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ─── Monospace ─── */
.adm-mono[b-5nytcrrqeq] {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    color: #334155;
}

/* ─── Empty State ─── */
.adm-empty-state[b-5nytcrrqeq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 1rem;
}

/* ─── Empty Label ─── */
.adm-empty-label[b-5nytcrrqeq] {
    font-size: 0.78rem;
    color: #64748b;
    font-style: italic;
}

/* ═══════════════════ CHIP CONTRAST (WCAG) ═══════════════════ */
[b-5nytcrrqeq] .mud-chip-color-warning {
    color: #92400e !important;
}

[b-5nytcrrqeq] .mud-chip-color-success {
    color: #15803d !important;
}

[b-5nytcrrqeq] .mud-chip-color-error {
    color: #b91c1c !important;
}

/* ═══════════════════ INSURANCE-SPECIFIC: Release Form ═══════════════════ */
.ins-release-form[b-5nytcrrqeq] {
    padding: 1rem 1.5rem 1.25rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
}

.ins-release-form__fields[b-5nytcrrqeq] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 0.75rem;
}

[b-5nytcrrqeq] .ins-release-field {
    min-width: 200px;
    flex: 1;
}

[b-5nytcrrqeq] .ins-release-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-5nytcrrqeq] .ins-release-field .mud-input {
    font-size: 0.85rem;
}

[b-5nytcrrqeq] .ins-release-field--wide {
    flex: 2;
}

.ins-release-check[b-5nytcrrqeq] {
    margin-top: 0.375rem;
}

.ins-release-form__confirm[b-5nytcrrqeq] {
    margin-bottom: 0.75rem;
}

.ins-release-form__actions[b-5nytcrrqeq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.ins-release-result[b-5nytcrrqeq] {
    font-size: 0.82rem;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════ RESPONSIVE ═══════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-5nytcrrqeq] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-5nytcrrqeq] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-5nytcrrqeq] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-5nytcrrqeq] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-5nytcrrqeq] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-5nytcrrqeq] {
        border-top: 1px solid #f1f5f9;
    }

    .ins-release-form__fields[b-5nytcrrqeq] {
        flex-direction: column;
    }

    [b-5nytcrrqeq] .ins-release-field,
    [b-5nytcrrqeq] .ins-release-field--wide {
        width: 100%;
        min-width: 100%;
    }

    .adm-tab-toolbar[b-5nytcrrqeq] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-5nytcrrqeq] {
        width: 100%;
        margin-left: 0;
    }

    [b-5nytcrrqeq] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    /* Touch targets >= 44px */
    [b-5nytcrrqeq] .adm-table .mud-table-row td {
        padding: 0.625rem 1rem;
        min-height: 44px;
    }

    [b-5nytcrrqeq] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-5nytcrrqeq] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-5nytcrrqeq] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-5nytcrrqeq] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-5nytcrrqeq] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-5nytcrrqeq],
    .adm-tab-toolbar[b-5nytcrrqeq] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-5nytcrrqeq] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    .ins-release-form[b-5nytcrrqeq] {
        padding: 1rem 0.875rem 1.25rem;
    }
}
/* /Components/Pages/Admin/Learning/CourseBuilder.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Course Builder — "Nordic Control Panel" Design System
   Matches CourseManagement + BlogEditor standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-f8rk34yxiv] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-f8rk34yxiv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-f8rk34yxiv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-f8rk34yxiv] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-f8rk34yxiv] .adm-breadcrumbs {
    padding: 0;
}

[b-f8rk34yxiv] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-f8rk34yxiv] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-f8rk34yxiv] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-f8rk34yxiv] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-f8rk34yxiv] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-f8rk34yxiv] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--create[b-f8rk34yxiv] {
    background: #3b82f6;
    box-shadow: 0 0 6px rgba(59, 130, 246, 0.4);
}

.adm-status-pill__dot--edit[b-f8rk34yxiv] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__dot--unsaved[b-f8rk34yxiv] {
    background: #ef4444;
    box-shadow: 0 0 6px rgba(239, 68, 68, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-f8rk34yxiv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-f8rk34yxiv] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-f8rk34yxiv] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-f8rk34yxiv] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-f8rk34yxiv] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-f8rk34yxiv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Buttons */
[b-f8rk34yxiv] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
}

[b-f8rk34yxiv] .adm-preview-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    color: #475569 !important;
    border-color: #d1d5db !important;
}

[b-f8rk34yxiv] .adm-preview-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-f8rk34yxiv] .adm-quiz-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.75rem !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-f8rk34yxiv] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-f8rk34yxiv] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-f8rk34yxiv] {
    border-right: none;
}

.adm-kpi:hover[b-f8rk34yxiv] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-f8rk34yxiv] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-f8rk34yxiv] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-f8rk34yxiv] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-f8rk34yxiv] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-f8rk34yxiv] .adm-tabs {
    background: transparent;
}

[b-f8rk34yxiv] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-f8rk34yxiv] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-f8rk34yxiv] .adm-tabs .mud-tab:hover {
    color: #256f7a;
    background: transparent;
}

[b-f8rk34yxiv] .adm-tabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-f8rk34yxiv] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

/* Tab Toolbar */
.adm-tab-toolbar[b-f8rk34yxiv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-f8rk34yxiv] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-f8rk34yxiv] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-f8rk34yxiv] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-f8rk34yxiv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* ═══════════════════════════════════════════════════════
   FORM CONTENT — Card container for form sections
   ═══════════════════════════════════════════════════════ */
.adm-form-content[b-f8rk34yxiv] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.25rem 1.5rem 2rem;
}

/* ═══════════════════════════════════════════════════════
   FORM CARDS — Section cards with accent bars
   ═══════════════════════════════════════════════════════ */
.adm-form-card[b-f8rk34yxiv] {
    position: relative;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-form-card:hover[b-f8rk34yxiv] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-form-card__bar[b-f8rk34yxiv] {
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-form-card__header[b-f8rk34yxiv] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 1rem 1.25rem 0;
    margin-left: 4px;
}

.adm-form-card__header-icon[b-f8rk34yxiv] {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    flex-shrink: 0;
}

.adm-form-card__header-title[b-f8rk34yxiv] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #1e293b;
    font-family: 'Montserrat', sans-serif;
    margin: 0;
}

.adm-form-card__body[b-f8rk34yxiv] {
    padding: 0.875rem 1.25rem 1.25rem;
    margin-left: 4px;
}

/* Form Field Overrides */
[b-f8rk34yxiv] .adm-form-card .mud-input-outlined-border {
    border-color: #e2e8f0 !important;
    border-radius: 8px !important;
}

[b-f8rk34yxiv] .adm-form-card .mud-input-outlined-border:hover {
    border-color: #35a0ae !important;
}

[b-f8rk34yxiv] .adm-form-card .mud-input-label {
    font-size: 0.84rem !important;
    color: #475569 !important;
}

[b-f8rk34yxiv] .adm-form-card .mud-input-helper-text {
    font-size: 0.72rem !important;
    color: #64748b !important;
}

[b-f8rk34yxiv] .adm-form-card .mud-input-counter {
    font-size: 0.72rem !important;
    color: #64748b !important;
}

/* ═══════════════════════════════════════════════════════
   IMAGE PREVIEW
   ═══════════════════════════════════════════════════════ */
.adm-image-preview[b-f8rk34yxiv] {
    width: 100%;
    height: 180px;
    border-radius: 8px;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    margin-bottom: 0.75rem;
    background: #f8f9fb;
}

.adm-image-preview img[b-f8rk34yxiv] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.adm-image-preview__empty[b-f8rk34yxiv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 0.375rem;
    color: #64748b;
    font-size: 0.82rem;
}

/* ═══════════════════════════════════════════════════════
   TOGGLE ROW
   ═══════════════════════════════════════════════════════ */
.adm-toggle-row[b-f8rk34yxiv] {
    display: flex;
    align-items: center;
    padding-top: 0.5rem;
}

/* ═══════════════════════════════════════════════════════
   PUBLISHING OPTIONS
   ═══════════════════════════════════════════════════════ */
.adm-publish-option[b-f8rk34yxiv] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    margin-bottom: 1rem;
}

.adm-publish-option:last-child[b-f8rk34yxiv] {
    margin-bottom: 0;
}

.adm-publish-option__desc[b-f8rk34yxiv] {
    font-size: 0.78rem;
    color: #64748b;
    margin-left: 3rem;
}

/* ═══════════════════════════════════════════════════════
   READINESS LIST
   ═══════════════════════════════════════════════════════ */
.adm-readiness-list[b-f8rk34yxiv] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.adm-readiness-item[b-f8rk34yxiv] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    font-size: 0.85rem;
    color: #334155;
}

/* ═══════════════════════════════════════════════════════
   MODULE CARDS
   ═══════════════════════════════════════════════════════ */
.adm-module-list[b-f8rk34yxiv] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem 1.5rem 2rem;
}

.adm-module-card[b-f8rk34yxiv] {
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-module-card:hover[b-f8rk34yxiv] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-module-card__header[b-f8rk34yxiv] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #f1f5f9;
}

.adm-module-card__drag[b-f8rk34yxiv] {
    padding-top: 0.5rem;
    cursor: grab;
    flex-shrink: 0;
}

.adm-module-card__info[b-f8rk34yxiv] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
}

.adm-module-card__number[b-f8rk34yxiv] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #0e7490;
    font-weight: 700;
}

.adm-module-card__toggles[b-f8rk34yxiv] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex-shrink: 0;
}

.adm-module-card__actions[b-f8rk34yxiv] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════
   CHAPTER CARDS
   ═══════════════════════════════════════════════════════ */
.adm-chapter-list[b-f8rk34yxiv] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.adm-chapter-card[b-f8rk34yxiv] {
    border-top: 1px solid #f1f5f9;
    background: #fafbfc;
    transition: background 0.15s ease;
}

.adm-chapter-card:hover[b-f8rk34yxiv] {
    background: #f5f7fa;
}

.adm-chapter-card__header[b-f8rk34yxiv] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.25rem;
}

.adm-chapter-card__fields[b-f8rk34yxiv] {
    flex: 1;
    min-width: 0;
}

.adm-chapter-card__minutes[b-f8rk34yxiv] {
    flex: 0 0 100px;
}

.adm-chapter-card__actions[b-f8rk34yxiv] {
    display: flex;
    gap: 0.125rem;
    flex-shrink: 0;
}

.adm-chapter-card__meta[b-f8rk34yxiv] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0 1.25rem 0.5rem 3.25rem;
    font-size: 0.75rem;
    color: #64748b;
}

.adm-chapter-card__expanded[b-f8rk34yxiv] {
    border-top: 1px solid #e8ecf1;
    background: #ffffff;
}

/* Chips */
.adm-chip[b-f8rk34yxiv] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.adm-chip--primary[b-f8rk34yxiv] {
    background: rgba(53, 160, 174, 0.08);
    color: #0e7490;
}

/* ═══════════════════════════════════════════════════════
   CONTENT BLOCKS
   ═══════════════════════════════════════════════════════ */
.adm-content-block-section[b-f8rk34yxiv] {
    padding: 1rem 1.25rem;
}

.adm-content-block[b-f8rk34yxiv] {
    padding: 0.75rem;
    margin-top: 0.75rem;
    background: #f8f9fb;
    border-radius: 8px;
    border: 1px solid #e8ecf1;
}

[b-f8rk34yxiv] .adm-inner-tab-panel {
    padding: 0;
}

/* Quiz Count */
.adm-quiz-count[b-f8rk34yxiv] {
    display: inline-block;
    margin-top: 0.5rem;
    font-size: 0.82rem;
    color: #64748b;
}

/* ═══════════════════════════════════════════════════════
   EMPTY STATE
   ═══════════════════════════════════════════════════════ */
.adm-empty-state[b-f8rk34yxiv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 2rem;
    color: #64748b;
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-f8rk34yxiv] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-f8rk34yxiv] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-f8rk34yxiv] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-f8rk34yxiv] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-f8rk34yxiv] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-module-card__header[b-f8rk34yxiv] {
        flex-wrap: wrap;
    }

    .adm-module-card__toggles[b-f8rk34yxiv] {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .adm-module-card__actions[b-f8rk34yxiv] {
        flex-direction: row;
    }

    .adm-chapter-card__header[b-f8rk34yxiv] {
        flex-wrap: wrap;
    }

    .adm-chapter-card__fields[b-f8rk34yxiv] {
        flex: 1 1 100%;
        order: 2;
    }

    .adm-chapter-card__minutes[b-f8rk34yxiv] {
        flex: 0 0 80px;
        order: 3;
    }

    .adm-chapter-card__actions[b-f8rk34yxiv] {
        order: 4;
    }

    /* Touch targets 44px */
    [b-f8rk34yxiv] .adm-module-card__actions .mud-icon-button,
    [b-f8rk34yxiv] .adm-chapter-card__actions .mud-icon-button,
    [b-f8rk34yxiv] .adm-content-block .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }

    .adm-tab-toolbar[b-f8rk34yxiv] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-f8rk34yxiv] {
        width: 100%;
        margin-left: 0;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-f8rk34yxiv] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-f8rk34yxiv] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-f8rk34yxiv] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-form-content[b-f8rk34yxiv] {
        padding: 0.875rem 0.875rem 1.5rem;
        gap: 1rem;
    }

    .adm-form-card__header[b-f8rk34yxiv] {
        padding: 0.875rem 0.875rem 0;
    }

    .adm-form-card__body[b-f8rk34yxiv] {
        padding: 0.75rem 0.875rem 1rem;
    }

    .adm-module-list[b-f8rk34yxiv] {
        padding: 0.75rem 0.875rem 1.5rem;
    }

    .adm-module-card__header[b-f8rk34yxiv] {
        padding: 0.75rem;
    }

    .adm-chapter-card__header[b-f8rk34yxiv] {
        padding: 0.5rem 0.75rem;
    }

    .adm-chapter-card__meta[b-f8rk34yxiv] {
        padding-left: 0.75rem;
    }

    .adm-content-block-section[b-f8rk34yxiv] {
        padding: 0.75rem;
    }

    [b-f8rk34yxiv] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    .adm-tab-toolbar[b-f8rk34yxiv] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-empty-state[b-f8rk34yxiv] {
        padding: 2rem 1rem;
    }

    .adm-image-preview[b-f8rk34yxiv] {
        height: 140px;
    }
}
/* /Components/Pages/Admin/Learning/CourseManagement.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Course Management — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + PrivacyPolicies standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-lkgrtbbjqq] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-lkgrtbbjqq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-lkgrtbbjqq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-lkgrtbbjqq] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-lkgrtbbjqq] .adm-breadcrumbs {
    padding: 0;
}

[b-lkgrtbbjqq] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-lkgrtbbjqq] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-lkgrtbbjqq] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-lkgrtbbjqq] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-lkgrtbbjqq] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-lkgrtbbjqq] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-lkgrtbbjqq] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-lkgrtbbjqq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-lkgrtbbjqq] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-lkgrtbbjqq] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-lkgrtbbjqq] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-lkgrtbbjqq] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-lkgrtbbjqq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add Button */
[b-lkgrtbbjqq] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
}

/* Refresh Button */
[b-lkgrtbbjqq] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-lkgrtbbjqq] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-lkgrtbbjqq] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-lkgrtbbjqq] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-lkgrtbbjqq] {
    border-right: none;
}

.adm-kpi:hover[b-lkgrtbbjqq] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-lkgrtbbjqq] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-lkgrtbbjqq] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-lkgrtbbjqq] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-lkgrtbbjqq] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-lkgrtbbjqq] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-lkgrtbbjqq] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-lkgrtbbjqq] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-lkgrtbbjqq] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-lkgrtbbjqq] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-lkgrtbbjqq] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-lkgrtbbjqq] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-lkgrtbbjqq] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-lkgrtbbjqq] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-lkgrtbbjqq] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   FILTER ROW
   ═══════════════════════════════════════════════════════ */
.adm-filter-row[b-lkgrtbbjqq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
    flex-wrap: wrap;
}

.adm-filter-row__right[b-lkgrtbbjqq] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-left: auto;
}

[b-lkgrtbbjqq] .adm-search-field {
    max-width: 280px;
    min-width: 200px;
}

[b-lkgrtbbjqq] .adm-search-field .mud-input-outlined-border {
    border-color: #e2e8f0 !important;
    border-radius: 8px !important;
}

[b-lkgrtbbjqq] .adm-search-field .mud-input-outlined-border:hover {
    border-color: #35a0ae !important;
}

[b-lkgrtbbjqq] .adm-search-field .mud-input-adorment-start {
    color: #64748b;
}

[b-lkgrtbbjqq] .adm-search-field input::placeholder {
    color: #64748b !important;
    font-size: 0.82rem;
}

[b-lkgrtbbjqq] .adm-select-field {
    max-width: 180px;
    min-width: 140px;
}

[b-lkgrtbbjqq] .adm-select-field .mud-input-outlined-border {
    border-color: #e2e8f0 !important;
    border-radius: 8px !important;
}

[b-lkgrtbbjqq] .adm-select-field .mud-input-label {
    font-size: 0.82rem !important;
    color: #64748b !important;
}

[b-lkgrtbbjqq] .adm-view-toggle {
    border-radius: 8px !important;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    min-width: 36px;
    min-height: 36px;
}

/* ═══════════════════════════════════════════════════════
   CHIPS
   ═══════════════════════════════════════════════════════ */
.adm-chip[b-lkgrtbbjqq] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.adm-chip--primary[b-lkgrtbbjqq] {
    background: rgba(53, 160, 174, 0.08);
    color: #0e7490;
}

.adm-chip--success[b-lkgrtbbjqq] {
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
}

.adm-chip--warning[b-lkgrtbbjqq] {
    background: rgba(245, 158, 11, 0.08);
    color: #b45309;
}

.adm-chip--error[b-lkgrtbbjqq] {
    background: rgba(239, 65, 44, 0.08);
    color: #dc2626;
}

.adm-chip--default[b-lkgrtbbjqq] {
    background: #f1f5f9;
    color: #475569;
}

/* Status Chips */
.adm-status-chip[b-lkgrtbbjqq] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    margin-right: 0.25rem;
}

.adm-status-chip--published[b-lkgrtbbjqq] {
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
}

.adm-status-chip--draft[b-lkgrtbbjqq] {
    background: #f1f5f9;
    color: #64748b;
}

.adm-status-chip--featured[b-lkgrtbbjqq] {
    background: rgba(245, 158, 11, 0.08);
    color: #b45309;
}

/* ═══════════════════════════════════════════════════════
   TABLE SECTION
   ═══════════════════════════════════════════════════════ */
.adm-table-container[b-lkgrtbbjqq] {
    padding: 0 1.5rem 1.5rem;
}

[b-lkgrtbbjqq] .adm-table {
    border-radius: 10px !important;
    border: 1px solid #e8ecf1 !important;
    overflow: hidden;
    box-shadow: none !important;
}

[b-lkgrtbbjqq] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-lkgrtbbjqq] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-lkgrtbbjqq] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-lkgrtbbjqq] .adm-table .mud-table-body tr {
    cursor: pointer;
    transition: background 0.12s ease;
}

[b-lkgrtbbjqq] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-lkgrtbbjqq] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

/* Course row in table */
.adm-course-row[b-lkgrtbbjqq] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

[b-lkgrtbbjqq] .adm-course-row__avatar {
    border-radius: 6px !important;
    flex-shrink: 0;
}

.adm-course-row__name[b-lkgrtbbjqq] {
    display: block;
    font-weight: 500;
    color: #1e293b;
    font-size: 0.85rem;
}

.adm-course-row__instructor[b-lkgrtbbjqq] {
    display: block;
    font-size: 0.75rem;
    color: #64748b;
}

/* ═══════════════════════════════════════════════════════
   COURSE GRID
   ═══════════════════════════════════════════════════════ */
.adm-course-grid[b-lkgrtbbjqq] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1.5rem;
}

.adm-course-card[b-lkgrtbbjqq] {
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    cursor: pointer;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.adm-course-card:hover[b-lkgrtbbjqq] {
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
    transform: translateY(-2px);
}

.adm-course-card__image[b-lkgrtbbjqq] {
    position: relative;
    height: 140px;
    overflow: hidden;
    background: #f1f5f9;
}

.adm-course-card__image img[b-lkgrtbbjqq] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.adm-course-card__badge[b-lkgrtbbjqq] {
    position: absolute;
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.adm-course-card__badge--featured[b-lkgrtbbjqq] {
    top: 8px;
    right: 8px;
    background: rgba(245, 158, 11, 0.9);
    color: #ffffff;
}

.adm-course-card__badge--status[b-lkgrtbbjqq] {
    bottom: 8px;
    left: 8px;
}

.adm-course-card__badge--published[b-lkgrtbbjqq] {
    background: rgba(22, 163, 74, 0.9);
    color: #ffffff;
}

.adm-course-card__badge--draft[b-lkgrtbbjqq] {
    background: rgba(100, 116, 139, 0.9);
    color: #ffffff;
}

.adm-course-card__body[b-lkgrtbbjqq] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.875rem;
    flex: 1;
}

.adm-course-card__chips[b-lkgrtbbjqq] {
    display: flex;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.adm-course-card__title[b-lkgrtbbjqq] {
    font-size: 0.88rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.adm-course-card__desc[b-lkgrtbbjqq] {
    font-size: 0.78rem;
    color: #64748b;
    margin: 0;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.adm-course-card__meta[b-lkgrtbbjqq] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-top: auto;
}

.adm-course-card__meta span[b-lkgrtbbjqq] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.72rem;
    color: #64748b;
    font-weight: 500;
}

.adm-course-card__actions[b-lkgrtbbjqq] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.125rem;
    padding: 0.375rem 0.5rem;
    border-top: 1px solid #f1f5f9;
}

[b-lkgrtbbjqq] .adm-course-card__actions .mud-icon-button {
    min-width: 32px;
    min-height: 32px;
}

/* ═══════════════════════════════════════════════════════
   EMPTY STATE
   ═══════════════════════════════════════════════════════ */
.adm-empty-state[b-lkgrtbbjqq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 2rem;
    color: #64748b;
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-lkgrtbbjqq] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-lkgrtbbjqq] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-lkgrtbbjqq] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-detail-grid[b-lkgrtbbjqq] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-course-grid[b-lkgrtbbjqq] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-lkgrtbbjqq] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-lkgrtbbjqq] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-kpi-strip[b-lkgrtbbjqq] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-course-grid[b-lkgrtbbjqq] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-filter-row[b-lkgrtbbjqq] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-lkgrtbbjqq] .adm-search-field {
        max-width: 100%;
    }

    [b-lkgrtbbjqq] .adm-select-field {
        max-width: 100%;
    }

    .adm-filter-row__right[b-lkgrtbbjqq] {
        margin-left: 0;
        justify-content: flex-end;
    }

    /* Ensure touch targets are at least 44px */
    [b-lkgrtbbjqq] .adm-table .mud-table-body td .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }

    [b-lkgrtbbjqq] .adm-course-card__actions .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }

    /* Mobile table horizontal scroll */
    .adm-table-container[b-lkgrtbbjqq] {
        overflow-x: auto;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-lkgrtbbjqq] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-lkgrtbbjqq] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-lkgrtbbjqq] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-lkgrtbbjqq] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-lkgrtbbjqq] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-detail-grid[b-lkgrtbbjqq] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-course-grid[b-lkgrtbbjqq] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-lkgrtbbjqq] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-filter-row[b-lkgrtbbjqq] {
        padding: 0 0.875rem 0.75rem;
    }

    .adm-table-container[b-lkgrtbbjqq] {
        padding: 0 0.875rem 1rem;
    }

    .adm-empty-state[b-lkgrtbbjqq] {
        padding: 2rem 1rem;
    }
}
/* /Components/Pages/Admin/Notifications/NotificationHistory.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Notification History — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + DiscountTypes tabbed standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-bhpbn4r0ql] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-bhpbn4r0ql] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-bhpbn4r0ql] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-bhpbn4r0ql] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-bhpbn4r0ql] .adm-breadcrumbs {
    padding: 0;
}

[b-bhpbn4r0ql] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-bhpbn4r0ql] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-bhpbn4r0ql] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-bhpbn4r0ql] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-bhpbn4r0ql] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-bhpbn4r0ql] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-bhpbn4r0ql] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-bhpbn4r0ql] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-bhpbn4r0ql] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-bhpbn4r0ql] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-bhpbn4r0ql] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-bhpbn4r0ql] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-bhpbn4r0ql] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-bhpbn4r0ql] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-bhpbn4r0ql] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-bhpbn4r0ql] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-bhpbn4r0ql] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-bhpbn4r0ql] {
    border-right: none;
}

.adm-kpi:hover[b-bhpbn4r0ql] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-bhpbn4r0ql] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-bhpbn4r0ql] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-bhpbn4r0ql] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-bhpbn4r0ql] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-bhpbn4r0ql] .adm-tabs {
    background: transparent;
}

[b-bhpbn4r0ql] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-bhpbn4r0ql] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-bhpbn4r0ql] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-bhpbn4r0ql] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-bhpbn4r0ql] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-bhpbn4r0ql] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-bhpbn4r0ql] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-bhpbn4r0ql] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-bhpbn4r0ql] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-bhpbn4r0ql] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-bhpbn4r0ql] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-bhpbn4r0ql] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-bhpbn4r0ql] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-bhpbn4r0ql] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

[b-bhpbn4r0ql] .adm-filter-field .mud-input-outlined-border:hover {
    border-color: #35a0ae !important;
}

[b-bhpbn4r0ql] .adm-filter-field .mud-input-adorment-start {
    color: #94a3b8;
}

[b-bhpbn4r0ql] .adm-filter-field input::placeholder {
    color: #94a3b8 !important;
    font-size: 0.82rem;
}

/* ═══════════════════════════════════════════════════════
   TABLE SECTION
   ═══════════════════════════════════════════════════════ */
.adm-table-container[b-bhpbn4r0ql] {
    padding: 0 1.5rem 1.5rem;
    overflow-x: auto;
}

/* MudTable styling */
[b-bhpbn4r0ql] .adm-table {
    border-radius: 10px !important;
    border: 1px solid #e8ecf1 !important;
    overflow: hidden;
    box-shadow: none !important;
}

[b-bhpbn4r0ql] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-bhpbn4r0ql] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-bhpbn4r0ql] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-bhpbn4r0ql] .adm-table .mud-table-body tr {
    transition: background 0.12s ease;
}

[b-bhpbn4r0ql] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-bhpbn4r0ql] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-bhpbn4r0ql] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-bhpbn4r0ql] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

/* ─── Cell Styles ─── */
.adm-recipient-name[b-bhpbn4r0ql] {
    font-weight: 500;
    color: #1e293b;
}

.adm-notif-title[b-bhpbn4r0ql] {
    color: #334155;
    font-size: 0.84rem;
    display: block;
    max-width: 280px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Chip styling */
[b-bhpbn4r0ql] .adm-chip {
    font-size: 0.7rem !important;
    height: 22px !important;
    font-weight: 600 !important;
}

/* WCAG AA contrast fixes — all chips need >= 4.5:1 at 0.7rem */
[b-bhpbn4r0ql] .adm-chip.mud-chip-color-primary {
    background-color: #1a7a86 !important;
    color: #ffffff !important;
}

[b-bhpbn4r0ql] .adm-chip.mud-chip-color-secondary {
    background-color: #c62828 !important;
    color: #ffffff !important;
}

[b-bhpbn4r0ql] .adm-chip.mud-chip-color-success {
    background-color: #2e7d32 !important;
}

[b-bhpbn4r0ql] .adm-chip.mud-chip-color-warning {
    background-color: #e65100 !important;
    color: #ffffff !important;
}

/* Empty state — WCAG AA fix: #64748b on white = 5.0:1 (was #94a3b8 = 2.8:1) */
.adm-empty-state[b-bhpbn4r0ql] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #64748b;
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   NOTIFICATION DETAILS DIALOG
   ═══════════════════════════════════════════════════════ */
.adm-dialog-title[b-bhpbn4r0ql] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1rem;
    font-weight: 600;
    color: #0f172a;
}

.adm-detail-fields[b-bhpbn4r0ql] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.adm-detail-row[b-bhpbn4r0ql] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.adm-detail-row--full[b-bhpbn4r0ql] {
    grid-template-columns: 1fr;
}

.adm-detail-field[b-bhpbn4r0ql] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.adm-detail-field__label[b-bhpbn4r0ql] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 600;
}

.adm-detail-field__value[b-bhpbn4r0ql] {
    font-size: 0.875rem;
    color: #1e293b;
    font-weight: 500;
}

.adm-detail-message[b-bhpbn4r0ql] {
    font-size: 0.85rem;
    color: #334155;
    line-height: 1.6;
    padding: 0.75rem 1rem;
    background: #f8f9fb;
    border-radius: 8px;
    border: 1px solid #e8ecf1;
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 300px;
    overflow-y: auto;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-bhpbn4r0ql] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-bhpbn4r0ql] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-bhpbn4r0ql] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-bhpbn4r0ql] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-bhpbn4r0ql] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-bhpbn4r0ql] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-tab-toolbar[b-bhpbn4r0ql] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-bhpbn4r0ql] {
        width: 100%;
        margin-left: 0;
    }

    [b-bhpbn4r0ql] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    .adm-detail-row[b-bhpbn4r0ql] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-bhpbn4r0ql] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-bhpbn4r0ql] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-bhpbn4r0ql] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-bhpbn4r0ql] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-bhpbn4r0ql] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-table-container[b-bhpbn4r0ql] {
        padding: 0 0.875rem 1rem;
    }

    .adm-tab-toolbar[b-bhpbn4r0ql] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-bhpbn4r0ql] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    [b-bhpbn4r0ql] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    /* WCAG touch target fix: min 44px on mobile */
    [b-bhpbn4r0ql] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/Notifications/SendNotification.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Send Notification — Nordic Control Panel Extension
   Stepper wizard + form sections for the notification
   compose flow.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell (inherited from AnalyticsDashboard) ─── */
.adm-shell[b-gneetn8980] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-gneetn8980] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-gneetn8980] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-gneetn8980] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-gneetn8980] .adm-breadcrumbs {
    padding: 0;
}

[b-gneetn8980] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-gneetn8980] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-gneetn8980] .adm-breadcrumbs a {
    color: #475569 !important;
    text-decoration: none;
}

[b-gneetn8980] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-gneetn8980] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-gneetn8980] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-gneetn8980] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-gneetn8980] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-gneetn8980] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-gneetn8980] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-gneetn8980] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-gneetn8980] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-gneetn8980] {
    font-size: 0.82rem;
    color: #475569;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-gneetn8980] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Tool Button */
[b-gneetn8980] .adm-tool-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.82rem !important;
    border-color: #d1d5db !important;
}

[b-gneetn8980] .adm-tool-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
    color: #35a0ae !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-gneetn8980] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-gneetn8980] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-gneetn8980] {
    border-right: none;
}

.adm-kpi:hover[b-gneetn8980] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-gneetn8980] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-gneetn8980] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-gneetn8980] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-gneetn8980] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-gneetn8980] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-gneetn8980] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-gneetn8980] {
    font-size: 0.78rem;
    color: #475569;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   STEPPER — Horizontal step indicator
   Clean circles with connecting lines.
   ═══════════════════════════════════════════════════════ */
.sn-stepper[b-gneetn8980] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.sn-stepper__item[b-gneetn8980] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.sn-stepper__circle[b-gneetn8980] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.8rem;
    background: #f1f5f9;
    color: #64748b;
    border: 2px solid #e2e8f0;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.sn-stepper__item--active .sn-stepper__circle[b-gneetn8980] {
    background: #35a0ae;
    color: #ffffff;
    border-color: #35a0ae;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.12);
}

.sn-stepper__item--done .sn-stepper__circle[b-gneetn8980] {
    background: #22c55e;
    color: #ffffff;
    border-color: #22c55e;
}

[b-gneetn8980] .sn-stepper__item--done .sn-stepper__circle .mud-icon-root {
    font-size: 1rem !important;
}

.sn-stepper__label[b-gneetn8980] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #64748b;
    white-space: nowrap;
}

.sn-stepper__item--active .sn-stepper__label[b-gneetn8980] {
    color: #35a0ae;
    font-weight: 600;
}

.sn-stepper__item--done .sn-stepper__label[b-gneetn8980] {
    color: #22c55e;
}

.sn-stepper__line[b-gneetn8980] {
    flex: 1;
    height: 2px;
    background: #e2e8f0;
    margin: 0 0.75rem;
    min-width: 20px;
    max-width: 120px;
    transition: background 0.2s ease;
}

.sn-stepper__line--done[b-gneetn8980] {
    background: #22c55e;
}

/* ═══════════════════════════════════════════════════════
   STEP CONTENT — Wrapper for each wizard step
   ═══════════════════════════════════════════════════════ */
.sn-step-content[b-gneetn8980] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   FORM SECTION — Card-like container for form fields
   ═══════════════════════════════════════════════════════ */
.sn-form-section[b-gneetn8980] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    margin: 0 1.5rem;
    background: #ffffff;
    border-radius: 8px;
    border: 1px solid #e8ecf1;
}

/* Form fields */
[b-gneetn8980] .sn-form-section .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-gneetn8980] .sn-form-section .mud-input {
    font-size: 0.875rem;
    color: #334155 !important;
}

[b-gneetn8980] .sn-form-section .mud-input-label {
    color: #64748b !important;
}

[b-gneetn8980] .sn-form-section .mud-select .mud-input-outlined .mud-input-outlined-border {
    border-radius: 8px;
}

/* Radio group styling */
[b-gneetn8980] .sn-form-section .mud-radio {
    margin-right: 0.5rem;
}

[b-gneetn8980] .sn-form-section .mud-radio .mud-typography {
    font-size: 0.875rem;
    color: #334155;
}

/* ═══════════════════════════════════════════════════════
   FORM GRID — 2-column layout for template variables
   ═══════════════════════════════════════════════════════ */
.sn-form-grid[b-gneetn8980] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

/* ═══════════════════════════════════════════════════════
   STEP ACTIONS — Navigation buttons at bottom of step
   ═══════════════════════════════════════════════════════ */
.sn-step-actions[b-gneetn8980] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

[b-gneetn8980] .sn-step-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    min-height: 44px !important;
    font-size: 0.875rem !important;
}

/* ═══════════════════════════════════════════════════════
   PREVIEW CARD — Template/notification preview display
   ═══════════════════════════════════════════════════════ */
.sn-preview-card[b-gneetn8980] {
    border-radius: 8px;
    border: 1px solid #e8ecf1;
    overflow: hidden;
}

.sn-preview-card__header[b-gneetn8980] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    background: #f8f9fb;
    border-bottom: 1px solid #e8ecf1;
}

.sn-preview-card__body[b-gneetn8980] {
    padding: 1rem;
    font-size: 0.875rem;
    color: #334155;
    line-height: 1.6;
}

/* ═══════════════════════════════════════════════════════
   RECIPIENTS BOX — Chip display for selected recipients
   ═══════════════════════════════════════════════════════ */
.sn-recipients-box[b-gneetn8980] {
    padding: 1rem;
    border-radius: 8px;
    background: rgba(53, 160, 174, 0.04);
    border: 1px dashed rgba(53, 160, 174, 0.2);
}

.sn-recipients-chips[b-gneetn8980] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

[b-gneetn8980] .sn-recipients-chips .mud-chip {
    border-radius: 8px !important;
}

/* ═══════════════════════════════════════════════════════
   SUMMARY GRID — Key-value summary before sending
   ═══════════════════════════════════════════════════════ */
.sn-summary-grid[b-gneetn8980] {
    display: flex;
    flex-direction: column;
    gap: 0;
    border-radius: 8px;
    border: 1px solid #e8ecf1;
    overflow: hidden;
}

.sn-summary-row[b-gneetn8980] {
    display: flex;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #f3f4f6;
}

.sn-summary-row:last-child[b-gneetn8980] {
    border-bottom: none;
}

.sn-summary-row:nth-child(even)[b-gneetn8980] {
    background: #fafbfc;
}

.sn-summary-row__label[b-gneetn8980] {
    flex: 0 0 140px;
    font-size: 0.82rem;
    font-weight: 600;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.sn-summary-row__value[b-gneetn8980] {
    flex: 1;
    font-size: 0.85rem;
    color: #334155;
    min-width: 0;
    word-break: break-word;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 960px) {
    .adm-page-header[b-gneetn8980] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-gneetn8980] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-gneetn8980] {
        grid-template-columns: repeat(3, 1fr);
    }

    .sn-stepper__label[b-gneetn8980] {
        display: none;
    }

    .sn-stepper__line[b-gneetn8980] {
        min-width: 16px;
        margin: 0 0.375rem;
    }

    .sn-form-grid[b-gneetn8980] {
        grid-template-columns: 1fr;
    }

    .sn-form-section[b-gneetn8980] {
        margin: 0 0.75rem;
    }

    .sn-summary-row[b-gneetn8980] {
        flex-direction: column;
        gap: 0.25rem;
    }

    .sn-summary-row__label[b-gneetn8980] {
        flex: none;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-gneetn8980] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-gneetn8980] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-gneetn8980] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-gneetn8980] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-gneetn8980] {
        border-top: 1px solid #f1f5f9;
        grid-column: 1 / -1;
    }

    .sn-stepper[b-gneetn8980] {
        padding: 1rem 0.875rem;
    }

    .sn-stepper__line[b-gneetn8980] {
        min-width: 12px;
        margin: 0 0.25rem;
    }

    .sn-stepper__circle[b-gneetn8980] {
        width: 28px;
        height: 28px;
        font-size: 0.72rem;
    }

    .adm-section-header[b-gneetn8980] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .sn-form-section[b-gneetn8980] {
        margin: 0 0.875rem;
        padding: 1rem;
    }

    .sn-step-actions[b-gneetn8980] {
        padding: 1rem 0.875rem;
        flex-direction: column;
    }

    [b-gneetn8980] .sn-step-btn {
        width: 100% !important;
        justify-content: center !important;
    }
}
/* /Components/Pages/Admin/Notifications/Templates/NotificationTemplateAssignmentDialog.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   NotificationTemplateAssignmentDialog — Nordic Dialog
   ═══════════════════════════════════════════════════════ */

.adm-dialog[b-39a7e1o47w] {
    padding: 0.5rem 0;
}

.adm-form-grid[b-39a7e1o47w] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.adm-form-group[b-39a7e1o47w] {
    display: flex;
    flex-direction: column;
}

.adm-form-row[b-39a7e1o47w] {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.adm-dialog-actions[b-39a7e1o47w] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 1.25rem;
    margin-top: 0.5rem;
    border-top: 1px solid #e8ecf1;
}

[b-39a7e1o47w] .adm-dialog-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
}
/* /Components/Pages/Admin/Notifications/Templates/NotificationTemplateAssignments.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Notification Template Assignments — "Nordic Control Panel"
   Matches AnalyticsDashboard + Badges standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-8s8rfjub1x] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-8s8rfjub1x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-8s8rfjub1x] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-8s8rfjub1x] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-8s8rfjub1x] .adm-breadcrumbs {
    padding: 0;
}

[b-8s8rfjub1x] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-8s8rfjub1x] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-8s8rfjub1x] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-8s8rfjub1x] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-8s8rfjub1x] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-8s8rfjub1x] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-8s8rfjub1x] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-8s8rfjub1x] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-8s8rfjub1x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-8s8rfjub1x] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-8s8rfjub1x] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-8s8rfjub1x] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-8s8rfjub1x] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-8s8rfjub1x] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add Button */
[b-8s8rfjub1x] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
}

/* Seed Button */
[b-8s8rfjub1x] .adm-seed-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
}

[b-8s8rfjub1x] .adm-seed-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Refresh Button */
[b-8s8rfjub1x] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-8s8rfjub1x] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-8s8rfjub1x] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-8s8rfjub1x] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-8s8rfjub1x] {
    border-right: none;
}

.adm-kpi:hover[b-8s8rfjub1x] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-8s8rfjub1x] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-8s8rfjub1x] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-8s8rfjub1x] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-8s8rfjub1x] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-8s8rfjub1x] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-8s8rfjub1x] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-8s8rfjub1x] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   TABLE SECTION
   ═══════════════════════════════════════════════════════ */
.adm-table-container[b-8s8rfjub1x] {
    padding: 0 1.5rem 1.5rem;
}

[b-8s8rfjub1x] .adm-search-field {
    margin-bottom: 0.75rem;
    max-width: 360px;
}

[b-8s8rfjub1x] .adm-search-field .mud-input-outlined-border {
    border-color: #e2e8f0 !important;
    border-radius: 8px !important;
}

[b-8s8rfjub1x] .adm-search-field .mud-input-outlined-border:hover {
    border-color: #35a0ae !important;
}

[b-8s8rfjub1x] .adm-search-field .mud-input-adorment-start {
    color: #94a3b8;
}

[b-8s8rfjub1x] .adm-search-field input::placeholder {
    color: #94a3b8 !important;
    font-size: 0.82rem;
}

/* MudTable styling */
[b-8s8rfjub1x] .adm-table {
    border-radius: 10px !important;
    border: 1px solid #e8ecf1 !important;
    overflow: hidden;
    box-shadow: none !important;
}

[b-8s8rfjub1x] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-8s8rfjub1x] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-8s8rfjub1x] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-8s8rfjub1x] .adm-table .mud-table-body tr {
    cursor: pointer;
    transition: background 0.12s ease;
}

[b-8s8rfjub1x] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-8s8rfjub1x] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-8s8rfjub1x] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-8s8rfjub1x] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

/* ─── Type Tag ─── */
.adm-type-tag[b-8s8rfjub1x] {
    display: inline-block;
    padding: 0.175rem 0.5rem;
    border-radius: 4px;
    background: rgba(53, 160, 174, 0.07);
    color: #0e7490;
    font-size: 0.8rem;
    font-weight: 500;
}

/* ─── Monospace ─── */
.adm-mono[b-8s8rfjub1x] {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #334155;
}

/* ─── Default Event Label ─── */
/* WCAG AA: #64748b on white = ~4.6:1 contrast (passes) */
.adm-event-default[b-8s8rfjub1x] {
    color: #64748b;
    font-style: italic;
    font-size: 0.82rem;
}

/* Chip styling */
[b-8s8rfjub1x] .adm-chip {
    font-size: 0.7rem !important;
    height: 22px !important;
    font-weight: 600 !important;
}

/* WCAG AA contrast fix: white on default green (#4CAF50) = 2.78:1 → #2e7d32 = ~5.5:1 */
[b-8s8rfjub1x] .adm-chip.mud-chip-filled.mud-chip-color-success {
    background-color: #2e7d32 !important;
}

/* Empty state */
/* WCAG AA: #64748b on white = ~4.6:1 contrast (passes) */
.adm-empty-state[b-8s8rfjub1x] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #64748b;
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-8s8rfjub1x] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-8s8rfjub1x] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-8s8rfjub1x] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-8s8rfjub1x] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-8s8rfjub1x] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-kpi-strip[b-8s8rfjub1x] {
        grid-template-columns: repeat(2, 1fr);
    }

    [b-8s8rfjub1x] .adm-search-field {
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-8s8rfjub1x] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-8s8rfjub1x] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-8s8rfjub1x] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-8s8rfjub1x] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-8s8rfjub1x] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-table-container[b-8s8rfjub1x] {
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-8s8rfjub1x] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    /* WCAG touch target fix: min 44px on mobile */
    [b-8s8rfjub1x] .adm-add-btn {
        min-height: 44px !important;
        padding: 8px 16px !important;
    }

    [b-8s8rfjub1x] .adm-seed-btn {
        min-height: 44px !important;
        padding: 8px 16px !important;
    }

    [b-8s8rfjub1x] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/Notifications/Templates/NotificationTemplateManagement.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Notification Template Management — "Nordic Control Panel"
   Matches AnalyticsDashboard + Badges standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-a3g6vsxa29] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-a3g6vsxa29] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-a3g6vsxa29] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-a3g6vsxa29] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-a3g6vsxa29] .adm-breadcrumbs {
    padding: 0;
}

[b-a3g6vsxa29] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-a3g6vsxa29] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-a3g6vsxa29] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-a3g6vsxa29] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-a3g6vsxa29] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-a3g6vsxa29] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-a3g6vsxa29] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-a3g6vsxa29] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-a3g6vsxa29] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-a3g6vsxa29] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-a3g6vsxa29] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-a3g6vsxa29] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-a3g6vsxa29] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-a3g6vsxa29] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
    flex-wrap: wrap;
}

/* Add Button */
[b-a3g6vsxa29] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
}

/* Outline Buttons */
[b-a3g6vsxa29] .adm-outline-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 12px !important;
    box-shadow: none !important;
    color: #475569 !important;
    border-color: #d1d5db !important;
}

[b-a3g6vsxa29] .adm-outline-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Refresh Button */
[b-a3g6vsxa29] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-a3g6vsxa29] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-a3g6vsxa29] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-a3g6vsxa29] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-a3g6vsxa29] {
    border-right: none;
}

.adm-kpi:hover[b-a3g6vsxa29] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-a3g6vsxa29] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-a3g6vsxa29] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-a3g6vsxa29] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-a3g6vsxa29] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-a3g6vsxa29] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-a3g6vsxa29] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-a3g6vsxa29] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   TABLE SECTION
   ═══════════════════════════════════════════════════════ */
.adm-table-container[b-a3g6vsxa29] {
    padding: 0 1.5rem 1.5rem;
}

[b-a3g6vsxa29] .adm-search-field {
    margin-bottom: 0.75rem;
    max-width: 360px;
}

[b-a3g6vsxa29] .adm-search-field .mud-input-outlined-border {
    border-color: #e2e8f0 !important;
    border-radius: 8px !important;
}

[b-a3g6vsxa29] .adm-search-field .mud-input-outlined-border:hover {
    border-color: #35a0ae !important;
}

[b-a3g6vsxa29] .adm-search-field .mud-input-adorment-start {
    color: #94a3b8;
}

[b-a3g6vsxa29] .adm-search-field input::placeholder {
    color: #94a3b8 !important;
    font-size: 0.82rem;
}

/* MudTable styling */
[b-a3g6vsxa29] .adm-table {
    border-radius: 10px !important;
    border: 1px solid #e8ecf1 !important;
    overflow: hidden;
    box-shadow: none !important;
}

[b-a3g6vsxa29] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-a3g6vsxa29] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-a3g6vsxa29] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-a3g6vsxa29] .adm-table .mud-table-body tr {
    cursor: pointer;
    transition: background 0.12s ease;
}

[b-a3g6vsxa29] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-a3g6vsxa29] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-a3g6vsxa29] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-a3g6vsxa29] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

/* Active row */
[b-a3g6vsxa29] .adm-table .mud-table-body tr.ntm-row--active {
    background: rgba(53, 160, 174, 0.06) !important;
    border-left: 3px solid #35a0ae;
}

[b-a3g6vsxa29] .adm-table .mud-table-body tr.ntm-row--active:hover {
    background: rgba(53, 160, 174, 0.08) !important;
}

.ntm-template-name[b-a3g6vsxa29] {
    font-weight: 500;
    color: #1e293b;
}

.ntm-icon-cell[b-a3g6vsxa29] {
    display: flex;
    align-items: center;
    color: #64748b;
}

.ntm-action-icon[b-a3g6vsxa29] {
    color: #64748b;
}

/* Empty state — WCAG AA contrast: #64748b on white = 4.6:1 (passes 4.5:1) */
.adm-empty-state[b-a3g6vsxa29] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #64748b;
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-a3g6vsxa29] .adm-tabs {
    background: transparent;
}

[b-a3g6vsxa29] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1rem;
    min-height: auto;
}

[b-a3g6vsxa29] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.75rem 1rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.82rem;
    cursor: pointer;
}

[b-a3g6vsxa29] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-a3g6vsxa29] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-a3g6vsxa29] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

/* ═══════════════════════════════════════════════════════
   DUAL-PANEL LAYOUT
   ═══════════════════════════════════════════════════════ */
.ntm-layout[b-a3g6vsxa29] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    min-height: 400px;
}

.ntm-list-panel[b-a3g6vsxa29] {
    border-right: 1px solid #e8ecf1;
    background: #ffffff;
    min-width: 0;
}

.ntm-editor-panel[b-a3g6vsxa29] {
    display: flex;
    flex-direction: column;
    gap: 0;
    background: #f8f9fb;
    min-width: 0;
}

/* ═══════════════════════════════════════════════════════
   EDITOR CARD
   ═══════════════════════════════════════════════════════ */
.ntm-editor-card[b-a3g6vsxa29] {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.ntm-editor-header[b-a3g6vsxa29] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f1f5f9;
}

.ntm-editor-header .adm-section-header__title[b-a3g6vsxa29] {
    padding: 0;
}

.ntm-editor-header .adm-section-header__subtitle[b-a3g6vsxa29] {
    padding: 0;
}

.ntm-form-section[b-a3g6vsxa29] {
    padding: 1rem 1.5rem;
}

.ntm-editor-footer[b-a3g6vsxa29] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1.5rem;
    border-top: 1px solid #f1f5f9;
    background: #fafbfc;
}

/* Monospace field for template code */
[b-a3g6vsxa29] .ntm-mono-field textarea {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace !important;
    font-size: 0.82rem !important;
    line-height: 1.5 !important;
}

/* Variables */
.ntm-var-hint[b-a3g6vsxa29] {
    font-size: 0.82rem;
    color: #64748b;
    margin: 0 0 0.75rem 0;
}

.ntm-var-grid[b-a3g6vsxa29] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

[b-a3g6vsxa29] .ntm-var-chip {
    font-size: 0.72rem !important;
    height: 26px !important;
    font-family: 'Cascadia Code', 'Fira Code', monospace !important;
    cursor: pointer !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
}

[b-a3g6vsxa29] .ntm-var-chip:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    border-color: #35a0ae !important;
    color: #35a0ae !important;
}

/* ═══════════════════════════════════════════════════════
   PREVIEW CARD
   ═══════════════════════════════════════════════════════ */
.ntm-preview-card[b-a3g6vsxa29] {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.ntm-preview-pane[b-a3g6vsxa29] {
    padding: 1rem 1.5rem;
}

.ntm-preview-label[b-a3g6vsxa29] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 600;
    margin: 0 0 0.375rem 0;
}

.ntm-preview-block[b-a3g6vsxa29] {
    padding: 0.875rem 1rem;
    background: #f8f9fb;
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    font-size: 0.85rem;
    color: #334155;
    line-height: 1.6;
}

.ntm-code-block[b-a3g6vsxa29] {
    background: #0f172a;
    color: #e2e8f0;
    border-radius: 8px;
    padding: 0.875rem 1rem;
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.78rem;
    line-height: 1.6;
    overflow-x: auto;
    white-space: pre-wrap;
    word-break: break-word;
    border: 1px solid rgba(51, 65, 85, 0.6);
    margin: 0;
}

/* ═══════════════════════════════════════════════════════
   EMPTY EDITOR STATE
   ═══════════════════════════════════════════════════════ */
.ntm-empty-editor[b-a3g6vsxa29] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 3rem 2rem;
    text-align: center;
    min-height: 300px;
}

.ntm-empty-editor__title[b-a3g6vsxa29] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
}

.ntm-empty-editor__sub[b-a3g6vsxa29] {
    font-size: 0.85rem;
    color: #64748b;
    margin: 0;
    max-width: 280px;
    line-height: 1.5;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-a3g6vsxa29] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-a3g6vsxa29] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-a3g6vsxa29] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-a3g6vsxa29] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-a3g6vsxa29] {
        margin-left: 0;
        width: 100%;
    }

    .ntm-layout[b-a3g6vsxa29] {
        grid-template-columns: 1fr;
    }

    .ntm-list-panel[b-a3g6vsxa29] {
        border-right: none;
        border-bottom: 1px solid #e8ecf1;
    }

    [b-a3g6vsxa29] .adm-search-field {
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-a3g6vsxa29] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-a3g6vsxa29] {
        padding: 1rem 0.875rem;
    }

    .adm-page-header__tools[b-a3g6vsxa29] {
        flex-direction: column;
        align-items: stretch;
    }

    .adm-kpi-strip[b-a3g6vsxa29] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-a3g6vsxa29] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-a3g6vsxa29] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-table-container[b-a3g6vsxa29] {
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-a3g6vsxa29] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .ntm-form-section[b-a3g6vsxa29] {
        padding: 0.875rem;
    }

    .ntm-editor-header[b-a3g6vsxa29] {
        padding: 0.875rem;
    }

    .ntm-editor-footer[b-a3g6vsxa29] {
        padding: 0.75rem 0.875rem;
        flex-direction: column;
        align-items: stretch;
    }

    .ntm-preview-pane[b-a3g6vsxa29] {
        padding: 0.875rem;
    }

    .ntm-empty-editor[b-a3g6vsxa29] {
        padding: 2rem 1rem;
        min-height: 200px;
    }

    /* WCAG touch target fix: min 44px on mobile */
    [b-a3g6vsxa29] .adm-add-btn {
        min-height: 44px !important;
        padding: 8px 16px !important;
    }

    [b-a3g6vsxa29] .adm-outline-btn {
        min-height: 44px !important;
        padding: 8px 12px !important;
    }

    [b-a3g6vsxa29] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/OnboardingAgents/AgentPrivacyEditDialog.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Agent Privacy Edit Dialog — Nordic Control Panel
   Scoped to AgentPrivacyEditDialog component.
   ═══════════════════════════════════════════════════════ */

.adm-dialog-title[b-40y3gyh5ly] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.adm-dialog-section[b-40y3gyh5ly] {
    margin-bottom: 1.25rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #f1f5f9;
}

.adm-dialog-section:last-child[b-40y3gyh5ly] {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.adm-dialog-section__title[b-40y3gyh5ly] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 0.75rem;
}

.adm-dialog-field[b-40y3gyh5ly] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.adm-dialog-field__label[b-40y3gyh5ly] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

.adm-dialog-field__value[b-40y3gyh5ly] {
    font-size: 0.85rem;
    color: #334155;
}

.adm-dialog-field__value--bold[b-40y3gyh5ly] {
    font-weight: 600;
    color: #1e293b;
}

/* Toggle Grid */
.adm-toggle-grid[b-40y3gyh5ly] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.adm-toggle-row[b-40y3gyh5ly] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 0;
    border-bottom: 1px solid #f8f9fb;
}

.adm-toggle-row:last-child[b-40y3gyh5ly] {
    border-bottom: none;
}

.adm-toggle-row__info[b-40y3gyh5ly] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.adm-toggle-row__label[b-40y3gyh5ly] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #1e293b;
}

.adm-toggle-row__hint[b-40y3gyh5ly] {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.3;
}
/* /Components/Pages/Admin/OnboardingAgents/OnboardingAgentReviews.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Onboarding Agent Reviews — Nordic Control Panel
   Inherits from AnalyticsDashboard design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-w6h7s5uyaf] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-w6h7s5uyaf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-w6h7s5uyaf] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-w6h7s5uyaf] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-w6h7s5uyaf] .adm-breadcrumbs {
    padding: 0;
}

[b-w6h7s5uyaf] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-w6h7s5uyaf] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-w6h7s5uyaf] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-w6h7s5uyaf] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-w6h7s5uyaf] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-w6h7s5uyaf] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-w6h7s5uyaf] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-w6h7s5uyaf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-w6h7s5uyaf] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-w6h7s5uyaf] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-w6h7s5uyaf] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-w6h7s5uyaf] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-w6h7s5uyaf] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-w6h7s5uyaf] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-w6h7s5uyaf] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-w6h7s5uyaf] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-w6h7s5uyaf] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-w6h7s5uyaf] {
    border-right: none;
}

.adm-kpi:hover[b-w6h7s5uyaf] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-w6h7s5uyaf] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-w6h7s5uyaf] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-w6h7s5uyaf] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-w6h7s5uyaf] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-w6h7s5uyaf] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-w6h7s5uyaf] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-w6h7s5uyaf] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-w6h7s5uyaf] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-w6h7s5uyaf] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-w6h7s5uyaf] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-w6h7s5uyaf] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-w6h7s5uyaf] .adm-tabs {
    background: transparent;
}

[b-w6h7s5uyaf] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-w6h7s5uyaf] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-w6h7s5uyaf] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-w6h7s5uyaf] .adm-tabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-w6h7s5uyaf] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-w6h7s5uyaf] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-w6h7s5uyaf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-w6h7s5uyaf] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-w6h7s5uyaf] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-w6h7s5uyaf] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-w6h7s5uyaf] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-w6h7s5uyaf] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-w6h7s5uyaf] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-w6h7s5uyaf] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLES
   ═══════════════════════════════════════════════════════ */
[b-w6h7s5uyaf] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-w6h7s5uyaf] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-w6h7s5uyaf] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-w6h7s5uyaf] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-w6h7s5uyaf] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-w6h7s5uyaf] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ─── Cell Styles ─── */
.adm-cell-code[b-w6h7s5uyaf] {
    font-weight: 600;
    color: #1e293b;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 0.85rem;
}

.adm-cell-text[b-w6h7s5uyaf] {
    font-size: 0.85rem;
    color: #334155;
}

.adm-cell-text--bold[b-w6h7s5uyaf] {
    font-weight: 600;
    color: #1e293b;
}

.adm-cell-text--muted[b-w6h7s5uyaf] {
    font-size: 0.78rem;
    color: #64748b;
}

/* ─── Action Icons ─── */
[b-w6h7s5uyaf] .adm-action-view {
    color: #3b82f6 !important;
}

[b-w6h7s5uyaf] .adm-action-edit {
    color: #35a0ae !important;
}

[b-w6h7s5uyaf] .adm-action-delete {
    color: #dc2626 !important;
}

/* ─── Empty State ─── */
.adm-empty-state[b-w6h7s5uyaf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 1.5rem;
}

/* ─── Chip contrast fixes (WCAG AA) ─── */
[b-w6h7s5uyaf] .adm-table .mud-chip-color-warning {
    color: #92400e !important;
}

[b-w6h7s5uyaf] .adm-table .mud-chip-color-success {
    color: #15803d !important;
}

[b-w6h7s5uyaf] .adm-table .mud-chip-color-error {
    color: #991b1b !important;
}

[b-w6h7s5uyaf] .adm-table .mud-chip-color-info {
    color: #1e40af !important;
}

/* ═══════════════════════════════════════════════════════
   DIALOG STYLES (::deep for MudDialog content)
   ═══════════════════════════════════════════════════════ */
[b-w6h7s5uyaf] .adm-dialog-title {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

[b-w6h7s5uyaf] .adm-review-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 1rem;
    border-radius: 8px;
    margin-bottom: 1rem;
}

[b-w6h7s5uyaf] .adm-review-banner__left {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

[b-w6h7s5uyaf] .adm-review-banner__label {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

[b-w6h7s5uyaf] .adm-review-banner__value {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0f172a;
}

[b-w6h7s5uyaf] .adm-dialog-section {
    margin-bottom: 1.25rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #f1f5f9;
}

[b-w6h7s5uyaf] .adm-dialog-section:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

[b-w6h7s5uyaf] .adm-dialog-section__title {
    font-size: 0.8rem;
    font-weight: 600;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 0.75rem;
}

[b-w6h7s5uyaf] .adm-dialog-field-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
}

[b-w6h7s5uyaf] .adm-dialog-field {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

[b-w6h7s5uyaf] .adm-dialog-field__label {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

[b-w6h7s5uyaf] .adm-dialog-field__value {
    font-size: 0.85rem;
    color: #334155;
}

[b-w6h7s5uyaf] .adm-dialog-field__value--bold {
    font-weight: 600;
    color: #1e293b;
}

[b-w6h7s5uyaf] .adm-dialog-field__value--wrap {
    white-space: pre-wrap;
    word-break: break-word;
    line-height: 1.5;
}

[b-w6h7s5uyaf] .adm-rating-grid {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

[b-w6h7s5uyaf] .adm-rating-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.375rem 0;
}

[b-w6h7s5uyaf] .adm-rating-row__label {
    min-width: 160px;
    font-size: 0.82rem;
    color: #475569;
    font-weight: 500;
}

[b-w6h7s5uyaf] .adm-rating-row__value {
    font-size: 0.82rem;
    color: #64748b;
    font-weight: 500;
    min-width: 30px;
    text-align: right;
}

[b-w6h7s5uyaf] .adm-edit-rating-grid {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

[b-w6h7s5uyaf] .adm-edit-rating-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.375rem 0;
}

[b-w6h7s5uyaf] .adm-edit-rating-row__label {
    font-size: 0.82rem;
    color: #475569;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-w6h7s5uyaf] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-w6h7s5uyaf] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-w6h7s5uyaf] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-w6h7s5uyaf] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-w6h7s5uyaf] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-w6h7s5uyaf] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-tab-toolbar[b-w6h7s5uyaf] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-w6h7s5uyaf] {
        width: 100%;
        margin-left: 0;
        flex-wrap: wrap;
    }

    [b-w6h7s5uyaf] .adm-filter-field {
        max-width: 100%;
        width: 100%;
        min-width: 0;
    }

    /* Mobile touch targets 44px */
    [b-w6h7s5uyaf] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }

    /* Refresh button touch target */
    [b-w6h7s5uyaf] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    /* Dialog field grid single column */
    [b-w6h7s5uyaf] .adm-dialog-field-grid {
        grid-template-columns: 1fr;
    }

    [b-w6h7s5uyaf] .adm-edit-rating-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-w6h7s5uyaf] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-w6h7s5uyaf] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-w6h7s5uyaf] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-w6h7s5uyaf] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-tab-toolbar[b-w6h7s5uyaf] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-w6h7s5uyaf] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    /* Overflow for table on mobile */
    [b-w6h7s5uyaf] .adm-table .mud-table-container {
        overflow-x: auto;
    }

    [b-w6h7s5uyaf] .adm-rating-row__label {
        min-width: 120px;
        font-size: 0.78rem;
    }
}
/* /Components/Pages/Admin/OnboardingAgents/OnboardingAgents.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Onboarding Agents — Nordic Control Panel
   Inherits from AnalyticsDashboard design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-moma2ksree] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-moma2ksree] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-moma2ksree] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-moma2ksree] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-moma2ksree] .adm-breadcrumbs {
    padding: 0;
}

[b-moma2ksree] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-moma2ksree] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-moma2ksree] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-moma2ksree] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-moma2ksree] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-moma2ksree] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-moma2ksree] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-moma2ksree] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-moma2ksree] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-moma2ksree] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-moma2ksree] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-moma2ksree] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-moma2ksree] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add Button */
[b-moma2ksree] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.82rem !important;
    letter-spacing: 0 !important;
}

/* Refresh Button */
[b-moma2ksree] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-moma2ksree] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-moma2ksree] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-moma2ksree] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-moma2ksree] {
    border-right: none;
}

.adm-kpi:hover[b-moma2ksree] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-moma2ksree] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-moma2ksree] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-moma2ksree] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-moma2ksree] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-moma2ksree] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-moma2ksree] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-moma2ksree] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-moma2ksree] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-moma2ksree] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-moma2ksree] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-moma2ksree] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-moma2ksree] .adm-tabs {
    background: transparent;
}

[b-moma2ksree] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-moma2ksree] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-moma2ksree] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-moma2ksree] .adm-tabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-moma2ksree] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-moma2ksree] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-moma2ksree] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-moma2ksree] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-moma2ksree] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-moma2ksree] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-moma2ksree] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-moma2ksree] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-moma2ksree] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-moma2ksree] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLES
   ═══════════════════════════════════════════════════════ */
[b-moma2ksree] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-moma2ksree] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-moma2ksree] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-moma2ksree] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-moma2ksree] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-moma2ksree] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ─── Cell Styles ─── */
.adm-cell-code[b-moma2ksree] {
    font-weight: 600;
    color: #1e293b;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 0.85rem;
}

.adm-cell-text[b-moma2ksree] {
    font-size: 0.85rem;
    color: #334155;
}

.adm-cell-count[b-moma2ksree] {
    font-size: 0.85rem;
    color: #334155;
    font-weight: 500;
}

.adm-cell-chips[b-moma2ksree] {
    display: flex;
    gap: 0.25rem;
    flex-wrap: wrap;
}

/* ─── Action Icons ─── */
[b-moma2ksree] .adm-action-edit {
    color: #35a0ae !important;
}

[b-moma2ksree] .adm-action-verify {
    color: #16a34a !important;
}

[b-moma2ksree] .adm-action-delete {
    color: #dc2626 !important;
}

/* ─── Empty State ─── */
.adm-empty-state[b-moma2ksree] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 1.5rem;
}

/* ─── Chip contrast fixes (WCAG AA) ─── */
[b-moma2ksree] .adm-table .mud-chip-color-warning {
    color: #92400e !important;
}

[b-moma2ksree] .adm-table .mud-chip-color-success {
    color: #15803d !important;
}

[b-moma2ksree] .adm-table .mud-chip-color-error {
    color: #991b1b !important;
}

[b-moma2ksree] .adm-table .mud-chip-color-info {
    color: #1e40af !important;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-moma2ksree] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-moma2ksree] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-moma2ksree] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-moma2ksree] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-moma2ksree] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-moma2ksree] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-tab-toolbar[b-moma2ksree] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-moma2ksree] {
        width: 100%;
        margin-left: 0;
        flex-wrap: wrap;
    }

    [b-moma2ksree] .adm-filter-field {
        max-width: 100%;
        width: 100%;
        min-width: 0;
    }

    /* Mobile touch targets 44px */
    [b-moma2ksree] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }

    /* Refresh button touch target */
    [b-moma2ksree] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    /* Add button touch target */
    [b-moma2ksree] .adm-add-btn {
        min-height: 44px !important;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-moma2ksree] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-moma2ksree] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-moma2ksree] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-moma2ksree] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-tab-toolbar[b-moma2ksree] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-moma2ksree] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    /* Overflow for table on mobile */
    [b-moma2ksree] .adm-table .mud-table-container {
        overflow-x: auto;
    }
}
/* /Components/Pages/Admin/OnboardingAgents/OnboardingAgentUsers.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Onboarding Agent Users — Nordic Control Panel
   Inherits from AnalyticsDashboard design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-frf0w9gwhv] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-frf0w9gwhv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-frf0w9gwhv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-frf0w9gwhv] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-frf0w9gwhv] .adm-breadcrumbs {
    padding: 0;
}

[b-frf0w9gwhv] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-frf0w9gwhv] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-frf0w9gwhv] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-frf0w9gwhv] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-frf0w9gwhv] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-frf0w9gwhv] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-frf0w9gwhv] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-frf0w9gwhv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-frf0w9gwhv] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-frf0w9gwhv] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-frf0w9gwhv] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-frf0w9gwhv] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-frf0w9gwhv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add Button */
[b-frf0w9gwhv] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.82rem !important;
    letter-spacing: 0 !important;
}

/* Refresh Button */
[b-frf0w9gwhv] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-frf0w9gwhv] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-frf0w9gwhv] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-frf0w9gwhv] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-frf0w9gwhv] {
    border-right: none;
}

.adm-kpi:hover[b-frf0w9gwhv] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-frf0w9gwhv] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-frf0w9gwhv] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-frf0w9gwhv] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-frf0w9gwhv] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-frf0w9gwhv] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-frf0w9gwhv] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-frf0w9gwhv] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-frf0w9gwhv] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-frf0w9gwhv] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-frf0w9gwhv] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-frf0w9gwhv] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-frf0w9gwhv] .adm-tabs {
    background: transparent;
}

[b-frf0w9gwhv] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-frf0w9gwhv] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-frf0w9gwhv] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-frf0w9gwhv] .adm-tabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-frf0w9gwhv] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-frf0w9gwhv] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-frf0w9gwhv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-frf0w9gwhv] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-frf0w9gwhv] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-frf0w9gwhv] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-frf0w9gwhv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-frf0w9gwhv] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-frf0w9gwhv] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-frf0w9gwhv] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLES
   ═══════════════════════════════════════════════════════ */
[b-frf0w9gwhv] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-frf0w9gwhv] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-frf0w9gwhv] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-frf0w9gwhv] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-frf0w9gwhv] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-frf0w9gwhv] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ─── Cell Styles ─── */
.adm-cell-code[b-frf0w9gwhv] {
    font-weight: 600;
    color: #1e293b;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 0.85rem;
}

.adm-cell-text[b-frf0w9gwhv] {
    font-size: 0.85rem;
    color: #334155;
}

.adm-cell-text--bold[b-frf0w9gwhv] {
    font-weight: 600;
    color: #1e293b;
}

.adm-cell-text--muted[b-frf0w9gwhv] {
    font-size: 0.78rem;
    color: #64748b;
}

.adm-cell-agent[b-frf0w9gwhv] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

/* ─── Action Icons ─── */
[b-frf0w9gwhv] .adm-action-edit {
    color: #35a0ae !important;
}

[b-frf0w9gwhv] .adm-action-delete {
    color: #dc2626 !important;
}

/* ─── Empty State ─── */
.adm-empty-state[b-frf0w9gwhv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 1.5rem;
}

/* ─── Chip contrast fixes (WCAG AA) ─── */
[b-frf0w9gwhv] .adm-table .mud-chip-color-warning {
    color: #92400e !important;
}

[b-frf0w9gwhv] .adm-table .mud-chip-color-success {
    color: #15803d !important;
}

[b-frf0w9gwhv] .adm-table .mud-chip-color-error {
    color: #991b1b !important;
}

[b-frf0w9gwhv] .adm-table .mud-chip-color-info {
    color: #1e40af !important;
}

/* ═══════════════════════════════════════════════════════
   DIALOG STYLES (::deep for MudDialog content)
   ═══════════════════════════════════════════════════════ */
[b-frf0w9gwhv] .adm-dialog-title {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-frf0w9gwhv] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-frf0w9gwhv] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-frf0w9gwhv] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-frf0w9gwhv] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-frf0w9gwhv] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-frf0w9gwhv] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-tab-toolbar[b-frf0w9gwhv] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-frf0w9gwhv] {
        width: 100%;
        margin-left: 0;
        flex-wrap: wrap;
    }

    [b-frf0w9gwhv] .adm-filter-field {
        max-width: 100%;
        width: 100%;
        min-width: 0;
    }

    /* Mobile touch targets 44px */
    [b-frf0w9gwhv] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }

    /* Refresh button touch target */
    [b-frf0w9gwhv] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    /* Add button touch target */
    [b-frf0w9gwhv] .adm-add-btn {
        min-height: 44px !important;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-frf0w9gwhv] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-frf0w9gwhv] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-frf0w9gwhv] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-frf0w9gwhv] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-tab-toolbar[b-frf0w9gwhv] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-frf0w9gwhv] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    /* Overflow for table on mobile */
    [b-frf0w9gwhv] .adm-table .mud-table-container {
        overflow-x: auto;
    }
}
/* /Components/Pages/Admin/OnboardingAgents/UserOnboardingAgentPrivacies.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Agent Privacies — Nordic Control Panel
   Inherits from AnalyticsDashboard design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-v11650dkkw] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-v11650dkkw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-v11650dkkw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-v11650dkkw] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-v11650dkkw] .adm-breadcrumbs {
    padding: 0;
}

[b-v11650dkkw] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-v11650dkkw] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-v11650dkkw] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-v11650dkkw] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-v11650dkkw] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-v11650dkkw] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-v11650dkkw] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-v11650dkkw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-v11650dkkw] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-v11650dkkw] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-v11650dkkw] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-v11650dkkw] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-v11650dkkw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add Button */
[b-v11650dkkw] .adm-add-btn {
    font-weight: 600;
    font-size: 0.82rem;
    letter-spacing: 0.01em;
}

/* Refresh Button */
[b-v11650dkkw] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-v11650dkkw] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-v11650dkkw] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-v11650dkkw] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-v11650dkkw] {
    border-right: none;
}

.adm-kpi:hover[b-v11650dkkw] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-v11650dkkw] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-v11650dkkw] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-v11650dkkw] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-v11650dkkw] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-v11650dkkw] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-v11650dkkw] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-v11650dkkw] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-v11650dkkw] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-v11650dkkw] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-v11650dkkw] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-v11650dkkw] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-v11650dkkw] .adm-tabs {
    background: transparent;
}

[b-v11650dkkw] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-v11650dkkw] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-v11650dkkw] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-v11650dkkw] .adm-tabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-v11650dkkw] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-v11650dkkw] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-v11650dkkw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-v11650dkkw] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-v11650dkkw] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-v11650dkkw] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-v11650dkkw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-v11650dkkw] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-v11650dkkw] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-v11650dkkw] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLES
   ═══════════════════════════════════════════════════════ */
[b-v11650dkkw] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-v11650dkkw] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-v11650dkkw] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-v11650dkkw] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-v11650dkkw] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-v11650dkkw] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ─── Cell Styles ─── */
.adm-cell-code[b-v11650dkkw] {
    font-weight: 600;
    color: #1e293b;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 0.85rem;
}

.adm-cell-text--bold[b-v11650dkkw] {
    font-weight: 600;
    color: #1e293b;
}

/* ─── Action Icons ─── */
[b-v11650dkkw] .adm-action-edit {
    color: #35a0ae !important;
}

[b-v11650dkkw] .adm-action-delete {
    color: #dc2626 !important;
}

/* ─── Empty State ─── */
.adm-empty-state[b-v11650dkkw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 1.5rem;
}

/* ─── Chip contrast fixes (WCAG AA) ─── */
[b-v11650dkkw] .adm-table .mud-chip-color-success {
    color: #15803d !important;
}

[b-v11650dkkw] .adm-table .mud-chip-color-default {
    color: #475569 !important;
}

/* Dialog styles moved to AgentPrivacyEditDialog.razor.css (L2 fix) */

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-v11650dkkw] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-v11650dkkw] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-v11650dkkw] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-v11650dkkw] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-v11650dkkw] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-v11650dkkw] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-tab-toolbar[b-v11650dkkw] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-v11650dkkw] {
        width: 100%;
        margin-left: 0;
        flex-wrap: wrap;
    }

    [b-v11650dkkw] .adm-filter-field {
        max-width: 100%;
        width: 100%;
        min-width: 0;
    }

    /* Mobile touch targets 44px */
    [b-v11650dkkw] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }

    /* Refresh button touch target */
    [b-v11650dkkw] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    /* Dialog toggle rows stack on mobile */
    [b-v11650dkkw] .adm-toggle-row {
        flex-direction: row;
        gap: 0.5rem;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-v11650dkkw] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-v11650dkkw] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-v11650dkkw] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-v11650dkkw] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-tab-toolbar[b-v11650dkkw] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-v11650dkkw] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    /* Overflow for table on mobile */
    [b-v11650dkkw] .adm-table .mud-table-container {
        overflow-x: auto;
    }
}
/* /Components/Pages/Admin/OrderManagement/OrderManagement.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Order Management — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + Rentals + Stores standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-bri2c3j2u8] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-bri2c3j2u8] .adm-breadcrumbs {
    padding: 0;
}

[b-bri2c3j2u8] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-bri2c3j2u8] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-bri2c3j2u8] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-bri2c3j2u8] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-bri2c3j2u8] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-bri2c3j2u8] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-bri2c3j2u8] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-bri2c3j2u8] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-bri2c3j2u8] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-bri2c3j2u8] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-bri2c3j2u8] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Bulk Action Button */
[b-bri2c3j2u8] .adm-bulk-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.82rem !important;
    letter-spacing: 0 !important;
    padding: 0.375rem 1rem !important;
}

/* Refresh Button */
[b-bri2c3j2u8] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-bri2c3j2u8] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   ALERT BANNER
   ═══════════════════════════════════════════════════════ */
.adm-alert-banner[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem 1.5rem;
    font-size: 0.82rem;
    font-weight: 500;
}

.adm-alert-banner--warn[b-bri2c3j2u8] {
    background: #fefce8;
    border-bottom: 1px solid #fde68a;
    color: #92400e;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-bri2c3j2u8] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-bri2c3j2u8] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.25rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-bri2c3j2u8] {
    border-right: none;
}

.adm-kpi:hover[b-bri2c3j2u8] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-bri2c3j2u8] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-bri2c3j2u8] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-bri2c3j2u8] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.adm-kpi__detail[b-bri2c3j2u8] {
    font-size: 0.7rem;
    color: #64748b;
    font-weight: 400;
}

.adm-kpi__detail--success[b-bri2c3j2u8] {
    color: #16a34a;
}

.adm-kpi__detail--warn[b-bri2c3j2u8] {
    color: #d97706;
}

.adm-kpi__detail--error[b-bri2c3j2u8] {
    color: #dc2626;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-bri2c3j2u8] .adm-tabs {
    background: transparent;
}

[b-bri2c3j2u8] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-bri2c3j2u8] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-bri2c3j2u8] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-bri2c3j2u8] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-bri2c3j2u8] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-bri2c3j2u8] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-bri2c3j2u8] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-bri2c3j2u8] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-bri2c3j2u8] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter Field */
[b-bri2c3j2u8] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-bri2c3j2u8] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-bri2c3j2u8] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   FILTER ROW
   ═══════════════════════════════════════════════════════ */
.adm-filter-row[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

[b-bri2c3j2u8] .adm-filter-select {
    min-width: 160px;
    max-width: 200px;
}

[b-bri2c3j2u8] .adm-filter-select .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-bri2c3j2u8] .adm-filter-select .mud-input {
    font-size: 0.85rem;
}

[b-bri2c3j2u8] .adm-date-picker {
    max-width: 250px;
    min-width: 190px;
}

[b-bri2c3j2u8] .adm-date-picker .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-bri2c3j2u8] .adm-date-picker .mud-input {
    color: #334155 !important;
    font-size: 0.85rem;
}

[b-bri2c3j2u8] .adm-date-picker .mud-input-label {
    color: #64748b !important;
}

/* ═══════════════════════════════════════════════════════
   TABLES
   ═══════════════════════════════════════════════════════ */
[b-bri2c3j2u8] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-bri2c3j2u8] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-bri2c3j2u8] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-bri2c3j2u8] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-bri2c3j2u8] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-bri2c3j2u8] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ─── Monospace ─── */
.adm-mono[b-bri2c3j2u8] {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    color: #334155;
}

.adm-table-sub[b-bri2c3j2u8] {
    font-size: 0.72rem;
    color: #94a3b8;
}

.adm-table-refund[b-bri2c3j2u8] {
    font-size: 0.75rem;
    color: #dc2626;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   CUSTOM CHIPS (CSS-only status badges)
   ═══════════════════════════════════════════════════════ */
.adm-chip[b-bri2c3j2u8],
[b-bri2c3j2u8] .adm-chip {
    display: inline-block;
    padding: 0.175rem 0.5rem;
    border-radius: 8px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.adm-chip--primary[b-bri2c3j2u8] {
    background: rgba(53, 160, 174, 0.1);
    color: #0e7490;
}

.adm-chip--secondary[b-bri2c3j2u8] {
    background: rgba(239, 65, 44, 0.08);
    color: #b91c1c;
}

.adm-chip--success[b-bri2c3j2u8] {
    background: rgba(22, 163, 74, 0.1);
    color: #15803d;
}

.adm-chip--warn[b-bri2c3j2u8] {
    background: rgba(245, 158, 11, 0.12);
    color: #92400e;
}

.adm-chip--error[b-bri2c3j2u8] {
    background: rgba(220, 38, 38, 0.1);
    color: #b91c1c;
}

.adm-chip--info[b-bri2c3j2u8] {
    background: rgba(59, 130, 246, 0.1);
    color: #1d4ed8;
}

.adm-chip--muted[b-bri2c3j2u8] {
    background: #f1f5f9;
    color: #64748b;
}

/* ═══════════════════════════════════════════════════════
   ACTION ICONS
   ═══════════════════════════════════════════════════════ */
.adm-actions-inline[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    gap: 0.125rem;
}

[b-bri2c3j2u8] .adm-action-icon {
    color: #475569 !important;
    border-radius: 8px !important;
    min-width: 36px !important;
    min-height: 36px !important;
}

[b-bri2c3j2u8] .adm-action-icon:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
}

[b-bri2c3j2u8] .adm-action-icon--warn:hover {
    background: rgba(245, 158, 11, 0.08) !important;
    color: #d97706 !important;
}

[b-bri2c3j2u8] .adm-action-icon--error:hover {
    background: rgba(220, 38, 38, 0.08) !important;
    color: #dc2626 !important;
}

/* ─── Empty State ─── */
.adm-empty-state[b-bri2c3j2u8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 1rem;
    color: #64748b;
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-bri2c3j2u8] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-bri2c3j2u8] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-bri2c3j2u8] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS (for dialog)
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-bri2c3j2u8] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 0;
}

.adm-detail-grid--dialog[b-bri2c3j2u8] {
    padding: 0;
}

.adm-detail-card[b-bri2c3j2u8] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #f8f9fb;
    border: 1px solid #e8ecf1;
    overflow: hidden;
}

.adm-detail-card__bar[b-bri2c3j2u8] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-bri2c3j2u8] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-bri2c3j2u8] {
    font-size: 1.125rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-bri2c3j2u8] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   DIALOG
   ═══════════════════════════════════════════════════════ */
.adm-dialog-title[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    color: #0f172a;
}

.adm-dialog-body[b-bri2c3j2u8] {
    padding: 0.5rem 0;
}

/* ─── Detail List ─── */
.adm-detail-list[b-bri2c3j2u8] {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 1rem;
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    overflow: hidden;
}

.adm-detail-list__row[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 1rem;
    border-bottom: 1px solid #f3f4f6;
}

.adm-detail-list__row:last-child[b-bri2c3j2u8] {
    border-bottom: none;
}

.adm-detail-list__row:nth-child(even)[b-bri2c3j2u8] {
    background: #f8f9fb;
}

.adm-detail-list__label[b-bri2c3j2u8] {
    font-size: 0.82rem;
    color: #64748b;
    font-weight: 500;
}

.adm-detail-list__value[b-bri2c3j2u8] {
    font-size: 0.85rem;
    color: #0f172a;
    font-weight: 500;
    text-align: right;
}

/* ─── Order Items (dialog) ─── */
.adm-order-items[b-bri2c3j2u8] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0 0 0.5rem;
}

.adm-order-item[b-bri2c3j2u8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 1rem;
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    background: #ffffff;
}

.adm-order-item__info[b-bri2c3j2u8] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.adm-order-item__name[b-bri2c3j2u8] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1e293b;
}

.adm-order-item__store[b-bri2c3j2u8] {
    font-size: 0.78rem;
    color: #64748b;
}

.adm-order-item__dates[b-bri2c3j2u8] {
    font-size: 0.72rem;
    color: #94a3b8;
}

.adm-order-item__right[b-bri2c3j2u8] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.375rem;
    flex-shrink: 0;
}

.adm-order-item__price[b-bri2c3j2u8] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-bri2c3j2u8] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-bri2c3j2u8] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-bri2c3j2u8] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-detail-grid[b-bri2c3j2u8] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-bri2c3j2u8] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-bri2c3j2u8] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-bri2c3j2u8] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-filter-row[b-bri2c3j2u8] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-bri2c3j2u8] .adm-filter-select {
        max-width: 100%;
    }

    [b-bri2c3j2u8] .adm-date-picker {
        max-width: 100%;
    }

    .adm-detail-grid[b-bri2c3j2u8] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-bri2c3j2u8] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-bri2c3j2u8] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-bri2c3j2u8] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-bri2c3j2u8] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-bri2c3j2u8] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-bri2c3j2u8] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-section-header[b-bri2c3j2u8],
    .adm-tab-toolbar[b-bri2c3j2u8] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-filter-row[b-bri2c3j2u8] {
        padding: 0.75rem 0.875rem;
    }

    [b-bri2c3j2u8] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    [b-bri2c3j2u8] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    .adm-tab-toolbar[b-bri2c3j2u8] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-bri2c3j2u8] {
        width: 100%;
        margin-left: 0;
    }

    .adm-order-item[b-bri2c3j2u8] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-order-item__right[b-bri2c3j2u8] {
        align-items: flex-start;
        width: 100%;
        flex-direction: row;
        justify-content: space-between;
    }
}

/* ═══════════════════════════════════════════════════════
   DEEP STYLES — Penetrate into sub-components
   (PaymentTimeoutMonitor, OrderTransactionsGrid, OrderAnalytics)
   ═══════════════════════════════════════════════════════ */

/* Sub-component tab toolbars */
[b-bri2c3j2u8] .adm-tab-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

[b-bri2c3j2u8] .adm-tab-toolbar__left {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

[b-bri2c3j2u8] .adm-tab-toolbar__title {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

[b-bri2c3j2u8] .adm-tab-toolbar__count {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

[b-bri2c3j2u8] .adm-tab-toolbar__right {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Sub-component detail grids */
[b-bri2c3j2u8] .adm-detail-grid--timeout,
[b-bri2c3j2u8] .adm-detail-grid--transactions,
[b-bri2c3j2u8] .adm-detail-grid--analytics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

[b-bri2c3j2u8] .adm-detail-grid--analytics {
    grid-template-columns: repeat(4, 1fr);
}

[b-bri2c3j2u8] .adm-detail-card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
}

[b-bri2c3j2u8] .adm-detail-card__bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

[b-bri2c3j2u8] .adm-detail-card__data {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

[b-bri2c3j2u8] .adm-detail-card__number {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

[b-bri2c3j2u8] .adm-detail-card__label {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

[b-bri2c3j2u8] .adm-detail-card__sub {
    font-size: 0.7rem;
    color: #94a3b8;
    font-weight: 400;
}

/* Sub-component section headers */
[b-bri2c3j2u8] .adm-section-header {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

[b-bri2c3j2u8] .adm-section-header__title {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

[b-bri2c3j2u8] .adm-section-header__subtitle {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* Sub-component tables */
[b-bri2c3j2u8] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-bri2c3j2u8] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-bri2c3j2u8] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-bri2c3j2u8] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-bri2c3j2u8] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-bri2c3j2u8] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* Sub-component monospace */
[b-bri2c3j2u8] .adm-mono {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    color: #334155;
}

[b-bri2c3j2u8] .adm-table-sub {
    font-size: 0.72rem;
    color: #94a3b8;
}

/* Sub-component chips */
[b-bri2c3j2u8] .adm-chip--primary { background: rgba(53, 160, 174, 0.1); color: #0e7490; }
[b-bri2c3j2u8] .adm-chip--secondary { background: rgba(239, 65, 44, 0.08); color: #b91c1c; }
[b-bri2c3j2u8] .adm-chip--success { background: rgba(22, 163, 74, 0.1); color: #15803d; }
[b-bri2c3j2u8] .adm-chip--warn { background: rgba(245, 158, 11, 0.12); color: #92400e; }
[b-bri2c3j2u8] .adm-chip--error { background: rgba(220, 38, 38, 0.1); color: #b91c1c; }
[b-bri2c3j2u8] .adm-chip--info { background: rgba(59, 130, 246, 0.1); color: #1d4ed8; }
[b-bri2c3j2u8] .adm-chip--muted { background: #f1f5f9; color: #64748b; }

/* Sub-component action icons */
[b-bri2c3j2u8] .adm-actions-inline {
    display: flex;
    align-items: center;
    gap: 0.125rem;
}

/* Empty state */
[b-bri2c3j2u8] .adm-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 1rem;
    color: #64748b;
    font-size: 0.85rem;
}

/* Transaction chips container */
[b-bri2c3j2u8] .adm-tx-chips {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

/* Outline button (Reactivate) */
[b-bri2c3j2u8] .adm-outline-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-bri2c3j2u8] .adm-outline-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    border-color: #35a0ae !important;
}

/* Analytics dual-panel grid */
[b-bri2c3j2u8] .adm-analytics-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}

[b-bri2c3j2u8] .adm-analytics-panel {
    border-right: 1px solid #f1f5f9;
}

[b-bri2c3j2u8] .adm-analytics-panel:last-child {
    border-right: none;
}

/* ─── Sub-component responsive ─── */
@media (max-width: 1280px) {
    [b-bri2c3j2u8] .adm-detail-grid--analytics {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    [b-bri2c3j2u8] .adm-detail-grid--timeout,
    [b-bri2c3j2u8] .adm-detail-grid--transactions {
        grid-template-columns: 1fr;
    }

    [b-bri2c3j2u8] .adm-detail-grid--analytics {
        grid-template-columns: 1fr;
    }

    [b-bri2c3j2u8] .adm-analytics-grid {
        grid-template-columns: 1fr;
    }

    [b-bri2c3j2u8] .adm-analytics-panel {
        border-right: none;
        border-bottom: 1px solid #f1f5f9;
    }

    [b-bri2c3j2u8] .adm-tab-toolbar {
        flex-direction: column;
        align-items: flex-start;
    }

    [b-bri2c3j2u8] .adm-tab-toolbar__right {
        width: 100%;
        margin-left: 0;
    }
}

@media (max-width: 600px) {
    [b-bri2c3j2u8] .adm-detail-grid--timeout,
    [b-bri2c3j2u8] .adm-detail-grid--transactions,
    [b-bri2c3j2u8] .adm-detail-grid--analytics {
        padding: 0.75rem 0.875rem;
    }

    [b-bri2c3j2u8] .adm-section-header {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-bri2c3j2u8] .adm-tab-toolbar {
        padding: 0.75rem 0.875rem;
    }
}
/* /Components/Pages/Admin/PaymentGateways/PaymentGateways.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Payment Gateways — Nordic Control Panel
   Scoped CSS for admin payment gateway management page.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-idrghiunir] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-idrghiunir] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-idrghiunir] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-idrghiunir] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-idrghiunir] .adm-breadcrumbs {
    padding: 0;
}

[b-idrghiunir] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-idrghiunir] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-idrghiunir] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-idrghiunir] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-idrghiunir] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill--warn[b-idrghiunir] {
    background: #fefce8;
    border-color: #fde68a;
    color: #92400e;
}

.adm-status-pill__dot[b-idrghiunir] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-idrghiunir] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-idrghiunir] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-idrghiunir] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-idrghiunir] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-idrghiunir] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-idrghiunir] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-idrghiunir] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-idrghiunir] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-idrghiunir] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-idrghiunir] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-idrghiunir] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-idrghiunir] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-idrghiunir] {
    border-right: none;
}

.adm-kpi:hover[b-idrghiunir] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-idrghiunir] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-idrghiunir] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-idrghiunir] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-idrghiunir] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* KPI Alert variant */
.adm-kpi--alert[b-idrghiunir] {
    background: rgba(239, 68, 68, 0.03);
}

.adm-kpi--alert:hover[b-idrghiunir] {
    background: rgba(239, 68, 68, 0.06);
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-idrghiunir] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-idrghiunir] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-idrghiunir] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-idrghiunir] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-idrghiunir] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-idrghiunir] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-idrghiunir] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-idrghiunir] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-idrghiunir] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-idrghiunir] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-idrghiunir] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-idrghiunir] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-idrghiunir] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-idrghiunir] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-idrghiunir] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-idrghiunir] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-idrghiunir] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-idrghiunir] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
[b-idrghiunir] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-idrghiunir] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-idrghiunir] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-idrghiunir] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-idrghiunir] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-idrghiunir] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ═══════════════════════════════════════════════════════
   CHIP OVERRIDES (WCAG AA contrast)
   ═══════════════════════════════════════════════════════ */
[b-idrghiunir] .adm-chip.mud-chip-color-success {
    background: #dcfce7 !important;
    color: #15803d !important;
}

[b-idrghiunir] .adm-chip.mud-chip-color-default {
    background: #f1f5f9 !important;
    color: #475569 !important;
}

[b-idrghiunir] .adm-chip.mud-chip-color-error {
    background: #fee2e2 !important;
    color: #b91c1c !important;
}

[b-idrghiunir] .adm-chip.mud-chip-color-warning {
    background: #fef3c7 !important;
    color: #92400e !important;
}

/* ═══════════════════════════════════════════════════════
   PAGE-SPECIFIC: Gateway cell + Fee values
   ═══════════════════════════════════════════════════════ */
.adm-gateway-cell[b-idrghiunir] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.adm-user-name[b-idrghiunir] {
    font-weight: 600;
    color: #1e293b;
    font-size: 0.85rem;
}

.adm-fee-value[b-idrghiunir] {
    font-variant-numeric: tabular-nums;
    font-weight: 500;
    color: #334155;
    font-size: 0.85rem;
}

/* Monospace */
.adm-mono[b-idrghiunir] {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    color: #334155;
}

/* Empty State */
.adm-empty-state[b-idrghiunir] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1rem;
    color: #64748b;
    font-size: 0.875rem;
}

/* ═══════════════════════════════════════════════════════
   DIALOG STYLES
   ═══════════════════════════════════════════════════════ */
.adm-dialog-content[b-idrghiunir] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.5rem 0;
}

.adm-dialog-grid[b-idrghiunir] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-idrghiunir] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-idrghiunir] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2)[b-idrghiunir] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-idrghiunir] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-idrghiunir] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-idrghiunir] {
        margin-left: 0;
        width: 100%;
    }

    .adm-dialog-grid[b-idrghiunir] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-idrghiunir] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-idrghiunir] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-idrghiunir] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-idrghiunir] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-idrghiunir] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-detail-grid[b-idrghiunir] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-idrghiunir],
    .adm-tab-toolbar[b-idrghiunir] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-tab-toolbar[b-idrghiunir] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-idrghiunir] {
        width: 100%;
        margin-left: 0;
    }

    [b-idrghiunir] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    /* Touch target: 44px minimum */
    [b-idrghiunir] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }
}
/* /Components/Pages/Admin/PaymentMonitoring/PaymentMonitoring.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Payment Monitoring — Nordic Control Panel
   Scoped CSS for admin payment monitoring page.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-ss7fhq17sh] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-ss7fhq17sh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-ss7fhq17sh] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-ss7fhq17sh] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-ss7fhq17sh] .adm-breadcrumbs {
    padding: 0;
}

[b-ss7fhq17sh] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-ss7fhq17sh] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-ss7fhq17sh] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-ss7fhq17sh] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-ss7fhq17sh] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill--warn[b-ss7fhq17sh] {
    background: #fefce8;
    border-color: #fde68a;
    color: #92400e;
}

.adm-status-pill__dot[b-ss7fhq17sh] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-ss7fhq17sh] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-ss7fhq17sh] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-ss7fhq17sh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-ss7fhq17sh] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-ss7fhq17sh] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-ss7fhq17sh] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-ss7fhq17sh] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-ss7fhq17sh] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-ss7fhq17sh] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-ss7fhq17sh] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-ss7fhq17sh] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-ss7fhq17sh] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-ss7fhq17sh] {
    border-right: none;
}

.adm-kpi:hover[b-ss7fhq17sh] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-ss7fhq17sh] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-ss7fhq17sh] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-ss7fhq17sh] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-ss7fhq17sh] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* KPI Alert variant */
.adm-kpi--alert[b-ss7fhq17sh] {
    background: rgba(239, 68, 68, 0.03);
}

.adm-kpi--alert:hover[b-ss7fhq17sh] {
    background: rgba(239, 68, 68, 0.06);
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-ss7fhq17sh] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-ss7fhq17sh] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-ss7fhq17sh] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-ss7fhq17sh] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-ss7fhq17sh] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-ss7fhq17sh] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-ss7fhq17sh] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-ss7fhq17sh] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-ss7fhq17sh] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-ss7fhq17sh] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
.adm-tabs-container[b-ss7fhq17sh] {
    background: #ffffff;
}

[b-ss7fhq17sh] .adm-tabs .mud-tabs-header {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
}

[b-ss7fhq17sh] .adm-tabs .mud-tab {
    text-transform: none !important;
    font-weight: 500;
    font-size: 0.85rem;
    color: #64748b;
    min-height: 44px;
    letter-spacing: 0;
}

[b-ss7fhq17sh] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-ss7fhq17sh] .adm-tabs .mud-tabs-slider {
    background: #35a0ae;
}

[b-ss7fhq17sh] .adm-tab-panel {
    padding: 0 !important;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR (used by sub-components)
   ═══════════════════════════════════════════════════════ */
[b-ss7fhq17sh] .adm-tab-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

[b-ss7fhq17sh] .adm-tab-toolbar__left {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

[b-ss7fhq17sh] .adm-tab-toolbar__title {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

[b-ss7fhq17sh] .adm-tab-toolbar__count {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

[b-ss7fhq17sh] .adm-tab-toolbar__right {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Select filter */
[b-ss7fhq17sh] .adm-select-filter {
    max-width: 160px;
    min-width: 120px;
    font-size: 0.85rem;
}

[b-ss7fhq17sh] .adm-select-filter .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

/* Filter field */
[b-ss7fhq17sh] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-ss7fhq17sh] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-ss7fhq17sh] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLE (used by sub-components)
   ═══════════════════════════════════════════════════════ */
[b-ss7fhq17sh] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-ss7fhq17sh] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-ss7fhq17sh] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-ss7fhq17sh] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-ss7fhq17sh] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-ss7fhq17sh] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ═══════════════════════════════════════════════════════
   CHIP OVERRIDES (WCAG AA contrast)
   ═══════════════════════════════════════════════════════ */
[b-ss7fhq17sh] .adm-chip.mud-chip-color-success {
    background: #dcfce7 !important;
    color: #15803d !important;
}

[b-ss7fhq17sh] .adm-chip.mud-chip-color-default {
    background: #f1f5f9 !important;
    color: #475569 !important;
}

[b-ss7fhq17sh] .adm-chip.mud-chip-color-error {
    background: #fee2e2 !important;
    color: #b91c1c !important;
}

[b-ss7fhq17sh] .adm-chip.mud-chip-color-warning {
    background: #fef3c7 !important;
    color: #92400e !important;
}

[b-ss7fhq17sh] .adm-chip.mud-chip-color-info {
    background: #dbeafe !important;
    color: #1e40af !important;
}

/* ═══════════════════════════════════════════════════════
   PAGE-SPECIFIC STYLES
   ═══════════════════════════════════════════════════════ */

/* Monospace text */
[b-ss7fhq17sh] .adm-mono {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    color: #334155;
}

/* User cell */
[b-ss7fhq17sh] .adm-user-cell {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

[b-ss7fhq17sh] .adm-user-name {
    font-weight: 600;
    color: #1e293b;
    font-size: 0.85rem;
}

[b-ss7fhq17sh] .adm-user-email {
    font-size: 0.75rem;
    color: #64748b;
}

/* Amount values */
[b-ss7fhq17sh] .adm-amount {
    font-variant-numeric: tabular-nums;
    font-weight: 500;
    color: #334155;
    font-size: 0.85rem;
}

/* Empty State */
[b-ss7fhq17sh] .adm-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1rem;
    color: #64748b;
    font-size: 0.875rem;
}

/* Real-time event feed */
[b-ss7fhq17sh] .adm-event-feed {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 500px;
    overflow-y: auto;
    padding: 0 1.5rem 1rem;
}

[b-ss7fhq17sh] .adm-event-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.625rem 1rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    transition: box-shadow 0.15s ease;
}

[b-ss7fhq17sh] .adm-event-item:hover {
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.06);
}

[b-ss7fhq17sh] .adm-event-item__time {
    font-size: 0.78rem;
    color: #64748b;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    min-width: 55px;
}

[b-ss7fhq17sh] .adm-event-item__icon {
    flex-shrink: 0;
}

[b-ss7fhq17sh] .adm-event-item__details {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

[b-ss7fhq17sh] .adm-event-item__ref {
    font-weight: 600;
    font-size: 0.82rem;
    color: #1e293b;
}

[b-ss7fhq17sh] .adm-event-item__sub {
    font-size: 0.75rem;
    color: #64748b;
}

[b-ss7fhq17sh] .adm-event-item__amount {
    font-weight: 600;
    font-size: 0.85rem;
    font-variant-numeric: tabular-nums;
    color: #0f172a;
    white-space: nowrap;
}

/* Hub connection dot */
[b-ss7fhq17sh] .adm-hub-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

[b-ss7fhq17sh] .adm-hub-dot--connected {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
    animation: adm-pulse-b-ss7fhq17sh 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

[b-ss7fhq17sh] .adm-hub-dot--disconnected {
    background: #ef4444;
    box-shadow: 0 0 6px rgba(239, 68, 68, 0.3);
}

@keyframes adm-pulse-b-ss7fhq17sh {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.45);
    }
    50% {
        box-shadow: 0 0 0 8px rgba(34, 197, 94, 0);
    }
}

/* Detail grid used in sub-components */
[b-ss7fhq17sh] .adm-detail-grid--sub {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 0.75rem 1.5rem 1rem;
}

/* Dialog styles */
[b-ss7fhq17sh] .adm-dialog-content {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.5rem 0;
}

/* Timeline for transaction history */
[b-ss7fhq17sh] .adm-timeline-item {
    display: flex;
    gap: 0.75rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f3f4f6;
}

[b-ss7fhq17sh] .adm-timeline-item:last-child {
    border-bottom: none;
}

[b-ss7fhq17sh] .adm-timeline-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-top: 0.375rem;
    flex-shrink: 0;
}

[b-ss7fhq17sh] .adm-timeline-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

/* Webhook raw payload */
[b-ss7fhq17sh] .adm-raw-payload {
    background: #1e293b;
    color: #e2e8f0;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.78rem;
    padding: 1rem;
    border-radius: 8px;
    max-height: 400px;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-all;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-ss7fhq17sh] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-ss7fhq17sh] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-ss7fhq17sh] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-ss7fhq17sh] {
        border-top: 1px solid #f1f5f9;
    }

    [b-ss7fhq17sh] .adm-detail-grid--sub {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-ss7fhq17sh] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-ss7fhq17sh] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-ss7fhq17sh] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-ss7fhq17sh] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-ss7fhq17sh] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-ss7fhq17sh] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-ss7fhq17sh] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-ss7fhq17sh] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-ss7fhq17sh] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-ss7fhq17sh] {
        border-top: 1px solid #f1f5f9;
    }

    /* 5th KPI spans full width so it doesn't sit alone */
    .adm-kpi:nth-child(5)[b-ss7fhq17sh] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-ss7fhq17sh] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-ss7fhq17sh] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-ss7fhq17sh] .adm-tab-toolbar {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
        flex-direction: column;
        align-items: flex-start;
    }

    [b-ss7fhq17sh] .adm-tab-toolbar__right {
        width: 100%;
        margin-left: 0;
    }

    [b-ss7fhq17sh] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    [b-ss7fhq17sh] .adm-select-filter {
        max-width: 100%;
        width: 100%;
    }

    [b-ss7fhq17sh] .adm-detail-grid--sub {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem 1rem;
    }

    [b-ss7fhq17sh] .adm-event-feed {
        padding: 0 0.875rem 1rem;
    }

    /* Touch target: 44px minimum */
    [b-ss7fhq17sh] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }

    [b-ss7fhq17sh] .adm-tabs .mud-tabs-header {
        padding: 0 0.875rem;
    }
}
/* /Components/Pages/Admin/PaymentRequests/PaymentRequests.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Payment Requests — Nordic Control Panel
   Scoped styles extending the admin design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-rq13b89oit] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════ ACTION BAR ═══════════════════ */
.adm-actionbar[b-rq13b89oit] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-rq13b89oit] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-rq13b89oit] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-rq13b89oit] .adm-breadcrumbs {
    padding: 0;
}

[b-rq13b89oit] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-rq13b89oit] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-rq13b89oit] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-rq13b89oit] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-rq13b89oit] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill--warn[b-rq13b89oit] {
    background: #fef3c7;
    border-color: #fde68a;
    color: #92400e;
}

.adm-status-pill__dot[b-rq13b89oit] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-rq13b89oit] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-rq13b89oit] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════ PAGE HEADER ═══════════════════ */
.adm-page-header[b-rq13b89oit] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-rq13b89oit] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-rq13b89oit] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-rq13b89oit] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-rq13b89oit] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-rq13b89oit] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-rq13b89oit] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-rq13b89oit] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════ KPI STRIP ═══════════════════ */
.adm-kpi-strip[b-rq13b89oit] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-rq13b89oit] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-rq13b89oit] {
    border-right: none;
}

.adm-kpi:hover[b-rq13b89oit] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-rq13b89oit] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-rq13b89oit] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-rq13b89oit] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-rq13b89oit] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════ DETAIL CARDS ═══════════════════ */
.adm-detail-grid[b-rq13b89oit] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-rq13b89oit] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-rq13b89oit] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-rq13b89oit] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-rq13b89oit] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-rq13b89oit] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-rq13b89oit] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════ TABS ═══════════════════ */
[b-rq13b89oit] .adm-tabs {
    background: transparent;
}

[b-rq13b89oit] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-rq13b89oit] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-rq13b89oit] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-rq13b89oit] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-rq13b89oit] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-rq13b89oit] {
    padding: 0;
}

/* ═══════════════════ TAB TOOLBAR ═══════════════════ */
.adm-tab-toolbar[b-rq13b89oit] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-rq13b89oit] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-rq13b89oit] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-rq13b89oit] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-rq13b89oit] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-rq13b89oit] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-rq13b89oit] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-rq13b89oit] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════ TABLES ═══════════════════ */
[b-rq13b89oit] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-rq13b89oit] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-rq13b89oit] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-rq13b89oit] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-rq13b89oit] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-rq13b89oit] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ─── Monospace ─── */
.adm-mono[b-rq13b89oit] {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
}

/* ─── Empty State ─── */
.adm-empty-state[b-rq13b89oit] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1.5rem;
    color: #64748b;
    font-size: 0.875rem;
}

/* ═══════════════════ DIALOG ═══════════════════ */
[b-rq13b89oit] .dlg-status-banner {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

[b-rq13b89oit] .dlg-status-banner--success {
    background: #f0fdf4;
    color: #15803d;
    border: 1px solid #bbf7d0;
}

[b-rq13b89oit] .dlg-status-banner--error {
    background: #fef2f2;
    color: #b91c1c;
    border: 1px solid #fecaca;
}

[b-rq13b89oit] .dlg-status-banner--warning {
    background: #fffbeb;
    color: #92400e;
    border: 1px solid #fde68a;
}

[b-rq13b89oit] .dlg-section {
    margin-bottom: 1rem;
}

[b-rq13b89oit] .dlg-section__title {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    margin: 0 0 0.5rem;
    padding-bottom: 0.375rem;
    border-bottom: 1px solid #f1f5f9;
}

[b-rq13b89oit] .dlg-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.625rem 1rem;
}

[b-rq13b89oit] .dlg-field {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

[b-rq13b89oit] .dlg-field__label {
    font-size: 0.72rem;
    color: #64748b;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

[b-rq13b89oit] .dlg-field__value {
    font-size: 0.875rem;
    color: #1e293b;
    font-weight: 500;
}

[b-rq13b89oit] .dlg-error-box {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-radius: 8px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #b91c1c;
    font-size: 0.85rem;
    line-height: 1.5;
}

/* ═══════════════════ MUD CHIP WCAG FIX ═══════════════════ */
[b-rq13b89oit] .mud-chip-color-success {
    background-color: #15803d !important;
    color: #ffffff !important;
}

[b-rq13b89oit] .mud-chip-color-error {
    background-color: #b91c1c !important;
    color: #ffffff !important;
}

[b-rq13b89oit] .mud-chip-color-warning {
    background-color: #b45309 !important;
    color: #ffffff !important;
}

/* ═══════════════════ RESPONSIVE ═══════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-rq13b89oit] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-rq13b89oit] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-rq13b89oit] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-rq13b89oit] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-rq13b89oit] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-rq13b89oit] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-rq13b89oit] {
        grid-template-columns: repeat(3, 1fr);
    }

    .dlg-grid[b-rq13b89oit] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-rq13b89oit] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-rq13b89oit] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-rq13b89oit] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-rq13b89oit] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-rq13b89oit] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-rq13b89oit] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-rq13b89oit] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-rq13b89oit] {
        grid-template-columns: 1fr;
        padding: 0.75rem 0.875rem;
    }

    .adm-tab-toolbar[b-rq13b89oit] {
        flex-direction: column;
        align-items: flex-start;
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-tab-toolbar__right[b-rq13b89oit] {
        width: 100%;
        margin-left: 0;
    }

    [b-rq13b89oit] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    [b-rq13b89oit] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    [b-rq13b89oit] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    [b-rq13b89oit] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/PrivacyPolicies/PolicyEditorDialog.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Policy Editor Dialog — Nordic Control Panel
   ═══════════════════════════════════════════════════════ */

[b-qyg5spzpza] .adm-dialog {
    border-radius: 12px !important;
}

[b-qyg5spzpza] .adm-dialog .mud-dialog-title {
    font-size: 1rem;
    font-weight: 600;
    color: #0f172a;
    font-family: 'Montserrat', sans-serif;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #e8ecf1;
}

[b-qyg5spzpza] .adm-dialog .mud-dialog-content {
    padding: 1.25rem 1.5rem;
}

[b-qyg5spzpza] .adm-dialog .mud-dialog-actions {
    padding: 0.75rem 1.5rem;
    border-top: 1px solid #e8ecf1;
}

[b-qyg5spzpza] .adm-dialog-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.84rem !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
    padding: 6px 20px !important;
}
/* /Components/Pages/Admin/PrivacyPolicies/PrivacyPolicies.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Policy Management — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + Tags + Categories standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-3fl39lcp5d] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-3fl39lcp5d] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-3fl39lcp5d] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-3fl39lcp5d] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-3fl39lcp5d] .adm-breadcrumbs {
    padding: 0;
}

[b-3fl39lcp5d] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-3fl39lcp5d] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-3fl39lcp5d] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-3fl39lcp5d] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-3fl39lcp5d] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-3fl39lcp5d] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-3fl39lcp5d] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-3fl39lcp5d] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-3fl39lcp5d] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-3fl39lcp5d] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-3fl39lcp5d] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-3fl39lcp5d] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-3fl39lcp5d] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add Button */
[b-3fl39lcp5d] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
}

/* Seed Button */
[b-3fl39lcp5d] .adm-seed-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
}

/* Refresh Button */
[b-3fl39lcp5d] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-3fl39lcp5d] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-3fl39lcp5d] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-3fl39lcp5d] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-3fl39lcp5d] {
    border-right: none;
}

.adm-kpi:hover[b-3fl39lcp5d] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-3fl39lcp5d] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-3fl39lcp5d] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-3fl39lcp5d] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-3fl39lcp5d] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-3fl39lcp5d] .adm-tabs {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

[b-3fl39lcp5d] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
}

[b-3fl39lcp5d] .adm-tabs .mud-tab {
    font-size: 0.82rem !important;
    font-weight: 500 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    color: #64748b !important;
    padding: 0.75rem 1.25rem !important;
    min-width: auto !important;
    transition: color 0.2s ease;
}

[b-3fl39lcp5d] .adm-tabs .mud-tab:hover {
    color: #35a0ae !important;
    background: rgba(53, 160, 174, 0.04) !important;
}

[b-3fl39lcp5d] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae !important;
    font-weight: 600 !important;
}

[b-3fl39lcp5d] .adm-tabs .mud-tab-slider {
    background: #35a0ae !important;
}

[b-3fl39lcp5d] .adm-tabs .mud-tabs-panels {
    background: #f8f9fb;
}

[b-3fl39lcp5d] .adm-tabs .mud-badge-content {
    font-size: 0.65rem !important;
    font-weight: 600 !important;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-3fl39lcp5d] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-3fl39lcp5d] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-3fl39lcp5d] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   TABLE SECTION
   ═══════════════════════════════════════════════════════ */
.adm-table-container[b-3fl39lcp5d] {
    padding: 0 1.5rem 1.5rem;
}

[b-3fl39lcp5d] .adm-search-field {
    margin-bottom: 0.75rem;
    max-width: 360px;
}

[b-3fl39lcp5d] .adm-search-field .mud-input-outlined-border {
    border-color: #e2e8f0 !important;
    border-radius: 8px !important;
}

[b-3fl39lcp5d] .adm-search-field .mud-input-outlined-border:hover {
    border-color: #35a0ae !important;
}

[b-3fl39lcp5d] .adm-search-field .mud-input-adorment-start {
    color: #64748b;
}

[b-3fl39lcp5d] .adm-search-field input::placeholder {
    color: #64748b !important;
    font-size: 0.82rem;
}

/* MudTable styling */
[b-3fl39lcp5d] .adm-table {
    border-radius: 10px !important;
    border: 1px solid #e8ecf1 !important;
    overflow: hidden;
    box-shadow: none !important;
}

[b-3fl39lcp5d] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-3fl39lcp5d] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-3fl39lcp5d] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-3fl39lcp5d] .adm-table .mud-table-body tr {
    cursor: pointer;
    transition: background 0.12s ease;
}

[b-3fl39lcp5d] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-3fl39lcp5d] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-3fl39lcp5d] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-3fl39lcp5d] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

.adm-policy-name[b-3fl39lcp5d] {
    font-weight: 500;
    color: #1e293b;
}

/* Chip styling */
[b-3fl39lcp5d] .adm-chip {
    font-size: 0.7rem !important;
    height: 22px !important;
    font-weight: 600 !important;
}

/* Empty state */
.adm-empty-state[b-3fl39lcp5d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #64748b;
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-3fl39lcp5d] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-3fl39lcp5d] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-3fl39lcp5d] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-3fl39lcp5d] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-3fl39lcp5d] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-kpi-strip[b-3fl39lcp5d] {
        grid-template-columns: repeat(2, 1fr);
    }

    [b-3fl39lcp5d] .adm-search-field {
        max-width: 100%;
    }

    /* Mobile table horizontal scroll */
    .adm-table-container[b-3fl39lcp5d] {
        overflow-x: auto;
    }

    /* Ensure touch targets are at least 44px */
    [b-3fl39lcp5d] .adm-table .mud-table-body td .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }

    [b-3fl39lcp5d] .adm-tabs .mud-tab {
        padding: 0.75rem 1rem !important;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-3fl39lcp5d] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-3fl39lcp5d] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-3fl39lcp5d] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-3fl39lcp5d] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-3fl39lcp5d] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-table-container[b-3fl39lcp5d] {
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-3fl39lcp5d] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-3fl39lcp5d] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    [b-3fl39lcp5d] .adm-tabs .mud-tab {
        padding: 0.75rem 0.75rem !important;
        font-size: 0.78rem !important;
    }
}
/* /Components/Pages/Admin/RentalAttributes/AttributeEditorDialog.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Attribute Editor Dialog — Nordic Control Panel
   Scoped to AttributeEditorDialog (Test-220, supersedes Test-089).
   ═══════════════════════════════════════════════════════ */

.adm-dialog-title[b-1ocqbsdg92] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.adm-dialog-section__label[b-1ocqbsdg92] {
    color: #1e293b !important;
    font-weight: 600 !important;
}

[b-1ocqbsdg92] .adm-color-pick {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
}

[b-1ocqbsdg92] .adm-delete-row-btn {
    color: #64748b !important;
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
}

[b-1ocqbsdg92] .adm-delete-row-btn:hover {
    color: #b91c1c !important;
    background: rgba(239, 68, 68, 0.06) !important;
}

[b-1ocqbsdg92] .adm-dialog-add-value-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    min-height: 44px !important;
    align-self: flex-start;
}

/* Dialog action buttons — WCAG 2.5.5 */
[b-1ocqbsdg92] .adm-dialog-cancel-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    min-height: 44px !important;
    padding: 0 16px !important;
}

[b-1ocqbsdg92] .adm-dialog-cancel-btn:focus-visible {
    outline: 2px solid #94a3b8;
    outline-offset: 2px;
}

[b-1ocqbsdg92] .adm-dialog-save-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px !important;
    padding: 0 16px !important;
    box-shadow: none !important;
}

[b-1ocqbsdg92] .adm-dialog-save-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.18);
}

[b-1ocqbsdg92] .adm-dialog-save-btn__spinner { color: #ffffff; }

/* Manage Attribute Values dialog (same scope; component lives in same folder) */
.adm-mav-helper[b-1ocqbsdg92] { color: #64748b; }

.adm-mav-row[b-1ocqbsdg92] {
    background: #f8fafc;
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    padding: 0.625rem 0.75rem;
}

.adm-mav-row--add[b-1ocqbsdg92] {
    background: #ffffff;
    border-style: dashed;
    border-color: #cbd5e1;
}

.adm-mav-swatch[b-1ocqbsdg92] {
    width: 40px;
    height: 40px;
    background-color: var(--adm-mav-swatch-color, #94a3b8);
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    flex-shrink: 0;
}

[b-1ocqbsdg92] .adm-mav-color-pick {
    width: 200px;
}

.adm-mav-value[b-1ocqbsdg92] {
    flex: 1;
    color: #1e293b;
    font-weight: 500;
}

[b-1ocqbsdg92] .adm-mav-action-btn {
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    color: #64748b !important;
}

[b-1ocqbsdg92] .adm-mav-action-btn--delete:hover {
    color: #b91c1c !important;
    background: rgba(239, 68, 68, 0.06) !important;
}

[b-1ocqbsdg92] .adm-mav-action-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    [b-1ocqbsdg92] .adm-dialog-save-btn,
    [b-1ocqbsdg92] .adm-dialog-cancel-btn,
    [b-1ocqbsdg92] .adm-mav-action-btn { transition: none; }
}
/* /Components/Pages/Admin/RentalAttributes/CategoryAttributeLinks.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Category-Attribute Links — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-jsk1c96i4q] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-jsk1c96i4q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-jsk1c96i4q] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-jsk1c96i4q] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-jsk1c96i4q] .adm-breadcrumbs {
    padding: 0;
}

[b-jsk1c96i4q] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-jsk1c96i4q] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-jsk1c96i4q] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-jsk1c96i4q] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-jsk1c96i4q] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-jsk1c96i4q] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-jsk1c96i4q] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.adm-status-pill__dot--off[b-jsk1c96i4q] {
    background: #94a3b8;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-jsk1c96i4q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-jsk1c96i4q] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-jsk1c96i4q] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-jsk1c96i4q] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-jsk1c96i4q] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-jsk1c96i4q] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Buttons */
[b-jsk1c96i4q] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
}

[b-jsk1c96i4q] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
}

[b-jsk1c96i4q] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-jsk1c96i4q] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-jsk1c96i4q] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-jsk1c96i4q] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-jsk1c96i4q] {
    border-right: none;
}

.adm-kpi:hover[b-jsk1c96i4q] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-jsk1c96i4q] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-jsk1c96i4q] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-jsk1c96i4q] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-jsk1c96i4q] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-jsk1c96i4q] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 1rem 1.5rem;
}

.adm-detail-card[b-jsk1c96i4q] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-jsk1c96i4q] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-jsk1c96i4q] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-jsk1c96i4q] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-jsk1c96i4q] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-jsk1c96i4q] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* Error State */
.adm-error-state[b-jsk1c96i4q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1rem;
    background: #ffffff;
}

/* ═══════════════════════════════════════════════════════
   DUAL-PANEL LAYOUT
   ═══════════════════════════════════════════════════════ */
.adm-panel-grid[b-jsk1c96i4q] {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 0.75rem;
    padding: 1rem 1.5rem 1.5rem;
    min-height: 500px;
}

.adm-panel[b-jsk1c96i4q] {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    overflow: hidden;
}

.adm-panel__header[b-jsk1c96i4q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.875rem 1rem;
    border-bottom: 1px solid #e8ecf1;
    background: #f8fafc;
}

.adm-panel__title[b-jsk1c96i4q] {
    font-size: 0.85rem;
    font-weight: 700;
    color: #1e293b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0;
}

.adm-panel__count[b-jsk1c96i4q] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 22px;
    padding: 0 0.5rem;
    border-radius: 6px;
    background: rgba(53, 160, 174, 0.08);
    color: #256f7a;
    font-size: 0.72rem;
    font-weight: 700;
}

.adm-panel__search[b-jsk1c96i4q] {
    padding: 0.625rem 0.75rem;
    border-bottom: 1px solid #f1f5f9;
}

[b-jsk1c96i4q] .adm-panel-search-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-jsk1c96i4q] .adm-panel-search-field .mud-input {
    font-size: 0.85rem;
}

.adm-panel__body[b-jsk1c96i4q] {
    flex: 1;
    overflow-y: auto;
    max-height: 600px;
}

.adm-panel__empty[b-jsk1c96i4q] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2.5rem 1rem;
    color: #64748b;
    font-size: 0.85rem;
    text-align: center;
}

/* ═══════════════════════════════════════════════════════
   CATEGORY LIST ITEMS
   ═══════════════════════════════════════════════════════ */
.adm-category-item[b-jsk1c96i4q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
    padding: 0.625rem 1rem;
    border: none;
    border-bottom: 1px solid #f1f5f9;
    background: transparent;
    cursor: pointer;
    text-align: left;
    transition: background 0.15s ease;
    font-family: inherit;
    font-size: 0.85rem;
    color: #334155;
}

.adm-category-item:hover[b-jsk1c96i4q] {
    background: rgba(53, 160, 174, 0.04);
}

.adm-category-item--selected[b-jsk1c96i4q] {
    background: rgba(53, 160, 174, 0.08);
    border-left: 3px solid #35a0ae;
}

.adm-category-item--selected:hover[b-jsk1c96i4q] {
    background: rgba(53, 160, 174, 0.1);
}

.adm-category-item__name[b-jsk1c96i4q] {
    font-weight: 500;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.adm-category-item__badge[b-jsk1c96i4q] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 20px;
    padding: 0 0.4rem;
    border-radius: 10px;
    background: #256f7a;
    color: #ffffff;
    font-size: 0.68rem;
    font-weight: 700;
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════
   ATTRIBUTE CARDS
   ═══════════════════════════════════════════════════════ */
.adm-attr-grid[b-jsk1c96i4q] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 0.625rem;
    padding: 1rem;
}

.adm-attr-grid--inherited[b-jsk1c96i4q] {
    padding: 0.5rem 0;
}

.adm-attr-card[b-jsk1c96i4q] {
    position: relative;
    display: flex;
    border-radius: 8px;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
    background: #ffffff;
}

.adm-attr-card:hover[b-jsk1c96i4q] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-attr-card--inherited[b-jsk1c96i4q] {
    opacity: 0.75;
}

.adm-attr-card__bar[b-jsk1c96i4q] {
    width: 3px;
    flex-shrink: 0;
}

.adm-attr-card__body[b-jsk1c96i4q] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.625rem 0.75rem;
    min-width: 0;
    flex: 1;
}

.adm-attr-card__header[b-jsk1c96i4q] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.25rem;
}

.adm-attr-card__name[b-jsk1c96i4q] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #1e293b;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[b-jsk1c96i4q] .adm-attr-card__remove {
    margin: -4px -4px 0 0;
    flex-shrink: 0;
}

.adm-attr-card__meta[b-jsk1c96i4q] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.adm-attr-chip[b-jsk1c96i4q] {
    display: inline-flex;
    align-items: center;
    padding: 0.1rem 0.5rem;
    border-radius: 4px;
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.adm-attr-card__sub[b-jsk1c96i4q] {
    font-size: 0.72rem;
    color: #64748b;
    font-style: italic;
}

.adm-attr-card__values[b-jsk1c96i4q] {
    font-size: 0.72rem;
    color: #64748b;
}

/* ═══════════════════════════════════════════════════════
   INHERITED ATTRIBUTES SECTION
   ═══════════════════════════════════════════════════════ */
.adm-inherited-section[b-jsk1c96i4q] {
    border-top: 1px solid #e8ecf1;
    padding: 1rem;
}

.adm-inherited-section__header[b-jsk1c96i4q] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.75rem;
}

.adm-inherited-group[b-jsk1c96i4q] {
    margin-bottom: 0.75rem;
}

.adm-inherited-group__label[b-jsk1c96i4q] {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: #475569;
    padding-left: 0.25rem;
    margin-bottom: 0.375rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE BREAKPOINTS
   ═══════════════════════════════════════════════════════ */

/* Tablet landscape */
@media (max-width: 1280px) {
    .adm-detail-grid[b-jsk1c96i4q] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-attr-grid[b-jsk1c96i4q] {
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    }
}

/* Tablet portrait */
@media (max-width: 960px) {
    .adm-page-header[b-jsk1c96i4q] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .adm-page-header__tools[b-jsk1c96i4q] {
        margin-left: 0;
        width: 100%;
        justify-content: flex-end;
    }

    .adm-kpi-strip[b-jsk1c96i4q] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-panel-grid[b-jsk1c96i4q] {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .adm-panel__body[b-jsk1c96i4q] {
        max-height: 400px;
    }

    /* Touch targets ≥ 44px */
    .adm-category-item[b-jsk1c96i4q] {
        min-height: 44px;
    }

    [b-jsk1c96i4q] .adm-add-btn {
        min-height: 44px;
    }

    [b-jsk1c96i4q] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }

    [b-jsk1c96i4q] .adm-attr-card__remove {
        min-width: 44px;
        min-height: 44px;
    }
}

/* Mobile */
@media (max-width: 600px) {
    .adm-actionbar[b-jsk1c96i4q] {
        padding: 0.5rem 1rem;
    }

    .adm-page-header[b-jsk1c96i4q] {
        padding: 1rem;
    }

    .adm-kpi-strip[b-jsk1c96i4q] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi__value[b-jsk1c96i4q] {
        font-size: 1.25rem;
    }

    .adm-detail-grid[b-jsk1c96i4q] {
        grid-template-columns: 1fr;
        padding: 0.75rem 1rem;
    }

    .adm-panel-grid[b-jsk1c96i4q] {
        padding: 0.75rem 1rem 1rem;
    }

    .adm-attr-grid[b-jsk1c96i4q] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Admin/RentalAttributes/ManageAttributeValues.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Manage Attribute Values dialog — Nordic Control Panel
   Scoped to ManageAttributeValues (Test-220, supersedes Test-089).
   ═══════════════════════════════════════════════════════ */

.adm-dialog-title[b-br00r4k0jy] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.adm-mav-helper[b-br00r4k0jy] {
    color: #64748b;
    font-weight: 400;
}

.adm-mav-row[b-br00r4k0jy] {
    background: #f8fafc;
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    padding: 0.625rem 0.75rem;
}

.adm-mav-row--add[b-br00r4k0jy] {
    background: #ffffff;
    border-style: dashed;
    border-color: #cbd5e1;
}

.adm-mav-swatch[b-br00r4k0jy] {
    width: 40px;
    height: 40px;
    background-color: var(--adm-mav-swatch-color, #94a3b8);
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    flex-shrink: 0;
}

[b-br00r4k0jy] .adm-mav-color-pick {
    width: 200px;
}

.adm-mav-value[b-br00r4k0jy] {
    flex: 1;
    color: #1e293b;
    font-weight: 500;
}

[b-br00r4k0jy] .adm-mav-action-btn {
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    color: #64748b !important;
}

[b-br00r4k0jy] .adm-mav-action-btn--delete:hover {
    color: #b91c1c !important;
    background: rgba(239, 68, 68, 0.06) !important;
}

[b-br00r4k0jy] .adm-mav-action-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

[b-br00r4k0jy] .adm-dialog-save-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px !important;
    padding: 0 16px !important;
    box-shadow: none !important;
}

[b-br00r4k0jy] .adm-dialog-save-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.18);
}

@media (prefers-reduced-motion: reduce) {
    [b-br00r4k0jy] .adm-mav-action-btn,
    [b-br00r4k0jy] .adm-dialog-save-btn { transition: none; }
}
/* /Components/Pages/Admin/RentalAttributes/RentalAttributes.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Rental Attributes — "Nordic Control Panel" Design System
   Test-220 (2026-05-07) supersedes Test-089.
   Matches Categories (Test-218) + Tags (Test-219) standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-ug8n1q7cus] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════ ACTION BAR ═══════════════════ */
.adm-actionbar[b-ug8n1q7cus] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-ug8n1q7cus] { display: flex; align-items: center; gap: 0.5rem; }
.adm-actionbar__right[b-ug8n1q7cus] { display: flex; align-items: center; gap: 0.625rem; margin-left: auto; }

[b-ug8n1q7cus] .adm-breadcrumbs { padding: 0; }
[b-ug8n1q7cus] .adm-breadcrumbs .mud-breadcrumbs-li { font-size: 0.8rem; color: #64748b; }
[b-ug8n1q7cus] .adm-breadcrumbs .mud-breadcrumbs-separator { color: #cbd5e1; }
[b-ug8n1q7cus] .adm-breadcrumbs a { color: #64748b !important; text-decoration: none; }
[b-ug8n1q7cus] .adm-breadcrumbs a:hover { color: #35a0ae !important; }

/* Status pill */
.adm-status-pill[b-ug8n1q7cus] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-ug8n1q7cus] { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.adm-status-pill__dot--on[b-ug8n1q7cus] { background: #22c55e; box-shadow: 0 0 6px rgba(34, 197, 94, 0.4); }

/* ═══════════════════ PAGE HEADER ═══════════════════ */
.adm-page-header[b-ug8n1q7cus] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-ug8n1q7cus] { display: flex; align-items: center; gap: 1rem; }
.adm-page-header__icon[b-ug8n1q7cus] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-ug8n1q7cus] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-ug8n1q7cus] { font-size: 0.82rem; color: #64748b; line-height: 1.4; margin: 0.15rem 0 0; }

.adm-page-header__tools[b-ug8n1q7cus] { display: flex; align-items: center; gap: 0.5rem; margin-left: auto; }

/* WCAG 2.5.5 — 44px floor on all controls in header */
[b-ug8n1q7cus] .adm-add-btn,
[b-ug8n1q7cus] .adm-links-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
    min-height: 44px !important;
}

[b-ug8n1q7cus] .adm-add-btn:focus-visible,
[b-ug8n1q7cus] .adm-links-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.18);
}

[b-ug8n1q7cus] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px;
    min-height: 44px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-ug8n1q7cus] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-ug8n1q7cus] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.18);
}

/* ═══════════════════ KPI STRIP — semantic icon classes ═══════════════════ */
.adm-kpi-strip[b-ug8n1q7cus] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-ug8n1q7cus] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-ug8n1q7cus] { border-right: none; }
.adm-kpi:hover[b-ug8n1q7cus] { background: rgba(53, 160, 174, 0.02); }
.adm-kpi__top[b-ug8n1q7cus] { display: flex; align-items: center; gap: 0.375rem; }

[b-ug8n1q7cus] .adm-kpi__icon { font-size: 1rem !important; opacity: 0.9; }

/* Total — Rently primary teal */
[b-ug8n1q7cus] .adm-kpi__icon--total { color: #35a0ae !important; }
/* With Values — violet (collection metric) */
[b-ug8n1q7cus] .adm-kpi__icon--withvalues { color: #8b5cf6 !important; }
/* Categories — sky blue (was #f59e0b amber — brand-trap on neutral structural metric, Test-218 B-1 precedent) */
[b-ug8n1q7cus] .adm-kpi__icon--categories { color: #3b82f6 !important; }
/* Total Values — calm green (positive accumulation metric) */
[b-ug8n1q7cus] .adm-kpi__icon--totalvalues { color: #16a34a !important; }

.adm-kpi__label[b-ug8n1q7cus] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-ug8n1q7cus] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════ ERROR STATE ═══════════════════ */
.adm-error-panel[b-ug8n1q7cus] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1.5rem;
    text-align: center;
    color: #475569;
    background: #ffffff;
}

[b-ug8n1q7cus] .adm-error-panel .mud-icon-root { color: #94a3b8; font-size: 3rem !important; }

.adm-error-panel h2[b-ug8n1q7cus] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-error-panel p[b-ug8n1q7cus] { font-size: 0.875rem; color: #64748b; margin: 0; max-width: 360px; }

[b-ug8n1q7cus] .adm-error-panel__retry {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px !important;
    margin-top: 0.5rem;
}

/* ═══════════════════ SECTION HEADERS ═══════════════════ */
.adm-section-header[b-ug8n1q7cus] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-ug8n1q7cus] { font-size: 0.95rem; font-weight: 600; color: #1e293b; margin: 0; font-family: 'Montserrat', sans-serif; }
.adm-section-header__subtitle[b-ug8n1q7cus] { font-size: 0.78rem; color: #64748b; font-weight: 400; }

/* ═══════════════════ TABLE ═══════════════════ */
.adm-table-container[b-ug8n1q7cus] { padding: 0 1.5rem 1.5rem; overflow-x: auto; }

[b-ug8n1q7cus] .adm-search-field { margin-bottom: 0.75rem; max-width: 360px; }
[b-ug8n1q7cus] .adm-search-field .mud-input-outlined-border { border-color: #e2e8f0 !important; border-radius: 8px !important; }
[b-ug8n1q7cus] .adm-search-field .mud-input-outlined-border:hover { border-color: #35a0ae !important; }
[b-ug8n1q7cus] .adm-search-field .mud-input-adorment-start { color: #94a3b8; }
[b-ug8n1q7cus] .adm-search-field input::placeholder { color: #94a3b8 !important; font-size: 0.82rem; }

[b-ug8n1q7cus] .adm-table {
    border-radius: 10px !important;
    border: 1px solid #e8ecf1 !important;
    overflow: hidden;
    box-shadow: none !important;
}

[b-ug8n1q7cus] .adm-table .mud-table-head .mud-table-row { background: #f8fafc !important; }

[b-ug8n1q7cus] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-ug8n1q7cus] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-ug8n1q7cus] .adm-table .mud-table-body tr { cursor: pointer; transition: background 0.12s ease; }
[b-ug8n1q7cus] .adm-table .mud-table-body tr:hover { background: rgba(53, 160, 174, 0.03) !important; }
[b-ug8n1q7cus] .adm-table .mud-table-body tr.mud-table-row-striped { background: #fafbfc !important; }
[b-ug8n1q7cus] .adm-table .mud-table-body tr.mud-table-row-striped:hover { background: rgba(53, 160, 174, 0.03) !important; }

[b-ug8n1q7cus] .adm-table .mud-table-pagination { font-size: 0.78rem !important; color: #64748b !important; border-top: 1px solid #e8ecf1 !important; }

[b-ug8n1q7cus] .adm-th-action,
[b-ug8n1q7cus] .adm-td-action { width: 110px; text-align: center; }

.adm-attr-name[b-ug8n1q7cus] {
    font-weight: 500;
    color: #1e293b;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
}

[b-ug8n1q7cus] .adm-chip { font-size: 0.7rem !important; height: 22px !important; font-weight: 600 !important; }

.adm-value-count[b-ug8n1q7cus] { display: inline-flex; align-items: center; gap: 0.25rem; font-size: 0.78rem; color: #475569; }
.adm-value-count__num[b-ug8n1q7cus] { font-weight: 600; color: #1e293b; }
.adm-no-values[b-ug8n1q7cus] { font-size: 0.78rem; color: #94a3b8; font-style: italic; }

/* Row action buttons */
[b-ug8n1q7cus] .adm-manage-btn,
[b-ug8n1q7cus] .adm-delete-btn { color: #64748b !important; border-radius: 8px !important; }

[b-ug8n1q7cus] .adm-manage-btn:hover { color: #35a0ae !important; background: rgba(53, 160, 174, 0.06) !important; }
[b-ug8n1q7cus] .adm-delete-btn:hover { color: #b91c1c !important; background: rgba(239, 68, 68, 0.06) !important; }

[b-ug8n1q7cus] .adm-manage-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

[b-ug8n1q7cus] .adm-delete-btn:focus-visible {
    outline: 2px solid #b91c1c;
    outline-offset: 2px;
}

/* Empty state */
.adm-empty-state[b-ug8n1q7cus] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #64748b;
    font-size: 0.85rem;
}

[b-ug8n1q7cus] .adm-empty-state__icon { color: #cbd5e1 !important; font-size: 2.5rem !important; }
.adm-empty-state__title[b-ug8n1q7cus] { font-weight: 600; color: #334155; }
.adm-empty-state__body[b-ug8n1q7cus] { color: #94a3b8; font-size: 0.78rem; max-width: 320px; text-align: center; }

/* ═══════════════════ PREFERS REDUCED MOTION ═══════════════════ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-ug8n1q7cus],
    [b-ug8n1q7cus] .adm-table .mud-table-body tr,
    [b-ug8n1q7cus] .adm-refresh-btn,
    [b-ug8n1q7cus] .adm-add-btn,
    [b-ug8n1q7cus] .adm-links-btn { transition: none !important; }

    .adm-status-pill__dot--on[b-ug8n1q7cus] { box-shadow: none; }
}

/* ═══════════════════ RESPONSIVE ═══════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-ug8n1q7cus] { grid-template-columns: repeat(2, 1fr); }
    .adm-kpi:nth-child(2n)[b-ug8n1q7cus] { border-right: none; }
    .adm-kpi:nth-child(n+3)[b-ug8n1q7cus] { border-top: 1px solid #f1f5f9; }
}

@media (max-width: 960px) {
    .adm-page-header[b-ug8n1q7cus] { flex-direction: column; align-items: flex-start; }
    .adm-page-header__tools[b-ug8n1q7cus] { margin-left: 0; width: 100%; flex-wrap: wrap; }
    .adm-kpi-strip[b-ug8n1q7cus] { grid-template-columns: repeat(2, 1fr); }
    [b-ug8n1q7cus] .adm-search-field { max-width: 100%; }

    /* WCAG 2.5.5 — guarantee 44px touch target on every interactive control */
    [b-ug8n1q7cus] .adm-add-btn,
    [b-ug8n1q7cus] .adm-links-btn { min-height: 44px !important; padding: 8px 16px !important; }
    [b-ug8n1q7cus] .adm-refresh-btn { min-height: 44px !important; min-width: 44px !important; }
}

@media (max-width: 600px) {
    .adm-actionbar[b-ug8n1q7cus] { padding: 0.5rem 0.875rem; }
    .adm-page-header[b-ug8n1q7cus] { padding: 1rem 0.875rem; }
    .adm-kpi-strip[b-ug8n1q7cus] { grid-template-columns: repeat(2, 1fr); }
    .adm-kpi:nth-child(2n)[b-ug8n1q7cus] { border-right: none; }
    .adm-kpi:nth-child(n+3)[b-ug8n1q7cus] { border-top: 1px solid #f1f5f9; }
    .adm-table-container[b-ug8n1q7cus] { padding: 0 0.875rem 1rem; }
    .adm-section-header[b-ug8n1q7cus] { padding-left: 0.875rem; padding-right: 0.875rem; }

    /* Mobile stacked-row polish — Test-206 M-5 / Test-219 M-6 parity */
    [b-ug8n1q7cus] .adm-table .mud-table-body td { padding: 0.5rem 0.875rem !important; }
    [b-ug8n1q7cus] .adm-table .mud-table-body td::before { font-weight: 600; }
    [b-ug8n1q7cus] .adm-td-action { text-align: right; }

    .adm-status-pill[b-ug8n1q7cus] { font-size: 0.7rem; }
}
/* /Components/Pages/Admin/Rentals/Rentals.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Rental Management — "Nordic Control Panel" Design System
   Test-221 uplift: brand-trap fixes, 44px tap targets, semantic
   KPI/empty-state colour modifiers, error-recovery panel,
   live status pill, focus-visible, prefers-reduced-motion.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-eh545b96rs] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-eh545b96rs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-eh545b96rs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-eh545b96rs] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-eh545b96rs] .adm-breadcrumbs {
    padding: 0;
}

[b-eh545b96rs] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-eh545b96rs] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-eh545b96rs] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-eh545b96rs] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill — live heartbeat */
.adm-status-pill[b-eh545b96rs] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-eh545b96rs] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-eh545b96rs] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-eh545b96rs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-eh545b96rs] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-eh545b96rs] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-eh545b96rs] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-eh545b96rs] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-eh545b96rs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button — WCAG 2.5.5 44×44 floor (Test-221 C-1) */
[b-eh545b96rs] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-eh545b96rs] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-eh545b96rs] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.18);
}

/* ═══════════════════════════════════════════════════════
   PROGRESS BAR
   ═══════════════════════════════════════════════════════ */
[b-eh545b96rs] .adm-progress {
    border-radius: 0 !important;
}

/* ═══════════════════════════════════════════════════════
   ERROR-RECOVERY PANEL (Test-221 H-6)
   ═══════════════════════════════════════════════════════ */
.adm-error-panel[b-eh545b96rs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.75rem;
    padding: 3rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-error-panel__icon[b-eh545b96rs] {
    color: #94a3b8;
    margin-bottom: 0.25rem;
}

.adm-error-panel__title[b-eh545b96rs] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-error-panel__body[b-eh545b96rs] {
    font-size: 0.875rem;
    color: #64748b;
    margin: 0;
    max-width: 32rem;
}

[b-eh545b96rs] .adm-error-panel__btn {
    border-radius: 8px !important;
    min-height: 44px !important;
    text-transform: none !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    margin-top: 0.5rem;
}

[b-eh545b96rs] .adm-error-panel__btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.18);
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP — semantic colour modifiers (Test-221 H-9, B-1)
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-eh545b96rs] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-eh545b96rs] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-eh545b96rs] {
    border-right: none;
}

.adm-kpi:hover[b-eh545b96rs] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-eh545b96rs] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-eh545b96rs] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.85;
}

/* Semantic KPI icon colour modifiers */
[b-eh545b96rs] .adm-kpi__icon--total { color: #35a0ae !important; }       /* brand teal — neutral platform metric */
[b-eh545b96rs] .adm-kpi__icon--approved { color: #16a34a !important; }    /* green — positive outcome */
[b-eh545b96rs] .adm-kpi__icon--pending { color: #06b6d4 !important; }     /* cyan — informational; warning lives in chip+badge (B-1) */
[b-eh545b96rs] .adm-kpi__icon--drafts { color: #8b5cf6 !important; }      /* violet — neutral state */
[b-eh545b96rs] .adm-kpi__icon--published { color: #0ea5e9 !important; }   /* sky — positive structural */

.adm-kpi__label[b-eh545b96rs] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-eh545b96rs] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-eh545b96rs] .adm-tabs {
    background: transparent;
}

[b-eh545b96rs] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-eh545b96rs] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-eh545b96rs] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-eh545b96rs] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-eh545b96rs] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

[b-eh545b96rs] .adm-tabs .mud-tab:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: -4px;
}

.adm-tab-panel[b-eh545b96rs] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-eh545b96rs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-eh545b96rs] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-eh545b96rs] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-eh545b96rs] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-eh545b96rs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-eh545b96rs] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-eh545b96rs] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-eh545b96rs] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

[b-eh545b96rs] .adm-filter-field .mud-input-adorment-start {
    color: #94a3b8;
}

[b-eh545b96rs] .adm-filter-field input::placeholder {
    color: #94a3b8 !important;
    font-size: 0.82rem;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
[b-eh545b96rs] .adm-table {
    border-radius: 0 !important;
    border: none !important;
    overflow: hidden;
    box-shadow: none !important;
    background: #ffffff;
}

[b-eh545b96rs] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-eh545b96rs] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-eh545b96rs] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-eh545b96rs] .adm-table .mud-table-body tr {
    transition: background 0.12s ease;
}

[b-eh545b96rs] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-eh545b96rs] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-eh545b96rs] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-eh545b96rs] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

.adm-rental-name[b-eh545b96rs] {
    font-weight: 500;
    color: #1e293b;
}

/* Action column header + cell */
[b-eh545b96rs] .adm-table .adm-th-action,
[b-eh545b96rs] .adm-table .adm-td-action {
    width: 110px;
    text-align: center;
}

[b-eh545b96rs] .adm-table .adm-th-action--narrow,
[b-eh545b96rs] .adm-table .adm-td-action--narrow {
    width: 80px;
}

/* Row action buttons — WCAG 2.5.5 44×44 floor on touch viewports (Test-221 C-2) */
[b-eh545b96rs] .adm-row-action-btn {
    border-radius: 8px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    margin: 0 2px;
}

[b-eh545b96rs] .adm-row-action-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.18);
}

[b-eh545b96rs] .adm-row-action-btn--delete:focus-visible {
    outline: 2px solid #b91c1c;
    box-shadow: 0 0 0 4px rgba(185, 28, 28, 0.18);
}

/* Chip styling */
[b-eh545b96rs] .adm-chip {
    font-size: 0.7rem !important;
    height: 22px !important;
    font-weight: 600 !important;
}

/* Empty state — semantic colour modifiers (Test-221 H-10, B-2) */
.adm-empty-state[b-eh545b96rs] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #64748b;
    font-size: 0.85rem;
}

[b-eh545b96rs] .adm-empty-state__icon--neutral { color: #94a3b8 !important; }
[b-eh545b96rs] .adm-empty-state__icon--success { color: #16a34a !important; }
[b-eh545b96rs] .adm-empty-state__icon--info { color: #06b6d4 !important; }

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-eh545b96rs] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-eh545b96rs] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-eh545b96rs] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-eh545b96rs] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-eh545b96rs] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-eh545b96rs] {
        grid-template-columns: repeat(3, 1fr);
    }

    [b-eh545b96rs] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    [b-eh545b96rs] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    /* WCAG 2.5.5 — bump row action buttons to 44px on touch viewports (Test-221 C-2) */
    [b-eh545b96rs] .adm-row-action-btn {
        min-width: 44px !important;
        min-height: 44px !important;
        margin: 0 4px;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-eh545b96rs] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-eh545b96rs] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-eh545b96rs] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-eh545b96rs] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-eh545b96rs] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-eh545b96rs] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-eh545b96rs] {
        grid-column: 1 / -1;
    }

    .adm-tab-toolbar[b-eh545b96rs] {
        padding: 0.75rem 0.875rem;
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-eh545b96rs] {
        width: 100%;
        margin-left: 0;
    }

    [b-eh545b96rs] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    [b-eh545b96rs] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.5rem;
    }

    [b-eh545b96rs] .adm-tabs .mud-tab {
        padding: 0.75rem 0.75rem;
        font-size: 0.8rem;
    }

    /* Stacked-row right-align for table cells */
    [b-eh545b96rs] .adm-table .mud-table-body td.adm-td-action,
    [b-eh545b96rs] .adm-table .mud-table-body td.adm-td-action--narrow {
        text-align: right;
    }

    .adm-error-panel[b-eh545b96rs] {
        padding: 2rem 1rem;
    }
}

/* ═══════════════════════════════════════════════════════
   PREFERS-REDUCED-MOTION (Test-221 H-11)
   ═══════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-eh545b96rs] { transition: none; }
    [b-eh545b96rs] .adm-table .mud-table-body tr { transition: none !important; }
    [b-eh545b96rs] .adm-tabs .mud-tab { transition: none; }
    .adm-status-pill__dot--on[b-eh545b96rs] { box-shadow: none; }
}
/* /Components/Pages/Admin/SiteSettings/SiteBranding.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Site Branding — "Nordic Control Panel" Design System
   Test-210 modernisation matches Test-205+ standard
   (AnalyticsDashboard / SiteConfiguration / GeneralSettings).
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-0wjp0by0dy] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-0wjp0by0dy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-0wjp0by0dy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-0wjp0by0dy] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-0wjp0by0dy] .adm-breadcrumbs {
    padding: 0;
}

[b-0wjp0by0dy] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-0wjp0by0dy] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-0wjp0by0dy] .adm-breadcrumbs a {
    color: #475569 !important;
    text-decoration: none;
}

[b-0wjp0by0dy] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-0wjp0by0dy] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-0wjp0by0dy] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-0wjp0by0dy] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--info[b-0wjp0by0dy] {
    background: #3b82f6;
    box-shadow: 0 0 6px rgba(59, 130, 246, 0.4);
}

.adm-status-pill__dot--warn[b-0wjp0by0dy] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-0wjp0by0dy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-0wjp0by0dy] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-0wjp0by0dy] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-0wjp0by0dy] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-0wjp0by0dy] {
    font-size: 0.82rem;
    color: #475569;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-0wjp0by0dy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* ═══════════════════════════════════════════════════════
   TOOLBAR BUTTONS — 44px WCAG 2.5.5 at every viewport
   ═══════════════════════════════════════════════════════ */
[b-0wjp0by0dy] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    color: #475569 !important;
    border-color: #d1d5db !important;
    min-height: 44px !important;
    padding: 0 1rem !important;
}

[b-0wjp0by0dy] .adm-back-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-0wjp0by0dy] .adm-back-btn:focus-visible {
    outline: 2px solid #35a0ae !important;
    outline-offset: 2px;
}

/* Save Button */
[b-0wjp0by0dy] .adm-save-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px !important;
    padding: 0 1.25rem !important;
}

[b-0wjp0by0dy] .adm-save-btn:focus-visible {
    outline: 2px solid #fff !important;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.45);
}

[b-0wjp0by0dy] .adm-save-btn__spinner {
    width: 16px !important;
    height: 16px !important;
    margin-right: 0.5rem;
}

/* Refresh Button — 44x44 touch target */
[b-0wjp0by0dy] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-0wjp0by0dy] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-0wjp0by0dy] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae !important;
    outline-offset: 2px;
}

/* ═══════════════════════════════════════════════════════
   PROGRESS BAR (semantic class instead of inline style)
   ═══════════════════════════════════════════════════════ */
[b-0wjp0by0dy] .adm-progress {
    border-radius: 0 !important;
}

/* ═══════════════════════════════════════════════════════
   ERROR RETRY PANEL — replaces generic MudAlert
   ═══════════════════════════════════════════════════════ */
.adm-error-panel[b-0wjp0by0dy] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 1rem 1.5rem;
    padding: 1rem 1.25rem;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 12px;
    flex-wrap: wrap;
}

[b-0wjp0by0dy] .adm-error-panel__icon {
    font-size: 2rem !important;
    color: #dc2626 !important;
    flex-shrink: 0;
}

.adm-error-panel__body[b-0wjp0by0dy] {
    flex: 1 1 240px;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.adm-error-panel__title[b-0wjp0by0dy] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: #991b1b;
    font-family: 'Montserrat', sans-serif;
}

.adm-error-panel__message[b-0wjp0by0dy] {
    margin: 0;
    font-size: 0.82rem;
    color: #7f1d1d;
    line-height: 1.4;
}

[b-0wjp0by0dy] .adm-error-panel__retry-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px !important;
    padding: 0 1.25rem !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-0wjp0by0dy] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-0wjp0by0dy] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-0wjp0by0dy] {
    border-right: none;
}

.adm-kpi:hover[b-0wjp0by0dy] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-0wjp0by0dy] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-0wjp0by0dy] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.85;
}

/* Per-KPI semantic colour modifiers */
[b-0wjp0by0dy] .adm-kpi__icon--logos {
    color: #35a0ae !important;
}

[b-0wjp0by0dy] .adm-kpi__icon--carousel {
    color: #8b5cf6 !important;
}

/* B-1 brand-trap fix: amber on neutral metric → sky blue */
[b-0wjp0by0dy] .adm-kpi__icon--banners {
    color: #0ea5e9 !important;
}

[b-0wjp0by0dy] .adm-kpi__icon--completion-on {
    color: #22c55e !important;
}

[b-0wjp0by0dy] .adm-kpi__icon--completion-off {
    color: #3b82f6 !important;
}

.adm-kpi__label[b-0wjp0by0dy] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-0wjp0by0dy] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.adm-kpi__total[b-0wjp0by0dy] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #64748b;
    margin-left: 0.125rem;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-0wjp0by0dy] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1.25rem 1.5rem 0.75rem;
}

.adm-section-header__title[b-0wjp0by0dy] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    scroll-margin-top: 80px;
}

.adm-section-header__subtitle[b-0wjp0by0dy] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   IMAGE GRID — Card layout for branding image assets
   ═══════════════════════════════════════════════════════ */
.adm-image-grid[b-0wjp0by0dy] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 0.5rem;
}

.adm-image-grid--single[b-0wjp0by0dy] {
    grid-template-columns: 1fr;
    max-width: 400px;
}

/* Image Card */
.adm-image-card[b-0wjp0by0dy] {
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.adm-image-card:hover[b-0wjp0by0dy] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
    border-color: rgba(53, 160, 174, 0.25);
}

/* Preview area */
.adm-image-card__preview[b-0wjp0by0dy] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 120px;
    background: #f8fafc;
    border-bottom: 1px solid #f1f5f9;
    overflow: hidden;
}

.adm-image-card__preview--banner[b-0wjp0by0dy] {
    height: 100px;
}

.adm-image-card__img[b-0wjp0by0dy] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    padding: 0.5rem;
}

.adm-image-card__img--cover[b-0wjp0by0dy] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    padding: 0;
}

[b-0wjp0by0dy] .adm-image-card__placeholder-icon {
    font-size: 2.5rem !important;
    color: #cbd5e1;
}

/* Info area */
.adm-image-card__info[b-0wjp0by0dy] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 0.625rem 0.875rem 0.25rem;
}

.adm-image-card__label[b-0wjp0by0dy] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.3;
}

.adm-image-card__hint[b-0wjp0by0dy] {
    font-size: 0.7rem;
    color: #64748b;
    line-height: 1.3;
}

/* Upload button — 44px touch target at every viewport */
[b-0wjp0by0dy] .adm-upload-btn {
    margin: 0.375rem 0.875rem 0.75rem;
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.82rem !important;
    color: #475569 !important;
    border-color: #d1d5db !important;
    min-height: 44px !important;
}

[b-0wjp0by0dy] .adm-upload-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-0wjp0by0dy] .adm-upload-btn:focus-visible {
    outline: 2px solid #35a0ae !important;
    outline-offset: 2px;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-0wjp0by0dy] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-0wjp0by0dy] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-0wjp0by0dy] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-image-grid[b-0wjp0by0dy] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-0wjp0by0dy] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-0wjp0by0dy] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-image-grid[b-0wjp0by0dy] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-0wjp0by0dy] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-0wjp0by0dy] {
        padding: 1rem 0.875rem;
    }

    .adm-page-header__tools[b-0wjp0by0dy] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-0wjp0by0dy] .adm-back-btn,
    [b-0wjp0by0dy] .adm-save-btn,
    [b-0wjp0by0dy] .adm-refresh-btn {
        width: 100%;
    }

    .adm-kpi-strip[b-0wjp0by0dy] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-0wjp0by0dy] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-0wjp0by0dy] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-image-grid[b-0wjp0by0dy] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 0.5rem;
    }

    .adm-image-grid--single[b-0wjp0by0dy] {
        max-width: none;
    }

    .adm-section-header[b-0wjp0by0dy] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-error-panel[b-0wjp0by0dy] {
        margin: 0.75rem 0.875rem;
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ═══════════════════════════════════════════════════════
   REDUCED MOTION — disable hover transitions + dot glow
   ═══════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-0wjp0by0dy] {
        transition: none !important;
    }

    .adm-image-card[b-0wjp0by0dy] {
        transition: none !important;
    }

    .adm-status-pill__dot--on[b-0wjp0by0dy],
    .adm-status-pill__dot--info[b-0wjp0by0dy],
    .adm-status-pill__dot--warn[b-0wjp0by0dy] {
        box-shadow: none !important;
    }
}
/* /Components/Pages/Admin/SiteSettings/SiteConfiguration.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Site Configuration — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + Admin Dashboard standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-czv3ozan8e] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-czv3ozan8e] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-czv3ozan8e] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-czv3ozan8e] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-czv3ozan8e] .adm-breadcrumbs {
    padding: 0;
}

[b-czv3ozan8e] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-czv3ozan8e] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-czv3ozan8e] .adm-breadcrumbs a {
    color: #475569 !important;
    text-decoration: none;
}

[b-czv3ozan8e] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-czv3ozan8e] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-czv3ozan8e] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-czv3ozan8e] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-czv3ozan8e] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-czv3ozan8e] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-czv3ozan8e] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-czv3ozan8e] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

[b-czv3ozan8e] .adm-page-header__icon .mud-icon-root {
    color: #35a0ae;
}

.adm-page-header__h1[b-czv3ozan8e] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-czv3ozan8e] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-czv3ozan8e] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button — WCAG 2.5.5 compliant 44×44 minimum touch target */
[b-czv3ozan8e] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-czv3ozan8e] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-czv3ozan8e] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

/* Loading bar */
[b-czv3ozan8e] .adm-progress {
    border-radius: 0;
}

/* ═══════════════════════════════════════════════════════
   ERROR PANEL — retry pattern (Test-205 H-2)
   ═══════════════════════════════════════════════════════ */
.adm-error-panel[b-czv3ozan8e] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 1rem 1.5rem 0;
    padding: 1rem 1.25rem;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 10px;
    color: #991b1b;
}

[b-czv3ozan8e] .adm-error-panel .mud-icon-root {
    color: #dc2626;
    flex-shrink: 0;
}

.adm-error-panel__body[b-czv3ozan8e] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.adm-error-panel__title[b-czv3ozan8e] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #7f1d1d;
}

.adm-error-panel__msg[b-czv3ozan8e] {
    font-size: 0.8rem;
    color: #991b1b;
    margin-top: 0.125rem;
}

[b-czv3ozan8e] .adm-error-panel__btn {
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-czv3ozan8e] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-czv3ozan8e] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-czv3ozan8e] {
    border-right: none;
}

.adm-kpi:hover[b-czv3ozan8e] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-czv3ozan8e] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-czv3ozan8e] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.85;
}

/* KPI icon semantic colors — replaces inline Style="color:#..." */
[b-czv3ozan8e] .adm-kpi__icon--status     { color: #35a0ae; }
[b-czv3ozan8e] .adm-kpi__icon--brand      { color: #8b5cf6; } /* B-1 brand-trap fix: #EF412c → #8b5cf6 (positive metric, violet) */
[b-czv3ozan8e] .adm-kpi__icon--social     { color: #3b82f6; }
[b-czv3ozan8e] .adm-kpi__icon--share      { color: #f59e0b; }
[b-czv3ozan8e] .adm-kpi__icon--config     { color: #16a34a; }

.adm-kpi__label[b-czv3ozan8e] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-czv3ozan8e] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-czv3ozan8e] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-czv3ozan8e] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-czv3ozan8e] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   ACTION CARDS — Configuration module navigation
   ═══════════════════════════════════════════════════════ */
.adm-actions-grid[b-czv3ozan8e] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1.5rem;
}

a.adm-action-card[b-czv3ozan8e] {
    text-decoration: none;
    color: inherit;
}

.adm-action-card[b-czv3ozan8e] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    cursor: pointer;
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.adm-action-card:hover[b-czv3ozan8e],
.adm-action-card:focus-visible[b-czv3ozan8e] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
    border-color: rgba(53, 160, 174, 0.25);
    outline: none;
}

.adm-action-card:focus-visible[b-czv3ozan8e] {
    box-shadow: 0 0 0 2px rgba(53, 160, 174, 0.3);
}

.adm-action-card__icon[b-czv3ozan8e] {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    flex-shrink: 0;
}

/* Action card icon semantic colors — replaces inline Style="background...color..." */
.adm-action-card__icon--general[b-czv3ozan8e]      { background: rgba(53, 160, 174, 0.08); color: #35a0ae; }
.adm-action-card__icon--branding[b-czv3ozan8e]     { background: rgba(239, 65, 44, 0.08);  color: #EF412c; } /* category color, brand identity */
.adm-action-card__icon--social[b-czv3ozan8e]       { background: rgba(59, 130, 246, 0.08); color: #3b82f6; }
.adm-action-card__icon--platforms[b-czv3ozan8e]    { background: rgba(139, 92, 246, 0.08); color: #8b5cf6; }
.adm-action-card__icon--share[b-czv3ozan8e]        { background: rgba(245, 158, 11, 0.08); color: #f59e0b; }
.adm-action-card__icon--contact[b-czv3ozan8e]      { background: rgba(22, 163, 74, 0.08);  color: #16a34a; }
.adm-action-card__icon--fees[b-czv3ozan8e]         { background: rgba(236, 72, 153, 0.08); color: #ec4899; }
.adm-action-card__icon--verification[b-czv3ozan8e] { background: rgba(14, 116, 144, 0.08); color: #0e7490; }
.adm-action-card__icon--insurance[b-czv3ozan8e]    { background: rgba(220, 38, 38, 0.08);  color: #dc2626; }

[b-czv3ozan8e] .adm-action-card__icon--general .mud-icon-root      { color: #35a0ae; }
[b-czv3ozan8e] .adm-action-card__icon--branding .mud-icon-root     { color: #EF412c; }
[b-czv3ozan8e] .adm-action-card__icon--social .mud-icon-root       { color: #3b82f6; }
[b-czv3ozan8e] .adm-action-card__icon--platforms .mud-icon-root    { color: #8b5cf6; }
[b-czv3ozan8e] .adm-action-card__icon--share .mud-icon-root        { color: #f59e0b; }
[b-czv3ozan8e] .adm-action-card__icon--contact .mud-icon-root      { color: #16a34a; }
[b-czv3ozan8e] .adm-action-card__icon--fees .mud-icon-root         { color: #ec4899; }
[b-czv3ozan8e] .adm-action-card__icon--verification .mud-icon-root { color: #0e7490; }
[b-czv3ozan8e] .adm-action-card__icon--insurance .mud-icon-root    { color: #dc2626; }

[b-czv3ozan8e] .adm-action-card__chevron {
    color: #94a3b8;
}

.adm-action-card__body[b-czv3ozan8e] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    flex: 1;
}

.adm-action-card__title[b-czv3ozan8e] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.3;
}

.adm-action-card__desc[b-czv3ozan8e] {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.4;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS — Configuration overview metrics
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-czv3ozan8e] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1.5rem;
}

.adm-detail-card[b-czv3ozan8e] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-czv3ozan8e] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-czv3ozan8e] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

/* Detail card semantic colors — replaces inline barInlineStyle + iconInlineStyle */
.adm-detail-card--status  .adm-detail-card__bar[b-czv3ozan8e] { background: #35a0ae; }
.adm-detail-card--brand   .adm-detail-card__bar[b-czv3ozan8e] { background: #8b5cf6; } /* B-2 brand-trap fix: #EF412c → #8b5cf6 */
.adm-detail-card--social  .adm-detail-card__bar[b-czv3ozan8e] { background: #3b82f6; }
.adm-detail-card--share   .adm-detail-card__bar[b-czv3ozan8e] { background: #f59e0b; }
.adm-detail-card--config  .adm-detail-card__bar[b-czv3ozan8e] { background: #16a34a; }
.adm-detail-card--modules .adm-detail-card__bar[b-czv3ozan8e] { background: #ec4899; } /* shifted from violet to pink — violet now belongs to brand */

[b-czv3ozan8e] .adm-detail-card--status  .adm-detail-card__icon { color: #35a0ae; }
[b-czv3ozan8e] .adm-detail-card--brand   .adm-detail-card__icon { color: #8b5cf6; }
[b-czv3ozan8e] .adm-detail-card--social  .adm-detail-card__icon { color: #3b82f6; }
[b-czv3ozan8e] .adm-detail-card--share   .adm-detail-card__icon { color: #f59e0b; }
[b-czv3ozan8e] .adm-detail-card--config  .adm-detail-card__icon { color: #16a34a; }
[b-czv3ozan8e] .adm-detail-card--modules .adm-detail-card__icon { color: #ec4899; }

.adm-detail-card__data[b-czv3ozan8e] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-czv3ozan8e] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-czv3ozan8e] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-czv3ozan8e] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-actions-grid[b-czv3ozan8e] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-czv3ozan8e] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-czv3ozan8e] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-czv3ozan8e] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-actions-grid[b-czv3ozan8e] {
        grid-template-columns: 1fr;
    }

    .adm-page-header[b-czv3ozan8e] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-czv3ozan8e] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-czv3ozan8e] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-czv3ozan8e] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-czv3ozan8e] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-czv3ozan8e] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-czv3ozan8e] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-czv3ozan8e] {
        grid-template-columns: 1fr;
    }

    .adm-error-panel[b-czv3ozan8e] {
        flex-wrap: wrap;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-czv3ozan8e] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-czv3ozan8e] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-czv3ozan8e] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-czv3ozan8e] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-czv3ozan8e] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-czv3ozan8e] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-czv3ozan8e] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-czv3ozan8e] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-actions-grid[b-czv3ozan8e] {
        padding: 0 0.875rem 1.25rem;
    }

    .adm-section-header[b-czv3ozan8e] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-error-panel[b-czv3ozan8e] {
        margin: 1rem 0.875rem 0;
    }
}

/* ═══════════════════════════════════════════════════════
   ACCESSIBILITY — reduced-motion preference
   ═══════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-czv3ozan8e],
    .adm-action-card[b-czv3ozan8e],
    .adm-detail-card[b-czv3ozan8e] {
        transition: none;
    }

    .adm-status-pill__dot--on[b-czv3ozan8e],
    .adm-status-pill__dot--warn[b-czv3ozan8e] {
        box-shadow: none;
    }
}
/* /Components/Pages/Admin/SiteSettings/SiteContactInfo.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Contact Information — "Nordic Control Panel" Design System
   Test-211 (2026-05-06) — supersedes Test-132 (2026-04-14).
   Matches Test-205 → Test-210 standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-kv6ca6rl1g] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-kv6ca6rl1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-kv6ca6rl1g] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-kv6ca6rl1g] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-kv6ca6rl1g] .adm-breadcrumbs {
    padding: 0;
}

[b-kv6ca6rl1g] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-kv6ca6rl1g] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-kv6ca6rl1g] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-kv6ca6rl1g] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-kv6ca6rl1g] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-kv6ca6rl1g] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-kv6ca6rl1g] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-kv6ca6rl1g] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-kv6ca6rl1g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-kv6ca6rl1g] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-kv6ca6rl1g] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-kv6ca6rl1g] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-kv6ca6rl1g] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-kv6ca6rl1g] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* ─── Toolbar buttons (WCAG 2.5.5: 44px minimum at every viewport) ─── */
[b-kv6ca6rl1g] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    color: #475569 !important;
    border-color: #d1d5db !important;
    min-height: 44px !important;
}

[b-kv6ca6rl1g] .adm-back-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-kv6ca6rl1g] .adm-back-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

[b-kv6ca6rl1g] .adm-save-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px !important;
}

[b-kv6ca6rl1g] .adm-save-btn:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: -3px;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.45);
}

.adm-save-btn__spinner[b-kv6ca6rl1g] {
    width: 16px;
    height: 16px;
}

[b-kv6ca6rl1g] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-kv6ca6rl1g] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-kv6ca6rl1g] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

/* ═══════════════════════════════════════════════════════
   PROGRESS / LOADING
   ═══════════════════════════════════════════════════════ */
[b-kv6ca6rl1g] .adm-progress {
    border-radius: 0;
}

/* ═══════════════════════════════════════════════════════
   ERROR PANEL — replaces generic MudAlert with retry CTA
   ═══════════════════════════════════════════════════════ */
.adm-error-panel[b-kv6ca6rl1g] {
    margin: 1rem 1.5rem;
    background: #ffffff;
    border: 1px solid #fee2e2;
    border-left: 3px solid #dc2626;
    border-radius: 10px;
    padding: 1.25rem 1.5rem;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.adm-error-panel__icon[b-kv6ca6rl1g] {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: rgba(220, 38, 38, 0.08);
    color: #dc2626;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.adm-error-panel__body[b-kv6ca6rl1g] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
}

.adm-error-panel__title[b-kv6ca6rl1g] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-error-panel__text[b-kv6ca6rl1g] {
    font-size: 0.82rem;
    color: #475569;
    margin: 0;
    line-height: 1.5;
}

[b-kv6ca6rl1g] .adm-error-panel__btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px !important;
    align-self: flex-start;
    margin-top: 0.25rem !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-kv6ca6rl1g] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-kv6ca6rl1g] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-kv6ca6rl1g] {
    border-right: none;
}

.adm-kpi:hover[b-kv6ca6rl1g] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-kv6ca6rl1g] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-kv6ca6rl1g] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

/* ─── Semantic KPI icon variants (replaces inline Style="color:#...") ─── */
[b-kv6ca6rl1g] .adm-kpi__icon--address  { color: #35a0ae; }
[b-kv6ca6rl1g] .adm-kpi__icon--emails   { color: #3b82f6; }
[b-kv6ca6rl1g] .adm-kpi__icon--phones   { color: #8b5cf6; }
/* B-1 brand-trap fix: amber #f59e0b on neutral "Last Updated" metadata implies
   warning state — moved to violet #8b5cf6 per Test-208/209/210 precedent. */
[b-kv6ca6rl1g] .adm-kpi__icon--updated  { color: #8b5cf6; }

.adm-kpi__label[b-kv6ca6rl1g] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-kv6ca6rl1g] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.adm-kpi__value--sm[b-kv6ca6rl1g] {
    font-size: 1.125rem;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-kv6ca6rl1g] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-kv6ca6rl1g] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-kv6ca6rl1g] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   FORM CARD — Bordered card with coloured left accent bar
   ═══════════════════════════════════════════════════════ */
.adm-form-card[b-kv6ca6rl1g] {
    margin: 0 1.5rem 0.5rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    border-left: 3px solid #e8ecf1;
    overflow: hidden;
}

.adm-form-card--teal[b-kv6ca6rl1g]  { border-left-color: #35a0ae; }
.adm-form-card--blue[b-kv6ca6rl1g]  { border-left-color: #3b82f6; }
.adm-form-card--purple[b-kv6ca6rl1g] { border-left-color: #8b5cf6; }
.adm-form-card--amber[b-kv6ca6rl1g] { border-left-color: #f59e0b; }

/* ═══════════════════════════════════════════════════════
   FORM GRID — Responsive grid inside form cards
   ═══════════════════════════════════════════════════════ */
.adm-form-grid[b-kv6ca6rl1g] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 1rem;
    padding: 1.25rem;
}

.adm-form-grid__full[b-kv6ca6rl1g]  { grid-column: span 6; }
.adm-form-grid__half[b-kv6ca6rl1g]  { grid-column: span 3; }
.adm-form-grid__third[b-kv6ca6rl1g] { grid-column: span 2; }

/* Form input styling */
[b-kv6ca6rl1g] .adm-form-card .mud-input-outlined .mud-input-outlined-border {
    border-radius: 8px;
}

[b-kv6ca6rl1g] .adm-form-card .mud-input-label {
    font-size: 0.85rem;
    color: #475569;
}

[b-kv6ca6rl1g] .adm-form-card .mud-input-adornment-start .mud-icon-root {
    color: #94a3b8;
    font-size: 1.125rem;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-kv6ca6rl1g] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1.5rem;
}

.adm-detail-card[b-kv6ca6rl1g] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-kv6ca6rl1g] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-kv6ca6rl1g] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
    background: #e8ecf1;
}

[b-kv6ca6rl1g] .adm-detail-card__icon {
    color: #94a3b8;
    flex-shrink: 0;
}

/* ─── Semantic detail-card variants
       (replaces inline style="background:#..." on bar AND inline Style="color:#..." on icon) ─── */
.adm-detail-card--address .adm-detail-card__bar[b-kv6ca6rl1g] { background: #35a0ae; }
[b-kv6ca6rl1g] .adm-detail-card--address .adm-detail-card__icon { color: #35a0ae; }

.adm-detail-card--emails .adm-detail-card__bar[b-kv6ca6rl1g] { background: #3b82f6; }
[b-kv6ca6rl1g] .adm-detail-card--emails .adm-detail-card__icon { color: #3b82f6; }

.adm-detail-card--phones .adm-detail-card__bar[b-kv6ca6rl1g] { background: #8b5cf6; }
[b-kv6ca6rl1g] .adm-detail-card--phones .adm-detail-card__icon { color: #8b5cf6; }

/* B-2 brand-trap fix: Last Updated bar+icon amber #f59e0b → violet #8b5cf6
   per Test-208/209/210 precedent (neutral metadata, not a warning). */
.adm-detail-card--updated .adm-detail-card__bar[b-kv6ca6rl1g] { background: #8b5cf6; }
[b-kv6ca6rl1g] .adm-detail-card--updated .adm-detail-card__icon { color: #8b5cf6; }

.adm-detail-card__data[b-kv6ca6rl1g] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-kv6ca6rl1g] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__number--sm[b-kv6ca6rl1g] {
    font-size: 1rem;
}

.adm-detail-card__label[b-kv6ca6rl1g] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   ACCESSIBILITY — Reduced motion
   ═══════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-kv6ca6rl1g] {
        transition: none;
    }

    .adm-detail-card[b-kv6ca6rl1g] {
        transition: none;
    }

    .adm-status-pill__dot--on[b-kv6ca6rl1g],
    .adm-status-pill__dot--warn[b-kv6ca6rl1g] {
        box-shadow: none;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-kv6ca6rl1g] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-kv6ca6rl1g] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-kv6ca6rl1g] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-kv6ca6rl1g] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-kv6ca6rl1g] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-detail-grid[b-kv6ca6rl1g] {
        grid-template-columns: 1fr;
    }

    .adm-form-grid__half[b-kv6ca6rl1g] {
        grid-column: span 6;
    }

    .adm-form-grid__third[b-kv6ca6rl1g] {
        grid-column: span 6;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-kv6ca6rl1g] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-kv6ca6rl1g] {
        padding: 1rem 0.875rem;
    }

    .adm-page-header__tools[b-kv6ca6rl1g] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-kv6ca6rl1g] .adm-back-btn,
    [b-kv6ca6rl1g] .adm-save-btn {
        width: 100%;
    }

    [b-kv6ca6rl1g] .adm-refresh-btn {
        width: 100%;
    }

    .adm-kpi-strip[b-kv6ca6rl1g] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-kv6ca6rl1g] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-kv6ca6rl1g] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-detail-grid[b-kv6ca6rl1g] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-form-card[b-kv6ca6rl1g] {
        margin: 0 0.875rem 0.5rem;
    }

    .adm-form-grid[b-kv6ca6rl1g] {
        grid-template-columns: 1fr;
        gap: 0.875rem;
        padding: 1rem;
    }

    .adm-form-grid__full[b-kv6ca6rl1g],
    .adm-form-grid__half[b-kv6ca6rl1g],
    .adm-form-grid__third[b-kv6ca6rl1g] {
        grid-column: span 1;
    }

    .adm-section-header[b-kv6ca6rl1g] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-error-panel[b-kv6ca6rl1g] {
        margin: 0.875rem;
        padding: 1rem;
        flex-direction: column;
    }
}
/* /Components/Pages/Admin/SiteSettings/SiteFees.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Site Fees — "Nordic Control Panel" Design System
   Test-212 (2026-05-06) — supersedes Test-133 (2026-04-14).
   Matches Test-205 → Test-211 standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-qhfp1swevl] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-qhfp1swevl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-qhfp1swevl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-qhfp1swevl] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-qhfp1swevl] .adm-breadcrumbs {
    padding: 0;
}

[b-qhfp1swevl] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-qhfp1swevl] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-qhfp1swevl] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-qhfp1swevl] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-qhfp1swevl] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-qhfp1swevl] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-qhfp1swevl] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-qhfp1swevl] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-qhfp1swevl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-qhfp1swevl] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-qhfp1swevl] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-qhfp1swevl] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-qhfp1swevl] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-qhfp1swevl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* ─── Toolbar buttons (WCAG 2.5.5: 44px minimum at every viewport) ─── */
[b-qhfp1swevl] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.85rem !important;
    color: #475569 !important;
    border-color: #d1d5db !important;
    min-height: 44px !important;
}

[b-qhfp1swevl] .adm-back-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-qhfp1swevl] .adm-back-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

[b-qhfp1swevl] .adm-save-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    min-height: 44px !important;
}

[b-qhfp1swevl] .adm-save-btn:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: -3px;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.45);
}

[b-qhfp1swevl] .adm-save-btn__spinner {
    width: 16px;
    height: 16px;
    margin-right: 0.5rem;
}

[b-qhfp1swevl] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-qhfp1swevl] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-qhfp1swevl] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

/* ═══════════════════════════════════════════════════════
   PROGRESS / LOADING
   ═══════════════════════════════════════════════════════ */
[b-qhfp1swevl] .adm-progress {
    border-radius: 0;
}

/* ═══════════════════════════════════════════════════════
   ERROR PANEL — replaces generic error state with retry CTA
   ═══════════════════════════════════════════════════════ */
.adm-error-panel[b-qhfp1swevl] {
    margin: 1rem 1.5rem;
    background: #ffffff;
    border: 1px solid #fee2e2;
    border-left: 3px solid #dc2626;
    border-radius: 10px;
    padding: 1.25rem 1.5rem;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.adm-error-panel__icon[b-qhfp1swevl] {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: rgba(220, 38, 38, 0.08);
    color: #dc2626;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.adm-error-panel__body[b-qhfp1swevl] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
}

.adm-error-panel__title[b-qhfp1swevl] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-error-panel__text[b-qhfp1swevl] {
    font-size: 0.82rem;
    color: #475569;
    margin: 0;
    line-height: 1.5;
}

[b-qhfp1swevl] .adm-error-panel__btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px !important;
    align-self: flex-start;
    margin-top: 0.25rem !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-qhfp1swevl] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-qhfp1swevl] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-qhfp1swevl] {
    border-right: none;
}

.adm-kpi:hover[b-qhfp1swevl] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-qhfp1swevl] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-qhfp1swevl] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

/* ─── Semantic KPI icon variants (replaces inline Style="color:#...") ─── */
[b-qhfp1swevl] .adm-kpi__icon--user-fee        { color: #35a0ae; }
[b-qhfp1swevl] .adm-kpi__icon--store-fee       { color: #3b82f6; }
[b-qhfp1swevl] .adm-kpi__icon--store-hold      { color: #8b5cf6; }
/* B-1 brand-trap fix: User Hold amber #f59e0b implied warning on a neutral hold metric.
   Moved to cyan #06b6d4 (information, neutral, complements teal user-fee colour). */
[b-qhfp1swevl] .adm-kpi__icon--user-hold       { color: #06b6d4; }
/* B-2 brand-trap fix: Ambassador Hold red #ef4444 implied error on a neutral hold metric.
   Moved to warm orange #f97316 (distinct, no error connotation, matches Test-204 precedent). */
[b-qhfp1swevl] .adm-kpi__icon--ambassador-hold { color: #f97316; }

.adm-kpi__label[b-qhfp1swevl] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-qhfp1swevl] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.adm-kpi__unit[b-qhfp1swevl] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #64748b;
    margin-left: 0.15rem;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-qhfp1swevl] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1.25rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-qhfp1swevl] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-qhfp1swevl] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-qhfp1swevl] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-qhfp1swevl] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-qhfp1swevl] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-qhfp1swevl] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
    background: #e8ecf1;
}

/* ─── Semantic detail-card variants (replaces inline style="background:#...") ─── */
.adm-detail-card--combined .adm-detail-card__bar[b-qhfp1swevl]       { background: #35a0ae; }
.adm-detail-card--revenue .adm-detail-card__bar[b-qhfp1swevl]        { background: #3b82f6; }
.adm-detail-card--user-pays .adm-detail-card__bar[b-qhfp1swevl]      { background: #8b5cf6; }
/* B-3 brand-trap fix: Store Receives amber #f59e0b implied warning on a positive
   revenue retention metric. Moved to green #16a34a (positive financial outcome). */
.adm-detail-card--store-receives .adm-detail-card__bar[b-qhfp1swevl] { background: #16a34a; }

.adm-detail-card__data[b-qhfp1swevl] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
    padding-left: 0.5rem;
}

.adm-detail-card__number[b-qhfp1swevl] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-qhfp1swevl] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   FORM CARDS
   ═══════════════════════════════════════════════════════ */
.adm-form-card[b-qhfp1swevl] {
    position: relative;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    margin: 0 1.5rem 1rem;
    overflow: hidden;
}

.adm-form-card[b-qhfp1swevl]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-form-card--teal[b-qhfp1swevl]::before {
    background: #35a0ae;
}

.adm-form-card--blue[b-qhfp1swevl]::before {
    background: #3b82f6;
}

.adm-form-card--purple[b-qhfp1swevl]::before {
    background: #8b5cf6;
}

/* Test-212 code-review H-1: fieldset prevents value mutation while save is in flight */
.adm-form-fieldset[b-qhfp1swevl] {
    border: 0;
    margin: 0;
    padding: 0;
    min-width: 0;
}

.adm-form-fieldset[disabled][b-qhfp1swevl] {
    opacity: 0.55;
    pointer-events: none;
    transition: opacity 0.15s ease;
}

.visually-hidden[b-qhfp1swevl] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Form Grid */
.adm-form-grid[b-qhfp1swevl] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 1rem;
    padding: 1.25rem;
}

.adm-form-grid__half[b-qhfp1swevl] {
    grid-column: span 3;
}

.adm-form-grid__third[b-qhfp1swevl] {
    grid-column: span 2;
}

.adm-form-grid__full[b-qhfp1swevl] {
    grid-column: span 6;
}

/* MudNumericField styling */
[b-qhfp1swevl] .adm-form-card .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-qhfp1swevl] .adm-form-card .mud-input {
    font-size: 0.9rem;
    color: #334155 !important;
}

[b-qhfp1swevl] .adm-form-card .mud-input-label {
    color: #475569 !important;
    font-weight: 500;
}

[b-qhfp1swevl] .adm-form-card .mud-input-helper-text {
    color: #64748b;
    font-size: 0.75rem;
}

[b-qhfp1swevl] .adm-form-card .mud-input-outlined:hover .mud-input-outlined-border {
    border-color: #35a0ae;
}

[b-qhfp1swevl] .adm-form-card .mud-input-outlined.mud-input-outlined-legal .mud-input-outlined-border {
    border-color: #35a0ae;
}

/* ═══════════════════════════════════════════════════════
   FEE CALCULATOR
   ═══════════════════════════════════════════════════════ */
.adm-calculator[b-qhfp1swevl] {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.adm-calculator__row[b-qhfp1swevl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
}

.adm-calculator__row--total[b-qhfp1swevl] {
    background: #f8f9fb;
}

.adm-calculator__row--highlight[b-qhfp1swevl] {
    background: rgba(53, 160, 174, 0.06);
    border: 1px solid rgba(53, 160, 174, 0.15);
}

.adm-calculator__label[b-qhfp1swevl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #334155;
}

.adm-calculator__value[b-qhfp1swevl] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.adm-calculator__value--add[b-qhfp1swevl] {
    color: #15803d;
}

.adm-calculator__value--deduct[b-qhfp1swevl] {
    color: #dc2626;
}

.adm-calculator__value--primary[b-qhfp1swevl] {
    color: #2e919e;
    font-size: 1rem;
}

/* ─── Semantic calculator icon variants (replaces inline Style="color:#...") ─── */
[b-qhfp1swevl] .adm-calculator__add-icon    { color: #15803d; }
[b-qhfp1swevl] .adm-calculator__deduct-icon { color: #dc2626; }

.adm-calculator__divider[b-qhfp1swevl] {
    height: 1px;
    background: #e8ecf1;
    margin: 0.25rem 0;
}

/* ═══════════════════════════════════════════════════════
   ACCESSIBILITY — Reduced motion
   ═══════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-qhfp1swevl] {
        transition: none;
    }

    .adm-detail-card[b-qhfp1swevl] {
        transition: none;
    }

    .adm-status-pill__dot--on[b-qhfp1swevl],
    .adm-status-pill__dot--warn[b-qhfp1swevl] {
        box-shadow: none;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-qhfp1swevl] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-qhfp1swevl] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-qhfp1swevl] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-qhfp1swevl] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-qhfp1swevl] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-qhfp1swevl] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-detail-grid[b-qhfp1swevl] {
        grid-template-columns: 1fr;
    }

    .adm-form-grid__half[b-qhfp1swevl],
    .adm-form-grid__third[b-qhfp1swevl] {
        grid-column: span 6;
    }

    .adm-kpi-strip[b-qhfp1swevl] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-calculator__row[b-qhfp1swevl] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }

    .adm-calculator__value[b-qhfp1swevl] {
        padding-left: 1.75rem;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-qhfp1swevl] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-qhfp1swevl] {
        padding: 1rem 0.875rem;
    }

    .adm-page-header__tools[b-qhfp1swevl] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-qhfp1swevl] .adm-back-btn,
    [b-qhfp1swevl] .adm-save-btn {
        width: 100%;
        justify-content: center !important;
    }

    [b-qhfp1swevl] .adm-refresh-btn {
        width: 100%;
    }

    .adm-kpi-strip[b-qhfp1swevl] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-qhfp1swevl] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-qhfp1swevl] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-qhfp1swevl] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-qhfp1swevl] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-qhfp1swevl] {
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-qhfp1swevl] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-form-card[b-qhfp1swevl] {
        margin-left: 0.875rem;
        margin-right: 0.875rem;
    }

    .adm-form-grid[b-qhfp1swevl] {
        padding: 1rem;
        gap: 0.75rem;
    }

    .adm-error-panel[b-qhfp1swevl] {
        margin: 0.875rem;
        padding: 1rem;
        flex-direction: column;
    }
}
/* /Components/Pages/Admin/SiteSettings/SiteGeneralSettings.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   General Settings — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + SiteConfiguration (Test-208) standard.
   Test-209 modernization (2026-05-05): supersedes Test-131 8.5/10 → 9.0/10.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-31708oarnk] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-31708oarnk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-31708oarnk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-31708oarnk] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-31708oarnk] .adm-breadcrumbs {
    padding: 0;
}

[b-31708oarnk] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #475569;
}

[b-31708oarnk] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-31708oarnk] .adm-breadcrumbs a {
    color: #475569 !important;
    text-decoration: none;
}

[b-31708oarnk] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-31708oarnk] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-31708oarnk] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-31708oarnk] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-31708oarnk] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-31708oarnk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-31708oarnk] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-31708oarnk] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-31708oarnk] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-31708oarnk] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-31708oarnk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Back Button — Test-209 C-2: 44px touch target at all viewports */
[b-31708oarnk] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    color: #475569 !important;
    border-color: #d1d5db !important;
    min-height: 44px !important;
}

[b-31708oarnk] .adm-back-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-31708oarnk] .adm-back-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

/* Save Button — Test-209 C-2: 44px touch target at all viewports */
[b-31708oarnk] .adm-save-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px !important;
}

[b-31708oarnk] .adm-save-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

[b-31708oarnk] .adm-save-btn__spinner {
    width: 16px;
    height: 16px;
}

/* Refresh Button — Test-209 C-1: 44×44 minimum at all viewports (Size.Medium) */
[b-31708oarnk] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-31708oarnk] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-31708oarnk] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

/* Loading bar — replaces inline Style="border-radius: 0;" */
[b-31708oarnk] .adm-progress {
    border-radius: 0;
}

/* ═══════════════════════════════════════════════════════
   ERROR PANEL — retry pattern (Test-205 H-2 / Test-208 M-8)
   ═══════════════════════════════════════════════════════ */
.adm-error-panel[b-31708oarnk] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 1rem 1.5rem 0;
    padding: 1rem 1.25rem;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 10px;
    color: #991b1b;
}

[b-31708oarnk] .adm-error-panel .mud-icon-root {
    color: #dc2626;
    flex-shrink: 0;
}

.adm-error-panel__body[b-31708oarnk] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.adm-error-panel__title[b-31708oarnk] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #7f1d1d;
}

.adm-error-panel__msg[b-31708oarnk] {
    font-size: 0.8rem;
    color: #991b1b;
    margin-top: 0.125rem;
}

[b-31708oarnk] .adm-error-panel__btn {
    flex-shrink: 0;
    border-radius: 8px !important;
    text-transform: none !important;
    min-height: 36px;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-31708oarnk] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-31708oarnk] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-31708oarnk] {
    border-right: none;
}

.adm-kpi:hover[b-31708oarnk] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-31708oarnk] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-31708oarnk] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.85;
}

/* KPI icon semantic colors — Test-209 H-5: replaces 4 inline Style="color:#..." */
[b-31708oarnk] .adm-kpi__icon--config     { color: #35a0ae; }
[b-31708oarnk] .adm-kpi__icon--status-on  { color: #16a34a; } /* WCAG-tighter than #22c55e */
[b-31708oarnk] .adm-kpi__icon--status-off { color: #dc2626; } /* red on inactive IS correct semantics */
[b-31708oarnk] .adm-kpi__icon--created    { color: #3b82f6; }
[b-31708oarnk] .adm-kpi__icon--updated    { color: #8b5cf6; } /* B-1 brand-trap fix: amber → violet (neutral metadata) */

.adm-kpi__label[b-31708oarnk] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-31708oarnk] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.adm-kpi__value--sm[b-31708oarnk] {
    font-size: 1.125rem;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-31708oarnk] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-31708oarnk] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-31708oarnk] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   FORM SECTION — Settings form row
   ═══════════════════════════════════════════════════════ */
.adm-form-section[b-31708oarnk] {
    margin: 0 1.5rem 0.5rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    overflow: hidden;
}

.adm-form-row[b-31708oarnk] {
    padding: 1rem 1.25rem;
}

.adm-form-row__content[b-31708oarnk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
}

.adm-form-row__label[b-31708oarnk] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    flex: 1;
    min-width: 0;
}

/* Form-row icon — Test-209 M-7: replaces inline Style="color: #64748b;" */
[b-31708oarnk] .adm-form-row__icon {
    color: #64748b;
}

.adm-form-row__title[b-31708oarnk] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1e293b;
    display: block;
    line-height: 1.4;
}

.adm-form-row__desc[b-31708oarnk] {
    font-size: 0.78rem;
    color: #64748b;
    line-height: 1.5;
    display: block;
    margin-top: 0.15rem;
}

[b-31708oarnk] .adm-switch {
    flex-shrink: 0;
}

[b-31708oarnk] .adm-switch:focus-within {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
    border-radius: 8px;
}

.adm-form-alert[b-31708oarnk] {
    margin: 0 1.25rem 1rem;
    border-radius: 8px;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS — semantic --variant modifiers (Test-209 H-6)
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-31708oarnk] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1.5rem;
}

.adm-detail-card[b-31708oarnk] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-31708oarnk] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-31708oarnk] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

/* Detail card semantic colors — replaces 4 inline barInlineStyle + 4 inline iconInlineStyle (8 sites) */
.adm-detail-card--config     .adm-detail-card__bar[b-31708oarnk] { background: #35a0ae; }
.adm-detail-card--status-on  .adm-detail-card__bar[b-31708oarnk] { background: #16a34a; }
.adm-detail-card--status-off .adm-detail-card__bar[b-31708oarnk] { background: #dc2626; }
.adm-detail-card--created    .adm-detail-card__bar[b-31708oarnk] { background: #3b82f6; }
.adm-detail-card--updated    .adm-detail-card__bar[b-31708oarnk] { background: #8b5cf6; } /* B-2 brand-trap fix: amber → violet */

[b-31708oarnk] .adm-detail-card--config     .adm-detail-card__icon { color: #35a0ae; }
[b-31708oarnk] .adm-detail-card--status-on  .adm-detail-card__icon { color: #16a34a; }
[b-31708oarnk] .adm-detail-card--status-off .adm-detail-card__icon { color: #dc2626; }
[b-31708oarnk] .adm-detail-card--created    .adm-detail-card__icon { color: #3b82f6; }
[b-31708oarnk] .adm-detail-card--updated    .adm-detail-card__icon { color: #8b5cf6; }

.adm-detail-card__data[b-31708oarnk] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-31708oarnk] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__number--sm[b-31708oarnk] {
    font-size: 1rem;
}

.adm-detail-card__label[b-31708oarnk] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-31708oarnk] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-31708oarnk] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-31708oarnk] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-31708oarnk] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-31708oarnk] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-detail-grid[b-31708oarnk] {
        grid-template-columns: 1fr;
    }

    .adm-error-panel[b-31708oarnk] {
        flex-wrap: wrap;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-31708oarnk] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-31708oarnk] {
        padding: 1rem 0.875rem;
    }

    .adm-page-header__tools[b-31708oarnk] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-31708oarnk] .adm-back-btn,
    [b-31708oarnk] .adm-save-btn {
        width: 100%;
    }

    [b-31708oarnk] .adm-refresh-btn {
        width: 100%;
    }

    .adm-kpi-strip[b-31708oarnk] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-31708oarnk] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-31708oarnk] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-detail-grid[b-31708oarnk] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-form-section[b-31708oarnk] {
        margin: 0 0.875rem 0.5rem;
    }

    .adm-section-header[b-31708oarnk] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-form-row__content[b-31708oarnk] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    [b-31708oarnk] .adm-switch {
        align-self: flex-start;
    }

    .adm-error-panel[b-31708oarnk] {
        margin: 1rem 0.875rem 0;
    }
}

/* ═══════════════════════════════════════════════════════
   ACCESSIBILITY — prefers-reduced-motion (Test-209 H-7)
   ═══════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-31708oarnk],
    .adm-detail-card[b-31708oarnk] {
        transition: none;
    }

    .adm-status-pill__dot--on[b-31708oarnk],
    .adm-status-pill__dot--warn[b-31708oarnk] {
        box-shadow: none;
    }
}
/* /Components/Pages/Admin/SiteSettings/SiteSelfInsuranceSettings.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Self-Insurance Settings — Nordic Control Panel
   Follows AnalyticsDashboard design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-g6h224vv31] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══ Action Bar ═══ */
.adm-actionbar[b-g6h224vv31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-g6h224vv31] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-g6h224vv31] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-g6h224vv31] .adm-breadcrumbs {
    padding: 0;
}

[b-g6h224vv31] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-g6h224vv31] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-g6h224vv31] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-g6h224vv31] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-g6h224vv31] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-g6h224vv31] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-g6h224vv31] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-g6h224vv31] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══ Page Header ═══ */
.adm-page-header[b-g6h224vv31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-g6h224vv31] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-g6h224vv31] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-g6h224vv31] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-g6h224vv31] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-g6h224vv31] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Header Buttons — 44px min-height enforced for WCAG 2.5.5 at every viewport */
[b-g6h224vv31] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.85rem !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
    min-height: 44px !important;
}

[b-g6h224vv31] .adm-back-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-g6h224vv31] .adm-back-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

[b-g6h224vv31] .adm-save-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    min-height: 44px !important;
}

[b-g6h224vv31] .adm-save-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

.adm-save-btn__spinner[b-g6h224vv31] {
    width: 16px;
    height: 16px;
}

[b-g6h224vv31] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-g6h224vv31] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-g6h224vv31] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

/* ═══ Loading / Error States ═══ */
.adm-loading[b-g6h224vv31] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4rem 1.5rem;
    background: #ffffff;
}

.adm-error-panel[b-g6h224vv31] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1.5rem;
    margin: 1.5rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 12px;
    text-align: center;
}

.adm-error-panel__icon[b-g6h224vv31] {
    color: #94a3b8 !important;
}

.adm-error-panel__title[b-g6h224vv31] {
    font-size: 1rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0.25rem 0 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-error-panel__body[b-g6h224vv31] {
    font-size: 0.85rem;
    color: #64748b;
    margin: 0 0 0.5rem;
    line-height: 1.5;
    max-width: 380px;
}

[b-g6h224vv31] .adm-error-panel__btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px !important;
}

/* ═══ KPI Strip ═══ */
.adm-kpi-strip[b-g6h224vv31] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-g6h224vv31] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-g6h224vv31] {
    border-right: none;
}

.adm-kpi:hover[b-g6h224vv31] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-g6h224vv31] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-g6h224vv31] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.85;
}

/* KPI icon colour variants — semantic, no inline styles */
[b-g6h224vv31] .adm-kpi__icon--platform {
    color: #35a0ae !important;
}

[b-g6h224vv31] .adm-kpi__icon--physical {
    color: #3b82f6 !important;
}

[b-g6h224vv31] .adm-kpi__icon--digital {
    color: #8b5cf6 !important;
}

/* Immediate Release: was amber #f59e0b (brand-trap on neutral feature toggle) → sky blue
   Dispute Release:   was red   #ef4444 (too close to Rently red #EF412c) → cyan       */
[b-g6h224vv31] .adm-kpi__icon--immediate {
    color: #0ea5e9 !important;
}

[b-g6h224vv31] .adm-kpi__icon--dispute {
    color: #06b6d4 !important;
}

.adm-kpi__label[b-g6h224vv31] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-g6h224vv31] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.adm-kpi__value--on[b-g6h224vv31] {
    color: #15803d;
}

.adm-kpi__value--off[b-g6h224vv31] {
    color: #b45309;
}

.adm-kpi__unit[b-g6h224vv31] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #64748b;
    margin-left: 0.15rem;
}

/* ═══ Section Headers ═══ */
.adm-section-header[b-g6h224vv31] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1.25rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-g6h224vv31] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-g6h224vv31] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══ Detail Cards ═══ */
.adm-detail-grid[b-g6h224vv31] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-g6h224vv31] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-g6h224vv31] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-g6h224vv31] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
    background: #35a0ae; /* default fallback */
}

/* Detail card bar colour variants — semantic, no inline styles
   Launch Readiness: was amber #f59e0b → sky blue (consistent with Immediate Release re-colour) */
.adm-detail-card--documents .adm-detail-card__bar[b-g6h224vv31] {
    background: #35a0ae;
}

.adm-detail-card--collection .adm-detail-card__bar[b-g6h224vv31] {
    background: #3b82f6;
}

.adm-detail-card--release .adm-detail-card__bar[b-g6h224vv31] {
    background: #8b5cf6;
}

.adm-detail-card--readiness .adm-detail-card__bar[b-g6h224vv31] {
    background: #0ea5e9;
}

.adm-detail-card__data[b-g6h224vv31] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
    padding-left: 0.5rem;
}

.adm-detail-card__number[b-g6h224vv31] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-g6h224vv31] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══ Form Cards ═══ */
.adm-form-card[b-g6h224vv31] {
    position: relative;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    margin: 0 1.5rem 1rem;
    overflow: hidden;
}

.adm-form-card[b-g6h224vv31]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-form-card--teal[b-g6h224vv31]::before {
    background: #35a0ae;
}

.adm-form-card--blue[b-g6h224vv31]::before {
    background: #3b82f6;
}

.adm-form-card--purple[b-g6h224vv31]::before {
    background: #8b5cf6;
}

.adm-form-card--amber[b-g6h224vv31]::before {
    background: #f59e0b;
}

.adm-form-card--green[b-g6h224vv31]::before {
    background: #22c55e;
}

/* Form Grid */
.adm-form-grid[b-g6h224vv31] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 1rem;
    padding: 1.25rem;
}

.adm-form-grid__half[b-g6h224vv31] {
    grid-column: span 3;
}

.adm-form-grid__full[b-g6h224vv31] {
    grid-column: span 6;
}

/* Form card inline alerts */
.adm-form-card__alert[b-g6h224vv31] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.75rem 1.25rem;
    font-size: 0.82rem;
    border-top: 1px solid #e8ecf1;
}

.adm-form-card__alert--warning[b-g6h224vv31] {
    background: #fffbeb;
    color: #92400e;
}

.adm-form-card__alert--info[b-g6h224vv31] {
    background: #f0f9ff;
    color: #0c4a6e;
}

/* MudSwitch styling */
[b-g6h224vv31] .adm-form-card .mud-switch-label {
    font-size: 0.9rem;
    color: #334155;
    font-weight: 500;
}

[b-g6h224vv31] .adm-form-card .mud-input-helper-text {
    color: #64748b;
    font-size: 0.75rem;
}

/* MudSelect styling */
[b-g6h224vv31] .adm-form-card .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-g6h224vv31] .adm-form-card .mud-input {
    font-size: 0.9rem;
    color: #334155 !important;
}

[b-g6h224vv31] .adm-form-card .mud-input-label {
    color: #475569 !important;
    font-weight: 500;
}

[b-g6h224vv31] .adm-form-card .mud-input-outlined:hover .mud-input-outlined-border {
    border-color: #35a0ae;
}

/* Document option styling */
.adm-doc-option[b-g6h224vv31] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-doc-option__title[b-g6h224vv31] {
    font-size: 0.875rem;
    color: #334155;
    font-weight: 500;
}

.adm-doc-option__desc[b-g6h224vv31] {
    font-size: 0.75rem;
    color: #64748b;
}

/* ═══ Launch Summary ═══ */
.adm-launch-summary[b-g6h224vv31] {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.adm-launch-summary__row[b-g6h224vv31] {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    font-size: 0.875rem;
    color: #334155;
    line-height: 1.5;
}

[b-g6h224vv31] .adm-launch-summary__icon {
    flex-shrink: 0;
    margin-top: 0.15rem;
}

[b-g6h224vv31] .adm-launch-summary__icon--on {
    color: #15803d !important;
}

[b-g6h224vv31] .adm-launch-summary__icon--off {
    color: #b45309 !important;
}

[b-g6h224vv31] .adm-launch-summary__icon--sync {
    color: #35a0ae !important;
}

.adm-launch-summary__divider[b-g6h224vv31] {
    height: 1px;
    background: #e8ecf1;
}

/* ═══ Reduced motion ═══ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-g6h224vv31],
    .adm-detail-card[b-g6h224vv31] {
        transition: none !important;
    }

    .adm-status-pill__dot--on[b-g6h224vv31],
    .adm-status-pill__dot--warn[b-g6h224vv31] {
        box-shadow: none !important;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-g6h224vv31] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-g6h224vv31] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-g6h224vv31] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-g6h224vv31] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-g6h224vv31] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-g6h224vv31] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-detail-grid[b-g6h224vv31] {
        grid-template-columns: 1fr;
    }

    .adm-form-grid__half[b-g6h224vv31] {
        grid-column: span 6;
    }

    .adm-kpi-strip[b-g6h224vv31] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-g6h224vv31] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-g6h224vv31] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-g6h224vv31] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-g6h224vv31] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-g6h224vv31] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-g6h224vv31] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-g6h224vv31] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-g6h224vv31] {
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-g6h224vv31] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-form-card[b-g6h224vv31] {
        margin-left: 0.875rem;
        margin-right: 0.875rem;
    }

    .adm-form-grid[b-g6h224vv31] {
        padding: 1rem;
        gap: 0.75rem;
    }

    .adm-page-header__tools[b-g6h224vv31] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-g6h224vv31] .adm-back-btn,
    [b-g6h224vv31] .adm-save-btn {
        width: 100%;
        justify-content: center !important;
    }

    .adm-status-pill[b-g6h224vv31] {
        font-size: 0.7rem;
    }
}
/* /Components/Pages/Admin/SiteSettings/SiteShareBanners.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Share Banners — Nordic Control Panel
   Follows AnalyticsDashboard design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-wjjlrnhoy1] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══ Action Bar ═══ */
.adm-actionbar[b-wjjlrnhoy1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-wjjlrnhoy1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-wjjlrnhoy1] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-wjjlrnhoy1] .adm-breadcrumbs {
    padding: 0;
}

[b-wjjlrnhoy1] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-wjjlrnhoy1] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-wjjlrnhoy1] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-wjjlrnhoy1] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-wjjlrnhoy1] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-wjjlrnhoy1] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-wjjlrnhoy1] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-wjjlrnhoy1] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══ Page Header ═══ */
.adm-page-header[b-wjjlrnhoy1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-wjjlrnhoy1] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-wjjlrnhoy1] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-wjjlrnhoy1] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-wjjlrnhoy1] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-wjjlrnhoy1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Header Buttons */
[b-wjjlrnhoy1] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.85rem !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
    min-height: 44px !important; /* Test-215 C-2: WCAG 2.5.5 floor */
}

[b-wjjlrnhoy1] .adm-back-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-wjjlrnhoy1] .adm-back-btn:focus-visible {
    outline: 2px solid #35a0ae !important;
    outline-offset: 2px !important;
}

[b-wjjlrnhoy1] .adm-save-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    min-height: 44px !important; /* Test-215 C-1: WCAG 2.5.5 floor */
}

[b-wjjlrnhoy1] .adm-save-btn:focus-visible {
    outline: 2px solid #ffffff !important;
    outline-offset: -3px !important;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.5) !important;
}

[b-wjjlrnhoy1] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px;
    min-height: 44px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-wjjlrnhoy1] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-wjjlrnhoy1] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae !important;
    outline-offset: 2px !important;
}

/* Test-215 M-5: Variant.Text buttons (Remove Background, Reset Defaults) */
[b-wjjlrnhoy1] .adm-text-btn {
    text-transform: none !important;
    border-radius: 8px !important;
    min-height: 36px !important;
}

[b-wjjlrnhoy1] .adm-text-btn--spaced {
    margin-top: 0.5rem !important;
}

[b-wjjlrnhoy1] .adm-text-btn:focus-visible {
    outline: 2px solid #35a0ae !important;
    outline-offset: 2px !important;
}

/* ═══ Loading / Error States ═══ */
.adm-loading[b-wjjlrnhoy1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 4rem 1.5rem;
    background: #ffffff;
}

.adm-loading__label[b-wjjlrnhoy1] {
    font-size: 0.85rem;
    color: #5e6e7e;
    font-weight: 500;
}

/* Test-215 H-10: Nordic error panel pattern (Test-205 H-2 / 211 H-9 / 214 H-10) */
.adm-error-panel[b-wjjlrnhoy1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.875rem;
    padding: 4rem 1.5rem;
    margin: 1rem 1.5rem;
    background: #ffffff;
    border: 1px dashed #e2e8f0;
    border-radius: 12px;
    color: #475569;
    font-size: 0.9rem;
}

.adm-error-panel__icon[b-wjjlrnhoy1] {
    color: #64748b !important;
}

.adm-error-panel__msg[b-wjjlrnhoy1] {
    margin: 0;
    text-align: center;
    color: #475569;
    font-weight: 500;
}

/* ═══ KPI Strip ═══ */
.adm-kpi-strip[b-wjjlrnhoy1] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-wjjlrnhoy1] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-wjjlrnhoy1] {
    border-right: none;
}

.adm-kpi:hover[b-wjjlrnhoy1] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-wjjlrnhoy1] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-wjjlrnhoy1] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.85;
}

/* Test-215 H-4: Semantic KPI icon colour variants (replaces 4 inline Style sites) */
[b-wjjlrnhoy1] .adm-kpi__icon--total {
    color: #35a0ae !important; /* Rently primary teal — total configs */
}

[b-wjjlrnhoy1] .adm-kpi__icon--platforms {
    color: #3b82f6 !important; /* blue — platform breadth */
}

[b-wjjlrnhoy1] .adm-kpi__icon--rental {
    color: #8b5cf6 !important; /* purple — rental variation */
}

[b-wjjlrnhoy1] .adm-kpi__icon--store {
    color: #f59e0b !important; /* amber — store variation */
}

/* Test-215 H-4: Semantic sub-card icon variants (preview / tune) */
[b-wjjlrnhoy1] .adm-card-icon--preview {
    color: #35a0ae !important;
}

[b-wjjlrnhoy1] .adm-card-icon--tune {
    color: #3b82f6 !important;
}

.adm-kpi__label[b-wjjlrnhoy1] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-wjjlrnhoy1] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══ Section Headers ═══ */
.adm-section-header[b-wjjlrnhoy1] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1.25rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-wjjlrnhoy1] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    scroll-margin-top: 80px; /* Test-215 M-4/L-3: ToC anchor offset */
}

.adm-section-header__subtitle[b-wjjlrnhoy1] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══ Detail Cards ═══ */
.adm-detail-grid[b-wjjlrnhoy1] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-wjjlrnhoy1] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-wjjlrnhoy1] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-wjjlrnhoy1] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

/* Test-215 H-5: Semantic detail-card bar variants (replaces 4 inline style sites) */
.adm-detail-card__bar--bg-image[b-wjjlrnhoy1] {
    background: #35a0ae; /* primary teal — main background-image metric */
}

.adm-detail-card__bar--store-name[b-wjjlrnhoy1] {
    background: #3b82f6; /* blue — store name display */
}

.adm-detail-card__bar--active[b-wjjlrnhoy1] {
    background: #8b5cf6; /* purple — active configs */
}

.adm-detail-card__bar--updated[b-wjjlrnhoy1] {
    background: #f59e0b; /* amber — updated timestamp */
}

.adm-detail-card__data[b-wjjlrnhoy1] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
    padding-left: 0.5rem;
}

.adm-detail-card__number[b-wjjlrnhoy1] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-wjjlrnhoy1] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══ Editor Area (Tabs) ═══ */
.adm-editor-area[b-wjjlrnhoy1] {
    margin: 0 1.5rem 1rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    overflow: hidden;
}

[b-wjjlrnhoy1] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    min-height: 44px;
}

[b-wjjlrnhoy1] .adm-tabs .mud-tab {
    text-transform: none !important;
    font-weight: 500;
    font-size: 0.875rem;
    color: #64748b;
    min-height: 44px;
    padding: 0 1.25rem;
}

[b-wjjlrnhoy1] .adm-tabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-wjjlrnhoy1] .adm-tabs .mud-tabs-slider {
    background: #35a0ae;
    height: 2px;
}

[b-wjjlrnhoy1] .adm-subtabs .mud-tabs-toolbar {
    background: #f8f9fb;
    border-bottom: 1px solid #f1f5f9;
    min-height: 40px;
}

[b-wjjlrnhoy1] .adm-subtabs .mud-tab {
    text-transform: none !important;
    font-weight: 500;
    font-size: 0.8rem;
    color: #64748b;
    min-height: 40px;
    padding: 0 1rem;
}

[b-wjjlrnhoy1] .adm-subtabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-wjjlrnhoy1] .adm-subtabs .mud-tabs-slider {
    background: #35a0ae;
    height: 2px;
}

/* ═══ Form Cards ═══ */
.adm-form-card[b-wjjlrnhoy1] {
    position: relative;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    margin: 1rem 1.25rem;
    overflow: hidden;
}

.adm-form-card[b-wjjlrnhoy1]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-form-card--teal[b-wjjlrnhoy1]::before {
    background: #35a0ae;
}

.adm-form-card--blue[b-wjjlrnhoy1]::before {
    background: #3b82f6;
}

/* Form Grid */
.adm-form-grid[b-wjjlrnhoy1] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 1rem;
    padding: 1.25rem;
}

.adm-form-grid__half[b-wjjlrnhoy1] {
    grid-column: span 3;
}

.adm-form-grid__full[b-wjjlrnhoy1] {
    grid-column: span 6;
}

.adm-field-group-title[b-wjjlrnhoy1] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 0.75rem;
}

.adm-dim-grid[b-wjjlrnhoy1] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

/* MudBlazor form overrides */
[b-wjjlrnhoy1] .adm-form-card .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-wjjlrnhoy1] .adm-form-card .mud-input {
    font-size: 0.9rem;
    color: #334155 !important;
}

[b-wjjlrnhoy1] .adm-form-card .mud-input-label {
    color: #475569 !important;
    font-weight: 500;
}

[b-wjjlrnhoy1] .adm-form-card .mud-input-outlined:hover .mud-input-outlined-border {
    border-color: #35a0ae;
}

/* Slider overrides */
[b-wjjlrnhoy1] .adm-form-card .mud-slider {
    margin-bottom: 0.5rem;
}

[b-wjjlrnhoy1] .adm-form-card .mud-slider .mud-slider-value-label {
    font-size: 0.75rem;
    color: #475569;
}

/* ═══ Canvas Preview ═══ */
.adm-canvas-card[b-wjjlrnhoy1] {
    overflow: visible;
}

.adm-canvas-header[b-wjjlrnhoy1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.875rem 1.25rem;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-canvas-header__left[b-wjjlrnhoy1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-canvas-header__title[b-wjjlrnhoy1] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
}

.adm-canvas-header__dims[b-wjjlrnhoy1] {
    font-size: 0.72rem;
    color: #64748b;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    background: #f1f5f9;
    padding: 0.125rem 0.5rem;
    border-radius: 4px;
}

.adm-canvas-header__right[b-wjjlrnhoy1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

[b-wjjlrnhoy1] .adm-zoom-group .mud-button-group-root {
    border-radius: 8px;
}

[b-wjjlrnhoy1] .adm-zoom-group .mud-button-root {
    font-size: 0.7rem !important;
    text-transform: none !important;
    padding: 0.25rem 0.5rem !important;
    min-width: auto !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
}

[b-wjjlrnhoy1] .adm-zoom--active {
    background-color: #35a0ae !important;
    color: #ffffff !important;
    border-color: #35a0ae !important;
}

.adm-canvas-wrapper[b-wjjlrnhoy1] {
    background: #f8f9fb;
    padding: 1.25rem;
    position: relative;
    overflow: hidden;
    min-height: 350px;
}

.adm-canvas-scroll[b-wjjlrnhoy1] {
    overflow: auto;
    height: 500px;
    min-height: 350px;
    max-height: 65vh;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    position: relative;
}

.adm-canvas[b-wjjlrnhoy1] {
    position: relative;
    box-shadow: 0 2px 12px rgba(15, 23, 42, 0.08);
    transition: transform 0.3s ease;
    transform-origin: center center;
    flex-shrink: 0;
    margin: auto;
    border-radius: 2px;
}

.adm-canvas__bg[b-wjjlrnhoy1] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.adm-canvas__bg-img[b-wjjlrnhoy1] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.adm-canvas__grid[b-wjjlrnhoy1] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image:
        repeating-linear-gradient(0deg, rgba(53, 160, 174, 0.06) 0, rgba(53, 160, 174, 0.06) 1px, transparent 1px, transparent 20px),
        repeating-linear-gradient(90deg, rgba(53, 160, 174, 0.06) 0, rgba(53, 160, 174, 0.06) 1px, transparent 1px, transparent 20px);
    pointer-events: none;
    z-index: 1;
}

.adm-canvas__el[b-wjjlrnhoy1] {
    position: absolute;
    cursor: pointer;
    transition: box-shadow 0.15s ease;
    z-index: 2;
}

.adm-canvas__el--selected[b-wjjlrnhoy1] {
    box-shadow: 0 0 0 2px #35a0ae;
}

.adm-canvas__el:hover[b-wjjlrnhoy1] {
    box-shadow: 0 0 0 2px rgba(53, 160, 174, 0.4);
}

.adm-canvas__el--image[b-wjjlrnhoy1] {
    background: rgba(241, 245, 249, 0.9);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.adm-canvas__el--text[b-wjjlrnhoy1] {
    background: rgba(255, 255, 255, 0.85);
    display: flex;
    align-items: center;
    padding: 10px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

.adm-canvas__placeholder[b-wjjlrnhoy1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: #64748b;
    font-size: 0.8rem;
}

[b-wjjlrnhoy1] .adm-canvas__placeholder .mud-icon-root {
    font-size: 2.5rem;
    color: #94a3b8;
}

.adm-canvas__ruler-x[b-wjjlrnhoy1],
.adm-canvas__ruler-y[b-wjjlrnhoy1] {
    position: absolute;
    background: rgba(53, 160, 174, 0.08);
    pointer-events: none;
    z-index: 3;
}

.adm-canvas__ruler-x[b-wjjlrnhoy1] {
    top: -18px;
    left: 0;
    height: 18px;
    background-image: repeating-linear-gradient(90deg, #64748b 0, #64748b 1px, transparent 1px, transparent 10px);
}

.adm-canvas__ruler-y[b-wjjlrnhoy1] {
    left: -18px;
    top: 0;
    width: 18px;
    background-image: repeating-linear-gradient(0deg, #64748b 0, #64748b 1px, transparent 1px, transparent 10px);
}

.adm-canvas-controls[b-wjjlrnhoy1] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid #f1f5f9;
}

.adm-canvas-controls__hint[b-wjjlrnhoy1] {
    margin-left: auto;
    font-size: 0.72rem;
    color: #94a3b8;
    font-style: italic;
}

/* ═══ Config Card ═══ */
.adm-config-header[b-wjjlrnhoy1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1.25rem;
    border-bottom: 1px solid #f1f5f9;
}

.adm-config-header__title[b-wjjlrnhoy1] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
}

[b-wjjlrnhoy1] .adm-config-tabs .mud-tabs-toolbar {
    background: #f8f9fb;
    border-bottom: 1px solid #f1f5f9;
    min-height: 40px;
}

[b-wjjlrnhoy1] .adm-config-tabs .mud-tab {
    text-transform: none !important;
    font-weight: 500;
    font-size: 0.8rem;
    color: #64748b;
    min-height: 40px;
}

[b-wjjlrnhoy1] .adm-config-tabs .mud-tab.mud-tab-active {
    color: #256f7a;
    font-weight: 600;
}

[b-wjjlrnhoy1] .adm-config-tabs .mud-tabs-slider {
    background: #3b82f6;
    height: 2px;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-wjjlrnhoy1] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-wjjlrnhoy1] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-wjjlrnhoy1] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-wjjlrnhoy1] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-wjjlrnhoy1] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-wjjlrnhoy1] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    [b-wjjlrnhoy1] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }

    .adm-detail-grid[b-wjjlrnhoy1] {
        grid-template-columns: 1fr;
    }

    .adm-form-grid__half[b-wjjlrnhoy1] {
        grid-column: span 6;
    }

    .adm-canvas-header[b-wjjlrnhoy1] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-canvas-controls[b-wjjlrnhoy1] {
        flex-wrap: wrap;
    }

    .adm-editor-area[b-wjjlrnhoy1] {
        margin: 0 0.875rem 1rem;
    }

    .adm-form-card[b-wjjlrnhoy1] {
        margin: 0.75rem;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-wjjlrnhoy1] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-wjjlrnhoy1] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-wjjlrnhoy1] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-wjjlrnhoy1] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-wjjlrnhoy1] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-detail-grid[b-wjjlrnhoy1] {
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-wjjlrnhoy1] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-editor-area[b-wjjlrnhoy1] {
        margin: 0 0.5rem 1rem;
        border-radius: 8px;
    }

    .adm-form-card[b-wjjlrnhoy1] {
        margin: 0.5rem;
    }

    .adm-form-grid[b-wjjlrnhoy1] {
        padding: 1rem;
        gap: 0.75rem;
    }

    .adm-canvas-wrapper[b-wjjlrnhoy1] {
        padding: 0.75rem;
    }

    .adm-canvas-scroll[b-wjjlrnhoy1] {
        height: 300px;
        min-height: 250px;
        padding: 1rem;
    }

    .adm-page-header__tools[b-wjjlrnhoy1] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-wjjlrnhoy1] .adm-back-btn,
    [b-wjjlrnhoy1] .adm-save-btn {
        width: 100%;
        justify-content: center !important;
        min-height: 44px;
    }

    [b-wjjlrnhoy1] .adm-zoom-group .mud-button-root {
        min-height: 36px !important;
        padding: 0.375rem 0.625rem !important;
    }

    .adm-dim-grid[b-wjjlrnhoy1] {
        grid-template-columns: 1fr;
    }
}

/* ═══════════════════════════════════════════════════════
   Test-215 L-1: Reduced-motion preference
   Honour user's OS-level "reduce motion" setting.
   ═══════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-wjjlrnhoy1],
    .adm-detail-card[b-wjjlrnhoy1],
    .adm-canvas[b-wjjlrnhoy1],
    .adm-canvas__el[b-wjjlrnhoy1],
    .adm-status-pill__dot--on[b-wjjlrnhoy1],
    .adm-status-pill__dot--warn[b-wjjlrnhoy1] {
        transition: none !important;
        animation: none !important;
    }

    .adm-canvas[b-wjjlrnhoy1] {
        transform-origin: center center;
        /* keep transform: scale(...) for zoom; only suppress the 0.3s ease */
    }
}

/* /Components/Pages/Admin/SiteSettings/SiteSocialMedia.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Site Social Media — Nordic Control Panel
   Follows AnalyticsDashboard design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-f7nt68a2x4] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══ Action Bar ═══ */
.adm-actionbar[b-f7nt68a2x4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-f7nt68a2x4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-f7nt68a2x4] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-f7nt68a2x4] .adm-breadcrumbs {
    padding: 0;
}

[b-f7nt68a2x4] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-f7nt68a2x4] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-f7nt68a2x4] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-f7nt68a2x4] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-f7nt68a2x4] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-f7nt68a2x4] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-f7nt68a2x4] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-f7nt68a2x4] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__dot--info[b-f7nt68a2x4] {
    background: #3b82f6;
    box-shadow: 0 0 6px rgba(59, 130, 246, 0.4);
}

/* ═══ Page Header ═══ */
.adm-page-header[b-f7nt68a2x4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-f7nt68a2x4] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-f7nt68a2x4] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-f7nt68a2x4] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-f7nt68a2x4] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-f7nt68a2x4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Header Buttons — WCAG 2.5.5 44px touch target at every viewport */
[b-f7nt68a2x4] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.85rem !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
    min-height: 44px !important;
}

[b-f7nt68a2x4] .adm-back-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-f7nt68a2x4] .adm-back-btn:focus-visible {
    outline: 2px solid #35a0ae !important;
    outline-offset: 2px !important;
}

[b-f7nt68a2x4] .adm-save-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    min-height: 44px !important;
    padding: 0 1.25rem !important;
}

[b-f7nt68a2x4] .adm-save-btn:focus-visible {
    outline: 2px solid #ffffff !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.4) !important;
}

[b-f7nt68a2x4] .adm-save-btn__spinner {
    width: 16px !important;
    height: 16px !important;
}

[b-f7nt68a2x4] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-f7nt68a2x4] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-f7nt68a2x4] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae !important;
    outline-offset: 2px !important;
}

/* ═══ Loading / Error States ═══ */
.adm-loading[b-f7nt68a2x4] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4rem 1.5rem;
    background: #ffffff;
}

/* Nordic-style error retry panel — Test-205 H-2 / Test-211 H-9 / Test-212 H-9 pattern */
.adm-error-panel[b-f7nt68a2x4] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    margin: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border: 1px solid #fecaca;
    border-left: 4px solid #ef4444;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}

.adm-error-panel__icon[b-f7nt68a2x4] {
    color: #ef4444;
    flex-shrink: 0;
}

.adm-error-panel__body[b-f7nt68a2x4] {
    flex: 1;
    min-width: 0;
}

.adm-error-panel__title[b-f7nt68a2x4] {
    margin: 0 0 0.25rem;
    font-size: 1rem;
    font-weight: 600;
    color: #0f172a;
    font-family: 'Montserrat', sans-serif;
}

.adm-error-panel__sub[b-f7nt68a2x4] {
    margin: 0;
    font-size: 0.85rem;
    color: #64748b;
    line-height: 1.4;
}

[b-f7nt68a2x4] .adm-error-panel__retry {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    min-height: 44px !important;
    flex-shrink: 0;
}

/* ═══ KPI Strip ═══ */
.adm-kpi-strip[b-f7nt68a2x4] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-f7nt68a2x4] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-f7nt68a2x4] {
    border-right: none;
}

.adm-kpi:hover[b-f7nt68a2x4] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-f7nt68a2x4] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-f7nt68a2x4] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.85;
}

/* Semantic KPI icon colours — replace inline Style="color:#..." */
[b-f7nt68a2x4] .adm-kpi__icon--social {
    color: #35a0ae !important; /* brand teal */
}

[b-f7nt68a2x4] .adm-kpi__icon--apps {
    color: #3b82f6 !important; /* blue */
}

[b-f7nt68a2x4] .adm-kpi__icon--configured {
    color: #22c55e !important; /* green */
}

/* B-1 brand-trap fix: amber on neutral metric → conditional
   - 0 missing  = clean state (green)  → reinforces "all set"
   - ≥1 missing = warning state (amber) → legit warning */
[b-f7nt68a2x4] .adm-kpi__icon--missing-clean {
    color: #22c55e !important; /* green when nothing missing */
}

[b-f7nt68a2x4] .adm-kpi__icon--missing-warn {
    color: #f59e0b !important; /* amber when ≥1 missing */
}

.adm-kpi__label[b-f7nt68a2x4] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-f7nt68a2x4] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.adm-kpi__unit[b-f7nt68a2x4] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #64748b;
    margin-left: 0.15rem;
}

/* ═══ Section Headers ═══ */
.adm-section-header[b-f7nt68a2x4] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1.25rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-f7nt68a2x4] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    /* ToC-style anchor support — see Test-210 L-5 */
    scroll-margin-top: 80px;
}

.adm-section-header__subtitle[b-f7nt68a2x4] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══ Detail Cards ═══ */
.adm-detail-grid[b-f7nt68a2x4] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-f7nt68a2x4] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-f7nt68a2x4] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-f7nt68a2x4] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
    background: #94a3b8; /* default slate fallback */
}

/* Semantic detail-card platform colours — replace inline style="background:#..."
   These are platform-recognised brand colours, kept for visual consistency. */
.adm-detail-card--twitter .adm-detail-card__bar[b-f7nt68a2x4] {
    background: #1da1f2;
}

.adm-detail-card--instagram .adm-detail-card__bar[b-f7nt68a2x4] {
    background: #e4405f;
}

.adm-detail-card--linkedin .adm-detail-card__bar[b-f7nt68a2x4] {
    background: #0a66c2;
}

.adm-detail-card--facebook .adm-detail-card__bar[b-f7nt68a2x4] {
    background: #1877f2;
}

.adm-detail-card__data[b-f7nt68a2x4] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
    padding-left: 0.5rem;
}

.adm-detail-card__number[b-f7nt68a2x4] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-f7nt68a2x4] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* Status color variants for detail cards */
.adm-status--active[b-f7nt68a2x4] {
    color: #15803d;
}

.adm-status--missing[b-f7nt68a2x4] {
    color: #b45309;
}

/* ═══ Form Cards ═══ */
.adm-form-card[b-f7nt68a2x4] {
    position: relative;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    margin: 0 1.5rem 1rem;
    overflow: hidden;
}

.adm-form-card[b-f7nt68a2x4]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-form-card--teal[b-f7nt68a2x4]::before {
    background: #35a0ae;
}

.adm-form-card--blue[b-f7nt68a2x4]::before {
    background: #3b82f6;
}

/* Form Grid */
.adm-form-grid[b-f7nt68a2x4] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 1rem;
    padding: 1.25rem;
}

.adm-form-grid__half[b-f7nt68a2x4] {
    grid-column: span 3;
}

.adm-form-grid__full[b-f7nt68a2x4] {
    grid-column: span 6;
}

/* MudTextField styling */
[b-f7nt68a2x4] .adm-form-card .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-f7nt68a2x4] .adm-form-card .mud-input {
    font-size: 0.9rem;
    color: #334155 !important;
}

[b-f7nt68a2x4] .adm-form-card .mud-input-label {
    color: #475569 !important;
    font-weight: 500;
}

[b-f7nt68a2x4] .adm-form-card .mud-input-helper-text {
    color: #64748b;
    font-size: 0.75rem;
}

[b-f7nt68a2x4] .adm-form-card .mud-input-outlined:hover .mud-input-outlined-border {
    border-color: #35a0ae;
}

[b-f7nt68a2x4] .adm-form-card .mud-input-outlined.mud-input-outlined-legal .mud-input-outlined-border {
    border-color: #35a0ae;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-f7nt68a2x4] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-f7nt68a2x4] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-f7nt68a2x4] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-detail-grid[b-f7nt68a2x4] {
        grid-template-columns: 1fr;
    }

    .adm-form-grid__half[b-f7nt68a2x4] {
        grid-column: span 6;
    }

    .adm-kpi-strip[b-f7nt68a2x4] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-f7nt68a2x4] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-f7nt68a2x4] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-error-panel[b-f7nt68a2x4] {
        flex-direction: column;
        align-items: flex-start;
    }

    [b-f7nt68a2x4] .adm-error-panel__retry {
        width: 100%;
        justify-content: center !important;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-f7nt68a2x4] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-f7nt68a2x4] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-f7nt68a2x4] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-f7nt68a2x4] {
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-f7nt68a2x4] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-form-card[b-f7nt68a2x4] {
        margin-left: 0.875rem;
        margin-right: 0.875rem;
    }

    .adm-form-grid[b-f7nt68a2x4] {
        padding: 1rem;
        gap: 0.75rem;
    }

    .adm-page-header__tools[b-f7nt68a2x4] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-f7nt68a2x4] .adm-back-btn,
    [b-f7nt68a2x4] .adm-save-btn {
        width: 100%;
        justify-content: center !important;
    }

    .adm-error-panel[b-f7nt68a2x4] {
        margin: 0.875rem;
        padding: 1rem;
    }
}

/* ═══════════════════════════════════════════════════════
   Reduced motion — Test-210 L-1 / Test-211 L-1 parity
   ═══════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-f7nt68a2x4],
    .adm-detail-card[b-f7nt68a2x4] {
        transition: none;
    }

    .adm-status-pill__dot[b-f7nt68a2x4],
    .adm-status-pill__dot--on[b-f7nt68a2x4],
    .adm-status-pill__dot--warn[b-f7nt68a2x4],
    .adm-status-pill__dot--info[b-f7nt68a2x4] {
        box-shadow: none;
    }
}
/* /Components/Pages/Admin/SiteSettings/SiteSocialPlatforms.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Site Social Platforms — Nordic Control Panel
   Follows AnalyticsDashboard / Site Social Media (Test-213) design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-tsv8t9jkj1] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══ Action Bar ═══ */
.adm-actionbar[b-tsv8t9jkj1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-tsv8t9jkj1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-tsv8t9jkj1] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-tsv8t9jkj1] .adm-breadcrumbs {
    padding: 0;
}

[b-tsv8t9jkj1] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-tsv8t9jkj1] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-tsv8t9jkj1] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-tsv8t9jkj1] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-tsv8t9jkj1] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-tsv8t9jkj1] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-tsv8t9jkj1] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══ Page Header ═══ */
.adm-page-header[b-tsv8t9jkj1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-tsv8t9jkj1] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-tsv8t9jkj1] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-tsv8t9jkj1] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-tsv8t9jkj1] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-tsv8t9jkj1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Header Buttons — 44px WCAG 2.5.5 floor at every viewport (Test-213 C-1/C-2 parity) */
[b-tsv8t9jkj1] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.85rem !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
    min-height: 44px !important;
    padding: 0 1.25rem !important;
}

[b-tsv8t9jkj1] .adm-back-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-tsv8t9jkj1] .adm-back-btn:focus-visible {
    outline: 2px solid #35a0ae !important;
    outline-offset: 2px !important;
}

[b-tsv8t9jkj1] .adm-save-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    min-height: 44px !important;
    padding: 0 1.25rem !important;
}

[b-tsv8t9jkj1] .adm-save-btn:focus-visible {
    outline: 2px solid #ffffff !important;
    outline-offset: 0 !important;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.5) !important;
}

[b-tsv8t9jkj1] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px;
    min-height: 44px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-tsv8t9jkj1] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-tsv8t9jkj1] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae !important;
    outline-offset: 2px !important;
}

/* ═══ Loading / Error States ═══ */
.adm-loading[b-tsv8t9jkj1] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4rem 1.5rem;
    background: #ffffff;
}

.adm-error-panel[b-tsv8t9jkj1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.625rem;
    padding: 3rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    text-align: center;
}

[b-tsv8t9jkj1] .adm-error-panel__icon {
    color: #94a3b8;
    margin-bottom: 0.5rem;
}

.adm-error-panel__title[b-tsv8t9jkj1] {
    font-size: 1rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0;
}

.adm-error-panel__sub[b-tsv8t9jkj1] {
    font-size: 0.85rem;
    color: #64748b;
    margin: 0 0 0.75rem;
    max-width: 480px;
}

/* ═══ KPI Strip ═══ */
.adm-kpi-strip[b-tsv8t9jkj1] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-tsv8t9jkj1] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-tsv8t9jkj1] {
    border-right: none;
}

.adm-kpi:hover[b-tsv8t9jkj1] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-tsv8t9jkj1] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-tsv8t9jkj1] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.85;
}

/* Semantic KPI icon variants — H-4: replaces inline Style="color:#..." (Test-213 H-4 parity) */
[b-tsv8t9jkj1] .adm-kpi__icon--apps {
    color: #35a0ae;
}

[b-tsv8t9jkj1] .adm-kpi__icon--active {
    color: #22c55e;
}

/* B-1 conditional Inactive variant: green clean when count=0, red warn when >=1 */
[b-tsv8t9jkj1] .adm-kpi__icon--inactive-clean {
    color: #22c55e;
}

[b-tsv8t9jkj1] .adm-kpi__icon--inactive-warn {
    color: #ef4444;
}

[b-tsv8t9jkj1] .adm-kpi__icon--image {
    color: #3b82f6;
}

.adm-kpi__label[b-tsv8t9jkj1] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-tsv8t9jkj1] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══ Section Headers ═══ */
.adm-section-header[b-tsv8t9jkj1] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1.25rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-tsv8t9jkj1] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
    /* L-3: ToC anchor offset for sticky header */
    scroll-margin-top: 80px;
}

.adm-section-header__subtitle[b-tsv8t9jkj1] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══ Detail Cards ═══ */
.adm-detail-grid[b-tsv8t9jkj1] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-tsv8t9jkj1] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-tsv8t9jkj1] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-tsv8t9jkj1] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
    background: #94a3b8; /* fallback */
}

/* Semantic detail-card variants — H-5: replaces inline style="background:#..." (Test-213 H-5 parity) */
.adm-detail-card--text .adm-detail-card__bar[b-tsv8t9jkj1] {
    background: #35a0ae;
}

.adm-detail-card--share .adm-detail-card__bar[b-tsv8t9jkj1] {
    background: #3b82f6;
}

.adm-detail-card--width .adm-detail-card__bar[b-tsv8t9jkj1] {
    background: #8b5cf6;
}

.adm-detail-card--height .adm-detail-card__bar[b-tsv8t9jkj1] {
    background: #f59e0b;
}

.adm-detail-card__data[b-tsv8t9jkj1] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
    padding-left: 0.5rem;
}

.adm-detail-card__number[b-tsv8t9jkj1] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-tsv8t9jkj1] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

.adm-detail-card__unit[b-tsv8t9jkj1] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #64748b;
    margin-left: 0.1rem;
}

/* ═══ Table ═══ */
.adm-table-wrapper[b-tsv8t9jkj1] {
    padding: 0 1.5rem 1.5rem;
}

[b-tsv8t9jkj1] .adm-table {
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    overflow: hidden;
}

[b-tsv8t9jkj1] .adm-table .mud-table-toolbar {
    padding: 0.75rem 1rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
}

[b-tsv8t9jkj1] .adm-table .mud-table-head .mud-table-cell {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 600;
    background: #f8fafc;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-tsv8t9jkj1] .adm-table .mud-table-body .mud-table-cell {
    font-size: 0.85rem;
    color: #334155;
    padding: 0.625rem 1rem;
    border-bottom: 1px solid #f1f5f9;
}

[b-tsv8t9jkj1] .adm-table .mud-table-body .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-tsv8t9jkj1] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
    background: #f8fafc;
    font-size: 0.8rem;
    color: #64748b;
}

.adm-cell-primary[b-tsv8t9jkj1] {
    font-weight: 600;
    color: #1e293b;
}

.adm-cell-mono[b-tsv8t9jkj1] {
    font-family: 'Courier New', monospace;
    font-size: 0.8rem;
    color: #475569;
    background: #f1f5f9;
    padding: 0.125rem 0.375rem;
    border-radius: 4px;
}

.adm-cell-muted[b-tsv8t9jkj1] {
    color: #94a3b8;
}

/* Row icon fallback — replaces inline Style="color: #94a3b8;" */
[b-tsv8t9jkj1] .adm-row-icon-fallback {
    color: #94a3b8 !important;
    font-size: 1.5rem !important;
}

/* Chips */
[b-tsv8t9jkj1] .adm-chip--success {
    background: rgba(34, 197, 94, 0.1) !important;
    color: #15803d !important;
    font-weight: 500;
    font-size: 0.75rem !important;
}

[b-tsv8t9jkj1] .adm-chip--error {
    background: rgba(239, 68, 68, 0.1) !important;
    color: #b91c1c !important;
    font-weight: 500;
    font-size: 0.75rem !important;
}

[b-tsv8t9jkj1] .adm-chip--info {
    background: rgba(59, 130, 246, 0.1) !important;
    color: #1d4ed8 !important;
    font-weight: 500;
    font-size: 0.75rem !important;
}

[b-tsv8t9jkj1] .adm-chip--secondary {
    background: rgba(100, 116, 139, 0.1) !important;
    color: #475569 !important;
    font-weight: 500;
    font-size: 0.75rem !important;
}

/* Search Field */
[b-tsv8t9jkj1] .adm-search-field {
    max-width: 280px;
}

[b-tsv8t9jkj1] .adm-search-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-tsv8t9jkj1] .adm-search-field .mud-input {
    font-size: 0.85rem;
    color: #334155 !important;
}

[b-tsv8t9jkj1] .adm-search-field .mud-input-adornment-start .mud-icon-root {
    color: #64748b;
}

/* ═══ Empty State ═══ */
.adm-empty-state[b-tsv8t9jkj1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 1.5rem;
    background: #ffffff;
    border: 2px dashed #e2e8f0;
    border-radius: 10px;
}

.adm-empty-state--inline[b-tsv8t9jkj1] {
    border: none;
    padding: 2rem 1rem;
}

[b-tsv8t9jkj1] .adm-empty-state__icon {
    color: #64748b !important;
}

.adm-empty-state__text[b-tsv8t9jkj1] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #475569;
    margin: 0;
}

.adm-empty-state__sub[b-tsv8t9jkj1] {
    font-size: 0.82rem;
    color: #64748b;
    margin: 0;
}

/* ═══ Dialog Styling ═══ */
.adm-dialog-title[b-tsv8t9jkj1] {
    display: flex;
    align-items: center;
    font-size: 1.1rem;
    font-weight: 600;
    color: #0f172a;
}

.adm-dialog-section[b-tsv8t9jkj1] {
    margin-bottom: 1.25rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #f1f5f9;
}

.adm-dialog-section:last-of-type[b-tsv8t9jkj1] {
    border-bottom: none;
    margin-bottom: 0.5rem;
}

.adm-dialog-section__title[b-tsv8t9jkj1] {
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    margin: 0 0 0.75rem;
    font-family: 'Montserrat', sans-serif;
}

/* Dialog Preview */
.adm-dialog-preview[b-tsv8t9jkj1] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    margin-top: 0.5rem;
}

.adm-dialog-preview__label[b-tsv8t9jkj1] {
    display: block;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    margin-bottom: 0.5rem;
}

.adm-dialog-preview__content[b-tsv8t9jkj1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

[b-tsv8t9jkj1] .adm-dialog-preview__icon {
    font-size: 2rem !important;
}

.adm-dialog-preview__name[b-tsv8t9jkj1] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-tsv8t9jkj1] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-tsv8t9jkj1] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-tsv8t9jkj1] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    [b-tsv8t9jkj1] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }

    .adm-detail-grid[b-tsv8t9jkj1] {
        grid-template-columns: 1fr;
    }

    .adm-kpi-strip[b-tsv8t9jkj1] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-tsv8t9jkj1] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-tsv8t9jkj1] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-table-wrapper[b-tsv8t9jkj1] {
        overflow-x: auto;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-tsv8t9jkj1] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-tsv8t9jkj1] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-tsv8t9jkj1] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-tsv8t9jkj1] {
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-tsv8t9jkj1] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-table-wrapper[b-tsv8t9jkj1] {
        padding: 0 0.875rem 1rem;
    }

    .adm-page-header__tools[b-tsv8t9jkj1] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-tsv8t9jkj1] .adm-back-btn,
    [b-tsv8t9jkj1] .adm-save-btn {
        width: 100%;
        justify-content: center !important;
        min-height: 44px;
    }
}

/* ═══════════════════════════════════════════════════════
   REDUCED MOTION (L-1)
   ═══════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-tsv8t9jkj1],
    .adm-detail-card[b-tsv8t9jkj1] {
        transition: none !important;
    }

    .adm-status-pill__dot--on[b-tsv8t9jkj1] {
        box-shadow: none !important;
    }
}
/* /Components/Pages/Admin/SiteSettings/SiteVerification.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Verification Settings — Nordic Control Panel
   Scoped styles for the admin verification settings page.
   Aligned with May 2026 admin sweep (Tests 208-216).
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-m6k70bieb7] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══ Action Bar ═══ */
.adm-actionbar[b-m6k70bieb7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-m6k70bieb7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-m6k70bieb7] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

[b-m6k70bieb7] .adm-breadcrumbs {
    padding: 0;
}

[b-m6k70bieb7] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-m6k70bieb7] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-m6k70bieb7] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-m6k70bieb7] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* ═══ Status Pill ═══ */
.adm-status-pill[b-m6k70bieb7] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-m6k70bieb7] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-m6k70bieb7] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-m6k70bieb7] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══ Page Header ═══ */
.adm-page-header[b-m6k70bieb7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-m6k70bieb7] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-m6k70bieb7] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-m6k70bieb7] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-m6k70bieb7] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-m6k70bieb7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* ═══ Header Buttons — universal 44px floor for WCAG 2.5.5 ═══ */
[b-m6k70bieb7] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.85rem !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
    min-height: 44px !important;
}

[b-m6k70bieb7] .adm-back-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-m6k70bieb7] .adm-back-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

[b-m6k70bieb7] .adm-save-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    min-height: 44px !important;
}

[b-m6k70bieb7] .adm-save-btn:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.5);
}

.adm-save-btn__spinner[b-m6k70bieb7] {
    width: 16px;
    height: 16px;
}

[b-m6k70bieb7] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-m6k70bieb7] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-m6k70bieb7] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
}

/* ═══ Loading & Error States ═══ */
.adm-loading[b-m6k70bieb7] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4rem 1.5rem;
    background: #ffffff;
}

.adm-error-panel[b-m6k70bieb7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1.5rem;
    margin: 1.5rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 12px;
    text-align: center;
}

[b-m6k70bieb7] .adm-error-panel__icon {
    color: #94a3b8 !important;
}

.adm-error-panel__title[b-m6k70bieb7] {
    font-size: 1rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0.25rem 0 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-error-panel__body[b-m6k70bieb7] {
    font-size: 0.85rem;
    color: #64748b;
    margin: 0 0 0.5rem;
    line-height: 1.5;
    max-width: 380px;
}

[b-m6k70bieb7] .adm-error-panel__btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px !important;
}

/* ═══ KPI Strip ═══ */
.adm-kpi-strip[b-m6k70bieb7] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-m6k70bieb7] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-m6k70bieb7] {
    border-right: none;
}

.adm-kpi:hover[b-m6k70bieb7] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-m6k70bieb7] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-m6k70bieb7] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.85;
}

/* KPI icon colour variants — semantic, no inline styles
   Active Flow:  teal      (brand primary, identity gate)
   Doc Capture:  blue      (informational integration)
   Max Retries:  was amber (warning) → sky blue (neutral threshold) — B-1 brand-trap fix
   vForm:        violet    (informational secondary integration)
   Azure Vision: was Rently red #EF412c → indigo (neutral integration) — B-2 brand-trap fix */
[b-m6k70bieb7] .adm-kpi__icon--flow {
    color: #35a0ae !important;
}

[b-m6k70bieb7] .adm-kpi__icon--capture {
    color: #3b82f6 !important;
}

[b-m6k70bieb7] .adm-kpi__icon--retries {
    color: #0ea5e9 !important;
}

[b-m6k70bieb7] .adm-kpi__icon--vform {
    color: #8b5cf6 !important;
}

[b-m6k70bieb7] .adm-kpi__icon--vision {
    color: #6366f1 !important;
}

.adm-kpi__label[b-m6k70bieb7] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-m6k70bieb7] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.adm-kpi__value--on[b-m6k70bieb7] {
    color: #15803d;
}

.adm-kpi__value--off[b-m6k70bieb7] {
    color: #b45309;
}

/* ═══ Section Header ═══ */
.adm-section-header[b-m6k70bieb7] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-m6k70bieb7] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-m6k70bieb7] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══ Detail Cards ═══ */
.adm-detail-grid[b-m6k70bieb7] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-m6k70bieb7] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-m6k70bieb7] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-m6k70bieb7] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
    background: #35a0ae; /* default fallback */
}

/* Detail card colour variants — semantic, no inline styles
   Identity Provider: teal   (primary verification gate)
   Liveness Provider: blue   (secondary verification step)
   OCR Confidence:    violet (Azure Vision integration)
   Review Threshold:  was amber #f59e0b (warning on positive feature) → sky blue — B-3 brand-trap fix */
.adm-detail-card--identity .adm-detail-card__bar[b-m6k70bieb7] {
    background: #35a0ae;
}

[b-m6k70bieb7] .adm-detail-card--identity .adm-detail-card__icon {
    color: #35a0ae !important;
}

.adm-detail-card--liveness .adm-detail-card__bar[b-m6k70bieb7] {
    background: #3b82f6;
}

[b-m6k70bieb7] .adm-detail-card--liveness .adm-detail-card__icon {
    color: #3b82f6 !important;
}

.adm-detail-card--ocr .adm-detail-card__bar[b-m6k70bieb7] {
    background: #8b5cf6;
}

[b-m6k70bieb7] .adm-detail-card--ocr .adm-detail-card__icon {
    color: #8b5cf6 !important;
}

.adm-detail-card--review .adm-detail-card__bar[b-m6k70bieb7] {
    background: #0ea5e9;
}

[b-m6k70bieb7] .adm-detail-card--review .adm-detail-card__icon {
    color: #0ea5e9 !important;
}

.adm-detail-card__data[b-m6k70bieb7] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-m6k70bieb7] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-m6k70bieb7] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══ Form Cards ═══ */
.adm-form-card[b-m6k70bieb7] {
    position: relative;
    margin: 0.75rem 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    border-radius: 10px;
    overflow: hidden;
}

.adm-form-card__bar[b-m6k70bieb7] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
    background: #35a0ae; /* default fallback */
}

/* Form card colour variants — semantic, no inline styles */
.adm-form-card--teal .adm-form-card__bar[b-m6k70bieb7] {
    background: #35a0ae;
}

[b-m6k70bieb7] .adm-form-card--teal .adm-form-card__icon {
    color: #35a0ae !important;
}

.adm-form-card--blue .adm-form-card__bar[b-m6k70bieb7] {
    background: #3b82f6;
}

[b-m6k70bieb7] .adm-form-card--blue .adm-form-card__icon {
    color: #3b82f6 !important;
}

.adm-form-card--purple .adm-form-card__bar[b-m6k70bieb7] {
    background: #8b5cf6;
}

[b-m6k70bieb7] .adm-form-card--purple .adm-form-card__icon {
    color: #8b5cf6 !important;
}

/* OCR Review section: was amber #f59e0b (warning hue on positive feature) → sky blue */
.adm-form-card--sky .adm-form-card__bar[b-m6k70bieb7] {
    background: #0ea5e9;
}

[b-m6k70bieb7] .adm-form-card--sky .adm-form-card__icon {
    color: #0ea5e9 !important;
}

.adm-form-card__header[b-m6k70bieb7] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-bottom: 0.25rem;
}

.adm-form-card__title[b-m6k70bieb7] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-form-card__desc[b-m6k70bieb7] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.5;
    margin: 0 0 1rem;
}

/* ═══ Form Grid ═══ */
.adm-form-grid[b-m6k70bieb7] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.adm-form-field[b-m6k70bieb7] {
    min-width: 0;
}

.adm-form-field--full[b-m6k70bieb7] {
    grid-column: 1 / -1;
}

/* ═══ Toggle Rows ═══ */
.adm-form-toggles[b-m6k70bieb7] {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 1rem;
}

.adm-toggle-row[b-m6k70bieb7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f3f4f6;
}

.adm-toggle-row:last-child[b-m6k70bieb7] {
    border-bottom: none;
}

.adm-toggle-row__text[b-m6k70bieb7] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.adm-toggle-row__label[b-m6k70bieb7] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #1e293b;
}

.adm-toggle-row__hint[b-m6k70bieb7] {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.4;
}

/* ═══ Threshold Visualisation ═══ */
.adm-threshold-visual[b-m6k70bieb7] {
    margin-top: 1rem;
    padding: 1rem;
    background: #f8f9fb;
    border-radius: 8px;
    border: 1px solid #e8ecf1;
}

.adm-threshold-visual__header[b-m6k70bieb7] {
    margin-bottom: 0.5rem;
}

.adm-threshold-visual__label[b-m6k70bieb7] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
}

.adm-threshold-visual__bar[b-m6k70bieb7] {
    display: flex;
    height: 32px;
    border-radius: 6px;
    overflow: hidden;
    gap: 1px;
}

.adm-threshold-visual__zone[b-m6k70bieb7] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    font-weight: 600;
    color: #ffffff;
    min-width: 2rem;
    transition: width 0.3s ease;
}

.adm-threshold-visual__zone--reject[b-m6k70bieb7] {
    background: #dc2626;
}

.adm-threshold-visual__zone--review[b-m6k70bieb7] {
    background: #b45309;
}

.adm-threshold-visual__zone--pass[b-m6k70bieb7] {
    background: #15803d;
}

.adm-threshold-visual__markers[b-m6k70bieb7] {
    display: flex;
    justify-content: space-between;
    margin-top: 0.375rem;
    font-size: 0.7rem;
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

/* ═══ Reduced motion ═══ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-m6k70bieb7],
    .adm-detail-card[b-m6k70bieb7] {
        transition: none !important;
    }

    .adm-threshold-visual__zone[b-m6k70bieb7] {
        transition: none !important;
    }

    .adm-status-pill__dot--on[b-m6k70bieb7],
    .adm-status-pill__dot--warn[b-m6k70bieb7] {
        box-shadow: none !important;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-m6k70bieb7] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-m6k70bieb7] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-m6k70bieb7] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-m6k70bieb7] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-m6k70bieb7] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-m6k70bieb7] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
    }

    .adm-kpi-strip[b-m6k70bieb7] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-form-grid[b-m6k70bieb7] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-m6k70bieb7] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-m6k70bieb7] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-m6k70bieb7] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-m6k70bieb7] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-m6k70bieb7] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-m6k70bieb7] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-m6k70bieb7] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-m6k70bieb7] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-m6k70bieb7] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-form-card[b-m6k70bieb7] {
        margin: 0.5rem 0.875rem;
        padding: 1rem;
    }

    .adm-kpi__value[b-m6k70bieb7] {
        font-size: 1.25rem;
    }

    .adm-toggle-row[b-m6k70bieb7] {
        flex-wrap: wrap;
    }

    .adm-page-header__tools[b-m6k70bieb7] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-m6k70bieb7] .adm-back-btn,
    [b-m6k70bieb7] .adm-save-btn {
        width: 100%;
        justify-content: center !important;
    }

    .adm-status-pill[b-m6k70bieb7] {
        font-size: 0.7rem;
    }
}
/* /Components/Pages/Admin/Store/Stores.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Store Management — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard + Rentals standard (Test-218→222).
   ═══════════════════════════════════════════════════════ */

/* ─── Brand Tokens ─── */
.adm-shell[b-3mnraoq4bt] {
    --adm-primary: #35a0ae;
    --adm-success: #16a34a;
    --adm-info: #0891b2;
    --adm-blue: #3b82f6;
    --adm-purple: #8b5cf6;
    --adm-warn: #f59e0b;
    --adm-text: #1e293b;
    --adm-muted: #475569;
    --adm-muted-2: #64748b;
    --adm-border: #e8ecf1;
    --adm-surface: #ffffff;
    --adm-surface-2: #f8fafc;
    --adm-canvas: #f8f9fb;
}

/* ─── Shell ─── */
.adm-shell[b-3mnraoq4bt] {
    padding: 0;
    min-height: 100%;
    background: var(--adm-canvas);
}

/* ─── Progress bar ─── */
[b-3mnraoq4bt] .adm-progress {
    border-radius: 0 !important;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-3mnraoq4bt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-3mnraoq4bt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-3mnraoq4bt] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-3mnraoq4bt] .adm-breadcrumbs {
    padding: 0;
}

[b-3mnraoq4bt] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-3mnraoq4bt] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-3mnraoq4bt] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-3mnraoq4bt] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-3mnraoq4bt] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-3mnraoq4bt] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-3mnraoq4bt] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-3mnraoq4bt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-3mnraoq4bt] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-3mnraoq4bt] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-3mnraoq4bt] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-3mnraoq4bt] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-3mnraoq4bt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-3mnraoq4bt] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-3mnraoq4bt] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Bulk Approve Button */
[b-3mnraoq4bt] .adm-bulk-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-size: 0.8rem !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    padding: 0.375rem 1rem !important;
    box-shadow: none !important;
}

[b-3mnraoq4bt] .adm-bulk-btn:hover {
    box-shadow: 0 2px 6px rgba(22, 163, 74, 0.2) !important;
}

/* ═══════════════════════════════════════════════════════
   ALERT BANNER
   ═══════════════════════════════════════════════════════ */
.adm-alert-banner[b-3mnraoq4bt] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem 1.5rem;
    font-size: 0.82rem;
    font-weight: 500;
}

.adm-alert-banner--warn[b-3mnraoq4bt] {
    background: #fefce8;
    border-bottom: 1px solid #fde68a;
    color: #92400e;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-3mnraoq4bt] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-3mnraoq4bt] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-3mnraoq4bt] {
    border-right: none;
}

.adm-kpi:hover[b-3mnraoq4bt] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-3mnraoq4bt] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-3mnraoq4bt] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.85;
}

[b-3mnraoq4bt] .adm-kpi__icon--teal { color: var(--adm-primary); }
[b-3mnraoq4bt] .adm-kpi__icon--success { color: var(--adm-success); }
[b-3mnraoq4bt] .adm-kpi__icon--info { color: var(--adm-info); }
[b-3mnraoq4bt] .adm-kpi__icon--blue { color: var(--adm-blue); }
[b-3mnraoq4bt] .adm-kpi__icon--purple { color: var(--adm-purple); }
[b-3mnraoq4bt] .adm-kpi__icon--warn { color: var(--adm-warn); }

[b-3mnraoq4bt] .adm-trust-chip__icon--success { color: var(--adm-success); }
[b-3mnraoq4bt] .adm-trust-chip__icon--teal { color: var(--adm-primary); }
[b-3mnraoq4bt] .adm-trust-chip__icon--info { color: var(--adm-info); }
[b-3mnraoq4bt] .adm-trust-chip__icon--warn { color: var(--adm-warn); }

[b-3mnraoq4bt] .adm-trust-filter__icon { color: var(--adm-primary); }
[b-3mnraoq4bt] .adm-baseline-info-icon {
    color: var(--adm-muted-2) !important;
    cursor: help;
}

.adm-kpi__label[b-3mnraoq4bt] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-3mnraoq4bt] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   TRUST SUMMARY — Compact chip row below KPI
   ═══════════════════════════════════════════════════════ */
.adm-trust-summary[b-3mnraoq4bt] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-trust-chip[b-3mnraoq4bt] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.625rem;
    border-radius: 6px;
    background: #f8fafc;
    border: 1px solid #e8ecf1;
    font-size: 0.75rem;
    font-weight: 500;
    color: #475569;
    white-space: nowrap;
}

/* ═══════════════════════════════════════════════════════
   TRUST FILTER — Compact segment selector
   ═══════════════════════════════════════════════════════ */
.adm-trust-filter[b-3mnraoq4bt] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0.75rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-trust-filter__header[b-3mnraoq4bt] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.adm-trust-filter__label[b-3mnraoq4bt] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #1e293b;
}

[b-3mnraoq4bt] .adm-trust-filter__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

[b-3mnraoq4bt] .adm-trust-filter__chips .mud-chip {
    font-size: 0.72rem !important;
    height: 28px !important;
    border-radius: 20px !important;
}

.adm-trust-filter__desc[b-3mnraoq4bt] {
    font-size: 0.72rem;
    color: #64748b;
    font-style: italic;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-3mnraoq4bt] .adm-tabs {
    background: transparent;
}

[b-3mnraoq4bt] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-3mnraoq4bt] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-3mnraoq4bt] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-3mnraoq4bt] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-3mnraoq4bt] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-3mnraoq4bt] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-3mnraoq4bt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-3mnraoq4bt] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-3mnraoq4bt] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-3mnraoq4bt] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-3mnraoq4bt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-3mnraoq4bt] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-3mnraoq4bt] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-3mnraoq4bt] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

[b-3mnraoq4bt] .adm-filter-field .mud-input-adorment-start {
    color: #94a3b8;
}

[b-3mnraoq4bt] .adm-filter-field input::placeholder {
    color: #94a3b8 !important;
    font-size: 0.82rem;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
[b-3mnraoq4bt] .adm-table {
    border-radius: 0 !important;
    border: none !important;
    overflow: hidden;
    box-shadow: none !important;
    background: #ffffff;
}

[b-3mnraoq4bt] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-3mnraoq4bt] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-3mnraoq4bt] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
    vertical-align: top;
}

[b-3mnraoq4bt] .adm-table .mud-table-body tr {
    transition: background 0.12s ease;
}

[b-3mnraoq4bt] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-3mnraoq4bt] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-3mnraoq4bt] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-3mnraoq4bt] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

/* ═══════════════════════════════════════════════════════
   TABLE CELL STYLES
   ═══════════════════════════════════════════════════════ */

/* Store cell */
.adm-store-cell[b-3mnraoq4bt] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.adm-store-name[b-3mnraoq4bt] {
    font-weight: 600;
    color: #1e293b;
    font-size: 0.84rem;
}

.adm-store-address[b-3mnraoq4bt] {
    font-size: 0.72rem;
    color: #64748b;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Owner cell */
.adm-owner-cell[b-3mnraoq4bt] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-owner-name[b-3mnraoq4bt] {
    font-weight: 500;
    color: #1e293b;
    font-size: 0.84rem;
}

.adm-owner-email[b-3mnraoq4bt] {
    font-size: 0.72rem;
    color: #64748b;
}

/* Contact cell */
.adm-contact-cell[b-3mnraoq4bt] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    font-size: 0.78rem;
    color: #334155;
}

.adm-contact-phone[b-3mnraoq4bt] {
    color: #64748b;
    font-size: 0.72rem;
}

/* Trust cell */
.adm-trust-cell[b-3mnraoq4bt] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.adm-baseline-row[b-3mnraoq4bt] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.adm-baseline-optional[b-3mnraoq4bt] {
    font-size: 0.7rem;
    color: #94a3b8;
    font-weight: 400;
}

.adm-trust-score[b-3mnraoq4bt] {
    font-size: 0.7rem;
    color: #64748b;
    font-weight: 500;
}

/* Discount cell */
.adm-discount-cell[b-3mnraoq4bt] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.adm-discount-row[b-3mnraoq4bt] {
    display: flex;
    gap: 0.25rem;
    flex-wrap: wrap;
}

.adm-discount-tag[b-3mnraoq4bt] {
    display: inline-block;
    padding: 0.125rem 0.4rem;
    border-radius: 4px;
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.adm-discount-tag--customer[b-3mnraoq4bt] {
    background: rgba(53, 160, 174, 0.08);
    color: #0e7490;
}

.adm-discount-tag--store[b-3mnraoq4bt] {
    background: rgba(71, 85, 105, 0.08);
    color: #334155;
}

.adm-discount-warn[b-3mnraoq4bt] {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--adm-info);
}

.adm-policy-tag[b-3mnraoq4bt] {
    display: inline-block;
    padding: 0.125rem 0.4rem;
    border-radius: 4px;
    background: rgba(59, 130, 246, 0.08);
    color: #1d4ed8;
    font-size: 0.68rem;
    font-weight: 500;
}

/* Chip styling */
[b-3mnraoq4bt] .adm-chip {
    font-size: 0.7rem !important;
    height: 22px !important;
    font-weight: 600 !important;
}

/* Action row */
.adm-action-row[b-3mnraoq4bt] {
    display: flex;
    align-items: center;
    gap: 0.125rem;
    justify-content: center;
}

/* Header / row alignment helpers */
[b-3mnraoq4bt] .adm-th--approval {
    width: 100px;
    text-align: center;
}

[b-3mnraoq4bt] .adm-th--actions {
    width: 130px;
    text-align: center;
}

[b-3mnraoq4bt] .adm-td--center {
    text-align: center;
}

/* Empty state — dashed-border card pattern (Test-218→222) */
.adm-empty-state[b-3mnraoq4bt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 2.5rem 1.5rem;
    margin: 1rem;
    border: 1.5px dashed #cbd5e1;
    border-radius: 12px;
    background: var(--adm-surface-2);
    color: var(--adm-muted-2);
    font-size: 0.85rem;
    text-align: center;
}

[b-3mnraoq4bt] .adm-empty-state__icon {
    font-size: 4rem !important;
    color: var(--adm-muted) !important;
    opacity: 0.7;
    margin-bottom: 0.5rem;
}

.adm-empty-state__title[b-3mnraoq4bt] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--adm-text);
}

.adm-empty-state__desc[b-3mnraoq4bt] {
    font-size: 0.82rem;
    color: var(--adm-muted-2);
    max-width: 320px;
}

[b-3mnraoq4bt] .adm-empty-state__cta {
    margin-top: 0.625rem;
    border-radius: 8px !important;
    text-transform: none !important;
    min-height: 36px;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 1280px
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-3mnraoq4bt] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-3mnraoq4bt] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-3mnraoq4bt] {
        border-top: 1px solid #f1f5f9;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 960px (touch viewport — 44px targets)
   ═══════════════════════════════════════════════════════ */
@media (max-width: 960px) {
    .adm-page-header[b-3mnraoq4bt] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-3mnraoq4bt] {
        margin-left: 0;
        width: 100%;
        flex-wrap: wrap;
        gap: 0.625rem;
    }

    .adm-kpi-strip[b-3mnraoq4bt] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-trust-summary[b-3mnraoq4bt] {
        gap: 0.5rem;
    }

    [b-3mnraoq4bt] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    [b-3mnraoq4bt] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    /* 44px touch targets for tap-affordance on tablet/mobile */
    [b-3mnraoq4bt] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
        padding: 8px !important;
    }

    [b-3mnraoq4bt] .adm-bulk-btn {
        min-height: 44px !important;
        padding: 0.5rem 1rem !important;
        font-size: 0.85rem !important;
    }

    [b-3mnraoq4bt] .adm-action-row .mud-icon-button {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    [b-3mnraoq4bt] .adm-approval-switch .mud-switch-track,
    [b-3mnraoq4bt] .adm-approval-switch .mud-switch-thumb-container {
        min-height: 44px;
        display: flex;
        align-items: center;
    }

    .adm-action-row[b-3mnraoq4bt] {
        gap: 0.25rem;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 600px
   ═══════════════════════════════════════════════════════ */
@media (max-width: 600px) {
    .adm-actionbar[b-3mnraoq4bt] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-3mnraoq4bt] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-3mnraoq4bt] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-3mnraoq4bt] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-3mnraoq4bt] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-3mnraoq4bt] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-3mnraoq4bt] {
        grid-column: 1 / -1;
    }

    .adm-trust-summary[b-3mnraoq4bt] {
        padding: 0.5rem 0.875rem;
        gap: 0.375rem;
    }

    .adm-trust-chip[b-3mnraoq4bt] {
        font-size: 0.68rem;
    }

    .adm-trust-filter[b-3mnraoq4bt] {
        padding: 0.625rem 0.875rem;
    }

    .adm-alert-banner[b-3mnraoq4bt] {
        padding: 0.5rem 0.875rem;
        font-size: 0.75rem;
    }

    .adm-tab-toolbar[b-3mnraoq4bt] {
        padding: 0.75rem 0.875rem;
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-3mnraoq4bt] {
        width: 100%;
        margin-left: 0;
    }

    [b-3mnraoq4bt] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    [b-3mnraoq4bt] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.5rem;
    }

    [b-3mnraoq4bt] .adm-tabs .mud-tab {
        padding: 0.75rem 0.75rem;
        font-size: 0.8rem;
    }

    [b-3mnraoq4bt] .adm-bulk-btn {
        width: 100%;
        justify-content: center;
    }
}

/* ═══════════════════════════════════════════════════════
   ACCESSIBILITY — Reduced Motion
   ═══════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-3mnraoq4bt],
    [b-3mnraoq4bt] .adm-tabs .mud-tab,
    [b-3mnraoq4bt] .adm-table .mud-table-body tr {
        transition: none !important;
    }
}
/* /Components/Pages/Admin/Tags/TagEditorDialog.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Tag Editor Dialog — Nordic Control Panel
   Scoped to TagEditorDialog component (Test-219, supersedes Test-088).
   ═══════════════════════════════════════════════════════ */

.adm-dialog-title[b-7vfzav4rec] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.adm-dialog-section[b-7vfzav4rec] {
    margin-bottom: 1.25rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #f1f5f9;
}

.adm-dialog-section:last-child[b-7vfzav4rec],
.adm-dialog-section--last[b-7vfzav4rec] {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.adm-dialog-section__title[b-7vfzav4rec] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 0.75rem;
}

/* Toggle grid */
.adm-toggle-grid[b-7vfzav4rec] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.adm-toggle-row[b-7vfzav4rec] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 0;
    border-bottom: 1px solid #f8f9fb;
}

.adm-toggle-row:last-child[b-7vfzav4rec] {
    border-bottom: none;
}

.adm-toggle-row__info[b-7vfzav4rec] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.adm-toggle-row__label[b-7vfzav4rec] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #1e293b;
}

.adm-toggle-row__hint[b-7vfzav4rec] {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.3;
}

/* Dialog buttons — WCAG 2.5.5 (44px min touch target) + 8px brand radius */
[b-7vfzav4rec] .adm-dialog-cancel-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    min-height: 44px !important;
    padding: 0 16px !important;
}

[b-7vfzav4rec] .adm-dialog-cancel-btn:focus-visible {
    outline: 2px solid #94a3b8;
    outline-offset: 2px;
}

[b-7vfzav4rec] .adm-dialog-save-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px !important;
    padding: 0 16px !important;
    box-shadow: none !important;
}

[b-7vfzav4rec] .adm-dialog-save-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.18);
}

[b-7vfzav4rec] .adm-dialog-save-btn__spinner {
    color: #ffffff;
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
    [b-7vfzav4rec] .adm-dialog-save-btn,
    [b-7vfzav4rec] .adm-dialog-cancel-btn {
        transition: none;
    }
}
/* /Components/Pages/Admin/Tags/Tags.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Tags — "Nordic Control Panel" Design System
   Test-219 (2026-05-07) supersedes Test-088.
   Matches Categories (Test-218) + Verification Settings (Test-217) standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-i6epuhgro1] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-i6epuhgro1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-i6epuhgro1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-i6epuhgro1] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-i6epuhgro1] .adm-breadcrumbs {
    padding: 0;
}

[b-i6epuhgro1] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-i6epuhgro1] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-i6epuhgro1] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-i6epuhgro1] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-i6epuhgro1] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-i6epuhgro1] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-i6epuhgro1] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-i6epuhgro1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-i6epuhgro1] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-i6epuhgro1] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-i6epuhgro1] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-i6epuhgro1] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-i6epuhgro1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Add Button — WCAG 2.5.5 (44px min touch target) */
[b-i6epuhgro1] .adm-add-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
    min-height: 44px !important;
}

[b-i6epuhgro1] .adm-add-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.18);
}

/* Refresh Button — WCAG 2.5.5 (44px min touch target) */
[b-i6epuhgro1] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 44px;
    min-height: 44px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-i6epuhgro1] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

[b-i6epuhgro1] .adm-refresh-btn:focus-visible {
    outline: 2px solid #35a0ae;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(53, 160, 174, 0.18);
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP — semantic icon classes (no inline styles)
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-i6epuhgro1] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-i6epuhgro1] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-i6epuhgro1] {
    border-right: none;
}

.adm-kpi:hover[b-i6epuhgro1] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-i6epuhgro1] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-i6epuhgro1] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.9;
}

/* Total — Rently primary teal */
[b-i6epuhgro1] .adm-kpi__icon--total {
    color: #35a0ae !important;
}

/* Active — calm green (positive metric) */
[b-i6epuhgro1] .adm-kpi__icon--active {
    color: #16a34a !important;
}

/* Inactive — neutral slate (was #EF412c Rently red — brand-trap on neutral metric, Test-217 B-2 precedent) */
[b-i6epuhgro1] .adm-kpi__icon--inactive {
    color: #94a3b8 !important;
}

/* Nav Bar — sky blue (was #f59e0b amber — brand-trap on positive feature, Test-217 B-1/B-3 precedent) */
[b-i6epuhgro1] .adm-kpi__icon--navbar {
    color: #0ea5e9 !important;
}

.adm-kpi__label[b-i6epuhgro1] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-i6epuhgro1] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   ERROR STATE
   ═══════════════════════════════════════════════════════ */
.adm-error-panel[b-i6epuhgro1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 3rem 1.5rem;
    text-align: center;
    color: #475569;
    background: #ffffff;
}

[b-i6epuhgro1] .adm-error-panel .mud-icon-root {
    color: #94a3b8;
    font-size: 3rem !important;
}

.adm-error-panel h2[b-i6epuhgro1] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #0f172a;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-error-panel p[b-i6epuhgro1] {
    font-size: 0.875rem;
    color: #64748b;
    margin: 0;
    max-width: 360px;
}

[b-i6epuhgro1] .adm-error-panel__retry {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px !important;
    margin-top: 0.5rem;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-i6epuhgro1] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-i6epuhgro1] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-i6epuhgro1] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   TABLE SECTION
   ═══════════════════════════════════════════════════════ */
.adm-table-container[b-i6epuhgro1] {
    padding: 0 1.5rem 1.5rem;
}

[b-i6epuhgro1] .adm-search-field {
    margin-bottom: 0.75rem;
    max-width: 360px;
}

[b-i6epuhgro1] .adm-search-field .mud-input-outlined-border {
    border-color: #e2e8f0 !important;
    border-radius: 8px !important;
}

[b-i6epuhgro1] .adm-search-field .mud-input-outlined-border:hover {
    border-color: #35a0ae !important;
}

[b-i6epuhgro1] .adm-search-field .mud-input-adorment-start {
    color: #94a3b8;
}

[b-i6epuhgro1] .adm-search-field input::placeholder {
    color: #94a3b8 !important;
    font-size: 0.82rem;
}

/* MudTable styling */
[b-i6epuhgro1] .adm-table {
    border-radius: 10px !important;
    border: 1px solid #e8ecf1 !important;
    overflow: hidden;
    box-shadow: none !important;
}

[b-i6epuhgro1] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-i6epuhgro1] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #64748b !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-i6epuhgro1] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-i6epuhgro1] .adm-table .mud-table-body tr {
    cursor: pointer;
    transition: background 0.12s ease;
}

[b-i6epuhgro1] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-i6epuhgro1] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-i6epuhgro1] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-i6epuhgro1] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

[b-i6epuhgro1] .adm-th-action,
[b-i6epuhgro1] .adm-td-action {
    width: 80px;
    text-align: center;
}

.adm-tag-name[b-i6epuhgro1] {
    font-weight: 500;
    color: #1e293b;
}

/* Row Nav Bar icons */
[b-i6epuhgro1] .adm-row-icon {
    font-size: 1rem !important;
}

[b-i6epuhgro1] .adm-row-icon--on {
    color: #16a34a;
}

[b-i6epuhgro1] .adm-row-icon--off {
    color: #94a3b8;
}

/* Delete row button — WCAG 2.5.5 + secondary action styling */
[b-i6epuhgro1] .adm-delete-btn {
    color: #64748b !important;
    border-radius: 8px !important;
}

[b-i6epuhgro1] .adm-delete-btn:hover {
    color: #b91c1c !important;
    background: rgba(239, 68, 68, 0.06) !important;
}

[b-i6epuhgro1] .adm-delete-btn:focus-visible {
    outline: 2px solid #b91c1c;
    outline-offset: 2px;
}

/* Chip styling */
[b-i6epuhgro1] .adm-chip {
    font-size: 0.7rem !important;
    height: 22px !important;
    font-weight: 600 !important;
}

/* Empty state */
.adm-empty-state[b-i6epuhgro1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #64748b;
    font-size: 0.85rem;
}

[b-i6epuhgro1] .adm-empty-state__icon {
    color: #cbd5e1 !important;
    font-size: 2.5rem !important;
}

.adm-empty-state__title[b-i6epuhgro1] {
    font-weight: 600;
    color: #334155;
}

.adm-empty-state__body[b-i6epuhgro1] {
    color: #94a3b8;
    font-size: 0.78rem;
    max-width: 320px;
    text-align: center;
}

/* ═══════════════════════════════════════════════════════
   DIALOG (TagEditorDialog) — wrapper rules referenced via global style file
   Note: scoped CSS does NOT cross to MudDialog because MudDialog renders to a portal
   outside this component tree (per `feedback_blazor_scoped_css_class_on_mud_child.md`).
   Dialog-level styles are inline-set via Class names on the dialog component.
   ═══════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-i6epuhgro1] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-i6epuhgro1] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-i6epuhgro1] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-i6epuhgro1] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-i6epuhgro1] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-i6epuhgro1] {
        grid-template-columns: repeat(2, 1fr);
    }

    [b-i6epuhgro1] .adm-search-field {
        max-width: 100%;
    }

    /* WCAG 2.5.5 — guarantee 44px touch target on every interactive control at tablet and below */
    [b-i6epuhgro1] .adm-add-btn {
        min-height: 44px !important;
    }

    [b-i6epuhgro1] .adm-refresh-btn {
        min-height: 44px !important;
        min-width: 44px !important;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-i6epuhgro1] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-i6epuhgro1] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-i6epuhgro1] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(2n)[b-i6epuhgro1] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-i6epuhgro1] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-table-container[b-i6epuhgro1] {
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-i6epuhgro1] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    /* Mobile stacked-row polish — Test-206 M-5 / Test-207 M-12 parity */
    [b-i6epuhgro1] .adm-table .mud-table-body td {
        padding: 0.5rem 0.875rem !important;
    }

    [b-i6epuhgro1] .adm-table .mud-table-body td::before {
        font-weight: 600;
    }

    [b-i6epuhgro1] .adm-td-action {
        text-align: right;
    }

    .adm-status-pill[b-i6epuhgro1] {
        font-size: 0.7rem;
    }
}

/* ═══════════════════════════════════════════════════════
   PREFERS-REDUCED-MOTION
   ═══════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .adm-kpi[b-i6epuhgro1] {
        transition: none;
    }

    [b-i6epuhgro1] .adm-table .mud-table-body tr {
        transition: none;
    }

    .adm-status-pill__dot--on[b-i6epuhgro1] {
        box-shadow: none;
    }
}
/* /Components/Pages/Admin/Tickets/SupportCaseWorkspace.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Support Case Workspace — "Nordic Control Panel" Design
   Matches AnalyticsDashboard + ManageBlogs standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-d5n47qsc6w] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-d5n47qsc6w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-d5n47qsc6w] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-d5n47qsc6w] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-d5n47qsc6w] .adm-breadcrumbs {
    padding: 0;
}

[b-d5n47qsc6w] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-d5n47qsc6w] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-d5n47qsc6w] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-d5n47qsc6w] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-d5n47qsc6w] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill--alert[b-d5n47qsc6w] {
    background: #fef2f2;
    border-color: #fecaca;
    color: #991b1b;
}

.adm-status-pill__dot[b-d5n47qsc6w] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-d5n47qsc6w] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-d5n47qsc6w] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__dot--alert[b-d5n47qsc6w] {
    background: #ef4444;
    box-shadow: 0 0 6px rgba(239, 68, 68, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-d5n47qsc6w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-d5n47qsc6w] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-d5n47qsc6w] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-d5n47qsc6w] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-d5n47qsc6w] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-d5n47qsc6w] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Export Button */
[b-d5n47qsc6w] .adm-export-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    font-size: 0.8rem !important;
    letter-spacing: 0 !important;
    padding: 4px 16px !important;
    box-shadow: none !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
}

[b-d5n47qsc6w] .adm-export-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Refresh Button */
[b-d5n47qsc6w] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-d5n47qsc6w] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-d5n47qsc6w] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-d5n47qsc6w] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-d5n47qsc6w] {
    border-right: none;
}

.adm-kpi:hover[b-d5n47qsc6w] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi--alert[b-d5n47qsc6w] {
    background: rgba(239, 68, 68, 0.03);
}

.adm-kpi--alert:hover[b-d5n47qsc6w] {
    background: rgba(239, 68, 68, 0.06);
}

.adm-kpi__top[b-d5n47qsc6w] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-d5n47qsc6w] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-d5n47qsc6w] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-d5n47qsc6w] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-d5n47qsc6w] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-d5n47qsc6w] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-d5n47qsc6w] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS — Support health metrics
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-d5n47qsc6w] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-d5n47qsc6w] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-d5n47qsc6w] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-d5n47qsc6w] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-d5n47qsc6w] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
    padding-left: 0.5rem;
}

.adm-detail-card__number[b-d5n47qsc6w] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-d5n47qsc6w] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

.adm-detail-card__meta[b-d5n47qsc6w] {
    font-size: 0.72rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-d5n47qsc6w] .adm-tabs {
    background: transparent;
}

[b-d5n47qsc6w] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-d5n47qsc6w] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-d5n47qsc6w] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-d5n47qsc6w] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-d5n47qsc6w] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-d5n47qsc6w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-d5n47qsc6w] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-d5n47qsc6w] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-d5n47qsc6w] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-d5n47qsc6w] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-d5n47qsc6w] .adm-filter-field {
    max-width: 340px;
    min-width: 200px;
}

[b-d5n47qsc6w] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-d5n47qsc6w] .adm-filter-field .mud-input-outlined .mud-input-outlined-border:hover {
    border-color: #35a0ae;
}

[b-d5n47qsc6w] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
.adm-table-container[b-d5n47qsc6w] {
    padding: 0 1.5rem 1.5rem;
}

[b-d5n47qsc6w] .adm-table {
    border-radius: 10px !important;
    border: 1px solid #e8ecf1 !important;
    overflow: hidden;
    box-shadow: none !important;
}

[b-d5n47qsc6w] .adm-table .mud-table-head .mud-table-row {
    background: #f8fafc !important;
}

[b-d5n47qsc6w] .adm-table .mud-table-head th {
    font-size: 0.72rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #5f6b7a !important;
    font-weight: 600 !important;
    padding: 0.625rem 1rem !important;
    border-bottom: 1px solid #e8ecf1 !important;
    background: transparent !important;
}

[b-d5n47qsc6w] .adm-table .mud-table-body td {
    font-size: 0.84rem !important;
    color: #334155 !important;
    padding: 0.5rem 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

[b-d5n47qsc6w] .adm-table .mud-table-body tr {
    transition: background 0.12s ease;
    cursor: pointer;
}

[b-d5n47qsc6w] .adm-table .mud-table-body tr:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-d5n47qsc6w] .adm-table .mud-table-body tr.mud-table-row-striped {
    background: #fafbfc !important;
}

[b-d5n47qsc6w] .adm-table .mud-table-body tr.mud-table-row-striped:hover {
    background: rgba(53, 160, 174, 0.03) !important;
}

[b-d5n47qsc6w] .adm-table .mud-table-pagination {
    font-size: 0.78rem !important;
    color: #64748b !important;
    border-top: 1px solid #e8ecf1 !important;
}

/* Case cell styling */
.adm-case-subject[b-d5n47qsc6w] {
    display: block;
    font-weight: 600;
    color: #1e293b;
    font-size: 0.84rem;
}

.adm-case-number[b-d5n47qsc6w] {
    display: block;
    color: #256f7a;
    font-size: 0.72rem;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    margin-top: 0.125rem;
}

.adm-requester[b-d5n47qsc6w] {
    font-size: 0.84rem;
    color: #334155;
}

.adm-date[b-d5n47qsc6w] {
    font-size: 0.78rem;
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

/* Chip styling */
[b-d5n47qsc6w] .adm-chip {
    font-size: 0.7rem !important;
    height: 22px !important;
    font-weight: 600 !important;
}

/* WCAG AA contrast fix: white on MudBlazor Warning (#FF9800) = 2.56:1 → #e65100 = ~4.6:1 */
[b-d5n47qsc6w] .adm-chip.mud-chip-filled.mud-chip-color-warning {
    background-color: #e65100 !important;
}

/* WCAG AA contrast fix: white on MudBlazor Error (#F44336) for priority chips */
[b-d5n47qsc6w] .adm-chip.mud-chip-filled.mud-chip-color-error {
    background-color: #c62828 !important;
}

/* Empty state */
.adm-empty-state[b-d5n47qsc6w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 2rem;
    border-radius: 10px;
    border: 1px dashed #d1d5db;
    background: #ffffff;
}

.adm-empty-state__title[b-d5n47qsc6w] {
    font-size: 1rem;
    font-weight: 600;
    color: #475569;
}

.adm-empty-state__desc[b-d5n47qsc6w] {
    font-size: 0.85rem;
    color: #64748b;
}

/* ═══════════════════════════════════════════════════════
   CHART PANELS
   ═══════════════════════════════════════════════════════ */
.adm-chart-row[b-d5n47qsc6w] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    padding: 0 1.5rem 0.75rem;
}

.adm-chart-panel[b-d5n47qsc6w] {
    border-radius: 10px;
    padding: 1.25rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
}

.adm-chart-panel__header[b-d5n47qsc6w] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.875rem;
}

.adm-chart-panel__title[b-d5n47qsc6w] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-chart-panel__subtitle[b-d5n47qsc6w] {
    font-size: 0.72rem;
    color: #64748b;
    font-weight: 400;
    display: block;
    margin-top: 0.125rem;
}

.adm-chart-empty[b-d5n47qsc6w] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 200px;
    color: #64748b;
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-kpi-strip[b-d5n47qsc6w] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3n)[b-d5n47qsc6w] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-d5n47qsc6w] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-detail-grid[b-d5n47qsc6w] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-d5n47qsc6w] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-d5n47qsc6w] {
        margin-left: 0;
        width: 100%;
    }

    .adm-chart-row[b-d5n47qsc6w] {
        grid-template-columns: 1fr;
    }

    .adm-tab-toolbar[b-d5n47qsc6w] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-d5n47qsc6w] {
        width: 100%;
        margin-left: 0;
    }

    [b-d5n47qsc6w] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-d5n47qsc6w] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-d5n47qsc6w] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-d5n47qsc6w] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3n)[b-d5n47qsc6w] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-d5n47qsc6w] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-d5n47qsc6w] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:last-child:nth-child(odd)[b-d5n47qsc6w] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-d5n47qsc6w] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-table-container[b-d5n47qsc6w] {
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-d5n47qsc6w] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .adm-chart-row[b-d5n47qsc6w] {
        padding: 0 0.875rem 0.75rem;
    }

    [b-d5n47qsc6w] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    .adm-tab-toolbar[b-d5n47qsc6w] {
        padding: 0.75rem 0.875rem;
    }

    /* WCAG touch target fix: min 44px on mobile */
    [b-d5n47qsc6w] .adm-export-btn {
        min-height: 44px !important;
        padding: 8px 16px !important;
    }

    [b-d5n47qsc6w] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/UserRentalSearchHistory/UserRentalSearchHistories.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Search Histories — "Nordic Control Panel" Design System
   Matches AnalyticsDashboard / DatabaseMigrations standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-3l1hkbbzx7] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
    overflow-x: hidden;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-3l1hkbbzx7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-3l1hkbbzx7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-3l1hkbbzx7] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-3l1hkbbzx7] .adm-breadcrumbs {
    padding: 0;
}

[b-3l1hkbbzx7] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-3l1hkbbzx7] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #94a3b8;
}

[b-3l1hkbbzx7] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-3l1hkbbzx7] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-3l1hkbbzx7] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-3l1hkbbzx7] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-3l1hkbbzx7] {
    background: #16a34a;
    box-shadow: 0 0 6px rgba(22, 163, 74, 0.4);
}

.adm-status-pill__dot--warn[b-3l1hkbbzx7] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__time[b-3l1hkbbzx7] {
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-3l1hkbbzx7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-3l1hkbbzx7] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-3l1hkbbzx7] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-3l1hkbbzx7] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-3l1hkbbzx7] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-3l1hkbbzx7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-3l1hkbbzx7] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-3l1hkbbzx7] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* Back / Outlined buttons */
[b-3l1hkbbzx7] .adm-back-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500 !important;
    border-color: #d1d5db !important;
    color: #475569 !important;
}

[b-3l1hkbbzx7] .adm-back-btn:hover {
    border-color: rgba(53, 160, 174, 0.3) !important;
    color: #35a0ae !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-3l1hkbbzx7] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-3l1hkbbzx7] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-3l1hkbbzx7] {
    border-right: none;
}

.adm-kpi:hover[b-3l1hkbbzx7] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi--warn[b-3l1hkbbzx7] {
    background: rgba(245, 158, 11, 0.03);
}

.adm-kpi--warn:hover[b-3l1hkbbzx7] {
    background: rgba(245, 158, 11, 0.06);
}

.adm-kpi__top[b-3l1hkbbzx7] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-3l1hkbbzx7] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-3l1hkbbzx7] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-3l1hkbbzx7] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-3l1hkbbzx7] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-3l1hkbbzx7] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-3l1hkbbzx7] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-3l1hkbbzx7] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-3l1hkbbzx7] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-3l1hkbbzx7] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-3l1hkbbzx7] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-3l1hkbbzx7] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-3l1hkbbzx7] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-3l1hkbbzx7] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-3l1hkbbzx7] .adm-tabs {
    background: transparent;
}

[b-3l1hkbbzx7] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-3l1hkbbzx7] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-3l1hkbbzx7] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-3l1hkbbzx7] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-3l1hkbbzx7] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-3l1hkbbzx7] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-3l1hkbbzx7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-3l1hkbbzx7] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-3l1hkbbzx7] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-3l1hkbbzx7] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-3l1hkbbzx7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* ═══════════════════════════════════════════════════════
   SEARCH FIELD
   ═══════════════════════════════════════════════════════ */
[b-3l1hkbbzx7] .adm-search-field {
    max-width: 240px;
    min-width: 180px;
}

[b-3l1hkbbzx7] .adm-search-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-3l1hkbbzx7] .adm-search-field .mud-input {
    color: #334155 !important;
    font-size: 0.85rem;
}

[b-3l1hkbbzx7] .adm-search-field .mud-input-label {
    color: #64748b !important;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
.adm-table-wrap[b-3l1hkbbzx7] {
    padding: 0 1.5rem 1rem;
}

[b-3l1hkbbzx7] .adm-table {
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #e8ecf1;
}

[b-3l1hkbbzx7] .adm-table .mud-table-head th {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    background: #f8f9fb;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.75rem 1rem;
}

[b-3l1hkbbzx7] .adm-table .mud-table-body td {
    font-size: 0.85rem;
    color: #334155;
    padding: 0.625rem 1rem;
    border-bottom: 1px solid #f1f5f9;
}

[b-3l1hkbbzx7] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-3l1hkbbzx7] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
    font-size: 0.8rem;
}

/* Search term highlight */
.adm-search-term[b-3l1hkbbzx7] {
    font-weight: 500;
    color: #1e293b;
}

/* Mono badge for IDs */
.adm-mono-badge[b-3l1hkbbzx7] {
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
    font-size: 0.78rem;
    color: #475569;
    background: #f1f5f9;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
}

/* User cell */
.adm-user-cell[b-3l1hkbbzx7] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-user-cell__name[b-3l1hkbbzx7] {
    font-weight: 500;
    color: #1e293b;
    font-size: 0.85rem;
}

.adm-user-cell__email[b-3l1hkbbzx7] {
    font-size: 0.75rem;
    color: #64748b;
}

/* ═══════════════════════════════════════════════════════
   STATUS BADGES
   ═══════════════════════════════════════════════════════ */
.adm-status-badge[b-3l1hkbbzx7] {
    display: inline-block;
    padding: 0.15rem 0.625rem;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.adm-status-badge--applied[b-3l1hkbbzx7] {
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
}

.adm-status-badge--pending[b-3l1hkbbzx7] {
    background: rgba(245, 158, 11, 0.08);
    color: #b45309;
}

/* ═══════════════════════════════════════════════════════
   LOADING STATE
   ═══════════════════════════════════════════════════════ */
.adm-loading[b-3l1hkbbzx7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 4rem 2rem;
}

.adm-loading__text[b-3l1hkbbzx7] {
    font-size: 0.85rem;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   ERROR STATE
   ═══════════════════════════════════════════════════════ */
.adm-error-state[b-3l1hkbbzx7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 4rem 2rem;
}

.adm-error-state__text[b-3l1hkbbzx7] {
    font-size: 0.85rem;
    color: #64748b;
    font-weight: 500;
    text-align: center;
    max-width: 400px;
}

/* ═══════════════════════════════════════════════════════
   EMPTY STATE
   ═══════════════════════════════════════════════════════ */
.adm-empty-state[b-3l1hkbbzx7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 3rem 2rem;
}

.adm-empty-state__title[b-3l1hkbbzx7] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
}

.adm-empty-state__text[b-3l1hkbbzx7] {
    font-size: 0.82rem;
    color: #64748b;
    text-align: center;
    max-width: 350px;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — Tablet (max-width: 960px)
   ═══════════════════════════════════════════════════════ */
@media (max-width: 960px) {
    .adm-kpi-strip[b-3l1hkbbzx7] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-detail-grid[b-3l1hkbbzx7] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-page-header[b-3l1hkbbzx7] {
        padding: 1rem 1.25rem;
    }

    .adm-page-header__tools[b-3l1hkbbzx7] {
        width: 100%;
        justify-content: flex-end;
    }

    [b-3l1hkbbzx7] .adm-refresh-btn {
        min-width: 44px;
        min-height: 44px;
    }

    [b-3l1hkbbzx7] .adm-back-btn {
        min-height: 44px;
    }

    .adm-tab-toolbar[b-3l1hkbbzx7] {
        padding: 1rem 1.25rem;
    }

    .adm-tab-toolbar__right[b-3l1hkbbzx7] {
        width: 100%;
    }

    [b-3l1hkbbzx7] .adm-search-field {
        max-width: 100%;
        min-width: 0;
        flex: 1;
    }

    .adm-table-wrap[b-3l1hkbbzx7] {
        padding: 0 1.25rem 1rem;
        overflow-x: auto;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — Mobile (max-width: 600px)
   ═══════════════════════════════════════════════════════ */
@media (max-width: 600px) {
    .adm-actionbar[b-3l1hkbbzx7] {
        padding: 0.5rem 1rem;
    }

    .adm-page-header[b-3l1hkbbzx7] {
        padding: 1rem;
        gap: 1rem;
    }

    .adm-page-header__title[b-3l1hkbbzx7] {
        gap: 0.75rem;
    }

    .adm-page-header__h1[b-3l1hkbbzx7] {
        font-size: 1.125rem;
    }

    .adm-page-header__sub[b-3l1hkbbzx7] {
        font-size: 0.75rem;
    }

    .adm-page-header__tools[b-3l1hkbbzx7] {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .adm-kpi-strip[b-3l1hkbbzx7] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi__value[b-3l1hkbbzx7] {
        font-size: 1.25rem;
    }

    .adm-section-header[b-3l1hkbbzx7] {
        padding: 0.75rem 1rem 0.5rem;
    }

    .adm-detail-grid[b-3l1hkbbzx7] {
        grid-template-columns: 1fr;
        padding: 0 1rem 0.75rem;
    }

    .adm-tab-toolbar[b-3l1hkbbzx7] {
        padding: 0.75rem 1rem;
    }

    .adm-table-wrap[b-3l1hkbbzx7] {
        padding: 0 1rem 0.75rem;
    }
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE — 2K+ (min-width: 2000px)
   ═══════════════════════════════════════════════════════ */
@media (min-width: 2000px) {
    .adm-page-header__h1[b-3l1hkbbzx7] {
        font-size: 1.5rem;
    }

    .adm-kpi__value[b-3l1hkbbzx7] {
        font-size: 1.75rem;
    }

    .adm-detail-card__number[b-3l1hkbbzx7] {
        font-size: 1.5rem;
    }
}
/* /Components/Pages/Admin/VerificationRequests/IdentityVerificationRequests.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Identity Verification Requests — "Nordic Control Panel"
   Matches AnalyticsDashboard admin design standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-yq4d9tur4v] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-yq4d9tur4v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-yq4d9tur4v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-yq4d9tur4v] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-yq4d9tur4v] .adm-breadcrumbs {
    padding: 0;
}

[b-yq4d9tur4v] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-yq4d9tur4v] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-yq4d9tur4v] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-yq4d9tur4v] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-yq4d9tur4v] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill--warn[b-yq4d9tur4v] {
    background: #fefce8;
    border-color: #fde68a;
    color: #92400e;
}

.adm-status-pill__dot[b-yq4d9tur4v] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-yq4d9tur4v] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-yq4d9tur4v] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-yq4d9tur4v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-yq4d9tur4v] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-yq4d9tur4v] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-yq4d9tur4v] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-yq4d9tur4v] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-yq4d9tur4v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-yq4d9tur4v] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-yq4d9tur4v] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-yq4d9tur4v] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-yq4d9tur4v] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-yq4d9tur4v] {
    border-right: none;
}

.adm-kpi:hover[b-yq4d9tur4v] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi--alert[b-yq4d9tur4v] {
    background: rgba(239, 68, 68, 0.03);
}

.adm-kpi--alert:hover[b-yq4d9tur4v] {
    background: rgba(239, 68, 68, 0.06);
}

.adm-kpi__top[b-yq4d9tur4v] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-yq4d9tur4v] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-yq4d9tur4v] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-yq4d9tur4v] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-yq4d9tur4v] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-yq4d9tur4v] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-yq4d9tur4v] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-yq4d9tur4v] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-yq4d9tur4v] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-yq4d9tur4v] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-yq4d9tur4v] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-yq4d9tur4v] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-yq4d9tur4v] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-yq4d9tur4v] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-yq4d9tur4v] .adm-tabs {
    background: transparent;
}

[b-yq4d9tur4v] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-yq4d9tur4v] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-yq4d9tur4v] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-yq4d9tur4v] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-yq4d9tur4v] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-yq4d9tur4v] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-yq4d9tur4v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-yq4d9tur4v] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-yq4d9tur4v] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-yq4d9tur4v] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-yq4d9tur4v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-yq4d9tur4v] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-yq4d9tur4v] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-yq4d9tur4v] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
[b-yq4d9tur4v] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-yq4d9tur4v] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-yq4d9tur4v] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #5f6b7a;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-yq4d9tur4v] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-yq4d9tur4v] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-yq4d9tur4v] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ═══════════════════════════════════════════════════════
   TABLE CELL COMPONENTS
   ═══════════════════════════════════════════════════════ */

/* User cell */
.adm-user-cell[b-yq4d9tur4v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-user-name[b-yq4d9tur4v] {
    font-weight: 500;
    color: #1e293b;
    display: block;
    font-size: 0.85rem;
}

.adm-user-id[b-yq4d9tur4v] {
    font-size: 0.72rem;
    color: #64748b;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    display: block;
}

/* Step indicator */
.adm-step-indicator[b-yq4d9tur4v] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.adm-step-dot[b-yq4d9tur4v] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #e2e8f0;
    transition: background 0.2s ease;
}

.adm-step-dot--active[b-yq4d9tur4v] {
    background: #35a0ae;
}

.adm-step-label[b-yq4d9tur4v] {
    font-size: 0.72rem;
    color: #64748b;
    margin-left: 0.375rem;
    font-weight: 500;
}

/* Monospace */
.adm-mono[b-yq4d9tur4v] {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.82rem;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #334155;
}

/* Chip */
[b-yq4d9tur4v] .adm-chip {
    font-size: 0.72rem !important;
    height: 24px !important;
    text-transform: none;
}

/* WCAG AA contrast fix: white on MudBlazor Warning (#FF9800) = 2.56:1 -> #e65100 = ~4.6:1 */
[b-yq4d9tur4v] .mud-chip-filled.mud-chip-color-warning {
    background-color: #e65100 !important;
}

/* WCAG AA contrast fix: white on MudBlazor Error (#F44336) = 3.0:1 -> #c62828 = ~5.9:1 */
[b-yq4d9tur4v] .mud-chip-filled.mud-chip-color-error {
    background-color: #c62828 !important;
}

/* WCAG AA contrast fix: white on MudBlazor Success (#4CAF50) = 2.96:1 -> #15803d = ~5.8:1 */
[b-yq4d9tur4v] .mud-chip-filled.mud-chip-color-success {
    background-color: #15803d !important;
}

/* Confidence */
.adm-confidence[b-yq4d9tur4v] {
    font-weight: 600;
    font-size: 0.85rem;
    font-variant-numeric: tabular-nums;
}

.adm-confidence--high[b-yq4d9tur4v] {
    color: #16a34a;
}

.adm-confidence--medium[b-yq4d9tur4v] {
    color: #f59e0b;
}

.adm-confidence--low[b-yq4d9tur4v] {
    color: #ef4444;
}

/* Empty state */
.adm-empty-state[b-yq4d9tur4v] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2.5rem 1rem;
    color: #64748b;
    font-size: 0.875rem;
}

/* ═══════════════════════════════════════════════════════
   DIALOG
   ═══════════════════════════════════════════════════════ */
.adm-dialog-content[b-yq4d9tur4v] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Status banner */
.adm-dialog-status[b-yq4d9tur4v] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.75rem 1rem;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 500;
}

.adm-dialog-status--success[b-yq4d9tur4v] {
    background: rgba(22, 163, 74, 0.06);
    color: #16a34a;
    border: 1px solid rgba(22, 163, 74, 0.15);
}

.adm-dialog-status--error[b-yq4d9tur4v] {
    background: rgba(239, 68, 68, 0.06);
    color: #b91c1c;
    border: 1px solid rgba(239, 68, 68, 0.15);
}

.adm-dialog-status--warning[b-yq4d9tur4v] {
    background: rgba(245, 158, 11, 0.06);
    color: #92400e;
    border: 1px solid rgba(245, 158, 11, 0.15);
}

.adm-dialog-status--info[b-yq4d9tur4v] {
    background: rgba(53, 160, 174, 0.06);
    color: #0e7490;
    border: 1px solid rgba(53, 160, 174, 0.15);
}

/* Dialog sections */
.adm-dialog-section[b-yq4d9tur4v] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.adm-dialog-section__title[b-yq4d9tur4v] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f1f5f9;
    font-family: 'Montserrat', sans-serif;
}

/* Dialog grid */
.adm-dialog-grid[b-yq4d9tur4v] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.adm-dialog-field[b-yq4d9tur4v] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.adm-dialog-field__label[b-yq4d9tur4v] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 600;
}

.adm-dialog-field__value[b-yq4d9tur4v] {
    font-size: 0.85rem;
    color: #1e293b;
    word-break: break-word;
}

/* Dialog steps */
.adm-dialog-steps[b-yq4d9tur4v] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.adm-dialog-step[b-yq4d9tur4v] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-radius: 8px;
    border: 1px solid #f1f5f9;
    margin-bottom: 0.375rem;
    color: #94a3b8;
    transition: all 0.15s ease;
}

.adm-dialog-step--complete[b-yq4d9tur4v] {
    background: rgba(22, 163, 74, 0.04);
    border-color: rgba(22, 163, 74, 0.15);
    color: #16a34a;
}

.adm-dialog-step--active[b-yq4d9tur4v] {
    background: rgba(53, 160, 174, 0.04);
    border-color: rgba(53, 160, 174, 0.2);
    color: #35a0ae;
}

.adm-dialog-step__title[b-yq4d9tur4v] {
    font-weight: 600;
    font-size: 0.85rem;
    display: block;
}

.adm-dialog-step__detail[b-yq4d9tur4v] {
    font-size: 0.78rem;
    font-weight: 400;
    display: block;
    margin-top: 0.1rem;
}

.adm-dialog-step--complete .adm-dialog-step__title[b-yq4d9tur4v] {
    color: #1e293b;
}

.adm-dialog-step--complete .adm-dialog-step__detail[b-yq4d9tur4v] {
    color: #64748b;
}

.adm-dialog-step--active .adm-dialog-step__title[b-yq4d9tur4v] {
    color: #1e293b;
}

.adm-dialog-step--active .adm-dialog-step__detail[b-yq4d9tur4v] {
    color: #64748b;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-yq4d9tur4v] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-yq4d9tur4v] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-yq4d9tur4v] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-yq4d9tur4v] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-yq4d9tur4v] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-yq4d9tur4v] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-yq4d9tur4v] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-dialog-grid[b-yq4d9tur4v] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-yq4d9tur4v] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-yq4d9tur4v] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-yq4d9tur4v] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-yq4d9tur4v] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-yq4d9tur4v] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-yq4d9tur4v] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-yq4d9tur4v] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-yq4d9tur4v] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-yq4d9tur4v],
    .adm-tab-toolbar[b-yq4d9tur4v] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-yq4d9tur4v] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    [b-yq4d9tur4v] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    .adm-tab-toolbar[b-yq4d9tur4v] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-yq4d9tur4v] {
        width: 100%;
        margin-left: 0;
    }

    /* WCAG touch target fix: ensure 44px minimum on mobile */
    [b-yq4d9tur4v] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    [b-yq4d9tur4v] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/Verifications/BankAccountVerifications.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Bank Account Verifications — "Nordic Control Panel"
   Matches AnalyticsDashboard admin design standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-c1jsj680w1] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-c1jsj680w1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-c1jsj680w1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-c1jsj680w1] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-c1jsj680w1] .adm-breadcrumbs {
    padding: 0;
}

[b-c1jsj680w1] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-c1jsj680w1] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-c1jsj680w1] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-c1jsj680w1] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-c1jsj680w1] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill--warn[b-c1jsj680w1] {
    background: #fefce8;
    border-color: #fde68a;
    color: #92400e;
}

.adm-status-pill__dot[b-c1jsj680w1] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-c1jsj680w1] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-c1jsj680w1] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-c1jsj680w1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-c1jsj680w1] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-c1jsj680w1] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-c1jsj680w1] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-c1jsj680w1] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-c1jsj680w1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-c1jsj680w1] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-c1jsj680w1] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-c1jsj680w1] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-c1jsj680w1] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-c1jsj680w1] {
    border-right: none;
}

.adm-kpi:hover[b-c1jsj680w1] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi--alert[b-c1jsj680w1] {
    background: rgba(239, 68, 68, 0.03);
}

.adm-kpi--alert:hover[b-c1jsj680w1] {
    background: rgba(239, 68, 68, 0.06);
}

.adm-kpi__top[b-c1jsj680w1] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-c1jsj680w1] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-c1jsj680w1] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-c1jsj680w1] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-c1jsj680w1] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-c1jsj680w1] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-c1jsj680w1] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-c1jsj680w1] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-c1jsj680w1] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-c1jsj680w1] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-c1jsj680w1] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-c1jsj680w1] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-c1jsj680w1] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-c1jsj680w1] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-c1jsj680w1] .adm-tabs {
    background: transparent;
}

[b-c1jsj680w1] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-c1jsj680w1] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-c1jsj680w1] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-c1jsj680w1] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-c1jsj680w1] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-c1jsj680w1] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-c1jsj680w1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-c1jsj680w1] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-c1jsj680w1] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-c1jsj680w1] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-c1jsj680w1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-c1jsj680w1] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-c1jsj680w1] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-c1jsj680w1] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
[b-c1jsj680w1] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-c1jsj680w1] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-c1jsj680w1] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #5f6b7a;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-c1jsj680w1] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-c1jsj680w1] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-c1jsj680w1] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ═══════════════════════════════════════════════════════
   TABLE CELL COMPONENTS
   ═══════════════════════════════════════════════════════ */

/* User cell */
.adm-user-cell[b-c1jsj680w1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-user-name[b-c1jsj680w1] {
    font-weight: 500;
    color: #1e293b;
    display: block;
    font-size: 0.85rem;
}

.adm-user-id[b-c1jsj680w1] {
    font-size: 0.72rem;
    color: #64748b;
    font-family: 'Cascadia Code', 'Fira Code', monospace;
    display: block;
}

/* Monospace */
.adm-mono[b-c1jsj680w1] {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.78rem;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #64748b;
    display: block;
}

/* Chip */
[b-c1jsj680w1] .adm-chip {
    font-size: 0.72rem !important;
    height: 24px !important;
    text-transform: none;
}

/* WCAG AA contrast fix: white on MudBlazor Warning (#FF9800) = 2.56:1 -> #e65100 = ~4.6:1 */
[b-c1jsj680w1] .mud-chip-filled.mud-chip-color-warning {
    background-color: #e65100 !important;
}

/* WCAG AA contrast fix: white on MudBlazor Error (#F44336) = 3.0:1 -> #c62828 = ~5.9:1 */
[b-c1jsj680w1] .mud-chip-filled.mud-chip-color-error {
    background-color: #c62828 !important;
}

/* WCAG AA contrast fix: white on MudBlazor Success (#4CAF50) = 2.96:1 -> #15803d = ~5.8:1 */
[b-c1jsj680w1] .mud-chip-filled.mud-chip-color-success {
    background-color: #15803d !important;
}

/* Error preview */
.adm-error-preview[b-c1jsj680w1] {
    font-size: 0.78rem;
    color: #b91c1c;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
}

/* Empty state */
.adm-empty-state[b-c1jsj680w1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2.5rem 1rem;
    color: #64748b;
    font-size: 0.875rem;
}

/* ═══════════════════════════════════════════════════════
   DIALOG
   ═══════════════════════════════════════════════════════ */
.adm-dialog-content[b-c1jsj680w1] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Status banner */
.adm-dialog-status[b-c1jsj680w1] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.75rem 1rem;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 500;
}

.adm-dialog-status--success[b-c1jsj680w1] {
    background: rgba(22, 163, 74, 0.06);
    color: #16a34a;
    border: 1px solid rgba(22, 163, 74, 0.15);
}

.adm-dialog-status--error[b-c1jsj680w1] {
    background: rgba(239, 68, 68, 0.06);
    color: #b91c1c;
    border: 1px solid rgba(239, 68, 68, 0.15);
}

.adm-dialog-status--warning[b-c1jsj680w1] {
    background: rgba(245, 158, 11, 0.06);
    color: #92400e;
    border: 1px solid rgba(245, 158, 11, 0.15);
}

.adm-dialog-status--info[b-c1jsj680w1] {
    background: rgba(53, 160, 174, 0.06);
    color: #0e7490;
    border: 1px solid rgba(53, 160, 174, 0.15);
}

/* Dialog sections */
.adm-dialog-section[b-c1jsj680w1] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.adm-dialog-section__title[b-c1jsj680w1] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f1f5f9;
    font-family: 'Montserrat', sans-serif;
}

/* Dialog grid */
.adm-dialog-grid[b-c1jsj680w1] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.adm-dialog-field[b-c1jsj680w1] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.adm-dialog-field__label[b-c1jsj680w1] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 600;
}

.adm-dialog-field__value[b-c1jsj680w1] {
    font-size: 0.85rem;
    color: #1e293b;
    word-break: break-word;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-c1jsj680w1] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-c1jsj680w1] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-c1jsj680w1] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-c1jsj680w1] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-c1jsj680w1] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-c1jsj680w1] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-c1jsj680w1] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-dialog-grid[b-c1jsj680w1] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-c1jsj680w1] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-c1jsj680w1] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-c1jsj680w1] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-c1jsj680w1] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-c1jsj680w1] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-c1jsj680w1] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-c1jsj680w1] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-c1jsj680w1] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-c1jsj680w1],
    .adm-tab-toolbar[b-c1jsj680w1] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-c1jsj680w1] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    [b-c1jsj680w1] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    .adm-tab-toolbar[b-c1jsj680w1] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-c1jsj680w1] {
        width: 100%;
        margin-left: 0;
    }

    /* WCAG touch target fix: ensure 44px minimum on mobile */
    [b-c1jsj680w1] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    [b-c1jsj680w1] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/Verifications/BusinessVerifications.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Business Verifications — "Nordic Control Panel"
   Matches AnalyticsDashboard admin design standard.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-v7vzzx5o67] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-v7vzzx5o67] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-v7vzzx5o67] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-v7vzzx5o67] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

/* Breadcrumbs */
[b-v7vzzx5o67] .adm-breadcrumbs {
    padding: 0;
}

[b-v7vzzx5o67] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-v7vzzx5o67] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-v7vzzx5o67] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-v7vzzx5o67] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-v7vzzx5o67] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill--warn[b-v7vzzx5o67] {
    background: #fefce8;
    border-color: #fde68a;
    color: #92400e;
}

.adm-status-pill__dot[b-v7vzzx5o67] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-v7vzzx5o67] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-v7vzzx5o67] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-v7vzzx5o67] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-v7vzzx5o67] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-v7vzzx5o67] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-v7vzzx5o67] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-v7vzzx5o67] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-v7vzzx5o67] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Refresh Button */
[b-v7vzzx5o67] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-v7vzzx5o67] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-v7vzzx5o67] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-v7vzzx5o67] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-v7vzzx5o67] {
    border-right: none;
}

.adm-kpi:hover[b-v7vzzx5o67] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi--alert[b-v7vzzx5o67] {
    background: rgba(239, 68, 68, 0.03);
}

.adm-kpi--alert:hover[b-v7vzzx5o67] {
    background: rgba(239, 68, 68, 0.06);
}

.adm-kpi__top[b-v7vzzx5o67] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-v7vzzx5o67] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-v7vzzx5o67] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-v7vzzx5o67] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-v7vzzx5o67] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-v7vzzx5o67] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-v7vzzx5o67] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-v7vzzx5o67] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-v7vzzx5o67] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-v7vzzx5o67] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card--alert[b-v7vzzx5o67] {
    border-color: rgba(239, 68, 68, 0.25);
    background: rgba(239, 68, 68, 0.02);
}

.adm-detail-card__bar[b-v7vzzx5o67] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-v7vzzx5o67] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-v7vzzx5o67] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-v7vzzx5o67] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-v7vzzx5o67] .adm-tabs {
    background: transparent;
}

[b-v7vzzx5o67] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-v7vzzx5o67] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-v7vzzx5o67] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-v7vzzx5o67] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-v7vzzx5o67] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-v7vzzx5o67] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-v7vzzx5o67] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-v7vzzx5o67] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-v7vzzx5o67] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-v7vzzx5o67] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-v7vzzx5o67] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* Filter field */
[b-v7vzzx5o67] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-v7vzzx5o67] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-v7vzzx5o67] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLE
   ═══════════════════════════════════════════════════════ */
[b-v7vzzx5o67] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-v7vzzx5o67] .adm-table .mud-table-container {
    border-radius: 0;
}

[b-v7vzzx5o67] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #5f6b7a;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-v7vzzx5o67] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-v7vzzx5o67] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-v7vzzx5o67] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ═══════════════════════════════════════════════════════
   TABLE CELL COMPONENTS
   ═══════════════════════════════════════════════════════ */

/* Company cell */
.adm-company-cell[b-v7vzzx5o67] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-user-name[b-v7vzzx5o67] {
    font-weight: 500;
    color: #1e293b;
    display: block;
    font-size: 0.85rem;
}

/* Monospace */
.adm-mono[b-v7vzzx5o67] {
    font-family: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;
    font-size: 0.78rem;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #64748b;
    display: block;
}

/* Validation icons row */
.adm-validation-icons[b-v7vzzx5o67] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

/* Validation result in dialog */
.adm-validation-result[b-v7vzzx5o67] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

/* Chip */
[b-v7vzzx5o67] .adm-chip {
    font-size: 0.72rem !important;
    height: 24px !important;
    text-transform: none;
}

/* WCAG AA contrast fix: white on MudBlazor Warning (#FF9800) = 2.56:1 -> #e65100 = ~4.6:1 */
[b-v7vzzx5o67] .mud-chip-filled.mud-chip-color-warning {
    background-color: #e65100 !important;
}

/* WCAG AA contrast fix: white on MudBlazor Error (#F44336) = 3.0:1 -> #c62828 = ~5.9:1 */
[b-v7vzzx5o67] .mud-chip-filled.mud-chip-color-error {
    background-color: #c62828 !important;
}

/* WCAG AA contrast fix: white on MudBlazor Success (#4CAF50) = 2.96:1 -> #15803d = ~5.8:1 */
[b-v7vzzx5o67] .mud-chip-filled.mud-chip-color-success {
    background-color: #15803d !important;
}

/* Error preview */
.adm-error-preview[b-v7vzzx5o67] {
    font-size: 0.78rem;
    color: #b91c1c;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
}

/* Empty state */
.adm-empty-state[b-v7vzzx5o67] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2.5rem 1rem;
    color: #64748b;
    font-size: 0.875rem;
}

/* ═══════════════════════════════════════════════════════
   DIALOG
   ═══════════════════════════════════════════════════════ */
.adm-dialog-content[b-v7vzzx5o67] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Status banner */
.adm-dialog-status[b-v7vzzx5o67] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.75rem 1rem;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 500;
}

.adm-dialog-status--success[b-v7vzzx5o67] {
    background: rgba(22, 163, 74, 0.06);
    color: #16a34a;
    border: 1px solid rgba(22, 163, 74, 0.15);
}

.adm-dialog-status--error[b-v7vzzx5o67] {
    background: rgba(239, 68, 68, 0.06);
    color: #b91c1c;
    border: 1px solid rgba(239, 68, 68, 0.15);
}

.adm-dialog-status--warning[b-v7vzzx5o67] {
    background: rgba(245, 158, 11, 0.06);
    color: #92400e;
    border: 1px solid rgba(245, 158, 11, 0.15);
}

.adm-dialog-status--info[b-v7vzzx5o67] {
    background: rgba(53, 160, 174, 0.06);
    color: #0e7490;
    border: 1px solid rgba(53, 160, 174, 0.15);
}

/* Dialog sections */
.adm-dialog-section[b-v7vzzx5o67] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.adm-dialog-section__title[b-v7vzzx5o67] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #f1f5f9;
    font-family: 'Montserrat', sans-serif;
}

/* Dialog grid */
.adm-dialog-grid[b-v7vzzx5o67] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.adm-dialog-field[b-v7vzzx5o67] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.adm-dialog-field__label[b-v7vzzx5o67] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 600;
}

.adm-dialog-field__value[b-v7vzzx5o67] {
    font-size: 0.85rem;
    color: #1e293b;
    word-break: break-word;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-v7vzzx5o67] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-v7vzzx5o67] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-v7vzzx5o67] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-v7vzzx5o67] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-v7vzzx5o67] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-v7vzzx5o67] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-v7vzzx5o67] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-dialog-grid[b-v7vzzx5o67] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-v7vzzx5o67] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-v7vzzx5o67] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-v7vzzx5o67] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-v7vzzx5o67] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-v7vzzx5o67] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-v7vzzx5o67] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-v7vzzx5o67] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-v7vzzx5o67] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-v7vzzx5o67],
    .adm-tab-toolbar[b-v7vzzx5o67] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-v7vzzx5o67] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    [b-v7vzzx5o67] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    .adm-tab-toolbar[b-v7vzzx5o67] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-v7vzzx5o67] {
        width: 100%;
        margin-left: 0;
    }

    /* WCAG touch target fix: ensure 44px minimum on mobile */
    [b-v7vzzx5o67] .adm-refresh-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    [b-v7vzzx5o67] .adm-table .mud-table-row td .mud-icon-button {
        min-width: 44px !important;
        min-height: 44px !important;
    }
}
/* /Components/Pages/Admin/WithdrawRequests/WithdrawRequestsDashboard.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Withdraw Requests — Nordic Control Panel
   Scoped CSS following AnalyticsDashboard design system.
   ═══════════════════════════════════════════════════════ */

/* ─── Shell ─── */
.adm-shell[b-13zo4zrrrn] {
    padding: 0;
    min-height: 100%;
    background: #f8f9fb;
}

/* ═══════════════════════════════════════════════════════
   ACTION BAR
   ═══════════════════════════════════════════════════════ */
.adm-actionbar[b-13zo4zrrrn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-actionbar__left[b-13zo4zrrrn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.adm-actionbar__right[b-13zo4zrrrn] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-left: auto;
}

[b-13zo4zrrrn] .adm-breadcrumbs {
    padding: 0;
}

[b-13zo4zrrrn] .adm-breadcrumbs .mud-breadcrumbs-li {
    font-size: 0.8rem;
    color: #64748b;
}

[b-13zo4zrrrn] .adm-breadcrumbs .mud-breadcrumbs-separator {
    color: #cbd5e1;
}

[b-13zo4zrrrn] .adm-breadcrumbs a {
    color: #64748b !important;
    text-decoration: none;
}

[b-13zo4zrrrn] .adm-breadcrumbs a:hover {
    color: #35a0ae !important;
}

/* Status Pill */
.adm-status-pill[b-13zo4zrrrn] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    white-space: nowrap;
    color: #475569;
    font-weight: 500;
}

.adm-status-pill__dot[b-13zo4zrrrn] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.adm-status-pill__dot--on[b-13zo4zrrrn] {
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.4);
}

.adm-status-pill__dot--warn[b-13zo4zrrrn] {
    background: #f59e0b;
    box-shadow: 0 0 6px rgba(245, 158, 11, 0.4);
}

.adm-status-pill__time[b-13zo4zrrrn] {
    color: #5f6b7a;
    font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════
   PAGE HEADER
   ═══════════════════════════════════════════════════════ */
.adm-page-header[b-13zo4zrrrn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    flex-wrap: wrap;
}

.adm-page-header__title[b-13zo4zrrrn] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.adm-page-header__icon[b-13zo4zrrrn] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(53, 160, 174, 0.08);
    color: #35a0ae;
    flex-shrink: 0;
}

.adm-page-header__h1[b-13zo4zrrrn] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-page-header__sub[b-13zo4zrrrn] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.4;
    margin: 0.15rem 0 0;
}

.adm-page-header__tools[b-13zo4zrrrn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

[b-13zo4zrrrn] .adm-add-btn {
    text-transform: none !important;
    font-weight: 500 !important;
    border-radius: 8px !important;
    letter-spacing: 0.01em;
}

[b-13zo4zrrrn] .adm-refresh-btn {
    border-radius: 8px !important;
    min-width: 36px;
    min-height: 36px;
    color: #475569 !important;
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
}

[b-13zo4zrrrn] .adm-refresh-btn:hover {
    background: rgba(53, 160, 174, 0.06) !important;
    color: #35a0ae !important;
    border-color: rgba(53, 160, 174, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════
   KPI STRIP
   ═══════════════════════════════════════════════════════ */
.adm-kpi-strip[b-13zo4zrrrn] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
}

.adm-kpi[b-13zo4zrrrn] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 1rem 1.375rem;
    border-right: 1px solid #f1f5f9;
    transition: background 0.15s ease;
}

.adm-kpi:last-child[b-13zo4zrrrn] {
    border-right: none;
}

.adm-kpi:hover[b-13zo4zrrrn] {
    background: rgba(53, 160, 174, 0.02);
}

.adm-kpi__top[b-13zo4zrrrn] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

[b-13zo4zrrrn] .adm-kpi__icon {
    font-size: 1rem !important;
    opacity: 0.75;
}

.adm-kpi__label[b-13zo4zrrrn] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 600;
}

.adm-kpi__value[b-13zo4zrrrn] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* ═══════════════════════════════════════════════════════
   SECTION HEADERS
   ═══════════════════════════════════════════════════════ */
.adm-section-header[b-13zo4zrrrn] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 1rem 1.5rem 0.625rem;
}

.adm-section-header__title[b-13zo4zrrrn] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-section-header__subtitle[b-13zo4zrrrn] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

/* ═══════════════════════════════════════════════════════
   DETAIL CARDS
   ═══════════════════════════════════════════════════════ */
.adm-detail-grid[b-13zo4zrrrn] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
    padding: 0 1.5rem 1rem;
}

.adm-detail-card[b-13zo4zrrrn] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-radius: 10px;
    padding: 1rem 1.125rem;
    background: #ffffff;
    border: 1px solid #e8ecf1;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.adm-detail-card:hover[b-13zo4zrrrn] {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.adm-detail-card__bar[b-13zo4zrrrn] {
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    border-radius: 0 2px 2px 0;
}

.adm-detail-card__data[b-13zo4zrrrn] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.adm-detail-card__number[b-13zo4zrrrn] {
    font-size: 1.375rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.adm-detail-card__label[b-13zo4zrrrn] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 500;
}

/* ═══════════════════════════════════════════════════════
   TABS
   ═══════════════════════════════════════════════════════ */
[b-13zo4zrrrn] .adm-tabs {
    background: transparent;
}

[b-13zo4zrrrn] .adm-tabs .mud-tabs-toolbar {
    background: #ffffff;
    border-bottom: 1px solid #e8ecf1;
    padding: 0 1.5rem;
    min-height: auto;
}

[b-13zo4zrrrn] .adm-tabs .mud-tab {
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    min-width: auto;
    padding: 0.875rem 1.25rem;
    transition: color 0.15s ease;
    color: #64748b;
    font-size: 0.875rem;
    cursor: pointer;
}

[b-13zo4zrrrn] .adm-tabs .mud-tab:hover {
    color: #35a0ae;
    background: transparent;
}

[b-13zo4zrrrn] .adm-tabs .mud-tab.mud-tab-active {
    color: #35a0ae;
    font-weight: 600;
}

[b-13zo4zrrrn] .adm-tabs .mud-tab-slider {
    background: #35a0ae;
    height: 2px;
}

.adm-tab-panel[b-13zo4zrrrn] {
    padding: 0;
}

/* ═══════════════════════════════════════════════════════
   TAB TOOLBAR
   ═══════════════════════════════════════════════════════ */
.adm-tab-toolbar[b-13zo4zrrrn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    flex-wrap: wrap;
}

.adm-tab-toolbar__left[b-13zo4zrrrn] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.adm-tab-toolbar__title[b-13zo4zrrrn] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}

.adm-tab-toolbar__count[b-13zo4zrrrn] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 400;
}

.adm-tab-toolbar__right[b-13zo4zrrrn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

[b-13zo4zrrrn] .adm-filter-field {
    max-width: 280px;
    min-width: 200px;
}

[b-13zo4zrrrn] .adm-filter-field .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-13zo4zrrrn] .adm-filter-field .mud-input {
    font-size: 0.85rem;
}

[b-13zo4zrrrn] .adm-status-filter {
    max-width: 160px;
    min-width: 140px;
}

[b-13zo4zrrrn] .adm-status-filter .mud-input-outlined .mud-input-outlined-border {
    border-color: #d1d5db;
    border-radius: 8px;
}

[b-13zo4zrrrn] .adm-status-filter .mud-input {
    font-size: 0.85rem;
}

/* ═══════════════════════════════════════════════════════
   TABLES
   ═══════════════════════════════════════════════════════ */
[b-13zo4zrrrn] .adm-table {
    background: #ffffff;
    border-radius: 0;
}

[b-13zo4zrrrn] .adm-table .mud-table-container {
    border-radius: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

[b-13zo4zrrrn] .adm-table .mud-table-head th {
    background: #f8f9fb;
    color: #475569;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e8ecf1;
    padding: 0.625rem 1rem;
}

[b-13zo4zrrrn] .adm-table .mud-table-row:hover {
    background: rgba(53, 160, 174, 0.02) !important;
}

[b-13zo4zrrrn] .adm-table .mud-table-row td {
    border-bottom: 1px solid #f3f4f6;
    padding: 0.5rem 1rem;
    font-size: 0.85rem;
    color: #334155;
}

[b-13zo4zrrrn] .adm-table .mud-table-pagination {
    border-top: 1px solid #e8ecf1;
}

/* ─── Cell Styles ─── */
.adm-owner-cell[b-13zo4zrrrn] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.adm-owner-name[b-13zo4zrrrn] {
    font-weight: 500;
    color: #1e293b;
}

.adm-owner-secondary[b-13zo4zrrrn] {
    font-size: 0.78rem;
    color: #64748b;
}

.adm-amount[b-13zo4zrrrn] {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: #0f172a;
}

.adm-payout-text[b-13zo4zrrrn] {
    font-size: 0.82rem;
    color: #475569;
}

[b-13zo4zrrrn] .adm-status-chip {
    font-size: 0.72rem !important;
    height: 24px !important;
    font-weight: 500 !important;
}

/* ─── Actions ─── */
.adm-actions[b-13zo4zrrrn] {
    display: flex;
    gap: 0.375rem;
    align-items: center;
    flex-wrap: nowrap;
}

[b-13zo4zrrrn] .adm-action-btn {
    text-transform: none !important;
    font-size: 0.78rem !important;
    min-height: 30px !important;
    padding: 0 0.75rem !important;
    border-radius: 6px !important;
    font-weight: 500 !important;
}

/* ─── Empty State ─── */
.adm-empty-state[b-13zo4zrrrn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 1rem;
    color: #64748b;
    font-size: 0.875rem;
}

[b-13zo4zrrrn] .adm-empty-icon {
    color: #64748b !important;
    opacity: 0.5;
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .adm-detail-grid[b-13zo4zrrrn] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi-strip[b-13zo4zrrrn] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-kpi:nth-child(3)[b-13zo4zrrrn] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+4)[b-13zo4zrrrn] {
        border-top: 1px solid #f1f5f9;
    }
}

@media (max-width: 960px) {
    .adm-page-header[b-13zo4zrrrn] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-page-header__tools[b-13zo4zrrrn] {
        margin-left: 0;
        width: 100%;
    }

    .adm-kpi-strip[b-13zo4zrrrn] {
        grid-template-columns: repeat(3, 1fr);
    }

    .adm-tab-toolbar[b-13zo4zrrrn] {
        flex-direction: column;
        align-items: flex-start;
    }

    .adm-tab-toolbar__right[b-13zo4zrrrn] {
        width: 100%;
        margin-left: 0;
        flex-wrap: wrap;
    }

    [b-13zo4zrrrn] .adm-action-btn {
        min-height: 44px !important;
        min-width: 44px !important;
    }
}

@media (max-width: 600px) {
    .adm-actionbar[b-13zo4zrrrn] {
        padding: 0.5rem 0.875rem;
    }

    .adm-page-header[b-13zo4zrrrn] {
        padding: 1rem 0.875rem;
    }

    .adm-kpi-strip[b-13zo4zrrrn] {
        grid-template-columns: repeat(2, 1fr);
    }

    .adm-kpi:nth-child(3)[b-13zo4zrrrn] {
        border-right: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(2n)[b-13zo4zrrrn] {
        border-right: none;
    }

    .adm-kpi:nth-child(n+3)[b-13zo4zrrrn] {
        border-top: 1px solid #f1f5f9;
    }

    .adm-kpi:nth-child(5)[b-13zo4zrrrn] {
        grid-column: 1 / -1;
    }

    .adm-detail-grid[b-13zo4zrrrn] {
        grid-template-columns: 1fr;
        padding: 0 0.875rem 1rem;
    }

    .adm-section-header[b-13zo4zrrrn],
    .adm-tab-toolbar[b-13zo4zrrrn] {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    [b-13zo4zrrrn] .adm-tabs .mud-tabs-toolbar {
        padding: 0 0.875rem;
    }

    [b-13zo4zrrrn] .adm-filter-field {
        max-width: 100%;
        width: 100%;
    }

    [b-13zo4zrrrn] .adm-status-filter {
        max-width: 100%;
        width: 100%;
    }

    [b-13zo4zrrrn] .adm-action-btn {
        min-height: 44px !important;
        min-width: 44px !important;
    }
}

/* ═══════════════════════════════════════════════════════
   ADD/EDIT DIALOG STYLES (Test-152 inline MudDialog consolidation)
   ═══════════════════════════════════════════════════════ */
[b-13zo4zrrrn] .adm-dialog-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    color: #0f172a;
}

[b-13zo4zrrrn] .adm-dialog-content {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.5rem 0;
    font-family: 'Montserrat', sans-serif;
}

[b-13zo4zrrrn] .adm-dialog-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    align-items: center;
}

[b-13zo4zrrrn] .adm-dialog-section-label {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    margin: 0.25rem 0;
}

[b-13zo4zrrrn] .adm-dialog-field {
    font-size: 0.85rem;
}

[b-13zo4zrrrn] .adm-dialog-switch {
    margin: 0;
}

[b-13zo4zrrrn] .adm-dialog-btn {
    text-transform: none !important;
    border-radius: 8px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 500 !important;
    min-height: 44px;
    padding: 0 1rem;
}

@media (max-width: 600px) {
    [b-13zo4zrrrn] .adm-dialog-grid {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Error.razor.rz.scp.css */
/* ============================================================
   Error (Test-201) — Rently Public Error Fallback
   Tokens scoped to .ep-wrapper (NOT :root — scoped-CSS silent-fail
   gotcha per feedback_blazor_scoped_css_root_selector.md).
   ::deep selectors anchored to plain page-rendered elements
   (NOT classes passed into MudBlazor children — see
   feedback_blazor_scoped_css_class_on_mud_child.md).
   Mirrors Maintenance.razor.css token system for consistency.
   ============================================================ */

.ep-wrapper[b-g1ofk4658w] {
    --ep-primary: #35a0ae;
    --ep-primary-dark: #256f7a;
    --ep-primary-darker: #1b4f57;
    --ep-primary-soft: rgba(53, 160, 174, 0.08);
    --ep-primary-soft-strong: rgba(53, 160, 174, 0.18);
    --ep-warning: #f59e0b;
    --ep-success: #16a34a;
    --ep-ink: #0f1e21;
    --ep-muted: #64748b;
    --ep-border: #e2e8f0;
    --ep-border-strong: #cbd5e1;
    --ep-surface: #ffffff;
    --ep-surface-raised: #f8fafc;
    --ep-bg: #f8fafc;
    --ep-radius: 8px;
    --ep-radius-lg: 16px;
    --ep-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 3px rgba(15, 23, 42, 0.06);
    --ep-shadow-md: 0 4px 6px rgba(15, 23, 42, 0.05), 0 10px 15px rgba(15, 23, 42, 0.05);
    --ep-transition: 200ms ease;

    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--ep-ink);
    min-height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    background-color: var(--ep-bg);
}

/* =========================================================
   Hero band — full-bleed teal gradient
   ========================================================= */
.ep-hero-band[b-g1ofk4658w] {
    background: linear-gradient(135deg, var(--ep-primary-dark) 0%, var(--ep-primary) 60%, #5db2be 100%);
    color: #ffffff;
    padding: 56px 24px 64px;
    position: relative;
    overflow: hidden;
}

.ep-hero-band[b-g1ofk4658w]::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 85% 20%, rgba(255, 255, 255, 0.14) 0%, transparent 42%),
        radial-gradient(circle at 15% 85%, rgba(255, 255, 255, 0.10) 0%, transparent 42%);
    pointer-events: none;
}

.ep-hero-inner[b-g1ofk4658w] {
    max-width: 720px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    text-align: center;
}

.ep-hero-icon-frame[b-g1ofk4658w] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.16);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, 0.22);
    margin: 0 auto 20px;
}

.ep-hero-icon-frame[b-g1ofk4658w]  .mud-icon-root {
    color: #ffffff;
    width: 36px;
    height: 36px;
}

.ep-hero-title[b-g1ofk4658w] {
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(1.875rem, 2.5vw + 1rem, 2.5rem);
    font-weight: 700;
    line-height: 1.15;
    margin: 0 0 12px;
    color: #ffffff;
    letter-spacing: -0.015em;
}

.ep-hero-subtitle[b-g1ofk4658w] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.94);
    margin: 0 auto;
    max-width: 540px;
}

/* =========================================================
   Content area — calm, narrow column
   ========================================================= */
.ep-content[b-g1ofk4658w] {
    max-width: 640px;
    width: 100%;
    margin: -32px auto 0;
    padding: 0 24px 64px;
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 16px;
    flex: 1;
}

.ep-info-card[b-g1ofk4658w] {
    background: var(--ep-surface);
    border-radius: var(--ep-radius-lg);
    box-shadow: var(--ep-shadow-md);
    padding: 28px 24px;
    border: 1px solid var(--ep-border);
}

.ep-info-card-row[b-g1ofk4658w] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.ep-info-card-body[b-g1ofk4658w] {
    min-width: 0;
    flex: 1 1 auto;
}

.ep-info-card-icon-frame[b-g1ofk4658w] {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--ep-primary-soft);
}

.ep-info-card-icon-frame[b-g1ofk4658w]  .mud-icon-root {
    color: var(--ep-primary-dark);
    width: 24px;
    height: 24px;
}

.ep-info-card-icon-frame--warning[b-g1ofk4658w] {
    background: rgba(245, 158, 11, 0.12);
}

.ep-info-card-icon-frame--warning[b-g1ofk4658w]  .mud-icon-root {
    color: #b45309;
}

.ep-info-card-icon-frame--success[b-g1ofk4658w] {
    background: rgba(22, 163, 74, 0.12);
}

.ep-info-card-icon-frame--success[b-g1ofk4658w]  .mud-icon-root {
    color: var(--ep-success);
}

.ep-info-card-title[b-g1ofk4658w] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.0625rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--ep-ink);
    margin: 0 0 6px;
}

.ep-info-card-text[b-g1ofk4658w] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.55;
    color: var(--ep-muted);
    margin: 0;
}

.ep-info-card-text + .ep-info-card-text[b-g1ofk4658w] {
    margin-top: 8px;
}

.ep-info-card-text strong[b-g1ofk4658w] {
    color: var(--ep-ink);
    font-weight: 600;
}

/* =========================================================
   Action row — anchors styled as buttons. We use plain
   <a href> rather than @onclick so navigation works even
   when the Blazor interactive circuit is dead — essential
   for an error fallback page.
   ========================================================= */
.ep-action-row[b-g1ofk4658w] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 20px;
}

.ep-btn[b-g1ofk4658w] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 20px;
    border-radius: var(--ep-radius);
    border: 1px solid transparent;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.2;
    text-transform: none;
    letter-spacing: 0;
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--ep-transition), border-color var(--ep-transition), color var(--ep-transition), box-shadow var(--ep-transition);
}

.ep-btn:focus-visible[b-g1ofk4658w] {
    outline: 2px solid var(--ep-primary);
    outline-offset: 2px;
}

.ep-btn--filled[b-g1ofk4658w] {
    background-color: var(--ep-primary);
    color: #ffffff;
}

.ep-btn--filled:hover[b-g1ofk4658w] {
    background-color: var(--ep-primary-dark);
    color: #ffffff;
}

.ep-btn--outlined[b-g1ofk4658w] {
    background-color: transparent;
    border-color: var(--ep-border-strong);
    color: var(--ep-ink);
}

.ep-btn--outlined:hover[b-g1ofk4658w] {
    border-color: var(--ep-primary);
    background-color: var(--ep-primary-soft);
    color: var(--ep-primary-dark);
}

.ep-btn-icon[b-g1ofk4658w]  .mud-icon-root {
    width: 20px;
    height: 20px;
    color: inherit;
}

/* =========================================================
   Footnote — support link + trace ID for incident lookup
   ========================================================= */
.ep-footnote[b-g1ofk4658w] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--ep-muted);
    margin: 8px 0 0;
    text-align: center;
}

.ep-footnote a[b-g1ofk4658w] {
    color: var(--ep-primary-dark);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.ep-trace[b-g1ofk4658w] {
    display: inline-block;
    margin-right: 4px;
}

.ep-trace code[b-g1ofk4658w] {
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
    font-size: 0.8125rem;
    background: var(--ep-surface-raised);
    border: 1px solid var(--ep-border);
    border-radius: 4px;
    padding: 1px 6px;
    color: var(--ep-ink);
    user-select: all;
}

/* =========================================================
   Responsive — tablet (≤960) and mobile (≤599)
   ========================================================= */
@media (max-width: 960px) {
    .ep-hero-band[b-g1ofk4658w] {
        padding: 44px 20px 56px;
    }

    .ep-content[b-g1ofk4658w] {
        padding: 0 16px 48px;
    }
}

@media (max-width: 599px) {
    .ep-hero-band[b-g1ofk4658w] {
        padding: 36px 16px 48px;
    }

    .ep-hero-icon-frame[b-g1ofk4658w] {
        width: 64px;
        height: 64px;
        margin-bottom: 16px;
    }

    .ep-hero-icon-frame[b-g1ofk4658w]  .mud-icon-root {
        width: 32px;
        height: 32px;
    }

    .ep-hero-title[b-g1ofk4658w] {
        font-size: 1.625rem;
    }

    .ep-hero-subtitle[b-g1ofk4658w] {
        font-size: 0.9375rem;
    }

    .ep-content[b-g1ofk4658w] {
        padding: 0 12px 40px;
        gap: 12px;
    }

    .ep-info-card[b-g1ofk4658w] {
        padding: 22px 18px;
    }

    .ep-info-card-row[b-g1ofk4658w] {
        gap: 12px;
    }

    .ep-info-card-title[b-g1ofk4658w] {
        font-size: 1rem;
    }

    .ep-info-card-text[b-g1ofk4658w] {
        font-size: 0.9rem;
    }

    .ep-action-row[b-g1ofk4658w] {
        flex-direction: column;
    }

    .ep-btn[b-g1ofk4658w] {
        width: 100%;
    }
}

/* =========================================================
   Reduced motion guard
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
    .ep-btn[b-g1ofk4658w] {
        transition: none !important;
    }
}
/* /Components/Pages/Maintenance.razor.rz.scp.css */
/* ============================================================
   Maintenance — Rently public status page

   Design intent: this used to read like a generic 500-style
   error page. The redesign mirrors the Home (Index.razor) hero
   pattern — teal brand gradient, friendly Rently mascot on the
   right, headline + subhead on the left — so visitors who land
   here recognise it as a real Rently page, not an outage screen.

   Tokens scoped to .mp-wrapper (NOT :root — scoped-CSS silent-
   fail gotcha per feedback_blazor_scoped_css_root_selector.md).
   ::deep selectors anchored to plain page-rendered elements
   (NOT classes passed into MudBlazor children) per
   feedback_blazor_scoped_css_class_on_mud_child.md.
   ============================================================ */

.mp-wrapper[b-sc8yyhy217] {
    --mp-primary: #35a0ae;
    --mp-primary-dark: #256f7a;
    --mp-primary-darker: #1b4f57;
    --mp-primary-light: #5db2be;
    --mp-primary-soft: rgba(53, 160, 174, 0.10);
    --mp-primary-soft-strong: rgba(53, 160, 174, 0.18);
    --mp-secondary: #EF412c;
    --mp-secondary-soft: rgba(239, 65, 44, 0.12);
    --mp-warning: #f59e0b;
    --mp-warning-soft: rgba(245, 158, 11, 0.14);
    --mp-success: #16a34a;
    --mp-success-soft: rgba(22, 163, 74, 0.12);
    --mp-ink: #0f1e21;
    --mp-ink-muted: #424242;
    --mp-muted: #616161;
    --mp-border: #e2e8f0;
    --mp-surface: #ffffff;
    --mp-surface-raised: #f8fafc;
    --mp-bg: #fafafa;
    --mp-radius: 8px;
    --mp-radius-lg: 16px;
    --mp-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 3px rgba(15, 23, 42, 0.06);
    --mp-shadow-md: 0 4px 6px rgba(15, 23, 42, 0.05), 0 10px 15px rgba(15, 23, 42, 0.05);
    --mp-shadow-lg: 0 8px 16px rgba(15, 23, 42, 0.08), 0 16px 32px rgba(15, 23, 42, 0.06);
    --mp-transition: 200ms ease;

    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--mp-ink);
    min-height: calc(100vh - 64px);
    display: flex;
    flex-direction: column;
    background-color: var(--mp-bg);
}

/* =========================================================
   Hero band — teal brand gradient, mascot on the right.
   Mirrors the Index.razor guest-hero composition.
   ========================================================= */
.mp-hero-band[b-sc8yyhy217] {
    background:
        linear-gradient(135deg, var(--mp-primary-darker) 0%, var(--mp-primary-dark) 35%, var(--mp-primary) 70%, var(--mp-primary-light) 100%);
    color: #ffffff;
    position: relative;
    overflow: hidden;
    padding: 64px 24px 96px;
}

/* Soft brand-tinted radial highlights — same pattern as
   Index hero, gives the gradient depth without overpowering.
   The mascot reads cleanly because the highlights sit behind. */
.mp-hero-band[b-sc8yyhy217]::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 88% 22%, rgba(255, 255, 255, 0.18) 0%, transparent 38%),
        radial-gradient(circle at 12% 88%, rgba(255, 255, 255, 0.12) 0%, transparent 44%),
        radial-gradient(circle at 50% 50%, rgba(239, 65, 44, 0.06) 0%, transparent 60%);
    pointer-events: none;
}

/* Subtle large "R" decoration — a quiet nod to the brand
   without competing with the mascot. */
.mp-hero-band[b-sc8yyhy217]::after {
    content: "";
    position: absolute;
    right: -80px;
    bottom: -120px;
    width: 360px;
    height: 360px;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 50%;
    pointer-events: none;
}

.mp-hero-inner[b-sc8yyhy217] {
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    align-items: center;
    gap: 48px;
}

.mp-hero-copy[b-sc8yyhy217] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.mp-hero-eyebrow[b-sc8yyhy217] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    align-self: flex-start;
    padding: 7px 14px;
    border-radius: 999px;
    background-color: rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, 0.26);
    color: #ffffff;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.mp-hero-eyebrow-icon[b-sc8yyhy217]  .mud-icon-root {
    color: #ffffff;
    width: 16px;
    height: 16px;
}

.mp-hero-title[b-sc8yyhy217] {
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(2.25rem, 3.4vw + 1rem, 3.5rem);
    font-weight: 700;
    line-height: 1.08;
    margin: 0;
    color: #ffffff;
    letter-spacing: -0.02em;
}

.mp-hero-title-accent[b-sc8yyhy217] {
    color: #ffffff;
    background: linear-gradient(90deg, #ffffff 0%, rgba(255, 255, 255, 0.85) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    position: relative;
    display: inline-block;
}

/* Coral underline accent on the title — signals the brand
   secondary colour and gives the heading a small bit of
   energy that flat white-on-teal lacks. */
.mp-hero-title-accent[b-sc8yyhy217]::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -8px;
    height: 6px;
    border-radius: 3px;
    background-color: var(--mp-secondary);
    opacity: 0.92;
}

.mp-hero-subtitle[b-sc8yyhy217] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.0625rem;
    font-weight: 400;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.94);
    margin: 16px 0 0;
    max-width: 560px;
}

/* =========================================================
   Hero mascot — pulled from /images/Home so we re-use the
   same friendly cow character the homepage uses.
   ========================================================= */
.mp-hero-mascot[b-sc8yyhy217] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 280px;
}

.mp-hero-mascot-glow[b-sc8yyhy217] {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at center, rgba(255, 255, 255, 0.28) 0%, rgba(255, 255, 255, 0.10) 35%, transparent 70%);
    filter: blur(8px);
    pointer-events: none;
}

.mp-hero-mascot-img[b-sc8yyhy217] {
    position: relative;
    z-index: 1;
    max-width: 100%;
    height: auto;
    width: 320px;
    max-height: 360px;
    object-fit: contain;
    filter: drop-shadow(0 14px 32px rgba(15, 30, 33, 0.32));
    animation: mp-mascot-float-b-sc8yyhy217 6s ease-in-out infinite;
}

@keyframes mp-mascot-float-b-sc8yyhy217 {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

/* =========================================================
   Content section — three brand tiles plus role-aware card.
   Pulled up onto the hero with negative margin so the page
   feels composed rather than two stacked rectangles.
   ========================================================= */
.mp-content[b-sc8yyhy217] {
    max-width: 1100px;
    width: 100%;
    margin: -56px auto 0;
    padding: 0 24px 72px;
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 28px;
    flex: 1;
}

.mp-tile-grid[b-sc8yyhy217] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.mp-tile[b-sc8yyhy217] {
    background: var(--mp-surface);
    border-radius: var(--mp-radius-lg);
    box-shadow: var(--mp-shadow-lg);
    padding: 28px 24px;
    border: 1px solid var(--mp-border);
    display: flex;
    flex-direction: column;
    gap: 14px;
    transition: transform var(--mp-transition), box-shadow var(--mp-transition);
}

.mp-tile:hover[b-sc8yyhy217] {
    transform: translateY(-2px);
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.10), 0 24px 40px rgba(15, 23, 42, 0.06);
}

.mp-tile-icon-frame[b-sc8yyhy217] {
    flex: 0 0 auto;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.mp-tile-icon-frame[b-sc8yyhy217]  .mud-icon-root {
    width: 28px;
    height: 28px;
}

.mp-tile-icon-frame--primary[b-sc8yyhy217] {
    background: var(--mp-primary-soft);
}

.mp-tile-icon-frame--primary[b-sc8yyhy217]  .mud-icon-root {
    color: var(--mp-primary-dark);
}

.mp-tile-icon-frame--accent[b-sc8yyhy217] {
    background: var(--mp-secondary-soft);
}

.mp-tile-icon-frame--accent[b-sc8yyhy217]  .mud-icon-root {
    color: var(--mp-secondary);
}

.mp-tile-icon-frame--soft[b-sc8yyhy217] {
    background: var(--mp-warning-soft);
}

.mp-tile-icon-frame--soft[b-sc8yyhy217]  .mud-icon-root {
    color: #b45309;
}

.mp-tile-title[b-sc8yyhy217] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--mp-ink);
    margin: 0;
}

.mp-tile-text[b-sc8yyhy217] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.6;
    color: var(--mp-muted);
    margin: 0;
}

.mp-inline-link[b-sc8yyhy217] {
    color: var(--mp-primary-dark);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-thickness: 1.5px;
    transition: color var(--mp-transition);
}

.mp-inline-link:hover[b-sc8yyhy217] {
    color: var(--mp-primary);
}

/* =========================================================
   Role-aware status card — full-width strip below the tiles
   with a softly-tinted left accent matching the brand.
   ========================================================= */
.mp-status-card[b-sc8yyhy217] {
    background: var(--mp-surface);
    border-radius: var(--mp-radius-lg);
    box-shadow: var(--mp-shadow-md);
    border: 1px solid var(--mp-border);
    padding: 28px 28px 28px 32px;
    display: flex;
    gap: 22px;
    align-items: flex-start;
    position: relative;
    overflow: hidden;
}

/* Coloured left accent rail — admin gets green, user gets
   teal, guest gets teal. Helps role context register fast. */
.mp-status-card[b-sc8yyhy217]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    background-color: var(--mp-primary);
}

.mp-status-card--admin[b-sc8yyhy217]::before {
    background-color: var(--mp-success);
}

.mp-status-card-icon-frame[b-sc8yyhy217] {
    flex: 0 0 auto;
    width: 56px;
    height: 56px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.mp-status-card-icon-frame--primary[b-sc8yyhy217] {
    background: var(--mp-primary-soft);
}

.mp-status-card-icon-frame--primary[b-sc8yyhy217]  .mud-icon-root {
    color: var(--mp-primary-dark);
    width: 28px;
    height: 28px;
}

.mp-status-card-icon-frame--success[b-sc8yyhy217] {
    background: var(--mp-success-soft);
}

.mp-status-card-icon-frame--success[b-sc8yyhy217]  .mud-icon-root {
    color: var(--mp-success);
    width: 28px;
    height: 28px;
}

.mp-status-card-body[b-sc8yyhy217] {
    flex: 1 1 auto;
    min-width: 0;
}

.mp-status-card-eyebrow[b-sc8yyhy217] {
    display: inline-block;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--mp-primary-dark);
    margin-bottom: 4px;
}

.mp-status-card--admin .mp-status-card-eyebrow[b-sc8yyhy217] {
    color: var(--mp-success);
}

.mp-status-card-title[b-sc8yyhy217] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--mp-ink);
    margin: 0 0 8px;
}

.mp-status-card-text[b-sc8yyhy217] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.6;
    color: var(--mp-muted);
    margin: 0 0 18px;
    max-width: 640px;
}

.mp-status-card-actions[b-sc8yyhy217] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 4px;
}

/* =========================================================
   Buttons — plain anchors styled as buttons so navigation
   works without a Blazor interactive circuit (essential for
   a maintenance page that may run mid-deploy).
   ========================================================= */
.mp-btn[b-sc8yyhy217] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 22px;
    border-radius: var(--mp-radius);
    border: 1px solid transparent;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.2;
    text-transform: none;
    letter-spacing: 0;
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--mp-transition), border-color var(--mp-transition), color var(--mp-transition), box-shadow var(--mp-transition), transform var(--mp-transition);
}

.mp-btn:focus-visible[b-sc8yyhy217] {
    outline: 2px solid var(--mp-primary);
    outline-offset: 2px;
}

.mp-btn--filled[b-sc8yyhy217] {
    background-color: var(--mp-primary);
    color: #ffffff;
    border-color: var(--mp-primary);
}

.mp-btn--filled:hover[b-sc8yyhy217] {
    background-color: var(--mp-primary-dark);
    border-color: var(--mp-primary-dark);
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(53, 160, 174, 0.30);
    transform: translateY(-1px);
}

.mp-btn--outlined[b-sc8yyhy217] {
    background-color: transparent;
    border-color: #cbd5e1;
    color: var(--mp-ink-muted);
}

.mp-btn--outlined:hover[b-sc8yyhy217] {
    border-color: var(--mp-primary);
    background-color: var(--mp-primary-soft);
    color: var(--mp-primary-dark);
}

.mp-btn-icon[b-sc8yyhy217]  .mud-icon-root {
    width: 20px;
    height: 20px;
    color: inherit;
}

/* =========================================================
   Footnote — small muted line beneath everything.
   ========================================================= */
.mp-footnote[b-sc8yyhy217] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--mp-muted);
    margin: 4px 0 0;
    text-align: center;
}

.mp-footnote a[b-sc8yyhy217],
.mp-footnote[b-sc8yyhy217]  a {
    color: var(--mp-primary-dark);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.mp-footnote a:hover[b-sc8yyhy217],
.mp-footnote[b-sc8yyhy217]  a:hover {
    color: var(--mp-primary);
}

/* =========================================================
   Responsive — tablet (≤1024) collapses to single column,
   mobile (≤599) tightens spacing and stacks the status card.
   ========================================================= */
@media (max-width: 1024px) {
    .mp-hero-inner[b-sc8yyhy217] {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px;
        text-align: center;
    }

    .mp-hero-copy[b-sc8yyhy217] {
        align-items: center;
    }

    .mp-hero-eyebrow[b-sc8yyhy217] {
        align-self: center;
    }

    .mp-hero-subtitle[b-sc8yyhy217] {
        margin-left: auto;
        margin-right: auto;
    }

    .mp-hero-mascot[b-sc8yyhy217] {
        order: -1;
        min-height: 0;
    }

    .mp-hero-mascot-img[b-sc8yyhy217] {
        width: 220px;
        max-height: 260px;
    }

    .mp-tile-grid[b-sc8yyhy217] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 960px) {
    .mp-hero-band[b-sc8yyhy217] {
        padding: 48px 20px 80px;
    }

    .mp-content[b-sc8yyhy217] {
        padding: 0 20px 56px;
        gap: 20px;
    }
}

@media (max-width: 768px) {
    .mp-tile-grid[b-sc8yyhy217] {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 599px) {
    .mp-hero-band[b-sc8yyhy217] {
        padding: 36px 16px 72px;
    }

    .mp-hero-title[b-sc8yyhy217] {
        font-size: 2rem;
    }

    .mp-hero-title-accent[b-sc8yyhy217]::after {
        height: 4px;
        bottom: -6px;
    }

    .mp-hero-subtitle[b-sc8yyhy217] {
        font-size: 0.9375rem;
    }

    .mp-hero-mascot-img[b-sc8yyhy217] {
        width: 180px;
        max-height: 200px;
    }

    .mp-content[b-sc8yyhy217] {
        padding: 0 16px 48px;
        gap: 16px;
        margin-top: -40px;
    }

    .mp-tile[b-sc8yyhy217] {
        padding: 22px 18px;
    }

    .mp-tile-title[b-sc8yyhy217] {
        font-size: 1.0625rem;
    }

    .mp-status-card[b-sc8yyhy217] {
        flex-direction: column;
        padding: 22px 20px 22px 24px;
        gap: 16px;
    }

    .mp-status-card-icon-frame[b-sc8yyhy217] {
        width: 48px;
        height: 48px;
        border-radius: 12px;
    }

    .mp-status-card-icon-frame[b-sc8yyhy217]  .mud-icon-root {
        width: 24px;
        height: 24px;
    }

    .mp-status-card-title[b-sc8yyhy217] {
        font-size: 1.125rem;
    }

    .mp-status-card-actions[b-sc8yyhy217] {
        flex-direction: column;
    }

    .mp-btn[b-sc8yyhy217] {
        width: 100%;
    }
}

/* =========================================================
   Reduced-motion guard — disables float + hover transforms.
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
    .mp-hero-mascot-img[b-sc8yyhy217],
    .mp-tile[b-sc8yyhy217],
    .mp-btn[b-sc8yyhy217] {
        transition: none !important;
        animation: none !important;
        transform: none !important;
    }
}
/* /Components/Pages/OnboardingAgent/AddUser.razor.rz.scp.css */
/* =============================================================
   Add User (/SuccessAmbassador/AddUser) — scoped styles
   Test-189 fix phase. Mirrors MyDetails (Test-188) tokens + ::deep
   gotchas.
   - CSS vars on .adduser-wrapper (not :root — Blazor scoped CSS
     rewrites :root[b-xxxxx] which never matches).
   - ::deep on every selector that targets MudBlazor-rendered DOM
     (MudText, MudTextField, MudButton, MudAlert, MudBreadcrumbs…).
   ============================================================= */

.adduser-wrapper[b-a8aku38yqw] {
    --agent-primary: #35a0ae;
    --agent-primary-darken: #256f7a;
    --agent-primary-lighten: #5db2be;
    --agent-text-primary: #2a2a2a;
    --agent-text-secondary: #5e5e5e;
    --agent-surface: #ffffff;
    --agent-bg: #fafafa;
    --agent-divider: #e0e0e0;
    --agent-card-radius: 12px;
    --agent-btn-radius: 8px;
    --agent-card-shadow: rgba(0, 0, 0, 0.06) 0px 2px 8px;
    background-color: var(--agent-bg);
    min-height: calc(100vh - 64px);
    padding-bottom: 48px;
}

/* ─── Breadcrumbs ─── */
.adduser-breadcrumbs[b-a8aku38yqw] {
    padding: 18px 24px 0;
    max-width: 1200px;
    margin: 0 auto;
}

.adduser-breadcrumbs[b-a8aku38yqw]  .mud-breadcrumbs {
    padding: 0 !important;
    font-family: 'Montserrat', sans-serif !important;
}

.adduser-breadcrumbs[b-a8aku38yqw]  .mud-breadcrumb-item a {
    color: var(--agent-primary-darken) !important;
    text-decoration: none !important;
}

.adduser-breadcrumbs[b-a8aku38yqw]  .mud-breadcrumb-item a:hover,
.adduser-breadcrumbs[b-a8aku38yqw]  .mud-breadcrumb-item a:focus-visible {
    text-decoration: underline !important;
}

.adduser-breadcrumbs[b-a8aku38yqw]  .mud-breadcrumb-separator {
    color: #94a3b8 !important;
}

/* ─── Hero ─── */
.adduser-hero[b-a8aku38yqw] {
    position: relative;
    width: 100%;
    background-color: var(--agent-primary);
    overflow: hidden;
    padding: 36px 0 48px;
    margin-top: 12px;
}

.adduser-hero-bg[b-a8aku38yqw] {
    position: absolute;
    inset: 0;
    background-image: url('/images/Icon_Dark_Green_TransparentBg_40.png');
    background-repeat: repeat;
    background-position: center;
    opacity: 0.08;
    pointer-events: none;
}

.adduser-hero-inner[b-a8aku38yqw] {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
    text-align: center;
}

.adduser-hero-inner[b-a8aku38yqw]  .adduser-title {
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 2rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
}

.adduser-hero-inner[b-a8aku38yqw]  .adduser-subtitle {
    color: rgba(255, 255, 255, 0.92) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 1rem !important;
    margin: 8px auto 0 !important;
    max-width: 640px;
}

/* ─── Content ─── */
.adduser-content[b-a8aku38yqw] {
    max-width: 800px;
    margin: -24px auto 0;
    padding: 0 24px;
    position: relative;
    z-index: 3;
}

.adduser-card[b-a8aku38yqw] {
    background: var(--agent-surface);
    border-radius: var(--agent-card-radius);
    box-shadow: var(--agent-card-shadow);
}

/* MudCard / MudCardContent are child components — their root elements don't
   receive THIS component's scope attribute, so target them through the wrapper
   element we render directly (.adduser-wrapper). */
.adduser-wrapper[b-a8aku38yqw]  .mud-card-content.adduser-card-body {
    padding: 32px !important;
}

.adduser-wrapper[b-a8aku38yqw]  .adduser-section-heading {
    color: var(--agent-text-primary) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    margin: 0 0 6px !important;
}

.adduser-wrapper[b-a8aku38yqw]  .adduser-helper {
    color: var(--agent-text-secondary) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.875rem !important;
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin: 0 0 24px !important;
}

.adduser-helper-icon[b-a8aku38yqw] {
    color: var(--agent-primary);
    flex-shrink: 0;
    margin-top: 2px;
}

/* ─── Form ─── */
.adduser-form[b-a8aku38yqw] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.adduser-field[b-a8aku38yqw] {
    width: 100%;
}

.adduser-field-row[b-a8aku38yqw] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.adduser-input[b-a8aku38yqw]  .mud-input-slot,
.adduser-input[b-a8aku38yqw]  .mud-input-label,
.adduser-input[b-a8aku38yqw]  .mud-input-helper-text {
    font-family: 'Montserrat', sans-serif !important;
}

.adduser-input[b-a8aku38yqw]  .mud-input-outlined .mud-input-outlined-border {
    border-color: var(--agent-divider) !important;
    border-radius: var(--agent-btn-radius) !important;
}

.adduser-input[b-a8aku38yqw]  .mud-input-outlined.mud-focused .mud-input-outlined-border {
    border-color: var(--agent-primary) !important;
    border-width: 2px !important;
}

.adduser-input[b-a8aku38yqw]  .mud-input-label.mud-input-label-inputcontrol.mud-input-label-animated {
    color: var(--agent-text-secondary) !important;
}

.adduser-input[b-a8aku38yqw]  .mud-input-label.mud-state-focused {
    color: var(--agent-primary) !important;
}

.adduser-input[b-a8aku38yqw]  .mud-input-adornment-end .mud-icon-button {
    color: var(--agent-text-secondary) !important;
}

.adduser-input[b-a8aku38yqw]  .mud-input-adornment-end .mud-icon-button:hover,
.adduser-input[b-a8aku38yqw]  .mud-input-adornment-end .mud-icon-button:focus-visible {
    color: var(--agent-primary) !important;
    background-color: transparent !important;
}

/* ─── Role display chip ─── */
.adduser-role-display[b-a8aku38yqw] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.adduser-role-chip[b-a8aku38yqw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background-color: var(--agent-primary);
    color: #ffffff;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 0.875rem;
    border-radius: var(--agent-btn-radius);
    height: 32px;
    padding: 0 14px;
    align-self: flex-start;
}

.adduser-role-chip[b-a8aku38yqw]  .adduser-role-chip-icon,
.adduser-role-chip[b-a8aku38yqw]  .mud-icon-root {
    color: #ffffff !important;
    width: 18px !important;
    height: 18px !important;
    font-size: 18px !important;
}

.adduser-role-display[b-a8aku38yqw]  .adduser-role-caption {
    color: var(--agent-text-secondary) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.8125rem !important;
    line-height: 1.5 !important;
    margin: 0 !important;
}

/* ─── Error alert ─── */
.adduser-error[b-a8aku38yqw] {
    border-radius: var(--agent-btn-radius) !important;
    font-family: 'Montserrat', sans-serif !important;
}

.adduser-error[b-a8aku38yqw]  .mud-alert-message {
    font-family: 'Montserrat', sans-serif !important;
}

/* ─── Actions ─── */
.adduser-actions[b-a8aku38yqw] {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 12px;
    flex-wrap: wrap;
}

.adduser-actions[b-a8aku38yqw]  .adduser-btn {
    border-radius: var(--agent-btn-radius) !important;
    text-transform: none !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 24px !important;
    letter-spacing: 0 !important;
}

.adduser-actions[b-a8aku38yqw]  .adduser-btn-save {
    background-color: var(--agent-primary) !important;
    color: #ffffff !important;
}

.adduser-actions[b-a8aku38yqw]  .adduser-btn-save:hover,
.adduser-actions[b-a8aku38yqw]  .adduser-btn-save:focus-visible {
    background-color: var(--agent-primary-darken) !important;
    color: #ffffff !important;
}

.adduser-actions[b-a8aku38yqw]  .adduser-btn-save:disabled {
    background-color: #b4b4b4 !important;
    color: #ffffff !important;
    opacity: 0.85;
}

.adduser-actions[b-a8aku38yqw]  .adduser-btn-cancel {
    background-color: #ffffff !important;
    color: var(--agent-text-primary) !important;
    border: 1px solid var(--agent-divider) !important;
}

.adduser-actions[b-a8aku38yqw]  .adduser-btn-cancel:hover,
.adduser-actions[b-a8aku38yqw]  .adduser-btn-cancel:focus-visible {
    background-color: #f3f4f6 !important;
    border-color: var(--agent-text-secondary) !important;
}

.adduser-spinner[b-a8aku38yqw] {
    margin-right: 8px;
}

/* ─── Responsive ─── */
@media (max-width: 959px) {
    .adduser-hero[b-a8aku38yqw] {
        padding: 28px 0 40px;
    }

    .adduser-hero-inner[b-a8aku38yqw]  .adduser-title {
        font-size: 1.75rem !important;
    }

    .adduser-field-row[b-a8aku38yqw] {
        grid-template-columns: 1fr;
    }

    .adduser-wrapper[b-a8aku38yqw]  .mud-card-content.adduser-card-body {
        padding: 24px !important;
    }
}

@media (max-width: 599px) {
    .adduser-breadcrumbs[b-a8aku38yqw] {
        padding: 12px 16px 0;
    }

    .adduser-content[b-a8aku38yqw] {
        padding: 0 16px;
        margin-top: -20px;
    }

    .adduser-hero[b-a8aku38yqw] {
        padding: 24px 0 32px;
    }

    .adduser-hero-inner[b-a8aku38yqw] {
        padding: 0 16px;
    }

    .adduser-hero-inner[b-a8aku38yqw]  .adduser-title {
        font-size: 1.5rem !important;
    }

    .adduser-hero-inner[b-a8aku38yqw]  .adduser-subtitle {
        font-size: 0.9375rem !important;
    }

    .adduser-wrapper[b-a8aku38yqw]  .mud-card-content.adduser-card-body {
        padding: 20px !important;
    }

    .adduser-actions[b-a8aku38yqw] {
        flex-direction: column-reverse;
    }

    .adduser-actions[b-a8aku38yqw]  .adduser-btn {
        width: 100% !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .adduser-card[b-a8aku38yqw],
    .adduser-actions[b-a8aku38yqw]  .adduser-btn,
    .adduser-input[b-a8aku38yqw]  .mud-input-outlined .mud-input-outlined-border {
        transition: none !important;
    }
}
/* /Components/Pages/OnboardingAgent/AgentRequestWithdraw.razor.rz.scp.css */
/* =============================================================
   Agent Request Withdraw (/SuccessAmbassador/RequestWithdraw)
   Test-194 redesign. Mirrors AddUser (Test-189) + CommissionDashboard
   (Test-193) token + ::deep patterns.
   - CSS vars on .arw-wrapper (NOT :root — Blazor scoped CSS rewrites
     :root[b-xxxxx] which never matches).
   - ::deep only when prefixed by a class/element we render
     ourselves (never on a child MudBlazor component's Class="…").
   ============================================================= */

.arw-wrapper[b-yh4wzysfjh] {
    --arw-primary: #35a0ae;
    --arw-primary-dark: #256f7a;
    --arw-primary-soft: rgba(53, 160, 174, 0.08);
    --arw-primary-softer: rgba(53, 160, 174, 0.04);
    --arw-accent: #EF412c;
    --arw-warning: #f59e0b;
    --arw-warning-soft: rgba(245, 158, 11, 0.12);
    --arw-info: #3b82f6;
    --arw-info-soft: rgba(59, 130, 246, 0.12);
    --arw-success: #15803d;
    --arw-danger: #b91c1c;
    --arw-surface: #ffffff;
    --arw-surface-alt: #f8fafc;
    --arw-bg: #fafafa;
    --arw-border: #e2e8f0;
    --arw-ink: #1a2b2e;
    --arw-muted: #64748b;
    --arw-radius: 12px;
    --arw-btn-radius: 8px;
    --arw-card-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);

    font-family: 'Montserrat', sans-serif;
    color: var(--arw-ink);
    background: var(--arw-bg);
    min-height: calc(100vh - 64px);
    padding-bottom: 48px;
}

/* ── Breadcrumbs ─────────────────────────────────────────────── */
.arw-breadcrumbs[b-yh4wzysfjh] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 18px 24px 0;
}

.arw-breadcrumbs[b-yh4wzysfjh]  .mud-breadcrumbs {
    padding: 0 !important;
    font-family: 'Montserrat', sans-serif !important;
}

.arw-breadcrumbs[b-yh4wzysfjh]  .mud-breadcrumb-item a {
    color: var(--arw-primary-dark) !important;
    text-decoration: none !important;
}

.arw-breadcrumbs[b-yh4wzysfjh]  .mud-breadcrumb-item a:hover,
.arw-breadcrumbs[b-yh4wzysfjh]  .mud-breadcrumb-item a:focus-visible {
    text-decoration: underline !important;
}

.arw-breadcrumbs[b-yh4wzysfjh]  .mud-breadcrumb-separator {
    color: #94a3b8 !important;
}

/* ── Hero band ───────────────────────────────────────────────── */
.arw-hero[b-yh4wzysfjh] {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, var(--arw-primary) 0%, var(--arw-primary-dark) 100%);
    padding: 40px 32px;
    margin-top: 12px;
}

.arw-hero-bg[b-yh4wzysfjh] {
    position: absolute;
    inset: 0;
    background-image: url('/images/Icon_Dark_Green_TransparentBg_40.png');
    background-repeat: repeat;
    background-position: center;
    opacity: 0.08;
    pointer-events: none;
}

.arw-hero-inner[b-yh4wzysfjh] {
    position: relative;
    z-index: 1;
    max-width: 1200px;
    margin: 0 auto;
}

.arw-hero-title[b-yh4wzysfjh] {
    margin: 0;
    color: #ffffff;
    font-family: 'Montserrat', sans-serif;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.01em;
}

.arw-hero-subtitle[b-yh4wzysfjh] {
    margin: 8px 0 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: 1rem;
    line-height: 1.5;
    max-width: 680px;
}

/* ── Content container ──────────────────────────────────────── */
.arw-content[b-yh4wzysfjh] {
    max-width: 1200px;
    margin: -24px auto 0;
    padding: 0 24px;
    position: relative;
    z-index: 3;
}

/* ── Skeleton ──────────────────────────────────────────────── */
.arw-skeleton[b-yh4wzysfjh] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 24px;
}

/* ── Global state alerts (error, success) ──────────────────── */
.arw-state-alert[b-yh4wzysfjh] {
    border-radius: var(--arw-radius) !important;
    font-family: 'Montserrat', sans-serif !important;
    margin-top: 24px !important;
}

.arw-state-alert-body[b-yh4wzysfjh] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.arw-state-alert-body[b-yh4wzysfjh]  .mud-button-root {
    min-height: 44px !important;
    text-transform: none !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    border-radius: var(--arw-btn-radius) !important;
}

/* ── Balance summary grid ─────────────────────────────────── */
.arw-balance-grid[b-yh4wzysfjh] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.arw-balance-card[b-yh4wzysfjh] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 18px;
    background: var(--arw-surface);
    border: 1px solid var(--arw-border);
    border-radius: var(--arw-radius);
    box-shadow: var(--arw-card-shadow);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.arw-balance-card:hover[b-yh4wzysfjh] {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.08);
}

.arw-balance-card--info[b-yh4wzysfjh] {
    background: var(--arw-primary-softer);
    border-color: rgba(53, 160, 174, 0.25);
}

.arw-balance-icon[b-yh4wzysfjh] {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #ffffff;
}

.arw-balance-icon--primary[b-yh4wzysfjh] { background: var(--arw-primary); }
.arw-balance-icon--info[b-yh4wzysfjh]    { background: var(--arw-info); }
.arw-balance-icon--warning[b-yh4wzysfjh] { background: var(--arw-warning); }

.arw-balance-icon[b-yh4wzysfjh]  .mud-icon-root {
    color: #ffffff !important;
    font-size: 22px !important;
}

.arw-balance-body[b-yh4wzysfjh] {
    min-width: 0;
    flex: 1;
}

.arw-balance-label[b-yh4wzysfjh] {
    color: var(--arw-muted);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 4px;
}

.arw-balance-value[b-yh4wzysfjh] {
    color: var(--arw-ink);
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.15;
    margin-bottom: 4px;
    overflow-wrap: break-word;
}

.arw-balance-value--sm[b-yh4wzysfjh] {
    font-size: 1rem;
    color: var(--arw-primary-dark);
}

.arw-balance-caption[b-yh4wzysfjh] {
    color: var(--arw-muted);
    font-size: 0.8125rem;
    line-height: 1.45;
}

/* ── Main form card ──────────────────────────────────────── */
.arw-card[b-yh4wzysfjh] {
    background: var(--arw-surface);
    border: 1px solid var(--arw-border);
    border-radius: var(--arw-radius);
    box-shadow: var(--arw-card-shadow);
}

.arw-wrapper[b-yh4wzysfjh]  .mud-card-content.arw-card-body {
    padding: 32px !important;
}

.arw-wrapper[b-yh4wzysfjh]  .arw-section-heading {
    color: var(--arw-ink) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 1.125rem !important;
    font-weight: 700 !important;
    margin: 0 0 6px !important;
}

.arw-wrapper[b-yh4wzysfjh]  .arw-section-subheading {
    color: var(--arw-ink) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.9375rem !important;
    font-weight: 600 !important;
    margin: 8px 0 12px !important;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.arw-wrapper[b-yh4wzysfjh]  .arw-helper {
    color: var(--arw-muted) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.875rem !important;
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin: 0 0 24px !important;
}

.arw-helper-icon[b-yh4wzysfjh] {
    color: var(--arw-primary);
    flex-shrink: 0;
    margin-top: 2px;
}

/* ── Form ───────────────────────────────────────────────── */
.arw-form[b-yh4wzysfjh] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.arw-field[b-yh4wzysfjh] {
    width: 100%;
}

.arw-input[b-yh4wzysfjh]  .mud-input-slot,
.arw-input[b-yh4wzysfjh]  .mud-input-label,
.arw-input[b-yh4wzysfjh]  .mud-input-helper-text,
.arw-input[b-yh4wzysfjh]  .mud-select-input {
    font-family: 'Montserrat', sans-serif !important;
}

.arw-input[b-yh4wzysfjh]  .mud-input-outlined .mud-input-outlined-border {
    border-color: var(--arw-border) !important;
    border-radius: var(--arw-btn-radius) !important;
}

.arw-input[b-yh4wzysfjh]  .mud-input-outlined.mud-focused .mud-input-outlined-border {
    border-color: var(--arw-primary) !important;
    border-width: 2px !important;
}

.arw-input[b-yh4wzysfjh]  .mud-input-label.mud-input-label-inputcontrol.mud-input-label-animated {
    color: var(--arw-muted) !important;
}

.arw-input[b-yh4wzysfjh]  .mud-input-label.mud-state-focused {
    color: var(--arw-primary) !important;
}

.arw-input[b-yh4wzysfjh]  .mud-input-adornment-start .mud-typography {
    color: var(--arw-primary-dark) !important;
    font-weight: 700 !important;
    font-family: 'Montserrat', sans-serif !important;
}

.arw-field-hint[b-yh4wzysfjh] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    font-size: 0.8125rem;
    color: var(--arw-muted);
}

.arw-field-hint-icon[b-yh4wzysfjh] {
    color: var(--arw-info);
    flex-shrink: 0;
}

.arw-inline-link[b-yh4wzysfjh] {
    color: var(--arw-primary-dark);
    font-weight: 600;
    text-decoration: underline;
}

.arw-inline-link:hover[b-yh4wzysfjh],
.arw-inline-link:focus-visible[b-yh4wzysfjh] {
    color: var(--arw-primary);
}

/* ── Payout method cards (radio group) ────────────────── */
.arw-method-group[b-yh4wzysfjh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.arw-method-card[b-yh4wzysfjh] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: var(--arw-surface);
    border: 2px solid var(--arw-border);
    border-radius: var(--arw-radius);
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
    user-select: none;
}

.arw-method-card:hover[b-yh4wzysfjh] {
    border-color: var(--arw-primary);
    background: var(--arw-primary-softer);
}

.arw-method-card:focus-within[b-yh4wzysfjh] {
    box-shadow: 0 0 0 3px rgba(53, 160, 174, 0.25);
}

.arw-method-card--selected[b-yh4wzysfjh] {
    border-color: var(--arw-primary);
    background: var(--arw-primary-soft);
}

.arw-method-radio[b-yh4wzysfjh] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.arw-method-icon[b-yh4wzysfjh] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: var(--arw-primary-soft);
    color: var(--arw-primary-dark);
    display: grid;
    place-items: center;
}

.arw-method-card--selected .arw-method-icon[b-yh4wzysfjh] {
    background: var(--arw-primary);
    color: #ffffff;
}

.arw-method-icon[b-yh4wzysfjh]  .mud-icon-root {
    font-size: 22px !important;
    color: inherit !important;
}

.arw-method-text[b-yh4wzysfjh] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.arw-method-title[b-yh4wzysfjh] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 0.9375rem;
    color: var(--arw-ink);
}

.arw-method-desc[b-yh4wzysfjh] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8125rem;
    color: var(--arw-muted);
    line-height: 1.4;
}

.arw-method-check[b-yh4wzysfjh] {
    flex-shrink: 0;
    color: var(--arw-primary);
    opacity: 0;
    transition: opacity 0.15s ease;
}

.arw-method-card--selected .arw-method-check[b-yh4wzysfjh] {
    opacity: 1;
}

.arw-method-check[b-yh4wzysfjh]  .mud-icon-root {
    font-size: 24px !important;
    color: var(--arw-primary) !important;
}

/* ── Consent block ────────────────────────────────────── */
.arw-consent[b-yh4wzysfjh] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 14px;
    background: var(--arw-surface-alt);
    border: 1px solid var(--arw-border);
    border-radius: var(--arw-btn-radius);
}

.arw-checkbox[b-yh4wzysfjh]  .mud-checkbox {
    align-items: flex-start;
}

.arw-checkbox[b-yh4wzysfjh]  .mud-checkbox-dense,
.arw-checkbox[b-yh4wzysfjh]  .mud-checkbox .mud-button-root {
    padding: 0 !important;
}

.arw-checkbox[b-yh4wzysfjh]  .mud-checkbox .mud-icon-root {
    color: var(--arw-primary) !important;
}

.arw-checkbox[b-yh4wzysfjh]  .mud-checkbox .mud-typography {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.875rem !important;
    color: var(--arw-ink) !important;
    line-height: 1.5 !important;
}

.arw-consent-text[b-yh4wzysfjh] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.875rem;
    color: var(--arw-ink);
    line-height: 1.5;
}

.arw-policy-link[b-yh4wzysfjh] {
    color: var(--arw-primary-dark);
    font-weight: 600;
    text-decoration: underline;
}

.arw-policy-link:hover[b-yh4wzysfjh],
.arw-policy-link:focus-visible[b-yh4wzysfjh] {
    color: var(--arw-primary);
}

.arw-wrapper[b-yh4wzysfjh]  .arw-consent-error {
    color: var(--arw-danger) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.8125rem !important;
    margin: 6px 0 0 32px !important;
}

/* ── Info note ───────────────────────────────────────── */
.arw-note[b-yh4wzysfjh] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    background: var(--arw-info-soft);
    border-left: 3px solid var(--arw-info);
    border-radius: var(--arw-btn-radius);
    color: var(--arw-ink);
    font-size: 0.875rem;
    line-height: 1.5;
}

.arw-note-icon[b-yh4wzysfjh] {
    color: var(--arw-info);
    flex-shrink: 0;
}

/* ── Error alert ─────────────────────────────────────── */
.arw-error[b-yh4wzysfjh] {
    border-radius: var(--arw-btn-radius) !important;
    font-family: 'Montserrat', sans-serif !important;
}

.arw-error[b-yh4wzysfjh]  .mud-alert-message {
    font-family: 'Montserrat', sans-serif !important;
}

/* ── Actions ─────────────────────────────────────────── */
.arw-actions[b-yh4wzysfjh] {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 8px;
    flex-wrap: wrap;
}

.arw-actions[b-yh4wzysfjh]  .arw-btn {
    border-radius: var(--arw-btn-radius) !important;
    text-transform: none !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 24px !important;
    letter-spacing: 0 !important;
}

.arw-actions[b-yh4wzysfjh]  .arw-btn-save {
    background-color: var(--arw-primary) !important;
    color: #ffffff !important;
}

.arw-actions[b-yh4wzysfjh]  .arw-btn-save:hover,
.arw-actions[b-yh4wzysfjh]  .arw-btn-save:focus-visible {
    background-color: var(--arw-primary-dark) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(53, 160, 174, 0.3) !important;
}

.arw-actions[b-yh4wzysfjh]  .arw-btn-save:disabled {
    background-color: #b4b4b4 !important;
    color: #ffffff !important;
    opacity: 0.85;
}

.arw-actions[b-yh4wzysfjh]  .arw-btn-cancel {
    background-color: #ffffff !important;
    color: var(--arw-ink) !important;
    border: 1px solid var(--arw-border) !important;
}

.arw-actions[b-yh4wzysfjh]  .arw-btn-cancel:hover,
.arw-actions[b-yh4wzysfjh]  .arw-btn-cancel:focus-visible {
    background-color: #f3f4f6 !important;
    border-color: var(--arw-muted) !important;
}

.arw-spinner[b-yh4wzysfjh] {
    margin-right: 8px;
}

/* ── Retry button inside state alert ─────────────────── */
.arw-retry-btn[b-yh4wzysfjh] {
    min-height: 44px !important;
    text-transform: none !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    border-radius: var(--arw-btn-radius) !important;
}

/* ── Responsive: tablet ──────────────────────────────── */
@media (max-width: 959.98px) {
    .arw-hero[b-yh4wzysfjh] {
        padding: 32px 20px;
    }

    .arw-hero-title[b-yh4wzysfjh] {
        font-size: 1.5rem;
    }

    .arw-hero-subtitle[b-yh4wzysfjh] {
        font-size: 0.9375rem;
    }

    .arw-content[b-yh4wzysfjh] {
        padding: 0 16px;
    }

    .arw-balance-grid[b-yh4wzysfjh] {
        grid-template-columns: 1fr;
    }

    .arw-wrapper[b-yh4wzysfjh]  .mud-card-content.arw-card-body {
        padding: 24px !important;
    }
}

/* ── Responsive: mobile ──────────────────────────────── */
@media (max-width: 599.98px) {
    .arw-breadcrumbs[b-yh4wzysfjh] {
        padding: 12px 16px 0;
    }

    .arw-hero[b-yh4wzysfjh] {
        padding: 24px 16px 36px;
    }

    .arw-hero-title[b-yh4wzysfjh] {
        font-size: 1.375rem;
    }

    .arw-hero-subtitle[b-yh4wzysfjh] {
        font-size: 0.875rem;
    }

    .arw-content[b-yh4wzysfjh] {
        padding: 0 12px;
        margin-top: -20px;
    }

    .arw-wrapper[b-yh4wzysfjh]  .mud-card-content.arw-card-body {
        padding: 20px !important;
    }

    .arw-method-group[b-yh4wzysfjh] {
        grid-template-columns: 1fr;
    }

    .arw-balance-value[b-yh4wzysfjh] {
        font-size: 1.25rem;
    }

    .arw-actions[b-yh4wzysfjh] {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .arw-actions[b-yh4wzysfjh]  .arw-btn {
        width: 100% !important;
    }
}

/* ── Reduced motion ──────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .arw-balance-card[b-yh4wzysfjh],
    .arw-method-card[b-yh4wzysfjh],
    .arw-actions[b-yh4wzysfjh]  .arw-btn,
    .arw-input[b-yh4wzysfjh]  .mud-input-outlined .mud-input-outlined-border {
        transition: none !important;
    }
}
/* /Components/Pages/OnboardingAgent/BecomeAgentInfo.razor.rz.scp.css */
/* ==========================================================================
   BecomeAgentInfo — Become a Success Ambassador marketing landing
   Test-186 (2026-04-20) — Full Radzen->Mud migration + brand-token CSS vars
   Scoped to this component via Blazor's generated scope attribute.
   ========================================================================== */

/* ---------- Brand tokens (scoped) --------------------------------------
   NOTE: Blazor scope attribute is only applied to elements declared INLINE
   in the .razor file. MudBlazor component-rendered elements (MudPaper,
   MudGrid, MudItem, MudButton, MudText) do NOT receive the scope attribute,
   even when Class="..." is passed through. Any CSS rule targeting a class
   applied to a MudBlazor component must be prefixed with ::deep.
   ----------------------------------------------------------------------- */

[b-lk5sxnsalz] .agent-banner-wrapper,
.agent-content-wrapper[b-lk5sxnsalz],
.section-ribbon[b-lk5sxnsalz],
.commission-section[b-lk5sxnsalz],
[b-lk5sxnsalz] .join-section {
    --rently-primary: #35a0ae;
    --rently-primary-darken: #256f7a;
    --rently-secondary: #EF412c;
    --rently-secondary-darken: #a72e1f;
    --rently-surface: #ffffff;
    --rently-text-muted: #5f6b72;
}

/* ---------- Banner ----------------------------------------------------- */

[b-lk5sxnsalz] .agent-banner-wrapper {
    overflow: hidden;
    position: relative;
    background: var(--rently-primary-darken);
}

.agent-banner-image[b-lk5sxnsalz] {
    width: 100%;
    height: auto;
    max-height: 520px;
    object-fit: cover;
    object-position: center;
    display: block;
}

.banner-content[b-lk5sxnsalz] {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    padding: 1.5rem;
    color: #fff;
}

.banner-cta-row[b-lk5sxnsalz] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    width: 100%;
    max-width: 640px;
}

/* ---------- CTA buttons ------------------------------------------------ */

[b-lk5sxnsalz] .agent-cta-btn {
    border-radius: 8px;
    text-transform: none;
    font-weight: 500;
    font-size: 0.98rem;
    min-height: 44px;
    letter-spacing: 0;
}

[b-lk5sxnsalz] .agent-cta-btn--banner,
[b-lk5sxnsalz] .agent-cta-btn--banner .mud-button-label {
    color: #256f7a !important;
}

[b-lk5sxnsalz] .agent-cta-btn--banner {
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(6px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
    padding: 0.55rem 1.3rem;
    min-width: 0;
    flex: 1 1 200px;
    max-width: 100%;
}

[b-lk5sxnsalz] .agent-cta-btn--banner:hover {
    background: #ffffff !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16);
}

[b-lk5sxnsalz] .agent-cta-btn--primary {
    min-width: 0;
    width: 100%;
    max-width: 320px;
}

[b-lk5sxnsalz] .agent-cta-btn--primary,
[b-lk5sxnsalz] .agent-cta-btn--primary .mud-button-label {
    color: #ffffff !important;
}

/* ---------- Ribbon section header ------------------------------------- */

.section-ribbon[b-lk5sxnsalz] {
    height: 60px;
    background-image: url('/images/Icon_Background_Blue_Fade.png');
    background-size: cover;
    background-position: center;
    background-color: var(--rently-primary);
}

[b-lk5sxnsalz] .section-ribbon__title {
    color: #fff;
    font-weight: 600;
    margin: 0;
    text-align: center;
    padding: 0 1rem;
}

/* ---------- Content wrappers ------------------------------------------ */

.agent-content-wrapper[b-lk5sxnsalz] {
    max-width: 1440px;
    margin: 0 auto;
    padding: 1.25rem 1rem;
}

.section-title[b-lk5sxnsalz] {
    color: var(--rently-primary-darken);
    font-weight: 700;
    font-size: clamp(1.5rem, 3vw, 2rem);
    margin: 0 0 0.75rem 0;
}

.section-title--on-dark[b-lk5sxnsalz] {
    color: #fff;
}

.section-body-lead[b-lk5sxnsalz] {
    color: var(--rently-primary-darken);
    font-size: clamp(1rem, 1.8vw, 1.3rem);
    line-height: 1.55;
    margin: 0 0 1rem 0;
}

.section-body-lead--compact[b-lk5sxnsalz] {
    margin-bottom: 1.5rem;
}

/* ---------- Responsibility cards -------------------------------------- */

[b-lk5sxnsalz] .responsibilities-grid {
    margin-top: 1rem;
}

[b-lk5sxnsalz] .responsibility-item {
    display: flex;
    justify-content: center;
    padding-top: 48px; /* room for icon to overhang top */
}

[b-lk5sxnsalz] .responsibility-card {
    position: relative;
    background: #35a0ae; /* var() does not resolve reliably on MudPaper — hard brand color */
    color: #fff;
    border-radius: 16px;
    width: 100%;
    max-width: 260px;
    padding: 3rem 1.25rem 1.25rem 1.25rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    height: 100%;
}

[b-lk5sxnsalz] .responsibility-card .responsibility-title,
[b-lk5sxnsalz] .responsibility-card .responsibility-desc {
    color: #ffffff;
}

.responsibility-icon[b-lk5sxnsalz] {
    position: absolute;
    top: -36px;
    left: 50%;
    transform: translateX(-50%);
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: var(--rently-secondary);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.responsibility-icon img[b-lk5sxnsalz] {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: transparent;
    object-fit: contain;
}

.responsibility-title[b-lk5sxnsalz] {
    font-weight: 700;
    font-size: 1.05rem;
    margin-bottom: 0.5rem;
    line-height: 1.25;
}

.responsibility-desc[b-lk5sxnsalz] {
    font-size: 0.94rem;
    line-height: 1.45;
    margin: 0;
    color: rgba(255, 255, 255, 0.95);
}

/* ---------- Commission section ---------------------------------------- */

.commission-section[b-lk5sxnsalz] {
    position: relative;
    margin: 1rem 0;
    min-height: 480px;
    overflow: hidden;
    background: var(--rently-primary);
}

.commission-bg[b-lk5sxnsalz] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
    opacity: 0.95;
    pointer-events: none;
}

.commission-content[b-lk5sxnsalz] {
    position: relative;
    z-index: 1;
    padding: 2.5rem 1rem;
    max-width: 1440px;
    margin: 0 auto;
}

.commission-title[b-lk5sxnsalz] {
    color: #fff;
    font-weight: 700;
    font-size: clamp(1.5rem, 3vw, 2rem);
    margin: 0 0 0.5rem 0;
}

.commission-subtitle[b-lk5sxnsalz] {
    color: #fff;
    font-size: clamp(1rem, 1.8vw, 1.25rem);
    line-height: 1.5;
    margin: 0 0 1.5rem 0;
}

[b-lk5sxnsalz] .commission-grid {
    margin-top: 1rem;
}

.commission-cell[b-lk5sxnsalz] {
    text-align: center;
    padding: 0.85rem 0.5rem;
    border-radius: 8px;
    min-height: 56px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    word-break: break-word;
}

.commission-cell--header[b-lk5sxnsalz] {
    background: var(--rently-secondary);
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
}

.commission-cell--body[b-lk5sxnsalz] {
    background: #fff;
    color: #256f7a;
    font-size: 1rem;
}

.commission-cell__label[b-lk5sxnsalz] {
    display: none;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    opacity: 0.6;
    margin-bottom: 0.25rem;
}

.commission-cell__value[b-lk5sxnsalz] {
    line-height: 1.25;
}

/* ---------- Join section ---------------------------------------------- */

[b-lk5sxnsalz] .join-section {
    max-width: 1440px;
    margin: 1rem auto;
    min-height: 420px;
}

[b-lk5sxnsalz] .join-section__col {
    padding: 2rem 1.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

[b-lk5sxnsalz] .join-section__col--why {
    background: #ffffff;
    color: #256f7a;
}

[b-lk5sxnsalz] .join-section__col--how {
    background-color: #EF412c;
    background-image: url('/images/Icon_Background_Red_Fade.png');
    background-size: cover;
    background-position: center;
    color: #fff;
}

[b-lk5sxnsalz] .join-point {
    margin-bottom: 1.25rem;
}

[b-lk5sxnsalz] .join-point__title {
    font-weight: 700;
    font-size: 1.08rem;
    margin-bottom: 0.25rem;
}

[b-lk5sxnsalz] .join-point__body {
    color: #256f7a;
    font-size: 1rem;
    line-height: 1.5;
}

[b-lk5sxnsalz] .join-point--on-dark .join-point__title,
[b-lk5sxnsalz] .join-point--on-dark .join-point__body {
    color: #ffffff;
}

/* ---------- Responsive: tablet (>= 768px) ----------------------------- */

@media (min-width: 768px) {
    .banner-content[b-lk5sxnsalz] {
        padding: 2.5rem 3rem;
    }

    .agent-content-wrapper[b-lk5sxnsalz] {
        padding: 2rem 2rem;
    }

    .section-ribbon[b-lk5sxnsalz] {
        height: 72px;
    }
}

/* ---------- Responsive: desktop (>= 1200px) --------------------------- */

@media (min-width: 1200px) {
    .banner-content[b-lk5sxnsalz] {
        padding: 3rem 3.5rem;
    }

    [b-lk5sxnsalz] .join-section__col {
        padding: 2.5rem 3rem;
    }

    /* Desktop: connected header rounding on commission grid */
    [b-lk5sxnsalz] .commission-grid > div:nth-child(1) .commission-cell--header {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    [b-lk5sxnsalz] .commission-grid > div:nth-child(4) .commission-cell--header {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    [b-lk5sxnsalz] .commission-grid > div:nth-child(2) .commission-cell--header,
    [b-lk5sxnsalz] .commission-grid > div:nth-child(3) .commission-cell--header {
        border-radius: 0;
    }
}

/* ---------- Mobile-only overrides (< 768px) --------------------------- */

@media (max-width: 767.98px) {
    .agent-banner-image[b-lk5sxnsalz] {
        min-height: 240px;
        max-height: 360px;
    }

    .banner-content[b-lk5sxnsalz] {
        padding: 1rem;
    }

    .banner-cta-row[b-lk5sxnsalz] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-lk5sxnsalz] .agent-cta-btn--banner {
        flex: 1 1 auto;
        width: 100%;
    }

    /* Stacked commission "table" on mobile — show label/value pairs */
    [b-lk5sxnsalz] .commission-grid [role="columnheader"] {
        display: none;
    }

    .commission-cell__label[b-lk5sxnsalz] {
        display: block;
    }

    .commission-cell--body[b-lk5sxnsalz] {
        align-items: flex-start;
        text-align: left;
    }
}

/* ---------- Reduced-motion guard -------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    [b-lk5sxnsalz] .agent-cta-btn,
    [b-lk5sxnsalz] .agent-cta-btn--banner,
    [b-lk5sxnsalz] .responsibility-card {
        transition: none !important;
    }
}

@media (prefers-reduced-motion: no-preference) {
    [b-lk5sxnsalz] .agent-cta-btn--banner {
        transition: box-shadow 200ms ease, background-color 200ms ease;
    }
}
/* /Components/Pages/OnboardingAgent/CommissionDashboard.razor.rz.scp.css */
/* ---------- Tokens on wrapper (not :root — scoped CSS silently drops :root) ---------- */
.cd-wrapper[b-vdaicvd09l] {
    --cd-primary: #35a0ae;
    --cd-primary-dark: #256f7a;
    --cd-primary-soft: rgba(53, 160, 174, 0.08);
    --cd-accent: #EF412c;
    --cd-warning: #f59e0b;
    --cd-warning-soft: rgba(245, 158, 11, 0.12);
    --cd-info: #3b82f6;
    --cd-info-soft: rgba(59, 130, 246, 0.12);
    --cd-success: #15803d;
    --cd-success-soft: rgba(21, 128, 61, 0.12);
    --cd-danger: #b91c1c;
    --cd-danger-soft: rgba(185, 28, 28, 0.12);
    --cd-ink: #1a2b2e;
    --cd-muted: #64748b;
    --cd-border: #e2e8f0;
    --cd-surface: #ffffff;
    --cd-surface-alt: #f8fafc;
    --cd-radius: 8px;
    --cd-radius-lg: 12px;

    font-family: 'Montserrat', sans-serif;
    color: var(--cd-ink);
    background: var(--cd-surface-alt);
    min-height: calc(100vh - 64px);
}

/* ---------- Hero band ---------- */
.cd-wrapper .cd-hero-band[b-vdaicvd09l] {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, var(--cd-primary) 0%, var(--cd-primary-dark) 100%);
    padding: 40px 32px;
}

.cd-wrapper .cd-hero-pattern[b-vdaicvd09l] {
    position: absolute;
    inset: 0;
    background-image: url('/images/Icon_Dark_Green_TransparentBg_40.png');
    background-repeat: repeat;
    opacity: 0.08;
    pointer-events: none;
}

.cd-wrapper .cd-hero-inner[b-vdaicvd09l] {
    position: relative;
    z-index: 1;
    max-width: 1440px;
    margin: 0 auto;
}

/* Breadcrumbs inside hero: white-on-teal */
.cd-wrapper .cd-hero-inner[b-vdaicvd09l]  .mud-breadcrumbs {
    padding: 0;
    margin-bottom: 12px;
}

.cd-wrapper .cd-hero-inner[b-vdaicvd09l]  .mud-breadcrumb-item,
.cd-wrapper .cd-hero-inner[b-vdaicvd09l]  .mud-breadcrumb-item a,
.cd-wrapper .cd-hero-inner[b-vdaicvd09l]  .mud-breadcrumb-separator span,
.cd-wrapper .cd-hero-inner[b-vdaicvd09l]  .mud-breadcrumb-item .mud-icon-root {
    color: rgba(255, 255, 255, 0.92) !important;
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    text-decoration: none;
}

.cd-wrapper .cd-hero-inner[b-vdaicvd09l]  .mud-breadcrumb-item.mud-disabled,
.cd-wrapper .cd-hero-inner[b-vdaicvd09l]  .mud-breadcrumb-item.mud-disabled a {
    color: #ffffff !important;
    font-weight: 600;
}

.cd-wrapper .cd-hero-inner[b-vdaicvd09l]  .mud-breadcrumb-item a:hover {
    color: #ffffff !important;
    text-decoration: underline;
}

.cd-wrapper .cd-hero-title[b-vdaicvd09l] {
    margin: 0;
    color: #ffffff;
    font-size: 2rem;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.cd-wrapper .cd-hero-subtitle[b-vdaicvd09l] {
    margin: 8px 0 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: 1rem;
    line-height: 1.5;
    max-width: 680px;
}

/* ---------- Content container ---------- */
.cd-wrapper .cd-content-container[b-vdaicvd09l] {
    max-width: 1440px;
    margin: 0 auto;
    padding: 32px;
}

/* ---------- Skeleton loading ---------- */
.cd-wrapper .cd-skeleton-grid[b-vdaicvd09l] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

.cd-wrapper .cd-skeleton-grid--2[b-vdaicvd09l] {
    grid-template-columns: 2fr 1fr;
}

@media (max-width: 1199px) {
    .cd-wrapper .cd-skeleton-grid[b-vdaicvd09l],
    .cd-wrapper .cd-skeleton-grid--2[b-vdaicvd09l] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 599px) {
    .cd-wrapper .cd-skeleton-grid[b-vdaicvd09l],
    .cd-wrapper .cd-skeleton-grid--2[b-vdaicvd09l] {
        grid-template-columns: 1fr;
    }
}

/* ---------- State alerts ---------- */
.cd-wrapper .cd-state-alert[b-vdaicvd09l] {
    border-radius: var(--cd-radius);
    font-family: 'Montserrat', sans-serif;
}

.cd-wrapper .cd-state-alert-body[b-vdaicvd09l] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

/* Retry button — scope via parent plain div */
.cd-wrapper .cd-state-alert-body[b-vdaicvd09l]  .mud-button-root {
    min-height: 44px !important;
    text-transform: none !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    border-radius: var(--cd-radius) !important;
}

/* ---------- Metrics grid ---------- */
.cd-wrapper .cd-metrics-grid[b-vdaicvd09l] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    margin-bottom: 24px;
}

@media (max-width: 1199px) {
    .cd-wrapper .cd-metrics-grid[b-vdaicvd09l] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 599px) {
    .cd-wrapper .cd-metrics-grid[b-vdaicvd09l] {
        grid-template-columns: 1fr;
    }
}

.cd-wrapper .cd-metric-card[b-vdaicvd09l] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 20px;
    background: var(--cd-surface);
    border: 1px solid var(--cd-border);
    border-radius: var(--cd-radius);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.cd-wrapper .cd-metric-card:hover[b-vdaicvd09l] {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.08);
}

.cd-wrapper .cd-metric-icon[b-vdaicvd09l] {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #ffffff;
}

.cd-wrapper .cd-metric-icon--primary[b-vdaicvd09l] { background: var(--cd-primary); }
.cd-wrapper .cd-metric-icon--info[b-vdaicvd09l]    { background: var(--cd-info); }
.cd-wrapper .cd-metric-icon--warning[b-vdaicvd09l] { background: var(--cd-warning); }
.cd-wrapper .cd-metric-icon--success[b-vdaicvd09l] { background: var(--cd-success); }
.cd-wrapper .cd-metric-icon--danger[b-vdaicvd09l]  { background: var(--cd-danger); }
.cd-wrapper .cd-metric-icon--muted[b-vdaicvd09l]   { background: var(--cd-muted); }

.cd-wrapper .cd-metric-icon[b-vdaicvd09l]  .mud-icon-root {
    font-size: 24px;
    color: #ffffff;
}

.cd-wrapper .cd-metric-body[b-vdaicvd09l] {
    min-width: 0;
    flex: 1;
}

.cd-wrapper .cd-metric-label[b-vdaicvd09l] {
    color: var(--cd-muted);
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 4px;
}

.cd-wrapper .cd-metric-value[b-vdaicvd09l] {
    color: var(--cd-ink);
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 4px;
    overflow-wrap: break-word;
}

.cd-wrapper .cd-metric-value--sm[b-vdaicvd09l] {
    font-size: 1.25rem;
}

.cd-wrapper .cd-metric-caption[b-vdaicvd09l] {
    color: var(--cd-muted);
    font-size: 0.8125rem;
    line-height: 1.4;
}

/* ---------- Main grid (chart + goals) ---------- */
.cd-wrapper .cd-main-grid[b-vdaicvd09l] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 20px;
    margin-bottom: 24px;
}

@media (max-width: 1199px) {
    .cd-wrapper .cd-main-grid[b-vdaicvd09l] {
        grid-template-columns: 1fr;
    }
}

/* ---------- Data card ---------- */
.cd-wrapper .cd-data-card[b-vdaicvd09l] {
    background: var(--cd-surface);
    border: 1px solid var(--cd-border);
    border-radius: var(--cd-radius);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.cd-wrapper .cd-data-header[b-vdaicvd09l] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    background: var(--cd-surface-alt);
    border-bottom: 1px solid var(--cd-border);
    flex-wrap: wrap;
}

.cd-wrapper .cd-data-title[b-vdaicvd09l] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.cd-wrapper .cd-data-title .cd-data-icon[b-vdaicvd09l]  .mud-icon-root {
    color: var(--cd-primary);
    font-size: 22px;
}

.cd-wrapper .cd-data-title-text[b-vdaicvd09l] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--cd-ink);
    font-family: 'Montserrat', sans-serif;
}

.cd-wrapper .cd-data-count[b-vdaicvd09l] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--cd-muted);
    background: var(--cd-surface);
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid var(--cd-border);
    white-space: nowrap;
}

.cd-wrapper .cd-data-body[b-vdaicvd09l] {
    padding: 20px;
    flex: 1;
}

/* ---------- Chart card ---------- */
.cd-wrapper .cd-chart-card .cd-data-body[b-vdaicvd09l]  .mud-chart {
    width: 100%;
    min-height: 320px;
    overflow: visible;
}

.cd-wrapper .cd-chart-card .cd-data-body[b-vdaicvd09l]  svg {
    font-family: 'Montserrat', sans-serif;
}

.cd-wrapper .cd-chart-card .cd-data-body[b-vdaicvd09l]  .mud-chart-bar,
.cd-wrapper .cd-chart-card .cd-data-body[b-vdaicvd09l]  rect {
    transition: fill 0.2s ease;
}

/* ---------- Goals card ---------- */
.cd-wrapper .cd-goals-card .cd-goal-item + .cd-goal-item[b-vdaicvd09l] {
    margin-top: 20px;
}

.cd-wrapper .cd-goal-row[b-vdaicvd09l] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}

.cd-wrapper .cd-goal-label[b-vdaicvd09l] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--cd-ink);
}

.cd-wrapper .cd-goal-value[b-vdaicvd09l] {
    font-size: 0.8125rem;
    color: var(--cd-muted);
    font-weight: 500;
}

/* Progress bars — scope from parent .cd-goal-item (Mud-child scope gotcha) */
.cd-wrapper .cd-goal-item[b-vdaicvd09l]  .mud-progress-linear,
.cd-wrapper .cd-goal-item[b-vdaicvd09l]  .mud-progress-linear-bars {
    height: 8px;
    border-radius: 999px;
}

.cd-wrapper .cd-goal-item[b-vdaicvd09l]  .mud-progress-linear {
    background: var(--cd-surface-alt) !important;
    overflow: hidden;
}

.cd-wrapper .cd-goal-hint[b-vdaicvd09l] {
    display: block;
    margin-top: 6px;
    font-size: 0.75rem;
    color: var(--cd-muted);
}

.cd-wrapper .cd-goals-note[b-vdaicvd09l] {
    margin: 20px 0 0;
    padding-top: 16px;
    border-top: 1px dashed var(--cd-border);
    font-size: 0.8125rem;
    color: var(--cd-muted);
    line-height: 1.5;
}

/* ---------- Empty states ---------- */
.cd-wrapper .cd-empty-state[b-vdaicvd09l] {
    display: grid;
    place-items: center;
    gap: 10px;
    padding: 40px 16px;
    text-align: center;
    min-height: 220px;
}

.cd-wrapper .cd-empty-state--compact[b-vdaicvd09l] {
    min-height: 140px;
    padding: 24px 16px;
}

.cd-wrapper .cd-empty-icon[b-vdaicvd09l]  .mud-icon-root {
    font-size: 40px;
    color: var(--cd-border);
}

.cd-wrapper .cd-empty-title[b-vdaicvd09l] {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--cd-ink);
}

.cd-wrapper .cd-empty-desc[b-vdaicvd09l] {
    margin: 0;
    font-size: 0.8125rem;
    color: var(--cd-muted);
    max-width: 360px;
}

/* ---------- Data grid (2-col side-by-side) ---------- */
.cd-wrapper .cd-data-grid[b-vdaicvd09l] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    margin-bottom: 24px;
}

.cd-wrapper .cd-data-grid--full[b-vdaicvd09l] {
    grid-template-columns: 1fr;
}

@media (max-width: 1199px) {
    .cd-wrapper .cd-data-grid[b-vdaicvd09l] {
        grid-template-columns: 1fr;
    }
}

/* ---------- Item list (recent commissions / referred stores) ---------- */
.cd-wrapper .cd-item-list[b-vdaicvd09l] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cd-wrapper .cd-item[b-vdaicvd09l] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: var(--cd-surface);
    border: 1px solid var(--cd-border);
    border-radius: var(--cd-radius);
}

.cd-wrapper .cd-item-main[b-vdaicvd09l] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cd-wrapper .cd-item-title[b-vdaicvd09l] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--cd-ink);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cd-wrapper .cd-item-sub[b-vdaicvd09l] {
    font-size: 0.8125rem;
    color: var(--cd-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cd-wrapper .cd-item-amount[b-vdaicvd09l] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--cd-primary-dark);
    white-space: nowrap;
}

/* Item link buttons — scope via parent plain elements (Mud-child scope gotcha) */
.cd-wrapper .cd-item[b-vdaicvd09l]  .mud-button-root,
.cd-wrapper .cd-data-table[b-vdaicvd09l]  .mud-button-root,
.cd-wrapper .cd-data-header[b-vdaicvd09l]  .mud-button-root {
    text-transform: none !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    color: var(--cd-primary-dark) !important;
    min-height: 36px !important;
    padding: 4px 12px !important;
    border-radius: var(--cd-radius) !important;
}

.cd-wrapper .cd-item[b-vdaicvd09l]  .mud-button-root:hover,
.cd-wrapper .cd-data-table[b-vdaicvd09l]  .mud-button-root:hover {
    background: var(--cd-primary-soft) !important;
}

@media (max-width: 599px) {
    .cd-wrapper .cd-item[b-vdaicvd09l]  .mud-button-root,
    .cd-wrapper .cd-data-table[b-vdaicvd09l]  .mud-button-root {
        min-height: 44px !important;
    }
}

/* ---------- Search field ---------- */
.cd-wrapper .cd-header-actions[b-vdaicvd09l] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}

.cd-wrapper .cd-search[b-vdaicvd09l] {
    min-width: 240px;
    max-width: 320px;
}

.cd-wrapper .cd-search[b-vdaicvd09l]  .mud-input-control {
    font-family: 'Montserrat', sans-serif;
}

.cd-wrapper .cd-search[b-vdaicvd09l]  .mud-input-outlined-border {
    border-radius: var(--cd-radius);
}

.cd-wrapper .cd-search[b-vdaicvd09l]  .mud-input.mud-input-outlined:focus-within .mud-input-outlined-border {
    border-color: var(--cd-primary);
}

@media (max-width: 599px) {
    .cd-wrapper .cd-search[b-vdaicvd09l] {
        min-width: 100%;
        max-width: 100%;
    }
}

/* ---------- Data table ---------- */
.cd-wrapper .cd-table-scroll[b-vdaicvd09l] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.cd-wrapper .cd-data-table[b-vdaicvd09l] {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Montserrat', sans-serif;
}

.cd-wrapper .cd-data-table thead tr[b-vdaicvd09l] {
    background: transparent;
}

.cd-wrapper .cd-data-table th[b-vdaicvd09l] {
    text-align: left;
    padding: 10px 12px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--cd-muted);
    border-bottom: 1px solid var(--cd-border);
    background: var(--cd-surface);
}

.cd-wrapper .cd-data-table td[b-vdaicvd09l] {
    padding: 12px;
    font-size: 0.9375rem;
    color: var(--cd-ink);
    border-bottom: 1px solid var(--cd-border);
    vertical-align: middle;
}

.cd-wrapper .cd-data-table tbody tr:last-child td[b-vdaicvd09l] {
    border-bottom: none;
}

.cd-wrapper .cd-data-table tbody tr:hover[b-vdaicvd09l] {
    background-color: var(--cd-primary-soft);
}

.cd-wrapper .cd-col-action[b-vdaicvd09l] {
    text-align: right;
}

/* User cell */
.cd-wrapper .cd-user-cell[b-vdaicvd09l] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cd-wrapper .cd-user-avatar[b-vdaicvd09l] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--cd-primary-soft);
    color: var(--cd-primary-dark);
    font-weight: 700;
    font-size: 0.75rem;
    letter-spacing: 0.02em;
    display: grid;
    place-items: center;
    flex-shrink: 0;
}

.cd-wrapper .cd-user-name[b-vdaicvd09l] {
    font-weight: 600;
    color: var(--cd-ink);
}

.cd-wrapper .cd-muted[b-vdaicvd09l] {
    color: var(--cd-muted);
}

/* ---------- Mobile: table → stacked cards ---------- */
@media (max-width: 599px) {
    .cd-wrapper .cd-data-table thead[b-vdaicvd09l] {
        display: none;
    }

    .cd-wrapper .cd-data-table[b-vdaicvd09l],
    .cd-wrapper .cd-data-table tbody[b-vdaicvd09l],
    .cd-wrapper .cd-data-table tr[b-vdaicvd09l],
    .cd-wrapper .cd-data-table td[b-vdaicvd09l] {
        display: block;
        width: 100%;
    }

    .cd-wrapper .cd-data-table tbody tr[b-vdaicvd09l] {
        margin-bottom: 12px;
        border: 1px solid var(--cd-border);
        border-radius: var(--cd-radius);
        padding: 4px;
        background: var(--cd-surface);
    }

    .cd-wrapper .cd-data-table td[b-vdaicvd09l] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        padding: 10px 12px;
        border-bottom: 1px solid var(--cd-surface-alt);
    }

    .cd-wrapper .cd-data-table tbody tr td:last-child[b-vdaicvd09l] {
        border-bottom: none;
    }

    .cd-wrapper .cd-data-table td[b-vdaicvd09l]::before {
        content: attr(data-label);
        font-size: 0.6875rem;
        font-weight: 700;
        color: var(--cd-muted);
        text-transform: uppercase;
        letter-spacing: 0.04em;
        flex-shrink: 0;
    }

    .cd-wrapper .cd-data-table td.cd-col-action[b-vdaicvd09l] {
        justify-content: flex-end;
    }

    .cd-wrapper .cd-data-table td.cd-col-action[b-vdaicvd09l]::before {
        display: none;
    }

    .cd-wrapper .cd-user-cell[b-vdaicvd09l] {
        justify-content: flex-end;
        flex-direction: row-reverse;
    }
}

/* ---------- Tablet padding tweak ---------- */
@media (max-width: 959px) {
    .cd-wrapper .cd-content-container[b-vdaicvd09l] {
        padding: 24px 16px;
    }

    .cd-wrapper .cd-hero-band[b-vdaicvd09l] {
        padding: 32px 20px;
    }

    .cd-wrapper .cd-hero-title[b-vdaicvd09l] {
        font-size: 1.5rem;
    }

    .cd-wrapper .cd-hero-subtitle[b-vdaicvd09l] {
        font-size: 0.9375rem;
    }
}

@media (max-width: 599px) {
    .cd-wrapper .cd-content-container[b-vdaicvd09l] {
        padding: 20px 12px;
    }

    .cd-wrapper .cd-hero-band[b-vdaicvd09l] {
        padding: 28px 16px;
    }

    .cd-wrapper .cd-metric-value[b-vdaicvd09l] {
        font-size: 1.5rem;
    }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
    .cd-wrapper .cd-metric-card[b-vdaicvd09l],
    .cd-wrapper .cd-chart-card .cd-data-body[b-vdaicvd09l]  rect {
        transition: none;
    }
}
/* /Components/Pages/OnboardingAgent/CreateAgentReview.razor.rz.scp.css */
/* ============================================================
   CreateAgentReview (Test-195) — Rently SA module
   Tokens on .car-wrapper (NOT :root — scoped-CSS silent-fail gotcha)
   ::deep pinned to plain page-rendered divs (NOT MudBlazor child classes)
   ============================================================ */

.car-wrapper[b-dd566lbfl2] {
    --car-primary: #35a0ae;
    --car-primary-dark: #256f7a;
    --car-primary-soft: rgba(53, 160, 174, 0.12);
    --car-ink: #0f172a;
    --car-muted: #64748b;
    --car-border: #e2e8f0;
    --car-border-strong: #cbd5e1;
    --car-surface: #ffffff;
    --car-surface-raised: #f8fafc;
    --car-danger: #dc2626;
    --car-success: #16a34a;
    --car-warning: #f59e0b;
    --car-radius: 8px;
    --car-radius-lg: 16px;
    --car-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 3px rgba(15, 23, 42, 0.06);
    --car-shadow-md: 0 4px 6px rgba(15, 23, 42, 0.05), 0 10px 15px rgba(15, 23, 42, 0.05);

    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--car-ink);
    min-height: 100%;
    padding-bottom: 48px;
}

/* =========================================================
   Hero band — full-bleed teal gradient
   ========================================================= */
.car-hero-band[b-dd566lbfl2] {
    background: linear-gradient(135deg, var(--car-primary) 0%, var(--car-primary-dark) 100%);
    color: #ffffff;
    padding: 48px 24px 60px;
    position: relative;
    overflow: hidden;
}

.car-hero-inner[b-dd566lbfl2] {
    max-width: 960px;
    margin: 0 auto;
}

.car-hero-title[b-dd566lbfl2] {
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(1.75rem, 2.5vw + 1rem, 2.25rem);
    font-weight: 700;
    line-height: 1.2;
    margin: 12px 0 8px;
    color: #ffffff;
    letter-spacing: -0.01em;
}

.car-hero-subtitle[b-dd566lbfl2] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.92);
    margin: 0;
    max-width: 640px;
}

/* Breadcrumbs — ::deep re-scoped to .car-hero-inner (plain div we render,
   carries the [b-xxxxx] scope attribute). Passing Class="car-breadcrumbs"
   INTO MudBreadcrumbs does NOT scope-attribute the child DOM —
   see feedback_blazor_scoped_css_class_on_mud_child.md */
.car-hero-inner[b-dd566lbfl2]  .mud-breadcrumbs {
    padding: 0;
    margin: 0;
    background: transparent;
}

.car-hero-inner[b-dd566lbfl2]  .mud-breadcrumb-item,
.car-hero-inner[b-dd566lbfl2]  .mud-breadcrumb-item a {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
}

.car-hero-inner[b-dd566lbfl2]  .mud-breadcrumb-item a,
.car-hero-inner[b-dd566lbfl2]  .mud-breadcrumb-item .mud-breadcrumb-item-link,
.car-hero-inner[b-dd566lbfl2]  .mud-breadcrumb-item a.mud-typography {
    color: rgba(255, 255, 255, 0.88) !important;
}

.car-hero-inner[b-dd566lbfl2]  .mud-breadcrumb-item a:hover,
.car-hero-inner[b-dd566lbfl2]  .mud-breadcrumb-item a:focus-visible {
    color: #ffffff !important;
    text-decoration: underline;
}

.car-hero-inner[b-dd566lbfl2]  .mud-breadcrumb-item.mud-disabled,
.car-hero-inner[b-dd566lbfl2]  .mud-breadcrumb-item--disabled,
.car-hero-inner[b-dd566lbfl2]  .mud-breadcrumb-item.mud-disabled .mud-typography {
    color: rgba(255, 255, 255, 0.78) !important;
    font-weight: 600;
}

.car-hero-inner[b-dd566lbfl2]  .mud-breadcrumb-separator {
    color: rgba(255, 255, 255, 0.55) !important;
    font-weight: 400;
    margin: 0 6px;
}

/* =========================================================
   Content wrapper — overlaps hero for card-float effect
   ========================================================= */
.car-content[b-dd566lbfl2] {
    max-width: 960px;
    margin: -32px auto 0;
    padding: 0 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    position: relative;
    z-index: 1;
}

/* =========================================================
   Agent context card
   ========================================================= */
.car-agent-card[b-dd566lbfl2] {
    display: flex;
    align-items: center;
    gap: 16px;
    background: var(--car-surface);
    border: 1px solid var(--car-border);
    border-radius: var(--car-radius-lg);
    box-shadow: var(--car-shadow-md);
    padding: 20px 24px;
}

.car-agent-card--skeleton[b-dd566lbfl2] {
    box-shadow: var(--car-shadow-sm);
}

.car-agent-card[b-dd566lbfl2]  .mud-avatar.car-agent-avatar {
    width: 72px;
    height: 72px;
    background: var(--car-primary-soft);
    color: var(--car-primary-dark);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 1.25rem;
    flex-shrink: 0;
}

.car-agent-avatar-img[b-dd566lbfl2] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.car-agent-card-text[b-dd566lbfl2] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    flex: 1;
}

.car-agent-name[b-dd566lbfl2] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.3;
    margin: 0;
    color: var(--car-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.car-agent-code[b-dd566lbfl2] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.875rem;
    line-height: 1.4;
    color: var(--car-muted);
    margin: 0;
}

.car-agent-code-value[b-dd566lbfl2] {
    color: var(--car-primary-dark);
    font-weight: 600;
    letter-spacing: 0.01em;
}

/* =========================================================
   Form layout
   ========================================================= */
.car-form[b-dd566lbfl2] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.car-form-card[b-dd566lbfl2] {
    background: var(--car-surface);
    border: 1px solid var(--car-border);
    border-radius: var(--car-radius-lg);
    box-shadow: var(--car-shadow-sm);
    padding: 24px;
}

.car-section-title[b-dd566lbfl2] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--car-ink);
    margin: 0 0 4px;
}

.car-section-hint[b-dd566lbfl2] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.875rem;
    color: var(--car-muted);
    margin: 0 0 16px;
}

/* =========================================================
   Rating rows
   ========================================================= */
.car-rating-row[b-dd566lbfl2] {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 16px;
    padding: 14px 0;
    border-bottom: 1px solid var(--car-border);
}

.car-rating-row:last-of-type[b-dd566lbfl2] {
    border-bottom: none;
    padding-bottom: 4px;
}

.car-rating-label-block[b-dd566lbfl2] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.car-rating-label[b-dd566lbfl2] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: var(--car-ink);
    line-height: 1.4;
    display: block;
}

.car-rating-helper[b-dd566lbfl2] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8125rem;
    color: var(--car-muted);
    line-height: 1.4;
}

.car-rating-control[b-dd566lbfl2] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.car-rating-value[b-dd566lbfl2] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--car-muted);
    min-width: 42px;
    text-align: right;
}

/* MudRating ::deep pinned to plain .car-form-card wrapper (scope-attr gotcha workaround).
   MudBlazor's "filled" star signal is the checked radio input, NOT a class on the item.
   Using :has() to colour the checked item + all earlier siblings teal. */
.car-form-card[b-dd566lbfl2]  .mud-rating {
    gap: 2px;
}

.car-form-card[b-dd566lbfl2]  .mud-rating-item {
    padding: 6px;
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--car-border-strong) !important;
    transition: color 0.15s ease, transform 0.15s ease;
}

.car-form-card[b-dd566lbfl2]  .mud-rating-item .mud-icon-root {
    width: 28px;
    height: 28px;
    font-size: 28px;
    color: inherit !important;
}

/* The item whose radio is checked, and every earlier sibling item */
.car-form-card[b-dd566lbfl2]  .mud-rating-item:has(input[type="radio"]:checked),
.car-form-card[b-dd566lbfl2]  .mud-rating-item:has(~ .mud-rating-item input[type="radio"]:checked) {
    color: var(--car-primary) !important;
}

.car-form-card[b-dd566lbfl2]  .mud-rating-item:hover,
.car-form-card[b-dd566lbfl2]  .mud-rating-item:hover ~ .mud-rating-item {
    /* no-op — hover handled below */
}

.car-form-card[b-dd566lbfl2]  .mud-rating-item:hover:not(:has(input[type="radio"]:checked)) {
    color: var(--car-primary-dark) !important;
}

.car-form-card[b-dd566lbfl2]  .mud-rating-item:hover .mud-icon-root {
    transform: scale(1.08);
}

.car-form-card[b-dd566lbfl2]  .mud-rating-item:focus-within {
    outline: 2px solid var(--car-primary);
    outline-offset: 2px;
    border-radius: var(--car-radius);
}

/* =========================================================
   Text fields (MudTextField outlined variant)
   ========================================================= */
.car-field[b-dd566lbfl2] {
    margin: 0 0 20px;
}

.car-field--textarea[b-dd566lbfl2] {
    margin-bottom: 12px;
}

.car-form-card[b-dd566lbfl2]  .mud-input-outlined .mud-input-outlined-border {
    border-radius: var(--car-radius);
    border-color: var(--car-border-strong);
}

.car-form-card[b-dd566lbfl2]  .mud-input-outlined:hover:not(.mud-disabled):not(.mud-error) .mud-input-outlined-border {
    border-color: var(--car-primary);
}

.car-form-card[b-dd566lbfl2]  .mud-input-outlined.mud-focused:not(.mud-error) .mud-input-outlined-border {
    border-color: var(--car-primary) !important;
    border-width: 2px;
}

.car-form-card[b-dd566lbfl2]  .mud-input-label.mud-focused:not(.mud-error) {
    color: var(--car-primary) !important;
}

.car-form-card[b-dd566lbfl2]  .mud-input-control input,
.car-form-card[b-dd566lbfl2]  .mud-input-control textarea {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    color: var(--car-ink);
}

.car-form-card[b-dd566lbfl2]  .mud-input-helper-text {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.75rem;
    color: var(--car-muted);
}

.car-form-card[b-dd566lbfl2]  .mud-input-helper-text.mud-input-error {
    color: var(--car-danger);
}

/* =========================================================
   Action buttons
   ========================================================= */
.car-actions[b-dd566lbfl2] {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 20px;
    flex-wrap: wrap;
}

.car-form-card[b-dd566lbfl2]  .mud-button-root.car-btn {
    border-radius: var(--car-radius);
    min-height: 44px;
    padding: 0 24px;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
}

.car-form-card[b-dd566lbfl2]  .car-btn--submit.mud-button-filled-primary {
    background-color: var(--car-primary) !important;
    color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(53, 160, 174, 0.3);
}

.car-form-card[b-dd566lbfl2]  .car-btn--submit.mud-button-filled-primary:hover:not(:disabled) {
    background-color: var(--car-primary-dark) !important;
    box-shadow: 0 2px 6px rgba(53, 160, 174, 0.4);
}

.car-form-card[b-dd566lbfl2]  .car-btn--submit:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    box-shadow: none;
}

.car-form-card[b-dd566lbfl2]  .car-btn--cancel {
    color: var(--car-muted) !important;
    border-color: var(--car-border-strong) !important;
    background-color: transparent !important;
}

.car-form-card[b-dd566lbfl2]  .car-btn--cancel:hover:not(:disabled) {
    background-color: var(--car-surface-raised) !important;
    color: var(--car-ink) !important;
    border-color: var(--car-border-strong) !important;
}

.car-btn-spinner[b-dd566lbfl2] {
    margin-right: 8px;
}

/* =========================================================
   Alerts (Error / Success / Warning)
   ========================================================= */
.car-wrapper[b-dd566lbfl2]  .car-alert.mud-alert {
    border-radius: var(--car-radius-lg) !important;
    border: 1px solid var(--car-border);
    box-shadow: var(--car-shadow-sm);
    font-family: 'Montserrat', sans-serif;
}

.car-wrapper[b-dd566lbfl2]  .car-alert .mud-alert-message {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    line-height: 1.4;
    width: 100%;
}

.car-alert-text[b-dd566lbfl2] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    line-height: 1.5;
    display: block;
}

.car-alert-body[b-dd566lbfl2] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.car-alert-actions[b-dd566lbfl2] {
    display: flex;
    gap: 8px;
    margin-top: 4px;
    flex-wrap: wrap;
}

.car-wrapper[b-dd566lbfl2]  .car-btn--ghost.mud-button-root {
    min-height: 44px;
    border-radius: var(--car-radius);
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    font-weight: 600;
    text-transform: none;
    padding: 0 20px;
}

/* =========================================================
   Tablet (≤ 959.98px)
   ========================================================= */
@media (max-width: 959.98px) {
    .car-hero-band[b-dd566lbfl2] {
        padding: 40px 16px 52px;
    }

    .car-content[b-dd566lbfl2] {
        padding: 0 16px;
        margin-top: -24px;
    }

    .car-form-card[b-dd566lbfl2] {
        padding: 20px;
    }

    .car-agent-card[b-dd566lbfl2] {
        padding: 16px 20px;
    }
}

/* =========================================================
   Mobile (≤ 599.98px)
   ========================================================= */
@media (max-width: 599.98px) {
    .car-hero-band[b-dd566lbfl2] {
        padding: 32px 16px 44px;
    }

    .car-hero-title[b-dd566lbfl2] {
        font-size: 1.5rem;
        margin-top: 10px;
    }

    .car-hero-subtitle[b-dd566lbfl2] {
        font-size: 0.9375rem;
    }

    .car-content[b-dd566lbfl2] {
        padding: 0 12px;
        gap: 12px;
    }

    .car-agent-card[b-dd566lbfl2] {
        padding: 14px 16px;
        gap: 12px;
    }

    .car-agent-card[b-dd566lbfl2]  .mud-avatar.car-agent-avatar {
        width: 56px;
        height: 56px;
        font-size: 1.125rem;
    }

    .car-agent-name[b-dd566lbfl2] {
        font-size: 1rem;
    }

    .car-agent-code[b-dd566lbfl2] {
        font-size: 0.8125rem;
    }

    .car-form-card[b-dd566lbfl2] {
        padding: 16px;
    }

    .car-rating-row[b-dd566lbfl2] {
        grid-template-columns: 1fr;
        gap: 4px;
        padding: 14px 0;
    }

    .car-rating-control[b-dd566lbfl2] {
        justify-content: flex-start;
    }

    .car-form-card[b-dd566lbfl2]  .mud-rating-item {
        padding: 4px;
    }

    .car-actions[b-dd566lbfl2] {
        flex-direction: column-reverse;
        gap: 8px;
        margin-top: 16px;
    }

    .car-form-card[b-dd566lbfl2]  .mud-button-root.car-btn {
        width: 100%;
    }

    .car-alert-actions[b-dd566lbfl2] {
        flex-direction: column;
        width: 100%;
    }

    .car-wrapper[b-dd566lbfl2]  .car-btn--ghost.mud-button-root {
        width: 100%;
    }
}

/* =========================================================
   Reduced motion
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
    .car-form-card[b-dd566lbfl2]  .mud-rating-item {
        transition: none;
    }

    .car-form-card[b-dd566lbfl2]  .mud-rating-item:hover .mud-icon-root {
        transform: none;
    }
}
/* /Components/Pages/OnboardingAgent/MyDetails.razor.rz.scp.css */
/* =============================================================
   Agent Details (/SuccessAmbassador/MyDetails) — scoped styles
   Test-188 fix phase. Nordic Control-Panel look, brand teal.
   Mobile-first reflow: profile pic → name+code → CTAs stacked.
   ============================================================= */

/* NOTE: Blazor CSS isolation rewrites `:root` → `:root[b-xxxxx]` which never
   matches anything (`<html>` doesn't carry the scope attribute), so brand
   tokens must live on an element that actually renders in the component
   template. `.agent-wrapper` wraps the whole page; every `.agent-*` selector
   is a descendant of it.

   SECOND GOTCHA (Test-188 follow-up): selectors targeting DOM rendered by
   child MudBlazor components (MudText → <h1>, MudButton → <button>, etc.)
   never match because Blazor CSS isolation appends THIS component's scope
   attribute to every selector, but the child-component DOM carries a
   different scope attribute (or none at all). The fix is `::deep`, which
   tells the rewriter NOT to append the scope attribute to descendants of
   that combinator, letting the rule match any matching descendant regardless
   of scope. Every rule below that targets MudText/MudButton/MudFab/MudAvatar/
   MudIcon/MudTabs/MudTextField/MudSwitch/MudSelect/MudAlert/MudChip output
   uses the pattern `.in-component-ancestor ::deep .target-class`. */
.agent-wrapper[b-pwf55cfvso] {
    --agent-primary: #35a0ae;
    --agent-primary-darken: #256f7a;
    --agent-primary-lighten: #5db2be;
    --agent-secondary: #EF412c;
    --agent-hero-text: #ffffff;
    --agent-surface: #ffffff;
    --agent-bg: #fafafa;
    --agent-text-primary: #2a2a2a;
    --agent-text-secondary: #5e5e5e;
    --agent-divider: #e0e0e0;
    --agent-card-radius: 12px;
    --agent-btn-radius: 8px;
    --agent-card-shadow: rgba(0, 0, 0, 0.06) 0px 2px 8px;
    --agent-card-shadow-hover: rgba(0, 0, 0, 0.1) 0px 4px 14px;
    --agent-profile-border: #ffffff;
    background-color: var(--agent-bg);
    min-height: calc(100vh - 64px);
}

/* ─── Breadcrumbs ─── */
/* .agent-breadcrumbs is a plain <div> WE render; the MudBreadcrumbs child
   inside is unstyled by us, so just pad our wrapper. */
.agent-breadcrumbs[b-pwf55cfvso] {
    padding: 18px 24px 0;
    max-width: 1440px;
    margin: 0 auto;
}

/* ─── Hero ─── */
.agent-hero[b-pwf55cfvso] {
    position: relative;
    width: 100%;
    background-color: var(--agent-primary);
    overflow: hidden;
    padding: 48px 0;
}

.agent-hero-bg[b-pwf55cfvso] {
    position: absolute;
    inset: 0;
    background-image: url('/images/Icon_Dark_Green_TransparentBg_40.png');
    background-repeat: repeat;
    background-position: center;
    mask-image: linear-gradient(to right, black 70%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, black 70%, transparent 100%);
    mask-size: 100% 100%;
    -webkit-mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    pointer-events: none;
}

.agent-hero-inner[b-pwf55cfvso] {
    position: relative;
    z-index: 2;
    padding: 0 24px;
    max-width: 1440px;
    margin: 0 auto;
}

/* Hero stacks vertically by default (mobile-first), switches to row on desktop */
.agent-hero-layout[b-pwf55cfvso] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Left side: profile + identity (stacks vertically on mobile) */
.agent-identity[b-pwf55cfvso] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    text-align: center;
}

.agent-profile-wrapper[b-pwf55cfvso] {
    position: relative;
    width: 150px;
    height: 150px;
    flex-shrink: 0;
}

.agent-profile-pic[b-pwf55cfvso] {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    border: 3px solid var(--agent-profile-border);
    object-fit: cover;
    display: block;
}

/* MudAvatar renders its own <div>, so use ::deep to reach through scope. */
.agent-profile-wrapper[b-pwf55cfvso]  .agent-profile-avatar {
    width: 150px !important;
    height: 150px !important;
    border: 3px solid var(--agent-profile-border);
    font-size: 2.5rem !important;
    font-weight: 600;
}

/* FABs on the profile picture — MudFab renders a child <button>. */
.agent-profile-wrapper[b-pwf55cfvso]  .agent-profile-fab {
    position: absolute;
    background-color: var(--agent-surface) !important;
    color: var(--agent-primary) !important;
    width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

.agent-profile-wrapper[b-pwf55cfvso]  .agent-profile-fab:hover,
.agent-profile-wrapper[b-pwf55cfvso]  .agent-profile-fab:focus-visible {
    background-color: var(--agent-primary-lighten) !important;
    color: var(--agent-surface) !important;
}

.agent-profile-wrapper[b-pwf55cfvso]  .agent-profile-fab.fab-add {
    bottom: 4px;
    right: 4px;
}

.agent-profile-wrapper[b-pwf55cfvso]  .agent-profile-fab.fab-delete {
    top: 4px;
    right: 4px;
}

/* Name + code (below profile pic on mobile) — this wrapper is OUR <div>,
   but the children (h1, code label, code value, member since) are all
   MudText output, so they need ::deep. */
.agent-name-block[b-pwf55cfvso] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
}

.agent-name-block[b-pwf55cfvso]  .agent-name-h1 {
    color: var(--agent-hero-text) !important;
    font-weight: 700 !important;
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
    margin: 0 !important;
    line-height: 1.2 !important;
}

.agent-name-block[b-pwf55cfvso]  .agent-code-label {
    color: var(--agent-hero-text) !important;
    opacity: 0.9;
    font-size: 0.75rem !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 !important;
}

.agent-name-block[b-pwf55cfvso]  .agent-code-value {
    color: var(--agent-hero-text) !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    letter-spacing: 0.5px;
    margin: 0 !important;
}

.agent-rating-row[b-pwf55cfvso] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin-top: 2px;
}

.agent-rating-row[b-pwf55cfvso]  .mud-icon-root {
    color: #ffd400;
}

.agent-rating-row[b-pwf55cfvso]  .mud-typography {
    color: var(--agent-hero-text) !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

.agent-name-block[b-pwf55cfvso]  .agent-member-since {
    color: var(--agent-hero-text) !important;
    opacity: 0.85;
    font-size: 0.75rem !important;
    margin-top: 4px;
}

/* Hero CTA buttons — .agent-hero-ctas is our <div>, but buttons inside are
   MudButton output. */
.agent-hero-ctas[b-pwf55cfvso] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    width: 100%;
    margin-top: 8px;
}

/* Use ::deep to reach the MudButton-rendered <button> class targets. */
.agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-primary,
.agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-secondary {
    border-radius: var(--agent-btn-radius) !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px !important;
    height: 44px !important;
    letter-spacing: 0;
    padding: 0 16px !important;
}

.agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-primary {
    background-color: var(--agent-surface) !important;
    color: var(--agent-primary-darken) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-primary:hover,
.agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-primary:focus-visible {
    background-color: var(--agent-primary-lighten) !important;
    color: var(--agent-surface) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-secondary {
    background-color: transparent !important;
    color: var(--agent-hero-text) !important;
    border: 1px solid rgba(255, 255, 255, 0.85) !important;
}

.agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-secondary:hover,
.agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-secondary:focus-visible {
    background-color: rgba(255, 255, 255, 0.12) !important;
    border-color: var(--agent-hero-text) !important;
}

/* Label-swap spans live INSIDE MudButton's <button>, so they need ::deep too. */
.agent-hero-ctas[b-pwf55cfvso]  .cta-label-short {
    display: none;
}

.agent-hero-ctas[b-pwf55cfvso]  .cta-label-long {
    display: inline;
}

/* Actions Required card (hero right side on desktop) — OUR <div>, pure layout. */
.agent-actions-card[b-pwf55cfvso] {
    background: var(--agent-surface);
    border-radius: var(--agent-card-radius);
    padding: 20px;
    box-shadow: var(--agent-card-shadow);
    min-height: 140px;
}

/* MudText title inside the actions card. */
.agent-actions-card[b-pwf55cfvso]  .agent-actions-title {
    color: var(--agent-text-primary) !important;
    font-weight: 700 !important;
    font-size: 1.125rem !important;
    margin-bottom: 12px !important;
}

.agent-actions-list[b-pwf55cfvso] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.agent-action-item[b-pwf55cfvso] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    background: #f7f9fa;
    border: 1px solid #eef0f2;
}

.agent-action-item.warn[b-pwf55cfvso] {
    background: rgba(255, 152, 0, 0.08);
    border-color: rgba(255, 152, 0, 0.3);
}

.agent-action-item.info[b-pwf55cfvso] {
    background: rgba(33, 150, 243, 0.08);
    border-color: rgba(33, 150, 243, 0.3);
}

/* MudIcon inside action item. */
.agent-action-item[b-pwf55cfvso]  .mud-icon-root {
    flex-shrink: 0;
}

/* MudText label inside action item. */
.agent-action-item[b-pwf55cfvso]  .agent-action-label {
    flex: 1 1 auto;
    color: var(--agent-text-primary);
    font-size: 0.875rem;
}

/* MudButton CTA inside action item. */
.agent-action-item[b-pwf55cfvso]  .agent-action-cta {
    border-radius: 6px !important;
    text-transform: none !important;
    min-height: 36px !important;
    font-weight: 600 !important;
}

.agent-actions-empty[b-pwf55cfvso] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 16px 8px;
    text-align: center;
    color: var(--agent-text-secondary);
}

.agent-actions-empty[b-pwf55cfvso]  .mud-icon-root {
    color: #4caf50;
}

/* ─── Content area ─── */
.agent-content[b-pwf55cfvso] {
    padding: 28px 24px 96px;
    max-width: 1440px;
    margin: 0 auto;
}

/* MudPaper rendered card — use ::deep so the border-radius/shadow reach it. */
.agent-content[b-pwf55cfvso]  .agent-card {
    border-radius: var(--agent-card-radius);
    box-shadow: var(--agent-card-shadow);
    background: var(--agent-surface);
}

/* ─── Tabs ─── MudTabs renders .mud-tab buttons. */
.agent-content[b-pwf55cfvso]  .agent-tabs .mud-tab {
    text-transform: none !important;
    font-weight: 600;
    min-height: 48px;
    letter-spacing: 0;
}

/* MudTabPanel renders its own padded container. */
.agent-content[b-pwf55cfvso]  .agent-tab-panel {
    padding: 20px !important;
}

/* MudText section headers inside tab panels. */
.agent-content[b-pwf55cfvso]  .agent-section-header {
    font-weight: 700 !important;
    color: var(--agent-text-primary) !important;
    font-size: 1.25rem !important;
    margin-bottom: 4px !important;
}

.agent-content[b-pwf55cfvso]  .agent-section-sub {
    color: var(--agent-text-secondary) !important;
    margin-bottom: 16px !important;
}

/* ─── Forms ─── .agent-form is OUR <div> (EditForm wrapper), but everything
   inside — MudTextField, MudSelect, MudSwitch, MudCheckBox, MudButton — is
   child-component DOM. */
.agent-content[b-pwf55cfvso]  .agent-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.agent-content[b-pwf55cfvso]  .agent-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

/* MudButton primary/secondary inside the form. */
.agent-content[b-pwf55cfvso]  .agent-btn-primary,
.agent-content[b-pwf55cfvso]  .agent-btn-secondary {
    border-radius: var(--agent-btn-radius) !important;
    text-transform: none !important;
    font-weight: 600 !important;
    min-height: 44px;
    letter-spacing: 0;
}

/* ─── Privacy switches ─── .agent-privacy-list is our <div>, the rows
   contain MudText + MudSwitch output. */
.agent-content[b-pwf55cfvso]  .agent-privacy-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.agent-content[b-pwf55cfvso]  .agent-privacy-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 14px;
    border: 1px solid var(--agent-divider);
    border-radius: 8px;
    background: #fcfcfc;
}

.agent-content[b-pwf55cfvso]  .agent-privacy-info {
    flex: 1 1 auto;
    min-width: 0;
}

.agent-content[b-pwf55cfvso]  .agent-privacy-title {
    color: var(--agent-text-primary) !important;
    font-weight: 600 !important;
    font-size: 0.9375rem !important;
    margin: 0 !important;
}

.agent-content[b-pwf55cfvso]  .agent-privacy-help {
    color: var(--agent-text-secondary) !important;
    font-size: 0.8125rem !important;
    margin-top: 2px !important;
}

/* ─── Desktop (>=960px): horizontal hero layout ─── */
@media (min-width: 960px) {
    .agent-hero[b-pwf55cfvso] {
        padding: 60px 0;
    }

    .agent-hero-layout[b-pwf55cfvso] {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 32px;
    }

    .agent-identity[b-pwf55cfvso] {
        flex-direction: row;
        align-items: center;
        text-align: left;
        flex: 1 1 auto;
        gap: 24px;
    }

    .agent-name-block[b-pwf55cfvso] {
        align-items: flex-start;
    }

    .agent-rating-row[b-pwf55cfvso] {
        justify-content: flex-start;
    }

    .agent-hero-ctas[b-pwf55cfvso] {
        justify-content: flex-start;
        width: auto;
    }

    .agent-actions-card[b-pwf55cfvso] {
        flex: 0 0 360px;
        max-width: 360px;
        min-height: 180px;
    }
}

/* ─── 2K cap ─── */
@media (min-width: 1440px) {
    .agent-hero-inner[b-pwf55cfvso],
    .agent-content[b-pwf55cfvso],
    .agent-breadcrumbs[b-pwf55cfvso] {
        max-width: 1440px;
    }
}

/* ─── Tablet (600–959px): vertical stack, tighter ─── */
@media (min-width: 600px) and (max-width: 959.98px) {
    .agent-hero[b-pwf55cfvso] {
        padding: 40px 0;
    }

    .agent-profile-wrapper[b-pwf55cfvso] {
        width: 140px;
        height: 140px;
    }

    .agent-profile-pic[b-pwf55cfvso] {
        width: 140px;
        height: 140px;
    }

    .agent-profile-wrapper[b-pwf55cfvso]  .agent-profile-avatar {
        width: 140px !important;
        height: 140px !important;
    }

    .agent-actions-card[b-pwf55cfvso] {
        margin-top: 12px;
    }
}

/* ─── Mobile (<600px): compact reflow ─── */
@media (max-width: 599.98px) {
    .agent-breadcrumbs[b-pwf55cfvso] {
        padding: 12px 16px 0;
    }

    .agent-hero[b-pwf55cfvso] {
        padding: 32px 0;
    }

    .agent-hero-inner[b-pwf55cfvso] {
        padding: 0 16px;
    }

    .agent-profile-wrapper[b-pwf55cfvso] {
        width: 120px;
        height: 120px;
    }

    .agent-profile-pic[b-pwf55cfvso] {
        width: 120px;
        height: 120px;
    }

    .agent-profile-wrapper[b-pwf55cfvso]  .agent-profile-avatar {
        width: 120px !important;
        height: 120px !important;
        font-size: 2rem !important;
    }

    .agent-hero-ctas[b-pwf55cfvso] {
        flex-direction: column;
        width: 100%;
    }

    .agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-primary,
    .agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-secondary {
        width: 100%;
    }

    .agent-content[b-pwf55cfvso] {
        padding: 16px 12px 80px;
    }

    .agent-content[b-pwf55cfvso]  .agent-tab-panel {
        padding: 14px !important;
    }

    /* Swap long CTA labels for short ones on mobile — spans inside MudButton. */
    .agent-hero-ctas[b-pwf55cfvso]  .cta-label-long {
        display: none;
    }

    .agent-hero-ctas[b-pwf55cfvso]  .cta-label-short {
        display: inline;
    }

    /* Hide breadcrumbs on phones (matches Test-075/154 precedent) */
    .agent-breadcrumbs[b-pwf55cfvso] {
        display: none;
    }

    .agent-content[b-pwf55cfvso]  .agent-privacy-row {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .agent-actions-card[b-pwf55cfvso] {
        padding: 16px;
    }
}

/* ─── Minimum 44px touch targets ≤960px ─── */
@media (max-width: 960px) {
    .agent-hero-ctas[b-pwf55cfvso]  .mud-button-root,
    .agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-primary,
    .agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-secondary,
    .agent-content[b-pwf55cfvso]  .agent-btn-primary,
    .agent-content[b-pwf55cfvso]  .agent-btn-secondary {
        min-height: 44px;
    }

    .agent-wrapper[b-pwf55cfvso]  .mud-icon-button {
        min-width: 44px;
        min-height: 44px;
    }
}

/* ─── Reduced motion ─── */
@media (prefers-reduced-motion: reduce) {
    .agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-primary,
    .agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-secondary,
    .agent-action-item[b-pwf55cfvso]  .agent-action-cta,
    .agent-content[b-pwf55cfvso]  .agent-btn-primary,
    .agent-content[b-pwf55cfvso]  .agent-btn-secondary,
    .agent-profile-wrapper[b-pwf55cfvso]  .agent-profile-fab {
        transition: none;
    }

    .agent-hero-ctas[b-pwf55cfvso]  .agent-hero-btn-primary:hover {
        transform: none;
    }
}
/* /Components/Pages/OnboardingAgent/OnboardedUsers.razor.rz.scp.css */
.referred-users-wrapper[b-duoe88zd6f] {
    --ru-primary: #35a0ae;
    --ru-primary-dark: #256f7a;
    --ru-primary-soft: rgba(53, 160, 174, 0.08);
    --ru-warning: #f59e0b;
    --ru-ink: #1a2b2e;
    --ru-muted: #64748b;
    --ru-border: #e2e8f0;
    --ru-surface: #ffffff;
    --ru-surface-alt: #f8fafc;
    --ru-radius: 8px;

    font-family: 'Montserrat', sans-serif;
    color: var(--ru-ink);
    background: var(--ru-surface-alt);
    min-height: calc(100vh - 64px);
}

/* ---------- Hero band ---------- */
.referred-users-wrapper .hero-band[b-duoe88zd6f] {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, var(--ru-primary) 0%, var(--ru-primary-dark) 100%);
    padding: 40px 32px;
}

.referred-users-wrapper .hero-pattern[b-duoe88zd6f] {
    position: absolute;
    inset: 0;
    background-image: url('/images/Icon_Dark_Green_TransparentBg_40.png');
    background-repeat: repeat;
    opacity: 0.08;
    pointer-events: none;
}

.referred-users-wrapper .hero-inner[b-duoe88zd6f] {
    position: relative;
    z-index: 1;
    max-width: 1440px;
    margin: 0 auto;
}

.referred-users-wrapper .hero-inner[b-duoe88zd6f]  .mud-breadcrumbs {
    padding: 0;
    margin-bottom: 12px;
}

.referred-users-wrapper .hero-inner[b-duoe88zd6f]  .mud-breadcrumb-item,
.referred-users-wrapper .hero-inner[b-duoe88zd6f]  .mud-breadcrumb-item a,
.referred-users-wrapper .hero-inner[b-duoe88zd6f]  .mud-breadcrumb-separator span,
.referred-users-wrapper .hero-inner[b-duoe88zd6f]  .mud-breadcrumb-item .mud-icon-root {
    color: rgba(255, 255, 255, 0.92) !important;
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    text-decoration: none;
}

.referred-users-wrapper .hero-inner[b-duoe88zd6f]  .mud-breadcrumb-item.mud-disabled,
.referred-users-wrapper .hero-inner[b-duoe88zd6f]  .mud-breadcrumb-item.mud-disabled a {
    color: #ffffff !important;
    font-weight: 600;
}

.referred-users-wrapper .hero-inner[b-duoe88zd6f]  .mud-breadcrumb-item a:hover {
    color: #ffffff !important;
    text-decoration: underline;
}

.referred-users-wrapper .hero-title[b-duoe88zd6f] {
    margin: 0;
    color: #ffffff;
    font-size: 2rem;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.referred-users-wrapper .hero-subtitle[b-duoe88zd6f] {
    margin: 8px 0 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: 1rem;
    line-height: 1.5;
    max-width: 720px;
}

/* ---------- Content container ---------- */
.referred-users-wrapper .content-container[b-duoe88zd6f] {
    max-width: 1440px;
    margin: 0 auto;
    padding: 32px;
}

/* ---------- Metrics ---------- */
.referred-users-wrapper .metrics-grid[b-duoe88zd6f] {
    margin-bottom: 24px;
}

.referred-users-wrapper .metric-card[b-duoe88zd6f] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 20px 24px;
    background: var(--ru-surface);
    border: 1px solid var(--ru-border);
    border-radius: var(--ru-radius);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.referred-users-wrapper .metric-card:hover[b-duoe88zd6f] {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.08);
}

.referred-users-wrapper .metric-icon[b-duoe88zd6f] {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #ffffff;
}

.referred-users-wrapper .metric-icon-primary[b-duoe88zd6f] {
    background: var(--ru-primary);
}

.referred-users-wrapper .metric-icon-warning[b-duoe88zd6f] {
    background: var(--ru-warning);
}

.referred-users-wrapper .metric-icon[b-duoe88zd6f]  .mud-icon-root {
    font-size: 26px;
    color: #ffffff;
}

.referred-users-wrapper .metric-body[b-duoe88zd6f] {
    min-width: 0;
}

.referred-users-wrapper .metric-label[b-duoe88zd6f] {
    color: var(--ru-muted);
    font-size: 0.8125rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 4px;
}

.referred-users-wrapper .metric-value[b-duoe88zd6f] {
    color: var(--ru-ink);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
}

/* ---------- Action bar ---------- */
.referred-users-wrapper .action-bar[b-duoe88zd6f] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: flex-end;
    margin-bottom: 16px;
}

.referred-users-wrapper .action-bar[b-duoe88zd6f]  .action-btn {
    min-height: 44px;
    border-radius: var(--ru-radius);
    text-transform: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    padding-inline: 20px;
}

.referred-users-wrapper .action-bar[b-duoe88zd6f]  .action-btn.primary {
    background-color: var(--ru-primary);
    color: #ffffff;
}

.referred-users-wrapper .action-bar[b-duoe88zd6f]  .action-btn.primary:hover {
    background-color: var(--ru-primary-dark);
}

/* ---------- Tabs card ---------- */
.referred-users-wrapper .tabs-card[b-duoe88zd6f] {
    border: 1px solid var(--ru-border);
    border-radius: var(--ru-radius);
    overflow: hidden;
    background: var(--ru-surface);
}

.referred-users-wrapper .tabs-card[b-duoe88zd6f]  .mud-tabs-tabbar,
.referred-users-wrapper .tabs-card[b-duoe88zd6f]  .mud-tabs-tabbar-primary,
.referred-users-wrapper .tabs-card[b-duoe88zd6f]  .mud-tabs-tabbar-inner,
.referred-users-wrapper .tabs-card[b-duoe88zd6f]  .mud-tabs-tabbar-content {
    background: var(--ru-surface) !important;
    border-bottom: 1px solid var(--ru-border);
}

.referred-users-wrapper .tabs-card[b-duoe88zd6f]  .mud-tab {
    text-transform: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    color: var(--ru-muted) !important;
    min-height: 48px;
    padding: 12px 20px;
}

.referred-users-wrapper .tabs-card[b-duoe88zd6f]  .mud-tab.mud-tab-active {
    color: var(--ru-primary) !important;
}

.referred-users-wrapper .tabs-card[b-duoe88zd6f]  .mud-tab-slider {
    background-color: var(--ru-primary) !important;
}

.referred-users-wrapper .tabs-card[b-duoe88zd6f]  .tab-panel-content {
    padding: 20px;
}

/* ---------- Controls row ---------- */
.referred-users-wrapper .tab-controls[b-duoe88zd6f] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 16px;
}

.referred-users-wrapper .tab-controls[b-duoe88zd6f]  .search-field {
    max-width: 320px;
    width: 100%;
}

.referred-users-wrapper .tab-controls[b-duoe88zd6f]  .search-field .mud-input-slot,
.referred-users-wrapper .tab-controls[b-duoe88zd6f]  .search-field input {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
}

/* ---------- Table ---------- */
.referred-users-wrapper .table-scroll[b-duoe88zd6f] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--ru-border);
    border-radius: var(--ru-radius);
    background: var(--ru-surface);
}

.referred-users-wrapper .referred-table[b-duoe88zd6f] {
    width: 100%;
    border-collapse: collapse;
    min-width: 720px;
    font-family: 'Montserrat', sans-serif;
}

.referred-users-wrapper .referred-table thead[b-duoe88zd6f] {
    background: var(--ru-surface-alt);
}

.referred-users-wrapper .referred-table th[b-duoe88zd6f] {
    text-align: left;
    padding: 12px 16px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ru-muted);
    border-bottom: 1px solid var(--ru-border);
}

.referred-users-wrapper .referred-table tbody tr[b-duoe88zd6f] {
    transition: background-color 0.15s ease;
}

.referred-users-wrapper .referred-table tbody tr:hover[b-duoe88zd6f] {
    background-color: var(--ru-primary-soft);
}

.referred-users-wrapper .referred-table td[b-duoe88zd6f] {
    padding: 14px 16px;
    font-size: 0.9375rem;
    color: var(--ru-ink);
    border-bottom: 1px solid var(--ru-border);
    vertical-align: middle;
}

.referred-users-wrapper .referred-table tbody tr:last-child td[b-duoe88zd6f] {
    border-bottom: none;
}

.referred-users-wrapper .referred-table .col-actions[b-duoe88zd6f] {
    text-align: right;
    white-space: nowrap;
}

.referred-users-wrapper .user-cell[b-duoe88zd6f] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.referred-users-wrapper .avatar[b-duoe88zd6f] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--ru-primary-soft);
    display: inline-grid;
    place-items: center;
    color: var(--ru-primary);
    font-size: 0.8125rem;
    font-weight: 600;
}

.referred-users-wrapper .avatar-initials[b-duoe88zd6f] {
    background: var(--ru-primary-soft);
    color: var(--ru-primary-dark);
}

.referred-users-wrapper .user-name[b-duoe88zd6f] {
    font-weight: 500;
}

.referred-users-wrapper .masked-email[b-duoe88zd6f] {
    font-family: 'Montserrat', sans-serif;
    cursor: help;
    color: var(--ru-ink);
}

.referred-users-wrapper .referred-table[b-duoe88zd6f]  .mud-icon-button {
    min-width: 40px;
    min-height: 40px;
}

/* ---------- Pagination ---------- */
.referred-users-wrapper .pagination-row[b-duoe88zd6f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 16px;
    padding: 8px 4px 0;
}

.referred-users-wrapper .pagination-summary[b-duoe88zd6f] {
    color: var(--ru-muted);
    font-size: 0.875rem;
    font-family: 'Montserrat', sans-serif;
}

.referred-users-wrapper .pagination-row[b-duoe88zd6f]  .mud-pagination .mud-pagination-item {
    font-family: 'Montserrat', sans-serif;
    min-width: 36px;
    min-height: 36px;
}

.referred-users-wrapper .pagination-row[b-duoe88zd6f]  .mud-pagination .mud-pagination-item.mud-pagination-item-selected {
    background-color: var(--ru-primary);
    color: #ffffff;
}

.referred-users-wrapper .pagination-row[b-duoe88zd6f]  .page-size-select {
    min-width: 124px;
    max-width: 160px;
}

/* ---------- Empty state ---------- */
.referred-users-wrapper .empty-alert[b-duoe88zd6f] {
    border-radius: var(--ru-radius);
    font-family: 'Montserrat', sans-serif;
}

/* ---------- Tablet ---------- */
@media (max-width: 959px) {
    .referred-users-wrapper .hero-band[b-duoe88zd6f] {
        padding: 32px 24px;
    }

    .referred-users-wrapper .hero-title[b-duoe88zd6f] {
        font-size: 1.75rem;
    }

    .referred-users-wrapper .content-container[b-duoe88zd6f] {
        padding: 24px 20px;
    }

    .referred-users-wrapper .action-bar[b-duoe88zd6f] {
        justify-content: stretch;
    }

    .referred-users-wrapper .action-bar[b-duoe88zd6f]  .action-btn {
        flex: 1 1 200px;
    }

    .referred-users-wrapper .tab-controls[b-duoe88zd6f] {
        justify-content: stretch;
    }

    .referred-users-wrapper .tab-controls[b-duoe88zd6f]  .search-field {
        max-width: 100%;
    }
}

/* ---------- Mobile ---------- */
@media (max-width: 599px) {
    .referred-users-wrapper .hero-band[b-duoe88zd6f] {
        padding: 24px 16px;
    }

    .referred-users-wrapper .hero-title[b-duoe88zd6f] {
        font-size: 1.5rem;
    }

    .referred-users-wrapper .hero-subtitle[b-duoe88zd6f] {
        font-size: 0.9375rem;
    }

    .referred-users-wrapper .content-container[b-duoe88zd6f] {
        padding: 20px 16px;
    }

    .referred-users-wrapper .metric-card[b-duoe88zd6f] {
        padding: 16px;
    }

    .referred-users-wrapper .metric-value[b-duoe88zd6f] {
        font-size: 1.75rem;
    }

    .referred-users-wrapper .action-bar[b-duoe88zd6f] {
        flex-direction: column;
    }

    .referred-users-wrapper .action-bar[b-duoe88zd6f]  .action-btn {
        width: 100%;
        flex: 0 0 auto;
    }

    .referred-users-wrapper .referred-table[b-duoe88zd6f] {
        min-width: 0;
    }

    .referred-users-wrapper .referred-table thead[b-duoe88zd6f] {
        display: none;
    }

    .referred-users-wrapper .referred-table tbody tr[b-duoe88zd6f] {
        display: block;
        border: 1px solid var(--ru-border);
        border-radius: var(--ru-radius);
        margin-bottom: 12px;
        padding: 12px;
        background: var(--ru-surface);
    }

    .referred-users-wrapper .referred-table tbody tr:last-child[b-duoe88zd6f] {
        margin-bottom: 0;
    }

    .referred-users-wrapper .referred-table td[b-duoe88zd6f] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        padding: 8px 0;
        border-bottom: 1px dashed var(--ru-border);
    }

    .referred-users-wrapper .referred-table tbody tr td:last-child[b-duoe88zd6f] {
        border-bottom: none;
    }

    .referred-users-wrapper .referred-table td[b-duoe88zd6f]::before {
        content: attr(data-label);
        flex-shrink: 0;
        font-size: 0.75rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: var(--ru-muted);
    }

    .referred-users-wrapper .referred-table .col-actions[b-duoe88zd6f] {
        text-align: left;
    }

    .referred-users-wrapper .table-scroll[b-duoe88zd6f] {
        border: none;
        overflow: visible;
        background: transparent;
    }

    .referred-users-wrapper .pagination-row[b-duoe88zd6f] {
        justify-content: center;
    }

    .referred-users-wrapper .pagination-summary[b-duoe88zd6f] {
        flex: 1 1 100%;
        text-align: center;
    }
}

/* ---------- Respect reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
    .referred-users-wrapper .metric-card[b-duoe88zd6f],
    .referred-users-wrapper .referred-table tbody tr[b-duoe88zd6f] {
        transition: none;
    }
}
/* /Components/Pages/OnboardingAgent/OpportunityDashboard.razor.rz.scp.css */
/* ---------- Tokens on wrapper (not :root — scoped CSS silently drops :root) ---------- */
.opp-wrapper[b-ir9drergro] {
    --opp-primary: #35a0ae;
    --opp-primary-dark: #256f7a;
    --opp-primary-soft: rgba(53, 160, 174, 0.08);
    --opp-accent: #EF412c;
    --opp-accent-soft: rgba(239, 65, 44, 0.08);
    --opp-warning: #f59e0b;
    --opp-warning-soft: rgba(245, 158, 11, 0.12);
    --opp-info: #3b82f6;
    --opp-info-soft: rgba(59, 130, 246, 0.12);
    --opp-ok: #15803d;
    --opp-ok-soft: rgba(21, 128, 61, 0.1);
    --opp-danger: #b91c1c;
    --opp-danger-soft: rgba(185, 28, 28, 0.1);
    --opp-ink: #1a2b2e;
    --opp-muted: #64748b;
    --opp-border: #e2e8f0;
    --opp-surface: #ffffff;
    --opp-surface-alt: #f8fafc;
    --opp-radius: 8px;
    --opp-radius-lg: 12px;

    font-family: 'Montserrat', sans-serif;
    color: var(--opp-ink);
    background: var(--opp-surface-alt);
    min-height: calc(100vh - 64px);
}

/* ---------- Hero band ---------- */
.opp-wrapper .opp-hero-band[b-ir9drergro] {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, var(--opp-primary) 0%, var(--opp-primary-dark) 100%);
    padding: 40px 32px;
}

.opp-wrapper .opp-hero-pattern[b-ir9drergro] {
    position: absolute;
    inset: 0;
    background-image: url('/images/Icon_Dark_Green_TransparentBg_40.png');
    background-repeat: repeat;
    opacity: 0.08;
    pointer-events: none;
}

.opp-wrapper .opp-hero-inner[b-ir9drergro] {
    position: relative;
    z-index: 1;
    max-width: 1440px;
    margin: 0 auto;
}

.opp-wrapper .opp-hero-inner[b-ir9drergro]  .mud-breadcrumbs {
    padding: 0;
    margin-bottom: 12px;
}

.opp-wrapper .opp-hero-inner[b-ir9drergro]  .mud-breadcrumb-item,
.opp-wrapper .opp-hero-inner[b-ir9drergro]  .mud-breadcrumb-item a,
.opp-wrapper .opp-hero-inner[b-ir9drergro]  .mud-breadcrumb-separator span,
.opp-wrapper .opp-hero-inner[b-ir9drergro]  .mud-breadcrumb-item .mud-icon-root {
    color: rgba(255, 255, 255, 0.92) !important;
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    text-decoration: none;
}

.opp-wrapper .opp-hero-inner[b-ir9drergro]  .mud-breadcrumb-item.mud-disabled,
.opp-wrapper .opp-hero-inner[b-ir9drergro]  .mud-breadcrumb-item.mud-disabled a {
    color: #ffffff !important;
    font-weight: 600;
}

.opp-wrapper .opp-hero-inner[b-ir9drergro]  .mud-breadcrumb-item a:hover {
    color: #ffffff !important;
    text-decoration: underline;
}

.opp-wrapper .opp-hero-title[b-ir9drergro] {
    margin: 0;
    color: #ffffff;
    font-size: 2rem;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.opp-wrapper .opp-hero-subtitle[b-ir9drergro] {
    margin: 8px 0 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: 1rem;
    line-height: 1.5;
    max-width: 720px;
}

/* ---------- Content container ---------- */
.opp-wrapper .opp-content-container[b-ir9drergro] {
    max-width: 1440px;
    margin: 0 auto;
    padding: 32px;
}

/* ---------- Skeleton loading ---------- */
.opp-wrapper .opp-skeleton-grid[b-ir9drergro] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

.opp-wrapper .opp-skeleton-wide[b-ir9drergro] {
    grid-column: span 2;
}

@media (max-width: 1199px) {
    .opp-wrapper .opp-skeleton-grid[b-ir9drergro] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .opp-wrapper .opp-skeleton-wide[b-ir9drergro] {
        grid-column: span 2;
    }
}

@media (max-width: 599px) {
    .opp-wrapper .opp-skeleton-grid[b-ir9drergro] {
        grid-template-columns: 1fr;
    }

    .opp-wrapper .opp-skeleton-wide[b-ir9drergro] {
        grid-column: span 1;
    }
}

/* ---------- Generic state alerts ---------- */
.opp-wrapper .opp-state-alert[b-ir9drergro] {
    border-radius: var(--opp-radius);
    font-family: 'Montserrat', sans-serif;
}

.opp-wrapper .opp-state-alert[b-ir9drergro]  .mud-alert-message {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.opp-wrapper .opp-retry-btn[b-ir9drergro]  .mud-button-root {
    min-height: 36px;
    text-transform: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
}

/* ---------- Filter row ---------- */
.opp-wrapper .opp-filter-row[b-ir9drergro] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    background: var(--opp-surface);
    border: 1px solid var(--opp-border);
    border-radius: var(--opp-radius);
    padding: 12px 16px;
    margin-bottom: 20px;
}

.opp-wrapper .opp-filter-label[b-ir9drergro] {
    color: var(--opp-muted);
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.opp-wrapper .opp-filter-range[b-ir9drergro] {
    margin-left: auto;
    color: var(--opp-muted);
    font-size: 0.875rem;
}

.opp-wrapper .opp-filter-row[b-ir9drergro]  .opp-time-tabs {
    flex: 0 0 auto;
}

.opp-wrapper .opp-filter-row[b-ir9drergro]  .mud-tabs-tabbar,
.opp-wrapper .opp-filter-row[b-ir9drergro]  .mud-tabs-tabbar-inner,
.opp-wrapper .opp-filter-row[b-ir9drergro]  .mud-tabs-tabbar-content {
    background: transparent !important;
    border: none;
    min-height: 44px;
}

.opp-wrapper .opp-filter-row[b-ir9drergro]  .mud-tab {
    text-transform: none !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    color: var(--opp-muted) !important;
    min-height: 44px !important;
    padding: 8px 16px !important;
}

.opp-wrapper .opp-filter-row[b-ir9drergro]  .mud-tab.mud-tab-active {
    color: var(--opp-primary) !important;
}

.opp-wrapper .opp-filter-row[b-ir9drergro]  .mud-tab-slider {
    background-color: var(--opp-primary) !important;
}

/* ---------- Metrics grid ---------- */
.opp-wrapper .opp-metrics-grid[b-ir9drergro] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    margin-bottom: 24px;
}

@media (max-width: 1199px) {
    .opp-wrapper .opp-metrics-grid[b-ir9drergro] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 599px) {
    .opp-wrapper .opp-metrics-grid[b-ir9drergro] {
        grid-template-columns: 1fr;
    }
}

.opp-wrapper .opp-metric-card[b-ir9drergro] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px;
    background: var(--opp-surface);
    border: 1px solid var(--opp-border);
    border-radius: var(--opp-radius);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.opp-wrapper .opp-metric-card:hover[b-ir9drergro] {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.08);
}

.opp-wrapper .opp-metric-icon[b-ir9drergro] {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #ffffff;
}

.opp-wrapper .opp-metric-icon--primary[b-ir9drergro] { background: var(--opp-primary); }
.opp-wrapper .opp-metric-icon--accent[b-ir9drergro]  { background: var(--opp-accent); }
.opp-wrapper .opp-metric-icon--warning[b-ir9drergro] { background: var(--opp-warning); }
.opp-wrapper .opp-metric-icon--info[b-ir9drergro]    { background: var(--opp-info); }

.opp-wrapper .opp-metric-icon[b-ir9drergro]  .mud-icon-root {
    font-size: 24px;
    color: #ffffff;
}

.opp-wrapper .opp-metric-body[b-ir9drergro] {
    min-width: 0;
    flex: 1;
}

.opp-wrapper .opp-metric-label[b-ir9drergro] {
    color: var(--opp-muted);
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 4px;
}

.opp-wrapper .opp-metric-value[b-ir9drergro] {
    color: var(--opp-ink);
    font-size: 1.875rem;
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 4px;
}

.opp-wrapper .opp-metric-value--sm[b-ir9drergro] {
    font-size: 1.25rem;
}

.opp-wrapper .opp-metric-caption[b-ir9drergro] {
    color: var(--opp-muted);
    font-size: 0.8125rem;
    display: flex;
    align-items: center;
    gap: 6px;
}

.opp-wrapper .opp-caption-muted[b-ir9drergro] {
    font-style: italic;
}

.opp-wrapper .opp-caption-icon[b-ir9drergro]  .mud-icon-root {
    font-size: 16px;
}

.opp-wrapper .opp-caption-icon--up[b-ir9drergro]  .mud-icon-root {
    color: var(--opp-ok);
}

.opp-wrapper .opp-caption-icon--down[b-ir9drergro]  .mud-icon-root {
    color: var(--opp-danger);
}

/* ---------- Data grid ---------- */
.opp-wrapper .opp-data-grid[b-ir9drergro] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    margin-bottom: 24px;
}

@media (max-width: 1199px) {
    .opp-wrapper .opp-data-grid[b-ir9drergro] {
        grid-template-columns: 1fr;
    }
}

.opp-wrapper .opp-data-card[b-ir9drergro] {
    background: var(--opp-surface);
    border: 1px solid var(--opp-border);
    border-radius: var(--opp-radius);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
    overflow: hidden;
}

.opp-wrapper .opp-data-header[b-ir9drergro] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    background: var(--opp-surface-alt);
    border-bottom: 1px solid var(--opp-border);
}

.opp-wrapper .opp-data-title[b-ir9drergro] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.opp-wrapper .opp-data-icon[b-ir9drergro]  .mud-icon-root {
    color: var(--opp-primary);
    font-size: 22px;
}

.opp-wrapper .opp-data-title-text[b-ir9drergro] {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--opp-ink);
}

.opp-wrapper .opp-data-count[b-ir9drergro] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--opp-muted);
    background: var(--opp-surface);
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid var(--opp-border);
    white-space: nowrap;
}

.opp-wrapper .opp-data-body[b-ir9drergro] {
    padding: 16px;
}

/* ---------- Data table ---------- */
.opp-wrapper .opp-table-scroll[b-ir9drergro] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.opp-wrapper .opp-data-table[b-ir9drergro] {
    width: 100%;
    border-collapse: collapse;
    min-width: 480px;
    font-family: 'Montserrat', sans-serif;
}

.opp-wrapper .opp-data-table thead tr[b-ir9drergro] {
    background: transparent;
}

.opp-wrapper .opp-data-table th[b-ir9drergro] {
    text-align: left;
    padding: 10px 12px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--opp-muted);
    border-bottom: 1px solid var(--opp-border);
}

.opp-wrapper .opp-data-table td[b-ir9drergro] {
    padding: 12px;
    font-size: 0.9375rem;
    color: var(--opp-ink);
    border-bottom: 1px solid var(--opp-border);
    vertical-align: middle;
}

.opp-wrapper .opp-data-table tbody tr:last-child td[b-ir9drergro] {
    border-bottom: none;
}

.opp-wrapper .opp-data-table tbody tr[b-ir9drergro] {
    transition: background-color 0.15s ease;
}

.opp-wrapper .opp-data-table tbody tr:hover[b-ir9drergro] {
    background-color: var(--opp-primary-soft);
}

.opp-wrapper .opp-term[b-ir9drergro] {
    font-weight: 600;
}

.opp-wrapper .opp-muted[b-ir9drergro] {
    color: var(--opp-muted);
}

/* ---------- Chips ---------- */
.opp-wrapper .opp-chip[b-ir9drergro] {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.opp-wrapper .opp-chip--ok[b-ir9drergro] {
    background: var(--opp-ok-soft);
    color: var(--opp-ok);
}

.opp-wrapper .opp-chip--warn[b-ir9drergro] {
    background: var(--opp-warning-soft);
    color: #92400e;
}

.opp-wrapper .opp-chip--danger[b-ir9drergro] {
    background: var(--opp-danger-soft);
    color: var(--opp-danger);
}

/* ---------- Location list ---------- */
.opp-wrapper .opp-location-list[b-ir9drergro] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.opp-wrapper .opp-location-item[b-ir9drergro] {
    display: grid;
    grid-template-columns: 32px 1fr 160px 48px;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    background: var(--opp-surface);
    border: 1px solid var(--opp-border);
    border-radius: var(--opp-radius);
}

.opp-wrapper .opp-location-rank[b-ir9drergro] {
    width: 28px;
    height: 28px;
    background: var(--opp-primary-soft);
    color: var(--opp-primary-dark);
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-weight: 700;
    font-size: 0.8125rem;
}

.opp-wrapper .opp-location-main[b-ir9drergro] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.opp-wrapper .opp-location-name[b-ir9drergro] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--opp-ink);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.opp-wrapper .opp-location-searches[b-ir9drergro] {
    font-size: 0.8125rem;
    color: var(--opp-muted);
}

.opp-wrapper .opp-location-bar[b-ir9drergro] {
    height: 6px;
    background: var(--opp-surface-alt);
    border-radius: 3px;
    overflow: hidden;
}

.opp-wrapper .opp-location-bar-fill[b-ir9drergro] {
    height: 100%;
    background: linear-gradient(90deg, var(--opp-primary) 0%, var(--opp-primary-dark) 100%);
    border-radius: 3px;
    transition: width 0.3s ease;
}

.opp-wrapper .opp-location-share[b-ir9drergro] {
    text-align: right;
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--opp-primary-dark);
}

/* ---------- Tips card ---------- */
.opp-wrapper .opp-tips-card[b-ir9drergro] {
    background: var(--opp-surface);
    border: 1px solid var(--opp-border);
    border-radius: var(--opp-radius);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
    padding: 24px;
}

.opp-wrapper .opp-tips-header[b-ir9drergro] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 4px;
}

.opp-wrapper .opp-tips-icon[b-ir9drergro]  .mud-icon-root {
    color: var(--opp-warning);
    font-size: 26px;
}

.opp-wrapper .opp-tips-title[b-ir9drergro] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--opp-ink);
}

.opp-wrapper .opp-tips-lede[b-ir9drergro] {
    margin: 0 0 16px;
    color: var(--opp-muted);
    font-size: 0.9375rem;
    line-height: 1.5;
}

.opp-wrapper .opp-tips-grid[b-ir9drergro] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 16px;
}

@media (max-width: 1199px) {
    .opp-wrapper .opp-tips-grid[b-ir9drergro] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 599px) {
    .opp-wrapper .opp-tips-grid[b-ir9drergro] {
        grid-template-columns: 1fr;
    }
}

.opp-wrapper .opp-tip[b-ir9drergro] {
    background: var(--opp-surface-alt);
    border: 1px solid var(--opp-border);
    border-radius: var(--opp-radius);
    padding: 16px;
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.opp-wrapper .opp-tip:hover[b-ir9drergro] {
    transform: translateY(-1px);
    border-color: var(--opp-primary);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
}

.opp-wrapper .opp-tip-title[b-ir9drergro] {
    margin: 0 0 6px;
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--opp-primary-dark);
}

.opp-wrapper .opp-tip-body[b-ir9drergro] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--opp-ink);
    line-height: 1.5;
}

.opp-wrapper .opp-tips-callout[b-ir9drergro] {
    display: flex;
    gap: 12px;
    padding: 16px;
    background: var(--opp-primary-soft);
    border: 1px solid var(--opp-primary);
    border-left-width: 4px;
    border-radius: var(--opp-radius);
}

.opp-wrapper .opp-tips-callout-icon[b-ir9drergro]  .mud-icon-root {
    color: var(--opp-primary-dark);
    font-size: 24px;
}

.opp-wrapper .opp-tips-callout-title[b-ir9drergro] {
    margin: 0 0 4px;
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--opp-primary-dark);
}

.opp-wrapper .opp-tips-callout-body[b-ir9drergro] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--opp-ink);
    line-height: 1.5;
}

/* ---------- Tablet ---------- */
@media (max-width: 959px) {
    .opp-wrapper .opp-hero-band[b-ir9drergro] {
        padding: 32px 20px;
    }

    .opp-wrapper .opp-hero-title[b-ir9drergro] {
        font-size: 1.75rem;
    }

    .opp-wrapper .opp-content-container[b-ir9drergro] {
        padding: 24px 20px;
    }

    .opp-wrapper .opp-location-item[b-ir9drergro] {
        grid-template-columns: 28px 1fr 120px 44px;
    }
}

/* ---------- Mobile ---------- */
@media (max-width: 599px) {
    .opp-wrapper .opp-hero-band[b-ir9drergro] {
        padding: 24px 16px;
    }

    .opp-wrapper .opp-hero-title[b-ir9drergro] {
        font-size: 1.5rem;
    }

    .opp-wrapper .opp-hero-subtitle[b-ir9drergro] {
        font-size: 0.9375rem;
    }

    .opp-wrapper .opp-content-container[b-ir9drergro] {
        padding: 20px 16px;
    }

    .opp-wrapper .opp-filter-row[b-ir9drergro] {
        padding: 10px 12px;
    }

    .opp-wrapper .opp-filter-label[b-ir9drergro] {
        flex: 1 1 100%;
        text-align: center;
    }

    .opp-wrapper .opp-filter-row[b-ir9drergro]  .opp-time-tabs {
        width: 100%;
        flex: 1 1 100% !important;
    }

    .opp-wrapper .opp-filter-row[b-ir9drergro]  .mud-tabs-tabbar,
    .opp-wrapper .opp-filter-row[b-ir9drergro]  .mud-tabs-tabbar-inner,
    .opp-wrapper .opp-filter-row[b-ir9drergro]  .mud-tabs-tabbar-content,
    .opp-wrapper .opp-filter-row[b-ir9drergro]  .mud-tabs-tabbar-wrapper {
        width: 100% !important;
        display: flex;
    }

    .opp-wrapper .opp-filter-row[b-ir9drergro]  .mud-tab {
        min-width: 0 !important;
        flex: 1 1 0 !important;
        padding: 8px 4px !important;
        font-size: 0.8125rem !important;
    }

    .opp-wrapper .opp-filter-range[b-ir9drergro] {
        flex: 1 1 100%;
        margin-left: 0;
        text-align: center;
    }

    .opp-wrapper .opp-metric-card[b-ir9drergro] {
        padding: 16px;
    }

    .opp-wrapper .opp-metric-value[b-ir9drergro] {
        font-size: 1.5rem;
    }

    .opp-wrapper .opp-metric-value--sm[b-ir9drergro] {
        font-size: 1.125rem;
    }

    /* Stacked card table on mobile */
    .opp-wrapper .opp-data-table[b-ir9drergro] {
        min-width: 0;
    }

    .opp-wrapper .opp-data-table thead[b-ir9drergro] {
        display: none;
    }

    .opp-wrapper .opp-data-table tbody tr[b-ir9drergro] {
        display: block;
        border: 1px solid var(--opp-border);
        border-radius: var(--opp-radius);
        margin-bottom: 12px;
        padding: 10px;
        background: var(--opp-surface);
    }

    .opp-wrapper .opp-data-table tbody tr:last-child[b-ir9drergro] {
        margin-bottom: 0;
    }

    .opp-wrapper .opp-data-table td[b-ir9drergro] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        padding: 8px 0;
        border-bottom: 1px dashed var(--opp-border);
    }

    .opp-wrapper .opp-data-table tbody tr td:last-child[b-ir9drergro] {
        border-bottom: none;
    }

    .opp-wrapper .opp-data-table td[b-ir9drergro]::before {
        content: attr(data-label);
        flex-shrink: 0;
        font-size: 0.75rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: var(--opp-muted);
    }

    .opp-wrapper .opp-table-scroll[b-ir9drergro] {
        overflow: visible;
    }

    /* Location list stacking */
    .opp-wrapper .opp-location-item[b-ir9drergro] {
        grid-template-columns: 28px 1fr 44px;
        grid-template-rows: auto auto;
        row-gap: 6px;
    }

    .opp-wrapper .opp-location-bar[b-ir9drergro] {
        grid-column: 1 / -1;
    }

    .opp-wrapper .opp-tips-card[b-ir9drergro] {
        padding: 20px 16px;
    }

    .opp-wrapper .opp-tips-callout[b-ir9drergro] {
        flex-direction: column;
        gap: 8px;
    }
}

/* ---------- Respect reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
    .opp-wrapper .opp-metric-card[b-ir9drergro],
    .opp-wrapper .opp-data-table tbody tr[b-ir9drergro],
    .opp-wrapper .opp-tip[b-ir9drergro],
    .opp-wrapper .opp-location-bar-fill[b-ir9drergro] {
        transition: none;
    }
}
/* /Components/Pages/OnboardingAgent/Rentals/ConfigureSuggestedRental.razor.rz.scp.css */
/* Test-196: Nordic hero header + responsive shell for ConfigureSuggestedRental.
   Variables are scoped to .csr-hero-band (and other rendered classes) because
   :root in scoped CSS silently no-ops in Blazor (rewritten to :root[b-xxx]). */

.csr-hero-band[b-6hf60z4vo0] {
    --csr-teal: #35a0ae;
    --csr-teal-dark: #256f7a;
    --csr-teal-light: #5db2be;
    --csr-coral: #EF412c;
    --csr-text: #ffffff;
    --csr-text-muted: rgba(255, 255, 255, 0.86);

    background: linear-gradient(135deg, var(--csr-teal-dark) 0%, var(--csr-teal) 55%, var(--csr-teal-light) 100%);
    color: var(--csr-text);
    padding: 32px 28px;
    border-radius: 12px;
    margin: 16px 0 12px 0;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.08);
    position: relative;
    overflow: hidden;
}

.csr-hero-band[b-6hf60z4vo0]::before {
    content: "";
    position: absolute;
    top: -40px;
    right: -40px;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    pointer-events: none;
}

.csr-hero-inner[b-6hf60z4vo0] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    position: relative;
    z-index: 1;
}

.csr-hero-text[b-6hf60z4vo0] {
    flex: 1 1 auto;
    min-width: 0;
}

.csr-hero-title[b-6hf60z4vo0] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.2;
    margin: 0 0 6px 0;
    color: var(--csr-text);
    letter-spacing: -0.01em;
    word-break: break-word;
}

.csr-hero-sub[b-6hf60z4vo0] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    margin: 0;
    color: var(--csr-text-muted);
}

.csr-hero-actions[b-6hf60z4vo0] {
    display: flex;
    flex-direction: row;
    gap: 12px;
    flex-shrink: 0;
}

/* Button rules use ::deep because Class="..." passed to MudButton doesn't carry
   the caller's [b-xxxxx] scope attribute. ::deep matches descendant elements
   regardless of scope. */
.csr-hero-actions[b-6hf60z4vo0]  .csr-hero-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    min-height: 44px !important;
    padding: 0 20px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
}

.csr-hero-actions[b-6hf60z4vo0]  .csr-hero-btn--primary {
    background-color: #ffffff !important;
    color: #256f7a !important;
    border-color: #ffffff !important;
}

.csr-hero-actions[b-6hf60z4vo0]  .csr-hero-btn--primary:hover {
    background-color: rgba(255, 255, 255, 0.92) !important;
}

.csr-hero-actions[b-6hf60z4vo0]  .csr-hero-btn--secondary {
    background-color: transparent !important;
    border-color: rgba(255, 255, 255, 0.6) !important;
    color: #ffffff !important;
}

.csr-hero-actions[b-6hf60z4vo0]  .csr-hero-btn--secondary:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

.csr-cta-long[b-6hf60z4vo0] { display: inline; }
.csr-cta-short[b-6hf60z4vo0] { display: none; }

/* Breadcrumbs polish */
.csr-breadcrumbs[b-6hf60z4vo0] {
    margin: 0 0 16px 0;
}

.csr-loading-bar[b-6hf60z4vo0] {
    margin-bottom: 12px;
    border-radius: 0;
}

.csr-alert[b-6hf60z4vo0] {
    margin-bottom: 16px;
    border-radius: 8px !important;
}

/* ---------- Responsive: tablet (≤960px) ---------- */
@media (max-width: 960px) {
    .csr-hero-band[b-6hf60z4vo0] {
        padding: 28px 22px;
    }

    .csr-hero-title[b-6hf60z4vo0] {
        font-size: 1.625rem;
    }

    .csr-hero-sub[b-6hf60z4vo0] {
        font-size: 0.9375rem;
    }
}

/* ---------- Responsive: mobile (≤599.98px) ---------- */
@media (max-width: 599.98px) {
    .csr-hero-band[b-6hf60z4vo0] {
        padding: 24px 18px;
        border-radius: 10px;
        margin: 12px 0;
    }

    .csr-hero-inner[b-6hf60z4vo0] {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
    }

    .csr-hero-title[b-6hf60z4vo0] {
        font-size: 1.375rem;
    }

    .csr-hero-sub[b-6hf60z4vo0] {
        font-size: 0.875rem;
    }

    .csr-hero-actions[b-6hf60z4vo0] {
        flex-direction: column-reverse;
        width: 100%;
    }

    .csr-hero-btn[b-6hf60z4vo0] {
        width: 100%;
        justify-content: center;
    }

    .csr-cta-long[b-6hf60z4vo0] { display: none; }
    .csr-cta-short[b-6hf60z4vo0] { display: inline; }

    .csr-breadcrumbs[b-6hf60z4vo0] {
        display: none;
    }
}

/* ---------- Tab orientation: flip vertical-left → horizontal-top on mobile ----------
   At <600px the Position="Position.Left" tab strip eats half the viewport and crushes form fields.
   We override the MudTabs flex direction and let the tab list scroll horizontally.
   Class targets verified against live DOM: .mud-tabs > .mud-tabs-tabbar + .mud-tabs-panels */
@media (max-width: 599.98px) {
    .csr-tabs-wrapper[b-6hf60z4vo0]  .mud-tabs.mud-tabs-vertical {
        flex-direction: column !important;
    }

    .csr-tabs-wrapper[b-6hf60z4vo0]  .mud-tabs.mud-tabs-vertical .mud-tabs-tabbar.mud-tabs-vertical {
        max-width: 100% !important;
        width: 100% !important;
        min-width: 0 !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        border-right: 0 !important;
        border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
    }

    .csr-tabs-wrapper[b-6hf60z4vo0]  .mud-tabs.mud-tabs-vertical .mud-tabs-tabbar-inner {
        flex-direction: row !important;
        min-width: 0 !important;
    }

    .csr-tabs-wrapper[b-6hf60z4vo0]  .mud-tabs.mud-tabs-vertical .mud-tabs-tabbar-content {
        flex-direction: row !important;
        min-width: 0 !important;
    }

    .csr-tabs-wrapper[b-6hf60z4vo0]  .mud-tabs.mud-tabs-vertical .mud-tabs-tabbar-wrapper.mud-tabs-vertical {
        flex-direction: row !important;
    }

    .csr-tabs-wrapper[b-6hf60z4vo0]  .mud-tabs.mud-tabs-vertical .mud-tab-panel {
        white-space: nowrap !important;
        flex: 0 0 auto !important;
    }

    .csr-tabs-wrapper[b-6hf60z4vo0]  .mud-tabs.mud-tabs-vertical .mud-tabs-panels.mud-tabs-vertical {
        flex: 1 1 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
}

/* ---------- Day-of-week pricing cards: drop hardcoded 350px on mobile ----------
   Both the .d-flex.flex-wrap parent AND the form grandparent grow to intrinsic content
   width (~3752px) because nothing above caps them. Constrain at every level so the cards
   actually fit and wrap into a single column. */
@media (max-width: 599.98px) {
    .csr-tabs-wrapper[b-6hf60z4vo0]  .mud-paper.mud-card[style*="width: 350px"],
    .csr-tabs-wrapper[b-6hf60z4vo0]  .mud-paper.mud-card[style*="width:350px"] {
        width: 100% !important;
        max-width: 100% !important;
        flex-basis: 100% !important;
        margin: 8px 0 !important;
        box-sizing: border-box;
    }

    .csr-tabs-wrapper[b-6hf60z4vo0]  .mud-form,
    .csr-tabs-wrapper[b-6hf60z4vo0]  form.mud-form {
        max-width: 100% !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    .csr-tabs-wrapper[b-6hf60z4vo0]  .d-flex.flex-wrap {
        max-width: 100% !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    .csr-tabs-wrapper[b-6hf60z4vo0]  .mud-expand-panel-content,
    .csr-tabs-wrapper[b-6hf60z4vo0]  .mud-expand-panel,
    .csr-tabs-wrapper[b-6hf60z4vo0]  .mud-expansion-panels,
    .csr-tabs-wrapper[b-6hf60z4vo0]  .mud-tab-panel {
        max-width: 100% !important;
        min-width: 0 !important;
    }
}

/* Bottom Import Template button — Rently brand parity with sibling template page */
[b-6hf60z4vo0] .csr-bottom-action-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    min-height: 44px !important;
    padding: 0 24px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
}

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce) {
    .csr-hero-band[b-6hf60z4vo0],
    .csr-hero-btn[b-6hf60z4vo0] {
        transition: none !important;
    }
}
/* /Components/Pages/OnboardingAgent/Rentals/ConfigureSuggestedRentalTemplate.razor.rz.scp.css */
/* Test-199: Nordic hero header + responsive shell for ConfigureSuggestedRentalTemplate.
   Variables are scoped to .cst-hero-band (and other rendered classes) because
   :root in scoped CSS silently no-ops in Blazor (rewritten to :root[b-xxx]).
   Modeled on Test-196 ConfigureSuggestedRental.razor.css. */

.cst-hero-band[b-km696e63qb] {
    --cst-teal: #35a0ae;
    --cst-teal-dark: #256f7a;
    --cst-teal-light: #5db2be;
    --cst-coral: #EF412c;
    --cst-text: #ffffff;
    --cst-text-muted: rgba(255, 255, 255, 0.86);

    background: linear-gradient(135deg, var(--cst-teal-dark) 0%, var(--cst-teal) 55%, var(--cst-teal-light) 100%);
    color: var(--cst-text);
    padding: 32px 28px;
    border-radius: 12px;
    margin: 16px 0 12px 0;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.08);
    position: relative;
    overflow: hidden;
}

.cst-hero-band[b-km696e63qb]::before {
    content: "";
    position: absolute;
    top: -40px;
    right: -40px;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    pointer-events: none;
}

.cst-hero-inner[b-km696e63qb] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    position: relative;
    z-index: 1;
}

.cst-hero-text[b-km696e63qb] {
    flex: 1 1 auto;
    min-width: 0;
}

.cst-hero-title[b-km696e63qb] {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.2;
    margin: 0 0 6px 0;
    color: var(--cst-text);
    letter-spacing: -0.01em;
    word-break: break-word;
}

.cst-hero-sub[b-km696e63qb] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    margin: 0;
    color: var(--cst-text-muted);
}

.cst-hero-actions[b-km696e63qb] {
    display: flex;
    flex-direction: row;
    gap: 12px;
    flex-shrink: 0;
}

/* Button rules use ::deep because Class="..." passed to MudButton doesn't carry
   the caller's [b-xxxxx] scope attribute. ::deep matches descendant elements
   regardless of scope. */
.cst-hero-actions[b-km696e63qb]  .cst-hero-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    min-height: 44px !important;
    padding: 0 20px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
}

.cst-hero-actions[b-km696e63qb]  .cst-hero-btn--primary {
    background-color: #ffffff !important;
    color: #256f7a !important;
    border-color: #ffffff !important;
}

.cst-hero-actions[b-km696e63qb]  .cst-hero-btn--primary:hover {
    background-color: rgba(255, 255, 255, 0.92) !important;
}

.cst-hero-actions[b-km696e63qb]  .cst-hero-btn--primary:disabled {
    background-color: rgba(255, 255, 255, 0.5) !important;
    color: rgba(37, 111, 122, 0.5) !important;
}

.cst-cta-long[b-km696e63qb] { display: inline; }
.cst-cta-short[b-km696e63qb] { display: none; }

/* Breadcrumbs polish */
.cst-breadcrumbs[b-km696e63qb] {
    margin: 0 0 16px 0;
}

.cst-loading-bar[b-km696e63qb] {
    margin-bottom: 12px;
    border-radius: 0;
}

.cst-alert[b-km696e63qb] {
    margin-bottom: 16px;
    border-radius: 8px !important;
}

/* Insurance status — neutralise the stray red on "off" state */
.cst-insurance-status[b-km696e63qb] {
    color: rgba(33, 33, 33, 0.66) !important;
    font-size: 0.875rem !important;
    margin: 8px 0 0 0 !important;
}

.cst-insurance-status--warn[b-km696e63qb] {
    color: #c47b00 !important;
}

.cst-insurance-status--error[b-km696e63qb] {
    color: var(--cst-coral, #EF412c) !important;
}

/* ---------- Responsive: tablet (≤960px) ---------- */
@media (max-width: 960px) {
    .cst-hero-band[b-km696e63qb] {
        padding: 28px 22px;
    }

    .cst-hero-title[b-km696e63qb] {
        font-size: 1.625rem;
    }

    .cst-hero-sub[b-km696e63qb] {
        font-size: 0.9375rem;
    }
}

/* ---------- Responsive: mobile (≤599.98px) ---------- */
@media (max-width: 599.98px) {
    .cst-hero-band[b-km696e63qb] {
        padding: 24px 18px;
        border-radius: 10px;
        margin: 12px 0;
    }

    .cst-hero-inner[b-km696e63qb] {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
    }

    .cst-hero-title[b-km696e63qb] {
        font-size: 1.375rem;
    }

    .cst-hero-sub[b-km696e63qb] {
        font-size: 0.875rem;
    }

    .cst-hero-actions[b-km696e63qb] {
        flex-direction: column-reverse;
        width: 100%;
    }

    .cst-hero-btn[b-km696e63qb] {
        width: 100%;
        justify-content: center;
    }

    .cst-cta-long[b-km696e63qb] { display: none; }
    .cst-cta-short[b-km696e63qb] { display: inline; }

    .cst-breadcrumbs[b-km696e63qb] {
        display: none;
    }
}

/* Bottom save button (in-form footer) — Rently brand */
[b-km696e63qb] .cst-bottom-save-btn {
    border-radius: 8px !important;
    text-transform: none !important;
    min-height: 44px !important;
    padding: 0 24px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
}

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce) {
    .cst-hero-band[b-km696e63qb],
    .cst-hero-btn[b-km696e63qb] {
        transition: none !important;
    }
}
/* /Components/Pages/OnboardingAgent/Rentals/CreateSuggestedRentable.razor.rz.scp.css */
/* ============================================================
   CreateSuggestedRentable (Test-196) — Rently Success Ambassador
   Tokens on .csr-wrapper (NOT :root — scoped-CSS silent-fail gotcha)
   ::deep re-scoped to plain page-rendered divs
   (NOT classes passed into MudBlazor children)
   ============================================================ */

.csr-wrapper[b-euzrck6fav] {
    --csr-primary: #35a0ae;
    --csr-primary-dark: #256f7a;
    --csr-primary-darker: #1b4f57;
    --csr-primary-soft: rgba(53, 160, 174, 0.08);
    --csr-primary-soft-strong: rgba(53, 160, 174, 0.18);
    --csr-secondary: #EF412c;
    --csr-ink: #0f1e21;
    --csr-muted: #64748b;
    --csr-border: #e2e8f0;
    --csr-border-strong: #cbd5e1;
    --csr-surface: #ffffff;
    --csr-surface-raised: #f8fafc;
    --csr-bg: #f8fafc;
    --csr-danger: #dc2626;
    --csr-success: #16a34a;
    --csr-radius: 8px;
    --csr-radius-lg: 16px;
    --csr-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 3px rgba(15, 23, 42, 0.06);
    --csr-shadow-md: 0 4px 6px rgba(15, 23, 42, 0.05), 0 10px 15px rgba(15, 23, 42, 0.05);
    --csr-transition: 200ms ease;

    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--csr-ink);
    min-height: 100%;
    padding-bottom: 48px;
    background-color: var(--csr-bg);
}

/* =========================================================
   Hero band — full-bleed teal gradient
   ========================================================= */
.csr-hero-band[b-euzrck6fav] {
    background: linear-gradient(135deg, var(--csr-primary) 0%, var(--csr-primary-dark) 100%);
    color: #ffffff;
    padding: 48px 24px 60px;
    position: relative;
    overflow: hidden;
}

.csr-hero-band[b-euzrck6fav]::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 85% 20%, rgba(255, 255, 255, 0.12) 0%, transparent 40%),
        radial-gradient(circle at 15% 85%, rgba(255, 255, 255, 0.08) 0%, transparent 40%);
    pointer-events: none;
}

.csr-hero-inner[b-euzrck6fav] {
    max-width: 960px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.csr-hero-title[b-euzrck6fav] {
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(1.75rem, 2.5vw + 1rem, 2.25rem);
    font-weight: 700;
    line-height: 1.2;
    margin: 12px 0 8px;
    color: #ffffff;
    letter-spacing: -0.01em;
}

.csr-hero-subtitle[b-euzrck6fav] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.92);
    margin: 0;
    max-width: 640px;
}

/* Breadcrumbs — ::deep re-scoped to .csr-hero-inner (plain div we render,
   carries the [b-xxxxx] scope attribute). Passing Class="csr-breadcrumbs"
   INTO MudBreadcrumbs does NOT scope-attribute the child DOM —
   see feedback_blazor_scoped_css_class_on_mud_child.md */
.csr-hero-inner[b-euzrck6fav]  .mud-breadcrumbs {
    padding: 0;
    margin: 0;
    background: transparent;
}

.csr-hero-inner[b-euzrck6fav]  .mud-breadcrumb-item,
.csr-hero-inner[b-euzrck6fav]  .mud-breadcrumb-item a {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
}

.csr-hero-inner[b-euzrck6fav]  .mud-breadcrumb-item a,
.csr-hero-inner[b-euzrck6fav]  .mud-breadcrumb-item .mud-breadcrumb-item-link,
.csr-hero-inner[b-euzrck6fav]  .mud-breadcrumb-item a.mud-typography {
    color: rgba(255, 255, 255, 0.88) !important;
}

.csr-hero-inner[b-euzrck6fav]  .mud-breadcrumb-item a:hover,
.csr-hero-inner[b-euzrck6fav]  .mud-breadcrumb-item a:focus-visible {
    color: #ffffff !important;
    text-decoration: underline;
}

.csr-hero-inner[b-euzrck6fav]  .mud-breadcrumb-item.mud-disabled,
.csr-hero-inner[b-euzrck6fav]  .mud-breadcrumb-item--disabled,
.csr-hero-inner[b-euzrck6fav]  .mud-breadcrumb-item.mud-disabled .mud-typography {
    color: rgba(255, 255, 255, 0.78) !important;
    font-weight: 600;
}

.csr-hero-inner[b-euzrck6fav]  .mud-breadcrumb-separator {
    color: rgba(255, 255, 255, 0.55) !important;
    font-weight: 400;
    margin: 0 6px;
}

/* =========================================================
   Content wrapper — overlaps hero for card-float effect
   ========================================================= */
.csr-content[b-euzrck6fav] {
    max-width: 960px;
    margin: -32px auto 0;
    padding: 0 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    position: relative;
    z-index: 1;
}

.csr-skeleton[b-euzrck6fav] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* =========================================================
   Form layout
   ========================================================= */
.csr-form[b-euzrck6fav] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.csr-form-card[b-euzrck6fav] {
    background: var(--csr-surface);
    border: 1px solid var(--csr-border);
    border-radius: var(--csr-radius-lg);
    box-shadow: var(--csr-shadow-sm);
    padding: 24px;
}

.csr-form-card--actions[b-euzrck6fav] {
    padding: 20px 24px;
}

.csr-section-title[b-euzrck6fav] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--csr-ink);
    margin: 0 0 4px;
}

.csr-section-hint[b-euzrck6fav] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.875rem;
    color: var(--csr-muted);
    margin: 0 0 16px;
    line-height: 1.5;
}

/* =========================================================
   Text fields / Select (MudTextField + MudSelect outlined)
   ::deep pinned to .csr-form-card (plain div we render)
   ========================================================= */
.csr-field[b-euzrck6fav] {
    margin: 0;
}

.csr-form-card[b-euzrck6fav]  .mud-input-outlined .mud-input-outlined-border {
    border-radius: var(--csr-radius);
    border-color: var(--csr-border-strong);
}

.csr-form-card[b-euzrck6fav]  .mud-input-outlined:hover:not(.mud-disabled):not(.mud-error) .mud-input-outlined-border {
    border-color: var(--csr-primary);
}

.csr-form-card[b-euzrck6fav]  .mud-input-outlined.mud-focused:not(.mud-error) .mud-input-outlined-border {
    border-color: var(--csr-primary) !important;
    border-width: 2px;
}

.csr-form-card[b-euzrck6fav]  .mud-input-label.mud-focused:not(.mud-error) {
    color: var(--csr-primary) !important;
}

.csr-form-card[b-euzrck6fav]  .mud-input-control input,
.csr-form-card[b-euzrck6fav]  .mud-input-control textarea,
.csr-form-card[b-euzrck6fav]  .mud-select .mud-input-control input,
.csr-form-card[b-euzrck6fav]  .mud-select-input {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    color: var(--csr-ink);
}

.csr-form-card[b-euzrck6fav]  .mud-input-helper-text {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.75rem;
    color: var(--csr-muted);
    line-height: 1.4;
}

.csr-form-card[b-euzrck6fav]  .mud-input-helper-text.mud-input-error {
    color: var(--csr-danger);
}

/* Counter helper text — right-aligned when paired with helper text */
.csr-form-card[b-euzrck6fav]  .mud-input-counter-helper {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.75rem;
    color: var(--csr-muted);
}

/* =========================================================
   Template picker card (plain <button> we render — no ::deep needed)
   ========================================================= */
.csr-template-card[b-euzrck6fav] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
    border-radius: var(--csr-radius-lg);
    border: 2px dashed var(--csr-border-strong);
    background: var(--csr-surface-raised);
    color: var(--csr-ink);
    font-family: 'Montserrat', sans-serif;
    text-align: left;
    cursor: pointer;
    transition: border-color var(--csr-transition), background-color var(--csr-transition), transform var(--csr-transition), box-shadow var(--csr-transition);
}

.csr-template-card:hover[b-euzrck6fav] {
    border-color: var(--csr-primary);
    background: var(--csr-primary-soft);
    transform: translateY(-1px);
    box-shadow: var(--csr-shadow-sm);
}

.csr-template-card:focus-visible[b-euzrck6fav] {
    outline: 2px solid var(--csr-primary);
    outline-offset: 2px;
}

.csr-template-card--selected[b-euzrck6fav] {
    border-style: solid;
    border-color: var(--csr-primary);
    background: var(--csr-primary-soft);
}

.csr-template-card-icon[b-euzrck6fav] {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--csr-primary-soft-strong);
    color: var(--csr-primary-dark);
    display: flex;
    align-items: center;
    justify-content: center;
}

.csr-template-card-body[b-euzrck6fav] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.csr-template-card-eyebrow[b-euzrck6fav] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--csr-primary-dark);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.3;
}

.csr-template-card-title[b-euzrck6fav] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: var(--csr-ink);
    line-height: 1.3;
    margin: 2px 0 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.csr-template-card-desc[b-euzrck6fav] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8125rem;
    color: var(--csr-muted);
    line-height: 1.4;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.csr-template-card-action[b-euzrck6fav] {
    flex-shrink: 0;
    color: var(--csr-muted);
    display: flex;
    align-items: center;
    justify-content: center;
}

.csr-template-card:hover .csr-template-card-action[b-euzrck6fav] {
    color: var(--csr-primary-dark);
    transform: translateX(2px);
}

.csr-template-clear[b-euzrck6fav] {
    display: flex;
    justify-content: flex-end;
    margin-top: 8px;
}

.csr-form-card[b-euzrck6fav]  .csr-btn-link.mud-button-root {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8125rem;
    font-weight: 500;
    text-transform: none;
    color: var(--csr-muted);
    padding: 4px 10px;
    min-height: 32px;
    border-radius: var(--csr-radius);
}

.csr-form-card[b-euzrck6fav]  .csr-btn-link.mud-button-root:hover {
    color: var(--csr-danger);
    background-color: rgba(220, 38, 38, 0.06);
}

/* =========================================================
   Action row (inside .csr-form-card--actions)
   ========================================================= */
.csr-actions[b-euzrck6fav] {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.csr-draft-hint[b-euzrck6fav] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8125rem;
    color: var(--csr-muted);
    line-height: 1.4;
    margin: 12px 0 0;
    text-align: right;
}

.csr-form-card[b-euzrck6fav]  .mud-button-root.csr-btn {
    border-radius: var(--csr-radius);
    min-height: 44px;
    padding: 0 24px;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    gap: 8px;
}

.csr-form-card[b-euzrck6fav]  .csr-btn--submit.mud-button-filled-primary {
    background-color: var(--csr-primary) !important;
    color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(53, 160, 174, 0.3);
}

.csr-form-card[b-euzrck6fav]  .csr-btn--submit.mud-button-filled-primary:hover:not(:disabled) {
    background-color: var(--csr-primary-dark) !important;
    box-shadow: 0 2px 6px rgba(53, 160, 174, 0.4);
}

.csr-form-card[b-euzrck6fav]  .csr-btn--submit:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    box-shadow: none;
}

.csr-form-card[b-euzrck6fav]  .csr-btn--cancel {
    color: var(--csr-muted) !important;
    border-color: var(--csr-border-strong) !important;
    background-color: transparent !important;
}

.csr-form-card[b-euzrck6fav]  .csr-btn--cancel:hover:not(:disabled) {
    background-color: var(--csr-surface-raised) !important;
    color: var(--csr-ink) !important;
    border-color: var(--csr-border-strong) !important;
}

.csr-btn-spinner[b-euzrck6fav],
.csr-btn-icon[b-euzrck6fav] {
    margin-right: 0;
}

/* =========================================================
   Alerts (Error / Info)
   ========================================================= */
.csr-wrapper[b-euzrck6fav]  .csr-alert.mud-alert {
    border-radius: var(--csr-radius-lg) !important;
    border: 1px solid var(--csr-border);
    box-shadow: var(--csr-shadow-sm);
    font-family: 'Montserrat', sans-serif;
}

.csr-wrapper[b-euzrck6fav]  .csr-alert .mud-alert-message {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    line-height: 1.4;
    width: 100%;
}

.csr-alert-heading[b-euzrck6fav] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: var(--csr-ink);
    line-height: 1.3;
    display: block;
    margin-bottom: 4px;
}

.csr-alert-text[b-euzrck6fav] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    line-height: 1.5;
    display: block;
}

.csr-alert-body[b-euzrck6fav] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.csr-alert-actions[b-euzrck6fav] {
    display: flex;
    gap: 8px;
    margin-top: 4px;
    flex-wrap: wrap;
}

.csr-wrapper[b-euzrck6fav]  .csr-btn--ghost.mud-button-root {
    min-height: 44px;
    border-radius: var(--csr-radius);
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    font-weight: 600;
    text-transform: none;
    padding: 0 20px;
}

.csr-wrapper[b-euzrck6fav]  .csr-btn--ghost.mud-button-outlined {
    color: var(--csr-muted) !important;
    border-color: var(--csr-border-strong) !important;
    background-color: transparent !important;
}

.csr-wrapper[b-euzrck6fav]  .csr-btn--ghost.mud-button-outlined:hover:not(:disabled) {
    background-color: var(--csr-surface-raised) !important;
    color: var(--csr-ink) !important;
}

/* Info alert branding — green tint for onboard CTA */
.csr-wrapper[b-euzrck6fav]  .csr-alert.mud-alert-info {
    background-color: rgba(33, 150, 243, 0.06) !important;
    border-color: rgba(33, 150, 243, 0.22);
}

/* Used for the onboard CTA in the empty state */
.csr-alert-actions .csr-btn--submit[b-euzrck6fav] {
    min-height: 44px;
}

.csr-wrapper[b-euzrck6fav]  .csr-alert-actions .csr-btn--submit.mud-button-filled-primary {
    background-color: var(--csr-primary) !important;
    color: #ffffff !important;
    border-radius: var(--csr-radius);
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    text-transform: none;
    padding: 0 20px;
    box-shadow: 0 1px 3px rgba(53, 160, 174, 0.3);
}

.csr-wrapper[b-euzrck6fav]  .csr-alert-actions .csr-btn--submit.mud-button-filled-primary:hover:not(:disabled) {
    background-color: var(--csr-primary-dark) !important;
    box-shadow: 0 2px 6px rgba(53, 160, 174, 0.4);
}

/* =========================================================
   Dialog mode — hero + breadcrumbs hidden,
   content starts at top of panel
   ========================================================= */
.csr-wrapper--dialog[b-euzrck6fav] {
    padding-bottom: 0;
    background-color: transparent;
}

.csr-wrapper--dialog .csr-hero-band[b-euzrck6fav] {
    display: none;
}

.csr-wrapper--dialog .csr-content[b-euzrck6fav] {
    margin-top: 0;
    padding: 0;
    max-width: 100%;
}

.csr-wrapper--dialog .csr-form-card[b-euzrck6fav] {
    box-shadow: none;
    border-radius: var(--csr-radius-lg);
}

/* =========================================================
   Tablet (≤ 959.98px)
   ========================================================= */
@media (max-width: 959.98px) {
    .csr-hero-band[b-euzrck6fav] {
        padding: 40px 16px 52px;
    }

    .csr-content[b-euzrck6fav] {
        padding: 0 16px;
        margin-top: -24px;
    }

    .csr-form-card[b-euzrck6fav] {
        padding: 20px;
    }

    .csr-form-card--actions[b-euzrck6fav] {
        padding: 18px 20px;
    }

    .csr-template-card[b-euzrck6fav] {
        padding: 16px;
    }
}

/* =========================================================
   Mobile (≤ 599.98px)
   ========================================================= */
@media (max-width: 599.98px) {
    .csr-hero-band[b-euzrck6fav] {
        padding: 32px 16px 44px;
    }

    .csr-hero-title[b-euzrck6fav] {
        font-size: 1.5rem;
        margin-top: 10px;
    }

    .csr-hero-subtitle[b-euzrck6fav] {
        font-size: 0.9375rem;
    }

    .csr-content[b-euzrck6fav] {
        padding: 0 12px;
        gap: 12px;
        margin-top: -20px;
    }

    .csr-form-card[b-euzrck6fav] {
        padding: 16px;
    }

    .csr-form-card--actions[b-euzrck6fav] {
        padding: 16px;
    }

    .csr-section-title[b-euzrck6fav] {
        font-size: 1.0625rem;
    }

    .csr-template-card[b-euzrck6fav] {
        padding: 14px;
        gap: 12px;
    }

    .csr-template-card-icon[b-euzrck6fav] {
        width: 40px;
        height: 40px;
    }

    .csr-template-card-title[b-euzrck6fav] {
        font-size: 0.9375rem;
    }

    .csr-template-card-desc[b-euzrck6fav] {
        font-size: 0.8125rem;
    }

    .csr-actions[b-euzrck6fav] {
        flex-direction: column-reverse;
        gap: 8px;
    }

    .csr-draft-hint[b-euzrck6fav] {
        text-align: center;
    }

    .csr-form-card[b-euzrck6fav]  .mud-button-root.csr-btn {
        width: 100%;
    }

    .csr-alert-actions[b-euzrck6fav] {
        flex-direction: column;
        width: 100%;
    }

    .csr-wrapper[b-euzrck6fav]  .csr-btn--ghost.mud-button-root {
        width: 100%;
    }

    .csr-wrapper[b-euzrck6fav]  .csr-alert-actions .csr-btn--submit.mud-button-filled-primary {
        width: 100%;
    }
}

/* =========================================================
   Reduced motion
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
    .csr-template-card[b-euzrck6fav],
    .csr-template-card-action[b-euzrck6fav] {
        transition: none;
    }

    .csr-template-card:hover[b-euzrck6fav] {
        transform: none;
    }

    .csr-template-card:hover .csr-template-card-action[b-euzrck6fav] {
        transform: none;
    }
}
/* /Components/Pages/OnboardingAgent/Rentals/CreateSuggestedRentalTemplate.razor.rz.scp.css */
/* ============================================================
   CreateSuggestedRentalTemplate (Test-198) — Rently Success Ambassador
   Tokens on .cst-wrapper (NOT :root — scoped-CSS silent-fail gotcha)
   ::deep re-scoped to plain page-rendered divs
   (NOT classes passed into MudBlazor children)
   Mirrors Test-196 sibling CreateSuggestedRentable.razor.css with cst- prefix.
   ============================================================ */

.cst-wrapper[b-4brkptwkui] {
    --cst-primary: #35a0ae;
    --cst-primary-dark: #256f7a;
    --cst-primary-darker: #1b4f57;
    --cst-primary-soft: rgba(53, 160, 174, 0.08);
    --cst-primary-soft-strong: rgba(53, 160, 174, 0.18);
    --cst-secondary: #EF412c;
    --cst-ink: #0f1e21;
    --cst-muted: #64748b;
    --cst-border: #e2e8f0;
    --cst-border-strong: #cbd5e1;
    --cst-surface: #ffffff;
    --cst-surface-raised: #f8fafc;
    --cst-bg: #f8fafc;
    --cst-danger: #dc2626;
    --cst-success: #16a34a;
    --cst-radius: 8px;
    --cst-radius-lg: 16px;
    --cst-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 3px rgba(15, 23, 42, 0.06);
    --cst-shadow-md: 0 4px 6px rgba(15, 23, 42, 0.05), 0 10px 15px rgba(15, 23, 42, 0.05);
    --cst-transition: 200ms ease;

    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--cst-ink);
    min-height: 100%;
    padding-bottom: 48px;
    background-color: var(--cst-bg);
}

/* =========================================================
   Hero band — full-bleed teal gradient
   ========================================================= */
.cst-hero-band[b-4brkptwkui] {
    background: linear-gradient(135deg, var(--cst-primary) 0%, var(--cst-primary-dark) 100%);
    color: #ffffff;
    padding: 48px 24px 60px;
    position: relative;
    overflow: hidden;
}

.cst-hero-band[b-4brkptwkui]::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 85% 20%, rgba(255, 255, 255, 0.12) 0%, transparent 40%),
        radial-gradient(circle at 15% 85%, rgba(255, 255, 255, 0.08) 0%, transparent 40%);
    pointer-events: none;
}

.cst-hero-inner[b-4brkptwkui] {
    max-width: 960px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.cst-hero-title[b-4brkptwkui] {
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(1.75rem, 2.5vw + 1rem, 2.25rem);
    font-weight: 700;
    line-height: 1.2;
    margin: 12px 0 8px;
    color: #ffffff;
    letter-spacing: -0.01em;
}

.cst-hero-subtitle[b-4brkptwkui] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.92);
    margin: 0;
    max-width: 640px;
}

/* Breadcrumbs — ::deep re-scoped to .cst-hero-inner (plain div we render,
   carries the [b-xxxxx] scope attribute). Passing Class="cst-breadcrumbs"
   INTO MudBreadcrumbs does NOT scope-attribute the child DOM. */
.cst-hero-inner[b-4brkptwkui]  .mud-breadcrumbs {
    padding: 0;
    margin: 0;
    background: transparent;
}

.cst-hero-inner[b-4brkptwkui]  .mud-breadcrumb-item,
.cst-hero-inner[b-4brkptwkui]  .mud-breadcrumb-item a {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
}

.cst-hero-inner[b-4brkptwkui]  .mud-breadcrumb-item a,
.cst-hero-inner[b-4brkptwkui]  .mud-breadcrumb-item .mud-breadcrumb-item-link,
.cst-hero-inner[b-4brkptwkui]  .mud-breadcrumb-item a.mud-typography {
    color: rgba(255, 255, 255, 0.88) !important;
}

.cst-hero-inner[b-4brkptwkui]  .mud-breadcrumb-item a:hover,
.cst-hero-inner[b-4brkptwkui]  .mud-breadcrumb-item a:focus-visible {
    color: #ffffff !important;
    text-decoration: underline;
}

.cst-hero-inner[b-4brkptwkui]  .mud-breadcrumb-item.mud-disabled,
.cst-hero-inner[b-4brkptwkui]  .mud-breadcrumb-item--disabled,
.cst-hero-inner[b-4brkptwkui]  .mud-breadcrumb-item.mud-disabled .mud-typography {
    color: rgba(255, 255, 255, 0.78) !important;
    font-weight: 600;
}

.cst-hero-inner[b-4brkptwkui]  .mud-breadcrumb-separator {
    color: rgba(255, 255, 255, 0.55) !important;
    font-weight: 400;
    margin: 0 6px;
}

/* =========================================================
   Content wrapper — overlaps hero for card-float effect
   ========================================================= */
.cst-content[b-4brkptwkui] {
    max-width: 960px;
    margin: -32px auto 0;
    padding: 0 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    position: relative;
    z-index: 1;
}

.cst-skeleton[b-4brkptwkui] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* =========================================================
   Form layout
   ========================================================= */
.cst-form[b-4brkptwkui] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.cst-form-card[b-4brkptwkui] {
    background: var(--cst-surface);
    border: 1px solid var(--cst-border);
    border-radius: var(--cst-radius-lg);
    box-shadow: var(--cst-shadow-sm);
    padding: 24px;
}

.cst-form-card--actions[b-4brkptwkui] {
    padding: 20px 24px;
}

.cst-section-title[b-4brkptwkui] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--cst-ink);
    margin: 0 0 4px;
}

.cst-section-hint[b-4brkptwkui] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.875rem;
    color: var(--cst-muted);
    margin: 0 0 16px;
    line-height: 1.5;
}

/* =========================================================
   Text fields / Select (MudTextField + MudSelect outlined)
   ::deep pinned to .cst-form-card (plain div we render)
   ========================================================= */
.cst-field[b-4brkptwkui] {
    margin: 0;
}

.cst-form-card[b-4brkptwkui]  .mud-input-outlined .mud-input-outlined-border {
    border-radius: var(--cst-radius);
    border-color: var(--cst-border-strong);
}

.cst-form-card[b-4brkptwkui]  .mud-input-outlined:hover:not(.mud-disabled):not(.mud-error) .mud-input-outlined-border {
    border-color: var(--cst-primary);
}

.cst-form-card[b-4brkptwkui]  .mud-input-outlined.mud-focused:not(.mud-error) .mud-input-outlined-border {
    border-color: var(--cst-primary) !important;
    border-width: 2px;
}

.cst-form-card[b-4brkptwkui]  .mud-input-label.mud-focused:not(.mud-error) {
    color: var(--cst-primary) !important;
}

.cst-form-card[b-4brkptwkui]  .mud-input-control input,
.cst-form-card[b-4brkptwkui]  .mud-input-control textarea,
.cst-form-card[b-4brkptwkui]  .mud-select .mud-input-control input,
.cst-form-card[b-4brkptwkui]  .mud-select-input {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    color: var(--cst-ink);
}

.cst-form-card[b-4brkptwkui]  .mud-input-helper-text {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.75rem;
    color: var(--cst-muted);
    line-height: 1.4;
}

.cst-form-card[b-4brkptwkui]  .mud-input-helper-text.mud-input-error {
    color: var(--cst-danger);
}

.cst-form-card[b-4brkptwkui]  .mud-input-counter-helper {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.75rem;
    color: var(--cst-muted);
}

/* =========================================================
   Action row (inside .cst-form-card--actions)
   ========================================================= */
.cst-actions[b-4brkptwkui] {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.cst-draft-hint[b-4brkptwkui] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8125rem;
    color: var(--cst-muted);
    line-height: 1.4;
    margin: 12px 0 0;
    text-align: right;
}

.cst-form-card[b-4brkptwkui]  .mud-button-root.cst-btn {
    border-radius: var(--cst-radius);
    min-height: 44px;
    padding: 0 24px;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    gap: 8px;
}

.cst-form-card[b-4brkptwkui]  .cst-btn--submit.mud-button-filled-primary {
    background-color: var(--cst-primary) !important;
    color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(53, 160, 174, 0.3);
}

.cst-form-card[b-4brkptwkui]  .cst-btn--submit.mud-button-filled-primary:hover:not(:disabled) {
    background-color: var(--cst-primary-dark) !important;
    box-shadow: 0 2px 6px rgba(53, 160, 174, 0.4);
}

.cst-form-card[b-4brkptwkui]  .cst-btn--submit:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    box-shadow: none;
}

.cst-form-card[b-4brkptwkui]  .cst-btn--cancel {
    color: var(--cst-muted) !important;
    border-color: var(--cst-border-strong) !important;
    background-color: transparent !important;
}

.cst-form-card[b-4brkptwkui]  .cst-btn--cancel:hover:not(:disabled) {
    background-color: var(--cst-surface-raised) !important;
    color: var(--cst-ink) !important;
    border-color: var(--cst-border-strong) !important;
}

.cst-btn-spinner[b-4brkptwkui],
.cst-btn-icon[b-4brkptwkui] {
    margin-right: 0;
}

/* =========================================================
   Alerts (Error / Info)
   ========================================================= */
.cst-wrapper[b-4brkptwkui]  .cst-alert.mud-alert {
    border-radius: var(--cst-radius-lg) !important;
    border: 1px solid var(--cst-border);
    box-shadow: var(--cst-shadow-sm);
    font-family: 'Montserrat', sans-serif;
}

.cst-wrapper[b-4brkptwkui]  .cst-alert .mud-alert-message {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    line-height: 1.4;
    width: 100%;
}

.cst-alert-heading[b-4brkptwkui] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: var(--cst-ink);
    line-height: 1.3;
    display: block;
    margin-bottom: 4px;
}

.cst-alert-text[b-4brkptwkui] {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    line-height: 1.5;
    display: block;
}

.cst-alert-body[b-4brkptwkui] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cst-alert-actions[b-4brkptwkui] {
    display: flex;
    gap: 8px;
    margin-top: 4px;
    flex-wrap: wrap;
}

.cst-wrapper[b-4brkptwkui]  .cst-btn--ghost.mud-button-root {
    min-height: 44px;
    border-radius: var(--cst-radius);
    font-family: 'Montserrat', sans-serif;
    font-size: 0.9375rem;
    font-weight: 600;
    text-transform: none;
    padding: 0 20px;
}

.cst-wrapper[b-4brkptwkui]  .cst-btn--ghost.mud-button-outlined {
    color: var(--cst-muted) !important;
    border-color: var(--cst-border-strong) !important;
    background-color: transparent !important;
}

.cst-wrapper[b-4brkptwkui]  .cst-btn--ghost.mud-button-outlined:hover:not(:disabled) {
    background-color: var(--cst-surface-raised) !important;
    color: var(--cst-ink) !important;
}

/* Info alert branding — blue tint for onboard CTA */
.cst-wrapper[b-4brkptwkui]  .cst-alert.mud-alert-info {
    background-color: rgba(33, 150, 243, 0.06) !important;
    border-color: rgba(33, 150, 243, 0.22);
}

.cst-alert-actions .cst-btn--submit[b-4brkptwkui] {
    min-height: 44px;
}

.cst-wrapper[b-4brkptwkui]  .cst-alert-actions .cst-btn--submit.mud-button-filled-primary {
    background-color: var(--cst-primary) !important;
    color: #ffffff !important;
    border-radius: var(--cst-radius);
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    text-transform: none;
    padding: 0 20px;
    box-shadow: 0 1px 3px rgba(53, 160, 174, 0.3);
}

.cst-wrapper[b-4brkptwkui]  .cst-alert-actions .cst-btn--submit.mud-button-filled-primary:hover:not(:disabled) {
    background-color: var(--cst-primary-dark) !important;
    box-shadow: 0 2px 6px rgba(53, 160, 174, 0.4);
}

/* =========================================================
   Dialog mode — hero + breadcrumbs hidden,
   content starts at top of panel
   ========================================================= */
.cst-wrapper--dialog[b-4brkptwkui] {
    padding-bottom: 0;
    background-color: transparent;
}

.cst-wrapper--dialog .cst-hero-band[b-4brkptwkui] {
    display: none;
}

.cst-wrapper--dialog .cst-content[b-4brkptwkui] {
    margin-top: 0;
    padding: 0;
    max-width: 100%;
}

.cst-wrapper--dialog .cst-form-card[b-4brkptwkui] {
    box-shadow: none;
    border-radius: var(--cst-radius-lg);
}

/* =========================================================
   Tablet (≤ 959.98px)
   ========================================================= */
@media (max-width: 959.98px) {
    .cst-hero-band[b-4brkptwkui] {
        padding: 40px 16px 52px;
    }

    .cst-content[b-4brkptwkui] {
        padding: 0 16px;
        margin-top: -24px;
    }

    .cst-form-card[b-4brkptwkui] {
        padding: 20px;
    }

    .cst-form-card--actions[b-4brkptwkui] {
        padding: 18px 20px;
    }
}

/* =========================================================
   Mobile (≤ 599.98px)
   ========================================================= */
@media (max-width: 599.98px) {
    .cst-hero-band[b-4brkptwkui] {
        padding: 32px 16px 44px;
    }

    .cst-hero-title[b-4brkptwkui] {
        font-size: 1.5rem;
        margin-top: 10px;
    }

    .cst-hero-subtitle[b-4brkptwkui] {
        font-size: 0.9375rem;
    }

    .cst-content[b-4brkptwkui] {
        padding: 0 12px;
        gap: 12px;
        margin-top: -20px;
    }

    .cst-form-card[b-4brkptwkui] {
        padding: 16px;
    }

    .cst-form-card--actions[b-4brkptwkui] {
        padding: 16px;
    }

    .cst-section-title[b-4brkptwkui] {
        font-size: 1.0625rem;
    }

    .cst-actions[b-4brkptwkui] {
        flex-direction: column-reverse;
        gap: 8px;
    }

    .cst-draft-hint[b-4brkptwkui] {
        text-align: center;
    }

    .cst-form-card[b-4brkptwkui]  .mud-button-root.cst-btn {
        width: 100%;
    }

    .cst-alert-actions[b-4brkptwkui] {
        flex-direction: column;
        width: 100%;
    }

    .cst-wrapper[b-4brkptwkui]  .cst-btn--ghost.mud-button-root {
        width: 100%;
    }

    .cst-wrapper[b-4brkptwkui]  .cst-alert-actions .cst-btn--submit.mud-button-filled-primary {
        width: 100%;
    }
}

/* =========================================================
   Reduced motion
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
    .cst-form-card[b-4brkptwkui],
    .cst-form-card[b-4brkptwkui]  .mud-button-root.cst-btn {
        transition: none;
    }
}
/* /Components/Pages/OnboardingAgent/ViewOnboardingAgentUser.razor.rz.scp.css */
/* ============================================================
   Success Ambassador · View Onboarded User
   Test-191 redesign · scoped to .view-user-wrapper
   NOTE: tokens live on the wrapper class (not :root) because
   scoped CSS rewrites :root -> :root[b-xxxxx] which never matches.
   ============================================================ */

.view-user-wrapper[b-xi33dfj7jh] {
    --vu-primary: #35a0ae;
    --vu-primary-dark: #256f7a;
    --vu-primary-soft: rgba(53, 160, 174, 0.08);
    --vu-secondary: #ef412c;
    --vu-success: #4caf50;
    --vu-warning: #f59e0b;
    --vu-info: #2196f3;
    --vu-error: #f44336;
    --vu-ink: #1a2b2e;
    --vu-ink-soft: #334155;
    --vu-muted: #64748b;
    --vu-border: #e2e8f0;
    --vu-border-strong: #cbd5e1;
    --vu-surface: #ffffff;
    --vu-surface-alt: #f8fafc;
    --vu-radius: 8px;
    --vu-avatar-size: clamp(120px, 20vw, 200px);

    font-family: 'Montserrat', sans-serif;
    color: var(--vu-ink);
    background: var(--vu-surface-alt);
    min-height: calc(100vh - 64px);
}

/* Dialog mode: strip background + min-height, hide hero. */
.view-user-wrapper.view-user-wrapper--dialog[b-xi33dfj7jh] {
    background: transparent;
    min-height: 0;
}

.view-user-wrapper.view-user-wrapper--dialog .hero-band[b-xi33dfj7jh] {
    display: none;
}

/* ---------- Hero band ---------- */
.view-user-wrapper .hero-band[b-xi33dfj7jh] {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, var(--vu-primary) 0%, var(--vu-primary-dark) 100%);
    padding: 40px 32px;
}

.view-user-wrapper .hero-pattern[b-xi33dfj7jh] {
    position: absolute;
    inset: 0;
    background-image: url('/images/Icon_Dark_Green_TransparentBg_40.png');
    background-repeat: repeat;
    opacity: 0.08;
    pointer-events: none;
}

.view-user-wrapper .hero-inner[b-xi33dfj7jh] {
    position: relative;
    z-index: 1;
    max-width: 1440px;
    margin: 0 auto;
}

.view-user-wrapper .hero-inner[b-xi33dfj7jh]  .mud-breadcrumbs {
    padding: 0;
    margin-bottom: 12px;
}

.view-user-wrapper .hero-inner[b-xi33dfj7jh]  .mud-breadcrumb-item,
.view-user-wrapper .hero-inner[b-xi33dfj7jh]  .mud-breadcrumb-item a,
.view-user-wrapper .hero-inner[b-xi33dfj7jh]  .mud-breadcrumb-separator span,
.view-user-wrapper .hero-inner[b-xi33dfj7jh]  .mud-breadcrumb-item .mud-icon-root {
    color: rgba(255, 255, 255, 0.92) !important;
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    text-decoration: none;
}

.view-user-wrapper .hero-inner[b-xi33dfj7jh]  .mud-breadcrumb-item.mud-disabled,
.view-user-wrapper .hero-inner[b-xi33dfj7jh]  .mud-breadcrumb-item.mud-disabled a {
    color: #ffffff !important;
    font-weight: 600;
}

.view-user-wrapper .hero-inner[b-xi33dfj7jh]  .mud-breadcrumb-item a:hover {
    color: #ffffff !important;
    text-decoration: underline;
}

.view-user-wrapper .hero-title[b-xi33dfj7jh] {
    margin: 0;
    color: #ffffff;
    font-size: 2rem;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -0.01em;
    word-break: break-word;
}

.view-user-wrapper .hero-subtitle[b-xi33dfj7jh] {
    margin: 8px 0 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: 1rem;
    line-height: 1.5;
    max-width: 720px;
}

/* ---------- Content container ---------- */
.view-user-wrapper .content-container[b-xi33dfj7jh] {
    max-width: 1440px;
    margin: 0 auto;
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.view-user-wrapper.view-user-wrapper--dialog .content-container[b-xi33dfj7jh] {
    padding: 4px 0;
    max-width: none;
    gap: 20px;
}

/* ---------- Generic card ---------- */
.view-user-wrapper .vu-card[b-xi33dfj7jh] {
    background: var(--vu-surface);
    border: 1px solid var(--vu-border);
    border-radius: var(--vu-radius);
    padding: 24px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}

/* ---------- Section header ---------- */
.view-user-wrapper .vu-section-header[b-xi33dfj7jh] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--vu-border);
}

.view-user-wrapper .vu-section-icon[b-xi33dfj7jh]  .mud-icon-root,
.view-user-wrapper .vu-section-header[b-xi33dfj7jh]  .vu-section-icon {
    color: var(--vu-primary);
}

.view-user-wrapper .vu-section-title[b-xi33dfj7jh] {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--vu-ink);
    word-break: break-word;
}

.view-user-wrapper .vu-subsection-title[b-xi33dfj7jh] {
    margin: 16px 0 12px;
    font-size: 1rem;
    font-weight: 600;
    color: var(--vu-ink);
}

/* ---------- Skeleton ---------- */
.view-user-wrapper .vu-skeleton-shell[b-xi33dfj7jh] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.view-user-wrapper .vu-skeleton-profile[b-xi33dfj7jh] {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    background: var(--vu-surface);
    border: 1px solid var(--vu-border);
    border-radius: var(--vu-radius);
    padding: 24px;
}

.view-user-wrapper .vu-skeleton-lines[b-xi33dfj7jh] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

.view-user-wrapper .vu-skeleton-block[b-xi33dfj7jh] {
    border-radius: var(--vu-radius);
}

/* ---------- Pending request alert ---------- */
.view-user-wrapper .vu-pending-alert[b-xi33dfj7jh] {
    border-radius: var(--vu-radius);
    font-family: 'Montserrat', sans-serif;
}

.view-user-wrapper .vu-pending-body[b-xi33dfj7jh] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    justify-content: space-between;
}

.view-user-wrapper .vu-pending-text[b-xi33dfj7jh] {
    min-width: 0;
    flex: 1 1 280px;
}

.view-user-wrapper .vu-pending-title[b-xi33dfj7jh] {
    font-weight: 600;
    font-size: 1rem;
    color: var(--vu-ink);
    margin-bottom: 4px;
}

.view-user-wrapper .vu-pending-desc[b-xi33dfj7jh] {
    font-size: 0.875rem;
    color: var(--vu-ink-soft);
    line-height: 1.5;
}

.view-user-wrapper .vu-pending-actions[b-xi33dfj7jh] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

/* ---------- Error alert ---------- */
.view-user-wrapper .vu-error-alert[b-xi33dfj7jh] {
    border-radius: var(--vu-radius);
    font-family: 'Montserrat', sans-serif;
}

.view-user-wrapper .vu-error-body[b-xi33dfj7jh] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    justify-content: space-between;
}

.view-user-wrapper .vu-error-text[b-xi33dfj7jh] {
    flex: 1 1 280px;
    min-width: 0;
}

.view-user-wrapper .vu-error-title[b-xi33dfj7jh] {
    font-weight: 600;
    margin-bottom: 4px;
    color: var(--vu-ink);
}

.view-user-wrapper .vu-error-desc[b-xi33dfj7jh] {
    font-size: 0.875rem;
    color: var(--vu-ink-soft);
    line-height: 1.5;
}

/* ---------- Buttons ---------- */
.view-user-wrapper[b-xi33dfj7jh]  .vu-btn {
    min-height: 44px;
    border-radius: var(--vu-radius);
    text-transform: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    letter-spacing: 0;
    padding-inline: 20px;
}

.view-user-wrapper[b-xi33dfj7jh]  .vu-btn-primary {
    background-color: var(--vu-primary);
    color: #ffffff;
}

.view-user-wrapper[b-xi33dfj7jh]  .vu-btn-primary:hover {
    background-color: var(--vu-primary-dark);
}

/* ---------- Profile card ---------- */
.view-user-wrapper .vu-profile-grid[b-xi33dfj7jh] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 32px;
    align-items: flex-start;
}

.view-user-wrapper .vu-profile-avatar-col[b-xi33dfj7jh] {
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.view-user-wrapper .vu-profile-info-col[b-xi33dfj7jh] {
    min-width: 0;
}

.view-user-wrapper .vu-avatar[b-xi33dfj7jh] {
    width: var(--vu-avatar-size);
    height: var(--vu-avatar-size);
    border-radius: 50%;
    border: 3px solid var(--vu-border-strong);
    background: var(--vu-primary-soft);
    display: grid;
    place-items: center;
    overflow: hidden;
    object-fit: cover;
    color: var(--vu-primary-dark);
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 700;
    letter-spacing: 0.02em;
    user-select: none;
}

.view-user-wrapper .vu-avatar-img[b-xi33dfj7jh] {
    object-fit: cover;
}

/* ---------- Info rows ---------- */
.view-user-wrapper .vu-info-table[b-xi33dfj7jh] {
    display: flex;
    flex-direction: column;
}

.view-user-wrapper .vu-info-row[b-xi33dfj7jh] {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 16px;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid var(--vu-border);
}

.view-user-wrapper .vu-info-row:last-child[b-xi33dfj7jh] {
    border-bottom: none;
}

/* Desktop label from data-label attr. */
.view-user-wrapper .vu-info-row[b-xi33dfj7jh]::before {
    content: attr(data-label);
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--vu-muted);
}

.view-user-wrapper .vu-info-value[b-xi33dfj7jh] {
    color: var(--vu-ink);
    font-size: 0.9375rem;
    line-height: 1.5;
    word-break: break-word;
}

.view-user-wrapper .vu-info-value-name[b-xi33dfj7jh] {
    font-weight: 600;
    font-size: 1rem;
}

.view-user-wrapper .vu-info-value-masked[b-xi33dfj7jh] {
    font-family: 'Montserrat', sans-serif;
    cursor: help;
}

.view-user-wrapper .vu-info-value-empty[b-xi33dfj7jh] {
    color: var(--vu-muted);
    font-weight: 500;
}

.view-user-wrapper[b-xi33dfj7jh]  .vu-chip {
    font-weight: 600;
    text-transform: none;
    font-family: 'Montserrat', sans-serif;
    border-radius: 999px;
    padding-inline: 12px;
}

/* ---------- Metrics grid ---------- */
.view-user-wrapper .vu-metrics-grid[b-xi33dfj7jh] {
    margin-bottom: 16px;
}

.view-user-wrapper .vu-metric-card[b-xi33dfj7jh] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: var(--vu-surface);
    border: 1px solid var(--vu-border);
    border-radius: var(--vu-radius);
    height: 100%;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.view-user-wrapper .vu-metric-card:hover[b-xi33dfj7jh] {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.08);
}

.view-user-wrapper .vu-metric-icon[b-xi33dfj7jh] {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #ffffff;
}

.view-user-wrapper .vu-metric-icon-primary[b-xi33dfj7jh] {
    background: var(--vu-primary);
}

.view-user-wrapper .vu-metric-icon-success[b-xi33dfj7jh] {
    background: var(--vu-success);
}

.view-user-wrapper .vu-metric-icon-warning[b-xi33dfj7jh] {
    background: var(--vu-warning);
}

.view-user-wrapper .vu-metric-icon-info[b-xi33dfj7jh] {
    background: var(--vu-info);
}

.view-user-wrapper .vu-metric-icon[b-xi33dfj7jh]  .mud-icon-root {
    font-size: 24px;
    color: #ffffff;
}

.view-user-wrapper .vu-metric-body[b-xi33dfj7jh] {
    min-width: 0;
}

.view-user-wrapper .vu-metric-label[b-xi33dfj7jh] {
    color: var(--vu-muted);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 4px;
}

.view-user-wrapper .vu-metric-value[b-xi33dfj7jh] {
    color: var(--vu-ink);
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1;
}

/* ---------- Most rented list ---------- */
.view-user-wrapper .vu-rental-list[b-xi33dfj7jh] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.view-user-wrapper .vu-rental-item[b-xi33dfj7jh] {
    display: flex;
    gap: 16px;
    padding: 12px;
    background: var(--vu-surface-alt);
    border: 1px solid var(--vu-border);
    border-radius: var(--vu-radius);
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.view-user-wrapper .vu-rental-item:hover[b-xi33dfj7jh] {
    background: var(--vu-primary-soft);
    border-color: var(--vu-primary);
}

.view-user-wrapper .vu-rental-thumb[b-xi33dfj7jh] {
    flex-shrink: 0;
    width: 96px;
    height: 96px;
    border-radius: var(--vu-radius);
    overflow: hidden;
    background: var(--vu-border);
    display: grid;
    place-items: center;
}

.view-user-wrapper .vu-rental-thumb img[b-xi33dfj7jh] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.view-user-wrapper .vu-rental-thumb-placeholder[b-xi33dfj7jh] {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    color: var(--vu-muted);
    background: var(--vu-surface);
}

.view-user-wrapper .vu-rental-body[b-xi33dfj7jh] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
}

.view-user-wrapper .vu-rental-name[b-xi33dfj7jh] {
    font-weight: 600;
    font-size: 1rem;
    color: var(--vu-ink);
    line-height: 1.4;
}

.view-user-wrapper .vu-rental-desc[b-xi33dfj7jh] {
    font-size: 0.875rem;
    color: var(--vu-muted);
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ---------- Rating section ---------- */
.view-user-wrapper .vu-rating-row[b-xi33dfj7jh] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

/* MudRating's internal star buttons — scope to the plain wrapper div we
   render ourselves so the [b-xxxxx] scope attribute is present on the chain. */
.view-user-wrapper .vu-rating-row[b-xi33dfj7jh]  .mud-rating-item {
    color: var(--vu-primary);
}

.view-user-wrapper .vu-rating-row[b-xi33dfj7jh]  .mud-rating-item-active {
    color: var(--vu-primary);
}

.view-user-wrapper .vu-rating-text[b-xi33dfj7jh] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
}

.view-user-wrapper .vu-rating-avg[b-xi33dfj7jh] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--vu-ink);
}

.view-user-wrapper .vu-rating-count[b-xi33dfj7jh] {
    color: var(--vu-muted);
    font-size: 0.9375rem;
}

.view-user-wrapper .vu-rating-stats[b-xi33dfj7jh] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.view-user-wrapper .vu-rating-stat[b-xi33dfj7jh] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: var(--vu-primary-soft);
    border-radius: 999px;
    border: 1px solid transparent;
}

.view-user-wrapper .vu-rating-stat-label[b-xi33dfj7jh] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--vu-primary-dark);
}

.view-user-wrapper .vu-rating-stat-value[b-xi33dfj7jh] {
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--vu-ink);
}

/* ---------- Empty alert ---------- */
.view-user-wrapper .vu-empty-alert[b-xi33dfj7jh] {
    border-radius: var(--vu-radius);
    font-family: 'Montserrat', sans-serif;
}

/* ---------- Dialog close row ---------- */
.view-user-wrapper .vu-dialog-actions[b-xi33dfj7jh] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 8px;
}

/* ============================================================
   Responsive — tablet
   ============================================================ */
@media (max-width: 959px) {
    .view-user-wrapper .hero-band[b-xi33dfj7jh] {
        padding: 32px 24px;
    }

    .view-user-wrapper .hero-title[b-xi33dfj7jh] {
        font-size: 1.75rem;
    }

    .view-user-wrapper .content-container[b-xi33dfj7jh] {
        padding: 24px 20px;
        gap: 20px;
    }

    .view-user-wrapper .vu-card[b-xi33dfj7jh] {
        padding: 20px;
    }

    .view-user-wrapper .vu-profile-grid[b-xi33dfj7jh] {
        grid-template-columns: 1fr;
        gap: 20px;
        justify-items: center;
        text-align: left;
    }

    .view-user-wrapper .vu-profile-avatar-col[b-xi33dfj7jh] {
        justify-content: center;
    }

    .view-user-wrapper .vu-profile-info-col[b-xi33dfj7jh] {
        width: 100%;
    }

    .view-user-wrapper .vu-info-row[b-xi33dfj7jh] {
        grid-template-columns: 160px 1fr;
    }
}

/* ============================================================
   Responsive — mobile (stacked-card transform for info rows)
   ============================================================ */
@media (max-width: 599px) {
    .view-user-wrapper .hero-band[b-xi33dfj7jh] {
        padding: 24px 16px;
    }

    .view-user-wrapper .hero-title[b-xi33dfj7jh] {
        font-size: 1.5rem;
    }

    .view-user-wrapper .hero-subtitle[b-xi33dfj7jh] {
        font-size: 0.9375rem;
    }

    .view-user-wrapper .content-container[b-xi33dfj7jh] {
        padding: 20px 16px;
        gap: 16px;
    }

    .view-user-wrapper .vu-card[b-xi33dfj7jh] {
        padding: 16px;
    }

    .view-user-wrapper .vu-section-header[b-xi33dfj7jh] {
        margin-bottom: 16px;
    }

    .view-user-wrapper .vu-section-title[b-xi33dfj7jh] {
        font-size: 1rem;
    }

    /* Info rows collapse to stacked layout using ::before pseudo-label. */
    .view-user-wrapper .vu-info-row[b-xi33dfj7jh] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        padding: 10px 0;
    }

    .view-user-wrapper .vu-info-row[b-xi33dfj7jh]::before {
        font-size: 0.6875rem;
    }

    .view-user-wrapper .vu-info-value[b-xi33dfj7jh] {
        font-size: 0.9375rem;
    }

    .view-user-wrapper .vu-info-value-name[b-xi33dfj7jh] {
        font-size: 1rem;
    }

    /* Metric cards stack tighter */
    .view-user-wrapper .vu-metric-card[b-xi33dfj7jh] {
        padding: 12px;
        gap: 12px;
    }

    .view-user-wrapper .vu-metric-icon[b-xi33dfj7jh] {
        width: 40px;
        height: 40px;
    }

    .view-user-wrapper .vu-metric-value[b-xi33dfj7jh] {
        font-size: 1.375rem;
    }

    /* Rentals thumbnail shrinks; description truncates to 1 line. */
    .view-user-wrapper .vu-rental-item[b-xi33dfj7jh] {
        gap: 12px;
        padding: 10px;
    }

    .view-user-wrapper .vu-rental-thumb[b-xi33dfj7jh] {
        width: 72px;
        height: 72px;
    }

    .view-user-wrapper .vu-rental-name[b-xi33dfj7jh] {
        font-size: 0.9375rem;
    }

    .view-user-wrapper .vu-rental-desc[b-xi33dfj7jh] {
        font-size: 0.8125rem;
        -webkit-line-clamp: 1;
        line-clamp: 1;
    }

    /* Pending + error actions full-width */
    .view-user-wrapper .vu-pending-body[b-xi33dfj7jh],
    .view-user-wrapper .vu-error-body[b-xi33dfj7jh] {
        flex-direction: column;
        align-items: stretch;
    }

    .view-user-wrapper .vu-pending-actions[b-xi33dfj7jh],
    .view-user-wrapper .vu-error-body[b-xi33dfj7jh]  .vu-btn {
        width: 100%;
    }

    .view-user-wrapper .vu-pending-actions[b-xi33dfj7jh]  .vu-btn {
        flex: 1 1 140px;
    }

    /* Rating row stacks */
    .view-user-wrapper .vu-rating-row[b-xi33dfj7jh] {
        gap: 12px;
    }

    .view-user-wrapper .vu-rating-avg[b-xi33dfj7jh] {
        font-size: 1.25rem;
    }
}

/* ============================================================
   Respect reduced motion
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
    .view-user-wrapper .vu-metric-card[b-xi33dfj7jh],
    .view-user-wrapper .vu-rental-item[b-xi33dfj7jh] {
        transition: none;
    }
}
/* /Components/Pages/Order/Components/MobileCheckoutWizard.razor.rz.scp.css */
/*
   MobileCheckoutWizard companion CSS — adapts the canonical .ciw-* pattern from
   CatalogueInterestWizard.razor.css (circular step indicator + pulse animation +
   sticky footer via flexbox) to the mobile checkout surface. Renamed mcw-* to
   keep namespaces distinct.

   Variables MUST live on a class that renders (`.mcw-shell`), NOT :root, per
   memory feedback_blazor_scoped_css_root_selector.md.

   Step body content (CheckoutStepDates etc.) renders inside .mcw-body. Those
   step components have their own b-xxxxx scope attribute, so child-element
   rules use ::deep to reach in — this is valid in a companion .razor.css.

   Brand: primary teal #35a0ae, success green #4caf50, Montserrat font.
*/

.mcw-shell[b-eo8omb36qu] {
    --mcw-primary: #35a0ae;
    --mcw-primary-soft: rgba(53, 160, 174, 0.08);
    --mcw-primary-ring: rgba(53, 160, 174, 0.18);
    --mcw-success: #4caf50;
    --mcw-border: #e8ecf1;
    --mcw-border-soft: #f1f5f9;
    --mcw-text-primary: #0f172a;
    --mcw-text-secondary: #64748b;
    --mcw-text-muted: #94a3b8;
    --mcw-surface: #ffffff;
    --mcw-surface-soft: #f8fafc;

    /* Flex column so .mcw-footer { margin-top: auto } pins to the viewport
       bottom regardless of step body height. dvh first for newer browsers. */
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 20px 16px;
    background: var(--mcw-surface);
    font-family: 'Montserrat', sans-serif;
    color: var(--mcw-text-primary);
    box-sizing: border-box;
}

/* === Progress strip ============================================ */

.mcw-progress[b-eo8omb36qu] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 0 24px 0;
    margin: 0;
    list-style: none;
}

.mcw-step-item[b-eo8omb36qu] {
    display: contents;
}

.mcw-step[b-eo8omb36qu] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 2px solid var(--mcw-border);
    background: var(--mcw-surface);
    color: var(--mcw-text-secondary);
    font-size: 0.8125rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 200ms ease, border-color 200ms ease, color 200ms ease;
    flex-shrink: 0;
}

.mcw-step.upcoming[b-eo8omb36qu] {
    background: var(--mcw-surface);
    border-color: var(--mcw-border);
    color: var(--mcw-text-muted);
}

.mcw-step.current[b-eo8omb36qu] {
    background: var(--mcw-primary);
    border-color: var(--mcw-primary);
    color: #fff;
    animation: mcw-pulse-b-eo8omb36qu 1.6s infinite ease-in-out;
}

.mcw-step.completed[b-eo8omb36qu] {
    background: var(--mcw-success);
    border-color: var(--mcw-success);
    color: #fff;
}

.mcw-connector[b-eo8omb36qu] {
    flex: 1 1 auto;
    height: 2px;
    background: var(--mcw-border);
    max-width: 56px;
    align-self: center;
    transition: background-color 200ms ease;
}

.mcw-connector.done[b-eo8omb36qu] {
    background: var(--mcw-success);
}

@keyframes mcw-pulse-b-eo8omb36qu {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(53, 160, 174, 0.4);
    }
    50% {
        box-shadow: 0 0 0 8px rgba(53, 160, 174, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .mcw-step.current[b-eo8omb36qu] {
        animation: none;
    }
    .mcw-step[b-eo8omb36qu],
    .mcw-connector[b-eo8omb36qu] {
        transition: none;
    }
}

/* === Step title === */

.mcw-step-title[b-eo8omb36qu] {
    margin-bottom: 16px;
}

.mcw-step-title h2[b-eo8omb36qu] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--mcw-text-primary);
    margin: 0 0 4px 0;
}

.mcw-step-subtitle[b-eo8omb36qu] {
    font-size: 0.875rem;
    line-height: 1.4;
    color: var(--mcw-text-secondary);
    margin: 0;
}

/* === Body (scrollable middle region) === */

.mcw-body[b-eo8omb36qu] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-bottom: 16px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* iOS form-zoom prevention. Mirrors MobileCategoryNav + MobileBottomSheet rule. */
.mcw-body[b-eo8omb36qu]  input[type="text"],
.mcw-body[b-eo8omb36qu]  input[type="number"],
.mcw-body[b-eo8omb36qu]  input[type="email"],
.mcw-body[b-eo8omb36qu]  input[type="tel"],
.mcw-body[b-eo8omb36qu]  input[type="search"],
.mcw-body[b-eo8omb36qu]  input[type="password"],
.mcw-body[b-eo8omb36qu]  textarea {
    font-size: 16px;
}

/* === Footer (sticky CTA region via flexbox) === */

.mcw-footer[b-eo8omb36qu] {
    flex-shrink: 0;
    margin-top: auto;
    padding: 16px 0 0;
    padding-bottom: max(0px, env(safe-area-inset-bottom));
    border-top: 1px solid var(--mcw-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

/* Brand-consistent buttons in footer — meets WCAG 2.5.5 (44px) and platform
   conventions (text-transform: none, 8px radius, Montserrat). ::deep is valid
   in a companion .razor.css. */
.mcw-footer[b-eo8omb36qu]  .mud-button-root {
    min-height: 48px;
    text-transform: none;
    border-radius: 8px;
    font-family: 'Montserrat', sans-serif;
}

/* === Shared step-content primitives — exposed for step components ============
   Step components like CheckoutStepDates render their own b-xxxxx scope, so
   their .mcw-card / .mcw-summary divs aren't directly matched by .mcw-shell
   selectors. ::deep bridges the scope.
*/

.mcw-shell[b-eo8omb36qu]  .mcw-card {
    padding: 16px;
    border-radius: 14px;
    background: var(--mcw-surface);
    border: 1px solid var(--mcw-border);
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.mcw-shell[b-eo8omb36qu]  .mcw-card-header {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: var(--mcw-text-primary);
}

.mcw-shell[b-eo8omb36qu]  .mcw-card-header-text {
    font-size: 0.9375rem;
}

.mcw-shell[b-eo8omb36qu]  .mcw-section-heading {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--mcw-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 4px 0 0 0;
}

.mcw-shell[b-eo8omb36qu]  .mcw-summary {
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.mcw-shell[b-eo8omb36qu]  .mcw-summary-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--mcw-border-soft);
}

.mcw-shell[b-eo8omb36qu]  .mcw-summary-row:last-child {
    border-bottom: 0;
}

.mcw-shell[b-eo8omb36qu]  .mcw-summary-row dt {
    margin: 0;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--mcw-text-secondary);
}

.mcw-shell[b-eo8omb36qu]  .mcw-summary-row dd {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--mcw-text-primary);
    text-align: right;
}

.mcw-shell[b-eo8omb36qu]  .mcw-summary-meta {
    display: block;
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--mcw-text-muted);
    margin-top: 2px;
}

.mcw-shell[b-eo8omb36qu]  .mcw-change-button {
    margin-top: 4px;
}

/* === Ultra-narrow tuning (≤ 380px) === */

@media (max-width: 380px) {
    .mcw-shell[b-eo8omb36qu] {
        padding: 16px 12px;
    }

    .mcw-step-title h2[b-eo8omb36qu] {
        font-size: 1.125rem;
    }

    .mcw-connector[b-eo8omb36qu] {
        max-width: 36px;
    }

    .mcw-shell[b-eo8omb36qu]  .mcw-card {
        padding: 14px;
    }
}
/* /Components/Pages/Organization/Review/CreateOrganizationReview.razor.rz.scp.css */
/* ==========================================================================
   Create Organization Review — scoped styles
   Brand: primary #35a0ae, secondary #EF412c, neutral #424242 / #616161
   Uses ::deep for class selectors that target MudBlazor component roots,
   because Blazor scoped CSS does not attach the scope attribute to
   child-component rendered markup.
   ========================================================================== */

[b-qcwyahgxzu] .review-breadcrumbs {
    font-size: 0.875rem;
}

[b-qcwyahgxzu] .page-title-h1 {
    font-family: "Montserrat", sans-serif;
    font-weight: 600;
    color: #424242;
}

.review-loading[b-qcwyahgxzu] {
    text-align: center;
    padding: 48px 16px;
    color: #616161;
}

/* ----- Org context card ----- */
[b-qcwyahgxzu] .review-org-card,
[b-qcwyahgxzu] .review-eligibility-card {
    border-radius: 12px !important;
    border-color: #e0e0e0 !important;
}

[b-qcwyahgxzu] .review-org-subtitle,
[b-qcwyahgxzu] .review-eligibility-copy {
    color: #616161;
}

/* ----- Form sections ----- */
.review-form[b-qcwyahgxzu] {
    display: block;
}

[b-qcwyahgxzu] .review-section {
    border-radius: 12px !important;
    border-color: #e0e0e0 !important;
    padding: 20px;
}

[b-qcwyahgxzu] .review-section-heading {
    color: #424242;
    font-weight: 600;
    margin-bottom: 16px;
}

[b-qcwyahgxzu] .review-text-field {
    width: 100%;
}

/* ----- Rating rows ----- */
.rating-row[b-qcwyahgxzu] {
    display: grid;
    grid-template-columns: 40px 1fr auto;
    align-items: center;
    gap: 16px;
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
}

.rating-row:last-child[b-qcwyahgxzu] {
    border-bottom: none;
}

.rating-row-text[b-qcwyahgxzu] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

[b-qcwyahgxzu] .rating-label {
    color: #424242;
    font-weight: 500;
}

[b-qcwyahgxzu] .rating-help {
    color: #757575;
}

[b-qcwyahgxzu] .rating-icon {
    width: 32px !important;
    height: 32px !important;
}

[b-qcwyahgxzu] .rating-icon-primary {
    color: #35a0ae !important;
}

[b-qcwyahgxzu] .rating-icon-secondary {
    color: #424242 !important;
}

/* ----- Action buttons ----- */
.review-actions[b-qcwyahgxzu] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: flex-end;
    align-items: center;
    margin-top: 8px;
}

[b-qcwyahgxzu] .review-submit-btn,
[b-qcwyahgxzu] .review-cancel-btn {
    min-height: 44px !important;
    border-radius: 8px !important;
    text-transform: none !important;
    font-weight: 500;
}

[b-qcwyahgxzu] .review-submit-btn {
    min-width: 180px;
}

/* ----- Mobile layout ----- */
@media (max-width: 600px) {
    .rating-row[b-qcwyahgxzu] {
        grid-template-columns: 32px 1fr;
        grid-template-rows: auto auto;
        gap: 8px 12px;
    }

    [b-qcwyahgxzu] .rating-row > .mud-rating,
    [b-qcwyahgxzu] .rating-row > [class*="mud-rating"] {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .review-actions[b-qcwyahgxzu] {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    [b-qcwyahgxzu] .review-submit-btn,
    [b-qcwyahgxzu] .review-cancel-btn {
        width: 100%;
        min-width: 0;
    }

    [b-qcwyahgxzu] .review-section {
        padding: 16px;
    }
}

/* ----- Reduced motion ----- */
@media (prefers-reduced-motion: reduce) {
    [b-qcwyahgxzu] .review-section,
    [b-qcwyahgxzu] .review-org-card,
    [b-qcwyahgxzu] .review-eligibility-card {
        transition: none;
    }
}
/* /Components/Pages/Rental/Catalogue.razor.rz.scp.css */
/* Main catalogue container */
.catalogue-container[b-x2sc61bm1q] {
    position: relative;
    width: 100%;
    min-height: 400px;
    overflow: hidden;
}

/* Drawer container styles */
.catalogue-drawer-container[b-x2sc61bm1q] {
    min-height: 400px;
    position: relative !important;
    height: 100%;
}

.catalogue-filter-drawer[b-x2sc61bm1q] {
    background: white;
    position: absolute !important;
}

/* Override MudDrawer to be contained */
[b-x2sc61bm1q] .mud-drawer-root {
    position: absolute !important;
}

[b-x2sc61bm1q] .mud-overlay {
    position: absolute !important;
}

.filter-panel-content[b-x2sc61bm1q] {
    height: 100%;
    overflow-y: auto;
}

/* Override MudDrawer transitions for smoothness */
[b-x2sc61bm1q] .mud-drawer-persistent {
    transition: margin 0.3s cubic-bezier(0.4, 0, 0.2, 1), width 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

[b-x2sc61bm1q] .mud-main-content {
    transition: margin-left 0.3s cubic-bezier(0.4, 0, 0.2, 1), margin-right 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Rental cards grid styles - main definitions in inline <style> for responsive breakpoints */

/* Map view container */
.map-view-container[b-x2sc61bm1q] {
    height: 600px;
    margin-top: 20px;
    width: 100%;
    overflow: hidden;
    position: relative;
    border-radius: 8px;
}

/* Pagination wrapper */
.pagination-wrapper[b-x2sc61bm1q] {
    margin-top: 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}

.pagination-info[b-x2sc61bm1q] {
    display: flex;
    align-items: center;
    gap: 15px;
}

/* Responsive grid adjustments handled in inline <style> block */
@media (max-width: 768px) {
    .filter-toggle-collapsed[b-x2sc61bm1q] {
        min-height: auto;
    }
}

/* Header for embedded mode */
.rentals-header[b-x2sc61bm1q] {
    margin-bottom: 16px;
}

/* Clear button styles */
.clear-link-btn[b-x2sc61bm1q] {
    padding: 4px 8px;
    font-size: 0.875rem;
}

.clear-icon-btn[b-x2sc61bm1q] {
    margin-left: 4px;
}
/* /Components/Pages/Rental/Components/CatalogueInterestWizard.razor.rz.scp.css */
/*
   CatalogueInterestWizard scoped CSS — Blazor rewrites every selector with the
   component's b-xxxxx attribute. Variables MUST live on a class that renders in
   the template (e.g., .ciw-shell) — :root would be rewritten to :root[b-xxxxx]
   which never matches (per memory feedback_blazor_scoped_css_root_selector.md).

   Brand spec: primary teal #35a0ae, success green #4caf50, Montserrat font.
   All MudButton style overrides use Class hooks on the call sites — this file
   stays scoped to plain elements rendered by the wizard itself.
*/

.ciw-shell[b-q83ny87lyj] {
    --ciw-primary: #35a0ae;
    --ciw-primary-soft: rgba(53, 160, 174, 0.08);
    --ciw-primary-ring: rgba(53, 160, 174, 0.18);
    --ciw-success: #4caf50;
    --ciw-border: #e8ecf1;
    --ciw-border-soft: #f1f5f9;
    --ciw-text-primary: #0f172a;
    --ciw-text-secondary: #64748b;
    --ciw-text-muted: #94a3b8;
    --ciw-surface: #ffffff;
    --ciw-surface-soft: #f8fafc;

    position: relative;
    padding: 24px;
    background: var(--ciw-surface);
    font-family: 'Montserrat', sans-serif;
    color: var(--ciw-text-primary);
}

.ciw-header[b-q83ny87lyj] {
    padding-right: 40px;
}

.ciw-header h5[b-q83ny87lyj] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--ciw-text-primary);
    margin: 0 0 4px 0;
}

.ciw-header__subtitle[b-q83ny87lyj] {
    font-size: 0.875rem;
    line-height: 1.4;
    color: var(--ciw-text-secondary);
    margin-bottom: 0;
}

.ciw-header__close[b-q83ny87lyj] {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 0;
    background: transparent;
    color: var(--ciw-text-secondary);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 160ms ease, color 160ms ease;
}

.ciw-header__close:hover[b-q83ny87lyj],
.ciw-header__close:focus-visible[b-q83ny87lyj] {
    background: var(--ciw-surface-soft);
    color: var(--ciw-text-primary);
    outline: 2px solid var(--ciw-primary-ring);
    outline-offset: 2px;
}

/* === Progress strip ============================================ */

.ciw-progress[b-q83ny87lyj] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px 0 20px 0;
}

.ciw-step[b-q83ny87lyj] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 2px solid var(--ciw-border);
    background: var(--ciw-surface);
    color: var(--ciw-text-secondary);
    font-size: 0.8125rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 200ms ease, border-color 200ms ease, color 200ms ease;
    flex-shrink: 0;
}

.ciw-step.upcoming[b-q83ny87lyj] {
    background: var(--ciw-surface);
    border-color: var(--ciw-border);
    color: var(--ciw-text-muted);
}

.ciw-step.current[b-q83ny87lyj] {
    background: var(--ciw-primary);
    border-color: var(--ciw-primary);
    color: #fff;
    animation: ciw-pulse-b-q83ny87lyj 1.6s infinite ease-in-out;
}

.ciw-step.completed[b-q83ny87lyj] {
    background: var(--ciw-success);
    border-color: var(--ciw-success);
    color: #fff;
}

.ciw-connector[b-q83ny87lyj] {
    flex: 1 1 auto;
    height: 2px;
    background: var(--ciw-border);
    max-width: 64px;
    align-self: center;
    transition: background-color 200ms ease;
}

.ciw-connector.done[b-q83ny87lyj] {
    background: var(--ciw-success);
}

@keyframes ciw-pulse-b-q83ny87lyj {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(53, 160, 174, 0.4);
    }
    50% {
        box-shadow: 0 0 0 8px rgba(53, 160, 174, 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .ciw-step.current[b-q83ny87lyj] {
        animation: none;
    }
    .ciw-step[b-q83ny87lyj],
    .ciw-connector[b-q83ny87lyj],
    .ciw-tile[b-q83ny87lyj],
    .ciw-header__close[b-q83ny87lyj] {
        transition: none;
    }
}

/* === Step title row ============================================ */

.ciw-step-title[b-q83ny87lyj] {
    margin-bottom: 16px;
}

.ciw-step-title h6[b-q83ny87lyj] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: var(--ciw-text-primary);
    margin: 0 0 4px 0;
}

.ciw-step-subtitle[b-q83ny87lyj] {
    font-size: 0.8125rem;
    color: var(--ciw-text-secondary);
    line-height: 1.4;
}

/* === Step 1: tile grid ========================================= */

.ciw-tile-grid[b-q83ny87lyj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 12px;
}

.ciw-tile[b-q83ny87lyj] {
    position: relative;
    min-height: 120px;
    padding: 14px 12px;
    background: var(--ciw-surface);
    border: 2px solid var(--ciw-border);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    transition: border-color 200ms ease, background-color 200ms ease,
                box-shadow 200ms ease, transform 200ms ease;
    font-family: 'Montserrat', sans-serif;
    text-align: center;
    overflow: hidden;
}

.ciw-tile:hover[b-q83ny87lyj] {
    border-color: var(--ciw-primary);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
}

.ciw-tile:focus-visible[b-q83ny87lyj] {
    outline: 2px solid var(--ciw-primary);
    outline-offset: 2px;
}

.ciw-tile--selected[b-q83ny87lyj],
.ciw-tile[aria-pressed="true"][b-q83ny87lyj] {
    border-color: var(--ciw-primary);
    background: var(--ciw-primary-soft);
}

.ciw-tile__check[b-q83ny87lyj] {
    position: absolute;
    top: 6px;
    right: 6px;
    color: var(--ciw-primary);
    opacity: 0;
    transition: opacity 200ms ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.ciw-tile--selected .ciw-tile__check[b-q83ny87lyj],
.ciw-tile[aria-pressed="true"] .ciw-tile__check[b-q83ny87lyj] {
    opacity: 1;
}

.ciw-tile__icon-wrap[b-q83ny87lyj] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--ciw-surface-soft);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.ciw-tile--selected .ciw-tile__icon-wrap[b-q83ny87lyj],
.ciw-tile[aria-pressed="true"] .ciw-tile__icon-wrap[b-q83ny87lyj] {
    background: rgba(53, 160, 174, 0.16);
}

/* The Material icon inside the tile picks up its size and color from the
   parent wrapper so the brand teal flows through ::deep — but ::deep is only
   allowed in scoped razor.css files (which this is). MudIcon emits its own
   SVG inside, so reach in once to colour it. */
.ciw-tile[b-q83ny87lyj]  .ciw-tile__icon {
    color: var(--ciw-primary);
    font-size: 28px;
}

.ciw-tile--all .ciw-tile__icon-wrap[b-q83ny87lyj] {
    background: rgba(53, 160, 174, 0.12);
}

.ciw-tile--all[b-q83ny87lyj]  .ciw-tile__icon {
    font-size: 32px;
}

.ciw-tile__label[b-q83ny87lyj] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--ciw-text-primary);
    line-height: 1.25;
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
}

.ciw-tile__count[b-q83ny87lyj] {
    font-size: 0.6875rem;
    font-weight: 500;
    color: var(--ciw-text-muted);
}

.ciw-tile--selected .ciw-tile__count[b-q83ny87lyj],
.ciw-tile[aria-pressed="true"] .ciw-tile__count[b-q83ny87lyj] {
    color: var(--ciw-primary);
}

/* === See-all toggle ============================================ */

.ciw-show-all[b-q83ny87lyj] {
    margin: 16px auto 4px;
    padding: 8px 14px;
    border: 0;
    background: transparent;
    color: var(--ciw-primary);
    font-family: 'Montserrat', sans-serif;
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 8px;
    transition: background-color 160ms ease;
}

.ciw-show-all:hover[b-q83ny87lyj],
.ciw-show-all:focus-visible[b-q83ny87lyj] {
    background: var(--ciw-primary-soft);
    outline: none;
}

/* === Step 2: distance slider =================================== */

.ciw-info-card[b-q83ny87lyj] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    background: var(--ciw-surface-soft);
    border: 1px solid var(--ciw-border);
    border-radius: 12px;
    margin-bottom: 20px;
}

.ciw-info-card[b-q83ny87lyj]  .ciw-info-card__icon {
    color: var(--ciw-primary);
    font-size: 28px;
    flex-shrink: 0;
}

.ciw-info-card__body[b-q83ny87lyj] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ciw-info-card__title[b-q83ny87lyj] {
    font-weight: 600;
    color: var(--ciw-text-primary);
    font-size: 0.875rem;
}

.ciw-info-card__hint[b-q83ny87lyj] {
    color: var(--ciw-text-secondary);
    font-size: 0.8125rem;
    line-height: 1.4;
}

.ciw-info-card__link[b-q83ny87lyj] {
    margin-top: 4px;
    font-size: 0.8125rem;
    font-weight: 600;
}

.ciw-slider-row[b-q83ny87lyj] {
    padding: 8px 4px 4px;
}

.ciw-slider-row--disabled[b-q83ny87lyj] {
    opacity: 0.6;
}

.ciw-slider-summary[b-q83ny87lyj] {
    margin-top: 12px;
    padding: 10px 14px;
    background: var(--ciw-primary-soft);
    border-radius: 10px;
    color: var(--ciw-primary);
    font-size: 0.875rem;
    font-weight: 500;
    text-align: center;
}

.ciw-slider-summary strong[b-q83ny87lyj] {
    font-weight: 700;
}

/* === Footer (button rail) ====================================== */

.ciw-footer[b-q83ny87lyj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 20px;
    border-top: 1px solid var(--ciw-border);
    margin-top: 24px;
    gap: 8px;
}

.ciw-footer--three[b-q83ny87lyj] {
    justify-content: space-between;
}

.ciw-footer--three .ciw-btn-text--center[b-q83ny87lyj] {
    margin-left: auto;
    margin-right: auto;
}

.ciw-btn-text[b-q83ny87lyj] {
    font-family: 'Montserrat', sans-serif !important;
    text-transform: none !important;
    border-radius: 8px !important;
}

.ciw-btn-primary[b-q83ny87lyj] {
    font-family: 'Montserrat', sans-serif !important;
    text-transform: none !important;
    border-radius: 8px !important;
    min-width: 140px;
}

/* === Mobile (≤ 600px) ========================================== */

@media (max-width: 600px) {
    .ciw-shell[b-q83ny87lyj] {
        padding: 20px 16px;
        min-height: 100vh;
        min-height: 100dvh;
        display: flex;
        flex-direction: column;
    }

    .ciw-body[b-q83ny87lyj] {
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
    }

    .ciw-tile-grid[b-q83ny87lyj] {
        grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
        gap: 10px;
    }

    .ciw-tile[b-q83ny87lyj] {
        min-height: 108px;
        padding: 12px 10px;
    }

    .ciw-tile__icon-wrap[b-q83ny87lyj] {
        width: 40px;
        height: 40px;
    }

    .ciw-footer[b-q83ny87lyj] {
        margin-top: auto;
        padding-top: 16px;
    }

    .ciw-btn-primary[b-q83ny87lyj] {
        min-width: 120px;
    }
}

@media (max-width: 380px) {
    .ciw-tile-grid[b-q83ny87lyj] {
        grid-template-columns: repeat(2, 1fr);
    }

    .ciw-footer--three[b-q83ny87lyj] {
        flex-wrap: wrap;
        row-gap: 8px;
    }

    .ciw-footer--three .ciw-btn-text--center[b-q83ny87lyj] {
        order: 3;
        flex-basis: 100%;
        text-align: center;
        margin: 4px 0 0 0;
    }
}
/* /Components/Pages/Rental/Components/CatalogueReelsView.razor.rz.scp.css */
/*
   CatalogueReelsView companion CSS — scoped to this component via Blazor's
   b-xxxxx attribute. Variables are declared on .catalogue-reels (not :root,
   per memory feedback_blazor_scoped_css_root_selector.md). ::deep is used
   sparingly to reach into CatalogueReelsSlide's plain elements (it renders
   plain HTML in the slide region — no MudBlazor child-component class
   gotcha applies here because all targets are .reels-slide-* divs and
   buttons emitted by the slide itself).

   Brand tokens follow Rently spec: primary #35a0ae, secondary #EF412c, white
   text on black-overlay heroes, Montserrat (already loaded globally).
*/

.catalogue-reels[b-95nrcd02w9] {
    --reels-primary: #35a0ae;
    --reels-secondary: #EF412c;
    --reels-text-on-hero: #ffffff;
    --reels-text-muted: rgba(255, 255, 255, 0.78);
    --reels-action-bg: rgba(0, 0, 0, 0.42);
    --reels-action-bg-active: rgba(239, 65, 44, 0.92);
    --reels-action-size: 48px;
    --reels-pill-bg: rgba(255, 255, 255, 0.96);

    position: fixed;
    inset: 0;
    z-index: 1200;
    background-color: #000;
    overflow: hidden;
    touch-action: pan-y;
    outline: none;
    font-family: 'Montserrat', sans-serif;
}

.catalogue-reels__wrapper[b-95nrcd02w9] {
    position: absolute;
    inset: 0;
    width: 100%;
    will-change: transform;
}

.catalogue-reels__exit[b-95nrcd02w9] {
    position: absolute;
    top: max(env(safe-area-inset-top), 12px);
    left: 12px;
    z-index: 5;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.5);
    color: #fff;
    border: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 160ms ease;
}

.catalogue-reels__exit:hover[b-95nrcd02w9],
.catalogue-reels__exit:focus-visible[b-95nrcd02w9] {
    background-color: rgba(0, 0, 0, 0.7);
    outline: 2px solid var(--reels-primary);
    outline-offset: 2px;
}

.catalogue-reels__progress[b-95nrcd02w9] {
    position: absolute;
    top: max(env(safe-area-inset-top), 16px);
    right: 16px;
    z-index: 5;
    padding: 4px 10px;
    border-radius: 16px;
    background-color: rgba(0, 0, 0, 0.45);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.02em;
}

/* Refine pill — distinct from the exit X (which lives on the LEFT) and sits to
   the LEFT of the progress chip. Glassy white background keeps it visually
   separate from the dark exit button while still reading on busy hero imagery.
   Touch target 36px height + safe-area inset top handles iPhone notches. */
.catalogue-reels__refine[b-95nrcd02w9] {
    position: absolute;
    top: max(env(safe-area-inset-top), 12px);
    right: 96px;
    z-index: 5;
    height: 36px;
    padding: 0 14px;
    border: 0;
    border-radius: 18px;
    background-color: rgba(255, 255, 255, 0.92);
    color: var(--reels-primary);
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.18);
    transition: background-color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.catalogue-reels__refine:hover[b-95nrcd02w9],
.catalogue-reels__refine:focus-visible[b-95nrcd02w9] {
    background-color: rgba(255, 255, 255, 1);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.24);
    outline: 2px solid var(--reels-primary);
    outline-offset: 2px;
}

.catalogue-reels__refine:active[b-95nrcd02w9] {
    transform: translateY(0);
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.18);
}

/* Reach into the MudIcon SVG with ::deep (this is a companion .razor.css, so
   ::deep is a compile-time rewrite, which IS valid). */
.catalogue-reels__refine[b-95nrcd02w9]  .mud-icon-root {
    font-size: 18px;
    color: var(--reels-primary);
}

@media (max-width: 360px) {
    .catalogue-reels__refine[b-95nrcd02w9] {
        right: 84px;
        padding: 0 10px;
        font-size: 12px;
    }

    .catalogue-reels__refine[b-95nrcd02w9]  .mud-icon-root {
        font-size: 16px;
    }
}

.catalogue-reels__empty[b-95nrcd02w9] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 32px;
    color: #fff;
    text-align: center;
}

.catalogue-reels__empty-title[b-95nrcd02w9] {
    color: #fff;
}

.catalogue-reels__cap-banner[b-95nrcd02w9] {
    position: absolute;
    bottom: 88px;
    left: 16px;
    right: 16px;
    background-color: var(--reels-pill-bg);
    border-radius: 12px;
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

.catalogue-reels__loading-slide[b-95nrcd02w9] {
    width: 100vw;
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    background-color: #0a0a0a;
    color: #fff;
}

.catalogue-reels__loading-text[b-95nrcd02w9] {
    color: rgba(255, 255, 255, 0.78);
}

/* === Per-slide layout (descendant selectors — slide markup is plain HTML
   emitted by CatalogueReelsSlide.razor, no MudBlazor scoped-class gotcha) === */

.catalogue-reels[b-95nrcd02w9]  .reels-slide {
    position: relative;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    background-color: #0a0a0a;
    color: var(--reels-text-on-hero);
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__hero {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    background-color: #222;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__gradient-top {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 30%;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, transparent 100%);
    pointer-events: none;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__gradient-bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60%;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.45) 35%, transparent 100%);
    pointer-events: none;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__info {
    position: absolute;
    left: 16px;
    right: 88px;
    bottom: max(env(safe-area-inset-bottom), 24px);
    display: flex;
    flex-direction: column;
    gap: 12px;
    z-index: 2;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__store-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background-color: rgba(0, 0, 0, 0.55);
    border-radius: 999px;
    width: fit-content;
    color: #fff;
    font-size: 0.8125rem;
    font-weight: 500;
    backdrop-filter: blur(4px);
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__store-icon {
    color: var(--reels-text-muted);
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__verified-icon {
    color: var(--reels-primary);
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__title {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.2;
    color: #fff;
    margin: 0;
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.45);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    color: var(--reels-text-muted);
    font-size: 0.8125rem;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__rating,
.catalogue-reels[b-95nrcd02w9]  .reels-slide__distance {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__star-icon {
    color: #ffb400;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__rating-count {
    opacity: 0.65;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__category {
    padding: 2px 8px;
    border-radius: 12px;
    background-color: rgba(53, 160, 174, 0.85);
    color: #fff;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__pricing-pill {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px 16px;
    background-color: var(--reels-pill-bg);
    border-radius: 12px;
    color: var(--reels-primary);
    width: fit-content;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__price-primary {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--reels-primary);
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__price-summary {
    font-size: 0.75rem;
    font-weight: 500;
    color: #555;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__hint {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.75rem;
    margin-top: 4px;
    animation: reels-hint-pulse-b-95nrcd02w9 2.2s ease-in-out infinite;
}

@keyframes reels-hint-pulse-b-95nrcd02w9 {
    0%, 100% { opacity: 0.45; transform: translateY(0); }
    50%      { opacity: 0.85; transform: translateY(-3px); }
}

@media (prefers-reduced-motion: reduce) {
    .catalogue-reels[b-95nrcd02w9]  .reels-slide__hint {
        animation: none;
    }
    .catalogue-reels__wrapper[b-95nrcd02w9] {
        transition: none !important;
    }
}

/* === Action rail === */

.catalogue-reels[b-95nrcd02w9]  .reels-slide__action-rail {
    position: absolute;
    right: 12px;
    bottom: max(env(safe-area-inset-bottom), 24px);
    display: flex;
    flex-direction: column;
    gap: 12px;
    z-index: 3;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__action {
    width: var(--reels-action-size);
    height: var(--reels-action-size);
    border-radius: 50%;
    border: 0;
    background-color: var(--reels-action-bg);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 180ms ease, transform 180ms ease;
    backdrop-filter: blur(4px);
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__action:hover,
.catalogue-reels[b-95nrcd02w9]  .reels-slide__action:focus-visible {
    background-color: rgba(0, 0, 0, 0.6);
    transform: scale(1.06);
    outline: 2px solid rgba(255, 255, 255, 0.5);
    outline-offset: 2px;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__action--active {
    background-color: var(--reels-action-bg-active);
    color: #fff;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__action--active:hover,
.catalogue-reels[b-95nrcd02w9]  .reels-slide__action--active:focus-visible {
    background-color: var(--reels-action-bg-active);
}

/* === Details panel (slide-up sheet) === */

.catalogue-reels[b-95nrcd02w9]  .reels-slide__details-panel {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 50vh;
    background-color: #fff;
    color: #1a1a1a;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.4);
    display: flex;
    flex-direction: column;
    z-index: 4;
    animation: reels-details-slide-up-b-95nrcd02w9 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes reels-details-slide-up-b-95nrcd02w9 {
    from { transform: translateY(100%); }
    to   { transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .catalogue-reels[b-95nrcd02w9]  .reels-slide__details-panel {
        animation: none;
    }
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__details-handle {
    width: 36px;
    height: 4px;
    border-radius: 2px;
    background-color: #d4d4d4;
    margin: 8px auto 4px;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__details-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 16px;
    border-bottom: 1px solid #f0f0f0;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__details-title {
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: #1a1a1a;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-right: 12px;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__details-close {
    border: 0;
    background: transparent;
    color: #555;
    cursor: pointer;
    padding: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background-color 160ms ease;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__details-close:hover,
.catalogue-reels[b-95nrcd02w9]  .reels-slide__details-close:focus-visible {
    background-color: #f5f5f5;
    outline: 2px solid var(--reels-primary);
    outline-offset: 2px;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__details-body {
    flex: 1;
    overflow-y: auto;
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-size: 0.875rem;
    color: #424242;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__details-row {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__details-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__details-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 12px;
    background-color: #f0f7f8;
    color: var(--reels-primary);
    font-size: 0.75rem;
    font-weight: 500;
}

.catalogue-reels[b-95nrcd02w9]  .reels-slide__details-actions {
    padding: 12px 16px max(env(safe-area-inset-bottom), 12px);
    border-top: 1px solid #f0f0f0;
    background-color: #fff;
}

/* Smaller screens — tighten the action rail so it doesn't dominate the slide.
   The 320px Galaxy Fold / iPhone 5 viewport gets the most compact treatment. */
@media (max-width: 360px) {
    .catalogue-reels[b-95nrcd02w9] {
        --reels-action-size: 44px;
    }
    .catalogue-reels[b-95nrcd02w9]  .reels-slide__info {
        right: 76px;
    }
    .catalogue-reels[b-95nrcd02w9]  .reels-slide__title {
        font-size: 1.25rem;
    }
}
/* /Components/Pages/Rental/Management/ConfigureRental.razor.rz.scp.css */
.trust-tab-label[b-wim0zxfj3r] {
    width: 100%;
    padding-right: 16px;
    font-weight: 600;
}

.trust-tab-panel[b-wim0zxfj3r] {
    width: 100%;
    padding: 0 15px 20px 15px;
}

.trust-inheritance-row[b-wim0zxfj3r] {
    gap: 12px;
}

.trust-mobile-hint[b-wim0zxfj3r] {
    padding: 0 15px;
    color: var(--rz-base-600, #757575);
}

.stack-gap-sm[b-wim0zxfj3r] {
    row-gap: 4px;
}

.trust-panel-card[b-wim0zxfj3r] {
    background: linear-gradient(135deg, rgba(53, 160, 174, 0.08), rgba(239, 65, 44, 0.06));
    border-radius: 18px;
    box-shadow: 0 18px 36px rgba(15, 23, 42, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.4);
}

.trust-panel-card .mud-card-content[b-wim0zxfj3r] {
    padding: 28px;
}

.trust-insight-card[b-wim0zxfj3r] {
    border-radius: 18px;
    padding: 22px;
    background: linear-gradient(135deg, rgba(11, 122, 117, 0.1), rgba(53, 160, 174, 0.04));
    border: 1px solid rgba(11, 122, 117, 0.18);
}

.trust-insight-card .mud-chip[b-wim0zxfj3r] {
    border-radius: 999px;
}

.trust-panel-divider[b-wim0zxfj3r] {
    opacity: 0.35;
}

@media (max-width: 960px) {
    .trust-panel-card .mud-card-content[b-wim0zxfj3r] {
        padding: 22px;
    }
}

.trust-preview-table .mud-table-head[b-wim0zxfj3r] {
    background: rgba(53, 160, 174, 0.12);
}

.trust-preview-table .mud-table-cell[b-wim0zxfj3r] {
    vertical-align: top;
}

.trust-preview-table .mud-table-row:hover[b-wim0zxfj3r] {
    background: rgba(239, 65, 44, 0.05);
}

.trust-preview-table .baseline-missing[b-wim0zxfj3r] {
    background: linear-gradient(135deg, #fff5e6 0%, #ffe0bf 100%);
    border-left: 4px solid #ef6c00;
    color: #4d2e00;
}

.trust-preview-table .trust-shortfall[b-wim0zxfj3r] {
    background: linear-gradient(135deg, #e8f4ff 0%, #d6ecff 100%);
    border-left: 4px solid #1e88e5;
}

.trust-preview-table .mud-chip[b-wim0zxfj3r] {
    border-radius: 999px;
}

.persona-detail[b-wim0zxfj3r] {
    padding: 12px 16px;
    background: rgba(53, 160, 174, 0.08);
    border-radius: 12px;
}

.trust-summary-chips .mud-chip[b-wim0zxfj3r] {
    border-radius: 999px;
    font-weight: 600;
}

.persona-legend .mud-chip[b-wim0zxfj3r] {
    border-radius: 999px;
    background-color: rgba(53, 160, 174, 0.08);
}

.persona-toolbar[b-wim0zxfj3r] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.persona-filter-chips[b-wim0zxfj3r] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.persona-filter-label[b-wim0zxfj3r] {
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--rz-base-700, #425466);
}

.persona-filter-chips .mud-chip[b-wim0zxfj3r] {
    text-transform: none;
}

.trust-policy-summary-card[b-wim0zxfj3r] {
    border-radius: 18px;
    padding: 20px;
    background: linear-gradient(135deg, rgba(11, 122, 117, 0.08), rgba(11, 122, 117, 0.02));
    border: 1px solid rgba(11, 122, 117, 0.1);
}

.trust-policy-pill[b-wim0zxfj3r] {
    border-radius: 16px;
    border: 1px solid rgba(33, 150, 243, 0.15);
    background: rgba(255, 255, 255, 0.85);
}

.trust-policy-pill.store[b-wim0zxfj3r] {
    border-color: rgba(33, 150, 243, 0.35);
    background: rgba(33, 150, 243, 0.08);
}

.trust-policy-pill.rental[b-wim0zxfj3r] {
    border-color: rgba(239, 108, 0, 0.35);
    background: rgba(239, 108, 0, 0.08);
}

.trust-policy-control-card[b-wim0zxfj3r] {
    border-radius: 18px;
    padding: 22px;
    border: 1px solid rgba(53, 160, 174, 0.18);
    background: rgba(255, 255, 255, 0.92);
}

.trust-policy-control-card .mud-alert[b-wim0zxfj3r] {
    border-style: dashed;
}

.trust-advanced-panel .mud-expansion-panel-header[b-wim0zxfj3r] {
    border-radius: 14px;
    background: rgba(53, 160, 174, 0.08);
}

.trust-advanced-panel .mud-expansion-panel-content[b-wim0zxfj3r] {
    padding: 16px 0 0 0;
}

@media (max-width: 600px) {
    .trust-policy-summary-card[b-wim0zxfj3r],
    .trust-policy-control-card[b-wim0zxfj3r] {
        padding: 16px;
    }
}

.trust-preview-table .baseline-missing .mud-typography-caption[b-wim0zxfj3r],
.trust-preview-table .baseline-missing .mud-typography-body2[b-wim0zxfj3r] {
    color: #4d2e00;
}

.trust-preview-table .trust-shortfall .mud-typography-caption[b-wim0zxfj3r],
.trust-preview-table .trust-shortfall .mud-typography-body2[b-wim0zxfj3r] {
    color: #124950;
}

@media (max-width: 960px) {
    .trust-preview-table .mud-table-container table[b-wim0zxfj3r] {
        display: block;
        width: 100%;
        border-spacing: 0;
    }

    .trust-preview-table .mud-table-header[b-wim0zxfj3r] {
        display: none;
    }

    .trust-preview-table .mud-table-body[b-wim0zxfj3r] {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .trust-preview-table .mud-table-row[b-wim0zxfj3r] {
        display: flex;
        flex-direction: column;
        padding: 12px;
        border-radius: 16px;
        border: 1px solid rgba(33, 150, 243, 0.18);
        box-shadow: 0 10px 24px rgba(33, 150, 243, 0.08);
        background: rgba(255, 255, 255, 0.98);
    }

    .trust-preview-table .mud-table-cell[b-wim0zxfj3r] {
        display: flex;
        justify-content: space-between;
        gap: 8px;
        padding: 8px 0;
        border-bottom: 1px dashed rgba(66, 84, 102, 0.2);
    }

    .trust-preview-table .mud-table-cell:last-child[b-wim0zxfj3r] {
        border-bottom: none;
    }

    .trust-preview-table .mud-table-cell[b-wim0zxfj3r]::before {
        content: attr(data-label);
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: var(--rz-base-700, #425466);
    }
}
/* /Components/Pages/Store/Create.razor.rz.scp.css */
/*
 * Create Store — scoped styles moved inline to Create.razor (Test-161 precedent).
 * Keeping this file empty so the scoped CSS isolation bundle stays consistent.
 */

:host[b-zrl835uya4] {
    display: block;
}
/* /Components/Pages/Store/StoreCreationSuccess.razor.rz.scp.css */
/* Styles live inline in StoreCreationSuccess.razor to avoid Blazor CSS-isolation */
/* scope-attribute pinning that prevents rules from piercing MudBlazor child DOM.   */
/* /Components/Shared/Dashboards/DashboardHero.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   DashboardHero — full-bleed hero gradient strip themed by
   --section-accent. Inherits the existing customer-side hero
   pattern (Addresses.razor's hero-banner) but expresses it
   through the shared design tokens. KPI strip slot sits to
   the right of the title at desktop, stacks below at mobile.
   ═══════════════════════════════════════════════════════ */
.rently-hero[b-3lq5mkmjzy] {
    position: relative;
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--section-accent) 95%, #0f172a) 0%,
        color-mix(in srgb, var(--section-accent) 78%, #0f172a) 100%);
    color: var(--rently-text-on-accent);
    overflow: hidden;
    padding: var(--rently-space-9) var(--rently-space-8);
    font-family: var(--rently-font-display);
}

.rently-hero__background[b-3lq5mkmjzy] {
    position: absolute;
    inset: 0;
    z-index: var(--rently-z-hero-decoration);
    pointer-events: none;
    overflow: hidden;
}

.rently-hero__pattern[b-3lq5mkmjzy] {
    position: absolute;
    inset: 0;
    background-image: url('/images/Icon_Blue_TransparentBg_40.png');
    background-repeat: repeat;
    background-position: center;
    background-size: 240px;
    opacity: 0.08;
    mask-image: linear-gradient(to right, black 60%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, black 60%, transparent 100%);
}

.rently-hero__inner[b-3lq5mkmjzy] {
    position: relative;
    z-index: var(--rently-z-hero-content);
    width: 100%;
}

.rently-hero__title-row[b-3lq5mkmjzy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rently-space-7);
    flex-wrap: wrap;
}

.rently-hero__title-block[b-3lq5mkmjzy] {
    display: flex;
    align-items: center;
    gap: var(--rently-space-6);
    flex: 1;
    min-width: 0;
}

.rently-hero__icon-wrap[b-3lq5mkmjzy] {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--rently-radius-xl);
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.22);
    color: var(--rently-text-on-accent);
    flex-shrink: 0;
}

.rently-hero__icon-wrap .mud-icon-root[b-3lq5mkmjzy] {
    font-size: 1.75rem !important;
    color: var(--rently-text-on-accent) !important;
}

.rently-hero__text[b-3lq5mkmjzy] {
    flex: 1;
    min-width: 0;
}

.rently-hero__eyebrow[b-3lq5mkmjzy] {
    display: inline-block;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: var(--rently-tracking-wider);
    color: rgba(255, 255, 255, 0.78);
    font-weight: 600;
    margin-bottom: var(--rently-space-1);
}

.rently-hero__title[b-3lq5mkmjzy] {
    font-family: var(--rently-font-display);
    font-size: 1.625rem;
    font-weight: 700;
    letter-spacing: var(--rently-tracking-tight);
    line-height: var(--rently-leading-snug);
    color: var(--rently-text-on-accent);
    margin: 0;
    text-shadow: 0 1px 2px rgba(15, 23, 42, 0.15);
}

.rently-hero__subtitle[b-3lq5mkmjzy] {
    font-size: 0.95rem;
    line-height: var(--rently-leading-normal);
    color: rgba(255, 255, 255, 0.88);
    margin: var(--rently-space-2) 0 0;
    max-width: 60ch;
    text-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
}

.rently-hero__kpi-strip[b-3lq5mkmjzy] {
    display: flex;
    gap: var(--rently-space-4);
    flex-wrap: wrap;
    justify-content: flex-end;
    min-width: 0;
}

.rently-hero__right[b-3lq5mkmjzy] {
    display: flex;
    align-items: center;
    gap: var(--rently-space-3);
    flex-wrap: wrap;
}

.rently-hero__below[b-3lq5mkmjzy] {
    margin-top: var(--rently-space-7);
}

@media (max-width: 960px) {
    .rently-hero[b-3lq5mkmjzy] {
        padding: var(--rently-space-8) var(--rently-space-6);
    }

    .rently-hero__title-row[b-3lq5mkmjzy] {
        gap: var(--rently-space-6);
    }

    .rently-hero__title-block[b-3lq5mkmjzy] {
        width: 100%;
    }

    .rently-hero__icon-wrap[b-3lq5mkmjzy] {
        width: 48px;
        height: 48px;
    }

    .rently-hero__icon-wrap .mud-icon-root[b-3lq5mkmjzy] {
        font-size: 1.5rem !important;
    }

    .rently-hero__title[b-3lq5mkmjzy] {
        font-size: 1.375rem;
    }

    .rently-hero__subtitle[b-3lq5mkmjzy] {
        font-size: 0.875rem;
    }

    .rently-hero__kpi-strip[b-3lq5mkmjzy] {
        width: 100%;
        justify-content: stretch;
    }
}

@media (max-width: 600px) {
    .rently-hero[b-3lq5mkmjzy] {
        padding: var(--rently-space-7) var(--rently-space-5);
    }

    .rently-hero__title[b-3lq5mkmjzy] {
        font-size: 1.25rem;
    }

    .rently-hero__subtitle[b-3lq5mkmjzy] {
        font-size: 0.825rem;
    }

    .rently-hero__kpi-strip[b-3lq5mkmjzy] {
        gap: var(--rently-space-3);
    }
}
/* /Components/Shared/Dashboards/DashboardKpiCard.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   DashboardKpiCard — KPI tile with semantic tone variants.
   Lives in DashboardHero's KpiStrip slot (OnHero=true) or
   anywhere else in the page (OnHero=false, default — sits on
   the frost shell).
   ═══════════════════════════════════════════════════════ */
.rently-kpi[b-cgw51iemzh] {
    display: inline-flex;
    align-items: center;
    gap: var(--rently-space-4);
    min-width: 140px;
    flex: 1 1 140px;
    max-width: 240px;
    padding: var(--rently-space-5) var(--rently-space-6);
    border-radius: var(--rently-radius-xl);
    background: var(--rently-card-bg);
    border: 1px solid var(--rently-border);
    color: var(--rently-text-primary);
    box-shadow: var(--rently-shadow-1);
    transition: box-shadow var(--rently-transition-fast),
                border-color var(--rently-transition-fast);
    font-family: var(--rently-font-display);
    text-align: left;
    text-decoration: none;
}

.rently-kpi--on-hero[b-cgw51iemzh] {
    /* When sitting on the hero gradient, lift slightly more */
    box-shadow: var(--rently-shadow-2);
    border-color: rgba(255, 255, 255, 0.2);
}

.rently-kpi--link[b-cgw51iemzh],
.rently-kpi--button[b-cgw51iemzh] {
    cursor: pointer;
    border-width: 1px;
}

.rently-kpi--link:hover[b-cgw51iemzh],
.rently-kpi--button:hover[b-cgw51iemzh] {
    box-shadow: var(--rently-shadow-hover);
    border-color: color-mix(in srgb, var(--section-accent) 35%, var(--rently-border));
}

.rently-kpi--link:focus-visible[b-cgw51iemzh],
.rently-kpi--button:focus-visible[b-cgw51iemzh] {
    outline: 2px solid var(--section-accent);
    outline-offset: 2px;
}

.rently-kpi--button[b-cgw51iemzh] {
    /* Reset button defaults */
    font: inherit;
    color: inherit;
    background: var(--rently-card-bg);
}

/* ─── Icon wrap (tone-driven) ─── */
.rently-kpi__icon-wrap[b-cgw51iemzh] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--rently-radius-lg);
    flex-shrink: 0;
}

.rently-kpi__icon-wrap .mud-icon-root[b-cgw51iemzh] {
    font-size: 1.5rem;
}

/* ─── Tone: Neutral ─── */
.rently-kpi--tone-neutral .rently-kpi__icon-wrap[b-cgw51iemzh] {
    background: var(--rently-muted-bg);
    color: var(--rently-text-tertiary);
}

/* ─── Tone: Ok ─── */
.rently-kpi--tone-ok .rently-kpi__icon-wrap[b-cgw51iemzh] {
    background: var(--rently-ok-bg);
    color: var(--rently-ok-text);
}

/* ─── Tone: Info ─── */
.rently-kpi--tone-info .rently-kpi__icon-wrap[b-cgw51iemzh] {
    background: var(--rently-info-bg);
    color: var(--rently-info-text);
}

/* ─── Tone: Warning ─── */
.rently-kpi--tone-warning .rently-kpi__icon-wrap[b-cgw51iemzh] {
    background: var(--rently-warning-bg);
    color: var(--rently-warning-text);
}

/* ─── Tone: Critical ─── */
.rently-kpi--tone-critical .rently-kpi__icon-wrap[b-cgw51iemzh] {
    background: var(--rently-critical-bg);
    color: var(--rently-critical-text);
}

/* ─── Tone: Accent (section-themed) ─── */
.rently-kpi--tone-accent .rently-kpi__icon-wrap[b-cgw51iemzh] {
    background: color-mix(in srgb, var(--section-accent) 12%, var(--rently-card-bg));
    color: var(--section-accent);
}

/* ─── Body (value + label + caption) ─── */
.rently-kpi__body[b-cgw51iemzh] {
    display: flex;
    flex-direction: column;
    gap: var(--rently-space-1);
    min-width: 0;
    flex: 1;
}

.rently-kpi__value[b-cgw51iemzh] {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: var(--rently-leading-tight);
    letter-spacing: var(--rently-tracking-snug);
    color: var(--rently-text-primary);
    font-variant-numeric: tabular-nums;
}

.rently-kpi__label[b-cgw51iemzh] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: var(--rently-tracking-wider);
    color: var(--rently-text-tertiary);
    font-weight: 600;
    line-height: var(--rently-leading-tight);
}

.rently-kpi__caption[b-cgw51iemzh] {
    font-size: 0.75rem;
    color: var(--rently-text-muted);
    line-height: var(--rently-leading-normal);
    margin-top: var(--rently-space-1);
}

@media (max-width: 960px) {
    .rently-kpi[b-cgw51iemzh] {
        min-width: 0;
        flex: 1 1 calc(50% - var(--rently-space-2));
        padding: var(--rently-space-4) var(--rently-space-5);
        max-width: none;
    }

    .rently-kpi__icon-wrap[b-cgw51iemzh] {
        width: 40px;
        height: 40px;
    }

    .rently-kpi__icon-wrap .mud-icon-root[b-cgw51iemzh] {
        font-size: 1.25rem;
    }

    .rently-kpi__value[b-cgw51iemzh] {
        font-size: 1.25rem;
    }

    .rently-kpi__label[b-cgw51iemzh] {
        font-size: 0.7rem;
    }
}

@media (max-width: 600px) {
    .rently-kpi[b-cgw51iemzh] {
        flex: 1 1 100%;
        gap: var(--rently-space-3);
    }

    .rently-kpi__icon-wrap[b-cgw51iemzh] {
        width: 36px;
        height: 36px;
    }
}
/* /Components/Shared/Dashboards/DashboardSectionHeader.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   DashboardSectionHeader — visual divider between hero/KPI
   strip and content blocks. Mirrors .adm-section-header from
   ServiceDiagnostics.razor.css with the addition of an
   accent-tinted eyebrow and a right-content slot.
   ═══════════════════════════════════════════════════════ */
.rently-section-header[b-1azkfz8xme] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--rently-space-6);
    padding: var(--rently-space-6) var(--rently-space-8) var(--rently-space-3);
    flex-wrap: wrap;
    font-family: var(--rently-font-display);
}

.rently-section-header__text[b-1azkfz8xme] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.rently-section-header__eyebrow[b-1azkfz8xme] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: var(--rently-tracking-wider);
    color: var(--section-accent);
    font-weight: 600;
}

.rently-section-header__title[b-1azkfz8xme] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--rently-text-strong);
    margin: 0;
    line-height: var(--rently-leading-snug);
    letter-spacing: var(--rently-tracking-snug);
    font-family: var(--rently-font-display);
}

.rently-section-header__subtitle[b-1azkfz8xme] {
    font-size: 0.8rem;
    color: var(--rently-text-tertiary);
    font-weight: 400;
    margin: var(--rently-space-1) 0 0;
    line-height: var(--rently-leading-normal);
}

.rently-section-header__right[b-1azkfz8xme] {
    display: flex;
    align-items: center;
    gap: var(--rently-space-3);
    flex-wrap: wrap;
}

@media (max-width: 600px) {
    .rently-section-header[b-1azkfz8xme] {
        padding: var(--rently-space-5) var(--rently-space-5) var(--rently-space-2);
    }

    .rently-section-header__right[b-1azkfz8xme] {
        width: 100%;
    }
}
/* /Components/Shared/Dashboards/DashboardShell.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   DashboardShell — frost-shell wrapper that scopes --section-accent
   to every nested dashboard primitive. Optional 2-column grid when
   Sidebar fragment is supplied; single-column otherwise.
   ═══════════════════════════════════════════════════════ */
.rently-shell[b-vhsvzelhq6] {
    --section-accent: #35a0ae;
    background: var(--rently-shell-bg);
    min-height: 100%;
    overflow-x: hidden;
    padding: 0;
}

.rently-shell--has-sidebar[b-vhsvzelhq6] {
    display: grid;
    grid-template-columns: 280px 1fr;
    align-items: start;
    min-height: 100vh;
}

.rently-shell__sidebar[b-vhsvzelhq6] {
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    background: var(--rently-card-bg);
    border-right: 1px solid var(--rently-border);
    z-index: var(--rently-z-sidebar);
}

.rently-shell__main[b-vhsvzelhq6] {
    min-width: 0;
}

@media (max-width: 960px) {
    .rently-shell--has-sidebar[b-vhsvzelhq6] {
        grid-template-columns: 1fr;
    }

    .rently-shell__sidebar[b-vhsvzelhq6] {
        position: static;
        height: auto;
        max-height: none;
        border-right: none;
        border-bottom: 1px solid var(--rently-border);
    }
}
/* /Components/Shared/Dashboards/DashboardSidebarShell.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   DashboardSidebarShell — accent-themed sidebar wrapper with
   Identity / Nav / Footer slots. Identity background tints from
   --section-accent at 8% so the brand identity stripe flows
   continuously from sidebar into hero. Resolves the long-standing
   issue where SuccessAmbassadorSidebar hardcoded #124950 against
   a #35a0ae hero.
   ═══════════════════════════════════════════════════════ */
.rently-sidebar[b-w3e3k1waj0] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 100%;
    background: var(--rently-card-bg);
    font-family: var(--rently-font-display);
}

.rently-sidebar__identity[b-w3e3k1waj0] {
    padding: var(--rently-space-7) var(--rently-space-6);
    background: color-mix(in srgb, var(--section-accent) 8%, var(--rently-card-bg));
    border-bottom: 1px solid var(--rently-border);
}

.rently-sidebar__nav[b-w3e3k1waj0] {
    flex: 1;
    padding: var(--rently-space-4) 0;
    overflow-y: auto;
}

.rently-sidebar__footer[b-w3e3k1waj0] {
    padding: var(--rently-space-5) var(--rently-space-6);
    border-top: 1px solid var(--rently-border);
    font-size: 0.78rem;
    color: var(--rently-text-tertiary);
    line-height: var(--rently-leading-normal);
}

/* ─── Radzen panel-menu active state theming ─── */
[b-w3e3k1waj0] .rently-sidebar__nav .rz-panel-menu-item .rz-navigation-item-link.rz-navigation-item-link-active {
    background: color-mix(in srgb, var(--section-accent) 12%, var(--rently-card-bg));
    color: var(--section-accent);
    font-weight: 600;
    border-left: 3px solid var(--section-accent);
}

[b-w3e3k1waj0] .rently-sidebar__nav .rz-panel-menu-item .rz-navigation-item-link:hover {
    background: color-mix(in srgb, var(--section-accent) 6%, var(--rently-card-bg));
    color: var(--section-accent);
}

/* ─── MudNavMenu equivalent theming ─── */
[b-w3e3k1waj0] .rently-sidebar__nav .mud-nav-link.mud-nav-link-active {
    background: color-mix(in srgb, var(--section-accent) 12%, var(--rently-card-bg));
    color: var(--section-accent);
    font-weight: 600;
}

[b-w3e3k1waj0] .rently-sidebar__nav .mud-nav-link:hover {
    background: color-mix(in srgb, var(--section-accent) 6%, var(--rently-card-bg));
    color: var(--section-accent);
}

@media (max-width: 960px) {
    .rently-sidebar[b-w3e3k1waj0] {
        min-height: auto;
    }

    .rently-sidebar__identity[b-w3e3k1waj0] {
        padding: var(--rently-space-6);
    }

    .rently-sidebar__nav[b-w3e3k1waj0] {
        padding: var(--rently-space-3) 0;
    }
}
/* /Components/Shared/Dashboards/DashboardStatusPill.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   DashboardStatusPill — inline pill with optional dot and
   auxiliary text. Mirrors .adm-status-pill from
   ServiceDiagnostics.razor.css with the addition of more
   tone variants (Critical, Info, Accent).
   ═══════════════════════════════════════════════════════ */
.rently-pill[b-fyjgswkip5] {
    display: inline-flex;
    align-items: center;
    gap: var(--rently-space-2);
    padding: 0.3rem var(--rently-space-4);
    border-radius: var(--rently-radius-pill);
    background: var(--rently-muted-bg);
    border: 1px solid #e2e8f0;
    font-size: 0.75rem;
    line-height: 1;
    white-space: nowrap;
    color: var(--rently-text-secondary);
    font-weight: 500;
    font-family: var(--rently-font-display);
}

.rently-pill__dot[b-fyjgswkip5] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.rently-pill__aux[b-fyjgswkip5] {
    color: var(--rently-text-tertiary);
    font-variant-numeric: tabular-nums;
}

/* ─── Dot tones ─── */
.rently-pill__dot--on[b-fyjgswkip5] {
    background: var(--rently-ok);
    box-shadow: 0 0 6px var(--rently-ok-glow);
}

.rently-pill__dot--warn[b-fyjgswkip5] {
    background: var(--rently-warning);
    box-shadow: 0 0 6px var(--rently-warning-glow);
}

.rently-pill__dot--off[b-fyjgswkip5] {
    background: var(--rently-text-muted);
}

.rently-pill__dot--critical[b-fyjgswkip5] {
    background: var(--rently-critical);
    box-shadow: 0 0 6px var(--rently-critical-glow);
}

.rently-pill__dot--info[b-fyjgswkip5] {
    background: var(--rently-info);
    box-shadow: 0 0 6px var(--rently-info-glow);
}

.rently-pill__dot--accent[b-fyjgswkip5] {
    background: var(--section-accent);
    box-shadow: 0 0 6px color-mix(in srgb, var(--section-accent) 50%, transparent);
}

.rently-pill__dot--neutral[b-fyjgswkip5] {
    background: var(--rently-text-tertiary);
}

/* ─── Tone-level styling (background tints) ─── */
.rently-pill--tone-on[b-fyjgswkip5] {
    background: var(--rently-ok-bg);
    border-color: color-mix(in srgb, var(--rently-ok) 20%, transparent);
    color: var(--rently-ok-text);
}

.rently-pill--tone-warn[b-fyjgswkip5] {
    background: var(--rently-warning-bg);
    border-color: color-mix(in srgb, var(--rently-warning) 20%, transparent);
    color: var(--rently-warning-text);
}

.rently-pill--tone-critical[b-fyjgswkip5] {
    background: var(--rently-critical-bg);
    border-color: color-mix(in srgb, var(--rently-critical) 20%, transparent);
    color: var(--rently-critical-text);
}

.rently-pill--tone-info[b-fyjgswkip5] {
    background: var(--rently-info-bg);
    border-color: color-mix(in srgb, var(--rently-info) 20%, transparent);
    color: var(--rently-info-text);
}

.rently-pill--tone-accent[b-fyjgswkip5] {
    background: color-mix(in srgb, var(--section-accent) 10%, var(--rently-card-bg));
    border-color: color-mix(in srgb, var(--section-accent) 25%, transparent);
    color: var(--section-accent);
}
/* /Components/Shared/Dashboards/TrustHighlightCard.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   TrustHighlightCard — Profile gamification-card variant.
   Three semantic variants (Baseline / Rewards / Momentum)
   matching the existing Profile.razor.css pattern. Baseline +
   Rewards flow through --section-accent; Momentum stays blue
   regardless of section because "forward momentum" is a
   universal progress signal.
   ═══════════════════════════════════════════════════════ */
.rently-trust-card[b-pojd5l94fk] {
    border-radius: var(--rently-radius-2xl);
    padding: var(--rently-space-8);
    box-shadow: var(--rently-shadow-2);
    height: 100%;
    font-family: var(--rently-font-display);
    display: flex;
    flex-direction: column;
    gap: var(--rently-space-5);
    color: var(--rently-text-primary);
    border: 1px solid var(--rently-border);
}

/* ─── Variant: Baseline ─── */
.rently-trust-card--baseline[b-pojd5l94fk] {
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--section-accent) 14%, var(--rently-card-bg)) 0%,
        color-mix(in srgb, var(--section-accent) 5%, var(--rently-card-bg)) 100%);
    border-color: color-mix(in srgb, var(--section-accent) 18%, transparent);
}

.rently-trust-card--baseline .rently-trust-card__icon[b-pojd5l94fk] {
    background: color-mix(in srgb, var(--section-accent) 18%, var(--rently-card-bg));
    color: color-mix(in srgb, var(--section-accent) 80%, #000000);
}

.rently-trust-card--baseline .rently-trust-card__eyebrow[b-pojd5l94fk] {
    color: color-mix(in srgb, var(--section-accent) 80%, #000000);
}

/* ─── Variant: Rewards ─── */
.rently-trust-card--rewards[b-pojd5l94fk] {
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--section-accent) 18%, var(--rently-card-bg)) 0%,
        color-mix(in srgb, var(--section-accent) 6%, var(--rently-card-bg)) 100%);
    border-color: color-mix(in srgb, var(--section-accent) 22%, transparent);
}

.rently-trust-card--rewards .rently-trust-card__icon[b-pojd5l94fk] {
    background: color-mix(in srgb, var(--section-accent) 20%, var(--rently-card-bg));
    color: var(--section-accent);
}

.rently-trust-card--rewards .rently-trust-card__eyebrow[b-pojd5l94fk] {
    color: var(--section-accent);
}

/* ─── Variant: Momentum (always blue) ─── */
.rently-trust-card--momentum[b-pojd5l94fk] {
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--rently-info) 14%, var(--rently-card-bg)) 0%,
        color-mix(in srgb, var(--rently-info) 5%, var(--rently-card-bg)) 100%);
    border-color: color-mix(in srgb, var(--rently-info) 20%, transparent);
}

.rently-trust-card--momentum .rently-trust-card__icon[b-pojd5l94fk] {
    background: var(--rently-info-bg);
    color: var(--rently-info-text);
}

.rently-trust-card--momentum .rently-trust-card__eyebrow[b-pojd5l94fk] {
    color: var(--rently-info-text);
}

/* ─── Shared inner pieces ─── */
.rently-trust-card__header[b-pojd5l94fk] {
    display: flex;
    align-items: center;
    gap: var(--rently-space-4);
}

.rently-trust-card__icon[b-pojd5l94fk] {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--rently-radius-lg);
    flex-shrink: 0;
}

.rently-trust-card__icon .mud-icon-root[b-pojd5l94fk] {
    font-size: 1.5rem;
}

.rently-trust-card__title-stack[b-pojd5l94fk] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    flex: 1;
}

.rently-trust-card__eyebrow[b-pojd5l94fk] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: var(--rently-tracking-wider);
    font-weight: 600;
    line-height: var(--rently-leading-tight);
}

.rently-trust-card__title[b-pojd5l94fk] {
    font-family: var(--rently-font-display);
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--rently-text-strong);
    margin: 0;
    line-height: var(--rently-leading-snug);
    letter-spacing: var(--rently-tracking-snug);
}

.rently-trust-card__value-row[b-pojd5l94fk] {
    display: flex;
    align-items: baseline;
    gap: var(--rently-space-3);
    flex-wrap: wrap;
}

.rently-trust-card__value[b-pojd5l94fk] {
    font-size: 2rem;
    font-weight: 700;
    line-height: var(--rently-leading-tight);
    color: var(--rently-text-primary);
    letter-spacing: var(--rently-tracking-tight);
    font-variant-numeric: tabular-nums;
}

.rently-trust-card__caption[b-pojd5l94fk] {
    font-size: 0.85rem;
    color: var(--rently-text-tertiary);
    font-weight: 500;
}

.rently-trust-card__body[b-pojd5l94fk] {
    display: flex;
    flex-direction: column;
    gap: var(--rently-space-3);
}

@media (max-width: 960px) {
    .rently-trust-card[b-pojd5l94fk] {
        padding: var(--rently-space-7);
    }

    .rently-trust-card__value[b-pojd5l94fk] {
        font-size: 1.75rem;
    }
}

@media (max-width: 600px) {
    .rently-trust-card[b-pojd5l94fk] {
        padding: var(--rently-space-6);
    }

    .rently-trust-card__title[b-pojd5l94fk] {
        font-size: 1rem;
    }

    .rently-trust-card__value[b-pojd5l94fk] {
        font-size: 1.5rem;
    }
}