/* Left sidebar frame. Each page adds its own menu group (#sg-xxx), see css/pages/* */
.wrap{flex:1;min-height:0;display:flex}
.side{flex:none;width:214px;background:#fff;border-right:1px solid #e1e8f2;display:flex;flex-direction:column;padding:12px 14px 0;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin}
.sg{display:none;flex-direction:column}
.side a{display:flex;align-items:center;gap:14px;height:clamp(36px,5.2vh,50px);padding:0 14px;border-radius:12px;color:#1c2b4a;text-decoration:none;font-size:16px;font-weight:500;margin-bottom:clamp(3px,.8vh,7px);transition:background .12s}
.side a .ic{width:25px;height:25px;color:#26395f}
.side a:hover:not(.on){background:#eef3fb}
.side a.on{background:linear-gradient(180deg,#2f7bff,#1560ec);color:#fff;box-shadow:0 6px 14px rgba(29,107,243,.35);font-weight:600}
.side a.on .ic{color:#fff}
.sidef{margin:auto -14px 0;display:flex;flex-direction:column}
.sidef svg{display:block;width:100%;height:auto}
.sidef div{padding:0 18px 16px;background:#dbe6f6}
.sidef b{display:block;font-size:27px;color:var(--navy);line-height:1.1}
.sidef span{display:block;font-size:19px;font-weight:600;color:#2a3d63}
@media(max-height:820px){.sidef svg{display:none}.sidef div{background:#fff}}
@media(max-width:1180px){.side{display:none}}
/* fixed navigation: everywhere except the login page and the Aviation (METAR/SPECI) pages, which have their own panel */
body:not([data-view=login]):not([data-view=metar]):not([data-view=review]):not([data-view=done]) #sg-nav{display:flex}
#sg-nav a{gap:12px;padding:0 12px;line-height:1.15}
#sg-nav a span{min-width:0}
/* Duty Met (admin) menu order. Station users keep the order of the markup. */
body[data-role=admin] #sg-nav a[data-nv=dash]{order:1}
body[data-role=admin] #sg-nav a[data-nv=warning]{order:2}
body[data-role=admin] #sg-nav a[data-nv=cwr]{order:3}
body[data-role=admin] #sg-nav a[data-nv=stn]{order:4}
body[data-role=admin] #sg-nav a[data-nv=alerts]{order:5}
body[data-role=admin] #sg-nav a[data-nv=olbs]{order:6}
body[data-role=admin] #sg-nav a[data-nv=history]{order:7}
body[data-role=admin] #sg-nav a[data-nv=analytics]{order:8}
body[data-role=admin] #sg-nav a[data-nv=notification]{order:9}
body[data-role=admin] #sg-nav .fbbtn{order:10}
