/* ── mousehome.net – Authelia Custom Theme ──────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&display=swap');

/* ── Page background ─────────────────────────────────────────────────────────── */
html, body, #root {
  background-color: #0a0a0b !important;
}

/* ── Login card ──────────────────────────────────────────────────────────────── */
.MuiPaper-root,
[class*="Paper-root"],
[class*="Paper-elevation"] {
  background-color: #111114 !important;
  border: 1px solid #1e1e22 !important;
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.4), 0 32px 80px rgba(0,0,0,0.6) !important;
  border-radius: 8px !important;
}

/* ── Typography ──────────────────────────────────────────────────────────────── */
.MuiTypography-root { color: #f0ede8 !important; }
.MuiTypography-body2, .MuiTypography-caption, .MuiFormHelperText-root { color: #9896a4 !important; }

/* ── Input labels ────────────────────────────────────────────────────────────── */
.MuiInputLabel-root, .MuiFormLabel-root {
  color: #7e7c8a !important;
  font-size: 12px !important;
  letter-spacing: 0.04em !important;
}
.MuiInputLabel-root.Mui-focused { color: #4d9cff !important; }

/* ── Input fields ────────────────────────────────────────────────────────────── */
.MuiOutlinedInput-root {
  background-color: #0a0a0b !important;
  border-radius: 4px !important;
}
.MuiOutlinedInput-input, .MuiInputBase-input {
  color: #f0ede8 !important;
  caret-color: #4d9cff !important;
  font-family: 'JetBrains Mono', ui-monospace, monospace !important;
}
.MuiOutlinedInput-notchedOutline, fieldset {
  border-color: #1e1e22 !important;
}
.MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline,
.MuiOutlinedInput-root:hover fieldset {
  border-color: #2e2e35 !important;
}
.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline,
.MuiOutlinedInput-root.Mui-focused fieldset {
  border-color: #4d9cff !important;
  border-width: 1px !important;
}

/* ── Icon buttons ────────────────────────────────────────────────────────────── */
.MuiIconButton-root { color: #7e7c8a !important; }
.MuiIconButton-root:hover { color: #9896a4 !important; background: rgba(255,255,255,0.04) !important; }

/* ── Primary button ──────────────────────────────────────────────────────────── */
.MuiButton-containedPrimary,
[class*="containedPrimary"] {
  background-color: #4d9cff !important;
  color: #ffffff !important;
  border-radius: 4px !important;
  font-family: 'JetBrains Mono', ui-monospace, monospace !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
  text-transform: none !important;
  box-shadow: none !important;
  padding: 10px 24px !important;
}
.MuiButton-containedPrimary:hover,
[class*="containedPrimary"]:hover {
  background-color: #5facff !important;
  box-shadow: none !important;
}

/* ── Text buttons ────────────────────────────────────────────────────────────── */
.MuiButton-text, [class*="Button-text"] {
  color: #7e7c8a !important;
  text-transform: none !important;
  font-family: 'JetBrains Mono', ui-monospace, monospace !important;
  font-size: 11px !important;
}
.MuiButton-text:hover, [class*="Button-text"]:hover {
  color: #4d9cff !important;
  background-color: rgba(77, 156, 255, 0.06) !important;
}

/* ── Links ───────────────────────────────────────────────────────────────────── */
a { color: #4d9cff !important; }

/* ── Checkbox ────────────────────────────────────────────────────────────────── */
.MuiCheckbox-root.Mui-checked, .Mui-checked { color: #4d9cff !important; }

/* ── Divider ─────────────────────────────────────────────────────────────────── */
.MuiDivider-root { border-color: #1e1e22 !important; }

/* ── Alert ───────────────────────────────────────────────────────────────────── */
.MuiAlert-root {
  background-color: rgba(77,156,255,0.06) !important;
  border: 1px solid rgba(77,156,255,0.18) !important;
}
.MuiAlert-icon { color: #4d9cff !important; }
/* Logo */
img[alt="Logo"] {
  width: 200px !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto 20px auto !important;
}