@import "variables";
@import "panel";
@import "commons";
$account-header-height: 60px;
.panel {
    padding-left: 0px;
    padding-right: 0px;
}

.account {
    &__header {
        // padding-left: 10px;
        padding-left: 5px;
        padding-right: 10px;
        padding-bottom: 5px;
        height: $account-header-height; //border-top: 1px solid #222736;
        border-bottom: 1px solid #222736;
        &--button {
            // outline: 1px greenyellow solid;
            margin-top: 20px;
            width: 35px;
            height: 35px;
            float: right;
            margin-left: 5px;
            font-size: 22px;
            font-size: 20px;
            color: $font-link-primary;
            padding-left: 6px;
            -moz-osx-font-smoothing: grayscale;
            -webkit-font-smoothing: antialiased;
            text-rendering: optimizeLegibility;
            transition: all .2s;
            &:hover {
                color: $font-link-primary-hover;
            }
            &--selected {
                color: whitesmoke;
                &:hover {
                    color: whitesmoke;
                }
            }
            &--notification {
                color: rgb(250, 152, 41);
                &:hover {
                    color: rgb(255, 185, 106);
                }
            }
        }
    }
    &__avatar {
        width: 50px;
        border-radius: 3px;
    }
    &__body {
        overflow: auto;
        height: calc(100% - #{$account-header-height} - 31px);
        display: block;
        font-size: $default-font-size;
    }
}