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

//
//  Common
//  _____________________________________________

.lib-data-tabs__base(@_tab-control-height__base: @tab-control__height__base) {
    .lib-clearfix();
    position: relative;
    z-index: 1;
    > .item.title {
        float: left;
        width: auto;
        > .switch {
            .lib-css(height, @_tab-control-height__base);
            display: block;
            position: relative;
            z-index: 2;
        }
    }
    > .item.content {
        .lib-clearfix();
        .lib-css(margin-top, @_tab-control-height__base);
        box-sizing: border-box;
        float: right;
        margin-left: -100%;
        width: 100%;
        &.active {
            display: block;
        }
    }
}

.lib-data-tabs(
    @_tab-control-font-family: @tab-control__font-family,
    @_tab-control-font-size: @tab-control__font-size,
    @_tab-control-font-style: @tab-control__font-style,
    @_tab-control-font-weight: @tab-control__font-weight,
    @_tab-control-line-height: @tab-control__line-height,

    @_tab-control-background-color: @tab-control__background-color,
    @_tab-control-color: @tab-control__color,
    @_tab-control-text-decoration: @tab-control__text-decoration,

    @_tab-control-color-visited: @tab-control__color,
    @_tab-control-text-decoration-visited: @tab-control__text-decoration,

    @_tab-control-background-color-hover: @tab-control__hover__background-color,
    @_tab-control-color-hover: @tab-control__hover__color,
    @_tab-control-text-decoration-hover: @tab-control__text-decoration,

    @_tab-control-background-color-active: @tab-control__active__background-color,
    @_tab-control-color-active: @tab-control__active__color,
    @_tab-control-text-decoration-active: @tab-control__text-decoration,

    @_tab-control-height: @tab-control__height,
    @_tab-control-margin-right: @tab-control__margin-right,

    @_tab-control-padding-top: @tab-control__padding-top,
    @_tab-control-padding-right: @tab-control__padding-right,
    @_tab-control-padding-bottom: @tab-control__padding-bottom,
    @_tab-control-padding-left: @tab-control__padding-left,

    @_tab-control-border-width: @tab-control__border-width,
    @_tab-control-border-color: @tab-control__border-color,

    @_tab-content-background-color: @tab-content__background-color,
    @_tab-content-border: @tab-content__border,
    @_tab-content-border-top-status: @tab-content__border-top-status,
    @_tab-content-margin-top: @tab-content__margin-top,

    @_tab-content-padding-top: @tab-content__padding-top,
    @_tab-content-padding-right: @tab-content__padding-right,
    @_tab-content-padding-bottom: @tab-content__padding-bottom,
    @_tab-content-padding-left: @tab-content__padding-left
) {
    .lib-data-tabs__base();
    > .item.title {
        .lib-css(margin, 0 @_tab-control-margin-right 0 0);
        > .switch {
            .lib-typography(
                @_color: @_tab-control-color,
                @_font-size: @_tab-control-font-size,
                @_font-family: @_tab-control-font-family,
                @_font-weight: @_tab-control-font-weight,
                @_font-style: @_tab-control-font-style,
                @_line-height: @_tab-control-line-height
            );
            .lib-link(
                @_link-color: @_tab-control-color,
                @_link-text-decoration: @_tab-control-text-decoration,
                @_link-color-visited: @_tab-control-color-visited,
                @_link-text-decoration-visited: @_tab-control-text-decoration-visited,
                @_link-color-hover: @_tab-control-color-hover,
                @_link-text-decoration-hover: @_tab-control-text-decoration-hover,
                @_link-color-active: @_tab-control-color-active,
                @_link-text-decoration-active: @_tab-control-text-decoration-active
            );
            .lib-css(background, @_tab-control-background-color);
            .lib-css(border, @_tab-content-border);
            border-bottom: none;
            .lib-css(height, @_tab-control-line-height);
            .lib-css(padding, @_tab-control-padding-top @_tab-control-padding-right @_tab-control-padding-bottom @_tab-control-padding-left);
        }
        &:not(.disabled) > .switch:focus,
        &:not(.disabled) > .switch:hover {
            .lib-css(background, @_tab-control-background-color-hover);
        }
        &:not(.disabled) > .switch:active,
        &.active > .switch,
        &.active > .switch:focus,
        &.active > .switch:hover {
            .lib-css(background, @_tab-control-background-color-active);
            .lib-css(color, @_tab-control-color-active);
        }
        &.active > .switch,
        &.active > .switch:focus,
        &.active > .switch:hover {
            .lib-css(padding-bottom, @_tab-control-padding-bottom + @_tab-control-border-width);
        }
    }
    > .item.content {
        .lib-css(background, @_tab-content-background-color);
        margin-top: @_tab-content-margin-top;
        padding: @_tab-content-padding-top @_tab-content-padding-right @_tab-content-padding-bottom @_tab-content-padding-left;
        ._lib-tab-content-border(
            @_tab-content-border-top-status: @_tab-content-border-top-status,
            @_tab-content-border: @_tab-content-border
        );
    }
}

& when (@media-common = true) {
    .product.data.items {
        .lib-data-accordion();
        border-bottom: @tab-control__border-width solid @tab-control__border-color;
        margin-bottom: @indent__base;
        margin-left: 0;
        margin-right: 0;
        .item.title {
            a {
                position: relative;
                .lib-icon-font(
                    @_icon-font-content: @icon-down,
                    @_icon-font-size: @font-size__base,
                    @_icon-font-line-height: @icon-font__line-height,
                    @_icon-font-color: @icon-font__color,
                    @_icon-font-color-hover: @icon-font__color-hover,
                    @_icon-font-color-active: @icon-font__color-active,
                    @_icon-font-margin: @icon-font__margin,
                    @_icon-font-vertical-align: @icon-font__vertical-align,
                    @_icon-font-position: after,
                    @_icon-font-display: false
                );
                &:after {
                    position: absolute;
                    right: @accordion-control__padding-right;
                    top: @accordion-control__padding-top;
                }
            }
            &.active a:after {
                content: @icon-up;
            }
        }
        .value p:last-child {
            margin-bottom: 0;
        }
        .table-wrapper {
            margin: 0;
        }
    }
}

//
//  Desktop
//  _____________________________________________

.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
    .product.data.items {
        .lib-data-tabs();
        border-bottom: 0;
        margin-left: 0;
        margin-right: 0;
        .item.title a:after {
            display: none;
        }
    }
}
