/* ============================================================
   Atira – Ashby job board custom CSS
   Upload at: Admin > Job Boards > Theme (Job Board) > Custom CSS
   Applies to jobs.ashbyhq.com/atira (board, job posts, application form)

   Tokens below mirror atira.ai (Untitled Sans, #181818 ink,
   #FDFDFD paper, ~6px radius). Change only the --atira-* block.
   ------------------------------------------------------------
   FONT LICENCE: Untitled Sans (Klim) is licensed per domain /
   pageview. Check the licence covers jobs.ashbyhq.com before
   shipping. If it doesn't, delete the @font-face rules and set
   --atira-font to a system stack.
   ============================================================ */

@font-face {
  font-family: "Atira Sans";
  src: url("https://cdn.prod.website-files.com/6a29851d846c6d7227110178/6a4e4bb40d5cb2fe79afd7cd_untitled-sans-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Atira Sans";
  src: url("https://cdn.prod.website-files.com/6a29851d846c6d7227110178/6a4e4bb4767023e3e0167b1f_untitled-sans-medium.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

:root {
  /* --- brand tokens: the only block you normally touch --- */
  --atira-paper:      #fdfdfd;
  --atira-ink:        #181818;
  --atira-muted:      #6e6e6e;
  --atira-border:     #e6e6e6;
  --atira-input:      #f2f2f2;
  --atira-ring:       #181818;
  --atira-font:       "Atira Sans", "Helvetica Neue", Arial, sans-serif;
  --atira-gutter:     16px;

  /* --- map Atira tokens onto Ashby's design system --- */
  --colorAppBackground: var(--atira-paper);
  --colorPrimary600:    var(--atira-ink);
  --colorPrimary900:    #000000;
  --colorSecondary900:  var(--atira-ink);
  --colorNeutral000:    #ffffff;
  --colorNeutral100:    var(--atira-paper);
  --colorNeutral200:    #f4f4f4;
  --colorNeutral300:    var(--atira-border);
  --colorNeutral400:    var(--atira-input);
  --colorNeutral600:    var(--atira-muted);
  --colorNeutral700:    var(--atira-muted);
  --colorNeutral800:    var(--atira-ink);
  --colorNeutralShadow: transparent;
  --colorPrimaryShadow: transparent;

  --widthMaxContent:       1120px;
  --widthMaxJobBoard:      1120px;
  --borderRadiusContainer: 6px;
  --borderRadiusControl:   6px;
  --borderRadiusButton:    6px;

  --fontFamily:           var(--atira-font);
  --fontWeightNormal:     400;
  --fontWeightLightBold:  500;
  --fontWeightMediumBold: 500;
  --fontWeightHeavyBold:  500;
  --letterSpacingTight:   -0.03em;
  --letterSpacingWide:    0;
  --letterSpacingXwide:   0;
}

@media (min-width: 1024px) {
  :root { --atira-gutter: 40px; }
}

body {
  padding-inline: var(--atira-gutter);
  background: var(--atira-paper);
  color: var(--atira-ink);
  font-family: var(--atira-font);
  -webkit-font-smoothing: antialiased;
}

body :is(button, input, select, textarea) { font-family: var(--atira-font); }

/* Ashby draws a decorative bar before headings – remove it */
.ashby-job-board-heading::before,
.ashby-job-posting-heading::before,
.ashby-job-posting-brief-title::before { display: none; }

.ashby-job-board-heading.ashby-job-board-heading,
.ashby-job-posting-heading.ashby-job-posting-heading {
  max-width: none;
  margin: 48px 0 32px;
  /* Ashby indents the heading's wrapper by 24px while the job rows sit at 12px.
     Pull it back by --spacingSmall so heading, department labels and rows
     share one left edge at every breakpoint. */
  margin-left: calc(-1 * var(--spacingSmall));
  color: var(--atira-ink);
  font-size: 32px;
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -0.03em;
  text-align: left;
}

/* Job list: quiet rows with a rule between them, not cards */
.ashby-job-board-heading-count,
.ashby-job-posting-brief-list .ashby-job-posting-brief-details { display: none; }

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

.ashby-job-posting-brief-list > a {
  display: block;
  color: var(--atira-ink);
  text-decoration: none;
  border-bottom: 1px solid var(--atira-border);
}

.ashby-job-posting-brief-list .ashby-job-posting-brief {
  margin: 0;
  padding: 14px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.ashby-job-posting-brief-list .ashby-job-posting-brief-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0;
  min-height: 24px;
  color: var(--atira-ink);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0;
}

.ashby-job-posting-brief-list .ashby-job-posting-brief-title::after {
  content: "";
  display: block;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23181818' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8h10M8 3l5 5-5 5'/%3E%3C/svg%3E") no-repeat center / contain;
  transition: transform 150ms ease;
}

.ashby-job-posting-brief-list > a:hover .ashby-job-posting-brief-title::after { transform: translateX(2px); }

@media (prefers-reduced-motion: reduce) {
  .ashby-job-posting-brief-list .ashby-job-posting-brief-title::after { transition: none; }
}

.ashby-department-heading {
  display: flex;
  margin: 40px 0 8px;
  color: var(--atira-muted);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0;
  text-transform: none;
}

.ashby-department-heading .ashby-department-heading-level {
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  flex-basis: auto;
}

/* Job post: flat panes, readable measure */
.ashby-job-posting-left-pane,
.ashby-job-posting-description-container,
.ashby-application-form-container,
.ashby-job-posting-right-pane > nav {
  background: var(--atira-paper);
  box-shadow: none;
}

.ashby-job-posting-left-pane h2 {
  color: var(--atira-muted);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
}

.ashby-job-posting-left-pane p { font-size: 16px; }

.ashby-job-posting-description.ashby-job-posting-description {
  width: 100%;
  max-width: 41.25rem;
  color: var(--atira-ink);
  font-family: var(--atira-font);
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: -0.015em;
}

.ashby-job-posting-description.ashby-job-posting-description :is(h1, h2, h3, h4) {
  margin: 1.75rem 0 0.5rem;
  color: var(--atira-ink);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -0.02em;
  text-transform: none;
}

.ashby-job-posting-description.ashby-job-posting-description :is(h1, h2)::before { display: none; }
.ashby-job-posting-description.ashby-job-posting-description h1 { font-size: 1.5rem; }
.ashby-job-posting-description.ashby-job-posting-description h2 { font-size: 1.25rem; }
.ashby-job-posting-description.ashby-job-posting-description :is(h3, h4) { font-size: 1.125rem; line-height: 1.5; }

/* Form controls */
.ashby-job-board-filter,
.ashby-application-form-input-text,
.ashby-application-form-input-autocomplete,
.ashby-application-form-input-date,
.ashby-application-form-input-dropdown-select,
.ashby-application-form-input-textarea {
  min-height: 36px;
  color: var(--atira-ink);
  background: var(--atira-input);
  background-image: none;
  border: 1px solid transparent;
  font-size: 16px;
  font-weight: 400;
}

.ashby-job-board-filter { padding: 8px 36px 8px 12px; }

.ashby-application-form-input-text,
.ashby-application-form-input-autocomplete,
.ashby-application-form-input-date { padding: 8px 12px; }

.ashby-application-form-input-textarea { border-radius: 6px; padding: 12px; }

.ashby-application-form-question-title {
  color: var(--atira-ink);
  font-size: 14px;
  font-weight: 400;
}

.ashby-application-form-section-header-title {
  color: var(--atira-ink);
  font-size: 24px;
  font-weight: 500;
  letter-spacing: -0.02em;
}

.ashby-job-posting-description-container button,
.ashby-application-form-submit-button {
  min-height: 40px;
  padding: 10px 16px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0;
}

.ashby-job-posting-right-pane :is(a, button),
.ashby-job-board-back-to-all-jobs-button { letter-spacing: 0; }

.ashby-job-posting-right-pane-tab-slider { background: var(--atira-ink); }

body :is(a, button, input, select, textarea):focus-visible {
  outline: 2px solid var(--atira-ring);
  outline-offset: 3px;
}

@media (min-width: 768px) {
  .ashby-job-board-filter,
  .ashby-application-form-input-text,
  .ashby-application-form-input-autocomplete,
  .ashby-application-form-input-date,
  .ashby-application-form-input-dropdown-select,
  .ashby-application-form-input-textarea { font-size: 14px; }
}