/* منصّة الدورات والورش — نظام التصميم.
   القيم مأخوذة حرفياً عن «ADH Teal» في public_html/assets/css/adh-theme.css (مصدر الحقيقة
   للهوية)، ومنسوخة هنا لا مُشارَة: النطاق الفرعي مستقلّ، وربطه بورقة على النطاق الأب يجعل
   كل صفحة رهينة توفّر نطاق آخر. وأي تعديل على الهوية يُنقل هنا صراحةً.
   قاعدة ملزِمة في هذا الحساب: بلا إيموجي في العناوين والأزرار — أيقونات SVG حقيقية. */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&display=swap');

:root {
  --t-teal:        #108686;
  --t-teal-dark:   #0C6E6E;
  --t-teal-wash:   #EAF5F5;
  --t-bright:      #08B6B4;
  --t-on-bright:   #04262B;
  --t-deep:        #0E3A42;
  --t-bg:          #F7FAFA;
  --t-white:       #FFFFFF;
  --t-border:      #E4EDED;
  --t-text:        #14333A;
  --t-muted:       #5B7379;
  --t-success:     #1E8E5A;
  --t-success-bg:  #E7F6EE;
  --t-danger:      #C7402B;
  --t-danger-bg:   #FBEAE7;
  --t-warn:        #B9790A;
  --t-warn-bg:     #FCF1DC;
  --t-info:        #2563A8;
  --t-info-bg:     #E8F1FA;
  --t-radius:      12px;
  --t-radius-sm:   8px;
  --t-shadow:      0 2px 10px rgba(14,58,66,.06);
  --t-shadow-lg:   0 8px 30px rgba(14,58,66,.10);
}

* { box-sizing: border-box; }
html, body {
  margin: 0; padding: 0;
  background: var(--t-bg);
  color: var(--t-text);
  font-family: 'Cairo', Tahoma, Arial, sans-serif;
  direction: rtl;
  text-align: right;
  /* شبكة أمان: صفّ واحد غير مُغلَّف (شريط تنقّل، جدول) لا يجوز أن يوسّع الصفحة كلها.
     عطلٌ حقيقيّ في منصّة العضوية: شريط التنقّل جعل الصفحة تُرسم بضعف عرض الشاشة. */
  overflow-x: hidden;
  max-width: 100%;
}
body { line-height: 1.7; font-size: 15px; }
h1,h2,h3,h4 { margin: 0 0 12px; font-weight: 700; line-height: 1.4; }
h1 { font-size: 26px; } h2 { font-size: 21px; } h3 { font-size: 17px; }
a { color: var(--t-teal); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; }
p { margin: 0 0 12px; }

.container { max-width: 1100px; margin: 0 auto; padding: 0 20px; }
.container-narrow { max-width: 620px; margin: 0 auto; padding: 0 20px; }

