/* ============================================================================
   Fusova — Operator Console overrides (P5, admin_ui/). Layered AFTER styles.css.
   Purpose: make the operator console unmistakably NOT a tenant view, and add the
   couple of components the cross-tenant approvals queue needs that the tenant app
   doesn't (a tenant identifier chip per card, an "OPERATOR" marker, a roadmap nav
   for the not-yet-built console groups). All colors come from styles.css tokens.
   ============================================================================ */

/* A thin teal rule across the very top so the operator always knows the surface. */
body.ops::before {
  content: "";
  position: fixed;
  inset: 0 0 auto 0;
  height: 3px;
  background: var(--accent);
  z-index: 1000;
}

/* "OPERATOR" pill in the sidebar brand + topbar, so this can never be mistaken
   for a tenant workspace screenshot. */
.ops-badge {
  display: inline-block;
  font-family: var(--mono);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text);
  background: var(--accent);
  border-radius: 999px;
  padding: 2px 8px;
  vertical-align: middle;
}
.sidebar-brand .ops-badge { margin-left: 6px; }
.topbar .ops-badge { margin-right: 10px; }

/* Disabled "coming soon" nav items for the console groups that aren't built yet.
   Shown so the roadmap is honest and discoverable, but not clickable. */
.nav-link.is-soon {
  opacity: 0.5;
  cursor: default;
  pointer-events: none;
}
.nav-link .soon-tag {
  margin-left: auto;
  font-family: var(--mono);
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-light);
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 1px 6px;
}

/* Red status chip for negative tenant states (suspended). styles.css has no red chip
   token (its palette tops out at amber), so the operator console adds one — suspension
   is an alarming state and should read that way. */
.chip-danger {
  background: #FBE9E7;
  color: #b42318;
  border-color: #F3C9C2;
}

/* Compact status <select> used inline in the Clients table for quick status changes. */
.status-select {
  font-family: inherit;
  font-size: 0.82rem;
  padding: 4px 8px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--bg-elevated);
  color: var(--text);
  cursor: pointer;
}

/* Per-row result line in the Clients table (success/error of the last action). */
.tbl .row-msg { font-size: 0.78rem; color: var(--text-muted); }
.tbl .row-msg.is-error { color: #b42318; }

/* Red ERROR callout for setBanner('error', …). styles.css's .note is teal/positive and
   .note-paper is muted gray — neither reads as a failure, so a failed operator action would
   otherwise look like a neutral notice. This makes failures alarm-red (matches .row-msg.is-error
   and .chip-danger). Applies to every console section that uses the banner pattern. */
.note-error {
  background: #FBE9E7;
  border-left-color: #b42318;
  color: #b42318;
}
.note-error strong { color: #b42318; }