/* stylelint-disable */
/*
 * Custom CSS for the Conduit Ashby job board (jobs.ashbyhq.com/conduitintelligence).
 * Matches condu.it/careers: Neue Montreal headings, Inter Display body, #1d1d1d ink,
 * hairline dividers, and #F1F1F1 pill buttons. Upload in Ashby admin > Job board > Custom CSS.
 */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Inter+Display:wght@400;500;600&display=swap");

/* Loads only once condu.it serves /fonts/* with Access-Control-Allow-Origin; until then headings fall back to Inter Display. */
@font-face {
  font-family: "Neue Montreal";
  src: url("https://condu.it/fonts/NeueMontreal-Regular.otf") format("opentype");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Neue Montreal";
  src: url("https://condu.it/fonts/NeueMontreal-Medium.otf") format("opentype");
  font-weight: 500;
  font-display: swap;
}

:root {
  --colorAppBackground: #ffffff;

  /*
   * 600 fills primary buttons (white text on top); 900 is their hover and selected/active states.
   * Ashby writes the admin theme colors as an inline style on <html>, which beats :root, hence !important.
   * Set the same values in Ashby admin > Theme anyway, so other Ashby surfaces (emails, scheduling) match.
   */
  --colorPrimary900: #000000 !important;
  --colorPrimary600: #1d1d1d !important;

  --widthMaxContent: 1040px;
  --widthMaxJobBoard: 720px;
  --widthMaxSubscriptionPreferences: 600px;

  --borderRadiusContainer: 16px;
  --borderRadiusControl: 12px;
  --borderRadiusButton: 999px;

  --fontFamily: "Inter Display", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

  --conduitInk: #1d1d1d;
  --conduitMuted: #666666;
  --conduitHairline: rgba(29, 29, 29, 0.15);
  --conduitPill: #f1f1f1;
  --conduitPillHover: #e1e1e1;
  --conduitHeading: "Neue Montreal", "Inter Display", "Inter", sans-serif;
}

/* ---------- Header ---------- */

.ashby-job-posting-header {
  border-bottom: 1px solid var(--conduitHairline);
}

.ashby-job-board-back-to-all-jobs-button {
  color: var(--conduitMuted);
  transition: color 0.2s ease;
}
.ashby-job-board-back-to-all-jobs-button:hover {
  color: var(--conduitInk);
}

/* ---------- Job board list ---------- */

.ashby-job-board-heading,
.ashby-job-posting-heading {
  font-family: var(--conduitHeading);
  font-weight: 400;
  font-size: 48px;
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--conduitInk);
}

/* One flat list of roles, like condu.it/careers: no department or team headers. */
.ashby-department-heading,
.ashby-department-heading-level,
.ashby-job-posting-brief-department-heading,
.ashby-job-posting-brief-department-heading-level {
  display: none !important;
}

/* Top rule above the first role, matching the careers index. */
.ashby-job-posting-brief-list {
  margin-top: 24px;
  background: transparent;
  border: 0;
  border-top: 1px solid var(--conduitHairline);
  border-radius: 0;
  box-shadow: none;
}

.ashby-job-posting-brief {
  margin-bottom: 0;
  padding-top: 24px;
  padding-bottom: 24px;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--conduitHairline);
  /* !important beats Ashby's rule that rounds and outdents the first posting on desktop. */
  border-radius: 0 !important;
  margin-left: 0 !important;
  box-shadow: none;
  transition: opacity 0.2s ease;
}
.ashby-job-posting-brief:hover {
  opacity: 0.6;
  background: transparent;
  box-shadow: none;
}

.ashby-job-posting-brief-title {
  font-family: var(--conduitHeading);
  font-weight: 400;
  font-size: 24px;
  line-height: 1.3;
  color: var(--conduitInk);
}

.ashby-job-posting-brief-details {
  margin-top: 4px;
  font-size: 15px;
  font-style: italic;
  color: var(--conduitMuted);
}

/* Hide the posting count and the filter bar; the list is short enough to scan. */
.ashby-job-board-heading-count,
.ashby-job-board-filters-label,
.ashby-job-board-reset-filters-label,
.ashby-job-board-filter {
  display: none !important;
}
/* Each select's dropdown arrow lives in the unclassed div right after it. */
.ashby-job-board-filter + div {
  display: none !important;
}

/* ---------- Job posting ---------- */

.ashby-job-posting-heading {
  margin-bottom: 8px;
}

/* Location / type / department sidebar. */
.ashby-job-posting-left-pane {
  background: transparent;
  border: 0;
  box-shadow: none;
}
.ashby-job-posting-left-pane h2 {
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--conduitMuted);
}
.ashby-job-posting-left-pane p {
  font-size: 16px;
  color: var(--conduitInk);
}
.ashby-job-posting-left-pane > div {
  padding-bottom: 16px;
}
/* Ashby's validator rejects structural pseudo-classes, so dividers go between sections via a sibling selector. */
.ashby-job-posting-left-pane > div + div {
  padding-top: 16px;
  border-top: 1px solid var(--conduitHairline);
}

/* Overview / Application tabs. */
.ashby-job-posting-right-pane-overview-tab,
.ashby-job-posting-right-pane-application-tab {
  font-size: 15px;
  font-weight: 500;
  color: var(--conduitMuted);
}
.ashby-job-posting-right-pane-overview-tab[aria-selected="true"],
.ashby-job-posting-right-pane-application-tab[aria-selected="true"] {
  color: var(--conduitInk);
}
.ashby-job-posting-right-pane-tab-slider {
  background: var(--conduitInk);
  height: 2px;
}

