/* Shared menu skin. Route order, role filters and existing group structure stay in index.html. */
.shell>.side{--menu-bg:#191731;--menu-line:#ffffff14;background:var(--menu-bg);color:#eeeaf8;box-shadow:none;scrollbar-width:thin;scrollbar-color:#5b507b transparent}
.side :is(.nav,.grp,.v3-navbtn){box-shadow:none;letter-spacing:0;text-transform:none;transition:background .15s,color .15s;outline-offset:-2px}
.side :is(.nav,.v3-navbtn){gap:11px;min-height:44px;padding:11px 12px;border:0;border-radius:10px;font-size:13px;font-weight:500;line-height:1.5;text-align:left;color:#ded8ee;white-space:normal}
.side :is(.nav,.v3-navbtn) svg{width:20px;height:20px;padding:0;flex:none;opacity:.8;stroke-width:1.8}
.side :is(.nav,.v3-navbtn)>span:first-of-type{min-width:0;overflow-wrap:anywhere}
.side :is(.nav,.v3-navbtn):hover{background:#ffffff0d;color:#fff}
.side :is(.nav,.v3-navbtn).active{background:linear-gradient(110deg,#7c35ef,#6330cc);color:white;font-weight:600;box-shadow:inset 0 0 0 1px #ffffff12}
.side :is(.nav,.v3-navbtn).active svg{opacity:1}
.side :is(button,a):focus-visible{outline:2px solid #c4a2ff;box-shadow:none}
.side .nav .n{flex:none;min-width:21px;min-height:21px;height:auto;padding:2px 6px;border-radius:7px;font-size:10px;line-height:1.6;box-shadow:none}
.side .grp{color:#b7accf;font-size:12px;font-weight:600;line-height:1.5;min-height:44px;border-radius:9px}
.side .grp .t{min-width:0;white-space:normal;text-align:left}
.side .grp .num{display:none}
.side .grp:hover,.side .navgrp.open .grp{color:#f3edff;background:#ffffff06;box-shadow:none}
.side .grp svg{opacity:.65}
.side .grp-items .nav{font-size:13px;font-weight:500;line-height:1.5;min-height:44px;padding:11px 12px;border-radius:9px}
.side .grp-items .nav svg{width:19px;height:19px;opacity:.8}
.side .side-foot{border-top:1px solid var(--menu-line);padding:14px 0 0;margin-top:auto}
.side .uchip{border:1px solid var(--menu-line);background:#ffffff05;border-radius:12px;padding:10px;gap:10px;text-align:left;box-shadow:none;min-height:58px}
.side .uchip:hover{background:#ffffff0d}
.side .uchip .ava{width:34px;height:34px;background:#8e5be62b;color:#d7bfff;border:1px solid #b995ff26;box-shadow:none;flex:none}
.side .ut b{color:#f3effb;font-size:12px;line-height:1.5;white-space:normal}
.side .ut :is(#urole,#utenant){color:#b4a9c9;font-size:10px;line-height:1.6;white-space:normal;overflow-wrap:anywhere}
.side .menu-close{display:none}
@media(min-width:1200px){
 .shell>.side{padding:20px 14px 16px;gap:3px}
 .side>*{flex-shrink:0}
 .side button.brand{margin:0 0 15px;padding:0 9px;width:100%;min-height:50px}
 .side .brand-word{width:157px;height:43px}
 .side .grp{padding:12px;cursor:pointer}
 .side .grp-items,.side .navgrp.open .grp-items{margin:0 0 8px;padding:0 0 0 10px;border:0;border-left:1px solid var(--menu-line);border-radius:0;gap:2px}
 .side .side-foot{margin-top:20px}
}
/* Route-independent desktop shell: tablet and desktop use the same left accordion. */
@media(min-width:901px){
 html .shell{padding-left:252px}
 html .side>.nav[data-go="dash"]:not([hidden]){display:flex!important}
 html .shell>.side{position:fixed;inset:0 auto 0 0;width:252px;max-width:none;height:100dvh;display:flex;flex-direction:column;align-items:stretch;flex-wrap:nowrap;margin:0;padding:20px 14px 16px;gap:3px;border:0;border-radius:0;overflow-y:auto;overflow-x:hidden;z-index:60}
 .side>*{flex-shrink:0}
 .side button.brand{margin:0 0 15px;padding:0 9px;width:100%;min-height:50px}
 .side .brand-word{width:157px;height:43px}
 html .side>.nav[data-go="dash"] span:first-of-type,html .side>.nav[data-go="mytasks"] span:first-of-type,html .side>.nav[data-go="notifications"] span:first-of-type{display:inline}
 .side .navgrp{position:relative;width:100%;flex:none}
 .side .side-foot{width:100%;margin:20px 0 0;padding:14px 0 0;border-top:1px solid var(--menu-line)}
 .side .side-foot .who{width:100%}.side .uchip{width:100%;max-width:100%}.side .uchip .ut{display:flex;flex-direction:column}
}
@media(max-width:900px){
 html.menu-open,html.menu-open body{overflow:hidden;overscroll-behavior:none}
 html.menu-open body{position:fixed;top:var(--menu-scroll-top,0px);left:0;right:0;width:100%}
 .shell>.side{width:min(344px,calc(100vw - 32px));max-width:none;height:100dvh;padding:calc(16px + env(safe-area-inset-top)) 14px calc(18px + env(safe-area-inset-bottom));border:0;border-right:1px solid var(--menu-line);border-radius:0 20px 20px 0;gap:3px;z-index:80;overscroll-behavior:contain;scroll-padding-block:65px 20px;box-shadow:none;visibility:hidden;transition:transform .22s ease,visibility .22s}
 .shell>.side.open{visibility:visible;transform:none;box-shadow:16px 0 50px #100b2633}
 .side>*{flex-shrink:0}
 .side .menu-close{display:grid;place-items:center;position:sticky;top:0;align-self:flex-end;width:44px;height:44px;min-height:44px;margin:0 0 -44px;z-index:2;border:1px solid #ffffff20;border-radius:12px;background:#2b2543;color:#eee6ff;font-size:25px;line-height:1;cursor:pointer}
 .side button.brand{min-height:54px;align-self:flex-start;width:calc(100% - 54px);padding:2px 8px 12px;margin:0 0 12px}
 .side .brand-word{width:147px;height:40px}
 .side .brand-tag{display:none}
 .side>.nav{font-size:14px;min-height:46px;padding:11px 12px}
 .side .grp{padding:20px 12px 8px;min-height:44px;font-size:11px;font-weight:600;color:#ad9cc7;letter-spacing:.025em;pointer-events:none}
 .side .grp:hover,.side .navgrp.open .grp{background:transparent;color:#ad9cc7}
 .side .grp-items,.side .navgrp.open .grp-items{gap:3px;min-width:0;padding:0 0 0 9px;margin:0 0 8px 12px;border:0;border-left:1px solid #ffffff12;border-radius:0;background:none;box-shadow:none}
 .side .grp-items .nav{min-height:46px;font-size:13px;padding:11px 12px}
 .side .side-foot{margin-top:18px;flex:none}
 .side .side-foot .who{width:100%}
 .side .uchip{width:100%;max-width:none}
 .backdrop.on{display:block;z-index:79;background:#17122b66;touch-action:none;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
 .tabbar{border-top:1px solid var(--line);border-radius:18px 18px 0 0;background:var(--card);box-shadow:0 -4px 22px #25114408;padding-top:7px}
 .tabbar button{min-height:50px;gap:5px;color:var(--ink-2);font-size:10px;font-weight:500;border-radius:10px}
 .tabbar button.active{color:var(--accent-ink);background:var(--brand-soft);box-shadow:none}
 .tabbar button svg{width:23px;height:23px;color:inherit}
 .tabbar button .n{border-color:var(--card)}
 .tabbar button:focus-visible{outline:2px solid var(--accent-ink);outline-offset:-2px}
 .tabbar button.sos{color:var(--r);font-weight:700}   /* «Мэдээлэх» — цагаан tabbar дээр харагдахгүй байсан (хуучин бараан самбарын rgba(255,255,255,.6) өнгө үлдсэн) */
 .tabbar button.sos.active{color:var(--r);background:var(--r-bg,#fcecef)}
}
@media(prefers-reduced-motion:reduce){.shell>.side,.side :is(.nav,.grp,.v3-navbtn){transition:none}}

/* ── Эцсийн Sidebar (2026-09-28): үндсэн цэс (дүрстэй, тод) → › дэд цэс (16–24px арагш, дүрсгүй) — accordion ──
   Нэг л Sidebar: ХАБЭА-н нүүрний тусдаа товч цэс (#v3_sidebar/#v3_allnav) хэрэглэхгүй. */
#v3_sidebar,#v3_allnav{display:none!important}
.side .grp svg.grp-ico{display:block;width:20px;height:20px;flex:none;opacity:.85;transform:none!important}
.side .grp svg.chev{display:block;width:14px;height:14px;flex:none;margin-left:auto;opacity:.6;transform:none;transition:transform .18s}
.side .navgrp.open .grp svg.chev{transform:rotate(90deg)!important}
.side .grp-items .nav svg{display:none}
@media (min-width:0px){
 html .shell>.side .grp{display:flex;align-items:center;gap:11px;width:100%;min-height:44px;padding:11px 12px;border-radius:10px;font-size:13.5px;font-weight:600;line-height:1.5;color:#e4def2;text-transform:none;letter-spacing:0;cursor:pointer;pointer-events:auto;background:none;box-shadow:none}
 html .shell>.side .grp:hover{background:#ffffff0d;color:#fff}
 html .shell>.side .navgrp.open>.grp{background:#ffffff08;color:#fff}
 html .shell>.side .navgrp.has-active>.grp{background:#7c35ef2e;color:#fff}
 html .shell>.side .grp .num{display:none}
 html .shell>.side .grp .t{flex:1;min-width:0;text-align:left}
 html .shell>.side .navgrp .grp-items{display:none}
 html .shell>.side .navgrp.open .grp-items{display:flex;flex-direction:column;position:static;min-width:0;max-height:none;overflow:visible;gap:2px;margin:2px 0 6px 21px;padding:0 0 0 10px;border:0;border-left:1px solid #ffffff1f;border-radius:0;background:none;box-shadow:none}
 html .shell>.side .grp-items .nav{min-height:40px;padding:9px 12px;font-size:13px;font-weight:450;color:#cfc8e3;border-radius:9px;gap:0;background:none;box-shadow:none}
 html .shell>.side .grp-items .nav:hover{background:#ffffff0d;color:#fff}
 html .shell>.side .grp-items .nav.active{background:#ffffff17;color:#fff;font-weight:600;box-shadow:none}
 html .shell>.side>.nav{width:100%;font-size:13.5px;font-weight:600;color:#e4def2;min-height:44px;padding:11px 12px;gap:11px}
 html .shell>.side>.nav.active{background:#7c35ef40;color:#fff;box-shadow:none}
 html .shell>.side>.nav svg{width:20px;height:20px;padding:0;background:none;box-shadow:none;border-radius:0;opacity:.85}
}
/* ТЗ 56: «Урьдчилан сэргийлэх» бүлгийн 8 дэд цэс — нэг хэмжээ, нэг зузаан, нил ягаан шугаман дүрс (дэвсгэр, градиент, эффектгүй). Бусад бүлгийн дэд цэс дүрсгүй хэвээр. */
.side .navgrp[data-grp="prevent"] .grp-items .nav{display:flex;align-items:center;gap:10px}
.side .navgrp[data-grp="prevent"] .grp-items .nav svg.sub-ico{display:block;flex:none;width:17px;height:17px;padding:0;margin:0;background:none;box-shadow:none;border-radius:0;color:#b79cff;opacity:1}
.side .navgrp[data-grp="prevent"] .grp-items .nav:hover svg.sub-ico{color:#cdb8ff}
.side .navgrp[data-grp="prevent"] .grp-items .nav.active svg.sub-ico{color:#e2d5ff}
