/* =========================================
   AuftragsPilot Login Light Design
   Nur Optik - keine Login-Logik
   ========================================= */

html,
body {
  background:
    radial-gradient(circle at 10% 10%, rgba(255,255,255,.48), transparent 30%),
    radial-gradient(circle at 90% 8%, rgba(135,235,230,.34), transparent 34%),
    linear-gradient(135deg, #92b5e3 0%, #dcecff 52%, #c9f0ee 100%) !important;
  color: #16285d !important;
  font-family: Inter, Arial, sans-serif !important;
}

/* Zentrierung */
body {
  min-height: 100vh !important;
}

/* Login-Karte */
.card,
.login-card,
.auth-card,
form,
main > div,
body > div {
  border-color: rgba(255,255,255,.82) !important;
}

/* Hauptbox möglichst sicher treffen */
body > div,
.login-card,
.auth-card,
.card {
  background:
    radial-gradient(circle at 86% 10%, rgba(135,235,230,.22), transparent 32%),
    linear-gradient(135deg, rgba(255,255,255,.68), rgba(232,242,255,.64)) !important;
  border: 1px solid rgba(255,255,255,.86) !important;
  border-radius: 28px !important;
  box-shadow:
    0 24px 55px rgba(72,104,158,.18),
    inset 0 1px 0 rgba(255,255,255,.80) !important;
  color: #16285d !important;
}

/* Falls die Seite eine feste dunkle Box nutzt */
[class*="login"],
[class*="auth"] {
  color: #16285d !important;
}

/* AP Icon */
.logo,
.brand-icon,
[class*="logo"],
[class*="brand"] {
  color: #16285d !important;
}

body > div::before,
.login-card::before,
.auth-card::before {
  background: linear-gradient(135deg, #7a63ff, #44bfff 52%, #72efaa) !important;
}

/* Überschriften */
h1,
h2,
h3,
strong,
label {
  color: #16285d !important;
}

h1 {
  font-size: 38px !important;
  line-height: 1.05 !important;
  letter-spacing: -.05em !important;
  font-weight: 950 !important;
}

p,
small,
span {
  color: #40527a !important;
}

/* Eingabefelder */
input,
select,
textarea {
  background: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(255,255,255,.92) !important;
  color: #16285d !important;
  border-radius: 17px !important;
  box-shadow:
    0 10px 22px rgba(77,112,166,.11),
    inset 0 1px 0 rgba(255,255,255,.76) !important;
}

input:focus,
select:focus,
textarea:focus {
  outline: none !important;
  border-color: rgba(58,132,255,.55) !important;
  box-shadow:
    0 0 0 4px rgba(58,132,255,.14),
    0 10px 22px rgba(77,112,166,.12) !important;
}

/* Buttons */
button,
.button,
.btn,
input[type="submit"] {
  border-radius: 17px !important;
  border: 1px solid rgba(255,255,255,.70) !important;
  font-weight: 900 !important;
  box-shadow:
    0 14px 28px rgba(77,112,166,.14),
    inset 0 1px 0 rgba(255,255,255,.50) !important;
}

/* Hauptbutton */
button[type="submit"],
.primary,
.btn-primary,
input[type="submit"] {
  background: linear-gradient(135deg, #4f91ff, #7bbcff) !important;
  color: #ffffff !important;
}

/* Registrieren Button */
button:not([type="submit"]),
.secondary,
.btn-secondary {
  background: rgba(255,255,255,.55) !important;
  color: #16285d !important;
}

/* Links */
a {
  color: #1e87ff !important;
  font-weight: 850 !important;
}

/* Passwort Anzeigen Button */
button[id*="show"],
button[class*="show"],
button[aria-label*="Passwort"],
button:has(*) {
  color: #16285d !important;
}

/* Unterer Rand / Box-Abstand */
form {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Handy */
@media screen and (max-width: 700px) {
  body {
    padding: 16px !important;
  }

  body > div,
  .login-card,
  .auth-card,
  .card {
    border-radius: 24px !important;
    width: auto !important;
    max-width: 100% !important;
  }

  h1 {
    font-size: 34px !important;
  }
}