/* ==========================================================================
   Flux.ai-inspired theme for Ashby job board (Ashby-safe selectors)
   Brand accent: #1DFDC0
   Brand dark: #1D1B3E
   --------------------------------------------------------------------------
   Usage:
   - Host this file somewhere public (e.g. your site, S3).
   - In Ashby Admin → Job Boards → Theme → Custom CSS URL, point to this file.
   ========================================================================== */

/* stylelint-disable */

/* ---------- Ashby theme variables ---------------------------------------- */

:root {
  /* Primary colors used by Ashby's built-in theme tokens */
  --colorPrimary900: #1D1B3E; /* darker primary (brand dark) */
  --colorPrimary600: #1DFDC0; /* lighter primary (brand accent) */

  /* Job board & app widths */
  --widthMaxJobBoard: 960px;
  /* --widthMaxJobBoardApplicationForm: 800px; */

  /* Radii */
  --borderRadiusContainer: 14px;
  --borderRadiusControl: 999px;
  --borderRadiusButton: 999px;

  /* Font family */
  --fontFamily: Montserrat, sans-serif;

  /* Background color behind the entire job board */
  --colorAppBackground: #100f0f;

  --colorNeutral200: #232323;
}

/* ---------- Custom design tokens ----------------------------------------- */

:root {
  --flux-bg: #100f0f;               /* page background (near-black / space) */
  --flux-bg-elevated: #0a0a0a;      /* cards / panels */
  --flux-bg-elevated-soft: #0a0a0a; /* softer slightly lighter card */
  --flux-bg-soft: #151515;          /* subtle contrast background */
  --flux-border-subtle: #2b2b2b;
  --flux-border-strong: #464646;

  --flux-text: #f9fafb;
  --flux-text-strong: #d3d3d3;
  --flux-text-muted: #d3d3d3;
  --flux-text-soft: #8d8d8d;

  --flux-accent: #1DFDC0;           /* main brand accent */
  --flux-accent-soft: rgba(73, 73, 73, 0.18);
  --flux-accent-strong: #1DFDC0;

  --flux-danger: #f97373;

  --flux-radius-sm: 4px;
  --flux-radius-md: 8px;
  --flux-radius-lg: 12px;

  --flux-shadow-soft: 0 20px 45px rgba(0, 0, 0, 0.55);
  --flux-shadow-subtle: 0 8px 22px rgba(0, 0, 0, 0.45);

  --flux-font-sans: var(--fontFamily);
}

/* ---------- Global layout & typography ----------------------------------- */

html,
body {
  margin: 0;
  padding: 0;
  background-color: var(--flux-bg);
  color: var(--flux-text-muted);
  font-family: var(--flux-font-sans);
  -webkit-font-smoothing: antialiased;
}
a:visited {
  color: var(--colorPrimary600) !important;
}

/* Top Nav with Blur Effects */
div[class^="_navRoot"] {
  position: sticky;
  top: 0;
  z-index: var(--zOnHoverSelect);
  backdrop-filter: blur(10px);
  background-color: #100f0fcc;
}

/* Overview and Application */
.ashby-job-posting-right-pane [role*="tablist"] {
      margin-top: 0px !important;
    }

    /* Active tab indicator */
.ashby-job-posting-right-pane [role*="tablist"] [class*="_slider"] {
      background-color: #1DFDC0 !important;
    }

/* Overview and Application tabs on responsive */
@media only screen and (max-width: 767px) {
    .ashby-job-posting-right-pane [role*="tablist"] {
      background-color: #111111 !important;
      box-shadow: none !important;
      border-top-left-radius: 0px !important;
      border-top-right-radius: 0px !important;
    }
}

@media only screen and (max-width: 767px) {
    .ashby-job-posting-right-pane [class*="_container"] {
      box-shadow: none !important;
    }
}

/* Apply for this job button CTA in overview */
a[class^=" _container"] [class^="_button"] {
  color: #000000 !important;
  box-shadow: none !important;
  border: 0px !important;
  background-color: #1DFDC0 !important;
}

/* Job board main heading */
.ashby-job-board-heading {
  font-size: 1.5rem;
  color: var(--flux-text-strong);
  font-weight: 650;
  letter-spacing: 0.01em;
  margin-bottom: 4px;
}

/* Count under heading */
.ashby-job-board-heading-count {
  color: var(--flux-text-soft);
  font-size: 0.85rem;
}

/* Department / team headings */
.ashby-department-heading,
.ashby-department-heading-level {
    font-size: 1.2rem;
    color: #898989;
    margin-top: 24px;
    margin-bottom: 8px;
    font-weight: 500;
}

/* ---------- Filter bar --------------------------------------------------- */

.ashby-job-board-filters-label {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--flux-text-soft);
  font-size: 0.88rem;
}

