/* ============================================================
   Civil Defense — Command Center
   نظام التصميم: أزرق احترافي (#031ca6) + رمادي/كريمي — والأحمر محجوز للحرج فقط
   الفونت: ITF Qomra Arabic (مأخوذ من Hares Patrol Vision)
   البنية (shell) مقتبسة من Hares Patrol Vision، بألوان جديدة
   ============================================================ */

/* ---------- Fonts ---------- */
@font-face {
  font-family: 'Qomra';
  src: url('fonts/itfQomraArabic-Light.otf') format('opentype');
  font-weight: 300; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Qomra';
  src: url('fonts/itfQomraArabic-Regular.otf') format('opentype');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Qomra';
  src: url('fonts/itfQomraArabic-Medium.otf') format('opentype');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Qomra';
  src: url('fonts/itfQomraArabic-Bold.otf') format('opentype');
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Qomra';
  src: url('fonts/itfQomraArabic-Black.otf') format('opentype');
  font-weight: 900; font-style: normal; font-display: swap;
}

/* ---------- Tokens ---------- */
:root {
  color-scheme: light;   /* عناصر النظام (حقول/قوائم) تتبع ثيمنا لا تفضيل نظام التشغيل */
  --bg:        #f3f3f3;   /* رمادي فاتح — الهوية البصرية */
  --bg-elev:   #ffffff;
  --bg-soft:   #fafafa;
  --sidebar:   #ffffff;

  --ink:    #14181f;
  --ink-2:  #5a6472;
  --ink-3:  #939cab;
  --line:        #e7eaef;
  --line-strong: #d7dce3;

  /* العلامة الأساسية — أزرق عميق (الأفعال/التحديد/الهوية) */
  --brand:      #031ca6;
  --brand-600:  #02178a;
  --brand-700:  #02126e;
  --brand-soft: #e7ebfa;
  --brand-line: #c1cbf0;

  /* الخطر — أحمر، محجوز للحرج فقط (لا يطغى) */
  --red:      #e11d2a;
  --red-600:  #c8161f;
  --red-700:  #a5111a;
  --red-soft: #fdecec;
  --red-line: #f6cdcf;
  --white:    #ffffff;

  /* ألوان الهوية المساندة */
  --gold:  #b89234;   /* ذهب رصين (لا أصفر نيون) — لمسة سيادية في شريط التصنيف */
  --cream: #e9e2c4;

  /* حالات مكتومة (لوحة سيادية رصينة — لا نيون) */
  --ok:   #3f8f6b;
  --warn: #b0822f;
  --info: #5e7ea8;

  /* مستويات الاستجابة 1-4 — فولاذي ← نحاسي ← طيني ← قرمزي (مكتومة) */
  --lv1: #5e7ea8;  /* عادي — فولاذي */
  --lv2: #c6a24e;  /* متوسط — نحاسي */
  --lv3: #cb7044;  /* كبير — طيني */
  --lv4: #cf4350;  /* كارثة — قرمزي حرج */

  /* حواف أحدّ — طابع كونسول قيادة سيادي لا قوالب SaaS الناعمة */
  --r:    9px;
  --r-sm: 7px;
  --r-xs: 5px;

  --shadow-sm: 0 1px 2px rgba(20,24,31,.05), 0 1px 3px rgba(20,24,31,.04);
  --shadow:    0 2px 6px rgba(20,24,31,.06), 0 6px 18px rgba(20,24,31,.06);
  --shadow-lg: 0 10px 36px rgba(20,24,31,.12);

  /* الخط موحّد: قمرة فقط. الأرقام/المعرّفات أيضاً بقمرة (مع احتياط أحادي العرض لأي محرف ناقص فقط). */
  --mono: 'Qomra', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --sidebar-w: 248px;
  --glass: rgba(255,255,255,.96);
}

/* ====== الثيم الداكن (غرفة عمليات) ====== */
html.dark {
  color-scheme: dark;   /* الحقول/القوائم تُرسَم داكنة (لا بياض على الهوفر/التركيز) */
  /* سطوح رمادية محايدة (لا تدرّج أزرق) — كونسول رصين */
  --bg: #0f0f10;
  --bg-elev: #18181a;
  --bg-soft: #1e1f21;
  --sidebar: #121213;
  --ink: #e9eaec;
  --ink-2: #a2a5ab;
  --ink-3: #71747a;
  --line: #2a2b2d;
  --line-strong: #3a3b3e;
  /* العلامة الزرقاء أفتح قليلاً للتباين؛ التظليل المحايد بدل الأزرق */
  --brand:      #5b78ff;
  --brand-600:  #3f5cf0;
  --brand-700:  #6f88ff;
  --brand-soft: rgba(255,255,255,.05);
  --brand-line: var(--line-strong);
  --red-soft: rgba(225,29,42,.18);
  --red-line: rgba(225,29,42,.45);
  --glass: rgba(22,27,34,.95);
  --shadow-sm: 0 1px 2px rgba(0,0,0,.4);
  --shadow: 0 2px 8px rgba(0,0,0,.45);
  --shadow-lg: 0 14px 44px rgba(0,0,0,.6);
}
html.dark ::-webkit-scrollbar-thumb { background: #2b3543; border-color: var(--bg-elev); }
html.dark .leaflet-popup-content-wrapper, html.dark .leaflet-popup-tip { background: #161b22; color: #e6edf3; box-shadow: 0 4px 16px rgba(0,0,0,.6); }
html.dark .leaflet-popup-content, html.dark .leaflet-popup-content b { color: #e6edf3; }
html.dark .leaflet-bar a { background: #161b22; color: #e6edf3; border-color: #242c38; }
.leaflet-popup-content { direction: rtl; text-align: right; }   /* بطاقات العناصر على الخريطة · محاذاة عربية لليمين */
/* توحيد الخط: Leaflet يفرض خطوطه الخاصة (Helvetica Neue للحاوية · Lucida Console لأزرار التكبير) — نعيدها لقمرة
   فيصير كل نصّ المشروع بخط قمرة (لا خطوط أجنبية · الأرقام لاتينية بذات قمرة) */
.leaflet-container, .leaflet-control, .leaflet-bar a,
.leaflet-control-zoom-in, .leaflet-control-zoom-out,
.leaflet-popup-content, .leaflet-popup, .leaflet-tooltip { font-family: 'Qomra', sans-serif !important; }

/* ---------- Reset ---------- */
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  font-family: 'Qomra', 'Segoe UI', sans-serif;
  background: var(--bg);
  color: var(--ink);
  direction: rtl;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow: hidden;
}
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }
::selection { background: var(--brand); color: #fff; }

/* scrollbars */
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cfd5dd; border-radius: 20px; border: 2px solid var(--bg-elev); }
::-webkit-scrollbar-thumb:hover { background: #b6bdc8; }

/* ---------- شريط التصنيف السيادي ---------- */
.gov-bar {
  height: 28px; display: flex; align-items: center; justify-content: space-between;
  padding: 0 16px; background: linear-gradient(90deg, var(--brand-700), var(--brand));
  color: #fff; font-size: 11.5px; font-weight: 700; letter-spacing: .2px;
  border-bottom: 2px solid var(--gold); position: relative; z-index: 60; user-select: none;
}
.gov-id { display: flex; align-items: center; gap: 8px; }
.gov-class { font-family: var(--mono); display: flex; align-items: center; gap: 7px; opacity: .96; }
.gov-class::before { content: ''; width: 7px; height: 7px; border-radius: 2px; background: var(--gold); }
.accent-bar-top { height: 4px; background: linear-gradient(90deg, var(--brand-700), var(--brand), #3a5bff); position: relative; z-index: 50; }

/* ============================================================
   App layout
   ============================================================ */
.app-layout {
  height: calc(100vh - 28px);
  position: relative;
}

/* ---------- Sidebar (RTL: fixed on the RIGHT — كحارس الطرق) ---------- */
.sidebar {
  position: fixed; top: 28px; right: 0; bottom: 0;
  width: var(--sidebar-w);
  background: var(--sidebar);
  border-left: 1px solid var(--line);   /* الفاصل على يسار الشريط الأيمن */
  display: flex; flex-direction: column;
  min-height: 0; z-index: 40;
}
.sidebar-logo {
  padding: 18px 18px 14px;
  border-bottom: 1px solid var(--line);
}
.logo-row { display: flex; align-items: center; gap: 11px; }
.logo-mark {
  width: 40px; height: 40px; flex: 0 0 auto;
  display: grid; place-items: center;
}
.logo-img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; display: block; }
.brand { font-weight: 900; font-size: 18px; color: var(--ink); line-height: 1.1; }
.brand-sub {
  font-family: 'Qomra'; font-size: 11px;
  color: var(--brand); margin-top: 3px; font-weight: 700;
}

.sidebar-nav { padding: 12px 12px; overflow-y: auto; flex: 1 1 auto; min-height: 0; }
.nav-section {
  font-family: 'Qomra'; font-size: 11.5px; font-weight: 700;
  color: var(--ink-3);
  margin: 16px 8px 7px; display: flex; align-items: center; gap: 8px;
}
.nav-section::after { content: ''; flex: 1; height: 1px; background: var(--line); }

.nav-item {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px; border-radius: var(--r-sm);
  color: var(--ink-2); font-size: 14.5px; font-weight: 500;
  margin-bottom: 2px; position: relative;
  transition: background .14s, color .14s;
  border: 1px solid transparent;
  user-select: none;
}
.nav-item:hover { background: var(--bg-soft); color: var(--ink); }
.nav-item.active {
  background: transparent;            /* بلا تظليل أزرق — مؤشّر شريط جانبي + لون نص فقط */
  color: var(--brand);
  font-weight: 800;
}
.nav-item.active::before {
  content: ''; position: absolute; inset-inline-end: -1px; top: 8px; bottom: 8px;
  width: 3px; border-radius: 3px; background: var(--brand);
}
.nav-icon {
  width: 22px; height: 22px; flex: 0 0 auto;
  display: grid; place-items: center; color: currentColor;
}
.nav-icon svg { width: 19px; height: 19px; }
.nav-badge {
  margin-inline-start: auto; min-width: 18px; padding: 0 4px;
  display: grid; place-items: center; color: var(--ink-3); font-family: var(--mono);
  font-size: 11.5px; font-weight: 700;   /* رقم فقط بلا تظليل */
}
.nav-item.active .nav-badge { color: var(--brand); }

.sidebar-footer { padding: 12px; border-top: 1px solid var(--line); }

/* ---------- Main content ---------- */
.main-content {
  margin-right: var(--sidebar-w);
  height: calc(100vh - 4px);
  display: flex; flex-direction: column; min-width: 0; min-height: 0;
}

/* topbar */
.topbar {
  height: 60px; flex: 0 0 auto;
  display: flex; align-items: center; gap: 14px;
  padding: 0 22px;
  background: var(--bg-elev);
  border-bottom: 1px solid var(--line);
}
/* الاسم (يمين) ثم العنوان ثم الوصف — مفصولان بخطّ رفيع */
.topbar-titles { display: flex; align-items: baseline; gap: 9px;
  padding-inline-start: 16px; margin-inline-start: 4px; border-inline-start: 1px solid var(--line); }
.topbar-title { font-weight: 900; font-size: 19px; color: var(--ink); }
.topbar-sub { font-size: 12.5px; color: var(--ink-3); font-weight: 500; }

.topbar-spacer { flex: 1; }

/* البلاغات الواردة (فرز) */
.inq-head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.inq-head h2 { font-size: 19px; font-weight: 900; display: flex; align-items: center; gap: 9px; }
/* بطاقتا الإحصاء (نشط/إجمالاً) · النص فوق والرقم تحت · مستطيلات أنيقة في المنتصف */
.ag-stats { display: flex; gap: 16px; margin-inline: auto; }
.ag-stat { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 168px; padding: 11px 40px;
  border: 1px solid var(--line); border-radius: 13px; background: var(--bg-soft); box-shadow: var(--shadow-sm); }
.ag-stat span { font-size: 12.5px; color: var(--ink-3); font-weight: 700; letter-spacing: .2px; }
.ag-stat b { font-size: 26px; font-weight: 900; color: var(--brand); line-height: 1; font-variant-numeric: tabular-nums; }
.inq-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; }
.inq-card { background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r); padding: 14px 16px; }
.inq-top { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.inq-type { font-weight: 800; font-size: 15px; display: inline-flex; align-items: center; gap: 7px; }
.inq-row { display: flex; gap: 10px; padding: 5px 0; font-size: 13px; border-bottom: 1px dashed var(--line); }
.inq-k { color: var(--ink-3); font-weight: 700; flex: 0 0 78px; }
.inq-v { font-weight: 600; color: var(--ink); }
.inq-desc { color: var(--ink-2); font-size: 13px; line-height: 1.7; margin: 9px 0 0; }
.inq-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
/* الزر الأزرق بعرض كامل (اسم المركز الطويل يلتفّ داخله)، وبقية الأزرار تلتفّ أسفله — لا خروج من البطاقة */
.inq-acts .btn-primary { flex: 1 1 100%; white-space: normal; text-align: center; line-height: 1.4; height: auto; min-height: 34px; }
.inq-acts .btn-ghost, .inq-acts .btn:not(.btn-primary) { flex: 1 1 auto; min-width: 0; }

.clock {
  font-family: var(--mono); font-weight: 700; font-size: 15px; color: var(--ink);
  letter-spacing: .5px; display: flex; flex-direction: column; align-items: flex-end; line-height: 1.15;
}
.clock .date { font-size: 11px; color: var(--ink-3); letter-spacing: normal; }

.status-pills { display: flex; gap: 8px; }
.pill {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 6px 11px; border-radius: 20px;
  background: var(--bg-soft); border: 1px solid var(--line);
  font-size: 12px; font-weight: 600; color: var(--ink-2);
}
.pill .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 3px rgba(31,157,87,.15); }
.pill.warn .dot { background: var(--warn); box-shadow: 0 0 0 3px rgba(232,147,12,.15);}
.pill.off .dot  { background: var(--ink-3); box-shadow:none; }
.pill.ready { color: var(--ok); font-weight: 800; }   /* جاهزية: لون فقط بلا تظليل */
.pill.ready .dot { background: var(--ok); box-shadow: none; }
html.dark .pill.ready { color: var(--ok); }
.pill button { all: unset; cursor: pointer; }

.icon-btn {
  width: 36px; height: 36px; border-radius: var(--r-sm);
  display: grid; place-items: center;
  background: var(--bg-soft); border: 1px solid var(--line); color: var(--ink-2);
  transition: all .15s;
}
.icon-btn:hover { background: var(--bg-soft); border-color: var(--line-strong); color: var(--ink); }
.icon-btn svg { width: 18px; height: 18px; }

.operator {
  display: flex; align-items: center; gap: 10px;
  padding-inline-start: 14px; border-inline-start: 1px solid var(--line);
}
.avatar {
  width: 38px; height: 38px; border-radius: 11px;
  background: linear-gradient(135deg, var(--brand), var(--brand-700));
  color: #fff; display: grid; place-items: center; font-weight: 900; font-size: 16px;
  box-shadow: var(--shadow-sm);
}
.operator .who .name { font-weight: 700; font-size: 13.5px; }
.operator .who .role { font-size: 11.5px; color: var(--ink-3); }

/* page content */
.page-content { flex: 1 1 auto; min-height: 0; overflow: hidden; }
.screen { height: 100%; display: none; }
.screen.active { display: block; }

/* ============================================================
   Reusable bits
   ============================================================ */
.card {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r); box-shadow: var(--shadow-sm);
  display: flex; flex-direction: column; min-height: 0; overflow: hidden;
}
.card-head {
  display: flex; align-items: center; gap: 9px;
  padding: 13px 15px; border-bottom: 1px solid var(--line); flex: 0 0 auto;
}
.card-head h3 { font-size: 14.5px; font-weight: 800; display: flex; align-items: center; gap: 9px; }
.card-head .count {
  font-family: var(--mono); font-size: 12px; font-weight: 700; color: var(--ink-3);
}
.card-head .spacer { flex: 1; }
.card-body { padding: 13px 15px; overflow-y: auto; flex: 1 1 auto; min-height: 0; }
.card-body.flush { padding: 0; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 9px 16px; border-radius: var(--r-sm); font-weight: 700; font-size: 13.5px;
  border: 1px solid transparent; transition: all .15s; white-space: nowrap;
}
.btn svg { width: 16px; height: 16px; }
.btn-primary { background: var(--brand); color: #fff; }
.btn-primary:hover { background: var(--brand-700); box-shadow: 0 4px 14px rgba(3,28,166,.28); }
.btn-ghost { background: var(--bg-soft); color: var(--ink-2); border-color: var(--line); }
.btn-ghost:hover { background: var(--bg-elev); color: var(--ink); border-color: var(--line-strong); }
.btn-sm { padding: 6px 12px; font-size: 12.5px; }

/* تصميم مسطّح: الشارات والوسوم بلا خلفية مظلّلة — لون ونص وأيقونة فقط */
.sev-tag {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 800; font-family: 'Qomra'; white-space: nowrap;
}
.sev-1 { color: var(--lv1); }
.sev-2 { color: var(--lv2); }
.sev-3 { color: var(--lv3); }
.sev-4 { color: var(--lv4); }
.sev-dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }

.chip {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 12px; font-weight: 600; color: var(--ink-2);
}
.chip.ok   { color: var(--ok); }
.chip.warn { color: var(--warn); }
.chip.busy { color: var(--lv4); }
.chip.muted{ color: var(--ink-3); }
/* شرائح فلتر سجل التدقيق · أزرار واضحة (لا نصّ رمادي صغير) · تعمل بالوضعين */
#auditFilter .chip { font-size: 12.5px; font-weight: 700; padding: 5px 12px; border-radius: var(--r-sm);
  border: 1px solid var(--line-strong); background: var(--bg-soft); color: var(--ink-2); cursor: pointer; }
