/*DropDown Mixins*/
@mixin menu-colors($text-color, $text-color-hover) {
    color: $text-color;
    &:hover {
        color: $text-color-hover;
    }
}
@mixin drop-down($background-color, $text-color, $text-color-hover, $bar-color-hover) {
    .ant-dropdown-menu {
        background: $background-color;
        color: $text-color;
        box-shadow:
            0px 6px 4px 0px rgba(0, 0, 0, 0.04),
            0px 8px 8px 0px rgba(0, 0, 0, 0.04),
            0px 4px 4px 0px rgba(0, 0, 0, 0.04);
        backdrop-filter: blur(8px);
        .ant-dropdown-menu-item.ant-dropdown-menu-item-selected,
        .ant-dropdown-menu-item.ant-dropdown-menu-item-selected span {
            font-size: 13px;
            line-height: 16px;
            font-weight: 500;
            background-color: transparent;
            color: var(--brandPrimaryactive);
            display: flex;
            gap: 8px;
        }
        .ant-dropdown-menu-item-selected {
            &:hover {
                /* background-color: var(--base-500) !important;*/
                color: var(--brandPrimaryactive);
            }
        }
    }
    span {
        color: $text-color;
        font-size: 13px;
        line-height: 16px;
        font-weight: 500;
        font-feature-settings:
            "calt" off,
            "liga" off;
    }
    li {
        padding: 8px 8px !important;
        margin-bottom: 1px !important;
        &:hover,
        &:focus {
            background-color: $bar-color-hover !important;
            span {
                color: $text-color-hover;
            }
        }
    }
}
/*DropDown Mixins*/
.starship-v2 {
    .starship-dropdown-text {
        @include menu-colors(var(--base-900), var(--base-1000));
        font-weight: 500;
        font-size: 13px;
        line-height: 16px;
        display: flex;
        align-items: center;
        cursor: pointer;
        font-feature-settings:
            "calt" off,
            "liga" off;
        svg {
            margin-left: 7px;
        }
    }

    /*primary menu style*/
    .starship-dropdown-list-overlay {
        @include drop-down(var(--base-translucent), var(--base-700), var(--base-800), var(--base-500));
        .ant-dropdown-menu {
            border-radius: 4px;
            overflow: hidden;
        }
        /*DELETE*/
        .red {
            span {
                color: var(--colorNegative) !important;
            }
            &:focus,
            &:hover,
            &.active {
                span {
                    color: var(--colorNegativeLight) !important;
                }
            }
        }
        /*DELETE*/
        .ant-dropdown-arrow {
            display: none !important;
            &::before {
                display: none;
                background: var(--base-translucent) !important;
                background-color: var(--base-translucent) !important;
            }
        }
    }
    /*primary menu style*/
    .ant-dropdown-open > .drop-down-link-arrow-icon svg,
    .ant-dropdown-open > .drop-down-link-arrow-icon svg {
        transform: rotate(180deg);
    }

    /*secondary menu style*/
    .starship-dropdown-list-overlay {
        &.secondary {
            ul li:last-child {
                position: relative;
                margin-top: 5.5px;
                &::before {
                    content: "";
                    position: absolute;
                    height: 1px;
                    background-color: var(--base-500);
                    width: calc(100% - 13px);
                    top: -3.5px;
                    left: 0px;
                    right: 0px;
                    margin: auto;
                }
            }
        }
    }
}
/*secondary menu style*/