/* =====================================================================
   Bantam Communications: Ashby job board custom CSS
   Source of truth: Bantam Brand Guide (Dialogue Theory, 06.23.25)
   Built against Ashby's documented ashby-* class names. Where Ashby
   exposes no ashby-* class, ARIA attributes or structure are used
   (marked "NO ASHBY CLASS"); re-check those if Ashby changes its markup.

   ASHBY UPLOAD RULE: every selector must START with an ashby-* class
   (or be :root). Element-only or bare pseudo-class rules such as
   "body" or ":focus-visible" are rejected on upload.

   Brand guide type map used below:
     Alliance No 2 = "Platt" (display)   Alliance No 1 = "Text"
     H1  Platt Semi Bold, line-height 96%      -> page headings
     H3  24px Text Bold, line-height 110%      -> department / section headings
     H4  20px Text Bold, line-height 120%      -> job card titles
     Preheading 14px Bold, line-height 96%     -> small labels
     Paragraph 16px Medium                     -> body copy
     Note: the Alliance Text files have no true Bold. Weight 700 uses the
     ExtraBold file (same as the website), so 600 SemiBold is used where
     the website has no Bold equivalent, to keep text from looking heavy.

   Where bantamcommunications.com applies the brand differently from the
   guide, this file follows the WEBSITE (checked 10/23/26):
     - body copy is Regular weight, ~130% line height (guide: Medium, 120%)
     - buttons are flat yellow, Platt Bold, slant = last 11% of the width
       (guide: yellow gradient)
     - form fields get a light tint on focus (fields here are boxed,
       not underline-only, so they are easy to find)
     - small labels are uppercase Text Regular + a yellow "/" accent
       (guide: Bold preheading)
     - borders are solid Almost black; dividers are thin light gray lines
   ===================================================================== */


/* ---------------------------------------------------------------------
   1. FONTS: Alliance No 1 (text) + Alliance No 2 (display/headings)
   Loaded from the same Webflow CDN files bantamcommunications.com uses.
   CONFIRM the Alliance web license covers jobs.ashbyhq.com before
   shipping; if not, remove this block and the fallback stack applies.
   --------------------------------------------------------------------- */
@font-face {
  font-family: "Alliance No 1";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437b5eab72d962ba90f02d_alliance-no-1-regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Alliance No 1";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437b6eb7d511d345b7b00b_alliance-no-1-regular-italic.woff2") format("woff2");
  font-weight: 400; font-style: italic; font-display: swap;
}
@font-face {
  font-family: "Alliance No 1";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437b4ce7979e7eb127eb0f_alliance-no-1-medium.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Alliance No 1";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437c0dd698b23bfcec6f19_alliance-no-1-medium-italic.woff2") format("woff2");
  font-weight: 500; font-style: italic; font-display: swap;
}
@font-face {
  font-family: "Alliance No 1";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437b80cbd479f6d67013c9_alliance-no-1-semibold.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Alliance No 1";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437b101d33cfcad9958c7e_alliance-no-1-extrabold.woff2") format("woff2");
  font-weight: 700 800; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Alliance No 2";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437bbad7b2f174148b8158_alliance-no-2-medium.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Alliance No 2";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437bcd86fbea7825f6e8ef_alliance-no-2-semibold.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Alliance No 2";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437b95ab28fd63a683d894_alliance-no-2-bold.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Alliance No 2";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437b9f1d33cfcad995ba25_alliance-no-2-extrabold.woff2") format("woff2");
  font-weight: 800; font-style: normal; font-display: swap;
}


/* ---------------------------------------------------------------------
   2. THEME VARIABLES
   Ashby's own variables first, then Bantam tokens used below.
   Note: --colorPrimary900/600 are also set in Ashby admin theme
   settings; the values here match what is set there today.
   --------------------------------------------------------------------- */
