/* ==========================================================================
   Access Portal — Event Horizon 2 (DS-52)

   THE UNGATED FRONT DOOR. This page carries `platform-auth.horizon.io/skip`,
   so it is the first Horizon surface a person sees — before any sign-in, on
   any device. Until DS-52 it was the only platform surface that had never been
   themed at all: a blue-accented default (#0b0e14 ground, #5b8cff accent) that
   looked like nothing else we ship, and went WHITE on a light-mode system.

   ── HOW THIS REACHES THE PAGE ───────────────────────────────────────────────
   Fed to the cognito module as `portal_theme_css` (read by _envcommon/
   cognito.hcl with file()), published as the `theme.css` key of the
   access-portal-web ConfigMap, and LINKED AFTER the page's inline <style>.

   Appended, not substituted, and that is deliberate. The inline block stays as
   a complete working fallback, so an installation that supplies no theme still
   gets a functioning portal rather than unstyled markup — the same reason DS-48
   gates the Nexus proxy on `theme_css` being non-empty. Everything here is
   therefore an OVERRIDE and needs no `!important`: it simply comes later.

   ── DARK ONLY, AND THAT IS THE POINT ────────────────────────────────────────
   The inline fallback carries two `@media (prefers-color-scheme: light)` rules.
   Event Horizon is dark-only (DESIGN.md §2), so those are overridden
   unconditionally below rather than mirrored. A visitor on a light-mode laptop
   sees the same front door as everyone else.

   Values are EH2, from branding/themes/event-horizon/palette.css. They are
   INLINE LITERALS on purpose: this file is served standalone from a ConfigMap
   with no build step and no access to branding/, so it cannot `@import` or
   `var()` its way to the palette. That makes it the one hand-maintained copy in
   the system — DS-53's guard does not reach here — so if the ground moves,
   this file moves with it.
   ========================================================================== */

:root {
  /* Dark only. Overrides the fallback's `light dark`, which is what let the
     browser paint form controls and scrollbars for a light page. */
  color-scheme: dark;

  --portal-void: #08090c;
  --portal-panel: #0e1116;
  --portal-line: rgba(255, 255, 255, 0.1);
  --portal-text: #edeff3;
  --portal-text-2: #a7aebb;
  --portal-accent: #f5a623;
  --portal-accent-hover: #ffbe52;
  --portal-ink-on-accent: #08090c;
  --portal-danger: #ff8f88;
}

/* The ground. */
body {
  background: var(--portal-void);
  color: var(--portal-text);
  font-family: "Inter", "Inter var", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* The fallback sets these inside a light-mode media query. Repeating the
   selector unconditionally here beats it on order, without !important. */
@media (prefers-color-scheme: light) {
  body {
    background: var(--portal-void);
    color: var(--portal-text);
  }
  .card {
    background: var(--portal-panel);
    border-color: var(--portal-line);
  }
}

.card {
  background: var(--portal-panel);
  border: 1px solid var(--portal-line);
  border-radius: 14px;
  /* EH2 e2 elevation. */
  box-shadow: 0 8px 24px -8px rgba(0, 0, 0, 0.6);
}

h1 {
  color: var(--portal-text);
}

p {
  color: var(--portal-text-2);
}

.spinner {
  border-color: var(--portal-line);
  border-top-color: var(--portal-accent);
}

button {
  background: var(--portal-accent);
  color: var(--portal-ink-on-accent);
  border-radius: 10px;
  font-weight: 600;
}

button:hover {
  background: var(--portal-accent-hover);
}

button:focus-visible {
  outline: 2px solid var(--portal-accent);
  outline-offset: 2px;
}

.err {
  color: var(--portal-danger);
}