/*
 * NIVO Portal Apple-level Login Polish v1.0.4
 * Presentation only. Authentication remains native WordPress.
 */
:root {
  --nivo-login-deep: #0D241A;
  --nivo-login-panel: #173524;
  --nivo-login-green: #458826;
  --nivo-login-green-dark: #2A5225;
  --nivo-login-orange: #FF9F08;
  --nivo-login-text: #172015;
  --nivo-login-muted: #667063;
  --nivo-login-border: #E1E7DD;
  --nivo-login-surface: rgba(255, 255, 255, .965);
  --nivo-login-surface-soft: #F7F9F5;
  --nivo-login-focus: rgba(69, 136, 38, .25);
}

html body.login {
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 17% 22%, rgba(255,159,8,.10), transparent 25%),
    radial-gradient(circle at 82% 18%, rgba(69,136,38,.18), transparent 31%),
    linear-gradient(128deg, #112D20 0%, #1F3E2F 48%, #0E2419 100%);
  color: var(--nivo-login-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html body.login::before {
  content: "NIVO Portal\AInterne werkomgeving\Avoor medewerkers";
  white-space: pre-line;
  position: fixed;
  left: max(54px, 7.4vw);
  top: 50%;
  max-width: 560px;
  transform: translateY(-50%);
  color: #fff;
  font-size: clamp(48px, 5.1vw, 74px);
  line-height: .98;
  font-weight: 850;
  letter-spacing: -.062em;
  pointer-events: none;
  text-wrap: balance;
  text-shadow: 0 22px 76px rgba(0,0,0,.20);
}

html body.login::after {
  content: "Alleen toegankelijk voor medewerkers van NIVO Groep Holland.";
  position: fixed;
  left: max(54px, 7.4vw);
  bottom: 50px;
  color: rgba(255,255,255,.76);
  font-size: 14px;
  line-height: 1.4;
  font-weight: 680;
  letter-spacing: -.01em;
  pointer-events: none;
}

body.login .language-switcher,
body.login #language-switcher {
  position: fixed;
  right: max(28px, 3.4vw);
  bottom: 26px;
  z-index: 10;
  width: auto;
  margin: 0;
  padding: 0;
  color: rgba(255,255,255,.55);
  text-align: right;
  opacity: .68;
  transition: opacity .18s ease;
}

body.login #language-switcher:hover,
body.login #language-switcher:focus-within {
  opacity: 1;
}

body.login #language-switcher label,
body.login #language-switcher .dashicons-translation {
  display: none;
}

body.login #language-switcher select {
  min-height: 34px;
  max-width: 180px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 12px;
  background: rgba(255,255,255,.13);
  color: rgba(255,255,255,.86);
  box-shadow: none;
  font-size: 12px;
  font-weight: 650;
}

body.login #language-switcher select option {
  color: #172015;
}

body.login #language-switcher .button {
  min-height: 34px;
  margin-left: 6px;
  padding: 0 12px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 12px;
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.86);
  font-size: 12px;
  font-weight: 760;
  box-shadow: none;
}

#login {
  width: min(432px, calc(100vw - 44px));
  margin: 0 max(72px, 8vw) 0 auto;
  padding: 38px 38px 32px;
  position: relative;
  top: clamp(76px, 13.5vh, 132px);
  z-index: 2;
  border: 1px solid rgba(255,255,255,.58);
  border-radius: 30px;
  background: var(--nivo-login-surface);
  box-shadow: 0 32px 95px rgba(0,0,0,.22), 0 1px 0 rgba(255,255,255,.84) inset;
  backdrop-filter: blur(24px);
}

.login h1,
.login h1 a {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: none !important;
}

.nivo-login-intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
  margin: 0 0 28px;
  text-align: center;
}

.nivo-login-intro-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 74px;
  height: 74px;
  border-radius: 23px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(31,62,47,.16), inset 0 0 0 1px rgba(225,231,221,.80);
}

.nivo-login-intro-icon img {
  display: block;
  width: 50px;
  height: 50px;
  object-fit: contain;
}

.nivo-login-intro-copy strong {
  display: block;
  color: var(--nivo-login-text);
  font-size: 27px;
  line-height: 1.05;
  font-weight: 820;
  letter-spacing: -.05em;
}

.nivo-login-intro-copy span {
  display: block;
  max-width: 322px;
  margin: 9px auto 0;
  color: var(--nivo-login-muted);
  font-size: 14px;
  line-height: 1.45;
  font-weight: 560;
}

