/* Site IT BV - module Inloggen. Alleen vormgeving; het WordPress-inlogformulier zelf blijft ongewijzigd.
   Desktop: illustratie links (62%), formulier rechts. Onder 900px: alleen het formulier. */
body.login.siteit-login {
 --sit-ink:#12385d; --sit-muted:#58728c;
 box-sizing:border-box; margin:0; width:100%; height:auto;
 min-height:100vh; min-height:100svh; display:flex; flex-direction:column;
 align-items:center; justify-content:center;
 padding:48px 40px 48px calc(62% + 40px);
 font-family:system-ui,-apple-system,"Segoe UI",sans-serif; color:var(--sit-ink); background:#fff;
}
body.siteit-login::before,body.siteit-login::after { content:none; }

/* Illustratie */
.siteit-login .siteit-hero {
 position:fixed; inset:0 auto 0 0; width:62%; overflow:hidden;
 background:#0b304f url('hero.png') center bottom / cover no-repeat;
}
.siteit-login .siteit-hero-copy { position:absolute; top:8%; left:8%; right:7%; }
.siteit-login .siteit-hero-copy h2 {
 margin:0; font-size:clamp(30px,3.5vw,62px); line-height:1.12;
 color:#fff; font-weight:700; letter-spacing:-1.5px;
}
.siteit-login .siteit-hero-copy p { margin:16px 0 0; color:#b6d8ee; max-width:620px; font-size:clamp(17px,1.5vw,24px); line-height:1.55; }

/* Kader met het formulier */
.siteit-login #login {
 box-sizing:border-box; flex:none; display:flex; flex-direction:column;
 width:426px; max-width:100%; padding:32px; margin:auto;
 background:#fff; border:1px solid #d9dde2; border-radius:18px; box-shadow:none;
}
.siteit-login #login h1 { margin:0; padding:0; }
.siteit-login #login h1 a {
 display:block; width:250px; max-width:100%; height:125px; margin:0 auto 30px;
 background:url('logo.png') center / contain no-repeat;
}
.siteit-login .siteit-intro { margin:0 0 28px; text-align:left; }
.siteit-login .siteit-intro h2 { margin:0; color:var(--sit-ink); font-size:28px; line-height:1.2; font-weight:700; letter-spacing:-.6px; }
.siteit-login #login form { margin:0; padding:0; background:transparent; border:0; box-shadow:none; overflow:visible; }
.siteit-login #login form::before,.siteit-login #login form::after { content:none; }
.siteit-login #login label { display:inline-block; color:var(--sit-ink); font-size:14px; line-height:1.5; margin-bottom:7px; font-weight:500; }
.siteit-login #login input[type=text],.siteit-login #login input[type=password],.siteit-login #login input[type=email],.siteit-login #login input[type=number] {
 box-sizing:border-box; width:100%; min-height:48px; padding:10px 12px; margin:0 0 22px;
 border:1px solid #cbdbe8; border-radius:8px; background:#fff;
 color:var(--sit-ink); font-size:16px; line-height:1.5; box-shadow:none;
}
.siteit-login #login .wp-pwd { position:relative; }
.siteit-login #login .wp-pwd input { padding-right:48px; }
.siteit-login #login .wp-hide-pw { width:48px; height:48px; top:0; color:#176ba7; }
.siteit-login #login .wp-hide-pw .dashicons { top:0; }
.siteit-login #login input:focus { border-color:#1774b4; outline:0; box-shadow:0 0 0 3px #1774b424; }
.siteit-login a { color:#126cae; text-decoration:none; }
.siteit-login a:hover { color:#074d80; text-decoration:underline; }
.siteit-login a:focus-visible,.siteit-login button:focus-visible,.siteit-login input:focus-visible { outline:3px solid #187bbd; outline-offset:3px; }
.siteit-login #login .forgetmenot { display:flex; align-items:center; gap:9px; float:none; margin:0 0 20px; }
.siteit-login #login .forgetmenot label { margin:0; color:var(--sit-muted); font-size:13px; font-weight:400; }
.siteit-login #login input[type=checkbox] { width:16px; min-width:16px; height:16px; margin:0; border:1px solid #718ba3; border-radius:3px; }
.siteit-login #login .submit { margin:0; padding:0; clear:both; }
.siteit-login #login .button-primary {
 box-sizing:border-box; float:none; display:block; width:100%; min-height:48px; height:auto; padding:11px 14px;
 border:1px solid #1975b2; border-radius:7px; background:linear-gradient(110deg,#176caa,#2b84bf);
 color:#fff; font-size:16px; font-weight:700; line-height:1.5; text-shadow:none; box-shadow:none; white-space:normal;
}
.siteit-login #login .button-primary:hover { background:linear-gradient(110deg,#125d97,#2277ad); }
.siteit-login #login .button-primary:disabled { opacity:.55; }

/* Supportregel onderaan het kader */
.siteit-login #login #siteit-help {
 order:100; padding:22px 0 0; margin:28px 0 0; border-top:1px solid #d6e3ed;
 text-align:center; color:var(--sit-muted); font-size:13px; line-height:1.6;
}
.siteit-login #siteit-help a { text-decoration:underline; text-underline-offset:2px; }
.siteit-login .siteit-footer,.siteit-login #backtoblog,.siteit-login .language-switcher { display:none; }
/* Op het gewone inlogscherm geen extra links; op wachtwoord vergeten/registreren wel. */
.siteit-login.login-action-login #nav { display:none; }
.siteit-login #login #nav { padding:0; margin:22px 0 0; text-align:center; line-height:1.6; }
.siteit-login #login .message,.siteit-login #login .success,.siteit-login #login #login_error {
 box-sizing:border-box; padding:12px 14px; margin:0 0 22px; border-radius:4px;
 background:#edf5fc; color:var(--sit-ink); line-height:1.5; font-size:14px; box-shadow:none;
}
.siteit-login #login .indicator-hint { margin:12px 0; font-size:13px; }
.siteit-login #login #pass-strength-result { box-sizing:border-box; margin:0 0 12px; }
.siteit-login #login .privacy-policy-page-link { margin:20px 0 0; }

/* Inlogvenster binnen wp-admin (sessie verlopen) */
body.login.siteit-login.interim-login { justify-content:flex-start; padding:24px; }
.siteit-login.interim-login .siteit-hero { display:none; }

/* Lage schermen */
@media (min-width:901px) and (max-height:650px) {
 body.login.siteit-login { padding-top:28px; padding-bottom:28px; }
 .siteit-login #login h1 a { width:210px; height:105px; margin-bottom:20px; }
}
/* Tablet en mobiel */
@media (max-width:900px) {
 body.login.siteit-login { padding:36px 24px; }
 .siteit-login .siteit-hero { display:none; }
 .siteit-login #login { padding:28px 24px; }
}
@media (max-width:640px) {
 .siteit-login #login label { font-size:15px; }
}
@media (max-width:360px) {
 body.login.siteit-login { padding:24px 16px; }
 .siteit-login #login { padding:24px 18px; }
}