/**
 * Login / registration page + modal — card layout, fields, actions.
 * Scope: .jobsearch-login-registration-form, .jobsearch-login-box, #JobSearchModalLogin
 */

:root {
	--rework-login-btn-bg: var(--cfy-primary, #0a65fc);
	--rework-login-btn-bg-hover: #0854d4;
	--rework-login-btn-radius: 30px;
	--rework-login-card-bg: #ffffff;
	--rework-login-card-border: #e8ecef;
	--rework-login-input-border: #e2e2e2;
	--rework-login-muted: #5a6b7d;
}

/* ============================================================
   Page layout
   ============================================================ */
.jobsearch-form.jobsearch-login-registration-form {
	margin: 0 auto !important;
	max-width: 960px;
	padding: 0 24px;
	overflow-x: clip;
	box-sizing: border-box;
}

.jobsearch-login-registration-form .jobsearch-row {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 24px;
	margin: 0;
	float: none;
	width: 100%;
}

.jobsearch-login-registration-form .jobsearch-column-6 {
	float: none !important;
	flex: 0 0 calc(50% - 12px);
	min-width: 0;
	max-width: calc(50% - 12px);
	width: auto !important;
	padding: 0 !important;
	margin: 0;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
}

.jobsearch-login-registration-form .jobsearch-column-6 > .jobsearch-login-box {
	flex: 1;
}

@media (min-width: 992px) {
	.jobsearch-login-registration-form .jobsearch-row {
		flex-wrap: nowrap;
	}
}

/* ============================================================
   Cards
   ============================================================ */
.jobsearch-login-box {
	float: none !important;
	width: 100% !important;
	height: 100%;
	margin-bottom: 0 !important;
	padding: 28px !important;
	background-color: var(--rework-login-card-bg) !important;
	border: 1px solid var(--rework-login-card-border);
	border-radius: 16px;
	box-shadow: 0 4px 20px rgba(13, 59, 94, 0.06);
	box-sizing: border-box;
}

.jobsearch-login-box h2 {
	float: none;
	width: 100%;
	margin: 0 0 8px !important;
	font-size: 22px !important;
	font-weight: 600;
	line-height: 1.25;
	color: var(--cfy-dark, #0d3b5e);
	text-transform: none;
}

.jobsearch-login-box > span,
.jobsearch-login-box .enter-userpass-txt,
.jobsearch-login-box .pt-register > span {
	float: none;
	display: block;
	width: 100%;
	margin: 0 0 20px !important;
	font-size: 14px;
	line-height: 1.45;
	color: var(--rework-login-muted);
	font-style: normal;
}

.jobsearch-login-box form,
.jobsearch-login-box form ul,
.jobsearch-login-box .login-form,
.jobsearch-login-box .pt-register form {
	float: none;
	width: 100%;
}

.jobsearch-login-box form ul,
.entry-content .jobsearch-login-box form ul,
#left-area .jobsearch-login-box form ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.jobsearch-login-box form ul li {
	float: none !important;
	width: 100% !important;
	padding: 0 0 14px !important;
	list-style: none;
	text-align: left !important;
}

.jobsearch-login-box form ul li:last-child {
	padding-bottom: 0 !important;
}

/* ============================================================
   Inputs
   ============================================================ */
.jobsearch-login-box form ul li input[type="text"],
.jobsearch-login-box form ul li input[type="password"],
.jobsearch-login-box form ul li input[type="email"],
.jobsearch-login-box form ul li input[type="tel"],
.jobsearch-login-box form ul li input[type="number"],
.jobsearch-login-box form ul li textarea,
.jobsearch-login-box .jobsearch-profile-select select:not(.select2-hidden-accessible):not(.selectized),
#JobSearchModalLogin .jobsearch-user-form input[type="text"],
#JobSearchModalLogin .jobsearch-user-form input[type="password"],
#JobSearchModalLogin .jobsearch-user-form input[type="email"],
#JobSearchModalLogin .jobsearch-user-form input[type="tel"],
.jobsearch-modal .jobsearch-user-form input[type="text"],
.jobsearch-modal .jobsearch-user-form input[type="password"],
.jobsearch-modal .jobsearch-user-form input[type="email"] {
	display: block;
	width: 100% !important;
	height: 44px;
	min-height: 44px;
	margin: 0;
	padding: 0 14px;
	border: 1px solid var(--rework-login-input-border);
	border-radius: 8px;
	background-color: #fff;
	font-size: 15px;
	line-height: 1.2;
	color: var(--cfy-dark, #0d3b5e);
	box-sizing: border-box;
	float: none;
}

.jobsearch-login-box form ul li textarea {
	height: 120px;
	padding-top: 12px;
}

/* Select2 (sector / profile selects) — plugin shim replaces Selectize.
   Do not style the hidden native <select> (select2-hidden-accessible): that
   forced height:44px + absolute and collapsed the wrapper to 0 while Select2
   floated beside it (broken «отрасли» row). */
.jobsearch-login-box .jobsearch-profile-select,
.jobsearch-login-registration-form .jobsearch-profile-select,
.pt-register .jobsearch-profile-select {
	position: relative;
	/* flow-root contains Select2 float without clipping the open dropdown */
	display: flow-root !important;
	float: none !important;
	width: 100% !important;
	max-width: 100%;
	min-height: 44px !important;
	height: auto !important;
	overflow: visible;
}

.jobsearch-login-box .jobsearch-profile-select:after,
.jobsearch-login-box .jobsearch-profile-select::after,
.jobsearch-login-registration-form .jobsearch-profile-select:after,
.jobsearch-login-registration-form .jobsearch-profile-select::after,
.pt-register .jobsearch-profile-select:after,
.pt-register .jobsearch-profile-select::after {
	content: none !important;
	display: none !important;
	width: 0 !important;
	height: 0 !important;
	font-size: 0 !important;
	speak: never;
}

.jobsearch-login-box .jobsearch-profile-select select.select2-hidden-accessible,
.jobsearch-login-registration-form .jobsearch-profile-select select.select2-hidden-accessible,
.pt-register .jobsearch-profile-select select.select2-hidden-accessible {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	min-height: 0 !important;
	padding: 0 !important;
	margin: -1px !important;
	border: 0 !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
}

.jobsearch-login-box .jobsearch-profile-select .select2-container,
.jobsearch-login-registration-form .jobsearch-profile-select .select2-container,
.pt-register .jobsearch-profile-select .select2-container {
	width: 100% !important;
	max-width: 100% !important;
	display: block !important;
	float: none !important;
	height: auto !important;
	min-height: 44px !important;
	margin: 0 !important;
	margin-bottom: 0 !important;
}

/* Plugin rule `.jobsearch-login-box span { margin-bottom: 23px }` hits every Select2 <span> */
.jobsearch-login-box .jobsearch-profile-select span.select2,
.jobsearch-login-box .jobsearch-profile-select .select2-container,
.jobsearch-login-box .jobsearch-profile-select .select2-container .selection,
.jobsearch-login-box .jobsearch-profile-select .select2-selection,
.jobsearch-login-box .jobsearch-profile-select .select2-selection__rendered,
.jobsearch-login-box .jobsearch-profile-select .select2-selection__placeholder,
.jobsearch-login-box .jobsearch-profile-select .select2-selection__arrow,
.jobsearch-login-box .jobsearch-profile-select .select2-selection__arrow b,
.jobsearch-login-box .jobsearch-profile-select .dropdown-wrapper,
.jobsearch-login-box .jobsearch-profile-select .select2 span {
	margin: 0 !important;
	margin-bottom: 0 !important;
}

/* Select2 wraps .selection with float:left — that blew the sector row to ~200px
   and parked the chevron under the field. */
.jobsearch-login-box .jobsearch-profile-select .select2-container .selection,
.jobsearch-login-registration-form .jobsearch-profile-select .select2-container .selection,
.pt-register .jobsearch-profile-select .select2-container .selection {
	display: block !important;
	float: none !important;
	width: 100% !important;
	height: auto !important;
	min-height: 44px !important;
	overflow: visible;
}

.jobsearch-login-box .jobsearch-profile-select .select2-selection--single,
.jobsearch-login-registration-form .jobsearch-profile-select .select2-selection--single,
.pt-register .jobsearch-profile-select .select2-selection--single {
	display: block !important;
	float: none !important;
	position: relative !important;
	height: 44px !important;
	min-height: 44px !important;
	padding: 0 !important;
	margin: 0 !important;
	border: 1px solid var(--rework-login-input-border) !important;
	border-radius: 8px !important;
	background-color: #fff !important;
	box-sizing: border-box !important;
}

.jobsearch-login-box .jobsearch-profile-select .select2-selection--single .select2-selection__rendered,
.jobsearch-login-registration-form .jobsearch-profile-select .select2-selection--single .select2-selection__rendered,
.pt-register .jobsearch-profile-select .select2-selection--single .select2-selection__rendered {
	display: block !important;
	float: none !important;
	height: 42px !important;
	line-height: 42px !important;
	padding-left: 14px !important;
	padding-right: 36px !important;
	margin: 0 !important;
	overflow: hidden !important;
	text-overflow: ellipsis;
	white-space: nowrap !important;
	color: var(--cfy-dark, #0d3b5e);
	font-size: 15px;
	box-sizing: border-box;
}

.jobsearch-login-box .jobsearch-profile-select .select2-selection--single .select2-selection__arrow,
.jobsearch-login-registration-form .jobsearch-profile-select .select2-selection--single .select2-selection__arrow,
.pt-register .jobsearch-profile-select .select2-selection--single .select2-selection__arrow {
	position: absolute !important;
	top: 50% !important;
	right: 10px !important;
	left: auto !important;
	width: 20px !important;
	height: 20px !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
	display: block !important;
	transform: translateY(-50%);
}

.jobsearch-login-box .jobsearch-profile-select .select2-selection--single .select2-selection__arrow b,
.jobsearch-login-registration-form .jobsearch-profile-select .select2-selection--single .select2-selection__arrow b,
.pt-register .jobsearch-profile-select .select2-selection--single .select2-selection__arrow b {
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	width: 0 !important;
	height: 0 !important;
	margin: -2px 0 0 -4px !important;
	padding: 0 !important;
	border-width: 5px 4px 0 4px !important;
	border-style: solid !important;
	border-color: #888 transparent transparent transparent !important;
	display: block !important;
	float: none !important;
}

/* Open dropdown: match form fields (plugin paints search #f2fbff) */
.jobsearch-login-box .select2-dropdown,
.jobsearch-login-registration-form .select2-dropdown,
body > .select2-container .select2-dropdown {
	border: 1px solid var(--rework-login-input-border, #e2e8f0) !important;
	border-radius: 8px !important;
	box-shadow: 0 8px 24px rgba(15, 23, 42, 0.1);
	overflow: hidden;
	margin-top: 4px;
}

.jobsearch-login-box .select2-search--dropdown,
.jobsearch-login-registration-form .select2-search--dropdown,
body > .select2-container .select2-search--dropdown {
	padding: 8px !important;
}

.jobsearch-login-box .select2-search--dropdown .select2-search__field,
.jobsearch-login-registration-form .select2-search--dropdown .select2-search__field,
body > .select2-container .select2-search--dropdown .select2-search__field,
.jobsearch-login-box .select2-container--open .select2-search--dropdown .select2-search__field,
body .select2-container--default.select2-container--open .select2-search--dropdown .select2-search__field {
	height: 40px !important;
	margin: 0 !important;
	padding: 0 12px !important;
	border: 1px solid var(--rework-login-input-border, #e2e8f0) !important;
	border-radius: 8px !important;
	background: #fff !important;
	font-size: 14px !important;
	line-height: 1.2 !important;
	box-sizing: border-box !important;
}

.jobsearch-login-box .select2-results__option,
.jobsearch-login-registration-form .select2-results__option,
body > .select2-container .select2-results__option {
	padding: 10px 14px !important;
	min-height: 0 !important;
	line-height: 1.35 !important;
	font-size: 14px !important;
}

.jobsearch-login-box .select2-results__option--highlighted,
.jobsearch-login-registration-form .select2-results__option--highlighted,
body > .select2-container .select2-results__option--highlighted {
	background: rgba(10, 101, 252, 0.08) !important;
	color: var(--cfy-dark, #0d3b5e) !important;
}

.jobsearch-login-box .jobsearch-regfield-sector,
.jobsearch-login-box .user-employer-spec-field {
	clear: both;
	overflow: visible;
	width: 100%;
}

.jobsearch-login-box form ul li input:focus,
.jobsearch-login-box form ul li textarea:focus,
#JobSearchModalLogin .jobsearch-user-form input:focus {
	border-color: var(--rework-login-btn-bg);
	outline: none;
	box-shadow: 0 0 0 2px rgba(10, 101, 252, 0.12);
}

/* Registration phone — plain BY input (no intl-tel-input) */
.jobsearch-login-box .rework-reg-phone-wrap,
#JobSearchModalLogin .rework-reg-phone-wrap {
	position: relative;
	display: block;
	width: 100%;
}

.jobsearch-login-box .rework-reg-phone-wrap .rework-reg-phone-input,
#JobSearchModalLogin .rework-reg-phone-wrap .rework-reg-phone-input {
	width: 100% !important;
	padding-right: 40px !important;
}

.jobsearch-login-box .rework-reg-phone-status,
#JobSearchModalLogin .rework-reg-phone-status {
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 16px;
	line-height: 1;
	pointer-events: none;
}

.jobsearch-login-box .rework-reg-phone-wrap.rework-reg-phone-valid .rework-reg-phone-status,
#JobSearchModalLogin .rework-reg-phone-wrap.rework-reg-phone-valid .rework-reg-phone-status {
	color: #4caf50;
}

.jobsearch-login-box .rework-reg-phone-wrap.rework-reg-phone-invalid .rework-reg-phone-status,
#JobSearchModalLogin .rework-reg-phone-wrap.rework-reg-phone-invalid .rework-reg-phone-status {
	color: #d32f2f;
}

