/* stylelint-disable */

/* ============================================================
   HALL CPA — Ashby Job Board Custom CSS (Dark Theme)
   Design language: "The Ledger & The Blueprint," after hours.
   Same bones as the light version — blueprint grid, ledger
   monospace figures, a stamped amber mark on every role — just
   built for a deep navy field instead of paper white.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@500;600&display=swap');

:root {
    /* ---- Brand palette, tuned for a dark field ---- */
    --colorPrimary900: #EAA659;   /* Amber — primary action color Ashby renders itself */
    --colorPrimary600: #4FA6BE;   /* Bright teal — secondary accent */

    --hall-amber: #EAA659;
    --hall-amber-deep: #C77F2C;   /* pressed / border-strength amber */
    --hall-teal: #4FA6BE;
    --hall-ink: #F2F4F7;          /* primary text on dark — near-white, blue-tinted */
    --hall-slate: #97A2B6;        /* secondary text */
    --hall-line: rgba(255, 255, 255, 0.10);
    --hall-line-strong: rgba(255, 255, 255, 0.16);
    --hall-bg: #0E1620;           /* deep navy field, not pure black */
    --hall-card: #16212F;         /* elevated card surface */
    --hall-card-hover: #1B2836;

    --widthMaxJobBoard: 860px;

    --borderRadiusContainer: 14px;
    --borderRadiusControl: 8px;
    --borderRadiusButton: 8px;

    --fontFamily: "IBM Plex Sans", "-apple-system", "BlinkMacSystemFont", "Segoe UI", "Helvetica", "Arial", sans-serif;
    --fontFamilyDisplay: "Fraunces", "Georgia", serif;
    --fontFamilyMono: "IBM Plex Mono", "Menlo", monospace;

    --colorAppBackground: var(--hall-bg);
}

/* ---- Base atmosphere: drafting-table dots, not spreadsheet lines ----
   Sparse, low-contrast measurement points instead of a full grid —
   reads as "blueprint" at a glance, not "graph paper" up close. */
body {
    background-color: var(--hall-bg);
    background-image: radial-gradient(circle, rgba(255, 255, 255, 0.07) 1px, transparent 1px);
    background-size: 32px 32px;
    background-position: center top;
    color: var(--hall-ink);
}

/* ---- Safety net ----
   Ashby renders some panel content (tab bodies, form field wrappers,
   Yes/No pill toggles) through internal class names its own public
   reference doesn't document — only the tab labels and outer containers
   are in the documented list, not everything nested inside them.
   Substring matching on these prefixes catches that undocumented markup
   without guessing exact class names. This block sits early in the file
   on purpose: every rule below it targets a more specific selector at
   equal specificity, so source order lets those later rules win where
   a different treatment is actually wanted (amber buttons, dark inputs,
   focus rings, etc). */
[class*="ashby-job-posting-right-pane"],
[class*="ashby-job-posting-right-pane"] *,
[class*="ashby-job-posting-left-pane"],
[class*="ashby-job-posting-left-pane"] *,
[class*="ashby-application-form"],
[class*="ashby-application-form"] * {
    background-color: var(--hall-card) !important;
    color: var(--hall-ink) !important;
}

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

.ashby-job-board-heading {
    font-family: var(--fontFamilyDisplay);
    font-weight: 600;
    font-size: 2rem;
    color: var(--hall-ink);
    letter-spacing: -0.01em;
}

.ashby-job-board-heading-count {
    font-family: var(--fontFamilyMono);
    font-weight: 500;
    color: var(--hall-teal);
    font-size: 0.95em;
}

/* ============================================================
   FILTERS — a ledger tab row, lit up against the dark field
   ============================================================ */

.ashby-job-board-filters-label {
    font-family: var(--fontFamilyMono);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.72rem;
    color: var(--hall-slate);
    font-weight: 600;
}

.ashby-job-board-filter,
.ashby-job-board-filter select,
.ashby-job-board-filter input,
.ashby-job-board-filter button {
    font-family: var(--fontFamily) !important;
    background-color: var(--hall-card) !important;
    background-image: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    border: 1px solid var(--hall-line-strong) !important;
    border-radius: var(--borderRadiusControl) !important;
    color: var(--hall-ink) !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

/* appearance:none also strips the native dropdown arrow, so redraw it by hand */
.ashby-job-board-filter select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2397A2B6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    padding-right: 36px !important;
}

