/* stylelint-disable */
/* Mach9 dark theme for the Ashby job board.
   Strategy: Ashby is fully token-driven. We invert the neutral color scale
   (Neutral000 = surfaces, Neutral800/900 = text) so every card, control, and
   text color flips to a dark theme at once, then set brand + a few specifics. */

:root {
  /* -------- Brand primary (Mach9 "blurple", lightened for dark bg) -------- */
  --colorPrimary600: #6c7aff; /* links, active states, counts, button base */
  --colorPrimary900: #8b97ff; /* button hover/active + focus -> lighter highlight */
  --colorPrimary000: #1a1c2e; /* secondary-button surface (dark tinted) */
  --colorPrimary500A: #6c7aff33;
  --colorPrimaryShadow: #6c7aff59;

  /* -------- Page background -------- */
  --colorAppBackground: #0a0a0a;

  /* -------- Inverted neutral scale (light -> dark) --------
     Default Ashby: 000=#fff (surfaces) ... 800=#373e4d (text).
     We flip it so surfaces are dark and text is light. */
  --colorNeutral000: #121214; /* card / control surface */
  --colorNeutral100: #1a1a1d; /* subtle raised surface */
  --colorNeutral200: #2a2a30; /* borders / dividers */
  --colorNeutral300: #3a3a42; /* control borders */
  --colorNeutral400: #4c4c56; /* strong borders / disabled */
  --colorNeutral500: #6b7280; /* faint text */
  --colorNeutral600: #9aa0ad; /* secondary text */
  --colorNeutral700: #c9ccd3; /* body text */
  --colorNeutral800: #e8eaed; /* strong body text */
  --colorNeutral900: #ffffff; /* headings / high-emphasis text */

  /* Translucent overlays are dark-tinted by default (meant for light bg).
     Flip the common ones to light-tinted so hover states read on dark. */
  --colorNeutral100A: #ffffff0d;
  --colorNeutral200A: #ffffff14;
  --colorNeutral300A: #ffffff1f;
  --colorNeutral400A: #ffffff2e;
  --colorNeutral500A: #ffffff40;
  --colorNeutral600A: #ffffff59;
  --colorNeutral600Transparent: #ffffff26;
  --colorNeutral700A: #ffffffa6;
  --colorNeutral800A: #ffffffd9;

  /* Softer shadow for depth on dark surfaces */
  --colorNeutralShadow: #00000066;

  /* Layout / shape (unchanged from original) */
  --widthMaxJobBoard: 800px;
  --borderRadiusContainer: 10px;
  --borderRadiusControl: 10px;
  --borderRadiusButton: 10px;
  --fontFamily: "Whitney SSm", "-apple-system", "BlinkMacSystemFont", "Segoe UI", "Helvetica", "Arial", "Apple Color Emoji", "Segoe UI Emoji", sans-serif;

  /* Local aliases used below */
  --mach9-blurple: #6c7aff;
  --mach9-blurple-light: #8b97ff;
}

/* ---------------- Override admin theme colors ----------------
   Ashby injects the admin Theme-settings colors as an INLINE style on a
   wrapper element (e.g. --colorPrimary600 / --colorPrimary900), which outranks
   a normal :root rule. An author !important declaration beats inline, so we
   re-assert our brand values on that same element and let them inherit down. */
[style*="--colorPrimary"] {
  --colorPrimary600: #6c7aff !important;
  --colorPrimary900: #8b97ff !important;
}

/* ---------------- Logo ----------------
   The uploaded logo PNGs are dark and disappear on the black background.
   Flatten + invert them to render as clean white. */
img[alt="Mach9"],
img[class*="navLogoWordmarkImage"],
img[class*="navLogoSquareImage"],
img[class*="LogoWordmarkImage"],
img[class*="LogoSquareImage"] {
  filter: brightness(0) invert(1);
}

/* ---------------- Buttons ----------------
   Ashby primary buttons set their text to --colorNeutral000 (dark in this
   theme) and hover to --colorPrimary900. Keep text/icons white in every state;
   the lighter blurple "highlight" on hover comes from --colorPrimary900 above. */
[class*="_button_"][class*="_primary_"],
.ashby-application-form-submit-button {
  color: #ffffff !important;
}

[class*="_button_"][class*="_primary_"] svg,
.ashby-application-form-submit-button svg {
  fill: #ffffff !important;
}

[class*="_button_"]:hover,
[class*="_button_"]:active,
.ashby-application-form-submit-button:hover,
.ashby-application-form-submit-button:active {
  color: #ffffff !important;
}

[class*="_button_"]:hover svg,
[class*="_button_"]:active svg {
  fill: #ffffff !important;
}

/* ---------------- Filters (native <select>) ----------------
   Ashby paints these with a hashed class (background + gradient = Neutral000,
   text = Neutral900). The inverted tokens fix them, but we add explicit,
   higher-specificity rules so the closed control and its option list are
   guaranteed dark with readable text. */
select.ashby-job-board-filter,
.ashby-job-board-filter,
[class*="_filter_"] {
  background-color: var(--colorNeutral000) !important;
  background-image: linear-gradient(to top, var(--colorNeutral000), var(--colorNeutral000) 100%) !important;
  color: var(--colorNeutral900) !important;
  border: 1px solid var(--colorNeutral300) !important;
}

/* Native dropdown option list */
.ashby-job-board-filter option,
[class*="_filter_"] option {
  background-color: #161618;
  color: #ffffff;
}

/* ---------------- Form controls ----------------
   Inputs/textareas/selects inside the application form. */
.ashby-application-form-container input,
.ashby-application-form-container textarea,
.ashby-application-form-container select {
  background-color: var(--colorNeutral100);
  color: var(--colorNeutral900);
  border: 1px solid var(--colorNeutral300);
  border-radius: var(--borderRadiusControl);
}

.ashby-application-form-container input::placeholder,
.ashby-application-form-container textarea::placeholder {
  color: var(--colorNeutral500);
}

.ashby-application-form-container input:focus,
.ashby-application-form-container textarea:focus,
.ashby-application-form-container select:focus {
  border-color: var(--mach9-blurple);
  outline: none;
  box-shadow: 0 0 0 2px rgba(108, 122, 255, 0.35);
}

/* ---------------- Job list cards ---------------- */
.ashby-job-posting-brief {
  margin-bottom: 10px;
  background-color: var(--colorNeutral000);
  border: 1px solid var(--colorNeutral200);
  border-radius: var(--borderRadiusContainer);
}

.ashby-job-posting-brief:hover {
  border-color: var(--mach9-blurple);
  background-color: var(--colorNeutral100);
}

/* ---------------- Autofill / resume box ---------------- */
.ashby-application-form-autofill-input-base-layer,
.ashby-application-form-autofill-input-root,
.ashby-application-form-autofill-uploader {
  background-color: var(--colorNeutral000);
  border: 1px dashed var(--colorNeutral300);
  color: var(--colorNeutral800);
}

.ashby-application-form-autofill-input-icon {
  color: var(--mach9-blurple-light);
}

/* ---------------- Submit button base ---------------- */
.ashby-application-form-submit-button {
  background-color: var(--colorPrimary600);
  border: none;
  border-radius: var(--borderRadiusButton);
}