/*
 * Recursive — Ashby job board
 * Revision 8 · stable filter typography in every interaction state
 *
 * White page, sans-serif typography, compact job rows, black footer.
 * Job rows invert on hover, press, and keyboard focus.
 * Upload this file under Admin > Job Boards > Theme (Job Board) > Custom CSS.
 * Keep the Recursive logos configured in Ashby's logo settings.
 * No external fonts, images, scripts, or other downloads are required.
 * Uses documented Ashby classes and ordinary element selectors.
 * Avoids ID selectors and nested state-selector functions rejected on upload.
 * Tagline content: paste the approved sentence into Ashby's Top Description.
 * Leave Bottom Description empty for the approved jobs-first layout.
 */

:root {
  --recursive-ink: #000;
  --recursive-paper: #fff;
  --recursive-content-width: 960px;
  --recursive-gutter: 36px;
  --recursive-role-width: 1280px;
  --recursive-role-gutter: 24px;
  --recursive-filter-font-size: 14px;
  --colorAppBackground: #fff !important;
  --colorPrimary900: #000 !important;
  --colorPrimary600: #000 !important;
  --widthMaxContent: 960px;
  --widthMaxJobBoard: 960px;
  --widthMaxSubscriptionPreferences: 600px;
  --borderRadiusContainer: 0;
  --borderRadiusControl: 0;
  --borderRadiusButton: 0;
  --fontFamily: Arial, Helvetica, sans-serif;
  color-scheme: light;
}

html,
body {
  margin: 0;
  min-width: 0;
  background: var(--recursive-paper);
  color: var(--recursive-ink);
  font-family: var(--fontFamily);
  font-size: 16px;
  line-height: 1.5;
}

/* Only the page shell gets a viewport minimum. Application portals must not. */
body > div:has(> footer) {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100svh;
  background: var(--recursive-paper);
  color: var(--recursive-ink);
}

body > div *,
body > div *::before,
body > div *::after {
  box-sizing: border-box;
}
body > div button,
body > div input,
body > div select,
body > div textarea {
  font-family: var(--fontFamily);
  accent-color: var(--recursive-ink);
}

body > div :focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

/* Header: use the existing Recursive wordmark and native navigation. */
body > div > div:first-child:has(> ul) {
  position: relative;
  background: var(--recursive-paper);
  border: 0;
  box-shadow: none;
}

body > div > div:first-child > ul {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  width: 100%;
  max-width: var(--recursive-content-width);
  min-height: 0;
  margin: 0 auto;
  padding: 24px var(--recursive-gutter) 0;
  list-style: none;
}

body > div > div:first-child > ul > li:empty {
  display: none;
}

body > div > div:first-child > ul a:has(img[src*="org-theme-wordmark"]) {
  display: block;
  margin-left: -10px;
}

body > div > div:first-child img[src*="org-theme-wordmark"] {
  width: 210px;
  max-width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
}

