.dropdown {
    --dropdown-color: #fff;
    --dropdown-background-color: var(--color-default--900);
    position: relative;
    display: inline-block;
}

/* Button */

.dropdown > button:hover .badge,
.dropdown[aria-expanded="true"] > button .badge {
    background-color: var(--dropdown-background-color) !important;
}

.dropdown[aria-expanded="true"] > button {
    color: #fff !important;
}

.dropdown[aria-expanded="true"] > button > [data-fa-pseudo-element] {
    transform: rotate(180deg);
}

/* Menu */

.dropdown__menu {
    position: absolute;
    top: calc(100% + 1rem);
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
    display: none;
    padding: 0.5rem 0;
    width: 200%;
    color: var(--dropdown-color);
    font-size: 1rem;
    text-align: left;
    list-style: none;
    background-color: var(--dropdown-background-color);
    background-clip: padding-box;
    border-radius: 0.375rem;
}

.dropdown__menu--start {
    left: 0;
    right: auto;
    transform: translateX(0);
}

.dropdown__menu--end {
    left: auto;
    right: 0;
    transform: translateX(0);
}

.dropdown__menu::before {
    content: "";
    position: absolute;
    top: -0.75rem;
    left: 50%;
    transform: translateX(-50%);
    border-left: 1rem solid transparent;
    border-right: 1rem solid transparent;
    border-bottom: 0.75rem solid var(--dropdown-background-color);
}

.dropdown__menu--start::before {
    left: 25%;
    right: auto;
    transform: translateX(-1rem);
}

.dropdown__menu--end::before {
    left: auto;
    right: 25%;
    transform: translateX(1rem);
}

.dropdown__menu.show {
    display: block;
}

.dropdown__menu footer .btn {
    width: 100%;
}

.dropdown__item {
    display: block;
    padding: 0.25rem 1rem;
    color: inherit !important;
    text-decoration: none;
    border: 0;
    background-color: transparent;
}

.dropdown__item:hover {
    background-color: var(--color-default--800);
}

.dropdown__item > i,
.dropdown__item > svg {
    margin-right: 0.25rem;
}

.dropdown-divider {
    border-top: 1px solid var(--color-default--800);
}