/* ==========================================================================
   TCC NAV VISUAL CLEANUP V1 — DASHBOARD VISIBILITY REPAIR
   Trade Discipline Commander

   Purpose
   - Keep the HOME control fully visible.
   - Prevent the navigation strip from painting underneath the TCC brand/logo.
   - Keep the first navigation destination (Dashboard) reachable at every width.
   - Preserve protected-tab appearance without lock icons.
   - Allow horizontal navigation scrolling when the available center width is
     smaller than the complete navigation strip.
   ========================================================================== */

/* The top bar is a three-column grid in app.html. The center grid item must be
   allowed to shrink; otherwise a long navigation strip can overflow left into
   the brand column. */
.topbar{
  min-width:0 !important;
}

.topbar > .brand-wrap{
  position:relative !important;
  z-index:2 !important;
}

.topbar > nav.nav{
  min-width:0 !important;
  width:100% !important;
  max-width:100% !important;
  justify-content:flex-start !important;
  padding-left:10px !important;
  padding-right:10px !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  overscroll-behavior-inline:contain !important;
  -webkit-overflow-scrolling:touch !important;
  scrollbar-width:thin !important;
  scroll-padding-inline:10px !important;
}

/* Never let individual navigation controls collapse into unreadable slivers. */
.topbar > nav.nav > button{
  flex:0 0 auto !important;
}

/* HOME control retained from the original navigation cleanup. */
#tccHomeNavBtn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;

  flex:0 0 auto !important;
  min-width:92px !important;
  width:auto !important;
  max-width:none !important;

  margin:0 10px 0 6px !important;
  padding:9px 14px !important;

  overflow:visible !important;
  white-space:nowrap !important;
  text-indent:0 !important;
  letter-spacing:.2px !important;
  line-height:1.1 !important;

  color:#e7eef1 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:7px !important;

  font:inherit !important;
  font-size:inherit !important;
  font-weight:800 !important;

  cursor:pointer !important;
  position:relative !important;
  inset:auto !important;
  transform:none !important;
}

#tccHomeNavBtn .nav-icon{
  display:inline-block !important;
  flex:0 0 auto !important;
  min-width:14px !important;
  margin:0 !important;
  padding:0 !important;
  overflow:visible !important;
  line-height:1 !important;
  text-align:center !important;
}

#tccHomeNavBtn:hover,
#tccHomeNavBtn:focus-visible{
  color:var(--green,#48e47c) !important;
  background:#0d171f !important;
}

/* At narrower laptop/tablet widths, keep navigation on its own full-width row.
   This avoids collisions with the brand and cloud-status areas altogether. */
@media (max-width:1200px){
  .topbar > nav.nav{
    justify-content:flex-start !important;
    padding-left:6px !important;
    padding-right:6px !important;
  }
}

/* Extra protection for compact widths: keep the brand readable while the nav
   remains independently scrollable. */
@media (max-width:800px){
  .topbar > .brand-wrap{
    min-width:0 !important;
    max-width:100% !important;
  }

  .topbar > nav.nav{
    padding-left:0 !important;
    padding-right:0 !important;
  }
}

/* Protected tabs stay visually unavailable, but no lock symbol is shown. */
nav.nav [data-view].tcc-locked-nav{
  opacity:.42 !important;
  filter:saturate(.45) brightness(.82) !important;
  cursor:not-allowed !important;
}

/* Remove the lock icon that the access-gate stylesheet added. */
nav.nav [data-view].tcc-locked-nav::after{
  content:"" !important;
  display:none !important;
}