/* ==========================================================================
   Nova UI kit — the components of the Nova design (canvas «Sveltos Nova
   Dashboard»), used by every page under templates/nova/pages|store.
   Every colour is a token, so the dark theme is one attribute on <html>:
   data-theme="dark". Class prefix: .nv-
   ========================================================================== */

:root, [data-theme="light"] {
    --nv-bg: #F4F5F8;
    --nv-surface: #FFFFFF;
    --nv-surface-2: #FAFBFC;
    --nv-field: #F7F8FA;
    --nv-sunken: #F7F8FA;
    --nv-ink: #141821;
    --nv-ink-2: #394150;
    --nv-muted: #5B6472;
    --nv-faint: #7C8595;
    --nv-faint-2: #9AA3B2;
    --nv-line: #E3E6EC;
    --nv-line-2: #D5D9E1;
    --nv-line-soft: #EEF0F4;
    --nv-row: #F1F2F5;
    --nv-hover: #F3F4F6;
    --nv-chip: #EEF1F6;
    --nv-chip-ink: #374151;
    --nv-track: #EEF1F6;
    --nv-switch-off: #C9CED8;
    --nv-red: #D7192A;
    --nv-red-hover: #B81424;
    --nv-red-soft: #FFF1F2;
    --nv-red-row: #FFF7F7;
    --nv-red-line: #F5C2C7;
    --nv-red-ink: #9F1224;
    --nv-primary: #141821;      /* ink buttons */
    --nv-on-primary: #FFFFFF;
    --nv-accent: #3451D1;       /* map / courier / charts */
    --nv-accent-soft: #E8ECFB;
    --nv-accent-ink: #23389A;
    --nv-amber-bg: #FFF5E8;
    --nv-amber-line: #F3D6A6;
    --nv-amber-ink: #6E4205;
    --nv-amber-chip: #FFE8CC;
    --nv-amber-fg: #8A4B00;
    --nv-warn: #B45309;
    --nv-warn-bar: #D97706;
    --nv-late-bg: #FDE7DC;
    --nv-late-fg: #A3330B;
    --nv-bad-line: #F3C9B8;
    --nv-bad-fg: #9A3412;
    --nv-good: #15803D;
    --nv-good-dot: #1A9E52;
    --nv-good-bg: #E3F5EA;
    --nv-good-ink: #135E35;
    --nv-map: #E9EDF2;
    --nv-map-water: #CFE0EE;
    --nv-map-road: #FFFFFF;
    --nv-map-street: #F8FAFC;
    --nv-store-pin: #1F2533;
    --nv-drop-pin: #E0701B;
    --nv-shadow: 0 16px 40px rgba(20, 24, 33, 0.16);
    --nv-radius: 14px;
    --nv-font: 'Commissioner', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    color-scheme: light;
}

[data-theme="dark"] {
    --nv-bg: #0D1015;
    --nv-surface: #151A22;
    --nv-surface-2: #12161D;
    --nv-field: #0D1015;
    --nv-sunken: #11151C;
    --nv-ink: #E7EAF0;
    --nv-ink-2: #B9C1CE;
    --nv-muted: #97A1B2;
    --nv-faint: #7E889A;
    --nv-faint-2: #6B7485;
    --nv-line: #222935;
    --nv-line-2: #2A3240;
    --nv-line-soft: #222935;
    --nv-row: #1C222C;
    --nv-hover: #1C222C;
    --nv-chip: #232A36;
    --nv-chip-ink: #D5DAE3;
    --nv-track: #222935;
    --nv-switch-off: #3A4352;
    --nv-red: #F0444F;
    --nv-red-hover: #FF5A64;
    --nv-red-soft: #2A1418;
    --nv-red-row: #221419;
    --nv-red-line: #5C2129;
    --nv-red-ink: #FF9AA2;
    --nv-primary: #E7EAF0;
    --nv-on-primary: #0D1015;
    --nv-accent: #8FA3FF;
    --nv-accent-soft: #1E2640;
    --nv-accent-ink: #B7C4FF;
    --nv-amber-bg: #2A2114;
    --nv-amber-line: #5A4520;
    --nv-amber-ink: #F2C98B;
    --nv-amber-chip: #3A2C12;
    --nv-amber-fg: #F2B36B;
    --nv-warn: #F2B36B;
    --nv-warn-bar: #F2B36B;
    --nv-late-bg: #3A1D14;
    --nv-late-fg: #FF8E7A;
    --nv-bad-line: #5C2E21;
    --nv-bad-fg: #FF8E7A;
    --nv-good: #6BD49A;
    --nv-good-dot: #3FB872;
    --nv-good-bg: #143322;
    --nv-good-ink: #6BD49A;
    --nv-map: #1A2029;
    --nv-map-water: #1C2A3A;
    --nv-map-road: #2A3240;
    --nv-map-street: #222935;
    --nv-store-pin: #E7EAF0;
    --nv-drop-pin: #F29A6B;
    --nv-shadow: 0 16px 40px rgba(0, 0, 0, 0.5);
    color-scheme: dark;
}

