html, body {
    font-family: var(--font-sans, "Aptos", "Segoe UI", "Helvetica Neue", Arial, sans-serif);
}

a, .btn-link {
    color: var(--primary);
}

.btn-primary {
    color: var(--primary-foreground);
    background-color: var(--primary);
    border-color: color-mix(in srgb, var(--primary) 85%, var(--mix-darken));
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem var(--background), 0 0 0 0.25rem var(--ring);
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

body {
    min-height: 100vh;
    background: var(--background);
}

/* ── Sidebar: locked full-height, only content scrolls ──────── */

:root {
    /* Branding-era sidebar width. BB's <aside> reads this via `w-[var(--sidebar-width)]`
       when expanded and swaps to `--sidebar-width-icon` on data-state=collapsed. */
    --sidebar-width: 16.5rem;
    --sidebar-group-py: 0.15rem;
    --sidebar-group-px: 0.5rem;
    --sidebar-group-label-height: 1.75rem;
    --sidebar-group-label-px: 0.25rem;
    --sidebar-group-label-font-size: 0.68rem;
    --sidebar-menu-gap: 0.05rem;
    --sidebar-menu-button-py: 0.35rem;
    --sidebar-menu-button-px: 0.5rem;
    --sidebar-menu-button-font-size: 0.82rem;
    --sidebar-menu-button-line-height: 1.15rem;
    --sidebar-menu-button-gap: 0.45rem;
    --sidebar-menu-button-icon-size: 0.95rem;
    --sidebar-menu-button-radius: 0.375rem;
    --sidebar-header-py: 0.65rem;
    --sidebar-header-px: 0.65rem;
    --sidebar-header-content-py: 0.25rem;
    --sidebar-header-content-px: 0.25rem;
    --sidebar-footer-py: 0.5rem;
    --sidebar-footer-px: 0.65rem;
    --sidebar-content-py: 0.25rem;
    --sidebar-content-px: 0.5rem;
    --sales-surface-border: var(--border);
    --sales-surface-radius: 4px;
}

/* Sidebar: locked to viewport height */
.main-layout__sidebar {
    border-right: 1px solid rgba(255, 255, 255, 0.12);
    background: #003250;
    color: #ffffff;
    height: 100vh;
    max-height: 100vh;
    position: sticky;
    top: 0;
    align-self: start;
    min-height: 100vh;
}

.main-layout__sidebar [data-sidebar="footer"] {
    border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
}

/* Collapsed icon-rail styling is keyed off BB's native `data-collapsible="icon"`
   attribute (set on the same <aside> when Context.Open flips to false). BB
   already handles width (→ --sidebar-width-icon) and the inset margin; we only
   need to correct the nav/brand/footer details for our custom markup below. */

/* Content area scrolls, header + footer pinned */
[data-sidebar="content"] {
    flex: 1 1 0 !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

[data-sidebar="header"] {
    flex-shrink: 0 !important;
}

[data-sidebar="footer"] {
    flex-shrink: 0 !important;
    margin-top: auto !important;
    border-top: 1px solid var(--sidebar-border) !important;
}

.main-layout__sidebar [data-sidebar="menu"] {
    margin: 0 !important;
    padding-left: 0 !important;
}

.main-layout__sidebar [data-sidebar="menu-button"] {
    color: #ffffff !important;
}

.main-layout__sidebar [data-sidebar="menu-button"]:visited {
    color: #ffffff !important;
}

.main-layout__sidebar [data-sidebar="menu-button"]:hover,
.main-layout__sidebar [data-sidebar="menu-button"][data-active="true"],
.main-layout__sidebar [data-sidebar="menu-button"][aria-current="page"] {
    color: #ffffff !important;
    background: #6A91A3 !important;
}

.main-layout__sidebar .main-nav__item-icon {
    color: #ffffff !important;
}

.main-layout__sidebar [data-sidebar="group-label"] {
    color: rgba(255, 255, 255, 0.6) !important;
}

.main-layout__sidebar .main-nav__brand-title {
    color: #ffffff;
}

.main-layout__sidebar .main-nav__brand-copy {
    color: rgba(255, 255, 255, 0.7);
}

.main-layout__sidebar .main-nav__footer-name {
    color: #ffffff;
}

.main-layout__sidebar .main-nav__footer-email {
    color: rgba(255, 255, 255, 0.7);
}

.main-layout__sidebar .main-nav__logout-button {
    color: rgba(255, 255, 255, 0.75) !important;
}

.main-layout__sidebar .main-nav__logout-button:hover,
.main-layout__sidebar .main-nav__logout-button:focus-visible {
    background: #6A91A3 !important;
    color: #ffffff !important;
}

/* ── Icon-rail (collapsed) ───────────────────────────────────────────
   BB sets `data-collapsible="icon"` on the <aside> when the sidebar is
   collapsed. BB's own Tailwind rules already hide its built-in content
   (group labels go opacity:0, menu-button label spans get `[&>span]:hidden`),
   BUT our icons are wrapped in <span class="main-nav__item-icon"> which ALSO
   matches that `>span` selector and disappears. We restore icon spans below
   and hide our brand/footer text for a clean icon rail. */

/* Hide our brand text, footer identity, and the full-color logo in the rail.
   The image-vs-mark swap is handled alongside — brand mark becomes the logo. */
.main-layout__sidebar[data-collapsible="icon"] .main-nav__brand-title,
.main-layout__sidebar[data-collapsible="icon"] .main-nav__brand-copy,
.main-layout__sidebar[data-collapsible="icon"] .main-nav__footer-identity,
.main-layout__sidebar[data-collapsible="icon"] .main-nav__footer-email,
.main-layout__sidebar[data-collapsible="icon"] .main-nav__footer-avatar,
.main-layout__sidebar[data-collapsible="icon"] .main-nav__footer-button,
.main-layout__sidebar[data-collapsible="icon"] .main-nav__logo-image {
    display: none !important;
}

.main-layout__sidebar[data-collapsible="icon"] .main-nav__brand-mark {
    display: grid !important;
}

.main-layout__sidebar[data-collapsible="icon"] .main-nav__brand-logo,
.main-layout__sidebar[data-collapsible="icon"] .main-nav__footer-user {
    justify-content: center !important;
}

/* THE KEY FIX.
   BB adds a utility class `group-data-[collapsible=icon]:[&>span]:hidden` to
   every <a data-sidebar="menu-button">. When the aside has data-collapsible=icon
   that utility hides *every* direct-child <span>, including our icon span. Re-
   show the icon span; BB's `>span:last-child` label still hides, so only the
   icon renders — which is what the icon rail wants. */
.main-layout__sidebar[data-collapsible="icon"] [data-sidebar="menu-button"] > .main-nav__item-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.main-layout__sidebar[data-collapsible="icon"] .main-nav__item-icon {
    width: 1.25rem !important;
    height: 1.25rem !important;
}

.main-layout__sidebar[data-collapsible="icon"] .main-nav__item-icon svg {
    width: 100% !important;
    height: 100% !important;
}

/* Nav button in icon mode: tight centered square. BB's own centring gets us
   most of the way; these normalise size across our menu-button anchor. */
.main-layout__sidebar[data-collapsible="icon"] [data-sidebar="menu-button"] {
    width: 2.5rem !important;
    height: 2.5rem !important;
    padding: 0 !important;
    margin: 0.125rem auto !important;
    border-radius: 0.5rem !important;
    gap: 0 !important;
}

/* Logout button stays visible, matches icon-rail sizing. */
.main-layout__sidebar[data-collapsible="icon"] .main-nav__logout-button {
    margin-inline: auto;
    width: 2.25rem !important;
    height: 2.25rem !important;
    border-radius: 0.5rem !important;
}

.main-layout__sidebar[data-collapsible="icon"] .main-nav__logout-button svg {
    width: 1.15rem !important;
    height: 1.15rem !important;
}

/* ── Account / Manage horizontal nav tabs ─────────────────────── */
/* Kept global (not scoped) because NavLink's rendered anchor does
   not receive the Razor scoped-CSS attribute, so scoped rules never
   matched. */

.account-manage-nav {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 1.75rem;
    padding: 0;
    margin: 0;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--border) 92%, white);
    background: transparent;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

.account-manage-nav::-webkit-scrollbar {
    display: none;
}

.account-manage-nav__tab {
    position: relative;
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    padding: 0.75rem 0.25rem;
    margin-bottom: -1px;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: var(--muted-foreground);
    font-size: 0.9rem;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: color 140ms ease;
}

.account-manage-nav__tab:hover {
    color: #006265;
    text-decoration: none;
}

.account-manage-nav__tab:focus-visible {
    outline: 2px solid color-mix(in srgb, #006265 55%, transparent);
    outline-offset: 3px;
    border-radius: 3px;
}

.account-manage-nav__tab.active {
    color: #006265;
    font-weight: 600;
    border-bottom-color: #006265;
}

@media (prefers-reduced-motion: reduce) {
    .account-manage-nav__tab {
        transition: none;
    }
}

.main-layout__inset {
    margin: 0 !important;
    height: 100vh !important;
    max-height: 100vh !important;
    min-height: 100vh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

.main-layout__topbar {
    flex: 0 0 auto !important;
}

.main-layout__surface {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

.main-layout__body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scrollbar-gutter: stable;
}

/* ===========================================================================
 * Master search command surface
 * ---------------------------------------------------------------------------
 * The button is rendered by MainShellCommandPalette, which lives two levels
 * below MainLayout in the component tree. Blazor scoped CSS only propagates
 * to the first-level child component root, so these rules must be global to
 * reach the button on every page.
 * =========================================================================== */

.main-layout__command-surface {
    /* Sizing is owned by the palette container (.main-shell-palette) so the
       button fills its parent's animated max-width on open. Avoid declaring
       flex-basis / max-width here or the input cannot grow to match the
       expanded dropdown surface. */
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.65rem;
    border-radius: 0.375rem;
    border: 1px solid var(--border);
    background: var(--muted);
    color: var(--muted-foreground);
    text-align: left;
    cursor: pointer;
    transition: border-color 140ms ease, background-color 140ms ease, box-shadow 140ms ease, transform 140ms ease;
}

.main-layout__command-surface:hover,
.main-layout__command-surface:focus-visible {
    border-color: color-mix(in srgb, var(--foreground) 16%, var(--border) 84%);
    background: color-mix(in srgb, var(--background) 88%, var(--muted) 12%);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

/* Hit-testing for the command surface is handled in Blazor markup —
   each inner span has its own @onclick that forwards to the button's
   handler. user-select:none keeps the placeholder from turning clicks
   into a text-selection drag. */
.main-layout__command-surface,
.main-layout__command-surface * {
    user-select: none;
    -webkit-user-select: none;
}

.main-layout__command-leading {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--muted-foreground);
}

.main-layout__command-copy {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
}

.main-layout__command-label {
    display: none;
}

.main-layout__command-placeholder {
    color: var(--muted-foreground);
    font-size: 0.82rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.main-layout__command-shortcut {
    flex: 0 0 auto;
    padding: 0.1rem 0.35rem;
    border-radius: 0.25rem;
    border: 1px solid var(--border);
    background: var(--background);
    color: var(--muted-foreground);
    font-size: 0.68rem;
    font-weight: 600;
}

#sales-dashboard-pipeline {
    width: 100%;
}

.sales-dashboard--first-load .sales-dashboard__reveal {
    --sales-dashboard-reveal-delay: 0ms;
    --sales-dashboard-reveal-duration: 560ms;
    --sales-dashboard-reveal-distance-x: 20px;
    --sales-dashboard-reveal-distance-y: 8px;
    opacity: 0;
    transform: translate3d(
        var(--sales-dashboard-reveal-distance-x),
        var(--sales-dashboard-reveal-distance-y),
        0);
    animation: sales-dashboard-fade-in var(--sales-dashboard-reveal-duration) cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: var(--sales-dashboard-reveal-delay);
    will-change: opacity, transform;
}

@keyframes sales-dashboard-fade-in {
    from {
        opacity: 0;
        transform: translate3d(
            var(--sales-dashboard-reveal-distance-x),
            var(--sales-dashboard-reveal-distance-y),
            0);
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

#sales-dashboard-pipeline .sales-dashboard__rollup-surface {
    border: 1px solid var(--sales-surface-border);
    border-radius: var(--sales-surface-radius);
    background: color-mix(in srgb, var(--card) 99%, var(--mix-lighten));
    overflow: hidden;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    padding: 0.75rem 1.5rem;
    border-bottom: 1px solid var(--border);
    background: var(--card);
}

#sales-dashboard-pipeline .sales-dashboard__rollup-header h2 {
    margin: 0;
    font-size: 0.96rem;
    font-weight: 700;
    color: var(--foreground);
}

#sales-dashboard-pipeline .sales-dashboard__rollup-header-stats {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.35rem;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-header-filter,
#sales-dashboard-pipeline .sales-dashboard__rollup-header-stat {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 2.2rem;
    padding: 0.22rem 0.55rem;
    border: 1px solid color-mix(in srgb, var(--border) 92%, var(--mix-lighten));
    border-radius: 999px;
    background: color-mix(in srgb, var(--muted) 60%, var(--mix-lighten));
    white-space: nowrap;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-header-filter {
    padding: 0;
    border: 0;
    background: transparent;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-header-label {
    color: var(--muted-foreground);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    line-height: 1;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-header-value {
    color: var(--foreground);
    font-size: 0.78rem;
    font-weight: 400;
    line-height: 1;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-header-filter-group {
    display: inline-flex;
    align-items: center;
    gap: 0.18rem;
    min-height: 2.2rem;
    padding: 0.12rem 0.16rem;
    border: 1px solid color-mix(in srgb, var(--border) 92%, var(--mix-lighten));
    border-radius: 999px;
    background: color-mix(in srgb, var(--card) 97%, var(--mix-lighten));
}

#sales-dashboard-pipeline .sales-dashboard__rollup-header-pill {
    min-height: 1.72rem;
    padding: 0.2rem 0.55rem;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--muted-foreground);
    font: inherit;
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: background-color 140ms ease, color 140ms ease, box-shadow 140ms ease;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-header-pill:hover {
    color: color-mix(in srgb, var(--primary) 90%, var(--mix-darken));
    background: color-mix(in srgb, var(--primary) 10%, var(--mix-lighten));
}

#sales-dashboard-pipeline .sales-dashboard__rollup-header-pill--active {
    background: color-mix(in srgb, var(--primary) 16%, var(--mix-lighten));
    color: color-mix(in srgb, var(--primary) 90%, var(--mix-darken));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 22%, var(--mix-lighten));
}

@media (max-width: 1200px) {
    #sales-dashboard-pipeline .sales-dashboard__rollup-header {
        align-items: flex-start;
        flex-direction: column;
    }

    #sales-dashboard-pipeline .sales-dashboard__rollup-header-stats {
        width: 100%;
        justify-content: flex-start;
    }
}

#sales-dashboard-pipeline .sales-dashboard__rollup-scroll {
    overflow: hidden;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-frame {
    min-width: 0;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    position: relative;
    z-index: 1;
    background: var(--card);
}

#sales-dashboard-pipeline .sales-dashboard__rollup-stage {
    min-height: 12.4rem;
    padding: 1.55rem 1.5rem 1.25rem;
    position: relative;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-stage:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: -14rem;
    width: 1px;
    background: var(--border);
}

