/* stylelint-disable */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
/* Ці змінні можна використовувати для керування значеннями по всій дошці вакансій. */
:root {
/* Темніший основний колір
УВАГА — Це можна задати в адмін-панелі Ashby в налаштуваннях теми!
Якщо змінюєте, переконайтесь що кольори відповідають налаштуванням там. */
--colorPrimary900: darkorange;

/* Світліший основний колір
УВАГА — Це можна задати в адмін-панелі Ashby в налаштуваннях теми!
Якщо змінюєте, переконайтесь що кольори відповідають налаштуванням там. */
--colorPrimary600: orange;

/* Максимальна ширина контейнера дошки вакансій */
--widthMaxJobBoard: 800px;

/* Максимальна ширина секції форми заявки */
/* --widthMaxJobBoard: 800px; */

/* Заокруглення кутів контейнера */
--borderRadiusContainer: 10px;

/* Заокруглення кутів елементів керування (наприклад, поля вводу) */
--borderRadiusControl: 10px;

/* Заокруглення кутів кнопок */
--borderRadiusButton: 10px;

/* Шрифти */
--fontFamily: "Inter", "Arial", sans-serif;

--colorAppBackground: #0B0B0B;
--colorNeutral000: #0B0B0B;
--colorNeutral200: #404040;
--colorNeutral800: #E3E3E3;
--colorNeutral700: #999898;
--colorNeutral600: #999898;
--colorNeutral300: #999898;
--colorNeutral500: #ffffff;
--colorNeutral100: #171717;

}

/* Базовий шар автозаповнення форми заявки. Містить стандартний текст, кнопку CTA та можливі сповіщення про валідацію. */
.ashby-application-form-autofill-input-base-layer {}

/* Опис автозаповнення форми заявки. */
.ashby-application-form-autofill-input-description {}

/* Оверлей стану перетягування автозаповнення. Можна стилізувати [data-state]: 'active' або 'hidden'. */
.ashby-application-form-autofill-input-drag-layer {}

/* Сповіщення форми автозаповнення. Можна стилізувати [data-highlight]: 'negative' або 'positive'. */
.ashby-application-form-autofill-input-form-alert {}

/* Іконка sparkles автозаповнення форми заявки. */
.ashby-application-form-autofill-input-icon {}

/* Оверлей стану очікування автозаповнення. Можна стилізувати [data-state]: 'active' або 'hidden'. */
.ashby-application-form-autofill-input-pending-layer {}

/* Кореневий елемент автозаповнення. Можна стилізувати [data-state]: 'pending', 'drag' або 'default'. */
.ashby-application-form-autofill-input-root {}

/* Заголовок автозаповнення форми заявки. */
.ashby-application-form-autofill-input-title {}

/* Контейнер форми автозаповнення заявки. */
.ashby-application-form-autofill-pane {}

/* Завантажувач резюме для автозаповнення форми заявки. */
.ashby-application-form-autofill-uploader {}

/* Контейнер для відображення кастомного повідомлення користувачу. */
.ashby-application-form-blocked-application-container {}

/* Контейнер форми заявки. */
.ashby-application-form-container {
background: #0B0B0B;
}

/* Контейнер повідомлення про помилку. */
.ashby-application-form-failure-container {}

/* Контейнер для мітки та поля вводу у формі заявки. */
.ashby-application-form-field-entry {}

/* Опис питання у формі заявки. Відображається лише якщо опис вказано. */
.ashby-application-form-question-description {}

/* Заголовок питання у формі заявки. */
.ashby-application-form-question-title {}

/* Окрема секція форми заявки. Всі питання загорнуті в секції, хоча дефолтна секція може не мати заголовка. */
.ashby-application-form-section-container {}

/* Хедер секції форми заявки, може містити заголовок та опис. */
.ashby-application-form-section-header {}

/* Опис секції форми заявки. Може не існувати, якщо опис не вказано. */
.ashby-application-form-section-header-description {}

/* Заголовок секції форми заявки. Може не існувати для дефолтної секції. */
.ashby-application-form-section-header-title {}

/* Кнопка відправки заявки. Має стани завантаження та наведення — варто перевірити. */
.ashby-application-form-submit-button {}

