/**
 * Qvora Clinic — Design System tokens + legacy bridge (Phase 0)
 *
 * Source of truth: the "Qvora Clinic" design system (tokens.json).
 * Load this file LAST, after tabler.min.css, style.css, qvora-tabler.css and
 * specialty-modules.css. It does three things and nothing else:
 *   1. declares the self-hosted fonts (Cairo + IBM Plex Mono; no external font service);
 *   2. declares every design-system token on :root;
 *   3. re-points the legacy variables (style.css, qvora-tabler.css, Tabler's
 *      --tblr-*) at those tokens, so existing rules pick up the new values.
 * It adds no component rules. Hard-coded colours and inline styles are not
 * touched here; they are migrated in Phase 1+.
 * Light only: there is no dark theme.
 */

/* 1. Fonts (self-hosted, /public/fonts, SIL OFL 1.1 — see fonts/OFL-Cairo.txt and fonts/OFL.txt).
   Design refresh: Cairo is the interface face for Arabic AND English (one family, so both
   scripts share weight and rhythm). Arabic, Latin and Latin-extended subsets load only when
   a page uses them (unicode-range). Cairo draws lighter than IBM Plex at the same weight, so
   each weight the CSS asks for is drawn one step heavier: 100–400 use Cairo Regular, 500 uses
   Cairo SemiBold and 600–900 use Cairo Bold (no faux-bold). IBM Plex Mono stays for codes. */