#sales-dashboard-pipeline .sales-dashboard__rollup-stage-copy {
    display: grid;
    gap: 0.55rem;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-stage-copy h3 {
    margin: 0;
    font-size: 0.92rem;
    font-weight: 500;
    color: color-mix(in srgb, #42553a 92%, var(--mix-darken));
}

#sales-dashboard-pipeline .sales-dashboard__rollup-figure {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.3rem;
    color: var(--foreground);
    font-size: 3.6rem;
    font-weight: 800;
    letter-spacing: -0.05em;
    line-height: 1;
    margin-top: 0.35rem;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-figure span {
    color: color-mix(in srgb, var(--muted-foreground) 90%, var(--foreground));
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: 0;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-subtitle {
    margin: 0;
    color: var(--muted-foreground);
    font-size: 0.95rem;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-stage-pill {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    padding: 0.32rem 0.8rem;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 400;
    margin-top: 0.3rem;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-stage-pill--primary {
    background: color-mix(in srgb, var(--primary) 14%, var(--mix-lighten));
    color: color-mix(in srgb, var(--primary) 82%, var(--mix-darken));
}

#sales-dashboard-pipeline .sales-dashboard__rollup-stage-pill--neutral {
    background: color-mix(in srgb, #6f7f4c 10%, var(--mix-lighten)) !important;
    background-color: color-mix(in srgb, #6f7f4c 10%, var(--mix-lighten)) !important;
    border-color: color-mix(in srgb, #6f7f4c 24%, var(--border)) !important;
    color: color-mix(in srgb, #42553a 76%, var(--mix-darken)) !important;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-stage-pill--up {
    background: color-mix(in srgb, var(--primary) 12%, var(--mix-lighten));
    color: color-mix(in srgb, var(--primary) 78%, var(--mix-darken));
}

#sales-dashboard-pipeline .sales-dashboard__rollup-stage-pill--down {
    background: color-mix(in srgb, var(--destructive) 12%, var(--mix-lighten));
    color: var(--destructive);
}

#sales-dashboard-pipeline .sales-dashboard__rollup-band {
    position: relative;
    min-height: 12.8rem;
    background: linear-gradient(180deg, color-mix(in srgb, var(--card) 99%, var(--mix-lighten)) 0%, color-mix(in srgb, var(--primary) 3%, var(--mix-lighten)) 100%);
}

#sales-dashboard-pipeline .sales-dashboard__rollup-band-grid {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    pointer-events: none;
    z-index: 2;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-band-segment {
    position: relative;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-band-segment:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 1px;
    background: var(--border);
}

#sales-dashboard-pipeline .sales-dashboard__rollup-band-badge {
    position: absolute;
    right: -1.05rem;
    top: 5.25rem;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 3rem;
    padding: 0.45rem 0.75rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: color-mix(in srgb, var(--card) 94%, var(--mix-lighten));
    box-shadow: 0 6px 16px -10px color-mix(in srgb, var(--foreground) 25%, transparent);
    color: color-mix(in srgb, var(--primary) 80%, var(--mix-darken));
    font-size: 0.9rem;
    font-weight: 700;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-band-chart {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

#sales-dashboard-pipeline .sales-dashboard__rollup-area {
    fill: url(#sales-dashboard-rollup-fill);
}

#sales-dashboard-pipeline .sales-dashboard__rollup-line {
    fill: none;
    stroke: #006265;
    stroke-width: 2.6;
    stroke-linecap: butt;
    stroke-linejoin: miter;
}

#sales-dashboard-board .sales-dashboard__board-scroll {
    overflow: visible;
    flex: 1 1 auto;
    min-height: 0;
}

#sales-dashboard-board .sales-dashboard__board-grid {
    display: flex;
    min-width: 0;
    background: color-mix(in srgb, var(--card) 99%, var(--mix-lighten));
    min-height: 0;
    flex: 1 1 auto;
}

#sales-dashboard-board .sales-dashboard__lane {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    padding: 0.9rem 1rem 1rem;
    position: relative;
    overflow: visible;
    transition: background-color 120ms ease;
}

#sales-dashboard-board .sales-dashboard__lane:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 2px;
    background-image: repeating-linear-gradient(
        to bottom,
        color-mix(in srgb, var(--border) 92%, var(--mix-lighten)) 0,
        color-mix(in srgb, var(--border) 92%, var(--mix-lighten)) 9px,
        transparent 9px,
        transparent 18px);
}

#sales-dashboard-board .sales-dashboard__lane--drop-target {
    background: hsla(79, 56%, 55%, 0.06);
}