.jobsearch-login-box .rework-reg-phone-error,
#JobSearchModalLogin .rework-reg-phone-error {
	display: none;
	margin: 6px 0 0;
	font-size: 12px;
	line-height: 1.35;
	color: #d32f2f;
}

.jobsearch-login-box .rework-reg-phone-wrap.rework-reg-phone-invalid .rework-reg-phone-input,
#JobSearchModalLogin .rework-reg-phone-wrap.rework-reg-phone-invalid .rework-reg-phone-input {
	border-color: #d32f2f !important;
	box-shadow: 0 0 0 2px rgba(211, 47, 47, 0.12);
}

.jobsearch-login-box .rework-reg-phone-wrap.rework-reg-phone-valid .rework-reg-phone-input,
#JobSearchModalLogin .rework-reg-phone-wrap.rework-reg-phone-valid .rework-reg-phone-input {
	border-color: #4caf50 !important;
}

/* Password field: label above; eye left of lock; lock at far right (like email icon).
   Grid: [label full] / [input full under icons in cols 2–3]. */
.jobsearch-login-registration-form .jobsearch-login-box form ul li:has(input[name="pt_user_pass"]),
.jobsearch-login-registration-form .jobsearch-login-box form ul li:has(input[name="pt_user_cpass"]),
.jobsearch-login-box form ul li:has(input[name="pt_user_pass"]),
.jobsearch-login-box form ul li:has(input[name="pt_user_cpass"]),
#JobSearchModalLogin .jobsearch-user-form li:has(input[name="pt_user_pass"]),
#JobSearchModalLogin .jobsearch-user-form li:has(input[name="pt_user_cpass"]),
#JobSearchModalLogin .jobsearch-user-form li:has(input[type="password"]),
.jobsearch-modal .jobsearch-user-form li:has(input[name="pt_user_pass"]),
.jobsearch-modal .jobsearch-user-form li:has(input[name="pt_user_cpass"]),
.jobsearch-modal .jobsearch-user-form li:has(input[type="password"]) {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 44px 36px;
	grid-template-rows: auto 44px;
	align-items: center;
	column-gap: 0;
	position: relative;
}