/* Description body: mirrors RolePage.svelte's .role-body. */
.ashby-job-posting-description {
  font-size: 17px;
  line-height: 1.7;
  color: var(--conduitInk);
}
.ashby-job-posting-description h1,
.ashby-job-posting-description h2 {
  font-family: var(--conduitHeading);
  font-size: 26px;
  font-weight: 500;
  line-height: 1.3;
  margin: 0 0 16px;
}
/* Space above every heading that follows content; !important beats Ashby's own heading margin rule. */
.ashby-job-posting-description * + h1,
.ashby-job-posting-description * + h2 {
  margin-top: 48px !important;
}
.ashby-job-posting-description h2 strong,
.ashby-job-posting-description h1 strong {
  font-weight: inherit;
}
.ashby-job-posting-description h3 {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 8px;
}
.ashby-job-posting-description * + h3 {
  margin-top: 28px !important;
}
.ashby-job-posting-description p {
  margin: 0 0 16px;
}
.ashby-job-posting-description ul,
.ashby-job-posting-description ol {
  margin: 0 0 16px;
  padding-left: 24px;
}
.ashby-job-posting-description li {
  margin-bottom: 6px;
}
.ashby-job-posting-description li p {
  margin: 0;
}
.ashby-job-posting-description a {
  color: var(--conduitInk);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ---------- Application form ---------- */

.ashby-application-form-container,
.ashby-application-form-section-container,
.ashby-survey-form-container {
  background: transparent;
  border: 0;
  box-shadow: none;
}

.ashby-application-form-section-header-title {
  font-family: var(--conduitHeading);
  font-size: 26px;
  font-weight: 500;
  color: var(--conduitInk);
}
.ashby-application-form-section-header-description,
.ashby-application-form-question-description,
.ashby-application-form-texting-consent-description {
  font-size: 14px;
  color: var(--conduitMuted);
}

.ashby-application-form-field-entry {
  margin-bottom: 24px;
}
.ashby-application-form-question-title {
  font-size: 15px;
  font-weight: 500;
  color: var(--conduitInk);
}

.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 {
  background: #ffffff;
  border: 1px solid var(--conduitHairline);
  border-radius: var(--borderRadiusControl);
  color: var(--conduitInk);
  font-size: 16px;
  box-shadow: none;
  transition: border-color 0.2s ease;
}
.ashby-application-form-input-text:hover,
.ashby-application-form-input-textarea:hover,
.ashby-application-form-input-autocomplete:hover {
  border-color: rgba(29, 29, 29, 0.35);
}
.ashby-application-form-input-text:focus,
.ashby-application-form-input-textarea:focus,
.ashby-application-form-input-autocomplete:focus {
  border-color: var(--conduitInk);
  outline: none;
  box-shadow: 0 0 0 3px rgba(29, 29, 29, 0.08);
}

.ashby-application-form-input-autocomplete-popup,
.ashby-application-form-input-date-popup {
  border: 1px solid var(--conduitHairline);
  border-radius: var(--borderRadiusControl);
  box-shadow: 0 8px 24px rgba(29, 29, 29, 0.08);
}
.ashby-application-form-input-autocomplete-popup-result[aria-selected="true"] {
  background: var(--conduitPill);
  color: var(--conduitInk);
}

/* Yes/No toggles as pills. */
.ashby-application-form-input-yesno-option {
  background: var(--conduitPill);
  border: 0;
  border-radius: var(--borderRadiusButton);
  color: var(--conduitInk);
  transition: background-color 0.2s ease;
}
.ashby-application-form-input-yesno-option:hover {
  background: var(--conduitPillHover);
}
.ashby-application-form-input-yesno-option[aria-pressed="true"] {
  background: var(--conduitInk);
  color: #ffffff;
}

.ashby-application-form-input-checkbox-group-option-label,
.ashby-application-form-input-radio-group-option-label {
  font-size: 15px;
  color: var(--conduitInk);
}

/* Resume upload and autofill. */
.ashby-application-form-input-file-dropzone,
.ashby-application-form-autofill-input-root {
  background: #fafafa;
  border: 1px dashed rgba(29, 29, 29, 0.25);
  border-radius: var(--borderRadiusContainer);
}
.ashby-application-form-autofill-input-title {
  font-family: var(--conduitHeading);
  font-weight: 500;
  color: var(--conduitInk);
}
.ashby-application-form-autofill-input-description,
.ashby-application-form-input-file-dropzone-instructions {
  color: var(--conduitMuted);
}
.ashby-application-form-input-file-dropzone-upload,
.ashby-application-form-input-education-add {
  background: var(--conduitPill);
  border: 0;
  border-radius: var(--borderRadiusButton);
  color: var(--conduitInk);
}
.ashby-application-form-input-file-dropzone-upload:hover,
.ashby-application-form-input-education-add:hover {
  background: var(--conduitPillHover);
}

/* Submit: solid ink pill, the site's strongest call to action. */
.ashby-application-form-submit-button {
  background: var(--conduitInk);
  color: #ffffff;
  border: 0;
  border-radius: var(--borderRadiusButton);
  font-size: 16px;
  font-weight: 500;
  padding: 14px 28px;
  transition: opacity 0.2s ease;
}
.ashby-application-form-submit-button:hover {
  opacity: 0.85;
}

.ashby-application-form-success-container,
.ashby-application-form-failure-container,
.ashby-application-form-blocked-application-container,
.ashby-application-blocking-disclosure {
  border: 1px solid var(--conduitHairline);
  border-radius: var(--borderRadiusContainer);
  background: #fafafa;
  color: var(--conduitInk);
}