/*
 * FL2 (styl D) - tokeny dla panelu gracza i stron WWW.
 * Zrodlo: fivem/ui/showcase themes D + paleta p1; lustro fivem/ui/public/fl2-tokens.css.
 * Publikacja: cdn.fivelife.pl/brand/fl2-tokens.css
 */

:root {
  --fl-font-body: "Inter", system-ui, sans-serif;
  --fl-font-display: var(--fl-font-body);
  --fl-font-num: var(--fl-font-body);
  --fl-display-spacing: -0.01em;

  --fl-r-ctrl: 10px;
  --fl-r-surface: 16px;
  --fl-r-window: 16px;
  --fl-r-panel: 16px;
  --fl-r-pill: 999px;

  --fl-acc-rgb: 94, 234, 212;
  --fl-acc2-rgb: 94, 234, 212;
  --fl-accent: rgb(var(--fl-acc-rgb));
  --fl-accent-2: rgb(var(--fl-acc2-rgb));
  --fl-accent-soft: rgba(var(--fl-acc-rgb), 0.16);
  --fl-accent-contrast: #0b0b0d;
  --fl-text: #f4f4f5;
  --fl-muted: #9a9aa3;
  --fl-line: rgba(255, 255, 255, 0.08);
  --fl-line-strong: rgba(255, 255, 255, 0.24);
  --fl-surface-bg: rgba(14, 14, 17, 0.82);
  --fl-tile-bg: rgba(255, 255, 255, 0.035);
  --fl-tile-bg-active: rgba(var(--fl-acc-rgb), 0.08);
  --fl-input-bg: rgba(255, 255, 255, 0.04);
  --fl-track: rgba(255, 255, 255, 0.08);
  --fl-btn-bg: rgb(var(--fl-acc-rgb));
  --fl-key-bg: #f4f4f5;
  --fl-key-depth: #a1a1aa;
  --fl-key-text: #0b0b0d;
  --fl-ok: #86efac;
  --fl-warn: #fde68a;
  --fl-bad: #fca5a5;

  --fl-domain-bank: #22c55e;
  --fl-domain-gov: #3b82f6;
  --fl-domain-shop: #f59e0b;
  --fl-domain-police: #60a5fa;
  --fl-domain-job: #f97316;
  --fl-domain-illegal: #ef4444;

  --fl-surface: var(--fl-surface-bg);
  --fl-surface-solid: #0e0e11;
  --fl-surface-elev: rgba(28, 28, 33, 0.92);
  --fl-page-bg: #09090b;
  --fl-border: var(--fl-line);
  --fl-border-strong: var(--fl-line-strong);
  --fl-window-shadow: 0 16px 48px rgba(0, 0, 0, 0.5);
  --fl-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
  --fl-scroll-thumb: rgba(255, 255, 255, 0.18);
  --fl-scroll-thumb-hover: rgba(255, 255, 255, 0.32);

  --fl-dur-fast: 120ms;
  --fl-dur: 200ms;
  --fl-dur-slow: 320ms;
  --fl-ease: cubic-bezier(0.22, 1, 0.36, 1);
}