/* /post-a-free-job/ — lead-in pitch card, two-step 4-column form grid, CTA block. */

/* Page canvas: tint the wrapper so the pitch card and the form card read as cards. */
body.page-id-767 #wrapper { background: #f4f7f9; }

/* ---- Lead-in / pitch ---- */
.vw-fj-lead {
	background: #fff;
	border: 1px solid #e3e9ee;
	border-left: 4px solid #26ae61;
	border-radius: 8px;
	padding: 26px 30px;
	margin: 0 0 28px;
}
.vw-fj-lead h2 { margin: 0 0 10px; font-size: 26px; font-weight: 500; line-height: 1.3; color: #2a2f35; }
.vw-fj-lead > p { margin: 0 0 16px; max-width: 70ch; color: #555; }
.vw-fj-lead ul.vw-fj-points { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 22px; }
.vw-fj-lead ul.vw-fj-points li { list-style: none; position: relative; margin: 0; padding: 0 0 0 25px; color: #2a2f35; font-weight: 500; }
.vw-fj-lead ul.vw-fj-points li::before {
	content: "";
	position: absolute; left: 0; top: .35em;
	width: 15px; height: 9px;
	border-left: 2px solid #26ae61; border-bottom: 2px solid #26ae61;
	transform: rotate(-45deg);
}
.vw-fj-lead .vw-fj-signin { margin: 16px 0 0; color: #666; }

/* ---- Form card ---- */
.vw-free-job-form {
	background: #fff;
	border: 1px solid #e3e9ee;
	border-radius: 8px;
	padding: 30px 30px 34px;
}

/* ---- Step headings ---- */
.vw-free-job-form .vw-fj-step {
	display: flex; align-items: center; gap: 12px;
	margin: 0 0 20px; padding: 0 0 12px;
	border-bottom: 1px solid #e8edf1;
	font-size: 19px; font-weight: 500; color: #2a2f35;
}
.vw-free-job-form .vw-fj-step span {
	flex: 0 0 auto;
	width: 26px; height: 26px; border-radius: 50%;
	background: #26ae61; color: #fff;
	font-size: 14px; line-height: 26px; text-align: center;
}
.vw-free-job-form .vw-fj-step-acct { grid-area: acct; }
.vw-free-job-form .vw-fj-step-role { grid-area: role; margin-top: 14px; }

.vw-free-job-form .vw-fj-note {
	grid-area: note;
	align-self: start;
	background: #f4f7f9;
	border-radius: 6px;
	padding: 14px 16px;
	margin: 0 0 18px;
	font-size: 14px;
	line-height: 1.5;
	color: #666;
}

/* ---- Grid ---- */
.vw-free-job-form .vw-fj-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	column-gap: 24px;
	align-items: start;
	grid-template-areas:
		"acct    acct    acct    acct"
		"first   last    email   country"
		"pass    verify  note    note"
		"role    role    role    role"
		"title   title   cat     cat"
		"company company skills  skills"
		"desc    desc    salary  salary"
		"desc    desc    type    exp"
		"desc    desc    edu     lang"
		"desc    desc    visa    reloc";
}
.vw-free-job-form .fieldset-vwa_country                    { grid-area: country; }
.vw-free-job-form .fieldset-company_name                   { grid-area: company; }
.vw-free-job-form .fieldset-job_title                      { grid-area: title; }
.vw-free-job-form .fieldset-create_account_email,
.vw-free-job-form .fieldset-application                    { grid-area: email; }
.vw-free-job-form .fieldset-vw_first_name                  { grid-area: first; }
.vw-free-job-form .fieldset-vw_last_name                   { grid-area: last; }
.vw-free-job-form .fieldset-create_account_password        { grid-area: pass; }
.vw-free-job-form .fieldset-create_account_password_verify { grid-area: verify; }
.vw-free-job-form .fieldset-salary_min                     { grid-area: salary; }
.vw-free-job-form .fieldset-job_description                { grid-area: desc; }
.vw-free-job-form .fieldset-job_type                       { grid-area: type; }
.vw-free-job-form .fieldset-vw_experience                  { grid-area: exp; }
.vw-free-job-form .fieldset-job_tags                       { grid-area: skills; }
.vw-free-job-form .fieldset-vw_education                   { grid-area: edu; }
.vw-free-job-form .fieldset-vw_languages                   { grid-area: lang; }
.vw-free-job-form .fieldset-vw_visa_sponsorship            { grid-area: visa; }
.vw-free-job-form .fieldset-vw_relocation_assistance       { grid-area: reloc; }
.vw-free-job-form .fieldset-job_category                   { grid-area: cat; }

.vw-free-job-form fieldset { display: block; margin: 0 0 18px; padding: 0; border: 0; min-width: 0; }
.vw-free-job-form fieldset > label { display: block; margin: 0 0 6px; font-weight: 500; }
.vw-free-job-form .vw-req { color: #d9534f; }
.vw-free-job-form .field { width: 100%; }
.vw-free-job-form .field input[type=text],
.vw-free-job-form .field input[type=email],
.vw-free-job-form .field input[type=password],
.vw-free-job-form .field input[type=number],
.vw-free-job-form .field select,
.vw-free-job-form .field textarea { width: 100%; max-width: none; margin: 0; }
.vw-free-job-form .field small.description { display: block; margin-top: 4px; }

/* The description spans four grid rows — let the editor fill them instead of
   leaving a hole down the left-hand side. */
.vw-free-job-form .fieldset-job_description .wp-editor-container { height: auto; }
.vw-free-job-form .fieldset-job_description iframe,
.vw-free-job-form .fieldset-job_description textarea.wp-editor-area { min-height: 430px !important; }

.vw-free-job-form .vw-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

.vw-free-job-form .fieldset-recaptcha { display: flex; flex-direction: column; align-items: center; margin: 8px 0 0; }
.vw-free-job-form .fieldset-recaptcha > label { text-align: center; }

/* ---- Submit ---- */
.vw-free-job-form .vw-fj-actions {
	display: flex; flex-direction: column; align-items: center; gap: 14px;
	margin: 28px -30px -34px; padding: 28px 24px 30px;
	background: #f7fbf8;
	border-top: 1px solid #e8edf1;
	border-radius: 0 0 8px 8px;
	text-align: center;
}
.vw-free-job-form .vw-fj-upgrade,
.vw-free-job-form .vw-fj-free { font-family: inherit; cursor: pointer; border-radius: 5px; transition: all .25s ease; max-width: 100%; }
.vw-free-job-form .vw-fj-upgrade {
	background: #26ae61; color: #fff; border: 0;
	padding: 15px 40px; line-height: 1.35;
}
.vw-free-job-form .vw-fj-upgrade strong { display: block; font-size: 22px; font-weight: 500; }
.vw-free-job-form .vw-fj-upgrade small { display: block; margin-top: 4px; font-size: 14px; opacity: .88; }
.vw-free-job-form .vw-fj-upgrade:hover { background: #148f4b; box-shadow: 0 4px 14px rgba(38, 174, 97, .35); }
.vw-free-job-form .vw-fj-or { color: #8a9099; font-size: 15px; }
.vw-free-job-form .vw-fj-free { background: #fff; color: #444; border: 1px solid #c7d0d8; font-size: 16px; padding: 12px 26px; }
.vw-free-job-form .vw-fj-free:hover { border-color: #26ae61; color: #117a42; }
.vw-free-job-form .vw-fj-reassure { margin: 4px 0 0; font-size: 14px; color: #7a828b; }

@media (max-width: 900px) {
	.vw-free-job-form .vw-fj-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-areas:
			"acct    acct"
			"first   last"
			"email   country"
			"pass    verify"
			"note    note"
			"role    role"
			"title   title"
			"company company"
			"cat     cat"
			"skills  skills"
			"desc    desc"
			"salary  salary"
			"type    exp"
			"edu     lang"
			"visa    reloc";
	}
	.vw-free-job-form .fieldset-job_description iframe,
	.vw-free-job-form .fieldset-job_description textarea.wp-editor-area { min-height: 300px !important; }
}
@media (max-width: 600px) {
	.vw-fj-lead { padding: 20px; }
	.vw-fj-lead h2 { font-size: 21px; }
	.vw-fj-points { flex-direction: column; gap: 8px; }
	.vw-free-job-form { padding: 22px 20px 26px; }
	.vw-free-job-form .vw-fj-grid { display: block; }
	.vw-free-job-form .vw-fj-actions { margin: 24px -20px -26px; padding: 24px 18px; }
	.vw-free-job-form .vw-fj-upgrade { padding: 13px 22px; }
	.vw-free-job-form .vw-fj-upgrade strong { font-size: 18px; }
}

/* Logged in, the account fields (name/password/country) don't render — the guest
   template areas would leave their tracks empty and strand Company Name at the
   far right (Adam 2026-08-25). Retightened areas for the fields that do render. */
body.logged-in .vw-free-job-form .vw-fj-grid {
	grid-template-areas:
		"role  role   role    role"
		"title title  email   company"
		"cat   cat    skills  skills"
		"desc  desc   salary  salary"
		"desc  desc   type    exp"
		"desc  desc   edu     lang"
		"desc  desc   visa    reloc";
}
body.logged-in .vw-free-job-form .vw-fj-step-role { margin-top: 0; }
@media (max-width: 900px) {
	body.logged-in .vw-free-job-form .vw-fj-grid {
		grid-template-areas:
			"role    role"
			"title   email"
			"company company"
			"cat     cat"
			"skills  skills"
			"desc    desc"
			"salary  salary"
			"type    exp"
			"edu     lang"
			"visa    reloc";
	}
}

/* Validation errors pop over the page as a toast instead of pushing the form down
   (theme gives .job-manager-error margin:10% 20% for logged-out visitors, style.css:37345).
   !important: outranks the theme's .ws-user-logged-out/.submit-page margin rules. */
body .job-manager-error {
	position: fixed;
	top: 96px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 10000;
	margin: 0 !important;
	width: min(680px, calc(100vw - 32px));
	border-radius: 4px;
	box-shadow: 0 6px 24px rgba(0, 0, 0, .18);
	animation: vw-fj-error-hide .4s ease 8s forwards;
}
@keyframes vw-fj-error-hide { to { opacity: 0; visibility: hidden; } }

/* Verify panel (?vwa_verify): the sign-up popup's code step, inline as a centred card. */
.vw-fj-verify { max-width: 460px; margin: 0 auto; }
.vw-fj-verify .job-manager-message { margin-bottom: 24px; }
.vw-fj-verify-form {
	background: #fff;
	border-radius: 8px;
	padding: 32px 36px;
	box-shadow: 0 2px 14px rgba(0, 0, 0, .08);
}