/* =============================================================================
   SENTINEL — habillage de la page de login Authelia (auth.kerboul.me)
   Injecté par nginx (sub_filter) devant Authelia. Concept « mission control » :
   dégradé profond + halos aurora animés + carte de login en verre dépoli, accent cyan.
   Sélecteurs robustes : body / #root / form / classes MUI. Animations sous
   prefers-reduced-motion.
   ========================================================================== */
:root {
  --sntl-acc: #38bdf8;
  --sntl-acc2: #22d3ee;
  --sntl-ink: #e6edf6;
  --sntl-muted: #93a4bb;
}

html, body { height: 100%; }

body {
  margin: 0 !important;
  background:
    radial-gradient(1100px 760px at 18% -10%, #1b2b46 0%, transparent 55%),
    radial-gradient(1000px 700px at 100% 0%, #12243a 0%, transparent 50%),
    linear-gradient(180deg, #0b0f17 0%, #070a10 100%) !important;
  background-attachment: fixed !important;
  color: var(--sntl-ink) !important;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif !important;
}

/* Halos aurora derrière le contenu */
body::before {
  content: "";
  position: fixed;
  inset: -20%;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(440px 440px at 30% 35%, rgba(56,189,248,.17), transparent 60%),
    radial-gradient(480px 480px at 70% 68%, rgba(139,92,246,.14), transparent 60%),
    radial-gradient(380px 380px at 62% 18%, rgba(34,211,238,.12), transparent 60%);
  filter: blur(8px);
}
@media (prefers-reduced-motion: no-preference) {
  body::before { animation: sntl-aurora 22s ease-in-out infinite alternate; }
}
@keyframes sntl-aurora {
  0%   { transform: translate3d(-3%, -2%, 0) scale(1);    opacity: .85; }
  100% { transform: translate3d(3%, 2%, 0)  scale(1.08);  opacity: 1; }
}

#root { position: relative; z-index: 1; }

/* Wordmark (logo SENTINEL via LogoOverride) */
#root img {
  max-width: 290px !important;
  height: auto !important;
  margin: 0 auto .5rem !important;
  filter: drop-shadow(0 6px 22px rgba(56,189,248,.35));
}

/* Carte de login en verre dépoli (le <form> enveloppe les champs + bouton) */
#root form {
  background: rgba(17, 25, 40, .55) !important;
  backdrop-filter: blur(16px) saturate(120%);
  -webkit-backdrop-filter: blur(16px) saturate(120%);
  border: 1px solid rgba(56, 189, 248, .22) !important;
  border-radius: 18px !important;
  padding: 1.7rem 1.5rem !important;
  max-width: 360px;
  margin: 0 auto !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.05);
}

/* Typo */
#root .MuiTypography-root { color: var(--sntl-ink); }
#root h1, #root h2,
#root .MuiTypography-h5, #root .MuiTypography-h6 {
  color: var(--sntl-ink) !important;
  letter-spacing: .02em;
  font-weight: 700;
}

/* Champs (défensif : outlined / filled / base) */
#root .MuiInputBase-root,
#root .MuiOutlinedInput-root,
#root .MuiFilledInput-root {
  background: rgba(255,255,255,.045) !important;
  border-radius: 10px !important;
  color: var(--sntl-ink) !important;
}
#root .MuiInputBase-input { color: var(--sntl-ink) !important; }
#root .MuiOutlinedInput-notchedOutline { border-color: rgba(148,163,184,.25) !important; }
#root .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
  border-color: var(--sntl-acc) !important;
  box-shadow: 0 0 0 3px rgba(56,189,248,.18);
}
#root .MuiInputLabel-root { color: var(--sntl-muted) !important; }
#root .MuiInputLabel-root.Mui-focused { color: var(--sntl-acc) !important; }
#root .MuiInputAdornment-root, #root .MuiSvgIcon-root { color: var(--sntl-muted); }

/* Bouton principal */
#root .MuiButton-root {
  border-radius: 10px !important;
  text-transform: none !important;
  font-weight: 600 !important;
  letter-spacing: .02em !important;
}
#root .MuiButton-contained {
  background: linear-gradient(92deg, var(--sntl-acc), var(--sntl-acc2)) !important;
  color: #04121d !important;
  box-shadow: 0 8px 24px rgba(56,189,248,.35) !important;
}
@media (prefers-reduced-motion: no-preference) {
  #root .MuiButton-root { transition: filter .15s ease, transform .15s ease; }
  #root .MuiButton-contained:hover { filter: brightness(1.07); transform: translateY(-1px); }
}
#root .MuiButton-text, #root a { color: var(--sntl-acc) !important; }

/* Cases à cocher / liens / focus clavier */
#root .MuiCheckbox-root.Mui-checked { color: var(--sntl-acc) !important; }
#root a:focus-visible, #root button:focus-visible {
  outline: 2px solid var(--sntl-acc); outline-offset: 2px; border-radius: 8px;
}

/* Notifications (toasts) accordées au thème */
#root .MuiPaper-root.MuiSnackbarContent-root,
#root .MuiAlert-root {
  background: rgba(17,25,40,.92) !important;
  color: var(--sntl-ink) !important;
  border: 1px solid rgba(56,189,248,.25) !important;
}

/* Pied de page « powered by » discret */
#root .MuiTypography-caption, #root footer { color: var(--sntl-muted) !important; opacity: .55; }