/* ─── Nous Research — Ashby Job Board custom CSS (v2, embed on /careers/) ── */
/* Goal: make the embedded board read like the OPEN ROLES list it replaces   */
/* on nousresearch.com/careers/. Brand: #0171A9 primary, #007BFF badge blue, */
/* #fafafa page bg, Helvetica Neue / Open Sans.                              */
/* Upload under: Admin > Job Boards > Theme (Job Board) > Custom CSS         */

/* Same faces the careers page loads, so the iframe renders identically on
   every OS (Helvetica Neue only exists on Macs; Open Sans is what most people
   actually see on the site). */
@import url("https://fonts.googleapis.com/css2?family=Geist+Mono:wght@100..900&family=Open+Sans:wght@400;600;700&display=swap");

/* The site's job pages set the title and section headings in PP Mondwest (the
   pixel face the nav uses). Vercel serves the files with CORS open, so the
   iframe can load them straight from the site. */
@font-face {
  font-family: "mondwest mike";
  src: url("https://nousresearch.com/wp-content/uploads/2024/03/PPMondwest-Regular.woff2") format("woff2"),
       url("https://nousresearch.com/wp-content/uploads/2024/03/PPMondwest-Regular.ttf") format("truetype");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "mondwest mike";
  src: url("https://nousresearch.com/wp-content/uploads/2024/03/PPMondwest-Bold.woff2") format("woff2"),
       url("https://nousresearch.com/wp-content/uploads/2024/03/PPMondwest-Bold.ttf") format("truetype");
  font-weight: 700; font-style: normal; font-display: swap;
}

:root {
  --colorAppBackground: transparent;
  --colorPrimary900: #00547E;
  --colorPrimary600: #0171a9;
  --colorNeutral800: #0171a9;   /* default heading/text color -> brand blue */
  --colorNeutral700: #0171a9;   /* secondary text (meta line) -> brand blue */
  --widthMaxContent: 1140px;
  --widthMaxJobBoard: 1140px;
  --borderRadiusContainer: 1px;
  --borderRadiusControl: 1px;
  --borderRadiusButton: 1px;
  --fontFamily: "Helvetica Neue", "Open Sans", Arial, sans-serif;
}

html, body { background: transparent !important; }

/* Flush the board against the site's OPEN ROLES heading (site owns padding).
   The 12px side padding lives on the inner _content_ wrapper, which is what
   indented the rows relative to the heading. */
div[class*="_container_"],
div[class*="_container_"] > div[class*="_content_"] {
  padding: 0 !important; margin: 0 !important; max-width: none !important;
}
/* Wrapper of the board heading only; the posting view reuses the same wrapper
   for the job title, so match via :has() and never hide that one. */
[class*="_titles_"]:has(> .ashby-job-board-heading) { display: none !important; }
[class*="_departments_"] { margin: 0 !important; }

/* ── Board heading: site already renders "OPEN ROLES" above the iframe ── */
.ashby-job-board-heading { display: none !important; }

/* ── Filters: hidden. Ten roles do not need filtering and the site's list has
   no equivalent; the meta line still says department / location / type. ── */
[class*="_filtersContainer_"] { display: none !important; }
[class*="_visuallyHidden_"] { display: none !important; }

