/* theme.css — نظامُ تصميمِ الإصدارِ الثاني.
 *
 * قواعدُه الثابتة:
 *  1) كلُّ قاعدةٍ مقصورةٌ على .t2 فلا يمسُّ الإصدارَ الأولَ شيء.
 *  2) المسافاتُ من سُلَّمٍ واحد: xs / sm / md / lg / xl / xxl. لا رقمَ عشوائيًّا في صفحة.
 *  3) مُدمَجٌ ومُتنفِّس: البطاقةُ بحجمِ محتواها، والفصلُ البصريُّ بالخطِّ والظلِّ لا بالفراغ.
 *  4) الجوّالُ أولًا: القاعدةُ للشاشةِ الصغيرة، والتوسُّعُ بـ min-width.
 */

/* ===================== رموزُ الهويّةِ الموحَّدة (v13) — المصدرُ الوحيدُ لكلِّ متغيّرات --t2-* =====================
 * جُمِعَت هنا من theme/identity/brand/system بالقيمِ الفعّالةِ نفسِها؛ لا يُعرَّفُ رمزٌ عامٌّ في ملفٍّ آخر.
 * تسري على الجذرِ و.t2 والطبقاتِ العائمةِ المُلحَقةِ بـ body (الإشعارات #toast-root ولوحات .t2-float) ليصلَها الوضعُ الليليّ. */
:root, .t2, .t2-float, #toast-root {
  --t2-xs: 4px;
  --t2-sm: 8px;
  --t2-md: 12px;
  --t2-lg: 18px;
  --t2-xl: 26px;
  --t2-xxl: 38px;
  --t2-s1: 4px;
  --t2-s2: 8px;
  --t2-s3: 12px;
  --t2-s4: 18px;
  --t2-s5: 26px;
  --t2-s6: 38px;
  --t2-s7: 52px;
  --t2-r-pill: 999px;
  --t2-on-dark: #eaf3f7;
  --t2-on-dark-2: rgba(234, 243, 247, .74);
  --t2-on-dark-3: rgba(234, 243, 247, .48);
  --t2-fw-r: 400;
  --t2-fw-m: 600;
  --t2-fw-b: 700;
  --t2-fw-x: 800;
  --t2-ctl-sm: 2.25rem;
  --t2-ctl-lg: 3.25rem;
  --t2-z-sticky: 40;
  --t2-z-side: 45;
  --t2-z-head: 60;
  --t2-z-drop: 80;
  --t2-z-overlay: 90;
  --t2-z-modal: 100;
  --t2-z-pop: 1000;
  --t2-z-toast: 1100;
  --t2-st-ok: #0f7a37;
  --t2-st-ok-bg: var(--t2-ok-wash);
  --t2-st-ok-line: #cfeeda;
  --t2-st-warn: #a15c05;
  --t2-st-warn-bg: var(--t2-warn-wash);
  --t2-st-warn-line: #f4e2c4;
  --t2-st-danger: #a81c1c;
  --t2-st-danger-bg: var(--t2-danger-wash);
  --t2-st-danger-line: #f6cfcf;
  --t2-st-info: #1d4ed8;
  --t2-st-info-bg: var(--t2-info-wash);
  --t2-st-info-line: #d3e0fd;
  --t2-st-none: var(--t2-muted);
  --t2-st-none-bg: var(--t2-surface-2);
  --t2-st-none-line: var(--t2-line);
  --t2-w-regular: 400;
  --t2-w-medium: 500;
  --t2-w-semibold: 600;
  --t2-w-bold: 700;
  --t2-display-fs: 2rem;
  --t2-display-fw: 700;
  --t2-display-lh: 1.25;
  --t2-display-ls: -.01em;
  --t2-display-c: var(--t2-ink);
  --t2-h1-fw: 700;
  --t2-h1-lh: 1.3;
  --t2-h1-ls: -.005em;
  --t2-h1-c: var(--t2-ink);
  --t2-h2-fw: 600;
  --t2-h2-lh: 1.4;
  --t2-h2-ls: 0;
  --t2-h2-c: var(--t2-ink);
  --t2-h3-fw: 600;
  --t2-h3-lh: 1.45;
  --t2-h3-ls: 0;
  --t2-h3-c: var(--t2-ink);
  --t2-blg-fs: 1rem;
  --t2-blg-fw: 400;
  --t2-blg-lh: 1.75;
  --t2-blg-c: var(--t2-ink-2);
  --t2-body-fs: .9375rem;
  --t2-body-fw: 400;
  --t2-body-lh: 1.65;
  --t2-body-c: var(--t2-ink);
  --t2-bsm-fs: .875rem;
  --t2-bsm-fw: 400;
  --t2-bsm-lh: 1.6;
  --t2-bsm-c: var(--t2-ink-2);
  --t2-label-fs: .8125rem;
  --t2-label-fw: 500;
  --t2-label-lh: 1.4;
  --t2-label-ls: .005em;
  --t2-label-c: var(--t2-ink-2);
  --t2-cap-fs: .75rem;
  --t2-cap-fw: 400;
  --t2-cap-lh: 1.45;
  --t2-cap-c: var(--t2-muted);
  --t2-metric-fs: 1.625rem;
  --t2-metric-fw: 600;
  --t2-metric-lh: 1.15;
  --t2-metric-ls: -.01em;
  --t2-metric-c: var(--t2-ink);
  --t2-t-display: var(--t2-display-fs);
  --t2-ease-std: cubic-bezier(.2, 0, 0, 1);
  --t2-ease-out: cubic-bezier(.16, 1, .3, 1);
  --t2-d1: 120ms;
  --t2-d2: 180ms;
  --t2-d3: 260ms;
  --t2-ease: var(--t2-ease-std);
  --t2-fast: var(--t2-d1);
  --t2-slow: var(--t2-d3);
  --t2-gutter: 28px;
  --t2-gap-section: 24px;
  --t2-gap-block: 16px;
  --t2-gap-inline: 12px;
  --t2-pad-card: 18px 20px;
  --t2-accent-grad: linear-gradient(90deg, #0AA5AD 0%, #0B8F96 55%, #0A1F44 100%);
  --t2-lift: translateY(-2px);
  --t2-hover-ring: 0 0 0 1px rgba(10, 165, 173, .35);
  --t2-navy: #0A1F44;
  --t2-navy-2: #132E5E;
  --t2-navy-3: #1D3F78;
  --t2-brand: #0AA5AD;
  --t2-brand-2: #0B8F96;
  --t2-brand-3: #067A82;
  --t2-brand-ink: #ffffff;
  --t2-brand-wash: #E2F4F5;
  --t2-gold: #FFC861;
  --t2-amber: #F0962A;
  --t2-bg: #F4F7FA;
  --t2-bg-2: #E9EFF5;
  --t2-surface: #ffffff;
  --t2-surface-2: #F7F9FC;
  --t2-surface-3: #EEF3F8;
  --t2-elev: #ffffff;
  --t2-input: #ffffff;
  --t2-ink: #0A1F44;
  --t2-ink-2: #132E5E;
  --t2-muted: #566A88;
  --t2-line: #D4DEEA;
  --t2-line-2: #BFCDDE;
  --t2-ok: #12795C;
  --t2-ok-wash: #E4F5EE;
  --t2-warn: #8A4E08;
  --t2-warn-wash: #FFF1DC;
  --t2-danger: #B3261E;
  --t2-danger-wash: #FDECEA;
  --t2-info: #132E5E;
  --t2-info-wash: #E6EEF8;
  --t2-sh-1: 0 1px 2px rgba(10, 31, 68, .06);
  --t2-sh-2: 0 10px 28px rgba(10, 31, 68, .08);
  --t2-sh-3: 0 18px 44px rgba(10, 31, 68, .16), 0 2px 6px rgba(10, 31, 68, .08);
  --t2-ring: 0 0 0 3px rgba(10, 165, 173, .25);
  --t2-r-xs: 10px;
  --t2-r: 14px;
  --t2-r-lg: 20px;
  --t2-radius-card: 20px;
  --t2-ctl-h: 2.75rem;
  --t2-search-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23566A88' d='M232.49,215.51,185,168a92.12,92.12,0,1,0-17,17l47.53,47.54a12,12,0,0,0,17-17ZM44,112a68,68,0,1,1,68,68A68.07,68.07,0,0,1,44,112Z'/%3E%3C/svg%3E");
  --t2-chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23566A88' d='M216.49,104.49l-80,80a12,12,0,0,1-17,0l-80-80a12,12,0,0,1,17-17L128,159l71.51-71.52a12,12,0,0,1,17,17Z'/%3E%3C/svg%3E");
  --t2-ctl: var(--t2-ctl-h);
  --t2-chev-m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='black' d='M216.49,104.49l-80,80a12,12,0,0,1-17,0l-80-80a12,12,0,0,1,17-17L128,159l71.51-71.52a12,12,0,0,1,17,17Z'/%3E%3C/svg%3E");
  --b-r: 18px;
  --b-r-s: 12px;
  --b-rail: 76px;
  --b-sh: 0 1px 2px rgba(10,31,68,.05), 0 8px 24px -12px rgba(10,31,68,.14);
  --i-sp-1: 4px;
  --i-sp-2: 8px;
  --i-sp-3: 12px;
  --i-sp-4: 16px;
  --i-sp-5: 20px;
  --i-sp-6: 24px;
  --i-r-sm: 8px;
  --i-r-md: 12px;
  --i-r-lg: 16px;
  --i-card-pad: var(--i-sp-5);
  --i-ctl: 40px;
  --i-card-bg: var(--t2-surface);
  --i-card-line: var(--t2-line);
  --i-sh: 0 1px 2px rgba(10, 31, 68, .04), 0 4px 16px rgba(10, 31, 68, .04);
  --t2-ff-display: Alexandria, "IBM Plex Sans Arabic", sans-serif;
  --t2-ff-text: "IBM Plex Sans Arabic", sans-serif;
  --t2-ff-metric: var(--t2-ff-display);
  --id-body: var(--t2-ff-text);
  --id-display: var(--t2-ff-display);
  --t2-font: var(--t2-ff-text);
  --t2-num: var(--t2-ff-metric);
  --t2-display: var(--t2-ff-display);
  --t2-t-h1: 1.85rem;
  --t2-t-h2: 1.45rem;
  --t2-t-h3: 1rem;
  --t2-t-body: 1rem;
  --t2-t-label: .92rem;
  --t2-t-small: .86rem;
  --t2-t-caption: .8rem;
  --t2-h1-fs: 1.85rem;
  --t2-h2-fs: 1.45rem;
  --t2-h3-fs: 1rem;
  --t2-lh-body: 1.9;
  --t2-lh: 1.75;
  --t2-lh-tight: 1.45;
  --t2-ic-nav: 36px;
  --t2-ic-head: 34px;
  --t2-ic-card: 44px;
  --t2-ic-lg: 52px;
  --t2-fs-2xs: var(--t2-t-caption);
  --t2-fs-xs: var(--t2-t-small);
  --t2-fs-sm: var(--t2-t-label);
  --t2-fs-md: var(--t2-t-body);
  --t2-fs-lg: 1.05rem;
  --t2-fs-xl: 1.2rem;
  --t2-fs-2xl: var(--t2-t-h2);
  --i-fs-xs: var(--t2-t-caption);
  --i-fs-sm: var(--t2-t-small);
  --i-fs-md: var(--t2-t-label);
  --i-fs-lg: 1.05rem;
  --i-fs-xl: 1.2rem;
  --id-navy: #0A1F44;
  --id-gold: #FFC861;
  --id-teal: #0AA5AD;
  --id-paper: #F4F7FA;
  --id-line: #D4DEEA;
  --id-ink: #0A1F44;
  --id-muted: #566A88;
  --id-card: 24px;
  --id-gap: 20px;
}

@media (max-width: 40rem) { :root, .t2 { --t2-gutter: 14px; --t2-gap-section: 16px; --t2-gap-block: 12px; --t2-pad-card: 14px; --t2-display-fs: 1.5rem; --t2-h1-fs: 1.375rem; --t2-metric-fs: 1.375rem; } }

/* الوضعُ الليليّ — html.theme (نفسُ مفتاحِ الموقعِ الرئيسيّ) */
html.theme, html.theme .t2, html.theme .t2-float, html.theme #toast-root {
  --t2-navy: #050E20;
  --t2-navy-2: #0B1A33;
  --t2-navy-3: #16325A;
  --t2-brand: #2CC3CA;
  --t2-brand-2: #19AEB5;
  --t2-brand-3: #7EE0E4;
  --t2-brand-ink: #04202A;
  --t2-brand-wash: #16324A;
  --t2-bg: #07142A;
  --t2-bg-2: #0B1B36;
  --t2-surface: #102444;
  --t2-surface-2: #0D1F3C;
  --t2-surface-3: #16304F;
  --t2-elev: #132A4E;
  --t2-input: #0D1F3C;
  --t2-ink: #E8EEF8;
  --t2-ink-2: #C9D6EA;
  --t2-muted: #B7C6DE;
  --t2-line: #2A446E;
  --t2-line-2: #36557F;
  --t2-ok: #5EDBA9;
  --t2-ok-wash: #11372F;
  --t2-warn: #FFC861;
  --t2-warn-wash: #3A2C10;
  --t2-danger: #FF8A80;
  --t2-danger-wash: #3D1A1D;
  --t2-info: #9CC1FF;
  --t2-info-wash: #15294A;
  --t2-sh-1: 0 1px 2px rgba(0, 0, 0, .3);
  --t2-sh-2: 0 10px 28px rgba(0, 0, 0, .35);
  --t2-sh-3: 0 18px 44px rgba(0, 0, 0, .5);
  --t2-ring: 0 0 0 3px rgba(44, 195, 202, .35);
  --t2-search-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23B7C6DE' d='M232.49,215.51,185,168a92.12,92.12,0,1,0-17,17l47.53,47.54a12,12,0,0,0,17-17ZM44,112a68,68,0,1,1,68,68A68.07,68.07,0,0,1,44,112Z'/%3E%3C/svg%3E");
  --t2-chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%23B7C6DE' d='M216.49,104.49l-80,80a12,12,0,0,1-17,0l-80-80a12,12,0,0,1,17-17L128,159l71.51-71.52a12,12,0,0,1,17,17Z'/%3E%3C/svg%3E");
  --b-sh: 0 1px 0 rgba(255,255,255,.03) inset, 0 10px 28px -14px rgba(0,0,0,.6);
  --i-sh: 0 1px 2px rgba(0, 0, 0, .25);
  --t2-st-ok: #5EDBA9;
  --t2-st-ok-bg: rgba(94, 219, 169, .12);
  --t2-st-ok-line: rgba(94, 219, 169, .35);
  --t2-st-warn: #FFC861;
  --t2-st-warn-bg: rgba(255, 200, 97, .12);
  --t2-st-warn-line: rgba(255, 200, 97, .38);
  --t2-st-danger: #FF9A9A;
  --t2-st-danger-bg: rgba(255, 120, 120, .12);
  --t2-st-danger-line: rgba(255, 120, 120, .38);
  --t2-st-info: #9DB8FF;
  --t2-st-info-bg: rgba(130, 160, 255, .12);
  --t2-st-info-line: rgba(130, 160, 255, .35);
  --t2-hover: #18345A;
  --t2-hover-line: #3C6496;
}


.t2 {
  /* ===== سُلَّمُ المسافاتِ الموحَّد ===== */
  /* ===== مقياسُ المسافات ===== */

  /* ===== الأقطار: قيمُ الإصدارِ الأولِ نفسُها ===== */

  /* ===== الهوية: مُستخرَجةٌ من الإصدارِ الأولِ حرفيًّا ===== */

  /* ===== طبقاتُ الخلفية ===== */

  /* ===== النصوص ===== */

  /* ===== الحدود ===== */

  /* ===== الحالات ===== */

  /* ===== الظلال ===== */

  /* ===== الخط: خطُّ المنصةِ المُعلَنُ في الإصدارِ الأول ===== */

  font-family: var(--t2-ff-text);
  color: var(--t2-ink);
  background: var(--t2-bg);
  direction: rtl;
  min-height: 100%;
  -webkit-font-smoothing: antialiased;
  font-size: var(--t2-fs-md);
  line-height: 1.6;
}

.t2 *, .t2 *::before, .t2 *::after { box-sizing: border-box; }
.t2 h1, .t2 h2, .t2 h3, .t2 h4, .t2 p, .t2 ul, .t2 ol { margin: 0; }
.t2 button { font: inherit; color: inherit; }
.t2 code {
  font-family: var(--t2-ff-display);
  font-size: .86em;
  letter-spacing: 0;
  background: var(--t2-surface-2);
  border: 1px solid var(--t2-line-2);
  border-radius: var(--t2-r-xs);
  padding: .05em .35em;
  direction: ltr;
  unicode-bidi: embed;
  display: inline-block;
}

/* ===== سُلَّمُ الخطوط ===== */
.t2 .t2-body { font-size: var(--t2-fs-sm); line-height: 1.75; color: var(--t2-ink-2); }
.t2 .t2-cap { font-size: var(--t2-fs-xs); line-height: 1.6; color: var(--t2-muted); }

/* ===== هيكلُ الصفحة ===== */
.t2-wrap {
  padding: var(--t2-md);
  max-width: 1460px;
  margin-inline: auto;
}
.t2-stack { display: grid; gap: var(--t2-md); align-content: start; }
.t2-stack-tight { display: grid; gap: var(--t2-sm); align-content: start; }
.t2-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--t2-sm);
}
.t2-row-end { justify-content: flex-end; }

/* ===== الترويسةُ العلوية ===== */
.t2-subtitle { font-size: var(--t2-fs-xs); color: var(--t2-muted); }
.t2-title { font-size: var(--t2-fs-lg); font-weight: 700; letter-spacing: -.01em; }
.t2-who-r { font-size: var(--t2-fs-2xs); color: var(--t2-muted); }

.t2-hactions { display: flex; align-items: center; gap: var(--t2-xs); margin-inline-start: auto; }

.t2-ibtn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--t2-xs);
  border: 1px solid var(--t2-line);
  background: var(--t2-surface);
  border-radius: var(--t2-r);
  padding: .3rem .5rem;
  cursor: pointer;
  transition: border-color var(--t2-fast) var(--t2-ease), box-shadow var(--t2-fast) var(--t2-ease), transform var(--t2-fast) var(--t2-ease);
}
.t2-ibtn:hover { border-color: var(--t2-brand); box-shadow: var(--t2-sh-1); }
.t2-ibtn:active { transform: scale(.97); }
.t2-ibtn-n {
  position: absolute;
  top: -.3rem;
  inset-inline-end: -.3rem;
  min-width: 1.05rem;
  height: 1.05rem;
  border-radius: var(--t2-r-pill);
  background: var(--t2-danger);
  color: #fff;
  font-size: var(--t2-fs-2xs);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 .2rem;
  box-shadow: var(--t2-sh-1);
}

/* ===== مُبدِّلُ الحسابِ والدور ===== */
.t2-sw { position: relative; }
.t2-sw-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--t2-xs);
  border: 1px solid var(--t2-line);
  background: var(--t2-surface);
  border-radius: var(--t2-r-pill);
  padding: .26rem .6rem;
  font-size: var(--t2-fs-xs);
  font-weight: 600;
  cursor: pointer;
  transition: border-color var(--t2-fast) var(--t2-ease), background var(--t2-fast) var(--t2-ease);
}
.t2-sw-btn:hover { border-color: var(--t2-brand); background: var(--t2-brand-wash); }
.t2-sw-menu {
  position: absolute;
  top: calc(100% + var(--t2-xs));
  inset-inline-end: 0;
  z-index: 40;
  min-width: 14rem;
  border: 1px solid var(--t2-line);
  border-radius: var(--t2-r);
  background: var(--t2-surface);
  box-shadow: var(--t2-sh-3);
  padding: var(--t2-xs);
  display: grid;
  gap: 2px;
  animation: t2-pop var(--t2-fast) var(--t2-ease) both;
}
.t2-sw-h {
  padding: var(--t2-sm) var(--t2-sm) var(--t2-xs);
  font-size: var(--t2-fs-2xs);
  color: var(--t2-muted);
  border-bottom: 1px solid var(--t2-line-2);
  margin-bottom: var(--t2-xs);
}
.t2-sw-item {
  display: flex;
  align-items: center;
  gap: var(--t2-sm);
  width: 100%;
  border: 1px solid transparent;
  background: transparent;
  border-radius: var(--t2-r-xs);
  padding: .42rem .5rem;
  font-size: var(--t2-fs-sm);
  text-align: start;
  cursor: pointer;
  transition: background var(--t2-fast) var(--t2-ease);
}
.t2-sw-item:hover { background: var(--t2-surface-2); }
.t2-sw-item.is-on {
  background: var(--t2-brand-wash);
  border-color: var(--t2-brand);
  color: var(--t2-brand-3);
  font-weight: 700;
}
.t2-sw-item[disabled] { opacity: .55; cursor: default; }
.t2-sw-tag { margin-inline-start: auto; font-size: var(--t2-fs-2xs); color: var(--t2-muted); }

/* ===== الشريطُ الجانبيُّ للأقسام ===== */

/* ===== رأسُ القسمِ والمجموعة ===== */
.t2-phead { display: grid; gap: 2px; }
.t2-phead-t { font-size: var(--t2-fs-lg); font-weight: 700; letter-spacing: -.015em; }
.t2-phead-s { font-size: var(--t2-fs-xs); color: var(--t2-muted); line-height: 1.65; }

.t2-group-h {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--t2-sm);
  margin-bottom: var(--t2-sm);
  padding-bottom: var(--t2-xs);
  border-bottom: 1px solid var(--t2-line-2);
}
.t2-group-t { font-size: var(--t2-fs-md); font-weight: 700; }
.t2-group-n { font-size: var(--t2-fs-xs); color: var(--t2-muted); }

/* ===== الشبكةُ الذكية ===== */
.t2-grid {
  display: grid;
  gap: var(--t2-sm);
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}

/* ===== البطاقةُ الوظيفيةُ المُدمَجة ===== */
.t2-card {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--t2-sm);
  align-items: start;
  text-align: start;
  width: 100%;
  border: 1px solid var(--t2-line);
  border-radius: var(--t2-r);
  background: var(--t2-surface);
  padding: var(--t2-sm) var(--t2-md);
  cursor: pointer;
  box-shadow: var(--t2-sh-1);
  overflow: hidden;
  transition: transform var(--t2-fast) var(--t2-ease), box-shadow var(--t2-fast) var(--t2-ease),
    border-color var(--t2-fast) var(--t2-ease);
  animation: t2-rise var(--t2-slow) var(--t2-ease) both;
}
.t2-card::after {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--t2-brand);
  opacity: 0;
  transition: opacity var(--t2-fast) var(--t2-ease);
}
.t2-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--t2-sh-2);
  border-color: #cfdce8;
}
.t2-card:hover::after { opacity: 1; }
.t2-card:active { transform: translateY(0); box-shadow: var(--t2-sh-1); }
.t2-card.is-on { border-color: var(--t2-brand); background: var(--t2-brand-wash); }
.t2-card.is-on::after { opacity: 1; }
.t2-card[disabled] {
  cursor: default;
  opacity: .62;
  box-shadow: none;
  background: var(--t2-surface-2);
}
.t2-card[disabled]:hover { transform: none; box-shadow: none; }

.t2-card-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform var(--t2-slow) var(--t2-ease);
}
.t2-card:hover .t2-card-ico { transform: translateY(-1px) rotate(-3deg) scale(1.05); }
.t2-card-t {
  font-size: var(--t2-fs-sm);
  font-weight: 700;
  line-height: 1.45;
  display: block;
}
.t2-card-d {
  margin-top: 2px;
  font-size: var(--t2-fs-xs);
  line-height: 1.6;
  color: var(--t2-muted);
  display: block;
}
.t2-card-badge {
  position: absolute;
  top: var(--t2-sm);
  inset-inline-end: var(--t2-sm);
  border-radius: var(--t2-r-pill);
  background: var(--t2-surface-2);
  border: 1px solid var(--t2-line-2);
  color: var(--t2-ink-2);
  font-size: var(--t2-fs-2xs);
  font-weight: 700;
  padding: .05rem .4rem;
}

/* ===== مؤشراتُ الأرقام — مُدمَجةٌ لا عملاقة ===== */

/* ===== اللوحُ ===== */
.t2-panel {
  border: 1px solid var(--t2-line);
  border-radius: var(--t2-r);
  background: var(--t2-surface);
  box-shadow: var(--t2-sh-1);
  padding: var(--t2-md);
  display: grid;
  gap: var(--t2-sm);
  animation: t2-fade var(--t2-slow) var(--t2-ease) both;
}
.t2-panel-h {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--t2-sm);
  padding-bottom: var(--t2-sm);
  border-bottom: 1px solid var(--t2-line-2);
}

/* ===== الحقول ===== */
.t2-field {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--t2-md);
  padding: var(--t2-sm) 0;
  border-bottom: 1px dashed var(--t2-line-2);
  min-width: 0;
}
.t2-field:last-child { border-bottom: none; }
.t2-field-k {
  font-size: var(--t2-fs-xs);
  color: var(--t2-muted);
  flex: 0 0 auto;
  max-width: 55%;
}
.t2-field-v {
  font-size: var(--t2-fs-sm);
  font-weight: 600;
  text-align: end;
  min-width: 0;
  overflow-wrap: anywhere;
}
.t2-field.is-edit { display: grid; gap: var(--t2-xs); border-bottom: none; padding: var(--t2-xs) 0; }
.t2-field.is-edit .t2-field-k { max-width: none; }

/* ===== الجداول ===== */

