@font-face { font-family: Poppins; src: url(fonts/Poppins-Regular.ttf); font-weight: 400; font-display: swap; }
@font-face { font-family: Poppins; src: url(fonts/Poppins-SemiBold.ttf); font-weight: 600; font-display: swap; }
@font-face { font-family: Poppins; src: url(fonts/Poppins-Bold.ttf); font-weight: 700; font-display: swap; }

:root {
	--canvas: #ECEEF3; --surface: #FFFFFF; --ink: #0B1120; --text: #5E626C; --border: #B7BDC9;
	--ring: rgba(11,17,32,.12); --action: #0B1120; --on-action: #FFFFFF; --link: #1A73E8; --err: #DC2626; --err-bg: #FDE8E8;
}
@media (prefers-color-scheme: dark) {
	:root { --canvas: #070B15; --surface: #111827; --ink: #F3F5F9; --text: #A9B0BE; --border: #3A4663;
		--ring: rgba(243,245,249,.14); --action: #F3F5F9; --on-action: #0B1120; --link: #6AA8FF; --err: #F87171; --err-bg: rgba(248,113,113,.18); }
}
body.login {
	background: var(--canvas); color: var(--ink); font-family: Poppins, system-ui, sans-serif;
	display: flex; flex-direction: column; min-height: 100vh;
	border-top: 3px solid transparent;
	border-image: linear-gradient(90deg,#3AB0E0 0 20%,#6ABF2E 20% 40%,#F5C518 40% 60%,#E8172A 60% 80%,#1D4E9E 80% 100%) 1;
}
#login { width: 100%; max-width: 390px; padding: 8vh 16px 16px; margin: 0 auto; box-sizing: border-box; flex: 1; }
.login h1 { display: flex; flex-direction: column; align-items: center; margin-bottom: 24px; }
.login h1 a {
	width: 92px; height: 92px; margin: 0 auto 10px; background-size: contain; background-position: center; background-repeat: no-repeat;
}
.login h1::after {
	content: ""; display: block; width: 180px; height: 30px; margin: 0 auto;
	background-size: contain; background-position: center; background-repeat: no-repeat;
}
.login h1 + * { margin-top: 0; }
#login::before {
	content: "Control de activos"; order: 2; display: block; text-align: center;
	font-size: 12px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; color: var(--text);
}
#login { display: flex; flex-direction: column; }
#login > h1 { order: 1; }
#login > *:not(h1) { order: 3; }
#login::before { margin: -12px 0 22px; }

.login form {
	background: var(--surface); border: 0; border-radius: 16px; box-shadow: 0 1px 2px rgba(11,17,32,.06);
	padding: 20px; margin-top: 0; display: flex; flex-direction: column;
}
@media (prefers-color-scheme: dark) { .login form { border: 1px solid #27314A; } }
.login form .input, .login input[type=text], .login input[type=password] {
	height: 52px; margin: 6px 0 14px; padding: 0 14px; font-size: 15px; font-family: inherit;
	background: var(--surface); color: var(--ink); border: 1.5px solid var(--border); border-radius: 8px; box-shadow: none;
}
.login form .input:focus, .login input[type=text]:focus, .login input[type=password]:focus {
	border: 2.5px solid var(--ink); box-shadow: 0 0 0 4px var(--ring); outline: 0;
}
.login input:-webkit-autofill { -webkit-box-shadow: 0 0 0 40px var(--surface) inset; -webkit-text-fill-color: var(--ink); }
.login label { font-size: 14px; font-weight: 600; color: var(--ink); }
.login .user-pass-wrap { margin-bottom: 0; }
.login .wp-pwd { position: relative; }
.login .button.wp-hide-pw { height: 52px; top: 6px; color: var(--text); }
.login .forgetmenot { float: none; margin: 0 0 18px; display: flex; align-items: center; }
.login .forgetmenot label { font-weight: 500; font-size: 15px; display: flex; align-items: center; gap: 10px; }
.login input[type=checkbox] { width: 24px; height: 24px; border-radius: 6px; border: 1.5px solid var(--border); background: var(--surface); margin: 0; }
.login input[type=checkbox]:checked { background: var(--action); border-color: var(--action); }
.login input[type=checkbox]:checked::before {
	content: ""; width: 24px; height: 24px; margin: -1.5px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 16px no-repeat;
}
@media (prefers-color-scheme: dark) {
	.login input[type=checkbox]:checked::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1120' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E"); }
}
.login .submit { float: none; }
.login .button-primary, .wp-core-ui .button-primary {
	float: none; width: 100%; height: 56px; border-radius: 999px; border: 0;
	background: var(--action); color: var(--on-action); font-family: inherit; font-size: 16px; font-weight: 700; text-shadow: none; box-shadow: none;
}
.login .button-primary:hover, .login .button-primary:focus { background: var(--action); color: var(--on-action); filter: brightness(.94); box-shadow: 0 0 0 4px var(--ring); }
.login #nav { text-align: center; margin: 18px 0 0; padding: 0; font-size: 14px; }
.login #nav a, .login #backtoblog a { color: var(--link); font-weight: 600; }
.login #backtoblog, .login .privacy-policy-page-link, .language-switcher { display: none; }
.login #login_error, .login .message, .login .success, .login .notice {
	border: 0; border-radius: 12px; box-shadow: none; padding: 12px 14px; margin: 0 0 14px; font-size: 14px;
	background: var(--err-bg); color: var(--ink); border-left: 4px solid var(--err);
}
.login .message, .login .success { background: var(--surface); border-left-color: #15803D; }
.ia-login-pie { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0; padding: 24px 16px calc(24px + env(safe-area-inset-bottom)); font-size: 13px; font-weight: 500; color: var(--text); }
.ia-login-pie svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
