header.page-header {
    position: fixed;
    width: 100%;
    height: $header-height;
    z-index: 9999;
    background-color: transparent;
    border-bottom: none;

    @include tablet-down {
        height: $header-height-mobile;
    }

    &.page-header {
        margin-bottom: 0;
    }

    &.sticky {
        background-color: $white;
    }
    &.d-none {
        display: none;
    }

    .header.content {
        position: relative;
        width: 100%;
        height: 100%;
        padding: 0;

        @include tablet-down {
            padding: 0;
        }

        .mobile-locator {
            display: none;
            position: absolute;
            right: 50px;
            width: 30px;
            height: 48px;
            text-indent: -10000px;
            @include center-vertical;
            padding: 0;

            &:before {
                content: "";
                position: absolute;
                @include center-both;
                @include icon-retina('map-pin', 14px, 20px)
            }

            @include tablet-down {
                display: block;
            }
        }

        .block-switch,
        .navigation_home,
        .navigation {
            @include tablet-down {
                display: none;
            }
        }

        .block-switch {
            position: absolute;
            left: 32px;
            top: 36px;

            select.language-select {
                border: none;
                max-width: 70px;
                padding: 0 0 0 5px;
                @include deskB1;
            }

            .select2-container {
                position: relative;
                z-index: 1000;
            }

            .select2 {
                .selection {
                    .select2-selection {
                        height: auto;
                        border: 0;
                        background-color: transparent;

                        .select2-selection__rendered {
                            color: $black;
                            @include deskB1;
                        }

                        .select2-selection__arrow {
                            height: 20px;
                            left: 68px;

                            b {
                                @include icon-svg('arrow_down_black', 16px, 16px);
                            }
                        }
                    }
                }
            }
        }

        .nav-toggle {
            @include tablet-down {
                display: block;
                @include center-vertical;
                background: none;
                left: 16px;
                top: 34px;

                &:before {
                    content: "";
                    position: relative;
                    float: left;
                    @include icon-svg('burger_black', 24px, 24px);
                }
            }
        }

        .logo {
            position: absolute;
            @include center-horizontal;
            top: 23px;
            margin: 0;
            @include tablet-down {
                top: 16px;
                margin: 0;

                img {
                    height: 38px !important;
                }
            }

            .logo-image {
                &.white {
                    display: none;
                }

                &.black {
                    display: block;
                }
            }
        }

        .block-search {
            height: 24px;
            position: absolute;
            right: 110px;
            top: 35px;
            width: 24px;
            padding: 0;

            @include tablet-down {
                left: 60px;
                top: 22px;
                margin-top: 0;
            }

            &:after {
                content: '';
                @include icon-svg('search_black', 24px, 24px);
            }

            .text {
                display: none;
            }
        }

        .block-account {
            height: 24px;
            position: absolute;
            right: 68px;
            top: 35px;
            width: 24px;

            @include tablet-down {
                right: 60px;
                top: 22px;
            }

            &:after {
                content: '';
                @include icon-svg('account_black', 24px, 24px);
            }

            span.text {
                display: none;
            }
        }
    }

    &.sticky {
        background-color: $white;

        .header.content {
            .block-switch {
                .select2 {
                    .selection {
                        .select2-selection {
                            background-color: $white;

                            .select2-selection__rendered {
                                color: $black;
                            }

                            .select2-selection__arrow {
                                b {
                                    @include icon-svg('arrow_down_black', 16px, 16px);
                                }
                            }
                        }
                    }
                }
            }

            .nav-toggle {
                @include tablet-down {
                    &:before {
                        @include icon-svg('burger_black', 24px, 24px);
                    }
                }
            }

            .block-search {
                &:after {
                    @include icon-svg('search_black', 24px, 24px);
                }
            }

            .block-account {
                &:after {
                    @include icon-svg('account_black', 24px, 24px);
                }
            }

            .logo {
                .logo-image {
                    &.white {
                        display: none;
                    }

                    &.black {
                        display: block;
                    }
                }
            }

            .minicart-wrapper {
                &:after {
                    @include icon-svg('bag_black', 24px, 24px);
                }

                .counter-number {
                    background: $black;
                    color: $white;
                }

                .showcart {
                    color: $black;

                    .counter {
                        span {
                            color: $black;
                        }
                    }
                }
            }

            .navigation,
            .navigation_home {
                .navbar-collapse {
                    .navbar-nav {
                        li.level0 {
                            .level-top {
                                color: $black;
                            }
                        }
                    }
                }
            }
        }
    }
    @include desktop {
        &:hover {
            background-color: $white;

            .header.content {
                .block-switch {
                    .select2 {
                        .selection {
                            .select2-selection {
                                background-color: $white;

                                .select2-selection__rendered {
                                    color: $black;
                                }

                                .select2-selection__arrow {
                                    b {
                                        @include icon-svg('arrow_down_black', 16px, 16px);
                                    }
                                }
                            }
                        }
                    }
                }

                .block-search {
                    &:after {
                        @include icon-svg('search_black', 24px, 24px);
                    }
                }

                .block-account {
                    &:after {
                        @include icon-svg('account_black', 24px, 24px);
                    }
                }

                .logo {
                    .logo-image {
                        &.white {
                            display: none;
                        }

                        &.black {
                            display: block;
                        }
                    }
                }

                .minicart-wrapper {
                    &:after {
                        @include icon-svg('bag_black', 24px, 24px);
                    }

                    .counter-number {
                        background: $black;
                        color: $white;
                    }

                    .showcart {
                        color: $black;

                        .counter {
                            span {
                                color: $black;
                            }
                        }
                    }
                }

                .navigation,
                .navigation_home {
                    .navbar-collapse {
                        .navbar-nav {
                            li.level0 {
                                .level-top {
                                    color: $black;
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

.checkout-cart-index header.page-header .header.content .nav-toggle,
.checkout-index-index header.page-header .header.content .nav-toggle {
    @include tablet-down {
        display: none;
    }
}

.checkout-cart-index,
.checkout-index-index {
    header {
        &.sticky {
            background-color: transparent;
        }
        &:hover {
            background-color: transparent;
        }
    }
    .block-search {
        display: none;
    }
}

.cms-index-defaultindex {
    header {
        transition: background-color 0.4s;
        background-color: transparent;
    }
}

.nav-open {
    .page-wrapper {
        left: 0;
    }

    .mobile-menu {
        @include tablet-down {
            display: block;
        }
    }

    .nav-toggle {
        right: 16px;
        left: auto !important;

        &:before {
            background: url(../images/icons/close_black.svg) !important;
        }

        &:after {
            display: none;
        }
    }

    .block-search {
        display: none;
    }

    .block-account {
        display: none;
    }

    .minicart-wrapper {
        display: none !important;
    }
}



// Home and maison
body.cms-home,
body.checkout-onepage-success,
body.customer-account-logoutsuccess,
body.cms-maison,
body.page-layout-cms-la-maison {
    .header.content {
        .block-switch {
            .select2 {
                .selection {
                    .select2-selection {
                        .select2-selection__rendered {
                            color: $white;
                        }

                        .select2-selection__arrow {
                            b {
                                @include icon-svg('arrow_down_white', 16px, 16px);
                            }
                        }
                    }
                }
            }
        }

        .nav-toggle {
            @include tablet-down {
                &:before {
                    @include icon-svg('burger_white', 24px, 24px);
                }
            }
        }

        .block-search {
            &:after {
                @include icon-svg('search_white', 24px, 24px);
            }
        }

        .block-account {
            &:after {
                @include icon-svg('account_white', 24px, 24px);
            }
        }

        .logo {
            .logo-image {
                &.white {
                    display: block;
                }

                &.black {
                    display: none;
                }
            }
        }

        .minicart-wrapper {
            &:after {
                @include icon-svg('bag_white', 24px, 24px);
            }

            .counter-number {
                background: $white;
                color: $black;
            }

            .showcart {
                color: $white;

                .counter {
                    span {
                        color: $white;
                    }
                }
            }
        }

        .navigation,
        .navigation_home {
            .navbar-collapse {
                .navbar-nav {
                    li.level0 {
                        .level-top {
                            color: $white;
                        }
                    }
                }
            }
        }
    }
}

.modal-slide {
    .modal-header {
        padding: 40px 0;
        .action-close {
            padding: 5px 10px;
            &:before {
                content: '';
                @include icon-svg('close_black', 24px, 24px);
            }
        }
    }
    .block-title {
        text-align: center;
        & > strong {
            @include deskH2;
        }
    }
}

.modal-popup.modal-slide {
    @include phone {
        left: 0
    }
    .modal-header {
        .action-close {
            padding: 5px;
            margin: 16px;
        }
    }
    .block-subtitle {
        text-align: center;
        padding-top: 8px;
        @include deskB1;
    }
    .block-subtitle, .modal-content {
        padding-right: 64px;
        padding-left: 64px;
        @include phone {
            padding-right: 32px;
            padding-left: 32px;
        }
    }
    .modal-content {
        padding-bottom: 48px;
        .actions {
            padding-top: 14px;
            .action {
                width: 100%;
                @include deskBtn1;
            }
            .secondary {
                padding-top: 16px;
            }
        }
        .info {
            padding-top: 16px;
            text-align: center;
            & > span {
                @include deskB2;
                color: $gray4;
            }
        }
    }
    .modal-inner-wrap[class] {
        @include tablet {
            @include center-both;
        }
        width: min-content;
        min-width: 640px;
        margin: auto;
        right: auto;
        @include phone {
            width: 100%;
            background-color: $white;
            min-width: auto;
        }
    }
}

.modal-custom.modal-slide {
    .modal-inner-wrap {
        min-height: 100%;
        margin: 0;
        position: static;
        max-width: 600px;
        float: right;
        min-width: fit-content;
        width: auto;
        .modal-content {
            color: $darkgray;
            padding-right: 130px;
            padding-left: 130px;
        }

        .block-container {
            border-top: none;
            .label > span, .secondary > span, .note {
                @include deskB2;
            }
            .block-customer-login {
                padding: 0;
            }
            .form-login {
                align-items: center;
            }
            .fieldset {
                max-width: 350px;
                width: 350px;
                .note {
                    margin: 0px -10px 40px;
                    text-align: center;
                }
                .field.date input {
                    width: 100%;
                    & + .ui-datepicker-trigger {
                        display: none;
                    }
                }
                & > .field {
                    margin: 0 0 10px;
                }
                .checkbox {
                    @include customCheckbox;
                    & + label {
                        position: relative;
                    }
                }
                .mandatory-note {
                    margin-bottom: 30px;
                    margin-top: 15px;
                    & > span {
                        @include deskB2;
                        color: $gray4;
                    }
                }
            }
            .block-title {
                margin-bottom: 25px;
            }
            .label-action {
                display: flex;
                justify-content: space-between;
            }
            .field.choice {
                position: relative;
                display: inline-block;
                a, .label {
                    @include deskB2;
                    color: $gray4;
                }
                &.terms {
                    margin-bottom: 10px;
                }
                &.newsletter {
                    margin-bottom: 0px;
                }
            }
            .actions-toolbar {
                padding-top: 7px;
                &> .primary {
                    width: 100%;
                }
                &> .secondary {
                    padding-top: 25px;
                    margin: 0;
                    display: flex;
                    align-items: baseline;
                    white-space: nowrap;
                    column-gap: 7px;
                    float: left;
                }
            }
            .control {
                margin: 8px 0;
            }
            .forgot {
                color: $gray4;
                @include deskB2;
                cursor: pointer;
            }
            .action {
                cursor: pointer;
            }
        }
        .modal-footer.footer-image {
            background-image: url('../images/banners/modal-banner.jpg');
            background-size: cover;
            height: 245px;
        }
        .messages .message {
            @include deskB2;
        }
    }
}

@include phone {
    .modal-custom.modal-slide {
        color: $darkgray;
        left: 0;
        max-width: none;
        .action-close {
            &:before {
                content: '';
                @include icon-svg('close_black', 24px, 24px);
            }
        }
        .modal-inner-wrap[class] {
            max-width: none;
            width: 100%;
            background-color: $white;
            .modal-header .action-close {
                left: 0;
                right: auto;
            }
            .modal-content {
                color: $darkgray;
                padding-right: 16px;
                padding-left: 16px;
            }
            .block-container {
                .fieldset {
                    max-width: none;
                    width: auto;
                    .note {
                        margin: 0px 15px 28px;
                    }
                }
                .actions-toolbar {
                    margin-top: 32px;
                }
            }
            .modal-footer.footer-image {
                background-image: url('../images/banners/modal-banner-mobile.jpg');
                height: 290px;
            }
        }
    }
}