/* ===== أساسيات خفيفة ===== */
*{box-sizing:border-box}html,body{margin:0;padding:0}
:root{
  --bg:#f6f8f7; --card:#fff; --line:#e6e9e7; --text:#0f1a1a; --muted:#667085;
  --radius:14px; --shadow:0 10px 24px rgba(0,0,0,.04);
  --accent:#0a8758; --accent-dark:#086c46; --blue:#0a66c2;
}
body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,"Noto Sans Arabic","Noto Naskh Arabic",sans-serif;line-height:1.5}
main.container{max-width:1100px;margin:20px auto;padding:0 16px}

/* ===== بطاقات عامة ===== */
.section{margin:16px 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}
.section-title{display:flex;align-items:center;gap:8px;margin:0 0 12px;font-weight:800}
.section-title .icon{font-size:20px}
.live-dot{width:8px;height:8px;border-radius:999px;background:var(--accent)}

/* ===== أرقام الطوارئ (شبكة بطاقات) ===== */
.em-title{margin:0 0 12px;font-weight:900}
.em-grid{display:grid;gap:12px}
@media(min-width:640px){.em-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.em-grid{grid-template-columns:repeat(3,1fr)}}
.em-card{
  display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;box-shadow:var(--shadow)
}
.em-emoji{font-size:26px;line-height:1}
.em-meta{display:flex;gap:8px;align-items:baseline}
.em-label{font-weight:700}
.em-number{direction:ltr;white-space:nowrap}
/* ===== عنوان + زر المزيد في بلوك الطوارئ ===== */
.em-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:12px;
}
.em-title{
  margin:0;
  font-weight:900;
  font-size:1.05rem;
}
.em-more{
  font-size:.88rem;
  color:#6b7280;
  text-decoration:none;
  font-weight:600;
  transition:color .15s;
}
.em-more:hover{
  color:#0a8758;
}
/* ===== ملاحظة أسفل شبكة الطوارئ ===== */
.em-note{
  margin-top:10px;
  font-size:.88rem;
  color:#777;
  background:#f9fafb;
  border:1px dashed #e0e3e5;
  border-radius:10px;
  padding:10px 14px;
  text-align:center;
  line-height:1.5;
}
.em-note strong{color:#555}
/* ===== ترويسة أرقام الطوارئ مع الأيقونة ===== */
.em-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.em-title-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
}

.em-icon {
  font-size: 1.3rem;
  line-height: 1;
  color: #e74c3c; /* 🔴 أحمر مائل للبرتقالي */
  filter: drop-shadow(0 0 1px rgba(0,0,0,0.1));
}

.em-title {
  margin: 0;
  font-weight: 900;
  font-size: 1.05rem;
  color: #222;
}

.em-more {
  font-size: .88rem;
  color: #6b7280;
  text-decoration: none;
  font-weight: 600;
  transition: color .15s;
}

.em-more:hover {
  color: #0a8758;
}




/* ===== خدمات اليوم (نسخة مختصرة مثل الصورة) ===== */
.today-mini{display:grid;gap:14px}
@media(min-width:768px){.today-mini{grid-template-columns:repeat(3,1fr)}}
.tm-card{display:flex;align-items:center;gap:12px;background:#f4f4f4;border:1px solid var(--line);border-radius:12px;padding:14px;box-shadow:var(--shadow)}
.tm-ico{font-size:22px;flex:0 0 32px;display:flex;align-items:center;justify-content:center}
.tm-title{font-weight:800}
.tm-sub{font-size:.92rem;color:var(--muted)}
.tm-footer{display:flex;justify-content:flex-end;margin-top:10px}
.tm-more{background:var(--accent);color:#fff;text-decoration:none;padding:10px 14px;border-radius:12px;font-weight:800;box-shadow:0 3px 0 0 var(--accent-dark) inset}
.tm-more:hover{opacity:.95;transform:translateY(-1px)}

/* ===== CTA الصرّاف الآلي (وسط الصفحة) ===== */
.atm-cta{text-align:center;background:#e9f7f0;border:1px solid #d5efe5;border-radius:16px;padding:22px}
.atm-title{margin:0 0 8px;font-weight:900;color:#0b7451}
.atm-sub{margin:0 0 14px;color:#475467}
.atm-btn{display:inline-flex;gap:10px;align-items:center;background:var(--blue);color:#fff;text-decoration:none;padding:12px 18px;border-radius:12px;font-weight:800;box-shadow:0 3px 0 0 #094f97 inset}
.atm-btn:hover{opacity:.95;transform:translateY(-1px)}

/* ===== روابط سريعة ===== */
#quicklinks .section-title{font-size:1rem;margin-bottom:12px}
.quicklinks-grid{display:grid;gap:12px}
@media(max-width:767px){.quicklinks-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:768px){.quicklinks-grid{grid-template-columns:repeat(6,1fr)}}
.ql-item{display:flex;align-items:center;gap:8px;background:#f9fbf9;border:1px solid var(--line);border-radius:10px;padding:10px 12px;min-height:56px;text-decoration:none;color:inherit;font-weight:700}
.ql-icon{font-size:1.1rem}
.ql-text{font-size:.9rem}

/* ===== الأقسام الرئيسية ===== */
.maincats-grid{display:grid;gap:12px;margin-top:10px;grid-template-columns:repeat(2,1fr)}
@media(min-width:768px){.maincats-grid{grid-template-columns:repeat(4,1fr)}}
.maincat-card{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px 16px;box-shadow:0 6px 16px rgba(0,0,0,.03)}
.maincat-icon{font-size:1.4rem}
.maincat-text{font-weight:600}

/* ===== تحسينات RTL بسيطة ===== */
body[dir="rtl"] .section-title{flex-direction:row-reverse}
body[dir="rtl"] .tm-card{flex-direction:row-reverse}
body[dir="rtl"] .em-card{flex-direction:row-reverse}
body[dir="rtl"] .ql-item{flex-direction:row-reverse}
body[dir="rtl"] .maincat-card{flex-direction:row-reverse}