@use "../abstracts/breakpoints" as bp;
$breakpoints: bp.$breakpoints;

.dropdown {
    position: relative;
    display: inline-flex;
}

.dropdown-body {
    background-color: var(--dropdown-body-background-color);
    border-radius: var(--dropdown-body-border-radius);
    border-color: var(--dropdown-body-border-color);
    border-style: var(--dropdown-body-border-style);
    border-width: var(--dropdown-body-border-width);
    max-width: 100vw;
    position: fixed;
    z-index: 1000;
    transition: opacity 0.1s ease;

    &.show {
        opacity: 1;
    }

    &.hide {
        opacity: 0;
    }
}



.drop-top{}
.drop-left{}
.drop-start{}
.drop-right{}
.drop-end{}
.drop-bottom{}

.drop-align-left{}
.drop-align-start{}
.drop-align-center{}
.drop-align-middle{}
.drop-align-right{}
.drop-align-end{}
.drop-align-top{}
.drop-align-bottom{}