/* SPDI-CA / Atlas — horizontal application navigation and a new visual system. */
:root {
    color-scheme: light;
    --page: #f8f2f1;
    --surface: #fffdfc;
    --surface-soft: #f8e9e9;
    --text: #38232a;
    --muted: #78686e;
    --border: #e8d5d8;
    --navy-950: #381721;
    --navy-900: #59202c;
    --navy-800: #832438;
    --navy-700: #a9223a;
    --cyan-500: #c42d46;
    --cyan-400: #e04a5a;
    --cyan-100: #fce4e7;
    --danger: #b6273e;
    --success: #16855b;
    --atlas-deep: #481b29;
    --atlas-citrus: #ffb1a7;
    --atlas-peach: #f9dfe0;
    --atlas-line: #e8d5d8;
    --accent-red: #bd2735;
    --accent-red-soft: #fbe9e9;
    --accent-gradient: linear-gradient(110deg, #8f1024 0%, #c52839 52%, #ec6a63 100%);
    --header-height: 72px;
    --shadow: 0 12px 32px rgba(72,27,41,.09);
}
:root[data-theme="dark"] {
    color-scheme: dark;
    --page: #1b151a;
    --surface: #2a2027;
    --surface-soft: #382931;
    --text: #fff2f2;
    --muted: #d1b9c0;
    --border: #60414b;
    --navy-950: #fff2f2;
    --navy-900: #f8d7dc;
    --navy-800: #f2a5ae;
    --navy-700: #ff8595;
    --cyan-500: #f06a7a;
    --cyan-400: #ff8b98;
    --cyan-100: #60313d;
    --atlas-deep: #3c1725;
    --atlas-peach: #4b2a35;
    --atlas-line: #60414b;
    --accent-red: #ff737d;
    --accent-red-soft: #5a3139;
    --accent-gradient: linear-gradient(110deg, #a51c31 0%, #d44350 55%, #ff8b7d 100%);
}

html { background: var(--page); }
body.portal-body,
body.login-page { background: var(--page); background-image: none; }
button,
.button { border-radius: 999px; background: var(--atlas-deep); box-shadow: none; }
button:hover,
.button:hover { box-shadow: 0 5px 16px rgba(7,62,60,.16); }
input,
select,
textarea { border-radius: 12px; background: var(--surface); }

/* A full-width navigation bar replaces the old desktop left sidebar. */
.portal-header {
    height: var(--header-height);
    padding: 0 clamp(18px,3vw,52px);
    border: 0;
    background: var(--surface);
    box-shadow: none;
    backdrop-filter: none;
}
.portal-header::after { content: none; }
.portal-header-start { display: contents; }
.portal-header .sidebar-header-toggle { order: 0; flex: 0 0 auto; margin: 0 12px 0 0; }
.portal-header .brand-link { order: 1; flex: 0 0 auto; }
.portal-header-actions { order: 2; margin-left: auto; }
.brand-link img { width: 170px; max-height: 50px; }
.portal-sidebar { background: var(--atlas-deep); }

@media (min-width: 901px) {
    .portal-header { justify-content: flex-start; }
    .portal-sidebar {
        position: sticky;
        z-index: 44;
        top: var(--header-height);
        bottom: auto;
        left: auto;
        width: 100%;
        height: 66px;
        min-height: 66px;
        padding: 0 clamp(18px,3vw,52px);
        display: flex;
        align-items: center;
        overflow: visible;
        border: 0;
        box-shadow: 0 12px 22px rgba(72,27,41,.15);
        transform: none;
        transition: none;
    }
    :root[data-sidebar="closed"] .portal-sidebar { display: none; }
    :root[data-sidebar="open"] .portal-sidebar { visibility: visible; transform: none; }
    .sidebar-heading,
    .sidebar-footer { display: none; }
    .sidebar-nav { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 100%; padding: 0; }
    .sidebar-nav-group { position: relative; display: block; }
    .sidebar-nav-link,
    .sidebar-group-toggle {
        width: auto;
        min-height: 44px;
        padding: 10px 15px;
        border: 0;
        border-radius: 999px;
        color: #fff0f1;
        white-space: nowrap;
    }
    .sidebar-nav-icon { width: 20px; height: 20px; }
    .sidebar-nav-link:hover,
    .sidebar-group-toggle:hover,
    .sidebar-nav-group:has(.sidebar-submenu-link.is-active) > .sidebar-group-toggle,
    .sidebar-nav-link.is-active,
    .sidebar-nav-link.is-active:hover {
        color: var(--atlas-deep);
        border: 0;
        background: #f8b2bd;
        box-shadow: none;
        transform: none;
    }
    .sidebar-chevron { margin-left: 8px; }
    .sidebar-submenu,
    .sidebar-nav-group.is-expanded .sidebar-submenu {
        position: absolute;
        top: calc(100% + 9px);
        left: 0;
        width: 270px;
        max-height: min(65vh, 540px);
        margin: 0;
        padding: 9px;
        overflow-x: hidden;
        overflow-y: auto;
        border: 1px solid var(--border);
        border-radius: 17px;
        background: var(--surface);
        box-shadow: 0 18px 35px rgba(72,27,41,.2);
        transform: none;
    }
    .sidebar-submenu { visibility: hidden; pointer-events: none; opacity: 0; }
    .sidebar-nav-group.is-expanded .sidebar-submenu { visibility: visible; pointer-events: auto; opacity: 1; }
    .sidebar-submenu-link,
    .sidebar-nested-link {
        width: 100%;
        min-height: 42px;
        margin: 0;
        padding: 9px 12px;
        border-radius: 10px;
        color: var(--text);
    }
    .sidebar-nested-link {
        width: calc(100% - 22px);
        min-height: 37px;
        margin-left: 22px;
        padding-block: 7px;
        color: var(--muted);
        font-size: .78rem;
    }
    .sidebar-nested-link::before {
        display: block;
        top: -5px;
        left: -12px;
        border-color: color-mix(in srgb,var(--accent-red) 45%,var(--border));
    }
    .sidebar-submenu-link:hover,
    .sidebar-submenu-link.is-active,
    .sidebar-submenu-link.is-active:hover { color: var(--atlas-deep); background: var(--cyan-100); border: 0; box-shadow: none; transform: none; }
    .sidebar-nested-link::before { display: block; }
    .sidebar-submenu-dot { background: var(--cyan-500); }
    .sidebar-backdrop { display: none !important; }
    .portal-shell,
    :root[data-sidebar="open"] .portal-shell,
    :root[data-sidebar="closed"] .portal-shell {
        width: min(1460px, calc(100% - 72px));
        max-width: none;
        margin: 0 auto 80px;
        padding-top: 36px;
        transform: none;
    }
}

/* Main canvas: generous space, curved surfaces, coloured content islands. */
.page-hero {
    min-height: 190px;
    padding: 26px clamp(28px,4vw,56px);
    border: 0;
    border-radius: 30px;
    color: var(--atlas-deep);
    background: var(--atlas-peach);
    box-shadow: none;
}
.page-hero::before,
.page-hero::after { content: none; }
.page-hero h1 { margin: 8px 0; font-size: clamp(2.5rem,4vw,4.5rem); letter-spacing: -.065em; line-height: 1.04; }
.page-hero p { color: var(--muted); }
.eyebrow { color: var(--navy-700); letter-spacing: .15em; }
.dashboard-section { margin-top: 0; }
.section-heading,
.panel-heading { align-items: center; padding: 0; border: 0; }
.section-heading h2,
.panel-heading h2 { font-size: clamp(1.5rem,2vw,2.15rem); letter-spacing: -.05em; }
.section-chip,
.record-count { border: 0; border-radius: 999px; color: var(--atlas-deep); background: var(--cyan-100); }
.panel {
    border: 1px solid var(--border);
    border-radius: 26px;
    background: var(--surface);
    box-shadow: var(--shadow);
    backdrop-filter: none;
}
.panel:has(.panel-heading) { border-top: 0; }
.table-wrap,
.sales-table-wrap,
.schedule-table-wrap,
.cash-pending-table-wrap,
.commission-table-wrap,
.commission-master-table-wrap,
.pos-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 18px; background: var(--surface); box-shadow: 0 8px 24px rgba(72,27,41,.08); }
table { width: 100%; border-collapse: separate; border-spacing: 0; color: var(--text); background: var(--surface); }
thead th { padding: 16px; color: #fff3f4 !important; background: #682338 !important; border-color: #542032 !important; font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; }
thead th:first-child { border-top-left-radius: 16px; }
thead th:last-child { border-top-right-radius: 16px; }
tbody td { padding: 15px 16px; color: var(--text); border-bottom: 1px solid var(--border); background: var(--surface); }
tbody tr:nth-child(even) td { background: color-mix(in srgb,var(--surface-soft) 55%,var(--surface)); }
tbody tr:hover td,
tbody tr:nth-child(even):hover td { background: var(--cyan-100); }
tbody tr:last-child td { border-bottom: 0; }
table tfoot td { color: #fff3f4 !important; background: #481b29 !important; border-color: #481b29 !important; }
.sales-update-table thead .sales-title-row th { color: #fff3f4 !important; background: #481b29 !important; }
.sales-update-table tbody tr:nth-child(even) td:not(.sales-heat-cell):not(.sales-total-boxes) { background: color-mix(in srgb,var(--surface-soft) 55%,var(--surface)); }
.sales-update-table tbody tr:hover td:not(.sales-heat-cell) { background: var(--cyan-100); }
.sales-update-table .sales-total-boxes,
.daily-deposit-table .sales-total-boxes { color: #481b29; background: #f8cad1; }
.sales-update-table .sales-heat-cell { color: #481b29; background: hsl(var(--heat) 42% 78%); text-shadow: none; }
.quota-table-card thead tr:nth-child(2) th:nth-child(-n+2) { color: #fff3f4 !important; background: #682338 !important; }
.table-search-input input,
.custom-select-trigger { border-radius: 14px; background: var(--surface); box-shadow: none; }
.custom-select-menu { border-radius: 16px; box-shadow: 0 15px 35px rgba(7,62,60,.14); }

/* Dashboard: a horizontal welcome board and modular, asymmetric sections. */
.dashboard-workspace { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 22px; align-content: start; }
.dashboard-workspace > .alert,
.dashboard-workspace > .dashboard-hero { grid-column: 1 / -1; }
.dashboard-hero {
    min-height: 350px;
    display: grid;
    grid-template-columns: minmax(0,1.65fr) minmax(300px,.7fr);
    gap: 0;
    align-items: stretch;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 32px;
    color: var(--atlas-deep);
    background: var(--atlas-peach);
    box-shadow: none;
}
.dashboard-hero::before,
.dashboard-hero::after { content: none; }
.dashboard-hero .hero-content { padding: clamp(30px,5vw,72px); }
.dashboard-hero .hero-badge { margin-bottom: 22px; color: var(--navy-700); background: transparent; border: 0; box-shadow: none; letter-spacing: .18em; }
.dashboard-hero h1 { max-width: 720px; margin: 0 0 24px; font-size: clamp(3rem,5.2vw,6rem); letter-spacing: -.075em; line-height: .96; }
.dashboard-hero h1 em { color: var(--navy-700); font-style: normal; }
.dashboard-hero p { max-width: 44ch; color: var(--muted); font-size: 1.05rem; }
.dashboard-hero-actions { display: flex; flex-direction: column; justify-content: center; gap: 4px; padding: clamp(24px,3vw,48px); color: #fff0f1; background: var(--atlas-deep); }
.dashboard-hero-actions-label { margin-bottom: 18px; color: var(--atlas-citrus); font-size: .72rem; font-weight: 900; letter-spacing: .18em; }
.dashboard-hero-actions > :is(a,button) { width: 100%; display: flex; justify-content: space-between; gap: 12px; padding: 17px 0; border: 0; border-bottom: 1px solid rgba(255,255,255,.2); border-radius: 0; color: #fff0f1; background: transparent; font: inherit; font-weight: 800; text-align: left; cursor: pointer; }
.dashboard-hero-actions > :is(a,button):hover { color: var(--atlas-citrus); }
.dashboard-hero-actions > :is(a,button) span { font-size: 1.25rem; }
.dashboard-workspace > .dashboard-section { grid-column: span 6; min-width: 0; padding: 28px; border-radius: 28px; background: var(--surface); box-shadow: var(--shadow); }
.dashboard-workspace > .dashboard-section:has(.market-visibility-panel) { grid-column: 1 / -1; }
.dashboard-workspace .tool-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.dashboard-workspace .tool-card {
    min-height: 150px;
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto 1fr;
    gap: 12px;
    align-items: start;
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 18px;
    color: var(--text);
    background: var(--surface-soft);
    box-shadow: none;
    backdrop-filter: none;
}
.dashboard-workspace .tool-card:hover { border-color: var(--cyan-500); background: var(--surface); box-shadow: 0 10px 25px rgba(72,27,41,.12); transform: translateY(-3px); }
.dashboard-workspace .tool-icon { grid-column: 1; grid-row: 1; border-radius: 12px; box-shadow: none; }
.dashboard-workspace .tool-arrow { grid-column: 2; grid-row: 1; align-self: start; color: var(--navy-700); font-size: 1.35rem; }
.dashboard-workspace .tool-copy { grid-column: 1 / -1; grid-row: 2; }
.dashboard-workspace .tool-copy strong { display: block; margin-bottom: 5px; font-size: 1.07rem; letter-spacing: -.03em; }
.dashboard-workspace .tool-copy small { color: var(--muted); line-height: 1.4; }

/* The sales counter and management screens become their own application islands. */
.pos-hero { color: #fff1f3; background: var(--atlas-deep); }
.pos-hero .eyebrow { color: var(--atlas-citrus); }
.pos-hero p { color: #f1cbd1; }
.pos-total-card { border: 1px solid rgba(255,255,255,.22); border-radius: 16px; background: rgba(255,255,255,.08); box-shadow: none; }
.pos-section { border: 1px solid var(--border); border-left: 5px solid var(--cyan-500); }
.user-list-panel { background: var(--surface); }

/* Login is a full split-screen entry, not a floating card on a glowing background. */
.login-page { background: var(--atlas-deep); }
.login-ambient,
.login-network,
.login-card-glow { display: none; }
.login-topbar { position: relative; z-index: 3; width: 100%; max-width: none; height: 76px; margin: 0; padding: 0 clamp(24px,3vw,48px); border: 0; border-radius: 0; background: var(--surface); box-shadow: none; }
.login-shell { width: 100%; max-width: none; min-height: calc(100vh - 76px); margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0,1.05fr) minmax(430px,.95fr); gap: 0; }
.login-showcase { min-height: calc(100vh - 76px); padding: clamp(44px,6vw,100px); border-radius: 0; background: var(--atlas-deep); box-shadow: none; }
.login-showcase,
.login-showcase h1,
.login-showcase h1 > span,
.login-showcase .login-feature strong { color: #fff5f4; -webkit-text-fill-color: currentColor; }
.login-showcase .login-kicker { color: #ffb267; }
.login-showcase .login-showcase-copy,
.login-showcase .login-feature small,
.login-showcase .login-showcase-footer { color: #f6d6da; }
.login-showcase h1,
.login-showcase h1 > span { color: #fff5f4 !important; -webkit-text-fill-color: #fff5f4 !important; background: none !important; }
.login-showcase .login-kicker { color: #ffb267 !important; }
.login-showcase .login-showcase-copy,
.login-showcase .login-feature strong,
.login-showcase .login-feature small { color: #f6d6da !important; }
.login-showcase-grid { opacity: .12; }
.login-showcase-content { max-width: 760px; transform: none; }
.login-kicker { color: var(--atlas-citrus); }
.login-kicker > span { background: var(--atlas-citrus); box-shadow: none; }
.login-showcase h1 { font-size: clamp(3.3rem,5.5vw,7rem); line-height: .98; }
.login-showcase h1 > span { color: #ffb1bd; background: none; -webkit-text-fill-color: currentColor; }
.login-showcase-copy { color: #f6d6da; }
.login-feature { border-color: rgba(255,255,255,.18); border-radius: 18px; background: rgba(255,255,255,.07); box-shadow: none; backdrop-filter: none; }
.login-feature-icon { color: #ffb1bd; background: rgba(255,177,189,.14); }
.login-auth-panel { padding: clamp(30px,6vw,90px); background: var(--surface); }
.login-card { width: min(490px,100%); padding: 0; overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; backdrop-filter: none; animation: none; }
.login-card::before { content: none; }
.login-eyebrow { color: var(--navy-700); }
.login-eyebrow > span { color: var(--navy-700); background: var(--cyan-100); }
.login-card h2 { color: var(--text); font-size: clamp(2.6rem,4vw,4.3rem); }
.login-submit { background: var(--atlas-deep); border-radius: 14px; }
.login-showcase-footer { color: #f6d6da; }
.login-showcase-footer > span { background: var(--atlas-citrus); box-shadow: none; }
.password-setup-card { width: min(480px,calc(100% - 28px)); margin: 8vh auto; padding: 32px; border-radius: 24px; color: var(--text); background: var(--surface); box-shadow: var(--shadow); }

/* Remove legacy dark-mode cards and blue overlays from the split login. */
:root[data-theme="dark"] .login-page { color: #fff2f2; background: #1b151a; }
:root[data-theme="dark"] .login-topbar { background: #2a2027; }
:root[data-theme="dark"] .login-auth-panel { background: #2a2027; }
:root[data-theme="dark"] .login-card { color: #fff2f2; border: 0; background: transparent; box-shadow: none; backdrop-filter: none; }
:root[data-theme="dark"] .login-card h2,
:root[data-theme="dark"] .login-label,
:root[data-theme="dark"] .login-form label { color: #fff2f2; }
:root[data-theme="dark"] .login-intro,
:root[data-theme="dark"] .login-trust { color: #d1b9c0; }
:root[data-theme="dark"] .login-eyebrow,
:root[data-theme="dark"] .login-eyebrow > span { color: #ff9baa; }
:root[data-theme="dark"] .login-eyebrow > span { background: #60313d; }
:root[data-theme="dark"] .login-input-wrap input { color: #fff2f2; border: 1px solid #60414b; background: #382931; }
:root[data-theme="dark"] .login-input-wrap input::placeholder { color: #d1b9c0; }
:root[data-theme="dark"] .login-input-wrap input:focus { border-color: #ff8595; background: #48313a; }
:root[data-theme="dark"] .login-theme-toggle { color: #fff2f2; border-color: #60414b; background: #382931; box-shadow: none; }
:root[data-theme="dark"] .login-theme-toggle:hover { color: #ff9baa; border-color: #ff8595; background: #48313a; }
:root[data-theme="dark"] .login-submit { color: #fff; background: var(--accent-gradient); }

/* Report-specific controls that previously kept blue or purple palettes. */
.commission-print-button,
.commission-empty-state > span,
.sales-copy-snapshot { color: #fff; background: var(--accent-gradient); border-color: var(--accent-red); box-shadow: 0 9px 22px rgba(143,16,36,.17); }
.sales-report-heading { background: linear-gradient(120deg, var(--surface), var(--surface-soft)); }
.sales-table-title > span { color: var(--navy-700); background: var(--cyan-100); }

/* Comp and rebate report workspace. */
.comp-rebate-shell { display: grid; gap: 22px; }
.comp-rebate-tool-icon { color: #fff; background: var(--accent-gradient); }
.comp-rebate-tool-icon svg { width: 27px; height: 27px; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.mlb-tool-card:hover { border-color: #d52c49 !important; }
.mlb-tool-icon { color: #fff; background: linear-gradient(145deg,#571020,#9d1832 58%,#e23a52) !important; }
.performance-bonus-tool-card:hover { border-color: #c68a21 !important; }
.performance-bonus-tool-icon { color: #fff; background: linear-gradient(145deg,#681326,#a9213d 54%,#d69a2f) !important; }
.mlb-tool-icon svg, .performance-bonus-tool-icon svg { width: 27px; height: 27px; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
:root[data-theme="dark"] .mlb-tool-icon { background: linear-gradient(145deg,#76142b,#c12747 58%,#ff6379) !important; box-shadow: 0 0 0 1px rgba(255,128,147,.2); }
:root[data-theme="dark"] .performance-bonus-tool-icon { background: linear-gradient(145deg,#7d1830,#c72e4e 54%,#dba43e) !important; box-shadow: 0 0 0 1px rgba(244,191,91,.2); }
.dashboard-comp-metric { margin-bottom: 16px; padding: 17px 19px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 15px; overflow: hidden; border: 1px solid color-mix(in srgb,var(--accent-red) 34%,var(--border)); border-radius: 18px; color: var(--text); background: linear-gradient(115deg,var(--accent-red-soft),var(--surface) 68%); }
.dashboard-comp-metric:hover { border-color: var(--accent-red); box-shadow: 0 10px 24px rgba(143,16,36,.12); transform: translateY(-2px); }
.dashboard-comp-metric-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 15px; color: #fff; background: var(--accent-gradient); }
.dashboard-comp-metric-icon svg { width: 27px; height: 27px; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.dashboard-comp-metric-copy { min-width: 0; display: grid; gap: 2px; }
.dashboard-comp-metric-copy small { color: var(--accent-red); font-size: .65rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.dashboard-comp-metric-copy strong { font-size: 1rem; }
.dashboard-comp-metric-copy > span { color: var(--muted); font-size: .75rem; font-weight: 700; }
.dashboard-comp-metric-value { color: var(--navy-900); font-size: clamp(1.45rem,2.2vw,2.15rem); font-weight: 950; letter-spacing: -.05em; }
:root[data-theme="dark"] .dashboard-comp-metric-value { color: #fff2f2; }
.dashboard-inventory-metrics { margin-top: 16px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.dashboard-inventory-metrics .dashboard-comp-metric { margin-bottom: 0; }
.dashboard-phone-ordering-link { margin-top: 16px; }
.zero-sales-backdrop { position: fixed; z-index: 10000; inset: 0; visibility: hidden; opacity: 0; background: rgba(8,16,32,.22); transition: opacity 180ms ease,visibility 180ms ease; }
.zero-sales-backdrop.is-open { visibility: visible; opacity: 1; }
.zero-sales-drawer { position: fixed; z-index: 10001; top: 84px; right: 24px; width: min(calc(100vw - 32px),430px); max-height: min(72vh,680px); padding: 26px; overflow-y: auto; visibility: hidden; opacity: 0; border: 1px solid var(--border); border-radius: 24px; color: var(--text); background: var(--surface); box-shadow: 0 28px 70px rgba(5,25,48,.3); transform: translateY(-14px) scale(.97); transform-origin: top right; transition: opacity 180ms ease,transform 220ms cubic-bezier(.2,.8,.2,1),visibility 180ms ease; }
.zero-sales-drawer.is-open { visibility: visible; opacity: 1; transform: translateY(0) scale(1); }
.zero-sales-drawer-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding-bottom: 18px; border-bottom: 1px solid var(--border); }
.zero-sales-drawer-head .eyebrow { margin: 0 0 5px; }
.zero-sales-drawer-head h2 { margin: 0; font-size: 1.65rem; letter-spacing: -.035em; }
.zero-sales-close { width: 42px; height: 42px; display: grid; flex: 0 0 auto; place-items: center; padding: 0; border: 1px solid var(--border); border-radius: 13px; color: var(--text); background: var(--surface-soft); font-size: 1.55rem; cursor: pointer; }
.zero-sales-close:hover { color: #fff; border-color: var(--accent-red); background: var(--accent-gradient); }
.zero-sales-drawer-note { margin: 18px 0 14px; color: var(--muted); font-size: .84rem; font-weight: 700; }
.zero-sales-store-list { display: grid; gap: 7px; }
.zero-sales-store { min-height: 44px; display: flex; align-items: center; padding: 10px 14px; border: 1px solid var(--border); border-radius: 11px; background: var(--surface-soft); font-size: .82rem; font-weight: 800; transition: transform 120ms ease,border-color 120ms ease,background 120ms ease; }
.zero-sales-store:hover { border-color: rgba(225,13,24,.26); background: var(--accent-red-soft); transform: translateX(3px); }
.zero-sales-empty { padding: 22px 14px; border: 1px dashed var(--border); border-radius: 12px; color: var(--muted); text-align: center; }
.inventory-summary-drawer { width: min(calc(100vw - 32px),700px); overflow-x: hidden; }
.inventory-summary-drawer-totals { margin: 0 0 16px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.inventory-summary-drawer-totals > span { min-width: 0; padding: 14px 16px; display: grid; gap: 3px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface-soft); }
.inventory-summary-drawer-totals small { color: var(--muted); font-size: .66rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.inventory-summary-drawer-totals strong { overflow: hidden; font-size: clamp(1.05rem,2vw,1.45rem); font-variant-numeric: tabular-nums; text-overflow: ellipsis; white-space: nowrap; }
.inventory-summary-store-head { display: grid; grid-template-columns: minmax(190px,1fr) 76px 64px 116px; align-items: center; gap: 16px; padding: 0 14px 7px; color: var(--muted); font-size: .62rem; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.inventory-summary-store-head span:not(:first-child) { text-align: right; }
.inventory-summary-store-list { display: grid; gap: 8px; }
.inventory-summary-store { min-height: 64px; display: grid; grid-template-columns: minmax(190px,1fr) 76px 64px 116px; align-items: center; gap: 16px; padding: 11px 13px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface-soft); }
.inventory-summary-store > div { min-width: 0; }
.inventory-summary-store > div strong { display: block; overflow: hidden; font-size: .83rem; text-overflow: ellipsis; white-space: nowrap; }
.inventory-summary-store > div small { display: block; margin-top: 3px; overflow: hidden; color: var(--muted); font-size: .67rem; text-overflow: ellipsis; white-space: nowrap; }
.inventory-summary-store > span { min-width: 0; display: grid; gap: 2px; text-align: right; font-variant-numeric: tabular-nums; }
.inventory-summary-store > span small { display: none; color: var(--muted); font-size: .61rem; font-weight: 800; text-transform: uppercase; }
.inventory-summary-store > span b { overflow: hidden; font-size: .9rem; text-overflow: ellipsis; white-space: nowrap; }
.comp-rebate-hero-actions { display: flex; align-items: center; gap: 10px; }
.report-refresh-pill { align-self: center; padding: 10px 14px; border-radius: 999px; color: var(--navy-900); background: var(--surface); font-size: .72rem; font-weight: 850; }
.comp-rebate-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; }
.comp-rebate-stats article { padding: 20px 22px; display: grid; gap: 5px; border: 1px solid var(--border); border-radius: 20px; background: var(--surface); box-shadow: var(--shadow); }
.comp-rebate-stats article > span { color: var(--navy-700); font-size: .7rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.comp-rebate-stats article strong { font-size: 2rem; letter-spacing: -.05em; }
.comp-rebate-stats article small { color: var(--muted); }
.comp-rebate-stats .attention { background: var(--accent-red-soft); }
.comp-rebate-stats .chargeback { border-color: color-mix(in srgb,var(--accent-red) 44%,var(--border)); background: linear-gradient(135deg,var(--accent-red-soft),var(--surface)); }
.comp-rebate-controls { padding: 20px; display: grid; gap: 18px; }
.report-view-tabs { display: flex; gap: 8px; }
.report-view-tabs a { padding: 12px 16px; border-radius: 999px; color: var(--muted); background: var(--surface-soft); font-weight: 850; }
.report-view-tabs a.is-active { color: #fff; background: var(--accent-gradient); }
.comp-rebate-filter { display: flex; align-items: end; gap: 12px; }
.comp-rebate-filter.is-report-filter { display: grid; grid-template-columns: repeat(4,minmax(150px,1fr)); }
.comp-rebate-filter label { display: grid; gap: 7px; color: var(--muted); font-size: .72rem; font-weight: 850; text-transform: uppercase; }
.comp-rebate-filter select { min-width: 180px; }
.comp-rebate-filter input { width: 100%; min-height: 48px; }
.comp-rebate-filter .custom-date-trigger { min-height: 48px; }
.comp-rebate-filter .custom-date-popover { text-transform: none; }
.comp-rebate-search { grid-column: span 2; }
.comp-rebate-filter-actions { display: flex; align-items: center; gap: 9px; }
.comp-rebate-filter-actions .button { color: var(--text); background: var(--surface-soft); }
.comp-rebate-table-panel { min-width: 0; padding: 24px; }
.comp-rebate-table-wrap { max-height: 68vh; margin-top: 18px; }
.comp-rebate-table-wrap table { min-width: max-content; }
.comp-rebate-table-wrap thead th { position: sticky; z-index: 2; top: 0; }
.sortable-heading { display: inline-flex; align-items: center; gap: 7px; color: inherit; white-space: nowrap; }
.sortable-heading:hover { color: #ffd4d8; }
.sortable-heading span { font-size: .9rem; }
.comp-rebate-table-wrap td { max-width: 320px; overflow: hidden; text-overflow: ellipsis; }
.comp-rebate-table-wrap .chargeback-row td { color: #751022; background: #fff0f2 !important; }
.chargeback-type { display: inline-flex; padding: 4px 9px; border: 1px solid currentColor; border-radius: 999px; font-size: .68rem; font-weight: 900; letter-spacing: .08em; }
.comp-rebate-table-wrap .chargeback-row .chargeback-amount { font-weight: 900; font-variant-numeric: tabular-nums; }
.comp-rebate-table-wrap .chargeback-row:hover td { background: #ffdde2 !important; }
:root[data-theme="dark"] .comp-rebate-table-wrap .chargeback-row td { color: #ffd8de; background: #49202a !important; }
:root[data-theme="dark"] .comp-rebate-table-wrap .chargeback-row:hover td { background: #5b2632 !important; }
.server-pagination { padding-top: 18px; display: flex; align-items: center; justify-content: flex-end; gap: 14px; }
.server-pagination span { color: var(--muted); font-size: .8rem; font-weight: 800; }
.server-pagination .button { padding: 9px 16px; }
.server-pagination .is-disabled { opacity: .42; pointer-events: none; }
@media (max-width: 800px) {
    .dashboard-comp-metric { grid-template-columns: auto 1fr; }
    .dashboard-comp-metric-value { grid-column: 1 / -1; padding-top: 8px; }
    .dashboard-inventory-metrics { grid-template-columns: 1fr; }
    .zero-sales-drawer { top: 74px; right: 12px; width: calc(100vw - 24px); max-height: calc(100dvh - 90px); padding: 22px; border-radius: 20px; }
    .inventory-summary-drawer-totals { grid-template-columns: 1fr 1fr; }
    .inventory-summary-drawer-totals > span:last-child { grid-column: 1 / -1; }
    .inventory-summary-store-head { display: none; }
    .inventory-summary-store { grid-template-columns: minmax(0,1fr) 72px 62px; gap: 10px; }
    .inventory-summary-store > span small { display: block; }
    .inventory-summary-store > span:last-child { grid-column: 1 / -1; padding-top: 9px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--border); }
    .comp-rebate-stats { grid-template-columns: 1fr; }
    .comp-rebate-controls { align-items: stretch; flex-direction: column; }
    .comp-rebate-hero-actions { align-items: stretch; flex-direction: column; }
    .report-view-tabs { display: grid; grid-template-columns: 1fr; }
    .report-view-tabs a { text-align: center; }
    .comp-rebate-filter { align-items: stretch; flex-direction: column; }
    .comp-rebate-filter.is-report-filter { display: grid; grid-template-columns: 1fr; }
    .comp-rebate-search { grid-column: auto; }
    .comp-rebate-filter select { width: 100%; min-width: 0; }
    .comp-rebate-table-panel { padding: 16px; }
}
:root[data-theme="dark"] .login-showcase { background: #391721; }
:root[data-theme="dark"] .page-hero,
:root[data-theme="dark"] .dashboard-hero { color: #fff2f2; background: #4b2a35; }
:root[data-theme="dark"] .page-hero h1,
:root[data-theme="dark"] .dashboard-hero h1 { color: #fff2f2; }
:root[data-theme="dark"] .page-hero p,
:root[data-theme="dark"] .dashboard-hero p { color: #e3bdc5; }
:root[data-theme="dark"] .dashboard-hero .hero-badge,
:root[data-theme="dark"] .dashboard-hero h1 em { color: #ff9baa; }
:root[data-theme="dark"] .section-heading h2,
:root[data-theme="dark"] .panel-heading h2,
:root[data-theme="dark"] .dashboard-workspace .tool-copy strong { color: #fff2f2; }
:root[data-theme="dark"] .dashboard-workspace .tool-card { color: #fff2f2; background: #382931; }
:root[data-theme="dark"] .dashboard-workspace .tool-card:hover { background: #48313a; }
:root[data-theme="dark"] .section-chip,
:root[data-theme="dark"] .record-count { color: #ffb1bd; background: #60313d; }
:root[data-theme="dark"] tbody tr:hover td,
:root[data-theme="dark"] tbody tr:nth-child(even):hover td { color: #fff2f2; background: #60313d; }

@media (max-width: 1200px) {
    .dashboard-workspace > .dashboard-section { grid-column: 1 / -1; }
    .dashboard-workspace .tool-grid { grid-template-columns: repeat(auto-fit,minmax(210px,1fr)); }
}
@media (max-width: 900px) {
    .portal-header::after { display: none; }
    .portal-sidebar { position: fixed; top: var(--header-height); bottom: 0; left: 0; width: min(330px,86vw); height: auto; padding: 20px 15px; display: flex; flex-direction: column; overflow-x: hidden; overflow-y: auto; box-shadow: 15px 0 30px rgba(7,62,60,.2); }
    .sidebar-heading { display: block; border-bottom-color: rgba(255,255,255,.18); }
    .sidebar-heading strong { color: #fff; }
    .sidebar-kicker { color: var(--atlas-citrus); }
    .sidebar-nav { display: grid; padding-top: 16px; }
    .sidebar-nav-link,
    .sidebar-group-toggle,
    .sidebar-submenu-link { color: #fff0f1; }
    .sidebar-submenu-link.is-active { color: var(--atlas-deep); background: #f8b2bd; }
    .sidebar-footer { display: flex; color: #fff; border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.08); box-shadow: none; }
    .sidebar-profile-copy strong { color: #fff; }
    .sidebar-profile-copy small { color: #f8b2bd; }
    .portal-shell { width: min(92%,1460px); margin: 0 auto 60px; padding-top: 24px; transform: none; }
    .dashboard-hero { grid-template-columns: 1fr; }
    .dashboard-hero-actions { padding: 24px 30px; }
    .login-shell { grid-template-columns: 1fr; }
    .login-showcase { min-height: 400px; padding: 70px 36px 95px; }
    .login-auth-panel { margin: 0; padding: 42px 28px 60px; }
}
@media (max-width: 720px) {
    .login-page,
    .login-shell,
    .login-showcase,
    .login-auth-panel { width: 100%; max-width: 100%; overflow-x: hidden; }
    .portal-shell { width: calc(100% - 24px); padding-top: 16px; }
    .page-hero { min-height: 0; padding: 26px 22px; border-radius: 22px; }
    .page-hero h1 { font-size: clamp(2.15rem,9vw,3.25rem); }
    .panel { margin-top: 16px; border-radius: 20px; }
    .dashboard-workspace { display: block; }
    .dashboard-hero { min-height: 0; border-radius: 22px; }
    .dashboard-hero .hero-content { padding: 30px 24px; }
    .dashboard-hero h1 { font-size: clamp(2.6rem,11vw,4rem); }
    .dashboard-workspace > .dashboard-section { margin-top: 16px; padding: 20px; border-radius: 20px; }
    .dashboard-workspace .tool-grid { grid-template-columns: 1fr; }
    .dashboard-workspace .tool-card { min-height: 114px; }
    .pos-shell { width: calc(100% - 24px); }
    .login-showcase { min-height: 265px; padding: 28px 24px; }
    .login-showcase-content { width: 100%; min-width: 0; max-width: 100%; transform: none; }
    .login-showcase h1 { max-width: 100%; font-size: clamp(2.15rem,9vw,3rem); white-space: normal; overflow-wrap: break-word; }
    .login-showcase-copy { max-width: 100%; white-space: normal; }
    .login-showcase-copy { margin-top: 12px; font-size: .84rem; line-height: 1.4; }
    .login-showcase-footer { display: none; }
    .login-feature-grid { display: none; }
    .login-auth-panel { padding: 38px 24px 56px; }
}
@media (prefers-reduced-motion: reduce) {
    .dashboard-workspace .tool-card,
    .sidebar-nav-link,
    .sidebar-submenu-link { transition: none; }
}

/* Burgundy and crimson carry the primary palette across the portal. */
.portal-header { border-top: 0; }
.portal-header::before { position: absolute; top: 0; right: 0; left: 0; height: 4px; content: ""; background: var(--accent-gradient); }
.page-hero { position: relative; overflow: hidden; border-left: 0; background-image: linear-gradient(115deg, rgba(197,40,57,.11), transparent 43%); }
.page-hero::before { position: absolute; top: 0; bottom: 0; left: 0; width: 6px; content: ""; background: var(--accent-gradient); }
.dashboard-hero .hero-content { border-left: 0; background: var(--accent-gradient) left / 6px 100% no-repeat; }
.dashboard-hero-actions { background: linear-gradient(125deg, #481b29 20%, #84263b 100%); }
.eyebrow,
.dashboard-hero .hero-badge,
.dashboard-hero h1 em,
.dashboard-workspace .tool-arrow { color: var(--accent-red); }
.dashboard-workspace .tool-card:hover { border-color: var(--accent-red); }
.section-chip,
.record-count { color: var(--accent-red); background: var(--accent-red-soft); }
thead th { border-bottom: 3px solid var(--accent-red) !important; }
.sidebar-nav-link.is-active,
.sidebar-nav-link.is-active:hover,
.sidebar-nav-group:has(.sidebar-submenu-link.is-active) > .sidebar-group-toggle { color: #fff; background: var(--accent-gradient); }
.sidebar-submenu-link.is-active,
.sidebar-submenu-link.is-active:hover { color: var(--accent-red); background: var(--accent-red-soft); }
.login-kicker,
.login-showcase .login-kicker { color: #ff9aa0 !important; }
.login-kicker > span,
.login-showcase-footer > span { background: #ff737d; }
.login-showcase { background-image: radial-gradient(circle at 85% 15%, rgba(244,121,133,.2), transparent 38%), linear-gradient(145deg, #481b29, #7e263b); }
.login-submit { color: #fff; background: var(--accent-gradient); }
.login-submit:hover { background: var(--accent-gradient); filter: brightness(1.08); }
.pos-section { border-left-color: var(--accent-red); }
.pos-proceed { background: var(--accent-gradient); }
:root[data-theme="dark"] .page-hero { background-image: linear-gradient(115deg, rgba(255,115,125,.13), transparent 42%); }
:root[data-theme="dark"] .login-showcase { background-image: radial-gradient(circle at 85% 15%, rgba(244,121,133,.18), transparent 38%), linear-gradient(145deg, #391721, #642335); }
:root[data-theme="dark"] .dashboard-hero h1 em,
:root[data-theme="dark"] .dashboard-hero .hero-badge { color: var(--accent-red); }
:root[data-theme="dark"] .section-chip,
:root[data-theme="dark"] .record-count { color: #ff9aa0; background: var(--accent-red-soft); }
:root[data-theme="dark"] .login-submit { color: #fff; background: var(--accent-gradient); }
.google-review-tool-icon {
    color: #fff !important;
    background: conic-gradient(
        from -35deg,
        #4285f4 0 25%,
        #34a853 0 50%,
        #fbbc04 0 75%,
        #ea4335 0
    ) !important;
    box-shadow:
        inset 0 0 0 4px rgba(255, 255, 255, .18),
        0 9px 20px rgba(0, 0, 0, .18);
    font-weight: 950;
}

.google-review-tool-card:hover {
    border-color: #4285f4 !important;
}

.aging-comparison-drawer { width: min(calc(100vw - 32px), 780px); }
.aging-comparison-drawer h3 { margin: 22px 0 10px; font-size: 1rem; }
.aging-comparison-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 12px; }
.aging-comparison-table-wrap table { width: 100%; border-collapse: collapse; }
.aging-comparison-table-wrap th,
.aging-comparison-table-wrap td { padding: 12px; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.aging-comparison-table-wrap th:first-child,
.aging-comparison-table-wrap td:first-child { text-align: left; white-space: normal; min-width: 150px; }
.aging-comparison-table-wrap td small { display: block; margin-top: 4px; color: var(--muted); font-size: .72rem; }

.aging-comparison-drawer { width: min(calc(100vw - 32px), 1040px); }
.aging-comparison-drawer .inventory-summary-drawer-totals { grid-template-columns: repeat(4,minmax(0,1fr)); }
.aging-comparison-drawer th,
.aging-comparison-drawer td,
.aging-comparison-drawer th:first-child,
.aging-comparison-drawer td:first-child { white-space: nowrap; }
@media (max-width: 560px) { .aging-comparison-drawer .inventory-summary-drawer-totals { grid-template-columns: repeat(2,minmax(0,1fr)); } }

.aging-progress-period-form { margin: 16px 0; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 12px; }
.aging-progress-period-form label { display: grid; gap: 6px; min-width: 0; font-size: .75rem; font-weight: 800; }
.aging-progress-period-form input[type="date"] { min-width: 0; width: 100%; font: inherit; }
@media (max-width: 560px) { .aging-progress-period-form { grid-template-columns: 1fr; } }

.aging-progress-period-form .portal-date-range-filter { min-width: 0; }
