/*
 * Commence Job Board — Custom Ashby CSS
 * Based on Commence Brand Guidelines (April 2025)
 *
 * Ashby only allows styling the class names/selectors listed here:
 * https://www.ashbyhq.com/job_board_example_css/full-job-board.css
 *
 * To use: upload this file in Ashby Admin > Organization Settings > Theme
 * (Job Board), under "Custom CSS".
 */

:root {
  /* Commence brand colors */
  --colorPrimary900: #190C38; /* Eggplant — primary dark, headings, body text */
  --colorPrimary600: #7256F6; /* Purple — accents, links, buttons, hover */
  --colorHighlight: #51B3FA;  /* Blue — secondary accent, sparing use */
  --colorLightBg: #F0EEFB;    /* Light Purple — subtle backgrounds */

  /* Font stack — PolySans is the brand typeface; falls back to a clean
     system sans-serif per brand guide rules for web/HTML output */
  --fontFamily: "PolySans", -apple-system, BlinkMacSystemFont, "Segoe UI",
    Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji", sans-serif;

  --borderRadiusContainer: 0.5rem;
  --borderRadiusControl: 0.375rem;
  --borderRadiusButton: 0.5rem;
  --widthMaxJobBoard: 1200px;
  --colorAppBackground: #ffffff;
}

/* ---------------------------------------------------------------------
   JOB BOARD LIST VIEW
--------------------------------------------------------------------- */

.ashby-job-board-heading {
  font-family: var(--fontFamily);
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--colorPrimary900);
}

.ashby-job-board-heading-count {
  font-family: var(--fontFamily);
  color: var(--colorPrimary900);
}

.ashby-job-board-filter {
  font-family: var(--fontFamily);
  border-radius: var(--borderRadiusControl);
  border: 1px solid #e0e0e0;
  color: var(--colorPrimary900);
  background-color: #ffffff;
  transition: border-color 0.15s ease;
}

.ashby-job-board-filter:focus,
.ashby-job-board-filter:focus-within {
  border-color: var(--colorPrimary600);
  outline: none;
}

.ashby-job-board-filters-label {
  font-family: var(--fontFamily);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #676767;
}

.ashby-job-board-reset-filters-label {
  font-family: var(--fontFamily);
  color: var(--colorPrimary600);
  cursor: pointer;
}

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

/* Back to all jobs button */
.ashby-job-board-back-to-all-jobs-button {
  color: var(--colorPrimary600) !important;
  border: none !important;
  padding-left: 24px !important;
  font-family: var(--fontFamily);
}
.ashby-job-board-back-to-all-jobs-button svg {
  fill: var(--colorPrimary600) !important;
}
.ashby-job-board-back-to-all-jobs-button:hover {
  color: var(--colorPrimary900) !important;
  background-color: transparent !important;
  box-shadow: none !important;
}
.ashby-job-board-back-to-all-jobs-button:hover svg {
  fill: var(--colorPrimary900) !important;
}

/* ---------------------------------------------------------------------
   DEPARTMENT GROUPINGS
--------------------------------------------------------------------- */

.ashby-department-heading,
.ashby-job-posting-brief-department-heading {
  font-family: var(--fontFamily);
  font-weight: 500;
  color: var(--colorPrimary900);
}

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

/* ---------------------------------------------------------------------
   JOB POSTING CARDS / LIST ITEMS
--------------------------------------------------------------------- */

.ashby-job-posting-brief {
  border-radius: var(--borderRadiusContainer);
  background-color: #ffffff;
  border: 1px solid #ebebeb !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ashby-job-posting-brief:hover {
  border-color: var(--colorPrimary600);
  box-shadow: 0 1px 6px rgba(114, 86, 246, 0.15);
}

.ashby-job-posting-brief-list {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.ashby-job-posting-brief-title {
  font-family: var(--fontFamily);
  color: var(--colorPrimary900);
  transition: color 0.15s ease;
}

.ashby-job-posting-brief-title:hover {
  color: var(--colorPrimary600);
}

.ashby-job-posting-brief-details {
  font-family: var(--fontFamily);
  color: #676767;
}

/* ---------------------------------------------------------------------
   INDIVIDUAL JOB POSTING PAGE
--------------------------------------------------------------------- */

.ashby-job-posting-heading {
  font-family: var(--fontFamily);
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--colorPrimary900);
}

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

.ashby-job-posting-left-pane {
  font-family: var(--fontFamily);
  color: var(--colorPrimary900);
}

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

.ashby-job-posting-right-pane h2 {
  margin-top: 32px !important;
  color: var(--colorPrimary900);
}

.ashby-job-posting-right-pane button {
  --colorPrimary600: #7256F6 !important;
  --colorPrimary900: #190C38 !important;
  box-shadow: none !important;
}

.ashby-job-posting-right-pane input {
  --colorPrimary600: #7256F6 !important;
  --colorPrimary900: #190C38 !important;
}

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

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

/* ---------------------------------------------------------------------
   APPLICATION FORM
--------------------------------------------------------------------- */

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

.ashby-application-form-section-header-title {
  font-family: var(--fontFamily);
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--colorPrimary900);
}

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

.ashby-application-form-question-title {
  font-family: var(--fontFamily);
  color: var(--colorPrimary900);
}

.ashby-application-form-question-description {
  font-family: var(--fontFamily);
  color: #676767;
}

/* Submit button — Purple, per brand: CTAs use Purple */
.ashby-application-form-submit-button {
  font-family: var(--fontFamily);
  background-color: var(--colorPrimary600);
  color: #ffffff;
  border: none;
  border-radius: var(--borderRadiusButton);
  padding: 0.625rem 1.5rem;
  cursor: pointer;
  transition: background-color 0.15s ease;
}

.ashby-application-form-submit-button:hover {
  background-color: var(--colorPrimary900);
}

.ashby-application-form-success-container {
  font-family: var(--fontFamily);
  background-color: var(--colorPrimary900);
  color: #ffffff;
}

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

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

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

/* ---------------------------------------------------------------------
   AUTOFILL / FILE UPLOAD COMPONENTS
--------------------------------------------------------------------- */

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

.ashby-application-form-autofill-input-root {
  border-radius: var(--borderRadiusControl);
  border: 1px solid #ebebeb;
  transition: border-color 0.15s ease;
}

.ashby-application-form-autofill-input-root:focus-within {
  border-color: var(--colorPrimary600);
}

.ashby-application-form-autofill-input-title {
  font-family: var(--fontFamily);
  color: var(--colorPrimary900);
}

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

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

.ashby-application-form-autofill-input-base-layer {
  background-color: #ffffff;
}

.ashby-application-form-autofill-input-pending-layer {
  background-color: var(--colorLightBg);
}

.ashby-application-form-autofill-input-drag-layer {
  background-color: var(--colorLightBg);
  border-color: var(--colorPrimary600);
}

.ashby-application-form-autofill-input-form-alert {
  font-family: var(--fontFamily);
  color: #E42B0C;
}

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

/* ---------------------------------------------------------------------
   SURVEY FORM
--------------------------------------------------------------------- */

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

/* ---------------------------------------------------------------------
   CLEANUP
--------------------------------------------------------------------- */

/* Remove "Powered by Ashby" footer, per Commence branding preference */
footer {
  display: none !important;
}