.jobsearch-login-registration-form .jobsearch-login-box form ul li:has(input[name="pt_user_pass"]) > label,
.jobsearch-login-registration-form .jobsearch-login-box form ul li:has(input[name="pt_user_cpass"]) > label,
.jobsearch-login-box form ul li:has(input[name="pt_user_pass"]) > label,
.jobsearch-login-box form ul li:has(input[name="pt_user_cpass"]) > label,
#JobSearchModalLogin .jobsearch-user-form li:has(input[name="pt_user_pass"]) > label,
#JobSearchModalLogin .jobsearch-user-form li:has(input[name="pt_user_cpass"]) > label,
#JobSearchModalLogin .jobsearch-user-form li:has(input[type="password"]) > label,
.jobsearch-modal .jobsearch-user-form li:has(input[name="pt_user_pass"]) > label,
.jobsearch-modal .jobsearch-user-form li:has(input[name="pt_user_cpass"]) > label,
.jobsearch-modal .jobsearch-user-form li:has(input[type="password"]) > label {
	grid-column: 1 / -1;
	grid-row: 1;
	margin: 0 0 6px;
	padding: 0;
}

.jobsearch-login-registration-form .jobsearch-login-box form ul li:has(input[name="pt_user_pass"]) > input[name="pt_user_pass"],
.jobsearch-login-registration-form .jobsearch-login-box form ul li:has(input[name="pt_user_cpass"]) > input[name="pt_user_cpass"],
.jobsearch-login-box form ul li:has(input[name="pt_user_pass"]) > input[name="pt_user_pass"],
.jobsearch-login-box form ul li:has(input[name="pt_user_cpass"]) > input[name="pt_user_cpass"],
#JobSearchModalLogin .jobsearch-user-form li:has(input[name="pt_user_pass"]) > input[name="pt_user_pass"],
#JobSearchModalLogin .jobsearch-user-form li:has(input[name="pt_user_cpass"]) > input[name="pt_user_cpass"],
#JobSearchModalLogin .jobsearch-user-form li:has(input[type="password"]) > input[type="password"],
#JobSearchModalLogin .jobsearch-user-form li:has(input[name="pt_user_pass"]) > input[type="text"],
.jobsearch-modal .jobsearch-user-form li:has(input[name="pt_user_pass"]) > input[name="pt_user_pass"],
.jobsearch-modal .jobsearch-user-form li:has(input[name="pt_user_cpass"]) > input[name="pt_user_cpass"],
.jobsearch-modal .jobsearch-user-form li:has(input[type="password"]) > input[type="password"] {
	grid-column: 1 / -1;
	grid-row: 2;
	width: 100% !important;
	height: 44px;
	padding-right: 84px !important;
}

