@use "variables" as *;
@import "mixins";

p-avatar {
    cursor: pointer;
    padding: $spacing-2 0;
}

::ng-deep #toolbar-header:hover {
    cursor: default;
    background-color: white;
}

::ng-deep .p-menuitem-text {
    .toolbar-user__header {
        display: flex;
        align-items: center;
        gap: $spacing-1;
    }
    .toolbar-user__user-name {
        margin: 0;
        white-space: nowrap;
        font-size: $font-size-lmd;
        color: $black;
    }
}

::ng-deep {
    .toolbar-user__menu.p-menu {
        margin-top: $spacing-0;
        &.p-menu-overlay {
            width: 17rem;
        }
    }
}

:host::ng-deep {
    display: block;

    .p-menu {
        margin-top: $spacing-0;
    }

    .p-menu .p-menu-separator {
        margin: $spacing-1;
    }

    .toolbar-user__logout .p-menuitem-link .p-menuitem-text {
        color: $color-palette-gray-700;
    }

    .toolbar-user__logout .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text {
        color: $color-palette-gray-700;
    }

    .toolbar-user__logout .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon {
        color: $color-palette-gray-700;
    }
}
