/* Trailview Job Postings. Colours and sizes follow the Trailview Website Design Guide.
   Link selectors use two classes so the inner-page rule
   `.elementor-widget-theme-post-content a` (link blue, underlined) doesn't override them. */

.tvjp {
	--tvjp-gold: #F5B746;
	--tvjp-maroon: #660011;
	--tvjp-maroon-deep: #3D0009;
	--tvjp-warm-grey: #A6A09E;
	--tvjp-linen: #F0EFEC;
	--tvjp-ink: #2B2523;
	--tvjp-ink-muted: #6B6563;
	--tvjp-focus: #1F5FCC;
	--tvjp-card-bg: #FFFFFF;
	--tvjp-radius: 16px;
	font-family: Montserrat, sans-serif;
	color: var(--tvjp-ink);
}

.tvjp .tvjp__list.tvjp__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 24px;
}

.tvjp .tvjp-card {
	margin: 0;
	padding: 0;
	background: var(--tvjp-card-bg);
	border-radius: var(--tvjp-radius);
	border-top: 4px solid var(--tvjp-gold);
	box-shadow: 0 1px 3px rgba(43, 37, 35, 0.08), 0 8px 24px rgba(43, 37, 35, 0.08);
}
.tvjp .tvjp-card:nth-child(3n+2) { border-top-color: var(--tvjp-maroon); }
.tvjp .tvjp-card:nth-child(3n+3) { border-top-color: var(--tvjp-warm-grey); }

.tvjp .tvjp-card__inner {
	padding: 24px;
}

.tvjp .tvjp-card__type {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 12px;
	line-height: 1;
}

/* Paid / Volunteer label (the employment type label stays warm grey). */
.tvjp .tvjp-tag.tvjp-tag--paid {
	background: var(--tvjp-maroon);
	color: #FFFFFF;
}
.tvjp .tvjp-tag.tvjp-tag--volunteer {
	background: var(--tvjp-gold);
	color: var(--tvjp-ink);
}

.tvjp .tvjp-tag {
	display: inline-block;
	padding: 6px 12px;
	border-radius: 999px;
	background: var(--tvjp-warm-grey);
	color: var(--tvjp-ink);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1.2;
}

.tvjp .tvjp-card__title {
	margin: 0 0 8px;
	font-family: Montserrat, sans-serif;
	font-size: 26px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--tvjp-ink);
}

.tvjp .tvjp-card__dates {
	margin: 0 0 16px;
	font-size: 16px;
	font-weight: 600;
	color: var(--tvjp-maroon);
}

.tvjp .tvjp-card__desc {
	font-size: 18px;
	line-height: 1.6;
	color: var(--tvjp-ink);
}
.tvjp .tvjp-card__desc p { margin: 0 0 16px; }
.tvjp .tvjp-card__desc p:last-child { margin-bottom: 0; }

.tvjp .tvjp-card__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 24px;
}

/* Buttons (primary maroon, outline maroon), as on the rest of the site. */
.tvjp a.tvjp-btn,
.tvjp a.tvjp-btn:visited {
	display: inline-block;
	vertical-align: middle;
	min-height: 48px;
	box-sizing: border-box;
	padding: 12px 24px;
	border-radius: 8px;
	border: 2px solid var(--tvjp-maroon);
	font-family: Montserrat, sans-serif;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.25;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.tvjp a.tvjp-btn--primary,
.tvjp a.tvjp-btn--primary:visited {
	background: var(--tvjp-maroon);
	color: #FFFFFF;
}
.tvjp a.tvjp-btn--primary:hover,
.tvjp a.tvjp-btn--primary:focus {
	background: var(--tvjp-maroon-deep);
	border-color: var(--tvjp-maroon-deep);
	color: #FFFFFF;
	text-decoration: none;
}

.tvjp a.tvjp-btn--outline,
.tvjp a.tvjp-btn--outline:visited {
	background: transparent;
	color: var(--tvjp-maroon);
}
.tvjp a.tvjp-btn--outline:hover,
.tvjp a.tvjp-btn--outline:focus {
	background: var(--tvjp-maroon);
	color: #FFFFFF;
	text-decoration: none;
}

/* An email link waiting for its address (or with JavaScript off) reads as plain text. */
.tvjp a.tvjp-btn.tvjp-email:not([href]) {
	cursor: default;
}
.tvjp a.tvjp-btn.tvjp-email:not([href]):hover {
	background: transparent;
	color: var(--tvjp-maroon);
}

.tvjp a.tvjp-btn:focus-visible {
	outline: 3px solid var(--tvjp-focus);
	outline-offset: 2px;
}

.tvjp .tvjp-btn__meta {
	font-weight: 400;
	font-size: 15px;
}

/* No current openings. */
.tvjp.tvjp-empty {
	background: var(--tvjp-linen);
	border-radius: var(--tvjp-radius);
	padding: 24px;
}
.tvjp .tvjp-empty__text {
	margin: 0;
	font-size: 18px;
	line-height: 1.6;
	color: var(--tvjp-ink);
}
.tvjp .tvjp-empty__action {
	margin: 16px 0 0;
}

.tvjp-editor-note {
	padding: 16px;
	border: 2px dashed #A6A09E;
	border-radius: 8px;
	font-family: Montserrat, sans-serif;
	font-size: 15px;
	color: #6B6563;
}

@media (max-width: 600px) {
	.tvjp .tvjp-card__title { font-size: 21px; }
	.tvjp .tvjp-card__actions { flex-direction: column; }
	.tvjp .tvjp-card__actions a.tvjp-btn { display: block; width: 100%; }
}
