/* Executive shell pass.
   Scope: authenticated shell/menu only. Login, API contracts and business rules stay untouched. */

:root{
  --navx-shell-w:292px;
  --navx-shell-bg:#2b3945;
  --navx-shell-bg2:#22313d;
  --navx-shell-card:#354655;
  --navx-shell-line:rgba(255,255,255,.11);
  --navx-shell-muted:rgba(255,255,255,.66);
  --navx-shell-text:rgba(255,255,255,.94);
  --navx-shell-accent:#38bdf8;
}

.app.navx-auth .navx-sidebar{
  width:var(--navx-shell-w);
  background:
    linear-gradient(180deg, rgba(46,62,76,.98) 0%, rgba(35,50,62,.99) 56%, rgba(31,45,56,.99) 100%),
    var(--navx-shell-bg);
  border-right:1px solid var(--navx-shell-line);
  box-shadow:
    18px 0 48px rgba(15,23,42,.18),
    inset -1px 0 0 rgba(255,255,255,.04);
}

.app.navx-auth .navx-main{
  width:calc(100% - var(--navx-shell-w));
  margin-left:var(--navx-shell-w);
}

.navx-sideTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:18px 18px 11px;
}

.navx-brand{
  min-width:0;
}

.navx-logoBox{
  width:48px;
  height:48px;
  border-radius:15px;
  background:#fff;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:
    0 16px 30px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.92);
}

.navx-brandText{
  min-width:0;
}

.navx-brandTitle{
  color:var(--navx-shell-text);
  font-size:16px;
  font-weight:950;
}

.navx-brandSub{
  color:var(--navx-shell-muted);
  font-size:10px;
  font-weight:850;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.navx-close{
  display:none;
  appearance:none;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.86);
  width:42px;
  height:42px;
  border-radius:14px;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.navx-close:hover,
.navx-close:focus-visible{
  background:rgba(255,255,255,.10);
  color:#fff;
  outline:none;
}

.navx-userCard{
  margin:9px 14px 14px;
  padding:14px;
  border-radius:18px;
  background:
    linear-gradient(135deg, rgba(56,189,248,.12), rgba(255,255,255,.045)),
    var(--navx-shell-card);
  border:1px solid var(--navx-shell-line);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 16px 30px rgba(15,23,42,.12);
}

.navx-avatar,
.navx-mobileTrigger #navxMobileAvatar{
  background:
    linear-gradient(135deg, rgba(56,189,248,.96), rgba(37,99,235,.88));
  color:#fff;
  box-shadow:
    0 12px 24px rgba(15,23,42,.20),
    inset 0 1px 0 rgba(255,255,255,.22);
}

.navx-userName{
  color:#fff;
  font-size:13px;
  font-weight:900;
}

.navx-userRole{
  color:#7dd3fc;
  font-size:11px;
  font-weight:900;
  letter-spacing:.05em;
}

.navx-userMeta{
  color:var(--navx-shell-muted);
  font-size:11px;
  font-weight:720;
}

.navx-list{
  padding:6px 12px 12px;
  gap:6px;
  min-height:0;
  flex:1 1 auto;
}

.navx-item{
  min-height:45px;
  padding:12px 13px;
  border-radius:14px;
  color:rgba(255,255,255,.72);
  font-size:12px;
  font-weight:900;
  letter-spacing:.035em;
  text-transform:uppercase;
  border:1px solid transparent;
}

.navx-item:hover{
  color:#fff;
  background:rgba(255,255,255,.075);
  border-color:rgba(255,255,255,.06);
}

.navx-item.active{
  color:#fff;
  background:
    linear-gradient(135deg, rgba(56,189,248,.16), rgba(255,255,255,.06));
  border-color:rgba(56,189,248,.16);
  box-shadow:
    inset 4px 0 0 var(--navx-shell-accent),
    0 12px 22px rgba(15,23,42,.11);
}

.navx-item.active::before{
  display:none;
}

.navx-icon{
  opacity:.92;
}

.navx-item.active .navx-icon{
  color:#7dd3fc;
}

.navx-subgroup{
  margin:-1px 0 4px 10px;
  padding:4px 0 5px 10px;
  border-left:1px solid rgba(255,255,255,.10);
}

