// /**
//  * Copyright © Magento, Inc. All rights reserved.
//  * See COPYING.txt for license details.
//  */

//
//  Page header -> Actions group -> User menu
//  _____________________________________________

//
//  Variables
//  ---------------------------------------------

@user-account__padding-bottom: .4rem;
@user-account__padding-left: 4rem;
@user-account__padding-top: .7rem;
@user-account__padding-right: 2.8rem;

@user-account-menu__min-width: 20rem;
@user-account-menu__z-index: @notifications-action-menu__z-index - 10; // Should be lower than notifications
@user-account-menu__hover__background-color: @action__hover__background-color;
@user-account-menu__active__background-color: darken(@color-blue-clear-sky, 5%);

@user-account-action__color: @text__color;
@user-account-action__hover__color: @text__color;

//

.admin-user {
    float: right;
    line-height: @line-height__base; // ToDo UI: Delete with admin scope
    margin-left: .3rem;
    z-index: @user-account-menu__z-index;

    &._active,
    &.active {
        //  User account action
        .admin__action-dropdown {
            border-color: @action-dropdown__active__border-color;
            box-shadow: @component__box-shadow__base;
        }
    }

    //  User account action
    .admin__action-dropdown {
        .action-toggle-triangle(
            @_dropdown__padding-right: @user-account__padding-right;
            @_triangle__color: @user-account-action__color;
            @_triangle__hover__color: @action-dropdown__hover__color;
            @_triangle__right: 1.3rem;
        );
        height: @page-header-action__height;
        padding-bottom: @user-account__padding-bottom;
        padding-left: @user-account__padding-left;
        padding-top: @user-account__padding-top;

        &:before {
            @_icon-user__size: 2rem;
            &:extend(.abs-icon all);
            color: @user-account-action__color;
            content: @icon-account__content;
            font-size: @_icon-user__size;
            left: 1.1rem;
            margin-top: -(@_icon-user__size / 2) - .1rem;
            position: absolute;
            top: 50%;
        }

        &:hover {
            &:before {
                color: @user-account-action__hover__color;
            }
        }
    }
    //  User account menu
    .admin__action-dropdown-menu {
        @_user-menu__indent-side: 1rem;

        min-width: @user-account-menu__min-width;
        padding-left: @_user-menu__indent-side;
        padding-right: @_user-menu__indent-side;

        > li {
            > a {
                padding-left: .5em;
                padding-right: (@user-account__padding-right - @_user-menu__indent-side);
                transition: @smooth__background-color;
                white-space: nowrap;

                &:hover {
                    background-color: @user-account-menu__hover__background-color;
                    color: @action-dropdown__color;
                }

                &:active {
                    background-color: @user-account-menu__active__background-color;
                    bottom: -1px;
                    position: relative;
                }
            }
        }

        .admin-user-name {
            .lib-text-overflow-ellipsis();
            display: inline-block;
            max-width: @user-account-menu__min-width;
            overflow: hidden;
            vertical-align: top;
        }
    }
}

.admin-user-account-text {
    .lib-text-overflow-ellipsis();
    display: inline-block;
    max-width: @user-account-menu__min-width - @user-account__padding-left - @user-account__padding-right - 2rem;
}