/* “Reset filters” link */
.ashby-job-board-reset-filters-label {
  cursor: pointer;
  color: var(--flux-text-soft);
  font-size: 0.88rem;
}

.ashby-job-board-reset-filters-label:hover {
  color: var(--flux-accent);
}

/* Individual filter controls (e.g., select dropdowns) */
.ashby-job-board-filter {
  background-color: var(--flux-bg-elevated);
  border-radius: var(--borderRadiusControl);
  border: 1px solid var(--flux-border-subtle);
  color: var(--flux-text-muted);
  padding: 8px 14px;
  font-family: var(--flux-font-sans);
  font-size: 0.9rem;
  min-width: 160px;
  outline: none;
}

/* ---------- Buttons ------------------------------------------------------ */

.ashby-job-posting-right-pane-application-tab,
.ashby-job-posting-right-pane-overview-tab {
  appearance: none;
  border-radius: var(--borderRadiusButton);
  border: 1px solid var(--flux-accent);
  background: radial-gradient(circle at 0% 0%, var(--flux-accent-soft), #050816);
  color: var(--flux-text-strong);
  font-family: var(--flux-font-sans);
  font-weight: 550;
  font-size: 0.95rem;
  padding: 9px 18px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition:
    background 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.08s ease,
    border-color 0.18s ease,
    color 0.18s ease;
}

/* .ashby-job-board-back-to-all-jobs-button {
}
 */

.ashby-application-form-submit-button {
  /* add-ons */
  padding: 16px !important;
  font-size: 0.95rem;
  appearance: none;
  border-radius: var(--borderRadiusButton);
  border: 1px solid var(--flux-accent);
  color: var(--flux-text-strong);
  font-family: var(--flux-font-sans);
  font-weight: 550;
  padding: 9px 18px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition:
    background 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.08s ease,
    border-color 0.18s ease,
    color 0.18s ease;
}


/* Tabs (Overview / Application) */
.ashby-job-posting-right-pane-application-tab,
.ashby-job-posting-right-pane-overview-tab {
  background: transparent;
  border-color: transparent;
  color: var(--flux-text-soft);
  border-radius: 999px;
  padding-inline: 14px;
}

.ashby-job-posting-right-pane-application-tab[data-state="active"],
.ashby-job-posting-right-pane-overview-tab[data-state="active"] {
  color: var(--flux-text-strong);
  border-color: var(--flux-accent);
  background-color: var(--flux-accent-soft);
}

/* Primary submit / back hover */
.ashby-application-form-submit-button:hover,
.ashby-application-form-submit-button:focus-visible,
.ashby-job-board-back-to-all-jobs-button:hover,
.ashby-job-board-back-to-all-jobs-button:focus-visible {
  background: linear-gradient(135deg, var(--flux-accent-strong), #13a37f);
  border-color: var(--flux-accent-strong);
  box-shadow: var(--flux-shadow-soft);
  transform: translateY(-1px);
}

/* ---------- Job list view ------------------------------------------------ */

.ashby-job-posting-brief-list {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

/* Card background & text – make it dark so white text is readable */
.ashby-job-posting-brief {
  border-radius: var(--flux-radius-md);
  border: 0px solid var(--flux-border-subtle);
  background-color: var(--flux-bg-elevated-soft);
  padding: 18px 20px;
  margin-bottom: 16px;
  box-shadow: var(--flux-shadow-subtle);
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: var(--flux-text-muted);
}

/* Slightly brighter on hover, but still dark */
.ashby-job-posting-brief:hover {
  background-color: #030303;
  border-color: var(--flux-accent-soft);
}

/* Title inside list row – strong contrast */
.ashby-job-posting-brief-title {
  font-size: 1.05rem;
  color: var(--colorPrimary600);
}

/* Meta (location / team / type) */
.ashby-job-posting-brief-details {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--flux-text-soft);
}

/* ---------- Job detail view ---------------------------------------------- */

.ashby-job-posting-header {
  margin-bottom: 16px;
}

/* Main job title */
.ashby-job-posting-heading {
  font-size: 2.1rem;
  color: var(--flux-text-strong);
  font-weight: 650;
  letter-spacing: 0.01em;
  margin-bottom: 4px;
}

/* Left (description) pane */
.ashby-job-posting-left-pane {
  background-color: var(--flux-bg-elevated);
  border-radius: var(--flux-radius-md);
  border: 0px;
  padding: 22px 24px;
  color: var(--flux-text-muted);
}

/* right (tabs/app) panes */
.ashby-job-posting-right-pane {
  background-color: var(--flux-bg-elevated);
  border-radius: var(--flux-radius-md);
  border: 1px solid var(--flux-border-subtle);
  box-shadow: var(--flux-shadow-soft);
  padding: 22px 24px;
  margin-top: 24px;
  color: var(--flux-text-muted);
}

/* Nuke any inner white boxes that Ashby may add so text isn't white-on-white */
.ashby-job-posting-left-pane *,
.ashby-job-posting-right-pane * {
  background-color: transparent;
}

/* Paragraphs & lists in description area */
.ashby-job-posting-left-pane p,
.ashby-job-posting-left-pane li {
  color: var(--flux-text-muted);
  font-size: 0.95rem;
  line-height: 1.6;
}

/* Section headings (“Responsibilities”, etc.) */
.ashby-job-posting-left-pane h3 {
  margin-top: 22px;
  font-size: 1.05rem;
  color: var(--flux-text-strong);
}

/* Lists in job description */
.ashby-job-posting-left-pane ul,
.ashby-job-posting-left-pane ol {
  margin-left: 0;
  padding-left: 0;
}

.ashby-job-posting-left-pane ul li,
.ashby-job-posting-left-pane ol li {
  margin-bottom: 6px;
  position: relative;
  padding-left: 1.2em;
}

.ashby-job-posting-left-pane ul li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: var(--flux-accent);
}

/* Links in description section */
.ashby-job-posting-left-pane a {
  color: var(--flux-accent);
}

.ashby-job-posting-left-pane a:hover,
.ashby-job-posting-left-pane a:focus-visible {
  color: var(--flux-accent-strong);
}

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

.ashby-application-form-container {
  margin-top: 16px;
}

/* Form sections */
.ashby-application-form-section-container {
  margin-bottom: 18px;
}

.ashby-application-form-section-header-title {
  font-size: 0.95rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--flux-text-soft);
}

