/* ============================================================================
   VELORA THEME — the single design DNA file (v204 "VELORA OS")
   ----------------------------------------------------------------------------
   WANT A NEW DESIGN? CHANGE IT HERE. Every color, radius, shadow, font, spacing
   and motion value the entire app uses is defined below as a token. Components
   (velora.css, components.css, views) only ever reference these variables —
   they never hardcode design decisions. This file is loaded LAST, so whatever
   you write here wins everywhere, light and dark, app and login.
   ========================================================================== */

:root{
  /* ── Identity ──────────────────────────────────────────────────────────── */
  --accent:#059669;                 /* THE brand color (Emerald) */
  --accent-up:#34d399;              /* its lighter gradient partner */
  --accent-soft:#e9f9f1;            /* washed accent for fills/hover */
  --accent-2:#f59e0b;               /* secondary warm accent (warnings, highlights) */
  --accent-2-soft:#fffbeb;
  --v-grad:linear-gradient(115deg,#047857,#059669 55%,#34d399);

  /* ── The OS metaphor: desk (page background) vs window (app surface) ───── */
  --os-desk:#eef2f0;                                   /* the desk the window floats on */
  --os-desk-glow:radial-gradient(900px 520px at 8% -6%, rgba(5,150,105,.07), transparent 70%);
  --os-window-ring:rgba(15,42,32,.08);                 /* 1px window outline */
  --os-window-radius:18px;
  --os-rail-w:68px;                                    /* icon-rail width (desktop) */

  /* ── Typography ────────────────────────────────────────────────────────── */
  --font-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-display:'Manrope','Inter',system-ui,sans-serif;   /* headings, nav, KPIs, money */

  /* ── Shape & elevation ─────────────────────────────────────────────────── */
  --v-radius:14px;
  --v-radius-sm:10px;
  --v-shadow-sm:0 1px 2px rgba(16,44,34,.06), 0 1px 1px rgba(16,44,34,.04);
  --v-shadow-md:0 6px 18px -6px rgba(6,78,59,.14), 0 2px 6px rgba(16,44,34,.06);
  --v-shadow-window:0 24px 70px -28px rgba(15,42,32,.25), 0 4px 16px rgba(15,42,32,.06);

  /* ── Motion ────────────────────────────────────────────────────────────── */
  --v-ease:cubic-bezier(.2,.7,.3,1);
  --v-fast:120ms;
}

html[data-theme=dark]{
  --accent:#10b981;
  --accent-up:#34d399;
  --accent-soft:#0f2a20;
  --os-desk:#070b0a;
  --os-desk-glow:radial-gradient(900px 520px at 8% -6%, rgba(16,185,129,.08), transparent 70%);
  --os-window-ring:rgba(255,255,255,.07);
  --v-shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --v-shadow-md:0 8px 22px -8px rgba(0,0,0,.55);
  --v-shadow-window:0 24px 80px -24px rgba(0,0,0,.7);
}