#sales-dashboard-board .sales-dashboard__lane-header {
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    padding: 12px;
    background-color: #f8f9fa;
    border-radius: 4px;
}

#sales-dashboard-board .sales-dashboard__lane-header h2 {
    margin: 0;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--foreground);
}

#sales-dashboard-board .sales-dashboard__lane-header p {
    display: none;
}

#sales-dashboard-board .sales-dashboard__lane-meta {
    text-align: right;
    font-weight: 600;
    font-size: 0.8rem;
    color: var(--muted-foreground);
}

#sales-dashboard-board .sales-dashboard__lane-meta small {
    display: none;
}

#sales-dashboard-board .sales-dashboard__lane-body {
    display: grid;
    flex: 1 1 auto;
    gap: 0.5rem;
    align-content: start;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-gutter: stable;
    padding: 12px 0 12px 12px;
    background-color: #f8f9fa;
    border-radius: 4px;
}

#sales-dashboard-board .sales-dashboard__lane-empty {
    margin: 0;
    padding: 0.9rem 0.95rem;
    border-radius: 0;
    border: 1px dashed var(--border);
    color: var(--muted-foreground);
    font-size: 0.76rem;
    background: color-mix(in srgb, var(--background) 96%, var(--mix-lighten));
}

#sales-dashboard-board .sales-dashboard__card {
    display: block;
    position: relative;
    z-index: 1;
    overflow: visible;
    padding: 0.3rem;
    border-radius: 0;
    border: 1px solid var(--border);
    background: color-mix(in srgb, var(--card) 99%, var(--mix-lighten));
    will-change: transform, box-shadow, opacity;
    transition:
        border-color 180ms ease,
        box-shadow 220ms cubic-bezier(0.22, 1, 0.36, 1),
        transform 220ms cubic-bezier(0.22, 1, 0.36, 1),
        opacity 180ms ease,
        background-color 180ms ease;
}