#auditFilter .chip:hover { border-color: var(--brand); color: var(--ink); }
#auditFilter .chip.busy { background: var(--brand); border-color: var(--brand); color: #fff; }
.mono { font-family: var(--mono); }
.ic-chip { display: inline-grid; place-items: center; flex: 0 0 auto; }
.ic-chip svg { display: block; }

/* ============================================================
   SCREEN 1 — Live Operations
   ============================================================ */
.ops-grid {
  height: 100%;
  display: grid;
  grid-template-columns: 340px 1fr 340px;
  grid-template-rows: auto 1fr;
  gap: 14px; padding: 16px;
}
.kpi-strip { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.kpi {
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r);
  padding: 13px 15px; box-shadow: var(--shadow-sm); position: relative; overflow: hidden;
}
.kpi::before { content:''; position:absolute; inset-inline-start:0; top:0; bottom:0; width:3px; background: var(--brand); opacity:.85;}
/* البطاقات الكبيرة كفلاتر (شاشة الأسطول): مؤشّر النقر + حالة الفلتر المفعّل */
.kpi[data-f] { transition: border-color .15s, box-shadow .15s; }
.kpi[data-f]:hover { border-color: var(--brand); }
.kpi.kpi-on { border-color: var(--brand); box-shadow: 0 0 0 2px rgba(3,28,166,.18); }
.kpi.blue::before { background: var(--info); }
.kpi.green::before{ background: var(--ok); }
.kpi.amber::before{ background: var(--warn); }
.kpi.ink::before  { background: var(--ink-2); }
.kpi .kpi-label { font-size: 12px; color: var(--ink-3); font-weight: 600; display:flex; align-items:center; gap:7px;}
.kpi .kpi-value { font-family: var(--mono); font-size: 30px; font-weight: 700; color: var(--ink); line-height: 1.1; margin-top: 6px; }
.kpi .kpi-foot { font-size: 11px; color: var(--ink-3); margin-top: 3px; }
.kpi .kpi-foot b { color: var(--ok); }
.kpi .kpi-foot b.up { color: var(--brand); }

.ops-left  { grid-column: 3; grid-row: 2; }  /* RTL: first column visually right */
.ops-map   { grid-column: 2; grid-row: 2; }
.ops-right { grid-column: 1; grid-row: 2; }

#map { width: 100%; height: 100%; }
.map-wrap { position: relative; }
.map-legend {
  position: absolute; bottom: 12px; inset-inline-end: 12px; z-index: 500;   /* أسفل اليسار · بعيد عن لوحة الطبقات */
  background: var(--glass); backdrop-filter: blur(4px);
  border: 1px solid var(--line); border-radius: var(--r-sm); padding: 9px 12px;
  box-shadow: var(--shadow); font-size: 11.5px; display: flex; flex-direction: column; gap: 5px;
}
.map-legend .lg { display: flex; align-items: center; gap: 7px; color: var(--ink-2); font-weight: 600; }
.map-legend .lg i { width: 10px; height: 10px; border-radius: 50%; }
.map-toolbar {
  position: absolute; top: 12px; inset-inline-end: 12px; z-index: 500;
  display: flex; gap: 6px;
}
.map-toolbar .icon-btn { background: var(--glass); box-shadow: var(--shadow-sm); }

