/*
 * صفحات إدارة شاشة المركز فقط (المعاينة المضمَّنة). الشاشة نفسها في display.css.
 * لا ألوان ثابتة: tokens فقط (docs/ui-system.md).
 */
.ds-embed {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 1px solid var(--color-hairline);
  border-radius: var(--radius-card);
  overflow: hidden;
  background: var(--color-surface-secondary);
}

.ds-embed__frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* زر كإجراء هادئ (.quiet-action على <button> داخل نموذج): بلا حدّ ولا خلفية افتراضية. */
button.quiet-action {
  background: none;
  border: 0;
  padding: 0;
  font-family: inherit;
  cursor: pointer;
}

/* ------------------------------------------------------------------ استوديو الشاشة (الإدارة): أنماط مصغّرة ومكتبة الخلفيات والمعاينة والجدول الزمني والمقدّم */
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
@media (max-width: 560px) { .grid-2 { grid-template-columns: 1fr; } }
.field__range { width: 100%; accent-color: var(--color-primary); }
.field__select--sm { width: auto; min-width: 8rem; }
.inline-form { display: inline-flex; align-items: center; gap: var(--space-2); }
.chips-select { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-3); }
.chips-select .chip-f { cursor: pointer; }
.chips-select input { margin-inline-end: 6px; accent-color: var(--color-primary); }
.season-row { display: grid; grid-template-columns: 1.2fr 1.2fr 1fr 1fr; gap: var(--space-2); }
@media (max-width: 720px) { .season-row { grid-template-columns: 1fr 1fr; } }
.pl-row { flex-direction: column; align-items: stretch; }