.ashby-application-form-section-header-description {
  font-size: 0.85rem;
  color: var(--flux-text-soft);
}

/* Fields */
.ashby-application-form-field-entry label,
.ashby-application-form-question-title {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--flux-text-soft);
  display: block;
  margin-bottom: 4px;
}

.ashby-application-form-field-entry input[type="text"],
.ashby-application-form-field-entry input[type="email"],
.ashby-application-form-field-entry input[type="tel"],
.ashby-application-form-field-entry input[type="url"],
.ashby-application-form-field-entry textarea,
.ashby-application-form-field-entry select {
  width: 100%;
  background-color: var(--flux-bg-soft);
  border-radius: var(--flux-radius-sm);
  border: 1px solid var(--flux-border-subtle);
  color: var(--flux-text-muted);
  padding: 9px 12px;
  font-family: var(--flux-font-sans);
  font-size: 0.9rem;
  box-sizing: border-box;
}

/* Placeholder text */
.ashby-application-form-field-entry input::placeholder,
.ashby-application-form-field-entry textarea::placeholder {
  color: var(--flux-text-soft);
}

/* Autofill widget */
.ashby-application-form-autofill-input-root {
  border-radius: var(--flux-radius-md);
  border: 1px dashed var(--flux-border-subtle);
  background-color: #1e332d;
  padding: 12px 14px;
}

.ashby-application-form-autofill-input-title {
  color: var(--flux-text-strong);
  font-size: 0.9rem;
}

.ashby-application-form-autofill-input-description {
  font-size: 0.85rem;
  color: var(--flux-text-soft);
}

/* Alerts / error text */
.ashby-application-form-autofill-input-form-alert,
[role="alert"],
[class*="error-message"] {
  color: var(--flux-danger);
  font-size: 0.78rem;
  margin-top: 4px;
  background-color: #191919;
  box-shadow: none !important;
  border-radius: var(--flux-radius-md);
}

/* Submit button spacing */
.ashby-application-form-submit-button {
  margin-top: 18px;
}

/* ---------- Success / failure / blocked containers ----------------------- */

.ashby-application-form-success-container,
.ashby-application-form-failure-container,
.ashby-application-form-blocked-application-container {
  border-radius: var(--flux-radius-md);
  border: 1px solid var(--flux-border-subtle);
  background-color: var(--flux-bg-elevated);
  padding: 16px 18px;
  box-shadow: var(--flux-shadow-subtle);
}

/* ---------- Surveys ------------------------------------------------------- */

.ashby-survey-form-container {
  margin-top: 24px;
  border-radius: var(--flux-radius-md);
  border: 1px solid var(--flux-border-subtle);
  background-color: var(--flux-bg-elevated);
  padding: 16px 18px;
}

/* ---------- Responsiveness ----------------------------------------------- */

@media (max-width: 640px) {
  .ashby-job-posting-left-pane,
  .ashby-job-posting-right-pane {
    padding: 16px 14px;
  }

  .ashby-job-posting-brief {
    padding: 14px 14px;
  }

  .ashby-job-posting-brief-details {
    flex-direction: column;
    align-items: flex-start;
  }
}