/*
 * ============================================================
 *  DRESSLY (DRSL) — Ashby Job Board Custom CSS
 *  Brand & Visual Identity Manual · Year 2026
 *  "Dress Right, Shop Less"
 * ============================================================
 *
 *  DARK THEME
 *
 *  Colors used:
 *    Page background ........... Piano Black       #191919
 *    Job cards (default) ....... Greyscale 900     #3D3D3D
 *    Job cards (hover) ......... White             #FFFFFF
 *    Job card title (default) .. French Porcelain  #F6F7F8
 *    Job card title (hover) .... Piano Black       #191919
 *    Job card meta (default) ... Greyscale 400     #888888
 *    Job card meta (hover) ..... Old Silver        #838383
 *    Department headings ....... Bright Star       #DEE1E6
 *    Board heading ............. White             #FFFFFF
 *    Board heading count ....... Greyscale 400     #888888
 *    Filters ................... Greyscale 900     #3D3D3D
 *    Filters label/reset ....... Greyscale 400     #888888
 *    Buttons (default) ......... White             #FFFFFF
 *    Button text (default) ..... Piano Black       #191919
 *    Buttons (hover) ........... Bright Star       #DEE1E6
 *    Back button ............... Greyscale 400     #888888
 *    Job posting heading ....... White             #FFFFFF
 *    Overview text ............. Greyscale 300     #B0B0B0
 *    Form question titles ...... French Porcelain  #F6F7F8
 *    Form descriptions ......... Greyscale 400     #888888
 *    Autofill area ............. Greyscale 900     #3D3D3D
 *    Success ................... Militant Vegan    #1DA24F
 *    Error ..................... Ottoman Red       #EF2026
 *
 *  Typography:
 *    Primary — Montserrat
 *    Fallback — Inter
 *
 * ============================================================
 */

/* ── Google Fonts ──────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Inter:wght@300;400;500;600;700&display=swap');

/* ── CSS Custom Properties ─────────────────────────────────── */
:root {
  --colorPrimary900: #FFFFFF;
  --colorPrimary600: #FBF5F6;
  --colorAppBackground: #191919;
  --widthMaxJobBoard: 860px;
  --borderRadiusContainer: 12px;
  --borderRadiusControl: 8px;
  --borderRadiusButton: 8px;
  --fontFamily: 'Montserrat', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}


/* ── JOB BOARD HEADING ─────────────────────────────────────── */

.ashby-job-board-heading {
  font-family: var(--fontFamily);
  font-weight: 600;
  font-size: 22px;
  color: #FFFFFF;
  letter-spacing: -0.01em;
}

.ashby-job-board-heading-count {
  font-family: var(--fontFamily);
  font-size: 13px;
  font-weight: 400;
  color: #888888;
}


/* ── FILTERS ───────────────────────────────────────────────── */

.ashby-job-board-filters-label {
  font-family: var(--fontFamily);
  font-size: 13px;
  font-weight: 500;
  color: #888888;
}

.ashby-job-board-filter {
  font-family: var(--fontFamily);
  font-size: 14px;
  color: #191919;
  background-color: #FFFFFF;
  border: 1px solid #DEE1E6;
  border-radius: 8px;
  transition: border-color 200ms ease;
}

.ashby-job-board-filter:hover {
  border-color: #838383;
}

.ashby-job-board-reset-filters-label {
  font-family: var(--fontFamily);
  font-size: 13px;
  font-weight: 500;
  color: #888888;
  cursor: pointer;
  transition: color 200ms ease;
}

.ashby-job-board-reset-filters-label:hover {
  color: #FFFFFF;
}


/* ── DEPARTMENT HEADINGS ───────────────────────────────────── */

.ashby-department-heading {
  font-family: var(--fontFamily);
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #DEE1E6;
  padding-bottom: 8px;
  margin-bottom: 8px;
}

.ashby-department-heading-level {
  font-family: var(--fontFamily);
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #DEE1E6;
}


/* ── JOB POSTING BRIEF (card) ──────────────────────────────── */

.ashby-job-posting-brief-list {
  max-width: 860px;
  margin: 0 auto;
}

.ashby-job-posting-brief {
  background-color: #3D3D3D;
  border-radius: 12px;
  margin-bottom: 8px;
  padding: 16px 20px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  border: none;
  transition: background-color 200ms cubic-bezier(0.25, 0.1, 0.25, 1),
              box-shadow 200ms cubic-bezier(0.25, 0.1, 0.25, 1);
}

.ashby-job-posting-brief:hover {
  background-color: #FFFFFF;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
}

/* Job title — semibold */
.ashby-job-posting-brief-title {
  font-family: var(--fontFamily);
  font-weight: 600;
  font-size: 15px;
  color: #F6F7F8;
  letter-spacing: -0.01em;
  line-height: 1.4;
  transition: color 200ms ease;
}