/* The hosted board's outer container is located by its public heading hook. */
body > div > div:has(.ashby-job-board-heading) {
  flex: 1 0 auto;
  width: 100%;
  max-width: var(--recursive-content-width);
  margin: 0 auto;
  padding: 46px var(--recursive-gutter) 56px;
  background: var(--recursive-paper);
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body > div > div:has(.ashby-job-board-heading) > div {
  margin: 0;
  padding: 0;
}

.ashby-job-board-heading {
  margin: 0 0 24px;
  padding: 0 0 25px;
  border-bottom: 3px solid var(--recursive-ink);
  color: var(--recursive-ink);
  font-family: var(--fontFamily);
  font-size: 44px;
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -1.9px;
  overflow-wrap: anywhere;
}

.ashby-job-board-heading-count {
  display: inline-block;
  margin-left: 8px;
  color: inherit;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.2px;
  vertical-align: middle;
  white-space: nowrap;
}

/* Top Description: the approved tagline directly above Open Positions.
 * Target its relationship to the public heading, without private class names.
 */
body > div div:has(> .ashby-job-board-heading) > div:has(+ .ashby-job-board-heading) {
  max-width: 780px;
  margin: 0 0 40px;
  padding: 0;
  color: var(--recursive-ink);
  font-family: var(--fontFamily);
  font-size: 26px;
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: -0.8px;
  overflow-wrap: anywhere;
}

body > div div:has(> .ashby-job-board-heading) > div:has(+ .ashby-job-board-heading) p {
  margin: 0;
  padding: 0;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
}

/* Filter wrappers are identified through Ashby's documented control hooks. */
body > div div:has(> div > .ashby-job-board-filters-label) {
  margin: 0 0 34px;
  padding: 0;
  background: var(--recursive-paper);
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body > div div:has(> .ashby-job-board-filters-label) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 9px;
  padding: 0;
}

body > div div:has(> div > select.ashby-job-board-filter) {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  width: 100%;
}

body > div div:has(> select.ashby-job-board-filter) {
  min-width: 0;
}

.ashby-job-board-filters-label,
.ashby-job-board-reset-filters-label {
  color: var(--recursive-ink);
  font-family: var(--fontFamily);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
}

.ashby-job-board-reset-filters-label {
  padding: 6px 0;
  background: var(--recursive-paper);
  border: 0;
  border-radius: 0;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ashby-job-board-reset-filters-label:disabled {
  color: var(--recursive-ink);
  opacity: 1;
  text-decoration: none;
}

.ashby-job-board-filter {
  width: 100%;
  min-width: 0;
  height: 46px;
  min-height: 46px;
  margin: 0;
  padding: 10px 36px 10px 12px;
  background: var(--recursive-paper);
  border: 1px solid var(--recursive-ink);
  border-radius: 0;
  color: var(--recursive-ink);
  box-shadow: none;
  font-family: var(--fontFamily);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  appearance: none;
  color-scheme: light;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* Ashby's focus style enlarges select text. Keep the same type in every state. */
.ashby-job-board-filter,
.ashby-job-board-filter:hover,
.ashby-job-board-filter:active,
.ashby-job-board-filter:focus,
.ashby-job-board-filter:focus-visible {
  font-family: var(--fontFamily) !important;
  font-size: var(--recursive-filter-font-size) !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  letter-spacing: normal !important;
  transition: none !important;
  animation: none !important;
  transform: none !important;
}

.ashby-job-board-filter option {
  font-family: var(--fontFamily);
  font-size: var(--recursive-filter-font-size);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: normal;
}

.ashby-job-board-filter:focus {
  outline: none;
}

.ashby-job-board-filter:focus-visible {
  outline: 2px solid var(--recursive-ink);
  outline-offset: 3px;
}

/* Enhance the real Ashby select; unsupported browsers keep their native menu. */
@supports (appearance: base-select) {
  .ashby-job-board-filter,
  .ashby-job-board-filter::picker(select) {
    appearance: base-select;
  }

  .ashby-job-board-filter {
    display: flex;
    align-items: center;
  }

  .ashby-job-board-filter::picker-icon {
    display: none;
  }

  .ashby-job-board-filter::picker(select) {
    margin-top: 6px;
    padding: 4px;
    border: 1px solid var(--recursive-ink);
    border-radius: 0;
    background: var(--recursive-paper);
    color: var(--recursive-ink);
    box-shadow: none;
    font-family: var(--fontFamily);
    font-size: var(--recursive-filter-font-size);
    line-height: 1.5;
  }

  .ashby-job-board-filter option {
    padding: 10px 12px;
    border: 0;
    border-radius: 0;
    background: var(--recursive-paper);
    color: var(--recursive-ink);
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .ashby-job-board-filter option:disabled {
    display: none;
  }

  .ashby-job-board-filter option:hover,
  .ashby-job-board-filter option:focus,
  .ashby-job-board-filter option:checked {
    background: var(--recursive-ink);
    color: var(--recursive-paper);
  }
}

body > div div:has(> select.ashby-job-board-filter) svg,
.ashby-job-board-reset-filters-label svg {
  color: var(--recursive-ink);
  fill: currentColor;
}

/* Open's typography, with compact rows and details beneath each role title. */
.ashby-department-heading {
  margin: 0 0 10px;
  padding: 0;
  border: 0;
  color: var(--recursive-ink);
  font-family: var(--fontFamily);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.ashby-department-heading-level {
  color: inherit;
  font: inherit;
}

body > div div:has(> .ashby-department-heading) {
  margin: 0;
  padding: 0;
}

.ashby-job-posting-brief-list {
  display: block;
  margin: 0 0 38px;
  padding: 0;
}

.ashby-job-posting-brief-list > a {
  display: block;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  color: var(--recursive-ink);
  box-shadow: none;
  text-decoration: none;
}

.ashby-job-posting-brief {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 8px;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 15px 14px;
  background: var(--recursive-paper);
  border: 0;
  border-bottom: 1px solid var(--recursive-ink);
  border-radius: 0;
  color: var(--recursive-ink);
  box-shadow: none;
}

.ashby-job-posting-brief-title {
  min-width: 0;
  margin: 0;
  font-family: var(--fontFamily);
  font-size: 20px;
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: -0.4px;
  overflow-wrap: anywhere;
}

.ashby-job-posting-brief-details {
  min-width: 0;
  margin: 0;
  font-family: var(--fontFamily);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.ashby-job-posting-brief-details p {
  margin: 0;
}

.ashby-job-posting-brief-details p + p {
  margin-top: 4px;
}
.ashby-job-posting-brief .ashby-job-posting-brief-title,
.ashby-job-posting-brief .ashby-job-posting-brief-details,
.ashby-job-posting-brief .ashby-job-posting-brief-details * {
  background: transparent;
  color: inherit !important;
  text-decoration: none;
}
.ashby-job-posting-brief:hover,
.ashby-job-posting-brief:active,
.ashby-job-posting-brief:focus-visible,
.ashby-job-posting-brief-list > a:hover .ashby-job-posting-brief,
.ashby-job-posting-brief-list > a:active .ashby-job-posting-brief,
.ashby-job-posting-brief-list > a:focus-visible .ashby-job-posting-brief {
  background: var(--recursive-ink) !important;
  color: var(--recursive-paper) !important;
}

/* Keep the complete job description and application flow native to Ashby. */
body > div > div:has(.ashby-job-posting-heading) {
  flex: 1 0 auto;
  width: 100%;
  max-width: var(--recursive-role-width);
  margin: 0 auto;
  padding: 28px var(--recursive-role-gutter) 56px;
}

/* Center the role-page logo, with the native back link on the same row. */
body > div > .ashby-job-posting-header:first-child > ul {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
  align-items: center;
  gap: 12px;
  height: auto;
  max-width: var(--recursive-role-width);
  padding: 24px var(--recursive-role-gutter) 0;
}

.ashby-job-posting-header > ul > li {
  min-width: 0;
  align-self: center;
}

.ashby-job-posting-header > ul > li:first-child {
  grid-column: 2;
  grid-row: 1;
  justify-self: center;
  width: 100%;
}

.ashby-job-posting-header > ul > li:has(> .ashby-job-board-back-to-all-jobs-button) {
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
}

body > div > .ashby-job-posting-header:first-child > ul a:has(img[src*="org-theme-wordmark"]) {
  width: 210px;
  max-width: 100%;
  margin: 0 auto;
}

body > div > .ashby-job-posting-header:first-child img[src*="org-theme-wordmark"] {
  width: 100%;
}

.ashby-job-board-back-to-all-jobs-button {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  width: 44px;
  min-height: 44px;
  padding: 12px 0;
  line-height: 1;
  color: var(--recursive-ink);
  text-decoration: none;
}

.ashby-job-posting-header .ashby-job-board-back-to-all-jobs-button:hover,
.ashby-job-posting-header .ashby-job-board-back-to-all-jobs-button:active,
.ashby-job-posting-header .ashby-job-board-back-to-all-jobs-button:focus {
  text-decoration: none;
}

body > div > div:has(.ashby-job-posting-heading) > div {
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
}

body > div div:has(> .ashby-job-posting-right-pane) {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  align-items: start;
  gap: 40px;
  min-width: 0;
  padding: 0;
}

.ashby-job-posting-right-pane {
  width: 100%;
  min-width: 0;
}

.ashby-job-posting-description-container,
.ashby-application-form-container {
  width: 100%;
  max-width: none;
  padding: 24px 0;
}

.ashby-job-posting-header,
.ashby-job-posting-left-pane,
.ashby-job-posting-description-container,
.ashby-application-form-container,
.ashby-survey-form-container {
  background: var(--recursive-paper);
  border-radius: 0;
  color: var(--recursive-ink);
  box-shadow: none;
  font-family: var(--fontFamily);
}

.ashby-job-posting-heading {
  color: var(--recursive-ink);
  font-family: var(--fontFamily);
  font-size: 34px;
  font-weight: 500;
  line-height: 1.13;
  letter-spacing: -1px;
  overflow-wrap: anywhere;
}

.ashby-job-posting-left-pane {
  min-width: 0;
  margin: 72px 0 0;
  padding: 24px 0;
  border: 0;
  font-size: 14px;
  line-height: 1.5;
}
.ashby-job-posting-left-pane h2,
.ashby-job-posting-left-pane h3,
.ashby-job-posting-left-pane p,
.ashby-job-posting-left-pane li,
.ashby-job-posting-left-pane span,
.ashby-job-posting-brief-department-heading,
.ashby-job-posting-brief-department-heading-level {
  color: inherit;
}

.ashby-job-posting-description {
  color: var(--recursive-ink);
  font-family: var(--fontFamily);
  font-size: 16px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
.ashby-job-posting-description h1,
.ashby-job-posting-description h2,
.ashby-job-posting-description h3,
.ashby-job-posting-description h4 {
  color: var(--recursive-ink);
  font-family: var(--fontFamily);
  line-height: 1.3;
}

.ashby-job-posting-description a {
  color: var(--recursive-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ashby-job-posting-right-pane [role="tablist"] {
  position: static !important;
  top: auto !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  z-index: auto;
  box-shadow: none !important;
  transform: none !important;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin: 24px 0 0;
  padding: 0;
  background: var(--recursive-paper);
  border-bottom: 1px solid var(--recursive-ink);
  border-radius: 0;
}

.ashby-job-posting-right-pane [role="tab"] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 0;
  min-height: 48px;
  margin: 0 0 -1px;
  padding: 12px 16px;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  text-align: center;
  text-decoration: none;
  box-shadow: none;
  transform: none;
  transition: none;
  animation: none;
}

.ashby-job-posting-right-pane [role="tab"],
.ashby-job-posting-right-pane-overview-tab,
.ashby-job-posting-right-pane-application-tab {
  background: transparent;
  color: var(--recursive-ink);
  font-family: var(--fontFamily);
  font-size: 14px;
  line-height: 1.5;
}

.ashby-job-posting-right-pane [role="tab"][aria-selected="true"] {
  border-bottom-color: var(--recursive-ink);
  color: var(--recursive-ink);
  font-weight: 500;
}

.ashby-job-posting-right-pane-tab-slider {
  display: none;
}

.ashby-job-posting-right-pane [role="tab"]:hover,
.ashby-job-posting-right-pane [role="tab"]:active,
.ashby-job-posting-right-pane [role="tab"]:focus {
  background: transparent;
  color: var(--recursive-ink);
  text-decoration: none;
  box-shadow: none;
  transform: none;
  transition: none;
  animation: none;
  outline: none;
}

.ashby-job-posting-right-pane [role="tab"]:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: -5px;
}

/* Inputs remain real Ashby controls; validation messages stay visible. */
.ashby-application-form-question-title,
.ashby-application-form-question-description,
.ashby-application-form-section-header-title,
.ashby-application-form-section-header-description,
.ashby-application-form-texting-consent-description {
  color: var(--recursive-ink);
  font-family: var(--fontFamily);
  line-height: 1.5;
}

.ashby-application-form-question-title {
  font-size: 14px;
  font-weight: 500;
}

.ashby-application-form-section-header-title {
  font-size: 22px;
  font-weight: 500;
  line-height: 1.3;
}

.ashby-application-form-input-text,
.ashby-application-form-input-textarea,
.ashby-application-form-input-autocomplete,
.ashby-application-form-input-date,
.ashby-application-form-input-dropdown,
.ashby-application-form-input-dropdown-select {
  max-width: 100%;
  min-width: 0;
  min-height: 46px;
  background: var(--recursive-paper);
  border: 1px solid var(--recursive-ink);
  border-radius: 0;
  color: var(--recursive-ink);
  box-shadow: none;
  font-family: var(--fontFamily);
  font-size: 16px;
  line-height: 1.5;
}

.ashby-application-form-input-text,
.ashby-application-form-input-textarea,
.ashby-application-form-input-autocomplete {
  padding: 10px 12px;
}

.ashby-application-form-input-dropdown-select {
  border: 0;
}

.ashby-application-form-input-textarea {
  min-height: 120px;
  resize: vertical;
}

.ashby-application-form-input-text::placeholder,
.ashby-application-form-input-textarea::placeholder,
.ashby-application-form-input-autocomplete::placeholder {
  color: var(--recursive-ink);
  opacity: 1;
}

.ashby-application-form-input-autocomplete-popup,
.ashby-application-form-input-date-popup {
  background: var(--recursive-paper);
  border: 1px solid var(--recursive-ink);
  border-radius: 0;
  color: var(--recursive-ink);
}

.ashby-application-form-input-autocomplete-popup-result {
  background: var(--recursive-paper);
  color: var(--recursive-ink);
}

.ashby-application-form-input-autocomplete-popup-result[aria-selected="true"] {
  background: var(--recursive-ink);
  color: var(--recursive-paper);
}

.ashby-application-form-input-file-dropzone,
.ashby-application-form-autofill-input-root,
.ashby-application-form-autofill-uploader {
  background: var(--recursive-paper);
  border: 1px dashed var(--recursive-ink);
  border-radius: 0;
  color: var(--recursive-ink);
  box-shadow: none;
}

.ashby-application-form-input-checkbox-group-option,
.ashby-application-form-input-radio-group-option,
.ashby-application-form-input-yesno-option {
  border-color: var(--recursive-ink);
  border-radius: 0;
  color: var(--recursive-ink);
  accent-color: var(--recursive-ink);
}

.ashby-application-form-input-yesno-option[aria-pressed="true"] {
  background: var(--recursive-ink);
  color: var(--recursive-paper);
}

/* Compact native Yes/No choices; keep the real controls and selected state. */
.ashby-application-form-input-yesno {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  width: auto;
  max-width: 100%;
  border: 0;
  background: transparent;
}

.ashby-application-form-input-yesno > .ashby-application-form-input-yesno-option {
  flex: 0 0 auto;
  width: auto;
  min-width: 56px;
  min-height: 36px;
  margin: 0;
  padding: 6px 14px;
  border: 1px solid var(--recursive-ink);
  background: var(--recursive-paper);
  color: var(--recursive-ink);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}

.ashby-application-form-input-yesno > .ashby-application-form-input-yesno-option[aria-pressed="true"] {
  background: var(--recursive-ink);
  color: var(--recursive-paper);
}

@media (pointer: coarse) {
  .ashby-application-form-input-yesno > .ashby-application-form-input-yesno-option {
    min-height: 44px;
  }
}
.ashby-application-form-submit-button,
.ashby-application-form-input-file-dropzone-upload,
.ashby-job-posting-description-container button,
.ashby-job-posting-description-container a[role="button"] {
  min-height: 46px;
  padding: 11px 20px;
  background: var(--recursive-ink);
  border: 1px solid var(--recursive-ink);
  border-radius: 0;
  color: var(--recursive-paper);
  box-shadow: none;
  font-family: var(--fontFamily);
  font-size: 14px;
  line-height: 1.5;
}
.ashby-application-form-submit-button:hover:enabled,
.ashby-application-form-input-file-dropzone-upload:hover:enabled,
.ashby-job-posting-description-container button:hover,
.ashby-job-posting-description-container a[role="button"]:hover {
  background: var(--recursive-paper);
  color: var(--recursive-ink);
}

.ashby-application-form-submit-button:disabled {
  background: var(--recursive-paper);
  border-style: dashed;
  color: var(--recursive-ink);
  cursor: not-allowed;
  opacity: 1;
}

.ashby-application-form-container [aria-invalid="true"] {
  border: 3px double var(--recursive-ink);
}

.ashby-application-form-container [role="alert"],
.ashby-application-form-autofill-input-form-alert,
.ashby-application-form-failure-container,
.ashby-application-form-success-container,
.ashby-application-form-blocked-application-container,
.ashby-application-blocking-disclosure {
  background: var(--recursive-paper);
  border-color: var(--recursive-ink);
  border-radius: 0;
  color: var(--recursive-ink);
}

/* Full-width black footer. Preserve all attribution and legal links. */
body > div > footer:first-of-type {
  flex-shrink: 0;
  align-items: center;
  gap: 16px;
  width: 100%;
  max-width: none;
  min-height: 84px;
  margin: 0;
  padding: 28px max(var(--recursive-gutter), calc((100% - var(--recursive-content-width)) / 2 + var(--recursive-gutter)));
  background: var(--recursive-ink);
  border: 0;
  border-radius: 0;
  color: var(--recursive-paper) !important;
  font-family: var(--fontFamily);
  font-size: 11px;
  line-height: 1.5;
}
body > div > footer:first-of-type a,
body > div > footer:first-of-type p,
body > div > footer:first-of-type span {
  color: inherit !important;
}

body > div > footer:first-of-type > p {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin: 0;
}

/* Override Ashby's default footer text and wordmark colors. */
body > div > footer:first-of-type svg,
body > div > footer:first-of-type svg path {
  fill: currentColor !important;
  color: inherit !important;
}

body > div > footer:first-of-type a {
  text-decoration: none;
  text-underline-offset: 3px;
}

body > div > footer:first-of-type a:hover {
  text-decoration: underline;
}

@media (max-width: 900px) {
  body > div div:has(> .ashby-job-posting-right-pane) {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }

  .ashby-job-posting-left-pane {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 24px;
    margin: 0;
    padding: 0;
  }

  .ashby-job-posting-left-pane > div {
    margin: 0;
    padding: 0;
  }
}

@media (max-width: 760px) {
  body > div div:has(> div > select.ashby-job-board-filter) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ashby-job-posting-brief {
    grid-template-columns: minmax(0, 1fr);
    gap: 5px;
  }

  body > div > footer:first-of-type {
    flex-direction: column;
    align-items: flex-start;
  }

  body > div > footer:first-of-type > p {
    justify-content: flex-start;
  }
}

@media (max-width: 520px) {
  :root {
    --recursive-gutter: 20px;
    --recursive-role-gutter: 20px;
    --recursive-filter-font-size: 16px;
  }

  body > div > div:first-child > ul {
    padding-top: 20px;
  }

  body > div > .ashby-job-posting-header:first-child > ul {
    padding-top: 20px;
  }

  body > div > div:has(.ashby-job-board-heading) {
    padding-top: 38px;
    padding-bottom: 42px;
  }

  .ashby-job-board-heading {
    font-size: 34px;
    letter-spacing: -1.3px;
  }

  .ashby-job-board-heading-count {
    margin-left: 2px;
    font-size: 15px;
  }

  body > div div:has(> .ashby-job-board-heading) > div:has(+ .ashby-job-board-heading) {
    margin-bottom: 32px;
    font-size: 24px;
    line-height: 1.3;
    letter-spacing: -0.5px;
  }

  .ashby-job-posting-brief-title {
    font-size: 18px;
  }

  .ashby-job-posting-brief-details {
    font-size: 12px;
  }

  .ashby-job-posting-heading {
    font-size: 28px;
    line-height: 1.16;
    letter-spacing: -0.6px;
  }

  body > div > footer:first-of-type {
    padding: 24px var(--recursive-gutter);
  }

  body > div > footer:first-of-type > p {
    gap: 8px 12px;
  }
}

@media (max-width: 380px) {
  body > div div:has(> div > select.ashby-job-board-filter) {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Mobile application: normal-flow tabs, clearer metadata, centered uploads. */
@media (max-width: 520px) {
  body > div > div:has(.ashby-job-posting-heading) {
    padding-top: 20px;
  }

  body > div > div:has(.ashby-job-posting-heading) > div:has(> .ashby-job-posting-heading) {
    margin-top: 16px;
    margin-bottom: 24px;
  }

  body > div div:has(> .ashby-job-posting-right-pane) {
    gap: 20px;
  }

  .ashby-job-posting-left-pane {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .ashby-job-posting-left-pane > div {
    display: grid;
    grid-template-columns: 104px minmax(0, 1fr);
    align-items: start;
    gap: 12px;
    padding: 12px 0;
    border: 0;
    border-bottom: 1px solid var(--recursive-ink);
  }

  .ashby-job-posting-left-pane > div:last-child {
    border-bottom: 0;
  }

  .ashby-job-posting-left-pane h2,
  .ashby-job-posting-left-pane h3 {
    margin: 0;
    padding: 0;
    color: var(--recursive-ink);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
  }

  .ashby-job-posting-left-pane p {
    min-width: 0;
    margin: 0;
    padding: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    overflow-wrap: anywhere;
  }

  .ashby-job-posting-right-pane [role="tablist"] {
    margin-top: 0;
  }

  .ashby-job-posting-description h2,
  .ashby-job-posting-description h3 {
    margin: 24px 0 12px;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.3;
  }

  .ashby-job-posting-description h2 strong,
  .ashby-job-posting-description h3 strong {
    font-weight: 500;
  }

  .ashby-application-form-autofill-input-base-layer > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
  }

  .ashby-application-form-autofill-input-base-layer > div > div:has(.ashby-application-form-autofill-input-title) {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
  }

  .ashby-application-form-autofill-input-title {
    margin: 0;
    color: var(--recursive-ink);
    font-family: var(--fontFamily);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
  }

  .ashby-application-form-autofill-input-description {
    align-self: center;
    width: 100%;
    max-width: 100%;
    margin: 0;
    color: var(--recursive-ink);
    font-size: 14px;
    line-height: 1.5;
    text-align: center;
  }

  .ashby-application-form-autofill-input-icon {
    width: 20px;
    height: 20px;
    color: var(--recursive-ink);
    fill: currentColor;
  }

  .ashby-application-form-autofill-input-base-layer > div > div:has(> button) {
    display: flex;
    justify-content: center;
    width: 100%;
    margin: 0;
  }

  .ashby-application-form-autofill-input-base-layer button {
    width: auto;
    max-width: 100%;
    min-height: 44px;
    margin: 0 auto;
    padding: 10px 18px;
    border: 1px solid var(--recursive-ink);
    border-radius: 0;
    background: var(--recursive-ink);
    color: var(--recursive-paper);
    box-shadow: none;
    font-family: var(--fontFamily);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    text-align: center;
  }

  .ashby-application-form-autofill-input-base-layer button:hover {
    background: var(--recursive-paper);
    color: var(--recursive-ink);
  }

  .ashby-application-form-input-file-dropzone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    text-align: center;
  }

  .ashby-application-form-input-file-dropzone .ashby-application-form-input-file-dropzone-upload {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
  }

  .ashby-application-form-input-file-dropzone-upload svg {
    flex-shrink: 0;
    color: inherit;
    fill: currentColor;
  }

  .ashby-application-form-input-file-dropzone-instructions {
    margin: 0;
    font-size: 12px;
    line-height: 1.5;
    text-align: center;
  }
}

/* Allow the visitor's high-contrast palette to take priority. */
@media (forced-colors: active) {
.ashby-job-posting-brief:hover,
.ashby-job-posting-brief:active,
.ashby-job-posting-brief:focus-visible,
.ashby-job-posting-brief-list > a:hover .ashby-job-posting-brief,
.ashby-job-posting-brief-list > a:active .ashby-job-posting-brief,
.ashby-job-posting-brief-list > a:focus-visible .ashby-job-posting-brief {
    background: Highlight !important;
    color: HighlightText !important;
  }
}

@media print {
  body > div:has(> footer) {
    display: block;
    min-height: 0;
  }

  body > div > footer:first-of-type {
    background: var(--recursive-paper);
    border-top: 1px solid var(--recursive-ink);
    color: var(--recursive-ink) !important;
  }
}