/*
 * ============================================================
 *  DRESSLY (DRSL) — Ashby Job Board Custom CSS
 *  Brand & Visual Identity Manual · Year 2026
 *  "Dress Right, Shop Less"  —  DARK THEME v5
 * ============================================================
 *
 *  Ashby UI Brand Colors (set in admin panel, NOT here):
 *    Brand Color ........... #DEE1E6 (Bright Star)
 *    Brand Color (Dark) .... #FBF5F6 (Walkie Chalkie)
 *
 * ============================================================
 */

@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');

:root {
  /* Override Ashby neutral palette to force dark backgrounds */
  --colorNeutral000: #191919;
  --colorNeutral100: #252525;
  --colorNeutral200: #3D3D3D;
  --colorNeutral300: #4F4F4F;
  --colorNeutral400: #5D5D5D;
  --colorNeutral500: #6D6D6D;
  --colorNeutral600: #888888;
  --colorNeutral700: #B0B0B0;
  --colorNeutral800: #DEE1E6;
  --colorNeutral900: #F6F7F8;

  --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;
  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 CARDS ─────────────────────────────────────────────── */

.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: #FBF5F6;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
}

.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;
}

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

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


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

.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: #FFFFFF;
}

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

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

.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;
}

.ashby-job-posting-brief-department-heading {
  font-family: var(--fontFamily);
  color: #DEE1E6;
}

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


/* ── PRIMARY CTA — "Submit Application" ───────────────────── */

.ashby-application-form-submit-button {
  font-family: var(--fontFamily);
  font-size: 16px;
  letter-spacing: 0.04em;
  background-color: #DEE1E6;
  color: #191919;
  border: none;
  border-radius: 8px;
  padding: 18px 32px;
  width: 100%;
  max-width: 100%;
  cursor: pointer;
  box-shadow: none !important;
  transition: background-color 200ms ease;
}

.ashby-application-form-submit-button:hover {
  background-color: #FBF5F6;
  color: #191919;
  box-shadow: none !important;
}

.ashby-application-form-submit-button:active {
  box-shadow: none !important;
}


/* ── SECONDARY BUTTON — "Upload File" ─────────────────────── */

.ashby-application-form-autofill-uploader {
  font-family: var(--fontFamily);
  background-color: transparent;
  border: 1px solid #FFFFFF;
  border-radius: 8px;
  color: #FFFFFF;
  box-shadow: none !important;
  transition: background-color 200ms ease, color 200ms ease, border-color 200ms ease;
}

.ashby-application-form-autofill-uploader:hover {
  background-color: #FBF5F6;
  color: #191919;
  border-color: #FBF5F6;
  box-shadow: none !important;
}


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

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

.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-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 / RESUME UPLOAD AREA ─────────────────────────── */

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

.ashby-application-form-autofill-input-root:hover {
  border-color: #838383;
  background-color: rgba(251, 245, 246, 0.05);
}

.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);
}


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

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

[role=option]:hover {
  background: #fbf5f6 !important;
color: #191919 !important;
}