/* بطاقات الأنماط: معاينة مصغّرة بالألوان من tokens (ليست المُصيِّر نفسه؛ المعاينة الحقيقية في «المعاينة»). */
.pvx-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(8.2rem, 1fr)); gap: var(--space-3); }
.pvx-card { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 8px; border: 1px solid var(--color-hairline); border-radius: var(--radius-card); background: var(--color-surface); cursor: pointer; }
.pvx-card input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.pvx-card.is-selected, .pvx-card:has(input:checked) { border-color: var(--color-primary); box-shadow: 0 0 0 2px var(--color-sage-line); }
.pvx-card:has(input:focus-visible) { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.pvx-card__name { font-size: .85rem; font-weight: 600; text-align: center; }
.pvx { --t: var(--accent-settings); --ts: var(--accent-settings-soft); position: relative; display: block; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; background: linear-gradient(180deg, var(--color-bg), color-mix(in srgb, var(--ts) 60%, var(--color-bg))); border: 1px solid var(--color-hairline); }
.pvx i { position: absolute; display: block; border-radius: 99px; background: var(--t); }
/* أجزاء المصغّرة: 1 سياق · 2 عبارة · 3 دعم · 4 محور (صورة/رقم). الافتراضي: تركيب وسطي أنيق. */
.pvx i:nth-child(1) { inset-inline: 40% 40%; top: 9%; height: 4.5%; opacity: .55; }
.pvx i:nth-child(2) { inset-inline: 26% 26%; top: 62%; height: 9%; }
.pvx i:nth-child(3) { inset-inline: 34% 34%; top: 77%; height: 5%; opacity: .4; }
.pvx i:nth-child(4) { inset-inline-start: 41%; top: 19%; width: 18%; aspect-ratio: 1; border-radius: 50%; opacity: .75; }
.pvx[data-tone="achievements"] { --t: var(--accent-achievements); --ts: var(--accent-achievements-soft); }
.pvx[data-tone="groups"] { --t: var(--accent-groups); --ts: var(--accent-groups-soft); }
.pvx[data-tone="students"] { --t: var(--accent-students); --ts: var(--accent-students-soft); }
.pvx[data-tone="habits"] { --t: var(--accent-habits); --ts: var(--accent-habits-soft); }
.pvx[data-tone="registration"] { --t: var(--accent-registration); --ts: var(--accent-registration-soft); }
.pvx[data-tone="performance"] { --t: var(--accent-performance); --ts: var(--accent-performance-soft); }
/* بسيط: نص فقط، محاذاة للبداية، بلا محور بصري كبير. */
.pvx[data-preset="minimal"] { background: var(--color-bg); }
.pvx[data-preset="minimal"] i:nth-child(1) { inset-inline: 62% 20%; opacity: .3; }
.pvx[data-preset="minimal"] i:nth-child(2) { inset-inline: 38% 20%; top: 38%; height: 12%; background: var(--color-text); }
.pvx[data-preset="minimal"] i:nth-child(3) { inset-inline: 52% 20%; top: 56%; background: var(--color-text); opacity: .25; }
.pvx[data-preset="minimal"] i:nth-child(4) { inset-inline-start: 20%; top: 38%; width: 12%; opacity: .3; background: var(--color-text); }
/* احتفال: أشعة ناعمة وتوهّج. */
.pvx[data-preset="celebration"] { background: repeating-conic-gradient(from 0deg at 50% 38%, color-mix(in srgb, var(--t) 12%, transparent) 0 5deg, transparent 5deg 16deg), radial-gradient(60% 70% at 50% 40%, var(--ts), var(--color-bg)); }
.pvx[data-preset="celebration"] i:nth-child(1) { height: 6%; opacity: 1; background: var(--ts); border: 1px solid var(--t); }
/* هادئ: ألوان باردة وعناصر أخف. */
.pvx[data-preset="calm"] { background: radial-gradient(90% 70% at 50% 120%, var(--ts), transparent), var(--color-bg); }
.pvx[data-preset="calm"] i { opacity: .4; }
.pvx[data-preset="calm"] i:nth-child(4) { opacity: .5; }
/* إنجاز: شريط جانبي ورقم قوي. */
.pvx[data-preset="achievement"]::before { content: ''; position: absolute; inset-block: 0; inset-inline-start: 0; width: 5%; background: var(--t); }
.pvx[data-preset="achievement"] i:nth-child(4) { inset-inline: 30% 30%; top: 24%; width: auto; aspect-ratio: auto; height: 26%; border-radius: 6px; opacity: .9; }
.pvx[data-preset="achievement"] i:nth-child(2) { top: 58%; }
/* تركيز الصورة: صورة كبيرة والنص بجانبها. */
.pvx[data-preset="photo_focus"] i:nth-child(4) { inset-inline-start: 8%; top: 12%; width: 30%; aspect-ratio: 3 / 4; border-radius: 6px; opacity: .6; }
.pvx[data-preset="photo_focus"] i:nth-child(1) { inset-inline: 48% 12%; top: 22%; }
.pvx[data-preset="photo_focus"] i:nth-child(2) { inset-inline: 44% 12%; top: 38%; }
.pvx[data-preset="photo_focus"] i:nth-child(3) { inset-inline: 52% 12%; top: 56%; }
/* شبابي: سياق ممتلئ وشكل مستدير ودائرة خلفية. */
.pvx[data-preset="youth"]::after { content: ''; position: absolute; width: 40%; aspect-ratio: 1; border-radius: 50%; background: var(--ts); inset-inline-end: -10%; bottom: -30%; }
.pvx[data-preset="youth"] i:nth-child(1) { height: 7%; opacity: 1; }
.pvx[data-preset="youth"] i:nth-child(4) { border-radius: 36%; }
/* حفل: إطار مزدوج ووقار. */
.pvx[data-preset="ceremony"]::before { content: ''; position: absolute; inset: 6%; border: 1.5px solid var(--t); border-radius: 4px; opacity: .6; }
.pvx[data-preset="ceremony"] i:nth-child(4) { box-shadow: 0 0 0 2px var(--color-bg), 0 0 0 3px var(--t); }
.pvx[data-preset="elegant"] i:nth-child(3) { opacity: .35; }
.pvx[data-preset^="season"], .pvx[data-preset="seasonal"] { background: linear-gradient(180deg, var(--color-bg), var(--ts)); }
.pvx[data-preset^="season"]::after, .pvx[data-preset="seasonal"]::after { content: ''; position: absolute; inset: 55% 0 0; background: radial-gradient(circle at 50% 100%, transparent 58%, color-mix(in srgb, var(--t) 35%, transparent) 59% 63%, transparent 64%) 0 0 / 22% 100%; }
.pvx[data-preset="season_ramadan"] { background: linear-gradient(180deg, var(--color-primary-dark), color-mix(in srgb, var(--color-primary-dark) 70%, var(--color-text))); }
.pvx[data-preset="season_ramadan"] i { background: var(--color-surface); }
.pvx--inherit { background: repeating-linear-gradient(135deg, var(--color-fill) 0 6px, var(--color-bg) 6px 12px); }
.pvx--inherit i { background: var(--color-text-faint); }

/* رسم تخطيطي مصغّر للتخطيط المختار (يتبدّل بالـJS؛ شكل مفهوم لا معاينة حقيقية). */
.lvx { --c: var(--color-primary); position: relative; display: block; width: 8.5rem; aspect-ratio: 16 / 9; margin-top: var(--space-2); border: 1px solid var(--color-hairline); border-radius: 8px; background: var(--color-bg); overflow: hidden; }
.lvx[hidden] { display: none; }
.lvx i { position: absolute; display: block; background: var(--c); border-radius: 99px; opacity: .55; }
.lvx[data-family="centered"] i:nth-child(1) { inset-inline: 42% 42%; top: 14%; aspect-ratio: 1; border-radius: 50%; }
.lvx[data-family="centered"] i:nth-child(2) { inset-inline: 28% 28%; top: 58%; height: 11%; opacity: .85; }
.lvx[data-family="centered"] i:nth-child(3) { inset-inline: 36% 36%; top: 76%; height: 6%; opacity: .35; }
.lvx[data-family="split"] i:nth-child(1) { inset-inline-start: 8%; top: 12%; width: 32%; height: 76%; border-radius: 6px; }
.lvx[data-family="split"] i:nth-child(2) { inset-inline: 48% 8%; top: 36%; height: 12%; opacity: .85; }
.lvx[data-family="split"] i:nth-child(3) { inset-inline: 56% 8%; top: 56%; height: 6%; opacity: .35; }
.lvx[data-family="photo"] { background: color-mix(in srgb, var(--c) 40%, var(--color-text)); }
.lvx[data-family="photo"] i { background: var(--color-surface); }
.lvx[data-family="photo"] i:nth-child(1) { display: none; }
.lvx[data-family="photo"] i:nth-child(2) { inset-inline: 40% 10%; top: 62%; height: 11%; opacity: .9; }
.lvx[data-family="photo"] i:nth-child(3) { inset-inline: 54% 10%; top: 80%; height: 6%; opacity: .5; }
.lvx[data-family="number"] i:nth-child(1) { inset-inline: 30% 30%; top: 22%; height: 36%; border-radius: 8px; opacity: .85; }
.lvx[data-family="number"] i:nth-child(2) { inset-inline: 38% 38%; top: 68%; height: 7%; opacity: .4; }
.lvx[data-family="number"] i:nth-child(3) { display: none; }
.lvx[data-family="metrics"] i:nth-child(1) { inset-inline-start: 62%; top: 26%; width: 26%; height: 36%; border-radius: 6px; opacity: .85; }
.lvx[data-family="metrics"] i:nth-child(2) { inset-inline-start: 36%; top: 34%; width: 20%; height: 28%; border-radius: 6px; }
.lvx[data-family="metrics"] i:nth-child(3) { inset-inline-start: 12%; top: 34%; width: 20%; height: 28%; border-radius: 6px; }
.lvx[data-family="ring"] i:nth-child(1) { inset-inline: 38% 38%; top: 12%; aspect-ratio: 1; border-radius: 50%; background: transparent; border: 4px solid var(--c); opacity: .7; }
.lvx[data-family="ring"] i:nth-child(2) { inset-inline: 32% 32%; top: 70%; height: 9%; opacity: .85; }
.lvx[data-family="ring"] i:nth-child(3) { display: none; }
.lvx[data-family="quote"] i:nth-child(1) { inset-inline: 44% 44%; top: 14%; height: 12%; opacity: .35; }
.lvx[data-family="quote"] i:nth-child(2) { inset-inline: 18% 18%; top: 40%; height: 10%; opacity: .85; }
.lvx[data-family="quote"] i:nth-child(3) { inset-inline: 28% 28%; top: 58%; height: 10%; opacity: .6; }
.lvx[data-family="list"] i:nth-child(1) { inset-inline: 30% 30%; top: 22%; height: 10%; opacity: .85; }
.lvx[data-family="list"] i:nth-child(2) { inset-inline: 30% 30%; top: 44%; height: 10%; opacity: .6; }
.lvx[data-family="list"] i:nth-child(3) { inset-inline: 30% 30%; top: 66%; height: 10%; opacity: .4; }
.lvx[data-family="countdown"] i:nth-child(1) { inset-inline: 30% 30%; top: 16%; height: 11%; opacity: .85; }
.lvx[data-family="countdown"] i:nth-child(2) { inset-inline-start: 30%; top: 50%; width: 12%; height: 28%; border-radius: 5px; }
.lvx[data-family="countdown"] i:nth-child(3) { inset-inline-start: 46%; top: 50%; width: 12%; height: 28%; border-radius: 5px; }

.vis { display: flex; flex-direction: column; gap: var(--space-4); }
[data-bg-show][hidden] { display: none; }

/* مكتبة الخلفيات */
.bg-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: var(--space-4); }
.bg-card { border: 1px solid var(--color-hairline); border-radius: var(--radius-card); overflow: hidden; background: var(--color-surface); }
.bg-card.is-archived { opacity: .6; }
.bg-card__thumb { position: relative; aspect-ratio: 16 / 9; background: var(--color-fill); cursor: crosshair; }
.bg-card__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bg-card__dot { position: absolute; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; border: 2px solid var(--color-surface); background: color-mix(in srgb, var(--color-primary) 60%, transparent); box-shadow: 0 0 0 1px var(--color-primary-dark); pointer-events: none; }
.bg-card__dot::before, .bg-card__dot::after { content: ''; position: absolute; background: var(--color-surface); }
.bg-card__dot::before { inset-inline: -9px; top: 50%; height: 1px; }
.bg-card__dot::after { inset-block: -9px; left: 50%; width: 1px; }
.bg-card__body { padding: var(--space-3); display: flex; flex-direction: column; gap: 6px; }
.bg-card__name { margin: 0; font-weight: 700; }
.qw { display: flex; gap: 6px; align-items: flex-start; margin: 0; font-size: .82rem; color: var(--color-warning-strong); background: var(--color-warning-soft); border-radius: 8px; padding: 6px 8px; }
.qw svg { flex-shrink: 0; margin-top: 2px; }

