/* ==========================================================================
    LAYOUTS
    -------------------------------------------------------------------------
    XXX

    ELEMENTS
    -------------------------------------------------------------------------
    Indicators
        : Autosave (New)

    COMPONENTS
    -------------------------------------------------------------------------
    FAQs
    Video Interview
    Footer
    Buttons
    Header
    Links
    Lists
        : Compact (Override/complement)
    Navigation
        : Steps bar (Override/complement)
        : With label (New)
    Interview form
        : Boxes and outer stucture/spacings (New)
        : Fields and inner stucture/spacings (New)

    WIDGETS
    -------------------------------------------------------------------------
    Forms
        : Interview
        : Boxes and outer stucture/spacings (New)
        : Fields and inner stucture/spacings (New)
        : Text (New)
        : Some specific styles (New)
    More
        : In aside (Override/complement)

    MODULES
    -------------------------------------------------------------------------
    Main (Override/complement)

    PAGETYPES
    -------------------------------------------------------------------------
    Login
    Job Detail
    Dashboard
        : Wrapper (Override/complement)
        : Section (Override/complement)

    UTILITIES
    -------------------------------------------------------------------------
    XXX
========================================================================== */

/*
    LAYOUTS/XXX
*/

/*
    ELEMENTS/Indicators: Autosave (New)
*/

.wizard-auto-save-message {
    position: relative;
    width: 100%;
}

.wizard-auto-save-message .message {
    position: absolute;
    right: 0;
    bottom: var(--spacer--xs);
    font-size: 1.4rem;
}

.wizard-auto-save-message .message__icon {
    width: auto;
}

/*
    COMPONENTS/FAQs
*/
.article--details+.article--details {
    padding-top: var(--spacer--m);
}

.article--collapsible[open] + .article--collapsible {
    border-top: 0;
}

.article--details:not(:last-of-type) {
    padding-bottom: var(--spacer--m);
}

.article--collapsible .article__header+.article__content {
    border-top: solid .1rem var(--color--grey--medium);
    padding-top: var(--spacer--s);
}

.body--faq .paragraph u {
    text-decoration: none;
}

.body--faq .article--details .article__header__text__title {
    --title--font--size: var(--font--size--07);
}

/*
    COMPONENTS/Footer
*/

.footer {
    border: 0;
}

.footer__rights__copy {
    font-size: var(--font--size--small);
    font-weight: var(--font--weight--light);
}

.footer__links__item {
    color: var(--color--grey--darkest);
    font-size: var(--font--size--small);
    font-weight: var(--font--weight--light);
    text-decoration: none;
}

.footer__links__item:hover {
    color: var(--color--brand);
}

.footer__links__divider {
    color: var(--color--light--black);
}

.footer__links__divider {
    margin-left: var(--spacer--m);
    margin-right: var(--spacer--m);
}

.footer__social__item {
    width: 2.8rem;
    background-size: contain;
}

.footer__social__item__icon--facebook {
    background-image: var(--footer--social--icon--facebook--active);
}

.footer__social__item__icon--facebook:hover {
    background-image: var(--footer--social--icon--facebook--hover);
}

.footer__social__item__icon--x {
    background-image: var(--footer--social--icon--x--active);
}

.footer__social__item__icon--x:hover {
    background-image: var(--footer--social--icon--x--hover);
}

.footer__social__item__icon--linkedin {
    background-image: var(--footer--social--icon--linkedin--active);
}

.footer__social__item__icon--linkedin:hover {
    background-image: var(--footer--social--icon--linkedin--hover);
}

.footer__social__item__icon--instagram {
    background-image: var(--footer--social--icon--instagram--active);
}

.footer__social__item__icon--instagram:hover {
    background-image: var(--footer--social--icon--instagram--hover);
}

/* Media query to target only mobile */
@media all and (max-width:750px) {
    .footer__links {
        column-gap: var(--spacer--m);
    }

    .footer__links__divider {
        display: none;
    }
}

/*
    COMPONENTS/Buttons
*/

