/* BSV Speyer – Login-Design für wp-login.php
   Farb-/Schriftsystem identisch zum restlichen Bibliotheksbereich. */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root {
  --bsvlogin-navy: #1b2a47;
  --bsvlogin-navy-ink: #23324f;
  --bsvlogin-gold: #b8923d;
  --bsvlogin-gold-light: #d9b96a;
  --bsvlogin-parchment: #f3ecd9;
  --bsvlogin-card: #fbf7ec;
  --bsvlogin-postal-red: #963a2c;
  --bsvlogin-warm-gray: #6e6559;
  --bsvlogin-line: rgba(27, 42, 71, 0.14);
}

html {
  background: var(--bsvlogin-parchment) !important;
}

body.login {
  background: radial-gradient(ellipse at top left, rgba(184, 146, 61, 0.08), transparent 55%), var(--bsvlogin-parchment) !important;
  font-family: "IBM Plex Sans", sans-serif !important;
  position: relative;
  overflow-x: hidden;
}

/* Dezente Punkt-Textur im Hintergrund */
body.login::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 0; opacity: .5;
  background-image: radial-gradient(rgba(27, 42, 71, 0.035) 1px, transparent 1px); background-size: 3px 3px;
}

/* Zweispaltiges Layout: Login-Karte und Poststempel-Logo als zentriertes Paar */
.bsvlogin-layout {
  position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
  gap: 64px; max-width: 1040px; margin: 40px auto 0; padding: 0 20px;
}
.bsvlogin-login-col { flex: 0 1 480px; }
.bsvlogin-logo-col { flex: 0 1 380px; display: flex; justify-content: center; }
.bsvlogin-logo-image { width: 100%; max-width: 380px; height: auto; }
@media (max-width: 900px) {
  .bsvlogin-layout { margin-left: auto; margin-right: auto; justify-content: center; padding: 0 20px; }
  .bsvlogin-logo-col { display: none; }
}

#login {
  position: relative; z-index: 1; width: 100%; max-width: 480px; padding: 0; margin: 0;
}

/* Eigener Hero-Block (Eyebrow + Überschrift), wird per JS vor das h1 eingefügt */
.bsvlogin-hero { margin-bottom: 22px; text-align: left; }
.bsvlogin-eyebrow {
  font-family: "IBM Plex Mono", monospace; font-size: 11px; letter-spacing: 2.2px; text-transform: uppercase;
  color: var(--bsvlogin-postal-red); margin: 0 0 8px;
}
.bsvlogin-headline {
  font-family: "Fraunces", serif; font-weight: 700; font-size: clamp(15px, 3.6vw, 21px); line-height: 1.3;
  color: var(--bsvlogin-navy-ink); margin: 0; white-space: nowrap;
}
@media (max-width: 560px) {
  .bsvlogin-headline { white-space: normal; font-size: 20px; }
}

/* Logo-Zeile (h1 > a) zu Emblem + Wortmarke umgebaut (Markup per JS ergänzt) */
#login h1 { margin: 0 0 22px; text-align: left; }
#login h1 a {
  background-image: none !important; width: auto !important; height: auto !important; padding: 0 !important;
  display: flex !important; align-items: center; gap: 12px; text-indent: 0 !important; overflow: visible !important;
}
.bsvlogin-badge {
  width: 40px; height: 40px; border-radius: 50%; border: 2px solid var(--bsvlogin-gold-light);
  background: var(--bsvlogin-navy); display: flex; align-items: center; justify-content: center;
  color: var(--bsvlogin-gold-light); font-family: "Fraunces", serif; font-weight: 700; font-size: 20px; flex-shrink: 0;
}
.bsvlogin-wordmark { display: flex; flex-direction: column; line-height: 1.15; }
.bsvlogin-wordmark .name { font-family: "Fraunces", serif; font-weight: 700; font-size: 19px; color: var(--bsvlogin-navy-ink); }
.bsvlogin-wordmark .sub { font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--bsvlogin-warm-gray); margin-top: 2px; font-weight: 500; }

/* Formular-Karte */
#loginform {
  background: var(--bsvlogin-card) !important; border: 1px solid var(--bsvlogin-line) !important;
  border-radius: 2px !important; box-shadow: 0 14px 34px rgba(27, 42, 71, 0.12) !important;
  padding: 28px 26px 22px !important; position: relative;
}
#loginform::before {
  content: ""; position: absolute; top: -1px; left: -1px; right: -1px; height: 4px; background: var(--bsvlogin-gold);
}

#login label {
  font-family: "IBM Plex Mono", monospace !important; font-size: 11px !important; letter-spacing: 1px;
  text-transform: uppercase; color: var(--bsvlogin-warm-gray) !important; font-weight: 400 !important;
}
#login form p { margin-bottom: 16px; }
#login input[type="text"], #login input[type="password"], #login input[type="email"] {
  width: 100% !important; padding: 11px 12px !important; border: 1px solid var(--bsvlogin-line) !important;
  border-radius: 2px !important; background: #fff !important; font-family: "IBM Plex Sans", sans-serif !important;
  font-size: 14px !important; color: var(--bsvlogin-navy-ink) !important; box-shadow: none !important;
}
#login input[type="text"]:focus, #login input[type="password"]:focus, #login input[type="email"]:focus {
  border-color: var(--bsvlogin-postal-red) !important; box-shadow: none !important;
}
.wp-pwd { border: none !important; }

.forgetmenot { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--bsvlogin-navy-ink); }
.forgetmenot input { accent-color: var(--bsvlogin-postal-red); }
.forgetmenot label { text-transform: none !important; letter-spacing: 0 !important; font-family: inherit !important; font-size: 13px !important; color: inherit !important; }

.submit { margin-bottom: 0 !important; }
#wp-submit {
  width: 100%; padding: 12px !important; height: auto !important; background: var(--bsvlogin-navy) !important;
  color: #f6f1e2 !important; border: none !important; border-radius: 2px !important; font-family: "IBM Plex Sans", sans-serif !important;
  font-weight: 600 !important; font-size: 14.5px !important; text-shadow: none !important; box-shadow: none !important;
  letter-spacing: .3px;
}
#wp-submit:hover, #wp-submit:focus { background: #243a63 !important; }

/* Fußzeilen-Links (Passwort vergessen, zurück zur Seite) + eigener Hilfetext */
#nav, #backtoblog { text-align: left !important; }
#nav a, #backtoblog a { color: var(--bsvlogin-postal-red) !important; font-size: 12.5px; text-decoration: none; font-weight: 600; }
#nav a:hover, #backtoblog a:hover { text-decoration: underline; }

/* "Zurück zur Website"-Link und Sprachumschalter ausblenden */
#backtoblog, #language-switcher, .language-switcher {
  display: none !important;
}

.bsvlogin-helper {
  margin-top: 18px; padding-top: 16px; border-top: 1px dashed var(--bsvlogin-line);
  font-size: 12.5px; color: var(--bsvlogin-warm-gray); line-height: 1.5;
}
.bsvlogin-helper a { color: var(--bsvlogin-postal-red); text-decoration: none; font-weight: 600; }
.bsvlogin-helper a:hover { text-decoration: underline; }

#login #backtoblog { margin-top: 14px; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }