/* EarthWatch shell redesign, stage 2: icon nav rail.
   Loads after ew-shell-header.css and reuses its --ew2-* tokens.

   Rail buttons call straight into the SAME functions/DOM the existing
   sidebar "operations" buttons and dataHealthButton already use (see
   js/ew-shell-nav-rail.js) -- this is a new entry point to existing,
   working behaviour, not a reimplementation of it.

   --cmd (the sidebar's grid column width) is set permanently to the
   rail's own 60px in ew-shell-sidebar.css, which loads after this file --
   #missionSidebar is display:none there (region/hazard layers moved to
   floating panels), so there is no sidebar content left to make room for. */

#ewNavRail{
  position:absolute;
  left:0;top:var(--head);bottom:var(--foot);
  width:60px;
  box-sizing:border-box;
  background:#0D1218;
  border-right:1px solid var(--ew2-border);
  display:flex;flex-direction:column;align-items:center;
  padding:10px 0;
  overflow-y:auto;
  z-index:30;
}

.ewRailBtn{
  width:44px;height:44px;flex:0 0 auto;
  border:none;border-radius:9px;
  background:transparent;color:var(--ew2-text3);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  cursor:pointer;margin-bottom:4px;
  font-family:var(--ew2-font-body);
  -webkit-tap-highlight-color:transparent;
}
.ewRailBtn svg{width:16px;height:16px;display:block;}
.ewRailBtn span{font-size:7px;font-weight:700;letter-spacing:.02em;line-height:1;}
.ewRailBtn:hover{background:var(--ew2-raised);color:var(--ew2-text2);}
.ewRailBtn.active{background:var(--ew2-accent-soft);color:var(--ew2-accent);}

.ewRailDivider{width:28px;height:1px;flex:0 0 auto;background:var(--ew2-border);margin:6px 0;}