#sales-dashboard-board .sales-dashboard__card:hover {
    border-color: var(--primary);
    transform: translateY(-1px);
    box-shadow: 0 0 0 1px hsla(79, 56%, 55%, 0.16);
    z-index: 6;
}

#sales-dashboard-board .sales-dashboard__card:has(.sales-dashboard__card-menu[open]) {
    z-index: 40;
}

#sales-dashboard-board .sales-dashboard__card--chosen {
    border-color: color-mix(in srgb, var(--primary) 72%, var(--mix-darken));
    transform: translateY(-1px) scale(1.005);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary) 18%, transparent);
}

#sales-dashboard-board .sales-dashboard__card--ghost {
    opacity: 0.22;
    transform: scale(0.985);
    background: color-mix(in srgb, var(--primary) 10%, var(--mix-lighten));
    border-color: color-mix(in srgb, var(--primary) 46%, var(--border));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 10%, transparent);
}

#sales-dashboard-board .sales-dashboard__card--dragging {
    opacity: 0.96;
    transform: rotate(0.65deg) scale(1.015);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary) 14%, transparent);
}

#sales-dashboard-board .sales-dashboard__card--pending {
    border-color: var(--primary);
}

#sales-dashboard-board .sales-dashboard__card-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 0.25rem;
    overflow: visible;
}

#sales-dashboard-board .sales-dashboard__card-summary {
    display: block;
    width: 100%;
    padding: 0.3rem 0.45rem;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: grab;
    touch-action: none;
    user-select: none;
    -webkit-user-select: none;
}

#sales-dashboard-board .sales-dashboard__card-summary:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--primary) 72%, var(--mix-darken));
    outline-offset: 3px;
    border-radius: calc(var(--radius) - 2px);
}

#sales-dashboard-board .sales-dashboard__card-topline {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.5rem;
    align-items: start;
}

#sales-dashboard-board .sales-dashboard__card-title-group {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

#sales-dashboard-board .sales-dashboard__card h3 {
    margin: 0;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.2;
}

#sales-dashboard-board .sales-dashboard__card-contact {
    margin: 0;
    color: var(--muted-foreground);
    font-size: 0.69rem;
    line-height: 1.45;
}

#sales-dashboard-board .sales-dashboard__card-date-group {
    display: grid;
    justify-items: end;
    gap: 0.16rem;
}

#sales-dashboard-board .sales-dashboard__card-date {
    color: var(--muted-foreground);
    font-size: 0.69rem;
    font-weight: 600;
}

#sales-dashboard-board .sales-dashboard__card-bottomline {
    margin-top: 0.12rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    align-items: center;
}

#sales-dashboard-board .sales-dashboard__card-value,
#sales-dashboard-board .sales-dashboard__card-followup {
    display: inline-flex;
    align-items: center;
    padding: 0.12rem 0.38rem;
    border-radius: 999px;
    font-size: 0.66rem;
    font-weight: 600;
}

#sales-dashboard-board .sales-dashboard__card-value {
    background: color-mix(in srgb, var(--primary) 12%, var(--mix-lighten));
    color: color-mix(in srgb, var(--primary) 78%, var(--mix-darken));
}

#sales-dashboard-board .sales-dashboard__card-followup {
    background: color-mix(in srgb, var(--muted) 88%, var(--mix-lighten));
    color: var(--muted-foreground);
}

#sales-dashboard-board .sales-dashboard__priority-dot {
    width: 0.62rem;
    height: 0.62rem;
    border-radius: 999px;
    margin-top: 0.2rem;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--card) 92%, var(--mix-lighten));
}

#sales-dashboard-board .sales-dashboard__priority-dot--high {
    background: var(--priority-high);
}

#sales-dashboard-board .sales-dashboard__priority-dot--medium {
    background: var(--priority-medium);
}

#sales-dashboard-board .sales-dashboard__priority-dot--low {
    background: var(--priority-low);
}

#sales-dashboard-board .sales-dashboard__card-menu {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 41;
}

#sales-dashboard-board .sales-dashboard__card-menu-trigger {
    list-style: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 0;
    color: var(--muted-foreground);
    cursor: pointer;
}

#sales-dashboard-board .sales-dashboard__card-menu-trigger::-webkit-details-marker {
    display: none;
}

#sales-dashboard-board .sales-dashboard__card-menu[open] .sales-dashboard__card-menu-trigger,
#sales-dashboard-board .sales-dashboard__card-menu-trigger:hover {
    background: color-mix(in srgb, var(--muted) 86%, var(--mix-lighten));
    color: color-mix(in srgb, var(--primary) 70%, var(--mix-darken));
}

#sales-dashboard-board .sales-dashboard__card-menu-list {
    position: absolute;
    top: calc(100% + 0.25rem);
    right: 0;
    z-index: 60;
    min-width: 12rem;
    padding: 0.3rem;
    border: 1px solid var(--border);
    border-radius: 0.7rem;
    background: var(--card);
    box-shadow: 0 16px 30px -20px color-mix(in srgb, var(--foreground) 18%, transparent);
    display: grid;
    gap: 0.15rem;
}

#sales-dashboard-board .sales-dashboard__card-menu-item {
    display: flex;
    width: 100%;
    align-items: center;
    min-height: 2rem;
    padding: 0.35rem 0.5rem;
    border: 0;
    border-radius: 0.45rem;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 0.75rem;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

#sales-dashboard-board .sales-dashboard__card-menu-item:hover {
    background: color-mix(in srgb, var(--primary) 10%, var(--mix-lighten));
}

#sales-dashboard-board .sales-dashboard__card-menu-item:disabled {
    cursor: default;
    opacity: 0.55;
}

#sales-dashboard-board .sales-dashboard__card-menu-item--link {
    color: color-mix(in srgb, var(--primary) 72%, var(--mix-darken));
}

.sales-dashboard__archive-drawer {
    margin-top: 1rem;
    border: 1px solid var(--sales-surface-border);
    border-radius: var(--sales-surface-radius);
    background: color-mix(in srgb, var(--card) 99%, var(--mix-lighten));
    overflow: hidden;
}

.sales-dashboard__archive-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.8rem 1rem;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
}

.sales-dashboard__archive-toggle-copy {
    display: grid;
    gap: 0.12rem;
}

.sales-dashboard__archive-toggle-copy strong {
    font-size: 0.88rem;
    font-weight: 700;
}

.sales-dashboard__archive-toggle-copy small,
.sales-dashboard__archive-toggle-meta {
    color: var(--muted-foreground);
    font-size: 0.74rem;
    font-weight: 600;
}

.sales-dashboard__archive-panel {
    border-top: 1px solid var(--border);
    padding: 0.85rem 1rem 1rem;
    background: color-mix(in srgb, var(--card) 97%, var(--mix-lighten));
}

