/* Adir Israel Design System — global entry point (flattened bundle). PERFORMANCE: this file is the concatenation of tokens/*.css, in the original @import order (colors → typography → spacing → effects → base). It is flattened on purpose: linking the token files via CSS @import created a render-blocking request chain (each file discovered only after its parent parsed), which cost ~1.3s of first paint on mobile. One file = one render-blocking request. The tokens/*.css files remain the editable source — after changing a token, regenerate this bundle from them. Webfonts (Heebo) load via the in each page's , not from here, so there is no chained font import. */ /* ===== tokens/colors.css ===== */ :root{ /* ---- Brand base ---- */ --ink-900:#0C1B2E; /* deepest navy (sidebar bottom) */ --ink-800:#11263D; /* primary ink-blue */ --ink-700:#1B3450; --ink-600:#294863; --ink-100:#DDE3EA; /* pale navy tint (table header, chips) */ --ink-050:#EEF1F5; --gold-600:#8F6E3E; /* darker gold, text on light */ --gold-500:#B08D57; /* accent gold */ --gold-300:#D8C29B; /* soft gold line / border */ --gold-100:#F0E7D6; /* gold wash */ --green-700:#255848; --green-600:#2F6B57; /* success / active / primary action in product */ --green-300:#A9C7BC; --green-100:#E4EFEA; /* green wash (icon chips, active nav bg) */ --amber-600:#B7791F; /* warning / pending */ --amber-100:#F7ECD5; --bordeaux-600:#A13E45; /* error / missing */ --bordeaux-100:#F3E0E1; --blue-600:#3A6EA5; /* neutral info (בטיפול) */ --blue-100:#E2EAF3; /* ---- Neutrals / surfaces ---- */ --cream-50:#F7F5F0; /* app background */ --cream-100:#EFEBE2; /* warm hover / subtle fill */ --white:#FFFFFF; --line-200:#E6E2D9; /* hairline on cream */ --line-100:#EFECE4; --text-900:#17212B; /* primary text */ --text-500:#68717B; /* secondary text */ --text-300:#9AA1A9; /* muted / placeholder */ --text-on-dark:#F4F6F8; --text-on-dark-dim:#A9B4C2; /* ---- Semantic aliases ---- */ --color-primary:var(--ink-800); --color-primary-hover:var(--ink-700); --color-accent:var(--gold-500); --color-bg:var(--cream-50); --color-surface:var(--white); --color-surface-alt:var(--cream-100); --color-border:var(--line-200); --text-body:var(--text-900); --text-muted:var(--text-500); --status-success-fg:var(--green-600); --status-success-bg:var(--green-100); --status-warning-fg:var(--amber-600); --status-warning-bg:var(--amber-100); --status-error-fg:var(--bordeaux-600); --status-error-bg:var(--bordeaux-100); --status-info-fg:var(--blue-600); --status-info-bg:var(--blue-100); --action-fg:var(--green-600); /* green is the product's affirmative action color */ --action-fg-hover:var(--green-700); } /* ===== tokens/typography.css ===== */ :root{ --font-sans:"Heebo","Assistant",system-ui,-apple-system,"Segoe UI",Arial,sans-serif; --font-display:"Heebo","Assistant",system-ui,sans-serif; /* brand uses one family — Heebo — everywhere */ --font-num:"Heebo",system-ui,sans-serif; /* used with font-variant-numeric: tabular-nums */ /* Type scale */ --fs-display:36px; /* marketing hero */ --fs-screen-title:28px; /* screen title (700) */ --fs-h2:22px; --fs-section:18px; /* area / card title (700) */ --fs-lg:16px; --fs-body:15px; /* body & tables */ --fs-sm:14px; /* dense tables, secondary */ --fs-xs:13px; --fs-2xs:12px; /* labels, captions */ --fw-regular:400; /* @kind font */ --fw-medium:500; /* @kind font */ --fw-semibold:600; /* @kind font */ --fw-bold:700; /* @kind font */ --lh-tight:1.15; /* @kind font */ --lh-snug:1.35; /* @kind font */ --lh-body:1.6; /* @kind font */ --ls-tight:-0.01em; /* @kind font */ --ls-caps:0.04em; /* @kind font */ /* KPI / financial figure */ --fs-kpi:40px; } /* ===== tokens/spacing.css ===== */ :root{ --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px; /* primary grid gutter */ --space-8:32px; --space-10:40px; --space-12:48px; --space-16:64px; --radius-sm:8px; --radius-md:12px; /* cards */ --radius-lg:16px; --radius-pill:999px; --sidebar-w:264px; --topbar-h:76px; --content-max:1240px; } /* ===== tokens/effects.css ===== */ :root{ --shadow-xs:0 1px 2px rgba(17,38,61,.05); --shadow-sm:0 1px 3px rgba(17,38,61,.06), 0 1px 2px rgba(17,38,61,.04); --shadow-card:0 6px 20px rgba(17,38,61,.06), 0 1px 2px rgba(17,38,61,.04); --shadow-md:0 10px 30px rgba(17,38,61,.08); --shadow-lg:0 24px 60px rgba(12,27,46,.14); --ring-focus:0 0 0 3px rgba(176,141,87,.35); /* gold focus ring */ --border-hair:1px solid var(--line-200); --border-card:1px solid var(--line-100); --ease-standard:cubic-bezier(.4,0,.2,1); /* @kind other */ --ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */ --dur-fast:120ms; /* @kind other */ --dur:200ms; /* @kind other */ --dur-slow:320ms; /* @kind other */ } /* ===== tokens/base.css ===== */ :root{ color-scheme:light; } *,*::before,*::after{ box-sizing:border-box; } html{ direction:rtl; } body{ margin:0; font-family:var(--font-sans); font-size:var(--fs-body); line-height:var(--lh-body); color:var(--text-body); background:var(--color-bg); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; } h1,h2,h3,h4{ margin:0; font-weight:var(--fw-bold); line-height:var(--lh-tight); color:var(--text-900); } p{ margin:0; } a{ color:var(--action-fg); text-decoration:none; transition:color var(--dur) var(--ease-standard); } a:hover{ color:var(--action-fg-hover); } button{ font-family:inherit; } :where(:focus-visible){ outline:none; box-shadow:var(--ring-focus); border-radius:var(--radius-sm); } .tnum{ font-variant-numeric:tabular-nums; }