/* ==========================================================================
   Calder — Ashby Job Board Custom CSS (v4)
   A warm take on the Calder brand: Fraunces serif headings, Inter body,
   white cards on Ivory, Berry accents, soft corners and gentle motion.

   Sizing steps down through @media rules, all values are literal, and
   margins use longhand properties only.
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500&family=Inter:wght@400;500&family=JetBrains+Mono:wght@400&display=swap");

/* --------------------------------------------------------------------------
   1. Ashby variables
   Also set the two primaries in Ashby admin > Theme settings.
   -------------------------------------------------------------------------- */
:root {
  --colorAppBackground: #fafaf0;
  --colorPrimary900: #4b0f1e;
  --colorPrimary600: #962823;

  --widthMaxContent: 960px;
  --widthMaxJobBoard: 800px;
  --widthMaxSubscriptionPreferences: 600px;

  --borderRadiusContainer: 12px;
  --borderRadiusControl: 10px;
  --borderRadiusButton: 999px;

  --fontFamily: "Inter", "Helvetica Neue", Arial, sans-serif;
}

/* --------------------------------------------------------------------------
   2. Job board (listing page)
   -------------------------------------------------------------------------- */
.ashby-job-board-heading {
  margin-top: 40px;
  margin-bottom: 40px;
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-weight: 500;
  font-size: 54px;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: #4b0f1e;
}

/* The count becomes a small pill beside the title */
.ashby-job-board-heading-count {
  display: inline-block;
  margin-left: 14px;
  padding: 4px 12px;
  font-family: "JetBrains Mono", ui-monospace, Menlo, monospace;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: 0;
  vertical-align: middle;
  color: #962823;
  background-color: #ebe6cd;
  border-radius: 999px;
}

.ashby-job-board-filters-label {
  font-family: "JetBrains Mono", ui-monospace, Menlo, monospace;
  font-weight: 400;
  font-size: 13px;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #962823;
}

