// Dropdown

.dropdown-menu {
    font-size: $font-size-base;
    border: 0;
        box-shadow: $dropdown-box-shadow;
    .dropdown-item {
        cursor: pointer;
        >i,
        >svg {
            margin-right: 1rem;
            font-size: 1rem;
        }

        img,
        svg {
            height: 14px;
            margin-right: .5rem;
            position: relative;
            top: -1px;
        }

        .icon-flag {
            width: 19px;
        }
    }

    // Media entires
    .list-group-item .media {
        p {
            color: $gray-700;
            line-height: 1.4;
        }

        &:hover {
            .heading {
                color: theme-color("primary");
            }
        }
    }
}


// Sizing

@include media-breakpoint-up(lg) {
    .dropdown-menu-arrow {
        &:before {
            content: '';
            background: $dropdown-bg;
            box-shadow: none;
            display: block;
            height: 16px;
            width: 16px;
            left: 1.25rem;
            position: absolute;
            bottom: 100%;
            transform: rotate(-45deg) translateY(1rem);
            z-index: -5;
            @include border-radius($border-radius-sm);
        }

        &[x-placement="bottom-end"] {
            &:before {
                bottom: 100%;
                transform: rotate(-45deg) translateY(1rem);
            }
        }

        &[x-placement="top-end"] {
            &:before {
                bottom: 0;
                transform: rotate(-45deg) translateY(.5rem);
            }
        }

        &.dropdown-menu-end {
            &:before {
                right: 2.5rem;
                left: auto;
            }
        }
    }

    .dropdown-menu-sm {
        min-width: $dropdown-min-width-sm !important;
        border: $border-radius-sm;

        &.dropdown-menu-arrow {
            &.dropdown-menu-end {
                &:before {
                    right: 2rem;
                    left: auto;
                }
            }
        }
    }

    .dropdown-menu-md {
        min-width: $dropdown-min-width-md !important;
        border-radius: $border-radius;
    }

    .dropdown-menu-lg {
        min-width: $dropdown-min-width-lg !important;
        border-radius: $border-radius;
    }

    .dropdown-menu-xl {
        min-width: $dropdown-min-width-xl !important;
        border-radius: $border-radius;
    }
}

@include media-breakpoint-up(lg) {
    .dropdown-animate {
        >.dropdown-menu {
            opacity: 0;
            position: absolute;
            display: block;
            pointer-events: none;
        }
    }

    // Dropdown animation on click
    .dropdown-animate:not([data-toggle="hover"]) {
        .dropdown-menu {
            &.show {
                pointer-events: auto;
                animation: show-dropdown .3s ease forwards;
            }

            &.hide {
                display: block;
                animation: hide-dropdown .3s ease backwards;
            }
        }
    }

    // Dropdown animation on hover
    .dropdown-animate[data-toggle="hover"] {
        >.dropdown-menu {
            display: block;
            margin: 0;
            @include transition($transition-base);

        }

        &:hover {
            >.dropdown-menu {
                display: block;
                opacity: 1;
                pointer-events: auto;
                visibility: visible;
                transform: $dropdown-hover-transform;

                &.dropdown-menu-end { 
                    transform: $dropdown-hover-transform-end;
                }
            }
        }
    }
}

// Keyframes
@keyframes show-dropdown {
    0% {
        opacity: 0;
        transform: translateX(0) translateY(-3px) scale(.97);
        transition: all .3s ease;
    }

    100% {
        transform: translateX(0) translateY(-3px) scale(1);
        opacity: 1;
    }
}

@keyframes hide-dropdown {
    from {
        opacity: 1;
        transform: translateX(0) translateY(-3px) scale(1);
        transition: all .3s ease;
    }

    to {
        opacity: 0;
        transform: translateX(0) translateY(-3px) scale(.97);
    }
}