/* Theme CSS customization for UKE.v2 theme (based on Keycloak.v2) */

/*Login screen */
.login-pf body {
    background: #E9ECEE;
	font-family: "Segoe UI", Helvetica, "DejaVu Sans", Roboto, Arial, sans-serif;
	
	display: flex;
	flex-direction: column;
}


/*KC Client Heading*/
#body-header {
    background-color: #FFFFFF;
    min-height: 83px;
    border-top: 6px solid #004B8E;
    box-shadow: 0 0px 4px 0 rgba(0, 0, 0, 0.1), 0 0px 8px 0 rgba(0, 0, 0, 0.15);
}

.body-header-content {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	
	min-height: 83px;
	padding-top: 7px;
}

.body-header-logo {
	max-width: 560px;
}


.body-header-logo img.uke-logo {
	max-height: 60px;
}


/* Realm name header from grid - remove */
body #kc-header, #kc-header-wrapper {
    display: none;
}


body #kc-page-title {
	font-family: "Segoe UI", Helvetica, "DejaVu Sans", Roboto, Arial, sans-serif;
	font-weight: bold;
	text-align: center;

	/*margin-top: 10px;*/
	margin-bottom: 10px;
}


body .pf-v5-c-login {
	display: flex;
	
	flex-direction: column;
	align-items: center;
	
	min-height: initial; /* reset patternfly 100vh */
    flex: 1 0 auto;
}

body .pf-v5-c-login__container {
	display: block;
	padding: 0;
	
	flex: 5 1 content;
}

.uke-pf-v5-c-login__spacer {
	/* background-color: red; */
	
	flex: 0; /* no spacer on small devices. overriden in media > 768px */
}




@media (min-width: 768px) {

	.body-header-logo {
		width: 560px;
	}

	body .pf-v5-c-login__container {
		width: 560px;
	}

	body .uke-pf-v5-c-login__spacer {
		width: 560px;
		
		flex: 1 1 2em;
	}
	
    body .pf-v5-c-login__main {
        margin: 80px inherit 20px inherit;
        padding: 0 27px 10px;

        width: 560px;
    }
}

/* less margin and no footer for height-limited displays (and popups) */
@media (max-height: 600px) {
 
	body footer#body-footer {
					display: none;
	}
  
	body div.pf-v5-c-login {
					--pf-v5-c-login__main-header--PaddingTop: var(--pf-v5-global--spacer--md);
					--pf-v5-c-login__main--MarginBottom: var(--pf-v5-global--spacer--xs);
					--pf-v5-c-login__main-body--PaddingBottom: var(--pf-v5-global--spacer--xs);
	}
}



body .pf-v5-c-login__main {
    /*background of the login card */
    background: #FFFFFF;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.1);
    border: none;
	
	align-self: inherit;
}


/* flat design for smaller displays */
@media (max-width: 768px) {
	
	#body-header {
		/*box-shadow: none;
		border-bottom: 1px solid rgba(0, 0, 0, 0.1);*/
	}
	
	.login-pf body {
		background-color: #ffffff;
	}
	
	body .pf-v5-c-login__main {
		box-shadow: none;
	}
}



body .pf-v5-c-form__group {
	margin-bottom: 16px;
}


body .pf-v5-c-form-control, body .card-pf .pf-c-form-control:not(textarea) {
	/*height: 40px;
   border: 1px solid #cdcdcd;
   border-radius: 2px;
	
	margin-bottom: 2px;*/
}

body .pf-v5-c-form-control > input {
	height: 44px;
}


/* Labels and Invalid username/password text */
body label.pf-v5-c-form__label, body span.pf-v5-c-helper-text__item-text {
	/*line-height: 1.8;
	font-size: 13px;*/
}

span#input-error {
	color: red;
}

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

footer#body-footer {
	display: flex;
	justify-content: center;
	align-items: center;
	
	width: 100%;
	min-height: 49px;
	
	background-color: #FFFFFF;
	box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.15);
}


div.footer-message {
	font-size: 13px;
	color: #3d3d3d;
	
	max-width: 560px;
}


/* limit IdP button height by limiting SVG icon height */
li.pf-v5-u-pb-sm svg {
	height: 28px;
}


body .pf-v5-c-form {
	--pf-v5-c-form__label-text--FontWeight: var(--pf-v5-global--FontWeight--normal);
}