@font-face {
    font-family: "Exo";
    src: url("https://futrue.com/fonts/exo2-latin.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
}

/* stylelint-disable */

/* ============================================================
   Variablen
   ============================================================ */
:root {
    /* FUTRUE Primärfarben */
    --colorPrimary900: #00b1eb;
    --colorPrimary600: #33c1ef;
    --colorPrimary900: transparent;
    /* Maximale Breite des Jobboards */
    --widthMaxJobBoard: 68.75rem;

    /* Standard-Radien von Ashby */
    --borderRadiusContainer: 0;
    --borderRadiusControl: 0;
    --borderRadiusButton: 0;

    /* Schrift */
    --fontFamily: "Exo", "Helvetica Neue", Helvetica, Arial, sans-serif;

    /* Hintergrund */
    --colorAppBackground: #001218;
}

/* ============================================================
   Basis
   ============================================================ */

html,
body {
    overflow-x: hidden;
    margin: 0;
    background-color: #001218 !important;
    color: #ffffff;
    font-family: var(--fontFamily);
    font-size: 1.0625rem;
    line-height: 1.6;
}

/* Ashby-Hintergründe transparent machen */
header,
nav,
main,
body > div {
    overflow: visible !important;
    background: transparent !important;
    background-color: transparent !important;
}

body > div > :first-child {
    background-color: transparent !important;
}

/* ============================================================
   Navigation
   ============================================================ */

div[class*="_navRoot_"] {
    display: flex;
    width: 100%;
    padding: 0;
    box-sizing: border-box;
    justify-content: center;
}

body > div > div[class*="_container_"] {
    max-width: var(--widthMaxJobBoard);
    width: 100%;
}

ul[class*="_navContainer_"] {
    width: 100%;
    max-width: var(--widthMaxJobBoard);
    margin: 0 auto;
    padding: 0 calc(var(--spacingSmall) + var(--spacingSmall));
    box-sizing: border-box;
}

ul[class*="_navContainer_"] > :first-child {
    position: absolute;
    width: 100%;
}

/* FUTRUE-Logo */
img[alt="FUTRUE"],
img[alt="Futrue"],
img[alt="FUTRUE GmbH"] {
    position: static;
    display: block;
    width: 11.875rem;
    max-width: 100%;
    height: auto;
    margin: 0;
}

/* ============================================================
   Abstände / Content
   ============================================================ */

div[class*="_filtersContainer_"] {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

div[class*="_bottomDescription_"] {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

footer {
    max-width: calc(var(--widthMaxJobBoard) - 1rem) !important;
    padding: var(--spacingSmall) 0 var(--spacingSmall) 0 !important;
}

/* ============================================================
   Hero
   ============================================================ */

.ashby-job-board-heading {
    position: relative;
    width: 100%;
    max-width: none;
    height: 27.5rem;
    min-height: 27.5rem;
    margin: 0 0 1.25rem;
    padding: 0;
    box-sizing: border-box;
    overflow: visible;
    border-radius: 0;
    color: transparent !important;
    font-size: 0 !important;
    text-align: left;
}

/* Hintergrundbild */
.ashby-job-board-heading .ashby-job-board-heading-count {
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 0;
    display: block;
    width: 100vw;
    height: 70svh;
    transform: translate(-50%, -6.875rem);
    background-image:
        linear-gradient(
            90deg,
            rgba(0, 18, 24, 0.55) 0%,
            rgba(0, 18, 24, 0.25) 55%,
            rgba(0, 18, 24, 0.05) 100%
        ),
        url("https://futrue.com/wp-content/uploads/futrue-hero-2048x1043.jpg");
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 132% auto;
    color: transparent !important;
    font-size: 0 !important;
}

/* Hero-Überschrift */
.ashby-job-board-heading::before {
    content: "We unite the best talents to revolutionize healthcare.";
    position: absolute;
    top: 7.5rem;
    left: 0;
    z-index: 2;
    display: block;
    width: 38.75rem;
    color: #ffffff;
    font-family: var(--fontFamily);
    font-size: 2.875rem;
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: 0;
    white-space: normal;
    text-shadow: 0 0.125rem 1.125rem rgba(0, 18, 24, 0.45);
}

/* Hero-Hashtag */
.ashby-job-board-heading::after {
    content: "#RethinkHealth";
    position: absolute;
    top: 15rem;
    left: 0;
    z-index: 2;
    display: block;
    width: 38.75rem;
    color: #00b1eb;
    font-family: var(--fontFamily);
    font-size: 1.3125rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: normal;
    text-shadow: 0 0.125rem 1.125rem rgba(0, 18, 24, 0.45);
}

/* ============================================================
   Filter / Dropdowns
   ============================================================ */

/* Das Label "Filters:" ausblenden */
.ashby-job-board-filters-label {
    display: none !important;
}

/* Reset-Button */
.ashby-job-board-reset-filters-label {
    margin-left: auto !important;
    color: rgba(255, 255, 255, 0.85) !important;
    font-family: var(--fontFamily) !important;
    font-size: 0.875rem !important;
}

.ashby-job-board-reset-filters-label:hover {
    color: #00b1eb !important;
}

/* Filterleiste */
div[class*="_filters_"] {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 0.5rem !important;
}

/* Äußerer Container eines Dropdowns */
div[class*="_filterContainer_"] {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    min-width: 10.5rem !important;
    height: 2.5rem !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    background-color: #ffffff !important;
    border: 0.0625rem solid #d6dce0 !important;
    border-radius: 0.5rem !important;
    box-shadow: 0 0.0625rem 0.125rem rgba(0, 18, 24, 0.08) !important;
    transition:
        border-color 160ms ease,
        box-shadow 160ms ease;
}

/* Hover */
div[class*="_filterContainer_"]:hover {
    border-color: #8fa1a8 !important;
}

/* Aktives / geöffnetes Dropdown */
div[class*="_filterContainer_"]:focus-within {
    z-index: 5 !important;
    border-color: #00b1eb !important;
    box-shadow:
        0 0 0 0.125rem #00b1eb,
        0 0.25rem 0.75rem rgba(0, 18, 24, 0.18) !important;
}

/* Native Selects von Ashby */
.ashby-job-board-filter,
select.ashby-job-board-filter,
select[name="departmentId"],
select[name="employmentType"],
select[name="locationId"],
select[name="workplaceType"] {
    width: 100% !important;
    height: 100% !important;
    min-height: 2.5rem !important;
    margin: 0 !important;
    padding: 0 2.75rem 0 0.875rem !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    outline: none !important;
    cursor: pointer !important;
    background-color: #ffffff !important;
    border: 0 !important;
    border-radius: 0.4375rem !important;
    color: #20313a !important;
    font-family: var(--fontFamily) !important;
    font-size: 0.9375rem !important;
    font-weight: 400 !important;
    line-height: 1 !important;
}

/* Schrift und Optik der geöffneten nativen Auswahl */
.ashby-job-board-filter option,
select[name="departmentId"] option,
select[name="employmentType"] option,
select[name="locationId"] option,
select[name="workplaceType"] option {
    min-height: 2.25rem !important;
    padding: 0.5rem 0.875rem !important;
    background-color: #ffffff !important;
    color: #20313a !important;
    font-family: var(--fontFamily) !important;
    font-size: 0.9375rem !important;
    font-weight: 400 !important;
}

/* Aktuell ausgewählte Option */
.ashby-job-board-filter option:checked,
select[name="departmentId"] option:checked,
select[name="employmentType"] option:checked,
select[name="locationId"] option:checked,
select[name="workplaceType"] option:checked {
    background-color: #00b1eb !important;
    color: #001218 !important;
    font-weight: 600 !important;
}

/* Option beim Überfahren — Browser-Unterstützung unterschiedlich */
.ashby-job-board-filter option:hover,
select[name="departmentId"] option:hover,
select[name="employmentType"] option:hover,
select[name="locationId"] option:hover,
select[name="workplaceType"] option:hover {
    background-color: #d9f5ff !important;
    color: #001218 !important;
}

/* Ashby-Chevron rechts */
div[class*="_filterIconContainer_"] {
    position: absolute !important;
    top: 50% !important;
    right: 0.75rem !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 1rem !important;
    height: 1rem !important;
    pointer-events: none !important;
    transform: translateY(-50%) !important;
}

div[class*="_filterIconContainer_"] svg {
    width: 0.8125rem !important;
    height: 0.8125rem !important;
    fill: #53656b !important;
    transition:
        transform 160ms ease,
        fill 160ms ease;
}

/* Chevron bei Fokus in FUTRUE-Türkis */
div[class*="_filterContainer_"]:focus-within
div[class*="_filterIconContainer_"] svg {
    fill: #00b1eb !important;
    transform: rotate(180deg);
}

/* ============================================================
   Abteilungen und Stellenliste
   ============================================================ */

.ashby-department-heading {
    margin: 4rem 0 0.5rem;
    color: #ffffff !important;
    font-family: var(--fontFamily);
    font-size: 2.125rem;
    font-weight: 400;
    letter-spacing: -0.03125rem;
}

.ashby-department-heading-level {
    color: rgba(255, 255, 255, 0.7) !important;
    font-family: var(--fontFamily);
    font-size: 1.125rem;
    font-weight: 400;
}

.ashby-job-posting-brief {
    margin-bottom: 0;
    padding: 1.375rem 0;
    background-color: transparent !important;
    border-bottom: 0.0625rem solid rgba(255, 255, 255, 0.25);
    border-radius: 0 !important;
}

.ashby-job-posting-brief-title {
    color: #ffffff !important;
    font-family: var(--fontFamily);
    font-size: 1.375rem;
    font-weight: 400;
}

.ashby-job-posting-brief-title:hover {
    color: #00b1eb !important;
}

.ashby-job-posting-brief-details {
    color: rgba(255, 255, 255, 0.7) !important;
    font-family: var(--fontFamily);
    font-size: 0.9375rem;
}

/* ============================================================
   Detailseite einer Stelle
   ============================================================ */

.ashby-job-posting-heading {
    color: #ffffff !important;
    font-family: var(--fontFamily);
    font-size: 2.5rem;
    font-weight: 400;
    letter-spacing: -0.03125rem;
}

.ashby-job-posting-left-pane,
.ashby-job-posting-right-pane {
    color: #ffffff;
    font-family: var(--fontFamily);
}

.ashby-job-board-back-to-all-jobs-button {
    color: #ffffff !important;
    font-family: var(--fontFamily);
}

.ashby-job-board-back-to-all-jobs-button:hover {
    color: #00b1eb !important;
}

/* ============================================================
   Bewerbungsformular
   ============================================================ */

.ashby-application-form-section-header-title,
.ashby-application-form-question-title {
    color: #ffffff !important;
    font-family: var(--fontFamily);
    font-weight: 400;
}

.ashby-application-form-section-header-description,
.ashby-application-form-question-description,
.ashby-application-form-texting-consent-description {
    color: rgba(255, 255, 255, 0.7) !important;
    font-family: var(--fontFamily);
}

/* Eingabefelder im Bewerbungsformular */
input,
textarea,
select:not(.ashby-job-board-filter) {
    background-color: #ffffff !important;
    border: 0.0625rem solid rgba(255, 255, 255, 0.4) !important;
    border-radius: 0 !important;
    color: #001218 !important;
    font-family: var(--fontFamily) !important;
}

input::placeholder,
textarea::placeholder {
    color: #53656b !important;
}

/* Submit-Button */
.ashby-application-form-submit-button {
    padding: 0.875rem 2rem !important;
    background-color: #00b1eb !important;
    border: none !important;
    border-radius: 0 !important;
    color: #001218 !important;
    font-family: var(--fontFamily);
    font-size: 1rem !important;
    font-weight: 700 !important;
}

.ashby-application-form-submit-button:hover {
    background-color: #33c1ef !important;
}

/* ============================================================
   Mobile
   ============================================================ */

@media (max-width: 43.75rem) {
    /* Navigation */
    div[class*="_navRoot_"] {
        padding-top: 1.5rem;
    }

    img[alt="FUTRUE"],
    img[alt="Futrue"],
    img[alt="FUTRUE GmbH"] {
        top: 1.5rem;
        left: 1.5rem;
        width: 8.75rem;
        margin-left: 0;
    }

    /* Hero */
    .ashby-job-board-heading {
        height: 25rem;
        min-height: 25rem;
        margin-bottom: 1rem;
        padding: 0;
        transform: none;
    }

    .ashby-job-board-heading .ashby-job-board-heading-count {
        left: 50%;
        width: 100vw;
        height: 50svh;
        transform: translate(-50%, -5.625rem);
        background-position: 60% 42%;
        background-size: cover;
    }

    .ashby-job-board-heading::before {
        top: 8.75rem;
        left: 0;
        width: 20rem;
        margin-left: 0;
        font-size: 1.875rem;
        letter-spacing: 0;
    }

    .ashby-job-board-heading::after {
        top: 17.8125rem;
        left: 0;
        width: 20rem;
        margin-left: 0;
        font-size: 1.0625rem;
    }

    /* Filter: zwei Filter pro Zeile */
    div[class*="_filters_"] {
        gap: 0.625rem !important;
    }

    div[class*="_filterContainer_"] {
        flex: 1 1 calc(50% - 0.3125rem) !important;
        min-width: 9.25rem !important;
    }

    .ashby-job-board-reset-filters-label {
        width: 100% !important;
        margin: 0.25rem 0 0 !important;
    }

    /* Stellen */
    .ashby-department-heading {
        margin-top: 3rem;
        font-size: 1.6875rem;
    }

    .ashby-job-posting-brief-title {
        font-size: 1.1875rem;
    }

    .ashby-job-posting-heading {
        font-size: 1.875rem;
    }
}

/* Sehr kleine Displays: ein Filter pro Zeile */
@media (max-width: 28rem) {
    div[class*="_filterContainer_"] {
        flex-basis: 100% !important;
    }
}


/*
Formular
*/
.ashby-job-posting-right-pane > div {
    background-color: transparent !important;
}

.ashby-job-posting-left-pane {
    background-color: transparent !important;
}

a[class*="_tab_"]:hover{
    color: white !important;
}

.ashby-job-board-back-to-all-jobs-button {
    position: absolute;
    bottom: -1rem;
}

.ashby-application-form-autofill-pane{
    background-color: transparent !important;
}

.ashby-application-form-container{
    background-color: transparent !important;
}

.ashby-application-form-autofill-input-root{
    background-color: transparent !important;
}

.ashby-job-board-back-to-all-jobs-button:hover > svg {
    fill: white !important;
}

.ashby-job-board-back-to-all-jobs-button > svg:hover {
    fill: white !important;
}

input {
    background-color: transparent !important;
}

textarea {
    background-color: transparent !important;
}


/* ============================================================
   Ashby-Erweiterungspunkte
   ============================================================ */

.ashby-application-form-autofill-input-base-layer {}
.ashby-application-form-autofill-input-description {}
.ashby-application-form-autofill-input-drag-layer {}
.ashby-application-form-autofill-input-form-alert {}
.ashby-application-form-autofill-input-icon {}
.ashby-application-form-autofill-input-pending-layer {}
.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 {}
.ashby-application-form-failure-container {}
.ashby-application-form-field-entry {}
.ashby-application-form-section-container {}
.ashby-application-form-section-header {}
.ashby-application-form-success-container {}
.ashby-job-posting-brief-list {}
.ashby-job-posting-brief-department-heading {}
.ashby-job-posting-brief-department-heading-level {}
.ashby-job-posting-header {}
.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 {}