.ashby-job-posting-brief:hover .ashby-job-posting-brief-title {
  color: #191919;
}

/* Job metadata */
.ashby-job-posting-brief-details {
  font-family: var(--fontFamily);
  font-size: 13px;
  font-weight: 400;
  color: #888888;
  transition: color 200ms ease;
}

.ashby-job-posting-brief:hover .ashby-job-posting-brief-details {
  color: #838383;
}


/* ── JOB POSTING DETAIL PAGE ──────────────────────────────── */

.ashby-job-posting-heading {
  font-family: var(--fontFamily);
  font-weight: 600;
  font-size: 32px;
  color: #FFFFFF;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.ashby-job-posting-header {
  font-family: var(--fontFamily);
}

.ashby-job-posting-left-pane {
  font-family: var(--fontFamily);
  font-size: 14px;
  color: #B0B0B0;
}

.ashby-job-posting-right-pane {
  font-family: var(--fontFamily);
  font-size: 15px;
  color: #B0B0B0;
  line-height: 1.7;
}

.ashby-job-posting-right-pane-overview-tab {
  font-family: var(--fontFamily);
  font-size: 15px;
  line-height: 1.7;
  color: #B0B0B0;
}

.ashby-job-posting-right-pane-application-tab {
  font-family: var(--fontFamily);
}

.ashby-job-posting-right-pane-tab-slider {
  font-family: var(--fontFamily);
  font-size: 14px;
  font-weight: 500;
}

.ashby-job-board-back-to-all-jobs-button {
  font-family: var(--fontFamily);
  font-size: 13px;
  font-weight: 500;
  color: #888888;
  transition: color 200ms ease;
}

.ashby-job-board-back-to-all-jobs-button:hover {
  color: #FFFFFF;
}


/* ── APPLICATION FORM ──────────────────────────────────────── */

.ashby-application-form-container {
  font-family: var(--fontFamily);
  max-width: 640px;
}

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

.ashby-application-form-section-header {
  font-family: var(--fontFamily);
}

.ashby-application-form-section-header-title {
  font-family: var(--fontFamily);
  font-weight: 600;
  font-size: 18px;
  color: #FFFFFF;
}

.ashby-application-form-section-header-description {
  font-family: var(--fontFamily);
  font-size: 14px;
  color: #888888;
}

.ashby-application-form-field-entry {
  font-family: var(--fontFamily);
}

.ashby-application-form-question-title {
  font-family: var(--fontFamily);
  font-size: 14px;
  font-weight: 500;
  color: #F6F7F8;
}

.ashby-application-form-question-description {
  font-family: var(--fontFamily);
  font-size: 13px;
  color: #888888;
}

.ashby-application-form-submit-button {
  font-family: var(--fontFamily);
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.04em;
  background-color: #FFFFFF;
  color: #191919;
  border: none;
  border-radius: 8px;
  padding: 12px 32px;
  cursor: pointer;
  transition: background-color 200ms ease, transform 200ms ease;
}

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

.ashby-application-form-submit-button:active {
  transform: translateY(0);
}

.ashby-application-form-success-container {
  font-family: var(--fontFamily);
  color: #1DA24F;
}

.ashby-application-form-failure-container {
  font-family: var(--fontFamily);
  color: #EF2026;
}

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

.ashby-application-form-texting-consent-description {
  font-family: var(--fontFamily);
  font-size: 12px;
  color: #888888;
}


/* ── AUTOFILL INPUT ────────────────────────────────────────── */

.ashby-application-form-autofill-input-root {
  font-family: var(--fontFamily);
  border-radius: 12px;
  border: 2px dashed #4F4F4F;
  background-color: #3D3D3D;
  transition: border-color 200ms ease, background-color 200ms ease;
}

.ashby-application-form-autofill-input-root:hover {
  border-color: #838383;
  background-color: #454545;
}

.ashby-application-form-autofill-input-base-layer {
  font-family: var(--fontFamily);
}

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

.ashby-application-form-autofill-input-description {
  font-family: var(--fontFamily);
  font-size: 13px;
  color: #888888;
}

.ashby-application-form-autofill-input-form-alert {
  font-family: var(--fontFamily);
  font-size: 13px;
}

.ashby-application-form-autofill-input-drag-layer {
  font-family: var(--fontFamily);
}

.ashby-application-form-autofill-input-icon {
  color: #F6F7F8;
}

.ashby-application-form-autofill-pane {
  font-family: var(--fontFamily);
}

.ashby-application-form-autofill-uploader {
  font-family: var(--fontFamily);
}


/* ── SURVEY ────────────────────────────────────────────────── */

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