/* Placeholder-state label text (e.g. "Department" before a value is picked)
   reads as secondary, not primary ink, so it doesn't compete with an
   actual selected value once the filter is in use. */
.ashby-job-board-filter option:first-child {
    color: var(--hall-slate);
}

.ashby-job-board-filter svg,
.ashby-job-board-filter img {
    color: var(--hall-slate) !important;
    fill: var(--hall-slate) !important;
}

.ashby-job-board-filter:hover,
.ashby-job-board-filter select:hover {
    border-color: var(--hall-teal) !important;
}

.ashby-job-board-filter:focus,
.ashby-job-board-filter select:focus,
.ashby-job-board-filter input:focus {
    border-color: var(--hall-amber) !important;
    box-shadow: 0 0 0 3px rgba(234, 166, 89, 0.22);
    outline: none;
}

.ashby-job-board-reset-filters-label {
    font-family: var(--fontFamilyMono);
    font-size: 0.78rem;
    color: var(--hall-teal);
    text-decoration: none;
    border-bottom: 1px dashed var(--hall-teal);
}

.ashby-job-board-reset-filters-label:hover {
    color: var(--hall-amber);
    border-bottom-color: var(--hall-amber);
}

/* ============================================================
   DEPARTMENT HEADINGS
   ============================================================ */

.ashby-department-heading {
    font-family: var(--fontFamilyDisplay);
    font-weight: 600;
    color: var(--hall-ink);
    font-size: 1.3rem;
    position: relative;
    padding-bottom: 6px;
    margin-top: 2.25rem;
}

.ashby-department-heading::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 32px;
    height: 3px;
    background-color: var(--hall-amber);
    border-radius: 2px;
}

.ashby-department-heading-level {
    font-family: var(--fontFamily);
    font-weight: 500;
    color: var(--hall-slate);
}

/* ============================================================
   JOB POSTING BRIEFS (the listing cards)
   ============================================================ */

.ashby-job-posting-brief-list {
    display: block;
}