/* Lock (decorative / strength cue) — far right, same slot as email user icon */
.jobsearch-login-registration-form .jobsearch-login-box form ul li:has(input[name="pt_user_pass"]) > i.jobsearch-icon,
.jobsearch-login-registration-form .jobsearch-login-box form ul li:has(input[name="pt_user_cpass"]) > i.jobsearch-icon,
.jobsearch-login-box form ul li:has(input[name="pt_user_pass"]) > i.jobsearch-icon,
.jobsearch-login-box form ul li:has(input[name="pt_user_cpass"]) > i.jobsearch-icon,
#JobSearchModalLogin .jobsearch-user-form li:has(input[name="pt_user_pass"]) > i.jobsearch-icon,
#JobSearchModalLogin .jobsearch-user-form li:has(input[name="pt_user_cpass"]) > i.jobsearch-icon,
#JobSearchModalLogin .jobsearch-user-form li:has(input[type="password"]) > i.jobsearch-icon,
.jobsearch-modal .jobsearch-user-form li:has(input[name="pt_user_pass"]) > i.jobsearch-icon,
.jobsearch-modal .jobsearch-user-form li:has(input[name="pt_user_cpass"]) > i.jobsearch-icon,
.jobsearch-modal .jobsearch-user-form li:has(input[type="password"]) > i.jobsearch-icon {
	grid-column: 3;
	grid-row: 2;
	position: relative !important;
	inset: auto !important;
	top: auto !important;
	right: auto !important;
	bottom: auto !important;
	left: auto !important;
	z-index: 2;
	justify-self: center;
	align-self: center;
	width: 22px;
	height: 22px;
	margin: 0;
	line-height: 22px;
	font-size: 18px;
	text-align: center;
	color: var(--rework-login-btn-bg, #0a65fc);
	pointer-events: none;
}

/* Eye — left of the lock */
.jobsearch-login-registration-form .jobsearch-login-box form ul li:has(input[name="pt_user_pass"]) > a.jobsearch-user-showpass,
.jobsearch-login-registration-form .jobsearch-login-box form ul li:has(input[name="pt_user_cpass"]) > a.jobsearch-user-showpass,
.jobsearch-login-box form ul li:has(input[name="pt_user_pass"]) > a.jobsearch-user-showpass,
.jobsearch-login-box form ul li:has(input[name="pt_user_cpass"]) > a.jobsearch-user-showpass,
#JobSearchModalLogin .jobsearch-user-form li:has(input[name="pt_user_pass"]) > a.jobsearch-user-showpass,
#JobSearchModalLogin .jobsearch-user-form li:has(input[name="pt_user_cpass"]) > a.jobsearch-user-showpass,
#JobSearchModalLogin .jobsearch-user-form li:has(input[type="password"]) > a.jobsearch-user-showpass,
.jobsearch-modal .jobsearch-user-form li:has(input[name="pt_user_pass"]) > a.jobsearch-user-showpass,
.jobsearch-modal .jobsearch-user-form li:has(input[name="pt_user_cpass"]) > a.jobsearch-user-showpass,
.jobsearch-modal .jobsearch-user-form li:has(input[type="password"]) > a.jobsearch-user-showpass {
	grid-column: 2;
	grid-row: 2;
	position: relative !important;
	justify-self: center;
	align-self: center;
	z-index: 3;
	inset: auto !important;
	right: auto !important;
	top: auto !important;
	bottom: auto !important;
	left: auto !important;
	transform: none !important;
	float: none;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	line-height: 1;
	font-style: normal;
	text-decoration: none;
	box-sizing: border-box;
	cursor: pointer;
}

/* Disable plugin slash overlay on the anchor — it breaks grid positioning */
.jobsearch-login-registration-form .jobsearch-login-box a.jobsearch-user-showpass.jobsearch-user-hidepass::before,
#JobSearchModalLogin a.jobsearch-user-showpass.jobsearch-user-hidepass::before,
.jobsearch-modal a.jobsearch-user-showpass.jobsearch-user-hidepass::before {
	content: none !important;
	display: none !important;
}

.jobsearch-login-registration-form .jobsearch-login-box a.jobsearch-user-showpass.jobsearch-user-hidepass i,
#JobSearchModalLogin a.jobsearch-user-showpass.jobsearch-user-hidepass i,
.jobsearch-modal a.jobsearch-user-showpass.jobsearch-user-hidepass i {
	opacity: 0.45;
}

.jobsearch-login-registration-form .jobsearch-login-box form ul li:has(input[name="pt_user_pass"]) > a.jobsearch-user-showpass i,
.jobsearch-login-box a.jobsearch-user-showpass i,
#JobSearchModalLogin a.jobsearch-user-showpass i,
.jobsearch-modal a.jobsearch-user-showpass i {
	position: static !important;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	color: #5a6b7d;
	font-size: 24px !important;
	line-height: 1;
}

.jobsearch-login-box a.jobsearch-user-showpass i.jobsearch-icon::before,
#JobSearchModalLogin a.jobsearch-user-showpass i.jobsearch-icon::before,
.jobsearch-modal a.jobsearch-user-showpass i.jobsearch-icon::before {
	font-size: 24px !important;
	line-height: 1;
}

.jobsearch-login-registration-form .jobsearch-login-box form ul li:has(input[name="pt_user_pass"]) > a.jobsearch-user-showpass:hover i,
.jobsearch-login-box a.jobsearch-user-showpass:hover i,
#JobSearchModalLogin a.jobsearch-user-showpass:hover i {
	color: var(--rework-login-btn-bg);
}