.sales-dashboard__archive-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
    margin-bottom: 0.7rem;
}

.sales-dashboard__archive-search,
.sales-dashboard__archive-sort {
    display: flex;
    min-width: 0;
}

.sales-dashboard__archive-search {
    flex: 1 1 16rem;
}

.sales-dashboard__archive-search input,
.sales-dashboard__archive-sort select {
    width: 100%;
    min-height: 2rem;
    padding: 0.4rem 0.7rem;
    border: 1px solid color-mix(in srgb, var(--border) 92%, var(--mix-lighten));
    border-radius: 999px;
    background: color-mix(in srgb, var(--card) 99%, var(--mix-lighten));
    color: var(--foreground);
    font: inherit;
    font-size: 0.76rem;
}

.sales-dashboard__archive-search input::placeholder {
    color: var(--muted-foreground);
}

.sales-dashboard__archive-list {
    display: grid;
    gap: 0.55rem;
}

.sales-dashboard__archive-item {
    display: grid;
    gap: 0.55rem;
    padding: 0.75rem 0.8rem;
    border: 1px solid color-mix(in srgb, var(--border) 92%, var(--mix-lighten));
    border-radius: 0.7rem;
    background: color-mix(in srgb, var(--card) 99%, var(--mix-lighten));
}

.sales-dashboard__archive-topline {
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
    align-items: center;
    color: var(--muted-foreground);
    font-size: 0.72rem;
}

.sales-dashboard__archive-topline-left {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    min-width: 0;
}

.sales-dashboard__archive-stage {
    color: var(--muted-foreground);
}

.sales-dashboard__archive-main {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) auto;
    gap: 0.8rem;
    align-items: center;
}

.sales-dashboard__archive-copy {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
}

.sales-dashboard__archive-item h3 {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 700;
}

.sales-dashboard__archive-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
    margin: 0;
}

.sales-dashboard__archive-metrics div {
    display: grid;
    gap: 0.08rem;
}

.sales-dashboard__archive-metrics dt {
    margin: 0;
    color: var(--muted-foreground);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.sales-dashboard__archive-metrics dd {
    margin: 0;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--foreground);
}

.sales-dashboard__archive-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.sales-dashboard__archive-recover {
    min-height: 2rem;
    padding: 0.38rem 0.8rem;
    border: 1px solid color-mix(in srgb, var(--primary) 16%, var(--border));
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary) 12%, var(--mix-lighten));
    color: color-mix(in srgb, var(--primary) 78%, var(--mix-darken));
    font: inherit;
    font-size: 0.76rem;
    font-weight: 700;
    cursor: pointer;
    transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease;
}

.sales-dashboard__archive-recover:hover:not(:disabled) {
    background: color-mix(in srgb, var(--primary) 18%, var(--mix-lighten));
    border-color: color-mix(in srgb, var(--primary) 24%, var(--border));
}

.sales-dashboard__archive-recover:disabled {
    opacity: 0.6;
    cursor: default;
}

@media (max-width: 1100px) {
    .sales-dashboard__archive-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .sales-dashboard__archive-main {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .sales-dashboard__archive-metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .sales-dashboard__archive-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 720px) {
    .sales-dashboard__archive-metrics {
        grid-template-columns: 1fr;
    }
}

.sales-dashboard__sidebar-card {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    border: 1px solid var(--sales-surface-border);
    border-radius: var(--sales-surface-radius);
    background: var(--sidebar-background);
    color: var(--sidebar-foreground);
    box-shadow: none;
    overflow: hidden;
}

.sales-dashboard__rail-host .sales-dashboard__sidebar,
.sales-dashboard__rail-host #sales-dashboard-calendar-rail,
.sales-dashboard__rail-host .sales-dashboard__sidebar-card {
    height: 100%;
    min-height: 0;
}

.sales-dashboard__rail-host .sales-dashboard__sidebar,
.sales-dashboard__rail-host #sales-dashboard-calendar-rail {
    display: flex;
    flex: 1 1 auto;
    overflow: hidden;
}

.sales-dashboard__rail-header {
    flex: 0 0 auto;
    border-bottom: 1px solid var(--sales-surface-border);
    background: color-mix(in srgb, var(--sidebar-background) 96%, var(--mix-lighten));
    padding: 0;
}

.sales-dashboard__rail-host--collapsed .sales-dashboard__sidebar-card {
    height: 100%;
    width: 100%;
    min-width: 0;
}

.sales-dashboard__rail-host--collapsed .sales-dashboard__rail-header {
    flex: 1 1 auto;
    display: flex;
    min-height: 0;
    width: 100%;
    border-bottom: 0;
}

.sales-dashboard__rail-host--collapsed .sales-dashboard__sidebar,
.sales-dashboard__rail-host--collapsed #sales-dashboard-calendar-rail {
    width: 100%;
    min-width: 0;
}

.sales-dashboard__sidebar-card-body {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0.9rem 0.85rem 1rem;
    scrollbar-gutter: stable;
}

.sales-dashboard__rail-controls {
    display: flex;
    width: 100%;
    justify-content: space-between;
    padding: 0.75rem 1.5rem;
    align-items: center;
}

.sales-dashboard__rail-heading-group {
    display: grid;
    gap: 0.18rem;
}

.sales-dashboard__rail-heading-eyebrow {
    color: var(--muted-foreground);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.sales-dashboard__rail-heading-group h2 {
    margin: 0;
    font-size: 0.96rem;
    font-weight: 700;
    color: var(--foreground);
}

.sales-dashboard__rail-title {
    margin: 0;
    font-size: 0.96rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--foreground);
}

.sales-dashboard__rail-heading-group p {
    margin: 0;
    color: var(--muted-foreground);
    font-size: 0.76rem;
    line-height: 1.45;
}

.sales-dashboard__calendar-sources,
.sales-dashboard__signals,
.sales-dashboard__meetings,
.sales-dashboard__followups {
    gap: 0.65rem;
}

.sales-dashboard__rail-section-heading {
    padding: 0 0.15rem;
}

