/* WhaleMLB additions on top of the shared console theme.
   Only what the monitor needs that the base sheet does not already carry. */

/* ---- stat strip above the events table ---- */
.mlb-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  margin-bottom: var(--gap);
}
.mlb-stat {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px 14px;
  box-shadow: var(--shadow);
}
.mlb-stat__k {
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--ink-faint);
}
.mlb-stat__v {
  font-family: var(--f-display); font-size: 25px; font-weight: 680;
  letter-spacing: -.5px; line-height: 1.15; margin-top: 4px;
  font-variant-numeric: tabular-nums;
}
.mlb-stat__s { font-size: 11.5px; color: var(--ink-dim); margin-top: 2px; }
.mlb-stat--good .mlb-stat__v { color: var(--sonar); }
.mlb-stat--bad  .mlb-stat__v { color: var(--coral); }

/* ---- the add-events composer ---- */
.mlb-add { display: grid; grid-template-columns: 1fr 260px; gap: 14px; }
.mlb-add textarea { min-height: 104px; resize: vertical; }
.mlb-add__side { display: flex; flex-direction: column; gap: 10px; }
.mlb-add__side label {
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--ink-faint); display: block; margin-bottom: 4px;
}
@media (max-width: 860px) { .mlb-add { grid-template-columns: 1fr; } }

/* ---- form fields ----
   The base sheet styles inputs but not the label/input pairing, so a .field
   would otherwise render its label inline with the control. */
.field { margin-bottom: 13px; }
.field > label {
  display: block; margin-bottom: 5px;
  font-family: var(--f-mono); font-size: 9px; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--ink-faint);
}
.field > input, .field > select, .field > textarea { width: 100%; }
.field .help { margin: 5px 0 0; }

.checkbox { display: flex; align-items: center; gap: 9px; font-size: 13px; cursor: pointer; }
.checkbox input { width: 16px; height: 16px; flex: none; margin: 0; cursor: pointer; }

/* ---- inventory figure in the events table ----
   The section count is the headline number, so it gets weight the rest of the
   row does not. */
.mlb-inv { font-variant-numeric: tabular-nums; font-weight: 640; font-size: 15px; }
.mlb-inv--zero { color: var(--ink-ghost); font-weight: 500; }
.mlb-sub { font-size: 11px; color: var(--ink-faint); }

/* ---- log stream ---- */
.mlb-log {
  font-family: var(--f-mono); font-size: 12px; line-height: 1.65;
  max-height: 68vh; overflow: auto;
  background: var(--surface); border-radius: var(--radius-sm);
}
.mlb-log__row {
  display: grid; grid-template-columns: 74px 74px 1fr;
  gap: 10px; padding: 3px 12px; border-bottom: 1px solid var(--line-soft);
  align-items: baseline;
}
.mlb-log__row:hover { background: var(--surface-2); }
.mlb-log__t { color: var(--ink-ghost); }
.mlb-log__lvl { font-size: 10px; letter-spacing: .6px; text-transform: uppercase; }
.mlb-log__msg { color: var(--ink); word-break: break-word; }
.lvl-INFO    .mlb-log__lvl { color: var(--ink-faint); }
.lvl-WARNING .mlb-log__lvl { color: var(--amber); }
.lvl-WARNING .mlb-log__msg { color: var(--amber); }
.lvl-ERROR   .mlb-log__lvl,
.lvl-CRITICAL .mlb-log__lvl { color: var(--coral); }
.lvl-ERROR   .mlb-log__msg,
.lvl-CRITICAL .mlb-log__msg { color: var(--coral); }
@media (max-width: 700px) {
  .mlb-log__row { grid-template-columns: 62px 1fr; }
  .mlb-log__lvl { display: none; }
}

/* ---- change feed ---- */
.mlb-feed { display: flex; flex-direction: column; }
.mlb-feed__row {
  display: flex; align-items: baseline; gap: 10px;
  padding: 7px 12px; border-bottom: 1px solid var(--line-soft); font-size: 12.5px;
}
.mlb-feed__row:last-child { border-bottom: 0; }
.mlb-feed__t { font-family: var(--f-mono); font-size: 11px; color: var(--ink-ghost); flex: none; }
.mlb-feed__what { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mlb-feed__ev { color: var(--ink-dim); }
.mlb-kind {
  font-family: var(--f-mono); font-size: 9.5px; letter-spacing: .8px;
  text-transform: uppercase; padding: 2px 6px; border-radius: 4px; flex: none;
}
.mlb-kind--new     { background: var(--sonar-dim); color: var(--sonar-deep); }
.mlb-kind--restock { background: var(--sonar-dim); color: var(--sonar-deep); }
.mlb-kind--gone    { background: var(--surface-3); color: var(--ink-faint); }
.mlb-kind--reprice { background: var(--amber-glow); color: var(--amber); }
.mlb-kind--reduced { background: var(--surface-3); color: var(--ink-faint); }

/* ---- the honest note about what the feed can and cannot say ---- */
.mlb-note {
  font-size: 12px; color: var(--ink-dim); background: var(--surface-2);
  border: 1px solid var(--line-soft); border-radius: var(--radius-sm);
  padding: 9px 12px; margin-bottom: 12px;
}
.mlb-note b { color: var(--ink); font-weight: 600; }

/* Cart countdown: the last two minutes are the ones worth noticing. */
.t-warn { color: var(--coral); font-weight: 600; }