/* Registration password: strength badge below field */
.jobsearch-login-registration-form .jobsearch-login-box form ul li:has(input[name="pt_user_pass"].jobsearch_chk_passfield) {
	grid-template-rows: auto 44px auto;
}

.jobsearch-login-registration-form .jobsearch-login-box form ul li .passlenth-chk-msg,
.page .jobsearch-login-registration-form .jobsearch-login-box span.passlenth-chk-msg {
	grid-column: 1 / -1;
	grid-row: 3;
	position: static !important;
	top: auto !important;
	right: auto !important;
	display: none;
	width: auto !important;
	max-width: 100%;
	margin: 8px 0 0 !important;
	padding: 5px 12px !important;
	border-radius: 20px !important;
	font-size: 12px !important;
	line-height: 1.3 !important;
	font-weight: 600;
	align-self: flex-start;
	box-sizing: border-box;
}

.jobsearch-login-registration-form .jobsearch-login-box form ul li .passlenth-chk-msg[style*="inline"],
.jobsearch-login-registration-form .jobsearch-login-box form ul li .passlenth-chk-msg:not(:empty) {
	display: inline-flex !important;
	align-items: center;
}

/* ============================================================
   Role selector (Candidate / Employer)
   ============================================================ */
.jobsearch-login-box .jobsearch-roles-container {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 4px !important;
	float: none;
	width: 100%;
}

.jobsearch-login-box .jobsearch-roles-container .jobsearch-radio-checkbox {
	float: none;
	width: auto;
	flex: 1 1 calc(50% - 4px);
	min-width: 0;
	padding: 0;
	margin: 0;
	line-height: 1.2;
}

.jobsearch-login-box .jobsearch-radio-checkbox input[type="radio"] {
	display: none;
}

.jobsearch-login-box .jobsearch-radio-checkbox label {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 44px;
	margin: 0;
	padding: 8px 12px;
	border: 1px solid var(--rework-login-input-border);
	border-radius: var(--rework-login-btn-radius);
	background-color: #fff;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.2 !important;
	color: var(--cfy-dark, #0d3b5e);
	text-align: center;
	cursor: pointer;
	box-sizing: border-box;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.jobsearch-login-box .jobsearch-radio-checkbox label i {
	display: none;
}

.jobsearch-login-box .jobsearch-radio-checkbox input[type="radio"]:checked + label,
.jobsearch-login-box .jobsearch-radio-checkbox input[type="radio"]:hover + label {
	background-color: var(--rework-login-btn-bg);
	border-color: var(--rework-login-btn-bg);
	color: #fff !important;
}

/* ============================================================
   Buttons — shared primary / secondary
   ============================================================ */
.jobsearch-login-box .jobsearch-login-submit-btn,
.jobsearch-login-box .jobsearch-register-submit-btn,
.jobsearch-login-box .jobsearch-reset-password-submit-btn,
.jobsearch-login-box .login-by-code-box .jobsearch-send-login-code-btn,
.jobsearch-login-box .login-by-code-box .jobsearch-login-by-code-submit,
#JobSearchModalLogin .jobsearch-login-submit-btn,
#JobSearchModalLogin .jobsearch-user-form input[type="submit"],
#JobSearchModalLogin .login-by-code-box .jobsearch-send-login-code-btn,
#JobSearchModalLogin .login-by-code-box .jobsearch-login-by-code-submit,
.jobsearch-modal .jobsearch-user-form input[type="submit"] {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: auto;
	min-width: 0;
	max-width: 100%;
	height: auto;
	min-height: 44px;
	margin: 0;
	padding: 12px 32px;
	border-radius: var(--rework-login-btn-radius) !important;
	border: 1px solid transparent;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2;
	text-transform: none;
	text-align: center;
	color: #fff !important;
	background-color: var(--rework-login-btn-bg) !important;
	cursor: pointer;
	box-sizing: border-box;
	float: none;
	box-shadow: 0 6px 18px rgba(10, 101, 252, 0.22);
	transition: background-color 0.25s ease, box-shadow 0.25s ease, color 0.25s ease, border-color 0.25s ease;
	-webkit-appearance: none;
	appearance: none;
}

.jobsearch-login-box .login-by-code-trigger-btn,
#JobSearchModalLogin .login-by-code-trigger-btn,
.jobsearch-modal .login-by-code-trigger-btn {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: auto;
	min-width: 0;
	max-width: 100%;
	height: auto;
	min-height: 44px;
	margin: 0;
	padding: 11px 32px;
	border-radius: var(--rework-login-btn-radius) !important;
	border: 1px solid var(--rework-login-btn-bg);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2;
	text-transform: none;
	text-align: center;
	color: var(--rework-login-btn-bg) !important;
	background-color: transparent !important;
	cursor: pointer;
	box-sizing: border-box;
	float: none;
	box-shadow: none;
	transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
	-webkit-appearance: none;
	appearance: none;
}

.jobsearch-login-box .jobsearch-login-submit-btn:hover,
.jobsearch-login-box .jobsearch-register-submit-btn:hover,
.jobsearch-login-box .jobsearch-reset-password-submit-btn:hover,
.jobsearch-login-box .login-by-code-box .jobsearch-send-login-code-btn:hover,
.jobsearch-login-box .login-by-code-box .jobsearch-login-by-code-submit:hover,
#JobSearchModalLogin .jobsearch-login-submit-btn:hover,
#JobSearchModalLogin .jobsearch-user-form input[type="submit"]:hover,
#JobSearchModalLogin .login-by-code-box .jobsearch-send-login-code-btn:hover,
#JobSearchModalLogin .login-by-code-box .jobsearch-login-by-code-submit:hover {
	background-color: var(--rework-login-btn-bg-hover) !important;
	color: #fff !important;
}

.jobsearch-login-box .login-by-code-trigger-btn:hover,
.jobsearch-login-box .login-by-code-trigger-btn:focus,
#JobSearchModalLogin .login-by-code-trigger-btn:hover,
#JobSearchModalLogin .login-by-code-trigger-btn:focus,
.jobsearch-modal .login-by-code-trigger-btn:hover,
.jobsearch-modal .login-by-code-trigger-btn:focus {
	background-color: rgba(10, 101, 252, 0.08) !important;
	color: var(--rework-login-btn-bg-hover) !important;
	border-color: var(--rework-login-btn-bg-hover);
}

.jobsearch-login-box .jobsearch-login-submit-btn.btn,
.jobsearch-login-box .jobsearch-register-submit-btn.btn,
.jobsearch-login-box .login-by-code-trigger-btn.btn,
#JobSearchModalLogin .login-by-code-trigger-btn.btn {
	padding: 12px 32px !important;
	font-size: 16px !important;
	line-height: 1.2 !important;
}

