/* validate.css — Validation page styles (extends hub.css) */

/* ── Section Container ──────────────────────────────────────── */
.val-section {
  background: var(--bg1);
  border: 1px solid var(--bd);
  border-radius: 3px;
  overflow: hidden;
}

.val-section-hdr {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  border-bottom: 1px solid var(--bd);
  background: var(--bg2);
}

.val-title {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  color: var(--cy);
  white-space: nowrap;
}

.val-sub {
  font-size: 10px;
  color: var(--tx2);
  white-space: nowrap;
}

.val-loading {
  padding: 24px;
  text-align: center;
  color: var(--tx2);
  font-size: 11px;
}

.val-empty {
  padding: 20px;
  text-align: center;
  color: var(--tx2);
  font-size: 11px;
}

/* ── Hit Rate Grid ──────────────────────────────────────────── */
.hr-grid {
  display: grid;
  grid-template-columns: 160px repeat(4, 1fr) 80px;
  border-collapse: collapse;
}

.hr-cell {
  padding: 8px 12px;
  border-right: 1px solid var(--bd);
  border-bottom: 1px solid var(--bd);
  font-size: 11px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.hr-cell:last-child { border-right: none; }
.hr-cell.header {
  background: var(--bg3);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .1em;
  color: var(--tx2);
  align-items: center;
  justify-content: center;
}

.hr-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .05em;
}

.hr-pct {
  font-size: 18px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.hr-n {
  font-size: 9px;
  color: var(--tx2);
}

.hr-pct.high   { color: var(--gr); }
.hr-pct.mid    { color: var(--am); }
.hr-pct.low    { color: var(--rd); }
.hr-pct.none   { color: var(--tx2); }
.hr-pct.na     { color: var(--tx2); font-size: 13px; }

.hr-row-last { border-bottom: none; }

/* ── Timeline Table ─────────────────────────────────────────── */
.tl-tbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
}

.tl-tbl th {
  padding: 4px 10px;
  text-align: left;
  font-size: 9px;
  font-weight: 500;
  letter-spacing: .1em;
  color: var(--tx2);
  background: var(--bg3);
  border-bottom: 1px solid var(--bd);
  white-space: nowrap;
}

.tl-tbl th.r, .tl-tbl td.r { text-align: right; }
.tl-tbl th.c, .tl-tbl td.c { text-align: center; }

.tl-tbl td {
  padding: 4px 10px;
  border-bottom: 1px solid var(--bd);
  white-space: nowrap;
}

.tl-tbl tbody tr:last-child td { border-bottom: none; }
.tl-tbl tbody tr:hover td { background: #ffffff05; }

/* Mini hit rate bar */
.hr-mini-bar {
  display: inline-block;
  height: 8px;
  width: 60px;
  background: var(--mu);
  border-radius: 1px;
  overflow: hidden;
  vertical-align: middle;
  margin-right: 4px;
}
.hr-mini-fill { height: 100%; border-radius: 1px; }

/* ── Detail Table ───────────────────────────────────────────── */
.det-tbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
}

.det-tbl th {
  position: sticky;
  top: 0;
  padding: 4px 8px;
  text-align: left;
  font-size: 9px;
  font-weight: 500;
  letter-spacing: .1em;
  color: var(--tx2);
  background: var(--bg3);
  border-bottom: 1px solid var(--bd);
  white-space: nowrap;
  z-index: 1;
}

.det-tbl th.r, .det-tbl td.r { text-align: right; }
.det-tbl th.c, .det-tbl td.c { text-align: center; }

.det-tbl td {
  padding: 3px 8px;
  border-bottom: 1px solid var(--bd);
  vertical-align: middle;
  white-space: nowrap;
}

.det-tbl tbody tr:last-child td { border-bottom: none; }
.det-tbl tbody tr:hover td { background: #ffffff05; }

.det-scroll { overflow-y: auto; max-height: 420px; }

/* ROC (return %) coloring */
.roc-pos  { color: var(--gr); }
.roc-neg  { color: var(--rd); }
.roc-flat { color: var(--tx2); }
.roc-na   { color: var(--tx2); font-style: italic; }

/* Hit/miss icons */
.hit-y  { color: var(--gr); font-weight: 700; }
.hit-n  { color: var(--rd); font-weight: 700; }
.hit-na { color: var(--tx2); }

/* Status badges */
.sts-conf { color: var(--gr); font-size: 9px; }
.sts-rec  { color: var(--am); font-size: 9px; }
.sts-ext  { color: var(--bl); font-size: 9px; }
.sts-na   { color: var(--tx2); font-size: 9px; }

/* CBRE note banner */
.cbre-note {
  padding: 8px 12px;
  background: #1d1d2e;
  border-top: 1px solid var(--bd);
  font-size: 10px;
  color: var(--tx2);
}
.cbre-note span { color: var(--pu); font-weight: 600; }