/* numbars.css — Numbers Bars (numbars.js, design/43): the right dock's "Bar" and "Debug" tabs (inside the dock's
   .rdock-host, so nothing here reaches the chart) and the Indicators modal's rows picker. Dense like the Data Window
   (datawin.css): 11.5 px tabular figures, ~18 px rows. Theme through chart.css's variables. */
:root { --nb-amber: #f0b429; }
:root[data-theme="light"] { --nb-amber: #b7791f; }

.nb-dock {
  flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden;
  padding: 0 0 12px; font-size: 11.5px; line-height: 17px; font-variant-numeric: tabular-nums; color: var(--fg);
}
.nb-empty { padding: 14px 12px; color: var(--muted); line-height: 1.5; }
.nb-nav {
  position: sticky; top: 0; z-index: 1; display: flex; align-items: center; gap: 4px;
  padding: 5px 8px; background: var(--bg); border-bottom: 1px solid var(--border);
}
.nb-nav button { white-space: nowrap; flex: 0 0 auto; }
.nb-nav button {
  border: 1px solid var(--border); background: var(--panel); color: var(--fg); border-radius: 4px;
  font: inherit; font-size: 11px; line-height: 16px; padding: 1px 7px; cursor: pointer;
}
.nb-nav button:hover { background: var(--panel-2); }
.nb-nav button:focus-visible { outline: 1px solid var(--accent); outline-offset: 1px; }
.nb-navh { flex: 1 1 auto; min-width: 0; color: var(--muted); font-size: 10.5px; margin-left: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nb-nav .nb-dbglink { margin-left: auto; border-color: transparent; background: transparent; color: var(--accent); }

.nb-head { padding: 7px 10px 6px; border-bottom: 1px solid var(--border); display: grid; gap: 2px; }
.nb-when { font-weight: 700; font-size: 12.5px; }
.nb-badge {
  display: inline-block; margin-left: 4px; padding: 0 5px; border-radius: 3px; font-size: 10px; font-weight: 700;
  letter-spacing: 0.4px; text-transform: uppercase; color: var(--nb-amber); border: 1px solid var(--nb-amber);
}
.nb-ohlc { color: var(--muted); font-size: 11px; }
.nb-note { color: var(--muted); font-size: 11px; line-height: 1.4; }

.nb-g { border-bottom: 1px solid var(--border); }
.nb-gh {
  display: flex; align-items: baseline; gap: 6px; width: 100%; margin: 0; padding: 5px 10px 3px 8px; border: 0;
  background: transparent; cursor: pointer; font: inherit; font-size: 10.5px; font-weight: 700; letter-spacing: 0.6px;
  text-transform: uppercase; color: var(--muted); text-align: left;
}
.nb-gh:hover { color: var(--fg); }
.nb-gh:focus-visible { outline: 1px solid var(--accent); outline-offset: -1px; }
.nb-caret { display: inline-block; width: 9px; transition: transform 0.12s ease; }
.nb-g.folded .nb-caret { transform: rotate(-90deg); }
.nb-g.folded .nb-gb { display: none; }
.nb-gh > span:nth-child(2) { flex: 0 0 auto; white-space: nowrap; }
.nb-gx { margin-left: auto; min-width: 0; font-weight: 500; letter-spacing: 0.2px; text-transform: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* a multi-line value (the price-vs-delta states): the whole row under its label, one state per line */
.nb-lines { grid-column: 1 / -1; padding: 0 0 2px 10px; color: var(--nb-amber); line-height: 1.35; white-space: normal; }
.nb-gb { padding: 0 10px 5px 12px; }

/* one value = label | value | percentile */
.nb-kv { display: grid; grid-template-columns: minmax(0, 1fr) auto 34px; column-gap: 8px; align-items: baseline; }
.nb-kv2 { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; column-gap: 10px; align-items: baseline; margin-top: 3px; }
.nb-kv2 .nb-v:nth-child(3n + 2) { color: var(--pos); }
.nb-kv2 .nb-v:nth-child(3n) { color: var(--neg); }
.nb-kv2 .nb-st, .nb-kv2 .nb-muted { color: var(--muted) !important; font-size: 10.5px; }
.nb-k { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: 0.85; cursor: help; }
.nb-v { text-align: right; white-space: nowrap; }
.nb-p { text-align: right; color: var(--muted); font-size: 10.5px; white-space: nowrap; }
.nb-dock .pos { color: var(--pos); }
.nb-dock .neg { color: var(--neg); }
.nb-zero { color: var(--muted); }
/* the three non-values, each its own look */
.nb-st { color: var(--muted); cursor: help; }
.nb-unavailable { opacity: 0.8; }
.nb-insufficient { font-style: italic; }
.nb-na { font-size: 10.5px; letter-spacing: 0.2px; }
.nb-unav { color: var(--muted); line-height: 1.45; padding: 2px 0; }

/* absorption */
.nb-abs-h .nb-k { font-weight: 600; opacity: 1; }
.nb-meter { height: 6px; border-radius: 3px; background: var(--panel-2); overflow: hidden; }
.nb-meter i { display: block; height: 100%; border-radius: 3px; background: var(--nb-amber); }
.nb-meter i.pos { background: var(--pos); }
.nb-meter i.neg { background: var(--neg); }
.nb-meter-big { height: 7px; margin: 2px 0 1px; }
.nb-sub { color: var(--muted); font-size: 10.5px; }
.nb-comps { display: grid; gap: 1px; margin-top: 3px; }
.nb-comp { display: grid; grid-template-columns: minmax(0, 1fr) 64px 32px; column-gap: 6px; align-items: center; font-size: 11px; }
.nb-cl { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: 0.85; cursor: help; }
.nb-w { color: var(--muted); font-size: 10px; }
.nb-cv { text-align: right; color: var(--muted); }
.nb-gap { height: 8px; }
.nb-caveat { margin: 8px 10px 0; color: var(--muted); font-size: 10.5px; line-height: 1.45; }

/* debug */
.nb-dbg { display: grid; gap: 4px; padding: 6px 8px 0; }
.nb-dbg h5 {
  margin: 6px 0 2px; font-size: 10.5px; font-weight: 700; letter-spacing: 0.6px; text-transform: uppercase;
  color: var(--muted); display: flex; gap: 8px;
}
.nb-dbg h5 span { font-weight: 500; letter-spacing: 0.2px; text-transform: none; }
.nb-dnote, .nb-dmeta { color: var(--muted); font-size: 11px; line-height: 1.4; }
.nb-dmeta { color: var(--fg); }
.nb-tw { overflow: auto; border: 1px solid var(--border); border-radius: 4px; }
.nb-tw.nb-tall { max-height: 260px; }
.nb-tw table { border-collapse: collapse; width: 100%; font-size: 10.5px; line-height: 15px; font-variant-numeric: tabular-nums; }
.nb-tw th, .nb-tw td { padding: 1px 5px; border-bottom: 1px solid var(--border); text-align: right; white-space: nowrap; }
.nb-tw th { position: sticky; top: 0; background: var(--bg); color: var(--muted); font-weight: 500; }
.nb-tw .l { text-align: left; }
.nb-tw tr.nb-reg-up td:first-child { box-shadow: inset 3px 0 0 var(--neg); }
.nb-tw tr.nb-reg-lo td:first-child { box-shadow: inset 3px 0 0 var(--pos); }
.nb-pre { margin: 0; max-height: 220px; overflow: auto; font-size: 10px; line-height: 13px; color: var(--muted); }

/* the Indicators modal: rows picker + weights */
.nb-muted { color: var(--muted); font-weight: 400; }
.nb-rows-field { flex-direction: column; align-items: stretch !important; gap: 4px; }
.nb-rows { display: grid; gap: 2px; max-height: 260px; overflow-y: auto; border: 1px solid var(--border); border-radius: 4px; padding: 4px 6px; }
.nb-pg > summary { cursor: pointer; font-size: 11.5px; color: var(--fg); padding: 1px 0; }
.nb-pgn { color: var(--accent); font-size: 10.5px; margin-left: 4px; }
.nb-pgb { display: grid; gap: 1px; padding: 2px 0 4px 14px; }
.nb-pgb label { display: flex; align-items: center; gap: 6px; font-size: 11.5px; cursor: pointer; }
.nb-btn {
  align-self: flex-start; border: 1px solid var(--border); background: var(--panel); color: var(--fg); border-radius: 4px;
  font: inherit; font-size: 11px; padding: 2px 8px; cursor: pointer;
}
.nb-btn:hover { background: var(--panel-2); }
.nb-weights { display: grid; gap: 3px; }
.nb-wrow { display: grid; grid-template-columns: minmax(0, 1fr) 70px; gap: 8px; align-items: center; font-size: 11.5px; color: var(--fg); }
.nb-wrow input { width: 70px; }

/* the pane's ONE tooltip (numbars.js): position:fixed at (0, 0), moved by a transform; never takes the pointer */
.nb-tt {
  position: fixed; left: 0; top: 0; z-index: 60; max-width: 320px; pointer-events: none;
  padding: 7px 9px; border-radius: 6px; border: 1px solid var(--border);
  background: var(--panel); color: var(--fg); box-shadow: 0 6px 22px rgba(0, 0, 0, 0.35);
  font: 12px/1.42 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; font-variant-numeric: tabular-nums;
}
:root[data-theme="light"] .nb-tt { box-shadow: 0 6px 20px rgba(20, 26, 40, 0.16); }
.nb-tt[hidden] { display: none; }
.nb-tt > div + div { margin-top: 2px; }
.nb-tt-t { color: var(--muted); font-size: 11px; }
.nb-tt-h { font-weight: 700; }
.nb-tt-v { font-size: 13px; font-weight: 600; }
.nb-tt-v.pos { color: var(--pos); }
.nb-tt-v.neg { color: var(--neg); }
.nb-tt-st { color: var(--muted); font-weight: 500; }
.nb-tt-read { color: var(--fg); opacity: 0.9; }
.nb-tt-sub { color: var(--muted); }
.nb-tt-live { color: var(--nb-amber); font-weight: 600; }
.nb-tt-note { color: var(--muted); font-size: 11px; border-top: 1px solid var(--border); margin-top: 5px !important; padding-top: 4px; }
