.med-dir{
  --paper:#f4f1e9; --card:#fbf9f4; --ink:#15223f; --ink-soft:#46536b;
  --muted:#8a9089; --line:#e2dccd; --navy:#1c3d72; --gold:#b0862f;
  --shadow:rgba(16,30,55,.12);
  position:relative; width:100%; margin:0;
  direction:rtl; text-align:right;
  font-family:'Tajawal',system-ui,sans-serif; color:var(--ink); line-height:1.6;
  -webkit-font-smoothing:antialiased;
  background:var(--paper);
  background-image:
    radial-gradient(circle at 12% 8%, rgba(28,61,114,.05), transparent 40%),
    radial-gradient(circle at 88% 92%, rgba(176,134,47,.06), transparent 45%);
  overflow:hidden; border-radius:22px;
}
.med-dir *{margin:0;padding:0;box-sizing:border-box}

.med-dir .hero{position:relative;background:linear-gradient(150deg,#13294e 0%,#1c3d72 45%,#0d1d3b 100%);color:#f4f1e9;padding:56px 24px 116px;overflow:hidden;text-align:center}
.med-dir .hero::before{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='0.05' stroke-width='1'%3E%3Cpath d='M30 0 L60 30 L30 60 L0 30 Z'/%3E%3Cpath d='M30 12 L48 30 L30 48 L12 30 Z'/%3E%3C/g%3E%3C/svg%3E");opacity:.8}
.med-dir .hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(to top,var(--paper),transparent)}
.med-dir .hero-inner{position:relative;z-index:2;max-width:900px;margin:0 auto}
.med-dir .crest{width:122px;height:auto;margin:0 auto 16px;display:block;filter:drop-shadow(0 10px 22px rgba(0,0,0,.4));animation:medPop .9s cubic-bezier(.2,.9,.3,1.4) both}
.med-dir .eyebrow{font-family:'Reem Kufi',sans-serif;letter-spacing:normal;font-size:.98rem;color:var(--gold);margin-bottom:14px;animation:medRise .7s .1s both}
.med-dir .hero h1{font-family:'Amiri',serif;font-weight:700;font-size:clamp(2.2rem,5.5vw,3.8rem);line-height:1.15;letter-spacing:.5px;animation:medRise .7s .22s both}
.med-dir .hero .rule{width:90px;height:2px;background:var(--gold);margin:20px auto;border:none;animation:medRise .7s .34s both}
.med-dir .pagetitle{font-family:'Reem Kufi',sans-serif;font-size:1.06rem;font-weight:500;color:rgba(244,241,233,.9);letter-spacing:normal;margin-top:4px;animation:medRise .7s .4s both}
.med-dir .supervisor{display:inline-flex;align-items:center;gap:11px;margin-top:6px;padding:9px 20px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.06);border-radius:999px;color:#f4f1e9;animation:medRise .7s .5s both}
.med-dir .supervisor .lbl{font-family:'Reem Kufi',sans-serif;font-size:.95rem;letter-spacing:normal;color:var(--gold)}
.med-dir .supervisor .val{font-weight:700;font-size:.98rem}
.med-dir .supervisor .dotsep{width:5px;height:5px;border-radius:50%;background:var(--gold);opacity:.8}

.med-dir .shell{max-width:1080px;margin:-80px auto 0;padding:0 20px 72px;position:relative;z-index:3}

.med-dir .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(116px,1fr));gap:12px;margin-bottom:34px}
.med-dir .stat{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 12px;text-align:center;box-shadow:0 6px 22px -14px var(--shadow);animation:medRise .6s both}
.med-dir .stat.total{background:linear-gradient(160deg,#1c3d72,#0d1d3b);border-color:transparent;color:#f4f1e9}
.med-dir .stat .num{font-family:'Reem Kufi',sans-serif;font-size:1.9rem;font-weight:700;line-height:1;color:var(--accent,var(--navy))}
.med-dir .stat.total .num{color:var(--gold)}
.med-dir .stat .lbl{font-size:.78rem;color:var(--ink-soft);margin-top:8px;font-weight:500}
.med-dir .stat.total .lbl{color:rgba(244,241,233,.85)}
.med-dir .stat .bar{height:3px;border-radius:2px;margin:10px auto 0;width:34px;background:var(--accent,var(--navy));opacity:.55}
.med-dir .stat.total .bar{background:var(--gold);opacity:.9}

.med-dir .controls{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;margin-bottom:30px;box-shadow:0 10px 30px -20px var(--shadow);animation:medRise .6s .5s both}
.med-dir .search{position:relative;margin-bottom:14px}
.med-dir .search input{width:100%;font-family:'Tajawal',sans-serif;font-size:1rem;padding:14px 48px 14px 16px;border:1.5px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);transition:.2s}
.med-dir .search input:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 4px rgba(28,61,114,.1);background:#fff}
.med-dir .search .ic{position:absolute;right:16px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:1.2rem;pointer-events:none}
.med-dir .chips{display:flex;flex-wrap:wrap;gap:9px}
.med-dir .chip{font-family:'Tajawal',sans-serif;font-size:.86rem;font-weight:500;padding:8px 16px;border-radius:999px;border:1.5px solid var(--line);background:var(--paper);color:var(--ink-soft);cursor:pointer;transition:.18s;display:inline-flex;align-items:center;gap:7px}
.med-dir .chip:hover{border-color:var(--navy);color:var(--navy)}
.med-dir .chip .c{font-size:.72rem;background:var(--line);color:var(--ink-soft);border-radius:999px;padding:1px 8px;font-weight:700;transition:.18s}
.med-dir .chip.active{background:var(--navy);border-color:var(--navy);color:#fff}
.med-dir .chip.active .c{background:rgba(255,255,255,.25);color:#fff}

.med-dir .group{margin-bottom:38px}
.med-dir .group.hidden{display:none}
.med-dir .group-head{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.med-dir .group-head .dot{width:12px;height:12px;border-radius:3px;background:var(--accent);flex:none;transform:rotate(45deg)}
.med-dir .group-head h2{font-family:'Reem Kufi',sans-serif;font-size:1.25rem;font-weight:600;color:var(--ink)}
.med-dir .group-head .count{font-size:.8rem;color:var(--muted);font-weight:500}
.med-dir .group-head .flex-line{flex:1;height:1px;background:var(--line)}
.med-dir .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.med-dir .card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:flex;align-items:center;gap:15px;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s,border-color .2s;box-shadow:0 4px 16px -12px var(--shadow)}
.med-dir .card::before{content:"";position:absolute;top:0;bottom:0;right:0;width:4px;background:var(--accent);opacity:.9}
.med-dir .card:hover{transform:translateY(-3px);box-shadow:0 16px 30px -18px var(--shadow);border-color:rgba(var(--accent-rgb),.5)}
.med-dir .card.hide{display:none}
.med-dir .avatar{width:46px;height:46px;border-radius:12px;flex:none;display:flex;align-items:center;justify-content:center;font-family:'Reem Kufi',sans-serif;font-weight:700;font-size:1.05rem;color:#fff;background:linear-gradient(150deg,rgba(255,255,255,.10),rgba(0,0,0,.30)),var(--accent)}
.med-dir .card .body{flex:1;min-width:0}
.med-dir .card .name{font-weight:700;font-size:1.02rem;color:var(--ink);line-height:1.35}
.med-dir .card .name mark{background:rgba(176,134,47,.35);color:inherit;border-radius:3px;padding:0 2px}
.med-dir .card .meta{display:flex;align-items:center;gap:8px;margin-top:5px;font-size:.78rem;color:var(--muted)}
.med-dir .card .rankpill{font-size:.72rem;font-weight:600;color:var(--accent);background:rgba(var(--accent-rgb),.12);padding:2px 9px;border-radius:999px}
.med-dir .card .idnum{font-family:'Reem Kufi',sans-serif;letter-spacing:.04em}

.med-dir .empty{display:none;text-align:center;padding:60px 20px;color:var(--muted)}
.med-dir .empty.show{display:block}
.med-dir .empty .big{font-size:2.6rem;margin-bottom:10px}

@keyframes medRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes medPop{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}

@media(max-width:820px){.med-dir .stats{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.med-dir .hero{padding:42px 16px 96px}.med-dir .stats{grid-template-columns:repeat(2,1fr)}.med-dir .grid{grid-template-columns:1fr}}

@media (prefers-reduced-motion: reduce){.med-dir *{animation:none!important;opacity:1!important}}

/* ================================================================
   THEME-PROOFING LAYER
   Loaded last and marked !important so an active theme (or page
   builder) cannot override the layout-critical rules. Only geometry
   is forced here — colours/typography stay overridable.
   ================================================================ */
.med-dir, .med-dir *{box-sizing:border-box!important;float:none!important}
.med-dir{display:block!important;width:100%!important;position:relative!important;text-align:right!important}
.med-dir img{max-width:100%!important;height:auto!important}

.med-dir .hero{display:block!important;text-align:center!important;width:100%!important}
.med-dir .hero-inner{max-width:900px!important;margin:0 auto!important;padding:0!important;float:none!important}
.med-dir .crest{width:122px!important;max-width:55%!important;margin:0 auto 16px!important;display:block!important}
.med-dir .rule{display:block!important;width:90px!important;height:2px!important;margin:20px auto!important;padding:0!important;border:none!important;max-width:90px!important}
.med-dir .supervisor{max-width:100%!important;flex-wrap:wrap!important;justify-content:center!important}

.med-dir .shell{max-width:1080px!important;margin:-80px auto 0!important;padding:0 20px 72px!important;width:100%!important;float:none!important}

/* Stats: flex is far more resilient than grid against theme overrides */
.med-dir .stats{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;align-items:stretch!important;gap:12px!important;margin:0 0 34px!important;padding:0!important;list-style:none!important;grid-template-columns:none!important}
.med-dir .stat{flex:1 1 120px!important;min-width:104px!important;max-width:180px!important;margin:0!important;position:relative!important;transform:none!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;display:block!important;padding:18px 12px!important}
.med-dir .stat .num{display:block!important;margin:0!important}
.med-dir .stat .lbl{display:block!important}

.med-dir .controls{width:100%!important;margin:0 0 30px!important;padding:18px!important}
.med-dir .search{display:block!important;width:100%!important}
.med-dir .search input{width:100%!important;max-width:100%!important;height:auto!important;margin:0!important;display:block!important}
.med-dir .chips{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;gap:9px!important;margin:0!important;padding:0!important;list-style:none!important}
.med-dir .chip{width:auto!important;margin:0!important;float:none!important;line-height:normal!important}

.med-dir .group{width:100%!important;margin:0 0 38px!important;padding:0!important;clear:both!important}
.med-dir .group-head{display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:14px!important;margin:0 0 16px!important}
.med-dir .group-head h2{margin:0!important;padding:0!important;border:none!important;line-height:1.3!important}
.med-dir .grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))!important;gap:14px!important;margin:0!important;padding:0!important;list-style:none!important}
.med-dir .card{width:auto!important;max-width:100%!important;margin:0!important;position:relative!important;display:flex!important;align-items:center!important;gap:15px!important;padding:16px 18px!important;float:none!important}
.med-dir .card .body{flex:1 1 auto!important;min-width:0!important}
.med-dir .card .name{margin:0!important;padding:0!important}
.med-dir .card .meta{display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:8px!important;margin:5px 0 0!important}
.med-dir .avatar{flex:0 0 46px!important;width:46px!important;height:46px!important;margin:0!important}

@media (max-width:640px){
  .med-dir .shell{margin-top:-60px!important;padding:0 14px 56px!important}
  .med-dir .stat{flex:1 1 44%!important;max-width:none!important}
  .med-dir .grid{grid-template-columns:1fr!important}
  .med-dir .hero{padding:42px 16px 96px!important}
}

/* --- Visibility states MUST win over the !important layout rules above --- */
.med-dir .card.hide{display:none!important}
.med-dir .group.hidden{display:none!important}
.med-dir .stat.hide{display:none!important}
.med-dir .empty{display:none!important}
.med-dir .empty.show{display:block!important}

/* --- Full-bleed: break out of the theme's content container --- */
.med-dir.is-full{
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  width:auto!important;
  max-width:none!important;
  border-radius:0!important;
  overflow-x:hidden!important;
}

/* --- Clearer, larger faculty line + head label (Tajawal reads better than Kufi here) --- */
.med-dir .eyebrow{
  font-family:'Tajawal',system-ui,sans-serif!important;
  font-size:1.16rem!important;font-weight:700!important;
  letter-spacing:normal!important;line-height:1.5!important;
  color:var(--gold)!important;margin-bottom:16px!important;
}
.med-dir .supervisor{padding:10px 22px!important}
.med-dir .supervisor .lbl{
  font-family:'Tajawal',system-ui,sans-serif!important;
  font-size:1.06rem!important;font-weight:700!important;
  letter-spacing:normal!important;color:var(--gold)!important;
}
.med-dir .supervisor .val{font-size:1.06rem!important;font-weight:700!important}

/* --- Optional: hide the theme footer on directory pages (opt-in) --- */
body.med-dir-no-footer footer,
body.med-dir-no-footer .site-footer,
body.med-dir-no-footer #colophon,
body.med-dir-no-footer #footer,
body.med-dir-no-footer .footer-area,
body.med-dir-no-footer .elementor-location-footer{display:none!important}