.login form {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

.login form p {
  margin: 0 0 17px;
}

.login label {
  display: block;
  margin-bottom: 7px;
  color: var(--nivo-login-text);
  font-weight: 760;
  font-size: 13px;
  line-height: 1.25;
  letter-spacing: -.01em;
}

.login form .input,
.login input[type="text"],
.login input[type="password"] {
  min-height: 54px;
  width: 100%;
  margin: 0;
  padding: 0 15px;
  border: 1px solid var(--nivo-login-border);
  border-radius: 16px;
  background: var(--nivo-login-surface-soft);
  color: var(--nivo-login-text);
  font-size: 16px;
  font-weight: 560;
  box-shadow: none;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.login form .input:focus,
.login input[type="text"]:focus,
.login input[type="password"]:focus {
  border-color: var(--nivo-login-green);
  background: #fff;
  box-shadow: 0 0 0 5px var(--nivo-login-focus);
  outline: none;
}

.login .user-pass-wrap {
  margin-top: 0;
}

.login .button.wp-hide-pw {
  top: 8px;
  right: 8px;
  min-width: 38px;
  min-height: 38px;
  color: var(--nivo-login-green);
  border-radius: 12px;
  box-shadow: none;
}

.login .forgetmenot {
  float: none !important;
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 28px;
  margin: 2px 0 18px !important;
}

.login .forgetmenot label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: #31402F;
  font-size: 13px;
  font-weight: 690;
}

.login input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 0;
  border-color: #C9D3C5;
  border-radius: 6px;
  box-shadow: none;
}

.login input[type="checkbox"]:checked::before {
  margin: -1px 0 0 -2px;
  color: var(--nivo-login-green);
}

.login .submit {
  float: none !important;
  clear: both;
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

.wp-core-ui .button-primary,
.login .submit .button-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  min-width: 100% !important;
  min-height: 54px;
  padding: 0 22px;
  border: 0;
  border-radius: 16px;
  background: var(--nivo-login-green);
  color: #fff;
  font-weight: 820;
  letter-spacing: -.01em;
  box-shadow: 0 16px 36px rgba(69,136,38,.26);
  transition: transform .16s ease, background .16s ease, box-shadow .16s ease;
}

.wp-core-ui .button-primary:hover,
.wp-core-ui .button-primary:focus,
.login .submit .button-primary:hover,
.login .submit .button-primary:focus {
  background: var(--nivo-login-green-dark);
  box-shadow: 0 0 0 5px var(--nivo-login-focus), 0 18px 40px rgba(69,136,38,.22);
  transform: translateY(-1px);
}

.login #nav {
  margin: 20px 0 0;
  padding: 0;
  text-align: center;
  color: var(--nivo-login-muted);
}

.login #nav a {
  color: var(--nivo-login-green-dark);
  font-weight: 760;
  text-decoration: none;
}

.login #nav a:hover {
  color: var(--nivo-login-green);
  text-decoration: underline;
  text-underline-offset: 4px;
}

.login #backtoblog,
.privacy-policy-page-link {
  display: none !important;
}

.login form::after {
  content: "Beveiligde interne omgeving";
  display: block;
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid rgba(225,231,221,.88);
  color: var(--nivo-login-muted);
  font-size: 12px;
  line-height: 1.4;
  font-weight: 720;
  text-align: center;
}

.login .message,
.login .notice,
.login .success,
.login #login_error {
  margin: 0 0 18px;
  padding: 14px 16px;
  border-left: 0;
  border-radius: 16px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 14px 34px rgba(31,62,47,.10);
  color: var(--nivo-login-text);
}

.login #login_error {
  border: 1px solid #F4B7B2;
}

.login .message,
.login .success {
  border: 1px solid #CFE8CC;
}

@media (max-width: 1120px) {
  html body.login::before {
    max-width: 430px;
    font-size: clamp(40px, 5vw, 60px);
  }

  #login {
    margin-right: max(38px, 5vw);
  }
}

@media (max-width: 920px) {
  html body.login {
    min-height: 100dvh;
    background:
      radial-gradient(circle at 50% 0%, rgba(255,159,8,.10), transparent 30%),
      linear-gradient(160deg, #173524 0%, #10291F 100%);
  }

  html body.login::before,
  html body.login::after {
    display: none;
  }

  #login {
    width: min(426px, calc(100vw - 32px));
    margin: 0 auto;
    top: 0;
    padding: 30px 24px 26px;
    transform: translateY(22px);
  }

  .nivo-login-intro {
    margin-bottom: 24px;
  }

  .nivo-login-intro-copy strong {
    font-size: 25px;
  }

  .nivo-login-intro-copy span {
    font-size: 13px;
  }

  body.login #language-switcher {
    position: static;
    transform: none;
    margin: 44px auto 0;
    text-align: center;
    opacity: .88;
  }

  body.login #language-switcher select {
    background: rgba(255,255,255,.14);
    color: rgba(255,255,255,.88);
  }
}