.sales-dashboard__rail-section-heading h2 {
    margin: 0;
    font-size: 0.98rem;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: color-mix(in srgb, #006265 92%, var(--mix-darken));
}

.sales-dashboard__source-card,
.sales-dashboard__signal,
.sales-dashboard__followup-card {
    border: 1px solid color-mix(in srgb, var(--border) 92%, var(--mix-lighten));
    background: color-mix(in srgb, var(--sidebar-background) 99%, var(--mix-lighten));
    border-radius: 0.7rem;
    box-shadow: none;
}

.sales-dashboard__source-card,
.sales-dashboard__followup-card {
    padding: 0.7rem 0.8rem;
}

.sales-dashboard__signal {
    padding: 0.75rem 0.8rem;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: start;
}

.sales-dashboard__signal-value {
    width: 2rem;
    height: 2rem;
    display: inline-grid;
    place-items: center;
    border-radius: 0.55rem;
    background: color-mix(in srgb, var(--primary) 12%, var(--mix-lighten));
    color: color-mix(in srgb, var(--primary) 80%, var(--mix-darken));
    font-size: 0.82rem;
    font-weight: 800;
}

.sales-dashboard__rail-action {
    width: 2rem;
    min-width: 2rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.45rem;
    background: transparent;
}

.sales-dashboard__rail-action:hover,
.sales-dashboard__rail-collapsed-button:hover {
    background: color-mix(in srgb, var(--primary) 10%, var(--mix-lighten));
    color: color-mix(in srgb, var(--primary) 78%, var(--mix-darken));
}

.sales-dashboard__rail-collapsed-button {
    min-height: 100%;
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 0.6rem;
    padding: 1rem 0.35rem;
}

.sales-dashboard__rail-host--collapsed .sales-dashboard__rail-collapsed-button {
    gap: 0;
    padding-inline: 0;
}

.sales-dashboard__rail-host--collapsed .sales-dashboard__rail-collapsed-button strong {
    display: none;
}

.sales-dashboard__rail-collapsed-icon {
    display: inline-grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: 0.45rem;
    background: color-mix(in srgb, var(--primary) 10%, var(--mix-lighten));
    color: color-mix(in srgb, var(--primary) 75%, var(--mix-darken));
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.workspace-hero--sales,
.workspace-quick-links--sales,
.workspace-command-deck--sales {
    --workspace-accent: var(--primary);
    --workspace-accent-soft: hsla(79, 56%, 55%, 0.14);
}

.workspace-hero--sales {
    border-color: color-mix(in srgb, var(--workspace-accent) 14%, var(--border));
}

.workspace-quick-links__card-topline,
.workspace-command-deck__action-topline {
    align-items: flex-start;
}

.workspace-quick-links__card,
.workspace-command-deck__search-card,
.workspace-command-deck__action-card,
.workspace-command-deck__note,
.workspace-hero__meta div {
    backdrop-filter: blur(12px);
}

.workspace-quick-links__card strong,
.workspace-command-deck__search-card strong,
.workspace-command-deck__action-card strong {
    color: color-mix(in srgb, var(--foreground) 90%, var(--workspace-accent, var(--primary)));
}

.workspace-quick-links__card p,
.workspace-command-deck__search-card p,
.workspace-command-deck__action-card p,
.workspace-command-deck__note p,
.workspace-hero__copy p {
    max-width: 66ch;
}

.workspace-quick-links__card {
    position: relative;
    overflow: hidden;
}

.workspace-quick-links__card::after {
    content: "";
    position: absolute;
    inset: auto -10% -35% 35%;
    height: 4.5rem;
    background: radial-gradient(circle, var(--workspace-accent-soft) 0%, transparent 68%);
    pointer-events: none;
}

.workspace-hero,
.workspace-quick-links {
    position: relative;
    overflow: hidden;
    border-radius: 1.5rem;
    border: 1px solid color-mix(in srgb, var(--border) 80%, var(--mix-lighten));
    box-shadow: 0 1rem 2.5rem rgba(15, 23, 42, 0.08);
}

.workspace-hero::before,
.workspace-quick-links::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, var(--workspace-accent-soft) 0%, transparent 55%);
    pointer-events: none;
}

.workspace-hero {
    display: flex;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.5rem;
    background:
        radial-gradient(circle at top left, var(--workspace-accent-soft) 0%, transparent 34%),
        linear-gradient(180deg, color-mix(in srgb, var(--card) 96%, var(--mix-lighten)) 0%, color-mix(in srgb, var(--background) 98%, var(--mix-lighten)) 100%);
}

.workspace-hero__copy,
.workspace-hero__actions,
.workspace-quick-links__heading,
.workspace-quick-links__grid {
    position: relative;
    z-index: 1;
}

.workspace-hero__copy {
    display: grid;
    gap: 0.75rem;
}

.workspace-hero__copy h1,
.workspace-quick-links__heading h2 {
    margin: 0;
}

.workspace-hero__copy p,
.workspace-quick-links__heading p,
.workspace-quick-links__card p {
    margin: 0;
    color: var(--muted-foreground);
    line-height: 1.6;
}

.workspace-hero__actions {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.workspace-hero__meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
    gap: 0.75rem;
    margin: 0;
}

.workspace-hero__meta div {
    padding: 0.85rem 1rem;
    border-radius: 1rem;
    background: color-mix(in srgb, var(--background) 90%, var(--mix-lighten));
    border: 1px solid color-mix(in srgb, var(--border) 82%, var(--mix-lighten));
}

.workspace-hero__meta dt {
    margin-bottom: 0.35rem;
    color: var(--muted-foreground);
    font-size: 0.8rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.workspace-hero__meta dd {
    margin: 0;
    font-weight: 600;
}

.workspace-quick-links {
    display: grid;
    gap: 1rem;
    padding: 1.25rem;
    background: linear-gradient(180deg, color-mix(in srgb, var(--card) 98%, var(--mix-lighten)) 0%, color-mix(in srgb, var(--background) 96%, var(--mix-lighten)) 100%);
}

.workspace-quick-links__heading,
.workspace-quick-links__card-topline {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
}

.workspace-quick-links__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 0.9rem;
}

.workspace-quick-links__card {
    display: grid;
    gap: 0.75rem;
    padding: 1rem 1.1rem;
    border-radius: 1rem;
    border: 1px solid color-mix(in srgb, var(--border) 82%, var(--mix-lighten));
    background: color-mix(in srgb, var(--background) 90%, var(--mix-lighten));
    color: inherit;
    text-decoration: none;
    transition: transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.workspace-quick-links__card:hover,
.workspace-quick-links__card:focus-visible {
    transform: translateY(-1px);
    border-color: var(--workspace-accent);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--workspace-accent) 30%, var(--mix-lighten));
}

.workspace-quick-links__card strong {
    font-size: 1rem;
}

.workspace-command-deck {
    position: relative;
    display: grid;
    gap: 1rem;
    overflow: hidden;
    padding: 1.25rem;
    border-radius: 1.5rem;
    border: 1px solid color-mix(in srgb, var(--border) 80%, var(--mix-lighten));
    background: linear-gradient(180deg, color-mix(in srgb, var(--card) 98%, var(--mix-lighten)) 0%, color-mix(in srgb, var(--background) 96%, var(--mix-lighten)) 100%);
    box-shadow: 0 1rem 2.5rem rgba(15, 23, 42, 0.08);
}

.workspace-command-deck::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, var(--workspace-accent-soft) 0%, transparent 60%);
    pointer-events: none;
}

.workspace-command-deck__header,
.workspace-command-deck__grid,
.workspace-command-deck__notes {
    position: relative;
    z-index: 1;
}

.workspace-command-deck__header {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
}

.workspace-command-deck__header h2,
.workspace-command-deck__search-card strong,
.workspace-command-deck__action-card strong {
    margin: 0;
}

.workspace-command-deck__header p,
.workspace-command-deck__search-card p,
.workspace-command-deck__action-card p,
.workspace-command-deck__note p {
    margin: 0;
    color: var(--muted-foreground);
    line-height: 1.6;
}

.workspace-command-deck__grid {
    display: grid;
    grid-template-columns: minmax(16rem, 1.15fr) minmax(0, 2fr);
    gap: 0.9rem;
}

