
.mobile-nav-switch{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.mobile-menu-toggle{display:none}.hamburger-close{display:none}
@media(max-width:800px){
.mobile-menu-toggle{display:flex;align-items:center;justify-content:center;flex:0 0 39px;width:39px;height:39px;border:1px solid #c8dfef;border-radius:9px;background:#eef7ff;color:#075696;font-size:25px;line-height:1;cursor:pointer;user-select:none}
.mainhead .shell{gap:8px}.headlinks{gap:10px}.brand{margin-left:auto}
.nav{display:block!important;position:fixed!important;top:0;right:0;bottom:0;left:auto;width:min(82vw,330px);height:100dvh;z-index:1003;background:#f3f9ff;color:#074476;box-shadow:-12px 0 40px #062b4b25;transform:translateX(110%);visibility:hidden;transition:transform .28s ease,visibility .28s;overflow-y:auto;overscroll-behavior:contain}
.mobile-nav-switch:checked ~ .nav{transform:translateX(0);visibility:visible}
.mobile-nav-switch:checked ~ .mainhead .hamburger-open{display:none}
.mobile-nav-switch:checked ~ .mainhead .hamburger-close{display:inline}
.nav .shell{display:flex;flex-direction:column;align-items:stretch;overflow:visible;gap:0;padding:65px 16px 24px}
.nav .shell:before{content:"قائمة المتجر";display:block;padding:0 10px 14px;font-size:21px;font-weight:800;color:#063b70;border-bottom:2px solid #bcdff7}
.nav a{display:block;padding:13px 11px;border-bottom:1px solid #d5e8f6;font-size:15px;color:#074476}
.nav a:first-child,.nav a:hover{background:#e0f0fc;color:#064f94}
.mobile-nav-backdrop{display:block;position:fixed;inset:0;background:#03274696;z-index:1002;opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s}
.mobile-nav-switch:checked ~ .mobile-nav-backdrop{opacity:1;visibility:visible}
.mobile-nav-close{display:none;position:fixed;z-index:1004;top:14px;right:min(72vw,286px);width:35px;height:35px;align-items:center;justify-content:center;background:white;border-radius:50%;font-size:22px;color:#06477f;box-shadow:0 3px 12px #022d4c22;cursor:pointer}
.mobile-nav-switch:checked ~ .mobile-nav-close{display:flex}
}
@media(prefers-reduced-motion:reduce){.nav,.mobile-nav-backdrop{transition:none!important}}