/* ===== الوضع الجداري (شاشة مراقبة منفصلة): خريطة مِلء الشاشة بلا قوائم ===== */
.wall-mode .sidebar, .wall-mode .topbar { display: none !important; }
.wall-mode .main-content { margin-right: 0; }   /* لا فراغ مكان الشريط الجانبي */
.wall-mode .page-content { height: 100%; }
.wall-mode .ops-grid { grid-template-columns: 1fr; grid-template-rows: 1fr; gap: 0; padding: 0; }
.wall-mode .kpi-strip, .wall-mode .ops-right, .wall-mode .ops-left { display: none !important; }
.wall-mode .ops-map { grid-column: 1; grid-row: 1; }
.wall-mode .map-wrap { border-radius: 0; border: 0; }
.wall-mode #wallBtn { display: none; }            /* لا حاجة لزر الفصل داخل الشاشة الجدارية */
.wall-mode .page-content .screen:not(#screen-ops) { display: none !important; }

/* نافذة مستقلّة لشاشة واحدة (متعدّد الشاشات · غرفة قيادة) — يخفي الشريط الجانبي والعلوي، يبقي
   شريط التصنيف السيادي، ويملأ الشاشة الواحدة. يعيد استخدام كل المنطق + WS الحيّ بلا تكرار. */
.solo-mode .sidebar, .solo-mode .topbar { display: none !important; }
.solo-mode .main-content { margin-right: 0 !important; margin-left: 0 !important; }
.solo-mode .page-content { height: 100%; }
.solo-mode #popoutBtn, .solo-mode #wallBtn { display: none; }   /* لا فصل متداخل داخل النافذة المستقلّة */

/* أيقونة «نافذة منفصلة» على كل تبويب في الشريط الجانبي (تظهر عند المرور · أيّ تبويب → نافذته الخاصّة) */
.nav-item { position: relative; }
.nav-pop { position: absolute; inset-inline-end: 6px; top: 50%; transform: translateY(-50%);
  background: none; border: 0; color: var(--ink-3); cursor: pointer; padding: 2px; border-radius: var(--r-xs);
  opacity: 0; transition: opacity .12s; display: flex; align-items: center; }
.nav-item:hover .nav-pop { opacity: .65; }
.nav-item:hover .nav-badge { opacity: 0; }   /* أفسح المكان للأيقونة عند المرور */
.nav-pop:hover { opacity: 1 !important; color: var(--brand); background: var(--bg-soft); }
.solo-mode .nav-pop, .wall-mode .nav-pop { display: none; }
/* لافتة جدارية: اسم الغرفة + ساعة + مباشر */
.wall-banner { display: none; }
.wall-mode .wall-banner { display: flex; align-items: center; gap: 14px;
  position: absolute; top: 12px; left: 50%; transform: translateX(-50%); z-index: 600;  /* أعلى الوسط · لا يتراكب مع الطبقات/الأدوات */
  background: var(--glass); backdrop-filter: blur(4px); border: 1px solid var(--line);
  border-radius: var(--r-sm); padding: 8px 14px; box-shadow: var(--shadow); }
.wall-banner .wb-title { font-weight: 900; font-size: 14px; }
.wall-banner .wb-clock { font-family: var(--mono); font-weight: 700; font-size: 14px; color: var(--ink); }
.wb-refresh { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 30px; cursor: pointer;
  background: var(--bg-soft); border: 1px solid var(--line-strong); color: var(--ink); border-radius: var(--r-sm); }
.wb-refresh:hover { border-color: var(--brand); color: var(--brand); }
.wb-refresh.spin svg { animation: wbspin .7s linear; }
@keyframes wbspin { from { transform: rotate(0); } to { transform: rotate(360deg); } }

/* incident list */
.inc-item {
  display: flex; align-items: stretch; gap: 11px;
  padding: 10px 14px; border-bottom: 1px solid var(--line); cursor: pointer;
  transition: background .12s; position: relative;
}
.inc-item:hover { background: var(--bg-soft); }
.inc-item.sel { background: var(--bg-soft); }   /* تحديد محايد + شريط جانبي (لا أزرق) */
.inc-item.sel::before { content:''; position:absolute; inset-inline-end:0; top:0; bottom:0; width:3px; background:var(--brand); }
.inc-sev-bar { flex: 0 0 4px; border-radius: 0 3px 3px 0; }   /* شريط شدّة رفيع (لون فقط) */
.inc-body { flex: 1; min-width: 0; }
.inc-top { display: flex; align-items: center; gap: 9px; margin-bottom: 5px; }
.inc-type { font-weight: 800; font-size: 14px; }
.inc-stage { display: inline-flex; align-items: center; gap: 5px; font-weight: 800; font-size: 11.5px; margin-inline-start: auto; }
.inc-id { font-family: var(--mono); font-size: 11.5px; font-weight: 700; color: var(--brand); white-space: nowrap; }
.inc-meta { display: flex; align-items: center; gap: 12px; font-size: 12px; color: var(--ink-2); }
.inc-meta .loc { display: flex; align-items: center; gap: 5px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.inc-teams { display: inline-flex; align-items: center; gap: 5px; font-family: var(--mono); font-weight: 700; flex: 0 0 auto; }
.inc-meta .ago { margin-inline-start: auto; font-family: var(--mono); font-size: 11px; color: var(--ink-3); flex: 0 0 auto; }

/* feed (alerts / new reports) */
.feed-item {
  display: flex; gap: 11px; padding: 11px 15px; border-bottom: 1px solid var(--line);
  animation: feed-in .35s ease;
}
@keyframes feed-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.feed-ic {
  width: 28px; flex: 0 0 auto; display: grid; place-items: center; color: var(--ink-3); padding-top: 2px;
}
.feed-ic.crit { color: var(--red); }
.feed-ic.warn { color: var(--warn); }
.feed-ic.info { color: var(--info); }
.feed-main { flex: 1; min-width: 0; }
.feed-title { font-weight: 700; font-size: 13.5px; }
.feed-desc { font-size: 12px; color: var(--ink-2); margin-top: 2px; }
.feed-time { font-family: var(--mono); font-size: 10.5px; color: var(--ink-3); margin-top: 3px; }
.feed-actions { display: flex; gap: 6px; margin-top: 8px; }

/* team / unit rows */
.unit-row {
  display: flex; align-items: center; gap: 11px; padding: 10px 15px; border-bottom: 1px solid var(--line);
}
.unit-ic { width: 30px; flex: 0 0 auto; display: grid; place-items: center; color: var(--ink-2); }
.unit-main { flex: 1; min-width: 0; }
.unit-name { font-weight: 700; font-size: 13.5px; display: flex; align-items: center; gap: 7px; }
.unit-sub { font-size: 11.5px; color: var(--ink-3); font-family: var(--mono); }
/* تجميع الفرق المتحركة تحت كل مركز */
.unit-group { margin-bottom: 10px; }
.unit-group-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 15px 6px; border-bottom: 1px solid var(--line); position: sticky; top: 0; background: var(--bg-elev); z-index: 1; cursor: pointer; user-select: none; }
.unit-group-head:hover { background: var(--bg-soft); }
.ugh-name { display: inline-flex; align-items: center; gap: 6px; font-weight: 800; font-size: 12.5px; color: var(--ink); }
.ugh-count { font-size: 10.5px; color: var(--ink-3); font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ugh-chev { color: var(--ink-3); transition: transform .15s ease; flex: 0 0 auto; }
.unit-group.collapsed .ugh-chev { transform: rotate(-90deg); }
.unit-group.collapsed .unit-group-body { display: none; }
.unit-group .unit-row:last-child { border-bottom: none; }

/* ============================================================
   SCREEN generic content / tables
   ============================================================ */
.screen-pad { height: 100%; padding: 18px 18px 72px; overflow-y: auto; }   /* هامش سفلي كافٍ كي لا تختفي الأزرار تحت شريط المهام */
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.section-title { font-size: 16px; font-weight: 900; margin: 4px 0 12px; display:flex; align-items:center; gap:9px;}

table.tbl { width: 100%; border-collapse: collapse; font-size: 13px; }
table.tbl th {
  text-align: right; font-size: 12px; font-weight: 700; color: var(--ink-3);
  padding: 10px 14px;
  border-bottom: 1px solid var(--line); position: sticky; top: 0; background: var(--bg-elev);
}
table.tbl td { padding: 11px 14px; border-bottom: 1px solid var(--line); }
table.tbl tr:hover td { background: var(--bg-soft); }

/* incident detail (screen 2) — غرفة القيادة: تتبّع فقط (نظيف، يتنفّس) */
.detail-grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: 16px; align-items: start; }
.idt-col { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
/* ===== تفاصيل الحادث · خريطة مهيمنة + لوحة معلومات (احترافي) ===== */
.dx { display: grid; grid-template-columns: minmax(360px, 400px) 1fr; gap: 18px; align-items: stretch; margin-bottom: 18px; }
.dx-info { min-width: 0; overflow: auto; max-height: calc(100vh - 200px); padding-inline-end: 4px; }
.dx-map { position: relative; border-radius: var(--r); overflow: hidden; border: 1px solid var(--line); min-height: 520px; }
.dx-map #detailMap { position: absolute; inset: 0; width: 100%; height: 100%; }
.dx-cap { position: absolute; top: 12px; inset-inline-start: 12px; z-index: 600; display: flex; align-items: center; gap: 12px;
  background: var(--glass); backdrop-filter: blur(4px); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 7px 13px; box-shadow: var(--shadow); font-size: 13px; }
.dx-fs { position: absolute; top: 12px; inset-inline-end: 12px; z-index: 600; background: var(--glass); box-shadow: var(--shadow-sm); }
.dx-head { padding-bottom: 4px; }
.dx-type { font-size: 24px; font-weight: 900; display: flex; align-items: center; gap: 10px; }
.dx-tags { display: flex; gap: 9px; flex-wrap: wrap; margin-top: 10px; }
.dx-meta { display: flex; flex-direction: column; gap: 7px; margin-top: 12px; color: var(--ink-2); font-size: 13px; font-weight: 600; }
.dx-meta span { display: inline-flex; align-items: center; gap: 6px; }
.dx-actions { display: flex; gap: 8px; margin-top: 14px; }
.dx-timeline { max-width: 980px; }
@media (max-width: 1080px) { .dx { grid-template-columns: 1fr; } .dx-info { max-height: none; } .dx-map { min-height: 420px; } }

/* ===== تفاصيل الحادث · تصميم هادئ بلا صناديق (عمود واحد) ===== */
.idt2 { max-width: 980px; margin: 0 auto; }
.idt2-head { padding-bottom: 4px; }
.idt2-hrow { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.idt2-type { font-size: 24px; font-weight: 900; display: flex; align-items: center; gap: 10px; }
.idt2-actions { margin-inline-start: auto; display: flex; gap: 8px; }
.idt2-meta { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 12px;
  color: var(--ink-2); font-size: 13px; font-weight: 600; }
.idt2-meta span { display: inline-flex; align-items: center; gap: 6px; }
/* مؤشّر المرحلة (شريط تقدّم بسيط) */
.idt2-stagewrap { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.idt2-stage { font-size: 15px; font-weight: 700; display: flex; align-items: center; gap: 8px; margin-bottom: 11px; }
.idt2-prog { height: 6px; background: var(--bg-soft); border-radius: 999px; overflow: hidden; }
.idt2-prog-fill { height: 100%; border-radius: 999px; transition: width .45s ease; }
/* أقسام بلا صناديق · يفصلها خطّ رفيع ومسافة */
.idt2-sec { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); }
.idt2-label { font-size: 12px; font-weight: 800; color: var(--ink-3); margin-bottom: 14px;
  display: flex; align-items: baseline; gap: 10px; letter-spacing: .2px; }
.idt2-label span { color: var(--ink-2); font-weight: 600; font-size: 11.5px; }
/* تتبّع الفرق */
.idt2-units { display: flex; flex-direction: column; }
.idt2-unit { display: flex; align-items: center; gap: 13px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.idt2-unit:last-child { border-bottom: 0; }
.idt2-u-id { font-family: var(--mono); font-weight: 800; font-size: 13px; }
.idt2-u-type { color: var(--ink-3); font-size: 12.5px; flex: 1; min-width: 0; }
.idt2-u-stat { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 12.5px; }
/* مؤقتات سطريّة */
.idt2-sla { display: flex; flex-wrap: wrap; gap: 14px 40px; }
.idt2-sla-i { display: flex; flex-direction: column; gap: 4px; }
.idt2-sla-k { font-size: 11.5px; color: var(--ink-3); font-weight: 600; }
.idt2-sla-v { font-family: var(--mono); font-size: 22px; font-weight: 800; color: var(--ink); }
/* تفاصيل */
.idt2-kv { display: flex; flex-wrap: wrap; gap: 8px 26px; margin-bottom: 12px; }
.idt2-fact { font-size: 13px; font-weight: 700; }
.idt2-fact .k { color: var(--ink-3); font-weight: 600; }
.idt2-desc { line-height: 1.95; color: var(--ink-2); font-size: 13.5px; }
.idt2-empty { color: var(--ink-3); font-size: 13px; padding: 6px 0; }
.idt2-admin { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 20px;
  padding-top: 16px; border-top: 1px solid var(--line); }
.idt2-admin-lbl { font-size: 12px; color: var(--ink-3); font-weight: 700; }

/* الشريط العلوي: اختيار البلاغ + مؤقتات الأداء */
.dx-top { display: flex; align-items: center; gap: 16px 28px; flex-wrap: wrap;
  margin-bottom: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.idt-nav { display: flex; align-items: center; gap: 10px; flex: 0 1 auto; }
.idt-nav-lbl { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; color: var(--ink-3); white-space: nowrap; }
.idt-nav-sel { width: 300px; max-width: 42vw; }
.dx-toptimers { display: flex; align-items: center; gap: 10px 22px; flex-wrap: wrap; margin-inline: auto; }
.dx-toptimers .idt2-sla-i { flex-direction: row; align-items: baseline; gap: 6px; white-space: nowrap; }
.dx-toptimers .idt2-sla-k { font-size: 11.5px; }
.dx-toptimers .idt2-sla-v { font-size: 15px; }
/* تصميم ٢: لوحة بطاقات (المعتمد) */
.dx2-headcard { margin-bottom: 14px; }
/* تفاصيل البلاغ تحت بنر العنوان مباشرةً (طلب المستخدم) · حقائق مكتملة في شبكة منظّمة */
.dx2-factscard { margin-bottom: 14px; }
/* المسار الزمني · رأس قابل للطيّ (مطوي افتراضياً · طلب المستخدم) */
.tl-head { display: flex; justify-content: space-between; align-items: center; cursor: pointer; user-select: none; }
.tl-chev svg { transition: transform .15s; transform: rotate(-90deg); }   /* مطوي: يشير للأسفل */
.tl-head.open .tl-chev svg { transform: rotate(90deg); }                  /* موسّع: يشير للأعلى */
.dx2-factscard .idt2-kv { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 9px 22px; margin-bottom: 12px; }
.dx2-factscard .idt2-fact { display: flex; gap: 6px; }
/* معلومات الحادث أفقية تستغلّ عرض البطاقة */
.dx2-headcard .dx-head { display: flex; align-items: center; gap: 14px 24px; flex-wrap: wrap; }
.dx2-headcard .dx-tags { margin-top: 0; }
.dx2-headcard .dx-meta { flex-direction: row; flex-wrap: wrap; margin-top: 0; gap: 14px 20px; }
.dx2-headcard .dx-actions { margin-top: 0; margin-inline-start: auto; }
.dx2-stage { margin-bottom: 14px; }
.dx2-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 14px; margin-bottom: 14px; align-items: start; }
.dx2-mapcard { position: relative; grid-row: span 2; align-self: stretch; min-height: 420px; overflow: hidden; padding: 0; }
.dx2-mapcard #detailMap { position: absolute; inset: 0; }
@media (max-width: 1080px) { .dx2-grid { grid-template-columns: 1fr; } .dx2-mapcard { grid-row: auto; height: 360px; } }
/* (أُزيل CSS تصميم ٣ «الملف العملياتي» غير المستخدم · اعتُمد تصميم ٢) */
/* نبضة نقطة حيّة خفيفة (لا تغيّر اللون) */
.live-pulse { animation: dotPulse 1.1s ease-in-out infinite; }
@keyframes dotPulse { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: .4; transform: scale(1.35); } }
/* ترويسة نظيفة */
.idt-head { margin-bottom: 18px; }
.idt-title { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.idt-title h2 { font-size: 21px; font-weight: 900; display: flex; align-items: center; gap: 9px; }
.idt-id { color: var(--ink-3); font-size: 12px; font-family: var(--mono); }
.case-chip { font-family: var(--mono); font-weight: 800; font-size: 13px; color: var(--brand);
  border: 1px solid var(--brand-line); border-radius: 999px; padding: 3px 11px; }
.idt-actions { margin-inline-start: auto; display: flex; gap: 8px; }
.idt-meta { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 10px;
  color: var(--ink-2); font-size: 13px; font-weight: 600; }
.idt-meta span { display: inline-flex; align-items: center; gap: 6px; }
/* متتبّع مسار العملية */
.idt-track { margin-bottom: 18px; }
/* تتبّع الفرق — صفوف نظيفة للقراءة (لا أزرار) */
.trk-row { display: flex; align-items: center; gap: 12px; padding: 11px 16px; border-bottom: 1px solid var(--line); }
.trk-row:last-child { border-bottom: 0; }
.trk-ic { flex: 0 0 auto; display: grid; place-items: center; }
.trk-id { font-family: var(--mono); font-weight: 800; font-size: 13px; flex: 0 0 auto; }
.trk-type { color: var(--ink-3); font-size: 12.5px; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.trk-stat { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 12.5px; flex: 0 0 auto; }
/* حقائق البلاغ: مفاتيح/قيم */
.kv-list { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 22px; margin-bottom: 12px; }
.kv { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; border-bottom: 1px dashed var(--line); font-size: 13px; }
.kv-k { color: var(--ink-3); font-weight: 600; }
.kv-v { font-weight: 700; }
.idt-desc { line-height: 1.9; color: var(--ink-2); font-size: 13.5px; margin: 4px 0 0; }
.idt-risks { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 12px; }
.risk-tag { font-size: 12px; font-weight: 700; color: var(--orange, #f0490d); padding: 3px 9px;
  border: 1px solid color-mix(in srgb, var(--orange, #f0490d) 35%, transparent); border-radius: 999px; }
/* إجراءات إدارية لغرفة العمليات (مفصولة بصرياً عن التتبّع) */
.idt-admin { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 18px;
  padding-top: 14px; border-top: 1px solid var(--line); }
.idt-admin-lbl { font-size: 12.5px; color: var(--ink-3); font-weight: 700; }
@media (max-width: 1100px) { .detail-grid { grid-template-columns: 1fr; } }
.timeline { position: relative; padding-inline-start: 22px; }
.timeline::before { content:''; position:absolute; inset-inline-start: 6px; top: 4px; bottom: 4px; width: 2px; background: var(--line); }
.tl-item { position: relative; padding: 0 0 18px; }
.tl-item::before {
  content:''; position:absolute; inset-inline-start: -22px; top: 3px; width: 12px; height: 12px;
  border-radius: 50%; background: #fff; border: 2px solid var(--brand);
}
.tl-item.muted::before { border-color: var(--ink-3); }
.tl-time { font-family: var(--mono); font-size: 11px; color: var(--ink-3); }
.tl-text { font-weight: 600; font-size: 13.5px; margin-top: 2px; }
.tl-text .by { color: var(--ink-3); font-weight: 500; font-size: 12px; }

.media-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.media-tile {
  aspect-ratio: 1; border-radius: var(--r-sm); background: var(--bg-soft);
  border: 1px solid var(--line); display: grid; place-items: center; color: var(--ink-3);
  position: relative; overflow: hidden;
}
.media-tile .tag { position: absolute; bottom: 5px; inset-inline-start: 5px; font-size: 10px; background: rgba(20,24,31,.7); color:#fff; padding: 2px 6px; border-radius: 5px; }

/* crisis (screen 5) */
.pulse { animation: pulse 1.6s ease-in-out infinite; }
@keyframes pulse { 0%,100% { opacity: 1;} 50% { opacity: .55; } }

/* ---------- كونسول إدارة الأزمة السيادي ---------- */
.cz-banner {
  display: flex; align-items: center; gap: 18px; margin-bottom: 14px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--cz) 88%, #000), var(--cz));
  color: #fff; border-radius: var(--r); padding: 15px 20px;
  border-inline-start: 5px solid #fff3; box-shadow: 0 8px 26px color-mix(in srgb, var(--cz) 35%, transparent);
}
.cz-lvl { text-align: center; flex: 0 0 auto; padding-inline-end: 18px; border-inline-end: 1px solid rgba(255,255,255,.25); }
.cz-lvl span { font-size: 11px; opacity: .9; }
.cz-lvl b { display: block; font-size: 22px; font-weight: 900; margin-top: 2px; }
.cz-desc h2 { font-size: 19px; font-weight: 900; }
.cz-desc p { opacity: .92; font-size: 12.5px; margin-top: 3px; }
.cz-metrics { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 14px; }
.cz-stat { background: var(--surface); border: 1px solid var(--line); border-inline-start: 3px solid var(--c); border-radius: var(--r-sm); padding: 13px 15px; }
.cz-k { font-size: 12px; color: var(--ink-3); font-weight: 700; margin-bottom: 6px; }
.cz-v { font-size: 27px; font-weight: 900; color: var(--c); font-variant-numeric: tabular-nums; }
/* قيادة المنطقة/الموحّدة (ICS) · بطاقات قيادة مجمّعة في كونسول الأزمة */
.cc-wrap { margin-bottom: 14px; }
.cc-wrap-head { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 800; color: var(--ink); margin-bottom: 10px; }
.cc-wrap-head .count { background: var(--red-soft); color: var(--red-700); border-radius: var(--r-xs); padding: 1px 8px; font-size: 12px; font-weight: 800; }
.cc-card { background: var(--surface); border: 1px solid var(--line); border-inline-start: 4px solid var(--c); border-radius: var(--r-sm); padding: 12px 14px; margin-bottom: 10px; }
.cc-head { display: flex; align-items: center; gap: 10px 14px; flex-wrap: wrap; margin-bottom: 10px; }
.cc-badge { display: inline-flex; align-items: center; gap: 5px; color: var(--c); font-weight: 800; font-size: 13px; }
.cc-badge.cc-uc { color: #cf4350; }
.cc-title { font-weight: 800; font-size: 13.5px; color: var(--ink); }
.cc-totals { margin-inline-start: auto; font-size: 12px; color: var(--ink-2); font-weight: 700; }
.cc-incs { display: flex; flex-direction: column; gap: 6px; }
.cc-inc { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border: 1px solid var(--line); border-inline-start: 3px solid var(--c); border-radius: var(--r-xs); cursor: pointer; font-size: 12.5px; }
.cc-inc:hover { background: var(--bg-soft); }
.cc-inc-t { font-weight: 700; color: var(--ink); }
.cc-post { color: var(--brand); font-size: 11px; font-weight: 800; }
.cc-inc-id { color: var(--ink-2); font-weight: 700; }
.cc-inc-loc { color: var(--ink-3); font-weight: 600; }
.cc-inc-u { margin-inline-start: auto; color: var(--ink-2); font-weight: 700; white-space: nowrap; }
/* كونسول الأزمة · masonry (أعمدة) — لا يقترن ارتفاع الصفوف فلا يظهر فراغ كبير بجانب البطاقة المدمجة
   عندما تكون قائمة الجهات أطول من لوحة الحوادث. responsive ذاتيّاً (min 300px → يقلّل الأعمدة على الضيّق). */
.cz-layout { columns: 3 300px; column-gap: 14px; }
.cz-layout > .cz-merged { column-span: all; margin-bottom: 14px; }   /* الحوادث + الإخلاء كامل العرض أعلى */
.cz-side { display: contents; }   /* البطاقات تتدفّق في الأعمدة بدل عمود واحد ضيّق */
.cz-side > .card, .cz-side > .cz-stack { break-inside: avoid; margin-bottom: 14px; }
/* تنسيق الجهات · صفّ مدمج سطر واحد (اسم · هاتف · حالة) بدل صفّ ضخم بأيقونة وسطرين */
.ag-coord { display: flex; align-items: center; gap: 8px; padding: 6px 13px; border-bottom: 1px solid var(--line); font-size: 12.5px; }
.ag-coord:last-child { border-bottom: 0; }
.ag-coord-ic { flex: 0 0 auto; display: inline-flex; }
.ag-coord-n { font-weight: 700; color: var(--ink); flex: 1; min-width: 0; }
.ag-coord-inc { color: var(--ink-3); font-weight: 600; font-size: 11px; }
.ag-coord-ph { color: var(--ink-3); font-size: 11px; white-space: nowrap; display: inline-flex; align-items: center; gap: 3px; }
.ag-coord .chip { white-space: nowrap; font-weight: 800; }
/* صفحات الموارد المنفصلة: المراكز الطبية · الملاجئ · النازحون — بطاقات بنمط .kpi/.rd-scard المعتمد
   (خلفية مرتفعة bg-elev + حدّ واضح + ظلّ + شريط لوني · لا نمط مسطّح) */
.res-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 14px; }
.res-kpi { background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r); padding: 13px 15px; box-shadow: var(--shadow-sm); position: relative; overflow: hidden; }
.res-kpi::before { content: ''; position: absolute; inset-inline-start: 0; top: 0; bottom: 0; width: 3px; background: var(--c); opacity: .9; }
.res-kpi-v { font-family: var(--mono); font-size: 28px; font-weight: 700; color: var(--ink); line-height: 1.1; }
.res-kpi-k { font-size: 12px; color: var(--ink-3); font-weight: 600; margin-top: 5px; }
.res-actions { margin-bottom: 14px; }
.res-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(258px, 1fr)); gap: 12px; }
.res-card { background: var(--bg-elev); border: 1px solid var(--line); border-inline-start: 3px solid var(--c); border-radius: var(--r); padding: 14px 16px; box-shadow: var(--shadow-sm); transition: border-color .15s, box-shadow .15s; }
.res-card:hover { border-color: var(--line-strong); box-shadow: 0 4px 14px rgba(20,24,31,.10); }
.res-card-h { display: flex; align-items: center; gap: 8px; margin-bottom: 11px; font-size: 13.5px; }
.res-card-h b { color: var(--ink); flex: 1; min-width: 0; }
.res-card-ic { display: inline-flex; flex: 0 0 auto; }
.res-tag { font-size: 11.5px; font-weight: 800; white-space: nowrap; }
.res-bar { height: 6px; background: var(--bg-soft); border-radius: 4px; overflow: hidden; margin-bottom: 9px; }
.res-bar-fill { height: 100%; border-radius: 4px; }
.res-card-m { display: flex; justify-content: space-between; gap: 10px; font-size: 12.5px; color: var(--ink-2); font-weight: 600; padding: 2px 0; }
.res-card-m b { color: var(--ink); font-weight: 700; }
.res-list { display: flex; flex-direction: column; gap: 8px; }
.res-row { display: flex; align-items: center; gap: 12px; background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r); padding: 11px 15px; font-size: 13px; box-shadow: var(--shadow-sm); }
.res-row-ic { flex: 0 0 auto; display: inline-flex; }
.res-row-n { font-weight: 700; color: var(--ink); flex: 1; display: flex; flex-direction: column; }
.res-row-sub { font-size: 11.5px; color: var(--ink-3); font-weight: 600; margin-top: 2px; }
.res-row-sh { color: var(--ink-2); font-weight: 600; display: inline-flex; align-items: center; gap: 4px; }
/* شرائح الفئات الهشّة (اختيار متعدّد · على نمط .fchip · مستطيلة لا بيضوية · قاعدة المشروع)
   appearance:none + font-family صريح يمنعان مظهر زرّ النظام (برواز/خط Win98 على عنصر button) */
.vuln-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.vuln-chip { appearance: none; -webkit-appearance: none; font-family: 'Qomra', sans-serif;
  font-size: 12.5px; font-weight: 800; padding: 7px 15px; border-radius: 9px;
  border: 1.5px solid var(--line-strong); background: transparent; color: var(--ink-2);
  cursor: pointer; line-height: 1; transition: background .12s, color .12s, border-color .12s; }
.vuln-chip:hover { border-color: var(--brand); color: var(--ink); }
.vuln-chip.on { background: var(--brand); color: #fff; border-color: var(--brand); }
/* منتقي هدف الإنذار (منطقة/مناطق/محافظة/وطني) + شرائح المحافظات (مستطيلة · قمرة) */
.al-scope-chips, .al-gov-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.al-scope-chip, .al-gov-chip { appearance: none; -webkit-appearance: none; font-family: 'Qomra', sans-serif;
  font-size: 12.5px; font-weight: 700; padding: 7px 14px; border-radius: var(--r-sm);
  border: 1px solid var(--line-strong); background: var(--bg-soft); color: var(--ink-2);
  cursor: pointer; line-height: 1; transition: background .12s, color .12s, border-color .12s; }
.al-scope-chip:hover, .al-gov-chip:hover { border-color: var(--brand); color: var(--ink); }
.al-scope-chip.on, .al-gov-chip.on { background: var(--brand); color: #fff; border-color: var(--brand); }
.al-zones-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
/* زرّ بارز: إنذار المواطنين (وظيفة قيادية محورية · غرفة العمليات) */
.alert-cta { display: inline-flex; align-items: center; gap: 7px; font-family: 'Qomra', sans-serif;
  font-size: 13px; font-weight: 800; padding: 8px 15px; border-radius: var(--r-sm); background: #cf4350;
  color: #fff; border: none; cursor: pointer; white-space: nowrap; box-shadow: 0 1px 6px rgba(207,67,80,.35); }
.alert-cta:hover { filter: brightness(1.08); }
.alert-cta:active { filter: brightness(.94); }
/* سلايدر نصف القطر (سحب سريع) · ثوب مستطيل متّسق */
.al-slider { width: 100%; height: 7px; -webkit-appearance: none; appearance: none; background: var(--line-strong);
  border-radius: var(--r-xs); outline: none; margin-top: 9px; cursor: pointer; }
.al-slider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 18px; height: 22px;
  border-radius: var(--r-xs); background: var(--brand); cursor: pointer; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.3); }
.al-slider::-moz-range-thumb { width: 18px; height: 22px; border-radius: var(--r-xs); background: var(--brand);
  cursor: pointer; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.3); }
.al-quick { color: var(--brand); font-weight: 700; }
/* زرّ إنهاء (إلغاء) التنبيه في نافذته على الخريطة */
.alr-cancel { margin-top: 8px; font-family: 'Qomra', sans-serif; font-size: 12px; font-weight: 800;
  padding: 6px 13px; border-radius: var(--r-xs); background: #cf4350; color: #fff; border: none; cursor: pointer; }
.alr-cancel:hover { filter: brightness(1.08); }
/* الإسناد المتبادل بين المحافظات (phase 4) */
.aid-card { background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow-sm); padding: 11px 13px; margin-bottom: 10px; }
.aid-top { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.aid-top .mono { color: var(--brand); font-weight: 700; font-size: 12px; }
.aid-meta { color: var(--ink-2); font-size: 12.5px; margin-top: 5px; }
.aid-note { color: var(--ink-3); font-size: 12px; margin-top: 4px; }
.aid-acts { display: flex; gap: 8px; margin-top: 9px; flex-wrap: wrap; }
.aid-vrow { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 4px; border-bottom: 1px solid var(--line); font-size: 13px; }
.mini-toast { position: fixed; top: 64px; inset-inline-start: 50%; transform: translateX(-50%); z-index: 4000;
  background: var(--brand); color: #fff; padding: 10px 18px; border-radius: var(--r-sm); box-shadow: var(--shadow); font-size: 13px; font-weight: 700; }
/* البطاقة المدمجة: الحوادث الحرجة + مناطق الإخلاء أفقياً جنباً إلى جنب */
.cz-merged { display: grid; grid-template-columns: 1fr 1fr; padding: 0; align-items: stretch; }
.cz-merged-col { min-width: 0; display: flex; flex-direction: column; }
.cz-merged-sep { border-inline-start: 1px solid var(--line); }
/* عمود يجمع بطاقتين عموديّاً (التنبيهات فوق · السلامة تحتها) */
.cz-stack { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.cz-inc { display: flex; align-items: center; gap: 12px; padding: 12px 15px; border-bottom: 1px solid var(--line); border-inline-start: 3px solid var(--c); cursor: pointer; transition: background .12s; }
.cz-inc:hover { background: var(--bg-soft); }
.cz-inc-ic { flex: 0 0 auto; display: grid; place-items: center; width: 30px; }
.cz-inc-main { flex: 1; min-width: 0; }
.cz-inc-t { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.cz-inc-id { font-size: 10.5px; color: var(--ink-3); }
.cz-inc-sub { display: flex; align-items: center; gap: 5px; color: var(--ink-3); font-size: 12px; margin-top: 3px; }
.cz-inc-meta { flex: 0 0 auto; text-align: left; font-size: 11.5px; color: var(--ink-2); font-weight: 700; }
.cz-inc-meta span { display: block; }
.cz-inc-resp { color: var(--ink-3); font-weight: 600; font-variant-numeric: tabular-nums; }
@media (max-width: 1200px) { .cz-metrics { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px) { .cz-metrics { grid-template-columns: repeat(2,1fr); } }

.zone-row { display:flex; align-items:center; gap:11px; padding:11px 15px; border-bottom:1px solid var(--line); }
.zone-ic { width:30px; display:grid; place-items:center; color:var(--red); flex:0 0 auto;}

.empty { display: grid; place-items: center; height: 100%; color: var(--ink-3); gap: 10px; text-align: center; }
.empty svg { width: 46px; height: 46px; opacity: .4; }

/* chart canvas */
.chart-box { position: relative; height: 260px; }

/* ============================================================
   Auth / Login
   ============================================================ */
.auth-wrap {
  min-height: 100vh; min-height: 100dvh;   /* min لا height ثابت · فيسكرل عند طول البطاقة على الموبايل */
  display: grid; place-items: center; padding: 20px 16px 40px;
  background:
    radial-gradient(900px 500px at 85% -10%, rgba(3,28,166,.08), transparent 60%),
    radial-gradient(700px 500px at 0% 110%, rgba(246,203,47,.06), transparent 55%),
    var(--bg);
  position: relative;   /* أُزيل overflow:hidden — كان يقصّ البطاقة الطويلة بلا سكرول */
}
.auth-card {
  width: 100%; max-width: 468px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: 18px; box-shadow: var(--shadow-lg); overflow: hidden;
}
.auth-top { height: 4px; background: linear-gradient(90deg, var(--brand-700), var(--brand), #3a5bff); }
.auth-body { padding: 34px 40px 30px; }
.auth-brand { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; margin-bottom: 24px; }
.auth-brand .t { font-weight: 900; font-size: 22px; }
.auth-brand .s { color: var(--ink-3); font-size: 13px; }
.field { margin-bottom: 16px; }
.field label { display: block; font-size: 13px; font-weight: 700; color: var(--ink-2); margin-bottom: 7px; }
.auth-input {
  width: 100%; padding: 12px 14px; font-family: 'Qomra'; font-size: 14.5px;
  background: var(--bg-soft); border: 1px solid var(--line-strong); border-radius: var(--r-sm);
  color: var(--ink); transition: border-color .15s, box-shadow .15s; outline: none;
}
.auth-input::placeholder { color: var(--ink-3); }
.auth-input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(3,28,166,.14); background: #fff; }
/* عين إظهار/إخفاء كلمة المرور (داخل الحقل · على اليسار في RTL) */
.pass-wrap { position: relative; }
.pass-wrap .auth-input { padding-inline-end: 44px; }
.pass-eye { position: absolute; inset-inline-end: 6px; top: 50%; transform: translateY(-50%);
  background: none; border: none; color: var(--ink-3); cursor: pointer; padding: 7px; display: flex;
  border-radius: 6px; transition: color .15s; }
.pass-eye:hover, .pass-eye.on { color: var(--brand); }
.field-row { display: flex; gap: 12px; }
.field-row .field { flex: 1; }
/* موبايل: المركز ورمز التحقق تحت بعض (المركز لا يتّسع لاسمه في صفّ واحد) · تجاوز flex المضمّن لرمز التحقق */
@media (max-width: 520px){
  .field-row { flex-direction: column; gap: 0; }
  .field-row .field { flex: 1 1 auto !important; }
}
.auth-note { text-align: center; font-size: 12px; color: var(--ink-3); margin-top: 16px; line-height: 1.7; }
.auth-foot { text-align: center; font-size: 11.5px; color: var(--ink-3); padding: 14px; border-top: 1px solid var(--line); background: var(--bg-soft); }
.mfa-hint { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--ink-3); margin-top: -6px; margin-bottom: 14px; }

/* ============================================================
   Modal + Forms
   ============================================================ */
.modal-overlay {
  position: fixed; inset: 0; background: rgba(20,24,31,.45); backdrop-filter: blur(2px);
  display: none; place-items: center; z-index: 1000; padding: 20px;
}
.modal-overlay.open { display: grid; }
.modal-card {
  background: var(--bg-elev); border-radius: 16px; box-shadow: var(--shadow-lg);
  width: 100%; max-width: 560px; max-height: 88vh; overflow: hidden;
  display: flex; flex-direction: column; animation: modal-in .2s ease;
}
@keyframes modal-in { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }
.modal-head { display: flex; align-items: center; gap: 10px; padding: 15px 18px; border-bottom: 1px solid var(--line); }
.modal-head h3 { font-size: 16px; font-weight: 800; display: flex; align-items: center; gap: 9px; }
.modal-head .x { margin-inline-start: auto; }
.modal-body { padding: 16px 18px 26px; overflow-y: auto; }
.modal-foot { padding: 13px 18px; border-top: 1px solid var(--line); display: flex; gap: 10px; background: var(--bg-soft); }

.form-row { margin-bottom: 14px; }
.form-row label { display: block; font-size: 13px; font-weight: 700; color: var(--ink-2); margin-bottom: 6px; }
.form-control {
  width: 100%; padding: 10px 12px; font-family: 'Qomra'; font-size: 14px;
  background: var(--bg-soft); border: 1px solid var(--line-strong); border-radius: 10px;
  color: var(--ink); outline: none; transition: border-color .15s, box-shadow .15s;
}
/* تفاعل الحقل ذهبيّ #f6cb2f (هوفر/تركيز) · لا بياض · النص والخلفية يتبعان الثيم */
.form-control:hover { border-color: #f6cb2f; }
.form-control:focus { border-color: #f6cb2f; box-shadow: 0 0 0 3px rgba(246,203,47,.20); background: var(--bg-elev); color: var(--ink); }
/* القوائم المنسدلة تتبع color-scheme الجذر (لا تفضيل نظام التشغيل) · خلفية ونص داكنان */
html.dark select.form-control { background: var(--bg-elev); color: var(--ink); }
html.dark select.form-control option { background: var(--bg-elev); color: var(--ink); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
#pickMap { height: 220px; border-radius: 10px; border: 1px solid var(--line); }
/* صفحة البلاغات — نموذج جانبي + خريطة كبيرة مهيمنة لتحديد الموقع */
.intake-layout { display: grid; grid-template-columns: minmax(380px, 440px) 1fr; gap: 14px; align-items: stretch; }
.intake-form .card-body { max-height: calc(100vh - 150px); overflow-y: auto; }
.intake-map-card { display: flex; flex-direction: column; }
.intake-map { height: calc(100vh - 150px); min-height: 460px; width: 100%; }
.type-other span:first-child { line-height: 1; }
@media (max-width: 1100px) { .intake-layout { grid-template-columns: 1fr; } .intake-map { height: 360px; } }
.pick-hint { font-size: 12px; color: var(--ink-3); margin-top: 6px; }

.type-select-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.type-opt {
  display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 9px 4px;
  border: 1px solid var(--line); border-radius: 10px; cursor: pointer; font-size: 11.5px;
  font-weight: 600; color: var(--ink-2); transition: all .12s; text-align: center;
}
.type-opt:hover { background: var(--bg-soft); }
.type-opt.sel { border-color: var(--brand); background: transparent; color: var(--brand); font-weight: 800; }

.reco-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: var(--bg-soft); border: 1px solid var(--line); color: var(--ink); border-radius: 10px; padding: 10px 12px; margin-bottom: 11px; font-size: 13px; }
/* اختيار المركز المستجيب في لوحة الإرسال */
.disp-station { border: 1px solid var(--brand); border-radius: 10px; padding: 11px 12px; margin-bottom: 12px; background: var(--bg-soft); }
.disp-station-lbl { display: flex; align-items: center; gap: 6px; font-weight: 800; font-size: 12.5px; color: var(--brand); margin-bottom: 9px; }
.disp-station-row { display: flex; align-items: center; gap: 9px; }
.disp-station-row select { flex: 1; min-width: 0; }
.disp-station-row .btn { white-space: nowrap; }
/* بطاقات المركبات المتاحة لكل مركز (إرسال بالنوع والعدد + مؤازرة) */
.dv-banner { display: flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--ink-2); margin: 4px 0 11px; }
.dv-banner.backup { color: var(--lv4); font-weight: 700; }
.dv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(232px, 1fr)); gap: 10px; }
.dv-card { display: flex; align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px; background: var(--bg-elev); }
.dv-card.dv-reco { border-color: var(--brand); }
.dv-ic { width: 32px; flex: 0 0 auto; display: grid; place-items: center; color: var(--brand); }
.dv-main { flex: 1; min-width: 0; }
.dv-type { font-weight: 800; font-size: 13px; }
.dv-avail { font-size: 11px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.dv-count { width: 48px; flex: 0 0 auto; padding: 6px; font-size: 13px; text-align: center; border: 1px solid var(--line); border-radius: 7px; background: var(--bg-elev); color: var(--ink); font-family: var(--mono); }
.dv-send { white-space: nowrap; }
/* منتقي الجهة (طلب إسناد) */
.ag-kinds { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 8px; margin-top: 8px; }
.ag-kind { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 11px 8px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg-elev); color: var(--ink-2); cursor: pointer; font-size: 12px; font-weight: 700; font-family: inherit; transition: border-color .12s, color .12s; }
.ag-kind svg { color: var(--brand); }
.ag-kind:hover { border-color: var(--brand); }
.ag-kind.sel { border-color: var(--brand); color: var(--brand); box-shadow: inset 0 0 0 1px var(--brand); }
/* ---------------- مؤقتات الأداء (SLA) ---------------- */
.sla-chip { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 800; color: var(--ink-3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.sla-ok   { color: var(--ok); }
.sla-warn { color: var(--warn); }
.sla-late { color: var(--lv4); }
.sla-live { animation: slaPulse 1.6s ease-in-out infinite; }
@keyframes slaPulse { 0%,100% { opacity: 1; } 50% { opacity: .62; } }
.sla-card .card-body { padding-top: 12px; }
.sla-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.sla-tile { background: var(--bg-soft); border: 1px solid var(--line); border-radius: 11px; padding: 11px 12px; text-align: center; }
.sla-k { font-size: 11.5px; color: var(--ink-3); font-weight: 700; margin-bottom: 5px; }
.sla-v { font-size: 21px; font-weight: 900; font-variant-numeric: tabular-nums; color: var(--ink-1); display: inline-block; }
.sla-v.sla-ok { color: #15823f; } .sla-v.sla-warn { color: #a9690a; } .sla-v.sla-late { color: var(--red-700); }
.sla-t { font-size: 10.5px; color: var(--ink-3); margin-top: 4px; }
.sla-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 18px; }
.sla-card-big { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; }
.sla-card-big .sla-k { font-size: 12.5px; margin-bottom: 8px; }
.sla-card-big .sla-v { font-size: 30px; }
.sla-row { display: grid; grid-template-columns: 2fr 1fr 1.3fr 1.3fr; align-items: center; padding: 11px 16px; border-bottom: 1px solid var(--line); font-size: 13px; font-variant-numeric: tabular-nums; }
.sla-row:last-child { border-bottom: none; }
.sla-row.sla-head { color: var(--ink-3); font-weight: 800; font-size: 11.5px; background: var(--bg-soft); }
.sla-row .sla-name { font-weight: 700; color: var(--ink-1); }
.sla-row .sla-v { font-size: 14px; }
/* أداء الاستجابة لكل مركز · بطاقات مهيكلة مدمجة (شبكة) بدل الجدول الطويل */
.sla-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(196px, 1fr)); gap: 12px; padding: 16px; }
.sla-scard { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px;
  border-inline-start: 3px solid var(--line); }
.sla-scard.sla-ok   { border-inline-start-color: #15823f; }
.sla-scard.sla-warn { border-inline-start-color: #a9690a; }
.sla-scard.sla-late { border-inline-start-color: var(--red); }
.sla-scard-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.sla-scard-n { font-weight: 800; font-size: 13px; color: var(--ink-1); }
.sla-scard-c { font-size: 11px; color: var(--ink-3); white-space: nowrap; }
.sla-scard-m { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sla-scard-l { font-size: 10.5px; color: var(--ink-3); margin-bottom: 3px; }
.sla-scard .sla-v { font-size: 16px; }
@media (max-width: 1100px) { .sla-cards, .sla-strip { grid-template-columns: repeat(2, 1fr); } }
/* ---------------- كشف التكرار والدمج ---------------- */
.merge-banner { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: var(--bg-soft); border: 1px solid var(--line); color: var(--ink); border-radius: 10px; padding: 9px 13px; margin-bottom: 12px; font-size: 13px; font-weight: 700; }
.merge-banner > span { display: inline-flex; align-items: center; gap: 7px; }
.rel-row { display: flex; align-items: center; gap: 11px; padding: 11px 14px; border-top: 1px solid var(--line); }
.rel-row .unit-ic { flex: none; width: 30px; display: flex; align-items: center; justify-content: center; }
.rel-row .unit-main { flex: 1; min-width: 0; }
.rel-row .unit-name { display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: 13.5px; }
.rel-row .unit-sub { display: flex; align-items: center; gap: 5px; color: var(--ink-3); font-size: 12px; margin-top: 3px; }
/* ---------------- القيادة الميدانية (Field Command) ---------------- */
.fc-label { font-size: 12px; color: var(--ink-3); font-weight: 700; margin-bottom: 7px; }
.fc-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.fc-actions .btn { font-size: 11.5px; padding: 4px 9px; }
.fc-board { display: flex; flex-direction: column; gap: 7px; }
.fc-task { display: flex; align-items: center; gap: 10px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg-soft); }
.fc-task-main { flex: 1; min-width: 0; }
.fc-task-title { font-weight: 700; font-size: 13px; display: flex; align-items: center; gap: 7px; }
.fc-task-sub { display: flex; align-items: center; gap: 6px; color: var(--ink-3); font-size: 11.5px; margin-top: 4px; }
.fc-task-acts { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; flex: none; }
/* تقييم المخاطر الميدانية — العامل المُفعَّل يأخذ صبغة الخطر (أحمر) */
.fc-risks { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 13px; }
.risk-chip { font-size: 11.5px; font-weight: 700; padding: 4px 11px; border-radius: 20px; border: 1px solid var(--line); background: var(--bg-soft); color: var(--ink-3); cursor: pointer; transition: background .12s, color .12s, border-color .12s; }
.risk-chip:hover { border-color: var(--red-line); color: var(--red-700); }
.risk-chip.on { background: var(--red-soft); border-color: var(--red-line); color: var(--red-700); }
.rep-risks { display: flex; flex-wrap: wrap; gap: 7px; }
.rep-risk { font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 6px; background: #fdecec; color: #a5111a; border: 1px solid #f6cdcf; }
/* لوحة مهام Kanban — أعمدة بالحالة */
.kanban { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.kb-col { background: var(--bg-soft); border: 1px solid var(--line); border-radius: 11px; padding: 9px; min-height: 64px; }
.kb-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.kb-count { font-size: 11px; font-weight: 800; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.kb-body { display: flex; flex-direction: column; gap: 7px; }
.kb-empty { text-align: center; color: var(--ink-3); font-size: 16px; padding: 6px 0; opacity: .5; }
.kb-card { background: var(--bg-elev); border: 1px solid var(--line); border-radius: 9px; padding: 8px 9px; }
.kb-card.done { opacity: .62; }
.kb-card.done .kb-title { text-decoration: line-through; }
.kb-card-top { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-bottom: 5px; }
.kb-x { background: none; border: none; color: var(--ink-3); cursor: pointer; padding: 2px; border-radius: 5px; display: inline-flex; }
.kb-x:hover { color: var(--red-700); background: var(--red-soft); }
.kb-title { font-weight: 700; font-size: 12.5px; line-height: 1.5; }
.kb-assignee { display: flex; align-items: center; gap: 5px; color: var(--ink-3); font-size: 11px; margin-top: 4px; }
.kb-acts { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 7px; }
@media (max-width: 760px) { .kanban { grid-template-columns: 1fr; } }
/* ---------------- تقرير الحادث (وثيقة قابلة للطباعة) ---------------- */
.report-ov { position: fixed; inset: 0; z-index: 4000; background: rgba(10,12,16,.78); overflow: auto; display: none; padding: 28px 16px; }
.report-ov.open { display: block; }
/* وثيقة بيضاء ثابتة بغضّ النظر عن ثيم التطبيق (تقرير رسمي) */
.report-doc { max-width: 920px; margin: 0 auto; background: #fff; color: #1a1f29; border-radius: 12px; padding: 30px 34px; box-shadow: 0 18px 60px rgba(0,0,0,.4); font-size: 13.5px; line-height: 1.7; }
.report-actions { display: flex; gap: 8px; justify-content: flex-start; margin-bottom: 18px; }
.rep-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 14px; border-bottom: 2px solid #1a1f29; }
.rep-brand { display: flex; align-items: center; gap: 12px; }
.rep-logo { display: inline-flex; }
.rep-org { font-size: 18px; font-weight: 900; color: #0b0e13; }
.rep-sub { font-size: 12px; color: #5a6472; margin-top: 2px; }
.rep-meta { text-align: left; font-size: 12px; color: #5a6472; }
.rep-meta b { color: #031ca6; font-size: 15px; }
.rep-sevbar { height: 5px; border-radius: 3px; margin: 12px 0 4px; }
.rep-sec { margin-top: 20px; }
.rep-sec > h2 { font-size: 14.5px; font-weight: 900; color: #0b0e13; border-inline-start: 4px solid #031ca6; padding-inline-start: 9px; margin-bottom: 11px; }
.rep-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 7px 22px; }
.rep-kv { display: flex; align-items: baseline; gap: 8px; justify-content: space-between; border-bottom: 1px dashed #e2e6ec; padding: 5px 0; }
.rep-kv > span { color: #5a6472; font-size: 12.5px; }
.rep-kv > b { font-weight: 800; color: #1a1f29; }
.rep-kv .sla-ok { color: #15823f; } .rep-kv .sla-warn { color: #a9690a; } .rep-kv .sla-late { color: #e11d2a; }
.rep-target { color: #909aa6; font-weight: 600; font-size: 11px; }
.rep-desc { margin-top: 11px; padding: 10px 12px; background: #f5f7fa; border-radius: 8px; color: #333a45; }
.rep-list { margin: 4px 0 0; padding-inline-start: 22px; font-size: 12.5px; color: #333a45; line-height: 1.9; }
.rep-list li { margin-bottom: 2px; }
.rep-tbl { width: 100%; border-collapse: collapse; margin-top: 4px; font-size: 12.5px; }
.rep-tbl th { text-align: right; background: #f0f2f6; color: #4a5462; font-weight: 800; padding: 7px 9px; border: 1px solid #e2e6ec; font-size: 11.5px; }
.rep-tbl td { padding: 7px 9px; border: 1px solid #e7eaef; color: #2a313c; vertical-align: top; }
.rep-timeline .rep-time { white-space: nowrap; color: #5a6472; font-variant-numeric: tabular-nums; }
.rep-empty { color: #909aa6; font-size: 12.5px; padding: 6px 0; }
.rep-chain { border: 1px solid #cfe7d8; background: #f3faf5; border-radius: 10px; padding: 13px 15px; }
.rep-chain.bad { border-color: #f3c9cc; background: #fdf3f4; }
.rep-chain-h { display: flex; align-items: center; gap: 8px; font-weight: 900; color: #0b0e13; margin-bottom: 10px; }
.rep-hash { margin-top: 9px; font-size: 11px; color: #5a6472; word-break: break-all; }
.rep-foot { margin-top: 24px; padding-top: 14px; border-top: 1px solid #e2e6ec; font-size: 11.5px; color: #5a6472; }
.rep-sign { display: flex; justify-content: space-between; margin-top: 26px; color: #1a1f29; font-size: 12.5px; }
.report-doc .mono { font-family: ui-monospace, "Cascadia Code", Consolas, monospace; }
/* الطباعة: تُطبع الوثيقة فقط، بخلفية بيضاء */
/* طباعة موحّدة لطبقتَي التقرير ومنطقة الإخلاء (كانتا قاعدتين متعارضتين تُخفي إحداهما الأخرى → طباعة فارغة) */
@media print {
  body > *:not(.report-ov):not(.evac-print-ov) { display: none !important; }
  .report-ov.open, .evac-print-ov { position: static !important; background: #fff; padding: 0; overflow: visible; }
  .report-doc, .evac-print-ov .epx-doc { box-shadow: none; max-width: none; border-radius: 0; }
  .report-actions, .epx-actions { display: none !important; }
  .rep-sec, .rep-kv, .rep-tbl tr, .epx-kv { page-break-inside: avoid; }
}
/* ---------------- شبكة حارس ---------------- */
.hs-gate { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 13px 16px; margin-bottom: 14px; }
.hs-profile { display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: 13.5px; color: var(--ink-1); }
.hs-flags { display: flex; gap: 8px; flex-wrap: wrap; }
.hs-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 14px; }
.hs-stat { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; }
.hs-k { font-size: 12px; color: var(--ink-3); font-weight: 700; margin-bottom: 6px; }
.hs-v { font-size: 26px; font-weight: 900; color: var(--ink-1); font-variant-numeric: tabular-nums; }
.hs-composer { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.hs-composer .form-control { width: auto; flex: 1 1 220px; min-width: 200px; }   /* سلكشن بحجم مناسب وخط قمرة */
/* ترويسة شاشة شبكة حارس: العنوان يميناً + شارتا الحالة مقابله (يساراً) */
.hs-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.hs-title-l { display: inline-flex; align-items: center; gap: 9px; }
.hs-title-chips { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
/* قدرات الشبكة الميدانية المباشرة (الحقيقية) · بطاقات أفقية مدمجة */
.hs-caps { display: flex; flex-wrap: wrap; gap: 10px; }
.hs-cap { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 10px; padding: 9px 12px; background: var(--surface); }
.hs-cap-ic { flex: none; display: inline-flex; align-items: center; }
.hs-cap-t { font-weight: 800; font-size: 13px; color: var(--ink-1); white-space: nowrap; }
/* سجلّ الشبكة المُهيكَل: حادث ← حالة ← سجلّات (مجموعات قابلة للطيّ + فلترة) */
.mg-group { border-top: 1px solid var(--line); }
.mg-group:first-child { border-top: none; }
.mg-head { display: flex; align-items: center; gap: 10px; padding: 12px 15px; cursor: pointer; }
.mg-head:hover { background: var(--surface); }
.mg-title { font-weight: 800; font-size: 13.5px; flex: none; }
.mg-badges { flex: 1; display: flex; gap: 6px; flex-wrap: wrap; }
.mg-body:not(:empty) { border-top: 1px dashed var(--line); background: var(--surface); }
.mg-filters { display: flex; gap: 7px; flex-wrap: wrap; padding: 10px 15px; }
.mg-fchip { font-size: 11.5px; font-weight: 700; color: var(--ink-2); border: 1px solid var(--line); border-radius: 7px; padding: 4px 10px; cursor: pointer; }
.mg-fchip.on { color: #fff; background: var(--brand); border-color: var(--brand); }
/* تسجيلات السلامة على شبكة حارس */
.hs-safe { display: flex; align-items: center; gap: 11px; padding: 10px 15px; border-top: 1px solid var(--line); }
.hs-safe:first-child { border-top: none; }
.hs-safe-main { flex: 1; min-width: 0; }
.hs-safe-n { font-weight: 800; font-size: 13.5px; }
.hs-safe-s { color: var(--ink-3); font-size: 12px; margin-top: 2px; }
.hs-msg { display: flex; align-items: center; gap: 11px; padding: 11px 15px; border-top: 1px solid var(--line); }
.hs-msg:first-child { border-top: none; }
.hs-msg-ic { flex: none; width: 30px; display: flex; align-items: center; justify-content: center; }
.hs-msg-main { flex: 1; min-width: 0; }
.hs-msg-t { display: flex; align-items: center; gap: 7px; font-weight: 800; font-size: 13.5px; }
.hs-msg-s { display: flex; align-items: center; gap: 5px; color: var(--ink-3); font-size: 12px; margin-top: 3px; }
.hs-msg-st { display: flex; align-items: center; gap: 8px; flex: none; }
.hs-gw { font-size: 11px; color: #2563eb; font-weight: 700; }
.hs-time { font-size: 11px; color: var(--ink-3); white-space: nowrap; }
@media (max-width: 1100px) { .hs-stats { grid-template-columns: repeat(2, 1fr); } }
/* ---------------- الإعدادات ---------------- */
.set-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; align-items: start; }
.set-col { display: flex; flex-direction: column; gap: 14px; }   /* عمود إعدادات · بطاقات متراصّة عموديّاً */
.set-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px dashed var(--line); font-size: 13px; }
.set-row:last-child { border-bottom: none; }
.set-row > span { color: var(--ink-3); }
.set-row > b { color: var(--ink-1); font-weight: 800; text-align: left; }
/* صفّ قيمة بجانب مسمّاها على اليمين (لا دفعها لأقصى اليسار) · بطاقة الحساب والجلسة */
.set-row.kv-right { justify-content: flex-start; gap: 8px; }
.set-row.kv-right > b { text-align: right; }
.set-label { font-size: 12px; color: var(--ink-3); font-weight: 700; margin-bottom: 7px; }
.set-opts { display: flex; flex-wrap: wrap; gap: 7px; }
.set-opt { font-size: 12.5px; font-weight: 700; padding: 6px 14px; border-radius: 9px; border: 1px solid var(--line); background: var(--bg-soft); color: var(--ink-2); cursor: pointer; transition: all .12s; }
.set-opt:hover { border-color: var(--brand-line); color: var(--brand); }
.set-opt.on { background: transparent; border-color: var(--brand); color: var(--brand); font-weight: 800; }
.set-hint { font-size: 11.5px; color: var(--ink-3); margin-top: 9px; line-height: 1.7; }
/* أزرار «الإدارة والتهيئة» المدمجة (شبكة عمودين · كل زر يفتح نافذته) */
.set-mbtns { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.set-mbtn { display: flex; align-items: center; gap: 9px; justify-content: flex-start; padding: 12px 14px; font-size: 13.5px; font-weight: 700; }
@media (max-width: 1100px) { .set-grid { grid-template-columns: 1fr; } .set-mbtns { grid-template-columns: 1fr; } }
.cred-box { background: var(--bg-soft); border: 1px solid var(--line-strong); border-radius: 11px; padding: 10px 14px; }
.cred-box .set-row { border-bottom-color: var(--line); }
.cred-box .mono { font-size: 15px; color: var(--brand); }
/* شريط التنقّل بين الحوادث داخل صفحة التفاصيل */
.inc-nav { display: flex; gap: 7px; overflow-x: auto; padding-bottom: 10px; margin-bottom: 12px; border-bottom: 1px solid var(--line); }
.inc-nav-item { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; flex: 0 0 auto;
  padding: 6px 12px; border-radius: 9px; border: 1px solid var(--line); background: var(--bg-soft);
  color: var(--ink-2); font-weight: 700; font-size: 12.5px; cursor: pointer; transition: background .12s, color .12s, border-color .12s; }
.inc-nav-item:hover { border-color: var(--brand-line); color: var(--ink); }
.inc-nav-item.on { background: transparent; border-color: var(--brand); color: var(--brand); font-weight: 800; }
.state-steps { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.state-steps .step { padding: 3px 10px; border-radius: 20px; background: transparent; border: 1px solid var(--line); color: var(--ink-3); font-weight: 700; font-size: 11.5px; }
.state-steps .step.done { color: var(--ok); border-color: color-mix(in srgb, var(--ok) 40%, transparent); }
.state-steps .step.cur { color: var(--brand); border-color: var(--brand); font-weight: 800; }
.state-steps .step-sep { color: var(--ink-3); font-size: 12px; }
.crew-row { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--line); }
.crew-row:last-child { border-bottom: none; }
.sug-row { display: flex; align-items: center; gap: 11px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 10px; margin-bottom: 8px; }
.sug-main { flex: 1; min-width: 0; }
.sug-dist { font-family: var(--mono); font-size: 12px; color: var(--ink-2); margin-top: 2px; }

/* Vehicle markers — مركبة طوارئ top-down واقعية */
.veh-marker2 { position: relative; width: 30px; height: 46px; filter: drop-shadow(0 2px 4px rgba(0,0,0,.5)); }
.veh-rot { position: absolute; left: 2px; top: 0; width: 26px; height: 46px; transform-origin: 13px 23px; transition: transform .5s ease; }
.veh-glyph { position: absolute; left: 0; top: 0; width: 30px; height: 46px; display: grid; place-items: center; pointer-events: none; }
.veh-glyph svg { transform: translateY(5px); filter: drop-shadow(0 0 1px rgba(0,0,0,.4)); }
/* وميض حيّ واضح حول كل وحدة في مهمة (خلف المركبة كي لا يحجبها): حلقة متمدّدة + هالة وامضة */
.veh-active::before { content: ''; position: absolute; left: 50%; top: 44%; width: 18px; height: 18px;
  margin: -9px 0 0 -9px; border-radius: 50%; background: #e11d2a; opacity: .7; z-index: -1;
  animation: vehPulse 1.05s ease-out infinite; pointer-events: none; }
.veh-active::after { content: ''; position: absolute; left: 50%; top: 44%; width: 22px; height: 22px;
  margin: -11px 0 0 -11px; border-radius: 50%; z-index: -1;
  box-shadow: 0 0 11px 5px rgba(225,29,42,.65); animation: vehBlink .5s steps(1) infinite; pointer-events: none; }
@keyframes vehPulse { 0% { transform: scale(.7); opacity: .75; } 100% { transform: scale(3.4); opacity: 0; } }
@keyframes vehBlink { 0%,49% { box-shadow: 0 0 11px 5px rgba(225,29,42,.75); } 50%,100% { box-shadow: 0 0 11px 5px rgba(37,99,235,.75); } }
/* نبض رادار قويّ + توهّج على علامة الحادث (وميض واضح) */
.pin-wrap { position: relative; display: grid; place-items: center; }
.pin-pulse .pin-core { animation: pinGlow .9s ease-in-out infinite; }
@keyframes pinGlow {
  0%, 100% { box-shadow: 0 0 6px 2px var(--pc), 0 2px 8px rgba(0,0,0,.4); }
  50%      { box-shadow: 0 0 22px 10px var(--pc), 0 2px 8px rgba(0,0,0,.4); }
}
.pin-pulse::after { content: ''; position: absolute; left: 50%; top: 50%; width: 20px; height: 20px;
  margin: -10px 0 0 -10px; border-radius: 50%; background: var(--pc); opacity: .8; z-index: 1;
  animation: pinPulse 1.2s ease-out infinite; pointer-events: none; }
.pin-pulse::before { content: ''; position: absolute; left: 50%; top: 50%; width: 20px; height: 20px;
  margin: -10px 0 0 -10px; border-radius: 50%; background: var(--pc); opacity: .55; z-index: 1;
  animation: pinPulse 1.2s ease-out .6s infinite; pointer-events: none; }
@keyframes pinPulse { 0% { transform: scale(.6); opacity: .8; } 100% { transform: scale(5); opacity: 0; } }
/* شارة «مباشر» الوامضة · مؤشّر حيوية الشاشة */
.live-badge { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 800; color: var(--lv4); letter-spacing: .3px; }
.live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--lv4); animation: liveBlink 1.1s ease-in-out infinite; }
@keyframes liveBlink { 0%, 100% { opacity: 1; box-shadow: 0 0 0 0 color-mix(in srgb, var(--lv4) 55%, transparent); } 50% { opacity: .35; box-shadow: 0 0 0 5px transparent; } }

/* Map layer toggles */
.map-layers {
  /* مُزاحة عن حافة الخريطة (start = يمين RTL) كي لا تلامس عمود الحوادث المفتوحة */
  position: absolute; top: 12px; inset-inline-start: 64px; z-index: 550;
  background: var(--glass); backdrop-filter: blur(4px);
  border: 1px solid var(--line); border-radius: var(--r-sm); box-shadow: var(--shadow);
  padding: 8px 11px 9px; font-size: 12.5px; max-width: 230px;
}
.map-layers .ml-head { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  cursor: move; user-select: none; touch-action: none; }
.map-layers .ml-collapse { background: none; border: none; color: var(--ink-3); cursor: pointer;
  padding: 2px; display: grid; place-items: center; transition: transform .15s; border-radius: 5px; }
.map-layers .ml-collapse:hover { color: var(--ink); background: var(--bg-soft); }
.map-layers.collapsed .ml-collapse { transform: rotate(-90deg); }
.map-layers.collapsed .ml-body { display: none; }
.map-layers.dragging { opacity: .92; box-shadow: var(--shadow-lg); }
.map-layers .ml-body { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.map-layers .ml-title { font-size: 11px; font-weight: 800; color: var(--ink-2); }
.map-layers label { display: flex; align-items: center; gap: 7px; cursor: pointer; color: var(--ink-2); font-weight: 600; }
.map-layers input { accent-color: var(--brand); width: 14px; height: 14px; cursor: pointer; }
.map-layers .ml-sep { height: 1px; background: var(--line); margin: 3px 0; }
.map-layers .ml-ic { display: inline-flex; align-items: center; }
.map-layers .ml-n { margin-inline-start: auto; font-family: var(--mono); font-size: 11px; color: var(--ink-3); }
.map-layers #mapFeatureLayers { display: flex; flex-direction: column; gap: 6px; max-height: 230px; overflow-y: auto; }
.ml-manage { margin-top: 4px; background: none; border: 1px solid var(--line-strong); color: var(--ink-2);
  border-radius: var(--r-xs); padding: 5px 8px; font-family: 'Qomra'; font-size: 11.5px; font-weight: 700; cursor: pointer; }
.ml-manage:hover { border-color: var(--brand); color: var(--brand); }

/* علامة معلَم مرجعي على الخريطة · دائرة مسطّحة بلون النوع */
.feat-marker { width: 24px; height: 24px; border-radius: 50%; background: var(--fc);
  border: 2px solid #fff; box-shadow: 0 1px 5px rgba(0,0,0,.35); display: grid; place-items: center; }

/* قائمة إدارة الطبقات داخل النافذة */
.feat-list { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 10px; max-height: 240px; overflow-y: auto; }
.feat-row { display: flex; align-items: center; gap: 9px; padding: 7px 2px; border-bottom: 1px solid var(--line); }
.feat-row .feat-row-t { flex: 1; font-size: 13px; font-weight: 600; }

/* Fleet grouped by station */
.station-card { background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow-sm); margin-bottom: 14px; overflow: hidden; }
.station-head { display: flex; align-items: center; gap: 12px; padding: 12px 15px; border-bottom: 1px solid var(--line); cursor: pointer; transition: background .12s; flex-wrap: wrap; }
.station-head:hover { background: var(--bg-soft); }
.station-head .st-ic { width: 34px; display: grid; place-items: center; color: #1f9d57; flex: 0 0 auto; }
.station-head .st-id { flex: 0 0 auto; min-width: 110px; }
.station-head .st-name { font-weight: 800; font-size: 14.5px; }
.station-head .st-area { font-size: 11.5px; color: var(--ink-3); margin-top: 1px; }
/* إحصاءات المركز كبطاقات صغيرة واضحة بجانب العنوان */
.station-head .st-stats { display: flex; gap: 8px; flex-wrap: wrap; }
.st-stat { min-width: 54px; text-align: center; background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 5px 10px; }
.st-stat-v { font-size: 17px; font-weight: 800; color: var(--ink); line-height: 1.1; }
.st-stat-k { font-size: 10.5px; color: var(--ink-3); margin-top: 2px; }
.st-stat.ok .st-stat-v { color: #1f9d57; }
.st-stat.busy .st-stat-v { color: #2563eb; }
.st-stat.per .st-stat-v { color: #7a5aa5; }
.st-stat.red .st-stat-v { color: var(--red-700, #cf4350); }
/* نافذة معلومات المركز */
.si-area { font-size: 12.5px; color: var(--ink-3); margin-bottom: 12px; display: flex; align-items: center; gap: 6px; }
.si-stats { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.si-h { font-weight: 800; font-size: 13.5px; margin: 6px 0 8px; display: flex; align-items: center; gap: 7px; }
.si-vehs { display: flex; flex-direction: column; gap: 4px; max-height: 260px; overflow-y: auto; }
.si-veh { display: flex; align-items: center; gap: 8px; font-size: 12.5px; padding: 6px 8px; border: 1px solid var(--line); border-radius: var(--r-sm); }
.si-veh-ic { display: inline-flex; }
.si-veh-t { color: var(--ink-3); }
.si-veh-s { margin-inline-start: auto; font-weight: 700; font-size: 12px; }
.si-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
/* أزرار إجراءات المركز الموحّدة (الجرد · مركبة · إدارة) */
.st-actions { margin-inline-start: auto; display: flex; gap: 6px; flex: 0 0 auto; }
.st-act { display: inline-flex; align-items: center; gap: 5px; padding: 7px 11px; font-family: inherit; font-size: 12px; font-weight: 700; color: var(--ink-2); background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--r-sm); cursor: pointer; transition: border-color .15s, color .15s; }
.st-act:hover { border-color: var(--brand); color: var(--brand); }
.st-act-n { color: #fff; background: var(--red-700, #cf4350); border-radius: 999px; padding: 0 6px; font-size: 11px; font-weight: 800; }
.veh-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; padding: 13px 15px; }
.veh-cell { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 10px 4px; border: 1px solid var(--line); border-radius: 9px; text-align: center; cursor: pointer; transition: border-color .12s, box-shadow .12s; }
.veh-cell:hover { border-color: var(--brand-line); box-shadow: var(--shadow-sm); }
.veh-cell .vtype { font-size: 11px; font-weight: 700; color: var(--ink-2); }
.veh-cell .vid { font-family: var(--mono); font-size: 9.5px; color: var(--ink-3); }
.veh-cell .vstat { display: flex; align-items: center; gap: 4px; font-size: 10px; font-weight: 600; }
.veh-dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
@media (max-width: 1100px) { .veh-grid { grid-template-columns: repeat(4, 1fr); } }

/* responsive guard */
@media (max-width: 1280px) {
  .ops-grid { grid-template-columns: 300px 1fr 300px; }
  .kpi-strip { grid-template-columns: repeat(5,1fr); }
}

/* بطاقات البلاغات الواردة المنبثقة · تظهر فوق أي شاشة (حتى وضع الجدار) */
.toast-wrap { position: fixed; top: 74px; inset-inline-end: 18px; z-index: 4000;
  display: flex; flex-direction: column; gap: 10px; width: 340px; max-width: calc(100vw - 36px); pointer-events: none; }
.toast { pointer-events: auto; display: flex; background: var(--bg-elev); border: 1px solid var(--line-strong);
  border-radius: var(--r); box-shadow: var(--shadow-lg); overflow: hidden; animation: toastIn .32s ease; }
.toast.out { animation: toastOut .4s ease forwards; }
@keyframes toastIn  { from { opacity: 0; transform: translateX(-22px); } to { opacity: 1; transform: none; } }
@keyframes toastOut { to { opacity: 0; transform: translateX(-22px); } }
.toast-bar { width: 4px; flex: 0 0 4px; }
.toast-body { padding: 11px 13px; flex: 1; min-width: 0; }
.toast-top { display: flex; align-items: center; gap: 8px; font-size: 13.5px; }
.toast-top b { font-weight: 800; }
.toast-meta { color: var(--ink-2); font-size: 12px; margin-top: 5px; display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.toast-meta .mono { font-family: var(--mono); color: var(--ink-3); }
.toast-acts { display: flex; gap: 7px; margin-top: 10px; }

/* إدارة المستخدمين */
.um-add { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; margin-bottom: 14px; padding: 14px 16px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 10px; }
.um-add .form-control { padding: 11px 13px; font-size: 14px; }
.um-fld { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.um-fld label { font-size: 12px; font-weight: 700; color: var(--ink-2); }
.um-add-actions { grid-column: 1 / -1; display: flex; justify-content: flex-start; margin-top: 2px; }
@media (max-width: 640px){ .um-add { grid-template-columns: 1fr; } }
.pw-cell { display: flex; gap: 6px; align-items: center; }
.pw-cell .form-control { flex: 1; min-width: 0; letter-spacing: .5px; }
.pw-cell .btn { flex: 0 0 auto; white-space: nowrap; }
/* شريط البحث في إدارة المستخدمين */
.um-search { display: flex; align-items: center; gap: 8px; margin: 4px 0 12px; }
.um-search .form-control { flex: 1; padding: 11px 13px; font-size: 14px; }
.um-search .um-sub { white-space: nowrap; }
.um-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.um-table th { text-align: start; color: var(--ink-3); font-size: 11.5px; font-weight: 700; padding: 6px 8px; border-bottom: 1px solid var(--line); }
.um-table td { padding: 9px 8px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.um-table .um-sub { display: block; color: var(--ink-3); font-family: var(--mono); font-size: 11px; margin-top: 2px; }
.um-acts { display: flex; gap: 6px; align-items: center; justify-content: flex-end; }
/* قائمة المستخدمين مجمّعة حسب المركز/الجهة · قابلة للطي */
.um-group { border: 1px solid var(--line); border-radius: 10px; margin-bottom: 10px; overflow: hidden; }
.um-ghead { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 13px; background: var(--bg-soft); cursor: pointer; user-select: none; }
.um-ghead:hover { background: var(--bg-elev); }
.um-gname { display: inline-flex; align-items: center; gap: 7px; font-weight: 800; font-size: 13px; color: var(--ink); }
.um-gcount { font-size: 11px; font-weight: 700; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.um-group.collapsed .ugh-chev { transform: rotate(-90deg); }
.um-group.collapsed .um-gbody { display: none; }
.um-row { display: flex; align-items: center; gap: 10px; padding: 9px 13px; border-top: 1px solid var(--line); }
.um-rmain { flex: 1; min-width: 0; }
.um-rmain b { font-size: 13.5px; }
.um-row .um-acts { flex: 0 0 auto; }
/* المهام المنتهية · بطاقات قابلة للطباعة مفروزة حسب المركز (سجل التدقيق) */
.msn-group { border: 1px solid var(--line); border-radius: 10px; margin-bottom: 10px; overflow: hidden; }
.msn-ghead { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 13px; background: var(--bg-soft); cursor: pointer; user-select: none; }
.msn-ghead:hover { background: var(--bg-elev); }
.msn-group.collapsed .ugh-chev { transform: rotate(-90deg); }
.msn-group.collapsed .msn-gbody { display: none; }
.msn-gbody { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 10px; padding: 12px 13px; }
.msn-card { border: 1px solid var(--line); border-inline-start: 3px solid var(--c, var(--brand)); border-radius: 10px; padding: 11px 13px; background: var(--bg-elev); }
.msn-top { display: flex; align-items: center; gap: 8px; margin-bottom: 7px; }
.msn-top .inq-type { font-weight: 800; font-size: 14px; display: inline-flex; align-items: center; gap: 6px; }
.msn-meta { font-size: 12px; color: var(--ink-3); line-height: 1.7; margin-bottom: 9px; }
.msn-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.msn-hash { font-size: 11px; color: var(--ink-2); display: inline-flex; align-items: center; gap: 5px; }
.msn-hash .mono { color: #52a07e; }

/* محرّر بطاقات الاستجابة */
.ce-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.ce-row { display: flex; align-items: center; justify-content: space-between; gap: 8px;
  border: 1px solid var(--line); border-radius: var(--r-xs); padding: 7px 10px; }
.ce-row .ce-name { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; }
.ce-num { width: 74px; text-align: center; padding: 9px 8px; font-size: 14px; }
@media (max-width: 600px){ .ce-grid { grid-template-columns: 1fr; } }

/* علامة مستشفى على الخريطة (مربّع بلون توافر الأسرّة) */
.hosp-marker { width: 26px; height: 26px; border-radius: 6px; background: #fff;
  border: 3px solid var(--hc); box-shadow: 0 1px 5px rgba(0,0,0,.35); display: grid; place-items: center; }
.depot-marker { width: 26px; height: 26px; border-radius: 6px; background: var(--dc);
  border: 2px solid #fff; box-shadow: 0 1px 5px rgba(0,0,0,.35); display: grid; place-items: center; }
.risk-marker { width: 24px; height: 24px; border-radius: 50%; background: var(--rc);
  border: 2px solid #fff; box-shadow: 0 1px 5px rgba(0,0,0,.35); display: grid; place-items: center; }
.fac-marker { width: 26px; height: 26px; border-radius: 6px; background: #e8930c;
  border: 2px solid #fff; box-shadow: 0 1px 5px rgba(0,0,0,.35); display: grid; place-items: center; }
.water-marker { width: 22px; height: 22px; border-radius: 50%; background: var(--wc);
  border: 2px solid #fff; box-shadow: 0 1px 5px rgba(0,0,0,.35); display: grid; place-items: center; }
.fac-pp { font-size: 12px; line-height: 1.7; }
.fac-pp-t { color: #b8710a; font-size: 13.5px; } .fac-pp-k { color: #5a6472; font-size: 11px; }
.fac-pp-r { margin-top: 2px; } .fac-pp-r b { color: #14181f; }

/* لوحات الحادث: الفرز / الحصر / الطبّي / المراجعة */
.med-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 8px 0; }
.tri-cell { border: 1px solid var(--line); border-radius: var(--r-xs); padding: 8px 4px; text-align: center; }
.tri-cell .tri-n { font-family: var(--mono); font-size: 20px; font-weight: 800; line-height: 1; }
.tri-cell .tri-l { font-size: 11px; color: var(--ink-3); margin-top: 4px; }
.tri-red { border-top: 3px solid #cf4350; } .tri-red .tri-n { color: #cf4350; }
.tri-yellow { border-top: 3px solid #c6a24e; } .tri-yellow .tri-n { color: #c6a24e; }
.tri-green { border-top: 3px solid #52a07e; } .tri-green .tri-n { color: #52a07e; }
.tri-black { border-top: 3px solid #7e8a99; } .tri-black .tri-n { color: #7e8a99; }
.hosp-row { display: flex; align-items: center; gap: 8px; padding: 7px 2px; border-bottom: 1px solid var(--line); font-size: 13px; }
.hosp-row .hosp-beds { margin-inline-start: auto; font-family: var(--mono); font-weight: 800; }
.par-line { display: flex; gap: 18px; align-items: center; font-size: 13.5px; }
.par-line b { font-family: var(--mono); font-size: 17px; }
.aar-box textarea { width: 100%; min-height: 90px; resize: vertical; }

/* صور البلاغ المرفقة */
.inc-photos { display: flex; flex-wrap: wrap; gap: 8px; }
.inc-photo img { width: 64px; height: 64px; object-fit: cover; border-radius: var(--r-xs);
  border: 1px solid var(--line); cursor: pointer; transition: transform .12s; }
.inc-photo img:hover { transform: scale(1.04); border-color: var(--brand); }

/* تسجيلات السلامة «أنا بخير» في كونسول الأزمة */
.safe-list { display: flex; flex-direction: column; gap: 7px; max-height: 320px; overflow-y: auto; }
.safe-row { display: flex; align-items: center; gap: 9px; padding: 8px 10px; border: 1px solid var(--line);
  border-radius: var(--r-xs); font-size: 13px; }
.safe-row .safe-st { margin-inline-start: auto; font-weight: 800; font-size: 12px; }
.safe-ok { color: #52a07e; } .safe-need { color: #cf4350; }
.safe-loc { color: var(--brand); cursor: pointer; font-weight: 600; }
/* صفحة تسجيلات السلامة المستقلّة (تحت شبكة حارس) */
.safe-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 14px; }
.safe-kpi { border: 1px solid var(--line); border-radius: 10px; padding: 14px; text-align: center; }
.safe-kpi.total { border-color: var(--brand); }
.safe-kpi.need { border-color: #cf4350; }
.safe-kpi.ok { border-color: #52a07e; }
.safe-kpi-v { font-size: 26px; font-weight: 900; color: var(--brand); }
.safe-kpi.need .safe-kpi-v { color: #cf4350; }
.safe-kpi.ok .safe-kpi-v { color: #52a07e; }
.safe-kpi-k { font-size: 12px; color: var(--ink-2); margin-top: 4px; }
/* صفحة السلامة: عمودان · قائمة مدمجة (يمين RTL) + خريطة جانبية (يسار) */
.safety-grid { display: grid; grid-template-columns: 340px 1fr; gap: 14px; align-items: start; }
.safety-list-col { max-height: calc(100vh - 168px); overflow-y: auto; }
.safety-map-col #safetyMap { height: calc(100vh - 168px); min-height: 420px; border-radius: 10px; border: 1px solid var(--line); }
.safe-card { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-bottom: 1px solid var(--line); cursor: pointer; }
.safe-card:hover { background: var(--bg-soft); }
.safe-card-need { background: rgba(207, 67, 80, .06); }
.safe-card-main { flex: 1; min-width: 0; }
.safe-card-n { font-weight: 800; font-size: 12.5px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.safe-card-meta { font-size: 10.5px; color: var(--ink-3); margin-top: 2px; }
.safe-card-phone { margin-top: 2px; }
.safe-card-phone a { font-family: 'Qomra', sans-serif; font-size: 12px; font-weight: 700; color: var(--brand);
  text-decoration: none; display: inline-flex; align-items: center; gap: 5px; }
.safe-card-phone a:hover { text-decoration: underline; }
.safe-card .safe-st { font-weight: 800; font-size: 11px; }
/* علامة «بحاجة مساعدة»: دائرة حمراء وامضة + لافتة ملتصقة (جزء من الأيقونة نفسها · محاذاة دائمة) */
.sos-marker { display: flex; flex-direction: column; align-items: center; pointer-events: auto; }
.sos-core { width: 28px; height: 28px; border-radius: 50%; background: #cf4350; border: 2.5px solid #fff; flex: none;
  display: flex; align-items: center; justify-content: center; box-shadow: 0 1px 4px rgba(0,0,0,.4); animation: sosPulse 1.3s ease-out infinite; }
@keyframes sosPulse {
  0%   { box-shadow: 0 1px 4px rgba(0,0,0,.4), 0 0 0 0 rgba(207,67,80,.7); }
  70%  { box-shadow: 0 1px 4px rgba(0,0,0,.4), 0 0 0 16px rgba(207,67,80,0); }
  100% { box-shadow: 0 1px 4px rgba(0,0,0,.4), 0 0 0 0 rgba(207,67,80,0); }
}
.sos-tag { margin-top: 4px; background: #cf4350; color: #fff; font-weight: 800; font-size: 10.5px; line-height: 1;
  padding: 3px 7px; border-radius: 5px; white-space: nowrap; box-shadow: 0 1px 3px rgba(0,0,0,.35); }
/* إحصاءات السلامة المدمجة في كونسول الأزمة (لا قائمة · التفاصيل في التبويب المستقلّ) */
.safe-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.safe-stat { text-align: center; padding: 8px 4px; border: 1px solid var(--line); border-radius: var(--r-xs); }
.safe-stat.total { border-color: var(--brand); }
.safe-stat.need { border-color: #cf4350; }
.safe-stat.ok { border-color: #52a07e; }
.safe-stat-v { display: block; font-size: 20px; font-weight: 900; color: var(--brand); }
.safe-stat.need .safe-stat-v { color: #cf4350; }
.safe-stat.ok .safe-stat-v { color: #52a07e; }
.safe-stat-k { display: block; font-size: 11px; color: var(--ink-2); margin-top: 2px; }
.safe-stat-hint { font-size: 11px; color: var(--ink-3); margin-top: 8px; text-align: center; }
/* لوحة الجاهزية الوطنية (المرحلة ٢) */
.rd-top { display: grid; grid-template-columns: 200px 1fr; gap: 16px; margin-bottom: 16px; align-items: stretch; }
.rd-gauge { border: 3px solid var(--brand); border-radius: 14px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 18px; }
.rd-gauge-v { font-size: 44px; font-weight: 900; line-height: 1; }
.rd-gauge-k { font-size: 13px; color: var(--ink-2); margin-top: 8px; text-align: center; }
.rd-groups { display: flex; flex-direction: column; gap: 12px; }
.rd-group-t { font-size: 12.5px; font-weight: 800; color: var(--ink-2); margin-bottom: 7px; }
.rd-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(108px, 1fr)); gap: 9px; }
.rd-kpi { border: 1px solid var(--line); border-radius: 9px; padding: 11px 8px; text-align: center; }
.rd-kpi-v { font-size: 22px; font-weight: 900; }
.rd-kpi-k { font-size: 11px; color: var(--ink-2); margin-top: 3px; }
.rd-st { padding: 9px 12px; border-bottom: 1px solid var(--line); }
.rd-st-n { font-weight: 800; font-size: 13px; color: var(--ink); }
.rd-st-stats { font-size: 11.5px; color: var(--ink-3); margin-top: 3px; }
/* جاهزية المراكز كبطاقات بشبكة (الأضعف أولاً · شريط جاهزية بصري) */
.rd-st-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(214px, 1fr)); gap: 10px; padding: 12px; }
.rd-scard { background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r-sm); border-inline-start: 3px solid var(--rc, var(--brand)); padding: 11px 12px; }
.rd-scard-top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.rd-scard-n { font-weight: 700; font-size: 13px; color: var(--ink); line-height: 1.3; }
.rd-scard-pct { font-weight: 800; font-size: 18px; font-family: 'Qomra', sans-serif; flex-shrink: 0; }
.rd-bar { height: 6px; border-radius: 4px; background: var(--bg-soft); margin: 8px 0 9px; overflow: hidden; }
.rd-bar-fill { height: 100%; border-radius: 4px; }
.rd-scard-stats { display: flex; flex-wrap: wrap; gap: 3px 12px; font-size: 12px; color: var(--ink-2); }
.rd-scard-stats b { color: var(--ink); font-weight: 700; }
.rd-scard-flags { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 7px; }
.rd-flag { font-size: 11.5px; font-weight: 700; }
@media (max-width: 720px) { .rd-top { grid-template-columns: 1fr; } }
/* سجلّ الدروس المستفادة (المرحلة ٣) */
.lsn-chips { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 11px; }
.lsn-chip { border: 1px solid var(--line); background: transparent; border-radius: var(--r-sm); padding: 4px 11px; font-size: 12px; font-weight: 700; color: var(--ink-2); cursor: pointer; }
.lsn-chip.on { border-color: var(--brand); color: var(--brand); }
.lsn { padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-sm); margin-bottom: 9px; }
.lsn-top { display: flex; align-items: center; gap: 9px; }
.lsn-cat { font-size: 11px; font-weight: 800; color: var(--ink-3); border: 1px solid var(--line); border-radius: 5px; padding: 1px 7px; white-space: nowrap; }
.lsn-title { font-size: 13.5px; font-weight: 800; color: var(--ink); flex: 1; }
.lsn-st { font-size: 12px; font-weight: 800; white-space: nowrap; }
.lsn-d { font-size: 12.5px; color: var(--ink-2); margin-top: 6px; line-height: 1.7; }
.lsn-c { font-size: 12px; color: var(--ink-3); margin-top: 4px; }
.lsn-meta { font-size: 11px; color: var(--ink-3); margin-top: 7px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.lsn-acts { margin-inline-start: auto; display: flex; gap: 4px; }
.lsn-acts button { background: transparent; border: 1px solid var(--line); border-radius: 5px; padding: 2px 8px; font-size: 11px; color: var(--ink-2); cursor: pointer; }
/* مستويات تصعيد ICS + اقتراح التصعيد (المرحلة ٣) */
.ics-badge { font-size: 10.5px; font-weight: 800; color: var(--brand); border: 1px solid var(--brand); border-radius: 5px; padding: 1px 7px; }
.ics-badge.ics-uc { color: #cf4350; border-color: #cf4350; display: inline-flex; align-items: center; gap: 4px; }
.ics-ctl { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ics-lbl { font-size: 11.5px; color: var(--ink-2); font-weight: 700; }
.ics-sel { font-family: inherit; font-size: 12px; padding: 4px 7px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--bg-soft); color: var(--ink); }
.rd-esc { background: rgba(207, 67, 80, .08); border: 1px solid #cf4350; border-radius: var(--r-sm); padding: 10px 13px; margin-bottom: 14px; font-size: 13px; color: var(--ink); display: flex; align-items: center; gap: 8px; }

/* نموذج إضافة مستشفى */
.hosp-add { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 10px 0 16px; }
.hosp-add .full { grid-column: 1 / -1; }
.hosp-add .form-control { padding: 11px 13px; font-size: 14px; }
.hosp-add .hosp-add-btns { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.hosp-add .hosp-add-btns .cz-hint { font-size: 12px; color: var(--ink-3); }
@media (max-width: 560px){ .hosp-add { grid-template-columns: 1fr; } }

/* زر مؤكَّد (مثل: الموقع محدَّد) · حالة خضراء مكتومة */
.btn.btn-ok { color: #15823f; border: 1px solid rgba(31,157,87,.4); background: rgba(31,157,87,.06); }
.btn.btn-ok:hover { border-color: rgba(31,157,87,.6); }

/* إدارة الأصول · عناصر بطاقة المركبة (المحور ٥) */
.veh-cell { position: relative; }
.veh-fuel { width: 100%; height: 4px; border-radius: 3px; background: var(--line); overflow: hidden; margin-top: 6px; }
.veh-fuel span { display: block; height: 100%; }
/* جاهزية المركبة: ٣ أشرطة (وقود/ماء/رغوة) + معدّات — يُبلّغها الطاقم بعد العودة */
.veh-ready { margin-top: 6px; width: 100%; display: flex; flex-direction: column; gap: 4px; }
.vr-bar { display: flex; align-items: center; gap: 5px; }
.vr-bar > i { font-style: normal; font-size: 9px; font-weight: 700; color: var(--ink-3); width: 30px; text-align: start; white-space: nowrap; }
.vr-bar > .veh-fuel { flex: 1; margin: 0; }
.vr-equip { margin-top: 5px; font-size: 9.5px; font-weight: 800; color: #cf4350; }
.veh-asset { position: absolute; top: 4px; inset-inline-start: 4px; background: none; border: none; color: var(--ink-3);
  cursor: pointer; padding: 2px; border-radius: 5px; opacity: .55; }
.veh-asset:hover { opacity: 1; color: var(--brand); background: var(--bg-soft); }
.veh-svc { position: absolute; top: 4px; inset-inline-end: 4px; width: 16px; height: 16px; border-radius: 50%;
  background: #cb7044; display: grid; place-items: center; }
/* مركبة خارج الخدمة: باهتة ومخطّطة لتُميَّز فوراً عن المتاحة (لا تظهر في الإرسال) */
.veh-cell.veh-oos { opacity: .62; border-style: dashed; border-color: #a26b73; }
/* شرائح فلترة الأسطول · أكبر وبألوان دلالية دائمة (--fc لون كل شريحة) · المفعّلة مملوءة */
.fchip { font-family: 'Qomra', sans-serif; font-size: 13px; font-weight: 800; padding: 7px 15px;
  border-radius: 9px; border: 1.5px solid var(--fc); color: var(--fc); background: transparent;
  cursor: pointer; transition: background .12s, color .12s; line-height: 1; }
.fchip:hover { background: color-mix(in srgb, var(--fc) 14%, transparent); }
.fchip.on { background: var(--fc); color: #fff; }
.kpi.red .kpi-value { color: var(--lv4); }
/* محرّر الأصل */
.va-check { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; margin: 8px 0; cursor: pointer; }
.va-check input { width: 16px; height: 16px; accent-color: var(--brand); }
/* جرد */
.inv-add { display: grid; grid-template-columns: 1.7fr 1.1fr .95fr .95fr .95fr auto; gap: 10px; margin: 10px 0 16px; align-items: center; }
.inv-add .form-control { padding: 11px 13px; font-size: 14.5px; }
.inv-low td { background: rgba(207,67,80,.07); }
@media (max-width: 760px){ .inv-add { grid-template-columns: 1fr 1fr; } }

/* علامات الملاجئ والأضرار (المحور ٦) */
.shl-marker { width: 26px; height: 26px; border-radius: 6px; background: var(--sc);
  border: 2.5px solid #fff; box-shadow: 0 1px 5px rgba(0,0,0,.35); display: grid; place-items: center; }
.dmg-marker { width: 22px; height: 22px; border-radius: 50%; background: var(--dc);
  border: 2px solid #fff; box-shadow: 0 1px 5px rgba(0,0,0,.35); display: grid; place-items: center; }
.crisis-tools { display: flex; gap: 10px; flex-wrap: wrap; margin: 0 0 16px; }
/* أزرار أدوات إدارة الأزمة · واضحة وكبيرة (طلب المستخدم) */
.ct-btn { display: inline-flex; align-items: center; gap: 9px; padding: 12px 18px; border: 1px solid var(--brand);
  border-radius: 11px; background: var(--bg-elev); color: var(--brand); font-weight: 800; font-size: 14px;
  font-family: inherit; cursor: pointer; box-shadow: var(--shadow-sm); transition: background .12s, color .12s, transform .08s; }
.ct-btn svg { flex: 0 0 auto; }
.ct-btn:hover { background: var(--brand); color: #fff; }
.ct-btn:active { transform: translateY(1px); }

/* علامة التنبيه الموجّه على الخريطة */
.alr-marker { width: 24px; height: 24px; border-radius: 50%; background: var(--ac);
  border: 2px solid #fff; box-shadow: 0 0 0 3px rgba(0,0,0,.12); display: grid; place-items: center;
  animation: alrPulse 1.6s ease-out infinite; }
@keyframes alrPulse { 0%{box-shadow:0 0 0 0 var(--ac)} 70%{box-shadow:0 0 0 10px transparent} 100%{box-shadow:0 0 0 0 transparent} }

/* وضع التدريب والمحاكاة (المحور ١٣) */
.drill-banner { background: repeating-linear-gradient(45deg, #b89234, #b89234 12px, #9c7a26 12px, #9c7a26 24px);
  color: #fff; text-align: center; font-weight: 800; font-size: 12.5px; padding: 5px 12px; letter-spacing: .3px; }
.drill-badge { background: #b89234; color: #fff; font-size: 10px; font-weight: 800; padding: 1px 7px; border-radius: 999px; }
.trn-note { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink-2);
  background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 9px 11px; margin-bottom: 12px; }
.trn-active { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 13px; color: #b89234;
  border: 1px solid rgba(184,146,52,.4); background: rgba(184,146,52,.07); border-radius: var(--r-sm); padding: 9px 11px; }
.trn-list { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.trn-row { display: flex; align-items: center; justify-content: space-between; gap: 10px;
  border: 1px solid var(--line); border-radius: var(--r-sm); padding: 9px 12px; }
.trn-row .um-sub { display: block; color: var(--ink-3); font-size: 11.5px; margin-top: 2px; }

/* شارة «أزمة» (إعلان أزمة يدوي) */
.crisis-badge { background: var(--lv4); color: #fff; font-size: 10px; font-weight: 800; padding: 1px 7px; border-radius: 999px; }

/* كونسول الأزمة · لوحات بيانات ظاهرة دائماً */
.crisis-tools .ct-lbl { font-size: 11.5px; font-weight: 800; color: var(--ink-3); align-self: center; }
.cz-panel-row { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-bottom: 1px solid var(--line); }
.cz-panel-row:last-child { border-bottom: none; }
.cz-pr-main { flex: 1; min-width: 0; }
.cz-pr-t { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cz-pr-s { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }
.cz-pr-v { font-family: var(--mono); font-weight: 800; font-size: 13px; flex: 0 0 auto; }
.cz-bar { height: 5px; border-radius: 3px; background: var(--line); overflow: hidden; margin-top: 5px; }
.cz-bar span { display: block; height: 100%; }

/* مناطق الإخلاء (المحور ٦) */
.evz-marker { width: 24px; height: 24px; border-radius: 50%; background: #e8930c;
  border: 2px solid #fff; box-shadow: 0 1px 5px rgba(0,0,0,.4); display: grid; place-items: center; }
.zone-acts { display: flex; gap: 5px; margin-inline-start: auto; }
/* لوحة رسم منطقة الإخلاء (عائمة فوق الخريطة) */
.evac-draw-panel { position: fixed; top: 96px; inset-inline-start: 22px; z-index: 4000; width: 300px;
  background: var(--bg-elev); border: 1px solid var(--line-strong); border-radius: var(--r); box-shadow: var(--shadow-lg); padding: 14px; }
.evac-draw-panel .edp-title { font-weight: 800; font-size: 14px; display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.evac-draw-panel .edp-row { font-size: 13px; color: var(--ink-2); }
.evac-draw-panel .edp-row b { font-family: var(--mono); color: var(--brand); font-size: 15px; }
.evac-draw-panel .edp-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
/* شبكات إدخال عامّة للنوافذ (ملاجئ · جاهزية) */
.edp-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
.edp-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin-top: 8px; }
.evac-draw-panel .edp-btns { display: flex; gap: 8px; margin-top: 12px; }
/* طبقة طباعة المنطقة المتأثّرة */
.evac-print-ov { position: fixed; inset: 0; z-index: 6000; background: rgba(10,12,16,.6); overflow: auto; display: none; padding: 24px; }
.evac-print-ov .epx-doc { max-width: 900px; margin: 0 auto; background: #fff; color: #1a1f29; border-radius: 12px; padding: 26px 30px; box-shadow: 0 18px 60px rgba(0,0,0,.4); }
.epx-head { display: flex; align-items: center; justify-content: space-between; border-bottom: 2px solid #e8930c; padding-bottom: 12px; margin-bottom: 14px; }
.epx-t { font-weight: 900; font-size: 19px; color: #1a1f29; }
.epx-s { font-size: 12.5px; color: #5a6472; margin-top: 3px; }
.epx-kv { display: flex; justify-content: space-between; padding: 7px 0; border-bottom: 1px solid #eef1f5; font-size: 14px; }
.epx-kv span { color: #5a6472; }
.epx-map { height: 460px; margin-top: 14px; border-radius: 10px; overflow: hidden; border: 1px solid #d7dce3; }
.epx-note { font-size: 12px; color: #5a6472; margin-top: 10px; }
/* (وُحِّدت قاعدة طباعة الإخلاء مع التقرير أعلاه · كانتا تتعارضان فتُفرِغان الطباعة) */

/* نافذة تحديد منطقة الإخلاء (خريطة داخل المودال) */
.evac-modal-hint { font-size: 12.5px; color: var(--ink-2); background: var(--bg-soft);
  border: 1px solid var(--line); border-radius: var(--r-sm); padding: 8px 11px; margin-bottom: 10px; }
.evac-modal-map { height: 480px; border-radius: var(--r-sm); overflow: hidden; border: 1px solid var(--line-strong); margin-bottom: 10px; }
/* مودال أعرض (للخرائط · تحديد منطقة الإخلاء) */
.modal-card.modal-wide { max-width: 940px; max-height: 92vh; }
.modal-card.modal-xwide { max-width: 1080px; }   /* أعرض: نافذة فيها خريطة + جدول (المستشفيات) */
.evac-modal-map .leaflet-container { cursor: crosshair; }
/* نمذجة انتشار المواد الخطرة */
.plume-wind { background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 12px 14px; margin-bottom: 12px; display: flex; flex-direction: column; gap: 6px; }
.plume-wind label { font-size: 12.5px; color: var(--ink-2); font-weight: 700; }
.plume-wind input[type=range] { width: 100%; accent-color: var(--brand); }
.plume-wind .btn { align-self: flex-start; margin-top: 6px; }
.plume-info { margin-top: 10px; font-size: 13px; color: var(--ink-2); line-height: 1.7; }
/* استدعاء المتطوّعين المؤهّلين */
.vol-controls { display: flex; gap: 14px; align-items: flex-end; flex-wrap: wrap; background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 12px 14px; margin-bottom: 12px; }
.vol-controls label { font-size: 12.5px; color: var(--ink-2); font-weight: 700; display: flex; flex-direction: column; gap: 6px; min-width: 180px; }
.vol-controls .form-control { min-width: 180px; }
.vol-list { display: flex; flex-direction: column; gap: 8px; max-height: 420px; overflow-y: auto; }
.vol-row { border: 1px solid var(--line); border-inline-start: 3px solid var(--ok); border-radius: var(--r-sm); background: var(--bg-elev); padding: 9px 12px; }
.vol-main { display: flex; align-items: center; gap: 10px; font-size: 13.5px; }
.vol-km { color: var(--brand); font-weight: 700; font-size: 12px; }
.vol-badge { font-weight: 800; font-size: 11.5px; margin-inline-start: auto; }
.vol-skills { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 5px; }
.vol-skill { font-size: 11px; color: var(--ink-3); border: 1px solid var(--line); border-radius: var(--r-xs); padding: 1px 7px; }
/* طلبات التموين والإمداد (اللوجستيات) */
.rs-add { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 12px 14px; margin-bottom: 12px; }
.rs-add label { font-size: 12.5px; color: var(--ink-2); font-weight: 700; display: flex; flex-direction: column; gap: 5px; }
.rs-add .form-control { min-width: 120px; }
.rs-add input[type=number] { max-width: 90px; }
.rs-list { display: flex; flex-direction: column; gap: 8px; max-height: 440px; overflow-y: auto; }
.rs-row { border: 1px solid var(--line); border-inline-start: 3px solid var(--ink-3); border-radius: var(--r-sm); background: var(--bg-elev); padding: 9px 12px; }
.rs-main { display: flex; align-items: center; gap: 10px; font-size: 13.5px; flex-wrap: wrap; }
.rs-qty { color: var(--brand); font-weight: 700; font-size: 12px; }
.rs-prio { font-weight: 700; font-size: 11.5px; }
.rs-status { font-weight: 800; font-size: 11.5px; margin-inline-start: auto; }
.rs-sub { font-size: 11.5px; color: var(--ink-3); margin-top: 4px; }
.rs-acts { display: flex; gap: 6px; margin-top: 7px; flex-wrap: wrap; }
/* مناطق الخطر المُخطَّطة (خطط المخاطر) */
.risk-add { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 12px 14px; margin-bottom: 12px; }
.risk-add label { font-size: 12.5px; color: var(--ink-2); font-weight: 700; display: flex; flex-direction: column; gap: 5px; }
.risk-add .form-control { min-width: 130px; }
.risk-add .al-slider { min-width: 200px; }
.risk-list { display: flex; flex-direction: column; gap: 8px; max-height: 240px; overflow-y: auto; margin-top: 12px; }
.risk-row { border: 1px solid var(--line); border-inline-start: 3px solid var(--ink-3); border-radius: var(--r-sm); background: var(--bg-elev); padding: 9px 12px; }
.risk-main { display: flex; align-items: center; gap: 10px; font-size: 13.5px; flex-wrap: wrap; }
.risk-kind { font-weight: 700; font-size: 12px; }
.risk-sub { font-size: 11.5px; color: var(--ink-3); margin-top: 4px; }
/* المنشآت الحرجة + مصادر المياه (نوافذ الإدارة) */
.fac-add { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 12px; align-items: end; background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 12px 14px; margin-bottom: 12px; }
.fac-add label { font-size: 12px; color: var(--ink-2); font-weight: 700; display: flex; flex-direction: column; gap: 5px; }
.fac-add .fac-wide { grid-column: span 3; }
.fac-add .btn { grid-column: span 3; justify-self: start; }
.fac-list { display: flex; flex-direction: column; gap: 8px; max-height: 240px; overflow-y: auto; margin-top: 12px; }
.fac-row { border: 1px solid var(--line); border-inline-start: 3px solid #e8930c; border-radius: var(--r-sm); background: var(--bg-elev); padding: 9px 12px; }
.fac-main { display: flex; align-items: center; gap: 10px; font-size: 13.5px; flex-wrap: wrap; }
.fac-kind { font-weight: 700; font-size: 12px; color: #b8710a; }
.fac-sub { font-size: 11.5px; color: var(--ink-3); margin-top: 4px; }
/* مرجع المواد الخطرة */
.hz-search { margin-bottom: 12px; }
.hz-search .form-control { width: 100%; font-size: 14px; }
.hz-list { display: flex; flex-direction: column; gap: 10px; max-height: 480px; overflow-y: auto; }
.hz-card { border: 1px solid var(--line); border-inline-start: 4px solid var(--lv4); border-radius: var(--r-sm); background: var(--bg-elev); padding: 11px 14px; }
.hz-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 4px; }
.hz-name { font-size: 15px; color: var(--ink); }
.hz-un { font-size: 11px; font-weight: 700; color: #fff; background: var(--lv4); border-radius: var(--r-xs); padding: 1px 7px; }
.hz-class { font-size: 11px; color: var(--ink-2); border: 1px solid var(--line); border-radius: var(--r-xs); padding: 1px 7px; }
.hz-en { font-size: 11.5px; color: var(--ink-3); margin-bottom: 5px; direction: ltr; }
.hz-r { font-size: 12.5px; color: var(--ink-2); line-height: 1.7; margin-top: 2px; }
/* المفقودون ولمّ الشمل */
.miss-add { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px 12px; align-items: end; background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 12px 14px; margin-bottom: 12px; }
.miss-add label { font-size: 12px; color: var(--ink-2); font-weight: 700; display: flex; flex-direction: column; gap: 5px; }
.miss-add .miss-wide { grid-column: span 2; }
.miss-add .btn { grid-column: span 4; justify-self: start; }
.miss-list { display: flex; flex-direction: column; gap: 8px; max-height: 420px; overflow-y: auto; }
.miss-row { border: 1px solid var(--line); border-inline-start: 3px solid var(--lv4); border-radius: var(--r-sm); background: var(--bg-elev); padding: 9px 12px; }
.miss-main { display: flex; align-items: center; gap: 9px; font-size: 13.5px; flex-wrap: wrap; }
.miss-x { font-size: 11.5px; color: var(--ink-3); }
.miss-status { font-weight: 800; font-size: 11.5px; margin-inline-start: auto; }
.miss-sub { font-size: 11.5px; color: var(--ink-3); margin-top: 4px; line-height: 1.6; }
.miss-found { font-size: 11.5px; color: var(--ok); margin-top: 4px; }
.miss-acts { display: flex; gap: 7px; align-items: center; margin-top: 7px; flex-wrap: wrap; }
.miss-stsel { max-width: 130px; height: 30px; font-size: 12px; }
.miss-matches { margin-top: 6px; }
.miss-mtitle { font-size: 11.5px; font-weight: 700; color: var(--ink-2); margin: 4px 0; }
.miss-match { display: flex; align-items: center; gap: 8px; font-size: 12.5px; padding: 4px 8px; border: 1px solid var(--line); border-radius: var(--r-xs); margin-bottom: 4px; background: var(--bg-soft); flex-wrap: wrap; }
.miss-mscore { font-weight: 800; color: var(--brand); font-size: 12px; }
.miss-msrc { font-size: 10.5px; color: #fff; background: var(--ink-3); border-radius: var(--r-xs); padding: 1px 7px; }
.miss-mdetail { color: var(--ink-3); font-size: 11.5px; }
.miss-nomatch { font-size: 12px; color: var(--ink-3); padding: 4px 0; }
/* تتبّع المرضى */
.pt-add { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px 12px; align-items: end; background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 12px 14px; margin-bottom: 10px; }
.pt-add label { font-size: 12px; color: var(--ink-2); font-weight: 700; display: flex; flex-direction: column; gap: 5px; }
.pt-add .pt-wide { grid-column: span 4; }
.pt-add .btn { grid-column: span 4; justify-self: start; }
.pt-tagline { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 10px; }
.pt-count { font-size: 12.5px; color: var(--ink-2); display: inline-flex; align-items: center; gap: 4px; }
.pt-count b { color: var(--pc); font-size: 15px; font-weight: 800; }
.pt-total { font-size: 12px; color: var(--ink-3); margin-inline-start: auto; }
.pt-list { display: flex; flex-direction: column; gap: 8px; max-height: 400px; overflow-y: auto; }
.pt-row { border: 1px solid var(--line); border-inline-start: 3px solid var(--ink-3); border-radius: var(--r-sm); background: var(--bg-elev); padding: 9px 12px; }
.pt-main { display: flex; align-items: center; gap: 9px; font-size: 13.5px; flex-wrap: wrap; }
.pt-tag { font-size: 10.5px; font-weight: 800; color: #fff; border-radius: var(--r-xs); padding: 1px 8px; }
.pt-x { font-size: 11.5px; color: var(--ink-3); }
.pt-status { font-weight: 800; font-size: 11.5px; margin-inline-start: auto; }
.pt-sub { font-size: 11.5px; color: var(--ink-3); margin-top: 4px; }
.pt-acts { display: flex; gap: 7px; margin-top: 7px; flex-wrap: wrap; }
.pt-sel { max-width: 160px; height: 30px; font-size: 12px; }
.pt-tagsel { max-width: 110px; }
/* رسالة المواطن المُبلِّغ */
.cm-quick { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 10px; }
.cm-chip { font-size: 12px; color: var(--ink-2); background: var(--bg-soft); border: 1px solid var(--line-strong); border-radius: var(--r-sm); padding: 5px 10px; cursor: pointer; font-family: 'Qomra'; }
.cm-chip:hover { border-color: var(--brand); color: var(--brand); }
.cm-text { width: 100%; font-family: 'Qomra'; resize: vertical; }
/* التوزيع الأمثل للموارد */
.opt-sum { display: flex; gap: 18px; flex-wrap: wrap; font-size: 14px; color: var(--ink-2); margin-bottom: 6px; }
.opt-sum b { color: var(--brand); font-size: 17px; }
.opt-note { font-size: 12px; color: var(--ink-3); margin-bottom: 14px; line-height: 1.6; }
.opt-plan { display: flex; flex-direction: column; gap: 10px; }
.opt-row { border: 1px solid var(--line); border-radius: var(--r-sm); padding: 10px 12px; }
.opt-rhead { display: flex; align-items: center; gap: 9px; font-size: 13.5px; flex-wrap: wrap; }
.opt-loc { color: var(--ink-3); font-size: 12px; }
.opt-units { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.opt-unit { font-size: 12px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--r-xs); padding: 3px 8px; color: var(--ink-2); }
.opt-ut { color: var(--brand); font-weight: 700; }
.opt-gap { font-size: 12px; color: #cf4350; border: 1px solid rgba(207,67,80,.4); border-radius: var(--r-xs); padding: 3px 8px; font-weight: 700; }
/* لوحة سلامة المستجيبين */
.rs-stats { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.rs-stat { flex: 1 1 110px; text-align: center; background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 10px; }
.rs-stat-v { font-size: 22px; font-weight: 800; }
.rs-stat-k { font-size: 11.5px; color: var(--ink-3); margin-top: 3px; }
.rs-h { margin: 16px 0 8px; font-size: 13.5px; color: var(--ink-2); font-weight: 800; display: flex; align-items: center; gap: 7px; }
.rs-may { display: flex; flex-direction: column; gap: 8px; }
.rs-may-row { background: rgba(207,67,80,.08); border: 1px solid rgba(207,67,80,.3); border-radius: var(--r-sm); padding: 9px 11px; font-size: 13px; }
.rs-may-d { color: var(--ink-2); font-size: 12px; margin-top: 4px; }
.rs-ago { color: var(--ink-3); font-size: 11.5px; margin-inline-start: 6px; }
.rs-tbl { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.rs-tbl th { text-align: right; color: var(--ink-3); font-weight: 700; padding: 6px 9px; border-bottom: 1px solid var(--line); font-size: 11.5px; }
.rs-tbl td { padding: 7px 9px; border-bottom: 1px solid var(--line); color: var(--ink-2); }
.rs-tbl tr.rs-stale { background: rgba(207,67,80,.07); }
.rs-units { display: flex; flex-wrap: wrap; gap: 6px; }
.rs-unit { font-size: 12px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--r-xs); padding: 3px 8px; color: var(--ink-2); }
.rs-ut { color: var(--brand); font-weight: 700; }
.rs-empty { color: var(--ink-3); font-size: 12.5px; padding: 8px 2px; }

/* تباعد عناصر نافذة تحديد منطقة الإخلاء داخل المودال (القواعد القديمة كانت مقيّدة باللوحة العائمة) */
.modal-body .edp-row { display: block; font-size: 13px; color: var(--ink-2); margin: 10px 0 5px; }
.modal-body .edp-row b { font-family: var(--mono); color: var(--brand); font-size: 15px; }
.modal-body #edpRad { width: 100%; margin: 0 0 14px; }
.modal-body .edp-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.modal-body .edp-btns { display: flex; gap: 10px; margin-top: 16px; }

/* صفّ رفع صورة الضرر في المودال */
.dmg-file-row { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line-strong);
  border-radius: var(--r-sm); padding: 7px 10px; background: var(--bg-soft); font-size: 12.5px; }
.dmg-file-row input[type=file] { max-width: 150px; font-size: 11.5px; }

/* زر اختيار ملف عربي مخصّص (يُخفي زر المتصفّح الأصلي ذا اللغة الأجنبية) */
.file-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.file-pick { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.file-btn { display: inline-flex; align-items: center; gap: 7px; cursor: pointer; padding: 9px 14px;
  border: 1px solid var(--line-strong); border-radius: var(--r-sm); background: var(--bg-elev);
  color: var(--ink-2); font-weight: 700; font-size: 13px; font-family: 'Qomra'; }
.file-btn:hover { border-color: var(--brand); color: var(--brand); }

/* ===== مركز عمليات الأمن (SOC) ===== */
.soc-banner { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-radius: var(--r);
  border: 1px solid var(--line); margin-bottom: 14px; font-size: 14px; }
.soc-banner.soc-ok { border-inline-start: 4px solid #52a07e; }
.soc-banner.soc-alert { border-inline-start: 4px solid #cf4350; }
.soc-banner-sub { color: var(--ink-3); font-size: 12.5px; margin-inline-start: auto; white-space: nowrap; }
/* صقل: شارات التهديد في التنبيه + نقطة حالة لكل بطاقة + حدّ ملوّن حسب صحّة البطاقة */
.soc-tchips { display: flex; flex-wrap: wrap; gap: 6px; }
.soc-tchip { font-size: 11.5px; font-weight: 700; color: #cf4350; padding: 2px 9px; border: 1px solid rgba(207,67,80,.4); border-radius: var(--r-sm); }
.soc-cic { display: inline-flex; align-items: center; margin-inline-end: 7px; vertical-align: middle; }
.card.soc-c-alert { border-inline-start: 3px solid #cf4350; }
.card.soc-c-ok { border-inline-start: 3px solid #52a07e; }
/* البطاقات أفقية: ٤ في صفّ واحد على الشاشة العريضة (تلتفّ على الضيّقة) · محاذاة للأعلى */
/* كل بطاقة شريط أفقي (landscape): العنوان جانب المؤشرات (.soc-hrow) + القوائم تحت بعرض كامل */
.soc-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
.soc-grid .card { padding: 16px 20px; }
.soc-hrow { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.soc-hrow .card-head { flex: 0 0 210px; margin-bottom: 0; flex-direction: column; align-items: flex-start; gap: 6px; }
.soc-hrow .rd-kpis { flex: 1 1 360px; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 0; }
.soc-hrow .soc-empty { flex: 1 1 360px; margin: 0; }
.soc-hrow .soc-rfnodes { flex: 1 1 100%; margin-top: 8px; }
/* زر تحديث عصري (بدل شكل ويندوز ٩٨): أيقونة دائرية + حدّ + توهّج برتقالي عند المرور + دوران الأيقونة */
.section-title.soc-title { display: flex; align-items: center; }
.soc-refresh { display: inline-flex; align-items: center; gap: 7px; margin-inline-start: auto;
  padding: 7px 15px; font-family: inherit; font-size: 12.5px; font-weight: 700; color: var(--ink-2);
  background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--r-sm); cursor: pointer;
  transition: border-color .15s, color .15s; }
.soc-refresh:hover { border-color: var(--brand); color: var(--brand); }
.soc-refresh svg { transition: transform .45s ease; }
.soc-refresh:hover svg { transform: rotate(-180deg); }
.soc-rf { opacity: .85; }
.soc-pending { color: #7e8a99 !important; }
.soc-empty { color: var(--ink-3); font-size: 12.5px; padding: 10px 2px; line-height: 1.6; }
.soc-gws, .soc-evs { margin-top: 10px; display: flex; flex-direction: column; gap: 4px; max-height: 230px; overflow-y: auto; }
.soc-gw { display: flex; justify-content: space-between; align-items: center; padding: 6px 9px; border-radius: var(--r-xs); font-size: 12.5px; }
.soc-gw-stale { color: #cf4350; }
.soc-gw-id { font-family: 'Qomra'; }
.soc-gw-t { color: var(--ink-3); font-size: 11.5px; }
.soc-evhead { margin-top: 14px; font-size: 12px; color: var(--ink-3); font-weight: 700; }
.soc-ev { display: grid; grid-template-columns: 1fr auto auto auto; gap: 8px; align-items: center; padding: 5px 8px; font-size: 12px; border-bottom: 1px solid var(--line); }
.soc-ev-a { font-weight: 700; }
.soc-ev-u { font-family: 'Qomra'; color: var(--ink-2); }
.soc-ev-ip { color: var(--ink-3); font-size: 11px; }
.soc-ev-t { color: var(--ink-3); font-size: 11px; }
.soc-broken, .soc-locked { margin-top: 10px; padding: 8px 10px; border-radius: var(--r-xs); font-size: 12.5px;
  color: #cf4350; border: 1px solid #cf4350; }
.soc-fieldtamper { margin-top: 10px; padding: 7px 10px; border-radius: var(--r-xs); font-size: 12px;
  color: var(--ink-2); border: 1px solid var(--line); }
.soc-rfnodes { margin-top: 10px; display: flex; flex-direction: column; gap: 5px; max-height: 230px; overflow-y: auto; }
.soc-rfn { display: grid; grid-template-columns: auto 1fr auto; gap: 9px; align-items: center; font-size: 12px; padding: 3px 2px; }
.soc-rfn-jam { color: #cf4350; }
.soc-rfn-id { font-family: 'Qomra'; min-width: 64px; }
.soc-rfn-bar { height: 7px; background: var(--bg-soft); border-radius: 4px; overflow: hidden; }
.soc-rfn-bar > span { display: block; height: 100%; border-radius: 4px; }
.soc-rfn-v { color: var(--ink-3); font-size: 11px; white-space: nowrap; }
.soc-rfn-rep { color: var(--ink-3); font-size: 10px; margin-inline-start: 6px; opacity: .8; }
.soc-rfn-conf { color: #cf4350; font-size: 10px; font-weight: 700; margin-inline-start: 4px; }