/* CampusOS Terminal skin for wp-login.php. Reads the same tokens as the
   site (tokens.css), so light/dark follow the visitor automatically. */

body.login{
	background:var(--cos-bg);
	font-family:var(--cos-sans);
	padding-top:56px;
}

/* faux system bar — the OS chrome that brands every other screen */
body.login::before{
	content:var(--cos-login-sys, "CAMPUS.OS · USER AUTHENTICATION");
	position:fixed; top:0; left:0; right:0; z-index:10;
	background:var(--cos-ink); color:var(--cos-bg);
	font-family:var(--cos-mono); font-size:11px; letter-spacing:.08em;
	text-transform:uppercase; padding:7px 16px;
}

#login{ width:368px; max-width:calc(100vw - 32px); padding-top:5vh; }

/* wordmark instead of the WordPress logo, with the Terminal cursor */
.login h1 a{
	background-image:none !important;
	text-indent:0; width:auto; height:auto; line-height:1.2;
	font-size:26px; font-weight:800; letter-spacing:-.02em;
	color:var(--cos-ink);
}
.login h1 a::after{
	content:""; display:inline-block; width:10px; height:20px; margin-left:7px;
	background:var(--cos-green); vertical-align:-2px;
	animation:cos-blink 1.2s steps(1) infinite;
}
@keyframes cos-blink{ 50%{opacity:0} }
@media (prefers-reduced-motion: reduce){ .login h1 a::after{animation:none} }

.cos-login-greet{
	text-align:center; color:var(--cos-mut);
	font-size:14px; font-weight:500; margin:6px 0 0;
}

/* the card */
.login form{
	background:var(--cos-card);
	border:1px solid var(--cos-line);
	border-radius:var(--cos-r-panel);
	box-shadow:var(--cos-shadow);
	padding:24px; margin-top:18px;
}
.login form label{
	font-size:11px; font-weight:800; letter-spacing:.1em;
	text-transform:uppercase; color:var(--cos-mut);
}
.login form input[type="text"],
.login form input[type="password"],
.login form input[type="email"]{
	background:var(--cos-bg);
	border:1.5px solid var(--cos-line);
	border-radius:var(--cos-r-btn);
	padding:10px 13px; margin-top:4px;
	font-size:15px; font-weight:600; color:var(--cos-ink);
	box-shadow:none;
}
.login form input[type="text"]:focus,
.login form input[type="password"]:focus,
.login form input[type="email"]:focus{
	border-color:var(--cos-green); box-shadow:none; outline:none;
}
.login .wp-hide-pw{ color:var(--cos-mut) }
.login form .forgetmenot label{
	text-transform:none; letter-spacing:0;
	font-size:13px; font-weight:600; color:var(--cos-ink);
}
.login input[type="checkbox"]{ accent-color:var(--cos-green); border-color:var(--cos-line) }
.login input[type="checkbox"]:checked{ background:var(--cos-green); border-color:var(--cos-green) }

.login .button-primary{
	width:100%; float:none; margin-top:10px;
	background:var(--cos-green); border:0;
	border-radius:var(--cos-r-btn);
	padding:11px; font-size:14px; font-weight:800;
	color:var(--cos-on-accent); text-shadow:none; box-shadow:none;
}
.login .button-primary:hover,
.login .button-primary:focus{ background:var(--cos-green-ink); color:#fff; }

/* quiet links under the card */
.login #nav, .login #backtoblog{ text-align:center; font-size:12.5px; padding:0; }
.login #nav{ margin-top:18px }
.login #nav a, .login #backtoblog a{ color:var(--cos-mut); font-weight:600; }
.login #nav a:hover, .login #backtoblog a:hover{ color:var(--cos-green); }
.login .privacy-policy-page-link{ font-size:12px; margin:12px 0 0 }

/* notices in the system's voice */
#login_error, .login .message, .login .success{
	border:1px solid var(--cos-line);
	border-left:4px solid var(--cos-amber);
	border-radius:var(--cos-r-btn);
	background:var(--cos-card); color:var(--cos-ink);
	box-shadow:var(--cos-shadow); font-size:13.5px;
}
#login_error{ border-left-color:#C75146; }

.language-switcher{ display:none }