.navx-subitem{
  width:calc(100% - 8px);
  margin-left:0;
  min-height:40px;
  padding:10px 11px;
  border-radius:13px;
  font-size:11px;
  background:rgba(255,255,255,.025);
}

.navx-subitem.active{
  background:
    linear-gradient(135deg, rgba(56,189,248,.16), rgba(255,255,255,.045));
  color:#fff;
  box-shadow:inset 3px 0 0 var(--navx-shell-accent);
}

.navx-danger{
  margin-top:2px;
}

.navx-footer{
  display:flex;
  flex-direction:column;
  gap:3px;
  margin:0 14px 14px;
  padding:13px 14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.045);
  color:var(--navx-shell-muted);
}

.navx-footer strong{
  color:rgba(255,255,255,.90);
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.navx-footer span{
  font-size:11px;
  font-weight:680;
  line-height:1.25;
}

@media (max-width:900px){
  .app.navx-auth .navx-mobileHeader{
    height:66px;
    padding:8px 14px;
    background:rgba(255,255,255,.92);
    border-bottom:1px solid rgba(15,23,42,.08);
    box-shadow:0 14px 34px rgba(15,23,42,.08);
  }

  .navx-mobileBrand{
    gap:10px;
  }

  .navx-mobileBrand img{
    width:40px;
    height:40px;
    border-radius:13px;
    box-shadow:0 8px 18px rgba(15,23,42,.08);
  }

  .navx-mobileBrandTitle{
    font-size:14px;
    font-weight:950;
  }

  .navx-mobileBrandSub{
    max-width:44vw;
    font-size:10px;
    font-weight:820;
    letter-spacing:.02em;
    text-transform:uppercase;
  }

  .navx-mobileTrigger{
    min-width:0;
    max-width:min(58vw, 278px);
    min-height:44px;
    padding:4px 7px 4px 10px;
    border-radius:16px;
    border:1px solid rgba(15,23,42,.09);
    background:rgba(255,255,255,.92);
    box-shadow:
      0 12px 28px rgba(15,23,42,.10),
      inset 0 1px 0 rgba(255,255,255,.92);
  }

  .app.navx-open .navx-mobileTrigger{
    border-color:rgba(37,99,235,.20);
    box-shadow:
      0 16px 34px rgba(15,23,42,.13),
      inset 0 1px 0 rgba(255,255,255,.96);
  }

  .navx-mobileTrigger #navxMobileAvatar{
    width:34px;
    height:34px;
    font-size:11px;
    flex:0 0 34px;
  }

  .navx-mobileChevron{
    margin-left:1px;
    border-color:rgba(15,23,42,.54);
  }

  .app.navx-auth .navx-sidebar{
    inset:66px 0 0 0;
    width:100%;
    max-width:none;
    height:calc(100svh - 66px);
    border-right:0;
    transform:translateY(-104%);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:
      transform .28s cubic-bezier(.22,.9,.25,1),
      opacity .20s ease,
      visibility .20s ease;
  }

  .app.navx-auth .navx-sidebar.open{
    transform:translateY(0);
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }

  .app.navx-auth .navx-main{
    width:100%;
    margin:0 auto;
    padding-top:82px;
  }

  .navx-close{
    display:inline-flex;
  }

  .navx-sideTop{
    padding:14px 18px 8px;
  }

  .navx-userCard{
    margin:8px 18px 10px;
    padding:12px;
  }

  .navx-list{
    padding:4px 18px 8px;
    gap:5px;
    overflow:auto;
  }

  .navx-item{
    min-height:44px;
    padding:12px 13px;
    border-radius:15px;
  }

  .navx-subgroup{
    margin-left:11px;
    padding-left:11px;
  }

  .navx-subitem{
    min-height:39px;
    padding-top:10px;
    padding-bottom:10px;
  }

  .navx-footer{
    margin:0 18px calc(10px + env(safe-area-inset-bottom));
    padding:11px 13px;
  }
}

@media (max-width:520px){
  .navx-mobileBrandSub{
    max-width:36vw;
  }

  .navx-mobileTrigger{
    max-width:48vw;
  }

  .navx-mobileText{
    display:flex;
  }

  .navx-mobileText strong{
    max-width:104px;
  }

  .navx-mobileText small{
    max-width:104px;
  }
}

@media (max-width:380px){
  .navx-mobileText{
    display:none;
  }

  .navx-mobileTrigger{
    max-width:none;
  }
}