/* stylelint-disable */
/*
 * Lantern — Ashby job board theme
 * Mirrors lanternhq.com/careers/* (navy #081120, sky #00b0ff, Google Sans + Inter).
 * Structure follows Ashby's full-job-board.css example.
 */

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

:root {
  --colorAppBackground: #ffffff;

  /* Also set these in Ashby admin → Job Board → Theme so they stay in sync. */
  --colorPrimary900: #0098e0;
  --colorPrimary600: #00b0ff;

  --widthMaxContent: 1000px;
  --widthMaxJobBoard: 1000px;
  --widthMaxSubscriptionPreferences: 640px;

  --borderRadiusContainer: 14px;
  --borderRadiusControl: 10px;
  --borderRadiusButton: 10px;

  --fontFamily: "Inter", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;

  /* Lantern tokens */
  --lantern-navy: #081120;
  --lantern-ink: #0f1a28;
  --lantern-body: #3a4553;
  --lantern-muted: #64748b;
  --lantern-subtle: #94a3b8;
  --lantern-sky: #00b0ff;
  --lantern-sky-hover: #0098e0;
  --lantern-sky-tint: rgba(0, 176, 255, 0.12);
  --lantern-line: #e6e8ec;
  --lantern-control: #d6dae1;
  --lantern-panel: #f6f8fb;
  --lantern-display: "Google Sans", "Inter", sans-serif;
}

body {
  color: var(--lantern-body);
  -webkit-font-smoothing: antialiased;
}

/* ================================================================
 * Job board list
 * ================================================================ */

/* The heading of the entire job board. */
.ashby-job-board-heading {
  font-family: var(--lantern-display);
  font-size: 44px;
  font-weight: 700;
  letter-spacing: -0.5px;
  line-height: 1.05;
  color: var(--lantern-navy);
  margin-bottom: 28px;
}

@media (max-width: 640px) {
  .ashby-job-board-heading,
  .ashby-job-posting-heading {
    font-size: 32px;
  }
}

/* The count of job postings on the job board. */
.ashby-job-board-heading-count {
  color: var(--lantern-sky);
  font-weight: 700;
}

/* The 'Filters' label element in the job board. */
.ashby-job-board-filters-label {
  font-family: var(--lantern-display);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--lantern-muted);
}

/* The 'Reset filters' label element in the job board. */
.ashby-job-board-reset-filters-label {
  font-family: var(--lantern-display);
  font-size: 13px;
  font-weight: 600;
  color: var(--lantern-sky);
  background: none;
  border: none;
  cursor: pointer;
}
.ashby-job-board-reset-filters-label:hover {
  color: var(--lantern-sky-hover);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* A select box element for filtering the job board. */
.ashby-job-board-filter {
  font-family: var(--fontFamily);
  font-size: 15px;
  color: var(--lantern-ink);
  background-color: #fff;
  border: 1px solid var(--lantern-control);
  border-radius: var(--borderRadiusControl);
  padding: 12px 40px 12px 14px;
  cursor: pointer;
  box-shadow: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.ashby-job-board-filter:hover {
  border-color: #b9c1cc;
}
.ashby-job-board-filter:focus {
  outline: none;
  border-color: var(--lantern-sky);
  box-shadow: 0 0 0 3px rgba(0, 176, 255, 0.15);
}

/* The heading of a department, which can have many teams under it. */
.ashby-department-heading {
  font-family: var(--lantern-display);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--lantern-sky);
  border-bottom: 1px solid var(--lantern-line);
  padding-bottom: 10px;
  margin: 44px 0 16px;
}

/* The heading of a single team. */
.ashby-department-heading-level {
  color: inherit;
}

/* The container for the list of job post briefings. */
.ashby-job-posting-brief-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ashby-job-posting-brief-list > a {
  text-decoration: none;
  border-radius: var(--borderRadiusContainer);
}

/* The container of the job posting details pane. */
.ashby-job-posting-brief {
  position: relative;
  margin-bottom: 0;
  padding: 22px 64px 22px 24px;
  background: #fff;
  border: 1px solid var(--lantern-line);
  border-radius: var(--borderRadiusContainer);
  box-shadow: 0 1px 2px rgba(8, 17, 32, 0.03);
  transition: border-color 0.15s, box-shadow 0.2s, transform 0.2s;
}
/* Arrow affordance on the right of each role */
.ashby-job-posting-brief::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 24px;
  width: 20px;
  height: 20px;
  transform: translate(0, -50%);
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12h14M13 6l6 6-6 6'/></svg>") no-repeat center / contain;
  transition: transform 0.2s, background-image 0.2s;
}
a:hover > .ashby-job-posting-brief,
.ashby-job-posting-brief:hover {
  border-color: var(--lantern-sky);
  box-shadow: 0 10px 30px rgba(8, 17, 32, 0.07);
  transform: translateY(-1px);
}
a:hover > .ashby-job-posting-brief::after,
.ashby-job-posting-brief:hover::after {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2300b0ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12h14M13 6l6 6-6 6'/></svg>");
  transform: translate(4px, -50%);
}

