/* ============================================================
   Arch — Ashby Job Board Custom CSS  (allowlist-compliant)
   Paste into: Ashby Admin → Job Boards → Theme (Job Board)
   → Custom CSS
   ------------------------------------------------------------
   Concept: "Document on the Desk". The application form must
   look like a continuation of the job detail on getarch.com
   /careers. Off-white surface, white inner card, near-black
   ink, Electric Blue accent only on focus/links.
   ------------------------------------------------------------
   Ashby only allows :root variables + specific .ashby-* classes.
   No html/body, no [class*=], no element selectors.
   ------------------------------------------------------------
   TOKEN CONTRACT — keep in sync with src/index.css (#ashby_embed)
   surface     #F7F8FB          inner card  #FFFFFF
   border      #E5E7EB          ink         #0F172A
   ink-muted   #4B5563          accent      #2563EB
   container r 14px             button r    10px
   ============================================================ */

:root {
  /* Layout + geometry */
  --widthMaxJobBoard: 100%;
  --borderRadiusContainer: 14px;
  --borderRadiusControl: 10px;
  --borderRadiusButton: 10px;

  /* Typography */
  --fontFamily: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter", "Segoe UI", Helvetica, Arial, sans-serif;

  /* Surface — page + neutral backgrounds */
  --colorAppBackground: #F7F8FB;
  --colorNeutral000: #FFFFFF;
  --colorNeutral100: #F7F8FB;
  --colorNeutral200: #EEF1F5;
  --colorNeutral300: #E5E7EB;
  --colorNeutral400: #D1D5DB;
  --colorNeutral500: #9CA3AF;
  --colorNeutral600: #6B7280;
  --colorNeutral700: #4B5563;
  --colorNeutral800: #1F2937;
  --colorNeutral900: #0F172A;

  /* Brand accent (Electric Blue) */
  --colorPrimary100: #EFF6FF;
  --colorPrimary200: #DBEAFE;
  --colorPrimary300: #BFDBFE;
  --colorPrimary400: #60A5FA;
  --colorPrimary500: #3B82F6;
  --colorPrimary600: #2563EB;
  --colorPrimary700: #1D4ED8;
  --colorPrimary800: #1E40AF;
  --colorPrimary900: #1E3A8A;
  --colorPrimaryHover: #1D4ED8;

  /* Text colors */
  --colorTextHeader: #0F172A;
  --colorTextBody: #0F172A;
  --colorTextSecondary: #4B5563;
}

/* ---------- Headings ---------- */
.ashby-job-board-heading {
  color: #0F172A;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.ashby-job-board-heading-count {
  color: #4B5563;
  font-weight: 400;
}
.ashby-job-posting-heading {
  color: #0F172A;
  font-weight: 600;
  letter-spacing: -0.01em;
}

/* ---------- Department / team headings ---------- */
.ashby-department-heading,
.ashby-job-posting-brief-department-heading {
  color: #4B5563;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 600;
  margin: 1.75rem 0 0.75rem;
}
.ashby-department-heading-level,
.ashby-job-posting-brief-department-heading-level {
  color: #4B5563;
  font-weight: 500;
}

/* ---------- Job list ---------- */
.ashby-job-posting-brief-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ashby-job-posting-brief {
  background-color: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 14px;
  padding: 1rem 1.25rem;
  margin-bottom: 0;
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}
.ashby-job-posting-brief:hover {
  transform: translateY(-1px);
  border-color: rgba(37, 99, 235, 0.45);
  box-shadow: 0 14px 30px -18px rgba(37, 99, 235, 0.25);
}
.ashby-job-posting-brief-title {
  color: #0F172A;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.ashby-job-posting-brief-details {
  color: #4B5563;
  font-size: 0.875rem;
}

/* ---------- Filters ---------- */
.ashby-job-board-filter {
  background-color: #FFFFFF;
  border: 1px solid #D1D5DB;
  border-radius: 10px;
  color: #0F172A;
}

/* ---------- Application form ---------- */
.ashby-application-form-container {
  background-color: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 14px;
  padding: 1.5rem;
  box-shadow: 0 12px 30px -22px rgba(15, 23, 42, 0.12);
}
.ashby-application-form-section-container {
  background-color: transparent;
  margin-bottom: 1.25rem;
}
.ashby-application-form-section-header {
  margin-bottom: 0.75rem;
}
.ashby-application-form-section-header-title {
  color: #0F172A;
  font-weight: 600;
  font-size: 1rem;
}
.ashby-application-form-section-header-description {
  color: #4B5563;
  font-size: 0.875rem;
}
.ashby-application-form-field-entry {
  margin-bottom: 1rem;
}
.ashby-application-form-question-title {
  color: #0F172A;
  font-weight: 500;
}
.ashby-application-form-question-description {
  color: #4B5563;
  font-size: 0.8125rem;
}

/* ---------- Submit button ---------- */
.ashby-application-form-submit-button {
  background-color: #0F172A;
  color: #FFFFFF;
  border: 1px solid #0F172A;
  border-radius: 10px;
  font-weight: 600;
  padding: 0.75rem 1.25rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}
.ashby-application-form-submit-button:hover {
  transform: translateY(-1px);
  background-color: #1F2937;
  box-shadow: 0 14px 30px -16px rgba(15, 23, 42, 0.45);
}

/* ---------- Success / failure containers ---------- */
.ashby-application-form-success-container {
  background-color: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 14px;
  padding: 1.5rem;
  color: #0F172A;
}
.ashby-application-form-failure-container {
  background-color: #FEF2F2;
  border: 1px solid #FCA5A5;
  border-radius: 14px;
  padding: 1.5rem;
  color: #991B1B;
}

/* ---------- Surveys ---------- */
.ashby-survey-form-container {
  background-color: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 14px;
  padding: 1.5rem;
}