.header.menu-group {
    justify-content: flex-start;
}

.icon > svg {
    > path {
        fill: #fff;
    }
}

.float-left > span.icon.user {
    top: 0;
}

.header {
    .electron-navigation > ul > li {
        border: none;
    }
    &.primary {
        border-bottom: none;
    }
    padding-left: 0 !important;
    // min-height: 64px;
    // text-transform: uppercase;
    .menu-bar > li {
        padding: 0;
        border-right: none;
        > a {
            font-weight: bold;
            line-height: 2rem;
            padding-left: 1.25rem;
            padding-right: 0.75rem;
            font-size: 1.1rem;
            @include breakpoint(large) {
                padding-left: 1.75rem;
                padding-right: 1.75rem;
            }
        }
    }

    div.account-drop-down div.total-value {
        text-align: right;
        font-size: 80%;
        line-height: initial;
    }
}

div.header-balance {
    a {
        font-size: 90%;
        font-weight: bold;
        &:hover {
            background-color: transparent !important;
        }
    }
}

div.account-drop-down {
    font-size: 90%;
    .dropdown-divider {
        padding-bottom: 10px;
    }
    a.button {
        font-weight: bold;
        font-size: 90%;
        background-color: transparent;
    }
    a:active.button,
    a:hover.button {
        background-color: transparent !important;
    }
}

div.header-right-menu {
    > .grp-menu-item {
        border-left: none;
        line-height: 1;

        > a {
            @include breakpoint(large) {
                padding-left: 1.25rem;
                padding-right: 1.25rem;
            }
        }
    }
}

ul.top-stats {
    margin-bottom: 0px !important; // remove margin for top-bar
}

.grp-menu-items-group {
    flex-flow: row nowrap;
    display: flex;
    justify-content: flex-end;
}

.grp-menu-item {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    > a,
    .button {
        padding: 0.5rem;
        @include breakpoint(large) {
            padding-left: 0.75rem;
            padding-right: 0.75rem;
        }
        font-size: 1rem;
    }
}

.user-icon > a {
    padding-left: 0.3rem;
    padding-right: 0.3rem;
}

.lower-case {
    text-transform: lowercase;
}

div.account-drop-down div.dropdown-wrapper {
    padding: 0;

    > li {
        list-style: none;
        > div.table-cell {
            padding: 15px 5px 14px 5px;
            text-align: center;
            vertical-align: middle;

            &:nth-child(2) {
                text-align: left;
                padding-left: 15px;
                padding-right: 20px;
            }
        }
    }
    > ul {
        padding-bottom: 0;
    }
    &.active {
        > ul {
            padding-bottom: 5px;
        }
    }
}

div.account-drop-down div.account-dropdown-wrapper {
    > li {
        > div.table-cell {
            height: 64px;
            padding-left: 10px;
            padding-right: 10px;
        }
    }
}

div.account-drop-down div.menu-dropdown-wrapper {
    > li {
        width: 64.55px;

        > div.table-cell {
            height: 64px;
            padding: 23px 5px 24px 5px;
        }
    }
}

ul.dropdown.header-menu {
    transition: padding 0s, height 3s linear;
    border: none;
    z-index: 1004;
    > li {
        height: 41px;
        padding: 2px 5px 2px 10px;
        > div {
            vertical-align: middle;
        }
        > div:first-of-type {
            padding-top: 5px;
            > span.icon > svg {
                height: 1.5rem;
                width: 1.5rem;
            }
        }
        > div:nth-of-type(2) {
            padding-left: 8px;
        }

        &.disabled {
            color: grey;
            cursor: not-allowed;
            opacity: 50%;

            svg path {
                fill: grey !important;
            }
        }
        &.has-submenu {
            position: relative;
            &:after {
                content: ">";
                position: absolute;
                right: 10px;
                margin-top: -13.5px;
                top: 50%;
            }
        }
        &.parent-item {
            .parent-item-icon {
                margin-right: 10px;
            }
        }
    }
    li.mobile-only {
        display: none;
    }
    li.desktop-only {
        display: block;
    }
}

.account-summary {
    text-align: right;
    line-height: initial;
    display: inline-block;

    .icon {
        margin-right: 5px;
    }

    svg path {
        fill: #fff;
    }
}

.account-name .icon {
    margin-right: 5px;
}

.active-account {
    padding-right: 10px;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
}

.header-dropdown-sub-link {
    font-size: 0.85em;
    &.enabled:hover {
        text-decoration: underline;
    }
}
