/* ==========================================================
   أكاديمية 32 - نظام جمع المحتوى التدريبي
   نظام تصميم: كُحلي داكن + ذهبي + بنفسجي (مستوحى من الشعار)
   ========================================================== */
:root{
  --navy-950:#080b16;
  --navy-900:#0d1224;
  --navy-800:#131a33;
  --navy-700:#1b2544;
  --navy-600:#28356090;
  --gold:#c8a96e;
  --gold-light:#e2c893;
  --violet:#6a3df5;
  --violet-light:#8f6dfb;
  --bg-page:#f5f6fa;
  --bg-card:#ffffff;
  --ink-900:#141726;
  --ink-600:#5b6072;
  --ink-400:#9296a6;
  --line:#e6e8f0;
  --success:#1e9e6a;
  --warning:#c9821f;
  --danger:#d6455a;
  --info:#3773c9;
  --radius-lg:18px;
  --radius-md:12px;
  --radius-sm:8px;
  --shadow-card:0 2px 14px rgba(20,23,38,.06);
  --shadow-pop:0 12px 40px rgba(10,10,25,.18);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Tajawal', 'Segoe UI', Tahoma, Arial, sans-serif;
  background:var(--bg-page);
  color:var(--ink-900);
  direction:rtl;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3,h4{margin:0 0 8px;font-weight:800;letter-spacing:.2px}
p{margin:0 0 12px}
button{font-family:inherit}

::selection{background:var(--gold-light);color:var(--navy-950)}

/* ---------- Utility ---------- */
.container{max-width:1180px;margin:0 auto;padding:0 24px}
.text-muted{color:var(--ink-600)}
.small{font-size:13px}
.mt-0{margin-top:0}.mb-0{margin-bottom:0}
.flex{display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}
.gap-8{gap:8px}.gap-12{gap:12px}.gap-16{gap:16px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:860px){.grid-2,.grid-3{grid-template-columns:1fr}}

/* ---------- Badges ---------- */
.badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 12px;border-radius:99px;font-size:12.5px;font-weight:700;
  white-space:nowrap;
}
.badge-secondary{background:#eef0f6;color:var(--ink-600)}
.badge-warning{background:#fbeed9;color:var(--warning)}
.badge-danger{background:#fbe1e5;color:var(--danger)}
.badge-info{background:#e3edfa;color:var(--info)}
.badge-success{background:#dff5ea;color:var(--success)}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 22px;border-radius:99px;border:none;cursor:pointer;
  font-weight:700;font-size:14.5px;transition:.18s transform,.18s box-shadow,.18s background;
  line-height:1;
}
.btn:active{transform:scale(.97)}
.btn-primary{background:linear-gradient(135deg,var(--violet),var(--violet-light));color:#fff;box-shadow:0 8px 22px rgba(106,61,245,.28)}
.btn-primary:hover{box-shadow:0 10px 28px rgba(106,61,245,.4)}
.btn-gold{background:linear-gradient(135deg,var(--gold),var(--gold-light));color:var(--navy-950);box-shadow:0 8px 20px rgba(200,169,110,.35)}
.btn-outline{background:transparent;border:1.5px solid var(--line);color:var(--ink-900)}
.btn-outline:hover{border-color:var(--violet);color:var(--violet)}
.btn-ghost{background:transparent;color:var(--ink-600)}
.btn-danger{background:#fbe1e5;color:var(--danger)}
.btn-danger:hover{background:var(--danger);color:#fff}
.btn-success{background:#dff5ea;color:var(--success)}
.btn-success:hover{background:var(--success);color:#fff}
.btn-sm{padding:7px 14px;font-size:13px}
.btn-block{width:100%}
.btn:disabled{opacity:.5;cursor:not-allowed}

/* ---------- Cards ---------- */
.card{
  background:var(--bg-card);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);padding:26px;border:1px solid var(--line);
}
.card-title{font-size:16px;font-weight:800;margin-bottom:16px;display:flex;align-items:center;gap:8px}
.card-title i,.sidebar-nav a i,.btn i,.stat-card .icon i,.quick-stat .qs-icon i,.empty-state .emoji i{color:inherit}
.card-title i{color:var(--violet)}

/* ---------- Forms ---------- */
.form-group{margin-bottom:18px}
label{display:block;font-weight:700;font-size:14px;margin-bottom:7px;color:var(--ink-900)}
label .req{color:var(--danger)}
.hint{font-size:12.5px;color:var(--ink-400);margin-top:5px}
input[type=text],input[type=email],input[type=password],input[type=number],
input[type=date],input[type=datetime-local],input[type=tel],input[type=url],
select,textarea{
  width:100%;padding:12px 14px;border-radius:var(--radius-sm);
  border:1.5px solid var(--line);background:#fbfbfd;font-size:14.5px;
  font-family:inherit;color:var(--ink-900);transition:.15s border-color,.15s background;
}
input:focus,select:focus,textarea:focus{
  outline:none;border-color:var(--violet);background:#fff;
  box-shadow:0 0 0 4px rgba(106,61,245,.12);
}
textarea{resize:vertical;min-height:110px}
.otp-input{
  text-align:center;font-size:30px;letter-spacing:14px;font-weight:800;
  font-family:'Courier New',monospace;padding:16px;
}
.checkbox-row{display:flex;align-items:center;gap:10px}
.checkbox-row input{width:auto}
fieldset{border:1.5px dashed var(--line);border-radius:var(--radius-md);padding:18px;margin-bottom:18px}
legend{padding:0 8px;font-weight:800;color:var(--violet)}
.word-counter{font-size:12px;margin-top:5px}
.word-counter.ok{color:var(--success)}
.word-counter.bad{color:var(--danger)}

/* ---------- Alerts / Flash ---------- */
.alert{padding:14px 18px;border-radius:var(--radius-md);margin-bottom:16px;font-size:14.5px;font-weight:600}
.alert-success{background:#dff5ea;color:var(--success)}
.alert-danger{background:#fbe1e5;color:var(--danger)}
.alert-warning{background:#fbeed9;color:var(--warning)}
.alert-info{background:#e3edfa;color:var(--info)}

/* ---------- Table ---------- */
.table-wrap{overflow-x:auto;border-radius:var(--radius-md);border:1px solid var(--line)}
table{width:100%;border-collapse:collapse;background:#fff;font-size:14px}
th,td{padding:13px 16px;text-align:right;border-bottom:1px solid var(--line);white-space:nowrap}
th{background:#fafbfd;color:var(--ink-600);font-weight:700;font-size:12.5px}
tr:last-child td{border-bottom:none}
tbody tr:hover{background:#faf9ff}

/* ==========================================================
   شاشات تسجيل الدخول (login / verify)
   ========================================================== */
.auth-page{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:
    radial-gradient(circle at 15% 10%,rgba(106,61,245,.10),transparent 45%),
    radial-gradient(circle at 85% 90%,rgba(200,169,110,.14),transparent 45%),
    var(--bg-page);
  padding:24px;
}
.auth-card{
  width:100%;max-width:430px;background:var(--bg-card);
  border:1px solid var(--line);border-radius:24px;padding:44px 38px;
  box-shadow:var(--shadow-pop);color:var(--ink-900);
}
.auth-logo{display:flex;flex-direction:column;align-items:center;margin-bottom:10px}
.auth-logo img{height:64px}
.auth-logo .subtitle{color:var(--ink-400);font-size:13px;letter-spacing:1px}
.auth-card h1{font-size:20px;text-align:center;color:var(--ink-900);margin-bottom:6px}
.auth-card .lead{text-align:center;color:var(--ink-600);font-size:13.5px;margin-bottom:28px}
.auth-card label{color:var(--ink-900)}
.auth-card input{
  background:#fbfbfd;border-color:var(--line);color:var(--ink-900);
}
.auth-card input:focus{border-color:var(--violet);box-shadow:0 0 0 4px rgba(106,61,245,.12)}
.auth-card .btn-primary{width:100%;padding:13px;margin-top:6px;font-size:15px}
.auth-foot{text-align:center;margin-top:20px;font-size:13px;color:var(--ink-400)}
.auth-foot a{color:var(--violet);font-weight:700}
.auth-switch{
  position:fixed;top:20px;left:20px;font-size:13px;color:var(--ink-600);
  background:#fff;padding:8px 16px;border-radius:99px;border:1px solid var(--line);box-shadow:var(--shadow-card);
}
.auth-switch a{color:var(--violet);font-weight:700}

/* ==========================================================
   لوحة التحكم (Admin / Trainer shell) - نمط فاتح
   ========================================================== */
.app-shell{display:flex;min-height:100vh}
.sidebar{
  width:264px;flex-shrink:0;background:#ffffff;color:var(--ink-900);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;
  border-inline-end:1px solid var(--line);
}
.sidebar-brand{
  display:flex;align-items:center;gap:12px;padding:22px 22px 18px;
  border-bottom:1px solid var(--line);
}
.sidebar-brand.logo-only{justify-content:center;padding:26px 22px}
.sidebar-brand.logo-only img{height:50px}
.sidebar-brand img{height:38px}
.sidebar-brand .name{font-weight:800;color:var(--ink-900);font-size:15px}
.sidebar-brand .role{font-size:11.5px;color:var(--violet)}
.sidebar-nav{flex:1;padding:16px 12px;overflow-y:auto}
.sidebar-nav .group-label{font-size:11px;color:var(--ink-400);text-transform:uppercase;letter-spacing:1px;padding:14px 12px 6px}
.sidebar-nav a{
  display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:12px;
  font-size:14px;color:var(--ink-600);margin-bottom:3px;font-weight:600;transition:.15s;
}
.sidebar-nav a:hover{background:#f4f2ff;color:var(--violet)}
.sidebar-nav a.active{background:linear-gradient(135deg,var(--violet),var(--violet-light));color:#fff}
.sidebar-nav .icon{width:20px;text-align:center;font-size:16px}
.sidebar-foot{padding:16px;border-top:1px solid var(--line)}
.sidebar-foot .user{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.sidebar-foot .avatar{
  width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--gold),var(--violet));
  display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;font-size:14px;
  flex-shrink:0;
}
.sidebar-foot .avatar.avatar-photo{object-fit:cover;background:none}
.sidebar-foot .uname{font-size:13.5px;font-weight:700;color:var(--ink-900)}
.sidebar-foot .urole{font-size:11.5px;color:var(--ink-400)}

.main{flex:1;min-width:0}
.topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 30px;background:#fff;border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:5;
}
.topbar h1{font-size:19px;margin:0}
.bell-btn{
  position:relative;font-size:19px;color:var(--ink-600);text-decoration:none;
  width:38px;height:38px;display:flex;align-items:center;justify-content:center;
  border-radius:10px;transition:.15s background;
}
.bell-btn:hover{background:#f4f2ff;color:var(--violet)}
.bell-badge{
  position:absolute;top:2px;left:2px;background:var(--danger);color:#fff;
  font-size:10px;font-weight:800;min-width:16px;height:16px;border-radius:99px;
  display:flex;align-items:center;justify-content:center;padding:0 3px;
}
.content{padding:28px 30px 60px}

.mobile-toggle{display:none;background:none;border:none;font-size:22px;cursor:pointer;color:var(--ink-900)}
@media(max-width:960px){
  .sidebar{position:fixed;inset-inline-start:0;top:0;transform:translateX(105%);z-index:50;transition:.25s;box-shadow:var(--shadow-pop)}
  html[dir=rtl] .sidebar.open{transform:translateX(0)}
  .mobile-toggle{display:block}
  .content{padding:20px 16px 50px}
  .topbar{padding:14px 16px}
}

/* Stat cards */
.stat-card{
  background:var(--bg-card);border-radius:var(--radius-lg);padding:22px;border:1px solid var(--line);
  display:flex;align-items:center;gap:16px;box-shadow:var(--shadow-card);
}
.stat-card .icon{
  width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;
  font-size:22px;color:#fff;flex-shrink:0;
}
.stat-card .num{font-size:26px;font-weight:800;line-height:1}
.stat-card .label{font-size:13px;color:var(--ink-600);margin-top:4px}

/* شريط الإشعارات السريعة الثابت أعلى فلتر البرامج */
.quick-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-bottom:22px}
.quick-stat{
  position:relative;overflow:hidden;
  display:flex;align-items:center;gap:14px;
  background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:16px 18px;text-decoration:none;color:var(--ink-900);
  box-shadow:var(--shadow-card);transition:.18s transform,.18s box-shadow,.18s border-color;
}
.quick-stat::before{
  content:'';position:absolute;inset-inline-start:0;top:0;bottom:0;width:4px;
  background:var(--qs-color,var(--violet));
}
.quick-stat:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(20,23,38,.1);border-color:var(--qs-color,var(--violet))}
.quick-stat.active{border-color:var(--qs-color,var(--violet));background:linear-gradient(180deg,#fff,#faf9ff)}
.quick-stat .qs-icon{
  flex-shrink:0;width:44px;height:44px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;font-size:18px;
  background:color-mix(in srgb, var(--qs-color,var(--violet)) 14%, white);color:var(--qs-color,var(--violet));
}
.quick-stat .qs-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.quick-stat .qs-num{font-size:24px;font-weight:800;line-height:1;color:var(--ink-900)}
.quick-stat .qs-label{font-size:12px;color:var(--ink-600);font-weight:600;white-space:normal}
.quick-stat.qs-warning{--qs-color:var(--warning)}
.quick-stat.qs-info{--qs-color:var(--info)}
.quick-stat.qs-danger{--qs-color:var(--danger)}
.quick-stat.qs-success{--qs-color:var(--success)}

/* Stepper (multi-step wizard) - نمط احترافي بدوائر مرقّمة وخط تقدم متدرّج */
.stepper-wrap{
  background:linear-gradient(180deg,#fff,#fbfaff);
  border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:26px 28px 10px;margin-bottom:24px;box-shadow:var(--shadow-card);
}
.steps-nav{display:flex;align-items:flex-start;list-style:none;margin:0;padding:0;position:relative}
.steps-nav::before{
  content:'';position:absolute;top:23px;inset-inline-start:10%;inset-inline-end:10%;
  height:3px;background:var(--line);z-index:0;border-radius:3px;
}
.steps-nav .step-line-progress{
  position:absolute;top:23px;inset-inline-start:10%;width:0;height:3px;
  background:linear-gradient(90deg,var(--success),var(--violet));z-index:0;border-radius:3px;
  transition:width .35s ease;
}
.steps-nav .step-item{flex:1;position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;min-width:0}
.steps-nav .step-btn{
  background:none;border:none;cursor:pointer;font-family:inherit;
  display:flex;flex-direction:column;align-items:center;gap:9px;position:relative;z-index:1;
  padding:0;width:100%;
}
.steps-nav .step-btn:hover .step-circle{transform:translateY(-2px);box-shadow:0 6px 16px rgba(106,61,245,.22)}
.steps-nav .step-circle{
  width:46px;height:46px;border-radius:50%;background:#eef0f6;color:var(--ink-400);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;
  border:4px solid var(--bg-card);box-shadow:0 0 0 1.5px var(--line);transition:.25s;
}
.steps-nav .step-item.active .step-circle{
  background:linear-gradient(135deg,var(--violet),var(--violet-light));color:#fff;
  box-shadow:0 0 0 4px rgba(106,61,245,.16),0 8px 18px rgba(106,61,245,.3);transform:scale(1.06);
}
.steps-nav .step-item.done .step-circle{background:var(--success);color:#fff;box-shadow:0 0 0 4px rgba(30,158,106,.14)}
.steps-nav .step-item.done .step-circle i{font-size:16px}
.steps-nav .step-label{font-size:12.5px;font-weight:700;color:var(--ink-400);text-align:center;padding-bottom:22px;max-width:110px;line-height:1.4;transition:color .2s}
.steps-nav .step-item.active .step-label{color:var(--violet);font-weight:800}
.steps-nav .step-item.done .step-label{color:var(--success)}
@media(max-width:720px){.steps-nav .step-label{font-size:10.5px;max-width:70px}}
@media(max-width:520px){.steps-nav .step-label{display:none}.steps-nav::before,.steps-nav .step-line-progress{top:19px}.steps-nav .step-circle{width:38px;height:38px;font-size:14px}}

.tab-panel{display:none !important}
.tab-panel.active{display:block !important;animation:fadeIn .25s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.wizard-nav-btns{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:10px}

.session-card, .dynamic-row{
  border:1.5px solid var(--line);border-radius:var(--radius-md);padding:18px;margin-bottom:14px;position:relative;background:#fbfbfd;
}
.remove-row{position:absolute;top:12px;left:12px;background:#fbe1e5;color:var(--danger);border:none;border-radius:8px;padding:5px 10px;cursor:pointer;font-size:12px;font-weight:700}

/* حقول موسومة بوضوح (تفاصيل البرنامج) */
.field-block{margin-bottom:18px}
.field-block:last-child{margin-bottom:0}
.field-label{
  font-size:11.5px;font-weight:800;color:var(--violet);text-transform:uppercase;letter-spacing:.4px;
  margin-bottom:6px;display:flex;align-items:center;gap:6px;
}
.field-label i{font-size:11px}
.field-value{font-size:14.5px;color:var(--ink-900)}

/* بطاقة جلسة بترويسة وجسم واضحين */
.session-card{padding:0;overflow:hidden}
.session-card .session-card-head{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;
  padding:14px 18px;background:#f4f2ff;border-bottom:1.5px solid var(--line);
}
.session-card .session-num{
  background:var(--violet);color:#fff;font-size:11px;font-weight:800;padding:3px 10px;border-radius:99px;
}
.session-card .session-card-body{padding:18px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:720px){.grid-3{grid-template-columns:1fr}}

/* صف مدرّبين / فقرات "ماذا ستتعلم" - زر الحذف في أقصى اليسار */
.dynamic-row.inline-row{display:flex;align-items:center;gap:10px;padding:12px 14px}
.dynamic-row.inline-row input,.dynamic-row.inline-row textarea{flex:1;margin:0}
.dynamic-row.inline-row .remove-row{position:static;flex-shrink:0;order:2}
.dynamic-row.inline-row .row-index{color:var(--ink-400);font-size:12.5px;font-weight:700;width:20px;flex-shrink:0}

/* جلسات قابلة للطي/التوسيع (أكورديون) */
.session-block{
  padding:0;position:relative;margin-bottom:14px;
  border:1.5px solid var(--line);border-radius:var(--radius-md);background:#fff;
}
.session-block .session-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 18px;cursor:pointer;background:#f4f2ff;
  border-radius:calc(var(--radius-md) - 1.5px) calc(var(--radius-md) - 1.5px) 0 0;
}
.session-block.collapsed .session-head{border-radius:calc(var(--radius-md) - 1.5px)}
.session-block .session-head .title{font-weight:700;font-size:14px}
.session-block .session-head .chev{transition:.2s transform;color:var(--violet)}
.session-block.collapsed .session-head .chev{transform:rotate(-90deg)}
.session-block .session-body{padding:18px;border-radius:0 0 calc(var(--radius-md) - 1.5px) calc(var(--radius-md) - 1.5px)}
.session-block.collapsed .session-body{display:none}
.session-block .remove-row{position:static;margin-inline-start:auto}

.empty-state{text-align:center;padding:60px 20px;color:var(--ink-400)}
.empty-state .emoji{font-size:42px;margin-bottom:12px}

.dim-hint{background:#e3edfa;color:var(--info);padding:10px 14px;border-radius:10px;font-size:12.5px;margin-bottom:10px}

/* قائمة منسدلة متعددة الاختيار (المتحدثون) */
.multiselect{position:relative}
.multiselect-toggle{
  width:100%;text-align:right;padding:12px 14px;border-radius:8px;border:1.5px solid var(--line);
  background:#fbfbfd;font-size:14.5px;color:var(--ink-900);cursor:pointer;font-family:inherit;
  display:flex;justify-content:space-between;align-items:center;gap:8px;
}
.multiselect-toggle .ms-summary{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink-600)}
.multiselect-toggle .ms-summary.has-value{color:var(--ink-900);font-weight:600}
.multiselect-toggle i{color:var(--ink-400);font-size:12px;flex-shrink:0;transition:.2s transform}
.multiselect.open .multiselect-toggle i{transform:rotate(180deg)}
.multiselect.open .multiselect-toggle{border-color:var(--violet)}
.multiselect-panel{
  display:none;position:absolute;top:calc(100% + 6px);right:0;left:0;z-index:200;
  background:#fff;border:1.5px solid var(--line);border-radius:10px;box-shadow:var(--shadow-pop);
  max-height:220px;overflow-y:auto;padding:8px;
}
.multiselect.open .multiselect-panel{display:block}
.multiselect-option{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:8px;cursor:pointer;font-size:14px}
.multiselect-option:hover{background:#f4f2ff}
.multiselect-option input{width:auto;margin:0}
.multiselect-empty{padding:10px;font-size:13px;color:var(--ink-400);text-align:center}

/* مسار العمل (Timeline) */
.timeline{position:relative;padding-inline-start:30px}
.timeline::before{content:'';position:absolute;top:6px;bottom:6px;inset-inline-start:9px;width:2px;background:var(--line)}
.timeline-item{position:relative;padding-bottom:24px}
.timeline-item:last-child{padding-bottom:0}
.timeline-dot{
  position:absolute;inset-inline-start:-30px;top:2px;width:20px;height:20px;border-radius:50%;
  background:var(--violet);border:3px solid var(--bg-card);box-shadow:0 0 0 1.5px var(--violet);
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:9px;
}
.timeline-item.tl-success .timeline-dot{background:var(--success);box-shadow:0 0 0 1.5px var(--success)}
.timeline-item.tl-danger .timeline-dot{background:var(--danger);box-shadow:0 0 0 1.5px var(--danger)}
.timeline-item.tl-warning .timeline-dot{background:var(--warning);box-shadow:0 0 0 1.5px var(--warning)}
.timeline-item.tl-info .timeline-dot{background:var(--info);box-shadow:0 0 0 1.5px var(--info)}
.timeline-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px}
.timeline-action{font-weight:700;font-size:14px;color:var(--ink-900)}
.timeline-time{font-size:11.5px;color:var(--ink-400);white-space:nowrap}
.timeline-meta{font-size:12.5px;color:var(--ink-600);margin-top:3px}
.timeline-meta .badge{margin-inline-start:4px}
.timeline-note{background:#f7f7fb;border-radius:8px;padding:8px 12px;margin-top:8px;font-size:13px;color:var(--ink-700);line-height:1.7}
.timeline-status-arrow{font-size:11px;color:var(--ink-400)}

/* قائمة الإشعارات */
.notif-row{display:flex;gap:12px;align-items:flex-start;padding:16px 6px;border-bottom:1px solid var(--line)}
.notif-row:last-child{border-bottom:none}
.notif-row .notif-dot{width:9px;height:9px;border-radius:50%;background:var(--line);margin-top:6px;flex-shrink:0}
.notif-row.unread .notif-dot{background:var(--violet)}
.notif-row.unread .notif-msg{font-weight:800}
.notif-msg{color:var(--ink-900);font-size:14.5px;text-decoration:none;display:block}
a.notif-msg:hover{color:var(--violet)}


.thumb-preview{width:100%;border-radius:12px;border:1px solid var(--line);margin-top:10px;overflow:hidden}
.thumb-preview img{width:100%}