/* ── الترويسة ─────────────────────────────────────────────────────────────── */
.t-topbar { background: var(--t-white); border-bottom: 1px solid var(--t-border); padding: 13px 0; }
.t-topbar .container { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.t-brand { display: flex; align-items: center; gap: 10px; min-width: 0; }
.t-brand-mark {
  width: 36px; height: 36px; flex: 0 0 36px; border-radius: 10px;
  background: linear-gradient(135deg, var(--t-deep), var(--t-teal));
  display: grid; place-items: center;
}
.t-brand-text { min-width: 0; }
.t-brand-title { font-weight: 700; font-size: 15.5px; line-height: 1.3; }
.t-brand-sub { font-size: 12px; color: var(--t-muted); line-height: 1.3; }
.t-nav { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* ── الأزرار ──────────────────────────────────────────────────────────────── */
.t-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  padding: 10px 18px; border-radius: var(--t-radius-sm); border: 1px solid transparent;
  font-family: inherit; font-weight: 700; font-size: 14.5px; cursor: pointer;
  background: var(--t-teal); color: #fff; transition: background .15s, box-shadow .15s;
  line-height: 1.4; text-decoration: none;
}
.t-btn:hover { background: var(--t-teal-dark); text-decoration: none; }
.t-btn-cta { background: var(--t-bright); color: var(--t-on-bright); }
.t-btn-cta:hover { background: #06A2A0; }
.t-btn-ghost { background: transparent; color: var(--t-teal); border-color: var(--t-border); }
.t-btn-ghost:hover { background: var(--t-teal-wash); }
.t-btn-danger { background: var(--t-danger); }
.t-btn-danger:hover { background: #A93422; }
.t-btn-sm { padding: 7px 13px; font-size: 13.5px; }
.t-btn:disabled { opacity: .55; cursor: not-allowed; }

/* ── البطاقات ─────────────────────────────────────────────────────────────── */
.t-card {
  background: var(--t-white); border: 1px solid var(--t-border);
  border-radius: var(--t-radius); box-shadow: var(--t-shadow); padding: 22px;
}
.t-card + .t-card { margin-top: 16px; }
.t-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.t-card-head h2, .t-card-head h3 { margin: 0; }

/* ── الشارات ──────────────────────────────────────────────────────────────── */
.t-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 600;
  background: var(--t-teal-wash); color: var(--t-teal-dark);
}
.t-badge-success { background: var(--t-success-bg); color: var(--t-success); }
.t-badge-danger  { background: var(--t-danger-bg);  color: var(--t-danger); }
.t-badge-warn    { background: var(--t-warn-bg);    color: var(--t-warn); }
.t-badge-info    { background: var(--t-info-bg);    color: var(--t-info); }
.t-badge-muted   { background: #F0F4F4;             color: var(--t-muted); }
/* شارة رقمية منسَّقة — بديل الإيموجي في العدّادات */
.t-count {
  display: inline-grid; place-items: center; min-width: 24px; height: 24px; padding: 0 7px;
  border-radius: 999px; background: var(--t-deep); color: #fff; font-size: 12.5px; font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* ── الحقول ───────────────────────────────────────────────────────────────── */
.t-field { margin-bottom: 15px; }
.t-label { display: block; font-weight: 600; font-size: 14px; margin-bottom: 6px; }
.t-hint { font-size: 12.5px; color: var(--t-muted); margin-top: 5px; }
.t-input, .t-select, .t-textarea {
  width: 100%; padding: 11px 13px; border: 1px solid var(--t-border);
  border-radius: var(--t-radius-sm); font-family: inherit;
  /* 16px إلزاماً: أي أقلّ يجعل iOS يُكبّر الصفحة تلقائياً عند التركيز — عيبٌ مقيس في
     مشاريع أخرى بهذا الحساب، ٥٣ حقلاً في أحدها. */
  font-size: 16px;
  background: var(--t-white); color: var(--t-text);
}
.t-input:focus, .t-select:focus, .t-textarea:focus {
  outline: none; border-color: var(--t-teal); box-shadow: 0 0 0 3px rgba(16,134,134,.12);
}
.t-textarea { min-height: 96px; resize: vertical; }
.t-input.is-error, .t-select.is-error { border-color: var(--t-danger); }
.t-error { color: var(--t-danger); font-size: 12.5px; margin-top: 5px; }
.t-row { display: flex; gap: 14px; flex-wrap: wrap; }
.t-row > * { flex: 1 1 200px; min-width: 0; }

/* ── التنبيهات ────────────────────────────────────────────────────────────── */
.t-alert { padding: 13px 16px; border-radius: var(--t-radius-sm); font-size: 14px; margin-bottom: 16px; border: 1px solid transparent; }
.t-alert-success { background: var(--t-success-bg); color: #12603C; border-color: #BFE6D2; }
.t-alert-danger  { background: var(--t-danger-bg);  color: #8E2E1E; border-color: #F0C9C1; }
.t-alert-warn    { background: var(--t-warn-bg);    color: #7A5006; border-color: #EEDCB4; }
.t-alert-info    { background: var(--t-info-bg);    color: #1B4A7E; border-color: #C6DCF1; }

/* ── الجداول ──────────────────────────────────────────────────────────────── */
/* كل جدول يجب أن يُمرَّر داخل حاويته لا أن يوسّع الصفحة */
.t-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.t-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.t-table th, .t-table td { padding: 11px 12px; text-align: right; border-bottom: 1px solid var(--t-border); }
.t-table th { background: var(--t-teal-wash); font-weight: 700; font-size: 13.5px; white-space: nowrap; }
.t-table tbody tr:hover { background: #FAFCFC; }

/* ── حالات فارغة ومحمّلة ──────────────────────────────────────────────────── */
.t-empty { text-align: center; padding: 40px 20px; color: var(--t-muted); }
.t-empty-title { font-weight: 700; color: var(--t-text); margin-bottom: 6px; }
.t-skeleton { height: 14px; border-radius: 6px; background: linear-gradient(90deg,#EEF3F3,#F7FAFA,#EEF3F3); background-size: 200% 100%; animation: t-shimmer 1.2s infinite; }
@keyframes t-shimmer { 0% { background-position: 200% 0 } 100% { background-position: -200% 0 } }

/* ── مساعدات ──────────────────────────────────────────────────────────────── */
.t-muted { color: var(--t-muted); }
.t-small { font-size: 13px; }
.t-mono  { font-variant-numeric: tabular-nums; }
.t-ltr   { direction: ltr; text-align: left; unicode-bidi: isolate; }
.t-nowrap { white-space: nowrap; }
.t-stack > * + * { margin-top: 10px; }
.t-center { text-align: center; }
.t-hidden { display: none !important; }
.t-divider { height: 1px; background: var(--t-border); border: 0; margin: 18px 0; }

/* ── التذييل ──────────────────────────────────────────────────────────────── */
.t-footer { margin-top: 44px; padding: 22px 0; border-top: 1px solid var(--t-border); color: var(--t-muted); font-size: 13px; }
.t-footer .container { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }

/* ── الجوال ───────────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
  body { font-size: 14.5px; }
  h1 { font-size: 22px; } h2 { font-size: 19px; }
  .t-card { padding: 17px; }
  .container, .container-narrow { padding: 0 15px; }
  .t-topbar .container { gap: 8px; }
  .t-brand-sub { display: none; }
}