@font-face { font-family: "Cairo"; font-style: normal; font-weight: 100 400; font-display: swap; src: url("/fonts/Cairo-arabic-400.woff2") format("woff2"); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1; }
@font-face { font-family: "Cairo"; font-style: normal; font-weight: 100 400; font-display: swap; src: url("/fonts/Cairo-latin-ext-400.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Cairo"; font-style: normal; font-weight: 100 400; font-display: swap; src: url("/fonts/Cairo-latin-400.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Cairo"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/Cairo-arabic-600.woff2") format("woff2"); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1; }
@font-face { font-family: "Cairo"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/Cairo-latin-ext-600.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Cairo"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/Cairo-latin-600.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Cairo"; font-style: normal; font-weight: 600 900; font-display: swap; src: url("/fonts/Cairo-arabic-700.woff2") format("woff2"); unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1; }
@font-face { font-family: "Cairo"; font-style: normal; font-weight: 600 900; font-display: swap; src: url("/fonts/Cairo-latin-ext-700.woff2") format("woff2"); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Cairo"; font-style: normal; font-weight: 600 900; font-display: swap; src: url("/fonts/Cairo-latin-700.woff2") format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 100 400; font-display: swap; src: url("/fonts/IBMPlexMono-Regular.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500 900; font-display: swap; src: url("/fonts/IBMPlexMono-Medium.woff2") format("woff2"); }

/* 2. Design-system tokens */
:root {
  color-scheme: light;
  --bg: #ffffff;
  --surface: #ffffff;
  --surface-sunken: #eef1f7;
  --surface-hover: #f3f5fa;
  --surface-inverse: #0d1735;
  --surface-inverse-hover: #1b2a5c;
  --border: #dde2ec;
  --border-strong: #7d879f;
  --text: #0d1735;
  --text-muted: #4d5877;
  --text-inverse: #ffffff;
  --text-inverse-muted: #b8c2e0;
  --primary: #2f54eb;
  --primary-hover: #2343c7;
  --on-primary: #ffffff;
  --primary-soft: #ebf0ff;
  --primary-text: #2343c7;
  --pulse: #12b5dc;
  --pulse-soft: #e1f6fb;
  --pulse-text: #0a6580;
  --success: #16734a;
  --success-soft: #e3f3ea;
  --warning: #8f5300;
  --warning-soft: #fdf0da;
  --danger: #c02637;
  --on-danger: #ffffff;
  --danger-soft: #fce7e9;
  --neutral-soft: #e7ebf3;
  --focus-ring-inverse: #8fb0ff;
  --scrim: rgba(13,23,53,0.56);
  --focus-ring-color: #2f54eb;  /* design token "focus-ring"; the legacy name stays a box-shadow below */
  --shadow-sm: 0 1px 2px rgba(13,23,53,0.06);
  --shadow-md: 0 4px 12px rgba(13,23,53,0.08);
  --shadow-lg: 0 16px 40px rgba(13,23,53,0.18);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-pill: 999px;
  --control-sm: 32px;
  --control-md: 40px;
  --sidebar-width: 248px;
  --sidebar-width-collapsed: 72px;
  --font-sans: "Cairo", system-ui, -apple-system, "Segoe UI", Tahoma, Arial, sans-serif;
  --font-arabic: "Cairo", "Segoe UI", Tahoma, "Geeza Pro", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* 3a. Legacy variables from style.css / qvora-tabler.css -> tokens */
:root {
  /* brand (was sky blue #0284C7) */
  --blue-900: var(--primary);
  --blue-800: var(--primary-hover);
  --blue-050: var(--primary-soft);
  /* "gold" was teal and was mostly used for warning-type badges */
  --gold-500: var(--pulse-text);
  --gold-600: var(--warning);
  --teal-050: var(--warning-soft);
  /* neutrals — the background is always white */
  --text-dim: var(--text-muted);
  --danger-bg: var(--danger-soft);
  --surface-2: var(--surface-sunken);
  --disabled-bg: var(--surface-sunken);
  --disabled-text: var(--border-strong);
  /* shape */
  --radius: 10px;                 /* cards, panels (radius-lg) */
  --shadow: var(--shadow-sm);
  --focus-ring: 0 0 0 2px var(--surface), 0 0 0 4px var(--focus-ring-color);
  --focus-ring-danger: 0 0 0 2px var(--surface), 0 0 0 4px var(--danger);
  /* sidebar: navy ink from the logo (kept dark on purpose) */
  --sidebar-bg: var(--surface-inverse);
  --sidebar-bg-2: var(--surface-inverse-hover);
  --sidebar-text: var(--text-inverse-muted);
  --sidebar-text-active: var(--text-inverse);
  --sidebar-active-bg: var(--surface-inverse-hover);
  --sidebar-w: var(--sidebar-width);
  --sidebar-w-collapsed: var(--sidebar-width-collapsed);
  --app-sidebar-width: var(--sidebar-width);
  /* dashboard icon tiles and chart colours */
  --icon-purple: var(--primary);      --icon-purple-bg: var(--primary-soft);
  --icon-green: var(--success);       --icon-green-bg: var(--success-soft);
  --icon-blue: var(--pulse-text);     --icon-blue-bg: var(--pulse-soft);
  --icon-red: var(--danger);          --icon-red-bg: var(--danger-soft);
}

/* 3b. Tabler variables -> tokens */
:root, [data-bs-theme="light"] {
  --tblr-font-sans-serif: var(--font-sans);
  --tblr-font-monospace: var(--font-mono);
  --tblr-body-bg: var(--bg);
  --tblr-body-color: var(--text);
  --tblr-body-color-rgb: 16, 20, 58;
  --tblr-secondary-color: var(--text-muted);
  --tblr-border-color: var(--border);
  --tblr-border-color-translucent: var(--border);
  --tblr-card-bg: var(--surface);
  --tblr-bg-surface: var(--surface);
  --tblr-bg-surface-secondary: var(--surface-sunken);
  --tblr-border-radius: 6px;
  --tblr-card-border-radius: 10px;
  --tblr-btn-border-radius: 6px;
  --tblr-input-border-radius: 6px;
  --tblr-primary: var(--primary);          --tblr-primary-rgb: 90, 63, 224;   --tblr-primary-fg: var(--on-primary);
  --tblr-primary-lt: var(--primary-soft);  --tblr-primary-text: var(--primary-text);
  --tblr-link-color: var(--primary-text);  --tblr-link-color-rgb: 72, 48, 194;
  --tblr-link-hover-color: var(--primary-hover);
  --tblr-secondary: var(--text-muted);     --tblr-secondary-rgb: 79, 85, 115;
  --tblr-success: var(--success);          --tblr-success-rgb: 22, 115, 74;   --tblr-success-lt: var(--success-soft);
  --tblr-warning: var(--warning);          --tblr-warning-rgb: 143, 83, 0;    --tblr-warning-lt: var(--warning-soft);
  --tblr-danger: var(--danger);            --tblr-danger-rgb: 192, 38, 55;    --tblr-danger-lt: var(--danger-soft);
  --tblr-info: var(--pulse-text);          --tblr-info-rgb: 10, 101, 128;     --tblr-info-lt: var(--pulse-soft);
}

/* 3c. Font family: style.css hard-codes 'Inter' (which was never loaded) on
   these selectors. Same selectors, loaded later, so the tokens win. */
html, body,
h1, h2, h3,
.sidebar-logo-mark,
.sidebar-nav-item,
.sidebar-nav-group-header,
.cal-toggle-btn,
.btn,
.search-box input,
.tab,
.attachments-summary-btn,
.attachment-actions a, .attachment-actions button,
.form-row input, .form-row select, .form-row textarea,
.phone-country-trigger, .country-select-trigger,
.phone-number-input,
.country-picker-search,
.country-picker-item,
.form-section-header,
.stat-value,
.calendar-nav-group select,
.day-cell,
.home-card,
.date-nav input[type="date"],
.date-nav select,
.table-quick-search input,
.data-table .row-actions button,
.panel-toolbar input[type="text"], .panel-toolbar input[type="search"], .panel-toolbar input[type="date"], .panel-toolbar select,
.repeatable-row input, .repeatable-row select,
.discount-rule-row input,
.insurance-row-block .ins-company,
.ins-fees-grid input,
.finance-card .value,
.rx-symbol,
select,
.toolbar input[type="text"], .toolbar input[type="search"],
.dropdown-item,
.topbar-search input,
.filter-chip {
  font-family: var(--font-sans);
}
[dir="rtl"] body { font-family: var(--font-arabic); }