/*
 * Angepasst an das Design von DLLP.
 */

/* Farben */
:root {
  --color-accent: #4AA0FF;
  --button-primary-bgc: #006FD8;
  --button-primary-bgc-hover: #1d7cd5;
  --button-primary-bgc-active: #388bd8;
  --button-primary-bgc-disabled: #bdbdbb;
  --border-radius-interactable: 0px;
  --bgc-content-container: transparent;
  --bgc-content-body: white;
  --font-color-contrast-high: black;
}

/* Hintergrund der ganze Login-Seite */
body {
  background-color: #07032F !important;
  background-image: url(/univention/login/css/dllp-logo.svg) !important;
  background-position: 20px 20px !important;
  background-repeat: no-repeat !important;
  background-size: 200px !important;
}

/* Header nicht anzeigen - enthält Text wie "Anmelden bei..." */
#kc-header {
  display: none;
}
/* Sprache ändern Farbe anpassen */
#kc-locale-dropdown button {
	color: #000;
	padding-left: -10px;
	
}

/* Oberer Teil des Login-Formulars, in dem normalerweise das Logo angezeigt wird */
.login-pf-page .login-pf-header { 
  --login-logo: url();
  padding: 0px;
  margin: 0px;
} 

/* Sprachauswahl auf die BOX schieben*/
#kc-locale {
  top: -36px;
}
/* Umgang mit Fehlermeldung position und größe*/
.pf-c-alert {
	padding-top: 5px;
	top: -33px;
	height: 12px;
	line-height: 115%;
}
/* Umgang mit Fehlermeldung */
.login-pf-page .pf-c-alert__title {
	color: #FFF !important;
}

#kc-locale-wrapper {
  top: 0px;
}

/* Rahmen um das Formular rum */
.card-pf {
  position: absolute !important;
  padding: 20px !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  min-height: 100px;
  width: 430px !important;
}

.login-pf-page {
  height: 100%;
  margin: 0px !important;
  padding: 0px !important;
  background-image: url(/univention/login/css/dllp-login.svg) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 700px !important;
}

.pf-c-button.pf-m-primary {
  color: white;
  border-radius: 20px;
  padding: 5px;
}

#kc-form-buttons {
  margin-left: 20%;
  margin-right: 20%;
}


/* 
 * Fehlermeldungen werden in scharz () auf dunklem Hintergrund angezeigt.
 * Hier forcieren wir den Text auf weiß, damit man ihn lesen kann.
 */ 
.ucs-p {
  color: white !important;
}

/*
 * Enthält den "Passwort vergessen?" Link.
 * Soll horizontal und vertikal zentriert werden. Dann etwas nach unten verschieben, damit es unter
 * dem "Login" Button angezeigt wird.
 */
#umcLoginLinks {
  position: absolute;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  margin-top: 105px;
  color: var(--bgc-content-body);
}

/*
 * Dinge so schieben, dass der Link "Passwort vergessen?"
 * wieder hin passt
 */

#kc-content-wrapper {
  margin-top: 0px;
}

#kc-form-wrapper {
  margin-top: 0px;
}

.login-pf-settings {
  margin-top: -10px;
}

.login-pf-page .login-pf-header {
  margin-top: -15px;
}

#kc-form-buttons {
  margin-top: 10px;
}

/* Größe von "Ungültiger Benutzername oder Passwort" reduzieren */
/* TODO: Das funktioniert noch nicht */
.pf-c-alert {
  padding: 5px !important;
}

/*
 * Start Passwort Reset
 * - Kompakter darstellen
 * - Text auf weiß setzen
 */

#kc-info {
  padding-top: 10px;
}

#kc-info-wrapper {
  color: var(--bgc-content-body);
  font-size: 12px;
  padding: 0px;
}

#kc-reset-password-form > .form-group {
  color: var(--bgc-content-body);
}

#kc-reset-password-form .pf-c-form-control {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
  margin-bottom: 5px;
}
/* Ende Passwort Reset */