/* ===== الحبّاتُ والأزرار ===== */
.t2-pill {
  display: inline-flex;
  align-items: center;
  gap: var(--t2-xs);
  border-radius: var(--t2-r-pill);
  padding: .1rem .5rem;
  font-size: var(--t2-fs-2xs);
  font-weight: 700;
  white-space: nowrap;
  background: var(--t2-surface-2);
  color: var(--t2-ink-2);
  border: 1px solid var(--t2-line-2);
}
.t2-pill.is-ok { background: var(--t2-ok-wash); color: #0f7a37; border-color: #cfeeda; }
.t2-pill.is-warn { background: var(--t2-warn-wash); color: #a15c05; border-color: #f4e2c4; }
.t2-pill.is-danger { background: var(--t2-danger-wash); color: #a81c1c; border-color: #f6cfcf; }
.t2-pill.is-info { background: var(--t2-info-wash); color: #1d4ed8; border-color: #d3e0fd; }

.t2-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--t2-xs);
  border: 1px solid var(--t2-line);
  background: var(--t2-surface);
  color: var(--t2-ink);
  border-radius: var(--t2-r);
  padding: .4rem .78rem;
  font-size: var(--t2-fs-sm);
  font-weight: 600;
  cursor: pointer;
  box-shadow: var(--t2-sh-1);
  transition: transform var(--t2-fast) var(--t2-ease), box-shadow var(--t2-fast) var(--t2-ease),
    border-color var(--t2-fast) var(--t2-ease), background var(--t2-fast) var(--t2-ease);
}
.t2-btn:hover { transform: translateY(-1px); box-shadow: var(--t2-sh-2); border-color: #cfdce8; }
.t2-btn:active { transform: translateY(0); box-shadow: var(--t2-sh-1); }
.t2-btn:focus-visible { outline: none; box-shadow: var(--t2-ring); }
.t2-btn[disabled] {
  cursor: default;
  opacity: .5;
  box-shadow: none;
  transform: none;
}
.t2-btn[disabled]:hover { transform: none; box-shadow: none; }
.t2-btn.is-primary {
  background: linear-gradient(180deg, var(--t2-brand-2) 0%, var(--t2-brand) 100%);
  border-color: var(--t2-brand);
  color: #fff;
}
.t2-btn.is-danger {
  background: linear-gradient(180deg, #ef4444 0%, var(--t2-danger) 100%);
  border-color: var(--t2-danger);
  color: #fff;
}
.t2-btn.is-ghost { background: transparent; box-shadow: none; }
.t2-btn.is-sm { padding: .24rem .55rem; font-size: var(--t2-fs-xs); }

.t2-back {
  display: inline-flex;
  align-items: center;
  gap: var(--t2-xs);
  border: 1px solid var(--t2-line);
  background: var(--t2-surface);
  border-radius: var(--t2-r-pill);
  padding: .26rem .68rem;
  font-size: var(--t2-fs-xs);
  font-weight: 600;
  cursor: pointer;
  box-shadow: var(--t2-sh-1);
  transition: transform var(--t2-fast) var(--t2-ease), border-color var(--t2-fast) var(--t2-ease);
}
.t2-back:hover { border-color: var(--t2-brand); transform: translateX(-2px); }

/* ===== المدخلات ===== */
.t2-input {
  box-sizing: border-box;
  width: 100%;
  border: 1px solid var(--t2-line);
  background: var(--t2-surface);
  color: var(--t2-ink);
  border-radius: var(--t2-r);
  padding: .4rem .6rem;
  font-family: var(--t2-ff-text);
  font-size: var(--t2-fs-sm);
  line-height: 1.6;
  transition: border-color var(--t2-fast) var(--t2-ease), box-shadow var(--t2-fast) var(--t2-ease);
  min-width: 0;
  max-width: 100%;
}
.t2-input:focus { outline: none; border-color: var(--t2-brand); box-shadow: var(--t2-ring); }
.t2-input::placeholder { color: var(--t2-muted); }
.t2 textarea.t2-input { resize: vertical; min-height: 4.2rem; width: 100%; }
.t2 select.t2-input { cursor: pointer; }

/* ===== شريطُ البحثِ والفلترةِ والفرز ===== */
.t2-fbar {
  border: 1px solid var(--t2-line);
  border-radius: var(--t2-r);
  background: var(--t2-surface);
  box-shadow: var(--t2-sh-1);
  padding: var(--t2-sm) var(--t2-md);
  display: grid;
  gap: var(--t2-sm);
}
.t2-fbar-top { display: flex; flex-wrap: wrap; align-items: center; gap: var(--t2-sm); }
.t2-fbar-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--t2-sm);
  padding-top: var(--t2-sm);
  border-top: 1px solid var(--t2-line-2);
}
.t2-fbar-count { font-size: var(--t2-fs-xs); font-weight: 700; }
.t2-fbar-count span { color: var(--t2-muted); font-weight: 400; }

/* ===== ألسنةٌ داخلَ الصفحة ===== */
.t2-tabs {
  display: flex;
  gap: var(--t2-xs);
  overflow-x: auto;
  padding-bottom: var(--t2-xs);
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.t2-tabs::-webkit-scrollbar { display: none; }
.t2-tab {
  display: inline-flex;
  align-items: center;
  gap: var(--t2-xs);
  flex: 0 0 auto;
  border: 1px solid var(--t2-line);
  background: var(--t2-surface);
  color: var(--t2-ink-2);
  border-radius: var(--t2-r-pill);
  padding: .3rem .62rem;
  font-size: var(--t2-fs-xs);
  font-weight: 600;
  cursor: pointer;
  transition: background var(--t2-fast) var(--t2-ease), color var(--t2-fast) var(--t2-ease),
    border-color var(--t2-fast) var(--t2-ease), transform var(--t2-fast) var(--t2-ease);
}
.t2-tab:hover { border-color: var(--t2-brand); transform: translateY(-1px); }
.t2-tab:active { transform: translateY(0); }
.t2-tab.is-on {
  background: var(--t2-brand-wash);
  border-color: var(--t2-brand);
  color: var(--t2-brand-3);
}
.t2-tab-n {
  min-width: 1.15rem;
  border-radius: var(--t2-r-pill);
  background: var(--t2-surface-2);
  color: var(--t2-muted);
  font-size: var(--t2-fs-2xs);
  font-weight: 700;
  padding: 0 .28rem;
  text-align: center;
}
.t2-tab.is-on .t2-tab-n { background: var(--t2-surface); color: var(--t2-brand-3); }

/* ===== الحالات: فراغ · تحميل · خطأ · ملاحظة ===== */
.t2-note {
  display: flex;
  align-items: flex-start;
  gap: var(--t2-sm);
  border: 1px solid var(--t2-line);
  border-radius: var(--t2-r);
  background: var(--t2-surface);
  padding: var(--t2-sm) var(--t2-md);
  box-shadow: var(--t2-sh-1);
  animation: t2-fade var(--t2-slow) var(--t2-ease) both;
}
.t2-note-ico { flex: 0 0 auto; display: inline-flex; margin-top: 1px; }
.t2-note-t { font-size: var(--t2-fs-sm); font-weight: 700; line-height: 1.5; }
.t2-note-b { margin-top: 2px; font-size: var(--t2-fs-xs); line-height: 1.7; color: var(--t2-ink-2); }
.t2-note.is-ok { background: var(--t2-ok-wash); border-color: #cfeeda; }
.t2-note.is-warn { background: var(--t2-warn-wash); border-color: #f4e2c4; }
.t2-note.is-danger { background: var(--t2-danger-wash); border-color: #f6cfcf; }
.t2-note.is-info { background: var(--t2-info-wash); border-color: #d3e0fd; }

.t2-empty {
  display: grid;
  justify-items: center;
  gap: var(--t2-sm);
  text-align: center;
  padding: var(--t2-xl) var(--t2-md);
  border: 1px dashed var(--t2-line);
  border-radius: var(--t2-r);
  background: var(--t2-surface);
}
.t2-empty-t { font-size: var(--t2-fs-md); font-weight: 700; }
.t2-empty-b { font-size: var(--t2-fs-xs); color: var(--t2-muted); line-height: 1.7; max-width: 30rem; }

.t2-skel { display: grid; gap: var(--t2-sm); }
.t2-skel-row {
  height: 2.6rem;
  border-radius: var(--t2-r);
  background: linear-gradient(90deg, var(--t2-surface-2) 25%, var(--t2-surface-3) 37%, var(--t2-surface-2) 63%);
  background-size: 400% 100%;
  animation: t2-shim 1.3s ease-in-out infinite;
}
.t2-busy {
  display: inline-flex;
  align-items: center;
  gap: var(--t2-sm);
  font-size: var(--t2-fs-sm);
  color: var(--t2-muted);
}
.t2-spin {
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  border: 2px solid var(--t2-line);
  border-top-color: var(--t2-brand);
  animation: t2-spin .7s linear infinite;
}

/* ===== المقاييسُ والمؤثراتُ المالية ===== */
.t2-barrow {
  display: flex;
  align-items: center;
  gap: var(--t2-sm);
  padding: var(--t2-xs) 0;
}
.t2-bar-k { flex: 0 0 auto; font-size: var(--t2-fs-xs); color: var(--t2-ink-2); min-width: 4.5rem; }
.t2-bar {
  flex: 1 1 auto;
  height: .42rem;
  border-radius: var(--t2-r-pill);
  background: var(--t2-surface-3);
  overflow: hidden;
  min-width: 3rem;
}
.t2-bar-fill {
  display: block;
  height: 100%;
  border-radius: var(--t2-r-pill);
  background: var(--t2-brand);
  transform-origin: right center;
  animation: t2-grow var(--t2-slow) var(--t2-ease) both;
}
.t2-bar-fill.is-ok { background: var(--t2-ok); }
.t2-bar-fill.is-warn { background: var(--t2-warn); }
.t2-bar-fill.is-danger { background: var(--t2-danger); }
.t2-bar-fill.is-info { background: var(--t2-info); }
.t2-bar-v {
  flex: 0 0 auto;
  font-family: var(--t2-ff-display);
  font-variant-numeric: tabular-nums;
  font-size: var(--t2-fs-xs);
  font-weight: 700;
  min-width: 3.2rem;
  text-align: end;
}

/* ===== الخطُّ الزمني ===== */
.t2-tl { display: grid; gap: 0; }
.t2-tl-i {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--t2-sm);
  padding-bottom: var(--t2-md);
  position: relative;
}
.t2-tl-i:last-child { padding-bottom: 0; }
.t2-tl-dot {
  position: relative;
  width: .62rem;
  height: .62rem;
  border-radius: 50%;
  background: var(--t2-brand);
  margin-top: .42rem;
  box-shadow: 0 0 0 3px var(--t2-brand-wash);
}
.t2-tl-i:not(:last-child) .t2-tl-dot::after {
  content: '';
  position: absolute;
  top: 1rem;
  inset-inline-start: 50%;
  width: 1px;
  height: calc(100% + var(--t2-md));
  background: var(--t2-line);
  transform: translateX(50%);
}
.t2-tl-dot.is-warn { background: var(--t2-warn); box-shadow: 0 0 0 3px var(--t2-warn-wash); }
.t2-tl-dot.is-danger { background: var(--t2-danger); box-shadow: 0 0 0 3px var(--t2-danger-wash); }
.t2-tl-dot.is-info { background: var(--t2-info); box-shadow: 0 0 0 3px var(--t2-info-wash); }
.t2-tl-b { min-width: 0; }
.t2-tl-t { font-size: var(--t2-fs-sm); font-weight: 600; line-height: 1.5; }
.t2-tl-m { font-size: var(--t2-fs-2xs); color: var(--t2-muted); }

/* ===== الجُرّارُ والنافذة ===== */
.t2-scrim {
  position: fixed;
  inset: 0;
  z-index: 60;
  background: rgba(15, 36, 56, .42);
  backdrop-filter: blur(2px);
  animation: t2-fade var(--t2-fast) var(--t2-ease) both;
}
.t2-drawer {
  position: fixed;
  z-index: 61;
  inset-inline: 0;
  bottom: 0;
  max-height: 86vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--t2-surface);
  border-top: 1px solid var(--t2-line);
  border-radius: var(--t2-r-lg) var(--t2-r-lg) 0 0;
  box-shadow: var(--t2-sh-3);
  padding: var(--t2-md);
  display: grid;
  gap: var(--t2-sm);
  align-content: start;
  animation: t2-up var(--t2-slow) var(--t2-ease) both;
}
.t2-drawer-h {
  display: flex;
  align-items: center;
  gap: var(--t2-sm);
  padding-bottom: var(--t2-sm);
  border-bottom: 1px solid var(--t2-line-2);
  position: sticky;
  top: calc(var(--t2-md) * -1);
  background: var(--t2-surface);
}
.t2-drawer-t { font-size: var(--t2-fs-md); font-weight: 700; }
.t2-x {
  margin-inline-start: auto;
  border: 1px solid var(--t2-line);
  background: var(--t2-surface);
  border-radius: var(--t2-r-xs);
  width: 1.7rem;
  height: 1.7rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: var(--t2-fs-lg);
  line-height: 1;
}
.t2-x:hover { border-color: var(--t2-danger); color: var(--t2-danger); }

.t2-modal {
  position: fixed;
  z-index: 61;
  inset: 0;
  display: grid;
  place-items: center;
  padding: var(--t2-md);
  pointer-events: none;
}
.t2-modal-c {
  pointer-events: auto;
  width: min(30rem, 100%);
  max-height: 84vh;
  overflow-y: auto;
  background: var(--t2-surface);
  border: 1px solid var(--t2-line);
  border-radius: var(--t2-r-lg);
  box-shadow: var(--t2-sh-3);
  padding: var(--t2-md);
  display: grid;
  gap: var(--t2-sm);
  align-content: start;
  animation: t2-pop var(--t2-slow) var(--t2-ease) both;
}

/* ===== لوحُ التفاصيل ===== */
.t2-detail {
  border: 1px solid var(--t2-brand);
  border-radius: var(--t2-r);
  background: var(--t2-surface);
  box-shadow: var(--t2-sh-2);
  padding: var(--t2-md);
  display: grid;
  gap: var(--t2-sm);
  animation: t2-up var(--t2-slow) var(--t2-ease) both;
}
.t2-detail-h {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--t2-sm);
  padding-bottom: var(--t2-sm);
  border-bottom: 1px solid var(--t2-line-2);
}

/* ===== الترحيبُ في الصفحةِ الرئيسية ===== */

/* ===== المطويّة ===== */
.t2-fold { border: 1px solid var(--t2-line); border-radius: var(--t2-r); background: var(--t2-surface); overflow: hidden; }
.t2-fold[open] > summary { border-bottom: 1px solid var(--t2-line-2); }
.t2-fold-b { padding: var(--t2-md); display: grid; gap: var(--t2-sm); }

/* ===== الحركة ===== */
@keyframes t2-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes t2-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes t2-up { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes t2-pop { from { opacity: 0; transform: scale(.97); } to { opacity: 1; transform: none; } }
@keyframes t2-grow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes t2-spin { to { transform: rotate(360deg); } }
@keyframes t2-shim { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }

/* ===== التوسُّعُ حسبَ عرضِ الشاشة ===== */
@media (min-width: 30rem) {
  .t2-grid { grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); }
}

@media (min-width: 48rem) {
  .t2-wrap { padding: var(--t2-lg); }
  .t2-stack { gap: var(--t2-lg); }
  .t2-panel { padding: var(--t2-md) var(--t2-lg); }
  .t2-grid { grid-template-columns: repeat(auto-fill, minmax(196px, 1fr)); }
}

@media (min-width: 64rem) {
  .t2-wrap { padding: var(--t2-lg) var(--t2-xl); }
  .t2-grid { grid-template-columns: repeat(auto-fill, minmax(214px, 1fr)); }
  .t2-drawer {
    inset-inline-start: auto;
    inset-inline-end: 0;
    top: 0;
    bottom: 0;
    width: min(28rem, 92vw);
    max-height: 100vh;
    border-radius: var(--t2-r-lg) 0 0 var(--t2-r-lg);
    border-top: none;
    border-inline-start: 1px solid var(--t2-line);
    animation: t2-slide var(--t2-slow) var(--t2-ease) both;
  }
  @keyframes t2-slide { from { opacity: 0; transform: translateX(-18px); } to { opacity: 1; transform: none; } }
}

@media (min-width: 80rem) {
  .t2-grid { grid-template-columns: repeat(auto-fill, minmax(232px, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  .t2 *, .t2 *::before, .t2 *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
  .t2-card:hover, .t2-btn:hover, .t2-tab:hover, .t2-back:hover { transform: none; }
  .t2-card:hover .t2-card-ico { transform: none; }
}

/* ===== تصحيحاتٌ نهائيةٌ في الهيكل ===== */

/* الطبقاتُ العائمةُ تحملُ صفَّ .t2 لأجلِ الرموزِ اللونية، فلا يجوزُ أن ترثَ ارتفاعَ الصفحة */
.t2-scrim, .t2-drawer, .t2-modal { min-height: 0; }
.t2-drawer { height: auto; }

/* قيمةُ الترحيبِ قد تكونُ تاريخًا وساعةً معًا: تُلَفُّ ولا تُقطَع */

/* الجُرّارُ على الشاشاتِ الصغيرةِ يبقى ملتصقًا بالأسفلِ بحجمِ محتواه */
@media (max-width: 63.99rem) {
  .t2-drawer { top: auto; }
}

/* ==========================================================================
   gap228 — الحواراتُ المركزيةُ، والترقيمُ، وخاناتُ الرمز، والحقولُ، والتلميحات
   ========================================================================== */

.t2-scrim2 {
  position: fixed;
  inset: 0;
  background: rgba(8, 22, 28, .55);
  backdrop-filter: blur(3px);
  z-index: 90;
  animation: t2-fade var(--t2-fast) var(--t2-ease);
}

.t2-dlg2 {
  position: fixed;
  inset: 0;
  z-index: 91;
  display: grid;
  place-items: center;
  padding: var(--t2-md);
  pointer-events: none;
  min-height: 0;
}

.t2-dlg2-c {
  pointer-events: auto;
  width: min(26rem, 100%);
  max-height: 88vh;
  overflow: auto;
  background: var(--t2-surface);
  border: 1px solid var(--t2-line);
  border-radius: var(--t2-r-lg);
  box-shadow: var(--t2-sh-3);
  padding: var(--t2-lg) var(--t2-md) var(--t2-md);
  display: grid;
  gap: var(--t2-sm);
  text-align: center;
  animation: t2-pop var(--t2-slow) var(--t2-ease);
}

.t2-dlg2-c.is-wide { width: min(40rem, 100%); }

.t2-dlg2-ic {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  margin: 0 auto;
  border-radius: var(--t2-r-pill);
  background: var(--t2-info-wash);
}

.t2-dlg2.is-ok .t2-dlg2-ic { background: var(--t2-ok-wash); }
.t2-dlg2.is-warn .t2-dlg2-ic { background: var(--t2-warn-wash); }
.t2-dlg2.is-danger .t2-dlg2-ic { background: var(--t2-danger-wash); }

.t2-dlg2-t { margin: 0; font-size: var(--t2-fs-lg); font-weight: 700; color: var(--t2-ink); }
.t2-dlg2-d { margin: 0; font-size: var(--t2-fs-sm); line-height: 1.7; color: var(--t2-ink-2); }
.t2-dlg2-b { text-align: start; display: grid; gap: var(--t2-sm); margin-top: var(--t2-xs); }

.t2-dlg2-a {
  display: flex;
  gap: var(--t2-sm);
  justify-content: center;
  flex-wrap: wrap;
  margin-top: var(--t2-xs);
}

.t2-dlg2-a .t2-btn { min-width: 6rem; }

/* ----- الترقيمُ الموحَّد ----- */

.t2-pager {
  display: flex;
  align-items: center;
  gap: var(--t2-sm);
  flex-wrap: wrap;
  padding: var(--t2-sm) var(--t2-md);
  border: 1px solid var(--t2-line);
  border-radius: var(--t2-r);
  background: var(--t2-surface-2);
}

.t2-pager-c { font-size: var(--t2-fs-xs); color: var(--t2-ink-2); }
.t2-pager-n { display: flex; align-items: center; gap: var(--t2-xs); margin-inline-start: auto; }
.t2-pager-p { font-size: var(--t2-fs-xs); color: var(--t2-muted); font-family: var(--t2-ff-display); min-width: 6.5rem; text-align: center; }
.t2-pager-s { display: flex; align-items: center; gap: var(--t2-xs); font-size: var(--t2-fs-xs); color: var(--t2-muted); }
.t2-pager-s .t2-input { padding: 4px var(--t2-sm); font-size: var(--t2-fs-xs); width: auto; min-width: 3.4rem; }

@media (max-width: 30rem) {
  .t2-pager { justify-content: space-between; }
  .t2-pager-n { margin-inline-start: 0; width: 100%; justify-content: space-between; }
}

/* ----- خاناتُ رمزِ التحقق ----- */

.t2-otp-w { display: grid; gap: var(--t2-xs); }
.t2-otp-l { font-size: var(--t2-fs-xs); font-weight: 600; color: var(--t2-ink); }
.t2-otp-h { font-size: var(--t2-fs-xs); color: var(--t2-muted); }
.t2-otp-e:empty { display: none; }
.t2-otp-e { font-size: var(--t2-fs-xs); color: var(--t2-danger); }

.t2-otp {
  display: flex;
  gap: var(--t2-sm);
  justify-content: center;
  direction: ltr;
}
.t2-otp.is-busy { opacity: .6; pointer-events: none; }

@keyframes t2-shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-4px); }
  75% { transform: translateX(4px); }
}

@media (max-width: 30rem) {
  .t2-otp { gap: var(--t2-xs); }
}

/* ----- الحقلُ الموحَّدُ بحالاتِه ----- */

.t2-fx { display: grid; gap: 5px; }
.t2-fx-l { font-size: var(--t2-fs-xs); font-weight: 600; color: var(--t2-ink); display: flex; gap: 4px; align-items: baseline; }
.t2-fx-req { color: var(--t2-danger); font-size: .9em; }

.t2-fx-c {
  position: relative;
  display: flex;
  align-items: center;
  background: var(--t2-surface);
  border: 1.5px solid var(--t2-line-2);
  border-radius: var(--t2-r);
  transition: border-color var(--t2-fast) var(--t2-ease), box-shadow var(--t2-fast) var(--t2-ease), background var(--t2-fast) var(--t2-ease);
}

.t2-fx-c:focus-within { border-color: var(--t2-brand); box-shadow: var(--t2-ring); }

.t2-fx-i {
  display: grid;
  place-items: center;
  width: 2.1rem;
  height: 2.1rem;
  margin-inline-start: 5px;
  opacity: .65;
  transition: opacity var(--t2-fast) var(--t2-ease);
  flex: none;
}

.t2-fx-c:focus-within .t2-fx-i { opacity: 1; }

.t2-fx-in {
  flex: 1 1 auto;
  min-width: 0;
  padding: 9px var(--t2-sm);
  border: 0;
  background: transparent;
  color: var(--t2-ink);
  font: inherit;
  font-size: var(--t2-fs-sm);
  border-radius: inherit;
}

.t2-fx-in:focus { outline: none; }
.t2-fx-in.ltr { direction: ltr; text-align: start; font-family: var(--t2-ff-display); }
.t2-fx-h { font-size: var(--t2-fs-xs); color: var(--t2-muted); line-height: 1.6; }
.t2-fx-e { font-size: var(--t2-fs-xs); color: var(--t2-danger); line-height: 1.6; }
.t2-fx-e:empty { display: none; }

.t2-fx.is-err .t2-fx-c { border-color: var(--t2-danger); background: var(--t2-danger-wash); }
.t2-fx.is-ok .t2-fx-c { border-color: var(--t2-ok); }
.t2-fx.is-off { opacity: .55; }
.t2-fx.is-off .t2-fx-c { background: var(--t2-surface-3); }

.t2-fx-sp { display: none; flex: none; width: 1.1rem; height: 1.1rem; margin-inline-end: var(--t2-sm); border-radius: var(--t2-r-pill); border: 2px solid var(--t2-line-2); border-top-color: var(--t2-brand); }
.t2-fx.is-busy .t2-fx-sp { display: block; animation: t2-spin .8s linear infinite; }
.t2-fx.is-busy .t2-fx-in { color: var(--t2-muted); }

/* العينُ: موضعٌ ثابتٌ، مساحةُ لمسٍ كافية، ولا تغطّي النصَّ في أيِّ اتجاه */
.t2-fx.has-eye .t2-fx-in { padding-inline-end: 2.6rem; }

.t2-fx-eye {
  position: absolute;
  inset-inline-end: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 2.2rem;
  height: 2.2rem;
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  color: var(--t2-muted);
  cursor: pointer;
  border-radius: var(--t2-r-xs);
  transition: color var(--t2-fast) var(--t2-ease), background var(--t2-fast) var(--t2-ease);
}

.t2-fx-eye:hover { background: var(--t2-surface-3); color: var(--t2-ink); }
.t2-fx-eye:focus-visible { outline: none; box-shadow: var(--t2-ring); }
.t2-fx-eye.is-on { color: var(--t2-brand); }
.t2-fx-eye-i { font-size: var(--t2-fs-md); line-height: 1; }
.t2-fx-eye.is-on .t2-fx-eye-i { opacity: .55; }

/* ----- مُنتقي طريقةِ التحقق ----- */

.t2-mp { display: grid; gap: var(--t2-sm); grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); }

.t2-mp-i {
  display: flex;
  align-items: center;
  gap: var(--t2-sm);
  text-align: start;
  padding: var(--t2-sm) var(--t2-md);
  border: 1.5px solid var(--t2-line-2);
  border-radius: var(--t2-r);
  background: var(--t2-surface);
  cursor: pointer;
  transition: border-color var(--t2-fast) var(--t2-ease), background var(--t2-fast) var(--t2-ease), transform var(--t2-fast) var(--t2-ease);
}

.t2-mp-i:hover { transform: translateY(-2px); border-color: var(--t2-brand-2); }
.t2-mp-i.is-on { border-color: var(--t2-brand); background: var(--t2-brand-wash); }
.t2-mp-ic { flex: none; display: grid; place-items: center; }
.t2-mp-t { display: grid; gap: 2px; min-width: 0; }
.t2-mp-n { font-size: var(--t2-fs-sm); font-weight: 600; color: var(--t2-ink); }
.t2-mp-d { font-size: var(--t2-fs-2xs); color: var(--t2-muted); }

/* ----- مسارُ خطواتِ العملية ----- */

.t2-steps { display: grid; gap: var(--t2-xs); }

.t2-step {
  display: flex;
  align-items: flex-start;
  gap: var(--t2-sm);
  padding: 6px var(--t2-sm);
  border-radius: var(--t2-r-xs);
  position: relative;
}

.t2-step-n {
  flex: none;
  width: 1.5rem;
  height: 1.5rem;
  display: grid;
  place-items: center;
  border-radius: var(--t2-r-pill);
  font-size: var(--t2-fs-2xs);
  font-weight: 700;
  font-family: var(--t2-ff-display);
  background: var(--t2-surface-3);
  color: var(--t2-muted);
  border: 1.5px solid var(--t2-line);
}

.t2-step-b { display: grid; gap: 1px; min-width: 0; }
.t2-step-t { font-size: var(--t2-fs-sm); color: var(--t2-ink-2); }
.t2-step-m { font-size: var(--t2-fs-2xs); color: var(--t2-muted); }

.t2-step.is-done .t2-step-n { background: var(--t2-ok-wash); border-color: var(--t2-ok); color: var(--t2-ok); }
.t2-step.is-now { background: var(--t2-brand-wash); }
.t2-step.is-now .t2-step-n { background: var(--t2-brand); border-color: var(--t2-brand); color: var(--t2-brand-ink); animation: t2-pulse 1.6s var(--t2-ease) infinite; }
.t2-step.is-now .t2-step-t { color: var(--t2-ink); font-weight: 600; }
.t2-step.is-fail .t2-step-n { background: var(--t2-danger-wash); border-color: var(--t2-danger); color: var(--t2-danger); }
.t2-step.is-todo { opacity: .62; }

@keyframes t2-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(15, 155, 142, .38); }
  50% { box-shadow: 0 0 0 5px rgba(15, 155, 142, 0); }
}

/* ----- التلميحُ من الجِذر ----- */

.t2-tip {
  position: fixed;
  z-index: 120;
  max-width: 17rem;
  padding: 6px var(--t2-sm);
  border-radius: var(--t2-r-xs);
  background: var(--t2-navy);
  color: #eefbf8;
  font-family: var(--t2-ff-text);
  font-size: var(--t2-fs-xs);
  line-height: 1.55;
  box-shadow: var(--t2-sh-2);
  pointer-events: none;
  opacity: 0;
  transform: translateY(2px);
  transition: opacity var(--t2-fast) var(--t2-ease), transform var(--t2-fast) var(--t2-ease);
  text-align: start;
  white-space: normal;
}

.t2-tip.is-on { opacity: 1; transform: translateY(0); }
.t2-tip.is-measure { opacity: 0; transition: none; }

/* ==========================================================================
   gap228 — هيكلُ الإصدارِ الثاني: إطارٌ وترويسةٌ وشريطٌ جانبي
   ========================================================================== */

/* إطارُ الإصدارِ الأولِ يُخفى ولا يُحذَف، ويعودُ لحظةَ مغادرةِ مسارِ v2 */
html.t2-on .sidebar, html.t2-on #sidebar-backdrop, html.t2-on .topbar { display: none !important; }
html.t2-on .shell { padding: 0 !important; }
html.t2-on .shell-main { padding: 0 !important; margin: 0 !important; }
html.t2-on .shell-content { padding: 0 !important; }
html.t2-on #page-hr { padding: 0 !important; }
html.t2-on.t2-drawer-on { overflow: hidden; }

.t2-app {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  min-height: 100dvh;
  background: var(--t2-bg);
}

.t2-main { display: flex; flex-direction: column; min-width: 0; }
.t2-body { min-width: 0; flex: 1 1 auto; }

/* ----- الشريطُ الجانبي ----- */

.t2-side {
  width: 15.5rem;
  align-self: start;
  position: sticky;
  top: 0;
  height: 100dvh;
  display: flex;
  flex-direction: column;
  gap: var(--t2-xs);
  padding: var(--t2-sm);
  background: linear-gradient(180deg, var(--t2-navy-2), var(--t2-navy));
  border-inline-start: 1px solid rgba(255, 255, 255, .06);
  overflow: hidden auto;
  transition: width .22s var(--t2-ease);
  z-index: 45;
}

.t2-side.is-min { width: 4.4rem; }

.t2-side-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--t2-xs);
  padding: var(--t2-xs) var(--t2-sm);
  min-height: 2.4rem;
}
.t2-side.is-min .t2-side-h { justify-content: center; }

