/* MimoLabs job board: Ashby custom CSS (2026-10-23, v5: button text and icons pinned in every state (rest, hover, focus, active); otherwise v4).
   Dark theme matched to the mimolabs.ai tokens (config-x-marketing/src/styles/tokens.css, B3).
   Upload under Admin > Job Board > Options > Custom CSS, with
   Brand Color = #3569F5 and Brand Color (Dark) = #2459E6 in the two fields above it.
   Proxima Nova is an Adobe Fonts kit and cannot load on Ashby's domain; Montserrat is the site's declared fallback. */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  color-scheme: dark;

  /* Ashby variables */
  --colorAppBackground: #050608;
  --colorPrimary600: #3569F5;
  --colorPrimary900: #2459E6;
  --widthMaxContent: 880px;
  --widthMaxJobBoard: 880px;
  --widthMaxSubscriptionPreferences: 600px;
  --borderRadiusContainer: 16px;
  --borderRadiusControl: 6px;
  --borderRadiusButton: 6px;
  --fontFamily: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* Ashby's own palette, re-pointed at the dark theme so every element it styles itself
     (the mobile tab bar, the mobile filter panel, the back strip, popups, shadows) follows along */
  --colorNeutral000: #0B0F19;
  --colorNeutral100: #101624;
  --colorNeutral200: rgba(255, 255, 255, .08);
  --colorNeutral300: rgba(255, 255, 255, .14);
  --colorNeutral400: #5A6478;
  --colorNeutral500: #7F8AA0;
  --colorNeutral600: #AEB7C9;
  --colorNeutral700: #D5DBE7;
  --colorNeutral800: #EEF1F7;
  --colorNeutral100A: rgba(255, 255, 255, .03);
  --colorNeutral200A: rgba(255, 255, 255, .06);
  --colorNeutral300A: rgba(255, 255, 255, .10);
  --colorNeutral400A: rgba(255, 255, 255, .14);
  --colorNeutral500A: rgba(255, 255, 255, .20);
  --colorNeutral600A: rgba(255, 255, 255, .30);
  --colorNeutral700A: rgba(255, 255, 255, .45);
  --colorNeutral800A: rgba(255, 255, 255, .60);
  --colorNeutral100Transparent: rgba(16, 22, 36, 0);
  --colorNeutral600Transparent: rgba(174, 183, 201, .25);
  --colorNeutralShadow: rgba(0, 0, 0, .5);
  --colorInfo100: #0E1630;
  --colorInfo200: #111A38;
  --colorInfo300: #142040;
  --colorInfo400: #182748;

  /* MimoLabs tokens */
  --mimo-ground: #050608;
  --mimo-core: #0B0F19;
  --mimo-core-2: #101624;
  --mimo-surface: #141C2E;
  --mimo-hair: rgba(255, 255, 255, .08);
  --mimo-hair-2: rgba(255, 255, 255, .14);
  --mimo-text: #EEF1F7;
  --mimo-text-2: #D5DBE7;
  --mimo-text-3: #AEB7C9;
  --mimo-text-4: #7F8AA0;
  --mimo-link: #7FA2FF;
  --mimo-link-hover: #B3C6FF;
  --mimo-signal: #2459E6;
  --mimo-signal-2: #3569F5;
  --mimo-eyebrow: #9DB3EE;
  --mimo-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
}

/* ── Page ── */
html, body {
  background: var(--mimo-ground) !important;
  color: var(--mimo-text);
  font-family: var(--fontFamily);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
::selection { background: rgba(127, 162, 255, .3); color: var(--mimo-text); }
a { color: var(--mimo-link); text-decoration: none; }
a:hover { color: var(--mimo-link-hover); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--mimo-link);
  outline-offset: 3px;
}
hr { border: 0; border-top: 1px solid var(--mimo-hair); }
footer { border-top: 1px solid var(--mimo-hair) !important; }
footer, footer a { color: var(--mimo-text-4); }
footer a:hover { color: var(--mimo-link-hover); }

/* ── Logo: the mark + wordmark lockup (hiring/ashby/mimolabs-lockup@2x.png), sized like the site nav ── */
img[alt="MimoLabs"] { height: 36px !important; width: auto !important; max-height: none !important; }

