/* Splash background as a fixed pseudo-element so it survives any MUI body overrides */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -2;
  background: url("/splash.jpg") center/cover no-repeat;
}
body::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(15,23,42,0.35), rgba(15,23,42,0.55));
}
html, body, #root {
  background: transparent !important;
  color: #e2e8f0 !important;
}
body { text-shadow: 0 1px 2px rgba(0,0,0,0.35); }

/* The actual login "card" — Authelia uses a MuiContainer (no Paper) */
.MuiContainer-root.MuiContainer-maxWidthXs {
  background-color: rgba(15, 23, 42, 0.80) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,0.10) !important;
  border-radius: 16px !important;
  padding: 2rem 2rem 1.5rem !important;
  margin-top: 8vh !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.35);
  max-width: 420px !important;
}

/* Title + icon */
#UserSvg { fill: #cbd5e1; }
.MuiTypography-h5 { color: #f1f5f9 !important; font-weight: 600 !important; }

/* Input fields */
.MuiOutlinedInput-root {
  background-color: rgba(255,255,255,0.05) !important;
  border-radius: 8px !important;
}
.MuiOutlinedInput-input { color: #f1f5f9 !important; }
.MuiInputLabel-root { color: #cbd5e1 !important; }
.MuiOutlinedInput-notchedOutline { border-color: rgba(255,255,255,0.18) !important; }
.MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline { border-color: rgba(255,255,255,0.35) !important; }
.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline { border-color: #60a5fa !important; }

/* Toggle-password eye icon */
.MuiIconButton-root { color: #cbd5e1 !important; }

/* "Remember me" checkbox label */
.MuiFormControlLabel-label, .MuiCheckbox-root svg { color: #cbd5e1 !important; }
.MuiCheckbox-root.Mui-checked svg { color: #60a5fa !important; }

/* Sign in button */
.MuiButton-containedPrimary {
  background-color: #3b82f6 !important;
  color: #fff !important;
  text-transform: none !important;
  font-weight: 600 !important;
  padding: 0.6rem 1.2rem !important;
  border-radius: 8px !important;
}
.MuiButton-containedPrimary:hover { background-color: #2563eb !important; }

/* "Reset password?" + "Powered by Authelia" links */
.MuiLink-root { color: #93c5fd !important; }
.MuiLink-root:hover { color: #bfdbfe !important; }

/* Footer */
.MuiTypography-inherit { color: #94a3b8 !important; }

/* Required asterisk a softer color */
.MuiFormLabel-asterisk { color: #f87171 !important; }