.button,
.methodButton--file,
.methodButton--later,
.methodButton--paste,
.methodButton--dropbox,
.greyButtonBar [class*=Button],
.ButtonBarField [class*=Button],
.autoschedule_Availability .TIN_display_Anchor,
.TIN_display_Button[id*=TIN_display_Button].TIN_input_button_Cancel,
.TIN_display_Button[id*=TIN_display_Button].TIN_input_button_Primary,
.TIN_display_Button[id*=TIN_display_Button].TIN_display_CloserButton_NotificationAndDialog,
.TIN_display_Button[id*=TIN_display_Button].autoschedule_editor_availability_header_Container_HeaderButton {
    font-weight: var(--font--weight--regular);
}

.AcceptanceCheckboxField:not(.hasErrors) .tc_formField:first-child .tc_formSublabel {
    font-weight: var(--font--weight--bold);
}

/*
    COMPONENTS/Header
*/

.menu__link:after {
    font-size: var(--font--size--small);
    font-weight: var(--font--weight--bold);
    padding-top: 0.3rem;
}

.banner__wrapper {
    justify-content: center;
}

.menu--visible .menu__item:hover .menu__link[aria-expanded=false]:after,
.menu--visible .menu__item:hover .menu__link[aria-expanded=true]:after,
.menu__link[aria-expanded=true]:after,
.menu__link[aria-expanded=true] {
    color: var(--color--brand);
}

.submenu__list {
    border-width: .2rem;
}

.menu--visible .menu__item:hover .menu__link[aria-haspopup=true] {
    box-shadow: unset;
}

.menu--visible .portalLanguages__item+.portalLanguages__item,
.menu--visible .submenu__item+.submenu__item {
    border-top-color: var(--color--white);
}

/*
    COMPONENTS/Links
*/

a:focus,
input:focus,
button:focus,
summary:focus,
input.TIN_input_Checkbox[type=checkbox]:focus {
    border-radius: .8rem;
    outline-offset: -.2rem;
}

a:focus,
input:focus,
button:focus,
input.TIN_input_Checkbox[type=checkbox]:focus {
    outline: .5rem auto var(--color--buttons--focus);
}

summary:focus {
    outline: .2rem solid var(--color--buttons--focus);
}

/*
    COMPONENTS/Lists: Compact (Override/complement)
*/

.list--view-more .list__item a {
    display: initial;
    padding: unset;
}

/* Media query to target only mobile */
@media all and (max-width:750px) {
    .list--view-more .list__item {
        padding: var(--spacer--s) 0;
    }

}

/* Media query to target only tablet */
@media all and (min-width:751px) and (max-width:1024px) {
    .list--view-more .list__item {
        flex: 0 0 50%;
        max-width: 50%;
    }

}

/* Media query to target only desktop */
@media all and (min-width:1025px) {
    .list--view-more .list__item {
        padding: var(--spacer--s) 0;
    }

}

/*
    COMPONENTS/Navigation: Steps bar (Override/complement)
*/

/* Media query to target tablet and desktop */
@media all and (min-width:751px) {
    .list--steps .list__item__text__subtitle {
        margin-bottom: -.8rem;
        width: 2rem;
        height: 2rem;
        text-indent: -999.9rem;
        overflow: hidden;
    }
}

/* Media query to target tablet and desktop */
@media all and (min-width:751px) {
    .list--steps .list__item__text__subtitle {
        margin-bottom: -.6rem;
        width: 1.6rem;
        height: 1.6rem;
        text-indent: -999.9rem;
        overflow: hidden;
    }

    .list--steps .list__item--filled .list__item__text__subtitle,
    .list--steps .list__item--current .list__item__text__subtitle {
        background-color: var(--color--disabled);
    }

    .list--steps .list__item .list__item__text:after{
        border-bottom-color: var(--color--disabled);
    }
}

/*
    COMPONENTS/Navigation: Steps bar: With label (New)
*/