.jobsearch-login-box .jobsearch-disable-btn {
	opacity: 0.45;
	cursor: not-allowed !important;
}

/* Override wp-jobsearch patch.css + bootstrap .btn */
.jobsearch-login-registration-form .jobsearch-login-box form .jobsearch-login-submit-btn,
.jobsearch-login-registration-form .jobsearch-login-box form .jobsearch-register-submit-btn,
.jobsearch-login-registration-form .jobsearch-login-box form .jobsearch-login-submit-btn.btn,
.jobsearch-login-registration-form .jobsearch-login-box form .jobsearch-register-submit-btn.btn {
	border-radius: var(--rework-login-btn-radius) !important;
}

/* Login actions: «Войти» + «Войти по коду» + links/remember — one flex grid. */
.jobsearch-login-registration-form .jobsearch-login-box .login-form form ul > li:nth-child(3),
.jobsearch-login-box .regsend-submit-btncon,
#JobSearchModalLogin .jobsearch-user-form ul > li.jobsearch-user-form-coltwo-full:last-child {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	gap: 12px 14px;
	position: relative;
}

.jobsearch-login-registration-form .jobsearch-login-box .login-form form ul > li:nth-child(3) .jobsearch-login-submit-btn,
#JobSearchModalLogin .jobsearch-user-form .jobsearch-login-submit-btn {
	order: 1;
	flex: 0 1 auto;
}

.jobsearch-login-registration-form .jobsearch-login-box .login-form form ul > li:nth-child(3) .login-by-code-trigger-wrap,
.jobsearch-login-box .login-form li .login-by-code-trigger-wrap,
.jobsearch-login-box .jobsearch-user-form li .login-by-code-trigger-wrap,
#JobSearchModalLogin .login-by-code-trigger-wrap,
.jobsearch-modal .login-by-code-trigger-wrap {
	order: 2;
	display: inline-flex !important;
	align-items: center;
	float: none !important;
	margin: 0;
	width: auto;
	max-width: 100%;
	flex: 0 1 auto;
}

.jobsearch-login-registration-form .jobsearch-login-box .login-form form ul > li:nth-child(3) .form-loader,
#JobSearchModalLogin .jobsearch-user-form .form-loader {
	order: 3;
	align-self: center;
	margin: 0;
}

.jobsearch-login-registration-form .jobsearch-login-box .login-form form ul > li:nth-child(3) input[type="hidden"],
#JobSearchModalLogin .jobsearch-user-form ul > li.jobsearch-user-form-coltwo-full input[type="hidden"] {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
	overflow: hidden;
}

/* Modal footer: links + remember on their own full-width row under buttons. */
#JobSearchModalLogin .jobsearch-user-form-info {
	order: 10;
	flex: 1 0 100%;
	float: none !important;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 16px;
	width: 100%;
	margin: 4px 0 0;
	padding: 0;
	text-align: left;
}

#JobSearchModalLogin .jobsearch-user-form-info p {
	float: none !important;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 8px;
	margin: 0;
	padding: 0;
	font-size: 13px;
	line-height: 1.4;
	color: var(--rework-login-muted, #666);
}

