/* =====================================================================
   MFsquare-Theme für die Authelia-Login-Seite (Aurora-Look)
   Wird vom Gateway per sub_filter in die Portal-Seite eingehängt.
   Authelia ist eine React/MUI-App; die Selektoren sind defensiv gewählt
   und ggf. nach größeren Authelia-Updates leicht anzupassen.
   ===================================================================== */

:root{
  --mf-accent:#33a2cc;
  --mf-accent-strong:#4fb8de;
  --mf-text:#f2f3f4;
}

html, body, #root{ min-height:100vh !important; }

body{
  background:
    radial-gradient(40% 30% at 20% 22%, rgba(63,224,168,.55), transparent 70%),
    radial-gradient(45% 35% at 70% 18%, rgba(51,162,204,.45), transparent 70%),
    radial-gradient(50% 40% at 45% 30%, rgba(38,196,150,.35), transparent 75%),
    radial-gradient(60% 50% at 50% 100%, rgba(30,120,140,.5), transparent 70%),
    linear-gradient(180deg,#04121a 0%, #061a1d 45%, #04252a 100%) !important;
  background-attachment: fixed !important;
  color: var(--mf-text) !important;
}

.MuiPaper-root{
  background: rgba(20,26,34,.82) !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 20px !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.5) !important;
  padding: 8px 6px !important;
}

.MuiPaper-root img{
  max-height: 64px !important;
  width: auto !important;
  margin: 6px auto 2px !important;
}

.MuiTypography-root{ color: var(--mf-text) !important; }
h1, h2, h3{ color:#ffffff !important; font-weight:700 !important; }

.MuiInputBase-root{ background: rgba(255,255,255,.04) !important; border-radius: 12px !important; }
.MuiInputBase-input{ color: var(--mf-text) !important; }
.MuiInputLabel-root{ color:#9aa3ad !important; }
.MuiInputLabel-root.Mui-focused{ color: var(--mf-accent) !important; }
.MuiOutlinedInput-notchedOutline{ border-color: rgba(255,255,255,.14) !important; }
.Mui-focused .MuiOutlinedInput-notchedOutline{ border-color: var(--mf-accent) !important; }
.MuiInputAdornment-root svg, .MuiSvgIcon-root{ color:#aeb6bf !important; }

.MuiButton-root, .MuiButton-contained, button[type="submit"]{
  background: var(--mf-accent) !important;
  color:#04212c !important;
  font-weight: 700 !important;
  border-radius: 12px !important;
  text-transform: none !important;
  box-shadow: none !important;
}
.MuiButton-root:hover, .MuiButton-contained:hover, button[type="submit"]:hover{
  background: var(--mf-accent-strong) !important;
}

a, .MuiLink-root{ color:#ffffff !important; }
a:hover, .MuiLink-root:hover{ color: var(--mf-accent) !important; }

a[href*="authelia.com"]{ display:none !important; }

.MuiCheckbox-root.Mui-checked{ color: var(--mf-accent) !important; }
