superdesk/superdesk-client-core

@import '~mixins.scss';
@import '~variables.scss';

.popup {
    &__menu {
        z-index: $zindexDropdown;
        min-width: 100px;
        padding-block-start: 0 !important;
        margin: 0;
        background-color: $dropdownBackground;
        box-shadow: 0 2px 10px hsla(0, 0%, 0%, 0.4), 0 3px 1px -2px #0000001a;
        border-radius: 2px;
        text-align: start;

        &--no-padding {
            padding: 0 !important;
        }
    }

    &__menu-divider {
        height: 1px;
        margin: 0.8rem 0;
        overflow: hidden;
        background-color: var(--sd-colour-line--light);
    }

    &__menu-label {
        text-transform: uppercase;
        font-size: 1.1rem;
        color: $grayLight;
        font-weight: 500;
        padding-inline-start: 1.6rem;
        margin-block-end: .6rem;
        .popup__menu-close {
            position: absolute;
            inset-block-start: 1rem;
            inset-inline-end: 1rem;
            padding: 0;
            margin: 0;
            border: 0;
            width: auto;
            opacity: .3;
            background-color: transparent;
            cursor: pointer;
            i { margin-inline-end: 0 !important; }
            &:hover, &:focus {
                background-color: transparent;
                opacity: 1;
            }
        }

        &--center {
            padding-inline-start: 0;
            text-align: center;
            display: inline-block;
            width: 100%;
        }
    }

    &__menu-header {
        font-weight: 300;
        font-size: 1.5rem;
        color: $grayLight;
        padding: 1rem 1rem 0 1rem;
        border-block-end: 1px solid #e5e5e5;

        &--no-border {
            border-block-end: none;
        }

        &--no-padding {
            padding: 0 !important;
        }
    }

    &__menu-footer {
        padding: 1rem;
        margin-block-start: 0.6rem;
        border-block-start: 1px solid #e5e5e5;
        display: inline-block;
        width: 100%;

        &--no-border {
            border-block-start: none;
        }

        &--no-padding {
            padding: 0 !important;
        }
    }

    &__menu-content {
        padding: 1rem;
        min-width: 100px;

        &--no-padding {
            padding: 0 !important;
        }
    }
}