.t2-side-t {
  flex: none;
  width: 1.9rem;
  height: 1.9rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: var(--t2-r-xs);
  background: rgba(255, 255, 255, .05);
  color: #d8f3ef;
  cursor: pointer;
  transition: background var(--t2-fast) var(--t2-ease), border-color var(--t2-fast) var(--t2-ease);
}

.t2-side-t:hover { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .25); }
.t2-side-t-i { font-size: var(--t2-fs-xs); line-height: 1; }

.t2-side-n { display: flex; flex-direction: column; gap: 3px; flex: 1 1 auto; }
.t2-side-f { padding-top: var(--t2-xs); border-top: 1px solid rgba(255, 255, 255, .07); }

.t2-side-i {
  display: grid;
  grid-template-columns: 2.1rem minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--t2-sm);
  width: 100%;
  padding: 9px var(--t2-sm);
  border: 0;
  border-radius: var(--t2-r);
  background: transparent;
  color: var(--t2-on-dark-2);
  font: inherit;
  font-size: var(--t2-fs-sm);
  text-align: start;
  cursor: pointer;
  position: relative;
  transition: background var(--t2-fast) var(--t2-ease), color var(--t2-fast) var(--t2-ease);
}

.t2-side-ic { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; }
.t2-side-l { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.t2-side-c {
  font-size: var(--t2-fs-2xs);
  font-family: var(--t2-ff-display);
  padding: 1px 6px;
  border-radius: var(--t2-r-pill);
  background: rgba(255, 255, 255, .12);
}

.t2-side-i:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.t2-side-i.is-on { background: rgba(10, 165, 173, .26); color: #fff; }
.t2-side-i.is-on::before {
  content: '';
  position: absolute;
  inset-inline-end: 0;
  top: 22%;
  bottom: 22%;
  width: 3px;
  border-radius: var(--t2-r-pill);
  background: var(--t2-brand);
}
.t2-side-i.is-soft { color: var(--t2-on-dark-3); font-size: var(--t2-fs-xs); }

/* عند الطي: أيقوناتٌ فقط، موزَّعةٌ بانتظامٍ ولا يزحفُ شيءٌ فوقَ شيء */
.t2-side.is-min .t2-side-i { grid-template-columns: 1fr; justify-items: center; padding: 9px 0; }
.t2-side.is-min .t2-side-l, .t2-side.is-min .t2-side-c { display: none; }
.t2-side.is-min .t2-side-n { gap: 6px; }

/* ----- الترويسة ----- */

.t2-head {
  position: sticky;
  top: 0;
  z-index: 42;
  display: flex;
  align-items: center;
  gap: var(--t2-sm);
  padding: var(--t2-sm) var(--t2-md);
  min-height: 3.5rem;
  background: var(--t2-surface);
  border-bottom: 1px solid var(--t2-line);
  box-shadow: var(--t2-sh-1);
}

.t2-hwho { display: flex; align-items: center; gap: var(--t2-xs); padding-inline-end: var(--t2-xs); }
.t2-hwho-n { font-size: var(--t2-fs-xs); font-weight: 600; color: var(--t2-ink); line-height: 1.25; max-width: 11rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.t2-hwho-r { font-size: var(--t2-fs-2xs); color: var(--t2-muted); line-height: 1.25; }

.t2-hbtn {
  position: relative;
  flex: none;
  min-width: 2.35rem;
  height: 2.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 var(--t2-xs);
  border: 1px solid var(--t2-line);
  border-radius: var(--t2-r);
  background: var(--t2-surface-2);
  color: var(--t2-ink-2);
  font: inherit;
  font-size: var(--t2-fs-xs);
  cursor: pointer;
  transition: background var(--t2-fast) var(--t2-ease), border-color var(--t2-fast) var(--t2-ease), transform var(--t2-fast) var(--t2-ease);
}

.t2-hbtn:hover { background: var(--t2-surface-3); border-color: var(--t2-line-2); transform: translateY(-1px); }
.t2-hbtn:focus-visible { outline: none; box-shadow: var(--t2-ring); }
.t2-hbtn-t { padding-inline-end: 4px; }
.t2-hbtn.is-out { color: var(--t2-danger); border-color: var(--t2-danger-wash); background: var(--t2-danger-wash); padding-inline: var(--t2-sm); }
.t2-hbtn.is-out:hover { background: var(--t2-danger); color: #fff; border-color: var(--t2-danger); }

.t2-hbtn-n {
  position: absolute;
  top: -5px;
  inset-inline-end: -5px;
  min-width: 1.05rem;
  height: 1.05rem;
  padding: 0 3px;
  display: grid;
  place-items: center;
  border-radius: var(--t2-r-pill);
  background: var(--t2-danger);
  color: #fff;
  font-size: var(--t2-fs-2xs);
  font-family: var(--t2-ff-display);
  box-shadow: 0 0 0 2px var(--t2-surface);
}

.t2-hbtn-d {
  position: absolute;
  bottom: -3px;
  inset-inline-end: -3px;
  width: .56rem;
  height: .56rem;
  border-radius: var(--t2-r-pill);
  box-shadow: 0 0 0 2px var(--t2-surface);
}

.t2-hbtn-d.is-ok { background: var(--t2-ok); }
.t2-hbtn-d.is-warn { background: var(--t2-warn); }
.t2-hbtn-d.is-danger { background: var(--t2-danger); animation: t2-pulse 1.8s var(--t2-ease) infinite; }

.t2-hburger { display: none; }
.t2-side-bd { display: none; }

/* ----- المقاساتُ الصغيرة: جُرّارٌ بدلَ العمود ----- */

@media (max-width: 64rem) {
  .t2-app { grid-template-columns: minmax(0, 1fr); }
  .t2-side {
    position: fixed;
    inset-block: 0;
    inset-inline-start: -17.5rem;
    width: 16.5rem;
    height: 100dvh;
    z-index: 70;
    transition: inset-inline-start .24s var(--t2-ease);
    box-shadow: var(--t2-sh-3);
  }
  .t2-side.is-min { width: 16.5rem; }
  .t2-side.is-min .t2-side-i { grid-template-columns: 2.1rem minmax(0, 1fr) auto; justify-items: stretch; padding: 9px var(--t2-sm); }
  .t2-side.is-min .t2-side-l { display: block; }
  .t2-side-t { display: none; }
  html.t2-drawer-on .t2-side { inset-inline-start: 0; }
  .t2-side-bd {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 69;
    background: rgba(8, 22, 28, .5);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s var(--t2-ease);
  }
  html.t2-drawer-on .t2-side-bd { opacity: 1; pointer-events: auto; }
  .t2-hburger {
    display: grid;
    place-items: center;
    flex: none;
    width: 2.35rem;
    height: 2.35rem;
    border: 1px solid var(--t2-line);
    border-radius: var(--t2-r);
    background: var(--t2-surface-2);
    cursor: pointer;
  }
  .t2-hburger-i, .t2-hburger-i::before, .t2-hburger-i::after {
    content: '';
    display: block;
    width: 1.05rem;
    height: 2px;
    border-radius: 2px;
    background: var(--t2-ink-2);
  }
  .t2-hburger-i { position: relative; }
  .t2-hburger-i::before { position: absolute; top: -5px; }
  .t2-hburger-i::after { position: absolute; top: 5px; }
  .t2-hwho-n { max-width: 7rem; }
}

@media (max-width: 48rem) {
  .t2-hbtn.is-out .t2-hbtn-t { display: none; }
  .t2-hbtn.is-out { padding-inline: var(--t2-xs); }
}

/* الخطُّ موحَّدٌ في كلِّ الإصدارِ الثاني: العناوينُ لا ترثُ خطَّ الإصدارِ الأول */
.t2 { font-family: var(--t2-ff-text); }
.t2 *:not(code):not(pre):not(kbd):not(samp) { font-family: inherit; }
.t2 .ltr, .t2 .t2-pager-p, .t2 .t2-step-n { font-variant-numeric: tabular-nums; }

/* شبكةُ حقولٍ متجاورةٍ في النماذجِ القصيرة */
.t2-fields-grid {
  display: grid;
  gap: var(--t2-sm) var(--t2-md);
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
}

/* القيمُ التقنيةُ تُعرَضُ كما هي: أرقامٌ لاتينيةٌ واتجاهٌ صحيح */
.t2-tech { font-family: var(--t2-ff-display); letter-spacing: .01em; }
.t2-tech.ltr { direction: ltr; unicode-bidi: isolate; display: inline-block; }

.t2-panel-row {
  display: grid;
  gap: var(--t2-xs);
  padding: var(--t2-sm) 0;
  border-bottom: 1px dashed var(--t2-line);
}
.t2-panel-row:last-of-type { border-bottom: 0; }

/* ----- شريطُ أدواتِ الجدول: بحثٌ وفلترةٌ وعدٌّ وتصفير ----- */

/* رأسُ العمودِ القابلُ للفرز */

/* ==========================================================================
   gap228 — كسوةُ حوارِ البوابةِ الأمنيةِ وشاشاتِ المصادقة
   ========================================================================== */

dialog.t2-dlg.t2-dlg-skin {
  padding: 0;
  width: min(30rem, 94vw);
  max-width: min(30rem, 94vw);
  border: 1px solid var(--t2-line);
  border-radius: var(--t2-r-lg);
  background: var(--t2-surface);
  color: var(--t2-ink);
  box-shadow: var(--t2-sh-3);
  font-family: var(--t2-ff-text);
  font-size: var(--t2-fs-md);
}

dialog.t2-dlg.t2-dlg-skin::backdrop {
  background: rgba(8, 22, 28, .55);
  backdrop-filter: blur(3px);
}

.t2-dlg-skin .t2-dlg-head { padding: var(--t2-md) var(--t2-md) var(--t2-xs); }
.t2-dlg-skin .t2-block-title { margin: 0; font-size: var(--t2-fs-lg); font-weight: 700; color: var(--t2-ink); }
.t2-dlg-skin .t2-dlg-body { padding: 0 var(--t2-md) var(--t2-md); display: grid; gap: var(--t2-sm); }
.t2-dlg-skin .t2-dlg-acts {
  padding: var(--t2-sm) var(--t2-md) var(--t2-md);
  display: flex;
  gap: var(--t2-sm);
  justify-content: flex-end;
  flex-wrap: wrap;
}

.t2-dlg-skin .field { display: grid; gap: 5px; }
.t2-dlg-skin .field label { font-size: var(--t2-fs-xs); font-weight: 600; color: var(--t2-ink); }
.t2-dlg-skin .input, .t2 .t2-auth-screen .input {
  width: 100%;
  padding: 9px var(--t2-sm);
  border: 1.5px solid var(--t2-line-2);
  border-radius: var(--t2-r);
  background: var(--t2-surface);
  color: var(--t2-ink);
  font: inherit;
  font-size: var(--t2-fs-sm);
  transition: border-color var(--t2-fast) var(--t2-ease), box-shadow var(--t2-fast) var(--t2-ease);
}

.t2-dlg-skin .input:focus { outline: none; border-color: var(--t2-brand); box-shadow: var(--t2-ring); }
.t2-dlg-skin .small.muted { font-size: var(--t2-fs-xs); color: var(--t2-muted); }

/* صفُّ اختيارِ العاملِ في الحوارِ يصيرُ مُنتقيًا واضحًا */
.t2-dlg-skin .tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px var(--t2-md);
  margin-inline-end: var(--t2-xs);
  border: 1.5px solid var(--t2-line-2);
  border-radius: var(--t2-r);
  background: var(--t2-surface);
  color: var(--t2-ink-2);
  font: inherit;
  font-size: var(--t2-fs-sm);
  cursor: pointer;
  transition: border-color var(--t2-fast) var(--t2-ease), background var(--t2-fast) var(--t2-ease), transform var(--t2-fast) var(--t2-ease);
}

.t2-dlg-skin .tab:hover { transform: translateY(-1px); border-color: var(--t2-brand-2); }
.t2-dlg-skin .tab.on { border-color: var(--t2-brand); background: var(--t2-brand-wash); color: var(--t2-ink); font-weight: 600; }

/* مُنتقي طريقةِ التحقُّقِ في شاشةِ الدخول */
.t2 .t2-twofa-factors {
  display: grid;
  gap: var(--t2-sm);
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  margin-block-end: var(--t2-sm);
}

.t2 .t2-twofa-factor {
  padding: var(--t2-sm) var(--t2-md);
  border: 1.5px solid var(--t2-line-2);
  border-radius: var(--t2-r);
  background: var(--t2-surface);
  color: var(--t2-ink-2);
  font: inherit;
  font-size: var(--t2-fs-sm);
  cursor: pointer;
  text-align: start;
  transition: border-color var(--t2-fast) var(--t2-ease), background var(--t2-fast) var(--t2-ease), transform var(--t2-fast) var(--t2-ease);
}

.t2 .t2-twofa-factor:hover { transform: translateY(-2px); border-color: var(--t2-brand-2); }
.t2 .t2-twofa-factor.is-on { border-color: var(--t2-brand); background: var(--t2-brand-wash); color: var(--t2-ink); font-weight: 600; }

/* عينُ كلمةِ المرورِ في شاشاتِ المصادقة: موضعٌ ثابتٌ ومساحةُ لمسٍ كافيةٌ ولا تغطّي النص */
.t2 .t2-password-wrap { position: relative; display: block; }
.t2 .t2-password-wrap > input { padding-inline-end: 2.7rem; }

.t2 .t2-password-toggle {
  position: absolute;
  inset-inline-end: 5px;
  top: 50%;
  transform: translateY(-50%);
  width: 2.2rem;
  height: 2.2rem;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--t2-muted);
  cursor: pointer;
  border-radius: var(--t2-r-xs);
  transition: color var(--t2-fast) var(--t2-ease), background var(--t2-fast) var(--t2-ease);
}

.t2 .t2-password-toggle:hover { background: var(--t2-surface-3); color: var(--t2-ink); }
.t2 .t2-password-toggle:focus-visible { outline: none; box-shadow: var(--t2-ring); }
.t2 .t2-password-toggle svg { width: 17px; height: 17px; display: block; }

/* إخفاءٌ بصريٌّ فقط: الحقلُ الأصليُّ يبقى في النموذجِ وقابلًا للقراءةِ والكتابةِ
 * من JS والتحقُّق، فلا display:none ولا إزالةٌ من الشجرة. */
.t2-vh {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  border: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap !important;
}

/* ==========================================================================
   gap230 — المؤشِّراتُ المضغوطة، وزرُّ تطبيقِ الفلاتر
   ========================================================================== */

/* فلاترُ في انتظارِ التطبيق: الزرُّ يقولُ ذلك بوضوحٍ بلا ضجيج */
.t2-btn.is-dirty { box-shadow: 0 0 0 3px rgba(15, 155, 142, .16); }
.t2-fbar-foot .t2-hactions { display: flex; gap: var(--t2-xs); margin-inline-start: auto; }

/* الفلاترُ ظاهرةٌ في الشاشاتِ الواسعة، وفي جُرّارٍ في الضيّقة — بلا منطقِ عرضٍ في JS */
.t2-fbar-top .t2-btn.is-filters { display: none; }

@media (max-width: 64rem) {
  .t2-fbar-top .t2-btn.is-filters { display: inline-flex; }
}

/* ==========================================================================
   gap231 — الإخراجُ البصري: تسلسلُ الخطوطِ، وطبقاتُ الخلفية، وحاويةُ الأيقونة،
   وبِنيةُ البطاقة، ومجموعاتُ الشريطِ الجانبي، وتجربةُ التحميل.
   الهويةُ من الإصدارِ الأول: كحليٌّ #0A1F44 وفيروزيٌّ #0AA5AD.
   ========================================================================== */

/* ----- تسلسلُ الخطوطِ: مقاساتٌ متوازنةٌ لا عناوينُ ضخمةٌ ووصفٌ ضائع ----- */

.t2 { font-size: var(--t2-fs-md); line-height: 1.65; color: var(--t2-ink); }
.t2-app { background: var(--t2-bg); }

.t2-phead-t { font-size: var(--t2-fs-xl); font-weight: 700; line-height: 1.45; color: var(--t2-ink); }
.t2-phead-s { font-size: var(--t2-fs-sm); line-height: 1.7; color: var(--t2-muted); }
.t2-group-t { font-size: var(--t2-fs-md); font-weight: 700; color: var(--t2-ink); }
.t2-group-n { font-size: var(--t2-fs-xs); line-height: 1.65; color: var(--t2-muted); }
.t2-group-h { font-size: var(--t2-fs-xs); font-weight: 600; color: var(--t2-ink-2); letter-spacing: .01em; }
.t2-body { font-size: var(--t2-fs-sm); line-height: 1.7; color: var(--t2-ink-2); }
.t2-cap { font-size: var(--t2-fs-xs); line-height: 1.6; color: var(--t2-muted); }

.t2-field-k { font-size: var(--t2-fs-xs); color: var(--t2-muted); }
.t2-field-v { font-size: var(--t2-fs-sm); color: var(--t2-ink); }

/* ----- طبقاتُ الخلفية: كلُّ طبقةٍ تُرى فوقَ ما تحتَها ----- */

.t2-card, .t2-panel { background: var(--t2-surface); border: 1px solid var(--t2-line); box-shadow: var(--t2-sh-1); }

.t2-fbar, .t2-pager { background: var(--t2-surface-2); border: 1px solid var(--t2-line); }

.t2-input, .t2-fx-c { background: var(--t2-input); border-color: var(--t2-line-2); }
.t2-dlg2-c, dialog.t2-dlg.t2-dlg-skin, .t2-drawer, .t2-modal-c { background: var(--t2-elev); box-shadow: var(--t2-sh-3); }
.t2-note { background: var(--t2-surface-2); }

/* ----- حاويةُ الأيقونةِ الموحَّدة ----- */

.t2-card-ico, .t2-mp-ic, .t2-side-ic {
  display: grid;
  place-items: center;
  flex: none;
  line-height: 0;
}

.t2-card-ico {
  width: 2.6rem;
  height: 2.6rem;
  border-radius: var(--t2-r-xs);
  background: var(--t2-brand-wash);
  transition: background var(--t2-fast) var(--t2-ease), transform var(--t2-fast) var(--t2-ease);
}

.t2-card:hover .t2-card-ico { background: var(--t2-brand-wash); transform: translateY(-1px); }
.t2-mp-ic { width: 2.4rem; height: 2.4rem; border-radius: var(--t2-r-xs); background: var(--t2-brand-wash); }
.t2-side-ic { width: 2.1rem; height: 2.1rem; }

/* ----- بِنيةُ البطاقة: أيقونةٌ وعنوانٌ ووصفٌ وعدٌّ وسهمُ إجراء، مضغوطةٌ لا ضخمة ----- */

.t2-grid { grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: var(--t2-sm); }

.t2-card {
  display: grid;
  grid-template-columns: 2.6rem minmax(0, 1fr) .85rem;
  align-items: center;
  gap: var(--t2-sm);
  padding: var(--t2-sm) var(--t2-md);
  text-align: start;
  border-radius: var(--t2-r);
  min-height: 4.3rem;
}

.t2-card-b { display: grid; gap: 2px; min-width: 0; }
.t2-card-t { font-size: var(--t2-fs-md); font-weight: 600; color: var(--t2-ink); line-height: 1.5; }
.t2-card-d { font-size: var(--t2-fs-xs); line-height: 1.6; color: var(--t2-muted); }
.t2-card-d.is-warn { color: var(--t2-warn); }
.t2-card-n { font-size: var(--t2-fs-2xs); font-weight: 600; font-family: var(--t2-ff-display); color: var(--t2-brand-2); margin-top: 1px; }

.t2-card-go {
  justify-self: end;
  font-size: var(--t2-fs-lg);
  line-height: 1;
  color: var(--t2-line-2);
  transition: color var(--t2-fast) var(--t2-ease), transform var(--t2-fast) var(--t2-ease);
}

.t2-card:hover .t2-card-go { color: var(--t2-brand); transform: translateX(-3px); }
.t2-card-badge { font-family: var(--t2-ff-display); }

/* ----- مجموعاتُ الشريطِ الجانبي: تُفتَحُ وتُطوى ----- */

.t2-side-g { display: grid; gap: 2px; }

.t2-side-gh {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 7px var(--t2-sm);
  border: 0;
  background: transparent;
  color: var(--t2-on-dark-3);
  font: inherit;
  font-size: var(--t2-fs-2xs);
  letter-spacing: .05em;
  cursor: pointer;
  border-radius: var(--t2-r-xs);
  transition: color var(--t2-fast) var(--t2-ease), background var(--t2-fast) var(--t2-ease);
}

.t2-side-gh:hover { color: var(--t2-on-dark); background: rgba(255, 255, 255, .06); }

.t2-side-gb { display: grid; gap: 3px; overflow: hidden; transition: max-height var(--t2-slow) var(--t2-ease), opacity var(--t2-fast) var(--t2-ease); max-height: 40rem; opacity: 1; }
.t2-side-g.is-closed .t2-side-gb { max-height: 0; opacity: 0; }
.t2-side.is-min .t2-side-gh { display: none; }
.t2-side.is-min .t2-side-gb { max-height: none; opacity: 1; }

/* توزيعٌ منتظمٌ لعناصرِ القائمة ----- */
.t2-side-n { gap: 2px; }
.t2-side-i { padding: 9px var(--t2-sm); min-height: 2.5rem; }
.t2-side.is-min .t2-side-i { padding: 9px 0; min-height: 2.6rem; }

/* ----- ترويسةٌ بتسلسلٍ واضح: هويةٌ ثم مَن أنا ثم إجراءات ----- */

.t2-head { background: var(--t2-surface); border-bottom: 1px solid var(--t2-line); box-shadow: var(--t2-sh-1); min-height: 3.9rem; }
.t2-hwho { padding-inline: var(--t2-xs); border-inline-start: 1px solid var(--t2-line); }
.t2-hwho-n { font-size: var(--t2-fs-sm); font-weight: 600; }
.t2-hwho-r { font-size: var(--t2-fs-2xs); color: var(--t2-brand-2); font-weight: 600; }
.t2-hbtn { background: var(--t2-surface-2); border-color: var(--t2-line); }
.t2-hbtn:hover { background: var(--t2-brand-wash); border-color: var(--t2-brand); color: var(--t2-brand-3); }
.t2-hbtn.is-out { color: var(--t2-danger); background: var(--t2-danger-wash); border-color: #f3cfcb; }
.t2-hbtn.is-out:hover { background: var(--t2-danger); color: #fff; border-color: var(--t2-danger); }

@media (max-width: 64rem) {
  .t2-hwho { border-inline-start: 0; }
}

/* ----- هويةُ الشريطِ الجانبي: شعارٌ واضحٌ مُوسَّعًا وعلامةٌ مقروءةٌ مطويًّا ----- */

.t2-side-h { align-items: center; gap: var(--t2-sm); padding: var(--t2-sm); min-height: 3.9rem; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.t2-side-mark { display: flex; align-items: center; gap: var(--t2-sm); min-width: 0; }
.t2-side-mark-l { width: 34px; height: 34px; object-fit: contain; flex: none; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .35)); }
.t2-side-mark-t { display: grid; min-width: 0; }
.t2-side-mark-n { font-size: var(--t2-fs-md); font-weight: 700; color: #fff; line-height: 1.25; }
.t2-side-mark-s { font-size: var(--t2-fs-2xs); color: var(--t2-on-dark-3); line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.t2-side.is-min .t2-side-mark-t { display: none; }
.t2-side.is-min .t2-side-mark { justify-content: center; width: 100%; }
.t2-side.is-min .t2-side-mark-l { width: 30px; height: 30px; }
.t2-side.is-min .t2-side-h { justify-content: center; }

@media (max-width: 64rem) {
  .t2-side.is-min .t2-side-mark-t { display: grid; }
  .t2-side.is-min .t2-side-mark { justify-content: flex-start; }
  .t2-side.is-min .t2-side-gh { display: flex; }
}

/* gap233 — رأسٌ أقلُّ ازدحامًا: الإجراءاتُ الثانويةُ في زرِّ المزيدِ على الشاشاتِ الضيّقة */

@media (max-width: 52rem) {
  .t2 .t2-head { position: relative; }
}

/* ===== gap235 — قرارُ المستخدم: شريطٌ جانبيٌّ فاتحٌ على أرضياتِ الإصدارِ الأول، وخطوطٌ فرعيةٌ أوضح ===== */

/* إعادةُ ضبطِ الأزرارِ بأسبقيّةٍ صفريةٍ حتى لا تسحبَ اللونَ والحجمَ من فئاتِ المكوّنات */
:where(.t2) button { font: inherit; color: inherit; }

.t2 .t2-side {
  background: var(--t2-surface);
  border-inline-start: 1px solid var(--t2-line);
}
.t2 .t2-side-mark-n { color: var(--t2-ink); }
.t2 .t2-side-mark-s { color: var(--t2-muted); }
.t2 .t2-side-t { color: var(--t2-ink-2); background: var(--t2-surface-2); border-color: var(--t2-line); }
.t2 .t2-side-t:hover { background: var(--t2-surface-3); border-color: var(--t2-line-2); }
.t2 .t2-side-i { color: var(--t2-ink-2); font-size: var(--t2-fs-md); }
.t2 .t2-side-i:hover { background: var(--t2-surface-3); color: var(--t2-ink); }
.t2 .t2-side-i.is-on { background: var(--t2-brand-wash); color: var(--t2-brand-3); font-weight: 600; }
.t2 .t2-side-i.is-soft { color: var(--t2-muted); font-size: var(--t2-fs-sm); }
.t2 .t2-side-gh { color: var(--t2-muted); font-size: var(--t2-fs-xs); font-weight: 700; }
.t2 .t2-side-gh:hover { color: var(--t2-ink); background: var(--t2-surface-3); }
.t2 .t2-side-c { background: var(--t2-brand-wash); color: var(--t2-brand-3); }
.t2 .t2-side-f { border-top: 1px solid var(--t2-line); }

/* خطوطٌ فرعيةٌ أكبر وأوضح */
.t2 .t2-card-d { font-size: var(--t2-fs-sm); line-height: 1.65; color: var(--t2-ink-2); }
.t2 .t2-phead-s { font-size: var(--t2-fs-md); }
.t2 .t2-field-k { font-size: var(--t2-fs-sm); }
.t2 .t2-note { font-size: var(--t2-fs-sm); }
.t2 .t2-hwho-r { font-size: var(--t2-fs-xs); }

/* التاريخُ والوقتُ لا ينكسرانِ على سطرَين */
.t2 .t2-field-v, .t2 .t2-panel-row { overflow-wrap: anywhere; }
.t2 time { white-space: nowrap; }

/* ===== gap237 — الشريطُ الجانبيُّ يتوافقُ مع الصفحة ===== */
.t2 .t2-side { background: var(--t2-surface-2); border-inline-start: 1px solid var(--t2-line-2); }
.t2 .t2-side-h {
  min-height: 4.5rem;
  align-items: center;
  border-bottom: 1px solid var(--t2-line);
  margin-bottom: var(--t2-sm);
}
.t2 .t2-side-i { padding: 6px var(--t2-sm); font-size: var(--t2-fs-sm); }
.t2 .t2-side-ic { width: 1.8rem; height: 1.8rem; }
.t2 .t2-side-gh { padding: 6px var(--t2-sm); }
.t2 .t2-side-f { padding-top: var(--t2-xs); }
.t2 .t2-side.is-min { padding-inline: 6px; }
.t2 .t2-side.is-min .t2-side-i { padding: 7px 0; }
.t2 .t2-side.is-min .t2-side-h { justify-content: center; }


.t2 .t2-row-wrap { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }


/* نصٌّ طويلٌ للقراءة: الشروطُ والخصوصية. عرضٌ محدودٌ لسطرٍ مقروء. */
.t2 .t2-prose { margin: 0 0 .7rem; line-height: 1.9; max-width: 68ch; color: var(--t2-ink, inherit); }
.t2 .t2-prose:last-child { margin-bottom: 0; }
.t2 ul.t2-prose { padding-inline-start: 1.2rem; }
.t2 ul.t2-prose li { margin: 0 0 .4rem; }


/* متنُ العقدِ كما يخرجُ من مُعقِّمِ النصِّ الغني: لا نلمسُ بنيتَه، نضبطُ قراءتَه. */
.t2 .t2-doc { line-height: 1.95; max-width: 72ch; }
.t2 .t2-doc p { margin: 0 0 .7rem; }
.t2 .t2-doc p:last-child { margin-bottom: 0; }
.t2 .t2-doc ul, .t2 .t2-doc ol { padding-inline-start: 1.2rem; margin: 0 0 .7rem; }
.t2 .t2-doc .var-miss { background: var(--t2-warn-bg, #fde68a); border-radius: .2rem; padding: 0 .2rem; }
.t2 .t2-doc-h { margin: 0 0 .5rem; font-size: var(--t2-fs-lg); font-weight: 700; }

/* ===== حالاتُ التفاعل الموحَّدة: لا نصَّ يختفي عند الضغط أو التركيز ===== */
.t2-tabs { padding-block: 3px; }
:where(.t2) :is(.t2-btn, .t2-tab, .t2-ibtn, .t2-back):focus-visible { outline: none; box-shadow: var(--t2-ring); }
:where(.t2) :is(.t2-tab, .t2-ibtn, .t2-back):active { color: inherit; }
:where(.t2) .t2-tab.is-on:active { color: var(--t2-brand-3); }

/* ===== شريطُ الرأس على الجوال: لا قصَّ لأزرار الخروج/المزيد ===== */
@media (max-width: 34rem) {
  .t2-sw { min-width: 0; max-width: 7rem; overflow: hidden; }
  .t2-sw * { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
/* تبويباتُ القالب والمعلومات الشخصية تلتفّ بدل أن تختفي خارج الشاشة */
@media (max-width: 46rem) {
  :where(.t2) :is(.t2-fm-page, .t2-pb-page) .t2-tabs { flex-wrap: wrap; overflow: visible; }
}

/* ===== شريطُ القوائمِ الموحَّد: بحثٌ وتصفيةٌ وترقيمٌ بشكلٍ واحد ===== */

/* على الشاشاتِ الضيّقة: زرُّ تبديلِ الدورِ يُقصَّرُ بـ«…» لا بقطعٍ حاد. */
@media (max-width: 768px) {
  .t2-sw { max-width: 46vw; }
  .t2-sw-btn { max-width: 100%; min-width: 0; }
  .t2-sw-btn span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

/* ----- استمارةُ التوثيقِ: عمودانِ — فهرسُ الأقسامِ ثابتٌ والمحتوى بجانبِه ----- */
.t2-vf { display: grid; grid-template-columns: 15rem minmax(0, 1fr); gap: var(--t2-sm); align-items: start; }
.t2-vf-nav { position: sticky; top: var(--t2-sm); display: flex; flex-direction: column; gap: 4px;
  background: var(--t2-card, #fff); border: 1px solid var(--t2-line, rgba(0,0,0,.08));
  border-radius: var(--t2-r, 14px); padding: 8px; }
.t2-vf-i { display: grid; grid-template-columns: 1.4rem 1fr auto; align-items: center; gap: 8px;
  width: 100%; padding: 10px 10px; border: 0; border-radius: 10px; background: transparent;
  font: inherit; font-size: var(--t2-fs-sm); text-align: start; cursor: pointer; color: inherit;
  transition: background .15s ease; }
.t2-vf-i:hover { background: rgba(0,0,0,.04); }
.t2-vf-ic { display: grid; place-items: center; width: 1.4rem; height: 1.4rem; border-radius: 50%; font-size: var(--t2-fs-xs); }
.t2-vf-i.is-ok .t2-vf-ic { background: rgba(10, 165, 173,.14); color: #0f7d72; }
.t2-vf-i.is-warn .t2-vf-ic { background: rgba(214,158,46,.16); color: #9a6b10; }
.t2-vf-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.t2-vf-n { font-size: var(--t2-fs-xs); font-variant-numeric: tabular-nums; color: #9a6b10;
  background: rgba(214,158,46,.16); border-radius: 999px; padding: 1px 7px; }
.t2-vf-i.is-ok .t2-vf-n { display: none; }
.t2-vf-main { display: flex; flex-direction: column; gap: var(--t2-sm); min-width: 0; }
.t2-vf-p { scroll-margin-top: var(--t2-sm); }
@media (max-width: 64rem) {
  .t2-vf { grid-template-columns: minmax(0, 1fr); }
  .t2-vf-nav { position: static; flex-direction: row; overflow-x: auto; }
  .t2-vf-i { width: auto; grid-template-columns: 1.4rem auto auto; white-space: nowrap; }
}
.t2-vf-bar { position: sticky; bottom: 0; z-index: 20; padding: 10px;
  background: var(--t2-card, #fff); border-top: 1px solid var(--t2-line, rgba(0,0,0,.08));
  box-shadow: 0 -6px 18px rgba(0,0,0,.05); border-radius: 0 0 var(--t2-r, 14px) var(--t2-r, 14px); }
.t2-vf-p .t2-field.is-missing .t2-input { border-color: #d69e2e; box-shadow: 0 0 0 3px rgba(214,158,46,.16); }
.t2-vf-p .t2-field.is-missing .t2-field-k { color: #9a6b10; }
/* استمارةُ التوثيق: قسمٌ واحدٌ معروض — الفهرسُ هو التبويب */
.t2-vf-p { display: none; }
.t2-vf-p.is-on { display: block; animation: t2-vf-in .18s ease; }
@keyframes t2-vf-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.t2-vf-p > .t2-fold > .t2-fold-h { display: none; }
.t2-vf-p > .t2-fold { margin: 0; border: 1px solid var(--t2-line, rgba(0,0,0,.08)); border-radius: var(--t2-r, 14px); background: var(--t2-card, #fff); }
.t2-vf-p > .t2-fold > .t2-fold-b { display: block; padding: var(--t2-sm, 14px); }
.t2-vf-i { border-inline-start: 3px solid transparent; border-radius: 10px; }
.t2-vf-i.is-on { background: rgba(10, 165, 173,.10); border-inline-start-color: #0AA5AD; font-weight: 700; }
.t2-vf-p input[type="date"] { direction: ltr; text-align: end; }
@media (max-width: 64rem) {
  .t2-vf-i { border-inline-start: 0; border-bottom: 3px solid transparent; border-radius: 10px 10px 0 0; }
  .t2-vf-i.is-on { border-bottom-color: #0AA5AD; }
}

/* ===== التخطيطُ الرئيس: ترويسةٌ بعرضِ الصفحةِ أعلاها، ثمّ القائمةُ والمحتوى أسفلَها ===== */
.t2.t2-app {
  --t2-hh: 4.5rem;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: var(--t2-hh) minmax(0, 1fr);
  grid-template-areas: "head head" "side main";
}
.t2.t2-app > .t2-head {
  grid-area: head; position: sticky; top: 0; z-index: 60;
  height: var(--t2-hh); min-height: 0; box-sizing: border-box;
  display: flex; align-items: center; gap: var(--t2-sm, 14px);
  padding-inline: var(--t2-sm, 14px);
}
.t2.t2-app > .t2-side {
  grid-area: side; position: sticky; top: var(--t2-hh); z-index: 45;
  height: calc(100dvh - var(--t2-hh)); max-height: none; align-self: start;
}
.t2.t2-app > .t2-main { grid-area: main; min-width: 0; }
.t2.t2-app > .t2-side-bd { grid-area: main; }
/* الهويّةُ في الترويسة وحدَها — لا تتكرّرُ أعلى القائمة */
.t2.t2-app > .t2-side .t2-side-mark { display: none; }
.t2.t2-app > .t2-side .t2-side-h { justify-content: flex-end; min-height: 0; padding-block: 8px; }
/* قائمةُ المستخدم */
.t2-hwho-w { position: relative; }
.t2 .t2-hwho { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 4px 10px;
  border: 1px solid transparent; border-radius: 12px; background: transparent; font: inherit; color: inherit; cursor: pointer; text-align: start; }
.t2 .t2-hwho:hover, .t2-hwho-w.is-open .t2-hwho { background: var(--t2-surface-2); border-color: var(--t2-line, rgba(0,0,0,.08)); }
.t2-hwho-c { font-size: var(--t2-fs-2xs); color: var(--t2-muted); transition: transform .15s ease; }
.t2-hwho-w.is-open .t2-hwho-c { transform: rotate(180deg); }
.t2-hwho-m { display: none; position: absolute; inset-inline-start: 0; top: calc(100% + 6px); z-index: 80; min-width: 13rem;
  padding: 6px; background: var(--t2-surface, #fff); border: 1px solid var(--t2-line, rgba(0,0,0,.08));
  border-radius: 12px; box-shadow: var(--t2-sh-3, 0 12px 32px rgba(0,0,0,.14)); }
.t2-hwho-w.is-open .t2-hwho-m { display: grid; gap: 2px; }
@media (max-width: 64rem) {
  .t2.t2-app { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "main"; }
  .t2.t2-app > .t2-side { position: fixed; top: var(--t2-hh); height: calc(100dvh - var(--t2-hh)); }
  .t2.t2-app > .t2-side-bd { top: var(--t2-hh); }
}
/* الغلافُ القديم (overflow-y:auto) كان يصير حاويةَ تمريرٍ لا تتحرّك فيُبطل sticky؛ clip لا يُنشئ حاويةً */
html.t2-on .page.tera-hr { overflow-x: clip; overflow-y: visible; }
/* الترويسة تمتدّ مساحتُها على الصفوفِ كلّها وتُرسَمُ في الصفِّ الأوّل — فتبقى مثبّتةً طوالَ التمرير */
.t2.t2-app > .t2-head { grid-area: 1 / 1 / -1 / -1; align-self: start; }
/* gap639: header fits narrow screens without clipping */
@media (max-width: 40rem) {
  .t2.t2-app > .t2-head { gap: 6px; padding-inline: 8px; }
  .t2.t2-app > .t2-head .t2-sw { max-width: 5.5rem; }
}
/* gap639: labels for header quick actions inside the "more" menu on narrow screens */

/* ===== gap640 — منتقي التاريخ الموحّد (datepicker.js) ===== */
.t2-dp-src { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; border: 0 !important; opacity: 0; overflow: hidden; clip-path: inset(50%); pointer-events: none; }
.t2 .t2-input.t2-dp { display: inline-flex; align-items: center; justify-content: space-between; gap: var(--t2-s2); min-width: 9.5rem; min-height: var(--t2-ctl, 2.5rem); text-align: start; cursor: pointer; font-variant-numeric: tabular-nums; }
.t2 .t2-input.t2-dp .t2-dp-t { direction: ltr; unicode-bidi: isolate; }
.t2 .t2-input.t2-dp.is-empty .t2-dp-t { direction: rtl; color: var(--t2-muted); }
.t2 .t2-input.t2-dp .t2-dp-i { display: inline-flex; color: var(--t2-brand-2); flex: none; }
.t2 .t2-input.t2-dp:hover:not(:disabled) { border-color: var(--t2-brand); }
.t2 .t2-input.t2-dp[aria-expanded="true"] { border-color: var(--t2-brand); box-shadow: var(--t2-ring); }
.t2 .t2-input.t2-dp:disabled, .t2 .t2-input.t2-dp.is-ro { cursor: default; background: var(--t2-surface-2); color: var(--t2-ink-2); }
.t2 .t2-input.t2-dp:disabled .t2-dp-i { color: var(--t2-muted); }
.t2 .t2-input.t2-dp:focus-visible { outline: none; border-color: var(--t2-brand); box-shadow: var(--t2-ring); }
.t2-dp-pop { position: fixed; inset: auto; margin: 0; z-index: 1000; width: 18.5rem; max-width: calc(100vw - 16px); box-sizing: border-box; padding: var(--t2-s3); background: var(--t2-elev); color: var(--t2-ink); border: 1px solid var(--t2-line); border-radius: var(--t2-r-lg); box-shadow: var(--t2-sh-3); direction: rtl; font-family: var(--t2-ff-text); font-size: var(--t2-fs-sm); }
.t2-dp-pop:popover-open { display: block; }
.t2-dp-h { display: grid; grid-template-columns: 2.25rem 1fr auto 2.25rem; gap: var(--t2-s1); align-items: center; margin-bottom: var(--t2-s2); }
.t2-dp-nav { height: 2.25rem; border: 1px solid var(--t2-line); border-radius: var(--t2-r-xs); background: var(--t2-surface); color: var(--t2-ink); font-size: var(--t2-fs-xl); line-height: 1; cursor: pointer; }
.t2-dp-nav:hover:not(:disabled) { border-color: var(--t2-brand); color: var(--t2-brand-2); }
.t2-dp-nav:disabled { opacity: .4; cursor: default; }
.t2-dp-sel { height: 2.25rem; border: 1px solid var(--t2-line); border-radius: var(--t2-r-xs); background: var(--t2-surface); color: var(--t2-ink); font: inherit; font-weight: 700; padding: 0 .4rem; cursor: pointer; }
.t2-dp-g { display: grid; gap: 2px; }
.t2-dp-row { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.t2-dp-wd { text-align: center; font-size: var(--t2-fs-2xs); color: var(--t2-muted); font-weight: 700; padding: .25rem 0; }
.t2-dp-d, .t2-dp-x { height: 2.35rem; }
.t2-dp-d { border: 1px solid transparent; border-radius: var(--t2-r-xs); background: transparent; color: var(--t2-ink); font: inherit; font-variant-numeric: tabular-nums; cursor: pointer; }
.t2-dp-d:hover:not(:disabled) { background: var(--t2-brand-wash); color: var(--t2-brand-3); }
.t2-dp-d:focus-visible { outline: none; border-color: var(--t2-brand); box-shadow: var(--t2-ring); }
.t2-dp-d.is-today { border-color: var(--t2-brand); font-weight: 700; }
.t2-dp-d.is-sel { background: var(--t2-brand); color: var(--t2-brand-ink); font-weight: 700; }
.t2-dp-d:disabled { color: var(--t2-line-2); cursor: not-allowed; }
.t2-dp-f { display: flex; gap: var(--t2-s2); justify-content: flex-start; margin-top: var(--t2-s2); padding-top: var(--t2-s2); border-top: 1px solid var(--t2-line); }
.t2-dp-a { min-height: 2.25rem; padding: 0 .8rem; border: 1px solid var(--t2-line); border-radius: var(--t2-r-pill); background: var(--t2-surface); color: var(--t2-ink-2); font: inherit; font-weight: 700; cursor: pointer; }
.t2-dp-a:hover:not(:disabled) { border-color: var(--t2-brand); color: var(--t2-brand-2); }
.t2-dp-a.is-main { margin-inline-start: auto; background: var(--t2-brand); border-color: var(--t2-brand); color: var(--t2-brand-ink); }
.t2-dp-a:disabled { opacity: .45; cursor: default; }
.t2-dp-a:focus-visible, .t2-dp-nav:focus-visible, .t2-dp-sel:focus-visible { outline: none; box-shadow: var(--t2-ring); border-color: var(--t2-brand); }
.t2-field.is-missing .t2-input.t2-dp { border-color: var(--t2-warn); background: var(--t2-warn-wash); }

/* ===== gap640 — طبقة الرموز الموحّدة (Design Tokens) لكل شاشات /admin =====
 * نقاط الاستجابة (تُكتب حرفيًا في @media لأن المتغيّرات لا تعمل فيها):
 * sm 30rem (480) · md 40rem (640) · lg 52rem (832) · xl 64rem (1024) · 2xl 80rem (1280) */
.t2 {
  /* الحالات الخمس المعتمدة: مكتمل · يحتاج إجراء · خطأ · قيد المراجعة · غير متوفر */
}

/* الضوابط: ارتفاعٌ واحد لكل حقول السطر الواحد والقوائم ومنتقي التاريخ */
.t2 .t2-input:is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="color"], .t2-dp-src), select, .t2-dp) {
  box-sizing: border-box;
  height: var(--t2-ctl);
  min-height: var(--t2-ctl);
  padding-block: 0;
  line-height: var(--t2-lh-tight);
}
.t2 :is(.t2-table, .t2-pager-s) .t2-input:is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="color"], .t2-dp-src), select, .t2-dp), .t2 .t2-input.is-sm:is(input, select, .t2-dp) {
  height: var(--t2-ctl-sm);
  min-height: var(--t2-ctl-sm);
}
.t2 .t2-btn { box-sizing: border-box; min-height: var(--t2-ctl); }
.t2 .t2-btn.is-sm { min-height: var(--t2-ctl-sm); }

/* مكوّن الحالة الموحّد: نفس الشكل في كل الشاشات، بنقطة لونية تسبق النص */
.t2-pill { border: 1px solid var(--t2-st-none-line); background: var(--t2-st-none-bg); color: var(--t2-st-none); padding: .12rem .55rem; line-height: 1.5; }
.t2-pill::before { content: ""; inline-size: .42rem; block-size: .42rem; border-radius: 50%; background: currentColor; flex: none; opacity: .9; }
.t2-pill.is-ok { background: var(--t2-st-ok-bg); color: var(--t2-st-ok); border-color: var(--t2-st-ok-line); }
.t2-pill.is-warn { background: var(--t2-st-warn-bg); color: var(--t2-st-warn); border-color: var(--t2-st-warn-line); }
.t2-pill:is(.is-danger, .is-bad) { background: var(--t2-st-danger-bg); color: var(--t2-st-danger); border-color: var(--t2-st-danger-line); }
.t2-pill.is-info { background: var(--t2-st-info-bg); color: var(--t2-st-info); border-color: var(--t2-st-info-line); }

/* التركيز المرئي الموحّد للوحة المفاتيح */
:where(.t2) :where(a, button, [role="button"], [tabindex]):focus-visible { outline: 2px solid var(--t2-brand); outline-offset: 2px; }

/* ===== gap642 — الحقولُ الذكيّة (inputspec.js): خاناتٌ منفصلة · آيبان · أرقام ===== */
.t2-si-src { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; border: 0 !important; opacity: 0; overflow: hidden; clip-path: inset(50%); pointer-events: none; }
.t2 .t2-seg { position: relative; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: var(--t2-s1); direction: ltr; max-width: 100%; }
.t2 .t2-seg-in { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; margin: 0; padding: 0; border: 0; opacity: 0; font-size: 16px; cursor: text; z-index: 1; }
.t2 .t2-seg-b { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; inline-size: 2.6rem; block-size: var(--t2-ctl); padding: 0; text-align: center; border: 1px solid var(--t2-line-2); border-radius: var(--t2-r-xs); background: var(--t2-surface); color: var(--t2-ink); font-family: var(--t2-ff-display); font-size: var(--t2-fs-lg); font-weight: var(--t2-fw-b); font-variant-numeric: tabular-nums; text-transform: uppercase; caret-color: var(--t2-brand); transition: border-color var(--t2-fast) var(--t2-ease), box-shadow var(--t2-fast) var(--t2-ease), background var(--t2-fast) var(--t2-ease); }
.t2 .t2-seg.is-on .t2-seg-b { border-color: var(--t2-brand); }
.t2 .t2-seg-b.is-cur { border-color: var(--t2-brand); box-shadow: var(--t2-ring); background: var(--t2-surface); }
.t2 .t2-seg.is-long .t2-seg-b { inline-size: 2.15rem; }
.t2 .t2-seg.is-full .t2-seg-b { border-color: var(--t2-brand); background: var(--t2-brand-wash); }
.t2 .t2-seg.is-deny .t2-seg-b.is-cur { border-color: var(--t2-danger); box-shadow: 0 0 0 3px var(--t2-danger-wash); }
.t2 .t2-seg.is-off .t2-seg-b { background: var(--t2-surface-2); color: var(--t2-ink-2); }
.t2 .t2-seg.is-off .t2-seg-in { cursor: default; }
.t2 .t2-seg-sep { inline-size: var(--t2-s2); block-size: 2px; background: var(--t2-line-2); border-radius: 2px; margin-inline: 2px; }
.t2-field.is-missing .t2-seg-b { border-color: var(--t2-warn); background: var(--t2-warn-wash); }
.t2 .t2-input.t2-iban { direction: ltr; text-align: left; font-family: var(--t2-ff-display); font-size: var(--t2-fs-md); letter-spacing: .06em; font-variant-numeric: tabular-nums; text-transform: uppercase; width: 100%; }
.t2 .t2-input.t2-iban::placeholder { letter-spacing: .04em; text-transform: none; }
.t2 .t2-si-hint { margin-top: var(--t2-s1); font-size: var(--t2-fs-xs); color: var(--t2-muted); line-height: var(--t2-lh); }
.t2 .t2-si-hint.is-ok { color: var(--t2-st-ok); font-weight: var(--t2-fw-b); }
.t2 .t2-si-hint.is-err { color: var(--t2-st-danger); font-weight: var(--t2-fw-b); }
.t2-field.is-missing .t2-input.t2-iban { border-color: var(--t2-warn); background: var(--t2-warn-wash); }
@media (max-width: 30rem) {
  .t2 .t2-seg-b { inline-size: 2.2rem; font-size: var(--t2-fs-md); }
  .t2 .t2-seg.is-long .t2-seg-b { inline-size: 1.85rem; }
}

/* ===== gap646 — رمزُ التحقّق على المكوّن الموحّد · بدايةٌ إلزاميّة · حقلُ الجوال ===== */
.t2 .t2-seg-note { margin-top: var(--t2-s1); font-size: var(--t2-fs-xs); font-weight: var(--t2-fw-b); color: var(--t2-st-danger); }
.t2 .t2-seg-note:empty { display: none; }
.t2 .t2-seg-b[data-fixed]:empty::after { content: attr(data-fixed); color: var(--t2-line-2); }
.t2 .t2-otp.t2-seg { justify-content: center; gap: var(--t2-s2); }
.t2-auth .t2-otp.t2-seg { justify-content: flex-start; }
.t2 .t2-otp .t2-seg-b { inline-size: 2.9rem; block-size: 3.2rem; border-radius: var(--t2-r); font-size: var(--t2-fs-xl); }
.t2 .t2-otp.is-full .t2-seg-b { border-color: var(--t2-brand); background: var(--t2-brand-wash); }
.t2 .t2-otp.is-err .t2-seg-b { border-color: var(--t2-danger); background: var(--t2-danger-wash); animation: t2-shake .28s var(--t2-ease); }
.t2 .t2-otp.is-ok .t2-seg-b { border-color: var(--t2-ok); background: var(--t2-ok-wash); }
.t2 .t2-otp.is-busy { opacity: .6; pointer-events: none; }
@media (max-width: 30rem) {
  .t2 .t2-otp .t2-seg-b { inline-size: 2.35rem; block-size: 2.8rem; font-size: var(--t2-fs-lg); }
}
@media (max-width: 22rem) {
  .t2 .t2-otp.t2-seg { gap: 4px; }
  .t2 .t2-otp .t2-seg-b { inline-size: 2.05rem; block-size: 2.5rem; font-size: var(--t2-fs-md); }
}
.t2 .t2-pi-row { display: flex; align-items: stretch; direction: ltr; }
.t2 .t2-pi-row .t2-pi-cc { flex: 0 0 auto; max-width: 46%; }
.t2 .t2-pi-row .t2-pi-num { flex: 1 1 auto; min-width: 0; }
.t2 .t2-pi-row .t2-pi-cc .t2-input { max-width: 100%; border-start-end-radius: 0; border-end-end-radius: 0; background: var(--t2-surface-2); font-variant-numeric: tabular-nums; }
.t2 .t2-pi-row .t2-pi-num .t2-input { width: 100%; margin-inline-start: -1px; border-start-start-radius: 0; border-end-start-radius: 0; font-family: var(--t2-ff-display); letter-spacing: .04em; font-variant-numeric: tabular-nums; }
.t2 .t2-pi-row .t2-input:focus { position: relative; z-index: 1; }

/* ===== gap647 — اللوحة والبطاقات والحالات: مؤشّرٌ يُفتَح · إجراءاتٌ سريعة · حالةٌ موحّدة · هياكلُ تحميل ===== */
.t2 .t2-sr { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* المؤشّر: أيقونةٌ في حاوية، وسهمُ فتحٍ حين يكونُ زرًّا */

/* الإجراءاتُ السريعة */
.t2 .t2-qa { display: grid; gap: var(--t2-sm); grid-template-columns: repeat(auto-fill, minmax(13.5rem, 1fr)); }
.t2 .t2-qa-i { display: grid; grid-template-columns: 2.4rem minmax(0, 1fr) .8rem; align-items: center; gap: var(--t2-sm); min-block-size: 3.7rem; padding: var(--t2-sm) var(--t2-md); border: 1px solid var(--t2-line); border-radius: var(--t2-r); background: var(--t2-surface); box-shadow: var(--t2-sh-1); font: inherit; color: inherit; text-align: start; cursor: pointer; animation: t2-rise var(--t2-slow) var(--t2-ease) both; transition: border-color var(--t2-fast) var(--t2-ease), box-shadow var(--t2-fast) var(--t2-ease), transform var(--t2-fast) var(--t2-ease); }
.t2 .t2-qa-i:hover { border-color: var(--t2-brand); box-shadow: var(--t2-sh-2); transform: translateY(-1px); }
.t2 .t2-qa-ic { display: grid; place-items: center; inline-size: 2.4rem; block-size: 2.4rem; border-radius: var(--t2-r-xs); background: var(--t2-brand-wash); line-height: 0; }
.t2 .t2-qa-b { display: grid; gap: 1px; min-inline-size: 0; }
.t2 .t2-qa-t { font-size: var(--t2-fs-sm); font-weight: 700; color: var(--t2-ink); line-height: 1.45; }
.t2 .t2-qa-d { font-size: var(--t2-fs-2xs); color: var(--t2-muted); line-height: 1.5; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.t2 .t2-qa-go { justify-self: end; font-size: var(--t2-fs-lg); line-height: 1; color: var(--t2-line-2); transition: color var(--t2-fast) var(--t2-ease), transform var(--t2-fast) var(--t2-ease); }
.t2 .t2-qa-i:is(:hover, :focus-visible) .t2-qa-go { color: var(--t2-brand); transform: translateX(-3px); }

/* التنبيه: شريطُ لونِ الحالةِ في البداية، وإجراءٌ اختياريّ */
.t2 .t2-note { border-inline-start-width: 3px; }
.t2 .t2-note.is-ok { border-inline-start-color: var(--t2-st-ok); }
.t2 .t2-note.is-warn { border-inline-start-color: var(--t2-st-warn); }
.t2 .t2-note.is-danger { border-inline-start-color: var(--t2-st-danger); }
.t2 .t2-note.is-info { border-inline-start-color: var(--t2-st-info); }
.t2 .t2-note-c { flex: 1 1 auto; min-inline-size: 0; }
.t2 .t2-note-a { margin-top: var(--t2-sm); }

/* الفراغ */
.t2 .t2-empty-i { display: grid; place-items: center; inline-size: 4rem; block-size: 4rem; border-radius: 50%; background: var(--t2-surface-2); line-height: 0; }
.t2 .t2-empty-a { margin-top: 2px; }
.t2 .t2-empty.is-compact { padding: var(--t2-md); gap: 6px; }
.t2 .t2-empty.is-compact .t2-empty-i { inline-size: 3rem; block-size: 3rem; }

/* الحالةُ الموحّدة: 🟢 ok · 🟡 warn · 🔴 danger · 🔵 info · ⚪ none */
.t2 .t2-state { display: flex; align-items: flex-start; gap: var(--t2-md); padding: var(--t2-md) var(--t2-lg); border: 1px solid var(--t2-st-none-line); border-inline-start: 4px solid var(--t2-st-none); border-radius: var(--t2-r); background: var(--t2-st-none-bg); animation: t2-fade var(--t2-slow) var(--t2-ease) both; }
.t2 .t2-state.is-ok { background: var(--t2-st-ok-bg); border-color: var(--t2-st-ok-line); border-inline-start-color: var(--t2-st-ok); }
.t2 .t2-state.is-warn { background: var(--t2-st-warn-bg); border-color: var(--t2-st-warn-line); border-inline-start-color: var(--t2-st-warn); }
.t2 .t2-state.is-danger { background: var(--t2-st-danger-bg); border-color: var(--t2-st-danger-line); border-inline-start-color: var(--t2-st-danger); }
.t2 .t2-state.is-info { background: var(--t2-st-info-bg); border-color: var(--t2-st-info-line); border-inline-start-color: var(--t2-st-info); }
.t2 .t2-state-i { flex: none; display: grid; place-items: center; inline-size: 2.6rem; block-size: 2.6rem; border-radius: 50%; background: var(--t2-surface); line-height: 0; }
.t2 .t2-state-c { flex: 1 1 auto; min-inline-size: 0; display: grid; gap: 2px; }
.t2 .t2-state-t { font-size: var(--t2-fs-md); font-weight: 700; color: var(--t2-ink); line-height: 1.5; }
.t2 .t2-state-b { font-size: var(--t2-fs-sm); color: var(--t2-ink-2); line-height: 1.7; }
.t2 .t2-state-a { margin-top: var(--t2-sm); }
.t2 .t2-state > .t2-pill { flex: none; }

/* هياكلُ التحميل بشكلِ المحتوى */
.t2 .t2-skel { position: relative; }
.t2 .t2-skel.is-page { gap: var(--t2-lg); }
.t2 :is(.t2-sk-card, .t2-sk-stat, .t2-sk-hero) { display: grid; gap: .55rem; align-content: start; padding: var(--t2-md); border: 1px solid var(--t2-line); border-radius: var(--t2-r); background: var(--t2-surface); }
.t2 .t2-sk-card { min-block-size: 4.3rem; }
.t2 .t2-sk-hero { min-block-size: 8.5rem; border-radius: var(--t2-r-lg); }
.t2 .t2-sk-l { display: block; block-size: .7rem; border-radius: var(--t2-r-pill); background: linear-gradient(90deg, var(--t2-surface-2) 25%, var(--t2-surface-3) 37%, var(--t2-surface-2) 63%); background-size: 400% 100%; animation: t2-shim 1.3s ease-in-out infinite; }
.t2 .t2-sk-l.is-a { inline-size: 42%; }
.t2 .t2-sk-l.is-b { inline-size: 68%; block-size: 1.15rem; }
.t2 .t2-sk-l.is-c { inline-size: 86%; }

/* الترحيب: التاريخُ والساعةُ في سطرٍ واحد، والخلايا تتّسعُ لها */

@media (max-width: 30rem) {
  .t2 .t2-qa { grid-template-columns: minmax(0, 1fr); }
  .t2 .t2-state { padding: var(--t2-md); gap: var(--t2-sm); flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  .t2 .t2-qa-i:hover { transform: none; }
}

/* ===== gap648 — النماذج (القوائم ورفعُ الملفّات) · الجداول · النوافذ · الإشعارات ===== */

/* القائمةُ المنسدلة: سهمٌ واحدٌ كحلي في نهاية الحقل. لا يتلوّن عند الضغط. */
.t2 select.t2-input:not([multiple]) {
  appearance: none; -webkit-appearance: none; -moz-appearance: none;
  padding-inline-end: 2.4rem;
  background-color: var(--t2-surface);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%230A1F44' d='M216.49,104.49l-80,80a12,12,0,0,1-17,0l-80-80a12,12,0,0,1,17-17L128,159l71.51-71.52a12,12,0,0,1,17,17Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 16px 16px;
  background-position: left 12px center;
}
.t2 select.t2-input:not([multiple]):is(:focus, :active) {
  background-color: var(--t2-surface);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%230A1F44' d='M216.49,104.49l-80,80a12,12,0,0,1-17,0l-80-80a12,12,0,0,1,17-17L128,159l71.51-71.52a12,12,0,0,1,17,17Z'/%3E%3C/svg%3E");
}
.t2 :is(.t2-table, .t2-pager-s) select.t2-input:not([multiple]) { padding-inline-end: 1.8rem; background-position: left 8px center; }
.t2 [dir="ltr"] select.t2-input:not([multiple]), .t2 select.t2-input[dir="ltr"]:not([multiple]) { background-position: right 12px center; }
.t2 select.t2-input:disabled, .t2 .t2-input:disabled { opacity: .6; cursor: not-allowed; background-color: var(--t2-surface-2); }

/* رفعُ الملفّات: منطقةُ إفلاتٍ والحقلُ الأصليُّ فوقَها شفّافًا (يستقبلُ النقرَ ولوحةَ المفاتيح) */
.t2 .t2-file { position: relative; display: grid; grid-template-columns: 2.4rem minmax(0, 1fr) auto; align-items: center; gap: var(--t2-sm); min-block-size: 3.6rem; max-inline-size: 100%; padding: var(--t2-sm) var(--t2-md); border: 1.5px dashed var(--t2-line-2); border-radius: var(--t2-r); background: var(--t2-surface-2); transition: border-color var(--t2-fast) var(--t2-ease), background var(--t2-fast) var(--t2-ease), box-shadow var(--t2-fast) var(--t2-ease); }
.t2 .t2-file > input[type="file"] { position: absolute; inset: 0; z-index: 1; inline-size: 100%; block-size: 100%; margin: 0; padding: 0; border: 0; opacity: 0; cursor: pointer; font-size: 0; }
.t2 .t2-file:hover, .t2 .t2-file.is-drag { border-color: var(--t2-brand); background: var(--t2-brand-wash); }
.t2 .t2-file.is-drag { border-style: solid; }
.t2 .t2-file:focus-within { border-color: var(--t2-brand); box-shadow: var(--t2-ring); }
.t2 .t2-file.is-has { border-style: solid; border-color: var(--t2-st-ok-line); background: var(--t2-st-ok-bg); }
.t2 .t2-file.is-deny { border-style: solid; border-color: var(--t2-st-danger); background: var(--t2-st-danger-bg); }
.t2 .t2-file.is-off { opacity: .6; }
.t2 .t2-file.is-off > input[type="file"] { cursor: not-allowed; }
.t2 .t2-file-ic { display: grid; place-items: center; inline-size: 2.4rem; block-size: 2.4rem; border-radius: 50%; border: 1px solid var(--t2-line); background: var(--t2-surface); color: var(--t2-brand); font-size: 1.1rem; font-weight: 700; line-height: 1; }
.t2 .t2-file.is-has .t2-file-ic { color: var(--t2-st-ok); }
.t2 .t2-file-b { display: grid; gap: 1px; min-inline-size: 0; }
.t2 .t2-file-t { font-size: var(--t2-fs-sm); font-weight: 600; color: var(--t2-ink); line-height: 1.5; }
.t2 .t2-file-h { font-size: var(--t2-fs-2xs); color: var(--t2-muted); line-height: 1.5; }
.t2 .t2-file-n { font-size: var(--t2-fs-xs); font-weight: 600; color: var(--t2-st-ok); line-height: 1.5; overflow-wrap: anywhere; }
.t2 .t2-file-n:empty { display: none; }
.t2 .t2-file-n.is-err { color: var(--t2-st-danger); }
.t2 .t2-file-btn { padding: .3rem .85rem; border: 1px solid var(--t2-line); border-radius: var(--t2-r-pill); background: var(--t2-surface); font-size: var(--t2-fs-xs); font-weight: 600; color: var(--t2-ink-2); white-space: nowrap; }
@media (max-width: 30rem) {
  .t2 .t2-file { grid-template-columns: 2.2rem minmax(0, 1fr); }
  .t2 .t2-file-btn { display: none; }
}

/* الجداول: رأسُ الفرزِ يصلُه المفتاح Tab، والصفُّ القابلُ للفتحِ كذلك */

/* الجداول على الجوال: كلُّ صفٍّ بطاقة، وكلُّ خليةٍ بعنوانِ عمودِها، ورؤوسُ الفرزِ أزرارٌ صغيرةٌ فوقَها */

/* النوافذ والجُرّار: زرُّ إغلاقٍ بمساحةِ لمسٍ كافية، وتذييلٌ ثابتٌ في أسفلِ النافذة */
.t2 .t2-x { inline-size: 2.25rem; block-size: 2.25rem; border-radius: 50%; flex: none; }
.t2 .t2-x:focus-visible { outline: 2px solid var(--t2-brand); outline-offset: 2px; }
.t2.t2-modal .t2-modal-c { animation: t2-pop var(--t2-slow) var(--t2-ease) both; }
.t2.t2-modal .t2-modal-c > .t2-row:last-child { position: sticky; bottom: calc(var(--t2-md) * -1); margin-inline: calc(var(--t2-md) * -1); margin-bottom: calc(var(--t2-md) * -1); padding: var(--t2-sm) var(--t2-md); border-top: 1px solid var(--t2-line-2); background: inherit; }
@media (max-width: 30rem) {
  .t2.t2-modal { place-items: end center; padding: 0; }
  .t2.t2-modal .t2-modal-c { inline-size: 100%; max-height: 92vh; border-radius: var(--t2-r-lg) var(--t2-r-lg) 0 0; animation: t2-up var(--t2-slow) var(--t2-ease) both; }
  .t2.t2-dlg2 { padding: var(--t2-sm); }
  .t2 .t2-dlg2-a .t2-btn { flex: 1 1 8rem; }
}


/* ===== gap649 — مربّعاتُ الاختيار بلونِ النظام · شارةُ التبديل على الجوال ===== */
.t2 input:is([type="checkbox"], [type="radio"]) { accent-color: var(--t2-brand); cursor: pointer; }
.t2 input:is([type="checkbox"], [type="radio"]):disabled { cursor: not-allowed; }
@media (max-width: 30rem) {
  .t2 .t2-head .t2-sw-btn .t2-sw-tag { display: none; }
}

/* ===== gap650 — الترويسةُ والقائمةُ الجانبيةُ ولوحتي: لغةُ تصميمٍ واحدةٍ للمنتج ===== */

/* ——— الإطار: ترويسةٌ وقائمةٌ بيضاوان تحيطان بأرضيّةِ المحتوى ——— */
.t2.t2-app { --t2-hh: 4.25rem; --t2-side-w: 16rem; }
.t2.t2-app > .t2-head {
  gap: var(--t2-md);
  padding-inline: var(--t2-md) var(--t2-md);
  background: var(--t2-surface);
  border-bottom: 1px solid var(--t2-line);
  box-shadow: 0 1px 0 rgba(16, 35, 58, .02), 0 6px 18px -14px rgba(16, 35, 58, .35);
}
/* الشعار: الصورةُ الأصليةُ عاليةُ الدقّة مقصوصةً على العلامة نفسِها بلا هوامشِها الشفّافة */

/* المستخدم: صورةٌ رمزيةٌ بالحرفِ الأوّل، ثمّ الاسمُ والدور */
.t2.t2-app > .t2-head .t2-hwho { gap: 10px; padding: 4px 8px 4px 10px; border-radius: 999px; border: 1px solid var(--t2-line); background: var(--t2-surface); }
.t2.t2-app > .t2-head .t2-hwho:hover, .t2.t2-app > .t2-head .t2-hwho-w.is-open .t2-hwho { background: var(--t2-surface-2); border-color: var(--t2-line-2); }
.t2.t2-app > .t2-head .t2-hwho-n { font-size: var(--t2-fs-sm); font-weight: 700; color: var(--t2-ink); max-width: 13rem; }
.t2.t2-app > .t2-head .t2-hwho-r { font-size: var(--t2-fs-2xs); font-weight: 600; color: var(--t2-brand-2); }

/* أزرارُ الترويسة: مقاسٌ واحدٌ 40px، والخروجُ زرٌّ ثانويٌّ تحذيريّ */
.t2.t2-app > .t2-head .t2-hbtn { min-width: 2.5rem; height: 2.5rem; border-radius: 12px; background: var(--t2-surface); border-color: var(--t2-line); color: var(--t2-ink-2); }
.t2.t2-app > .t2-head .t2-hbtn:hover { background: var(--t2-brand-wash); border-color: var(--t2-brand); color: var(--t2-brand-3); transform: none; }
.t2.t2-app > .t2-head .t2-hbtn.is-out { padding-inline: 12px; gap: 6px; color: var(--t2-danger); background: var(--t2-surface); border-color: #f1c9c4; font-weight: 600; }
.t2.t2-app > .t2-head .t2-hbtn.is-out:hover { background: var(--t2-danger); border-color: var(--t2-danger); color: #fff; }
.t2.t2-app > .t2-head .t2-hbtn-n { font-family: var(--t2-ff-display); }
.t2.t2-app > .t2-head .t2-sw-btn { min-height: 2.5rem; border-radius: 999px; }

/* ——— القائمةُ الجانبية: متّصلةٌ بالترويسة، تمريرُها داخليّ، وزرُّ الطيِّ في أسفلِها ——— */
.t2.t2-app > .t2-side {
  width: var(--t2-side-w);
  padding: 12px 10px 0;
  gap: 0;
  background: var(--t2-surface);
  border-inline-start: 1px solid var(--t2-line);
  scrollbar-width: thin;
  scrollbar-color: var(--t2-line-2) transparent;
}
.t2.t2-app > .t2-side.is-min { width: 4.75rem; padding-inline: 8px; }
.t2.t2-app > .t2-side .t2-side-h { display: none; }
.t2.t2-app > .t2-side .t2-side-n { gap: 0; }
.t2.t2-app > .t2-side .t2-side-g { gap: 2px; }
.t2.t2-app > .t2-side .t2-side-g + .t2-side-g { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--t2-line); }
.t2.t2-app > .t2-side .t2-side-gh { padding: 4px 10px 6px; font-size: var(--t2-fs-2xs); font-weight: 700; letter-spacing: .04em; color: var(--t2-muted); }
.t2.t2-app > .t2-side .t2-side-i {
  min-height: 2.75rem; padding: 6px 10px; gap: 10px;
  grid-template-columns: 2rem minmax(0, 1fr) auto;
  border-radius: 10px; font-size: var(--t2-fs-sm); font-weight: 500; color: var(--t2-ink-2);
}
.t2.t2-app > .t2-side .t2-side-ic { inline-size: 2rem; block-size: 2rem; border-radius: 9px; background: var(--t2-surface-2); }
.t2.t2-app > .t2-side .t2-side-i:hover { background: var(--t2-surface-2); color: var(--t2-ink); }
.t2.t2-app > .t2-side .t2-side-i:hover .t2-side-ic { background: var(--t2-surface); }
.t2.t2-app > .t2-side .t2-side-i.is-on { background: var(--t2-brand-wash); color: var(--t2-brand-3); font-weight: 700; }
.t2.t2-app > .t2-side .t2-side-i.is-on .t2-side-ic { background: var(--t2-surface); box-shadow: 0 1px 2px rgba(16, 35, 58, .08); }
.t2.t2-app > .t2-side .t2-side-i.is-on::before { inset-block: 8px; inline-size: 3px; border-radius: 3px; }
.t2.t2-app > .t2-side .t2-side-c { font-family: var(--t2-ff-display); font-size: var(--t2-fs-2xs); font-weight: 700; padding: 1px 7px; border-radius: 999px; }
.t2.t2-app > .t2-side.is-min .t2-side-i { grid-template-columns: 1fr; padding: 6px 0; }
.t2.t2-app > .t2-side.is-min .t2-side-g + .t2-side-g { margin-top: 6px; padding-top: 6px; }
.t2.t2-app > .t2-side .t2-side-f {
  position: sticky; bottom: 0; margin-top: auto;
  padding: 10px 0 12px; border-top: 1px solid var(--t2-line); background: var(--t2-surface);
}
.t2.t2-app > .t2-side .t2-side-f .t2-side-t {
  display: flex; align-items: center; justify-content: flex-start; gap: 10px;
  inline-size: 100%; block-size: 2.5rem; padding-inline: 12px;
  border: 1px solid var(--t2-line); border-radius: 10px; background: var(--t2-surface-2);
  color: var(--t2-ink-2); font-size: var(--t2-fs-xs); font-weight: 600;
}
.t2.t2-app > .t2-side .t2-side-f .t2-side-t:hover { background: var(--t2-brand-wash); border-color: var(--t2-brand); color: var(--t2-brand-3); }
.t2.t2-app > .t2-side.is-min .t2-side-f .t2-side-t { justify-content: center; padding: 0; }
.t2.t2-app > .t2-side.is-min .t2-side-t-l { display: none; }

/* ——— المحتوى: عرضٌ مريحٌ على الشاشاتِ الواسعة ——— */
.t2.t2-app > .t2-main > .t2-body { inline-size: 100%; max-inline-size: 1680px; margin-inline: auto; }

@media (max-width: 64rem) {
  .t2.t2-app > .t2-side { width: 17rem; padding-top: 12px; }
  .t2.t2-app > .t2-side.is-min { width: 17rem; padding-inline: 10px; }
  .t2.t2-app > .t2-side.is-min .t2-side-i { grid-template-columns: 2rem minmax(0, 1fr) auto; padding: 6px 10px; }
  .t2.t2-app > .t2-side .t2-side-f { display: none; }
}
@media (max-width: 40rem) {
  .t2.t2-app { --t2-hh: 3.75rem; }
  .t2.t2-app > .t2-head { gap: 6px; padding-inline: 8px; }
  .t2.t2-app > .t2-head .t2-hwho { padding: 2px; border-color: transparent; }
  .t2.t2-app > .t2-head .t2-hbtn { min-width: 2.35rem; height: 2.35rem; }
  .t2.t2-app > .t2-head .t2-hbtn.is-out { padding-inline: 0; }
}

/* ——— اللوحات: رأسٌ بعنوانٍ وملاحظةٍ وإجراء ——— */
.t2 .t2-panel { border-radius: 14px; }
.t2 .t2-panel-h { display: flex; align-items: center; justify-content: space-between; gap: var(--t2-sm); flex-wrap: wrap; }
.t2 .t2-panel-ht { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; min-inline-size: 0; }
.t2 .t2-panel-a { display: flex; flex-wrap: wrap; gap: 6px; margin-inline-start: auto; }

/* ——— لوحتي ——— */
.t2 .t2-dash { gap: var(--t2-lg); }
.t2 .t2-dash-head {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--t2-md) var(--t2-lg);
  padding: var(--t2-lg) var(--t2-xl);
  border: 1px solid var(--t2-line); border-radius: 16px;
  background:
    radial-gradient(90% 160% at 100% 0%, var(--t2-brand-wash) 0%, transparent 60%),
    var(--t2-surface);
  box-shadow: var(--t2-sh-1);
}
.t2 .t2-dash-eye { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0; font-size: var(--t2-fs-xs); font-weight: 600; color: var(--t2-brand-2); font-variant-numeric: tabular-nums; }
.t2 .t2-dash-t { margin: 0; font-size: var(--t2-fs-2xl); font-weight: 800; color: var(--t2-ink); letter-spacing: -.02em; line-height: 1.3; }
.t2 .t2-dash-sub { margin: 0; font-size: var(--t2-fs-sm); color: var(--t2-ink-2); line-height: 1.7; }

.t2 .t2-dash-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--t2-lg); align-items: start; }
@media (min-width: 72rem) {
  .t2 .t2-dash-grid { grid-template-columns: minmax(0, 1.7fr) minmax(19rem, 1fr); }
}

/* صفوفُ الحالة */
.t2 .t2-code { font-family: var(--t2-ff-display); font-size: var(--t2-fs-xs); padding: 1px 6px; border-radius: 6px; background: var(--t2-surface-2); border: 1px solid var(--t2-line); direction: ltr; unicode-bidi: isolate; white-space: nowrap; }

@media (max-width: 40rem) {
  .t2 .t2-dash-head { padding: var(--t2-md); align-items: flex-start; }
  .t2 .t2-dash-t { font-size: var(--t2-fs-xl); }
}

/* ===== gap651 — ترتيبُ لوحتي بالأهمّية · جداولُ موحّدة · شاراتُ الحالةِ القديمةُ على نظامِ الحالةِ الموحّد ===== */
.t2 .t2-dash-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--t2-lg); align-items: stretch; }
@media (min-width: 60rem) {
  .t2 .t2-dash-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "alerts state" "recent recent" "activity quick"; }
  .t2 .t2-dash-grid:not(:has(> .is-recent)) { grid-template-areas: "alerts state" "activity quick"; }
}

/* الجداول: رأسٌ واضح، وقيمٌ قصيرةٌ لا تنكسر، وحوافٌّ متّسقة */

/* شاراتُ حالةٍ كانت خارجَ النظام الموحّد (واتساب) — نفسُ الشكلِ ونفسُ اللونِ لنفسِ المعنى */
.t2 :is(.t2-badge) {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .12rem .6rem; border-radius: 999px; line-height: 1.5; white-space: nowrap;
  border: 1px solid var(--t2-st-none-line); background: var(--t2-st-none-bg); color: var(--t2-st-none);
  font-size: var(--t2-fs-xs); font-weight: 600;
}
.t2 :is(.t2-badge)::before { content: ""; flex: none; inline-size: .42rem; block-size: .42rem; border-radius: 50%; background: currentColor; }
.t2 :is(.t2-badge.t2-ok) { background: var(--t2-st-ok-bg); color: var(--t2-st-ok); border-color: var(--t2-st-ok-line); }
.t2 :is(.t2-badge.t2-warn) { background: var(--t2-st-warn-bg); color: var(--t2-st-warn); border-color: var(--t2-st-warn-line); }
.t2 :is(.t2-badge.t2-danger) { background: var(--t2-st-danger-bg); color: var(--t2-st-danger); border-color: var(--t2-st-danger-line); }
.t2 :is(.t2-badge.t2-info) { background: var(--t2-st-info-bg); color: var(--t2-st-info); border-color: var(--t2-st-info-line); }

/* ===== gap652 — رأسُ الصفحةِ الموحّد · شريطُ البحثِ والفلترةِ المضغوط · المؤشّراتُ بعرضِ الصفحة · عناوينُ الحقول ===== */

/* رأسُ كلِّ صفحة (DS.pageHead): بطاقةٌ واحدةُ الشكلِ في النظام كلّه */
.t2 .t2-phead {
  display: grid; gap: 4px; padding: 18px 22px;
  border: 1px solid var(--t2-line); border-radius: 16px; box-shadow: var(--t2-sh-1);
  background: radial-gradient(90% 160% at 100% 0%, var(--t2-brand-wash) 0%, transparent 55%), var(--t2-surface);
}
.t2 .t2-phead-t { font-size: var(--t2-fs-xl); font-weight: 800; letter-spacing: -.01em; color: var(--t2-ink); }
.t2 .t2-phead-s { margin: 0; font-size: var(--t2-fs-sm); color: var(--t2-muted); line-height: 1.7; }

/* شريطُ البحثِ والفلترةِ والفرز (DS.filterBar وجداولُ DS.table): حقولٌ متجاورةٌ لا مكدّسة */

/* المؤشّراتُ تملأُ عرضَ الصفحة بدلَ أن تتكدّسَ في جانبٍ منها */

/* عنوانُ الحقلِ القابلِ للتحرير: نفسُ الوزنِ واللونِ في كلِّ النماذج */
.t2 .t2-field.is-edit { gap: 6px; }
.t2 .t2-field.is-edit > .t2-field-k, .t2 .t2-fx-l { font-size: var(--t2-fs-sm); font-weight: 600; color: var(--t2-ink-2); }

/* ===== gap653 — لا فراغَ غيرَ مبرَّرٍ على الشاشاتِ الواسعة · ترويسةُ الجوال · مؤشّراتُ اللوحي ===== */
.t2.t2-app > .t2-main > .t2-body { max-inline-size: none; }

/* ===== gap655 — التلميحُ يحملُ صنفَ .t2 فكان يرثُ ارتفاعَ الصفحةِ ولونَ نصِّها: شريطٌ داكنٌ بلا نصٍّ مقروء ===== */
.t2.t2-tip { min-height: 0; height: auto; color: #fff; line-height: 1.5; border-radius: 8px; box-shadow: 0 8px 24px rgba(16, 35, 58, .25); }

/* ===================== gap656 — ترويسةٌ مبسَّطة ولوحةُ تحكُّمٍ بلا تكرار ===================== */

/* ——— الترويسة: الشعار واسمُ المنصة ثم المستخدم والإشعارات والخروج ——— */
.t2.t2-app { --t2-hh: 4.75rem; }
.t2.t2-app > .t2-head.is-v3 { gap: 12px; padding-inline: 24px 16px; }
.t2-head.is-v3 .t2-hd-brand { display: flex; align-items: center; gap: 16px; flex: none; min-width: 0; }
/* الصورةُ الأصليةُ 1536×1024؛ العلامةُ داخلَها بين x128–1382 وy200–750.
 * الارتفاعُ الظاهرُ للعلامة = --lh، والهوامشُ السالبةُ تساوي الحوافَّ الشفّافةَ بالنسبةِ نفسِها. */
.t2-head.is-v3 .t2-hd-logo {
  --lh: 3.5rem;
  display: block; flex: none;
  block-size: calc(var(--lh) * 1024 / 550); inline-size: auto; max-inline-size: none; max-block-size: none;
  margin: calc(var(--lh) * -200 / 550) calc(var(--lh) * -154 / 550) calc(var(--lh) * -274 / 550) calc(var(--lh) * -128 / 550);
  image-rendering: auto; pointer-events: none; user-select: none;
}
.t2-head.is-v3 .t2-hd-name {
  padding-inline-start: 16px; border-inline-start: 1px solid var(--t2-line);
  font-size: var(--t2-fs-md); font-weight: 700; color: var(--t2-ink-2); line-height: 1.3; white-space: nowrap;
}
.t2-head.is-v3 .t2-hd-sp { flex: 1 1 auto; min-width: 0; }
.t2-head.is-v3 .t2-hd-r { display: flex; align-items: center; gap: 8px; flex: none; min-width: 0; }
.t2.t2-app > .t2-head.is-v3 .t2-hwho { border-inline-start: 1px solid var(--t2-line); }
.t2.t2-app > .t2-head.is-v3 .t2-hwho-n { display: block; max-width: 14rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* قائمةُ المستخدم: الدورُ/المبدِّل ثم الملفُّ ومركزُ الأمانِ بحالته */
.t2.t2-app > .t2-head.is-v3 .t2-hwho-m {
  inset-inline-start: auto; inset-inline-end: auto; left: 0; right: auto;
  min-width: 17rem; padding: 6px;
}
.t2-head.is-v3 .t2-hwho-mh { display: grid; gap: 6px; padding: 8px 10px 10px; margin-bottom: 4px; border-bottom: 1px solid var(--t2-line); }
.t2-head.is-v3 .t2-hwho-mn { font-size: var(--t2-fs-sm); font-weight: 700; color: var(--t2-ink); }
.t2-head.is-v3 .t2-hwho-mh .t2-who-r { font-size: var(--t2-fs-xs); font-weight: 600; color: var(--t2-brand-2); }
.t2.t2-app > .t2-head.is-v3 .t2-hwho-mh .t2-sw { max-width: none; overflow: visible; }
.t2.t2-app > .t2-head.is-v3 .t2-hwho-mh .t2-sw-btn { width: 100%; min-height: 2.5rem; border-radius: 10px; }
.t2.t2-app > .t2-head.is-v3 .t2-hwho-mh .t2-sw-menu { position: static; min-width: 0; margin-top: 6px; box-shadow: none; animation: none; }
.t2-head.is-v3 .t2-hwho-st { margin-inline-start: auto; display: inline-flex; align-items: center; gap: 6px; font-size: var(--t2-fs-2xs); font-weight: 600; color: var(--t2-muted); }
.t2-head.is-v3 .t2-hwho-dot { inline-size: 8px; block-size: 8px; border-radius: 50%; background: var(--t2-ok); }
.t2-head.is-v3 .t2-hwho-st.is-warn { color: var(--t2-warn); }
.t2-head.is-v3 .t2-hwho-st.is-warn .t2-hwho-dot { background: var(--t2-warn); }
.t2-head.is-v3 .t2-hwho-st.is-danger { color: var(--t2-danger); }
.t2-head.is-v3 .t2-hwho-st.is-danger .t2-hwho-dot { background: var(--t2-danger); }
@media (min-width: 40.01rem) {
  .t2-head.is-v3 .t2-hwho-mn { display: none; }
}

@media (max-width: 64rem) {
  .t2.t2-app > .t2-head.is-v3 { padding-inline: 14px 12px; }
  .t2-head.is-v3 .t2-hd-logo { --lh: 3rem; }
}
@media (max-width: 40rem) {
  .t2.t2-app { --t2-hh: 3.9rem; }
  .t2.t2-app > .t2-head.is-v3 { gap: 8px; padding-inline: 10px 8px; }
  .t2-head.is-v3 .t2-hd-brand { gap: 10px; }
  .t2-head.is-v3 .t2-hd-logo { --lh: 2.5rem; }
  .t2-head.is-v3 .t2-hd-name { padding-inline-start: 10px; font-size: var(--t2-fs-sm); }
  .t2.t2-app > .t2-head.is-v3 .t2-hwho { border-inline-start: 0; padding: 2px; }
  .t2.t2-app > .t2-head.is-v3 .t2-hwho-n, .t2.t2-app > .t2-head.is-v3 .t2-hwho-c { display: none; }
  .t2.t2-app > .t2-head.is-v3 .t2-hwho-m { min-width: min(17rem, calc(100vw - 20px)); }
  .t2-head.is-v3 .t2-hd-r { gap: 4px; }
}
@media (max-width: 30rem) {
  .t2-head.is-v3 .t2-hd-name { display: none; }
}

/* ——— لوحةُ التحكم: ترحيب ← يحتاجُ إجراءَك ← ملخّصُ الحالة ← الطلبات والنشاط ——— */
.t2 .t2-dash { display: grid; gap: 18px; }
.t2 .t2-dash > .t2-dash-head {
  display: grid; gap: 4px; justify-content: stretch; align-items: start;
  padding: 2px 2px 0; border: 0; border-radius: 0; background: none; box-shadow: none;
}
.t2 .t2-dash-head .t2-dash-eye { color: var(--t2-muted); font-weight: 600; }
.t2 .t2-dash-head .t2-dash-t { font-size: 1.6rem; }
.t2 .t2-dash-head .t2-dash-sub { font-size: var(--t2-fs-md); color: var(--t2-ink-2); }

/* يحتاجُ إجراءَك — أعلى وزنٍ بصريٍّ في الصفحة */
.t2 .t2-act { background: var(--t2-surface); border: 1px solid var(--t2-line); border-radius: 14px; box-shadow: var(--t2-sh-1); overflow: hidden; }
.t2 .t2-act-h { display: flex; align-items: center; gap: 10px; padding: 12px 18px; background: var(--t2-surface-2); border-bottom: 1px solid var(--t2-line); }
.t2 .t2-act-t { margin: 0; font-size: var(--t2-fs-md); font-weight: 800; color: var(--t2-ink); }
.t2 .t2-act-n {
  display: inline-grid; place-items: center; min-inline-size: 1.5rem; block-size: 1.5rem; padding: 0 6px;
  border-radius: 999px; background: var(--t2-warn-wash); color: var(--t2-warn);
  font-family: var(--t2-ff-display); font-size: var(--t2-fs-xs); font-weight: 800;
}
.t2 .t2-act-l { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 1px; background: var(--t2-line); }
.t2 .t2-act-i {
  --tone: var(--t2-brand); --wash: var(--t2-brand-wash);
  position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px;
  padding: 12px 18px; background: var(--t2-surface);
}
@media (min-width: 72rem) {
  .t2 .t2-act-l { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .t2 .t2-act-i:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
.t2 .t2-act-i::before { content: ''; position: absolute; inset-block: 10px; inset-inline-start: 0; inline-size: 3px; border-radius: 3px; background: var(--tone); }
.t2 .t2-act-i.is-danger { --tone: var(--t2-danger); --wash: var(--t2-danger-wash); }
.t2 .t2-act-i.is-warn { --tone: var(--t2-warn); --wash: var(--t2-warn-wash); }
.t2 .t2-act-ic { display: grid; place-items: center; inline-size: 2.4rem; block-size: 2.4rem; border-radius: 10px; background: var(--wash); line-height: 0; }
.t2 .t2-act-b { display: grid; gap: 2px; min-inline-size: 0; }
.t2 .t2-act-it { font-size: var(--t2-fs-sm); font-weight: 700; color: var(--t2-ink); }
.t2 .t2-act-d { font-size: var(--t2-fs-xs); color: var(--t2-muted); line-height: 1.6; }
.t2 .t2-act-i > .t2-btn { white-space: nowrap; }
.t2 .t2-act.is-clear {
  display: flex; align-items: center; gap: 10px; padding: 10px 16px;
  background: var(--t2-ok-wash); border-color: transparent; box-shadow: none;
  font-size: var(--t2-fs-sm); font-weight: 600; color: var(--t2-ok);
}
.t2 .t2-act-ok { line-height: 0; }

/* ملخّصُ الحالة: شريطٌ واحدٌ مضغوطٌ بفواصل، كلُّ خانةٍ تفتحُ قسمَها */

/* الطلباتُ الأخيرة والنشاط */
.t2 .t2-dash > .t2-dash-grid { grid-template-areas: none; align-items: start; }
.t2 .t2-dash-grid > * { min-width: 0; grid-area: auto; }
@media (min-width: 72rem) {
  .t2 .t2-dash > .t2-dash-grid { grid-template-columns: minmax(0, 2fr) minmax(18rem, 1fr); }
  .t2 .t2-dash > .t2-dash-grid.is-single { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 40rem) {
  .t2 .t2-dash { gap: 14px; }
  .t2 .t2-dash-head .t2-dash-t { font-size: 1.3rem; }
  .t2 .t2-act-h { padding: 10px 14px; }
  .t2 .t2-act-i { grid-template-columns: auto minmax(0, 1fr); gap: 8px 12px; padding: 12px 14px; }
  .t2 .t2-act-i > .t2-btn { grid-column: 2; justify-self: start; }
}

/* ===================== gap657 — خطٌّ واحد، سلّمُ طباعةٍ مركزي، وقالبُ صفحةٍ موحَّد ===================== */

/* ——— 1) الطباعة: IBM Plex Sans Arabic (Google Fonts) خطًّا وحيدًا للواجهة كلِّها ———
 * display · h1 · h2 · h3 · body · label · small · caption — ولا حجمَ خارجَها.
 * السلّمُ القديمُ (--t2-fs-*) يُشتقُّ منها، فكلُّ مكوِّنٍ قائمٍ يتبعُها تلقائيًّا. */
:root, .t2 {
  /* الأسطحُ القديمة (tera-hr وواجهةُ الإدارةِ الأولى) على الخطِّ نفسِه */
}
.t2 { font-family: var(--t2-ff-text); font-size: var(--t2-t-body); line-height: var(--t2-lh-body); font-synthesis: none; -webkit-font-smoothing: antialiased; }
.t2 :is(h1, h2, h3, h4) { font-family: var(--t2-ff-text); line-height: var(--t2-lh-tight); letter-spacing: 0; }
/* لا وزنَ فوقَ 700 في أيِّ مكان */
.t2 :is(b, strong) { font-weight: var(--t2-w-bold); }

/* ——— 2) قالبُ الصفحة: مسارٌ صغير ← عنوان ← وصف ← (حالة/إجراءات) ← المحتوى ——— */
.t2 .t2-wrap { padding: 20px 28px 40px; }
@media (max-width: 64rem) { .t2 .t2-wrap { padding: 16px 20px 32px; } }
@media (max-width: 40rem) { .t2 .t2-wrap { padding: 14px 14px 28px; } }
.t2 .t2-stack { gap: 20px; }
.t2 .t2-stack-tight { gap: 12px; }
/* المحتوى بعرضِ رأسِ الصفحةِ نفسِه — لا صفحةَ أضيقَ من عنوانِها */
.t2 .t2-stack.t2-pb-page, .t2 .t2-fm-page { max-inline-size: none; justify-self: stretch; inline-size: 100%; }

.t2 .t2-phead {
  display: grid; gap: 6px; padding: 0 2px; margin: 0;
  border: 0; border-radius: 0; background: none; box-shadow: none;
}
.t2 .t2-phead-m { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 20px; }
.t2 .t2-phead-tx { display: grid; gap: 4px; min-inline-size: 0; }
.t2 .t2-phead-t { margin: 0; font-size: var(--t2-t-h1); font-weight: var(--t2-w-bold); color: var(--t2-ink); line-height: var(--t2-lh-tight); }
.t2 .t2-phead-s { margin: 0; max-inline-size: 70ch; font-size: var(--t2-t-body); color: var(--t2-muted); line-height: var(--t2-lh-body); }
.t2 .t2-phead-a { display: flex; flex-wrap: wrap; gap: 8px; }
/* الرأسُ القديمُ الذي كان يضعُ المسارَ والعنوانَ في سطرٍ واحد */

/* ——— 3) رأسُ القسم: عنوانٌ متدرِّجٌ بلا خطوطٍ فاصلة ——— */
.t2 .t2-group-h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 0 0 10px; padding: 0; border: 0; }
.t2 .t2-group-t { margin: 0; font-size: var(--t2-t-h2); font-weight: var(--t2-w-bold); color: var(--t2-ink); line-height: var(--t2-lh-tight); }
.t2 .t2-panel .t2-group-t, .t2 .t2-detail .t2-group-t { font-size: var(--t2-t-h3); }
.t2 .t2-group-n { font-size: var(--t2-t-small); color: var(--t2-muted); }
.t2 .t2-panel { padding: 18px 20px; gap: 14px; border-radius: 14px; }
.t2 .t2-panel-h { padding: 0; border: 0; }
@media (max-width: 40rem) { .t2 .t2-panel { padding: 14px; } }

/* ——— 4) الحقول: عنوانٌ فوقَ قيمة، في شبكةٍ موحَّدة — لا فراغَ بين العنوانِ وقيمتِه ——— */
.t2 .t2-field:not(.is-edit) > .t2-field-k { max-inline-size: none; font-size: var(--t2-t-small); font-weight: var(--t2-w-regular); color: var(--t2-muted); }
.t2 .t2-field:not(.is-edit) > .t2-field-v { text-align: start; font-size: var(--t2-t-body); font-weight: var(--t2-w-medium); color: var(--t2-ink); }
.t2 .t2-field-v .t2-row-wrap { justify-content: flex-start; }
.t2 .t2-field.is-edit > .t2-field-k, .t2 .t2-fx-l { font-size: var(--t2-t-label); font-weight: var(--t2-w-medium); color: var(--t2-ink-2); }

/* ——— 5) الأقسامُ القابلةُ للطيّ ——— */
.t2 .t2-fold { border-radius: 14px; box-shadow: var(--t2-sh-1); }
.t2 .t2-fold-h {
  display: flex; align-items: center; gap: 10px; inline-size: 100%; min-block-size: 3rem; padding: 10px 18px;
  border: 0; background: none; font: inherit; color: var(--t2-ink); text-align: start; cursor: pointer;
}
.t2 .t2-fold-h:hover { background: var(--t2-surface-2); }
.t2 .t2-fold-t { font-size: var(--t2-t-h3); font-weight: var(--t2-w-semibold); }
.t2 .t2-fold-n { margin-inline-start: auto; font-size: var(--t2-t-small); color: var(--t2-muted); }
.t2 .t2-fold-n.is-alert { color: var(--t2-warn); font-weight: var(--t2-w-medium); }
.t2 .t2-fold-b { padding: 4px 18px 18px; }
.t2 .t2-fold-h[aria-expanded="true"] { border-bottom: 1px solid var(--t2-line); margin-bottom: 14px; }

/* ——— 6) البطاقاتُ الوظيفية: أصغر وأكثفُ وأوضح ——— */
.t2 .t2-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); gap: 12px; }
.t2 .t2-grid > .t2-card {
  grid-template-columns: 2.4rem minmax(0, 1fr) .75rem; gap: 12px; align-items: center;
  min-block-size: 0; padding: 12px 14px; border-radius: 12px;
}
.t2 .t2-card-ico { inline-size: 2.4rem; block-size: 2.4rem; border-radius: 10px; }
.t2 .t2-card-t { font-size: var(--t2-t-label); font-weight: var(--t2-w-semibold); line-height: 1.45; }
.t2 .t2-card-d {
  font-size: var(--t2-t-small); line-height: 1.5; color: var(--t2-muted);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.t2 .t2-card-d.is-warn { color: var(--t2-warn); -webkit-line-clamp: 1; }
.t2 .t2-card-n { font-size: var(--t2-t-caption); font-weight: var(--t2-w-semibold); }
.t2 .t2-card.is-alert .t2-card-n { color: var(--t2-warn); }
.t2 .t2-card-badge { top: 8px; inset-inline-end: 8px; font-size: var(--t2-t-caption); }

/* ——— 7) الحالاتُ الفارغةُ والتنبيهات: صغيرةٌ بحجمِ ما تقوله ——— */
.t2 .t2-empty { padding: 22px 18px; gap: 6px; border: 1px solid var(--t2-line); border-radius: 14px; }
.t2 .t2-empty-i { inline-size: 3rem; block-size: 3rem; }
.t2 .t2-empty-t { font-size: var(--t2-t-body); font-weight: var(--t2-w-semibold); }
.t2 .t2-empty-b { font-size: var(--t2-t-small); }
.t2 .t2-note { padding: 12px 16px; border-radius: 12px; box-shadow: none; }
.t2 .t2-note-t { font-size: var(--t2-t-label); font-weight: var(--t2-w-semibold); }
.t2 .t2-note-b { font-size: var(--t2-t-small); color: var(--t2-ink-2); }

/* ——— 8) الجداولُ والأزرارُ والشارات: السلّمُ نفسُه ——— */
.t2 .t2-btn { font-size: var(--t2-t-label); font-weight: var(--t2-w-semibold); border-radius: 10px; }
.t2 .t2-btn.is-sm { font-size: var(--t2-t-small); }
.t2 .t2-pill { font-size: var(--t2-t-caption); font-weight: var(--t2-w-semibold); }
.t2 .t2-input { font-size: var(--t2-t-body); }

/* ——— 9) بطاقةُ الحالة: الحالةُ ونسبتُها وتاريخُها وإجراؤها في مكانٍ واحد ——— */
.t2 .t2-sc {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 14px 24px;
  padding: 18px 20px; border: 1px solid var(--t2-line); border-radius: 14px;
  background: var(--t2-surface); box-shadow: var(--t2-sh-1);
}
.t2 .t2-sc-main { display: grid; gap: 10px; min-inline-size: 0; }
.t2 .t2-sc-top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.t2 .t2-sc-l { font-size: var(--t2-t-small); color: var(--t2-muted); }
.t2 .t2-sc-pct { font-size: var(--t2-t-h3); font-weight: var(--t2-w-bold); color: var(--t2-ink); font-variant-numeric: tabular-nums; }
.t2 .t2-sc-bar { block-size: 6px; border-radius: 999px; background: var(--t2-surface-3); overflow: hidden; }
.t2 .t2-sc-bar > i { display: block; block-size: 100%; border-radius: inherit; background: var(--t2-brand); }
.t2 .t2-sc-meta { display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: var(--t2-t-small); color: var(--t2-muted); }
.t2 .t2-sc-meta b { font-weight: var(--t2-w-medium); color: var(--t2-ink-2); font-variant-numeric: tabular-nums; }
.t2 .t2-sc-x { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: var(--t2-t-small); color: var(--t2-muted); }
.t2 .t2-sc-chip {
  padding: 2px 10px; border: 1px solid var(--t2-st-warn-line, #f4e2c4); border-radius: 999px;
  background: var(--t2-warn-wash); color: var(--t2-warn); font: inherit; font-size: var(--t2-t-caption); cursor: pointer;
}
.t2 .t2-sc-a { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.t2 .t2-sc.is-compact { padding: 12px 16px; }
@media (max-width: 40rem) {
  .t2 .t2-sc { grid-template-columns: minmax(0, 1fr); padding: 14px; }
  .t2 .t2-sc-a { justify-content: stretch; }
  .t2 .t2-sc-a > .t2-btn { flex: 1 1 auto; }
}

/* ——— 10) شريطُ الإجراءات: آخرُ الصفحة، ثابتٌ عندَ التمرير ——— */
.t2 .t2-abar {
  position: sticky; bottom: 0; z-index: 20;
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px;
  padding: 12px 16px; border: 1px solid var(--t2-line); border-radius: 14px;
  background: color-mix(in srgb, var(--t2-surface) 94%, transparent);
  backdrop-filter: blur(6px); box-shadow: 0 -8px 24px -18px rgba(16, 35, 58, .45);
}
.t2 .t2-abar-n { flex: 1 1 14rem; min-inline-size: 0; font-size: var(--t2-t-small); color: var(--t2-muted); }
.t2 .t2-abar-b { display: flex; flex-wrap: wrap; gap: 8px; margin-inline-start: auto; }
@media (max-width: 40rem) {
  .t2 .t2-abar-b { inline-size: 100%; }
  .t2 .t2-abar-b > .t2-btn { flex: 1 1 auto; }
}

/* ——— 11) طلبُ توثيقِ الملف: قائمةُ الأقسامِ وقسمٌ واحدٌ ظاهر ——— */
.t2 .t2-vf { grid-template-columns: 15rem minmax(0, 1fr); gap: 16px; }
.t2 .t2-vf-nav { top: 12px; padding: 8px; border-radius: 14px; box-shadow: var(--t2-sh-1); }
.t2 .t2-vf-nh { padding: 6px 10px 8px; font-size: var(--t2-t-caption); font-weight: var(--t2-w-semibold); color: var(--t2-muted); }
.t2 .t2-vf-i { min-block-size: 2.75rem; padding: 8px 10px; font-size: var(--t2-t-label); }
.t2 .t2-vf-n { font-size: var(--t2-t-caption); }
.t2 .t2-vf-p.is-on { display: grid; gap: 14px; }
.t2 .t2-vf-card { padding: 18px 20px; border: 1px solid var(--t2-line); border-radius: 14px; background: var(--t2-surface); box-shadow: var(--t2-sh-1); }
.t2 .t2-vf-ph { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 14px; }
.t2 .t2-vf-pt { margin: 0; font-size: var(--t2-t-h2); font-weight: var(--t2-w-bold); color: var(--t2-ink); }
/* داخلَ القسمِ المضمَّن: لا شارةَ ولا إطارَ مكرَّرَين — رأسُ القسمِ أعلاه يكفي */
.t2 .t2-vf-card .t2-pb-page > .t2-fm-head, .t2 .t2-vf-card .t2-pb-page > .t2-sc { display: none; }
.t2 .t2-vf-card .t2-pb-page > .t2-panel { padding: 0; border: 0; box-shadow: none; background: none; }
.t2 .t2-vf-card .t2-pb-page { gap: 14px; }
@media (max-width: 64rem) {
  .t2 .t2-vf { grid-template-columns: minmax(0, 1fr); }
  .t2 .t2-vf-nh { display: none; }
}
@media (max-width: 40rem) { .t2 .t2-vf-card { padding: 14px; } }

/* ——— 12) صفحاتُ أقسامِ الملف: حالةُ القسمِ في شريطٍ واحد، والحقولُ بلا ازدحام ——— */
.t2 .t2-pb-page > .t2-fm-head:empty { display: none; }
.t2 .t2-pb-nochg { margin: 0; font-size: var(--t2-t-small); color: var(--t2-muted); }
.t2 .t2-pb-page .t2-fm-block { padding: 18px 20px; border: 1px solid var(--t2-line); border-radius: 14px; background: var(--t2-surface); box-shadow: var(--t2-sh-1); }
.t2 .t2-pb-hint { margin: 0 0 12px; font-size: var(--t2-t-label); font-weight: var(--t2-w-semibold); color: var(--t2-ink-2); }
.t2 .t2-pb-actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* ——— 13) قائمةُ المستخدم: معلوماتُ الحسابِ فقط ——— */
.t2-head.is-v3 .t2-hwho-sec { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px; font-size: var(--t2-t-small); }
.t2-head.is-v3 .t2-hwho-sl { color: var(--t2-muted); }
.t2-head.is-v3 .t2-hwho-sec .t2-hwho-st { margin: 0; font-size: var(--t2-t-small); }
.t2-head.is-v3 .t2-hwho-mh { margin-bottom: 0; }

/* ——— 14) مؤشّراتُ الصفحات: شريطٌ واحدٌ مضغوطٌ بفواصل بدلَ بطاقاتٍ كبيرةٍ لرقمٍ واحد ——— */

/* ——— 15) البطاقةُ التي تحتاجُ انتباهًا: شريطٌ جانبيٌّ هادئ لا إطارٌ أحمرُ صارخ ——— */
.t2 .t2-grid > .t2-card.is-alert { border-color: var(--t2-line); }
.t2 .t2-grid > .t2-card.is-alert::after { opacity: 1; background: var(--t2-warn); }
.t2 .t2-grid > .t2-card[disabled] { background: var(--t2-surface); opacity: .72; }

/* ——— 16) التواريخُ والأرقامُ داخلَ النصِّ العربي: اتجاهُها من محتواها — 2026-09-29 لا 29-09-2026 ——— */
.t2 time, .t2 .t2-sc-meta b { unicode-bidi: plaintext; }
@media (max-width: 40rem) {
  /* على الجوال: شريطُ الإجراءاتِ في آخرِ الصفحة لا فوقَ الحقول */
  .t2 .t2-abar { position: static; }
}

/* ===================== gap658 — تصحيحاتُ المراجعةِ البصريةِ بعدَ gap657 ===================== */
/* هيكلُ التحميل: المؤشّراتُ الوهميةُ مربّعاتٌ منفصلة، لا الشريطُ الموحَّدُ للمؤشّراتِ الحقيقية */
.t2 .t2-skel .t2-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: 12px; background: none; border: 0; border-radius: 0; box-shadow: none; overflow: visible; }
/* بطاقةُ الحالةِ المضغوطة: سطرٌ واحد */
.t2 .t2-sc.is-compact .t2-sc-main { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 20px; }
.t2 .t2-sc.is-compact .t2-sc-top { gap: 6px 10px; }

/* ===================== gap659 — لغةُ التصميمِ الموحَّدة: طباعةٌ وشبكةٌ وحركةٌ وتحميلٌ وتصفية ===================== */

/* ——— 1) الطباعة: تركيبةٌ واحدةٌ معتمدة ———
 * Alexandria: العناوينُ والأرقامُ والأزرار (v12: بدلَ الكوفيّ — عائلتان فقط في اللوحة).
 * IBM Plex Sans Arabic: كلُّ ما يُقرأ — النصُّ والوصفُ والعناوينُ الصغيرةُ والحقول.
 * الفرقُ بين المستويات في العائلةِ والوزنِ واللونِ والتباعد، لا في الحجمِ وحدَه. */
:root, .t2 {

  /* المستوياتُ العشرة: الحجم / الوزن / الارتفاع / التباعد / اللون */

  /* السلّمُ القديمُ يُشتقُّ من المستويات — لا حجمَ خارجَها */

  /* ——— الحركة: مدّةٌ قصيرةٌ ومنحنًى واحد ——— */

  /* ——— الشبكة: حاويةٌ واحدةٌ ومسافاتٌ ثلاث ——— */

  /* ——— الأسطح والظلال ——— */
}

/* مستوياتُ الطباعة كأصنافٍ تستعملُها كلُّ المكوّنات */
.t2 { font-family: var(--t2-ff-text); font-size: var(--t2-body-fs); line-height: var(--t2-body-lh); color: var(--t2-ink); }
 .t2 .t2-dash-t {
  font-family: var(--t2-ff-display); font-size: var(--t2-display-fs); font-weight: var(--t2-display-fw);
  line-height: var(--t2-display-lh); letter-spacing: var(--t2-display-ls); color: var(--t2-display-c);
}
 .t2 .t2-phead-t {
  font-family: var(--t2-ff-display); font-size: var(--t2-h1-fs); font-weight: var(--t2-h1-fw);
  line-height: var(--t2-h1-lh); letter-spacing: var(--t2-h1-ls); color: var(--t2-h1-c);
}
 .t2 .t2-group-t, .t2 .t2-act-t, .t2 .t2-vf-pt, .t2 .t2-fm-title, .t2 .t2-drawer-t, .t2 .t2-dlg2-t {
  font-family: var(--t2-ff-display); font-size: var(--t2-h2-fs); font-weight: var(--t2-h2-fw);
  line-height: var(--t2-h2-lh); letter-spacing: var(--t2-h2-ls); color: var(--t2-h2-c);
}
 .t2 .t2-panel .t2-group-t, .t2 .t2-detail .t2-group-t, .t2 .t2-fold-t, .t2 .t2-card-t, .t2 .t2-act-it, .t2 .t2-fm-sec-t, .t2 .t2-empty-t {
  font-family: var(--t2-ff-text); font-size: var(--t2-h3-fs); font-weight: var(--t2-h3-fw);
  line-height: var(--t2-h3-lh); color: var(--t2-h3-c);
}
 .t2 .t2-phead-s, .t2 .t2-dash-sub, .t2 .t2-dlg2-d {
  font-size: var(--t2-blg-fs); font-weight: var(--t2-blg-fw); line-height: var(--t2-blg-lh); color: var(--t2-blg-c);
}
 .t2 .t2-card-d, .t2 .t2-note-b, .t2 .t2-empty-b, .t2 .t2-abar-n, .t2 .t2-act-d, .t2 .t2-tl-m {
  font-size: var(--t2-bsm-fs); font-weight: var(--t2-bsm-fw); line-height: var(--t2-bsm-lh); color: var(--t2-bsm-c);
}
 .t2 .t2-field-k, .t2 .t2-field.is-edit > .t2-field-k, .t2 .t2-fx-l, .t2 .t2-sc-l, .t2 .t2-fl-l {
  font-family: var(--t2-ff-text); font-size: var(--t2-label-fs); font-weight: var(--t2-label-fw);
  line-height: var(--t2-label-lh); letter-spacing: var(--t2-label-ls); color: var(--t2-label-c);
}
.t2 .t2-field:not(.is-edit) > .t2-field-k, .t2 .t2-sc-l { color: var(--t2-muted); font-weight: var(--t2-w-regular, 400); }
 .t2 .t2-group-n, .t2 .t2-fold-n, .t2 .t2-card-n, .t2 .t2-sc-meta, .t2 .t2-vf-nh, .t2 .t2-dash-eye {
  font-size: var(--t2-cap-fs); line-height: var(--t2-cap-lh); color: var(--t2-cap-c);
}
 .t2 .t2-sc-pct {
  font-family: var(--t2-ff-display); font-size: var(--t2-metric-fs); font-weight: var(--t2-metric-fw);
  line-height: var(--t2-metric-lh); letter-spacing: var(--t2-metric-ls); color: var(--t2-metric-c);
  font-variant-numeric: tabular-nums lining-nums;
}
.t2 .t2-sc-pct { font-size: 1.25rem; }
/* الأرقامُ داخلَ النصِّ: أعمدةٌ ثابتةُ العرضِ فلا تهتزُّ الجداول */
.t2 :is(.t2-table td, .t2-pill, .t2-code, .t2-card-n, .t2-card-badge, .t2-act-n, .t2-vf-n, .t2-side-c, .t2-hbtn-n, time) { font-variant-numeric: tabular-nums; }

/* ——— 2) الشبكة: حاويةٌ ← محتوى ← قسم ← نموذج ← بطاقات — خطوطُ بدايةٍ واحدة ——— */
.t2 .t2-wrap { max-inline-size: 1440px; margin-inline: auto; padding: 22px var(--t2-gutter) 44px; box-sizing: border-box; }
.t2 .t2-stack { gap: var(--t2-gap-section); }
.t2 .t2-stack-tight { gap: var(--t2-gap-block); }
.t2 :is(.t2-panel, .t2-fold, .t2-sc, .t2-vf-card, .t2-act, .t2-tablewrap, .t2-fm-block) { border-radius: var(--t2-radius-card); }
.t2 :is(.t2-panel, .t2-sc, .t2-vf-card, .t2-pb-page .t2-fm-block) { padding: var(--t2-pad-card); }
.t2 .t2-fold-b { padding: 4px 20px 20px; }
.t2 .t2-fold-h { padding-inline: 20px; }
/* شبكةُ النماذج: عمودان على الشاشاتِ الواسعة، والعنوانُ فوقَ الحقلِ دائمًا */
.t2 :is(.t2-pb-grid) { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); gap: var(--t2-gap-block) 20px; align-items: start; }
.t2 .t2-field.is-edit { display: grid; gap: 6px; align-content: start; padding: 0; }
.t2 .t2-input { min-block-size: 2.75rem; border-radius: 10px; transition: border-color var(--t2-d1) var(--t2-ease), box-shadow var(--t2-d1) var(--t2-ease), background var(--t2-d1) var(--t2-ease); }
.t2 .t2-input:hover:not(:disabled):not(:focus) { border-color: var(--t2-line-2); }
.t2 .t2-input:focus, .t2 .t2-input:focus-visible { outline: none; border-color: var(--t2-brand); box-shadow: 0 0 0 3px rgba(10, 165, 173, .18); }
/* شبكةُ البطاقات */
.t2 .t2-grid { gap: var(--t2-gap-inline); }

/* ——— 3) الترويسةُ والقائمة: شريطُ هويّةٍ رفيعٌ وانتقالاتٌ ناعمة ——— */
.t2.t2-app > .t2-head.is-v3 { box-shadow: 0 1px 0 var(--t2-line), 0 8px 24px -20px rgba(11, 37, 69, .45); border-bottom: 0; }
.t2.t2-app > .t2-head.is-v3::before {
  content: ''; position: absolute; inset-inline: 0; inset-block-start: 0; block-size: 3px;
  background: var(--t2-accent-grad); pointer-events: none;
}
.t2.t2-app > .t2-head .t2-hd-name { font-family: var(--t2-ff-display); font-weight: 600; font-size: .95rem; color: var(--t2-ink-2); }
.t2 .t2-hwho-n { font-weight: 600; }
.t2.t2-app > .t2-head .t2-hbtn { transition: background var(--t2-d1) var(--t2-ease), border-color var(--t2-d1) var(--t2-ease), color var(--t2-d1) var(--t2-ease), transform var(--t2-d1) var(--t2-ease); }
.t2.t2-app > .t2-head .t2-hbtn:active, .t2 .t2-hwho:active { transform: scale(.97); }
.t2-hwho-w.is-open .t2-hwho-m { animation: t2-pop-in var(--t2-d2) var(--t2-ease-out) both; transform-origin: top left; }
.t2 .t2-sw-menu { animation: t2-pop-in var(--t2-d2) var(--t2-ease-out) both; }
.t2.t2-app > .t2-side { transition: inline-size var(--t2-d3) var(--t2-ease), width var(--t2-d3) var(--t2-ease); }
.t2.t2-app > .t2-side .t2-side-i { transition: background var(--t2-d1) var(--t2-ease), color var(--t2-d1) var(--t2-ease); }
.t2.t2-app > .t2-side .t2-side-gb { transition: opacity var(--t2-d2) var(--t2-ease); }

/* ——— 4) الحركة: انتقالُ الصفحةِ وظهورُ الطبقات ——— */
@keyframes t2-page-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes t2-pop-in { from { opacity: 0; transform: translateY(-4px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes t2-modal-in { from { opacity: 0; transform: translateY(8px) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes t2-drawer-in { from { opacity: 0; transform: translateX(-16px); } to { opacity: 1; transform: none; } }
@keyframes t2-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes t2-soft-in { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: none; } }
/* الصفحةُ عندَ التنقُّل — المحتوى وحدَه لا الترويسةُ ولا القائمة */
.t2.t2-app > .t2-main > .t2-body > .t2-wrap > .t2-stack { animation: t2-page-in var(--t2-d3) var(--t2-ease-out) both; }
.t2 .t2-scrim, .t2.t2-scrim2 { animation: t2-fade-in var(--t2-d2) var(--t2-ease) both; }
.t2 .t2-modal-c, .t2 .t2-dlg2-c { animation: t2-modal-in var(--t2-d3) var(--t2-ease-out) both; }
.t2.t2-drawer { animation: t2-drawer-in var(--t2-d3) var(--t2-ease-out) both; }
.t2 .t2-pill { animation: t2-soft-in var(--t2-d2) var(--t2-ease-out) both; }
/* الأزرار: مرورٌ وضغطٌ وتركيز */
.t2 .t2-btn { transition: background var(--t2-d1) var(--t2-ease), border-color var(--t2-d1) var(--t2-ease), color var(--t2-d1) var(--t2-ease), box-shadow var(--t2-d2) var(--t2-ease), transform var(--t2-d1) var(--t2-ease); }
.t2 .t2-btn:hover:not([disabled]) { transform: translateY(-1px); box-shadow: var(--t2-sh-2); }
.t2 .t2-btn:active:not([disabled]) { transform: translateY(0) scale(.98); box-shadow: var(--t2-sh-1); }
.t2 .t2-btn:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(10, 165, 173, .28); }
.t2 .t2-btn.is-primary { background: linear-gradient(180deg, #1db3a4 0%, var(--t2-brand-2) 100%); border-color: var(--t2-brand-2); }
.t2 .t2-btn.is-primary:hover:not([disabled]) { background: linear-gradient(180deg, #19a293 0%, var(--t2-brand-3) 100%); }
@media (prefers-reduced-motion: reduce) {
  .t2 *, .t2 *::before, .t2 *::after, .toast-root .toast { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; }
}

/* ——— 5) البطاقات: تسلسلٌ وأيقونةٌ ولكنةٌ وحركة ——— */
.t2 .t2-grid > .t2-card {
  position: relative; background: var(--t2-surface); border: 1px solid var(--t2-line); box-shadow: var(--t2-sh-1);
  transition: transform var(--t2-d2) var(--t2-ease), box-shadow var(--t2-d2) var(--t2-ease), border-color var(--t2-d2) var(--t2-ease);
}
.t2 .t2-grid > .t2-card:not([disabled]):hover { transform: translateY(-2px); box-shadow: var(--t2-sh-2); border-color: rgba(10, 165, 173, .35); }
.t2 .t2-grid > .t2-card:not([disabled]):active { transform: translateY(0); }
.t2 .t2-card-ico {
  background: linear-gradient(145deg, var(--t2-brand-wash) 0%, #ffffff 100%);
  box-shadow: inset 0 0 0 1px rgba(10, 165, 173, .16);
  transition: transform var(--t2-d2) var(--t2-ease), box-shadow var(--t2-d2) var(--t2-ease);
}
.t2 .t2-card:not([disabled]):hover .t2-card-ico { transform: translateY(-1px) scale(1.04); box-shadow: inset 0 0 0 1px rgba(10, 165, 173, .3); }
.t2 .t2-card-go { transition: transform var(--t2-d2) var(--t2-ease), color var(--t2-d2) var(--t2-ease); }
.t2 .t2-card-n {
  justify-self: start; display: inline-block; margin-top: 4px; padding: 1px 8px; border-radius: 999px;
  background: var(--t2-brand-wash); color: var(--t2-brand-3); font-weight: 600;
}
.t2 .t2-card.is-alert .t2-card-n { background: var(--t2-warn-wash); color: var(--t2-warn); }
.t2 .t2-card-b { justify-items: start; }
/* بطاقاتُ اللوحةِ والمؤشّرات: خانةٌ قابلةٌ للفتحِ ترتفعُ قليلًا */
.t2 .t2-act-i { transition: background var(--t2-d1) var(--t2-ease); }
.t2 .t2-act-i:hover { background: var(--t2-surface-2); }
.t2 .t2-panel, .t2 .t2-sc, .t2 .t2-fold, .t2 .t2-act, .t2 .t2-vf-card, .t2 .t2-vf-nav { box-shadow: var(--t2-sh-1); }

/* ——— 6) الجداول: رأسٌ هادئٌ وصفوفٌ تستجيب ——— */

/* ——— 7) نظامُ التصفية: بحثٌ سريع ← زرُّ «التصفية (n)» ← لوحةٌ منظّمة ← رقائقُ الفلاترِ الفعّالة ——— */
.t2 .t2-fl { display: grid; gap: 10px; }
.t2 .t2-fl-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.t2 .t2-fl-q { position: relative; flex: 1 1 18rem; min-inline-size: 0; }
.t2 .t2-fl-q > .t2-input {
  inline-size: 100%; padding-inline-start: 2.4rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%235a6a7a' d='M232.49,215.51,185,168a92.12,92.12,0,1,0-17,17l47.53,47.54a12,12,0,0,0,17-17ZM44,112a68,68,0,1,1,68,68A68.07,68.07,0,0,1,44,112Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-size: 1rem; background-position: right .85rem center;
}
.t2 .t2-fl-row > select.t2-input { inline-size: auto; flex: 0 1 13rem; }
.t2 .t2-fl-btn { gap: 8px; }
.t2 .t2-fl-btn .t2-fl-ic { display: inline-grid; gap: 3px; inline-size: 14px; }
.t2 .t2-fl-btn .t2-fl-ic i { display: block; block-size: 2px; border-radius: 2px; background: currentColor; }
.t2 .t2-fl-btn .t2-fl-ic i:nth-child(2) { inline-size: 70%; justify-self: center; }
.t2 .t2-fl-btn .t2-fl-ic i:nth-child(3) { inline-size: 40%; justify-self: center; }
.t2 .t2-fl-btn.is-on { border-color: var(--t2-brand); background: var(--t2-brand-wash); color: var(--t2-brand-3); }
.t2 .t2-fl-n {
  display: inline-grid; place-items: center; min-inline-size: 1.25rem; block-size: 1.25rem; padding: 0 5px;
  border-radius: 999px; background: var(--t2-brand); color: #fff; font-size: var(--t2-cap-fs); font-weight: 700;
}
.t2 .t2-fl-c { margin-inline-start: auto; font-size: var(--t2-cap-fs); color: var(--t2-muted); white-space: nowrap; }
.t2 .t2-fl-panel {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 13rem), 1fr)); gap: 14px 16px;
  padding: 16px; border: 1px solid var(--t2-line); border-radius: var(--t2-radius-card);
  background: var(--t2-surface); box-shadow: var(--t2-sh-2);
  animation: t2-pop-in var(--t2-d2) var(--t2-ease-out) both;
}
.t2 .t2-fl-panel[hidden] { display: none; }
.t2 .t2-fl-f { display: grid; gap: 6px; align-content: start; min-inline-size: 0; }
.t2 .t2-fl-f > .t2-input, .t2 .t2-fl-f .t2-dp { inline-size: 100%; }
.t2 .t2-fl-range { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.t2 .t2-fl-foot { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; padding-top: 4px; border-top: 1px solid var(--t2-line); }
.t2 .t2-fl-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.t2 .t2-fl-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 3px 4px 3px 10px; border: 1px solid rgba(10, 165, 173, .28);
  border-radius: 999px; background: var(--t2-brand-wash); color: var(--t2-brand-3); font-size: var(--t2-label-fs); font-weight: 500;
  animation: t2-soft-in var(--t2-d2) var(--t2-ease-out) both;
}
.t2 .t2-fl-chip b { font-weight: 600; }
.t2 .t2-fl-x {
  display: inline-grid; place-items: center; inline-size: 1.25rem; block-size: 1.25rem; border: 0; border-radius: 50%;
  background: rgba(15, 111, 101, .12); color: inherit; font: inherit; font-size: .85rem; line-height: 1; cursor: pointer;
  transition: background var(--t2-d1) var(--t2-ease);
}
.t2 .t2-fl-x:hover { background: rgba(15, 111, 101, .24); }
.t2 .t2-fl-clear { padding: 2px 6px; border: 0; background: none; color: var(--t2-muted); font: inherit; font-size: var(--t2-label-fs); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.t2 .t2-fl-clear:hover { color: var(--t2-danger); }
@media (max-width: 40rem) {
  .t2 .t2-fl-q { flex-basis: 100%; }
  .t2 .t2-fl-row > select.t2-input { flex: 1 1 auto; }
}

/* ——— 8) التحميل: شعارٌ عندَ الإقلاع، هيكلٌ مطابقٌ للمحتوى، ونقاطٌ هادئةٌ للأجزاء — ولا دوران ——— */
 html[data-t2auth='1'] body #boot #boot-text { font-family: var(--t2-ff-text); font-size: .8125rem; color: #566A88; }
@keyframes t2-logo-in { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: none; } }
@keyframes t2-logo-glow {
  0%, 100% { filter: drop-shadow(0 0 0 rgba(10, 165, 173, 0)); }
  50% { filter: drop-shadow(0 6px 18px rgba(10, 165, 173, .30)); }
}
/* هيكلُ المحتوى: وميضٌ واحدٌ هادئٌ بلونِ الهوية */
@keyframes t2-shimmer { from { background-position: 100% 0; } to { background-position: -100% 0; } }
.t2 :is(.t2-sk-l, .t2-skel-row) {
  background: linear-gradient(90deg, var(--t2-surface-2) 0%, #e8f3f1 45%, var(--t2-surface-2) 90%) !important;
  background-size: 200% 100% !important; animation: t2-shimmer 1.4s linear infinite !important;
}
.t2 :is(.t2-sk-card, .t2-sk-stat, .t2-sk-hero) { border-radius: var(--t2-radius-card); border-color: var(--t2-line); box-shadow: var(--t2-sh-1); }
/* تحميلُ جزءٍ داخلَ الصفحة: ثلاثُ نقاطٍ تنبضُ بالتتابع */
.t2 .t2-busy { display: inline-flex; align-items: center; gap: 10px; padding: 10px 2px; font-size: var(--t2-label-fs); color: var(--t2-muted); }
.t2 .t2-dots { display: inline-flex; gap: 4px; }
.t2 .t2-dots i { inline-size: 6px; block-size: 6px; border-radius: 50%; background: var(--t2-brand); opacity: .25; animation: t2-dot 1.1s var(--t2-ease) infinite; }
.t2 .t2-dots i:nth-child(2) { animation-delay: .15s; }
.t2 .t2-dots i:nth-child(3) { animation-delay: .3s; }
@keyframes t2-dot { 0%, 100% { opacity: .25; transform: none; } 40% { opacity: 1; transform: translateY(-2px); } }
.t2 .t2-spin { inline-size: 6px; block-size: 6px; border: 0; border-radius: 50%; background: var(--t2-brand); animation: t2-dot 1.1s var(--t2-ease) infinite !important; }

/* ——— 9) الحالاتُ الفارغةُ والأخطاء: أيقونةٌ وعنوانٌ وشرحٌ وإجراء ——— */
.t2 .t2-empty {
  display: grid; justify-items: center; gap: 6px; padding: 28px 20px; text-align: center;
  border: 1px dashed var(--t2-line-2); border-radius: var(--t2-radius-card);
  background: linear-gradient(180deg, var(--t2-surface) 0%, var(--t2-surface-2) 100%);
  animation: t2-fade-in var(--t2-d3) var(--t2-ease) both;
}
.t2 .t2-empty-i {
  display: grid; place-items: center; inline-size: 3.25rem; block-size: 3.25rem; margin-bottom: 4px; border-radius: 16px;
  background: linear-gradient(145deg, var(--t2-brand-wash), #ffffff); box-shadow: inset 0 0 0 1px rgba(10, 165, 173, .18);
}
.t2 .t2-empty-b { max-inline-size: 34rem; }
.t2 .t2-empty-a { margin-top: 8px; }
.t2 .t2-empty.is-danger { border-style: solid; border-color: var(--t2-st-danger-line, #f6cfcf); background: var(--t2-surface); }
.t2 .t2-empty.is-danger .t2-empty-i { background: var(--t2-danger-wash); box-shadow: inset 0 0 0 1px rgba(179, 38, 30, .16); }
.t2 .t2-empty.is-warn { border-style: solid; border-color: var(--t2-st-warn-line, #f4e2c4); background: var(--t2-surface); }
.t2 .t2-empty.is-warn .t2-empty-i { background: var(--t2-warn-wash); }
.t2 .t2-empty-x { margin-top: 2px; font-size: var(--t2-cap-fs); color: var(--t2-muted); direction: ltr; unicode-bidi: plaintext; }
.t2 .t2-empty.is-compact { padding: 20px 16px; }

/* ===================== gap660 — هيكلُ تحميلٍ مرئيٌّ وحالةُ قسمٍ واحدة ===================== */
/* الهيكلُ كان بلونِ الخلفيةِ تقريبًا فيبدو كصفحةٍ فارغة: بطاقاتٌ بحدٍّ خفيفٍ ووميضٍ أوضح */
.t2 .t2-skel-row {
  border: 1px solid var(--t2-line); border-radius: 12px;
  background: linear-gradient(90deg, #e9eef3 0%, #f7f9fb 45%, #e9eef3 90%) !important;
  background-size: 200% 100% !important;
}
.t2 .t2-grid > .t2-skel:empty {
  block-size: 5.5rem; border: 1px solid var(--t2-line); border-radius: var(--t2-radius-card);
  background: linear-gradient(90deg, #e9eef3 0%, #f7f9fb 45%, #e9eef3 90%);
  background-size: 200% 100%; animation: t2-shimmer 1.4s linear infinite;
}
/* بطاقةُ «مسار الاكتمال» في طلبِ التحديث: تنبيهٌ هادئٌ بدلَ الخلفيةِ الحمراء */
.t2 .t2-pb-upd.is-alert { background: var(--t2-surface); border-color: var(--t2-line); border-inline-start: 3px solid #c98a1b; }
@media (prefers-reduced-motion: reduce) { .t2 .t2-grid > .t2-skel:empty { animation: none; } }

/* ===================== gap661 — تفاعلٌ واضح · إشعاراتٌ موحَّدة · لوحةٌ شخصية · تحميلٌ بهوية ===================== */

/* ——— 1) التفاعل: كلُّ عنصرٍ قابلٍ للنقرِ يُعلِنُ ذلك بحركةٍ خفيفةٍ وظلٍّ وإضاءة ——— */
/* الترويسة */
.t2.t2-app > .t2-head .t2-hbtn, .t2.t2-app > .t2-head .t2-hwho, .t2.t2-app > .t2-head .t2-hburger {
  transition: transform var(--t2-d2) var(--t2-ease-out), box-shadow var(--t2-d2) var(--t2-ease), background var(--t2-d1) var(--t2-ease), border-color var(--t2-d1) var(--t2-ease), color var(--t2-d1) var(--t2-ease);
}
.t2.t2-app > .t2-head .t2-hbtn:hover {
  transform: var(--t2-lift); background: var(--t2-brand-wash); border-color: var(--t2-brand); color: var(--t2-brand-3);
  box-shadow: 0 6px 16px rgba(15, 111, 101, .18);
}
.t2.t2-app > .t2-head .t2-hbtn svg { transition: transform var(--t2-d2) var(--t2-ease-out); }
.t2.t2-app > .t2-head .t2-hbtn:hover svg { transform: scale(1.1) rotate(-6deg); }
.t2.t2-app > .t2-head .t2-hbtn.is-out:hover { background: var(--t2-danger); border-color: var(--t2-danger); color: #fff; box-shadow: 0 6px 16px rgba(168, 28, 28, .22); }
.t2.t2-app > .t2-head .t2-hbtn.is-out:hover svg { transform: translateX(-2px); }
.t2.t2-app > .t2-head .t2-hwho:hover { transform: var(--t2-lift); background: var(--t2-surface); box-shadow: 0 6px 16px rgba(16, 35, 58, .12); }
.t2.t2-app > .t2-head .t2-hburger:hover { background: var(--t2-brand-wash); }
.t2.t2-app > .t2-head .t2-hbtn:active, .t2.t2-app > .t2-head .t2-hwho:active { transform: translateY(0) scale(.96); box-shadow: none; }
.t2.t2-app > .t2-head :is(.t2-hbtn, .t2-hwho, .t2-hburger):focus-visible { outline: 2px solid var(--t2-brand); outline-offset: 2px; }

/* القائمةُ الجانبية: الأيقونةُ تُضاءُ وترتفع، والعنصرُ يُضاءُ بلونِ الهوية */
.t2.t2-app > .t2-side .t2-side-i { transition: background var(--t2-d1) var(--t2-ease), color var(--t2-d1) var(--t2-ease), transform var(--t2-d2) var(--t2-ease-out); }
.t2.t2-app > .t2-side .t2-side-ic { transition: transform var(--t2-d2) var(--t2-ease-out), box-shadow var(--t2-d2) var(--t2-ease), background var(--t2-d1) var(--t2-ease); }
.t2.t2-app > .t2-side .t2-side-i:hover { background: var(--t2-brand-wash); color: var(--t2-brand-3); }
.t2.t2-app > .t2-side .t2-side-i:hover .t2-side-ic {
  background: var(--t2-surface); transform: translateY(-2px) scale(1.08);
  box-shadow: 0 6px 14px rgba(15, 111, 101, .20), inset 0 0 0 1px rgba(10, 165, 173, .30);
}
.t2.t2-app > .t2-side .t2-side-i:active .t2-side-ic { transform: scale(.95); box-shadow: none; }
.t2.t2-app > .t2-side .t2-side-i:focus-visible { outline: 2px solid var(--t2-brand); outline-offset: -2px; }
.t2.t2-app > .t2-side :is(.t2-side-gh, .t2-side-t) { transition: background var(--t2-d1) var(--t2-ease), color var(--t2-d1) var(--t2-ease); }
.t2.t2-app > .t2-side :is(.t2-side-gh, .t2-side-t):hover { background: var(--t2-surface-2); color: var(--t2-brand-3); }

/* البطاقاتُ القابلةُ للفتح: ارتفاعٌ وظلٌّ وحدٌّ بلونِ الهوية وسهمٌ يتقدّم */
.t2 .t2-grid > .t2-card:not([disabled]) { transition: transform var(--t2-d2) var(--t2-ease-out), box-shadow var(--t2-d2) var(--t2-ease), border-color var(--t2-d1) var(--t2-ease), background var(--t2-d1) var(--t2-ease); }
.t2 .t2-grid > .t2-card:not([disabled]):hover {
  transform: translateY(-3px); border-color: rgba(10, 165, 173, .45);
  box-shadow: 0 12px 28px rgba(16, 35, 58, .12), 0 2px 6px rgba(16, 35, 58, .06);
  background: linear-gradient(180deg, var(--t2-surface) 0%, var(--t2-surface-2) 100%);
}
.t2 .t2-grid > .t2-card:not([disabled]):hover .t2-card-t { color: var(--t2-brand-3); }
.t2 .t2-grid > .t2-card:not([disabled]) :is(.t2-card-go) { transition: transform var(--t2-d2) var(--t2-ease-out); }
.t2 .t2-grid > .t2-card:not([disabled]):hover :is(.t2-card-go) { transform: translateX(-4px); }
.t2 .t2-grid > .t2-card:not([disabled]):active { transform: translateY(-1px) scale(.99); box-shadow: var(--t2-sh-1); }
.t2 .t2-grid > .t2-card:focus-visible { outline: 2px solid var(--t2-brand); outline-offset: 2px; }

/* الأزرار: ارتفاعٌ وظلٌّ ولمعةٌ للأساسيّ، وضغطٌ واضح */
.t2 .t2-btn { transition: transform var(--t2-d2) var(--t2-ease-out), box-shadow var(--t2-d2) var(--t2-ease), background var(--t2-d1) var(--t2-ease), border-color var(--t2-d1) var(--t2-ease), color var(--t2-d1) var(--t2-ease); }
.t2 .t2-btn:hover:not([disabled]) { transform: var(--t2-lift); box-shadow: 0 6px 14px rgba(16, 35, 58, .12); border-color: var(--t2-brand); color: var(--t2-brand-3); }
.t2 .t2-btn.is-primary:hover:not([disabled]) { color: #fff; box-shadow: 0 8px 18px rgba(15, 111, 101, .28); filter: brightness(1.04); }
.t2 .t2-btn.is-danger:hover:not([disabled]) { color: #fff; box-shadow: 0 8px 18px rgba(168, 28, 28, .24); }
.t2 .t2-btn svg { transition: transform var(--t2-d2) var(--t2-ease-out); }
.t2 .t2-btn:hover:not([disabled]) svg { transform: scale(1.1); }
.t2 .t2-btn:active:not([disabled]) { transform: translateY(0) scale(.97); box-shadow: none; }
.t2 .t2-btn:focus-visible { outline: 2px solid var(--t2-brand); outline-offset: 2px; box-shadow: none; }
.t2 .t2-btn[disabled] { cursor: not-allowed; }

/* عناصرُ القوائم والصفوف القابلةُ للفتح: إضاءةٌ وشريطُ هويةٍ في البداية */
.t2 .t2-tl-i { transition: background var(--t2-d1) var(--t2-ease); border-radius: 10px; }
.t2 .t2-tl-i:hover { background: var(--t2-surface-2); }
.t2 :is(.t2-vf-i, .t2-sw-item) { transition: background var(--t2-d1) var(--t2-ease), color var(--t2-d1) var(--t2-ease), transform var(--t2-d2) var(--t2-ease-out); }
.t2 :is(.t2-vf-i, .t2-sw-item):hover { background: var(--t2-brand-wash); color: var(--t2-brand-3); transform: translateX(-2px); }
.t2 .t2-act-i { transition: background var(--t2-d1) var(--t2-ease); }
.t2 .t2-act-i:hover { background: var(--t2-surface-2); }

/* الشاراتُ والرقائقُ القابلةُ للنقر */
.t2 :is(button.t2-pill, a.t2-pill, [role="button"].t2-pill, .t2-fl-chip, .t2-card-badge[role="button"]) {
  cursor: pointer; transition: transform var(--t2-d2) var(--t2-ease-out), box-shadow var(--t2-d2) var(--t2-ease), filter var(--t2-d1) var(--t2-ease);
}
.t2 :is(button.t2-pill, a.t2-pill, [role="button"].t2-pill, .t2-fl-chip):hover { transform: translateY(-1px); box-shadow: 0 4px 10px rgba(16, 35, 58, .12); filter: saturate(1.15); }
.t2 .t2-fl-btn:hover { box-shadow: 0 6px 14px rgba(15, 111, 101, .16); }

@media (hover: none) {
  .t2 .t2-grid > .t2-card:not([disabled]):hover, .t2 .t2-btn:hover:not([disabled]), .t2.t2-app > .t2-head .t2-hbtn:hover { transform: none; }
}

/* ——— 2) الإشعاراتُ العائمة: مكانٌ ثابت، دخولٌ ناعم، أيقونةٌ وعنوانٌ وشرح، وإغلاق ——— */
html body #toast-root.t2-toasts {
  position: fixed; inset-block-end: 20px; inset-inline-end: 20px; inset-inline-start: auto; inset-block-start: auto;
  z-index: 1200; display: grid; gap: 10px; inline-size: min(380px, calc(100vw - 32px));
  margin: 0; padding: 0; transform: none; pointer-events: none; direction: rtl;
  block-size: auto; min-block-size: 0; max-block-size: calc(100vh - 40px); background: transparent; align-content: end; overflow: visible;
}
#toast-root.t2-toasts .t2-toast {
  --tone: var(--t2-st-info, #1d4ed8); --wash: var(--t2-info-wash, #e8f0fe);
  pointer-events: auto; position: relative; overflow: hidden;
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: 12px;
  padding: 14px 14px 14px 12px; border: 1px solid var(--t2-line); border-inline-start: 4px solid var(--tone);
  border-radius: 14px; background: var(--t2-surface, #fff); color: var(--t2-ink);
  box-shadow: 0 18px 40px rgba(16, 35, 58, .18), 0 2px 6px rgba(16, 35, 58, .08);
  font-family: var(--t2-ff-text); animation: t2-toast-in var(--t2-d3) var(--t2-ease-out) both;
}
#toast-root.t2-toasts .t2-toast.is-ok { --tone: var(--t2-st-ok, #0f7a37); --wash: var(--t2-ok-wash, #e9f8ef); }
#toast-root.t2-toasts .t2-toast.is-warn { --tone: var(--t2-st-warn, #a15c05); --wash: var(--t2-warn-wash, #fdf4e3); }
#toast-root.t2-toasts .t2-toast.is-error { --tone: var(--t2-st-danger, #a81c1c); --wash: var(--t2-danger-wash, #fdeeee); }
#toast-root.t2-toasts .t2-toast-ic { display: grid; place-items: center; inline-size: 2.4rem; block-size: 2.4rem; border-radius: 12px; background: var(--wash); line-height: 0; }
#toast-root.t2-toasts .t2-toast-c { display: grid; gap: 2px; min-inline-size: 0; padding-top: 2px; }
#toast-root.t2-toasts .t2-toast-t { font-size: var(--t2-label-fs, .875rem); font-weight: 700; color: var(--t2-ink); line-height: 1.5; }
#toast-root.t2-toasts .t2-toast-b { font-size: var(--t2-bsm-fs, .8125rem); color: var(--t2-ink-2); line-height: 1.6; }
#toast-root.t2-toasts .t2-toast-x {
  display: grid; place-items: center; inline-size: 2rem; block-size: 2rem; margin: -4px -2px 0 0; padding: 0;
  border: 0; border-radius: 9px; background: transparent; color: var(--t2-muted); font-size: 1.25rem; line-height: 1; cursor: pointer;
  transition: background var(--t2-d1) var(--t2-ease), color var(--t2-d1) var(--t2-ease), transform var(--t2-d2) var(--t2-ease-out);
}
#toast-root.t2-toasts .t2-toast-x:hover { background: var(--t2-surface-2); color: var(--t2-ink); transform: rotate(90deg); }
#toast-root.t2-toasts .t2-toast-x:focus-visible { outline: 2px solid var(--t2-brand); outline-offset: 1px; }
#toast-root.t2-toasts .t2-toast.is-auto::after {
  content: ''; position: absolute; inset-inline: 0; inset-block-end: 0; block-size: 3px; background: var(--tone); opacity: .35;
  transform-origin: right; animation: t2-toast-time 10s linear both;
}
#toast-root.t2-toasts .t2-toast.is-hold::after { animation-play-state: paused; }
#toast-root.t2-toasts .t2-toast.is-out { animation: t2-toast-out .2s var(--t2-ease) both; }
@keyframes t2-toast-in { from { opacity: 0; transform: translateY(14px) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes t2-toast-out { to { opacity: 0; transform: translateY(8px) scale(.97); } }
@keyframes t2-toast-time { from { transform: scaleX(1); } to { transform: scaleX(0); } }
@media (max-width: 640px) {
  html body #toast-root.t2-toasts { inset-inline: 12px; inset-block-end: 12px; inline-size: auto; }
}

/* تنبيهٌ داخلَ الصفحةِ قابلٌ للإغلاق */
.t2 .t2-note.is-x { position: relative; padding-inline-end: 44px; }
.t2 .t2-note-x {
  position: absolute; inset-block-start: 8px; inset-inline-end: 8px; display: grid; place-items: center;
  inline-size: 1.9rem; block-size: 1.9rem; border: 0; border-radius: 8px; background: transparent;
  color: var(--t2-muted); font-size: 1.15rem; line-height: 1; cursor: pointer;
  transition: background var(--t2-d1) var(--t2-ease), color var(--t2-d1) var(--t2-ease);
}
.t2 .t2-note-x:hover { background: rgba(16, 35, 58, .06); color: var(--t2-ink); }
.t2 .t2-note-x:focus-visible { outline: 2px solid var(--t2-brand); outline-offset: 1px; }
.t2 .t2-note.is-out { animation: t2-toast-out .18s var(--t2-ease) both; }

/* ——— 3) لوحةُ التحكم: ترحيبٌ وملخّص ← يحتاج إلى إجراء ← الأرقام ← الطلبات ← النشاط ——— */
.t2 .t2-dash { gap: 20px; }
.t2 .t2-dash > .t2-dash-head {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 12px 20px;
  padding: 22px 24px; border: 1px solid var(--t2-line); border-radius: var(--t2-radius-card);
  background: radial-gradient(120% 180% at 100% 0%, rgba(10, 165, 173, .10) 0%, transparent 55%), var(--t2-surface);
  box-shadow: var(--t2-sh-1);
}
.t2 .t2-dash-tx { display: grid; gap: 4px; min-inline-size: 0; }
.t2 .t2-dash-head .t2-dash-sub { max-inline-size: 46rem; }
.t2 .t2-dash-cta { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 8px; }
.t2 .t2-dash-tools { display: grid; justify-items: end; gap: 6px; }
.t2 .t2-dash-at { font-size: var(--t2-cap-fs); color: var(--t2-muted); white-space: nowrap; }
.t2 .t2-dash-at time { color: var(--t2-ink-2); font-weight: 600; }
.t2 .t2-dash-rf.is-busy { pointer-events: none; opacity: .75; }
.t2 .t2-dash-rf.is-busy::before {
  content: ''; inline-size: 12px; block-size: 12px; border-radius: 50%;
  background: conic-gradient(var(--t2-brand) 0 25%, transparent 25% 100%);
  -webkit-mask: radial-gradient(circle, transparent 3px, #000 3.5px); mask: radial-gradient(circle, transparent 3px, #000 3.5px);
  animation: t2-dot 1.1s var(--t2-ease) infinite;
}

/* يحتاج إلى إجراء: الأهمُّ بطاقةٌ بارزة، والباقي صفوفٌ في عمودين */
.t2 .t2-act-l { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.t2 .t2-act-i:last-child:nth-child(odd) { grid-column: auto; }
.t2 .t2-act-i.is-lead:last-child, .t2 .t2-act-l > .t2-act-i:last-child:nth-child(even) { grid-column: 1 / -1; }
.t2 .t2-act-i.is-lead {
  grid-column: 1 / -1; gap: 16px; padding: 18px 20px;
  background: linear-gradient(90deg, transparent 0%, var(--wash) 100%), var(--t2-surface);
}
.t2 .t2-act-i.is-lead::before { inset-block: 12px; inline-size: 4px; }
.t2 .t2-act-i.is-lead .t2-act-ic { inline-size: 3rem; block-size: 3rem; border-radius: 14px; background: var(--t2-surface); box-shadow: 0 6px 16px rgba(16, 35, 58, .10), inset 0 0 0 1px var(--wash); }
.t2 .t2-act-eye { font-size: var(--t2-cap-fs); font-weight: 700; color: var(--tone); letter-spacing: .01em; }
.t2 .t2-act-i.is-lead .t2-act-it { font-family: var(--t2-ff-display); font-size: var(--t2-h3-fs, 1.0625rem); font-weight: 700; }
.t2 .t2-act-i.is-lead .t2-act-d { font-size: var(--t2-bsm-fs); }
.t2 .t2-act-i:not(.is-lead) .t2-act-ic { inline-size: 2.2rem; block-size: 2.2rem; }

/* الأرقام: بطاقاتٌ مستقلّةٌ بأيقونةٍ ورقمٍ بارز */

/* الطلباتُ الأخيرة ثم النشاط: كلٌّ بعرضِ الصفحة */
.t2 .t2-dash > .t2-dash-grid.is-stack { grid-template-columns: minmax(0, 1fr); gap: 20px; }
.t2 .t2-dash-grid.is-stack .t2-tl { display: grid; grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); gap: 4px 20px; }

@media (max-width: 760px) {
  .t2 .t2-dash > .t2-dash-head { grid-template-columns: minmax(0, 1fr); padding: 18px; }
  .t2 .t2-dash-tools { justify-items: start; grid-auto-flow: column; align-items: center; justify-content: start; gap: 10px; }
  .t2 .t2-act-l { grid-template-columns: minmax(0, 1fr); }
  .t2 .t2-act-i.is-lead { padding: 14px; }
}

/* ——— 4) شاشةُ الإقلاع: الشعارُ بهالةٍ تتنفّس، وشريطُ تقدّمٍ رفيعٌ ينساب — تحميلٌ واحدٌ للتطبيق ——— */
@keyframes t2-boot-halo { 0%, 100% { opacity: .55; transform: scale(.94); } 50% { opacity: 1; transform: scale(1.04); } }
@keyframes t2-logo-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.025); } }
@keyframes t2-boot-slide { from { inset-inline-start: -40%; } to { inset-inline-start: 100%; } }
@media (prefers-reduced-motion: reduce) {
  #toast-root.t2-toasts .t2-toast, #toast-root.t2-toasts .t2-toast.is-auto::after { animation: none; }
  .t2 .t2-grid > .t2-card:not([disabled]):hover, .t2 .t2-btn:hover:not([disabled]), .t2.t2-app > .t2-side .t2-side-i:hover .t2-side-ic, .t2.t2-app > .t2-head .t2-hbtn:hover { transform: none; }
}

/* ——— 5) القوالبُ الداخلية ——— */
/* بطاقاتُ الأقسام: العدّادُ في صفِّ البطاقةِ لا عائمًا فوقَ زاويتها، والسهمُ بعدَه */
.t2 .t2-grid > .t2-card:has(> .t2-card-badge) { grid-template-columns: auto minmax(0, 1fr) auto auto; }
.t2 .t2-grid > .t2-card > .t2-card-badge { position: static; grid-column: 3; grid-row: 1; align-self: center; inset: auto; }
.t2 .t2-grid > .t2-card:has(> .t2-card-badge) > .t2-card-go { grid-column: 4; grid-row: 1; }
/* بطاقةٌ مقفلة: مظهرٌ هادئٌ لا يَعِدُ بالنقر */
.t2 .t2-grid > .t2-card[disabled] { cursor: not-allowed; background: var(--t2-surface-2); box-shadow: none; }
.t2 .t2-grid > .t2-card[disabled] :is(.t2-card-t, .t2-card-d) { color: var(--t2-muted); }
.t2 .t2-grid > .t2-card[disabled] .t2-card-ico { filter: grayscale(.55) opacity(.8); }
.t2 .t2-grid > .t2-card[disabled] .t2-card-go { opacity: 0; }

/* قالبُ التفاصيل: عناوينُ أقسامٍ واضحة، والقسمُ الفارغُ سطرٌ واحدٌ لا بطاقةٌ كاملة */
.t2 .t2-fm-block > .t2-fm-sec-t:first-child { margin: 0 0 12px; padding-bottom: 10px; border-bottom: 1px solid var(--t2-line); }
.t2 .t2-fm-block:has(> .t2-fm-sec-t:first-child + .t2-pb-hint:last-child) { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; padding-block: 14px; }
.t2 .t2-fm-block:has(> .t2-fm-sec-t:first-child + .t2-pb-hint:last-child) > .t2-fm-sec-t { margin: 0; padding: 0; border: 0; }
.t2 .t2-fm-block:has(> .t2-fm-sec-t:first-child + .t2-pb-hint:last-child) > .t2-pb-hint { margin: 0; color: var(--t2-muted); }

/* تنبيهٌ داخلَ لوحة: بلا صندوقٍ داخلَ صندوق */
.t2 :is(.t2-panel, .t2-fm-block) .t2-note { box-shadow: none; }
.t2 :is(.t2-panel, .t2-fm-block) .t2-note.is-info { background: var(--t2-surface-2); border-color: transparent; border-inline-start-color: var(--t2-st-info); }

/* ===================== gap662 — شعارُ الإقلاعِ أوضح · أزرارُ الجداولِ في سطرٍ واحد ===================== */

/* ===================== gap663 — طبقاتُ القائمةِ على الجوال · نوافذُ الموقعِ بهويةِ النظام · تواريخُ الجداول ===================== */

/* 1) القائمةُ الجانبيةُ في وضعِ الدرج (≤ 64rem): الترتيبُ من الأعلى — الترويسة ← القائمة ← الخلفيةُ المعتمة ← المحتوى.
 * كانت الخلفيةُ (z 69) فوقَ القائمة (z 45) فتبتلعُ كلَّ نقرةٍ عليها. */
@media (max-width: 64rem) {
  .t2.t2-app > .t2-side-bd { z-index: 64; }
  .t2.t2-app > .t2-side { z-index: 66; overscroll-behavior: contain; }
  html.t2-on.t2-drawer-on, html.t2-on.t2-drawer-on body { overflow: hidden; }
  html.t2-drawer-on .t2.t2-app > .t2-side { box-shadow: -18px 0 40px rgba(8, 22, 28, .22); }
  .t2.t2-app > .t2-side { transition: inset-inline-start var(--t2-d3) var(--t2-ease-out), box-shadow var(--t2-d3) var(--t2-ease); }
}

/* 3) التاريخُ في الجداولِ لا ينقسمُ على سطرين */

/* 4) قالبُ تفاصيلِ الطلب: عنوانُ الطلبِ الحقيقيُّ هو H1، وتحتَه الحالةُ والرقمُ وتاريخُ الفتح، والمسارُ صغيرٌ فوقَه */
.t2-stack:has(> .t2-stack .t2-pb-dhead) > .t2-phead { display: none; }
.t2 .t2-pb-dhead > .t2-phead { margin: 0; }
.t2 .t2-pb-dmeta { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; }
.t2 .t2-pb-dmeta-i { color: var(--t2-muted); font-size: var(--t2-bsm-fs); white-space: nowrap; }
.t2 .t2-pb-dmeta-i :is(.t2-tech, time) { color: var(--t2-ink-2); font-weight: 600; }

/* 5) صفحاتُ النصوصِ الطويلة (الأسئلة والشروط والخصوصية): كلُّ قسمٍ بطاقةٌ، وطولُ السطرِ مريحٌ للقراءة */
.t2 div:has(> section > .t2-group-h + .t2-stack-tight > .t2-p) { display: grid; gap: 14px; }
.t2 section:has(> .t2-group-h + .t2-stack-tight > .t2-p) {
  background: var(--t2-surface); border: 1px solid var(--t2-line); border-radius: var(--t2-radius-card);
  padding: 18px 22px; box-shadow: var(--t2-sh-1);
}
.t2 section > .t2-stack-tight > :is(.t2-p, .t2-list) { max-inline-size: 75ch; line-height: 1.95; }
@media (max-width: 640px) { .t2 section:has(> .t2-group-h + .t2-stack-tight > .t2-p) { padding: 14px 16px; } }

/* ===================== gap664 — لا شيءَ يغطّي القائمةَ الجانبية على الشاشاتِ الواسعة ===================== */
/* لوحاتُ الأمانِ العائمةُ كانت في الزاويةِ نفسِها التي تقعُ فيها القائمةُ الجانبية (يمين الصفحة) فتحجبُ أسفلَها:
 * تنتقلُ إلى الجهةِ الأخرى. الإشعاراتُ تبقى أسفل الشاشة في الجهة المقابلة للقائمة. */
html body #toast-root.t2-toasts {
  inset-block-start: auto; inset-block-end: 20px;
  inset-inline-end: auto; inset-inline-start: 20px;
  align-content: end;
}
@media (max-width: 46rem) {
  html body #toast-root.t2-toasts { inset-inline: 12px; inset-block-end: 12px; inline-size: auto; }
}

/* ═════ c665 — شارةُ النوع · خليةُ التنبيه · صفحةُ المستندات ═════ */
.t2 .t2-kchip {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .2rem .65rem .2rem .5rem; border-radius: var(--t2-r-pill);
  font: var(--t2-w-semibold) var(--t2-t-small)/1.4 var(--t2-font);
  white-space: nowrap; max-inline-size: 100%;
  background: var(--t2-st-none-bg, var(--t2-surface-2)); color: var(--t2-ink-2);
  border: 1px solid var(--t2-st-none-line, var(--t2-line));
  transition: transform var(--t2-fast) var(--t2-ease), box-shadow var(--t2-fast) var(--t2-ease);
}
.t2 .t2-kchip-i { display: inline-grid; place-items: center; flex: none; }
.t2 .t2-kchip-i svg { inline-size: 16px; block-size: 16px; }
.t2 .t2-kchip-t { overflow: hidden; text-overflow: ellipsis; }
.t2 .t2-kchip.is-ok { background: var(--t2-st-ok-bg); color: var(--t2-st-ok); border-color: var(--t2-st-ok-line); }
.t2 .t2-kchip.is-warn { background: var(--t2-st-warn-bg); color: var(--t2-st-warn); border-color: var(--t2-st-warn-line); }
.t2 .t2-kchip.is-danger { background: var(--t2-st-danger-bg); color: var(--t2-st-danger); border-color: var(--t2-st-danger-line); }
.t2 .t2-kchip.is-info { background: var(--t2-st-info-bg); color: var(--t2-st-info); border-color: var(--t2-st-info-line); }
.t2 .t2-table tr:hover .t2-kchip { transform: translateY(-1px); box-shadow: var(--t2-sh-1); }

.t2 .t2-msg { display: grid; gap: .15rem; min-inline-size: 14rem; max-inline-size: 34rem; }
.t2 .t2-msg-t { font-weight: var(--t2-w-semibold); color: var(--t2-ink); line-height: var(--t2-lh-tight); }
.t2 .t2-msg-b { color: var(--t2-muted); font-size: var(--t2-t-small); line-height: 1.55;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.t2 .t2-msg.is-unread .t2-msg-t::before { content: ""; display: inline-block; inline-size: .5rem; block-size: .5rem;
  border-radius: 50%; background: var(--t2-brand); margin-inline-end: .45rem; vertical-align: middle; }

/* ملخّصُ اكتمالِ المستندات */
.t2 .t2-pb-docsum {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--t2-lg); align-items: center;
  padding: var(--t2-lg) var(--t2-xl); border-radius: var(--t2-r-lg);
  background: var(--t2-surface); border: 1px solid var(--t2-line); box-shadow: var(--t2-sh-1);
}
.t2 .t2-pb-docsum-main { display: grid; gap: .55rem; min-inline-size: 0; }
.t2 .t2-pb-docsum-k { font-size: var(--t2-t-small); color: var(--t2-muted); font-weight: var(--t2-w-semibold); }
.t2 .t2-pb-docsum-v { display: flex; align-items: baseline; gap: .6rem; flex-wrap: wrap; color: var(--t2-ink-2); }
.t2 .t2-pb-docsum-v b { font: var(--t2-w-bold) 1.75rem/1 var(--t2-ff-display); color: var(--t2-ink); }
.t2 .t2-pb-docsum-bar { block-size: .5rem; border-radius: var(--t2-r-pill); background: var(--t2-surface-2); overflow: hidden; max-inline-size: 28rem; }
.t2 .t2-pb-docsum-bar > span { display: block; block-size: 100%; border-radius: inherit;
  background: linear-gradient(90deg, var(--t2-brand-2), var(--t2-brand)); transition: width var(--t2-slow) var(--t2-ease); }
.t2 .t2-pb-docsum.is-done .t2-pb-docsum-bar > span { background: var(--t2-ok); }
.t2 .t2-pb-docsum-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.t2 .t2-pb-docsum-act { display: grid; gap: .5rem; justify-items: end; max-inline-size: 18rem; }
.t2 .t2-pb-docsum-h { margin: 0; font-size: var(--t2-t-caption); color: var(--t2-muted); text-align: end; line-height: 1.6; }

/* بطاقةُ مستند */
.t2 .t2-pb-docs { display: grid; gap: var(--t2-sm); }
.t2 .t2-pb-doc {
  position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--t2-md); align-items: center;
  padding: var(--t2-md) var(--t2-lg); border-radius: var(--t2-r-lg);
  background: var(--t2-surface); border: 1px solid var(--t2-line);
  transition: transform var(--t2-fast) var(--t2-ease), box-shadow var(--t2-fast) var(--t2-ease), border-color var(--t2-fast) var(--t2-ease);
}
.t2 .t2-pb-doc::before { content: ""; position: absolute; inset-block: 12px; inset-inline-start: 0; inline-size: 3px;
  border-radius: 0 3px 3px 0; background: var(--t2-line); }
.t2 .t2-pb-doc.is-danger::before { background: var(--t2-danger); }
.t2 .t2-pb-doc.is-warn::before { background: var(--t2-warn); }
.t2 .t2-pb-doc.is-ok::before { background: var(--t2-ok); }
.t2 .t2-pb-doc:hover { transform: translateY(-2px); box-shadow: var(--t2-sh-2); border-color: var(--t2-line-2); }
.t2 .t2-pb-doc-ic { display: grid; place-items: center; inline-size: 2.75rem; block-size: 2.75rem; border-radius: var(--t2-r);
  background: var(--t2-surface-2); transition: transform var(--t2-fast) var(--t2-ease); }
.t2 .t2-pb-doc:hover .t2-pb-doc-ic { transform: scale(1.06); }
.t2 .t2-pb-doc-main { display: grid; gap: .3rem; min-inline-size: 0; }
.t2 .t2-pb-doc-top { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.t2 .t2-pb-doc-t { margin: 0; font: var(--t2-w-bold) var(--t2-t-h3)/1.4 var(--t2-font); color: var(--t2-ink); }
.t2 .t2-pb-doc-n, .t2 .t2-pb-doc-need { margin: 0; font-size: var(--t2-t-small); color: var(--t2-muted); line-height: 1.6; }
.t2 .t2-pb-doc.is-danger .t2-pb-doc-need { color: var(--t2-st-danger); }
.t2 .t2-pb-doc-meta { display: flex; flex-wrap: wrap; gap: .35rem .9rem; font-size: var(--t2-t-caption); color: var(--t2-muted); }
.t2 .t2-pb-doc-meta time { white-space: nowrap; }
.t2 .t2-pb-doc-req { font-weight: var(--t2-w-semibold); }
.t2 .t2-pb-doc-req.is-req { color: var(--t2-brand); }
.t2 .t2-pb-doc-off { color: var(--t2-st-warn); }
.t2 .t2-pb-doc-act { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: flex-end; }

@media (max-width: 46rem) {
  .t2 .t2-pb-docsum { grid-template-columns: 1fr; padding: var(--t2-md) var(--t2-lg); }
  .t2 .t2-pb-docsum-act { justify-items: stretch; max-inline-size: none; }
  .t2 .t2-pb-docsum-act .t2-btn { justify-content: center; }
  .t2 .t2-pb-docsum-h { text-align: start; }
  .t2 .t2-pb-doc { grid-template-columns: auto minmax(0, 1fr); }
  .t2 .t2-pb-doc-act { grid-column: 1 / -1; justify-content: stretch; }
  .t2 .t2-pb-doc-act .t2-btn { flex: 1 1 auto; justify-content: center; }
  .t2 .t2-msg { min-inline-size: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .t2 .t2-pb-doc, .t2 .t2-pb-doc-ic, .t2 .t2-kchip { transition: none; }
  .t2 .t2-pb-doc:hover, .t2 .t2-pb-doc:hover .t2-pb-doc-ic { transform: none; }
}

/* ==========================================================================
   c666 — عينُ كلمةِ المرور، ومؤشِّرُ المراحلِ بلا أرقام، وفهرسُ طلبِ التوثيقِ على الجوّال
   ========================================================================== */

/* عينُ كلمةِ المرور: الموضعُ في طرفِ الحقلِ وحدَه. كانت قاعدتا الطرفين معًا تمطّانِ الزرَّ
   فوقَ الحقلِ أو تنقلانِه إلى بدايةِ النصِّ فيغطّيه. */
.t2 .t2-password-toggle { inset-inline-start: auto; }

/* مؤشِّرُ المراحلِ الموحَّد: نقطةٌ بدلَ الرقم، وعلامةُ صحٍّ للمنجَز */
.t2-step-n:empty::after {
  content: '';
  width: .42rem;
  height: .42rem;
  border-radius: 50%;
  background: currentColor;
  opacity: .75;
}
.t2-step.is-now .t2-step-n:empty::after { opacity: 1; }

/* فهرسُ أقسامِ طلبِ التوثيق: لا علامةَ تعجُّبٍ ولا عدَّادَ خام */
.t2 .t2-vf-ic:empty::before {
  content: '';
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  background: currentColor;
}
.t2 .t2-vf-n { white-space: nowrap; }

@media (max-width: 64rem) {
  .t2 .t2-vf-nav {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(9.25rem, 1fr));
    gap: 6px;
    padding: 8px;
    overflow: visible;
  }
  .t2 .t2-vf-i {
    width: 100%;
    min-block-size: 2.75rem;
    grid-template-columns: 1.3rem minmax(0, 1fr);
    align-items: center;
    padding: 8px 10px;
    white-space: normal;
    border: 1px solid var(--t2-line, rgba(0, 0, 0, .08));
    border-radius: 12px;
    background: var(--t2-surface, #fff);
  }
  .t2 .t2-vf-i.is-on {
    border-color: #0AA5AD;
    background: rgba(10, 165, 173, .10);
    box-shadow: inset 0 0 0 1px #0AA5AD;
  }
  .t2 .t2-vf-t {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    line-height: 1.35;
    font-size: var(--t2-t-caption, .78rem);
  }
  .t2 .t2-vf-n { display: none; }
  .t2 .t2-vf-i:hover { transform: none; }
}

.t2 .t2-input.is-num {
  direction: ltr;
  text-align: left;
  border-radius: var(--t2-r);
  font-variant-numeric: tabular-nums;
  appearance: textfield;
}
.t2 .t2-input.is-num::-webkit-outer-spin-button, .t2 .t2-input.is-num::-webkit-inner-spin-button { appearance: none; margin: 0; }
.t2-home-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--t2-sm);
  align-items: center;
  padding: var(--t2-sm) 0;
  border-bottom: 1px solid var(--t2-line);
}
.t2-hwho-ac { margin: 0; color: var(--t2-muted); font-size: var(--t2-fs-xs); }
.t2-otp-wait:empty { display: none; }
.t2-otp-wait { margin: 0; color: var(--t2-muted); font-size: var(--t2-fs-xs); }