/* ==========================================================
   IPC KSA — المنصة الوطنية لمكافحة العدوى
   هوية بصرية مستوحاة من الشعار: أخضر #0F7A3D / ذهبي #C9A227 / كحلي #1B2A4A
   ========================================================== */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }

:root {
  /* هوية رسمية موحدة — أخضر سعودي رسمي + ذهبي راقٍ + كحلي */
  --ipc-green: #0F7A3D;        /* أخضر العلم السعودي — رسمي */
  --ipc-green-dark: #0A5C2E;
  --ipc-green-light: #4FB477;
  --ipc-lime: #3E9E5E;
  --ipc-gold: #C9A227;         /* ذهبي راقٍ هادئ */
  --ipc-gold-dark: #A6841C;
  --ipc-gold-light: #E0C263;
  --ipc-orange: #C77B2C;
  --ipc-navy: #12293F;
  --ipc-grad: linear-gradient(135deg, #0F7A3D 0%, #2E9E56 48%, #C9A227 100%);
  --bg-0: #08150f;             /* خلفية كحلية-خضراء داكنة أنيقة */
  --bg-1: #0c1e16;
  --bg-card: #10261c;
  --bg-hover: #163524;
  --border: #1e4531;
  --text-1: #f0f8f2;
  --text-2: #9dc2ac;
}

body.portal-body {
  background: radial-gradient(1200px 700px at 85% -10%, rgba(15,122,61,.14), transparent 60%),
              radial-gradient(1000px 600px at 10% 110%, rgba(201,162,39,.10), transparent 60%),
              var(--bg-0);
  color: var(--text-1);
  min-height: 100vh;
}
.hidden { display: none !important; }

/* ==========================================================
   شاشة الدخول السينمائية
   ========================================================== */
.login-screen {
  position: fixed; inset: 0; z-index: 100;
  display: flex; align-items: center; justify-content: center;
  background:
    radial-gradient(1100px 650px at 78% 18%, rgba(15,122,61,.20), transparent 62%),
    radial-gradient(900px 600px at 18% 85%, rgba(201,162,39,.16), transparent 62%),
    linear-gradient(160deg, #050d08 0%, #081409 45%, #0b130a 100%);
  overflow: hidden;
  transition: opacity .7s ease, visibility .7s ease;
}
.login-screen.is-leaving { opacity: 0; }
.login-screen.is-hidden { display: none; }

.login-canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.login-vignette {
  position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 42%, rgba(0,0,0,.55) 100%);
}
.login-aurora {
  position: absolute; width: 62vw; height: 62vw; border-radius: 50%;
  filter: blur(90px); opacity: .32; pointer-events: none;
  animation: aurora-float 16s ease-in-out infinite alternate;
}
.aurora-green { background: radial-gradient(circle, rgba(15,122,61,.5), transparent 65%); top: -22vw; right: -14vw; }
.aurora-gold  { background: radial-gradient(circle, rgba(201,162,39,.45), transparent 65%); bottom: -24vw; left: -12vw; animation-delay: -8s; }
@keyframes aurora-float {
  from { transform: translate3d(0,0,0) scale(1); }
  to   { transform: translate3d(4vw, -3vw, 0) scale(1.12); }
}
.login-grid {
  position: absolute; inset: -60%; pointer-events: none; opacity: .10;
  background-image:
    linear-gradient(rgba(62,158,94,.5) 1px, transparent 1px),
    linear-gradient(90deg, rgba(62,158,94,.5) 1px, transparent 1px);
  background-size: 54px 54px;
  transform: perspective(600px) rotateX(58deg) translateY(12%);
  animation: grid-scroll 22s linear infinite;
}
@keyframes grid-scroll { from { background-position: 0 0; } to { background-position: 0 540px; } }
.login-rays {
  position: absolute; inset: 0; pointer-events: none; opacity: .16; mix-blend-mode: screen;
  background: conic-gradient(from 180deg at 50% 34%,
    transparent 0deg, rgba(201,162,39,.35) 12deg, transparent 26deg,
    transparent 90deg, rgba(15,122,61,.30) 105deg, transparent 122deg,
    transparent 210deg, rgba(240,190,85,.25) 226deg, transparent 244deg,
    transparent 320deg, rgba(123,201,106,.28) 338deg, transparent 360deg);
  animation: rays-spin 40s linear infinite;
}
@keyframes rays-spin { to { transform: rotate(360deg); } }

/* ستارة الافتتاح */
.login-curtain {
  position: absolute; top: 0; bottom: 0; width: 52%; z-index: 5; pointer-events: none;
  background: linear-gradient(160deg, #04120a, #0a1f12);
  animation: curtain .95s cubic-bezier(.77,0,.18,1) .15s forwards;
}
.curtain-r { right: 0; transform-origin: right; border-left: 1px solid rgba(62,158,94,.25); }
.curtain-l { left: 0; transform-origin: left; border-right: 1px solid rgba(201,162,39,.25); }
@keyframes curtain { to { transform: scaleX(0); } }

.login-stage {
  position: relative; z-index: 6; width: min(94vw, 520px);
  display: flex; flex-direction: column; align-items: center; gap: 20px;
  padding: 24px 0 30px;
}

/* الشعار — الدرع */
.login-brand { display: flex; flex-direction: column; align-items: center; text-align: center; }
.login-shield-wrap { position: relative; width: 148px; height: 148px; margin-bottom: 12px; }
.login-shield {
  position: absolute; inset: 14px; width: 120px; height: 120px; object-fit: contain;
  filter: drop-shadow(0 10px 30px rgba(15,122,61,.45)) drop-shadow(0 4px 14px rgba(201,162,39,.35));
  opacity: 0; transform: scale(.55) translateY(20px) rotate(-8deg);
  animation: shield-in 1.1s cubic-bezier(.2,.9,.25,1.2) .85s forwards, shield-float 5s ease-in-out 2.2s infinite alternate;
  background: rgba(255,255,255,.92);
  border-radius: 26px; padding: 10px;
}
@keyframes shield-in {
  0% { opacity: 0; transform: scale(.55) translateY(20px) rotate(-8deg); filter: blur(8px); }
  100% { opacity: 1; transform: scale(1) translateY(0) rotate(0); filter: blur(0); }
}
@keyframes shield-float { from { translate: 0 0; } to { translate: 0 -7px; } }
.login-shield-glow {
  position: absolute; inset: -18px; border-radius: 50%;
  background: radial-gradient(circle, rgba(15,122,61,.35), rgba(201,162,39,.14) 55%, transparent 72%);
  animation: glow-pulse 3.2s ease-in-out infinite;
}
@keyframes glow-pulse { 0%,100% { opacity: .55; transform: scale(1); } 50% { opacity: 1; transform: scale(1.1); } }
.login-ring {
  position: absolute; inset: -4px; border-radius: 34px;
  background: conic-gradient(from 0deg, var(--ipc-green), var(--ipc-lime), var(--ipc-gold), var(--ipc-gold-light), var(--ipc-green));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude; padding: 2.5px;
  opacity: .8; animation: ring-spin 6s linear infinite;
}
@keyframes ring-spin { to { transform: rotate(360deg); } }
.login-orbit {
  position: absolute; border-radius: 50%; border: 1px dashed rgba(62,158,94,.35);
  animation: ring-spin 18s linear infinite;
}
.orbit-1 { inset: -22px; }
.orbit-2 { inset: -40px; border-color: rgba(201,162,39,.22); animation-duration: 30s; animation-direction: reverse; }
.login-orbit::before {
  content: ''; position: absolute; top: -4px; left: 50%; width: 8px; height: 8px; border-radius: 50%;
  background: var(--ipc-gold); box-shadow: 0 0 12px var(--ipc-gold);
}
.orbit-1::before { background: var(--ipc-green-light); box-shadow: 0 0 12px var(--ipc-green-light); }
.login-shimmer {
  position: absolute; inset: 14px; border-radius: 26px; overflow: hidden; pointer-events: none;
}
.login-shimmer::after {
  content: ''; position: absolute; top: -30%; bottom: -30%; width: 34%;
  background: linear-gradient(105deg, transparent, rgba(255,255,255,.5), transparent);
  transform: skewX(-22deg); left: -60%;
  animation: shimmer-sweep 4.5s ease-in-out 2.4s infinite;
}
@keyframes shimmer-sweep { 0% { left: -60%; } 45%, 100% { left: 130%; } }

/* العناوين */
.login-title { margin: 4px 0 0; font-size: clamp(2.4rem, 6vw, 3.4rem); font-weight: 900; letter-spacing: .18em; }
.login-title-ar { margin: 2px 0 0; font-size: clamp(1.15rem, 3.4vw, 1.6rem); font-weight: 800; color: var(--text-1); }
.lt-word {
  display: inline-block; opacity: 0; transform: translateY(18px);
  animation: word-in .6s cubic-bezier(.2,.8,.3,1.2) forwards;
}
.login-title .lt-word:nth-child(1) { animation-delay: 1.35s; }
.login-title .lt-word:nth-child(2) { animation-delay: 1.5s; }
.login-title-ar .lt-word:nth-child(1) { animation-delay: 1.7s; }
.login-title-ar .lt-word:nth-child(2) { animation-delay: 1.82s; }
.login-title-ar .lt-word:nth-child(3) { animation-delay: 1.94s; }
.login-title-ar .lt-word:nth-child(4) { animation-delay: 2.06s; }
@keyframes word-in { to { opacity: 1; transform: translateY(0); } }
.lt-en {
  background: linear-gradient(120deg, #eafce9, #bfe8b8 40%, #eafce9);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  text-shadow: 0 0 40px rgba(123,201,106,.35);
}
.lt-en.lt-gold {
  background: linear-gradient(120deg, var(--ipc-gold-light), var(--ipc-gold) 50%, var(--ipc-orange));
  -webkit-background-clip: text; background-clip: text; color: transparent;
  text-shadow: 0 0 40px rgba(201,162,39,.4);
}
.lt-green { color: var(--ipc-green-light); }
.login-subtitle {
  margin: 8px 0 0; color: var(--text-2); font-size: .82rem; letter-spacing: .06em; direction: ltr;
  opacity: 0; animation: word-in .7s ease 2.25s forwards;
}
.login-divider {
  display: flex; align-items: center; gap: 10px; margin: 14px 0 6px; width: 240px;
  opacity: 0; animation: word-in .7s ease 2.4s forwards;
}
.login-divider span { flex: 1; height: 1px; background: linear-gradient(90deg, transparent, rgba(62,158,94,.6), transparent); }
.login-divider i { color: var(--ipc-gold); font-size: .95rem; }
.login-tagline { margin: 0; color: var(--text-2); font-size: .85rem; opacity: 0; animation: word-in .7s ease 2.5s forwards; }
.lt-sep { color: var(--ipc-gold); }

/* بطاقة الدخول */
.login-card {
  width: 100%; border-radius: 22px; padding: 22px 22px 16px; position: relative;
  background: linear-gradient(165deg, rgba(16,42,26,.88), rgba(8,22,13,.92));
  border: 1px solid rgba(62,158,94,.22);
  box-shadow: 0 30px 80px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter: blur(18px);
  opacity: 0; transform: translateY(26px) scale(.97);
  animation: card-in .8s cubic-bezier(.2,.8,.3,1.1) 2.55s forwards;
}
@keyframes card-in { to { opacity: 1; transform: translateY(0) scale(1); } }
.login-card::before {
  content: ''; position: absolute; inset: -1px; border-radius: 22px; padding: 1px; pointer-events: none;
  background: linear-gradient(140deg, rgba(15,122,61,.55), transparent 30%, transparent 70%, rgba(201,162,39,.55));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
}
.login-card.shake { animation: card-shake .5s ease; }
@keyframes card-shake {
  0%,100% { transform: translateX(0); } 20% { transform: translateX(-9px); }
  40% { transform: translateX(8px); } 60% { transform: translateX(-6px); } 80% { transform: translateX(4px); }
}
.login-card-head {
  display: flex; align-items: center; gap: 10px; margin-bottom: 16px;
  color: var(--ipc-gold-light); font-weight: 800; font-size: .95rem;
}
.login-card-head i { font-size: 1.05rem; }
.login-field { margin-bottom: 13px; }
.login-field label { display: block; margin-bottom: 6px; font-size: .78rem; color: var(--text-2); font-weight: 700; }
.login-input-wrap { position: relative; display: flex; align-items: center; }
.login-input-wrap > i {
  position: absolute; right: 13px; color: var(--ipc-green-light); font-size: .85rem; pointer-events: none;
}
.login-input-wrap input {
  width: 100%; padding: 12px 40px 12px 40px; border-radius: 13px;
  background: rgba(4,16,9,.65); border: 1px solid rgba(62,158,94,.22);
  color: var(--text-1); font-size: .95rem; font-family: inherit; outline: none;
  transition: border-color .25s, box-shadow .25s;
}
.login-input-wrap input:focus {
  border-color: var(--ipc-green);
  box-shadow: 0 0 0 3px rgba(15,122,61,.18), 0 0 22px rgba(15,122,61,.12);
}
.login-input-wrap input::placeholder { color: rgba(147,191,161,.4); }
.login-eye {
  position: absolute; left: 8px; background: none; border: none; color: var(--text-2);
  cursor: pointer; padding: 6px 8px; font-size: .85rem;
}
.login-eye:hover { color: var(--ipc-gold); }
.login-error {
  display: flex; align-items: center; gap: 8px; margin-bottom: 12px; padding: 10px 12px;
  border-radius: 11px; background: rgba(239,68,68,.12); border: 1px solid rgba(239,68,68,.4);
  color: #fca5a5; font-size: .8rem;
}
.login-submit {
  position: relative; width: 100%; padding: 13px; border: none; border-radius: 13px; cursor: pointer;
  font-family: inherit; font-size: 1rem; font-weight: 800; color: #08150c;
  background: linear-gradient(120deg, var(--ipc-green-light), var(--ipc-green) 40%, var(--ipc-gold));
  background-size: 200% 100%;
  box-shadow: 0 12px 30px rgba(15,122,61,.35);
  transition: background-position .45s ease, transform .2s, box-shadow .3s;
  overflow: hidden;
}
.login-submit:hover { background-position: 100% 0; transform: translateY(-1px); box-shadow: 0 16px 38px rgba(201,162,39,.35); }
.login-submit .ls-spinner { display: none; }
.login-submit.is-loading .ls-text { display: none; }
.login-submit.is-loading .ls-spinner { display: inline-flex; align-items: center; gap: 8px; }
.login-submit.is-ok { background: linear-gradient(120deg, var(--ipc-green-light), var(--ipc-green)); }
.login-demo { margin-top: 15px; border-top: 1px dashed rgba(62,158,94,.2); padding-top: 12px; }
.ld-label { display: block; font-size: .72rem; color: var(--text-2); margin-bottom: 8px; }
.ld-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.ld-chip {
  flex: 1; min-width: 105px; padding: 8px 10px; border-radius: 11px; cursor: pointer;
  background: rgba(15,122,61,.10); border: 1px solid rgba(62,158,94,.25);
  color: var(--text-2); font-family: inherit; font-size: .72rem; transition: all .25s;
}
.ld-chip b { display: block; color: var(--ipc-gold-light); font-size: .82rem; direction: ltr; }
.ld-chip:hover { background: rgba(201,162,39,.14); border-color: var(--ipc-gold); color: var(--text-1); transform: translateY(-2px); }

.login-foot {
  display: flex; gap: 18px; flex-wrap: wrap; justify-content: center;
  color: var(--text-2); font-size: .72rem;
  opacity: 0; animation: word-in .8s ease 3s forwards;
}
.login-foot i { color: var(--ipc-green-light); margin-left: 5px; }

@media (prefers-reduced-motion: reduce) {
  .login-screen *, .login-screen { animation-duration: .001s !important; animation-delay: 0s !important; }
}

/* ==========================================================
   البوابة — الهيدر والأقسام والداش بورد
   ========================================================== */
.portal { min-height: 100vh; padding-bottom: 48px; }

.p-topbar {
  position: sticky; top: 0; z-index: 40;
  display: flex; align-items: center; gap: 14px; padding: 12px clamp(14px, 4vw, 40px);
  background: rgba(6,15,9,.82); backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
}
.p-topbar .tb-logo { width: 46px; height: 46px; object-fit: contain; background: rgba(255,255,255,.94); border-radius: 13px; padding: 4px; }
.tb-name { line-height: 1.2; }
.tb-name b { font-size: 1.05rem; letter-spacing: .1em; background: var(--ipc-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.tb-name span { display: block; font-size: .68rem; color: var(--text-2); }
.tb-region {
  display: inline-flex; align-items: center; gap: 7px; margin-inline-start: 8px;
  padding: 6px 13px; border-radius: 999px; font-size: .72rem; font-weight: 700;
  background: rgba(15,122,61,.12); border: 1px solid rgba(62,158,94,.3); color: var(--ipc-green-light);
}
.tb-cluster-tag {
  display: inline-flex; align-items: center; gap: 6px; margin-inline-start: 6px;
  padding: 3px 10px; border-radius: 999px; font-size: .68rem; font-weight: 800;
  background: rgba(201,162,39,.16); border: 1px solid rgba(201,162,39,.4); color: var(--ipc-gold);
}
.hero-cluster { font-size: .62em; font-weight: 700; opacity: .92; }
.tb-spacer { flex: 1; }
.tb-year {
  display: flex; align-items: center; gap: 8px; padding: 7px 13px; border-radius: 12px;
  background: var(--bg-card); border: 1px solid var(--border); font-size: .8rem;
}
.tb-year i { color: var(--ipc-gold); }
.tb-year select { background: transparent; border: none; outline: none; color: var(--text-1); font-family: inherit; font-size: .85rem; cursor: pointer; }
.tb-year select option { background: var(--bg-1); }
.tb-user {
  display: flex; align-items: center; gap: 10px; padding: 6px 8px 6px 14px; border-radius: 14px;
  background: var(--bg-card); border: 1px solid var(--border);
}
.tb-avatar {
  width: 34px; height: 34px; border-radius: 11px; display: flex; align-items: center; justify-content: center;
  font-weight: 800; color: #08150c; background: var(--ipc-grad); font-size: .9rem;
}
.tb-uinfo { line-height: 1.15; }
.tb-uinfo b { font-size: .78rem; display: block; }
.tb-uinfo span { font-size: .64rem; color: var(--text-2); }
.tb-out {
  border: none; background: rgba(239,68,68,.12); color: #f87171; width: 34px; height: 34px;
  border-radius: 11px; cursor: pointer; transition: all .25s;
}
.tb-out:hover { background: rgba(239,68,68,.25); transform: scale(1.06); }

.p-wrap { max-width: 1280px; margin: 0 auto; padding: 26px clamp(14px, 4vw, 40px) 0; }

/* الهيرو */
.p-hero {
  position: relative; overflow: hidden; border-radius: 24px; padding: 30px clamp(18px, 4vw, 44px);
  background:
    radial-gradient(600px 300px at 90% 0%, rgba(15,122,61,.22), transparent 65%),
    radial-gradient(500px 280px at 5% 100%, rgba(201,162,39,.16), transparent 65%),
    linear-gradient(160deg, #0c2013, #0a1810 60%, #0d1c10);
  border: 1px solid var(--border);
}
.p-hero::after {
  content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .35;
  background-image: radial-gradient(rgba(62,158,94,.18) 1px, transparent 1px);
  background-size: 26px 26px;
}
.p-hero h2 { margin: 0 0 6px; font-size: clamp(1.25rem, 3vw, 1.7rem); font-weight: 900; }
.p-hero h2 i { color: var(--ipc-gold); margin-left: 8px; }
.p-hero p { margin: 0; color: var(--text-2); font-size: .88rem; max-width: 640px; }
.hero-chips { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; position: relative; z-index: 1; }
.hero-chip {
  display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px;
  font-size: .74rem; font-weight: 700; background: rgba(14,36,23,.8); border: 1px solid var(--border);
}
.hero-chip i { color: var(--ipc-green-light); }
.hero-chip.gold i { color: var(--ipc-gold); }

/* عنوان مجموعة */
.p-sec-title {
  display: flex; align-items: center; gap: 12px; margin: 30px 0 16px; font-weight: 900; font-size: 1.05rem;
}
.p-sec-title i { color: var(--ipc-gold); }
.p-sec-title .line { flex: 1; height: 1px; background: linear-gradient(90deg, var(--border), transparent); }
.p-sec-title .badge {
  font-size: .64rem; padding: 4px 10px; border-radius: 999px; font-weight: 700;
  background: rgba(201,162,39,.12); color: var(--ipc-gold-light); border: 1px solid rgba(201,162,39,.3);
}

/* بطاقات الأقسام */
.p-sections { display: grid; grid-template-columns: repeat(auto-fit, minmax(255px, 1fr)); gap: 16px; }
.sec-card {
  position: relative; overflow: hidden; border-radius: 22px; padding: 22px; cursor: pointer;
  background: linear-gradient(165deg, var(--bg-card), rgba(10,24,16,.9));
  border: 1px solid var(--border); text-decoration: none; color: var(--text-1);
  transition: transform .3s cubic-bezier(.2,.8,.3,1.1), box-shadow .3s, border-color .3s;
  display: block;
}
.sec-card:hover { transform: translateY(-6px); }
.sec-card .sc-icon {
  width: 58px; height: 58px; border-radius: 17px; display: flex; align-items: center; justify-content: center;
  font-size: 1.5rem; margin-bottom: 14px; position: relative; z-index: 1;
}
.sec-card h3 { margin: 0 0 6px; font-size: 1.02rem; font-weight: 800; position: relative; z-index: 1; }
.sec-card p { margin: 0 0 14px; font-size: .76rem; color: var(--text-2); line-height: 1.7; position: relative; z-index: 1; }
.sec-card .sc-go {
  display: inline-flex; align-items: center; gap: 8px; font-size: .76rem; font-weight: 800; position: relative; z-index: 1;
}
.sec-card .sc-orb {
  position: absolute; width: 190px; height: 190px; border-radius: 50%; top: -70px; left: -70px;
  filter: blur(46px); opacity: .35; transition: opacity .3s, transform .4s;
}
.sec-card:hover .sc-orb { opacity: .65; transform: scale(1.25); }
.sec-card .sc-stat {
  position: absolute; top: 18px; left: 18px; z-index: 1; text-align: center;
  padding: 7px 13px; border-radius: 13px; background: rgba(4,14,8,.5); border: 1px solid var(--border);
}
.sec-card .sc-stat b { display: block; font-size: 1.05rem; }
.sec-card .sc-stat span { font-size: .58rem; color: var(--text-2); }

.sec-card.sc-gold { border-color: rgba(201,162,39,.32); }
.sec-card.sc-gold:hover { box-shadow: 0 24px 60px rgba(201,162,39,.16); border-color: rgba(201,162,39,.6); }
.sec-card.sc-gold .sc-icon { background: linear-gradient(135deg, rgba(201,162,39,.24), rgba(224,123,42,.16)); color: var(--ipc-gold); border: 1px solid rgba(201,162,39,.35); }
.sec-card.sc-gold .sc-orb { background: var(--ipc-gold); }
.sec-card.sc-gold .sc-go { color: var(--ipc-gold-light); }
.sec-card.sc-gold .sc-stat b { color: var(--ipc-gold-light); }

.sec-card.sc-green { border-color: rgba(15,122,61,.32); }
.sec-card.sc-green:hover { box-shadow: 0 24px 60px rgba(15,122,61,.16); border-color: rgba(15,122,61,.6); }
.sec-card.sc-green .sc-icon { background: linear-gradient(135deg, rgba(15,122,61,.24), rgba(62,158,94,.16)); color: var(--ipc-green-light); border: 1px solid rgba(15,122,61,.35); }
.sec-card.sc-green .sc-orb { background: var(--ipc-green); }
.sec-card.sc-green .sc-go { color: var(--ipc-green-light); }
.sec-card.sc-green .sc-stat b { color: var(--ipc-green-light); }

.sec-card.sc-soon { cursor: default; opacity: .78; }
.sec-card.sc-soon:hover { transform: none; box-shadow: none; }
.sec-card.sc-soon .sc-icon { background: rgba(147,191,161,.1); color: var(--text-2); border: 1px solid var(--border); }
.sec-card.sc-soon .sc-orb { background: #48705a; }
.soon-badge {
  position: absolute; top: 18px; left: 18px; z-index: 1; font-size: .62rem; font-weight: 800;
  padding: 5px 12px; border-radius: 999px; background: rgba(147,191,161,.12);
  border: 1px dashed rgba(147,191,161,.4); color: var(--text-2);
}

/* KPI */
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(158px, 1fr)); gap: 12px; }
.kpi {
  position: relative; overflow: hidden; border-radius: 18px; padding: 15px 16px;
  background: var(--bg-card); border: 1px solid var(--border);
  transition: transform .25s, border-color .25s;
}
.kpi:hover { transform: translateY(-3px); }
.kpi .k-icon {
  width: 36px; height: 36px; border-radius: 11px; display: flex; align-items: center; justify-content: center;
  font-size: .95rem; margin-bottom: 10px;
}
.kpi b { display: block; font-size: 1.45rem; font-weight: 900; line-height: 1.1; }
.kpi span { font-size: .68rem; color: var(--text-2); }
.kpi .k-bar { position: absolute; bottom: 0; right: 0; left: 0; height: 3px; opacity: .85; }
.kpi.k-gold .k-icon { background: rgba(201,162,39,.14); color: var(--ipc-gold); }
.kpi.k-gold b { color: var(--ipc-gold-light); }
.kpi.k-gold .k-bar { background: linear-gradient(90deg, var(--ipc-gold), transparent); }
.kpi.k-gold:hover { border-color: rgba(201,162,39,.5); }
.kpi.k-green .k-icon { background: rgba(15,122,61,.14); color: var(--ipc-green-light); }
.kpi.k-green b { color: var(--ipc-green-light); }
.kpi.k-green .k-bar { background: linear-gradient(90deg, var(--ipc-green), transparent); }
.kpi.k-green:hover { border-color: rgba(15,122,61,.5); }
.kpi.k-red .k-icon { background: rgba(239,68,68,.14); color: #f87171; }
.kpi.k-red b { color: #fca5a5; }
.kpi.k-red .k-bar { background: linear-gradient(90deg, #ef4444, transparent); }
.kpi.k-red:hover { border-color: rgba(239,68,68,.5); }
.kpi.k-teal .k-icon { background: rgba(20,184,166,.14); color: #2dd4bf; }
.kpi.k-teal b { color: #5eead4; }
.kpi.k-teal .k-bar { background: linear-gradient(90deg, #14b8a6, transparent); }
.kpi.k-teal:hover { border-color: rgba(20,184,166,.5); }

/* الرسوم البيانية */
.charts-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 14px; }
.chart-card {
  border-radius: 20px; padding: 18px; background: var(--bg-card); border: 1px solid var(--border);
  min-width: 0;
}
.chart-card h4 { margin: 0 0 4px; font-size: .88rem; font-weight: 800; }
.chart-card h4 i { margin-left: 7px; }
.chart-card .ch-sub { font-size: .66rem; color: var(--text-2); margin-bottom: 12px; }
.chart-card .ch-body { position: relative; height: 250px; }
.span-6 { grid-column: span 6; }
.span-4 { grid-column: span 4; }
.span-8 { grid-column: span 8; }
.span-12 { grid-column: span 12; }
@media (max-width: 980px) { .span-6, .span-4, .span-8 { grid-column: span 12; } }

/* قوائم جانبية داخل الداش بورد */
.mini-list { display: flex; flex-direction: column; gap: 8px; }
.mini-row {
  display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 12px;
  background: rgba(4,14,8,.4); border: 1px solid var(--border); font-size: .76rem;
}
.mini-row .mr-rank {
  width: 24px; height: 24px; border-radius: 8px; display: flex; align-items: center; justify-content: center;
  font-size: .68rem; font-weight: 800; background: rgba(201,162,39,.14); color: var(--ipc-gold-light);
}
.mini-row .mr-name { flex: 1; }
.mini-row .mr-val { font-weight: 800; color: var(--ipc-green-light); }
.mini-track { flex-basis: 34%; height: 5px; border-radius: 99px; background: rgba(147,191,161,.14); overflow: hidden; }
.mini-fill { height: 100%; border-radius: 99px; background: var(--ipc-grad); }

.p-loading { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 90px 0; color: var(--text-2); }
.p-loading .spin {
  width: 46px; height: 46px; border-radius: 50%; border: 3px solid rgba(62,158,94,.2);
  border-top-color: var(--ipc-green); animation: sp 1s linear infinite;
}
@keyframes sp { to { transform: rotate(360deg); } }

.p-footer { margin-top: 40px; text-align: center; color: var(--text-2); font-size: .7rem; }
.p-footer i { color: var(--ipc-green); }

/* ==========================================================
   نظام المناطق — شبكة المناطق + المُنتقي + سجل المستشفيات
   ========================================================== */

/* شريط المنطقة في التوب بار */
.tb-region-x {
  margin-inline-start: 8px; padding: 3px 10px; border-radius: 999px;
  border: 1px solid rgba(201,162,39,.35); background: rgba(201,162,39,.12);
  color: var(--ipc-gold-light); font-family: inherit; font-size: .68rem; cursor: pointer;
  transition: all .2s;
}
.tb-region-x:hover { background: rgba(201,162,39,.25); transform: translateY(-1px); }

/* شبكة المناطق */
.regions-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
  gap: 14px; margin-bottom: 34px;
}
.rg-card {
  --rc: #0F7A3D;
  position: relative; overflow: hidden; text-align: right; cursor: pointer;
  padding: 16px 16px 14px; border-radius: 18px; font-family: inherit;
  background: linear-gradient(160deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
  border: 1px solid rgba(147,191,161,.14);
  color: var(--text-1); transition: transform .25s, border-color .25s, box-shadow .25s;
}
.rg-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--rc) 55%, transparent);
  box-shadow: 0 14px 34px -14px color-mix(in srgb, var(--rc) 45%, transparent);
}
.rg-orb {
  position: absolute; inset-inline-end: -34px; top: -34px; width: 110px; height: 110px;
  border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--rc) 30%, transparent), transparent 70%);
  pointer-events: none; transition: transform .3s;
}
.rg-card:hover .rg-orb { transform: scale(1.35); }
.rg-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.rg-icon {
  width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center;
  font-size: 1.15rem; color: var(--rc);
  background: color-mix(in srgb, var(--rc) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--rc) 30%, transparent);
}
.rg-status { font-size: .62rem; color: var(--text-2); }
.rg-card.has-data .rg-status { color: var(--ipc-green-light); }
.rg-card.has-data .rg-status i { animation: pulse-dot 2s infinite; }
@keyframes pulse-dot { 0%,100% { opacity: 1; } 50% { opacity: .35; } }
.rg-card h3 { font-size: .98rem; font-weight: 800; margin-bottom: 2px; }
.rg-cap { font-size: .68rem; color: var(--text-2); margin-bottom: 10px; }
.rg-cap i { color: var(--rc); margin-inline-end: 3px; }
.rg-stats {
  display: grid; grid-template-columns: 1fr 1fr; gap: 5px 10px;
  font-size: .7rem; color: var(--text-2); margin-bottom: 12px;
}
.rg-stats i { width: 16px; color: var(--rc); }
.rg-go {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: .72rem; font-weight: 700; color: var(--rc); transition: gap .2s;
}
.rg-card:hover .rg-go { gap: 11px; }

/* مُنتقي المناطق (Modal) */
.rp-overlay {
  position: fixed; inset: 0; z-index: 300; display: grid; place-items: center;
  background: rgba(4,14,8,.75); backdrop-filter: blur(8px);
  opacity: 0; transition: opacity .25s;
}
.rp-overlay.show { opacity: 1; }
.rp-modal {
  width: min(720px, calc(100vw - 32px)); max-height: 84vh; overflow: auto;
  border-radius: 22px; padding: 22px;
  background: linear-gradient(165deg, #0e2a19, #0a1f12);
  border: 1px solid rgba(147,191,161,.2);
  box-shadow: 0 30px 80px -20px rgba(0,0,0,.7);
  transform: translateY(14px) scale(.97); transition: transform .3s;
}
.rp-overlay.show .rp-modal { transform: none; }
.rp-head { position: relative; margin-bottom: 16px; }
.rp-head h3 { font-size: 1.05rem; font-weight: 800; color: var(--text-1); }
.rp-head h3 i { color: var(--ipc-gold); margin-inline-end: 6px; }
.rp-head p { font-size: .72rem; color: var(--text-2); margin-top: 3px; }
.rp-close {
  position: absolute; inset-inline-end: 0; top: 0;
  width: 32px; height: 32px; border-radius: 10px; cursor: pointer;
  background: rgba(255,255,255,.06); border: 1px solid rgba(147,191,161,.18);
  color: var(--text-2); transition: all .2s;
}
.rp-close:hover { color: #f87171; border-color: rgba(248,113,113,.4); }
.rp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(155px, 1fr)); gap: 10px; }
.rp-item {
  --rc: #0F7A3D;
  display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
  padding: 13px 14px; border-radius: 14px; cursor: pointer; text-align: right;
  font-family: inherit; color: var(--text-1);
  background: rgba(255,255,255,.035); border: 1px solid rgba(147,191,161,.13);
  transition: all .2s;
}
.rp-item:hover {
  border-color: color-mix(in srgb, var(--rc) 60%, transparent);
  background: color-mix(in srgb, var(--rc) 10%, transparent);
  transform: translateY(-2px);
}
.rp-item i { font-size: 1.05rem; color: var(--rc); }
.rp-item b { font-size: .82rem; font-weight: 800; }
.rp-item span { font-size: .62rem; color: var(--text-2); }

/* هيرو المنطقة */
.region-hero { border-color: color-mix(in srgb, var(--rc) 30%, transparent); }
.hero-top-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.hero-back {
  padding: 8px 16px; border-radius: 12px; cursor: pointer; font-family: inherit; font-size: .74rem; font-weight: 700;
  background: rgba(201,162,39,.12); border: 1px solid rgba(201,162,39,.35); color: var(--ipc-gold-light);
  transition: all .2s;
}
.hero-back:hover { background: rgba(201,162,39,.22); transform: translateY(-1px); }

/* لوحة المستشفيات */
.hosp-panel { margin-bottom: 34px; }
.hosp-add {
  padding: 14px 16px; border-radius: 16px; margin-bottom: 14px;
  background: linear-gradient(160deg, rgba(15,122,61,.08), rgba(201,162,39,.05));
  border: 1px dashed rgba(147,191,161,.3);
}
.ha-title { font-size: .8rem; font-weight: 800; color: var(--ipc-green-light); margin-bottom: 10px; }
.ha-title i { margin-inline-end: 5px; }
.ha-fields { display: grid; grid-template-columns: 2.2fr 1fr 1fr .9fr auto; gap: 8px; }
.ha-fields input, .ha-fields select {
  padding: 9px 12px; border-radius: 10px; font-family: inherit; font-size: .76rem;
  background: rgba(4,14,8,.5); border: 1px solid rgba(147,191,161,.2); color: var(--text-1);
  outline: none; transition: border-color .2s;
}
.ha-fields input:focus, .ha-fields select:focus { border-color: var(--ipc-green); }
.ha-fields button {
  padding: 9px 18px; border-radius: 10px; cursor: pointer; font-family: inherit; font-size: .76rem; font-weight: 800;
  background: linear-gradient(135deg, var(--ipc-green), var(--ipc-green-dark)); color: #fff; border: none;
  transition: all .2s; white-space: nowrap;
}
.ha-fields button:hover { filter: brightness(1.12); transform: translateY(-1px); }
.hosp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(275px, 1fr)); gap: 10px; }
.hosp-card {
  display: flex; align-items: center; gap: 11px;
  padding: 12px 14px; border-radius: 14px;
  background: rgba(255,255,255,.035); border: 1px solid rgba(147,191,161,.13);
  transition: all .2s;
}
.hosp-card:hover { border-color: rgba(15,122,61,.4); transform: translateY(-2px); }
.hg-icon {
  width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; flex-shrink: 0;
  font-size: .95rem; color: var(--ipc-green-light);
  background: rgba(15,122,61,.12); border: 1px solid rgba(15,122,61,.25);
}
.hg-info { flex: 1; min-width: 0; }
.hg-info b { display: block; font-size: .78rem; font-weight: 800; color: var(--text-1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hg-info span { font-size: .64rem; color: var(--text-2); }
.hg-info span i { color: var(--ipc-gold); }
.hg-del {
  width: 30px; height: 30px; border-radius: 9px; cursor: pointer; flex-shrink: 0;
  background: rgba(248,113,113,.08); border: 1px solid rgba(248,113,113,.2); color: #f87171;
  font-size: .72rem; transition: all .2s; opacity: .55;
}
.hosp-card:hover .hg-del { opacity: 1; }
.hg-del:hover { background: rgba(248,113,113,.2); }

/* توست */
.p-toast {
  position: fixed; bottom: 26px; inset-inline-start: 50%; transform: translate(50%, 24px); z-index: 400;
  padding: 11px 22px; border-radius: 999px; font-size: .78rem; font-weight: 700;
  background: linear-gradient(135deg, #164024, #0e2a19); color: var(--ipc-green-light);
  border: 1px solid rgba(15,122,61,.4); box-shadow: 0 14px 40px -10px rgba(0,0,0,.6);
  opacity: 0; pointer-events: none; transition: all .3s;
}
.p-toast.show { opacity: 1; transform: translate(50%, 0); }
.p-toast.err { color: #fca5a5; border-color: rgba(248,113,113,.4); background: linear-gradient(135deg, #401616, #2a0e0e); }
.p-toast i { margin-inline-end: 5px; }

/* رسم مقارنة المناطق */
.ch-body.tall { height: 320px; }

@media (max-width: 760px) {
  .ha-fields { grid-template-columns: 1fr 1fr; }
  .ha-fields input:first-child { grid-column: 1 / -1; }
  .regions-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
}

/* ==========================================================
   أداة تقييم الترصد الإقليمي (Eval Tool) — overlay أدمن
   ========================================================== */
.eval-overlay {
  position: fixed; inset: 0; z-index: 9000;
  background: rgba(6, 18, 12, .72); backdrop-filter: blur(6px);
  display: flex; align-items: stretch; justify-content: center;
  animation: evfade .2s ease;
}
@keyframes evfade { from { opacity: 0 } to { opacity: 1 } }
.eval-shell {
  width: 100%; max-width: 1400px; margin: 22px; background: var(--bg-1);
  border: 1px solid var(--border); border-radius: 20px; overflow: hidden;
  display: flex; flex-direction: column; box-shadow: 0 30px 90px rgba(0,0,0,.6);
}
.eval-head {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  padding: 16px 22px; background: var(--ipc-grad); color: #fff; flex: 0 0 auto;
}
.eh-brand { display: flex; align-items: center; gap: 14px; }
.eh-badge {
  width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center;
  background: rgba(255,255,255,.18); font-size: 22px;
}
.eh-title b { display: block; font-size: 17px; }
.eh-title span { font-size: 12px; opacity: .9; }
.eh-actions { display: flex; align-items: center; gap: 12px; }
.eh-admin {
  background: rgba(255,255,255,.16); padding: 6px 12px; border-radius: 20px;
  font-size: 12.5px; font-weight: 700;
}
.eh-close {
  width: 40px; height: 40px; border-radius: 11px; border: 0; cursor: pointer;
  background: rgba(255,255,255,.16); color: #fff; font-size: 18px;
  transition: .15s;
}
.eh-close:hover { background: rgba(255,255,255,.3); transform: rotate(90deg); }
.eval-body { flex: 1 1 auto; overflow: hidden; display: flex; }
.ev-scroll { flex: 1; overflow-y: auto; padding: 22px 26px; }
.ev-loading, .ev-err { flex: 1; display: grid; place-items: center; color: var(--text-2); gap: 12px; padding: 60px; }
.ev-err { color: #f8a5a5; }
.ev-err i, .ev-empty-box i { font-size: 34px; }
.spin {
  width: 34px; height: 34px; border: 3px solid var(--border);
  border-top-color: var(--ipc-green-light); border-radius: 50%; animation: sp 1s linear infinite; margin: 0 auto;
}
@keyframes sp { to { transform: rotate(360deg) } }

/* شريط الإحصائيات */
.ev-statbar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 16px; }
.ev-stat {
  background: var(--bg-card); border: 1px solid var(--border); border-radius: 14px;
  padding: 15px 16px; display: flex; align-items: center; gap: 13px;
}
.es-ico { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; font-size: 19px; color: #fff; }
.es-ico.i-map { background: linear-gradient(135deg,#0F7A3D,#2E9E56); }
.es-ico.i-done { background: linear-gradient(135deg,#16794a,#3E9E5E); }
.es-ico.i-pend { background: linear-gradient(135deg,#A6841C,#C9A227); }
.es-ico.i-avg { background: linear-gradient(135deg,#12293F,#1B2A4A); }
.ev-stat b { font-size: 24px; display: block; line-height: 1; }
.ev-stat small { color: var(--text-2); font-size: 12.5px; }

.ev-rating-legend { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
.ev-rating-legend .rl {
  font-size: 12.5px; padding: 6px 12px; border-radius: 20px; font-weight: 600;
  border: 1px solid var(--border); background: var(--bg-card);
}
.rl em { font-style: normal; opacity: .75; }
.rt-exc { color: #4FB477; } .rt-vg { color: #6dc98d; }
.rt-good { color: #E0C263; } .rt-imp { color: #f08a8a; }

.ev-sec-title { display: flex; align-items: center; gap: 10px; font-weight: 800; margin: 8px 0 14px; font-size: 16px; }
.ev-sec-title i { color: var(--ipc-gold); }
.ev-hint { font-size: 12px; color: var(--text-2); font-weight: 500; }

/* بطاقات المناطق */
.ev-regions-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 15px; }
.ev-rcard {
  background: var(--bg-card); border: 1px solid var(--border); border-radius: 16px;
  padding: 16px; cursor: pointer; transition: .18s; position: relative; overflow: hidden;
}
.ev-rcard:hover { transform: translateY(-3px); border-color: var(--ipc-green-light); box-shadow: 0 14px 30px rgba(0,0,0,.35); }
.rc-top { display: flex; align-items: center; gap: 11px; margin-bottom: 12px; }
.rc-ico { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center;
  background: color-mix(in srgb, var(--rc) 22%, transparent); color: var(--rc); font-size: 18px; }
.rc-name { flex: 1; } .rc-name b { display: block; font-size: 15px; } .rc-name small { color: var(--text-2); font-size: 12px; }
.rc-badge { font-size: 11.5px; padding: 4px 10px; border-radius: 20px; font-weight: 700; white-space: nowrap; }
.rc-badge.rt-exc { background: rgba(79,180,119,.18); color: #6fd196; }
.rc-badge.rt-vg { background: rgba(62,158,94,.18); color: #7ed6a0; }
.rc-badge.rt-good { background: rgba(201,162,39,.18); color: #e6cd77; }
.rc-badge.rt-imp { background: rgba(197,48,48,.18); color: #f0908f; }
.rc-badge.rt-none { background: rgba(157,194,172,.12); color: var(--text-2); }
.rc-score { display: flex; align-items: center; gap: 15px; margin: 6px 0 14px; }
.rc-ring {
  --p: 0; --c: #16794a; width: 72px; height: 72px; border-radius: 50%; flex: 0 0 auto;
  background: conic-gradient(var(--c) calc(var(--p) * 1%), var(--border) 0);
  display: grid; place-items: center;
}
.rc-ring::before { content: ""; position: absolute; width: 54px; height: 54px; border-radius: 50%; background: var(--bg-card); }
.rc-ring span { position: relative; font-weight: 800; font-size: 15px; }
.rc-meta { display: flex; flex-direction: column; gap: 5px; font-size: 12.5px; color: var(--text-2); }
.rc-meta i { color: var(--ipc-gold); width: 15px; }
.rc-noeval { display: flex; align-items: center; gap: 9px; color: var(--text-2); font-size: 13px; padding: 14px 0; }
.rc-noeval i { font-size: 18px; }
.rc-actions { display: flex; gap: 8px; }
.rc-btn { flex: 1; border: 0; border-radius: 10px; padding: 9px; cursor: pointer; font-weight: 700; font-size: 13px; font-family: inherit; transition: .15s; }
.rc-btn.primary { background: var(--ipc-green); color: #fff; }
.rc-btn.primary:hover { background: var(--ipc-green-dark); }
.rc-btn.ghost { background: transparent; border: 1px solid var(--border); color: var(--text-1); }
.rc-btn.ghost:hover { background: var(--bg-hover); }
.ev-empty { color: var(--text-2); }

/* عرض المنطقة + الجدول */
.ev-crumb { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.ev-crumb h3 { flex: 1; margin: 0; font-size: 17px; }
.ev-crumb h3 i { color: var(--ipc-green-light); }
.ev-back { background: var(--bg-card); border: 1px solid var(--border); color: var(--text-1);
  padding: 8px 14px; border-radius: 10px; cursor: pointer; font-family: inherit; font-weight: 600; }
.ev-back:hover { background: var(--bg-hover); }
.ev-primary { background: var(--ipc-green); color: #fff; border: 0; padding: 9px 16px; border-radius: 10px;
  cursor: pointer; font-family: inherit; font-weight: 700; }
.ev-primary:hover { background: var(--ipc-green-dark); }
.ev-primary.block, .ev-ghost.block { width: 100%; padding: 12px; margin-top: 8px; }
.ev-ghost { background: transparent; border: 1px solid var(--border); color: var(--text-1); border-radius: 10px; cursor: pointer; font-family: inherit; }
.ev-table { width: 100%; border-collapse: collapse; background: var(--bg-card); border-radius: 14px; overflow: hidden; }
.ev-table th, .ev-table td { padding: 12px 14px; text-align: right; border-bottom: 1px solid var(--border); font-size: 13.5px; }
.ev-table th { background: var(--bg-hover); color: var(--text-2); font-weight: 700; }
.ev-table tbody tr:hover { background: var(--bg-hover); }
.ev-row-act { display: flex; gap: 6px; }
.ev-mini { width: 32px; height: 32px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg-1);
  color: var(--text-1); cursor: pointer; transition: .15s; }
.ev-mini:hover { background: var(--ipc-green); color: #fff; border-color: var(--ipc-green); }
.ev-mini.danger:hover { background: #c53030; border-color: #c53030; }
.ev-empty-box { text-align: center; padding: 50px; color: var(--text-2); }
.ev-empty-box p { margin: 12px 0 16px; }

/* نموذج التقييم */
.ev-form-layout { flex: 1; display: flex; overflow: hidden; }
.ev-form-main { flex: 1; }
.ev-form-side { flex: 0 0 280px; background: var(--bg-card); border-right: 1px solid var(--border);
  padding: 20px; overflow-y: auto; }
.ev-formhead { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 16px; }
.ev-formhead label { display: flex; flex-direction: column; gap: 5px; font-size: 12.5px; color: var(--text-2); font-weight: 600; }
.ev-formhead input, .ev-notes textarea { background: var(--bg-1); border: 1px solid var(--border); color: var(--text-1);
  border-radius: 9px; padding: 9px 11px; font-family: inherit; font-size: 13.5px; }
.ev-formhead input:focus, .ev-notes textarea:focus, .cr-comment:focus { outline: none; border-color: var(--ipc-green-light); }
.ev-scale-hint { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; font-size: 12.5px; }
.sc-pill { padding: 5px 11px; border-radius: 8px; font-weight: 700; }
.sc-pill.s0 { background: rgba(197,48,48,.15); color: #f0908f; }
.sc-pill.s1 { background: rgba(201,162,39,.15); color: #e6cd77; }
.sc-pill.s2 { background: rgba(79,180,119,.15); color: #6fd196; }

.ev-domain { background: var(--bg-1); border: 1px solid var(--border); border-radius: 14px; margin-bottom: 14px; overflow: hidden; }
.dm-head { display: flex; align-items: center; gap: 12px; padding: 13px 16px; background: var(--bg-hover); }
.dm-no { width: 30px; height: 30px; border-radius: 9px; background: var(--ipc-grad); color: #fff; display: grid; place-items: center; font-weight: 800; }
.dm-title { flex: 1; } .dm-title b { display: block; font-size: 14.5px; } .dm-title small { color: var(--text-2); font-size: 11.5px; }
.dm-weight { background: rgba(201,162,39,.16); color: #e6cd77; font-size: 12px; padding: 4px 10px; border-radius: 20px; font-weight: 700; }
.dm-score { background: var(--bg-card); border: 1px solid var(--border); font-size: 12.5px; padding: 4px 10px; border-radius: 8px; font-weight: 700; min-width: 60px; text-align: center; }
.dm-items { padding: 6px 16px 12px; }
.cr-row { padding: 13px 0; border-bottom: 1px dashed var(--border); }
.cr-row:last-child { border-bottom: 0; }
.cr-text b { font-size: 13.8px; line-height: 1.6; display: block; }
.cr-text small { color: var(--text-2); font-size: 12px; display: block; margin-top: 3px; }
.cr-text small i { color: var(--ipc-green-light); }
.sc-opts { display: flex; gap: 8px; margin: 10px 0; }
.sc-opt { flex: 1; background: var(--bg-card); border: 1px solid var(--border); border-radius: 10px; padding: 8px;
  cursor: pointer; font-family: inherit; transition: .15s; text-align: center; color: var(--text-1); }
.sc-opt b { display: block; font-size: 16px; }
.sc-opt span { font-size: 11px; color: var(--text-2); }
.sc-opt:hover:not(:disabled) { border-color: var(--ipc-green-light); }
.sc-opt.on.s0 { background: #c53030; border-color: #c53030; color: #fff; } .sc-opt.on.s0 span { color: rgba(255,255,255,.85); }
.sc-opt.on.s1 { background: var(--ipc-gold-dark); border-color: var(--ipc-gold-dark); color: #fff; } .sc-opt.on.s1 span { color: rgba(255,255,255,.85); }
.sc-opt.on.s2 { background: var(--ipc-green); border-color: var(--ipc-green); color: #fff; } .sc-opt.on.s2 span { color: rgba(255,255,255,.85); }
.sc-opt:disabled { opacity: .6; cursor: default; }
.cr-comment { width: 100%; background: var(--bg-card); border: 1px solid var(--border); color: var(--text-1);
  border-radius: 8px; padding: 7px 10px; font-family: inherit; font-size: 12.5px; }
.ev-notes label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600; color: var(--text-2); }

/* اللوحة الجانبية */
.side-total { text-align: center; margin-bottom: 20px; }
.st-ring { --p: 0; --c: #16794a; width: 120px; height: 120px; margin: 0 auto 12px; border-radius: 50%;
  background: conic-gradient(var(--c) calc(var(--p) * 1%), var(--border) 0); display: grid; place-items: center; position: relative; }
.st-ring::before { content: ""; position: absolute; width: 92px; height: 92px; border-radius: 50%; background: var(--bg-card); }
.st-ring span { position: relative; font-size: 24px; font-weight: 800; }
.st-rating { font-size: 16px; font-weight: 800; padding: 6px; border-radius: 10px; }
.st-progress { color: var(--text-2); font-size: 12.5px; margin-top: 6px; }
.side-domains { margin: 18px 0; display: flex; flex-direction: column; gap: 9px; }
.sd-row { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.sd-no { width: 22px; height: 22px; border-radius: 7px; background: var(--bg-hover); display: grid; place-items: center; font-weight: 700; }
.sd-bar { flex: 1; height: 8px; background: var(--border); border-radius: 6px; overflow: hidden; }
.sd-bar i { display: block; height: 100%; border-radius: 6px; transition: width .3s; }
.sd-val { min-width: 34px; text-align: left; font-weight: 700; }
.sd-w { color: var(--text-2); min-width: 34px; text-align: left; }

@media (max-width: 900px) {
  .eval-shell { margin: 0; border-radius: 0; }
  .ev-statbar { grid-template-columns: repeat(2, 1fr); }
  .ev-formhead { grid-template-columns: 1fr; }
  .ev-form-layout { flex-direction: column; overflow-y: auto; }
  .ev-form-side { flex: none; border-right: 0; border-top: 1px solid var(--border); }
}

/* أدوات الإدارة الوطنية (بطاقة أداة التقييم) */
.admin-tools { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 16px; margin-bottom: 26px; }
.admin-tool-card {
  position: relative; display: flex; align-items: center; gap: 16px; text-align: right;
  background: linear-gradient(135deg, rgba(15,122,61,.16), rgba(201,162,39,.10)), var(--bg-card);
  border: 1px solid var(--ipc-green); border-radius: 18px; padding: 20px 22px; cursor: pointer;
  color: var(--text-1); font-family: inherit; overflow: hidden; transition: .2s; width: 100%;
}
.admin-tool-card:hover { transform: translateY(-3px); box-shadow: 0 16px 40px rgba(15,122,61,.28); border-color: var(--ipc-gold); }
.atc-glow { position: absolute; inset: -40% -40% auto auto; width: 200px; height: 200px; border-radius: 50%;
  background: radial-gradient(circle, rgba(201,162,39,.25), transparent 70%); pointer-events: none; }
.atc-ico { flex: 0 0 auto; width: 58px; height: 58px; border-radius: 16px; display: grid; place-items: center;
  background: var(--ipc-grad); color: #fff; font-size: 26px; box-shadow: 0 8px 20px rgba(15,122,61,.35); }
.atc-body { flex: 1; }
.atc-body b { display: block; font-size: 16px; margin-bottom: 5px; }
.atc-body small { color: var(--text-2); font-size: 12.8px; line-height: 1.7; }
.atc-arrow { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center;
  background: rgba(255,255,255,.06); color: var(--ipc-gold); font-size: 16px; transition: .2s; }
.admin-tool-card:hover .atc-arrow { background: var(--ipc-gold); color: #12293F; transform: translateX(-4px); }

/* ==========================================================
   جدول جولات مكافحة العدوى 2026 — ICA Audit Schedule
   ========================================================== */
.ica-overlay {
  position: fixed; inset: 0; z-index: 1200;
  background: rgba(4, 12, 8, .78); backdrop-filter: blur(6px);
  display: none; align-items: flex-start; justify-content: center;
  padding: 24px 16px; overflow-y: auto;
}
.ica-overlay.show { display: flex; }
.ica-shell {
  width: 100%; max-width: 1200px; margin: auto;
  background: var(--bg-1); border: 1px solid var(--border);
  border-radius: 20px; box-shadow: 0 30px 80px rgba(0,0,0,.55);
  overflow: hidden; animation: icaIn .28s ease;
}
@keyframes icaIn { from { opacity: 0; transform: translateY(18px) scale(.985); } to { opacity: 1; transform: none; } }

.ica-head {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  padding: 18px 22px; background: var(--ipc-grad); color: #fff;
}
.ica-head-title { display: flex; align-items: center; gap: 14px; }
.ica-head-ico { width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center;
  background: rgba(255,255,255,.16); font-size: 24px; }
.ica-head-title b { display: block; font-size: 17px; }
.ica-head-title small { display: block; font-size: 12px; opacity: .9; margin-top: 3px; }
.ica-close { width: 40px; height: 40px; border-radius: 11px; border: none; cursor: pointer;
  background: rgba(255,255,255,.15); color: #fff; font-size: 17px; transition: .2s; }
.ica-close:hover { background: rgba(255,255,255,.3); }

.ica-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; padding: 18px 22px 6px; }
.ica-stat { background: var(--bg-card); border: 1px solid var(--border); border-radius: 14px;
  padding: 14px; text-align: center; }
.ica-stat b { display: block; font-size: 28px; font-weight: 800; line-height: 1; }
.ica-stat span { display: block; font-size: 12.5px; color: var(--text-2); margin-top: 6px; }
.ica-stat.total b { color: var(--ipc-gold); }
.ica-stat.done b { color: #4FB477; }
.ica-stat.scheduled b { color: #54bcef; }
.ica-stat.postponed b { color: #f59e0b; }

.ica-tabs { display: flex; gap: 8px; padding: 14px 22px; flex-wrap: wrap; }
.ica-tab { border: 1px solid var(--border); background: var(--bg-card); color: var(--text-2);
  padding: 10px 18px; border-radius: 12px; cursor: pointer; font-size: 14px; font-weight: 700;
  font-family: inherit; transition: .2s; }
.ica-tab:hover { background: var(--bg-hover); color: var(--text-1); }
.ica-tab.active { background: var(--ipc-grad); color: #fff; border-color: transparent;
  box-shadow: 0 6px 16px rgba(15,122,61,.35); }

.ica-body { padding: 4px 22px 24px; }
.ica-cat-header { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  flex-wrap: wrap; margin: 8px 0 14px; }
.ica-cat-titles b { display: block; font-size: 15px; color: var(--text-1); }
.ica-cat-titles small { display: block; font-size: 12.5px; color: var(--text-2); margin-top: 4px; }
.ica-period { color: var(--ipc-gold-light); font-weight: 700; }

.ica-btn { border: none; cursor: pointer; font-family: inherit; font-weight: 700; font-size: 13.5px;
  padding: 9px 16px; border-radius: 10px; display: inline-flex; align-items: center; gap: 7px; transition: .2s; }
.ica-btn-add { background: var(--ipc-green); color: #fff; }
.ica-btn-add:hover { background: var(--ipc-green-dark); }
.ica-btn-ghost { background: var(--bg-hover); color: var(--text-1); }
.ica-btn-ghost:hover { background: var(--border); }

.ica-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 14px; }
.ica-table { width: 100%; border-collapse: collapse; font-size: 13.5px; min-width: 760px; }
.ica-table thead th { background: var(--ipc-navy); color: #fff; padding: 12px 12px; text-align: right;
  font-weight: 700; font-size: 13px; white-space: nowrap; position: sticky; top: 0; }
.ica-table tbody td { padding: 11px 12px; border-top: 1px solid var(--border); vertical-align: top; }
.ica-row:hover td { background: var(--bg-hover); }
.ica-row.st-done td { background: rgba(79,180,119,.06); }
.ica-row.st-postponed td { background: rgba(245,158,11,.06); }
.c-month { width: 90px; }
.c-beds { width: 90px; text-align: center; }
.c-status { width: 190px; }
.c-act { width: 120px; }
.ica-month-badge { display: inline-block; background: var(--ipc-grad); color: #fff; font-weight: 800;
  padding: 6px 10px; border-radius: 9px; font-size: 12.5px; }
.c-fac { font-weight: 700; color: var(--text-1); }
.c-aud { color: var(--text-2); font-size: 12.5px; line-height: 1.6; max-width: 280px; }
.ica-postponed-to { margin-top: 5px; font-size: 12px; color: #f59e0b; font-weight: 700; }
.ica-empty-cell { text-align: center; color: var(--text-2); padding: 30px !important; }

.ica-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 20px;
  font-size: 12.5px; font-weight: 700; }
.ica-badge.st-scheduled { background: rgba(84,188,239,.15); color: #54bcef; }
.ica-badge.st-done { background: rgba(79,180,119,.18); color: #4FB477; }
.ica-badge.st-postponed { background: rgba(245,158,11,.16); color: #f59e0b; }
.ica-st-meta { font-size: 11.5px; color: var(--text-2); margin-top: 5px; }
.ica-st-meta.reason { color: #f5c37a; }

.ica-actions { display: flex; gap: 5px; }
.ica-act-btn { width: 32px; height: 32px; border-radius: 8px; border: 1px solid var(--border);
  background: var(--bg-card); color: var(--text-2); cursor: pointer; font-size: 13px; transition: .2s; }
.ica-act-btn:hover { background: var(--bg-hover); color: var(--text-1); }
.ica-act-btn.primary:hover { background: var(--ipc-green); color: #fff; border-color: transparent; }
.ica-act-btn.danger:hover { background: #c53030; color: #fff; border-color: transparent; }
.ica-noperm { color: var(--text-2); }

.ica-loading, .ica-empty { text-align: center; padding: 50px 20px; color: var(--text-2); }
.ica-empty i { font-size: 34px; color: #f59e0b; margin-bottom: 12px; display: block; }
.ica-spin { width: 34px; height: 34px; border: 3px solid var(--border); border-top-color: var(--ipc-green);
  border-radius: 50%; animation: icaSpin .8s linear infinite; margin: 0 auto 12px; }
@keyframes icaSpin { to { transform: rotate(360deg); } }

/* نوافذ ICA */
.ica-modal-back { position: fixed; inset: 0; z-index: 1300; background: rgba(4,12,8,.75); backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center; padding: 20px; }
.ica-modal { width: 100%; max-width: 480px; background: var(--bg-1); border: 1px solid var(--border);
  border-radius: 18px; overflow: hidden; box-shadow: 0 24px 60px rgba(0,0,0,.5); max-height: 92vh;
  display: flex; flex-direction: column; animation: icaIn .22s ease; }
.ica-modal-head { display: flex; align-items: center; justify-content: space-between; padding: 15px 18px;
  background: var(--ipc-navy); color: #fff; }
.ica-modal-head b { font-size: 15px; display: flex; align-items: center; gap: 8px; }
.ica-modal-x { background: rgba(255,255,255,.14); border: none; color: #fff; width: 32px; height: 32px;
  border-radius: 8px; cursor: pointer; }
.ica-modal-body { padding: 18px; overflow-y: auto; }
.ica-modal-facility { font-weight: 800; color: var(--ipc-gold-light); margin-bottom: 14px; font-size: 15px; }
.ica-modal-facility small { color: var(--text-2); font-weight: 500; }
.ica-lbl { display: block; font-size: 13px; font-weight: 700; color: var(--text-1); margin: 12px 0 6px; }
.ica-lbl .req { color: #f87171; }
.ica-input { width: 100%; background: var(--bg-card); border: 1px solid var(--border); border-radius: 10px;
  padding: 10px 12px; color: var(--text-1); font-family: inherit; font-size: 14px; }
.ica-input:focus { outline: none; border-color: var(--ipc-green); }
textarea.ica-input { resize: vertical; }
.ica-status-choices { display: grid; gap: 8px; }
.ica-choice { display: flex; align-items: center; gap: 9px; padding: 11px 14px; border-radius: 11px;
  border: 1px solid var(--border); background: var(--bg-card); cursor: pointer; font-weight: 700; font-size: 14px; }
.ica-choice input { accent-color: var(--ipc-green); width: 17px; height: 17px; }
.ica-choice.st-done { color: #4FB477; }
.ica-choice.st-scheduled { color: #54bcef; }
.ica-choice.st-postponed { color: #f59e0b; }
.ica-cond-fields { margin-top: 6px; padding: 12px 14px; border-radius: 12px; background: var(--bg-card);
  border: 1px dashed var(--border); }
.ica-modal-foot { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 18px;
  border-top: 1px solid var(--border); }

.ica-tool .atc-ico { background: linear-gradient(135deg, #12293F 0%, #0F7A3D 60%, #C9A227 100%); }

@media (max-width: 720px) {
  .ica-summary { grid-template-columns: repeat(2, 1fr); }
  .ica-head-title small { display: none; }
}

.hg-cluster { display:block; margin-top:3px; font-size:.66rem; font-weight:800; }
.hg-cluster i { margin-inline-end:4px; }