/* ==========================================================================
   QuoteServer design tokens
   Brand: Altarius ETI — deep petrol #002C36 + lime #B4FA32 (shared with AXIS
   and CrystalNAV). Palette colours come from MudBlazor
   (Theme/QuoteServerTheme.cs) through the --mud-palette-* variables, so
   light/dark mode switch automatically. Only values MudBlazor does not
   expose are defined here.
   ========================================================================== */

:root {
    /* Brand constants (identical in both modes) */
    --qs-brand-petrol: #002C36;
    --qs-brand-petrol-700: #0E4552;
    --qs-brand-petrol-600: #1E6B78;
    --qs-brand-lime: #B4FA32;

    /* Semantic aliases */
    --qs-bg: var(--mud-palette-background);
    --qs-surface: var(--mud-palette-surface);
    --qs-surface-muted: var(--mud-palette-background-gray);
    --qs-text: var(--mud-palette-text-primary);
    --qs-text-muted: var(--mud-palette-text-secondary);
    --qs-border: var(--mud-palette-lines-default);
    --qs-border-strong: var(--mud-palette-lines-inputs);
    --qs-primary: var(--mud-palette-primary);
    --qs-focus-ring: 0 0 0 3px rgba(30, 107, 120, 0.35);

    /* Typography */
    --qs-font: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --qs-font-mono: "IBM Plex Mono", "Cascadia Mono", Consolas, monospace;

    /* Spacing scale (4px base) */
    --qs-space-1: 4px;
    --qs-space-2: 8px;
    --qs-space-3: 12px;
    --qs-space-4: 16px;
    --qs-space-5: 20px;
    --qs-space-6: 24px;
    --qs-space-8: 32px;

    /* Radius */
    --qs-radius-sm: 4px;
    --qs-radius: 6px;
    --qs-radius-lg: 10px;

    /* Motion */
    --qs-ease: cubic-bezier(0.2, 0, 0, 1);
    --qs-duration: 160ms;

    /* Status tints (backgrounds for rows, badges) */
    --qs-tint-success: rgba(30, 122, 70, 0.10);
    --qs-tint-warning: rgba(179, 92, 0, 0.10);
    --qs-tint-error: rgba(180, 35, 24, 0.08);
    --qs-tint-info: rgba(29, 95, 168, 0.08);
    --qs-tint-brand: rgba(0, 44, 54, 0.06);

    /* Charts (read by js/dateLineChart.js at render time) */
    --qs-chart-line: #1E6B78;
    --qs-chart-fill: rgba(30, 107, 120, 0.10);
    --qs-chart-grid: rgba(15, 30, 35, 0.08);
    --qs-chart-text: #4A5A60;

    /* Log console (always dark, like a terminal) */
    --qs-console-bg: #061014;
    --qs-console-text: #D5E0E3;
    --qs-console-muted: #7F9399;
}

/* Dark-mode overrides. MainLayout adds .qs-dark to the root wrapper that
   also contains the MudBlazor dialog/popover providers. */
.qs-dark {
    --qs-focus-ring: 0 0 0 3px rgba(180, 250, 50, 0.35);

    --qs-tint-success: rgba(76, 195, 138, 0.14);
    --qs-tint-warning: rgba(240, 163, 58, 0.14);
    --qs-tint-error: rgba(242, 104, 92, 0.14);
    --qs-tint-info: rgba(91, 163, 240, 0.14);
    --qs-tint-brand: rgba(180, 250, 50, 0.08);

    --qs-chart-line: #B4FA32;
    --qs-chart-fill: rgba(180, 250, 50, 0.08);
    --qs-chart-grid: rgba(230, 237, 239, 0.08);
    --qs-chart-text: #9FB0B6;

    --qs-console-bg: #030A0D;
}