/* Контейнер повідомлення про успіх. */
.ashby-application-form-success-container {color: #fff;}

/* Опис згоди на текстові повідомлення. Відображається під полями телефону, якщо увімкнено texting. */
.ashby-application-form-texting-consent-description {}

/* Заголовок окремої команди. */
.ashby-department-heading-level {
color: #999898;
}

/* Кнопка повернення до списку всіх вакансій. */
.ashby-job-board-back-to-all-jobs-button {}

/* Елемент фільтрації дошки вакансій. */
.ashby-job-board-filter {
color: #999898;
border-radius: 0.75rem;
border: none;
background: rgba(17, 17, 17, 0.20);
min-height: 48px;
background-color: #171717;
}

.ashby-application-form-field-entry input {
color: #999898;
border-radius: 0.75rem;
border: 1px solid rgba(255, 255, 255, 0.21);
background: rgba(17, 17, 17, 0.20);
min-height: 48px;
background-color: #171717;
}

.ashby-job-board-filter svg {
fill: #999898 !important;
}

/* Мітка «Фільтри» на дошці вакансій. */
.ashby-job-board-filters-label {
color: #999898;
}

/* Заголовок всієї дошки вакансій. */
.ashby-job-board-heading {
color: #fff;
}

/* Головний хедер на сторінці вакансії. */
.ashby-job-posting-header {}

/* Заголовок вакансії. */
.ashby-job-posting-heading {
color: #fff;
}

/* Заголовок департаменту, який може містити кілька команд. */
.ashby-department-heading {}

/* Кількість вакансій на дошці. */
.ashby-job-board-heading-count {}

/* Мітка «Скинути фільтри» на дошці вакансій. */
.ashby-job-board-reset-filters-label {}

/* Контейнер картки вакансії. */
.ashby-job-posting-brief {
margin-bottom: 10px;
border: 1px solid rgba(255, 255, 255, 0.21);
background: linear-gradient(92deg, rgba(255, 255, 255, 0.04) 35.03%, rgba(153, 153, 153, 0.04) 98.05%);
min-height: 104px;
}

/* Заголовок департаменту в картці вакансії. */
.ashby-job-posting-brief-department-heading {}

/* Заголовок команди в картці вакансії. */
.ashby-job-posting-brief-department-heading-level {}

/* Контейнер деталей вакансії в картці. */
.ashby-job-posting-brief-details {
color: #999898;

}

/* Контейнер списку карток вакансій. */
.ashby-job-posting-brief-list { background: #0B0B0B;}

/* Назва вакансії в картці. */
.ashby-job-posting-brief-title {}

/* Ліва панель сторінки вакансії з деталями. */
.ashby-job-posting-left-pane {

}

/* Права панель сторінки вакансії з табами, оглядом та формою заявки. */
.ashby-job-posting-right-pane {

}

/* Таб заявки у правій панелі сторінки вакансії. */
.ashby-job-posting-right-pane-application-tab {}

/* Таб огляду у правій панелі сторінки вакансії. */
.ashby-job-posting-right-pane-overview-tab {}

/* Слайдер табів у правій панелі сторінки вакансії. */
.ashby-job-posting-right-pane-tab-slider {}

/* Контейнер для опитувань у формі заявки. */
.ashby-survey-form-container { background: #0B0B0B;}

/* =====================================================================
   HIDE DEPARTMENT — added 2026-11-05 (same approach as RiseGuide / Leaply)
   ===================================================================== */

/* 1. Group heading above the job list */
.ashby-department-heading {
  display: none !important;
}

/* 2. "Department" filter dropdown (with its arrow icon) */
div:has(> .ashby-job-board-filter[name="departmentId"]) {
  display: none !important;
}

/* 3. "Chapters • " prefix in each job card.
   Ashby renders the whole line as plain text (no wrapper per field),
   so we shift the first line left by the exact prefix width and clip it.
   5.43em = width of "Chapters • " in Inter 400, 12px (the board font).
   !! If the department name or the board font changes, this value must be re-measured. */
.ashby-job-posting-brief-details p {
  text-indent: -5.43em;
  overflow: hidden;
  margin-top: -0.15em; /* compensates the Ashby ::before trim below */
}

/* Ashby's ::before is display:block, which blocks text-indent from applying */
.ashby-job-posting-brief-details p::before {
  display: inline;
}

/* 4. "Department" block in the left pane of the job page.
   Order: Location | Employment Type | Location Type | Department.
   :last-child = safe fallback: if a block (e.g. Compensation) is ever
   added after it, nothing gets hidden by mistake. */
.ashby-job-posting-left-pane > div:nth-child(4):last-child {
  display: none;
}