/* stylelint-disable */

/* ============================================================
   AMERICAN TURBINES — Ashby Job Board Custom CSS
   "Technical document" edition — simplified monochrome
   ------------------------------------------------------------
   Off-white paper, ink rules, square corners. One typeface
   (Zen Kaku Gothic Antique) throughout — no italics, no mono.
   Uppercase only on small eyebrow labels. The logo asset is set
   in Ashby admin and left untouched; a grayscale filter keeps
   the masthead monochrome (delete that rule for a color logo).

   NOTE: the @import line must stay at the very top of the
   custom CSS field or the font will not load.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+Antique:wght@400;500;700;900&display=swap');

:root {
    /* ---- Monochrome tokens ---- */
    --at-paper: #F7F6F2;
    --at-white: #FFFFFF;
    --at-ink: #20211F;
    --at-muted: #6F706B;
    --at-line: #D8D6CF;
    --at-line-dark: #8A8983;

    /*  Darker primary color
    WARNING - This can be set in the Ashby admin under theme settings!
    If you modify, you should make sure your colors work with the settings there. */
    --colorPrimary900: #20211F;

    /*  Lighter primary color
    WARNING - This can be set in the Ashby admin under theme settings!
    If you modify, you should make sure your colors work with the settings there. */
    --colorPrimary600: #45463F;

    /*  The max width of the job board container */
    --widthMaxJobBoard: 900px;

    /*  Square corners — printed-document geometry */
    --borderRadiusContainer: 0px;
    --borderRadiusControl: 0px;
    --borderRadiusButton: 0px;

    /*  Font families */
    --fontFamily: "Zen Kaku Gothic Antique", "-apple-system", "BlinkMacSystemFont", "Segoe UI", "Helvetica", "Arial", "Apple Color Emoji", "Segoe UI Emoji", sans-serif;

    --colorAppBackground: #F7F6F2;
}

/* Small eyebrow label — the one place uppercase is used */
/* (applied via the rules below; tune size/tracking here by search) */

/* ============================================================
   BASE
   ============================================================ */

/* Always reserve scrollbar space so the centered layout (and the
   logo) doesn't shift sideways between short and long pages. */
html {
    overflow-y: scroll;
}

body {
    background-color: var(--at-paper);
    color: var(--at-ink);
}

/* Paper-grain overlay (self-contained SVG noise, no external requests).
   Tune via the slope value: 0.05 whisper / 0.1 gentle / 0.15 visible.
   Delete this block for a perfectly flat background. */
body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 9999;
    pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncA type='linear' slope='0.1'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

::selection {
    background: var(--at-ink);
    color: var(--at-paper);
}

/* ============================================================
   MASTHEAD — solid paper, strong ink rule
   ============================================================ */

/* The _navRoot_ selector covers the board page (no stable class
   there); if Ashby renames it the board header falls back to
   defaults — nothing breaks. */
.ashby-job-posting-header,
div[class*='_navRoot_'] {
    background-color: var(--at-paper);
    border-bottom: 2px solid var(--at-ink);
}

/* Keep the masthead monochrome regardless of the uploaded logo asset.
   Delete this rule to let a color logo render in its original colors. */
.ashby-job-posting-header img,
div[class*='_navRoot_'] img {
    filter: grayscale(1) contrast(1.1);
}

/* ============================================================
   JOB BOARD
   ============================================================ */

/* Board heading — heavy, upright, underlined */
.ashby-job-board-heading {
    font-family: var(--fontFamily);
    font-weight: 900;
    color: var(--at-ink);
    border-bottom: 2px solid var(--at-ink);
    padding-bottom: 14px;
}

.ashby-job-board-heading-count {
    font-weight: 400;
    color: var(--at-muted);
}

/* Filters + reset labels — small eyebrow */
.ashby-job-board-filters-label,
.ashby-job-board-reset-filters-label {
    font-family: var(--fontFamily);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--at-muted);
}

.ashby-job-board-reset-filters-label {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.ashby-job-board-reset-filters-label:hover {
    color: var(--at-ink);
}

/* Filter select boxes — squared, ruled */
.ashby-job-board-filter {
    background-color: var(--at-white);
    border: 1px solid var(--at-line-dark);
    border-radius: 0;
    transition: border-color 140ms ease;
}

.ashby-job-board-filter:hover,
.ashby-job-board-filter:focus-within {
    border-color: var(--at-ink);
}

/* Department heading — small eyebrow over a hairline */
.ashby-department-heading {
    font-family: var(--fontFamily);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--at-muted);
    border-bottom: 1px solid var(--at-line-dark);
    padding-bottom: 0.5rem;
}

.ashby-department-heading-level {
    font-family: var(--fontFamily);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--at-muted);
}

/* ---- Job cards — clean white, ink edge, arrow affordance ---- */

.ashby-job-posting-brief-list {
    gap: 0.75rem;
}

.ashby-job-posting-brief {
    position: relative;
    margin-bottom: 12px;
    padding-right: 64px;
    background-color: var(--at-white);
    border: 1px solid var(--at-line);
    border-left: 3px solid var(--at-ink);
    border-radius: 0;
    transition: border-color 140ms ease;
}

.ashby-job-posting-brief::after {
    content: "→";
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    line-height: 1;
    color: var(--at-muted);
    transition: color 140ms ease;
}

.ashby-job-posting-brief:hover {
    border-color: var(--at-ink);
}

.ashby-job-posting-brief:hover::after {
    color: var(--at-ink);
}

/* Card title — bold, normal case */
.ashby-job-posting-brief-title {
    font-family: var(--fontFamily);
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--at-ink);
    margin-bottom: 4px;
}

