////
/// @group layout/login
////

/// Login dialog style. 
@mixin os-login {
	.v-slot-loginPanelArea {
    background-image: $os-login-background-image;
    background-repeat: no-repeat;
    /*background-size: cover;*/
    background-color: $os-light-contrast;
	background-size: 450px 120px;
    background-position: 50% 100px;    
	}
			
	.loginPanelArea { 
		
		&.v-panel {
			border: 0px !important;
			background: transparent;
			position: relative;
		    top: 300px;
			}
		}
	
	.loginFullArea {
		background: $v-app-background-color;
		}  
		
	.osbpLoginForm {
		background: transparent;
		padding: 0px !important;
		}
		
	.v-slot-loginTitleArea {
		background: transparent;
		border-left: $v-border;
		border-right: $v-border;
		border-top: $v-border;
		.os-view-header-h2 {
			text-align: center;
			}
		}
	.v-slot-loginTextArea {
		background: transparent;
		width: 100% !important;
		.v-textfield {
			@include os-textfield-login;
			}
		}
		
	div#loginUserArea {
		background: transparent;
		border-left: $v-border;
		border-right: $v-border;
		padding: $v-unit-size $v-unit-size*2 $v-unit-size $v-unit-size*2;
		} 	
	div#loginButtonArea {
		background: transparent;
		border-left: $v-border;
		border-right: $v-border;
		border-bottom: $v-border;
		padding: 0px $v-unit-size*2 $v-unit-size $v-unit-size*2;
		@include box-shadow(0px 3px 3px transparentize(#000, 0.65));
		}
	div#loginTextArea {
		background: transparent;
		border-left: $v-border;
		border-right: $v-border;
		padding: 0px $v-unit-size*2 $v-unit-size*0.5 $v-unit-size*2; /*t r b l */
		>.v-expand {
			width: 90%;
			margin: 0 auto;
			}	
		img.v-image.v-widget {
    		margin-top: $v-unit-size * -0.5;			
			}
		}
		
	div#loginImageArea {
	  	padding: 0px;
	  	width: 0px !important;
	  	img {
	  		display:none;
	  		}
	 	}
	 		
	.loginLoginArea > .v-expand > .v-slot {
		vertical-align: middle !important;
		
		.v-checkbox > input ~ label:before {
			border-radius: 50%;
			}
		}
	
	div#loginRegisterArea {
		button.v-nativebutton.v-widget.v-has-width {
			border: none;
			background: transparent;
			color: $v-focus-color;
			font-weight: bold;
			@include box-shadow(none);
			white-space: nowrap;
			//padding:0px;
			}
		.v-expand {
			padding-top: 1px;
			}
		}
	
	.loginCopyrightArea {
		.v-label.v-widget.v-has-width {
			padding: $v-unit-size *0.3;
			padding-bottom: 1px; 
			text-align: center;
			background-color: transparentize($v-app-background-color, 0.75);
			color: $os-base-color;
			font-weight: bold;
		}
		.v-label.v-widget.loginVersionField {
			padding: $v-unit-size *0.1;
			padding-right: 10px; 
			text-align: right;
			font-size:10px;
		}
	}
}