/*
  * Ashby Job Board – Custom CSS
  *
  * THIS FILE IS FOR REFERENCE ONLY AND IS NOT USED DIRECTLY.
  * CSS is added to Ashby admin.
  * See Ashby's CSS template & styling docs for available selectors.
  */

@font-face {
  font-family: 'Super Sans VF';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('https://superhumanstatic.com/s/fonts/v1/SuperSans-VF-Upright.woff2') format('woff2');
}

:root {
  --color-background: #f7f5f2;
  --color-bg-translucent: rgb(252 250 247 / 80%);
  --color-border: #8d8a86;
  --color-border-subtle: rgb(115 113 109 / 20%);
  --color-text-sub: rgb(20 20 19 / 65%);
  --color-text-dark: #292827;
  --font-size-large: 32px;
  --font-size-regular: 20px;
  --font-size-small: 18px;
  --font-size-xsmall: 16px;
  --font-weight-regular: 460;
  --font-weight-medium: 540;
  --letter-spacing: -0.0075em;
  --letter-spacing-tight: -0.0275em;

  /* START OVERRIDES FOR ASHBY'S CUSTOM PROPERTIES */

  /*  The max width of the job board container */
  --widthMaxJobBoard: 100%;

  /*  Container border radius */
  --borderRadiusContainer: 0;

  /*  Border radius of control elements (e.g. input boxes) */
  --borderRadiusControl: 6px;

  /*  Button border radius */
  --borderRadiusButton: 10px;
  --colorAppBackground: var(--color-background);
  --fontFamily: 'Super Sans VF', serif;
  --colorNeutral000: var(--color-background);
  --colorNeutral100: var(--color-background);
  --colorNeutral300: var(--color-text-sub);
  --colorNeutral500: var(--color-text-sub);
  --colorNeutral600: var(--color-text-sub);
  --colorNeutral700: var(--color-text-sub);
  --colorNeutral800: var(--color-text-sub);
  --colorPrimary600: var(--color-text-sub);

  /* END OVERRIDES FOR ASHBY'S CUSTOM PROPERTIES */
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Hide Employment & Location Type Filters */
div:has(> select[aria-label="Employment"]),
div:has(> select[aria-label="Location Type"]) {
 display: none;
}

/* The heading of a department, which can have many teams under it. */
.ashby-department-heading {
  margin: 0;
  margin-block-end: 40px;
}

/* The heading of a single team. */
.ashby-department-heading-level {
  color: #000000;
  font-style: normal;
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-large);
  line-height: 37px;
  letter-spacing: var(--letter-spacing-tight);
}

/* The button which allows users to navigate from an individual posting back to the list of all job postings. */
.ashby-job-board-back-to-all-jobs-button {
  background-color: transparent;
  font-family: inherit;
  font-size: var(--font-size-xsmall);
  line-height: 1;
  padding: 8px;
}

/* A select box element for filtering the job board. */
.ashby-job-board-filter {
  background-color: var(--color-bg-translucent);
  background-image: none;
  border: 1px solid var(--color-border);
  font-family: inherit;
  font-size: var(--font-size-small);
  line-height: 32px;
}

/* The heading of the entire job board. */
.ashby-job-board-heading {
  --spacingXxlarge: 16px;

  font-style: normal;
  font-weight: var(--font-weight-medium);
  font-size: var(--font-size-regular);
  line-height: 30px;
  letter-spacing: var(--letter-spacing);
}

/* The container of the job posting details pane. */
.ashby-job-posting-brief {
  background-color: transparent;
  border-block-end: 1px solid var(--color-border-subtle);
  margin-block-end: 24px;
  padding: 16px;
}

.ashby-job-posting-brief:hover {
  background-color: var(--color-bg-translucent);
}

/* The container for the details of the job posting, in the details pane. */
.ashby-job-posting-brief-details,
.ashby-job-board-filters-label {
  --fontSizeSmall: 16px;
  --lineHeightNormal: 24px;

  font-style: normal;
  font-weight: var(--font-weight-medium);
  line-height: 24px;
  letter-spacing: var(--letter-spacing);
}

/* The title of the job posting in the details pane. */
.ashby-job-posting-brief-title {
  font-style: normal;
  font-weight: var(--font-weight-medium);
  font-size: var(--font-size-regular);
  line-height: 30px;
  letter-spacing: var(--letter-spacing);
}

/* The left pane of the job posting, with the job posting details */
.ashby-job-posting-left-pane h2 {
  font-size: var(--font-size-xsmall);
  color: var(--color-text-dark);
}

/* The right pane of the job posting, containing the tabs, overview, and application form */
.ashby-job-posting-right-pane h2 {
  font-size: var(--font-size-regular);
  color: var(--color-text-dark);
}