:root {
  /* Ashby variables */
  --colorAppBackground: #FFFFFF;
  --colorPrimary900: #121921;
  --colorPrimary600: #FCCF2A;
  /* --widthMaxContent / --widthMaxJobBoard left at Ashby's defaults */
  --borderRadiusContainer: 0px;
  --borderRadiusControl: 0px;
  --borderRadiusButton: 0px;
  --fontFamily: "Alliance No 1", "Helvetica Neue", Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji", sans-serif;

  /* Bantam brand tokens (from the brand guide) */
  --bantam-yellow: #FCCF2A;
  --bantam-black: #121921;      /* "Almost black" */
  --bantam-gray: #EDEDED;       /* card backgrounds */
  --bantam-white: #FFFFFF;

  /* Derived tints of Almost black (not new colors) */
  --bantam-black-80: rgba(18, 25, 33, 0.80);
  --bantam-black-65: rgba(18, 25, 33, 0.65);

  --bantam-font-text: "Alliance No 1", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --bantam-font-display: "Alliance No 2", "Alliance No 1", "Helvetica Neue", Helvetica, Arial, sans-serif;

  /* Body line height. Website uses ~1.3; brand guide says 1.2. */
  --bantam-body-line-height: 1.3;

  /* Website button slant: the last 11% of the button's width */
  --bantam-button-slant: polygon(0 0, 89% 0, 100% 100%, 0 100%);

  /* Website divider lines: Almost black at ~35% (shows as light gray) */
  --bantam-divider: rgba(18, 25, 33, 0.35);

  /* Website form fields: tint on focus (Almost black at 11%) */
  --bantam-field-focus: rgba(18, 25, 33, 0.11);
}


/* ---------------------------------------------------------------------
   3. GLOBAL
   --------------------------------------------------------------------- */
/* Font rendering: match the website, which turns on lighter font
   smoothing (-webkit-font-smoothing: antialiased). Without it, macOS
   draws the same font noticeably heavier. Set on the top-level Ashby
   containers so it carries down to all the text inside them. (Ashby
   won't accept a "body" rule, so the containers are listed.) */
