/* WP Job Applicant — front-end styles. */

.wpja-form {
	max-width: 640px;
	margin: 0 auto;
}

.wpja-form__notice {
	padding: 14px 16px;
	background: #f6f7f7;
	border-left: 4px solid #b32d2e;
	border-radius: 4px;
}

.wpja-form__success {
	max-width: 640px;
	margin: 0 auto;
	padding: 20px 22px;
	background: #edf7ed;
	border-left: 4px solid #2e7d32;
	border-radius: 4px;
	font-size: 1.05em;
}

.wpja-form__errors {
	margin-bottom: 20px;
	padding: 14px 16px 14px 34px;
	background: #fdecea;
	border-left: 4px solid #b32d2e;
	border-radius: 4px;
}

.wpja-form__errors ul {
	margin: 0;
	list-style: disc;
}

.wpja-form__errors li {
	margin: 2px 0;
}

.wpja-form__header,
.wpja-form__footer {
	margin-bottom: 20px;
}

.wpja-form__footer {
	margin-top: 24px;
	margin-bottom: 0;
	font-size: 0.9em;
	color: #555;
}

.wpja-form__section {
	margin-bottom: 8px;
}

.wpja-form .wpja-field {
	display: flex;
	flex-direction: column;
	gap: 5px;
	margin-bottom: 20px;
}

/*
 * Neutralise any theme margins on the field's children (labels, <p> captions,
 * inputs) — including logical margins — so the flex `gap` above is the single
 * source of spacing. This is what makes the label→caption gap consistent
 * regardless of the theme.
 */
.wpja-form .wpja-field > * {
	margin: 0 !important;
}

.wpja-form .wpja-field__label {
	display: block;
	font-weight: 600;
	line-height: 1.3;
}

.wpja-field__required {
	color: #b32d2e;
}

.wpja-field input[type="text"],
.wpja-field input[type="email"],
.wpja-field input[type="tel"],
.wpja-field input[type="number"],
.wpja-field input[type="file"],
.wpja-field textarea,
.wpja-field select {
	width: 100%;
	box-sizing: border-box;
	padding: 10px 12px;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: 1rem;
}

.wpja-field textarea {
	min-height: 120px;
	resize: vertical;
}

.wpja-field__choices {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.wpja-choice {
	font-weight: 400;
	display: flex;
	align-items: center;
	gap: 8px;
}

.wpja-choice input {
	width: auto;
	margin: 0;
}

.wpja-form .wpja-field__caption {
	font-size: 0.85em;
	line-height: 1.4;
	color: #666;
}

.wpja-field__hint {
	display: inline-block;
	margin-top: 6px;
	font-size: 0.85em;
	color: #666;
}

/* Honeypot — visually and semantically hidden from real users. */
.wpja-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.wpja-form__submit {
	margin-top: 36px;
	padding-top: 24px;
	border-top: 1px solid #e0e0e0;
}

.wpja-form__button {
	display: inline-block;
	padding: 12px 24px;
	font-size: 1rem;
	font-weight: 600;
	color: #fff;
	background: #2271b1;
	border: 0;
	border-radius: 4px;
	cursor: pointer;
}

.wpja-form__button:hover {
	background: #185a92;
}

/* Job listing */
.wpja-job-listing__group {
	margin-bottom: 40px;
}

.wpja-job-listing .wpja-job-listing__dept {
	margin: 0 0 28px !important;
}

.wpja-job-listing__jobs {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

/*
 * Theme-proof spacing: neutralise any theme margins on the rows and the <hr>
 * (including logical margins) so the flex `gap` above is the only source of
 * vertical spacing between a job and its divider.
 */
.wpja-job-listing__jobs > * {
	margin: 0 !important;
}

.wpja-job-listing__job {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 0;
}

.wpja-job-listing__info {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.wpja-job-listing__link {
	font-weight: 600;
	font-size: 1.05em;
	text-decoration: none;
}

.wpja-job-listing__link:hover {
	text-decoration: underline;
}

.wpja-job-listing__meta {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.wpja-job-listing__meta-item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 0.85em;
	color: #55677d;
}

.wpja-job-listing__icon {
	flex: 0 0 auto;
	color: #8a97a8;
}

/* Divider after each job (the requested <hr>). Spacing comes from the flex gap. */
.wpja-job-listing__divider {
	border: 0;
	border-top: 1px solid #e0e0e0;
	height: 0;
}

/* Don't show a trailing divider after the last job in a group. */
.wpja-job-listing__job:last-of-type + .wpja-job-listing__divider {
	display: none;
}

.wpja-job-listing__button {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 16px;
	font-weight: 600;
	text-decoration: none;
	color: #2271b1;
	border: 1px solid #2271b1;
	border-radius: 4px;
	white-space: nowrap;
	transition: background 0.15s, color 0.15s;
}

.wpja-job-listing__button:hover {
	background: #2271b1;
	color: #fff;
}

.wpja-job-listing__arrow {
	transition: transform 0.15s;
}

.wpja-job-listing__button:hover .wpja-job-listing__arrow {
	transform: translateX(3px);
}

.wpja-job-listing__empty {
	margin: 0;
	color: #777;
	font-style: italic;
}

/* Apply Now button (shortcode + widget) */
.wpja-apply-button {
	display: inline-block;
	padding: 12px 28px;
	font-weight: 600;
	text-decoration: none;
	color: #fff !important; /* Beat theme link colour for legibility on blue. */
	background: #2271b1;
	border-radius: 4px;
}

.wpja-apply-button:hover {
	background: #185a92;
	color: #fff !important;
}

.wpja-apply-button--block {
	display: block;
	text-align: center;
}

/* Share widget */
.wpja-share {
	display: flex;
	gap: 10px;
}

.wpja-share__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	color: #fff !important; /* White icons (SVGs use currentColor). */
	background: #2271b1;
	transition: opacity 0.15s, transform 0.15s;
}

.wpja-share__link:hover {
	opacity: 0.88;
	transform: translateY(-2px);
	color: #fff !important;
}

.wpja-share__link--linkedin {
	background: #0a66c2;
}

.wpja-share__link--facebook {
	background: #1877f2;
}

.wpja-share__link--x {
	background: #000;
}

/* Job meta widget (department + type, inline) */
.wpja-job-meta-widget {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}

/* Single Job sidebar: transparent background (blends with the page). */
.single-wpja_job .sidebar.widget_area,
.single-wpja_job .sidebar.widget_area .widget {
	background: transparent !important;
}

/* Single Team: safety net — no sidebar, full-width content (covers the
   Elementor editor preview in case the theme option doesn't take there). */
.single-cpt_team .sidebar.widget_area {
	display: none !important;
}

.single-cpt_team .content {
	width: 100% !important;
	max-width: 100% !important;
}