/* The title of the job posting in the details pane. */
.ashby-job-posting-brief-title {
  font-family: var(--lantern-display);
  font-size: 18px;
  font-weight: 700;
  color: var(--lantern-navy);
  margin: 0 0 6px;
}

/* The container for the details of the job posting. */
.ashby-job-posting-brief-details,
.ashby-job-posting-brief-details p {
  font-size: 14px;
  line-height: 1.5;
  color: var(--lantern-muted);
  margin: 0;
}

/* ================================================================
 * Individual job posting
 * ================================================================ */

/* The button which navigates back to the list of all job postings. */
.ashby-job-board-back-to-all-jobs-button {
  font-family: var(--lantern-display);
  font-size: 13px;
  font-weight: 500;
  color: var(--lantern-muted);
  background: none;
  border: none;
  box-shadow: none;
  transition: color 0.15s;
}
.ashby-job-board-back-to-all-jobs-button:hover {
  color: var(--lantern-sky);
}

/* The main header on the job posting page */
.ashby-job-posting-header {
  border-bottom: 1px solid var(--lantern-line);
}

/* The heading of a job post */
.ashby-job-posting-heading {
  font-family: var(--lantern-display);
  font-size: 44px;
  font-weight: 700;
  letter-spacing: -0.5px;
  line-height: 1.05;
  color: var(--lantern-navy);
}

/* The left pane of the job posting, with the job posting details */
.ashby-job-posting-left-pane {
  background: var(--lantern-panel);
  border: 1px solid #edf1f6;
  border-radius: var(--borderRadiusContainer);
  padding: 22px 22px 24px;
  align-self: flex-start;
}
.ashby-job-posting-left-pane h2 {
  font-family: var(--lantern-display);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: #6d7f93;
  margin-bottom: 6px;
}
.ashby-job-posting-left-pane p,
.ashby-job-posting-left-pane li {
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--lantern-muted);
}
/* The value directly under each label (location, type, department) */
.ashby-job-posting-left-pane h2 + p {
  font-size: 15px;
  font-weight: 600;
  color: var(--lantern-ink);
}
.ashby-job-posting-left-pane li > span:first-child {
  display: block;
  font-weight: 600;
  color: var(--lantern-ink);
}
.ashby-job-posting-left-pane .ashby-job-posting-brief-department-heading-level {
  color: var(--lantern-ink);
}

/* The container of the job posting description, including the apply button */
.ashby-job-posting-description-container {
  background: transparent;
  padding: 24px 0 0 24px;
}
@media (max-width: 768px) {
  .ashby-job-posting-description-container {
    padding: 24px 0 0;
  }
}

/* The tabs slider in the right pane of the job posting */
.ashby-job-posting-right-pane-tab-slider {
  background: var(--lantern-sky);
}
.ashby-job-posting-right-pane [role="tab"] {
  font-family: var(--lantern-display);
  font-weight: 600;
}

