@import url("glass.css");

/* =========================================================
   Authelia-Loginportal — passend zum Dashboard dahinter
   ========================================================= */

/* Authelias CSP (default-src 'self') laesst nur gleiche Origin zu --
   glass.css zeigt auf den Theme-Host, hier auf den lokalen Proxy-Pfad. */
html {
  background-image: url("/_theme/background.png") !important;
}

body,
#root {
  background: transparent !important;
}

/* Scrim */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(18, 6, 22, 0.55) 0%, rgba(18, 6, 22, 0.3) 40%,
    rgba(18, 6, 22, 0.7) 100%);
}

/* ---------- Login-Karte ---------- */

.MuiPaper-root,
.MuiCard-root {
  background: var(--g-tint-strong) !important;
  border: 1px solid var(--g-border) !important;
  border-radius: var(--g-radius-lg) !important;
  box-shadow: var(--g-shadow-lg), var(--g-inset) !important;
  -webkit-backdrop-filter: var(--g-filter);
  backdrop-filter: var(--g-filter);
  color: var(--g-text) !important;
}

/* ---------- Text ---------- */

h1, h2, h3,
.MuiTypography-root {
  color: var(--g-text) !important;
  text-shadow: var(--g-text-shadow);
}

.MuiTypography-subtitle1,
.MuiTypography-subtitle2,
.MuiTypography-caption,
.MuiFormHelperText-root {
  color: var(--g-text-dim) !important;
}

/* ---------- Eingabefelder ---------- */

.MuiInputBase-root,
.MuiOutlinedInput-root,
.MuiFilledInput-root {
  background: rgba(255, 255, 255, 0.08) !important;
  border-radius: var(--g-radius-sm) !important;
  color: var(--g-text) !important;
}

.MuiInputBase-input {
  color: var(--g-text) !important;
}

.MuiInputLabel-root {
  color: var(--g-text-dim) !important;
}

.MuiOutlinedInput-notchedOutline {
  border-color: var(--g-border) !important;
}

.MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline,
.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
  border-color: var(--g-border-hover) !important;
}

/* ---------- Buttons ---------- */

.MuiButton-contained,
#sign-in-button {
  background: rgba(var(--g-accent), 0.28) !important;
  border: 1px solid rgba(var(--g-accent), 0.45) !important;
  border-radius: 999px !important;
  color: var(--g-text) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  transition: background var(--g-speed) var(--g-ease);
}

.MuiButton-contained:hover,
#sign-in-button:hover {
  background: rgba(var(--g-accent), 0.42) !important;
}

.MuiCheckbox-root,
.MuiButton-text {
  color: rgba(var(--g-accent), 0.9) !important;
}

/* ---------- Fehlermeldungen ---------- */

.MuiAlert-root,
.MuiAlert-standardError {
  background: rgba(120, 30, 52, 0.35) !important;
  border: 1px solid rgba(255, 140, 170, 0.32) !important;
  border-radius: var(--g-radius-sm) !important;
  color: rgba(255, 220, 228, 0.95) !important;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}