/* Card metadata — quiet single line */
.ashby-job-posting-brief-details {
    font-family: var(--fontFamily);
    font-size: 0.85rem;
    color: var(--at-muted);
}

.ashby-job-posting-brief-department-heading,
.ashby-job-posting-brief-department-heading-level {
    font-family: var(--fontFamily);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--at-muted);
}

/* ============================================================
   JOB POSTING PAGE
   ============================================================ */

.ashby-job-posting-heading {
    font-family: var(--fontFamily);
    font-weight: 900;
    color: var(--at-ink);
}

/* Back button — plain, labeled */
.ashby-job-board-back-to-all-jobs-button {
    font-family: var(--fontFamily);
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--at-muted);
    transition: color 140ms ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* Visible label on desktop (screen readers get Ashby's aria-label) */
@media (min-width: 841px) {
    .ashby-job-board-back-to-all-jobs-button::after {
        content: "All jobs";
        white-space: nowrap;
    }
}

.ashby-job-board-back-to-all-jobs-button:hover {
    color: var(--at-ink);
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Left pane — details column on paper, no white sheet */
.ashby-job-posting-left-pane {
    color: var(--at-ink);
    background: transparent;
}

.ashby-job-posting-left-pane h2 {
    font-family: var(--fontFamily);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--at-muted);
}

.ashby-job-posting-left-pane p {
    color: var(--at-ink);
    font-weight: 500;
}

/* Sticky details on two-pane desktop layouts only (Ashby collapses
   to one column at ~800px; sticking there would cover content). */
@media (min-width: 841px) {
    .ashby-job-posting-left-pane {
        position: sticky;
        top: 24px;
        align-self: start;
    }
}

.ashby-job-posting-right-pane {
    color: var(--at-ink);
}

/* Tabs */
.ashby-job-posting-right-pane-overview-tab,
.ashby-job-posting-right-pane-application-tab {
    font-family: var(--fontFamily);
    font-weight: 700;
    font-size: 0.85rem;
}

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

/* Overview description sheet. NOTE: no stable Ashby class exists for
   this container, so this targets an internal CSS-module class by
   prefix; if Ashby renames it the sheet reverts to plain white. */
.ashby-job-posting-right-pane div[class*='_description_'] {
    background-color: var(--at-white);
    border: 1px solid var(--at-line);
    border-radius: 0;
}

/* ============================================================
   APPLICATION FORM
   ============================================================ */

.ashby-application-form-container {
    font-family: var(--fontFamily);
    background-color: var(--at-white);
    border: 1px solid var(--at-line);
    border-radius: 0;
}

/* Autofill drop zone stands alone on the paper */
.ashby-application-form-autofill-pane {
    background: transparent;
    padding-bottom: 8px;
}

.ashby-application-form-autofill-input-root {
    background-color: var(--at-white);
    border: 1px dashed var(--at-line-dark);
    border-radius: 0;
    transition: border-color 140ms ease;
}

.ashby-application-form-autofill-input-root:hover,
.ashby-application-form-autofill-input-root[data-state='drag'] {
    border-color: var(--at-ink);
}

.ashby-application-form-autofill-input-title {
    font-weight: 700;
    color: var(--at-ink);
}

.ashby-application-form-autofill-input-description {
    color: var(--at-muted);
}

.ashby-application-form-autofill-input-icon {
    color: var(--at-muted);
}

/* Inputs — squared, ruled */
.ashby-application-form-field-entry input,
.ashby-application-form-field-entry textarea,
.ashby-application-form-field-entry select {
    background-color: var(--at-white);
    border-color: var(--at-line-dark);
    border-radius: 0;
}

.ashby-application-form-field-entry input::placeholder,
.ashby-application-form-field-entry textarea::placeholder {
    color: var(--at-muted);
}

/* Buttons inside fields (Yes/No, Upload File) */
.ashby-application-form-field-entry button {
    color: var(--at-ink);
    border-radius: 0;
    transition: border-color 140ms ease;
}

.ashby-application-form-field-entry button:hover {
    border-color: var(--at-ink);
}

/* Form sections — small eyebrow over a hairline */
.ashby-application-form-section-container {
    border-radius: 0;
}

.ashby-application-form-section-header {
    border-bottom: 1px solid var(--at-line-dark);
    padding-bottom: 0.625rem;
    margin-bottom: 1rem;
}

.ashby-application-form-section-header-title {
    font-family: var(--fontFamily);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--at-muted);
}

.ashby-application-form-section-header-description {
    color: var(--at-muted);
}

.ashby-application-form-field-entry {
    color: var(--at-ink);
}

.ashby-application-form-question-title {
    font-weight: 500;
    color: var(--at-ink);
}

.ashby-application-form-question-description {
    color: var(--at-muted);
}

.ashby-application-form-texting-consent-description {
    color: var(--at-muted);
    font-size: 0.78rem;
}

/* Submit — solid ink slab */
.ashby-application-form-submit-button {
    font-family: var(--fontFamily);
    font-weight: 700;
    letter-spacing: 0.02em;
    background-color: var(--at-ink);
    border: 1px solid var(--at-ink);
    border-radius: 0;
    color: var(--at-paper);
    transition: background-color 140ms ease;
}

.ashby-application-form-submit-button:hover {
    background-color: #000000;
}

.ashby-application-form-submit-button:focus-visible {
    outline: 2px solid var(--at-ink);
    outline-offset: 2px;
}

/* Result containers */
.ashby-application-form-success-container {
    background-color: var(--at-white);
    border: 1px solid var(--at-line);
    border-radius: 0;
}

.ashby-application-form-failure-container,
.ashby-application-form-blocked-application-container {
    border-radius: 0;
}

.ashby-survey-form-container {
    font-family: var(--fontFamily);
}
