/* JOBS

01	GENERAL
02  LIST VIEW
03  DETAIL VIEW


*/

/* -----------------------------------------------------------------------
	01	GENERAL
/* ---------------------------------------------------------------------*/



/* -----------------------------------------------------------------------
	02	LIST VIEW
/* ---------------------------------------------------------------------*/

.main-content .field--name-field-ements-wfbb-page > .field__item.wfbb_job_application_overview {
    padding: var(--section-inner-side-padding);
    background: var(--color-grey-light);
    border-radius: var(--border-radius);
}

.field--name-field-title-job-overview {
    text-align: center;
    margin-bottom: var(--section-gap);
}

.row-job {
    display: grid;
    grid-gap: var(--grid-gap);
    grid-template-columns: var(--grid-columns);
}

.field__item.wfbb_job_application_overview .view-header {
    font-size: 1.5rem;
    font-weight: 700;
}

.row-title {
    grid-column: span 8;
    font-weight: 700;
}

.row-open, .row-close {
    grid-column: span 2;
    text-align: right;
}

.view.view-job-application-overview > .view-content .views-row {
    grid-column: span 12;
}

.view.view-job-application-overview > .view-content .views-row .row-job {
    grid-column: span 12;
    display: grid;
    grid-column-gap: var(--grid-gap);
    grid-template-columns: var(--grid-columns);
    align-items: center;
    position: relative;
    overflow: hidden;
    padding: 1rem 0;
}

.view.view-job-application-overview > .view-content .views-row:not(:last-child) {
    border-bottom: 1px solid var(--color-grey-dark);
}

.row-title a:after {
    display: inline-block;
    content: '';
    width: 1rem;
    height: 1.5rem;
}

.main-content .field--name-field-ements-wfbb-page > .field__item.wfbb_job_application_overview .view-empty {
    margin-top: var(--section-gap);
}


@media (max-width: 991px) {

    .field__item.wfbb_job_application_overview .view-header {
        display: none;
    }

    .row-title,
    .row-open,
    .row-close {
        grid-column: span 12;
    }

    .row-open {
        margin-top: var(--grid-gap)
    }

    .row-open:before,
    .row-close:before {
        display: inline-block;
        margin-right: .5rem;
    }

    .row-open:before {
        content: 'Online seit:';
    }

    .row-close:before {
        content: 'Bewerbungsfrist:';
    }

}


/* -----------------------------------------------------------------------
	03	DETAIL VIEW
/* ---------------------------------------------------------------------*/

.node--type-wfbb-job .teaser-intro {
    padding-bottom: 0;
}

.node--type-wfbb-job #main-content .content .content-wrapper > .field:not(.field--name-field-ements-wfbb-page) {
    padding-top: 3rem;
}

.node--type-wfbb-job #main-content .content .content-wrapper > .field:not(.field--name-field-ements-wfbb-page) h2 {
    font-size: var(--font-size-h3);
    position: relative;
    padding-top: 3rem;
}


.node--type-wfbb-job #main-content .content .content-wrapper > .field:not(.field--name-field-ements-wfbb-page) h2:before {
    display: block;
    content: '';
    width: 30%;
    height: 4px;
    background: var(--color-primary);
    border-radius: 1rem;
    position: absolute;
    top: 0rem;
}

.node--type-wfbb-job #main-content .content .content-wrapper > .field:not(.field--name-field-ements-wfbb-page) ul {
    list-style: none;
    padding-left: 2rem;
}

.node--type-wfbb-job #main-content .content .content-wrapper > .field:not(.field--name-field-ements-wfbb-page) ul li {
    position: relative;
}

.node--type-wfbb-job #main-content .content .content-wrapper > .field:not(.field--name-field-ements-wfbb-page) ul li:before {
    display: block;
    content: '';
    position: absolute;
    width: 2rem;
    height: .85rem;
    background: var(--arrow-next-primary);
    background-repeat: no-repeat;
    background-size: contain;
    top: .6rem;
    left: -2rem;
}

.node--type-wfbb-job #main-content .content .content-wrapper > .field:not(.field--name-field-ements-wfbb-page) ul li:not(:first-child) {
    margin-top: .5rem;
}

.node--type-wfbb-job .field--name-field-ements-wfbb-page {
    width: calc(100% + var(--section-inner-side-padding) * 2);
    left: calc(var(--section-inner-side-padding) * -1);
    position: relative;
    background: #fff;
    margin-top: var(--section-gap);
}

.node--type-wfbb-job .field--name-field-ements-wfbb-page #wfbb-webform {
    padding: var(--section-inner-side-padding);
    background: var(--color-grey-light);
    border-radius: var(--border-radius);
    display: grid;
    grid-gap: var(--grid-gap);
    grid-template-columns: var(--grid-columns);
}

.node--type-wfbb-job .field--name-field-ements-wfbb-page #wfbb-webform .field--name-field-title-form {
    grid-column: span 4;
}

.node--type-wfbb-job .field--name-field-ements-wfbb-page #wfbb-webform .field--name-field-title-form h2 {
    position: sticky;
    top: calc(var(--header-height) + 2rem);
}

.node--type-wfbb-job .field--name-field-ements-wfbb-page #wfbb-webform .field--name-field-wfbb-form.field--type-webform {
    grid-column: 6 / 13;
}

.field__item.wfbb_webform {
    padding-bottom: 0 !important;
}


@media (max-width: 767px) {

    .node--type-wfbb-job #main-content .content .content-wrapper > .field:not(.field--name-field-ements-wfbb-page) {
        padding-top: 2rem;
    }

    .node--type-wfbb-job #main-content .content .content-wrapper > .field:not(.field--name-field-ements-wfbb-page) h2 {
        padding-top: 2rem;
    }

    .node--type-wfbb-job #main-content .content .content-wrapper > .field:not(.field--name-field-ements-wfbb-page) h2:before {
        height: 3px;
    }

    .node--type-wfbb-job .field--name-field-ements-wfbb-page #wfbb-webform .field--name-field-title-form,
    .node--type-wfbb-job .field--name-field-ements-wfbb-page #wfbb-webform .field--name-field-wfbb-form.field--type-webform {
        grid-column: span 12;
    }

}