/* ==========================================================================
   Auth Gateway — the login picker — Event Horizon 2 (DSYS-120)

   THE PLATFORM'S ONLY LOGIN SURFACE. Until PAS-24 the admin console and the
   user dashboard each painted their own sign-in card and this page was a
   rarely-seen intermediate. Now that those apps defer to the gateway — so that
   the buttons are derived from the ENABLED provider set instead of from
   hand-edited front-end code — every human signing in to anything meets this
   page. Its palette was three hex literals inside a Go binary
   (services/core/auth-gateway/internal/provider/provider.go), which is both
   off-brand and a standing violation of LPH-13:

       "Theme lives in a ConfigMap — a re-theme must not need a rebuild."
                                                        — Jad

   ── HOW THIS REACHES THE PAGE ───────────────────────────────────────────────
   Read by _envcommon/platform-auth.hcl with file(), passed to the platform-auth
   module as `login_theme_css`, set on the gateway as LOGIN_THEME_CSS, and
   served by the gateway itself at /auth/theme.css — which the picker LINKS
   AFTER its own 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, legible sign-in page rather than unstyled markup. This is
   the same arrangement DS-52 uses for the access portal next door. Everything
   here is therefore an OVERRIDE and needs no `!important`: it simply comes
   later.

   ── DARK ONLY, AND THAT IS THE POINT ────────────────────────────────────────
   Event Horizon is dark-only (DESIGN.md §2). The inline fallback carries no
   light-mode rules, but `color-scheme: dark` is set anyway so the browser
   paints form controls, scrollbars and focus rings for a dark page instead of
   guessing from the system.

   ── VALUES ARE INLINE LITERALS ON PURPOSE ───────────────────────────────────
   From branding/themes/event-horizon/palette.css. This file is served
   standalone out of a terraform variable with no build step and no access to
   branding/, so it cannot `@import` or `var()` its way to the palette. That
   makes it a hand-maintained copy — if the ground moves, this file moves with
   it. `--lg-*` below are local aliases, readable inside this one file, NOT a
   link to the real tokens.

   ── PAS-34, 2026-09-15 ──────────────────────────────────────────────────────
   The buttons were `.btn { background: var(--lg-accent) }` — full-width orange
   text links. They are now `.pbtn`: 64×64 icon-only squares carrying the real
   Google and Microsoft marks, on a neutral face, in a centred row. Removing the
   fill moved the accessibility burden onto the BORDER, which is why
   --lg-line-disabled was renamed --lg-line-ui and now governs the ENABLED
   button too.

   ⚠️ CONTRAST HERE IS MEASURED, NEVER ESTIMATED, and contrast.test.mjs beside
   this file re-measures it from these very bytes on every CI run. A brand swap
   that looks fine can silently drop a label below the 4.5:1 AA floor. Do not
   change a colour here without letting that test agree with you.
   ========================================================================== */

:root {
  color-scheme: dark;

  --lg-void: #08090c;
  --lg-panel: #0e1116;
  --lg-raised: #141821;
  --lg-line: rgba(255, 255, 255, 0.1);
  --lg-text: #edeff3;
  --lg-text-2: #a7aebb;
  --lg-text-muted: #838b99;
  /* The platform accent. It is STILL the brand colour and it is still used
     elsewhere — it is simply no longer painted on a login button. Jad,
     2026-09-15: "buttons must not be orange". PAS-34. An accent fill also
     fights the vendor mark now sitting on top of it. */
  --lg-accent: #f5a623;
  --lg-accent-hover: #ffbe52;
  --lg-ink-on-accent: #08090c;

  /* The provider button's face and its hover. Neutral, so the Google and
     Microsoft marks sit on a ground that competes with neither. */
  --lg-btn-face: #141821;
  --lg-btn-face-hover: #1b2029;

  /* EVERY provider button's boundary — enabled and unavailable alike. NOT a
     decorative line: since PAS-34 removed the accent fill it is the ONLY thing
     giving a button its shape, so it carries the 3:1 WCAG 1.4.11 floor for a
     non-text UI boundary — and it carries it on BOTH sides, against the
     button's own face and against the card behind it. The weaker adjacency is
     the one that governs.

     ⚠️ MEASURED, and the number this comment used to carry was measuring the
     wrong pair. It said #616b80 was "3.15:1 against the card and only 2.83:1
     against its own face" — those are the FALLBACK's surfaces (#1a1d24 and
     #22262e, in provider.go), not this palette's. Against EH2's own
     #0e1116/#141821 the same #616b80 measures 3.53 and 3.32, which clears the
     floor. The current value measures 4.02 and 3.78. Two files, two grounds,
     one number copied between them.

     ⚠️ It was previously named --lg-line-disabled, back when only the greyed
     button had a border. The rename is the point: the floor now applies to the
     button a working user clicks, not just to the one they cannot. */
  --lg-line-ui: #6b7486;
  --lg-line-ui-hover: #8b93a1;

  /* Keyboard focus. Neutral rather than the accent, because "no orange on the
     sign-in buttons" includes the ring drawn around one. */
  --lg-focus: #edeff3;
}

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

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

h1 {
  color: var(--lg-text);
  letter-spacing: -0.01em;
}

/* The line under the heading. */
.sub {
  color: var(--lg-text-2);
}

/* The provider row. One .pslot per entry in AUTH_PROVIDERS — this file has no
   idea how many there will be, which is the whole point of PAS-24. */

/* PAS-34 — ONE BUTTON STYLE, ICON ONLY, NO ORANGE.
   Jad, 2026-09-15: "one spinner, one button style, provider icons, no orange".
   The geometry (64×64, radius 14, 28px mark, 16px gap) is set by the inline
   fallback in provider.go and repeated verbatim by the access portal and by
   admin-ui / user-dashboard, because the sign-in path crosses three surfaces
   and every previous fix changed only one of them. What lives HERE is the
   palette, so a re-theme still needs no rebuild (LPH-13). */
.pbtn {
  background: var(--lg-btn-face);
  border: 1px solid var(--lg-line-ui);
  color: var(--lg-text);
  border-radius: 14px;
}

.pbtn:hover {
  background: var(--lg-btn-face-hover);
  border-color: var(--lg-line-ui-hover);
}

.pbtn:focus-visible {
  outline: 2px solid var(--lg-focus);
  outline-offset: 3px;
}

/* A provider that is DECLARED but has no credentials. State is carried four
   ways so no single channel is load-bearing: the absence of any href at all,
   aria-disabled, cursor:not-allowed, and the dimmed mark. The BORDER is
   deliberately unchanged — an unavailable provider is still a button, and
   fading its boundary would drop it below the 3:1 floor the enabled one holds. */
.pbtn-off,
.pbtn-off:hover {
  background: var(--lg-btn-face);
  border-color: var(--lg-line-ui);
  color: var(--lg-text-muted);
}

/* Why that provider is unavailable. Icon-only buttons have no visible label,
   so this line is also what names the provider on screen. */
.why {
  color: var(--lg-text-muted);
}

/* PAS-24: the one thing this page has to say out loud. The platform keys
   identity on the verified email, so the same person arriving via a different
   provider can arrive as a different account. */
.note {
  color: var(--lg-text-2);
  border-top: 1px solid var(--lg-line);
  padding-top: 0.9rem;
}