/* ═══ Gotham Minimaliste — Rouge ═══ */

/* Fond - noir profond de Gotham */
body {
  background: #0a0a0f !important;
}

/* Panel login - verre fumé */
.MuiPaper-root,
.MuiCard-root {
  background: rgba(12, 12, 22, 0.97) !important;
  box-shadow: 0 0 60px rgba(0,0,0,0.6), 0 0 1px rgba(220,38,38,0.15) !important;
  border: 1px solid rgba(220,38,38,0.08) !important;
}

/* ─── LOGO BATMAN ─── */
/* Authelia render le logo dans un <img> avec data-logooverride="true" */
/* On force la taille et on ajoute un glow rouge */
img[data-logooverride="true"],
img[src*="logo.png"],
img[src="/logo.png"],
.login-brand-icon img {
  width: 400px !important;
  height: auto !important;
  max-width: 400px !important;
  filter: drop-shadow(0 0 15px rgba(220,38,38,0.4)) drop-shadow(0 0 30px rgba(220,38,38,0.15)) !important;
  margin-bottom: 12px !important;
}

/* Cacher l'icône SVG Authelia par défaut si override actif */
svg[data-logooverride] {
  display: none !important;
}

/* Bouton principal - gradient rouge */
.MuiButton-contained,
.MuiButton-containedPrimary {
  background: linear-gradient(135deg, #DC2626 0%, #991B1B 100%) !important;
  border-radius: 4px !important;
  text-transform: none !important;
  font-weight: 500 !important;
  letter-spacing: 0.5px !important;
  transition: all 0.3s ease !important;
}

.MuiButton-contained:hover,
.MuiButton-containedPrimary:hover {
  background: linear-gradient(135deg, #EF4444 0%, #B91C1C 100%) !important;
  box-shadow: 0 4px 20px rgba(220,38,38,0.35) !important;
  transform: translateY(-1px) !important;
}

/* Champs de saisie - contour rouge au focus */
.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
  border-color: #DC2626 !important;
  border-width: 2px !important;
}

.MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline {
  border-color: rgba(220,38,38,0.5) !important;
}

.MuiInputLabel-root.Mui-focused {
  color: #F87171 !important;
}

/* Titres */
h1, h2, h3, h4, h5, h6 {
  color: #E2E0F0 !important;
  font-weight: 300 !important;
  letter-spacing: 1.5px !important;
}

/* Texte principal */
.MuiTypography-root,
.MuiFormLabel-root {
  color: #FCA5A5 !important;
}

/* Liens */
a, .MuiLink-root {
  color: #F87171 !important;
  transition: all 0.2s ease !important;
}

a:hover, .MuiLink-root:hover {
  color: #FCA5A5 !important;
  text-shadow: 0 0 10px rgba(248,113,113,0.4) !important;
}

/* Séparateurs */
.MuiDivider-root {
  border-color: rgba(220,38,38,0.15) !important;
}

/* Footer */
footer, .MuiTypography-colorTextSecondary {
  color: rgba(255,255,255,0.25) !important;
}

/* Icones */
.MuiSvgIcon-root {
  color: #DC2626 !important;
}

.MuiIconButton-root:hover {
  background: rgba(220,38,38,0.1) !important;
}

/* Checkbox / Radio */
.MuiCheckbox-root.Mui-checked,
.MuiRadio-root.Mui-checked {
  color: #DC2626 !important;
}

/* Chips */
.MuiChip-root {
  background: rgba(220,38,38,0.15) !important;
  color: #FCA5A5 !important;
  border: 1px solid rgba(220,38,38,0.2) !important;
}

/* Alertes */
.MuiAlert-root {
  border-radius: 4px !important;
  border: 1px solid rgba(220,38,38,0.2) !important;
}

/* Tabs */
.MuiTab-root.Mui-selected {
  color: #F87171 !important;
}

.MuiTabs-indicator {
  background: #DC2626 !important;
}

/* Progress bar */
.MuiLinearProgress-bar {
  background: linear-gradient(90deg, #DC2626, #F87171) !important;
}

/* Scrollbar */
::-webkit-scrollbar { width: 6px !important; }
::-webkit-scrollbar-track { background: #0a0a0f !important; }
::-webkit-scrollbar-thumb { background: rgba(220,38,38,0.3) !important; border-radius: 3px !important; }
::-webkit-scrollbar-thumb:hover { background: rgba(220,38,38,0.5) !important; }

/* Animation d'entrée */
@keyframes gothamFadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.MuiPaper-root {
  animation: gothamFadeIn 0.4s ease-out !important;
}

/* Powered by - discret */
[class*="Sponsor"],
footer a[href*="authelia"] {
  display: none !important;
}

/* ═══ Fix TOTP Input ═══ */
.MuiOutlinedInput-root {
  min-height: 56px !important;
}

input[type="text"],
input[type="number"],
input[type="password"],
input:not([type]) {
  font-size: 1.25rem !important;
  padding: 12px 14px !important;
  min-height: 1.5em !important;
}

.otp-input,
[class*="otp"],
[class*="Otp"],
[class*="OneTimeCode"] input,
input[inputmode="numeric"],
input[autocomplete="one-time-code"] {
  width: 3em !important;
  height: 3.5em !important;
  font-size: 1.5rem !important;
  text-align: center !important;
  letter-spacing: 0.5em !important;
}

.MuiFormControl-root {
  width: 100% !important;
}

.MuiTextField-root {
  width: 100% !important;
}