/* المعاينة: إطار بأبعاد الشاشة الحقيقية يُصغَّر بالتحويل (JS) */
.ds-sim { position: relative; width: 100%; max-width: 64rem; border: 1px solid var(--color-hairline); border-radius: var(--radius-card); overflow: hidden; background: var(--color-surface-secondary); }
.ds-sim__frame { position: absolute; top: 0; left: 0; border: 0; transform-origin: top left; width: 100%; height: 100%; }
.ds-sim[data-scaled] .ds-sim__frame { width: calc(var(--sim-w) * 1px); height: calc(var(--sim-h) * 1px); transform: scale(var(--sim-k)); }

/* الجدول الزمني */
.timeline { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.timeline__row { display: flex; gap: var(--space-3); align-items: baseline; padding: 10px 0; border-bottom: 1px solid var(--color-divider-solid); }
.timeline__row.is-current { background: var(--color-sage-soft); border-radius: 8px; padding-inline: 10px; }
.timeline__time { min-width: 3.2rem; font-weight: 700; color: var(--color-primary-dark); }
.timeline__body { display: flex; flex-direction: column; }
.timeline__title { font-weight: 600; }

/* المقدّم (جوال أولًا) */
.present { display: flex; flex-direction: column; gap: var(--space-4); max-width: 34rem; margin-inline: auto; }
.present__now { padding: var(--space-4); border-radius: var(--radius-card); background: var(--color-sage-soft); border: 1px solid var(--color-sage-line); text-align: center; }
.present__badge { display: inline-block; font-size: .8rem; font-weight: 700; color: var(--color-primary-dark); }
.present__title { margin: 6px 0 2px; font-size: 1.4rem; font-weight: 700; }
.present__grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); }
.present__big { width: 100%; min-height: 3.6rem; font-size: 1.1rem; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.present__select { min-height: 3.2rem; font-size: 1rem; }

/* أدوات المعاينة (تظهر بالـJS فقط) */
.ds-prev { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; margin-top: var(--space-3); }
.ds-prev[hidden] { display: none; }

/* ==================================================================================================
 * إدارة «شاشة الإنجاز» — مركز تحكم بصري (docs/recognition-display-admin.md). أسطح مصمتة من tokens، بلا تدرّج.
 * بنفسجي/عنبري/أزرق هادئ عبر data-accent فقط؛ لا ألوان ثابتة.
 * ================================================================================================== */
.dx-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-3); }
.dx-head__title { margin: 0; font-size: 1.5rem; font-weight: 700; }
.dx-head__sub { margin: 4px 0 0; color: var(--color-text-muted); }
.dx-head__actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }

