/* ONEMEDIA ZERO: porte d’entrée lecteur, sans habillage WordPress générique. */

@font-face {
	font-family: "Source Serif 4";
	src: url("../../fonts/source-serif-4-roman-latin.woff2") format("woff2");
	font-style: normal;
	font-weight: 300 900;
	font-display: swap;
}

body.login,
body.login *,
body.login *::before,
body.login *::after { box-sizing: border-box; }

body.login {
	display: grid;
	min-block-size: 100vh;
	grid-template-rows: auto 1fr;
	align-items: center;
	padding: var(--om-space-sm);
	overflow-x: clip;
	background: var(--om-color-background);
	color: var(--om-color-text);
}

body.login::before {
	content: "";
	position: fixed;
	z-index: -1;
	inset: 0;
	background: linear-gradient(110deg, transparent 0 74%, var(--om-color-accent-soft) 74% 75%, transparent 75%);
}

body.login #login {
	inline-size: min(100%, 29rem);
	margin: auto;
	padding: var(--om-space-lg);
	border-block-start: 3px solid var(--om-color-accent);
	background: var(--om-color-surface);
	box-shadow: var(--om-shadow-overlay);
}

body.login #login h1:not(.om-login-title) { display: none; }
.om-login-art { display: none; }
.om-login-brand { display: inline-flex; align-items: baseline; gap: 0; margin-block-end: var(--om-space-lg); color: var(--om-color-heading); font-family: var(--om-font-heading); font-size: 2rem; font-weight: 760; letter-spacing: -0.065em; line-height: 0.9; text-decoration: none; }
.om-login-brand .om-wordmark__one { color: var(--om-color-accent); }
.om-login-pulse { display: flex; align-items: center; gap: 0.55rem; margin: 0 0 var(--om-space-sm); color: var(--om-color-accent); font-size: var(--om-size-2xs); font-weight: 780; letter-spacing: 0.12em; text-transform: uppercase; }
.om-login-pulse::before { content: ""; inline-size: 2.6rem; block-size: 1px; background: var(--om-color-accent); box-shadow: 0.55rem -0.22rem 0 -0.48rem var(--om-color-accent), 1rem 0.18rem 0 -0.48rem var(--om-color-accent); }
.om-login-title { margin: 0; font-family: var(--om-font-heading) !important; font-size: var(--om-size-2xl) !important; font-weight: 680 !important; letter-spacing: -0.035em; line-height: 1.05 !important; }
.om-login-intro { margin: 0; color: var(--om-color-text-muted); font-family: var(--om-font-reading); font-size: var(--om-size-md); }
.om-login-form-head { margin: var(--om-space-lg) 0 var(--om-space-sm); }
.om-login-form-head p { margin: 0; color: var(--om-color-accent); font-size: var(--om-size-2xs); font-weight: 780; letter-spacing: 0.12em; text-transform: uppercase; }
.om-login-form-head h2 { margin: 0.25rem 0 0; color: var(--om-color-heading); font-family: var(--om-font-heading); font-size: var(--om-size-xl); }

body.login form { margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
body.login form .input,
body.login input[type="text"],
body.login input[type="email"],
body.login input[type="password"] { inline-size: 100%; min-block-size: 3.1rem; margin-block-start: 0.35rem; padding: 0.65rem 0.75rem; border: 1px solid var(--om-color-border-strong); border-radius: 0; background: var(--om-color-background); color: var(--om-color-heading); font-size: 1rem; box-shadow: none; }
body.login label { color: var(--om-color-heading); font-size: var(--om-size-xs); font-weight: 700; }
body.login .forgetmenot { margin-block: var(--om-space-sm); }
body.login .forgetmenot label { display: inline-flex; align-items: center; gap: 0.5rem; font-weight: 560; }
body.login input[type="checkbox"] { inline-size: 1.1rem; block-size: 1.1rem; margin: 0; accent-color: var(--om-color-accent); }
body.login .button-primary { min-block-size: 2.9rem; padding-inline: 1rem; border: 1px solid var(--om-color-accent); border-radius: 0; background: var(--om-color-accent); color: var(--om-color-accent-contrast); font-size: var(--om-size-xs); font-weight: 760; text-shadow: none; box-shadow: none; }
body.login .button-primary:hover,
body.login .button-primary:focus { border-color: var(--om-color-heading); background: var(--om-color-heading); color: var(--om-color-background); }
body.login #nav,
body.login #backtoblog { margin: var(--om-space-sm) 0 0; padding: 0; font-size: var(--om-size-xs); }
body.login #nav a,
body.login #backtoblog a { color: var(--om-color-text-muted); }
body.login .message,
body.login #login_error { margin: 0 0 var(--om-space-md); padding: var(--om-space-sm); border: 0; border-inline-start: 3px solid var(--om-color-accent); background: var(--om-color-surface-muted); color: var(--om-color-text); box-shadow: none; }
body.login #login_error { border-color: var(--om-color-error); }
body.login .privacy-policy-page-link { margin-block: var(--om-space-sm) 0; }
body.login .language-switcher { display: none; }

@media (min-width: 62rem) {
	body.login { display: grid; grid-template-columns: minmax(24rem, 0.9fr) minmax(32rem, 1.1fr); gap: 0; padding: 0; }
	.om-login-art { position: fixed; inset: 0 50% 0 0; display: grid; align-content: end; padding: clamp(2rem, 5vw, 5rem); overflow: hidden; background: var(--om-color-rail) url("../../images/auth-editorial-v2.webp") center / cover no-repeat; color: var(--om-color-rail-text); }
	.om-login-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgb(6 10 14 / 0.95), rgb(6 10 14 / 0.12) 70%); pointer-events: none; }
	.om-login-art > * { position: relative; z-index: 1; }
	.om-login-art p { max-inline-size: 12ch; margin: 0; color: var(--om-color-rail-text); font-family: var(--om-font-heading); font-size: clamp(2.2rem, 4vw, 4.8rem); font-weight: 640; line-height: 0.98; }
	.om-login-art p span { display: block; margin-block-end: var(--om-space-sm); color: var(--om-color-accent); font-family: var(--om-font-ui); font-size: var(--om-size-2xs); font-weight: 780; letter-spacing: 0.13em; text-transform: uppercase; }
	body.login #login { grid-column: 2; inline-size: min(100% - 4rem, 31rem); box-shadow: none; }
}