.ashby-job-board-back-to-all-jobs-button,
.ashby-job-board-heading,
.ashby-job-board-filters-label,
.ashby-job-board-reset-filters-label,
.ashby-job-board-filter,
.ashby-department-heading,
.ashby-job-posting-brief-list,
.ashby-job-posting-header,
.ashby-job-posting-left-pane,
.ashby-job-posting-right-pane,
.ashby-application-form-container,
.ashby-application-form-success-container {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ACCESSIBILITY: keyboard focus ring. Ashby's default focus ring uses
   the brand yellow, which is only 1.5:1 against white and hard to see.
   These rules replace it with a 2px Almost black ring (17.7:1) on every
   control. (Ashby rejects a single global ":focus-visible" rule, so each
   control is listed.) */
.ashby-job-board-back-to-all-jobs-button:focus-visible,
.ashby-job-board-reset-filters-label:focus-visible,
.ashby-job-board-filter:focus-visible,
.ashby-job-posting-brief-list a:focus-visible,
.ashby-job-posting-right-pane a[role="tab"]:focus-visible,
.ashby-job-posting-right-pane [role="tabpanel"]:focus-visible,
.ashby-job-posting-description a:focus-visible,
.ashby-application-form-container a:focus-visible,
.ashby-application-form-autofill-input-base-layer button:focus-visible,
.ashby-application-form-input-file-dropzone-upload:focus-visible,
.ashby-application-form-input-file-item-delete:focus-visible,
.ashby-application-form-input-education-add:focus-visible,
.ashby-application-form-input-education-entry-delete:focus-visible,
.ashby-application-form-input-date-popup-header-button:focus-visible,
.ashby-application-form-input-yesno-option:focus-visible {
  outline: 2px solid var(--bantam-black) !important;
  outline-offset: 2px;
}

/* Bantam "A" accent: the A turned on its side (">"), pointing at the
   section it introduces. Brand guide, UI Components page. Used on
   department and form section headings only, so job titles below a
   department heading read as listings, not as more headings. */
.ashby-department-heading::before,
.ashby-job-posting-brief-department-heading::before,
.ashby-application-form-section-header-title::before {
  content: "";
  display: block; /* Ashby hides ::before on some headings by default */
  flex: 0 0 auto;
  width: 0.8em;
  height: 0.6em;
  background: var(--bantam-yellow);
  clip-path: polygon(0 0, 42% 0, 100% 50%, 42% 100%, 0 100%, 58% 50%);
  transform: none;
}

/* Small-label style from the website ("HOME /", "EMAIL /"): uppercase
   Alliance Text Regular 14px followed by a yellow slash */
.ashby-job-posting-left-pane h2::after { /* NO ASHBY CLASS: field labels */
  content: "";
  display: inline-block;
  width: 3px;
  height: 0.85em;
  margin-left: 8px;
  vertical-align: -0.05em;
  background: var(--bantam-yellow);
  transform: skewX(-20deg);
}


/* ---------------------------------------------------------------------
   4. JOB BOARD (listing page)
   --------------------------------------------------------------------- */
.ashby-job-board-heading {
  font-family: var(--bantam-font-display);
  font-size: 40px; /* H1 is 64px on the website; scaled down for a job board */
  font-weight: 600;
  line-height: 0.96;
  color: var(--bantam-black);
}

.ashby-job-board-heading-count {
  font-weight: 500;
  color: var(--bantam-black-65);
}

.ashby-job-board-filters-label { /* small label (website style) */
  font-size: 14px;
  font-weight: 400;
  line-height: 0.96;
  text-transform: uppercase;
  color: var(--bantam-black);
}

.ashby-job-board-reset-filters-label {
  color: var(--bantam-black);
  text-decoration: underline;
  text-decoration-color: var(--bantam-yellow);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

/* Filters: square boxes with an Almost black border */
.ashby-job-board-filter {
  border: 1px solid var(--bantam-black);
  border-radius: 0;
  background-color: var(--bantam-white);
  color: var(--bantam-black);
  font-family: var(--bantam-font-text);
}
.ashby-job-board-filter:hover,
.ashby-job-board-filter:focus {
  background-color: var(--bantam-field-focus);
}

/* Department heading (H3) with the Bantam "A" accent */
.ashby-department-heading,
.ashby-job-posting-brief-department-heading {
  font-family: var(--bantam-font-text);
  font-size: 24px;
  font-weight: 700;
  line-height: 1.1;
  color: var(--bantam-black);
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 12px;
}
.ashby-department-heading-level,
.ashby-job-posting-brief-department-heading-level {
  flex: 1 1 auto;
  width: auto;
}

/* Job cards: brand "text only card" (white, solid divider line);
   brand gray on hover */
.ashby-job-posting-brief {
  background: var(--bantam-white);
  border: none;
  border-left: 1px solid var(--bantam-black);
  border-radius: 0;
  /* Ashby bleeds the card 16px left; 16px left padding keeps the
     title aligned with the department heading above it */
  padding: 18px 20px 18px 16px;
  transition: background-color 150ms ease;
}
.ashby-job-posting-brief:hover {
  background: var(--bantam-gray);
}

/* Card title (H4). Yellow text on white fails contrast, so titles use
   Almost black; the yellow underline appears on hover. */
.ashby-job-posting-brief-title {
  font-family: var(--bantam-font-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--bantam-black);
}
.ashby-job-posting-brief:hover .ashby-job-posting-brief-title {
  text-decoration: underline;
  text-decoration-color: var(--bantam-yellow);
  text-decoration-thickness: 3px;
  text-underline-offset: 4px;
}

.ashby-job-posting-brief-details {
  font-size: 14px;
  font-weight: 500;
  color: var(--bantam-black-80);
}

/* NO ASHBY CLASS: the link wrapping each job card, keyboard focus */


/* ---------------------------------------------------------------------
   5. JOB POSTING PAGE
   --------------------------------------------------------------------- */
.ashby-job-board-back-to-all-jobs-button {
  color: var(--bantam-black);
}
.ashby-job-board-back-to-all-jobs-button:hover {
  color: var(--bantam-black-65);
}
.ashby-job-board-back-to-all-jobs-button svg,
.ashby-job-board-back-to-all-jobs-button path {
  fill: currentColor; /* the arrow icon is filled yellow by default */
}

.ashby-job-posting-heading {
  font-family: var(--bantam-font-display);
  font-size: 40px;
  font-weight: 600;
  line-height: 0.96;
  color: var(--bantam-black);
}

/* Left pane: label / value pairs */
.ashby-job-posting-left-pane h2 { /* NO ASHBY CLASS: field labels (small label + slash, see section 3) */
  font-family: var(--bantam-font-text);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2;
  text-transform: uppercase;
  color: var(--bantam-black);
}
.ashby-job-posting-left-pane p,
.ashby-job-posting-left-pane li {
  font-weight: 600;
  color: var(--bantam-black);
}
/* Dividers between the left-pane fields: thin solid light gray line
   (the website's divider gray: Almost black at ~35% opacity) */
.ashby-job-posting-left-pane > div { /* NO ASHBY CLASS */
  border-bottom-style: solid;
  border-bottom-color: var(--bantam-divider);
}

/* Tabs: thin Almost black line across, yellow indicator, bold active tab */
.ashby-job-posting-right-pane nav[role="tablist"] { /* NO ASHBY CLASS */
  border-bottom: 1px solid var(--bantam-black);
}
.ashby-job-posting-right-pane-overview-tab,
.ashby-job-posting-right-pane-application-tab {
  color: var(--bantam-black);
  font-weight: 500;
}
.ashby-job-posting-right-pane a[role="tab"][aria-selected="true"] span {
  color: var(--bantam-black);
  font-weight: 700;
}
.ashby-job-posting-right-pane-tab-slider {
  background: var(--bantam-yellow);
  height: 3px;
  border-radius: 0;
}

/* Description body copy */
.ashby-job-posting-description {
  font-size: 16px;
  font-weight: 400;
  line-height: var(--bantam-body-line-height);
  color: var(--bantam-black);
}
.ashby-job-posting-description h1,
.ashby-job-posting-description h2,
.ashby-job-posting-description h3 {
  font-family: var(--bantam-font-text);
  font-size: 24px;
  font-weight: 700;
  line-height: 1.1;
  color: var(--bantam-black);
  margin-top: 1.75em;
}
.ashby-job-posting-description strong {
  font-weight: 700;
  color: var(--bantam-black);
}
.ashby-job-posting-description a {
  color: var(--bantam-black);
  text-decoration: underline;
  text-decoration-color: var(--bantam-yellow);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}
.ashby-job-posting-description li::marker {
  color: var(--bantam-black);
}


/* ---------------------------------------------------------------------
   6. PRIMARY BUTTONS: "Apply for this Job" + "Submit Application"
   Website style: flat yellow, Almost black Platt Bold text, slanted
   right edge (last 11% of the width), Almost black background with
   white text on hover. The slant is removed on keyboard focus so the
   focus ring is not clipped.
   --------------------------------------------------------------------- */
.ashby-job-posting-description-container button, /* NO ASHBY CLASS: Apply */
.ashby-application-form-submit-button {
  background: var(--bantam-yellow);
  color: var(--bantam-black);
  font-family: var(--bantam-font-display);
  font-weight: 700;
  font-size: 16px;
  border: none;
  border-radius: 0.1rem;
  box-shadow: none;
  clip-path: var(--bantam-button-slant);
  transition: background 250ms ease, color 250ms ease;
}
.ashby-job-posting-description-container button svg,
.ashby-application-form-submit-button svg {
  color: currentColor;
  fill: currentColor;
}
.ashby-job-posting-description-container button:hover,
.ashby-application-form-submit-button:hover {
  background: var(--bantam-black);
  color: var(--bantam-white);
}
.ashby-job-posting-description-container button:focus-visible,
.ashby-application-form-submit-button:focus-visible {
  clip-path: none;
  outline: 3px solid var(--bantam-black);
  outline-offset: 3px;
}
.ashby-application-form-submit-button:disabled,
.ashby-application-form-submit-button[aria-disabled="true"] {
  opacity: 0.6;
  cursor: not-allowed;
}


/* ---------------------------------------------------------------------
   7. APPLICATION FORM
   --------------------------------------------------------------------- */
.ashby-application-form-section-header-title {
  font-family: var(--bantam-font-text);
  font-size: 24px;
  font-weight: 700;
  line-height: 1.1;
  color: var(--bantam-black);
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 12px;
}
.ashby-application-form-section-header-description {
  color: var(--bantam-black-80);
  font-weight: 400;
  line-height: var(--bantam-body-line-height);
}

/* Question labels: Platt, like the website's form labels, but SemiBold:
   the website's Bold labels are 1-2 words; these are full sentences */
.ashby-application-form-question-title {
  font-family: var(--bantam-font-display);
  font-weight: 600;
  color: var(--bantam-black);
}
.ashby-application-form-question-description {
  color: var(--bantam-black-65);
}

/* Text inputs, textareas, dropdowns, dates: square boxes with an
   Almost black border so they are easy to find; light tint on focus,
   like the website's Contact form */
.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 {
  border: 1px solid var(--bantam-black);
  border-radius: 0;
  background-color: var(--bantam-white);
  box-shadow: none;
  color: var(--bantam-black);
  font-family: var(--bantam-font-text);
}
/* Class repeated on purpose: Ashby's own focus rule (4px blue outline,
   yellow border) is more specific than a single class */
.ashby-application-form-input-text.ashby-application-form-input-text:focus,
.ashby-application-form-input-textarea.ashby-application-form-input-textarea:focus,
.ashby-application-form-input-dropdown-select.ashby-application-form-input-dropdown-select:focus,
.ashby-application-form-input-date.ashby-application-form-input-date:focus,
.ashby-application-form-input-autocomplete.ashby-application-form-input-autocomplete:focus {
  outline: none;
  background-color: var(--bantam-field-focus);
  /* ACCESSIBILITY: the tint alone is too faint (1.25:1), so the border
     also thickens to 3px (1px border + 2px inner line) on focus */
  box-shadow: inset 0 0 0 2px var(--bantam-black);
  /* Ashby forces a yellow focus border that outranks the rule above */
  border-color: var(--bantam-black) !important;
}
.ashby-application-form-input-text::placeholder,
.ashby-application-form-input-textarea::placeholder {
  color: var(--bantam-black-65);
}

/* Autofill-from-resume panel */
.ashby-application-form-autofill-input-root {
  background: var(--bantam-gray);
  border: none;
  border-radius: 0;
}
.ashby-application-form-autofill-input-title {
  font-family: var(--bantam-font-text);
  font-weight: 600;
  color: var(--bantam-black);
}
.ashby-application-form-autofill-input-description {
  color: var(--bantam-black-80);
}
.ashby-application-form-autofill-input-icon,
.ashby-application-form-autofill-input-icon * {
  color: var(--bantam-black);
  fill: currentColor;
}

/* Secondary buttons ("Upload file"): yellow text on white fails
   contrast, so outline in Almost black and fill yellow on hover */
.ashby-application-form-autofill-input-base-layer button, /* NO ASHBY CLASS */
.ashby-application-form-input-file-dropzone-upload,
.ashby-application-form-input-education-add {
  background: transparent;
  color: var(--bantam-black);
  border: 2px solid var(--bantam-black);
  border-radius: 0;
  box-shadow: none;
  font-weight: 600;
  transition: background 150ms ease;
}
.ashby-application-form-autofill-input-base-layer button svg,
.ashby-application-form-input-file-dropzone-upload svg {
  color: currentColor;
  fill: currentColor;
}
.ashby-application-form-autofill-input-base-layer button:hover,
.ashby-application-form-input-file-dropzone-upload:hover,
.ashby-application-form-input-education-add:hover {
  background: var(--bantam-yellow);
}

/* File drop zone (the dashed border lives on the outer file input) */
.ashby-application-form-input-file {
  border: 1px dashed var(--bantam-black);
  border-radius: 0;
}
.ashby-application-form-input-file-dropzone {
  border: none;
}
.ashby-application-form-input-file-dropzone-instructions {
  color: var(--bantam-black-80);
  font-weight: 400;
}

/* Yes / No toggles: square boxes with an Almost black border; yellow
   when selected */
.ashby-application-form-input-yesno {
  display: inline-flex;
  gap: 8px;
  border: none;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}
.ashby-application-form-input-yesno-option {
  background: var(--bantam-white);
  border: 1px solid var(--bantam-black);
  border-radius: 0;
  box-shadow: none;
  color: var(--bantam-black);
  font-family: var(--bantam-font-display);
  font-weight: 700;
  min-width: 80px;
  transition: background 150ms ease;
}
.ashby-application-form-input-yesno-option:hover {
  background: var(--bantam-gray);
  color: var(--bantam-black);
}
/* ACCESSIBILITY: yellow vs white is only 1.5:1, so the selected answer
   also gets a thicker (3px) Almost black border; color is not the only
   cue (state cues need 3:1; this is 17.7:1) */
.ashby-application-form-input-yesno-option[aria-pressed="true"] {
  background: var(--bantam-yellow);
  color: var(--bantam-black);
  box-shadow: inset 0 0 0 2px var(--bantam-black);
}

/* Radio + checkbox groups */
/* Radios are custom-drawn: NO ASHBY CLASS on the ring (first span) or
   the dot (span inside it). Checked = Almost black ring, yellow dot,
   matching the checkbox (Almost black box, yellow check). */
.ashby-application-form-input-radio-group-option > span:first-child {
  border-color: var(--bantam-black);
}
.ashby-application-form-input-radio-group-option[data-checked] > span:first-child {
  background-color: var(--bantam-black);
  border-color: var(--bantam-black);
}
.ashby-application-form-input-radio-group-option[data-checked] > span:first-child > span {
  background-color: var(--bantam-yellow);
}
/* ACCESSIBILITY: the real radio/checkbox inputs are invisible, and
   Ashby's focus ring on the drawn ones is near-invisible, so show a
   clear ring on the drawn circle/box while its input has focus */
.ashby-application-form-input-radio-group-option > span:first-child:focus-within,
.ashby-application-form-input-checkbox-group-option-checkbox:focus-within {
  outline: 2px solid var(--bantam-black);
  outline-offset: 2px;
  border-color: var(--bantam-black) !important; /* Ashby turns it yellow */
}
.ashby-application-form-input-radio-group-option-label,
.ashby-application-form-input-checkbox-group-option-label {
  color: var(--bantam-black);
}
.ashby-application-form-input-checkbox-group-option-checkbox {
  border-color: var(--bantam-black);
  border-radius: 0;
}
.ashby-application-form-input-checkbox-group-option[data-checked] .ashby-application-form-input-checkbox-group-option-checkbox {
  background-color: var(--bantam-black);
  border-color: var(--bantam-black);
}

/* Autocomplete results */
.ashby-application-form-input-autocomplete-popup {
  border-radius: 0;
}
.ashby-application-form-input-autocomplete-popup-result[aria-selected="true"] {
  background: var(--bantam-gray);
  color: var(--bantam-black);
}

/* Other Ashby form pieces from the example file. These do not appear on
   the current posting, so they are styled lightly and still need a
   visual check if you add those question types. */
.ashby-application-form-input-dropdown-icon {
  color: var(--bantam-black);
}
.ashby-application-form-input-date-popup {
  border-radius: 0;
}
.ashby-application-form-input-date-popup-title {
  font-weight: 700;
  color: var(--bantam-black);
}
.ashby-application-form-input-date-popup-header-button {
  color: var(--bantam-black);
}
.ashby-application-form-input-file-item {
  border-radius: 0;
}
.ashby-application-form-input-file-item-name {
  color: var(--bantam-black);
}
.ashby-application-form-autofill-input-drag-layer[data-state="active"] {
  border: 1px dashed var(--bantam-black);
  border-radius: 0;
}

/* Success screen */
.ashby-application-form-success-container {
  font-family: var(--bantam-font-text);
  color: var(--bantam-black);
}


/* ---------------------------------------------------------------------
   8. RESPONSIVE + ACCESSIBILITY AT-RULES
   --------------------------------------------------------------------- */
@media (max-width: 640px) {
  .ashby-job-board-heading,
  .ashby-job-posting-heading {
    font-size: 30px;
  }
  .ashby-department-heading,
  .ashby-job-posting-brief-department-heading,
  .ashby-application-form-section-header-title,
  .ashby-job-posting-description h1,
  .ashby-job-posting-description h2,
  .ashby-job-posting-description h3 {
    font-size: 20px;
  }
  .ashby-job-posting-brief {
    padding: 16px 16px 16px 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ashby-job-posting-brief,
  .ashby-job-posting-description-container button,
  .ashby-application-form-submit-button,
  .ashby-application-form-input-file-dropzone-upload,
  .ashby-application-form-input-yesno-option {
    transition: none;
  }
}

@media (forced-colors: active) {
  /* Keep buttons rectangular and visible in Windows High Contrast */
  .ashby-job-posting-description-container button,
  .ashby-application-form-submit-button {
    clip-path: none;
    border: 2px solid ButtonText;
  }
  /* Background colors are dropped in high-contrast mode, so mark the
     selected Yes/No answer with a thick Highlight border */
  .ashby-application-form-input-yesno-option[aria-pressed="true"] {
    border: 4px solid Highlight;
  }
}