/* ══════════════════════════════════════════════════════════════
   SND POS — GLOBAL ENTERPRISE DESIGN SYSTEM
   Single source of truth for colour, type and core components.

   Every page and every role shares this palette. Roles are told
   apart by icons, badges and labels — never by re-theming.

   Do not hardcode brand colours in a view. Use these tokens.
   ══════════════════════════════════════════════════════════════ */

:root{
    /* ── Brand ── */
    --primary:#0D47A1;          /* primary buttons, nav, active sidebar, links, section headers */
    --primary-hover:#0B3C8A;
    --secondary:#1565C0;        /* hover states, secondary buttons, progress bars, highlights */
    --accent:#FFC107;           /* premium badges, best-value, notifications, CTA accents */
    --accent-strong:#B7860B;    /* accent text on white — #FFC107 is too light to read */

    /* ── Neutrals ── */
    --dark:#1F2937;             /* titles, sidebar text, main headings */
    --muted:#64748B;            /* secondary text, descriptions, labels */
    --border:#E5E7EB;           /* card borders, input borders, dividers */
    --bg:#F8FAFC;               /* application background */
    --white:#FFFFFF;            /* cards, forms, tables, popups, modals */

    /* ── Status ── */
    --success:#22C55E;
    --warning:#F59E0B;
    --error:#EF4444;
    --info:#3B82F6;

    /* Soft status fills for badges and alert backgrounds */
    --success-soft:#DCFCE7;
    --warning-soft:#FEF3C7;
    --error-soft:#FEE2E2;
    --info-soft:#DBEAFE;
    --primary-soft:#E8F0FF;
    --accent-soft:#FFF8E5;

    /* ── Charts — fixed order, no random colours ── */
    --chart-1:#0D47A1;
    --chart-2:#1565C0;
    --chart-3:#FFC107;
    --chart-4:#60A5FA;
    --chart-5:#22C55E;
    --chart-6:#EF4444;

    /* ── Type ── */
    --font-heading:'Plus Jakarta Sans','Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
    --font-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;

    /* ── Shape & depth ── */
    --radius-card:18px;
    --radius-lg:14px;
    --radius:10px;
    --radius-sm:8px;
    --shadow-sm:0 1px 2px rgba(16,24,40,.05);
    --shadow:0 4px 16px rgba(16,24,40,.07);
    --shadow-lg:0 18px 44px rgba(13,71,161,.12);

    /* Legacy aliases — older views referenced these names. */
    --blue:var(--primary);
    --blue-600:var(--secondary);
    --blue-800:#0A2A5E;
    --yellow:var(--accent);
    --gold:var(--accent-strong);
    --ink:var(--dark);
    --line:var(--border);
    --tint:var(--primary-soft);
    --surface:var(--bg);
    --ok:var(--success);
    --danger:var(--error);
    --brand-font:var(--font-body);
    --brew:var(--primary);
    --side:var(--white);
}

