/* Careers listing and job posting pages. Colors follow assets/css/sass/_settings.scss. */
.careers {
	--careers-primary: #3634A3;
	--careers-ink: #0a0a0a;
	--careers-muted: #5c5c5c;
	--careers-rule: #e6e6e6;
	--careers-panel: #f3f3f3;
}
.careers-inner { max-width: 1100px; margin: 0 auto; padding: 2rem 1rem 4rem; }
.careers-job .careers-inner { padding-top: 2.5rem; }

/* Same header band as the Contact page (emode.scss, .page-id-21 main h1). */
.careers h1.careers-page-header {
	background-color: #e6e6e6;
	text-align: center;
	padding: 1rem;
	border-radius: 0;
	font-size: 1.5rem;
	font-weight: 500;
	border-bottom: 1px solid #cacaca;
	margin: 0;
}

/* Listing */
.careers-intro { font-size: 1.125rem; max-width: 46rem; margin: 0 auto; color: var(--careers-muted); }
.careers-openings { margin-top: 2.5rem; }
.careers-empty { font-size: 1.125rem; padding: 2rem 0; border-top: 1px solid var(--careers-rule); }
.careers-department { margin-bottom: 2.5rem; }
.careers-department__title { font-size: 1.25rem; margin-bottom: 0.25rem; }
.careers-department__count { color: var(--careers-muted); font-weight: 400; }
.careers-list { list-style: none; margin: 0; }
.careers-row {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.25rem 1.5rem;
	padding: 1rem 0;
	border-top: 1px solid var(--careers-rule);
}
.careers-list .careers-row:last-child { border-bottom: 1px solid var(--careers-rule); }
.careers-row__title { flex: 1 1 22rem; font-weight: 600; font-size: 1.0625rem; color: var(--careers-ink); }
.careers-row__title:hover { color: var(--careers-primary); }
.careers-row__meta { flex: 0 1 auto; color: var(--careers-muted); }
.careers-row__salary::before { content: "·"; margin: 0 0.5rem; }
.careers-row__apply { font-weight: 600; color: var(--careers-primary); white-space: nowrap; }

.careers-process { margin-top: 4rem; padding-top: 2.5rem; border-top: 1px solid var(--careers-rule); }
.careers-process__intro { color: var(--careers-muted); }
.careers-steps {
	list-style: none;
	margin: 2rem 0 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
	gap: 1rem;
}
.careers-step {
	display: flex;
	gap: 0.75rem;
	align-items: baseline;
	padding: 1rem 1.25rem;
	background: var(--careers-panel);
	border-radius: 4px;
}
.careers-step__number { font-weight: 700; color: var(--careers-primary); font-variant-numeric: tabular-nums; }
.careers-step__title { font-weight: 600; }
.careers-eeo { margin-top: 2.5rem; font-weight: 400; font-size: 0.9375rem; color: var(--careers-muted); }

/* Job posting */
.careers-preview-banner {
	background: #FEBD2A;
	color: var(--careers-ink);
	padding: 0.75rem 1rem;
	border-radius: 4px;
	margin-bottom: 1.5rem;
	font-weight: 600;
}
.careers-back a { color: var(--careers-muted); }
.careers-job__title { font-size: 1.75rem; font-weight: 600; line-height: 1.25; margin: 0.5rem 0 1.5rem; }
@media screen and (min-width: 40em) { .careers-job__title { font-size: 2rem; } }
.careers-job__layout { display: flex; flex-direction: column; gap: 2rem; }
.careers-job__main { min-width: 0; }
@media screen and (min-width: 64em) {
	.careers-job__layout { flex-direction: row-reverse; align-items: flex-start; }
	.careers-job__aside { flex: 0 0 18rem; position: sticky; top: 1.5rem; }
	.careers-job__main { flex: 1 1 auto; }
}
.job-details { background: var(--careers-panel); border-radius: 4px; padding: 1.25rem; margin: 0 0 1rem; }
.job-details dt { font-size: 0.8125rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--careers-muted); font-weight: 600; }
.job-details dd { margin: 0 0 0.875rem; }
.job-details dd:last-child { margin-bottom: 0; }
.job-details__note { font-size: 0.875rem; color: var(--careers-muted); }
.careers-apply-button { width: 100%; background: var(--careers-primary); }
.careers-tabs-content .careers-apply-button { width: auto; }

.careers-tabs { border: 0; border-bottom: 1px solid var(--careers-rule); background: transparent; }
.careers-tabs .tabs-title > a { font-size: 1rem; font-weight: 600; color: var(--careers-muted); padding: 0.875rem 1.25rem; background: transparent; }
.careers-tabs .tabs-title > a:hover { background: transparent; color: var(--careers-ink); }
.careers-tabs .tabs-title.is-active > a,
.careers-tabs .tabs-title > a[aria-selected="true"] { color: var(--careers-primary); background: transparent; box-shadow: inset 0 -3px 0 var(--careers-primary); }
.careers-tabs-content { border: 0; background: transparent; }
.careers-tabs-content .tabs-panel { padding: 1.5rem 0 0; }
.careers-tabs-content h3 { font-size: 1.125rem; margin-top: 2rem; }
.careers-tabs-content .job-role > h3:first-child,
.careers-tabs-content .job-intro > h3:first-child { margin-top: 0; }
.job-intro { background: var(--careers-panel); border-radius: 4px; padding: 1.25rem 1.25rem 0.25rem; margin-bottom: 1.5rem; }
.job-intro > :first-child { margin-top: 0; }

/* The theme turns list bullets off globally. Put them back in posting text. */
.job-role ul, .job-intro ul, .job-shared ul { list-style-type: disc; margin-left: 1.5rem; }
.job-role ol, .job-intro ol, .job-shared ol { list-style-type: decimal; margin-left: 1.5rem; }
.job-role li, .job-intro li, .job-shared li { margin-bottom: 0.25rem; }

/* Application form: Foundation gives radio and checkbox inputs a 1rem bottom margin, which lifts them above their labels. */
.careers .gform_wrapper .gchoice { display: flex; align-items: center; }
.careers .gform_wrapper .gchoice .gfield-choice-input { margin: 0; flex: none; }
.careers .gform_wrapper .gchoice .gfield-choice-input + label { margin: 0 0 0 0.5rem; }
