/*
 * WINLEX – variabilele de stil comune (design tokens)
 * Folosite de site, administrare, /apps, /ai și de aplicațiile WINLEX, ca toate să arate la fel.
 * Public la: https://www.winlex.ro/assets/winlex-tokens.css
 *
 * Fișierul conține doar declarații de variabile. Modul întunecat se aplică:
 *  - cu clasa „t-dark” pe <html> (alegerea făcută din butonul de aspect), sau
 *  - automat, după setarea sistemului, dacă pagina nu a ales explicit modul luminos (data-mode="light" sau clasa „t-light”).
 */

:root {
  /* culori de bază */
  --black: #000;
  --white: #fff;
  --ink: #1d1d1f;
  --paper: #fff;
  --mist: #f5f5f7;
  --card: #fff;
  --muted: #6e6e73;
  --muted-dark: #a1a1a6;
  --line: #d2d2d7;
  --link: #1d1d1f;
  --link-dark: #3ccf2a;

  /* verdele WINLEX */
  --green: #3ccf2a;
  --btn: #3ccf2a;
  --ok: #3ccf2a;
  --ok-ink: #1a7d10;
  --on-green: #06200a;
  --btn-bg: #1c8512;
  --btn-hover: #1f8f14;
  --tone: rgba(60, 207, 42, .16);
  --tone-hover: rgba(60, 207, 42, .26);
  --tone-ink: #1a7d10;
  --bar: #28a01a;

  /* stări */
  --red: #d70015;
  --orange: #ff9f0a;
  --blue: #0a84ff;

  /* suprafețe pentru panouri (administrare, /apps, /ai) */
  --bg: #f5f5f7;
  --panel: #fff;
  --soft: #f5f5f7;
  --soft2: #e8e8ed;
  --line2: #f0f0f2;

  /* fonturi */
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI Variable Display", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;

  /* razele colțurilor */
  --r-xs: 6px;
  --r-sm: 8px;
  --r-md: 10px;
  --r-lg: 12px;
  --r-xl: 14px;
  --r-2xl: 16px;
  --r-3xl: 18px;
  --r-4xl: 20px;
  --r-5xl: 22px;
  --r-pill: 980px;
  --r-round: 50%;

  /* mișcare și lățimea conținutului */
  --ease: cubic-bezier(.28, .11, .32, 1);
  --wrap: 980px;
}

html.t-dark {
  --ink: #f5f5f7;
  --paper: #000;
  --mist: #161617;
  --card: #1d1d1f;
  --muted: #a1a1a6;
  --line: #38383a;
  --link: #f5f5f7;
  --ok-ink: #3ccf2a;
  --tone-ink: #3ccf2a;
  --bar: #3ccf2a;
  --red: #ff6961;
  --bg: #000;
  --panel: #161617;
  --soft: #1d1d1f;
  --soft2: #2c2c2e;
  --line2: #262628;
}

@media (prefers-color-scheme: dark) {
  :root:not(.t-light):not([data-mode="light"]) {
    --ink: #f5f5f7;
    --paper: #000;
    --mist: #161617;
    --card: #1d1d1f;
    --muted: #a1a1a6;
    --line: #38383a;
    --link: #f5f5f7;
    --ok-ink: #3ccf2a;
    --tone-ink: #3ccf2a;
    --bar: #3ccf2a;
    --red: #ff6961;
    --bg: #000;
    --panel: #161617;
    --soft: #1d1d1f;
    --soft2: #2c2c2e;
    --line2: #262628;
  }
}