#JobSearchModalLogin .jobsearch-user-form-info p a,
#JobSearchModalLogin .jobsearch-user-form-info a.lost-password,
#JobSearchModalLogin .jobsearch-user-form-info a.register-form {
	float: none !important;
	display: inline;
	margin: 0 !important;
	font-size: 13px;
	font-style: normal;
	font-weight: 500;
	color: var(--rework-login-btn-bg);
	text-decoration: none;
}

#JobSearchModalLogin .jobsearch-user-form-info p a:hover,
#JobSearchModalLogin .jobsearch-user-form-info a.lost-password:hover,
#JobSearchModalLogin .jobsearch-user-form-info a.register-form:hover {
	text-decoration: underline;
	color: var(--rework-login-btn-bg-hover);
}

#JobSearchModalLogin .jobsearch-user-form-info .jobsearch-checkbox {
	float: none !important;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 0;
}

#JobSearchModalLogin .jobsearch-user-form-info .jobsearch-checkbox input[type="checkbox"] {
	float: none !important;
	width: 18px;
	height: 18px;
	margin: 0;
	cursor: pointer;
	accent-color: var(--rework-login-btn-bg, #0a65fc);
}

#JobSearchModalLogin .jobsearch-user-form-info .jobsearch-checkbox label {
	float: none !important;
	margin: 0;
	padding: 0;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--rework-login-muted, #666);
	cursor: pointer;
}

.jobsearch-login-registration-form .jobsearch-login-box .login-form form ul > li:nth-child(3) a.lost-password,
.jobsearch-login-box form a.lost-password,
.jobsearch-login-box form a.login-form-btn {
	order: 4;
	flex: 1 0 100%;
	float: none !important;
	display: inline-block;
	margin: 2px 0 0 !important;
	font-size: 13px;
	font-style: normal;
	font-weight: 500;
	color: var(--rework-login-btn-bg);
	text-decoration: none;
}

.jobsearch-login-box form a.lost-password:hover,
.jobsearch-login-box form a.login-form-btn:hover {
	text-decoration: underline;
	color: var(--rework-login-btn-bg-hover);
}

.jobsearch-login-box .regsend-submit-btncon {
	display: flex !important;
	flex-direction: column;
	flex-wrap: wrap;
}

.jobsearch-login-box .regsend-submit-btncon .jobsearch-register-submit-btn {
	order: 2;
	margin-top: 4px;
}

.jobsearch-login-box .regsend-submit-btncon .terms-priv-chek-con {
	order: 1;
	width: 100%;
}

.jobsearch-login-box .form-loader {
	display: inline-block;
	margin: 8px 0 0;
	font-size: 18px;
	vertical-align: middle;
}

/* ============================================================
   Terms checkbox
   ============================================================ */
.jobsearch-login-box .terms-priv-chek-con {
	display: flex;
	width: 100%;
	margin: 0 0 12px;
	float: none;
}

.jobsearch-login-box .terms-priv-chek-con p {
	display: grid;
	grid-template-columns: 32px minmax(0, 1fr);
	column-gap: 12px;
	align-items: start;
	width: 100%;
	margin: 0;
	font-size: 13px;
	line-height: 1.45;
	color: var(--rework-login-muted);
}

.jobsearch-login-box .terms-priv-chek-con p input[type="checkbox"] {
	grid-column: 1;
	grid-row: 1;
	justify-self: start;
	align-self: start;
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	margin: 1px 0 0;
	padding: 0;
	appearance: none;
	-webkit-appearance: none;
	border: 2px solid var(--rework-login-input-border);
	border-radius: 50%;
	background-color: #fff;
	cursor: pointer;
	position: relative;
	box-sizing: border-box;
}

.jobsearch-login-box .terms-priv-chek-con p input[type="checkbox"]:checked {
	background-color: var(--rework-login-btn-bg);
	border-color: var(--rework-login-btn-bg);
}

.jobsearch-login-box .terms-priv-chek-con p input[type="checkbox"]:checked::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 8px;
	height: 5px;
	border-left: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: translate(-50%, -60%) rotate(-45deg);
}

.jobsearch-login-box .terms-priv-chek-con p input[type="checkbox"]:focus-visible {
	outline: none;
	box-shadow: 0 0 0 2px rgba(10, 101, 252, 0.25);
}

.jobsearch-login-box .terms-priv-chek-con p .terms-priv-check-inner {
	grid-column: 2;
	grid-row: 1;
	min-width: 0;
}

.jobsearch-login-box .terms-priv-chek-con p a {
	float: none;
	margin: 0;
	font-style: normal;
	font-weight: 500;
	color: var(--rework-login-btn-bg);
	text-decoration: underline;
}

/* ============================================================
   Errors / alerts
   ============================================================ */
.jobsearch-login-box .login-reg-errors,
.jobsearch-login-box .registration-errors,
.jobsearch-login-box .reset-password-errors,
#JobSearchModalLogin .login-reg-errors {
	float: none;
	width: 100%;
	margin-top: 16px;
}

.jobsearch-login-box .login-reg-errors .alert,
.jobsearch-login-box .registration-errors .alert,
.jobsearch-login-box .reset-password-errors .alert {
	border-radius: 8px;
	font-size: 14px;
	line-height: 1.4;
}

/* ============================================================
   Modal (#JobSearchModalLogin)
   ============================================================ */
#JobSearchModalLogin .modal-box-area {
	max-width: 600px;
	padding: 28px 32px 24px;
	box-sizing: border-box;
}

#JobSearchModalLogin .jobsearch-modal-title-box {
	margin: 0 0 18px;
	padding: 0 28px 0 0;
}

#JobSearchModalLogin .jobsearch-modal-title-box h2 {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.3;
	color: #2d3a4a;
}

#JobSearchModalLogin .jobsearch-user-form ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#JobSearchModalLogin .jobsearch-user-form ul li {
	text-align: left !important;
	margin: 0 0 14px;
	float: none !important;
	width: 100%;
}

