/*------------------------------------*\
    #Header
\*------------------------------------*/

.header {
    height    : 80px;
    box-shadow: 0px 5px 41.5px rgba(40, 40, 40, 0.11);

    @media #{$minLarge} {
        height: 100px;
    }

    .navbar-brand {
        padding     : 0;
        margin      : 0;
        margin-right: 40px;

        @media (min-width: 992px) and (max-width:1100px) {
            margin-right: 20px;
        }

        @media #{$minLarge} {
            height     : 100px;
            display    : flex;
            align-items: center;
        }

        @media (min-width: 1200px) and(max-width: 1350px) {
            margin-right: 20px;
        }

        .logo {
            max-width: 100%;
            width    : 160px;
            height   : 60px;

            @media #{$maxTablet} {
                width : auto;
                height: 50px;
            }

            @media #{$maxSmall} {
                width: 100px;
            }
        }
    }

    &.header-light {
        background-color: var(--global--color-white);

        .navbar {
            background-color: var(--global--color-white);

            .logo-dark {
                display: inline-block;

                @media #{$maxTablet} {
                    display: none;
                }
            }

            .logo-light {
                display: none;
            }

            .logo-mobile {
                display: inline-block;

                @media #{$minLarge} {
                    display: none;
                }
            }

            .navbar-nav {
                >li {
                    >a {
                        color: var(--global--color-heading);

                        &::before {
                            background-color: var(--global--color-heading);
                        }
                    }
                }
            }

            .module {
                .module-icon {
                    i {
                        color: var(--global--color-secondary);

                        &:hover {
                            color: var(--global--color-primary);
                        }
                    }
                }
            }
        }
    }

    &.header-topbar {
        height: 150px;

        @media #{$maxTablet} {
            height: 80px;
        }

        .top-bar {
            @media #{$maxTablet} {
                display: none;
            }
        }

        .navbar {
            @media #{$minLarge} {
                padding   : 0 0 0 40px;
                min-height: 100px;
                position  : relative;
                top       : auto;
                bottom    : auto;
                right     : auto;
                left      : auto;
            }

            @media #{$noteBook} {
                padding: 0 0 0 20px;
            }

            .navbar-nav {
                >li {
                    >a {
                        @media #{$minLarge} {
                            line-height: 100px;
                        }
                    }
                }
            }
        }

        &.header-shadow {
            .navbar {
                box-shadow: 0px 5px 41.5px rgba(9, 29, 62, 0.11);
            }
        }

        &.header-topbar1 {
            .navbar-brand {
                @media #{$minLarge} {
                    padding-right: 40px;
                    border-right : 1px solid #eaeaea;

                    @media (min-width: 992px) and (max-width:1100px) {
                        padding-right: 20px;
                    }
                }
            }

            .module-holder {
                .module-search {
                    border-right: 1px solid #eaeaea;
                }
            }
        }

        &.header-topbar2 {
            .navbar {
                padding-right: 40px;

                @media #{$noteBook} {
                    padding-right: 20px;
                }

                .navbar-nav {
                    >li {
                        @media #{$noteBook} {
                            margin-right: 15px;
                        }
                    }
                }
            }

            .navbar-brand {
                position: relative;

                @media #{$minLarge} {
                    padding-right: 40px;
                    margin-right : 40px;

                    &::after {
                        content         : '';
                        width           : 2px;
                        height          : 41px;
                        display         : inline-flex;
                        position        : absolute;
                        top             : 50%;
                        transform       : translateY(-50%);
                        right           : 0;
                        background-color: #eaeaea;
                    }
                }

                @media #{$noteBook} {
                    padding-right: 20px;
                    margin-right : 20px;
                }
            }

            .module-holder {
                @media #{$maxTablet} {
                    flex-direction: column;
                    height        : auto;
                    align-items   : flex-start;
                }

                .module-call {
                    @media #{$minLarge} {
                        padding-right: 20px;
                        margin-right : 20px;

                        &::after {
                            content         : '';
                            width           : 2px;
                            height          : 41px;
                            display         : inline-flex;
                            position        : absolute;
                            top             : 50%;
                            transform       : translateY(-50%);
                            right           : 0;
                            background-color: #eaeaea;
                        }
                    }

                    @media #{$noteBook} {
                        padding-right: 15px;
                        margin-right : 15px;
                    }
                }

                .module-search {
                    padding-right: 30px;

                    @media #{$noteBook} {
                        padding-right: 15px;
                    }
                }

                .module-contact {
                    @media #{$minLarge} {
                        margin-left : 0px;
                        margin-right: 30px;
                        .btn{
                            font-size: 0;
                        width: auto;

                        i{
                            font-size: 15px;
                            margin-left: 0;
                        }
                        }
                    }

                    @media #{$noteBook} {
                        margin-left : 0px;
                        margin-right: 15px;
                    }
                }

                .module-cart {
                    @media #{$minLarge} {
                        margin-left: 0;
                    }

                    .module-cart-warp {
                        @media #{$minLarge} {
                            left: -300px;
                        }
                    }
                }
            }

            .module-holder-phone {
                @media #{$maxTablet} {
                    flex-direction: row;
                    height        : 80px;
                    align-items   : center;
                }

                .module-cart {
                    margin-left : 0;
                    margin-right: 30px;
                }
            }
        }

        &.header-topbar3 {
            .navbar {
                padding: 0px;

                .navbar-nav {
                    >li {
                        @media #{$noteBook} {
                            margin-right: 20px;

                            &:last-child {
                                margin-right: 0;
                            }
                        }
                    }
                }
            }

            .navbar-brand {
                position: relative;
            }

            .module-holder {
                @media #{$maxTablet} {
                    flex-direction: column;
                    height        : auto;
                    align-items   : flex-start;
                }

                @media #{$minLarge} {
                    margin-left: 30px;
                }

                .module-search {
                    padding-right: 30px;

                    @media #{$noteBook} {
                        padding-right: 15px;
                    }
                }

                .module-contact {
                    @media #{$minLarge} {
                        margin-left : 0px;
                        margin-right: 30px;
                    }

                    @media #{$noteBook} {
                        margin-left : 0px;
                        margin-right: 15px;
                    }

                    &.module-contact-2 {
                        .btn {
                            @media #{$minLarge} {
                                width: 174px;
                            }
                        }
                    }
                }

                .module-cart {
                    @media #{$minLarge} {
                        margin-left: 0;
                    }

                    .module-cart-warp {
                        @media #{$minLarge} {
                            left: -300px;
                        }
                    }
                }
            }

            .module-holder-phone {
                @media #{$maxTablet} {
                    flex-direction: row;
                    height        : 80px;
                    align-items   : center;
                }

                .module-cart {
                    margin-left : 0;
                    margin-right: 30px;
                }
            }
        }

        &.header-shadow {
            .navbar {
                box-shadow: 0px 5px 41.5px rgba(9, 29, 62, 0.11);
            }
        }
    }
}