/* (Kept below in case filters are turned back on later.) */
[class*="_filtersContainer_"] { margin: 0 0 0.5rem 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; }
[class*="_filtersHeader_"] { margin-bottom: 0.4rem !important; }
.ashby-job-board-filters-label { font-size: 0.7rem !important; font-weight: 600 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; color: #0171a9 !important; }
.ashby-job-board-reset-filters-label { font-size: 0.75rem !important; color: #0171a9 !important; }
.ashby-job-board-filter {
  font-family: "Helvetica Neue", "Open Sans", Arial, sans-serif !important;
  font-size: 0.85rem !important;
  color: #0171a9 !important;
  background: #fff !important;
  border: 1px solid #0171a9 !important;
  border-radius: 1px !important;
  box-shadow: none !important;
}
.ashby-job-board-filter:focus { outline: 2px solid #007BFF !important; outline-offset: 1px; }
[class*="_filterIconContainer_"] svg { color: #0171a9 !important; }

/* ── Department headings: site list is flat, so hide them ── */
.ashby-department-heading { display: none !important; }
[class*="_departments_"] { margin-top: 0 !important; }

/* ── Job rows: title left, meta right, dotted brand divider (matches .role-item) ── */
.ashby-job-posting-brief-list { margin: 0 !important; }
.ashby-job-posting-brief-list > a { text-decoration: none !important; display: block; }
.ashby-job-posting-brief {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 2rem;
  padding: 1rem 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px dotted #0171a9 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transition: background-color 0.05s ease;
}
.ashby-job-posting-brief-list > a:last-child .ashby-job-posting-brief { border-bottom: none !important; }
.ashby-job-posting-brief:hover { background-color: #f2f2f2 !important; transform: none !important; }

.ashby-job-posting-brief-title {
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  color: #0171a9 !important;
  margin: 0 !important;
  line-height: 1.3 !important;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
/* external-link glyph after the title, same as the site's .role-title::after */
.ashby-job-posting-brief-title::after {
  content: "";
  width: 14px; height: 16px;
  display: inline-block;
  flex-shrink: 0;
  opacity: 0.6;
  background-repeat: no-repeat;
  background-size: 16px 16px;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMTcxQTkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNMTUgM2g2djYiLz48cGF0aCBkPSJNMTAgMTQgMjEgMyIvPjxwYXRoIGQ9Ik0xOCAxM3Y2YTIgMiAwIDAgMS0yIDJINWEyIDIgMCAwIDEtMi0yVjhhMiAyIDAgMCAxIDItMmg2Ii8+PC9zdmc+");
}
.ashby-job-posting-brief:hover .ashby-job-posting-brief-title::after { opacity: 1; }

.ashby-job-posting-brief-details { margin: 0 !important; text-align: right; }
.ashby-job-posting-brief-details p {
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  color: #0171a9 !important;
  margin: 0 !important;
}

@media (max-width: 768px) {
  .ashby-job-posting-brief { flex-direction: column !important; align-items: flex-start !important; gap: 0.4rem; padding: 0.8rem 0 !important; }
  .ashby-job-posting-brief-title { white-space: normal; text-decoration: underline; }
  .ashby-job-posting-brief-details { text-align: left; }
}

/* ── Single posting view ── */
/* ── Single posting view: mirrors the site's own job pages
   (/forward-deployed-engineer/ etc): PP Mondwest title 32px/400 and section
   headings 24px/700, Helvetica body 16px, everything in brand blue. ── */
.ashby-job-board-back-to-all-jobs-button, [class*="_sticky_"] button {
  color: #0171a9 !important;
  font-family: "mondwest mike", "Geist Mono", monospace !important; font-size: 15px !important;
  text-transform: uppercase !important;
}
[class*="_sticky_"] { background: transparent !important; border: 0 !important; box-shadow: none !important; }

.ashby-job-posting-heading {
  font-family: "mondwest mike", "Geist Mono", monospace !important;
  font-weight: 400 !important;
  font-size: 32px !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
  color: #0171a9 !important;
  margin: 0.5rem 0 1.25rem 0 !important;
}

.ashby-job-posting-left-pane h2 {
  font-family: "mondwest mike", "Geist Mono", monospace !important;
  font-size: 15px !important; font-weight: 700 !important;
  letter-spacing: 0 !important; text-transform: uppercase !important;
  color: #0171a9 !important;
}
.ashby-job-posting-left-pane p { font-family: Helvetica, "Open Sans", Arial, sans-serif !important; color: #0171a9 !important; }

.ashby-job-posting-right-pane nav a {
  font-family: "mondwest mike", "Geist Mono", monospace !important; text-transform: uppercase !important;
  color: #0171a9 !important; font-weight: 700 !important;
}
.ashby-job-posting-right-pane-tab-slider { background: #0171a9 !important; }

.ashby-job-posting-description {
  font-family: Helvetica, "Open Sans", Arial, sans-serif !important;
  color: #0171a9 !important; font-size: 16px !important; line-height: 1.6 !important;
}
.ashby-job-posting-description h3, .ashby-job-posting-description h3 strong {
  font-family: "mondwest mike", "Geist Mono", monospace !important;
  color: #0171a9 !important; font-weight: 700 !important; font-size: 24px !important; letter-spacing: 0;
}
.ashby-job-posting-description p, .ashby-job-posting-description li { color: #0171a9 !important; }
.ashby-job-posting-description ul { list-style-type: square; }
.ashby-job-posting-description a { color: #0171a9 !important; text-decoration: underline; }

/* Apply / submit buttons: white on Nous blue, sharp corners, pixel face */
button[class*="_primary_"], .ashby-application-form-submit-button {
  background-color: #0171a9 !important; color: #fff !important;
  border-radius: 1px !important; border: 0 !important; box-shadow: none !important;
  font-weight: 700 !important; letter-spacing: 0.02em; text-transform: uppercase;
  font-family: "mondwest mike", "Geist Mono", monospace !important;
}
button[class*="_primary_"]:hover, .ashby-application-form-submit-button:hover { background-color: #00547E !important; }

/* Application form inputs */
.ashby-application-form-field-entry input,
.ashby-application-form-field-entry textarea,
.ashby-application-form-field-entry select { border-radius: 1px !important; border-color: #c9c9c9 !important; }
.ashby-application-form-field-entry input:focus,
.ashby-application-form-field-entry textarea:focus { border-color: #0171a9 !important; box-shadow: 0 0 0 1px #0171a9 !important; }

/* Footer: keep attribution (Ashby ToS), but pull it tight under the list and
   make it quiet. The default 48px margin + 24px paddings were the dead space. */
footer[class*="_embedded_"] {
  opacity: 0.5; margin-top: 0.75rem !important; padding: 0.5rem 0 0 !important;
  font-family: "Open Sans", Arial, sans-serif !important; font-size: 0.75rem !important;
  justify-content: flex-end !important;
}
footer[class*="_embedded_"] a { color: #0171a9 !important; }
footer[class*="_embedded_"] svg { height: 14px !important; }