/* ── Typography ─────────────────────────────────────────────── */
body{font-family:var(--font-body);color:var(--dark);background:var(--bg);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{font-family:var(--font-heading);color:var(--dark);font-weight:700;letter-spacing:-.015em}
.text-muted,.text-secondary{color:var(--muted)!important}
a{color:var(--primary);text-decoration:none}
a:hover{color:var(--secondary)}
.btn{font-family:var(--font-body);font-weight:600}

/* ── Wordmark ───────────────────────────────────────────────── */
.snd-wordmark{font-family:var(--font-heading);font-weight:800;letter-spacing:-.02em;line-height:1;color:var(--primary);white-space:nowrap}
.snd-wordmark em{font-style:normal;color:var(--dark)}
.snd-wordmark.on-dark{color:var(--white)}
.snd-wordmark.on-dark em{color:var(--accent)}
.snd-edition{text-transform:uppercase;letter-spacing:.34em;font-weight:700;color:var(--primary)}
.snd-edition.on-dark{color:var(--accent)}

/* ── Buttons ────────────────────────────────────────────────── */
.btn-primary,.btn-brand{background:var(--primary);border-color:var(--primary);color:var(--white)}
.btn-primary:hover,.btn-brand:hover,.btn-primary:focus,.btn-check:checked+.btn-primary{background:var(--primary-hover);border-color:var(--primary-hover);color:var(--white)}
.btn-secondary{background:var(--secondary);border-color:var(--secondary);color:var(--white)}
.btn-secondary:hover{background:var(--primary);border-color:var(--primary);color:var(--white)}
.btn-outline-primary,.btn-outline-brand{background:var(--white);border:1.5px solid var(--primary);color:var(--primary)}
.btn-outline-primary:hover,.btn-outline-brand:hover{background:var(--primary);border-color:var(--primary);color:var(--white)}
.btn-success{background:var(--success);border-color:var(--success);color:var(--white)}
.btn-warning{background:var(--accent);border-color:var(--accent);color:var(--dark)}
.btn-danger{background:var(--error);border-color:var(--error);color:var(--white)}
.btn-info{background:var(--info);border-color:var(--info);color:var(--white)}
.btn-light{background:var(--white);border-color:var(--border);color:var(--dark)}
.btn-link{color:var(--primary)}

/* ── Forms ──────────────────────────────────────────────────── */
.form-control,.form-select{border-color:var(--border);border-radius:var(--radius);color:var(--dark)}
.form-control:focus,.form-select:focus{border-color:var(--primary);box-shadow:0 0 0 .2rem rgba(13,71,161,.12)}
.form-label{color:var(--dark);font-weight:600}
.form-check-input:checked{background-color:var(--primary);border-color:var(--primary)}
.input-group-text{background:var(--white);border-color:var(--border);color:var(--primary)}

/* ── Cards ──────────────────────────────────────────────────── */
.card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-card);box-shadow:var(--shadow-sm)}
.card-header{background:var(--white);border-bottom:1px solid var(--border);font-family:var(--font-heading);font-weight:700;color:var(--dark)}
.card .fa,.card .fas,.card .fa-solid,.card .far{color:var(--primary)}

/* ── Tables ─────────────────────────────────────────────────── */
.table{--bs-table-color:var(--dark);--bs-table-border-color:var(--border);margin-bottom:0}
.table>thead th,.table-light>th,thead.table-light th{background:var(--primary-soft);color:var(--primary);font-family:var(--font-heading);font-weight:700;font-size:.82rem;letter-spacing:.02em;border-bottom:1px solid var(--border)}
.table>tbody>tr:hover>td{background:var(--bg)}

/* ── Badges ─────────────────────────────────────────────────── */
.badge.bg-primary{background:var(--primary)!important}
.badge.bg-secondary{background:var(--muted)!important}
.badge.bg-success{background:var(--success)!important}
.badge.bg-warning{background:var(--accent)!important;color:var(--dark)!important}
.badge.bg-danger{background:var(--error)!important}
.badge.bg-info{background:var(--info)!important}
.badge-premium{background:var(--accent);color:var(--dark);font-weight:700}
.badge-role{background:var(--primary-soft);color:var(--primary);font-weight:700}

/* ── Alerts ─────────────────────────────────────────────────── */
.alert-success{background:var(--success-soft);border-color:transparent;color:#166534}
.alert-warning{background:var(--warning-soft);border-color:transparent;color:#92400E}
.alert-danger{background:var(--error-soft);border-color:transparent;color:#991B1B}
.alert-info,.alert-primary{background:var(--info-soft);border-color:transparent;color:var(--primary)}

/* ── Sidebar ────────────────────────────────────────────────── */
/* White background, blue active row, light-blue hover, dark-gray inactive. */
.sidebar,.side-nav{background:var(--white);border-right:1px solid var(--border)}
.sidebar a,.side-nav a,.sidebar .nav-link{color:var(--dark);border-radius:var(--radius)}
.sidebar a:hover,.side-nav a:hover,.sidebar .nav-link:hover{background:var(--primary-soft);color:var(--primary)}
.sidebar a.active,.side-nav a.active,.sidebar .nav-link.active{background:var(--primary);color:var(--white)}
.sidebar a.active i,.side-nav a.active i,.sidebar .nav-link.active i{color:var(--white)}

/* ── Misc ───────────────────────────────────────────────────── */
.progress{background:var(--border)}
.progress-bar{background:var(--secondary)}
hr{border-color:var(--border);opacity:1}
::selection{background:rgba(13,71,161,.16)}