.ashby-job-posting-brief {
    background-color: var(--hall-card);
    border: 1px solid var(--hall-line);
    border-left: 3px solid transparent;
    border-radius: var(--borderRadiusContainer);
    padding: 18px 20px;
    margin-bottom: 12px;
    transition: border-left-color 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.ashby-job-posting-brief:hover {
    background-color: var(--hall-card-hover);
    border-left-color: var(--hall-amber);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
    transform: translateY(-1px);
}

.ashby-job-posting-brief-title {
    font-family: var(--fontFamilyDisplay);
    font-weight: 600;
    font-size: 1.08rem;
    color: var(--hall-ink);
    text-decoration: none;
    background-image: linear-gradient(var(--hall-amber), var(--hall-amber));
    background-size: 0% 2px;
    background-position: left bottom;
    background-repeat: no-repeat;
    transition: background-size 0.2s ease, color 0.2s ease;
}

.ashby-job-posting-brief:hover .ashby-job-posting-brief-title {
    background-size: 100% 2px;
    color: var(--hall-amber);
}

.ashby-job-posting-brief-details {
    font-family: var(--fontFamilyMono);
    color: var(--hall-slate);
    font-size: 0.82rem;
    letter-spacing: 0.01em;
    margin-top: 4px;
}

.ashby-job-posting-brief-department-heading,
.ashby-job-posting-brief-department-heading-level {
    font-family: var(--fontFamily);
    color: var(--hall-slate);
}

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

.ashby-job-posting-header {
    border-bottom: 1px solid var(--hall-line);
    padding-bottom: 20px;
}

.ashby-job-posting-heading {
    font-family: var(--fontFamilyDisplay);
    font-weight: 700;
    color: var(--hall-ink);
    font-size: 1.9rem;
    letter-spacing: -0.01em;
}

.ashby-job-board-back-to-all-jobs-button {
    font-family: var(--fontFamilyMono);
    font-size: 0.8rem;
    color: var(--hall-teal);
    text-decoration: none;
}

.ashby-job-board-back-to-all-jobs-button:hover {
    color: var(--hall-amber);
}

.ashby-job-posting-left-pane,
.ashby-job-posting-left-pane * {
    background-color: var(--hall-card) !important;
    font-family: var(--fontFamily);
    color: var(--hall-ink) !important;
    line-height: 1.65;
}

.ashby-job-posting-left-pane {
    border: 1px solid var(--hall-line);
    border-radius: var(--borderRadiusContainer);
    padding: 20px 24px;
}

.ashby-job-posting-left-pane hr,
.ashby-job-posting-left-pane [class*="divider"] {
    border-color: var(--hall-line) !important;
}

.ashby-job-posting-right-pane {
    background-color: var(--hall-card) !important;
    border: 1px solid var(--hall-line);
    border-radius: var(--borderRadiusContainer);
}

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

.ashby-job-posting-right-pane-overview-tab,
.ashby-job-posting-right-pane-overview-tab *,
.ashby-job-posting-right-pane-application-tab,
.ashby-job-posting-right-pane-application-tab * {
    background-color: var(--hall-card) !important;
    font-family: var(--fontFamily);
    font-weight: 500;
    color: var(--hall-ink) !important;
}

/* ============================================================
   APPLICATION FORM — precise, calm, low-friction
   ============================================================ */

.ashby-application-form-container {
    font-family: var(--fontFamily);
    color: var(--hall-ink);
}

.ashby-application-form-section-header-title {
    font-family: var(--fontFamilyDisplay);
    font-weight: 600;
    color: var(--hall-ink);
    font-size: 1.15rem;
}

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

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

.ashby-application-form-question-description {
    color: var(--hall-slate);
    font-size: 0.88rem;
}

.ashby-application-form-field-entry input,
.ashby-application-form-field-entry textarea,
.ashby-application-form-field-entry select {
    background-color: var(--hall-card);
    border: 1px solid var(--hall-line-strong);
    border-radius: var(--borderRadiusControl);
    color: var(--hall-ink);
    font-family: var(--fontFamily);
}

.ashby-application-form-field-entry input:focus,
.ashby-application-form-field-entry textarea:focus,
.ashby-application-form-field-entry select:focus {
    border-color: var(--hall-amber);
    box-shadow: 0 0 0 3px rgba(234, 166, 89, 0.22);
    outline: none;
}

.ashby-application-form-submit-button {
    background-color: var(--hall-amber);
    color: var(--hall-bg);
    font-family: var(--fontFamily);
    font-weight: 600;
    border-radius: var(--borderRadiusButton);
    border: none;
    padding: 12px 28px;
    transition: background-color 0.15s ease, transform 0.15s ease;
}

.ashby-application-form-submit-button:hover {
    background-color: #F0B472;
    transform: translateY(-1px);
}

/* Resume autofill — the "magic sparkles" moment, kept understated */
.ashby-application-form-autofill-input-root {
    border: 1px dashed var(--hall-line-strong);
    border-radius: var(--borderRadiusControl);
    background-color: var(--hall-card);
}

.ashby-application-form-autofill-input-root[data-state="active"] {
    border-color: var(--hall-amber);
    background-color: rgba(234, 166, 89, 0.08);
}

.ashby-application-form-autofill-input-title {
    font-family: var(--fontFamily);
    font-weight: 600;
    color: var(--hall-ink);
}

.ashby-application-form-autofill-input-description {
    color: var(--hall-slate);
    font-size: 0.85rem;
}

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

.ashby-application-form-autofill-input-form-alert[data-highlight="positive"] {
    color: var(--hall-teal);
}

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

.ashby-application-form-texting-consent-description {
    color: var(--hall-slate);
    font-size: 0.8rem;
}

.ashby-application-form-success-container {
    font-family: var(--fontFamilyDisplay);
    color: var(--hall-teal);
    font-size: 1.2rem;
    text-align: center;
}

.ashby-application-form-failure-container,
.ashby-application-form-blocked-application-container {
    font-family: var(--fontFamily);
    color: var(--hall-slate);
    text-align: center;
}

.ashby-survey-form-container {
    border-top: 1px solid var(--hall-line);
    margin-top: 24px;
    padding-top: 20px;
}