/* القسم الرئيسي: شريط قابل للتمرير أفقيًا في الجوال */
.dx-nav { display: flex; gap: 4px; padding: 4px; margin-bottom: var(--space-2); background: var(--color-surface); border: 1px solid var(--color-hairline); border-radius: var(--radius-card); overflow-x: auto; scrollbar-width: none; }
.dx-nav::-webkit-scrollbar { display: none; }
.dx-nav__item { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 var(--space-4); border-radius: 8px; color: var(--color-text-muted); font-weight: 600; text-decoration: none; white-space: nowrap; }
.dx-nav__item:hover { background: var(--color-fill); color: var(--color-text); }
.dx-nav__item.is-active { background: var(--accent-groups-soft); color: var(--color-text); }
.dx-nav__badge { min-width: 1.4rem; padding: 0 6px; border-radius: 99px; background: var(--color-danger); color: var(--color-surface); font-size: .78rem; text-align: center; }
.dx-subnav { margin-top: 0; margin-bottom: var(--space-3); }

/* تركيب سطح المكتب: محتوى تشغيلي + معاينة لاصقة */
.dx-layout { display: grid; gap: var(--space-4); align-items: start; }
.dx-layout__side { display: flex; flex-direction: column; gap: var(--space-3); }
@media (min-width: 1024px) {
  .dx-layout { grid-template-columns: minmax(0, 1.85fr) minmax(0, 1fr); }
  .dx-layout__side--sticky { position: sticky; top: var(--space-4); }
}