/* Media query to target only mobile */
@media all and (max-width:750px) {
    .list--steps--with-label .list__label {
        display: none;
    }

}

/* Media query to target tablet and desktop */
@media all and (min-width:751px) {
    .list--steps--with-label:after {
        bottom: 20%;
        transform: translateY(.2rem);
    }

    .list--steps--with-label .list__label {
        position: absolute;
        right: 100%;
        width: var(--label--width);
        font-size: 1.4rem;
        display: none;
    }

    .list--steps--with-label .list__item__text__subtitle {
        margin-top: 0;
        margin-bottom: 0;
    }

    .list--steps--with-label .list__item .list__item__text:after {
        bottom: 20%;
        transform: translateY(.2rem);
        border-radius: unset;
    }

    .list--steps .list__item__text__title {
        text-transform: initial;
        font-weight: initial;
        color: var(--color--grey--darkest);
        margin-bottom: var(--spacer--s2);
    }
}

/*
    WIDGETS/Forms: Interview: Boxes and outer stucture/spacings (New)
*/

.form--interview :is(.Separator, .FormHeader) {
    display: none;
}

.form--interview :is(.Section--sidebar, .Section--main),
.form--interview .Section--form .formfieldSpec {
    box-shadow: 0 0 .4rem .1rem var(--color--shadow);
    border-radius: var(--boxes--border--radius);
}