/* The rich text content of the job posting description */
.ashby-job-posting-description {
  font-size: 15px;
  line-height: 1.65;
  color: var(--lantern-body);
}
.ashby-job-posting-description h1,
.ashby-job-posting-description h2,
.ashby-job-posting-description h3 {
  font-family: var(--lantern-display);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--lantern-sky);
  border-bottom: 1px solid var(--lantern-line);
  padding-bottom: 10px;
  margin: 34px 0 14px;
}
.ashby-job-posting-description h1:first-child,
.ashby-job-posting-description h2:first-child,
.ashby-job-posting-description h3:first-child {
  margin-top: 0;
}
.ashby-job-posting-description strong {
  color: var(--lantern-ink);
}
.ashby-job-posting-description a {
  color: var(--lantern-sky);
  text-underline-offset: 2px;
}
.ashby-job-posting-description ul {
  list-style: none;
  padding-left: 0;
}
.ashby-job-posting-description ul > li {
  position: relative;
  padding-left: 22px;
  margin-bottom: 12px;
  line-height: 1.55;
}
/* Sky diamond bullet, same as the original role pages */
.ashby-job-posting-description ul > li::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 2px;
  width: 7px;
  height: 7px;
  background: var(--lantern-sky);
  transform: rotate(45deg);
}
.ashby-job-posting-description ul > li > p {
  margin: 0;
}

/* ================================================================
 * Application form
 * ================================================================ */

/* A container for the application form. */
.ashby-application-form-container {
  background: #fff;
  border: 1px solid var(--lantern-line);
  border-radius: 16px;
  padding: 36px;
  box-shadow: 0 10px 40px rgba(8, 17, 32, 0.06);
}
@media (max-width: 520px) {
  .ashby-application-form-container {
    padding: 24px 20px;
  }
}

/* The resume uploader to auto-fill the application form */
.ashby-application-form-autofill-input-root {
  background: var(--lantern-panel);
  border: 1px dashed #c4ccd6;
  border-radius: var(--borderRadiusContainer);
}
.ashby-application-form-autofill-input-title {
  font-family: var(--lantern-display);
  font-weight: 700;
  color: var(--lantern-navy);
}
.ashby-application-form-autofill-input-description {
  color: var(--lantern-muted);
}
.ashby-application-form-autofill-input-icon {
  color: var(--lantern-sky);
}

/* The title for an application form section. */
.ashby-application-form-section-header-title {
  font-family: var(--lantern-display);
  font-size: 22px;
  font-weight: 700;
  color: var(--lantern-navy);
}
.ashby-application-form-section-header-description {
  color: var(--lantern-muted);
  font-size: 15px;
  line-height: 1.5;
}

/* A container for the label and input on an application form. */
.ashby-application-form-field-entry {
  margin-bottom: 18px;
}

/* The title of each question on an application form. */
.ashby-application-form-question-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--lantern-ink);
}

/* The description of each question on an application form. */
.ashby-application-form-question-description {
  font-size: 13px;
  color: var(--lantern-muted);
}

