/* SLM.ThemeV2.css
   Global V2 theme tokens.

   This file defines the V2 variables used by the V2 menu styling and provides
   a mapping into existing SLM component variables where appropriate.

   NOTE:
   - Light theme is the default.
   - Dark theme overrides follow the existing body theme class.
*/

:root {
    --v2-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;

    /* Data-first sizing */
    --v2-data-font-size: 1.05rem;
    --v2-label-scale: 0.78;
    --v2-label-font-size: calc(var(--v2-data-font-size) * var(--v2-label-scale));

    /* Light defaults */
    --v2-page-bg: #ffffff;
    --v2-panel-bg: #ffffff;
    --v2-text: #0f172a;
    --v2-text-muted: #475569;

    --v2-border: #94a3b8;
    --v2-border-strong: #334155;

    --v2-accent: #2563eb;
    --v2-danger: #b91c1c;

    /* Labels: visible for onboarding, but visually subordinate to values */
    --v2-label-color: #7a0000;
}

/* Dark theme override: aligns with existing Theme.ToCssClass() usage */
body.slm-theme-dark {
    --v2-page-bg: #0b1220;
    --v2-panel-bg: #0f172a;
    --v2-text: #e5e7eb;
    --v2-text-muted: #94a3b8;

    --v2-border: #475569;
    --v2-border-strong: #cbd5e1;

    --v2-accent: #60a5fa;
    --v2-danger: #fca5a5;

    /* Dark-theme label: reduce glare while keeping distinct hue */
    --v2-label-color: #ffb4b4;
}

/* Map V2 tokens into existing SLM component variables */
:root {
    --slm-color-text-primary: var(--v2-text);
    --slm-color-text-muted: var(--v2-text-muted);
    --slm-color-accent: var(--v2-accent);
    --slm-color-error: var(--v2-danger);

    --slm-field-wrapper-bg: var(--v2-panel-bg);
    --slm-field-input-bg: transparent;

    --slm-field-wrapper-border: var(--v2-border);
    --slm-field-wrapper-border-focus: var(--v2-accent);

    /* Last assignment wins; this is intentional */
    --slm-label-color: var(--v2-label-color);
    --slm-label-font-size: var(--v2-label-font-size);
}