@use '@angular/material' as mat;

.adf {
    &-sidebar-action-menu {
        & .adf-sidebar-action-menu-button {
            width: 100%;
            display: block;
            box-shadow: none;
            height: 37.5px;
            font-weight: bold;
            background-color: var(--theme-primary-color);
            color: var(--theme-primary-color-default-contrast);
            border-radius: 4px;
        }

        &-text {
            width: 100%;
            height: 20px;
            text-align: left;
        }
    }

    &-sidebar-action-menu-icon {
        margin: 18px 0 0 20px;
        color: var(--adf-theme-foreground-text-color-064);
        cursor: pointer;

        &:hover {
            color: var(--theme-primary-color);
        }
    }

    &-sidebar-action-menu-options {
        text-align: left;
        letter-spacing: -0.4px;

        button {
            font-size: var(--theme-body-1-font-size);
            color: var(--adf-theme-foreground-text-color-087);
            text-align: left;
            line-height: 1.5;
            letter-spacing: -0.4px;

            &:hover {
                color: var(--theme-primary-color);
                opacity: inherit;
            }
        }
    }

    &-sidebar-action-menu-panel {
        margin-top: 7.5px;
        border-radius: 2px;

        @include mat.elevation(2);
    }
}