/* NetDevOps common sidebar — palette per the netdevops skill:
   #181C23 rail · #FFAD28 accent · #FFF2DF text · #282A27 hover */

.suite-sidebar,
.suite-nav{
  width:var(--sidebar-w,220px);
  flex-shrink:0;
  background:var(--nd-sidebar,#181C23);
  border-right:1px solid rgba(255,255,255,.07);
  padding:14px 0 30px;
  position:sticky;
  top:var(--nav-h,60px);
  height:calc(100vh - var(--nav-h,60px));
  overflow-y:auto;
  display:flex;
  flex-direction:column;
}

.suite-head{
  font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;
  color:var(--gp-fl-02,#6D706B);
  padding:6px 18px 10px;
}

.suite-item{
  display:flex;align-items:center;gap:10px;
  padding:9px 18px;
  font-size:12.5px;font-weight:600;
  color:var(--nd-text,#FFF2DF);
  text-decoration:none;
  border-left:3px solid transparent;
  transition:background 180ms ease,color 180ms ease;
  white-space:nowrap;
}
.suite-item:hover{background:var(--nd-hover,#282A27);color:var(--nd-accent,#FFAD28);}
.suite-item.active{background:var(--nd-hover,#282A27);color:var(--nd-accent,#FFAD28);border-left-color:var(--nd-accent,#FFAD28);}
.suite-item .suite-dot{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.75;flex-shrink:0;}
.suite-item.active .suite-dot{opacity:1;}
.suite-item .ext{margin-left:auto;font-size:10px;opacity:.45;}
.suite-item:hover .ext{opacity:.9;}
.suite-item.soon{opacity:.55;cursor:default;}
.suite-item.soon:hover{background:transparent;color:var(--nd-text,#FFF2DF);}
.suite-item.soon .soon-tag{margin-left:auto;font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gp-fl-03,#ADB1AC);}

.suite-sep{height:1px;background:rgba(255,255,255,.07);margin:10px 18px;}
.suite-foot{margin-top:auto;padding:14px 18px 0;font-size:10.5px;color:var(--gp-fl-02,#6D706B);line-height:1.5;}

@media(max-width:1000px){
  .suite-sidebar,.suite-nav{
    position:static;height:auto;width:100%;
    flex-direction:row;overflow-x:auto;padding:0;
    border-right:none;border-bottom:1px solid rgba(255,255,255,.07);
  }
  .shell,.landing{flex-direction:column;}
  .suite-head,.suite-sep,.suite-foot{display:none;}
  .suite-item{border-left:none;border-bottom:3px solid transparent;padding:11px 14px;}
  .suite-item.active{border-left:none;border-bottom-color:var(--nd-accent,#FFAD28);}
  .suite-item .ext,.suite-item .soon-tag{display:none;}
}