/*
 * Przepysznie – Świeża kuchnia: ekran logowania (wp-login.php).
 * Zdjęcie po lewej tylko na szerokich ekranach i nie w okienku „sesja wygasła”.
 */

body.login {
	background: #f5faf7;
	color: #14201a;
	font-family: "Outfit", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* Logo jak na stronie: czapka kucharska + „Przepysznie” */
.login h1 a {
	display: inline-block;
	width: auto;
	height: 44px;
	margin: 0 0 28px;
	padding-left: 56px;
	overflow: visible;
	text-indent: 0;
	font: 800 32px/44px "Outfit", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	letter-spacing: -.02em;
	color: #1f7f48;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 38'%3E%3Cpath fill='%23ffc933' d='M13 24c-4.4-.6-8-4.3-8-8.8C5 10.2 9 6.6 13.6 7.1 15 3.6 18.3 1.5 22 1.5s7 2.1 8.4 5.6C35 6.6 39 10.2 39 15.2c0 4.5-3.6 8.2-8 8.8v5.5H13z'/%3E%3Crect x='13' y='30.5' width='18' height='6' rx='2' fill='%23ffc933'/%3E%3Cpath d='M17 24.5v-5M22 24.5v-6M27 24.5v-5' stroke='%23e5a800' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat left center / 44px 38px;
}

.login h1 {
	text-align: left;
}

.login h1 a:focus {
	box-shadow: 0 0 0 2px #23874f;
	border-radius: 8px;
}

/* Powitanie */
.pb-login-intro h2 {
	margin: 0 0 6px;
	font-size: 34px;
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -.01em;
	color: #14201a;
}

.pb-login-intro p {
	margin: 0;
	font-size: 15px;
	color: #5c6b63;
}

/* Formularz bez ramki – pola wprost na tle */
.login form {
	margin-top: 26px;
	padding: 0;
	background: none;
	border: 0;
	box-shadow: none;
	overflow: visible;
}

.login label {
	font-size: 14px;
	font-weight: 600;
	color: #14201a;
}

.login form .input,
.login input[type="text"],
.login input[type="password"] {
	min-height: 52px;
	margin: 6px 0 18px;
	padding: 0 14px;
	border: 1px solid #7f948a;
	border-radius: 10px;
	background: #fff;
	box-shadow: none;
	font-size: 16px;
	color: #14201a;
}

.login form .input:focus,
.login input[type="text"]:focus,
.login input[type="password"]:focus {
	border-color: #23874f;
	box-shadow: 0 0 0 1px #23874f;
}

.login .wp-pwd .input {
	padding-right: 56px;
}

.login .button.wp-hide-pw {
	top: 6px;
	width: 52px;
	height: 52px;
	color: #1f7f48;
}

.login .button.wp-hide-pw:focus {
	border-color: #23874f;
	box-shadow: 0 0 0 1px #23874f;
	border-radius: 10px;
}

.login input[type="checkbox"] {
	border-color: #7f948a;
	border-radius: 5px;
}

.login input[type="checkbox"]:checked {
	background: #23874f;
	border-color: #23874f;
}

.login input[type="checkbox"]:checked::before {
	content: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27%23ffffff%27%2F%3E%3C%2Fsvg%3E");
}

.login input[type="checkbox"]:focus {
	border-color: #23874f;
	box-shadow: 0 0 0 1px #23874f;
}

.login .forgetmenot {
	float: none;
	margin-bottom: 20px;
}

.login .forgetmenot label {
	font-weight: 500;
}

.login .submit {
	clear: both;
}

.wp-core-ui.login .button-primary,
.login .button-primary {
	float: none;
	width: 100%;
	min-height: 52px;
	border: 0;
	border-radius: 10px;
	background: #23874f;
	color: #fff;
	font-size: 16px;
	font-weight: 600;
}

.wp-core-ui.login .button-primary:hover,
.wp-core-ui.login .button-primary:focus,
.login .button-primary:hover,
.login .button-primary:focus {
	background: #1a6d3e;
	color: #fff;
}

.login .button-primary:focus {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px #23874f;
}

/* Linki pod formularzem */
.login #nav,
.login #backtoblog {
	margin: 16px 0 0;
	padding: 0;
	font-size: 14px;
}

.login #nav a,
.login #backtoblog a,
.login .privacy-policy-page-link a {
	color: #1f7f48;
}

.login #nav a:hover,
.login #backtoblog a:hover {
	color: #1a6d3e;
}

.login a:focus {
	color: #1a6d3e;
	box-shadow: 0 0 0 2px #23874f;
}

.login .language-switcher .button {
	color: #1f7f48;
	border-color: #7f948a;
	border-radius: 8px;
}

/* Komunikaty (błędne hasło, wylogowano…) */
.login #login_error,
.login .message,
.login .success,
.login .notice {
	margin: 20px 0 0;
	border: 1px solid #e6ebe8;
	border-left-width: 4px;
	border-radius: 10px;
	box-shadow: none;
}

.login .message,
.login .success {
	border-left-color: #23874f;
}

/* Szeroki ekran: zdjęcie po lewej, formularz po prawej */
@media screen and (min-width: 783px) {
	body.login:not(.interim-login)::before {
		content: "";
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		width: 41%;
		background:
			linear-gradient(180deg, rgba(20, 32, 26, .35) 0%, rgba(20, 32, 26, .05) 30%, rgba(20, 32, 26, .1) 60%, rgba(20, 32, 26, .65) 100%),
			url("logowanie.jpg") center / cover no-repeat;
	}

	body.login:not(.interim-login)::after {
		content: "Dobry przepis\A zaczyna się tutaj.";
		position: fixed;
		left: 48px;
		bottom: 80px;
		width: calc(41% - 96px);
		white-space: pre-line;
		font: 600 clamp(28px, 2.8vw, 40px)/1.2 "Outfit", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
		color: #fff;
		text-shadow: 0 1px 12px rgba(0, 0, 0, .35);
	}

	.login:not(.interim-login) #login {
		position: relative;
		left: 20.5%;
		width: 400px;
		padding-top: 10vh;
	}

	.login:not(.interim-login) .language-switcher,
	.login:not(.interim-login) .privacy-policy-page-link {
		position: relative;
		left: 20.5%;
	}

	/* Logo na zdjęciu, w lewym górnym rogu */
	.login:not(.interim-login) h1 a {
		position: fixed;
		top: 40px;
		left: 48px;
		margin: 0;
		color: #fff;
		text-shadow: 0 1px 8px rgba(0, 0, 0, .3);
	}
}