/* شريط الحالة */
.dx-status { display: grid; grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr)); gap: 1px; margin-bottom: var(--space-4); background: var(--color-hairline); border: 1px solid var(--color-hairline); border-radius: var(--radius-card); overflow: hidden; }
.dx-status__cell { display: flex; flex-direction: column; gap: 2px; padding: var(--space-3) var(--space-4); background: var(--color-surface); }
.dx-status__label { font-size: .8rem; color: var(--color-text-muted); }
.dx-status__value { display: flex; align-items: center; gap: 8px; font-weight: 700; }
.dx-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--color-text-faint); flex: 0 0 auto; }
.dx-dot--ok { background: var(--color-success); }
.dx-dot--warn { background: var(--color-warning); }
.dx-dot--danger { background: var(--color-danger); }

.dx-panel { background: var(--color-surface); border: 1px solid var(--color-hairline); border-radius: var(--radius-card); padding: var(--space-4); }
.dx-panel__title { margin: 0 0 var(--space-3); font-size: 1.05rem; font-weight: 700; }
.dx-sec { margin-bottom: var(--space-5); }
.dx-sec__head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-3); }
.dx-sec__title { margin: 0; font-size: 1.1rem; font-weight: 700; }
.dx-sec__hint { margin: 2px 0 0; color: var(--color-text-muted); font-size: .9rem; }