.form--interview .Section--form .formfieldSpec.FileSchemaField div[id*="fileInput_"] {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.form--interview .Section--form .formfieldSpec.FileSchemaField div[id*="fileInput_"] .uploadedFile {
    display: none;
    justify-content: flex-end;
    padding-top: var(--fieldSpec--padding--inners);
    padding-right: var(--fieldSpec--padding--inners);
    padding-left: var(--fieldSpec--padding--inners);
}

.form--interview .Section--form .formfieldSpec.FileSchemaField div[id*="fileInput_"] .errorMessage {
    padding-left: var(--fieldSpec--padding--inners);
    padding-right: var(--fieldSpec--padding--inners);
}

/* Media query to target only mobile */
@media all and (max-width:750px) {

    .form--interview :is(.Section--sidebar, .Section--main),
    .form--interview .Section--form .formfieldSpec {
        padding: var(--spacer--l) var(--spacer--m);
    }

    .form--interview .Section--sidebar+.Section--main {
        margin-top: var(--spacer--m);
    }

    .form--interview .Section--full {
        margin-top: var(--spacer--l);
    }

}

/* Media query to target tablet and desktop */
@media all and (min-width:751px) {

    .form--interview :is(.Section--sidebar, .Section--main),
    .form--interview .Section--form .formfieldSpec {
        padding: var(--spacer--l);
    }
}

/* Media query to target only tablet */
@media all and (min-width:751px) and (max-width:1024px) {
    .form--interview .Section--sidebar+.Section--main {
        margin-top: var(--spacer--l);
    }

    .form--interview .Section--full {
        margin-top: var(--spacer--xl);
    }
}

/* Media query to target only desktop */
@media all and (min-width:1025px) {
    .form--interview {
        display: flex;
        flex-wrap: wrap;
    }

    .form--interview .Section {
        margin: 0;
        min-inline-size: initial;
        width: 100%;
    }

    .form--interview .Section--sidebar,
    .form--interview .Section--form .formfieldSpec.FileSchemaField {
        width: var(--content--w--sidebar);
    }

    .form--interview .Section--form .formfieldSpec.FileSchemaField {
        min-height: 58rem;
    }

    .form--interview .Section--sidebar+.Section--main {
        margin-left: var(--grid--columns--gap);
        width: calc(100% - var(--content--w--sidebar) - var(--grid--columns--gap));
    }

    .form--interview .Section--form {
        position: relative;
    }

    .form--interview .Section--form .formfieldSpec.FileSchemaField div[id*="fileInput_"] {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: calc(var(--content--w--sidebar) + var(--grid--columns--gap));
        width: unset;
        background-color: var(--color--black);
    }

    .form--interview .Section--full {
        margin-top: var(--spacer--l);
    }
}

/*
    WIDGETS/Forms: Interview: Fields and inner stucture/spacings (New)
*/

.form--interview :is(.Section--sidebar, .Section--main) div[class*="description"] h3,
.form--interview .Section--form .formfieldSpec>label,
.form--interview .Section--form .formfieldSpec fieldset>legend {
    padding-bottom: var(--spacer--m);
}

.form--interview :is(.fieldSpec, .datasetfieldSpec, .formfieldSpec) {
    padding-bottom: 0;
}

.form--interview div[class*="fieldSpec"] div[class*="description"] {
    margin-top: 0;
}

.form--interview :is(.Section--sidebar, .Section--main) .fieldSpec .description {
    padding-bottom: 0;
}

.form--interview .Section--form .formfieldSpec .formdescription:not(:empty) {
    display: flex;
    row-gap: var(--spacer--m);
    column-gap: var(--grid--columns--gap);
}

.form--interview .Section--form .formfieldSpec:not(.FileSchemaField) .formdescription:not(:empty) {
    padding-bottom: var(--spacer--m);
}

/* Media query to target mobile and tablet */
@media all and (max-width:1024px) {
    .form--interview .Section--form .formfieldSpec.FileSchemaField .formdescription {
        padding-bottom: var(--spacer--m);
    }
}

/* Media query to target only mobile */
@media all and (max-width:750px) {
    .form--interview .Section--form .formfieldSpec .formdescription {
        flex-direction: column;
    }
}

/* Media query to target only tablet */
@media all and (min-width:751px) and (max-width:1024px) {
    .form--interview .Section--form .formfieldSpec .formdescription .formvideoDescription {
        min-width: calc(50% - (var(--grid--columns--gap) * .5));
    }

}

/* Media query to target only desktop */
@media all and (min-width:1025px) {
    .form--interview .Section--form .formfieldSpec .formdescription {
        flex-direction: column;
    }

    .form--interview .Section--form .formfieldSpec.FileSchemaField .formdescription {
        padding-bottom: 0;
    }
}

/*
    WIDGETS/Forms: Interview: Some specific styles (New)
*/

.form--interview div[class*="fieldSpec"] div[class*="description"] video {
    width: 100%;
}

.form--interview .fieldSpec+.fieldSpec.AcceptanceCheckboxField {
    margin-top: var(--spacer--m);
}

.form--interview .fieldSpec.AcceptanceCheckboxField fieldset>legend {
    padding-bottom: 0;
}

.form--interview.form--step1 .previousButton {
    display: none;
    /* we add (and then hide) a Prev button between the Next and the Cancel ones, to make the latter look tertiary */
}

/*
    WIDGETS/Forms: Interview: Text (New)
*/

.form--interview :is(.Section--sidebar, .Section--main) div[class*="description"] h3,
.form--interview .Section--form .formfieldSpec>label,
.form--interview .Section--form .formfieldSpec fieldset>legend {
    font-family: var(--font--alt);
    font-weight: var(--font--weight--bold);
}

.form--interview div[class*="fieldSpec"] div[class*="description"] {
    font-size: inherit;
}

/* Media query to target only mobile */
@media all and (max-width:750px) {
    .form--interview :is(.Section--sidebar, .Section--main) div[class*="description"] h3,
    .form--interview .Section--form .formfieldSpec>label,
    .form--interview .Section--form .formfieldSpec fieldset>legend {
        font-size: 2.1rem;
    }
}

/* Media query to target tablet and desktop */
@media all and (min-width:751px) {
    .form--interview :is(.Section--sidebar, .Section--main) div[class*="description"] h3,
    .form--interview .Section--form .formfieldSpec>label,
    .form--interview .Section--form .formfieldSpec fieldset>legend {
        font-size: 2.4rem;
    }
}

/*
    WIDGETS/More: In aside (Override/complement)
*/

/* Media query to target only tablet */
@media all and (min-width:751px) and (max-width:1024px) {
    .article--view-more--aside .article__content {
        margin-top: var(--spacer--l);
    }
}

/*
    MODULES/Main (Override/complement)
*/

/*
    PAGETYPES/Login
*/

.body--login .article {
    border: .1rem solid var(--color--grey--medium);
}

.body--login .button {
    width: 100%;
}

/*
    PAGETYPES/Job Detail
*/

.icon--atom .article__header__text__title::before {
    content: '';
    display: block;
    width: var(--spacer--l);
    height: var(--spacer--l);
    background-image: var(--icon--atom);
    background-size: contain;
    margin-right: var(--spacer--s);
}

.body--detail {
    --font--size--06: 2.2rem
}

.article__header__img {
    width: 9rem;
    height: auto;
}

/*
    PAGETYPES/Dashboard: Wrapper (Override/complement)
*/

/* Media query to target mobile and tablet */
@media all and (max-width:1024px) {
    .body--dashboard .main__wrapper {
        --main--padding--top: var(--spacer--l);
        --main--padding--bottom: var(--spacer--l);
    }

}

/* Media query to target only desktop */
@media all and (min-width:1025px) {
    .body--dashboard .main__wrapper {
        --main--padding--top: var(--spacer--xxxl);
        --main--padding--bottom: var(--spacer--xxxl);
    }

}

/*
    PAGETYPES/Dashboard: Section (Override/complement)
*/

.section--dashboard .section__header__text__subtitle {
    font-size: 1.4rem;
}

.section--dashboard *+.section__header__text__subtitle {
    margin-top: var(--spacer--m);
}

.section--dashboard .embed-container iframe {
    border-width: .1rem;
    border-style: solid;
    border-color: var(--color--borders);
}

.section__header--center .section__header__actions {
    margin-top: var(--spacer--m);
}

/* Media query to target only mobile */
@media all and (max-width:750px) {
    .section--dashboard+.section--dashboard {
        margin-top: var(--spacer--l);
    }

    .section--dashboard .section__header:not(.section__header--center) {
        flex-direction: column;
        align-items: flex-start;
    }

    .section--dashboard .section__header:not(.section__header--center) .section__header__actions {
        margin-top: var(--spacer--l);
    }

    .section--dashboard .section__header__actions {
        width: 100%;
    }

    .section--dashboard .section__header+.section__content {
        margin-top: var(--spacer--m);
    }

}

/* Media query to target tablet and desktop */
@media all and (min-width:751px) {
    .section--dashboard:nth-of-type(1) .section__header {
        box-shadow: 0 0 .4rem .1rem var(--color--shadow);
        padding: var(--spacer--xl) var(--spacer--l) var(--spacer--l);
    }

    .section--dashboard .section__header__actions {
        max-width: 26.4rem;
    }

    .section--dashboard .section__header+.section__content {
        margin-top: var(--spacer--l);
    }

}

/* Media query to target only tablet */
@media all and (min-width:751px) and (max-width:1024px) {
    .section--dashboard+.section--dashboard {
        margin-top: var(--spacer--xl);
    }

}

/* Media query to target only desktop */
@media all and (min-width:1025px) {
    .section--dashboard+.section--dashboard {
        margin-top: var(--spacer--xxxl);
    }
}

/* Inputs:
-------------------------------------------------------------------------- */
::placeholder {
    font-weight: var(--font--weight--light);
}

.dropdown__placeholder,
.form .tox.tox-tinymce,
.form input[type=color],
.form input[type=date],
.form input[type=datetime-local],
.form input[type=email],
.form input[type=file],
.form input[type=month],
.form input[type=number],
.form input[type=password],
.form input[type=range]:not(.progress-bar__selector),
.form input[type=search]:not([class*=select2]),
.form input[type=tel], .form input[type=text]:not([class*=select2]), .form input[type=time], .form input[type=url], .form input[type=week], .form select, .form textarea, .select2-container--default .select2-search--dropdown .select2-search__field, .select2-container--default .select2-selection--multiple, .select2-container--default .select2-selection--single, textarea.TIN_input_TextArea {
    transition: box-shadow .3s ease;
    font-weight: var(--font--weight--light);
}

.form .fieldSpec.hasErrors:not(.formfieldSpec,.datasetField,.MultipleDatasetEntryFormField,.fieldSpec--in-dataset) input[type=file] {
    color: var(--color--error);
}

.dropdown__placeholder:hover,
.form .tox.tox-tinymce:hover,
.form input[type="color"]:hover,
.form input[type="date"]:hover,
.form input[type="datetime-local"]:hover,
.form input[type="email"]:hover,
.form input[type="file"]:hover,
.form input[type="month"]:hover,
.form input[type="number"]:hover,
.form input[type="password"]:hover,
.form input[type="range"]:not(.progress-bar__selector):hover,
.form input[type="search"]:not([class*="select2"]):hover,
.form input[type="tel"]:hover,
.form input[type="text"]:not([class*="select2"]):hover,
.form input[type="time"]:hover,
.form input[type="url"]:hover,
.form input[type="week"]:hover,
.form select:hover,
.form textarea:hover,
.select2-container--default .select2-search--dropdown .select2-search__field:hover,
.select2-container--default .select2-selection--multiple:hover,
.select2-container--default .select2-selection--single:hover,
textarea.TIN_input_TextArea:hover {
    box-shadow: 0 0.4rem 1.6rem 0 var(--color--shadow);
}

.select2-container--default .select2-results__option,
.select2-container--default .select2-search--inline .select2-search__field {
    font-weight: var(--font--weight--light);
}

.select2-container--default .select2-results__option {
    font-size: var(--font--size--small);
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    color: var(--color--clickeable);
}

/* Links:
-------------------------------------------------------------------------- */
.CheckBoxListFormField_more,
.RadioButtonListFormField_more,
.article--details .article__content__view__field__value a,
.link,
.tc_formDescription a,
.tc_formSublabel a {
    color: var(--color--font);
    transition: none;
    font-weight: var(--font--weight--light);
    text-decoration-color: currentColor;
}

.CheckBoxListFormField_more:hover,
.RadioButtonListFormField_more:hover,
.article--details .article__content__view__field__value a:hover,
.link:hover,
.tc_formDescription a:hover,
.tc_formSublabel a:hover {
    color: var(--color--buttons);
}

/* Button - Cancel:
-------------------------------------------------------------------------- */
.button--secondary+.button--cancel,
.button--secondary+.button--cancel:link,
.button--secondary+.button--cancel:visited,
.button--tertiary, .button--tertiary:link,
.button--tertiary:visited,
button:not(.saveButton):not(.submitButton):not(.nextButton):not(.formNextButton):not(.gotoButton):not(.redirectUrlButton)~.cancelButton,
button:not(.saveButton):not(.submitButton):not(.nextButton):not(.formNextButton):not(.gotoButton):not(.redirectUrlButton)~.cancelButton:link,
button:not(.saveButton):not(.submitButton):not(.nextButton):not(.formNextButton):not(.gotoButton):not(.redirectUrlButton)~.cancelButton:visited {
    text-decoration: none;
}

/* UTILITIES: XXX
-------------------------------------------------------------------------- */

.article--details:not(.form-fields-label--inline) .MultipleDataSetFieldLabel+.MultipleDataSetFieldValue,
.article--details:not(.regular-fields-label--inline) .article__content__view__field__label+.article__content__view__field__value {
    margin-top: var(--spacer--s);
}

.article--details .MultipleDataSetField,
.article--details .article__content__view__field {
    padding-bottom: var(--spacer--l);
}

/* Media query to target only desktop */
@media all and (min-width:751px) {
    .article--details.regular-fields--cols-2Z .article__content__view__field {
        padding-bottom: var(--spacer--l);
    }
}

.hide--google-tag-manager {
    display: none;
    visibility: hidden;
}