#JobSearchModalLogin .jobsearch-user-form ul li:last-child {
	margin-bottom: 0;
}

#JobSearchModalLogin .jobsearch-user-form ul li label {
	display: block;
	margin: 0 0 6px;
	font-size: 13px;
	font-weight: 500;
	color: var(--rework-login-muted, #5a6b7d);
}

#JobSearchModalLogin .jobsearch-user-form ul li input[type="text"],
#JobSearchModalLogin .jobsearch-user-form ul li input[type="password"],
#JobSearchModalLogin .jobsearch-user-form ul li input[type="email"] {
	margin-bottom: 0;
}

#JobSearchModalLogin .terms-priv-chek-con {
	margin-bottom: 12px;
}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width: 991px) {
	.jobsearch-form.jobsearch-login-registration-form {
		max-width: 100%;
		padding: 12px 16px 24px;
	}

	.jobsearch-plugin-default-container {
		padding-top: 0;
	}

	.jobsearch-login-registration-form .jobsearch-row {
		gap: 16px;
	}

	.jobsearch-login-registration-form .jobsearch-column-6 {
		flex: 0 0 100%;
		max-width: 100%;
		min-width: 0;
	}

	.jobsearch-login-box {
		padding: 24px 20px !important;
		margin-bottom: 0 !important;
	}
}

/* Stack primary login actions before they collide (~390–640px). */
@media (max-width: 767px) {
	.jobsearch-login-registration-form .jobsearch-login-box .login-form form ul > li:nth-child(3),
	#JobSearchModalLogin .jobsearch-user-form ul > li.jobsearch-user-form-coltwo-full:last-child {
		flex-direction: column;
		align-items: stretch;
		gap: 14px;
	}

	#JobSearchModalLogin .jobsearch-user-form-info {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}

	.jobsearch-login-box .jobsearch-login-submit-btn,
	.jobsearch-login-box .jobsearch-register-submit-btn {
		box-shadow: 0 4px 12px rgba(10, 101, 252, 0.18);
	}

	.jobsearch-login-registration-form .jobsearch-login-box .login-form form ul > li:nth-child(3) .jobsearch-login-submit-btn,
	.jobsearch-login-registration-form .jobsearch-login-box .login-form form ul > li:nth-child(3) .login-by-code-trigger-wrap,
	.jobsearch-login-registration-form .jobsearch-login-box .login-form form ul > li:nth-child(3) .login-by-code-trigger-btn,
	.jobsearch-login-box .login-form li .login-by-code-trigger-wrap,
	#JobSearchModalLogin .login-by-code-trigger-wrap,
	#JobSearchModalLogin .login-by-code-trigger-btn,
	#JobSearchModalLogin .jobsearch-user-form .jobsearch-login-submit-btn {
		width: 100% !important;
		max-width: 100% !important;
		flex: 0 0 auto;
		float: none !important;
	}

	.jobsearch-login-box .jobsearch-login-submit-btn,
	.jobsearch-login-box .jobsearch-register-submit-btn,
	.jobsearch-login-box .login-by-code-trigger-btn,
	.jobsearch-login-box .login-by-code-box .jobsearch-send-login-code-btn,
	.jobsearch-login-box .login-by-code-box .jobsearch-login-by-code-submit,
	#JobSearchModalLogin .jobsearch-login-submit-btn,
	#JobSearchModalLogin .login-by-code-trigger-btn,
	#JobSearchModalLogin .jobsearch-user-form input[type="submit"] {
		display: flex !important;
		width: 100% !important;
		justify-content: center;
	}

	.jobsearch-login-registration-form .jobsearch-login-box .login-form form ul > li:nth-child(3) a.lost-password {
		text-align: center;
	}
}

/* ============================================================
   UNP custom field — match floating-placeholder fields (no external label)
   ============================================================ */
.jobsearch-login-box li.employer-cus-field,
.jobsearch-login-registration-form li.employer-cus-field,
.pt-register li.employer-cus-field {
	position: relative;
	float: none !important;
	width: 100% !important;
	clear: both;
}

.jobsearch-login-box li.employer-cus-field > label,
.jobsearch-login-registration-form li.employer-cus-field > label,
.pt-register li.employer-cus-field > label {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	border: 0 !important;
	white-space: nowrap !important;
}

.jobsearch-login-box li.employer-cus-field input[type="number"],
.jobsearch-login-box li.employer-cus-field input[type="text"],
.jobsearch-login-registration-form li.employer-cus-field input[type="number"],
.jobsearch-login-registration-form li.employer-cus-field input[type="text"],
.pt-register li.employer-cus-field input[type="number"],
.pt-register li.employer-cus-field input[type="text"] {
	display: block;
	width: 100% !important;
	height: 44px;
	min-height: 44px;
	margin: 0;
	padding: 0 14px;
	border: 1px solid var(--rework-login-input-border, #e2e8f0);
	border-radius: 8px;
	background-color: #fff;
	font-size: 15px;
	line-height: 1.2;
	color: var(--cfy-dark, #0d3b5e);
	box-sizing: border-box;
	float: none;
	-moz-appearance: textfield;
}

.jobsearch-login-box li.employer-cus-field input[type="number"]::-webkit-outer-spin-button,
.jobsearch-login-box li.employer-cus-field input[type="number"]::-webkit-inner-spin-button,
.jobsearch-login-registration-form li.employer-cus-field input[type="number"]::-webkit-outer-spin-button,
.jobsearch-login-registration-form li.employer-cus-field input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.jobsearch-login-box li.employer-cus-field input:focus,
.jobsearch-login-registration-form li.employer-cus-field input:focus {
	border-color: var(--rework-login-btn-bg, #0a65fc);
	outline: none;
	box-shadow: 0 0 0 2px rgba(10, 101, 252, 0.12);
}