/* ════════════════════════════════════════════════════════════════════════════
 * atheer-ax.css — مكوّنات قالب Vireo داخل أثير
 *
 * ## الفكرة
 *
 * لا نُعيد رسم القالب بأيدينا. نأخذ **CSS القالب كما هو** (٣٥٢ قاعدة مستخرَجة
 * من `vireo-D45lZWjH.css` و`crm/deals.html`)، ونُغذّيه برموز أثير. فتُصبح كلّ
 * صفحة قادرة على استعمال أصناف `ax-` مباشرةً، وتخرج بمظهر القالب وسلوكه.
 *
 * ## لماذا هذا آمن
 *
 * الطبقة **إضافيّة بحتة**: بادئة `ax-` لا تتقاطع مع `at-` ولا مع أصناف أثير
 * القديمة. فلا شيء يتغيّر في أيّ صفحة حتّى تستعمل تلك الصفحة أصناف `ax-`
 * صراحةً. والتراجع: حذف سطر <link> واحد.
 *
 * ## الصقل — أين خالفنا القالب عمدًا
 *
 * ١. **الخطّ**: Vireo يستعمل Inter، وأثير عربيّ. `--ax-font-sans` تُشير إلى
 *    خطّ أثير (IBM Plex Sans Arabic) — Inter لا يحمل العربيّة أصلًا.
 * ٢. **ارتفاع عناصر التحكّم**: Vireo يضع 38px، وأثير وحّدها على **40px**
 *    وقيست 267/267. فالرمز يشير إلى `--at-control-h` — القالب يتبع أثير هنا،
 *    لا العكس، وإلّا انكسر التوحيد الذي بُني.
 * ٣. **اللون**: كلّ ألوان القالب تُقرأ من رموز أثير، فتتبع الثيم الفاتح
 *    والداكن تلقائيًّا بلا كتلة ثانية.
 * ٤. **الاتّجاه**: `.ax-pl-card` في القالب `text-align:left` — حُوّلت إلى
 *    `start` لتعمل في RTL.
 * ════════════════════════════════════════════════════════════════════════════ */

/* ── ١ · جسر الرموز: أسماء القالب ← رموز أثير ─────────────────────────────
 * كتلة واحدة تكفي: رموز أثير نفسها تتبدّل مع الثيم، فالأسماء المستعارة
 * ترث ذلك التبدّل مجّانًا. */
