/* Huisstijl RSO Zuid-Limburg: navy #002060, slate #44546A, blauw #4472C4, golfpalet als dunne lijn. */
@font-face { font-family: 'Carlito'; font-weight: 400; src: url('../fonts/carlito-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Carlito'; font-weight: 700; src: url('../fonts/carlito-latin-700-normal.woff2') format('woff2'); }

:root {
  --rso-navy: #002060;
  --rso-slate: #44546a;
  --rso-blue: #4472c4;
  --golf: linear-gradient(90deg, #c00000 0%, #c00000 14%, #101418 14%, #101418 22%, #70ad47 22%, #70ad47 40%, #7030a0 40%, #7030a0 48%, #ffc000 48%, #ffc000 100%);
}

html, body.login-pf, .login-pf body {
  background: var(--rso-navy) !important;
  font-family: 'Carlito', 'Calibri', 'Segoe UI', sans-serif !important;
}
body::before {
  content: '';
  position: fixed; left: 0; right: 0; bottom: 0; height: 6px;
  background: var(--golf);
}

#kc-header { margin: 48px 0 20px; }
#kc-header-wrapper {
  color: #fff !important;
  font-family: 'Carlito', sans-serif !important;
  font-size: 30px !important;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none !important;
  line-height: 1.25;
  padding: 104px 16px 0 !important;
  background: url('../img/rso-logo-white.svg') no-repeat center top / 280px auto;
  white-space: normal !important;
}
#kc-header-wrapper::after {
  content: 'Veilig · Tijdig · Gedeeld';
  display: block;
  margin-top: 6px;
  font-size: 15px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.72);
}

.card-pf {
  border-radius: 16px !important;
  border-top: 0 !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28) !important;
  padding: 28px 36px 32px !important;
  max-width: 460px;
  position: relative;
  overflow: hidden;
}
.card-pf::before {
  content: '';
  position: absolute; left: 0; right: 0; top: 0; height: 5px;
  background: var(--golf);
}
#kc-page-title { color: var(--rso-navy); font-weight: 700; font-size: 24px; }
.login-pf-page .login-pf-header h1 { color: var(--rso-navy); font-weight: 700; }

.form-control, .pf-c-form-control {
  border-radius: 10px !important;
  border: 1px solid #c3cbd8 !important;
  height: 42px;
  font-family: inherit;
  font-size: 16px;
}
.form-control:focus { border-color: var(--rso-blue) !important; box-shadow: 0 0 0 3px rgba(68, 114, 196, 0.25) !important; }
label, .control-label { color: var(--rso-slate); font-weight: 700; }

.btn-primary, .pf-c-button.pf-m-primary, #kc-login {
  background: var(--rso-navy) !important;
  border: 0 !important;
  border-radius: 999px !important;
  height: 44px;
  font-family: inherit;
  font-size: 17px;
  font-weight: 700;
}
.btn-primary:hover, .btn-primary:focus, #kc-login:hover { background: var(--rso-blue) !important; }

a, a:visited { color: var(--rso-blue); }
.alert, .pf-c-alert { border-radius: 10px; }
#kc-locale ul { border-radius: 10px; }
#kc-locale-dropdown a#kc-current-locale-link { color: #fff; }
.login-pf-page .login-pf-page-header { margin-bottom: 8px; }

#kc-header-wrapper { text-align: center; }
.pf-c-input-group { gap: 6px; }
.pf-c-input-group .pf-c-button.pf-m-control {
  border-radius: 10px !important;
  border: 1px solid #c3cbd8 !important;
  height: 42px;
}
.pf-c-input-group .pf-c-button.pf-m-control::after { border: 0 !important; }