/* ===========================================================
   MAX3 OS — Operator login gate styles (.op-login-*)
   MAX3-styled; uses the shared tokens (tokens.css). Only loaded by
   the page; the gate itself only renders when production auth is
   configured + there's no session (dev/mock never show it).
   =========================================================== */
.op-login-scrim {
  position: fixed; inset: 0; z-index: 9000;
  display: flex; align-items: center; justify-content: center;
  background: var(--m3-bg, #111);
  font-family: var(--ff, system-ui, sans-serif);
}
.op-login-card {
  width: 340px; max-width: calc(100vw - 32px);
  background: var(--m3-surface, #1C1C1C);
  border: 1px solid var(--m3-line, #3A3A3A);
  border-radius: var(--radius, 12px);
  padding: 28px 26px 22px;
  display: flex; flex-direction: column; gap: 12px;
  box-shadow: 0 20px 60px rgba(0,0,0,.5);
}
.op-login-brand {
  font-size: 22px; font-weight: 800; letter-spacing: .5px;
  color: var(--m3-lime, #AADD44);
}
.op-login-sub {
  font-size: 13px; color: var(--m3-text-3, #8C8C8C); margin-top: -6px; margin-bottom: 4px;
}
.op-login-err {
  font-size: 12.5px; color: var(--m3-red, #CC2222);
  background: var(--m3-red-wash, rgba(204,34,34,.16));
  border: 1px solid var(--m3-red, #CC2222);
  border-radius: var(--radius-xs, 6px);
  padding: 8px 10px;
}
.op-login-lbl {
  display: flex; flex-direction: column; gap: 5px;
  font-size: 11.5px; text-transform: uppercase; letter-spacing: .6px;
  color: var(--m3-text-3, #8C8C8C);
}
.op-login-input {
  background: var(--m3-surface-2, #2A2A2A);
  border: 1px solid var(--m3-line, #3A3A3A);
  border-radius: var(--radius-sm, 8px);
  color: var(--m3-text, #fff);
  font-size: 14px; padding: 10px 11px; outline: none;
}
.op-login-input:focus { border-color: var(--m3-lime, #AADD44); }
.op-login-input:disabled { opacity: .6; }
.op-login-btn {
  margin-top: 6px;
  background: var(--m3-lime, #AADD44); color: #111;
  border: 0; border-radius: var(--radius-sm, 8px);
  font-size: 14px; font-weight: 700; padding: 11px; cursor: pointer;
}
.op-login-btn:disabled { opacity: .5; cursor: default; }
.op-login-foot {
  margin-top: 4px; font-size: 11px; color: var(--m3-text-3, #8C8C8C); text-align: center;
}

/* Shell header logout control (additive; right group of GreetingHeader). */
.op-logout-btn {
  background: var(--m3-surface-2, #2A2A2A);
  border: 1px solid var(--m3-line, #3A3A3A);
  border-radius: var(--radius-xs, 6px);
  color: var(--m3-text-2, #C6C6C6);
  font-size: 12px; padding: 5px 10px; cursor: pointer;
}
.op-logout-btn:hover { border-color: var(--m3-lime, #AADD44); color: var(--m3-text, #fff); }