//
// Tab menu
//
.nav-tabs {
    border-radius: $border-radius-base $border-radius-base 0 0;
    background-color: darken($nav-tabs-active-link-bg, 5%);

    > li {
        + li {
            margin-left: 2px;
        }

        > a {
            margin-right: 0;

            @include transition(all 0.25s ease-in-out);

            &:focus,
            &:hover {
                border-color: $nav-tabs-link-hover-border-color $nav-tabs-link-hover-border-color $nav-tabs-border-color;
                background: $nav-tabs-link-hover-bg;
            }
        }

        &[class*="has-"] > a {
            &:before {
                font-family: FontAwesome;
                margin-right: 2px;
                margin-top: -2px;
                vertical-align: middle;
                font-size: 10px;
                text-align: center;
                background-color: rgba(255, 255, 255, 0.25);
                border-radius: 50%;
                width: 15px;
                height: 15px;
                display: inline-block;

                @include transition(all 0.25s ease-in-out);
            }
        }
        // Has error state
        &.has-validation-error {
            > a {
                background-color: $brand-danger;
                border-color: darken($brand-danger, 10%);
                color: #fff;

                &:focus,
                &:hover {
                    color: #fff;
                    background-color: lighten($brand-danger, 5%);
                    border-color: darken($brand-danger, 5%);
                }

                &:before {
                    content: $fa-var-exclamation;
                }
            }

            &.active > a {
                color: inherit;
                background-color: $nav-tabs-active-link-bg;

                &:before {
                    background-color: $brand-danger;
                    color: #fff;
                }
            }
        }
        // Active state
        &.active {
            > a,
            > a:focus,
            > a:active,
            > a:hover {
                border: 1px solid $nav-tabs-active-link-hover-border-color;
                border-bottom-color: $nav-tabs-active-link-bg;
                background-color: $nav-tabs-active-link-bg;
            }
        }
    }
}

//
// Hotfix display tab-panes always to prevent RTE initialisation problems
//
.tab-content {
    > .tab-pane {
        display: block;
        height: 0;
        width: 0;
        overflow: hidden;

        &.active {
            height: auto;
            width: auto;
            overflow: visible;
        }
    }
}