/* ── Job board (the list) ── */
.ashby-job-board-heading {
  color: var(--mimo-text);
  font-weight: 700;
  letter-spacing: -.035em;
  font-size: 32px;
}
.ashby-job-board-heading-count {
  color: var(--mimo-text-4);
  font-family: var(--mimo-mono);
  font-weight: 400;
  font-size: 14px;
}
.ashby-job-board-filters-label,
.ashby-job-board-reset-filters-label { color: var(--mimo-text-4); font-size: 13px; }
.ashby-job-board-filter {
  background: var(--mimo-core-2);
  color: var(--mimo-text-2);
  border: 1px solid var(--mimo-hair-2);
  border-radius: var(--borderRadiusControl);
}

.ashby-department-heading,
.ashby-job-posting-brief-department-heading {
  color: var(--mimo-eyebrow);
  font-family: var(--mimo-mono);
  font-weight: 500;
  font-size: 11.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.ashby-department-heading-level,
.ashby-job-posting-brief-department-heading-level { color: var(--mimo-text-3); font-size: 13px; }

.ashby-job-posting-brief {
  background: var(--mimo-core);
  border: 1px solid var(--mimo-hair);
  border-radius: var(--borderRadiusContainer);
  padding: 20px 22px;
  margin-bottom: 12px;
  transition: border-color .3s ease, background .3s ease;
}
.ashby-job-posting-brief:hover { border-color: var(--mimo-hair-2); background: var(--mimo-core-2); }
.ashby-job-posting-brief-title { color: var(--mimo-text); font-weight: 600; font-size: 18px; letter-spacing: -.01em; }
.ashby-job-posting-brief-details { color: var(--mimo-text-4); font-size: 14px; }

/* ── Containers (Ashby's white cards carry data-highlight; the detail pane, the description and the form are all this) ── */
[data-highlight] {
  background: var(--mimo-core) !important;
  border: 1px solid var(--mimo-hair) !important;
  border-radius: var(--borderRadiusContainer) !important;
  color: var(--mimo-text-2);
}

/* ── Job posting page ── */
.ashby-job-posting-header { background: var(--mimo-ground) !important; border-bottom: 1px solid var(--mimo-hair); }
.ashby-job-posting-header a { color: var(--mimo-text-3); }
.ashby-job-posting-header a:hover { color: var(--mimo-link-hover); }

/* the detail pane: label and value per section, hairline between sections */
.ashby-job-posting-left-pane { background: var(--mimo-core) !important; color: var(--mimo-text-2); }
.ashby-job-posting-left-pane > div { border-color: var(--mimo-hair) !important; }
.ashby-job-posting-left-pane h2 {
  color: var(--mimo-text-4);
  font-family: var(--mimo-mono);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.ashby-job-posting-left-pane p { color: var(--mimo-text-2); font-size: 15px; }

/* the tabs */
.ashby-job-posting-right-pane nav[role="tablist"] a { color: var(--mimo-text-4); }
.ashby-job-posting-right-pane nav[role="tablist"] a[aria-selected="true"] { color: var(--mimo-text); }
.ashby-job-posting-right-pane-overview-tab,
.ashby-job-posting-right-pane-application-tab { font-weight: 600; }
.ashby-job-posting-right-pane-tab-slider { background: var(--mimo-link) !important; border: 0 !important; border-radius: 2px !important; }
.ashby-job-posting-heading {
  color: var(--mimo-text);
  font-weight: 700;
  letter-spacing: -.035em;
  font-size: 34px;
  line-height: 1.15;
}
.ashby-job-board-back-to-all-jobs-button { color: var(--mimo-link); font-weight: 500; }
.ashby-job-board-back-to-all-jobs-button:hover { color: var(--mimo-link-hover); }
.ashby-job-posting-left-pane { color: var(--mimo-text-3); font-size: 14px; }
.ashby-job-posting-left-pane a { color: var(--mimo-link); }

.ashby-job-posting-description-container { background: var(--mimo-core); border: 1px solid var(--mimo-hair); border-radius: var(--borderRadiusContainer); }
.ashby-job-posting-description { color: var(--mimo-text-2); font-size: 16px; line-height: 1.6; }
.ashby-job-posting-description h1,
.ashby-job-posting-description h2,
.ashby-job-posting-description h3 { color: var(--mimo-text); font-weight: 600; letter-spacing: -.02em; }
.ashby-job-posting-description h2 { font-size: 20px; margin-top: 32px; }
.ashby-job-posting-description h3 { font-size: 17px; margin-top: 24px; }
.ashby-job-posting-description p, .ashby-job-posting-description li { max-width: 70ch; }
.ashby-job-posting-description strong { color: var(--mimo-text); font-weight: 600; }
.ashby-job-posting-description a { color: var(--mimo-link); text-decoration: underline; text-underline-offset: 3px; }
.ashby-job-posting-description hr { border: 0; border-top: 1px solid var(--mimo-hair); }


/* ── Application form ── */
.ashby-application-form-container,
.ashby-application-form-success-container,
.ashby-application-form-failure-container,
.ashby-application-form-blocked-application-container,
.ashby-survey-form-container {
  background: var(--mimo-core);
  border: 1px solid var(--mimo-hair);
  border-radius: var(--borderRadiusContainer);
  color: var(--mimo-text-2);
}
.ashby-application-form-section-header-title { color: var(--mimo-text); font-weight: 600; font-size: 18px; letter-spacing: -.01em; }
.ashby-application-form-section-header-description { color: var(--mimo-text-4); }
.ashby-application-form-question-title { color: var(--mimo-text); font-weight: 600; font-size: 14px; }
.ashby-application-form-question-description,
.ashby-application-form-texting-consent-description,
.ashby-application-blocking-disclosure { color: var(--mimo-text-4); font-size: 13px; }

.ashby-application-form-input-text,
.ashby-application-form-input-textarea,
.ashby-application-form-input-dropdown,
.ashby-application-form-input-dropdown-select,
.ashby-application-form-input-date,
.ashby-application-form-input-autocomplete {
  background: var(--mimo-core-2);
  color: var(--mimo-text);
  border: 1px solid var(--mimo-hair-2);
  border-radius: var(--borderRadiusControl);
}
.ashby-application-form-input-text::placeholder,
.ashby-application-form-input-textarea::placeholder { color: var(--mimo-text-4); }
.ashby-application-form-input-textarea { resize: vertical; min-height: 120px; }
.ashby-application-form-input-dropdown-icon { color: var(--mimo-text-3); }

.ashby-application-form-input-autocomplete-popup,
.ashby-application-form-input-date-popup {
  background: var(--mimo-core-2);
  color: var(--mimo-text-2);
  border: 1px solid var(--mimo-hair-2);
  border-radius: var(--borderRadiusControl);
}
.ashby-application-form-input-autocomplete-popup-result[aria-selected="true"] { background: var(--mimo-surface); color: var(--mimo-text); }
.ashby-application-form-input-autocomplete-popup-empty,
.ashby-application-form-input-autocomplete-popup-loading { color: var(--mimo-text-4); }
.ashby-application-form-input-date-popup-title { color: var(--mimo-text); }
.ashby-application-form-input-date-popup-header-button { color: var(--mimo-link); }

/* the resume field: the outer box is the drop zone; the inner block only holds the button and the hint */
.ashby-application-form-input-file {
  background: var(--mimo-core-2) !important;
  border: 1px dashed var(--mimo-hair-2) !important;
  border-radius: var(--borderRadiusControl) !important;
  padding: 18px !important;
  color: var(--mimo-text-3);
  transition: border-color .2s ease;
}
.ashby-application-form-input-file:hover { border-color: var(--mimo-link) !important; }
.ashby-application-form-input-file-dropzone {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
}
.ashby-application-form-input-file-dropzone-instructions { color: var(--mimo-text-4); margin: 0; }
.ashby-application-form-input-file-dropzone-upload,
.ashby-application-form-input-education-add {
  background: transparent !important;
  border: 1px solid var(--mimo-link) !important;
  border-radius: var(--borderRadiusButton) !important;
  color: var(--mimo-link) !important;
  font-weight: 600;
  padding: 9px 16px;
}
.ashby-application-form-input-file-dropzone-upload:hover,
.ashby-application-form-input-education-add:hover { background: rgba(127, 162, 255, .12) !important; }
.ashby-application-form-input-file-item { background: var(--mimo-surface); border-radius: var(--borderRadiusControl); color: var(--mimo-text-2); }
.ashby-application-form-input-file-item-name { color: var(--mimo-text); }
.ashby-application-form-input-file-item-delete,
.ashby-application-form-input-education-entry-delete { color: var(--mimo-text-4); }
.ashby-application-form-input-education-entry { background: var(--mimo-core-2); border: 1px solid var(--mimo-hair); border-radius: var(--borderRadiusControl); }
.ashby-application-form-input-education-entry-header { color: var(--mimo-text); }

.ashby-application-form-input-checkbox-group-option-label,
.ashby-application-form-input-radio-group-option-label { color: var(--mimo-text-2); }
/* yes / no: two separate pills with a gap, not one split box */
.ashby-application-form-input-yesno {
  display: flex !important;
  gap: 10px;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.ashby-application-form-input-yesno-option {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 96px;
  padding: 10px 24px !important;
  background: var(--mimo-core-2) !important;
  color: var(--mimo-text-2) !important;
  border: 1px solid var(--mimo-hair-2) !important;
  border-radius: var(--borderRadiusControl) !important;
  font-weight: 600;
  transition: border-color .2s ease, background .2s ease, color .2s ease;
}
.ashby-application-form-input-yesno-option:hover { border-color: var(--mimo-link) !important; color: var(--mimo-text) !important; }
.ashby-application-form-input-yesno-option[aria-pressed="true"] { background: var(--mimo-signal) !important; border-color: var(--mimo-signal) !important; color: #FFFFFF !important; }

.ashby-application-form-autofill-pane,
.ashby-application-form-autofill-input-root { background: var(--mimo-core-2); border: 1px solid var(--mimo-hair); border-radius: var(--borderRadiusControl); color: var(--mimo-text-2); }
.ashby-application-form-autofill-input-title { color: var(--mimo-text); font-weight: 600; }
.ashby-application-form-autofill-input-description { color: var(--mimo-text-4); }
.ashby-application-form-autofill-input-icon { color: var(--mimo-link); }

.ashby-application-form-submit-button {
  background: var(--mimo-signal);
  color: #FFFFFF;
  border: 0;
  border-radius: var(--borderRadiusButton);
  font-weight: 600;
  letter-spacing: 0;
  transition: background .3s ease;
}
.ashby-application-form-submit-button:hover { background: var(--mimo-signal-2); }

/* Buttons: Ashby colors button text and icons with neutral000, which this theme turns dark, so every
   state is pinned here. Primary (Apply for this Job, Submit Application) = blue with white text in every
   state; secondary (Upload File, Autofill) = outlined blue at rest, filled blue with white text on hover. */
button[class*="_primary_"], a[class*="_primary_"], .ashby-application-form-submit-button,
button[class*="_primary_"]:hover, a[class*="_primary_"]:hover, .ashby-application-form-submit-button:hover,
button[class*="_primary_"]:focus, a[class*="_primary_"]:focus, .ashby-application-form-submit-button:focus,
button[class*="_primary_"]:active, a[class*="_primary_"]:active, .ashby-application-form-submit-button:active {
  color: #FFFFFF !important;
}
button[class*="_primary_"]:hover, a[class*="_primary_"]:hover, .ashby-application-form-submit-button:hover { background: var(--mimo-signal-2) !important; }
button[class*="_secondary_"], a[class*="_secondary_"],
.ashby-application-form-input-file-dropzone-upload, .ashby-application-form-input-education-add {
  color: var(--mimo-link) !important;
  border-color: var(--mimo-link) !important;
  background: transparent !important;
}
button[class*="_secondary_"]:hover, a[class*="_secondary_"]:hover,
button[class*="_secondary_"]:focus-visible, a[class*="_secondary_"]:focus-visible,
.ashby-application-form-input-file-dropzone-upload:hover, .ashby-application-form-input-education-add:hover {
  color: #FFFFFF !important;
  background: var(--mimo-signal) !important;
  border-color: var(--mimo-signal) !important;
}
button svg, a svg, button svg path, a svg path { fill: currentColor !important; color: inherit !important; }

/* ── Phones ── */
@media only screen and (max-width: 767px) {
  img[alt="MimoLabs"] { height: 30px !important; }
  .ashby-job-board-heading { font-size: 26px; }
  .ashby-job-posting-heading { font-size: 26px; }
  [data-highlight] { border-radius: 12px !important; }
  .ashby-job-posting-right-pane nav[role="tablist"] {
    background: var(--mimo-core) !important;
    box-shadow: none !important;
    border: 1px solid var(--mimo-hair);
    border-bottom: 0;
  }
  div:has(> .ashby-job-board-filters-label),
  div:has(.ashby-job-board-filters-label) { background: var(--mimo-core-2) !important; }
  div:has(.ashby-job-board-filters-label) > button { color: var(--mimo-link); font-weight: 600; }
  .ashby-job-posting-brief { padding: 16px 18px; }
  .ashby-job-posting-description { font-size: 15px; }
  .ashby-application-form-input-yesno-option { flex: 1 1 0 !important; min-width: 0; }
}
