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

//
//  Default appearance styles
//  _____________________________________________
.ba-block(){
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0;
    z-index: -1;
}
& when (@media-common = true) {
    div[data-content-type='tabs'] {
        &.a2-tabs{
            .tabs-navigation {
                li.tab-header {
                    background: none!important;
                    border-style: none!important;
                    border-width: 1px;

                    a.tab-title {
                        letter-spacing: -0.03em;
                        overflow: hidden;
                        text-transform: uppercase;
                        box-sizing: content-box;
                        color: @tab-control__color;
                        font-size: @tab-control__font-size;
                        font-weight: @tab-control__font-weight;
                        line-height: @tab-control__line-height;
                        .lib-css(height, @tab-control__height);
                        .lib-css(padding, @tab-control__padding-top @tab-control__padding-right @tab-control__padding-bottom @tab-control__padding-left);
                        transition: all .3s;
                        &:before {
                            .ba-block();
                            transform: translateY(39px);
                            transition: all 0.25s ease;
                            background: #000000;
                            will-change:transform;
                        }
                        &:after {
                            .ba-block();
                            transform: translateY(100%);
                            transition: all 0.4s ease;
                            background: @main-color;
                            will-change:transform;
                        }
                    }
                    &.ui-state-focus,
                    &:hover {
                         a.tab-title {
                            color: #fff;
                            background: none;
                            &:before{
                                transform: translateY(0);
                            }
                         }
                    }
                    &.ui-state-active {
                        background: none!important;
                        a.tab-title {
                            transition: all 0.25s ease;
                            .lib-css(color, @tab-control__active__color);
                            &:after {
                                transform: translateY(0);
                                transition: transform 0.3s ease;
                            }
                            &:before{
                                transform: translateY(0);
                            }
                        }
                    }
                }
            }

            .tabs-content {
                .lib-css(background, @tab-content__background-color);
                padding: @__tab_content_padding;
                border-style: none;
                border-width: 1px;
            }
        }
    }
}