/*
 * Tema Bernardo Lima 2026 — página de início de sessão
 * Versão do ficheiro: 2026-10-10 15:14
 */

:root { --accent: #111111; --on-accent: #ffffff; --dark: #0D1B1F; --dark-rgb: 13, 27, 31; --light: #F3F5F2; --f-display: 'Bodoni Moda', Georgia, serif; --f-text: 'Instrument Sans', -apple-system, 'Segoe UI', sans-serif; }

body.login {
	display: flex;
	flex-direction: column;
	justify-content: center;
	box-sizing: border-box;
	min-height: 100vh;
	margin: 0;
	padding: 32px 0 32px 56%;
	background: var(--light);
	color: #10181b;
	font-family: var(--f-text);
}

/* Painel de identidade */
.bl-login-brand {
	position: fixed;
	inset: 0 44% 0 0;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 22px;
	box-sizing: border-box;
	padding: clamp(28px, 5vw, 72px);
	background: var(--dark);
	color: #f1f4f2;
	overflow: hidden;
	isolation: isolate;
}
.bl-login-brand::before { content: ''; position: absolute; inset: 0; z-index: -2; background: var(--img, none) center / cover no-repeat; }
.bl-login-brand::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgba(var(--dark-rgb), 0.96) 0%, rgba(var(--dark-rgb), 0.66) 48%, rgba(var(--dark-rgb), 0.55) 100%); }
.bl-login-brand__staff { position: absolute; z-index: -1; left: 0; right: 0; top: 38%; display: grid; gap: 13px; }
.bl-login-brand__staff i { height: 1px; background: rgba(241, 244, 242, 0.2); transform-origin: left; animation: bl-staff 1.3s cubic-bezier(0.65, 0, 0.35, 1) both; }
.bl-login-brand__staff i:nth-child(2) { animation-delay: 70ms; } .bl-login-brand__staff i:nth-child(3) { animation-delay: 140ms; } .bl-login-brand__staff i:nth-child(4) { animation-delay: 210ms; } .bl-login-brand__staff i:nth-child(5) { animation-delay: 280ms; }
@keyframes bl-staff { from { transform: scaleX(0); } }
.bl-login-brand__logo { display: block; color: #fff; text-decoration: none; }
.bl-login-brand__mark { display: block; width: min(100%, 460px); aspect-ratio: var(--logo-ratio, 2.6); margin-left: -1.5%; background: #fff; -webkit-mask: var(--logo) left center / contain no-repeat; mask: var(--logo) left center / contain no-repeat; }
.bl-login-brand__logo img { max-width: min(100%, 420px); height: auto; }
.bl-login-brand__name { font-family: var(--f-display); font-style: italic; font-size: clamp(2.6rem, 5vw, 4.4rem); line-height: 1; letter-spacing: -0.02em; }
.bl-login-brand__txt { display: grid; gap: 2px; padding-top: 20px; border-top: 1px solid rgba(241, 244, 242, 0.2); }
.bl-login-brand__txt span { font-size: 0.9rem; color: rgba(241, 244, 242, 0.7); }
.bl-login-brand__txt strong { font-family: var(--f-display); font-weight: 400; font-size: 1.7rem; line-height: 1.15; }
.bl-login-brand__txt em { font-family: var(--f-display); font-size: 1.05rem; color: rgba(241, 244, 242, 0.75); }

/* Formulário */
#login { width: min(360px, calc(100% - 48px)); margin: 0 auto; padding: 24px 0 0; }
.login h1.wp-login-logo, .login #login > h1:first-child { margin: 0 0 18px; }
.login h1 a, .login .wp-login-logo a { width: auto; height: auto; margin: 0; padding: 0; background: none; text-indent: 0; overflow: visible; font-family: var(--f-display); font-style: italic; font-weight: 400; font-size: 2rem; line-height: 1.1; color: #10181b; text-align: left; }
.login h1 a:focus { box-shadow: none; text-decoration: underline; }
.login form { margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; overflow: visible; }
.login label { font-size: 0.85rem; font-weight: 600; color: #56646a; }
.login form .input, .login input[type='text'], .login input[type='password'], .login input[type='email'] { margin: 6px 0 18px; padding: 10px 14px; min-height: 46px; border: 1px solid #c5cbc8; border-radius: 10px; background: #fff; font-size: 1rem; box-shadow: none; }
.login form .input:focus, .login input[type='text']:focus, .login input[type='password']:focus, .login input[type='email']:focus { border-color: var(--dark); box-shadow: 0 0 0 1px var(--dark); outline: none; }
.login .button.wp-hide-pw { min-height: 46px; margin-top: 0; color: #56646a; }
.login .button.wp-hide-pw:focus { border-color: var(--dark); box-shadow: 0 0 0 1px var(--dark); }
.login .forgetmenot { float: none; margin: 0 0 18px; }
.login .forgetmenot label { font-weight: 400; color: #10181b; }
.login input[type='checkbox'] { border-color: #9aa5a1; border-radius: 4px; }
.login input[type='checkbox']:focus { border-color: var(--dark); box-shadow: 0 0 0 1px var(--dark); }
.login p.submit { float: none; }
.login .button-primary, .wp-core-ui.login .button-primary { float: none; width: 100%; min-height: 48px; padding: 0 22px; border: 0; border-radius: 999px; background: var(--dark); color: #fff; font-weight: 600; font-size: 0.98rem; transition: background 0.25s, color 0.25s; }
.login .button-primary:hover, .login .button-primary:focus, .wp-core-ui.login .button-primary:hover, .wp-core-ui.login .button-primary:focus { background: var(--accent); color: var(--on-accent); box-shadow: none; }
.login #nav, .login #backtoblog { margin: 14px 0 0; padding: 0; font-size: 0.875rem; }
.login #nav a, .login #backtoblog a, .login .privacy-policy-link { color: #56646a; }
.login #nav a:hover, .login #backtoblog a:hover, .login .privacy-policy-link:hover { color: #10181b; }
.login .privacy-policy-page-link { width: min(360px, calc(100% - 48px)); margin: 18px auto 0; text-align: left; }
.login .message, .login .notice, .login #login_error, .login .success { margin: 0 0 18px; padding: 12px 14px; border-left: 3px solid var(--dark); border-radius: 0 10px 10px 0; background: #fff; box-shadow: none; }
.login #login_error { border-left-color: #b3261e; }
.login .language-switcher { display: none; }
.login #login form p { margin-bottom: 0; }
.login .wp-pwd { margin-bottom: 0; }

/* Crédito */
.bl-login-credit { display: flex; align-items: center; gap: 8px; width: min(360px, calc(100% - 48px)); margin: 28px auto 24px; padding-top: 16px; border-top: 1px solid rgba(16, 24, 27, 0.14); font-size: 0.8rem; color: #56646a; }
.bl-login-credit a { display: inline-flex; }
.reage-logo { height: 20px; width: auto; }

@media (max-width: 860px) {
	body.login { justify-content: flex-start; padding: 0 0 24px; }
	.bl-login-brand { position: relative; inset: auto; padding: 28px 24px 24px; gap: 14px; }
	.bl-login-brand__mark { width: min(70%, 300px); }
	.bl-login-brand__staff { top: 30%; gap: 9px; }
	#login { padding-top: 28px; }
}
@media (prefers-reduced-motion: reduce) { .bl-login-brand__staff i { animation: none; } }