/* التالي: تسلسل الدورة */
.dx-queue { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.dx-queue__row { display: grid; grid-template-columns: 3.4rem minmax(0, 1fr) auto; gap: var(--space-3); align-items: center; padding: 10px 0; border-bottom: 1px solid var(--color-divider-solid); }
.dx-queue__row:last-child { border-bottom: 0; }
.dx-queue__time { font-weight: 700; color: var(--color-text-muted); }
.dx-queue__title { display: block; font-weight: 600; overflow-wrap: anywhere; }
.dx-queue__meta { display: block; font-size: .85rem; color: var(--color-text-muted); }

/* يحتاج انتباهك */
.dx-attn { display: flex; flex-direction: column; gap: var(--space-2); }
.dx-attn__item { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); border-radius: var(--radius-card); text-decoration: none; color: inherit; background: var(--color-warning-soft); }
.dx-attn__item[data-tone="danger"] { background: var(--color-danger-soft); }
.dx-attn__item[data-tone="new"] { background: var(--accent-groups-soft); }
.dx-attn__item[data-tone="info"] { background: var(--accent-students-soft); }
.dx-attn__body { flex: 1; min-width: 0; }
.dx-attn__title { display: block; font-weight: 700; }
.dx-attn__text { display: block; font-size: .88rem; color: var(--color-text-muted); }
.dx-attn__count { font-size: 1.3rem; font-weight: 700; }
.dx-allgood { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); border-radius: var(--radius-card); background: var(--color-success-soft); color: var(--color-success-strong); font-weight: 600; }

/* إجراءات سريعة */
.dx-quick { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: var(--space-3); }
.dx-quick__item { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: var(--space-4); border-radius: var(--radius-card); text-decoration: none; color: var(--color-text); font-weight: 700; background: var(--accent-settings-soft); }
.dx-quick__item:nth-child(1) { background: var(--accent-achievements-soft); }
.dx-quick__item:nth-child(2) { background: var(--accent-groups-soft); }
.dx-quick__item:nth-child(3) { background: var(--accent-students-soft); }
.dx-quick__item:nth-child(4) { background: var(--accent-attendance-soft); }

/* بلاطات الفئات («ماذا تريد أن يظهر؟») */
.dx-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: var(--space-3); }
.dx-tile { position: relative; display: flex; flex-direction: column; gap: 6px; min-height: 8rem; padding: var(--space-4); border-radius: var(--radius-card); background: var(--color-surface); border: 1px solid var(--color-hairline); cursor: pointer; }
.dx-tile.is-readonly { cursor: default; }
.dx-tile__icon { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: var(--accent-settings-soft); color: var(--accent-settings); }
.dx-tile[data-accent="achievements"] .dx-tile__icon { background: var(--accent-achievements-soft); color: var(--accent-achievements); }
.dx-tile[data-accent="groups"] .dx-tile__icon { background: var(--accent-groups-soft); color: var(--accent-groups); }
.dx-tile[data-accent="students"] .dx-tile__icon { background: var(--accent-students-soft); color: var(--accent-students); }
.dx-tile[data-accent="habits"] .dx-tile__icon { background: var(--accent-habits-soft); color: var(--accent-habits); }
.dx-tile[data-accent="registration"] .dx-tile__icon { background: var(--accent-registration-soft); color: var(--accent-registration); }
.dx-tile__name { font-weight: 700; }
.dx-tile__desc { font-size: .88rem; color: var(--color-text-muted); }
.dx-tile__foot { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); font-size: .85rem; color: var(--color-text-muted); }
.dx-tile:has(input:checked) { border-color: var(--color-primary); }
.dx-tile:has(input:not(:checked)) { background: var(--color-surface-secondary); }
.dx-tile:has(input:not(:checked)) .dx-tile__name { color: var(--color-text-muted); }
.dx-tile .switch { flex: 0 0 auto; }
.dx-tile:has(input:focus-visible) { outline: 2px solid var(--color-primary); outline-offset: 2px; }

