/* Trilogy Portal: branded sign-in and request-access screens */
body.login {
	display: flex; flex-wrap: wrap; min-height: 100vh; margin: 0;
	background: #EFECE6; color: #111;
	font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
}
.tlp-brand {
	position: relative; overflow: hidden; flex: 1 1 420px; min-height: 560px;
	display: flex; align-items: center; justify-content: center; padding: 120px 32px;
	background: #DFDBD3; box-sizing: border-box;
}
.tlp-corner { position: absolute; display: block; }
.tlp-c1 { top: 0; right: 0; width: 70%; height: 96px; background: #3AC5EF; clip-path: polygon(0 0, 100% 0, 100% 40%, 76% 100%, 74% 100%); }
.tlp-c2 { top: 0; right: 0; width: 280px; height: 194px; background: #3047D6; clip-path: polygon(0 0, 100% 0, 100% 100%); }
.tlp-c3 { bottom: 0; left: 0; width: 70%; height: 96px; background: #3AC5EF; clip-path: polygon(0 100%, 100% 100%, 26% 0, 24% 0, 0 60%); }
.tlp-c4 { bottom: 0; left: 0; width: 280px; height: 194px; background: #3047D6; clip-path: polygon(0 0, 100% 100%, 0 100%); }
.tlp-lockup { position: relative; display: flex; flex-direction: column; align-items: center; gap: 22px; }
.tlp-word { font-size: 60px; font-weight: 800; font-stretch: 125%; line-height: 1; }
.tlp-place { margin-top: -8px; font-size: 14px; font-weight: 600; letter-spacing: 0.5em; margin-right: -0.5em; color: #3047D6; }
.tlp-rule { display: flex; align-items: center; width: 340px; max-width: 100%; }
.tlp-rule span:first-child { width: 86px; height: 4px; background: #3047D6; }
.tlp-rule span:last-child { flex: 1; height: 1px; background: #111; }
.tlp-body { display: flex; flex-direction: column; width: 340px; max-width: 100%; gap: 2px; font-size: 23px; font-weight: 700; font-stretch: 125%; line-height: 1.05; }
.tlp-body span:last-child { align-self: flex-end; }
.tlp-intro { margin: 18px 0 0; max-width: 340px; text-align: center; font-size: 15px; line-height: 1.6; color: #4D4A45; }

#login {
	flex: 1 1 420px; width: auto; margin: 0; padding: 56px max(24px, calc((100% - 420px) / 2));
	box-sizing: border-box; display: flex; flex-direction: column; justify-content: center;
}
#login h1 { display: none; }
.login form {
	margin: 0; padding: 0; background: transparent; border: 0; box-shadow: none; overflow: visible;
	font-size: 15px;
}
.login .message, .login .notice, .login .success, .login #login_error {
	margin: 0 0 20px; padding: 14px 16px; border: 0; border-left: 0; border-radius: 8px; box-shadow: none;
	background: #FFFFFF; color: #111; font-size: 14px;
}
.login #login_error { background: #FBE9E7; }
.login label, .login legend { font-size: 14px; font-weight: 600; color: #111; }
.login form p, .login fieldset { margin: 0 0 18px; }
.login form .input, .login select, .login input[type="text"], .login input[type="email"], .login input[type="password"] {
	width: 100%; min-height: 48px; margin: 6px 0 0; padding: 0 14px; box-sizing: border-box;
	border: 1px solid #C8C2B6; border-radius: 8px; background: #fff; font: inherit; font-size: 15px; color: #111; box-shadow: none;
}
.login form .input:focus, .login select:focus { border-color: #3047D6; box-shadow: 0 0 0 1px #3047D6; outline: none; }
.login .button.wp-hide-pw { min-height: 48px; color: #3047D6; }
.login fieldset { border: 0; padding: 0; }
.login fieldset.tlp-type { display: flex; gap: 8px; flex-wrap: wrap; }
.login fieldset legend { padding: 0; margin-bottom: 8px; width: 100%; }
.login fieldset.tlp-type label {
	flex: 1 1 120px; display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px;
	border: 1px solid #C8C2B6; border-radius: 8px; background: #fff; font-weight: 400; cursor: pointer;
}
.login fieldset.tlp-type label:has(input:checked) { border-color: #3047D6; box-shadow: inset 0 0 0 1px #3047D6; }

.tlp-hint { display: block; margin-top: 6px; font-size: 13px; color: #4D4A45; }
.tlp-consent label { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; font-size: 13px; line-height: 1.5; color: #4D4A45; }
.tlp-consent input { margin-top: 2px; }
#registerform p:has(#user_login) { display: none; }
.login .forgetmenot { margin-bottom: 18px; }
.login .forgetmenot label { font-weight: 400; }
.login .submit { margin: 0; }
.login .button-primary, .login #wp-submit {
	float: none; width: 100%; min-height: 50px; margin-top: 4px; border: 0; border-radius: 8px;
	background: #3047D6; color: #fff; font-family: inherit; font-size: 16px; font-weight: 600; text-shadow: none; box-shadow: none;
}
.login .button-primary:hover, .login #wp-submit:hover { background: #1F2F9C; }
.login #nav, .login #backtoblog { margin: 20px 0 0; padding: 0; text-align: center; font-size: 14px; }
.login #nav a, .login #backtoblog a, .login a { color: #3047D6; }
.login #backtoblog { display: none; }
.login .privacy-policy-page-link, .login .language-switcher { flex: 1 1 100%; margin: 0; padding: 0 0 32px; text-align: center; }
.login .privacy-policy-page-link a { color: #3047D6; }

@media (max-width: 860px) {
	.tlp-brand { min-height: 0; padding: 48px 20px 40px; }
	.tlp-lockup { gap: 14px; }
	.tlp-c2, .tlp-c4 { width: 120px; height: 84px; }
	.tlp-c1, .tlp-c3 { height: 40px; }
	.tlp-word { font-size: 44px; }
	.tlp-intro { display: none; }
	#login { padding: 32px 20px 24px; }
}

/* Several apartments or offices */
.tlp-units legend { margin-bottom: 8px; }
.tlp-unit-row { display: grid; grid-template-columns: 1.2fr 1.2fr 1fr auto; gap: 8px; align-items: end; padding: 12px; margin-bottom: 8px; border: 1px solid #D6D1C7; border-radius: 8px; background: #fff; }
.tlp-unit-row p { margin: 0 !important; }
.tlp-unit-row label { font-size: 13px; }
.tlp-remove-unit { min-height: 48px; padding: 0 10px; border: 0; background: none; color: #3047D6; font: inherit; font-size: 13px; cursor: pointer; }
.tlp-add-unit { min-height: 44px; padding: 0 14px; border: 1px dashed #3047D6; border-radius: 8px; background: transparent; color: #3047D6; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.tlp-units .tlp-hint { margin-top: 8px; }
@media (max-width: 480px) {
	.tlp-unit-row { grid-template-columns: 1fr 1fr; }
	.tlp-unit-row p:nth-child(3) { grid-column: 1 / 2; }
}

/* Headings for sign-in, forgot password and new password screens */
.tlp-login-head { margin: 0 0 18px; }
.tlp-login-head h2 { margin: 0 0 6px; font-size: 28px; font-weight: 800; font-stretch: 125%; text-transform: uppercase; line-height: 1.1; color: #111; }
.tlp-login-head h2::after { content: ""; display: block; width: 56px; height: 4px; background: #3047D6; margin-top: 10px; }
.tlp-login-head p { margin: 10px 0 0; font-size: 15px; line-height: 1.6; color: #4D4A45; }
.login #lostpasswordform p:first-child label { font-weight: 600; }
.login .pw-weak { display: flex; gap: 8px; align-items: center; }
.login #pass-strength-result { border-radius: 8px; margin-top: 8px; padding: 8px 12px; font-size: 13px; }
.login .wp-generate-pw { min-height: 44px; border-radius: 8px; border: 1px solid #3047D6; color: #3047D6; background: #fff; }
.login .message.reset-pass { background: #fff; }


/* Representative of an owner */
.login fieldset.tlp-type label.tlp-type-rep { flex-basis: 100%; }
.login .tlp-rep { margin: 4px 0 18px; padding: 16px; border-radius: 10px; background: #EFECE6; border-left: 4px solid #3047D6; }
.login .tlp-rep p { margin: 0 0 14px; }
.login .tlp-rep .tlp-rep-intro { font-size: 13px; line-height: 1.5; color: #4D4A45; }
.login .tlp-file { margin: 0 0 14px; }
.login .tlp-file > label { display: block; font-weight: 600; margin-bottom: 4px; }
.login .tlp-file .tlp-hint { display: block; margin: 4px 0 8px; font-size: 13px; line-height: 1.5; color: #4D4A45; }
.login .tlp-file input[type="file"] { position: absolute; width: 1px; height: 1px; opacity: 0; }
.login .tlp-file-drop { display: flex; align-items: center; gap: 12px; padding: 14px; border: 2px dashed #3047D6; border-radius: 10px; background: #fff; cursor: pointer; font-weight: 400; }
.login .tlp-file-drop:hover { background: #F4F6FF; }
.login .tlp-file-drop.has-file { border-style: solid; }
.login .tlp-file-btn { flex: 0 0 auto; padding: 9px 16px; border-radius: 8px; background: #3047D6; color: #fff; font-weight: 700; }
.login .tlp-file-name { flex: 1; min-width: 0; font-size: 14px; color: #4D4A45; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.login .tlp-file input[type="file"]:focus-visible + .tlp-hint, .login .tlp-file-drop:focus-within { outline: 2px solid #3047D6; outline-offset: 2px; }
.login .tlp-rep select { width: 100%; min-height: 48px; border-radius: 8px; border: 1px solid #C8C2B6; padding: 0 12px; background: #fff; font-size: 15px; }
