/* ==========================================================================
   Design tokens — AryoGen palette mapped onto FlexAdmin-pro's variable
   system (header/sidebar dimensions, surface/border/accent roles) so the
   platform shell reads exactly like the FlexAdmin template, RTL-adapted.
   ========================================================================== */
:root{
  --navy:#0a1e3d;
  --navy2:#0f2c56;
  --ink:#152238;
  --muted:#5c6b84;
  --muted-2:#8592a8;
  --bg:#f3f6fb;
  --bg-alt:#eaf0f9;
  --card:#ffffff;
  --line:#e1e8f2;
  --teal:#0fa99c;
  --teal-dark:#0a7f76;
  --green:#2fae6b;
  --blue:#2f7fd1;
  --indigo:#5b5fc7;
  --amber:#e0972e;
  --red:#d9524a;
  --accent:#0fa99c;
  --accent2:#2f7fd1;

  --radius:18px;
  --radius-sm:12px;
  --radius-lg:24px;
  --shadow:0 10px 30px -12px rgba(10,30,60,.18);
  --shadow-lg:0 25px 60px -20px rgba(10,30,60,.35);

  --success:#0fa99c;
  --warning:#e0972e;
  --danger:#d9524a;
  --info:#2f7fd1;

  /* ---- FlexAdmin shell mapping (RTL: the sidebar lives on the RIGHT) ---- */
  --header-height:64px;
  --header-h:64px;               /* legacy alias still used by content CSS */
  --sidebar-width:280px;

  --background-color:var(--bg);
  --default-color:var(--ink);
  --heading-color:var(--navy);
  --accent-color:var(--teal);
  --surface-color:#ffffff;
  --contrast-color:#ffffff;
  --muted-color:var(--muted);
  --light-color:var(--muted-2);
  --border-color:var(--line);

  --header-bg:rgba(236,249,241,.92);
  --header-border:var(--line);
  --header-shadow:0 1px 0 rgba(14,26,47,.06);

  --sidebar-bg:#eaf7f0;
  --sidebar-border:#d9e3f1;
  --sidebar-color:#223248;
  --sidebar-muted-color:#6b809d;
  --sidebar-hover-bg:rgba(15,169,156,.1);
  --sidebar-active-bg:rgba(15,169,156,.16);

  --transition-fast:150ms ease;
  --transition-base:200ms ease;
}