@import 'library';

* {
	margin:0; padding:0; text-decoration:none;
	.box-sizing(border-box);
}

html {
	font: 62.5%/1.5 Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;
}

body.login {
	font-size:2rem;
	height:100vh; overflow:hidden;
}

#wp-auth-check-wrap #wp-auth-check {
	margin:0 auto 0 -20rem;
	width:45rem; min-height:60rem;
	top:3rem;
	padding:2rem 0 0;

	body.login {
		height:90vh;
	}
}
#wp-auth-check-wrap .wp-auth-check-close:before {
	margin:-3px 0 0;
}

#wp-auth-fallback {
	text-align:center;
	p {
		font-size:2rem; line-height:1.3;
		b {
			font-size:2.5rem;
		}
		a {
			font-weight:bold;
		}
	}
}


#login_error, .message {
	display:block; max-width:80%;
	margin:0 auto 2rem; padding:1.6rem 2rem;
	text-align:center;
	line-height:1;
	border:0.1rem solid; border-left-width:1.6rem;
	.rounded(0.8rem);
}



#login {
	margin:5rem auto;
	max-width:48rem;

	h1 {
		margin-bottom:2rem;

		a {
			letter-spacing:-0.02rem;
			line-height:0.9;
			text-transform:uppercase;
			text-align:center;
			display:block; max-width:80%; margin:0 auto 3rem;
		}
	}

	form {
		max-width:80%; margin:1rem auto 0; padding:2rem;
		
		border:0.1rem solid;
		.rounded(0.8rem);
		
		text-align:left;
		font-family:"Segoe UI", Segoe, Tahoma, Geneva, sans-serif;

		.input {
			margin:0.1rem auto 0.8rem; padding:0.8rem;
			border:0.1rem solid;
			.box-shadow(0 0.1rem 0.2rem #dddddd inset);
			.rounded(0.2rem);
			width:100%;
			outline:none;
		}

		.wp-pwd {
			position:relative;
			.button.wp-hide-pw {
				background:transparent;
				border: 1px solid transparent;
				box-shadow: none;
				font-size: 14px;
				line-height: 2;
				width: 2.5rem;
				height: 2.5rem;
				min-width: 40px;
				min-height: 40px;
				margin: 0;
				padding: 5px 9px;
				position: absolute;
				right: 0;
				top: 0;
			}
		}

		// clear space to the remember/submit row
		input#user_pass { margin-bottom:2.4rem; }
		

		.forgetmenot {
			float:left;
			position:relative;

			label {
				cursor:pointer;
				margin-left:4rem;
				position:relative;

				&:before {
					content:"";
					display:inline-block;
					width:3rem; height:3rem; 
					position:absolute;
					left:-4rem;
					bottom:-0.2rem;
					.box-shadow(0 0.1rem 0.2rem #dddddd inset);
					.rounded(0.2rem);
				}
			}

			input[type="checkbox"]:checked + label:before {
				content:"\2713";
				font-weight:bold;
				text-align:center;
			}
		}

		input[type=checkbox] {
			display:none;
		}

		#reg_passmail {
			text-align:center;
		}
		p.indicator-hint {
			clear:both; text-align:justify;
		}

		.submit {
			display:block;
			text-align:right;
			input[type="submit"] {
				cursor:pointer;
				margin-top:-0.2rem; padding:0.4rem 0.6rem;

				font-family:"Segoe UI", Segoe, Tahoma, Geneva, sans-serif;
				font-weight:bold;
				text-transform:uppercase;
				border:0.1rem solid;
				.rounded(0.4rem);
				.box-shadow(0 0.1rem 0.2rem #dddddd);
				.transition(all 0.2s ease-out);
			}
		}
	}

	form.admin-email-confirm-form {
		h1 {
			line-height:1;
			text-align:center;
		}
		p {
			margin:0.8rem 0;
			line-height:1.2;
		}
		div.admin-email__actions {
			text-align:center;
			margin-top:2rem;

			.button {
				cursor:pointer;
				padding:0.4rem 1rem 0.6rem;

				font-family:"Segoe UI", Segoe, Tahoma, Geneva, sans-serif;
				font-weight:bold;
				font-size:1.8rem;
				text-transform:uppercase;
				border:0.1rem solid;
				.rounded(0.4rem);
				.box-shadow(0 0.1rem 0.2rem #dddddd);
				.transition(all 0.2s ease-out);

				color:white;
				background-color:rgb(164,0,0);
			}

			#correct-admin-email {
				background-color:rgb(0,96,0);
			}

			.admin-email__actions-secondary {
				margin-top:1rem;
			}
		}
	}


}


#nav {
	display:block; max-width:80%; margin:1em auto;
	text-align:center;

	// make a better underline by drawing a bottom border underneath the text and then outlining it with a text shadow of the background colour
	a {
		text-decoration:none;
		display:inline-block;
		position:relative;
		&:hover:after {
			content:"";
			width:100%;
			display:block;
			position:relative;
			top:-0.4rem;
			border-bottom:0.06rem solid;
			z-index:-1;
		}
	}
}

#backtoblog { display:none; }


#login #pass-strength-result { position:relative; }

