.header-dashboard {
    position: fixed;
    top: 0;
    right: 0;
    width: calc(100% - 320px);
    padding: 14px 13px 13px 30px;
    border-bottom: 1px solid #0A0A0C0F;
    background: var(--White);
    z-index: 19;
    transition: all 0.3s, background 0s ease;
    .wrap {
        @include flex(center,space-between);
        gap: 15px;
        .header-left {
            width: 100%;
            max-width: 320px;
            position: relative;
            @include d-flex;
            align-items: center;
            gap: 15px;
            > a {
                display: none;
            }
            .button-show-hide {
                position: relative;
                @include flex(center,center);
                font-size: 24px;
                width: 28px;
                height: 28px;
                color: rgba(10, 10, 12, 1);
                border-radius: 4px;
                background-color: rgba(246, 246, 246, 1);
                cursor: pointer;
                @include transition3;
                display: none;
                i {
                    @include transition3;
                }
                &:hover {
                    i {
                        color: var(--Secondary);
                    }
                }
            }
            .box-content-search {
                position: absolute;
                top: 50px;
                left: 0;
                right: 0;
                border-radius: 14px;
                padding: 16px;
                background-color: var(--White);
                box-shadow: 0px 4px 24px 2px rgba(20, 25, 38, 0.05);
                height: 538px;
                overflow-y: scroll;
                opacity: 0;
                visibility: hidden;

                &.active {
                    top: 55px;
                    opacity: 1;
                    visibility: visible;
                }

                &::-webkit-scrollbar {
                    width: 3px;
                }
                .product-item {
                    .name {
                        a {
                            color: var(--Main-Dark);
                        }
                    }
                }
            }
        }
        .header-grid {
            @include d-flex;
            gap: 20px;
            > .divider {
                width: 1px;
                background: #ECF0F4;
                height: unset;
            }
            > .setting {
                width: 24px;
                @include flex(center,center);
                font-size: 24px;
                i {
                    animation-name: spin;
                    animation-duration: 3s;
                    animation-iteration-count: infinite;
                    animation-timing-function: linear;
                }
            }
        }
        .header-item {
            @include flex(center,center);
            width: 36px;
            height: 36px;
            border-radius: 50%;
            background: rgba(203, 213, 225, 0.30);
            i {
                font-size: 20px;
                color: var(--Main-Dark);
            }
            &.country {
                > .dropdown {
                    > .dropdown-menu.show {
                        margin-top: 19px !important;
                    }
                }
            }
        }
    }
}