/* Admin and support sub-navigation, and the panels only they use. */

.subnav{display:flex;gap:4px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-bottom:var(--s5);
  padding-bottom:var(--s2);border-bottom:1px solid var(--line)}
.subnav a{position:relative;padding:9px 15px;border-radius:var(--r-sm);
  color:var(--text-muted);font-size:14.5px;font-weight:500;
  transition:color .2s var(--ease),background-color .2s var(--ease)}
.subnav a:hover{color:var(--text-main);background:var(--bg-card)}
.subnav a.on{color:var(--primary);background:var(--primary-soft)}
.subnav .count{display:inline-block;margin-left:7px;min-width:19px;padding:1px 6px;
  border-radius:var(--r-pill);background:var(--primary);color:var(--on-primary);
  font-size:11.5px;font-weight:700;text-align:center;line-height:17px}
.subnav .count.quiet{background:var(--line-hi);color:var(--text-muted)}

/* overview */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s2);
  margin-bottom:var(--s4)}
.stat{background:var(--bg-card);border:1px solid var(--line);border-radius:var(--r);
  padding:var(--s3);backdrop-filter:blur(12px)}
.stat .n{font-size:30px;font-weight:800;letter-spacing:-.04em;line-height:1}
.stat .k{font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--text-muted);margin-top:8px;font-weight:600}
.stat.alert .n{color:var(--primary)}
@media(max-width:820px){.stats{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}

.subnav a{flex:none}
.kv{display:grid;grid-template-columns:auto 1fr;gap:8px var(--s3);font-size:14px}
.kv dt{color:var(--text-muted)}
.kv dd{margin:0;overflow-wrap:anywhere}
.kv dd.bad{color:var(--danger)}

/* Six tabs do not fit a phone in one row; wrap rather than hide some
   off-screen behind an invisible scroll. */
@media(max-width:620px){
  .subnav{flex-wrap:wrap;overflow-x:visible}
  .subnav a{padding:8px 12px;font-size:14px}
}

/* sales */
.sales td{white-space:nowrap}
.sales .badge{white-space:nowrap}