/* المحتوى اليدوي كبطاقات تحريرية */
.dx-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: var(--space-3); }
.dx-card { display: flex; flex-direction: column; gap: 8px; padding: var(--space-4); border-radius: var(--radius-card); background: var(--color-surface); border: 1px solid var(--color-hairline); text-decoration: none; color: inherit; }
.dx-card:hover { border-color: var(--color-primary); }
.dx-card.is-muted { background: var(--color-surface-secondary); }
.dx-card__top { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); }
.dx-card__type { font-size: .82rem; font-weight: 600; color: var(--color-text-muted); }
.dx-card__title { margin: 0; font-size: 1.05rem; font-weight: 700; overflow-wrap: anywhere; }
.dx-card__meta { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: .85rem; color: var(--color-text-muted); }

/* الجدولة: فترات اليوم */
.dx-dayparts { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: var(--space-3); }
.dx-daypart { display: flex; flex-direction: column; gap: 4px; padding: var(--space-4); border-radius: var(--radius-card); background: var(--accent-achievements-soft); }
.dx-daypart:nth-child(2) { background: var(--accent-students-soft); }
.dx-daypart:nth-child(3) { background: var(--accent-groups-soft); }
.dx-daypart:nth-child(4) { background: var(--accent-attendance-soft); }
.dx-daypart.is-now { box-shadow: inset 0 0 0 2px var(--color-primary); }
.dx-daypart__name { font-weight: 700; }
.dx-daypart__time { font-size: .9rem; color: var(--color-text-muted); }
.dx-daypart__list { margin: 6px 0 0; padding: 0; list-style: none; font-size: .88rem; }
.dx-mode { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-4); border-radius: var(--radius-card); background: var(--accent-settings-soft); }
.dx-mode.is-on { background: var(--accent-achievements-soft); }
.dx-mode__title { margin: 0; font-weight: 700; }
.dx-mode__text { margin: 2px 0 0; font-size: .9rem; color: var(--color-text-muted); }

/* الخصوصية */
.dx-privacy { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: var(--space-3); }
.dx-privacy__cell { display: flex; flex-direction: column; gap: 2px; padding: var(--space-4); border-radius: var(--radius-card); background: var(--accent-settings-soft); }
.dx-privacy__cell:nth-child(1) { background: var(--accent-students-soft); }
.dx-privacy__cell:nth-child(2) { background: var(--accent-habits-soft); }
.dx-privacy__num { font-size: 1.8rem; font-weight: 700; line-height: 1.1; }
.dx-privacy__label { font-size: .9rem; color: var(--color-text-muted); }

/* الاتصال والإعدادات */
.dx-conn { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); }
.dx-power { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-4); border-radius: var(--radius-card); background: var(--accent-habits-soft); }
.dx-power.is-off { background: var(--accent-settings-soft); }
.dx-power__title { margin: 0; font-size: 1.1rem; font-weight: 700; }
.dx-power__text { margin: 2px 0 0; color: var(--color-text-muted); font-size: .9rem; }
.dx-link { display: flex; gap: var(--space-2); align-items: stretch; }
.dx-link .field__input { flex: 1; min-width: 0; }

/* التصميم: مستويات الوراثة */
.dx-inherit { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: var(--space-3); }
.dx-inherit__step { padding: var(--space-3) var(--space-4); border-radius: var(--radius-card); background: var(--accent-groups-soft); }
.dx-inherit__step:nth-child(2) { background: var(--accent-students-soft); }
.dx-inherit__step:nth-child(3) { background: var(--accent-achievements-soft); }
.dx-inherit__name { display: block; font-weight: 700; }
.dx-inherit__text { display: block; font-size: .85rem; color: var(--color-text-muted); }

@media (max-width: 599px) {
  .dx-head__title { font-size: 1.3rem; }
  .dx-tiles, .dx-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dx-tile { min-height: 7rem; padding: var(--space-3); }
  .dx-queue__row { grid-template-columns: 3rem minmax(0, 1fr); }
  .dx-queue__row > :last-child { display: none; }
  .dx-link { flex-direction: column; }
}
@media (max-width: 379px) { .dx-tiles, .dx-cards { grid-template-columns: 1fr; } }
.dx-status__cell:last-child:nth-child(odd) { grid-column: 1 / -1; }
@media (min-width: 900px) { .dx-status__cell:last-child:nth-child(odd) { grid-column: auto; } }