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

//
//  Horizontal tabs
//  _____________________________________________

//  Are used in dashboard

.tabs-horiz {
    &:extend(.abs-clearfix all);
    margin: 0;
    padding: 0;

    //  Default tab
    .ui-state-default {
        background: @color-gray;
        border: .1rem solid @border__color;
        float: left;
        letter-spacing: .0183em; // For tab width fixing depending on normal-semibold font-weight
        list-style: none;
        margin-right: .4rem;
    }

    //  Hovered tab
    .ui-state-hover {
        background: @color-dark-gray;
    
        .ui-tabs-anchor {
            color: @text__color;
        }
    }

    //  Active tab
    .ui-state-active {
        background: @color-dark-gray;
        border-bottom: 0;
        font-weight: @font-weight__semibold;
        letter-spacing: normal;
        margin-bottom: -.1rem;

        .ui-tabs-anchor {
            color: @text__color;
            border-bottom: .1rem solid @border__color;
            border-top: .4rem solid @color-phoenix;
            padding-top: 1.1rem;
        }
    }

    .ui-tabs-anchor {
        color: @text__color;
        display: block;
        padding: 1.5rem 1.8rem 1.3rem;
        text-decoration: none;

        &:hover { // ToDo UI: should be deleted with old styles
            color: @text__color;
            text-decoration: none;
        }
    }
}

//  Tabs content
.ui-tabs-panel {
    margin-top: -1px;
    padding: 2rem;
}
