/* =========================================================
   gx_subrail_modes.css
   L2 (subrail) collapsed mode: body.gx-nav2-collapsed
   - No topbar controls; toggle lives inside L2 panel.
   ========================================================= */

/* ---------
   LAYOUT widths
--------- */
body.gx-nav2-collapsed .gx-layout.has-subrail{ grid-template-columns: 320px 84px 1fr; }
body.gx-nav-collapsed.gx-nav2-collapsed .gx-layout.has-subrail{ grid-template-columns: 84px 84px 1fr; }

body.gx-nav-hidden .gx-layout.has-subrail{ grid-template-columns: 260px 1fr; }
body.gx-nav-hidden.gx-nav2-collapsed .gx-layout.has-subrail{ grid-template-columns: 84px 1fr; }

/* ---------
   L2 panel collapsed visuals
--------- */
body.gx-nav2-collapsed .gx-subrail{ padding: 14px 10px; }
body.gx-nav2-collapsed .gx-subrail-inner{ gap: 10px; }

body.gx-nav2-collapsed .gx-subrail a.sub-tile,
body.gx-nav2-collapsed #gx-subrail-box a{
  justify-content: center;
  padding: 12px 10px;
}

body.gx-nav2-collapsed .gx-subrail .sub-lbl{ display: none; }
body.gx-nav2-collapsed .gx-subrail .sub-ico{ margin: 0; }

/* Tooltip (data-tip injected by JS) */
body.gx-nav2-collapsed #gx-subrail-box a{ position: relative; }
body.gx-nav2-collapsed #gx-subrail-box a[data-tip]:hover::after{
  content: attr(data-tip);
  position: absolute;
  left: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%);
  white-space: nowrap;
  z-index: 2000;
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(10,14,30,.90);
  color: rgba(255,255,255,.92);
  box-shadow: 0 18px 60px rgba(0,0,0,.45);
  pointer-events: none;
}

/* L2 toggle button styling (in-panel) */
.gx-subrail .gx-nav2-toggle{
  width: 100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 10px 12px;
  border-radius: 16px;
}


/* L2 icon SVG sizing */
.gx-subrail .sub-ico svg{ display:block; opacity:.92; }