/* ------------------------------------------------------------------ base */
.nv-page { display: flex; flex-direction: column; gap: 16px; color: var(--nv-ink); font-family: var(--nv-font); font-variant-numeric: tabular-nums; min-width: 0; }
.nv-page *, .nv-page *::before, .nv-page *::after { box-sizing: border-box; }
.nv-page a { color: inherit; text-decoration: none; }
.nv-page a:hover { text-decoration: none; }
.nv-page h1, .nv-page h2, .nv-page h3 { margin: 0; color: var(--nv-ink); font-family: var(--nv-font); }
.nv-page p { margin: 0; }
.nv-page button { font-family: var(--nv-font); }
.nv-fill { flex: 1 1 auto; min-width: 0; min-height: 0; }
.nv-row { display: flex; align-items: center; gap: 12px; min-width: 0; }
.nv-row-top { display: flex; align-items: flex-start; gap: 12px; min-width: 0; }
.nv-col { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.nv-wrap { flex-wrap: wrap; }
.nv-gap-4 { gap: 4px; } .nv-gap-6 { gap: 6px; } .nv-gap-8 { gap: 8px; } .nv-gap-10 { gap: 10px; }
.nv-gap-14 { gap: 14px; } .nv-gap-16 { gap: 16px; } .nv-gap-18 { gap: 18px; }
.nv-grid { display: grid; gap: 16px; min-width: 0; }
.nv-grid-2 { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.nv-grid-3 { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.nv-grid-4 { display: grid; gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.nv-grid-5 { display: grid; gap: 16px; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.nv-grid-6 { display: grid; gap: 12px; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.nv-right { margin-left: auto; }
.nv-center { text-align: center; }
.nv-num { text-align: right; white-space: nowrap; }
.nv-nowrap { white-space: nowrap; }
.nv-ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.nv-hidden, .nv-page [hidden], .nv-modal [hidden] { display: none !important; }
.nv-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* text */
.nv-h1 { font-size: 24px; font-weight: 700; letter-spacing: -0.01em; }
.nv-h2 { font-size: 15px; font-weight: 700; }
.nv-h3 { font-size: 17px; font-weight: 700; }
.nv-big { font-size: 30px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.05; }
.nv-bold { font-weight: 700; }
.nv-semi { font-weight: 600; }
.nv-muted { color: var(--nv-muted); }
.nv-faint { color: var(--nv-faint); }
.nv-ink2 { color: var(--nv-ink-2); }
.nv-xs { font-size: 11px; } .nv-sm { font-size: 12px; } .nv-md { font-size: 13px; } .nv-base { font-size: 14px; } .nv-lg { font-size: 15px; } .nv-xl { font-size: 17px; } .nv-2xl { font-size: 20px; }
.nv-good { color: var(--nv-good) !important; }
.nv-warn { color: var(--nv-warn) !important; }
.nv-bad { color: var(--nv-late-fg) !important; }
.nv-red { color: var(--nv-red) !important; }
.nv-accent { color: var(--nv-accent) !important; }
.nv-section-title { font-size: 11px; font-weight: 700; letter-spacing: 0.07em; color: var(--nv-faint); text-transform: uppercase; }
.nv-eyebrow { font-size: 12px; font-weight: 700; letter-spacing: 0.07em; color: var(--nv-red); }
.nv-link { font-size: 13px; font-weight: 700; color: var(--nv-ink) !important; white-space: nowrap; }
.nv-link:hover { text-decoration: underline !important; }
.nv-link-accent { font-size: 13px; font-weight: 600; color: var(--nv-accent) !important; white-space: nowrap; }

/* ----------------------------------------------------------------- cards */
.nv-card { background: var(--nv-surface); border: 1px solid var(--nv-line); border-radius: var(--nv-radius); min-width: 0; }
.nv-card.is-flush { overflow: hidden; display: flex; flex-direction: column; }
.nv-card.is-pad { padding: 16px 18px; }
.nv-card.is-pad-lg { padding: 18px 20px; }
.nv-card-head { display: flex; align-items: center; gap: 10px; padding: 13px 18px; border-bottom: 1px solid var(--nv-line-soft); min-width: 0; }
.nv-card-head h2 { flex: 1 1 auto; font-size: 15px; font-weight: 700; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nv-card-body { padding: 14px 18px; }
.nv-card-foot { padding: 12px 18px; border-top: 1px solid var(--nv-line-soft); }
.nv-scroll { overflow-y: auto; min-height: 0; scrollbar-width: thin; }
.nv-note { padding: 12px 14px; border-radius: 10px; background: var(--nv-sunken); font-size: 13px; color: var(--nv-ink-2); }
.nv-divider { height: 1px; background: var(--nv-line-soft); margin: 2px 0; }
.nv-empty { padding: 28px 18px; text-align: center; font-size: 14px; color: var(--nv-muted); }

/* KPI */
.nv-kpi { background: var(--nv-surface); border: 1px solid var(--nv-line); border-radius: var(--nv-radius); padding: 15px 18px; display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.nv-kpi-label { font-size: 13px; color: var(--nv-muted); font-weight: 500; }
.nv-kpi-value { display: flex; align-items: flex-end; gap: 6px; }
.nv-kpi-value b { font-size: 30px; font-weight: 700; letter-spacing: -0.02em; line-height: 1; color: var(--nv-ink); }
.nv-kpi-value small { font-size: 14px; color: var(--nv-muted); padding-bottom: 2px; }
.nv-kpi-value svg { margin-left: auto; }
.nv-kpi-note { font-size: 12px; font-weight: 600; color: var(--nv-muted); }
.nv-kpi.is-compact { padding: 12px 14px; gap: 4px; }
.nv-kpi.is-compact .nv-kpi-value b { font-size: 24px; }

/* alert banners */
.nv-alert { display: flex; align-items: center; gap: 12px; padding: 11px 16px; border-radius: 12px; background: var(--nv-amber-bg); border: 1px solid var(--nv-amber-line); color: var(--nv-amber-ink); font-size: 14px; }
.nv-alert a { font-weight: 700; color: var(--nv-amber-ink) !important; white-space: nowrap; }
.nv-alert.is-red { background: var(--nv-red-soft); border-color: var(--nv-red-line); color: var(--nv-red-ink); }
.nv-alert.is-red a { color: var(--nv-red-ink) !important; }
.nv-alert.is-info { background: var(--nv-accent-soft); border-color: transparent; color: var(--nv-accent-ink); }
.nv-alert.is-good { background: var(--nv-good-bg); border-color: transparent; color: var(--nv-good-ink); }
.nv-alert.is-plain { background: var(--nv-surface); border-color: var(--nv-line); color: var(--nv-ink-2); }

/* -------------------------------------------------------------- pills */
.nv-pill { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: var(--nv-chip); color: var(--nv-ink-2); white-space: nowrap; line-height: 18px; }
.nv-pill.is-amber { background: var(--nv-amber-chip); color: var(--nv-amber-fg); }
.nv-pill.is-red { background: var(--nv-red); color: #fff; }
.nv-pill.is-red-soft { background: var(--nv-red-soft); color: var(--nv-red-ink); }
.nv-pill.is-green { background: var(--nv-good-bg); color: var(--nv-good-ink); }
.nv-pill.is-blue { background: var(--nv-accent-soft); color: var(--nv-accent-ink); }
.nv-pill.is-late { background: var(--nv-late-bg); color: var(--nv-late-fg); }
.nv-pill.is-ink { background: var(--nv-primary); color: var(--nv-on-primary); }
.nv-pill.is-outline { background: transparent; border: 1px solid var(--nv-line-2); color: var(--nv-ink-2); }
.nv-pill.is-lg { font-size: 13px; padding: 4px 10px; }
.nv-badge-new { font-size: 10px; font-weight: 800; letter-spacing: 0.06em; padding: 2px 6px; border-radius: 6px; background: var(--nv-red); color: #fff; }
.nv-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--nv-faint-2); flex-shrink: 0; }
.nv-dot.is-green { background: var(--nv-good-dot); } .nv-dot.is-blue { background: var(--nv-accent); }
.nv-dot.is-amber { background: var(--nv-warn-bar); } .nv-dot.is-red { background: var(--nv-red); }
.nv-dot.is-square { border-radius: 2px; background: var(--nv-store-pin); } .nv-dot.is-drop { background: var(--nv-drop-pin); }
.nv-legend { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--nv-muted); white-space: nowrap; }

/* time tile («7′») used in queues */
.nv-age { width: 46px; height: 36px; flex-shrink: 0; border-radius: 9px; background: var(--nv-chip); color: var(--nv-ink-2); display: inline-flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 700; }
.nv-age.is-late { background: var(--nv-late-bg); color: var(--nv-late-fg); }
.nv-age.is-warn { background: var(--nv-amber-chip); color: var(--nv-amber-fg); }

/* avatars */
.nv-avatar { position: relative; width: 34px; height: 34px; flex-shrink: 0; border-radius: 50%; background: var(--nv-chip); color: var(--nv-chip-ink); display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; }
.nv-avatar.is-36 { width: 36px; height: 36px; } .nv-avatar.is-44 { width: 44px; height: 44px; font-size: 14px; }
.nv-avatar.is-56 { width: 56px; height: 56px; font-size: 17px; } .nv-avatar.is-dark { background: #1F2533; color: #fff; }
.nv-avatar.is-square { border-radius: 10px; }
.nv-avatar .nv-status { position: absolute; right: -1px; bottom: -1px; width: 10px; height: 10px; border-radius: 50%; border: 2px solid var(--nv-surface); background: var(--nv-faint-2); }
.nv-status.is-green { background: var(--nv-good-dot) !important; } .nv-status.is-blue { background: var(--nv-accent) !important; } .nv-status.is-amber { background: var(--nv-warn-bar) !important; }
.nv-logo { width: 40px; height: 40px; flex-shrink: 0; border-radius: 11px; background: var(--nv-red); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 800; }

/* ------------------------------------------------------------- buttons */
.nv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 10px; border: 1px solid var(--nv-line-2); background: var(--nv-surface); color: var(--nv-ink) !important; font: inherit; font-family: var(--nv-font); font-size: 14px; font-weight: 700; cursor: pointer; white-space: nowrap; text-decoration: none !important; line-height: 1; }
.nv-btn:hover { background: var(--nv-hover); }
.nv-btn:disabled, .nv-btn[aria-disabled="true"] { opacity: 0.5; cursor: not-allowed; }
.nv-btn.is-red { background: var(--nv-red); border-color: var(--nv-red); color: #fff !important; }
.nv-btn.is-red:hover { background: var(--nv-red-hover); }
.nv-btn.is-ink { background: var(--nv-primary); border-color: var(--nv-primary); color: var(--nv-on-primary) !important; }
.nv-btn.is-ink:hover { opacity: 0.9; }
.nv-btn.is-warn { border-color: var(--nv-bad-line); color: var(--nv-bad-fg) !important; }
.nv-btn.is-ghost { background: transparent; border-color: transparent; }
.nv-btn.is-soft { background: var(--nv-surface-2); border-color: var(--nv-line); }
.nv-btn.is-sm { height: 32px; padding: 0 12px; font-size: 13px; font-weight: 600; border-radius: 8px; }
.nv-btn.is-md { height: 38px; padding: 0 14px; font-size: 13px; }
.nv-btn.is-lg { height: 44px; padding: 0 18px; border-radius: 11px; }
.nv-btn.is-xl { height: 52px; padding: 0 22px; border-radius: 12px; font-size: 16px; }
.nv-btn.is-block { width: 100%; }
.nv-btn.is-icon { width: 38px; padding: 0; }
.nv-kbd { font: inherit; font-size: 11px; padding: 2px 6px; border: 1px solid var(--nv-line); border-radius: 6px; color: var(--nv-muted); background: var(--nv-surface); }
.nv-btn .nv-kbd { background: transparent; border-color: rgba(255, 255, 255, 0.35); color: inherit; }

/* segmented control */
.nv-seg { display: inline-flex; padding: 3px; border-radius: 10px; background: var(--nv-sunken); border: 1px solid var(--nv-line); gap: 2px; }
.nv-seg > a, .nv-seg > button, .nv-seg > label { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: 7px; border: 0; background: transparent; font: inherit; font-family: var(--nv-font); font-size: 13px; font-weight: 600; color: var(--nv-muted) !important; cursor: pointer; white-space: nowrap; text-decoration: none !important; }
.nv-seg > .is-on, .nv-seg > [aria-pressed="true"], .nv-seg > [aria-selected="true"] { background: var(--nv-surface); color: var(--nv-ink) !important; box-shadow: 0 1px 2px rgba(20, 24, 33, 0.12); }
[data-theme="dark"] .nv-seg > .is-on, [data-theme="dark"] .nv-seg > [aria-pressed="true"] { background: #232A36; }
.nv-seg input { position: absolute; opacity: 0; pointer-events: none; }
.nv-seg.is-lg > a, .nv-seg.is-lg > button, .nv-seg.is-lg > label { height: 40px; padding: 0 16px; font-size: 14px; }

/* in-card sub-tabs (red underline) */
.nv-subtabs { display: flex; gap: 4px; padding: 10px 12px 0; border-bottom: 1px solid var(--nv-line-soft); overflow-x: auto; scrollbar-width: none; }
.nv-subtabs > a, .nv-subtabs > button { padding: 8px 10px 11px; font-size: 13px; font-weight: 500; color: var(--nv-muted) !important; border: 0; border-bottom: 3px solid transparent; background: none; font-family: var(--nv-font); white-space: nowrap; cursor: pointer; }
.nv-subtabs > .is-on { font-weight: 700; color: var(--nv-ink) !important; border-bottom-color: var(--nv-red); }

/* filter chips («Όλες 148 · Σε αναμονή 6 …») */
.nv-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.nv-chip { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--nv-line); background: var(--nv-surface); font-size: 13px; font-weight: 600; color: var(--nv-ink-2) !important; cursor: pointer; white-space: nowrap; font-family: var(--nv-font); }
.nv-chip b { font-weight: 700; color: var(--nv-muted); }
.nv-chip.is-on { background: var(--nv-primary); border-color: var(--nv-primary); color: var(--nv-on-primary) !important; }
.nv-chip.is-on b { color: inherit; opacity: 0.8; }
.nv-select-chip { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 10px 0 12px; border-radius: 10px; border: 1px solid var(--nv-line); background: var(--nv-surface); font-size: 13px; font-weight: 600; color: var(--nv-ink-2); font-family: var(--nv-font); }
.nv-select-chip select { border: 0; background: transparent; font: inherit; color: var(--nv-ink); font-weight: 700; outline: none; cursor: pointer; max-width: 200px; }

/* -------------------------------------------------------------- forms */
.nv-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.nv-field > span, .nv-label { font-size: 12px; font-weight: 600; color: var(--nv-muted); }
.nv-input, .nv-field input:not([type=checkbox]):not([type=radio]), .nv-field select, .nv-field textarea {
    height: 44px; width: 100%; box-sizing: border-box; padding: 0 12px; border: 1px solid var(--nv-line-2); border-radius: 10px;
    background: var(--nv-surface); color: var(--nv-ink); font: inherit; font-family: var(--nv-font); font-size: 15px; outline: none;
}
.nv-field textarea { height: auto; min-height: 76px; padding: 10px 12px; resize: vertical; }
.nv-input:focus, .nv-field input:focus, .nv-field select:focus, .nv-field textarea:focus { border-color: var(--nv-ink); box-shadow: 0 0 0 3px rgba(20, 24, 33, 0.08); }
.nv-input.is-sm { height: 38px; font-size: 14px; border-radius: 9px; }
.nv-input.is-strong, .nv-field .is-strong { font-weight: 700; }
.nv-field.is-ok input, .nv-input.is-ok { border-color: var(--nv-good-dot); }
.nv-field-hint { font-size: 12px; color: var(--nv-muted); }
.nv-field-hint.is-ok { color: var(--nv-good); font-weight: 600; }
.nv-field-hint.is-warn { color: var(--nv-warn); font-weight: 600; }
.nv-search { display: flex; align-items: center; gap: 10px; height: 40px; box-sizing: border-box; padding: 0 12px; border: 1px solid var(--nv-line-2); border-radius: 10px; background: var(--nv-surface); color: var(--nv-muted); }
.nv-search input { border: 0; outline: none; background: transparent; font: inherit; font-family: var(--nv-font); font-size: 14px; color: var(--nv-ink); flex: 1; min-width: 0; }
.nv-check { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; color: var(--nv-ink); cursor: pointer; }
.nv-check input { width: 18px; height: 18px; margin: 0; accent-color: var(--nv-primary); flex-shrink: 0; }

/* switch: <label class="nv-switch"><input type="checkbox" role="switch"><span></span></label> */
.nv-switch { position: relative; display: inline-flex; flex-shrink: 0; width: 40px; height: 24px; cursor: pointer; }
.nv-switch input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; z-index: 1; }
.nv-switch > span { position: absolute; inset: 0; border-radius: 999px; background: var(--nv-switch-off); transition: background 0.15s; }
.nv-switch > span::after { content: ''; position: absolute; left: 3px; top: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); transition: transform 0.15s; }
.nv-switch input:checked + span { background: var(--nv-primary); }
[data-theme="dark"] .nv-switch input:checked + span { background: var(--nv-red); }
.nv-switch input:checked + span::after { transform: translateX(16px); }
.nv-switch input:focus-visible + span { outline: 2px solid var(--nv-red); outline-offset: 2px; }

/* setting rows: label + help on the left, control on the right */
.nv-setting { display: flex; align-items: center; gap: 14px; padding: 10px 0; border-top: 1px solid var(--nv-row); }
.nv-setting:first-of-type { border-top: 0; }
.nv-setting-text { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; }
.nv-setting-text b { font-size: 14px; font-weight: 600; }
.nv-setting-text span { font-size: 12px; color: var(--nv-muted); }
.nv-setting-text span.nv-locked { color: var(--nv-warn); font-weight: 600; }
.nv-switch.is-locked { opacity: .5; cursor: not-allowed; }

/* option cards (radio as card) */
.nv-options { display: grid; gap: 10px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.nv-option { position: relative; padding: 12px 14px; border-radius: 12px; border: 1.5px solid var(--nv-line); background: var(--nv-surface); display: flex; flex-direction: column; gap: 3px; cursor: pointer; text-align: left; font-family: var(--nv-font); color: var(--nv-ink); }
.nv-option input { position: absolute; opacity: 0; pointer-events: none; }
.nv-option b { font-size: 14px; font-weight: 700; }
.nv-option span { font-size: 12px; color: var(--nv-muted); }
.nv-option.is-on, .nv-option:has(input:checked) { border-color: var(--nv-ink); background: var(--nv-sunken); }
.nv-option:focus-within { outline: 2px solid var(--nv-red); outline-offset: 2px; }

/* sticky save bar */
.nv-savebar { position: sticky; bottom: 0; z-index: 5; display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 10px 24px; background: var(--nv-surface); border-top: 1px solid var(--nv-line); margin: 0 -24px -32px; }

/* ------------------------------------------------------ lists & tables */
.nv-list-row { position: relative; display: flex; align-items: center; gap: 12px; padding: 10px 18px; border-bottom: 1px solid var(--nv-row); min-width: 0; color: var(--nv-ink) !important; }
.nv-list-row:last-child { border-bottom: 0; }
a.nv-list-row:hover, button.nv-list-row:hover, .nv-list-row.is-link:hover { background: var(--nv-surface-2); }
.nv-list-row.is-selected, .nv-list-row[aria-current="true"] { background: var(--nv-red-row); box-shadow: inset 3px 0 0 var(--nv-red); }
.nv-list-row.is-tall { padding: 12px 16px; }
button.nv-list-row { width: 100%; border: 0; border-bottom: 1px solid var(--nv-row); background: transparent; text-align: left; font: inherit; font-family: var(--nv-font); cursor: pointer; }
.nv-list-main { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-width: 0; }
.nv-list-main > b { font-size: 14px; font-weight: 600; }
.nv-list-main > span { font-size: 12px; color: var(--nv-muted); }
.nv-list-side { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; flex-shrink: 0; }

.nv-table { width: 100%; border-collapse: collapse; font-size: 14px; color: var(--nv-ink); }
.nv-table th { text-align: left; font-size: 12px; font-weight: 600; color: var(--nv-faint); padding: 10px 12px; border-bottom: 1px solid var(--nv-line-soft); white-space: nowrap; background: var(--nv-surface); position: sticky; top: 0; z-index: 1; }
.nv-table td { padding: 10px 12px; border-bottom: 1px solid var(--nv-row); vertical-align: middle; }
.nv-table tr:last-child td { border-bottom: 0; }
.nv-table tbody tr.is-link { cursor: pointer; }
.nv-table tbody tr.is-link:hover td { background: var(--nv-surface-2); }
.nv-table tbody tr.is-selected td { background: var(--nv-red-row); }
.nv-table tbody tr.is-selected td:first-child { box-shadow: inset 3px 0 0 var(--nv-red); }
.nv-table th.nv-num, .nv-table td.nv-num { text-align: right; }
.nv-table.is-compact td { padding: 7px 10px; } .nv-table.is-compact th { padding: 7px 10px; }
[data-density="compact"] .nv-table td { padding: 6px 10px; font-size: 13px; }
[data-density="compact"] .nv-list-row { padding-top: 7px; padding-bottom: 7px; }
.nv-table-wrap { overflow: auto; min-height: 0; }

/* progress bars */
.nv-bar { height: 8px; border-radius: 999px; background: var(--nv-track); overflow: hidden; flex: 1 1 auto; min-width: 40px; }
.nv-bar > i { display: block; height: 100%; border-radius: 999px; background: var(--nv-accent); }
.nv-bar.is-thin { height: 6px; }
.nv-bar > i.is-green { background: var(--nv-good-dot); } .nv-bar > i.is-amber { background: var(--nv-warn-bar); }
.nv-bar > i.is-gray { background: #6B7485; } .nv-bar > i.is-red { background: var(--nv-red); } .nv-bar > i.is-ink { background: var(--nv-primary); }

/* list + detail layout */
.nv-split { display: flex; gap: 16px; min-height: 0; align-items: stretch; }
.nv-split > .nv-split-list { flex: 0 0 380px; width: 380px; }
.nv-split > .nv-split-list.is-wide { flex-basis: 560px; width: 560px; }
.nv-split > .nv-split-list.is-narrow { flex-basis: 320px; width: 320px; }
.nv-split > .nv-split-detail { flex: 1 1 auto; min-width: 0; }
.nv-aside { flex: 0 0 340px; width: 340px; }
.nv-fixed-h { height: calc(100vh - 210px); min-height: 520px; }

/* settings-like left nav */
.nv-sidenav { display: flex; flex-direction: column; gap: 2px; flex: 0 0 250px; width: 250px; }
.nv-sidenav a { position: relative; display: flex; align-items: center; height: 36px; padding: 0 12px; border-radius: 9px; font-size: 14px; font-weight: 500; color: var(--nv-ink-2) !important; }
.nv-sidenav a span:first-child { flex: 1; }
.nv-sidenav a small { font-size: 12px; color: var(--nv-faint-2); }
.nv-sidenav a:hover { background: var(--nv-surface); }
.nv-sidenav a.is-on { font-weight: 700; color: var(--nv-ink) !important; background: var(--nv-surface); }
.nv-sidenav a.is-on::before { content: ''; position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px; border-radius: 0 3px 3px 0; background: var(--nv-red); }

/* stat lines («Κρατούσε … €398,20») */
.nv-lines { display: flex; flex-direction: column; gap: 6px; padding: 12px; border-radius: 10px; background: var(--nv-sunken); font-size: 14px; }
.nv-lines > div { display: flex; gap: 8px; }
.nv-lines > div > span:first-child { flex: 1; color: var(--nv-ink-2); }
.nv-lines > div.is-total { font-weight: 800; }
.nv-lines > div.is-total > span:first-child { color: var(--nv-ink); }
.nv-kv { display: flex; align-items: center; gap: 10px; font-size: 14px; padding: 2px 0; }
.nv-kv > span:first-child { flex: 1; color: var(--nv-ink-2); }
.nv-kv > b { font-weight: 700; }

/* timeline (order detail, stops) */
.nv-timeline { display: flex; flex-direction: column; gap: 0; }
.nv-tl-item { position: relative; display: flex; gap: 12px; padding: 0 0 14px 0; }
.nv-tl-item::before { content: ''; position: absolute; left: 6px; top: 16px; bottom: 0; width: 2px; background: var(--nv-line); }
.nv-tl-item:last-child::before { display: none; }
.nv-tl-dot { width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--nv-line-2); background: var(--nv-surface); flex-shrink: 0; margin-top: 2px; }
.nv-tl-item.is-done .nv-tl-dot { background: var(--nv-good-dot); border-color: var(--nv-good-dot); }
.nv-tl-item.is-now .nv-tl-dot { background: var(--nv-red); border-color: var(--nv-red); box-shadow: 0 0 0 4px var(--nv-red-soft); }
.nv-tl-body { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.nv-tl-body b { font-size: 14px; font-weight: 600; }
.nv-tl-body span { font-size: 12px; color: var(--nv-muted); }

/* ------------------------------------------------------------- charts */
.nv-bars { display: flex; align-items: flex-end; gap: 8px; border-bottom: 1px solid var(--nv-line); flex: 1 1 auto; min-height: 120px; padding-top: 6px; }
.nv-bars > div { flex: 1 1 0; display: flex; flex-direction: column; justify-content: flex-end; align-items: stretch; height: 100%; gap: 4px; min-width: 0; }
.nv-bars > div > span { font-size: 11px; font-weight: 600; color: var(--nv-muted); text-align: center; }
.nv-bars > div > i { display: block; border-radius: 5px 5px 0 0; background: var(--nv-accent); opacity: 0.55; min-height: 2px; }
.nv-bars > div > i.is-now { opacity: 1; }
.nv-bars > div > i.is-forecast { background: transparent; opacity: 1; border: 1.5px dashed #8C96A8; }
.nv-bars-x { display: flex; gap: 8px; }
.nv-bars-x > span { flex: 1 1 0; text-align: center; font-size: 11px; color: var(--nv-muted); min-width: 0; }
.nv-bars-x > span.is-now { color: var(--nv-accent); font-weight: 700; }
.nv-heat { display: flex; flex-direction: column; gap: 4px; flex: 1 1 auto; }
.nv-heat-row { display: flex; align-items: center; gap: 4px; flex: 1 1 auto; }
.nv-heat-row > span { width: 30px; font-size: 11px; color: var(--nv-muted); flex-shrink: 0; }
.nv-heat-row > i { flex: 1 1 0; min-height: 22px; align-self: stretch; border-radius: 4px; background: var(--nv-accent); display: flex; align-items: center; justify-content: center; font-style: normal; font-size: 11px; font-weight: 700; color: var(--nv-ink); }
.nv-spark { flex-shrink: 0; }

/* ----------------------------------------------------------------- map */
.nv-map { position: relative; background: var(--nv-map); overflow: hidden; min-height: 200px; }
.nv-map.is-rounded { border-radius: 16px; border: 1px solid var(--nv-line); }
.nv-map > .leaflet-container, .nv-map > .nv-map-canvas { position: absolute; inset: 0; background: var(--nv-map); }
.nv-map-chips { position: absolute; left: 14px; bottom: 14px; z-index: 500; display: flex; gap: 8px; flex-wrap: wrap; pointer-events: none; }
.nv-map-chips.is-top { top: 14px; bottom: auto; flex-direction: column; align-items: flex-start; }
.nv-map-chip { padding: 6px 10px; border-radius: 8px; background: var(--nv-surface); border: 1px solid var(--nv-line); font-size: 12px; font-weight: 600; color: var(--nv-ink); display: inline-flex; align-items: center; gap: 8px; pointer-events: auto; }
.nv-map-chip.is-warn { color: var(--nv-amber-fg); }
.nv-map-chip.is-red { border-color: var(--nv-red-line); font-weight: 700; }
[data-theme="dark"] .leaflet-tile-pane { filter: invert(0.92) hue-rotate(180deg) brightness(0.9) contrast(0.9); }
.nv-pin { width: 16px; height: 16px; border-radius: 50%; background: var(--nv-accent); border: 3px solid #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3); }
.nv-pin.is-store { border-radius: 3px; background: var(--nv-store-pin); width: 14px; height: 14px; border-width: 2px; }
.nv-pin.is-drop { background: var(--nv-drop-pin); width: 14px; height: 14px; border-width: 2px; }
.nv-pin.is-idle { background: #9AA3B2; }
.nv-pin.is-red { background: var(--nv-red); }

/* --------------------------------------------------------- page header
   Pages whose design carries its own header (Αναλύσεις: crumb + big title +
   period switch + Excel) render it with this, under the shell's tab strip. */
.nv-pagehead { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.nv-pagehead-title { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-width: 0; }
.nv-pagehead-title span { font-size: 12px; color: var(--nv-muted); }
.nv-pagehead-title h1 { font-size: 24px; font-weight: 700; letter-spacing: -0.01em; }

/* toast */
.nv-toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 3000; padding: 12px 18px; border-radius: 12px; background: var(--nv-primary); color: var(--nv-on-primary); font-size: 14px; font-weight: 600; box-shadow: var(--nv-shadow); display: none; max-width: calc(100vw - 32px); }
.nv-toast.is-open { display: block; }
.nv-toast.is-bad { background: var(--nv-red); color: #fff; }

/* modal (light-weight, no bootstrap dependency) */
.nv-modal-back { position: fixed; inset: 0; z-index: 2500; display: none; align-items: center; justify-content: center; padding: 16px; background: rgba(13, 16, 21, 0.5); }
.nv-modal-back.is-open { display: flex; }
.nv-modal { width: 520px; max-width: 100%; max-height: calc(100vh - 32px); overflow: auto; background: var(--nv-surface); border-radius: 16px; box-shadow: var(--nv-shadow); display: flex; flex-direction: column; }
.nv-modal-head { display: flex; align-items: center; gap: 10px; padding: 16px 20px; border-bottom: 1px solid var(--nv-line-soft); }
.nv-modal-head h2 { flex: 1; font-size: 17px; font-weight: 700; }
.nv-modal-body { padding: 16px 20px; display: flex; flex-direction: column; gap: 12px; }
.nv-modal-foot { padding: 14px 20px; border-top: 1px solid var(--nv-line-soft); display: flex; gap: 10px; justify-content: flex-end; }

/* ------------------------------------------------------------ responsive */
@media (max-width: 1199px) {
    .nv-grid-5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .nv-grid-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .nv-split > .nv-split-list, .nv-split > .nv-split-list.is-wide { flex-basis: 320px; width: 320px; }
    .nv-aside { flex-basis: 300px; width: 300px; }
}
@media (max-width: 991px) {
    .nv-grid-2, .nv-grid-3, .nv-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .nv-grid-5, .nv-grid-6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .nv-split, .nv-stack-md { flex-direction: column; }
    .nv-split > .nv-split-list, .nv-split > .nv-split-list.is-wide, .nv-split > .nv-split-list.is-narrow, .nv-aside, .nv-sidenav { flex-basis: auto; width: 100%; }
    .nv-fixed-h { height: auto; min-height: 0; }
    .nv-options { grid-template-columns: 1fr; }
    .nv-savebar { margin: 0 -12px -24px; padding: 10px 12px; }
    .nv-hide-md { display: none !important; }
    .nv-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
@media (max-width: 600px) {
    .nv-grid-2, .nv-grid-3, .nv-grid-4 { grid-template-columns: 1fr; }
    .nv-grid-5, .nv-grid-6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .nv-kpi-value b { font-size: 24px; }
    .nv-hide-sm { display: none !important; }
    .nv-card-head { padding: 12px 14px; }
    .nv-list-row { padding: 10px 14px; }
    .nv-pagehead-title h1 { font-size: 20px; }
    .nv-btn.is-lg, .nv-btn.is-xl { width: 100%; }
    .nv-row.nv-stack-sm { flex-direction: column; align-items: stretch; }
}
@media (min-width: 992px) { .nv-show-md { display: none !important; } }
@media (min-width: 601px) { .nv-show-sm { display: none !important; } }

/* ── ops ── (Λειτουργία, Τρόπος ανάθεσης, Ιστορικό αναθέσεων) */
:root, [data-theme="light"] {
    --nv-m-manual-bg: #FFF4EA; --nv-m-manual-fg: #7A3A06; --nv-m-manual-line: #F6DCC2;
    --nv-m-hybrid-bg: #EEF2FF; --nv-m-hybrid-fg: #24357F; --nv-m-hybrid-line: #D8DFFB; --nv-m-hybrid-sub: #3D4C8F; --nv-m-hybrid-track: #D3DBFB;
    --nv-m-open-bg: #ECF8F1; --nv-m-open-fg: #14532D; --nv-m-open-line: #CDEBD9;
    --nv-m-suggest-bg: #EEF7FC; --nv-m-suggest-fg: #0C4A6E; --nv-m-suggest-line: #CFE6F4;
    --nv-m-suggest-card: #F0F9FF; --nv-m-suggest-sub: #245C80; --nv-m-suggest-track: #CDE7F7; --nv-m-suggest-bar: #0369A1;
    --nv-m-full-bg: #F4F1FD; --nv-m-full-fg: #3B1F7A; --nv-m-full-line: #E1D9F8;
    --nv-m-shadow-bg: #F3F4F6; --nv-m-shadow-fg: #27272A; --nv-m-shadow-line: #E4E4E7;
    --nv-req-bg: #F3E8FF; --nv-req-fg: #6B21A8;
    --nv-warn-note-bg: #FDECE3; --nv-warn-note-fg: #8A2E0A;
    --nv-seg-bg: #F1F3F6;
    --nv-drop-bg: #F5F7FF; --nv-drop-line: #BAC4E8; --nv-drop-fg: #3D4C8F;
    --nv-cand-bg: #F5F7FF; --nv-cand-line: #C9D3FA; --nv-load-full: #C2410C; --nv-load-off: #E6E9EF;
    --nv-radio-off: #B8BFCC;
    --nv-by-auto: #6B7485; --nv-by-appr: #B9C1CE;
}
[data-theme="dark"] {
    --nv-m-manual-bg: #2B1E12; --nv-m-manual-fg: #F5C48F; --nv-m-manual-line: #4A3320;
    --nv-m-hybrid-bg: #1C2340; --nv-m-hybrid-fg: #B7C4FF; --nv-m-hybrid-line: #2C3766; --nv-m-hybrid-sub: #98A7E8; --nv-m-hybrid-track: #2C3766;
    --nv-m-open-bg: #14291D; --nv-m-open-fg: #8FDCAE; --nv-m-open-line: #1F4630;
    --nv-m-suggest-bg: #122634; --nv-m-suggest-fg: #9AD2F2; --nv-m-suggest-line: #1E3D52;
    --nv-m-suggest-card: #122634; --nv-m-suggest-sub: #8BBEDB; --nv-m-suggest-track: #1E3D52; --nv-m-suggest-bar: #4DB3EA;
    --nv-m-full-bg: #231C3A; --nv-m-full-fg: #CDBDFA; --nv-m-full-line: #372C5E;
    --nv-m-shadow-bg: #1E232B; --nv-m-shadow-fg: #D5DAE3; --nv-m-shadow-line: #2A3240;
    --nv-req-bg: #2E1D42; --nv-req-fg: #D9B6FF;
    --nv-warn-note-bg: #3A1D14; --nv-warn-note-fg: #FF9E86;
    --nv-seg-bg: #0D1015;
    --nv-drop-bg: #1A2036; --nv-drop-line: #3A4880; --nv-drop-fg: #B7C4FF;
    --nv-cand-bg: #1A2036; --nv-cand-line: #3A4880; --nv-load-full: #F29A6B; --nv-load-off: #2A3240;
    --nv-radio-off: #4A5363;
    --nv-by-auto: #97A1B2; --nv-by-appr: #4A5363;

/* ── money ── (Χρήματα + Αναλύσεις pages) */
/* Αναλύσεις page header: period switch + «Εύρος…» pop-over form */
.nva-head { position: relative; }
.nva-periods > a, .nva-periods > button { height: 32px; }
.nva-export { margin: 0; }
.nva-export .nv-btn, a.nva-export { gap: 8px; font-weight: 600; }
.nva-range { position: absolute; right: 0; top: calc(100% + 8px); z-index: 20; display: flex; align-items: flex-end; gap: 10px; padding: 14px; box-shadow: var(--nv-shadow); }
.nva-range[hidden] { display: none; }
.nva-range .nv-field input { height: 40px; font-size: 14px; }
/* big figure KPI («€2.940,50», «93%») */
.nv-kpi-big { font-size: 28px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.15; color: var(--nv-ink); }
.nv-kpi-big.is-amber { color: var(--nv-amber-fg); }
.nv-kpi-big.is-bad { color: var(--nv-bad-fg); }
.nv-kpi-big.is-good { color: var(--nv-good-ink); }
.nv-kpi-sub { font-size: 12px; color: var(--nv-muted); }
@media (max-width: 600px) {
    .nva-head { gap: 10px; }
    .nva-periods { width: 100%; overflow-x: auto; }
    .nva-periods > a, .nva-periods > button { flex: 1 0 auto; justify-content: center; height: 40px; }
    .nva-range { left: 0; right: 0; flex-wrap: wrap; }
    .nva-range .nv-field { flex: 1 1 120px; }
    .nv-kpi-big { font-size: 22px; }
}

/* ── system ── */
/* The classic core styles paint every [class*="card"] #1e293b in the dark theme
   (0,2,0). Same specificity, loaded later: Nova cards keep their surface; a
   page's own state borders (.x-card.is-warn, in extrastyles, later still) win. */
[data-theme="dark"] :where(.nv-page) [class*="card"] { background-color: var(--nv-surface); border-color: var(--nv-line); }
/* nova.css gives every dark input the field colour; inside a search pill the
   input must stay transparent or it shows as a box within the box. */
[data-theme="dark"] body.nova .main-content .nv-search input:not([type=checkbox]):not([type=radio]):not([type=range]) { background: transparent !important; border-color: transparent !important; }
