/* ═══════════════════════════════════════════════════════════
   التقويم الأكاديمي — شبكة أشهر + جدول مفصّل
   Academic calendar — month grid + detailed table
   ═══════════════════════════════════════════════════════════ */

.cal-view{display:flex; gap:6px; padding:5px; border-radius:100px; background:var(--surface-2); border:1px solid var(--line)}
.cal-view button{
  padding:8px 18px; border:0; border-radius:100px; cursor:pointer; background:transparent;
  font-family:'Tajawal',system-ui,sans-serif; font-weight:700; font-size:14px; color:var(--ink-2);
  transition:background .2s var(--ease), color .2s var(--ease);
}
.cal-view button[aria-selected="true"]{background:var(--brass); color:#fff; box-shadow:var(--shadow-1)}
[data-theme="dark"] .cal-view button[aria-selected="true"]{color:#160F04}

/* ── شبكة الأشهر ── */
.months{display:grid; grid-template-columns:repeat(auto-fill,minmax(268px,1fr)); gap:18px}
.month{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  overflow:hidden; box-shadow:var(--shadow-1);
}
.month-h{
  display:flex; align-items:baseline; gap:9px; padding:14px 18px;
  background:var(--surface-2); border-bottom:1px solid var(--line);
}
.month-h b{font-family:'Tajawal',system-ui,sans-serif; font-weight:800; font-size:16px}
.month-h span{font-size:12px; color:var(--ink-3); font-variant-numeric:tabular-nums}
.month-h .cnt{margin-inline-start:auto; font-size:11px; font-weight:600; color:var(--brass); background:var(--brass-soft); padding:2px 9px; border-radius:100px}

.dow{display:grid; grid-template-columns:repeat(7,1fr); padding:10px 12px 4px; gap:2px}
.dow span{
  text-align:center; font-size:10.5px; font-weight:600; color:var(--ink-3);
  font-family:'IBM Plex Sans Arabic';
}
.days{display:grid; grid-template-columns:repeat(7,1fr); gap:2px; padding:0 12px 14px}
.day{
  position:relative; aspect-ratio:1; display:grid; place-items:center; border-radius:7px;
  font-size:12.5px; font-variant-numeric:tabular-nums; color:var(--ink-2);
  transition:background .16s var(--ease);
}
.day.out{color:var(--ink-3); opacity:.35}
.day.has{font-weight:600; cursor:pointer}
.day.has:hover{background:var(--surface-2)}
/* نقاط الأحداث تحت الرقم */
.day .dots{position:absolute; inset-block-end:3px; display:flex; gap:2px}
.day .dots i{width:4px; height:4px; border-radius:50%; display:block}
/* الأيام الممتدة تُظلَّل */
.day.span{background:var(--brass-soft)}
.day.span.teach{background:var(--brass-soft)}
.day.span.exam{background:var(--flag-soft)}
.day.span.reg,.day.span.admission{background:var(--lapis-soft)}
.day.point{box-shadow:inset 0 0 0 1.5px var(--brass)}
.day.holiday{background:var(--ok-soft); color:var(--ok); font-weight:700}

/* ── مفتاح الألوان ── */
.cal-key{display:flex; flex-wrap:wrap; gap:16px; font-size:13px; color:var(--ink-2)}
.cal-key span{display:flex; align-items:center; gap:8px}
.cal-key i{width:13px; height:13px; border-radius:4px; flex:none; display:block}

/* ── تفاصيل اليوم ── */
.day-pop{
  position:fixed; z-index:120; max-width:320px; padding:14px 18px; border-radius:12px;
  background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-3);
  font-size:13.5px; pointer-events:none;
}
.day-pop b{display:block; font-family:'Tajawal',system-ui,sans-serif; font-weight:800; font-size:14px; margin-bottom:5px}
.day-pop ul{margin:0; padding-inline-start:16px; display:flex; flex-direction:column; gap:4px; color:var(--ink-2)}
.day-pop li::marker{color:var(--brass)}

@media (max-width:520px){
  .months{grid-template-columns:1fr}
}

/* today's date — red border ring (added 2026-09-14) */
.day.today{box-shadow:inset 0 0 0 2px var(--flag); color:var(--flag); font-weight:700}
.day.point.today,.day.holiday.today,.day.span.today{box-shadow:inset 0 0 0 2px var(--flag)}