.workspace-command-deck__search-card,
.workspace-command-deck__action-card,
.workspace-command-deck__note {
    text-decoration: none;
    color: inherit;
    border-radius: 1rem;
    border: 1px solid color-mix(in srgb, var(--border) 82%, var(--mix-lighten));
    background: color-mix(in srgb, var(--background) 90%, var(--mix-lighten));
}

.workspace-command-deck__search-card,
.workspace-command-deck__action-card {
    display: grid;
    gap: 0.75rem;
    padding: 1rem 1.1rem;
    transition: transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.workspace-command-deck__search-card:hover,
.workspace-command-deck__search-card:focus-visible,
.workspace-command-deck__action-card:hover,
.workspace-command-deck__action-card:focus-visible {
    transform: translateY(-1px);
    border-color: var(--workspace-accent);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--workspace-accent) 30%, var(--mix-lighten));
}

.workspace-command-deck__search-card {
    background:
        radial-gradient(circle at top left, var(--workspace-accent-soft) 0%, transparent 42%),
        linear-gradient(180deg, color-mix(in srgb, var(--background) 92%, var(--mix-lighten)) 0%, color-mix(in srgb, var(--background) 88%, var(--mix-lighten)) 100%);
}

.workspace-command-deck__search-topline,
.workspace-command-deck__action-topline {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
}

.workspace-command-deck__search-topline span {
    font-size: 0.84rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--workspace-accent) 82%, var(--mix-darken));
}

.workspace-command-deck__action-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 0.9rem;
}

.workspace-command-deck__notes {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 0.9rem;
}

.workspace-command-deck__note {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    padding: 0.9rem 1rem;
}

.workspace-command-deck__note-dot {
    width: 0.65rem;
    height: 0.65rem;
    margin-top: 0.4rem;
    flex: 0 0 auto;
    border-radius: 999px;
    background: var(--workspace-accent);
    box-shadow: 0 0 0 0.3rem color-mix(in srgb, var(--workspace-accent) 16%, var(--mix-lighten));
}

.workspace-hero--sales,
.workspace-quick-links--sales,
.workspace-command-deck--sales {
    --workspace-accent: var(--primary);
    --workspace-accent-soft: hsla(79, 56%, 55%, 0.12);
}

.workspace-hero--broker,
.workspace-quick-links--broker,
.workspace-command-deck--broker {
    --workspace-accent: #d97706;
    --workspace-accent-soft: rgba(217, 119, 6, 0.14);
}

.workspace-hero--platform,
.workspace-quick-links--platform,
.workspace-command-deck--platform {
    --workspace-accent: hsl(142, 72%, 35%);
    --workspace-accent-soft: hsla(142, 72%, 35%, 0.14);
}

@media (max-width: 900px) {
    .workspace-hero,
    .workspace-quick-links__heading,
    .workspace-command-deck__header,
    .workspace-command-deck__search-topline,
    .workspace-command-deck__action-topline {
        flex-direction: column;
        align-items: flex-start;
    }

    .workspace-command-deck__grid {
        grid-template-columns: 1fr;
    }
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

.org-admin-shell {
    padding: 2rem;
}

.org-admin-shell__hero,
.org-admin-shell__card,
.org-admin-shell__hierarchy-card {
    border-radius: 1rem;
    border: 1px solid #d6dbe3;
    background: linear-gradient(180deg, #ffffff 0%, #f5f7fb 100%);
    box-shadow: 0 0.8rem 2rem rgba(31, 45, 61, 0.08);
}

.org-admin-shell__hero {
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.org-admin-shell__eyebrow {
    display: inline-block;
    margin-bottom: 0.5rem;
    color: #7c5c18;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.org-admin-shell__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.org-admin-shell__card,
.org-admin-shell__hierarchy-card {
    padding: 1.25rem;
}

.org-admin-shell__hierarchy {
    display: grid;
    gap: 1rem;
}

.org-admin-shell__location-list {
    display: grid;
    gap: 0.75rem;
}

.org-admin-shell__location {
    border-left: 4px solid var(--primary);
    padding-left: 0.9rem;
}

.org-admin-shell__team-list {
    margin: 0;
    padding-left: 1rem;
}

.org-admin-shell__team-list span,
.org-admin-shell__hierarchy-card p {
    color: #526071;
}

.org-admin-shell__empty {
    color: #6c757d;
    margin-bottom: 0;
}

.platform-admin-layout__sidebar {
    border-right: 1px solid color-mix(in srgb, var(--border) 85%, var(--mix-lighten));
    background:
        radial-gradient(circle at top, color-mix(in srgb, var(--accent) 22%, var(--mix-lighten)) 0%, transparent 36%),
        linear-gradient(180deg, color-mix(in srgb, var(--card) 92%, #f0fdf4) 0%, color-mix(in srgb, var(--card) 96%, var(--mix-lighten)) 100%);
}

.platform-admin-layout__brand-mark {
    display: grid;
    place-items: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.85rem;
    background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 86%, var(--mix-lighten)) 0%, color-mix(in srgb, var(--accent) 80%, var(--mix-lighten)) 100%);
    color: var(--primary-foreground);
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.08em;
}

.platform-admin-layout__brand-title,
.platform-admin-layout__brand-copy,
.platform-admin-layout__topbar-label,
.platform-admin-layout__topbar-copy {
    display: block;
}

.platform-admin-layout__brand-title {
    font-weight: 700;
}

.platform-admin-layout__brand-copy,
.platform-admin-layout__boundary-copy,
.platform-admin-layout__topbar-copy {
    color: var(--muted-foreground);
    font-size: 0.92rem;
    line-height: 1.45;
}

.platform-admin-layout__footer-button {
    width: 100%;
}

.platform-admin-layout__inset {
    background:
        radial-gradient(circle at top right, color-mix(in srgb, var(--accent) 18%, var(--mix-lighten)) 0%, transparent 28%),
        linear-gradient(180deg, color-mix(in srgb, var(--background) 92%, #f0fdf4) 0%, var(--background) 100%);
}

.platform-admin-layout__topbar {
    position: sticky;
    top: 0;
    z-index: 10;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid color-mix(in srgb, var(--border) 85%, var(--mix-lighten));
    background: color-mix(in srgb, var(--background) 82%, var(--mix-lighten));
    backdrop-filter: blur(16px);
}

.platform-admin-layout__pending {
    display: grid;
    place-items: center;
    min-height: 45vh;
}

.platform-admin-layout__topbar-left {
    display: flex;
    align-items: center;
    gap: 0.9rem;
}

.platform-admin-layout__topbar-right {
    display: grid;
    justify-items: end;
    gap: 0.55rem;
}

.platform-admin-layout__status-copy {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.platform-admin-layout__status-note {
    max-width: 28rem;
    margin: 0;
    color: var(--muted-foreground);
    font-size: 0.9rem;
    text-align: right;
}

.platform-admin-layout__topbar-label {
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--primary) 80%, var(--mix-darken));
}

.platform-admin-layout__body {
    padding: 1.5rem;
}

.platform-admin-workspace {
    display: grid;
    gap: 1.5rem;
}

.platform-admin-workspace__loading {
    display: grid;
    place-items: center;
    min-height: 45vh;
}

.platform-admin-workspace__hero {
    display: flex;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.75rem;
    border: 1px solid color-mix(in srgb, var(--border) 85%, var(--mix-lighten));
    border-radius: 1.5rem;
    background:
        radial-gradient(circle at top left, color-mix(in srgb, var(--accent) 30%, var(--mix-lighten)) 0%, transparent 30%),
        linear-gradient(135deg, color-mix(in srgb, var(--card) 96%, var(--mix-lighten)) 0%, color-mix(in srgb, var(--muted) 96%, #f0fdf4) 100%);
    box-shadow: 0 1.25rem 3rem rgba(16, 33, 56, 0.08);
}

.platform-admin-workspace__hero-copy {
    display: grid;
    gap: 1rem;
}

.platform-admin-workspace__hero h1 {
    margin: 0;
    font-size: clamp(2rem, 3vw, 2.7rem);
    line-height: 1.05;
}

.platform-admin-workspace__hero p {
    max-width: 44rem;
    margin: 0;
    color: var(--muted-foreground);
    font-size: 1rem;
    line-height: 1.65;
}

.platform-admin-workspace__hero-meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.85rem;
    margin: 0;
}

.platform-admin-workspace__hero-meta div {
    padding: 0.9rem 1rem;
    border: 1px solid color-mix(in srgb, var(--border) 88%, var(--mix-lighten));
    border-radius: 1rem;
    background: color-mix(in srgb, var(--card) 94%, var(--mix-lighten));
}

.platform-admin-workspace__hero-meta dt {
    margin: 0 0 0.35rem;
    color: var(--muted-foreground);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.platform-admin-workspace__hero-meta dd {
    margin: 0;
    font-weight: 700;
}

.platform-admin-workspace__hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.75rem;
}

.platform-admin-workspace__kpis {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
}

.platform-admin-workspace__kpi-card {
    min-height: 100%;
}

.platform-admin-workspace__kpi-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
}

.platform-admin-workspace__tabs {
    display: grid;
    gap: 1rem;
}

.platform-admin-workspace__tab-list {
    width: fit-content;
}

.platform-admin-workspace__content-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr) minmax(260px, 0.9fr);
    gap: 1rem;
}

.platform-admin-workspace__module-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.platform-admin-workspace__module-card {
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--border) 90%, var(--mix-lighten));
    border-radius: 1rem;
    background: color-mix(in srgb, var(--card) 94%, var(--mix-lighten));
}

.platform-admin-workspace__stack {
    display: grid;
    gap: 1rem;
}

.platform-admin-workspace__module-value {
    color: color-mix(in srgb, var(--primary) 86%, var(--mix-darken));
    font-size: 1.35rem;
    font-weight: 700;
}

.platform-admin-workspace__module-title,
.platform-admin-workspace__signal-label,
.platform-admin-workspace__coverage-title,
.platform-admin-workspace__activity-title,
.platform-admin-workspace__leader-title {
    font-weight: 700;
}

.platform-admin-workspace__module-card p,
.platform-admin-workspace__signal-item p,
.platform-admin-workspace__coverage-copy,
.platform-admin-workspace__activity-subject,
.platform-admin-workspace__activity-item p,
.platform-admin-workspace__leader-copy,
.platform-admin-workspace__empty {
    margin: 0.45rem 0 0;
    color: var(--muted-foreground);
}

.platform-admin-workspace__signal-list {
    display: grid;
    gap: 0.85rem;
}

.platform-admin-workspace__signal-item {
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--border) 90%, var(--mix-lighten));
    border-radius: 1rem;
    background: color-mix(in srgb, var(--card) 95%, var(--mix-lighten));
}

