/**
 * Brand bridge — Canva Up Above SSOT → theme.css / admin-theme.css consumers
 *
 * DECISION-1: --brand-consumer-accent (Canva teal) + --brand-admin-* (neutral charcoal)
 * Admin chrome is black / white / grey only — consumer apps keep Canva teal.
 * Import before theme.css or admin-theme.css once MFE-v3-S-01 wires consumers.
 *
 * @see rpappp/up-backend/docs/FRONTEND/brand-palette.md
 * @source https://www.canva.com/colors/color-palettes/up-above/
 */
:root {
  /* Typography families — shared SSOT (admin also mirrors in design-tokens.css) */
  --font-family-primary: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
    'Segoe UI Symbol', 'Noto Color Emoji';
  --font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono',
    'Courier New', monospace;

  /* ── Foundation + neutrals (ADR-FE-BRAND-002 / COLOR registry) — consumer Canva ── */
  --color-brand-primary: #1f6f78;
  --color-brand-deep: #174b52;
  --color-brand-accent: #58a9b5;
  --color-brand-soft: #eef6f7;
  --color-brand-text: #2a3136;
  --color-brand-limestone: #d8d2c8;
  --color-surface-default: #ffffff;
  --color-neutral-950: #0f172a;
  --color-neutral-100: #f1f5f9;
  --color-neutral-200: #e2e8f0;

  /* ── Semantic brand accents ── */
  --brand-consumer-accent: var(--color-brand-primary);
  --brand-consumer-accent-soft: var(--color-brand-soft);
  --brand-consumer-accent-foreground: var(--color-surface-default);
  /* Admin — charcoal / near-black (not consumer teal, not violet) */
  --brand-admin-accent: #171717;
  --brand-admin-primary: #18181b;

  /* ── Admin rail palette — near-black charcoal ── */
  --brand-rail-sidebar-bg: #0a0a0a;
  --brand-rail-sidebar-bg-deep: #000000;
  --brand-rail-sidebar-text: #fafafa;
  --brand-rail-sidebar-muted: #a3a3a3;
  --brand-rail-sidebar-active: var(--brand-admin-accent);
  --brand-rail-sidebar-hover: rgba(255, 255, 255, 0.08);
  --brand-rail-page-bg: var(--color-neutral-100);
  --brand-rail-card-border: var(--color-neutral-200);
  --brand-rail-kpi-up: #05805a;
  --brand-rail-kpi-down: #da2325;

  /* ── Bridge → theme.css (consumer / kiosk / pickup) — wired in MFE-v3-S-01 ── */
  --color-accent: var(--brand-consumer-accent);
  --color-focus-ring: var(--brand-consumer-accent);

  /* ── Bridge → admin-theme.css — wired in MFE-v3-S-01 ── */
  --color-rail-sidebar-bg: var(--brand-rail-sidebar-bg);
  --color-rail-sidebar-text: var(--brand-rail-sidebar-text);
  --color-rail-sidebar-muted: var(--brand-rail-sidebar-muted);
  --color-rail-sidebar-active: var(--brand-rail-sidebar-active);
  --color-rail-sidebar-hover: var(--brand-rail-sidebar-hover);
  --color-rail-page-bg: var(--brand-rail-page-bg);
  --color-rail-card-border: var(--brand-rail-card-border);
  --color-rail-kpi-up: var(--brand-rail-kpi-up);
  --color-rail-kpi-down: var(--brand-rail-kpi-down);
  --color-an-chart-1: var(--brand-admin-primary);
}