@import "mixins/borders";

.dropdown{

    display: inline-block;
    cursor:pointer;

    .dropdown-menu{
        cursor: pointer;
        border:1px solid $gray-200;
        box-shadow: 0px 0px 6px -2px rgba(0, 0, 0, 0.1);

        @each $size, $width in $dropdown-menu-sizes{
            &.dropdown-menu-#{$size}{
                max-width: $width;
                width: 90vw;
            }
        }

        .dropdown-item, & > *{
            &:first-child{
                @include border-top-radius($dropdown-border-radius);
            }
            &:last-child{
                @include border-bottom-radius($dropdown-border-radius);
            }
        }
    }
}