@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@400;700&display=swap");
/* القائمة بألوان صفحة الوضوء */
#menuDrawer,#menuBtn{--m-card:#fff;--m-ink:#1d2a2a;--m-mute:#66736f;--m-line:#e3ded2;--m-accent:#0f6b5c;--m-accent-soft:#e2f1ed;--m-gold:#b7791f}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) #menuDrawer{--m-card:#172524;--m-ink:#e8efed;--m-mute:#9db0ab;--m-line:#2a3d3b;--m-accent:#4fc3ab;--m-accent-soft:#17352f;--m-gold:#f0b95a}}
:root[data-theme="dark"] #menuDrawer{--m-card:#172524;--m-ink:#e8efed;--m-mute:#9db0ab;--m-line:#2a3d3b;--m-accent:#4fc3ab;--m-accent-soft:#17352f;--m-gold:#f0b95a}
#menuBtn.nav-burger{background:#0f4d43;color:#f0b95a;border:none;box-shadow:0 2px 8px rgba(0,0,0,.18)}
#menuBtn.nav-burger:hover{background:#0f6b5c}
.menu-overlay#menuOverlay{background:rgba(0,0,0,.35)}
#menuDrawer.menu-drawer{background:var(--m-card);border-left:none;box-shadow:-4px 0 20px rgba(0,0,0,.15);font-family:"Noto Sans Arabic",Tahoma,"Geeza Pro",Arial,sans-serif}
#menuDrawer .menu-head{border-bottom:1px solid var(--m-line)}
#menuDrawer .menu-head .menu-title{font-family:inherit;font-size:17px;color:var(--m-accent)}
#menuDrawer .menu-close{border:none;background:none;color:var(--m-mute)}
#menuDrawer .menu-close:hover{color:var(--m-accent)}
#menuDrawer .menu-list a{background:transparent;border:none;color:var(--m-ink);font-size:15px;font-weight:400;border-radius:10px}
#menuDrawer .menu-list a:hover,#menuDrawer .menu-list a:focus-visible{background:var(--m-accent-soft);color:var(--m-accent);transform:none}
#menuDrawer .menu-list a[aria-current="page"]{background:var(--m-accent-soft);color:var(--m-accent);font-weight:700}
#menuDrawer .menu-list .mi{background:none;color:var(--m-gold)}
#menuDrawer .menu-list .ml small{color:var(--m-mute)}
#menuDrawer .menu-list .arrow{color:var(--m-mute);opacity:1}
#menuDrawer.menu-drawer{width:min(300px,84vw);padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px);display:block;line-height:1.7}
#menuDrawer .menu-head{padding:16px;margin:0}
#menuDrawer .menu-close{width:auto;height:auto;padding:4px;border-radius:0}
#menuDrawer .menu-list{display:block;margin:0;padding:8px}
#menuDrawer .menu-list li{margin:0;padding:0}
#menuDrawer .menu-list a{gap:12px;padding:12px;margin:0}
#menuDrawer .menu-list .mi{flex:0 0 auto;width:auto;height:auto;border-radius:0;display:grid}
#menuDrawer .menu-list .mi svg,#menuDrawer .menu-list .arrow svg{width:20px;height:20px}
#menuDrawer .menu-list .ml{flex:1;display:flex;flex-direction:column;line-height:1.35}
#menuDrawer .menu-list .ml small{font-size:12px;margin:0}
#menuDrawer .menu-list .arrow{margin:0;display:grid}
