/* ═══════════════════════════════════════════════════════════
   مكوّنات الصفحات الداخلية — Inner page components
   ═══════════════════════════════════════════════════════════ */

/* ── بطاقات الخدمات الإلكترونية ── */
.esv-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:16px}
.esv-card{
  display:grid; grid-template-columns:auto 1fr auto; gap:16px; align-items:center;
  padding:22px 24px; border-radius:var(--r-lg); color:inherit;
  background:var(--surface); border:1px solid var(--line);
  transition:box-shadow .26s var(--ease), transform .26s var(--ease), border-color .26s var(--ease);
}
.esv-card:hover{box-shadow:var(--shadow-2); transform:translateY(-2px); border-color:var(--brass-line)}
.esv-card.primary{background:var(--ink-solid); color:#F2F5F8; border-color:transparent}
.esv-card.primary:hover{box-shadow:var(--shadow-3)}
.esv-ic{
  width:46px; height:46px; flex:none; display:grid; place-items:center; border-radius:13px;
  background:var(--brass-soft); color:var(--brass); border:1px solid var(--brass-line);
}
.esv-card.primary .esv-ic{background:rgba(214,165,82,.18); color:var(--brass-2); border-color:rgba(214,165,82,.32)}
.esv-ic svg{width:21px; height:21px}
.esv-txt{display:flex; flex-direction:column; gap:4px; min-width:0}
.esv-txt > b{font-family:'Tajawal',system-ui,sans-serif; font-weight:800; font-size:16.5px; display:flex; align-items:center; gap:7px}
.esv-txt > span{font-size:13.5px; color:var(--ink-3); line-height:1.65}
.esv-card.primary .esv-txt > b{color:#fff}
.esv-card.primary .esv-txt > span{color:rgba(242,245,248,.62)}
.esv-txt .ext{width:12px; height:12px; opacity:.5; display:inline-grid}
.esv-txt .ext svg{width:100%; height:100%}
.esv-go{
  width:34px; height:34px; flex:none; display:grid; place-items:center; border-radius:50%;
  background:var(--surface-2); color:var(--brass); border:1px solid var(--line);
}
.esv-card.primary .esv-go{background:rgba(242,245,248,.1); border-color:rgba(242,245,248,.18); color:var(--brass-2)}
.esv-go svg{width:15px; height:15px; transition:transform .22s var(--ease)}
[dir="rtl"] .esv-go svg{transform:scaleX(-1)}
.esv-card:hover .esv-go svg{transform:translateX(3px)}
[dir="rtl"] .esv-card:hover .esv-go svg{transform:scaleX(-1) translateX(3px)}

/* ── رئيس الجامعة ── */
.pres{display:grid; grid-template-columns:300px 1fr; gap:38px; align-items:start}
.pres-photo{border-radius:var(--r-lg); overflow:hidden; background:var(--surface-3); box-shadow:var(--shadow-2)}
.pres-photo img{width:100%; aspect-ratio:4/5; object-fit:cover; object-position:top center}
.pres-txt{display:flex; flex-direction:column; gap:14px}
.pres-txt h3{font-size:25px}
.pres-role{font-size:14px; color:var(--brass); font-weight:600; margin-top:-8px}
.pres-txt p{font-size:15.5px; line-height:1.9; color:var(--ink-2); max-width:64ch}
@media (max-width:820px){.pres{grid-template-columns:1fr; gap:24px} .pres-photo{max-width:260px}}

/* ── التحقق من الشهادة ── */
.verify-box{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:32px; box-shadow:var(--shadow-1)}
.v-label{display:block; font-size:13.5px; font-weight:600; color:var(--ink-2); margin-bottom:9px}
.v-row{display:flex; gap:12px; flex-wrap:wrap}
.v-row .input{flex:1; min-width:220px; font-family:'IBM Plex Sans Arabic'; letter-spacing:.02em}
.v-result{margin-top:24px; padding:22px 24px; border-radius:var(--r); border:1px solid var(--line)}
.v-result.ok{background:var(--ok-soft); border-color:var(--ok)}
.v-result.bad{background:var(--flag-soft); border-color:var(--flag)}
.v-result > b{display:block; font-family:'Tajawal',system-ui,sans-serif; font-weight:800; font-size:18px; margin-bottom:12px}
.v-result.ok > b{color:var(--ok)}
.v-result.bad > b{color:var(--flag)}
.v-fields{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; margin-bottom:12px}
.v-fields div{display:flex; flex-direction:column; gap:3px}
.v-fields span{font-size:11.5px; color:var(--ink-3)}
.v-fields b{font-size:15px; font-family:'Tajawal',system-ui,sans-serif; font-weight:700}
.v-result .small{color:var(--ink-3)}

/* ── خطوات مرقّمة ── */
.flow{display:grid; gap:12px}
.step{display:grid; grid-template-columns:auto 1fr; gap:18px; align-items:start;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:20px 24px}
.step .n{
  width:34px; height:34px; flex:none; display:grid; place-items:center; border-radius:10px;
  background:var(--brass-soft); color:var(--brass); border:1px solid var(--brass-line);
  font-family:'Tajawal',system-ui,sans-serif; font-weight:800; font-size:14px; font-variant-numeric:tabular-nums;
}
.step .n::before{content:var(--i)}
.step h4{font-size:17px; font-family:'Tajawal',system-ui,sans-serif; font-weight:800; margin-bottom:5px}
.step p{font-size:14.5px; color:var(--ink-2); line-height:1.8}
.step .hint{display:inline-block; margin-top:10px; font-size:12.5px; font-weight:600;
  color:var(--brass); background:var(--brass-soft); padding:4px 12px; border-radius:100px}

/* ══ مجموعة الفلاتر — أزرار مقسّمة ══ */
.pill-group{
  display:inline-flex; align-items:center; gap:4px; padding:5px;
  border-radius:100px; background:var(--surface-2); border:1px solid var(--line);
  max-width:100%; overflow-x:auto; scrollbar-width:none;
}
.pill-group::-webkit-scrollbar{display:none}

.pill{
  position:relative; display:inline-flex; align-items:center; gap:8px;
  padding:9px 20px; border-radius:100px; cursor:pointer; white-space:nowrap;
  background:transparent; border:1px solid transparent; color:var(--ink-2);
  font-family:'Tajawal',system-ui,sans-serif; font-weight:700; font-size:14.5px;
  line-height:1.6; letter-spacing:0;
  transition:background .2s var(--ease), color .2s var(--ease), box-shadow .2s var(--ease);
}
.pill:hover{background:var(--surface); color:var(--ink)}
.pill[aria-pressed="true"]{
  background:var(--brass); color:#fff; box-shadow:0 2px 8px -2px rgba(120,82,24,.45);
}
[data-theme="dark"] .pill[aria-pressed="true"]{color:#160F04}
/* عدّاد اختياري داخل الزرّ */
.pill .n{
  font-family:'IBM Plex Sans Arabic'; font-weight:600; font-size:11.5px;
  font-variant-numeric:tabular-nums; padding:1px 7px; border-radius:100px;
  background:var(--surface-3); color:var(--ink-3);
}
.pill[aria-pressed="true"] .n{background:rgba(255,255,255,.24); color:#fff}
[data-theme="dark"] .pill[aria-pressed="true"] .n{background:rgba(22,15,4,.2); color:#160F04}

/* الصفّ الحرّ (بلا حاوية) — للفلاتر الطويلة */
.pill-row{display:flex; gap:8px; flex-wrap:wrap}
.pill-row .pill{border-color:var(--line-2); background:var(--surface)}
.pill-row .pill:hover{border-color:var(--brass); color:var(--brass)}
.pill-row .pill[aria-pressed="true"]{border-color:var(--brass); background:var(--brass); color:#fff}
[data-theme="dark"] .pill-row .pill[aria-pressed="true"]{color:#160F04}

/* ── بطاقة خبر قابلة للضغط ── */
.news{cursor:pointer; text-align:start; width:100%; padding:0; font:inherit}
.news:hover{border-color:var(--brass-line)}

/* ── لوحة الخبر داخل الشيت ── */
.news-sheet-img{width:100%; aspect-ratio:16/9; object-fit:cover; display:block}

/* article/news lead image as a content card (added 2026-08-11) */
.art-figure{margin:0 0 30px; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); background:var(--surface-2)}
.art-figure img{display:block; width:100
/* article/news lead image as a content card (added 2026-08-11) */
.art-figure{margin:0 0 30px; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); background:var(--surface-2)}
.art-figure img{display:block; width:100%; height:auto}