:root {
  /* الأسطح والحدود */
  --ax-canvas:          var(--bg, #f6f8fc);
  --ax-surface-solid:   var(--surface-1, #fff);
  --ax-surface:         var(--surface-1, #fff);
  --ax-surface-subtle:  var(--surface-2, #f0f3f9);
  --ax-surface-raised:  var(--surface-1, #fff);
  --ax-border:          var(--at-border, #cfd7e6);
  --ax-border-strong:   var(--at-border-strong, #b7c1d5);
  --ax-fill-hover:      var(--surface-2, #f0f3f9);
  --ax-fill-active:     var(--surface-3, #e7ecf4);

  /* النصّ */
  --ax-text-strong:     var(--text-primary, #151b27);
  --ax-text:            var(--text-primary, #151b27);
  --ax-text-muted:      var(--text-secondary, #3a4456);
  --ax-text-subtle:     var(--at-text-muted, #3a4456);
  --ax-text-disabled:   var(--at-text-disabled, #8b95a7);

  /* اللون الأساس */
  --ax-accent:          var(--at-accent, #2a5fcc);
  --ax-accent-hover:    var(--at-accent-hover, #2350ae);
  --ax-accent-wash:     var(--at-accent-soft-bg, #e7edfb);
  --ax-accent-50:       var(--at-accent-soft-bg, #e7edfb);
  --ax-on-accent:       var(--at-accent-on, #fff);
  --ax-link:            var(--at-accent, #2a5fcc);
  --ax-focus-ring:      var(--at-accent, #2a5fcc);
  --ax-accent-rgb:      42, 95, 204;
  --ax-gradient-accent: linear-gradient(135deg, var(--ax-accent) 0%, var(--ax-accent-hover) 100%);
  --ax-glow-accent:     0 12px 26px -10px rgba(var(--ax-accent-rgb), .45);

  /* الحالات */
  --ax-success-500: var(--at-success, #1f6a3d);  --ax-success-50: var(--at-success-bg, #e7f4ec);
  --ax-danger-500:  var(--at-danger,  #a6372a);  --ax-danger-50:  var(--at-danger-bg,  #fbe9e6);
  --ax-warning-500: var(--at-warning, #7e5509);  --ax-warning-50: var(--at-warning-bg, #fbf1de);
  --ax-info-500:    var(--at-info,    #245e9f);  --ax-info-50:    var(--at-info-bg,    #e6effa);

  /* أنصاف الأقطار — مقياس Vireo نفسه، وهو المطبَّق في أثير أصلًا */
  --ax-radius-xs:   var(--at-radius-xs, 8px);
  --ax-radius-sm:   var(--at-radius-sm, 12px);
  --ax-radius-md:   var(--at-radius-md, 14px);
  --ax-radius-lg:   var(--at-radius-lg, 18px);
  --ax-radius-pill: 999px;

  /* المسافات ومقياس الخطّ — من القالب حرفيًّا */
  --ax-space-1: 4px;  --ax-space-2: 8px;  --ax-space-3: 12px;
  --ax-space-4: 16px; --ax-space-5: 20px; --ax-space-6: 24px;
  --ax-space-7: 28px; --ax-space-8: 32px;
  --ax-text-2xs: 11px; --ax-text-xs: 12px; --ax-text-sm: 13px;
  --ax-text-base: 15px; --ax-text-md: 17px; --ax-text-lg: 20px; --ax-text-xl: 24px;
  --ax-weight-regular: 400; --ax-weight-medium: 500;
  --ax-weight-semibold: 600; --ax-weight-bold: 700;

  /* 🔴 صقل: القالب 38px وأثير 40px — يتبع أثير كي لا ينكسر توحيد الحقول. */
  --ax-control-h:         var(--at-control-h, 40px);
  --ax-control-h-compact: 32px;
  --ax-control-h-lg:      48px;

  --ax-icon-xs: 14px; --ax-icon-sm: 16px; --ax-icon-md: 20px; --ax-icon-lg: 24px;

  /* 🔴 صقل: خطّ أثير لا Inter — Inter بلا حروف عربيّة. */
  --ax-font-sans: var(--font-sans, "IBM Plex Sans Arabic", "IBM Plex Sans", system-ui, sans-serif);
  --ax-font-mono: var(--at-font-mono, "JetBrains Mono", ui-monospace, Menlo, monospace);

  --ax-motion-instant: 80ms; --ax-motion-fast: .14s; --ax-motion-base: .2s;
  --ax-ease-standard: cubic-bezier(.2, 0, 0, 1); --ax-ease-linear: linear;

  --ax-shadow-sm: var(--at-shadow-sm, 0 6px 18px -8px #1016282e, 0 2px 6px -2px #1016281a);
  --ax-shadow-md: var(--at-shadow-md, 0 14px 36px -14px #10162838, 0 4px 12px -6px #1016281f);
  --ax-shadow-lg: 0 28px 64px -20px #10162847, 0 8px 20px -8px #10162829;
  --ax-backdrop: #14110d80;

  /* ── رموز أشار إليها CSS القالب ولم تكن معرَّفة ────────────────────────
   * فُحصت آليًّا: ٢٧ رمزًا من ٩٧ مستعمَلًا كانت مفقودة. والخاصيّة التي تشير
   * إلى رمز غير معرَّف **تسقط بصمت** — لا تُخطئ ولا تُحذّر. أوّل ما كشفها
   * عنوان الصفحة: ظهر 14px بدل 30px لأنّ `--ax-text-2xl` لم يكن موجودًا. */
  --ax-text-2xl:   30px;
  --ax-leading-xs: 18px;  --ax-leading-lg:  28px;
  --ax-leading-2xl:38px;  --ax-leading-kpi: 36px;
  --ax-num-kpi:    32px;
  --ax-radius-xl:  var(--at-radius-xl, 24px);
  --ax-space-10:   40px;
  --ax-gap:        var(--ax-space-4);
  --ax-ease-emphasized: cubic-bezier(.3, 0, 0, 1);
  --ax-focus-shadow: 0 0 0 3px rgba(var(--ax-accent-rgb), .18);
  --ax-icon-stroke-bold: 2.4;
  --ax-z-sticky: 100;
  --ax-header-bg: var(--ax-surface-raised);
  --ax-glass-hi:  color-mix(in srgb, var(--ax-surface-solid) 82%, transparent);
  --ax-font-display: var(--ax-font-sans);   /* صقل: Space Grotesk بلا عربيّة */

  /* ألوان الرسوم — فئويّة لا دلاليّة. تبقى كما في القالب كي تُميّز السلاسل،
   * وألوان الحالة (نجاح/خطر) تُقرأ من رموز أثير أعلاه ولا تُخلط بها. */
  --ax-viz-emerald: #10b981; --ax-viz-cyan:   #0ea5e9;
  --ax-viz-amber:   #e0930b; --ax-viz-violet: #7c5cfc;
  --ax-viz-red:     #ef4444;
  --ax-delta-up:   var(--at-success, #1f6a3d);
  --ax-delta-down: var(--at-danger,  #a6372a);

  /* مؤشّر الألسنة يُضبط بجافاسكربت في القالب؛ قيم ابتدائيّة تمنع السقوط. */
  --ax-tabs-ind-w: 0; --ax-tabs-ind-h: 2px;
  --ax-tabs-ind-x: 0; --ax-tabs-ind-y: 0;
}


/* ───────── الأزرار (62 قاعدة) ───────── */
.ax-btn { --_btn-h:var(--ax-control-h);--_btn-px:var(--ax-space-4);--_btn-fz:var(--ax-text-sm);--_btn-icon:var(--ax-icon-sm);justify-content:center;align-items:center;gap:var(--ax-space-2);min-height:var(--_btn-h);padding-block:0;padding-inline:var(--_btn-px);font-family:var(--ax-font-sans);font-size:var(--_btn-fz);font-weight:var(--ax-weight-semibold);color:var(--ax-text);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:var(--ax-radius-sm);transition:background var(--ax-motion-instant) var(--ax-ease-standard),border-color var(--ax-motion-instant) var(--ax-ease-standard),color var(--ax-motion-instant) var(--ax-ease-standard),box-shadow var(--ax-motion-fast) var(--ax-ease-standard),filter var(--ax-motion-instant) var(--ax-ease-standard);background:0 0;border:1px solid #0000;line-height:1;text-decoration:none;display:inline-flex;position:relative }
.ax-btn__icon { width:var(--_btn-icon);height:var(--_btn-icon);color:currentColor;flex:none }
.ax-btn__label { text-overflow:ellipsis;padding-block:.05em;line-height:1.25;overflow:hidden }
.ax-btn__spinner { width:var(--_btn-icon);height:var(--_btn-icon);opacity:0;animation:ax-spin .7s var(--ax-ease-linear) infinite;border:2px solid;inset-inline-start:50%;border-inline-end-color:#0000;border-radius:50%;position:absolute;top:50%;translate:-50% -50% }
.ax-btn--sm,.ax-btn--compact { --_btn-h:var(--ax-control-h-compact);--_btn-px:var(--ax-space-3);--_btn-fz:var(--ax-text-xs) }
.ax-btn--lg { --_btn-h:var(--ax-control-h-lg);--_btn-px:var(--ax-space-5);--_btn-fz:var(--ax-text-base);--_btn-icon:var(--ax-icon-md) }
.ax-btn--icon { width:var(--_btn-h);aspect-ratio:1;padding-inline:0 }
.ax-btn--block { width:100%;display:flex }
.ax-btn--pill { border-radius:var(--ax-radius-pill) }
.ax-btn--primary { color:var(--ax-on-accent);background:var(--ax-gradient-accent);box-shadow:var(--ax-glow-accent);border-color:#0000 }
.ax-btn--primary:hover { filter:brightness(1.06);box-shadow:var(--ax-glow-accent),var(--ax-shadow-sm) }
.ax-btn--primary:active { filter:brightness(.97) }
.ax-btn--solid { color:var(--ax-on-accent);background:var(--ax-accent);border-color:#0000 }
.ax-btn--solid:hover { background:var(--ax-accent-hover) }
.ax-btn--solid:active { filter:brightness(.97) }
.ax-btn--secondary,.ax-btn--outline { color:var(--ax-text);border-color:var(--ax-border-strong);background:0 0 }
.ax-btn--secondary:hover,.ax-btn--outline:hover { background:var(--ax-fill-hover);color:var(--ax-text-strong) }
.ax-btn--secondary:active,.ax-btn--outline:active { background:var(--ax-fill-active) }
.ax-btn--tertiary,.ax-btn--tonal { color:var(--ax-text-strong);background:var(--ax-fill-hover);border-color:#0000 }
.ax-btn--tertiary:hover,.ax-btn--tonal:hover { background:var(--ax-fill-active) }
.ax-btn--ghost { color:var(--ax-text);background:0 0;border-color:#0000 }
.ax-btn--ghost:hover { background:var(--ax-fill-hover);color:var(--ax-text-strong) }
.ax-btn--ghost:active { background:var(--ax-fill-active) }
.ax-btn--link { min-height:0;color:var(--ax-link);border-radius:var(--ax-radius-xs);background:0 0;border:0;padding:0 }
.ax-btn--link:hover { color:var(--ax-accent-hover);text-underline-offset:2px;text-decoration:underline }
.ax-btn--success { --ax-accent:var(--ax-success-500);--ax-accent-hover:var(--ax-success-500);--ax-on-accent:#fff;--ax-link:var(--ax-success-500);--ax-focus-ring:var(--ax-success-500) }
.ax-btn--warning { --ax-accent:var(--ax-warning-500);--ax-accent-hover:var(--ax-warning-500);--ax-on-accent:#fff;--ax-link:var(--ax-warning-500);--ax-focus-ring:var(--ax-warning-500) }
.ax-btn--danger { --ax-accent:var(--ax-danger-500);--ax-accent-hover:var(--ax-danger-500);--ax-on-accent:#fff;--ax-link:var(--ax-danger-500);--ax-focus-ring:var(--ax-danger-500) }
.ax-btn--info { --ax-accent:var(--ax-info-500);--ax-accent-hover:var(--ax-info-500);--ax-on-accent:#fff;--ax-link:var(--ax-info-500);--ax-focus-ring:var(--ax-info-500) }
.ax-btn--neutral { --ax-accent:var(--ax-text-strong);--ax-accent-hover:var(--ax-text);--ax-on-accent:var(--ax-canvas);--ax-link:var(--ax-text);--ax-focus-ring:var(--ax-text-strong) }
.ax-btn--success.ax-btn--primary,.ax-btn--warning.ax-btn--primary,.ax-btn--danger.ax-btn--primary,.ax-btn--info.ax-btn--primary,.ax-btn--neutral.ax-btn--primary { background:var(--ax-accent);box-shadow:var(--ax-shadow-sm) }
.ax-btn--soft-success { color:var(--ax-success-500);background:var(--ax-success-50) }
.ax-btn--soft-warning { color:var(--ax-warning-500);background:var(--ax-warning-50) }
.ax-btn--soft-danger { color:var(--ax-danger-500);background:var(--ax-danger-50) }
.ax-btn--soft-info { color:var(--ax-info-500);background:var(--ax-info-50) }
.ax-btn--soft-success:hover,.ax-btn--soft-warning:hover,.ax-btn--soft-danger:hover,.ax-btn--soft-info:hover { filter:brightness(.97) }
.ax-btn:disabled,.ax-btn[aria-disabled=true],.ax-btn.is-disabled { color:var(--ax-text-disabled);background:var(--ax-fill-hover);box-shadow:none;filter:none;cursor:not-allowed;pointer-events:none;border-color:#0000 }
.ax-btn.is-loading { pointer-events:none }
.ax-btn.is-loading .ax-btn__label,.ax-btn.is-loading .ax-btn__icon { opacity:0 }
.ax-btn.is-loading .ax-btn__spinner { opacity:1 }
.ax-btn-group { align-items:stretch;display:inline-flex }
.ax-btn-group>.ax-btn { border-radius:0 }
.ax-btn-group>.ax-btn:not(:first-child) { margin-inline-start:-1px }
.ax-btn-group>.ax-btn:first-child { border-start-start-radius:var(--ax-radius-sm);border-end-start-radius:var(--ax-radius-sm) }
.ax-btn-group>.ax-btn:last-child { border-start-end-radius:var(--ax-radius-sm);border-end-end-radius:var(--ax-radius-sm) }
.ax-btn-group>.ax-btn:hover,.ax-btn-group>.ax-btn:focus-visible { z-index:1 }
.ax-btn-group--vertical { flex-direction:column }
.ax-btn-group--vertical>.ax-btn:not(:first-child) { margin-inline-start:0;margin-top:-1px }
.ax-btn-group--vertical>.ax-btn:first-child { border-radius:var(--ax-radius-sm) var(--ax-radius-sm) 0 0 }
.ax-btn-group--vertical>.ax-btn:last-child { border-radius:0 0 var(--ax-radius-sm) var(--ax-radius-sm) }
.ax-btn-group--segmented { padding:var(--ax-space-1);gap:var(--ax-space-1);background:var(--ax-fill-hover);border:1px solid var(--ax-border);border-radius:var(--ax-radius-md) }
.ax-btn-group--segmented>.ax-btn { color:var(--ax-text-muted);background:0 0;border:0;margin-inline-start:0;border-radius:var(--ax-radius-sm)!important }
.ax-btn-group--segmented>.ax-btn:hover { color:var(--ax-text-strong);background:var(--ax-fill-hover) }
.ax-btn-group--segmented>.ax-btn[aria-checked=true],.ax-btn-group--segmented>.ax-btn.is-selected,.ax-btn-group--segmented>.ax-btn[aria-pressed=true] { color:var(--ax-accent);background:var(--ax-accent-wash);box-shadow:var(--ax-shadow-sm) }
.ax-btn-group--split>.ax-btn-group__caret { padding-inline:var(--ax-space-2) }
.ax-btn-primary { align-items:center;gap:var(--ax-space-2);font-weight:var(--ax-weight-semibold);font-size:var(--ax-text-sm);color:var(--ax-on-accent);cursor:pointer;border-radius:var(--ax-radius-pill);background:var(--ax-gradient-accent);box-shadow:var(--ax-glow-accent);transition:filter var(--ax-motion-instant) var(--ax-ease-standard);border:0;padding:11px 17px;display:inline-flex }
.ax-btn-primary:hover { filter:brightness(1.06) }
.ax-btn-primary:active { filter:brightness(.97) }
.ax-btn--accent { color:var(--ax-on-accent);background:var(--ax-gradient-accent);box-shadow:var(--ax-glow-accent);border-color:#0000 }
.ax-btn--accent:hover { background:var(--ax-accent-hover) }
.ax-btn--ghost-danger { color:var(--ax-danger-500);background:0 0;border-color:#0000 }
.ax-btn--ghost-danger:hover { background:var(--ax-danger-500) }

/* ───────── الحقول (25 قاعدة) ───────── */
.ax-input,.ax-textarea,.ax-select { --_f-h:var(--ax-control-h);width:100%;min-height:var(--_f-h);padding:0 var(--ax-space-3);font-family:var(--ax-font-sans);font-size:var(--ax-text-sm);color:var(--ax-text);background:var(--ax-surface);border:1px solid var(--ax-border);border-radius:var(--ax-radius-sm);transition:border-color var(--ax-motion-instant) var(--ax-ease-standard),box-shadow var(--ax-motion-fast) var(--ax-ease-standard),background var(--ax-motion-instant) var(--ax-ease-standard) }
.ax-textarea { padding:var(--ax-space-3);min-height:calc(var(--ax-space-10) + var(--ax-space-6));resize:vertical;line-height:1.5 }
.ax-input::placeholder,.ax-textarea::placeholder { color:var(--ax-text-disabled) }
.ax-input:hover,.ax-textarea:hover,.ax-select:hover { border-color:var(--ax-border-strong) }
.ax-input:focus-visible,.ax-textarea:focus-visible,.ax-select:focus-visible,.ax-input:focus,.ax-textarea:focus,.ax-select:focus { border-color:var(--ax-accent);box-shadow:var(--ax-focus-shadow);outline:none }
.ax-input:disabled,.ax-textarea:disabled,.ax-select:disabled { color:var(--ax-text-disabled);background:var(--ax-fill-hover);cursor:not-allowed }
.ax-input[readonly],.ax-textarea[readonly] { background:var(--ax-surface-subtle) }
.ax-input--sm,.ax-select--sm { --_f-h:var(--ax-control-h-compact) }
.ax-input--lg,.ax-select--lg { --_f-h:var(--ax-control-h-lg) }
.ax-input.is-invalid,.ax-textarea.is-invalid,.ax-select.is-invalid,.ax-input[aria-invalid=true],.ax-textarea[aria-invalid=true] { border-color:var(--ax-danger-500) }
.ax-input.is-invalid:focus-visible,.ax-textarea.is-invalid:focus-visible { box-shadow:0 0 0 3px var(--ax-danger-500) }
.ax-input.is-valid,.ax-textarea.is-valid,.ax-select.is-valid { border-color:var(--ax-success-500) }
.ax-field__control .ax-input { flex:auto }
.ax-input--with-leading-icon { padding-inline-start:var(--ax-space-8) }
.ax-input--with-trailing { padding-inline-end:var(--ax-space-8) }
.ax-input--floating { position:relative }
.ax-input-group { border:1px solid var(--ax-border);border-radius:var(--ax-radius-sm);background:var(--ax-surface);align-items:stretch;display:flex;overflow:hidden }
.ax-input-group:hover { border-color:var(--ax-border-strong) }
.ax-input-group:focus-within { border-color:var(--ax-accent);box-shadow:var(--ax-focus-shadow) }
.ax-input-group .ax-input,.ax-input-group .ax-select { background:0 0;border:0;border-radius:0 }
.ax-input-group .ax-input:focus-visible,.ax-input-group .ax-select:focus-visible { box-shadow:none }
.ax-input-group__addon { padding-inline:var(--ax-space-3);font-size:var(--ax-text-sm);color:var(--ax-text-subtle);background:var(--ax-surface-subtle);white-space:nowrap;align-items:center;display:inline-flex }
.ax-input-group__addon:not(:last-child) { border-inline-end:1px solid var(--ax-border) }
.ax-input-group__addon:not(:first-child) { border-inline-start:1px solid var(--ax-border) }
.ax-input-group.is-invalid { border-color:var(--ax-danger-500) }

/* ───────── القوائم (12 قاعدة) ───────── */
.ax-select { -webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238A93A4' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--ax-space-3) center;padding-inline-end:var(--ax-space-8) }
[dir=rtl] .ax-select { background-position:left var(--ax-space-3) center }

/* ───────── مجموعة الحقل (14 قاعدة) ───────── */
.ax-field { gap:var(--ax-space-2);flex-direction:column;display:flex }
.ax-field__label,.ax-label { font-size:var(--ax-text-sm);font-weight:var(--ax-weight-medium);color:var(--ax-text-strong) }
.ax-field__required { color:var(--ax-danger-500) }
.ax-field__hint,.ax-help { font-size:var(--ax-text-xs);color:var(--ax-text-subtle) }
.ax-field__message { min-height:var(--ax-leading-xs);font-size:var(--ax-text-xs) }
.ax-error,.ax-field__message--error { color:var(--ax-danger-500) }
.ax-field__message--success { color:var(--ax-success-500) }
.ax-field__control { align-items:center;display:flex;position:relative }
.ax-field__affix { color:var(--ax-text-subtle);pointer-events:none;align-items:center;display:inline-flex;position:absolute }
.ax-field__affix--leading { inset-inline-start:var(--ax-space-3) }
.ax-field__affix--trailing { inset-inline-end:var(--ax-space-3) }
.ax-field__affix svg { width:var(--ax-icon-sm);height:var(--ax-icon-sm) }
.ax-field__affix--button { pointer-events:auto;cursor:pointer;background:0 0;border:0 }

/* ───────── البطاقات (53 قاعدة) ───────── */
.ax-card { color:var(--ax-text);background:var(--ax-surface);border:1px solid var(--ax-border);border-radius:var(--ax-radius-xl);box-shadow:var(--ax-shadow-card);-webkit-backdrop-filter:blur(18px)saturate(1.1);backdrop-filter:blur(18px)saturate(1.1);transition:box-shadow var(--ax-motion-base) var(--ax-ease-standard),border-color var(--ax-motion-base) var(--ax-ease-standard),transform var(--ax-motion-base) var(--ax-ease-standard);flex-direction:column;display:flex;position:relative;overflow:hidden }
.ax-card:after { content:"";border-radius:inherit;pointer-events:none;box-shadow:inset 0 1px 0 var(--ax-glass-hi);position:absolute;top:0;right:0;bottom:0;left:0 }
.ax-card__header { justify-content:space-between;align-items:flex-start;gap:var(--ax-space-3);padding:var(--ax-space-5) var(--ax-space-6);display:flex }
.ax-card__header+.ax-card__body { padding-top:0 }
.ax-card__titles { flex-direction:column;gap:2px;min-width:0;display:flex }
.ax-card__eyebrow { font-size:var(--ax-text-2xs);font-weight:var(--ax-weight-semibold);letter-spacing:.04em;text-transform:uppercase;color:var(--ax-text-subtle) }
.ax-card__title { font-family:var(--ax-font-display);font-size:var(--ax-text-lg);font-weight:var(--ax-weight-semibold);line-height:var(--ax-leading-lg);color:var(--ax-text-strong);margin:0 }
.ax-card__subtitle { font-size:var(--ax-text-sm);color:var(--ax-text-muted);margin:0 }
.ax-card__actions { align-items:center;gap:var(--ax-space-2);flex:none;display:flex }
.ax-card__media { position:relative;overflow:hidden }
.ax-card__body { padding:var(--ax-space-6);flex:auto }
.ax-card__footer { align-items:center;gap:var(--ax-space-3);padding:var(--ax-space-4) var(--ax-space-6);border-top:1px solid var(--ax-border);display:flex }
.ax-card__handle { color:var(--ax-text-subtle);cursor:grab;background:0 0;border:0;display:inline-flex }
.ax-card__handle:active { cursor:grabbing }
.ax-card--compact .ax-card__header { padding:var(--ax-space-4) var(--ax-space-5) }
.ax-card--compact .ax-card__body { padding:var(--ax-space-5) }
.ax-card--balance .ax-card__header { flex-direction:column;align-items:flex-start }
.ax-card--accent-edge:before { content:"";background:var(--ax-accent);z-index:1;width:3px;position:absolute;inset-block:0;inset-inline-start:0 }
.ax-card--interactive { cursor:pointer }
.ax-card--interactive:hover { box-shadow:var(--ax-shadow-lg);border-color:var(--ax-border-strong) }
.ax-card--interactive:focus-visible { outline:2px solid var(--ax-focus-ring);outline-offset:2px }
.ax-card.is-selected,.ax-card--selected { border-color:var(--ax-accent) }
.ax-card.is-selected .ax-card__header,.ax-card--selected .ax-card__header { background:var(--ax-accent-wash) }
.ax-card.is-loading { pointer-events:none }
.ax-card.is-dragging { opacity:.6;box-shadow:var(--ax-shadow-lg) }
.ax-card--media .ax-card__media { border-radius:var(--ax-radius-xl) var(--ax-radius-xl) 0 0 }
.ax-kpi__delta,.ax-card__delta { padding:2px var(--ax-space-2);font-size:var(--ax-text-xs);font-weight:var(--ax-weight-semibold);font-variant-numeric:tabular-nums;border-radius:var(--ax-radius-pill);align-items:center;gap:2px;display:inline-flex }
.ax-kpi__delta svg,.ax-card__delta svg { width:var(--ax-icon-xs);height:var(--ax-icon-xs);stroke-width:var(--ax-icon-stroke-bold) }
.ax-kpi__delta--up,.ax-card__delta--up { color:var(--ax-delta-up);background:var(--ax-delta-up) }
.ax-kpi__delta--down,.ax-card__delta--down { color:var(--ax-delta-down);background:var(--ax-delta-down) }
.ax-card--stat .ax-card__body { gap:var(--ax-space-3);flex-direction:column;display:flex }
.ax-card__kpi-val { font-family:var(--ax-font-display);font-size:var(--ax-num-kpi);line-height:var(--ax-leading-kpi);font-weight:var(--ax-weight-semibold);color:var(--ax-text-strong);font-variant-numeric:tabular-nums }
.ax-card__kpi-icon { border-radius:var(--ax-radius-md);width:44px;height:44px;color:var(--ax-accent);background:rgba(var(--ax-accent-rgb),.14);justify-content:center;align-items:center;display:inline-flex }
.ax-card__kpi-icon--c1 { color:var(--ax-accent);background:rgba(var(--ax-accent-rgb),.14) }
.ax-card__kpi-icon--c2 { color:var(--ax-viz-cyan);background:var(--ax-viz-cyan) }
.ax-card__kpi-icon--c3 { color:var(--ax-viz-violet);background:var(--ax-viz-violet) }
.ax-card__kpi-icon--c4 { color:var(--ax-viz-amber);background:var(--ax-viz-amber) }
.ax-card--gradient .ax-welcome__title,.ax-card--gradient .ax-welcome__stat dd { color:inherit }
.ax-card--gradient .ax-welcome__eyebrow,.ax-card--gradient .ax-welcome__lede,.ax-card--gradient .ax-welcome__stat dt { color:inherit;opacity:.82 }
.ax-card--gradient .ax-welcome:before { background:radial-gradient(circle,#ffffff2e,#0000 70%) }
.ax-card:not(.ax-card--gradient) .ax-spotlight__label,.ax-card:not(.ax-card--gradient) .ax-spotlight__foot { color:var(--ax-text-muted);opacity:1 }
.ax-card:not(.ax-card--gradient) .ax-spotlight__value { color:var(--ax-text-strong) }
.ax-card:not(.ax-card--gradient) .ax-spotlight__chip { color:var(--ax-delta-up);background:var(--ax-delta-up) }
.ax-card:has(.ax-combobox__trigger[aria-expanded=true]) { z-index:var(--ax-z-sticky);overflow:visible }
.ax-card--filled { background:var(--ax-accent-wash);border-color:rgba(var(--ax-accent-rgb),.28) }
.ax-card--gradient { color:var(--ax-on-accent);background:var(--ax-gradient-accent);-webkit-backdrop-filter:none;backdrop-filter:none;border-color:#0000 }
.ax-card--gradient .ax-card__title,.ax-card--gradient .ax-card__eyebrow,.ax-card--gradient .ax-card__subtitle,.ax-card--gradient .ax-num { color:inherit }
.ax-card--gradient .ax-card__eyebrow,.ax-card--gradient .ax-card__subtitle { opacity:.82 }
.ax-card--gradient .ax-card__footer { border-top-color:#ffffff38 }
.ax-card--bleed>.ax-card__body { padding:0 }
.ax-card--flat { background:var(--ax-surface-subtle);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none }
.ax-card--flat:after { box-shadow:none }
[data-ax-page=classic] .ax-card { background:var(--ax-surface-solid);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:var(--ax-shadow-sm) }

/* ───────── التخطيط (8 قاعدة) ───────── */
.ax-num { font-variant-numeric:tabular-nums }
.ax-text-truncate { text-overflow:ellipsis;white-space:nowrap;overflow:hidden }
.ax-num,.ax-mono,[data-ax-tabular] { unicode-bidi:plaintext }
.ax-num,[data-ax-tabular] { font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1 }
.ax-stack { gap:var(--ax-gap,var(--ax-space-4));flex-direction:column;display:flex }
.ax-cluster { align-items:center;gap:var(--ax-gap,var(--ax-space-2));flex-wrap:wrap;display:flex }
.ax-cluster--between { justify-content:space-between }

/* ───────── ترويسة الصفحة (17 قاعدة) ───────── */
.ax-breadcrumb__list { align-items:center;gap:var(--ax-space-1);font-size:var(--ax-text-sm);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex }
.ax-breadcrumb__item { align-items:center;min-width:0;display:inline-flex }
.ax-breadcrumb__item a { align-items:center;gap:var(--ax-space-1);color:var(--ax-text-muted);text-overflow:ellipsis;white-space:nowrap;text-decoration:none;display:inline-flex;overflow:hidden }
.ax-breadcrumb__item a:hover { color:var(--ax-text);text-underline-offset:2px;text-decoration:underline }
.ax-breadcrumb__item [aria-current=page] { color:var(--ax-text-strong);font-weight:var(--ax-weight-medium) }
.ax-breadcrumb__home { width:var(--ax-icon-sm);height:var(--ax-icon-sm) }
.ax-breadcrumb__sep { color:var(--ax-text-subtle);display:inline-flex }
.ax-breadcrumb__sep svg { width:var(--ax-icon-xs);height:var(--ax-icon-xs) }
[dir=rtl] .ax-breadcrumb__sep svg { transform:scaleX(-1) }
.ax-page-head { margin-block-end:var(--ax-space-6) }
.ax-page-head .ax-breadcrumb { margin-block-end:var(--ax-space-3) }
.ax-page-head__row { align-items:flex-end;gap:var(--ax-space-4);flex-wrap:wrap;display:flex }
.ax-page-head__title { font-family:var(--ax-font-display);font-size:var(--ax-text-2xl);line-height:var(--ax-leading-2xl);font-weight:var(--ax-weight-bold);letter-spacing:-.015em;color:var(--ax-text-strong) }
.ax-page-head__subtitle { font-size:var(--ax-text-md);color:var(--ax-text-muted);margin-block-start:var(--ax-space-1) }
.ax-page-head__actions { align-items:center;gap:var(--ax-space-2);flex-wrap:wrap;margin-inline-start:auto;display:flex }
[data-ax-page=classic] .ax-page-head { border-block-end:1px solid var(--ax-border);padding-block-end:var(--ax-space-4) }
[data-ax-page=compact] .ax-page-head { margin-block-end:var(--ax-space-4) }

/* ───────── الاختيار (37 قاعدة) ───────── */
.ax-checkbox { -webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--ax-surface);border:1px solid var(--ax-border-strong);border-radius:var(--ax-radius-xs);cursor:pointer;width:18px;height:18px;transition:background var(--ax-motion-instant) var(--ax-ease-standard),border-color var(--ax-motion-instant) var(--ax-ease-standard);flex:none;position:relative }
.ax-checkbox:hover { border-color:var(--ax-accent) }
.ax-checkbox:checked,.ax-checkbox:indeterminate { background:var(--ax-accent);border-color:var(--ax-accent) }
.ax-checkbox:checked:after { content:"";background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;position:absolute;top:0;right:0;bottom:0;left:0 }
.ax-checkbox:indeterminate:after { content:"";inset-inline:3px;background:#fff;border-radius:1px;height:2px;position:absolute;top:50%;transform:translateY(-50%) }
.ax-checkbox:focus-visible { box-shadow:var(--ax-focus-shadow);outline:none }
.ax-checkbox:disabled { background:var(--ax-fill-hover);border-color:var(--ax-border);cursor:not-allowed }
.ax-checkbox.is-invalid { border-color:var(--ax-danger-500) }
.ax-radio { -webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--ax-surface);border:1px solid var(--ax-border-strong);border-radius:var(--ax-radius-pill);cursor:pointer;width:18px;height:18px;transition:border-color var(--ax-motion-instant) var(--ax-ease-standard);flex:none;position:relative }
.ax-radio:hover,.ax-radio:checked { border-color:var(--ax-accent) }
.ax-radio:checked:after { content:"";background:var(--ax-accent);border-radius:50%;position:absolute;top:4px;right:4px;bottom:4px;left:4px }
.ax-radio:focus-visible { box-shadow:var(--ax-focus-shadow);outline:none }
.ax-radio:disabled { background:var(--ax-fill-hover);cursor:not-allowed }
.ax-switch { -webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--ax-border-strong);border-radius:var(--ax-radius-pill);cursor:pointer;width:36px;height:20px;transition:background var(--ax-motion-fast) var(--ax-ease-standard);flex:none;position:relative }
.ax-switch:after { content:"";background:var(--ax-surface-solid);width:16px;height:16px;box-shadow:var(--ax-shadow-sm);transition:transform var(--ax-motion-fast) var(--ax-ease-standard);top:2px;border-radius:50%;position:absolute;inset-inline-start:2px }
.ax-switch:checked { background:var(--ax-accent) }
.ax-switch:checked:after { transform:translate(16px) }
[dir=rtl] .ax-switch:checked:after { transform:translate(-16px) }
.ax-switch:focus-visible { box-shadow:var(--ax-focus-shadow);outline:none }
.ax-switch:disabled { background:var(--ax-fill-hover);cursor:not-allowed }
.ax-switch--sm { width:30px;height:16px }
.ax-switch--sm:after { width:12px;height:12px }
.ax-switch--sm:checked:after { transform:translate(14px) }
.ax-switch--lg { width:44px;height:24px }
.ax-switch--lg:after { width:20px;height:20px }
.ax-switch--lg:checked:after { transform:translate(20px) }
.ax-switch,.ax-switch:after { transition:none }
.ax-toggle { justify-content:space-between;align-items:center;gap:var(--ax-space-3);cursor:pointer;display:flex }
.ax-toggle__label { font-size:var(--ax-text-sm);color:var(--ax-text) }
.ax-toggle__input { clip-path:inset(50%);block-size:1px;inline-size:1px;position:absolute;overflow:hidden }
.ax-toggle__track { background:var(--ax-border-strong);border-radius:var(--ax-radius-pill);block-size:22px;inline-size:40px;transition:background var(--ax-motion-fast) var(--ax-ease-standard);flex:none;position:relative }
.ax-toggle__thumb { border-radius:var(--ax-radius-pill);block-size:18px;inline-size:18px;transition:transform var(--ax-motion-fast) var(--ax-ease-emphasized);background:#fff;position:absolute;inset-block-start:2px;inset-inline-start:2px;box-shadow:0 1px 2px #0000004d }
.ax-toggle__input:checked+.ax-toggle__track { background:var(--ax-accent) }
.ax-toggle__input:checked+.ax-toggle__track .ax-toggle__thumb { transform:translate(18px) }
[dir=rtl] .ax-toggle__input:checked+.ax-toggle__track .ax-toggle__thumb { transform:translate(-18px) }
.ax-toggle__input:focus-visible+.ax-toggle__track { outline:2px solid var(--ax-focus-ring);outline-offset:2px }

/* ───────── الشارات (26 قاعدة) ───────── */
.ax-badge { --_badge-50:var(--ax-fill-hover);--_badge-500:var(--ax-text-muted);align-items:center;gap:var(--ax-space-1);height:20px;padding-inline:var(--ax-space-2);font-size:var(--ax-text-xs);font-weight:var(--ax-weight-semibold);white-space:nowrap;border-radius:var(--ax-radius-xs);color:var(--_badge-500);background:var(--_badge-50);border:1px solid #0000;line-height:1;display:inline-flex }
.ax-badge__dot { background:currentColor;border-radius:50%;width:6px;height:6px }
.ax-badge__icon { width:var(--ax-icon-xs);height:var(--ax-icon-xs) }
.ax-badge__remove { color:currentColor;cursor:pointer;opacity:.7;background:0 0;border:0;margin-inline-start:2px;display:inline-flex }
.ax-badge__remove svg { width:var(--ax-icon-xs);height:var(--ax-icon-xs) }
.ax-badge__remove:hover { color:var(--ax-danger-500);opacity:1 }
.ax-badge--success { --_badge-50:var(--ax-success-50);--_badge-500:var(--ax-success-500) }
.ax-badge--warning { --_badge-50:var(--ax-warning-50);--_badge-500:var(--ax-warning-500) }
.ax-badge--danger { --_badge-50:var(--ax-danger-50);--_badge-500:var(--ax-danger-500) }
.ax-badge--info { --_badge-50:var(--ax-info-50);--_badge-500:var(--ax-info-500) }
.ax-badge--accent { --_badge-50:var(--ax-accent-wash);--_badge-500:var(--ax-accent) }
.ax-badge--neutral { --_badge-50:var(--ax-fill-hover);--_badge-500:var(--ax-text-muted) }
.ax-badge--soft { color:var(--_badge-500);background:var(--_badge-50) }
.ax-badge--solid { color:#fff;background:var(--_badge-500) }
.ax-badge--solid.ax-badge--accent { color:var(--ax-on-accent);background:var(--ax-accent) }
.ax-badge--outline { color:var(--_badge-500);border-color:var(--_badge-500);background:0 0 }
.ax-badge--pill,.ax-badge--chip,.ax-badge--count { border-radius:var(--ax-radius-pill) }
.ax-badge--count { min-width:18px;height:18px;font-family:var(--ax-font-mono);font-variant-numeric:tabular-nums;color:var(--ax-on-accent);background:var(--ax-accent);justify-content:center;padding-inline:5px }
.ax-badge--count.ax-badge--danger { color:#fff;background:var(--ax-danger-500) }
.ax-badge--sm { height:16px;padding-inline:var(--ax-space-1);font-size:var(--ax-text-2xs) }
.ax-badge--chip,.ax-badge--filter { cursor:pointer }
.ax-badge--filter:hover { background:var(--ax-fill-active) }
.ax-badge--filter[aria-pressed=true],.ax-badge--filter.is-selected { color:var(--ax-accent);background:var(--ax-accent-wash);border-color:#0000 }
.ax-badge-count { block-size:16px;min-inline-size:16px;font-family:var(--ax-font-mono);font-size:10px;font-weight:var(--ax-weight-semibold);color:var(--ax-on-accent);background:var(--ax-accent);border-radius:var(--ax-radius-pill);box-shadow:0 0 0 2px var(--ax-header-bg,var(--ax-surface-raised));pointer-events:none;justify-content:center;align-items:center;padding-inline:4px;line-height:1;display:inline-flex;position:absolute;inset-block-start:2px;inset-inline-end:2px }
.ax-badge-count--dot { color:#0000;block-size:8px;min-inline-size:8px;padding:0;font-size:0 }
.ax-appswitch__item .ax-badge { flex:none }

/* ───────── الصور الرمزيّة (25 قاعدة) ───────── */
.ax-avatar { --_av-size:36px;--_av-status:8px;width:var(--_av-size);height:var(--_av-size);font-size:calc(var(--_av-size) * .38);font-weight:var(--ax-weight-semibold);color:var(--ax-text-muted);background:var(--ax-fill-active);border-radius:var(--ax-radius-pill);-webkit-user-select:none;user-select:none;flex:none;justify-content:center;align-items:center;display:inline-flex;position:relative;overflow:hidden }
.ax-avatar__img { object-fit:cover;border-radius:inherit;width:100%;height:100% }
img.ax-avatar { object-fit:cover }
.ax-avatar__initials { line-height:1 }
.ax-avatar__icon { width:60%;height:60%;color:var(--ax-text-subtle) }
.ax-avatar--squircle { border-radius:var(--ax-radius-sm) }
.ax-avatar--xs { --_av-size:20px;--_av-status:6px }
.ax-avatar--sm { --_av-size:28px;--_av-status:8px }
.ax-avatar--md { --_av-size:36px }
.ax-avatar--lg { --_av-size:48px;--_av-status:10px }
.ax-avatar--xl { --_av-size:64px;--_av-status:12px }
.ax-avatar--2xl { --_av-size:96px;--_av-status:14px }
.ax-avatar--ringed { box-shadow:0 0 0 2px var(--ax-surface-solid),0 0 0 3px var(--ax-border-strong) }
.ax-avatar.is-current,.ax-avatar--selected { box-shadow:0 0 0 2px var(--ax-surface-solid),0 0 0 4px var(--ax-accent) }
.ax-avatar__status { width:var(--_av-status);height:var(--_av-status);box-shadow:0 0 0 2px var(--ax-surface-solid);background:var(--ax-text-subtle);border-radius:50%;position:absolute;inset-block-end:0;inset-inline-end:0 }
.ax-avatar__status--online { background:var(--ax-viz-emerald) }
.ax-avatar__status--away { background:var(--ax-viz-amber) }
.ax-avatar__status--busy { background:var(--ax-viz-red) }
.ax-avatar__status--offline { background:var(--ax-text-subtle) }
.ax-avatar-group { align-items:center;display:inline-flex }
.ax-avatar-group>.ax-avatar:not(:first-child) { margin-inline-start:-10px }
.ax-avatar-group>.ax-avatar { box-shadow:0 0 0 2px var(--ax-surface-solid) }
.ax-avatar__overflow { font-size:var(--ax-text-xs);color:var(--ax-text-muted);background:var(--ax-fill-active);cursor:pointer;border:0 }
.ax-notif__chip .ax-avatar { --_av-size:34px }
.ax-profile__card .ax-avatar { --_av-size:40px }

/* ───────── التقدّم (20 قاعدة) ───────── */
.ax-progress { --_p-h:6px;align-items:center;gap:var(--ax-space-3);display:flex }
.ax-progress__track { height:var(--_p-h);background:var(--ax-fill-hover);border-radius:var(--ax-radius-pill);flex:auto;position:relative;overflow:hidden }
.ax-progress__fill { background:var(--ax-gradient-accent);border-radius:inherit;width:0;height:100%;transition:width var(--ax-motion-base) var(--ax-ease-standard) }
.ax-progress__value { text-align:end;min-width:3ch;font-size:var(--ax-text-xs);font-variant-numeric:tabular-nums;color:var(--ax-text-muted);flex:none }
.ax-progress--xs { --_p-h:4px }
.ax-progress--sm { --_p-h:6px }
.ax-progress--md { --_p-h:8px }
.ax-progress--lg { --_p-h:12px }
.ax-progress--success .ax-progress__fill { background:var(--ax-success-500) }
.ax-progress--warning .ax-progress__fill { background:var(--ax-warning-500) }
.ax-progress--danger .ax-progress__fill { background:var(--ax-danger-500) }
.ax-progress--striped .ax-progress__fill { background-image:linear-gradient(45deg,#fff3 25%,#0000 25%,#0000 50%,#fff3 50%,#fff3 75%,#0000 75%);background-size:16px 16px;background-color:var(--ax-accent) }
.ax-progress--animated .ax-progress__fill { animation:ax-progress-stripe 1s var(--ax-ease-linear) infinite }
.ax-progress--indeterminate .ax-progress__fill { background:var(--ax-accent);width:35%;animation:ax-progress-indeterminate 1.4s var(--ax-ease-standard) infinite }
.ax-progress--stacked .ax-progress__track,.ax-progress--segmented .ax-progress__track { gap:2px;display:flex }
.ax-progress--circle { display:inline-flex;position:relative }
.ax-progress--circle .ax-progress__ring-track { stroke:var(--ax-fill-hover);fill:none }
.ax-progress--circle .ax-progress__ring-fill { stroke:var(--ax-accent);fill:none;stroke-linecap:round;transition:stroke-dashoffset var(--ax-motion-base) var(--ax-ease-standard) }
.ax-progress__center { font-family:var(--ax-font-mono);font-variant-numeric:tabular-nums;color:var(--ax-text-strong);justify-content:center;align-items:center;display:flex;position:absolute;top:0;right:0;bottom:0;left:0 }
.ax-progress--animated .ax-progress__fill,.ax-progress--indeterminate .ax-progress__fill { animation:none }

/* ───────── المقاطع (11 قاعدة) ───────── */
.ax-segment { align-items:center;gap:var(--ax-space-1);padding:var(--ax-space-1);background:var(--ax-fill-hover);border:1px solid var(--ax-border);border-radius:var(--ax-radius-md);display:inline-flex }
.ax-segment__option { justify-content:center;align-items:center;gap:var(--ax-space-1);min-height:30px;padding:0 var(--ax-space-3);font-size:var(--ax-text-xs);font-weight:var(--ax-weight-medium);color:var(--ax-text-muted);border-radius:var(--ax-radius-sm);cursor:pointer;transition:background var(--ax-motion-instant) var(--ax-ease-standard),color var(--ax-motion-instant) var(--ax-ease-standard);background:0 0;border:0;display:inline-flex }
.ax-segment__option svg { width:var(--ax-icon-sm);height:var(--ax-icon-sm) }
.ax-segment__option:hover { color:var(--ax-text-strong) }
.ax-segment__option[aria-pressed=true],.ax-segment__option.is-active,.ax-segment__option[aria-checked=true] { color:var(--ax-accent);background:var(--ax-accent-wash);box-shadow:var(--ax-shadow-sm) }
.ax-segmented { background:var(--ax-surface-subtle);border:1px solid var(--ax-border);border-radius:var(--ax-radius-md);grid-auto-columns:1fr;grid-auto-flow:column;gap:2px;padding:3px;display:grid }
.ax-segmented__btn { justify-content:center;align-items:center;gap:var(--ax-space-1);padding:var(--ax-space-2) var(--ax-space-2);font-size:var(--ax-text-xs);font-weight:var(--ax-weight-medium);color:var(--ax-text-muted);border-radius:var(--ax-radius-sm);cursor:pointer;transition:background var(--ax-motion-fast) var(--ax-ease-standard),color var(--ax-motion-fast) var(--ax-ease-standard);background:0 0;border:0;display:inline-flex }
.ax-segmented__btn .ax-icon { inline-size:var(--ax-icon-sm);block-size:var(--ax-icon-sm) }
.ax-segmented__btn:hover { color:var(--ax-text-strong);background:var(--ax-fill-hover) }
.ax-segmented__btn.is-active { color:var(--ax-accent);background:var(--ax-accent-wash);box-shadow:inset 0 0 0 1px var(--ax-accent) }

/* ───────── الألسنة (27 قاعدة) ───────── */
.ax-tabs { flex-direction:column;display:flex }
.ax-tabs__list { align-items:center;gap:var(--ax-space-1);border-bottom:1px solid var(--ax-border);display:flex;position:relative }
.ax-tabs__tab { align-items:center;gap:var(--ax-space-2);min-height:40px;padding:var(--ax-space-2) var(--ax-space-3);font-size:var(--ax-text-sm);font-weight:var(--ax-weight-medium);color:var(--ax-text-muted);cursor:pointer;transition:color var(--ax-motion-fast) var(--ax-ease-standard);background:0 0;border:0;display:inline-flex;position:relative }
.ax-tabs__icon { width:var(--ax-icon-sm);height:var(--ax-icon-sm) }
.ax-tabs__badge { margin-inline-start:var(--ax-space-1) }
.ax-tabs__tab:hover { color:var(--ax-text) }
.ax-tabs__tab[aria-selected=true],.ax-tabs__tab.is-active { color:var(--ax-text-strong) }
.ax-tabs__tab:disabled,.ax-tabs__tab[aria-disabled=true] { color:var(--ax-text-disabled);pointer-events:none }
.ax-tabs__indicator { height:2px;width:var(--ax-tabs-ind-w,0);transform:translate(var(--ax-tabs-ind-x,0));background:var(--ax-accent);transition:transform var(--ax-motion-base) var(--ax-ease-standard),width var(--ax-motion-base) var(--ax-ease-standard);border-radius:2px;position:absolute;inset-block-end:-1px;inset-inline-start:0 }
.ax-tabs__panel { padding-top:var(--ax-space-5) }
.ax-tabs__panel[hidden] { display:none }
.ax-tabs--pill .ax-tabs__list { gap:var(--ax-space-2);border-bottom:0 }
.ax-tabs--pill .ax-tabs__tab { border-radius:var(--ax-radius-pill);padding-inline:var(--ax-space-4) }
.ax-tabs--pill .ax-tabs__tab[aria-selected=true],.ax-tabs--pill .ax-tabs__tab.is-active { color:var(--ax-accent);background:var(--ax-accent-wash) }
.ax-tabs--pill .ax-tabs__indicator { display:none }
.ax-tabs--segmented .ax-tabs__list { gap:var(--ax-space-1);padding:var(--ax-space-1);background:var(--ax-fill-hover);border:1px solid var(--ax-border);border-radius:var(--ax-radius-md) }
.ax-tabs--segmented .ax-tabs__tab { border-radius:var(--ax-radius-sm) }
.ax-tabs--segmented .ax-tabs__tab[aria-selected=true],.ax-tabs--segmented .ax-tabs__tab.is-active { color:var(--ax-accent);background:var(--ax-accent-wash);box-shadow:var(--ax-shadow-sm) }
.ax-tabs--segmented .ax-tabs__indicator { display:none }
.ax-tabs--vertical { gap:var(--ax-space-5);flex-direction:row }
.ax-tabs--vertical .ax-tabs__list { border-bottom:0;border-inline-start:1px solid var(--ax-border);flex-direction:column;align-items:stretch }
.ax-tabs--vertical .ax-tabs__tab { justify-content:flex-start }
.ax-tabs--vertical .ax-tabs__indicator { width:2px;height:var(--ax-tabs-ind-h,0);transform:translateY(var(--ax-tabs-ind-y,0));transition:transform var(--ax-motion-base) var(--ax-ease-standard),height var(--ax-motion-base) var(--ax-ease-standard);inset-block-start:0;inset-inline-start:-1px }
.ax-tabs--vertical .ax-tabs__panel { flex:auto;padding-top:0 }
.ax-tabs--scrollable .ax-tabs__list { flex-wrap:nowrap;overflow-x:auto }
.ax-tabs--scrollable .ax-tabs__tab { white-space:nowrap;flex:none }
.ax-tabs--scrollable .ax-tabs__list::-webkit-scrollbar { display:none }

/* ───────── لوح المسار (من deals.html) (15 قاعدة) ───────── */
.ax-drawer-scrim { position:fixed; inset:0; z-index:120; display:flex; justify-content:flex-end; background:var(--ax-backdrop); -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); }
.ax-pl-col { flex:0 0 300px; width:300px; display:flex; flex-direction:column; background:var(--ax-surface-subtle); border:1px solid var(--ax-border); border-radius:var(--ax-radius-lg); padding:var(--ax-space-3); transition:background var(--ax-motion-fast) var(--ax-ease-standard), box-shadow var(--ax-motion-fast) var(--ax-ease-standard); }
.ax-pl-col--over { background:var(--ax-accent-wash); box-shadow:inset 0 0 0 2px var(--ax-accent); }
.ax-pl-col__body { display:flex; flex-direction:column; gap:var(--ax-space-3); min-height:40px; }
.ax-pl-card { position:relative; display:flex; flex-direction:column; gap:var(--ax-space-2); padding:var(--ax-space-3); background:var(--ax-surface-solid); border:1px solid var(--ax-border); border-radius:var(--ax-radius-md); box-shadow:var(--ax-shadow-sm); cursor:grab; text-align:start; transition:box-shadow var(--ax-motion-fast) var(--ax-ease-standard), transform var(--ax-motion-fast) var(--ax-ease-standard); }
.ax-pl-card:hover { box-shadow:var(--ax-shadow-md); }
.ax-pl-card:focus-visible { outline:none; box-shadow:0 0 0 2px var(--ax-canvas), 0 0 0 4px var(--ax-focus-ring); }
.ax-pl-card:active { cursor:grabbing; }
.ax-pl-card--ghost { opacity:.4; }
.ax-pl-card__title { color:var(--ax-text-strong); font-size:var(--ax-text-sm); font-weight:var(--ax-weight-medium); line-height:1.4; }
.ax-pl-add { display:inline-flex; align-items:center; gap:var(--ax-space-2); width:100%; padding:var(--ax-space-2) var(--ax-space-3); font-size:var(--ax-text-sm); color:var(--ax-text-muted); background:transparent; border:1px dashed var(--ax-border-strong); border-radius:var(--ax-radius-md); cursor:pointer; transition:color var(--ax-motion-fast), background var(--ax-motion-fast); }
.ax-pl-add:hover { color:var(--ax-accent); background:var(--ax-fill-hover); }
.ax-slide-in { animation:axSlideIn .18s var(--ax-ease-standard); }
@keyframes axSlideIn { from { transform:translateX(24px); opacity:0; } to { transform:translateX(0); opacity:1; } }
@media (prefers-reduced-motion: reduce){ .ax-pl-card, .ax-slide-in { transition:none; animation:none; } }
/* ── ٣ · صقل الاتّجاه والعربيّة ───────────────────────────────────────────
 * القالب مكتوب لـLTR. هذه هي المواضع الوحيدة التي يلزم فيها تصحيح. */
.ax-pl-card { text-align: start; }              /* كان left */
.ax-page-head__title,
.ax-pl-card__title { text-wrap: balance; }

/* الأرقام في العربيّة تُقرأ لاتينيّةً ومصطفّة — والعمود الماليّ يُقارَن بصريًّا. */
.ax-num { font-variant-numeric: tabular-nums; }

/* حركة أقلّ لمن يطلبها */
@media (prefers-reduced-motion: reduce) {
  .ax-btn, .ax-pl-card, .ax-progress__fill, .ax-tabs__indicator { transition: none; }
}

/* ── ٤ · جسر الأيقونات: SVG القالب ← رموز أثير الخطّيّة ──────────────────
 * القالب يضبط مقاس أيقوناته بـ`width/height` لأنّها عناصر SVG. وأثير يستعمل
 * Material Symbols — وهي **محارف خطّ**، لا يضبطها الصندوق بل `font-size`.
 * فبلا هذه القاعدة يجلس محرفٌ 20px داخل صندوق 16px: لا يتمركز، ويُزيح
 * سطر الزرّ، ويبدو أحيانًا غائبًا. القاعدة تُبقي مقاسات القالب وتُترجمها
 * إلى الوحدة التي تفهمها الرموز الخطّيّة. */
.ax-btn__icon.icon,
.ax-tabs__icon.icon,
.ax-badge__icon.icon,
.ax-avatar__icon.icon,
.ax-segment__option > .icon,
.ax-pl-add > .icon,
.ax-pl-card .icon,
.ax-card .icon {
  inline-size: auto;
  block-size: auto;
  line-height: 1;
  flex: 0 0 auto;
}
.ax-btn__icon.icon        { font-size: var(--_btn-icon, 16px); }
.ax-segment__option > .icon { font-size: var(--ax-icon-sm); }
.ax-pl-add > .icon        { font-size: var(--ax-icon-sm); }
.ax-pl-card .icon         { font-size: 13px; }
.ax-avatar .icon          { font-size: calc(var(--_av-size, 36px) * .55); }
.ax-badge .icon           { font-size: var(--ax-icon-xs); }

/* زرّ الأيقونة المفردة: المربّع من القالب، والمحرف يتمركز داخله. */
.ax-btn--icon { align-items: center; justify-content: center; }

/* ───────── الخطّ الزمنيّ (من CSS القالب) ───────── */
.ax-timeline { margin:0;padding:0;list-style:none;position:relative }
.ax-timeline__item { gap:var(--ax-space-4);padding-bottom:var(--ax-space-5);display:flex;position:relative }
.ax-timeline__item:last-child { padding-bottom:0 }
.ax-timeline__marker { z-index:1;border-radius:var(--ax-radius-pill);width:28px;height:28px;color:var(--ax-text-muted);background:var(--ax-surface-subtle);border:1px solid var(--ax-border);flex:none;justify-content:center;align-items:center;display:inline-flex;position:relative }
.ax-timeline__marker svg { width:var(--ax-icon-sm);height:var(--ax-icon-sm) }
.ax-timeline__item:not(:last-child) .ax-timeline__marker:before { content:"";width:1px;height:calc(var(--ax-space-5) + var(--ax-space-2));background:var(--ax-border);top:100%;position:absolute;inset-inline-start:50%;transform:translate(-50%) }
[dir=rtl] .ax-timeline__item:not(:last-child) .ax-timeline__marker:before { transform:translate(50%) }
.ax-timeline__content { flex:auto;min-width:0;padding-top:2px }
.ax-timeline__time { font-family:var(--ax-font-mono);font-size:var(--ax-text-xs);color:var(--ax-text-subtle) }
.ax-timeline__title { font-weight:var(--ax-weight-medium);color:var(--ax-text-strong);margin:2px 0 0 }
.ax-timeline__body { margin-top:var(--ax-space-1);font-size:var(--ax-text-sm);color:var(--ax-text-muted) }
.ax-timeline__item.is-current .ax-timeline__marker { color:var(--ax-on-accent);background:var(--ax-accent);border-color:#0000 }
.ax-timeline__item--success .ax-timeline__marker { color:#fff;background:var(--ax-success-500);border-color:#0000 }
.ax-timeline__item--danger .ax-timeline__marker { color:#fff;background:var(--ax-danger-500);border-color:#0000 }
.ax-timeline__item--pending .ax-timeline__marker { color:var(--ax-text-subtle) }
.ax-timeline__item--pending:not(:last-child) .ax-timeline__marker:before { background:repeating-linear-gradient(var(--ax-border) 0 4px,transparent 4px 8px) }

/* ── مشغّل التسجيل ────────────────────────────────────────────────────────
 * لا مشغّل صوت في Vireo، فبُني بلغته: نفس الأسطح والحدود وأنصاف الأقطار.
 * `<audio controls>` أصليّ عمدًا — مشغّل مُخصَّص يعني إعادة بناء إتاحة
 * لوحة المفاتيح وقارئ الشاشة من الصفر، والمكسب البصريّ لا يوازي الكلفة. */
.ax-rec {
  display: flex; align-items: center; gap: var(--ax-space-2);
  margin-top: var(--ax-space-2); padding: var(--ax-space-2);
  background: var(--ax-surface-subtle);
  border: 1px solid var(--ax-border);
  border-radius: var(--ax-radius-md);
}
.ax-rec audio { block-size: 32px; inline-size: 100%; min-inline-size: 0; }
.ax-rec__meta {
  font-family: var(--ax-font-mono); font-size: var(--ax-text-2xs);
  color: var(--ax-text-subtle); white-space: nowrap; flex: 0 0 auto;
}
/* «مسجَّلة ولا تملك تشغيلها» — حالة صريحة لا زرّ معطَّل بلا سبب. */
.ax-rec--locked {
  color: var(--ax-text-subtle); font-size: var(--ax-text-xs);
  justify-content: center;
}
.ax-tl-meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 4px; }

/* ════════════════════════════════════════════════════════════════════════════
 * ٥ · اللون الأساس في الثيم الداكن — قياسٌ لا ذوق
 *
 * كان `--at-accent: #2a5fcc` في الثيمين معًا. وهو صحيح على الأبيض (تباين
 * ٥٫٨٢) و**خاطئ على الداكن: ٢٫٩٩** — دون العتبة ٤٫٥. فكان كلّ رابط وعنصر
 * نشط ونصّ باللون الأساس يبهت على `#161a23`.
 *
 * والرفع وحده لا يكفي: اللون **يملأ** الأزرار الأساسيّة أيضًا، ونصّها أبيض.
 * `#6aa3ff` يعطي أبيضَ فوقه ٢٫٥٣ — أسوأ ممّا كان.
 *
 * فالحلّ هو نمط الثيم الداكن القياسيّ (وهو ما يفعله القالب في لقطاته):
 * **ملءٌ فاتح ونصٌّ داكن**.
 *
 *   #6aa3ff على السطح الداكن  → 6.88 ✓
 *   نصّ داكن (#0a0c11) فوقه    → 7.73 ✓
 *
 * ولا يُمسّ الثيم الفاتح إطلاقًا.
 * ════════════════════════════════════════════════════════════════════════════ */

/* 🔴 الحالتان معًا إلزاميّتان: الاختيار الصريح، وتفضيل النظام دون اختيار.
 * كتلةٌ واحدة تترك نصف المستخدمين على اللون الخاطئ. */
:root[data-theme="dark"] {
  --at-accent:         #6aa3ff;
  --at-accent-hover:   #8ab8ff;
  --at-accent-on:      #0a0c11;   /* نصّ داكن فوق الملء الفاتح */
  --at-accent-soft-bg: #16233a;
  --chart-1:           #6aa3ff;   /* سلسلة الرسم الأولى تتبع اللون الأساس */
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --at-accent:         #6aa3ff;
    --at-accent-hover:   #8ab8ff;
    --at-accent-on:      #0a0c11;
    --at-accent-soft-bg: #16233a;
    --chart-1:           #6aa3ff;
  }
}