.ashby-job-board-filter {
  min-height: 48px;
  padding: 0 16px;
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  color: #2d2828;
  background-color: #ffffff;
  border: 1px solid #beb4a0;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(43, 8, 17, 0.04);
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

.ashby-job-board-filter:hover {
  border-color: #6e695f;
}

.ashby-job-board-filter:focus {
  outline: none;
  border-color: #962823;
  box-shadow: 0 0 0 4px rgba(150, 40, 35, 0.14);
}

.ashby-job-board-reset-filters-label {
  font-family: "JetBrains Mono", ui-monospace, Menlo, monospace;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #6e695f;
  text-decoration: underline;
  text-underline-offset: 5px;
  cursor: pointer;
}

.ashby-job-board-reset-filters-label:hover {
  color: #4b0f1e;
}

/* Department names: mono Berry eyebrow, a dot, and a dashed rule */
.ashby-department-heading,
.ashby-job-posting-brief-department-heading {
  margin-top: 56px;
  margin-bottom: 20px;
  padding-top: 0px;
  padding-bottom: 14px;
  border: none;
  border-bottom: 1px dashed #beb4a0;
  font-family: "JetBrains Mono", ui-monospace, Menlo, monospace;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #962823;
}

.ashby-department-heading::before,
.ashby-job-posting-brief-department-heading::before {
  content: "";
  display: inline-block;
  width: 9px;
  height: 9px;
  margin-right: 12px;
  vertical-align: middle;
  background-color: #962823;
  border-radius: 50%;
}

/* Team names: small mono caps in warm gray */
.ashby-department-heading-level,
.ashby-job-posting-brief-department-heading-level {
  margin-top: 24px;
  margin-bottom: 12px;
  font-family: "JetBrains Mono", ui-monospace, Menlo, monospace;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #6e695f;
}

/* Job cards */
.ashby-job-posting-brief {
  margin-top: 0px;
  margin-bottom: 12px;
  padding: 20px 24px;
  background-color: #ffffff;
  border: 1px solid #ebe6cd;
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(43, 8, 17, 0.04);
  transition: border-color 200ms ease, box-shadow 200ms ease, transform 200ms ease;
}

.ashby-job-posting-brief:hover {
  border-color: #962823;
  box-shadow: 0 10px 28px rgba(75, 15, 30, 0.1);
  transform: translateY(-2px);
}

.ashby-job-posting-brief-title {
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-weight: 500;
  font-size: 22px;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: #4b0f1e;
  transition: color 160ms ease;
}

.ashby-job-posting-brief-title::after {
  content: "\2192";
  display: inline-block;
  margin-left: 10px;
  color: #962823;
  opacity: 0;
  transform: translateX(-6px);
  transition: opacity 200ms ease, transform 200ms ease;
}

.ashby-job-posting-brief:hover .ashby-job-posting-brief-title {
  color: #962823;
}

.ashby-job-posting-brief:hover .ashby-job-posting-brief-title::after {
  opacity: 1;
  transform: translateX(0);
}

.ashby-job-posting-brief-details {
  margin-top: 10px;
  font-family: "JetBrains Mono", ui-monospace, Menlo, monospace;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #6e695f;
}

/* --------------------------------------------------------------------------
   3. Job posting page
   -------------------------------------------------------------------------- */
.ashby-job-board-back-to-all-jobs-button {
  font-family: "JetBrains Mono", ui-monospace, Menlo, monospace;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #962823;
  background-color: transparent;
  border: none;
  transition: color 160ms ease;
}

.ashby-job-board-back-to-all-jobs-button:hover {
  color: #4b0f1e;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.ashby-job-posting-header,
.ashby-job-posting-heading {
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-weight: 500;
  font-size: 44px;
  line-height: 1.12;
  letter-spacing: -0.02em;
  color: #4b0f1e;
}

.ashby-job-posting-left-pane {
  color: #2d2828;
}

.ashby-job-posting-left-pane h2,
.ashby-job-posting-left-pane h3 {
  font-family: "JetBrains Mono", ui-monospace, Menlo, monospace;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #962823;
}

.ashby-job-posting-right-pane-tab-slider {
  background-color: #962823;
}

.ashby-job-posting-description {
  font-size: 17px;
  line-height: 1.7;
  color: #2d2828;
}

.ashby-job-posting-description h1,
.ashby-job-posting-description h2 {
  margin-top: 40px;
  margin-bottom: 12px;
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-weight: 500;
  font-size: 26px;
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: #4b0f1e;
}

.ashby-job-posting-description h3,
.ashby-job-posting-description h4 {
  margin-top: 32px;
  margin-bottom: 10px;
  font-family: "JetBrains Mono", ui-monospace, Menlo, monospace;
  font-weight: 400;
  font-size: 13px;
  line-height: 1.4;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #962823;
}

.ashby-job-posting-description p {
  margin-top: 0px;
  margin-bottom: 16px;
}

.ashby-job-posting-description ul,
.ashby-job-posting-description ol {
  margin-top: 0px;
  margin-bottom: 20px;
  padding-left: 22px;
}

.ashby-job-posting-description li {
  margin-bottom: 8px;
}

.ashby-job-posting-description li::marker {
  color: #962823;
}

.ashby-job-posting-description a {
  color: #962823;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ashby-job-posting-description a:hover {
  color: #4b0f1e;
}

.ashby-job-posting-description strong {
  font-weight: 500;
  color: #4b0f1e;
}

/* --------------------------------------------------------------------------
   4. Application form
   -------------------------------------------------------------------------- */
.ashby-application-form-container {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  color: #2d2828;
}

.ashby-application-form-section-container {
  margin-bottom: 20px;
  padding: 28px;
  background-color: #ffffff;
  border: 1px solid #ebe6cd;
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(43, 8, 17, 0.04);
}

.ashby-application-form-section-header-title {
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-weight: 500;
  font-size: 24px;
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: #4b0f1e;
}

.ashby-application-form-section-header-description {
  font-size: 16px;
  line-height: 1.5;
  color: #6e695f;
}

.ashby-application-form-field-entry {
  margin-bottom: 24px;
}

.ashby-application-form-question-title {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.4;
  color: #2d2828;
}

.ashby-application-form-question-description,
.ashby-application-form-texting-consent-description {
  font-size: 14px;
  line-height: 1.5;
  color: #6e695f;
}

/* Text fields, dates, dropdowns, autocompletes */
.ashby-application-form-input-text,
.ashby-application-form-input-date,
.ashby-application-form-input-dropdown,
.ashby-application-form-input-autocomplete {
  min-height: 48px;
  padding: 0 16px;
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  color: #2d2828;
  background-color: #fafaf0;
  border: 1px solid #beb4a0;
  border-radius: 10px;
  box-shadow: none;
  box-sizing: border-box;
  transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.ashby-application-form-input-textarea {
  padding: 14px 16px;
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: #2d2828;
  background-color: #fafaf0;
  border: 1px solid #beb4a0;
  border-radius: 10px;
  box-shadow: none;
  transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.ashby-application-form-input-text:hover,
.ashby-application-form-input-textarea:hover,
.ashby-application-form-input-date:hover,
.ashby-application-form-input-dropdown:hover,
.ashby-application-form-input-autocomplete:hover {
  border-color: #6e695f;
}

.ashby-application-form-input-text:focus,
.ashby-application-form-input-textarea:focus,
.ashby-application-form-input-date:focus,
.ashby-application-form-input-dropdown:focus-within,
.ashby-application-form-input-autocomplete:focus,
.ashby-application-form-input-autocomplete[aria-expanded="true"] {
  outline: none;
  background-color: #ffffff;
  border-color: #962823;
  box-shadow: 0 0 0 4px rgba(150, 40, 35, 0.14);
}

.ashby-application-form-input-text::placeholder,
.ashby-application-form-input-textarea::placeholder {
  color: #6e695f;
}

.ashby-application-form-input-dropdown[data-disabled] {
  color: #6e695f;
  background-color: #ebe6cd;
  cursor: not-allowed;
}

.ashby-application-form-input-dropdown-icon {
  color: #6e695f;
}

/* Popups */
.ashby-application-form-input-autocomplete-popup,
.ashby-application-form-input-date-popup {
  background-color: #ffffff;
  border: 1px solid #ebe6cd;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(43, 8, 17, 0.12);
}

.ashby-application-form-input-autocomplete-popup-result[aria-selected="true"] {
  background-color: #ebe6cd;
  color: #4b0f1e;
}

.ashby-application-form-input-autocomplete-popup-empty,
.ashby-application-form-input-autocomplete-popup-loading {
  font-size: 14px;
  color: #6e695f;
}

.ashby-application-form-input-date-popup-title {
  font-family: "JetBrains Mono", ui-monospace, Menlo, monospace;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #4b0f1e;
}

.ashby-application-form-input-date-popup-header-button {
  color: #962823;
}

/* Checkboxes and radios */
.ashby-application-form-input-checkbox-group-option-label,
.ashby-application-form-input-radio-group-option-label {
  font-size: 16px;
  line-height: 1.5;
  color: #2d2828;
}

.ashby-application-form-input-checkbox-group-option-checkbox,
.ashby-application-form-input-radio-group-option-radio {
  accent-color: #962823;
}

.ashby-application-form-input-checkbox-group-option[data-disabled],
.ashby-application-form-input-radio-group-option[data-disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Yes / No: friendly pills */
.ashby-application-form-input-yesno-option {
  min-height: 44px;
  padding: 0 24px;
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #4b0f1e;
  background-color: #ffffff;
  border: 1px solid #beb4a0;
  border-radius: 999px;
  box-shadow: none;
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

.ashby-application-form-input-yesno-option:hover {
  border-color: #962823;
}

.ashby-application-form-input-yesno-option[aria-pressed="true"] {
  color: #fafaf0;
  background-color: #962823;
  border-color: #962823;
}

/* File upload and resume autofill */
.ashby-application-form-input-file-dropzone,
.ashby-application-form-autofill-input-root {
  background-color: #fafaf0;
  border: 1.5px dashed #beb4a0;
  border-radius: 12px;
  box-shadow: none;
  transition: border-color 160ms ease, background-color 160ms ease;
}

.ashby-application-form-input-file-dropzone:hover,
.ashby-application-form-autofill-input-root[data-state="drag"] {
  border-color: #962823;
  background-color: #ebe6cd;
}

.ashby-application-form-autofill-input-title {
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-weight: 500;
  font-size: 18px;
  color: #4b0f1e;
}

.ashby-application-form-input-file-dropzone-instructions,
.ashby-application-form-autofill-input-description {
  font-size: 14px;
  line-height: 1.5;
  color: #6e695f;
}

.ashby-application-form-autofill-input-icon {
  color: #962823;
}

.ashby-application-form-input-file-dropzone-upload {
  min-height: 44px;
  padding: 0 22px;
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 15px;
  font-weight: 500;
  color: #962823;
  background-color: #ffffff;
  border: 1px solid #962823;
  border-radius: 999px;
  box-shadow: none;
  transition: background-color 160ms ease, color 160ms ease;
}

.ashby-application-form-input-file-dropzone-upload:hover {
  color: #fafaf0;
  background-color: #962823;
}

.ashby-application-form-input-file-item {
  background-color: #fafaf0;
  border: 1px solid #ebe6cd;
  border-radius: 10px;
}

.ashby-application-form-input-file-item-name {
  color: #2d2828;
}

.ashby-application-form-input-file-item-delete,
.ashby-application-form-input-education-entry-delete {
  color: #6e695f;
  transition: color 160ms ease;
}

.ashby-application-form-input-file-item-delete:hover,
.ashby-application-form-input-education-entry-delete:hover {
  color: #962823;
}

/* Education history */
.ashby-application-form-input-education-entry {
  padding: 20px;
  background-color: #fafaf0;
  border: 1px solid #ebe6cd;
  border-radius: 12px;
}

.ashby-application-form-input-education-entry-header {
  font-family: "JetBrains Mono", ui-monospace, Menlo, monospace;
  font-weight: 400;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #962823;
}

.ashby-application-form-input-education-add {
  font-size: 15px;
  font-weight: 500;
  color: #962823;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* Submit: a friendly Berry pill */
.ashby-application-form-submit-button {
  min-height: 52px;
  padding: 0 34px;
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 17px;
  font-weight: 500;
  line-height: 1;
  color: #fafaf0;
  background-color: #962823;
  border: none;
  border-radius: 999px;
  box-shadow: 0 4px 14px rgba(150, 40, 35, 0.22);
  transition: background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.ashby-application-form-submit-button:hover {
  background-color: #4b0f1e;
  box-shadow: 0 8px 20px rgba(75, 15, 30, 0.28);
  transform: translateY(-1px);
}

.ashby-application-form-submit-button:active {
  transform: translateY(0);
}

.ashby-application-form-submit-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

/* Outcome states */
.ashby-application-form-success-container {
  padding: 32px;
  font-family: "Fraunces", Georgia, "Times New Roman", serif;
  font-weight: 500;
  font-size: 22px;
  line-height: 1.3;
  color: #fafaf0;
  background-color: #4b0f1e;
  border: none;
  border-radius: 12px;
}

.ashby-application-form-failure-container,
.ashby-application-form-blocked-application-container,
.ashby-application-blocking-disclosure {
  padding: 20px 24px;
  color: #2d2828;
  background-color: #ffffff;
  border: 1px solid #962823;
  border-radius: 12px;
}

.ashby-application-form-autofill-input-form-alert[data-highlight="positive"] {
  color: #37412d;
}

.ashby-application-form-autofill-input-form-alert[data-highlight="negative"] {
  color: #962823;
}

/* --------------------------------------------------------------------------
   5. Accessibility
   -------------------------------------------------------------------------- */
.ashby-application-form-submit-button:focus-visible,
.ashby-application-form-input-yesno-option:focus-visible,
.ashby-application-form-input-file-dropzone-upload:focus-visible,
.ashby-job-board-back-to-all-jobs-button:focus-visible {
  outline: 3px solid rgba(150, 40, 35, 0.4);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .ashby-job-posting-brief,
  .ashby-job-posting-brief-title,
  .ashby-job-posting-brief-title::after,
  .ashby-application-form-submit-button {
    transition: none;
  }

  .ashby-job-posting-brief:hover,
  .ashby-application-form-submit-button:hover {
    transform: none;
  }
}

/* --------------------------------------------------------------------------
   6. Responsive type steps
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  .ashby-job-board-heading {
    font-size: 46px;
  }

  .ashby-job-posting-header,
  .ashby-job-posting-heading {
    font-size: 38px;
  }
}

@media (max-width: 640px) {
  .ashby-job-board-heading {
    margin-top: 28px;
    margin-bottom: 28px;
    font-size: 36px;
  }

  .ashby-job-board-heading-count {
    margin-left: 10px;
    font-size: 13px;
  }

  .ashby-department-heading,
  .ashby-job-posting-brief-department-heading {
    margin-top: 40px;
    font-size: 13px;
  }

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

  .ashby-job-posting-brief-title {
    font-size: 20px;
  }

  .ashby-job-posting-header,
  .ashby-job-posting-heading {
    font-size: 32px;
  }

  .ashby-job-posting-description {
    font-size: 16px;
  }

  .ashby-application-form-section-container {
    padding: 20px;
  }

  .ashby-application-form-submit-button {
    width: 100%;
  }
}