/* Text, textarea, dropdown, date and autocomplete inputs */
.ashby-application-form-input-text,
.ashby-application-form-input-textarea,
.ashby-application-form-input-dropdown-select,
.ashby-application-form-input-date,
.ashby-application-form-input-autocomplete {
  font-family: var(--fontFamily);
  font-size: 15px;
  color: var(--lantern-ink);
  background: #fff;
  border: 1px solid var(--lantern-control);
  border-radius: var(--borderRadiusControl);
  box-shadow: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.ashby-application-form-input-text:focus,
.ashby-application-form-input-textarea:focus,
.ashby-application-form-input-dropdown-select:focus,
.ashby-application-form-input-date:focus,
.ashby-application-form-input-autocomplete:focus,
.ashby-application-form-input-autocomplete[aria-expanded="true"] {
  outline: none;
  border-color: var(--lantern-sky);
  box-shadow: 0 0 0 3px rgba(0, 176, 255, 0.15);
}
.ashby-application-form-input-dropdown-icon {
  color: var(--lantern-muted);
}

/* Popups */
.ashby-application-form-input-autocomplete-popup,
.ashby-application-form-input-date-popup {
  border: 1px solid var(--lantern-line);
  border-radius: var(--borderRadiusControl);
  box-shadow: 0 10px 30px rgba(8, 17, 32, 0.1);
}
.ashby-application-form-input-autocomplete-popup-result[aria-selected="true"] {
  background: var(--lantern-sky-tint);
  color: var(--lantern-navy);
}

/* File inputs (resume, cover letter) */
.ashby-application-form-input-file-dropzone {
  background: var(--lantern-panel);
  border: 1px dashed #c4ccd6;
  border-radius: var(--borderRadiusControl);
  transition: border-color 0.15s, background 0.15s;
}
.ashby-application-form-input-file-dropzone:hover {
  border-color: var(--lantern-sky);
  background: #f0f8fe;
}
.ashby-application-form-input-file-dropzone-instructions {
  color: var(--lantern-muted);
}
.ashby-application-form-input-file-dropzone-upload {
  font-family: var(--fontFamily);
  font-size: 13px;
  font-weight: 600;
  color: var(--lantern-navy);
  background: #fff;
  border: 1px solid var(--lantern-control);
  border-radius: 8px;
}
.ashby-application-form-input-file-item {
  background: #fff;
  border: 1px solid var(--lantern-line);
  border-radius: var(--borderRadiusControl);
}
.ashby-application-form-input-file-item-name {
  color: var(--lantern-ink);
  font-weight: 500;
}

/* Checkbox and radio options */
.ashby-application-form-input-checkbox-group-option-label,
.ashby-application-form-input-radio-group-option-label {
  color: var(--lantern-body);
  font-size: 15px;
}
.ashby-application-form-input-checkbox-group-option-checkbox,
.ashby-application-form-input-radio-group-option-radio {
  accent-color: var(--lantern-sky);
}

/* Yes/No input */
.ashby-application-form-input-yesno-option {
  font-family: var(--lantern-display);
  font-weight: 600;
  color: var(--lantern-ink);
  background: #fff;
  border: 1px solid var(--lantern-control);
  transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.ashby-application-form-input-yesno-option:hover {
  border-color: var(--lantern-sky);
}
.ashby-application-form-input-yesno-option[aria-pressed="true"] {
  background: var(--lantern-sky-tint);
  border-color: var(--lantern-sky);
  color: var(--lantern-navy);
}

/* Education history */
.ashby-application-form-input-education-entry {
  background: var(--lantern-panel);
  border: 1px solid #edf1f6;
  border-radius: var(--borderRadiusControl);
}
.ashby-application-form-input-education-add {
  color: var(--lantern-sky);
  font-weight: 600;
}

/* The text message consent description. */
.ashby-application-form-texting-consent-description,
.ashby-application-blocking-disclosure {
  font-size: 12px;
  line-height: 1.5;
  color: var(--lantern-muted);
}

/* The application submission button. */
.ashby-application-form-submit-button {
  width: 100%;
  padding: 14px 24px;
  font-family: var(--lantern-display);
  font-size: 15px;
  font-weight: 600;
  color: #fff;
  background: var(--lantern-sky);
  border: none;
  border-radius: var(--borderRadiusButton);
  box-shadow: none;
  cursor: pointer;
  transition: background 0.15s, transform 0.15s;
}
.ashby-application-form-submit-button:hover {
  background: var(--lantern-sky-hover);
  transform: translateY(-1px);
}
.ashby-application-form-submit-button:disabled {
  opacity: 0.7;
  cursor: not-allowed;
  transform: none;
}

/* Success / failure / blocked states */
.ashby-application-form-success-container,
.ashby-application-form-failure-container,
.ashby-application-form-blocked-application-container {
  text-align: center;
  padding: 32px 24px;
  border-radius: var(--borderRadiusContainer);
}
.ashby-application-form-success-container {
  background: var(--lantern-sky-tint);
  color: var(--lantern-navy);
}
.ashby-application-form-failure-container {
  background: #fdf0f0;
  color: #d64545;
}
.ashby-application-form-blocked-application-container {
  background: var(--lantern-panel);
  color: var(--lantern-body);
}

/* A container for any surveys specified for this application form. */
.ashby-survey-form-container {
  border-top: 1px solid var(--lantern-line);
  padding-top: 24px;
}
