/* =========================================================
   GALABAU KW – Glass Login (planer.galabau-kw.de)
   Ziel: echtes Glassmorphism + KW-Grün (#8cb347)
   Wirkt nur auf WP-Login: body.login
   ========================================================= */

html body.login{
  --kw-green:#8cb347;
  --kw-green-dark:#627d32;

  background-color:#1f2627 !important;
  font-family: realist, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;

  /* Zentrierung wie in einer „Glass App“ */
  min-height: 100vh !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 32px 16px !important;
}

/* Overlay: mehr Tiefe + „App“-Look */
html body.login::before{
  content:"";
  position:fixed;
  inset:0;
  background:
    radial-gradient(1200px 600px at 20% 20%, rgba(140,179,71,.18), transparent 60%),
    radial-gradient(900px 500px at 80% 35%, rgba(140,179,71,.10), transparent 55%),
    linear-gradient(to bottom, rgba(0,0,0,.40), rgba(0,0,0,.70));
  pointer-events:none;
  z-index:-1;
}

/* Login-Wrapper */
html body.login #login{
  position: relative;
  z-index: 1;
  width: min(92vw, 420px);
  padding: 0;
  margin: 0 auto;
}

/* Zusätzliche Zentrierung: einige Plugins setzen eigene Wrapper/Margins */
html body.login #login,
html body.login #loginform,
html body.login .login-msg-above{
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Logo */
html body.login #login h1 a{
  background-size: contain !important;
  width: 300px !important;
  height: 90px !important;
  margin: 0 auto 18px !important;
  filter: drop-shadow(0 12px 28px rgba(0,0,0,.60));
}
html body.login #login h1{
  margin: 0 0 10px !important;
}

/* Info / Error / Notice => Glas-Karte (kein grauer Kasten) */
html body.login #your-site-name-and-info,
html body.login .message,
html body.login #login_error,
html body.login .notice,
html body.login .success,
html body.login .login-msg-above,
html body.login .login-msg-above *{
  box-sizing: border-box;
}

html body.login #your-site-name-and-info,
html body.login .message,
html body.login #login_error,
html body.login .notice,
html body.login .success,
html body.login .login-msg-above{
  border: 1px solid rgba(255,255,255,.18) !important;
  border-left: 1px solid rgba(255,255,255,.18) !important; /* kein grüner Strich */
  background: rgba(255,255,255,.12) !important; /* helleres Glass */
  backdrop-filter: blur(18px) saturate(1.35) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.35) !important;
  color: rgba(255,255,255,.92) !important;
  border-radius: 16px !important;
  box-shadow:
    0 18px 55px rgba(0,0,0,.45),
    inset 0 1px 0 rgba(255,255,255,.10),
    0 0 0 1px rgba(255,255,255,.10) !important;

  /* Layout */
  padding: 14px 16px !important;
  margin: 0 auto 14px !important;
  max-width: 420px !important;
  text-align: center !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

/* Wenn AC-Login/Wrapper eigene Innen-Abstände setzt */
html body.login .login-msg-above p,
html body.login .login-msg-above div,
html body.login .login-msg-above span{
  margin: 0 !important;
}
html body.login .login-msg-above > * + *{
  margin-top: 10px !important;
}

/* Links in Info-Box => ohne Unterstreichungen, wie „Chips/Buttons“ */
html body.login .message a,
html body.login #login_error a,
html body.login .notice a,
html body.login #your-site-name-and-info a,
html body.login .login-msg-above a{
  color: rgba(255,255,255,.92) !important;
  text-decoration: none !important;
  border-bottom: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 8px 12px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.10) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.14) !important;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease, filter .18s ease !important;
}
html body.login .message a:hover,
html body.login #login_error a:hover,
html body.login .notice a:hover,
html body.login #your-site-name-and-info a:hover,
html body.login .login-msg-above a:hover{
  background: rgba(140,179,71,.20) !important;
  box-shadow:
    inset 0 0 0 1px rgba(140,179,71,.28),
    0 10px 24px rgba(0,0,0,.30) !important;
  transform: translateY(-1px) !important;
}

/* Links untereinander sauber umbrechen */
html body.login .login-msg-above a{ margin: 6px 6px 0 !important; }

/* Login-Form => Glas + Glow-Rand (deutlich sichtbar) */
html body.login form#loginform{
  border: 1px solid rgba(255,255,255,.18) !important;
  background: rgba(255,255,255,.14) !important; /* deutlich heller */
  backdrop-filter: blur(20px) saturate(1.35) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.35) !important;
  border-radius: 18px !important;
  box-shadow:
    0 32px 90px rgba(0,0,0,.60),
    0 0 0 1px rgba(255,255,255,.14),
    0 0 38px rgba(140,179,71,.18) !important;
  padding: 22px 22px 18px !important;
}

/* Labels */
html body.login form#loginform label{
  color: rgba(255,255,255,.92) !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  letter-spacing: .2px !important;
}

/* Inputs */
html body.login .input,
html body.login input[type="text"],
html body.login input[type="password"]{
  background: rgba(255,255,255,.92) !important;
  border: 0 !important;
  border-radius: 12px !important;
  padding: 12px !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.08) !important;
}

/* Focus */
html body.login .input:focus,
html body.login input[type="text"]:focus,
html body.login input[type="password"]:focus{
  box-shadow: 0 0 0 .26rem rgba(140,179,71,.34) !important;
  outline: none !important;
}

/* Checkbox */
html body.login input[type="checkbox"]{
  accent-color: var(--kw-green) !important;
}

/* Button */
html body.login .wp-core-ui .button-primary{
  background: var(--kw-green) !important;
  border: 0 !important;
  border-radius: 12px !important;
  padding: 10px 18px !important;
  font-weight: 800 !important;
  box-shadow: 0 14px 30px rgba(0,0,0,.40) !important;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease !important;
}
html body.login .wp-core-ui .button-primary:hover{
  filter: brightness(.92) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 20px 40px rgba(0,0,0,.48) !important;
}

/* Links unten */
html body.login #nav a,
html body.login #backtoblog a,
html body.login .privacy-policy-page-link a{
  color: rgba(255,255,255,.78) !important;
  text-decoration: none !important;
}
html body.login #nav a:hover,
html body.login #backtoblog a:hover,
html body.login .privacy-policy-page-link a:hover{
  color: var(--kw-green) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

html body.login #nav,
html body.login #backtoblog,
html body.login .privacy-policy-page-link{
  text-align: center !important;
  margin-top: 12px !important;
}

/* Mobile */
@media (max-width: 420px){
  html body.login{ padding: 24px 12px !important; }
  html body.login #login{ width: min(94vw, 420px) !important; }
  html body.login #login h1 a{ width: min(72vw, 300px) !important; }
  html body.login form#loginform{ padding: 18px 16px 14px !important; }
}

/* Plugin-Wrapper (AC Login / ggf. weitere) sauber zentrieren */
html body.login #wflms-login-wrapper,
html body.login .wflms-login-wrapper{
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Falls die Info-Box außerhalb #login gerendert wird */
html body.login #wflms-login-wrapper #your-site-name-and-info{
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Copyright unterhalb des Login-Blocks */
html body.login #login::after{
  content: "© GALABAU KW";
  display: block;
  text-align: center;
  margin-top: 14px;
  font-size: 12px;
  color: rgba(255,255,255,.62);
  letter-spacing: .2px;
}