.platform-admin-workspace__signal-value {
    color: color-mix(in srgb, var(--primary) 86%, var(--mix-darken));
    font-size: 1.15rem;
    font-weight: 700;
}

.platform-admin-workspace__focus-list {
    margin: 0;
    padding-left: 1.25rem;
    display: grid;
    gap: 0.75rem;
}

.platform-admin-workspace__coverage-list,
.platform-admin-workspace__activity-list,
.platform-admin-workspace__leaderboard {
    display: grid;
    gap: 0.9rem;
}

.platform-admin-workspace__coverage-row,
.platform-admin-workspace__activity-item,
.platform-admin-workspace__leader-row {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid color-mix(in srgb, var(--border) 90%, var(--mix-lighten));
    border-radius: 1rem;
    background: color-mix(in srgb, var(--card) 95%, var(--mix-lighten));
}

.platform-admin-workspace__coverage-metrics,
.platform-admin-workspace__activity-time,
.platform-admin-workspace__leader-metrics {
    min-width: 11rem;
    color: color-mix(in srgb, var(--primary) 82%, var(--mix-darken));
    font-weight: 600;
    text-align: right;
}

.platform-admin-workspace__leader-rank {
    display: grid;
    place-items: center;
    min-width: 3rem;
    height: 3rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--accent) 34%, var(--mix-lighten));
    color: color-mix(in srgb, var(--primary) 82%, var(--mix-darken));
    font-weight: 700;
}

.platform-admin-workspace__leader-body {
    flex: 1;
}

.platform-admin-workspace__leader-metrics {
    display: grid;
    align-content: center;
    gap: 0.25rem;
}

.platform-admin-workspace__activity-body {
    flex: 1;
}

@media (prefers-reduced-motion: reduce) {
    .sales-dashboard__reveal,
    .sales-dashboard--first-load .sales-dashboard__reveal,
    .sales-dashboard__lane,
    .sales-dashboard__card {
        opacity: 1;
        transform: none;
        animation: none;
        transition: none;
        will-change: auto;
    }
}

@media (max-width: 900px) {
    .platform-admin-workspace__hero,
    .platform-admin-workspace__content-grid,
    .platform-admin-workspace__coverage-row,
    .platform-admin-workspace__activity-item,
    .platform-admin-workspace__leader-row,
    .platform-admin-layout__topbar {
        grid-template-columns: 1fr;
        flex-direction: column;
        align-items: stretch;
    }

    .platform-admin-workspace__coverage-metrics,
    .platform-admin-workspace__activity-time,
    .platform-admin-workspace__leader-metrics {
        min-width: 0;
        text-align: left;
    }

    .platform-admin-layout__topbar-right,
    .platform-admin-layout__status-copy {
        justify-items: stretch;
        justify-content: flex-start;
    }

    .platform-admin-layout__status-note {
        max-width: none;
        text-align: left;
    }
}

/* ===========================================================================
 * Blazor error banner
 * ---------------------------------------------------------------------------
 * Declared globally (not Blazor-scoped) because #blazor-error-ui is rendered
 * by AppShellLayout.razor, while a scoped rule in any other *.razor.css file
 * would only match elements carrying that other component's scope attribute.
 * Without `display: none` here the banner is always visible on page load
 * because the browser can't find a matching hiding rule for its attribute.
 * Blazor's runtime toggles `display: block` on this element when the circuit
 * reports an unhandled error.
 * =========================================================================== */

#blazor-error-ui {
    color-scheme: light only;
    background: #fef3c7;
    color: #78350f;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(15, 23, 42, 0.12);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.75rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .reload {
    color: inherit;
    font-weight: 700;
}

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