    /**
     * Creates the base structure of a Tab.
     * @member Ext.tab.Tab
     */
    @mixin extjs-tab {
        @include x-frame(
            $cls: 'tab',
            $ui: 'default-top',
            $border-radius: $tab-top-border-radius,
            $border-width: $tab-top-border-width,
            $background-color: $tab-base-color,
            $background-gradient: $tab-background-gradient,
            $background-direction: top,
            $table: true
        );

        @include x-frame(
            $cls: 'tab',
            $ui: 'default-bottom',
            $border-radius: $tab-bottom-border-radius,
            $border-width: $tab-bottom-border-width,
            $background-color: $tab-base-color,
            $background-gradient: $tab-background-gradient,
            $background-direction: bottom,
            $table: true
        );

        .#{$prefix}tab {
            z-index: 1;
            margin: 0 0 0 $tab-spacing;
            display: inline-block;
            zoom: 1;
            *display: inline;
            white-space: nowrap;
            height: $tab-height;
            border-color: $tab-border-color;
            cursor: pointer;
            cursor: hand;

            button {
                cursor: pointer;
                cursor: hand;
            }

            em {
                display: block;
                padding: 0 6px;
                line-height: 1px;
            }

            button {
                background: none;
                border: 0;
                padding: 0;
                margin: 0;
                -webkit-appearance: none;
                font-size: $tab-font-size;
                @if $tab-font-weight {
                    font-weight: $tab-font-weight;
                }
                @if $tab-font-family {
                    font-family: $tab-font-family;
                }

                color: $tab-color;
                outline: 0 none;
                overflow-x: visible;

                &::-moz-focus-inner {
                    border: 0;
                    padding: 0;
                }

                .#{$prefix}tab-inner {
                    background-color: transparent;
                    background-repeat: no-repeat;
                    background-position: 0 -2px;
                    display: block;
                    text-align: center;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    -o-text-overflow: ellipsis;
                    overflow: hidden;
                }
            }

            img {
                display: none;
            }
        }

        .#{$prefix}border-box {
            .#{$prefix}tab-default-top {
                height: $tab-height + top($tabbar-top-strip-border-width);
            }
            .#{$prefix}tab-default-bottom {
                height: $tab-height + bottom($tabbar-bottom-strip-border-width);
            }
        }

        @if $include-ie {
            * html .#{$prefix}ie {
                .#{$prefix}tab button {
                    width: 1px;
                }
            }

            .#{$prefix}strict .#{$prefix}ie6,
            .#{$prefix}strict .#{$prefix}ie7 {
                .#{$prefix}tab .#{$prefix}frame-mc {
                    height: 100%;
                }
            }

            .#{$prefix}ie .#{$prefix}tab-active button:active {
                position: relative;
                top: -1px;
                left: -1px;
            }
        }

        $framepad: max(top($tab-top-border-radius), right($tab-top-border-radius)) - top($tab-top-border-width);

        .#{$prefix}tab-default-top {
            @if $tab-inner-border {
                @include inner-border(
                    $width: $tab-top-inner-border-width,
                    $color: $tab-inner-border-color
                );
            }

            border-bottom: 1px solid $tabbar-strip-border-color !important;

            em {
                padding-bottom: $framepad;
            }

            button,
            .#{$prefix}tab-inner {
                height: $tab-height - $framepad * 2 - top($tab-top-border-width);
                line-height: $tab-height - $framepad * 2 - top($tab-top-border-width);
            }
        }

        // corrects text being clipped at the bottom in safari4 & 5.0.5
        .#{$prefix}safari4,
        .#{$prefix}safari5_0 {
            .#{$prefix}tab-default-top .#{$prefix}tab-inner {
                line-height: $tab-height - $framepad * 2 - top($tab-top-border-width) - 2;
            }
        }

        .#{$prefix}nbr .#{$prefix}tab-default-top {
            border-bottom-width: 1px !important;
        }

        .#{$prefix}tab-default-top-active {
            border-bottom-color: $tabbar-strip-background-color !important;
        }

        $framepad: max(bottom($tab-bottom-border-radius), left($tab-bottom-border-radius)) - bottom($tab-bottom-border-width);

        .#{$prefix}tab-default-bottom {
            @if $tab-inner-border {
                @include inner-border(
                    $width: $tab-bottom-inner-border-width,
                    $color: $tab-inner-border-color
                );
            }

            border-top: 1px solid $tabbar-strip-border-color !important;

            @include inner-border(
                $width: $tab-bottom-inner-border-width,
                $color: $tab-inner-border-color
            );

            em {
                padding-top: $framepad;
            }

            button,
            .#{$prefix}tab-inner {
                height: $tab-height - $framepad * 2 - bottom($tab-bottom-border-width);
                line-height: $tab-height - $framepad * 2 - bottom($tab-bottom-border-width);
            }
        }

        .#{$prefix}nbr .#{$prefix}tab-default-bottom {
            border-top-width: 1px !important;
        }

        .#{$prefix}tab-default-bottom-active {
            border-top-color: $tabbar-strip-background-color !important;
        }

        .#{$prefix}tab-default-disabled {
            cursor: default;

            border-color: $tab-border-color-disabled;
            @include background-gradient($tab-base-color-disabled, $tab-background-gradient-disabled);

            button {
                color: $tab-color-disabled !important;
            }
        }

        .#{$prefix}tab-icon-text-left {
            .#{$prefix}tab-inner {
                padding-left: 20px;
            }
        }

        .#{$prefix}tab button {
            position: relative;
        }

        .#{$prefix}tab-icon {
            position: absolute;
            background-repeat: no-repeat;
            background-position: 0 -1px;
            top: 0;
            left: 0;
            right: auto;
            bottom: 0;
            width: 18px;
            height: 18px;
        }

        // Stop icons being clipped by the bottom of the button element
        .#{$prefix}strict {
            .#{$prefix}ie8 .#{$prefix}tab button,
            .#{$prefix}ie9 .#{$prefix}tab button {
                overflow-y: visible;
            }
        }

        .#{$prefix}tab-default-disabled .#{$prefix}tab-icon {
            @include opacity(.5);
        }

        /* In IE a disabled icon needs to be hidden or the opacity effect covers some of the text */
        .#{$prefix}tab-noicon .#{$prefix}tab-icon {
            display: none;
        }

        //over
        .#{$prefix}tab-over {
            @if $tab-border-color-over != $tab-border-color {
                border-color: $tab-border-color-over;
            }

            button {
                @if $tab-color-over != $tab-color {
                    color: $tab-color-over;
                }
                @if $tab-font-weight-over != $tab-font-weight {
                    font-weight: $tab-font-weight-over;
                }
                @if $tab-font-size-over != $tab-font-size {
                    font-size: $tab-font-size-over;
                }
                @if $tab-font-family-over != $tab-font-family {
                    font-family: $tab-font-family-over;
                }
            }
        }

        .#{$prefix}tab-top-over {
            @include background-gradient($tab-base-color-over, $tab-background-gradient-over, top);
        }
        .#{$prefix}tab-bottom-over {
            @include background-gradient($tab-base-color-over, $tab-background-gradient-over, bottom);
        }

        //active
        .#{$prefix}tab-active {
            z-index: 3;
            @if $tab-border-color-active != $tab-border-color {
                border-color: $tab-border-color-active;
            }

            button {
                @if $tab-color-active != $tab-color {
                    color: $tab-color-active;
                }
                @if $tab-font-weight-active != $tab-font-weight {
                    font-weight: $tab-font-weight-active;
                }
                @if $tab-font-size-active != $tab-font-size {
                    font-size: $tab-font-size-active;
                }
                @if $tab-font-family-active != $tab-font-family {
                    font-family: $tab-font-family-active;
                }
            }
        }

        .#{$prefix}tab-top-active {
            @include background-gradient($tab-base-color-active, $tab-background-gradient-active, top);
        }
        .#{$prefix}tab-bottom-active {
            @include background-gradient($tab-base-color-active, $tab-background-gradient-active, bottom);
        }

        //disabled
        .#{$prefix}tab-disabled {
            @if $tab-border-color-disabled != $tab-border-color {
                border-color: $tab-border-color-disabled;
            }

            button {
                @if $tab-color-disabled != $tab-color {
                    color: $tab-color-disabled;
                }
                @if $tab-font-weight-disabled != $tab-font-weight {
                    font-weight: $tab-font-weight-disabled;
                }
                @if $tab-font-size-disabled != $tab-font-size {
                    font-size: $tab-font-size-disabled;
                }
                @if $tab-font-family-disabled != $tab-font-family {
                    font-family: $tab-font-family-disabled;
                }
            }
        }

        .#{$prefix}tab-top-disabled {
            background-image: none;
            background: transparent;
            @include background-gradient($tab-base-color-disabled, $tab-background-gradient-disabled, top);
        }
        .#{$prefix}tab-bottom-disabled {
            background-image: none;
            background: transparent;
            @include background-gradient($tab-base-color-disabled, $tab-background-gradient-disabled, bottom);
        }

        @if not $supports-gradients or $compile-all {
            .#{$prefix}nlg {
                @if $tab-background-gradient != null {
                    .#{$prefix}tab-top { background-image: theme-background-image($theme-name, 'tab/tab-default-top-bg.gif'); }
                    .#{$prefix}tab-bottom { background-image: theme-background-image($theme-name, 'tab/tab-default-bottom-bg.gif'); }
                }

                @if $tab-background-gradient-over != null {
                    .#{$prefix}tab-top-over { background-image: theme-background-image($theme-name, 'tab/tab-default-top-over-bg.gif'); }
                    .#{$prefix}tab-bottom-over { background-image: theme-background-image($theme-name, 'tab/tab-default-bottom-over-bg.gif'); }
                }

                @if $tab-background-gradient-active != null {
                    .#{$prefix}tab-top-active { background-image: theme-background-image($theme-name, 'tab/tab-default-top-active-bg.gif'); }
                    .#{$prefix}tab-bottom-active { background-image: theme-background-image($theme-name, 'tab/tab-default-bottom-active-bg.gif'); }
                }

                @if $tab-background-gradient-disabled != null {
                    .#{$prefix}tab-top-disabled { background-image: theme-background-image($theme-name, 'tab/tab-default-top-disabled-bg.gif') !important; }
                    .#{$prefix}tab-bottom-disabled { background-image: theme-background-image($theme-name, 'tab/tab-default-bottom-disabled-bg.gif') !important; }
                }
            }
        }

        .#{$prefix}tab-closable em {
            padding-right: $tab-closable-icon-width + 3;
        }

        @if $include-rtl {
            .#{$prefix}rtl.#{$prefix}tab-closable em {
                padding-right: 6px;
                padding-left: $tab-closable-icon-width + 3;
            }
        }

        .#{$prefix}tab-close-btn {
            position: absolute;
            top: $tab-closable-icon-top;
            right: $tab-closable-icon-right;
            width: $tab-closable-icon-width;
            height: $tab-closable-icon-height;
            font-size: 0;
            line-height: 0;
            text-indent: -999px;
            background: no-repeat;
            background-image: theme-background-image($theme-name, $tab-closable-icon);
            @include opacity(.6);
        }

        @if $include-rtl {
            .#{$prefix}rtl.#{$prefix}tab .#{$prefix}tab-close-btn {
                right: auto;
                left: $tab-closable-icon-right;
            }
        }

        .#{$prefix}nbr .#{$prefix}tab-close-btn {
            top: $nbr-tab-closable-icon-top;
            right: $nbr-tab-closable-icon-right;
        }

        @if $include-rtl {
            .#{$prefix}nbr .#{$prefix}rtl.#{$prefix}tab .#{$prefix}tab-close-btn {
                right: auto;
                left: $nbr-tab-closable-icon-right;
            }
        }

        /* Include the element name otherwise Internet Explorer 7 & 8 take a performance hit */
        a.#{$prefix}tab-close-btn:hover {
            @include opacity(1);
        }

        /* Include the element name to raise the specificity to equal the :hover */
        .#{$prefix}tab-default-disabled a.#{$prefix}tab-close-btn {
            @include opacity(0.3);
        }

        @if not $supports-border-radius or $compile-all {
            .#{$prefix}nbr {
                .#{$prefix}tab-top-over {
                    .#{$prefix}frame-tl,
                    .#{$prefix}frame-bl,
                    .#{$prefix}frame-tr,
                    .#{$prefix}frame-br,
                    .#{$prefix}frame-tc,
                    .#{$prefix}frame-bc {
                        background-image: theme-background-image($theme-name, 'tab/tab-default-top-over-corners.gif');
                    }
                    .#{$prefix}frame-ml,
                    .#{$prefix}frame-mr {
                        background-image: theme-background-image($theme-name, 'tab/tab-default-top-over-sides.gif');
                    }
                    @if $tab-background-gradient-over != null {
                        .#{$prefix}frame-mc {
                            background-color: $tab-base-color-over;
                            background-repeat: repeat-x;
                            background-image: theme-background-image($theme-name, 'tab/tab-default-top-over-bg.gif');
                        }
                    }
                }

                .#{$prefix}tab-bottom-over {
                    .#{$prefix}frame-tl,
                    .#{$prefix}frame-bl,
                    .#{$prefix}frame-tr,
                    .#{$prefix}frame-br,
                    .#{$prefix}frame-tc,
                    .#{$prefix}frame-bc {
                        background-image: theme-background-image($theme-name, 'tab/tab-default-bottom-over-corners.gif');
                    }
                    .#{$prefix}frame-ml,
                    .#{$prefix}frame-mr {
                        background-image: theme-background-image($theme-name, 'tab/tab-default-bottom-over-sides.gif');
                    }
                    @if $tab-background-gradient-over != null {
                        .#{$prefix}frame-mc {
                            background-color: $tab-base-color-over;
                            background-repeat: repeat-x;
                            background-image: theme-background-image($theme-name, 'tab/tab-default-bottom-over-bg.gif');
                        }
                    }
                }

                .#{$prefix}tab-top-active {
                    .#{$prefix}frame-tl,
                    .#{$prefix}frame-bl,
                    .#{$prefix}frame-tr,
                    .#{$prefix}frame-br,
                    .#{$prefix}frame-tc,
                    .#{$prefix}frame-bc {
                        background-image: theme-background-image($theme-name, 'tab/tab-default-top-active-corners.gif');
                    }
                    .#{$prefix}frame-ml,
                    .#{$prefix}frame-mr {
                        background-image: theme-background-image($theme-name, 'tab/tab-default-top-active-sides.gif');
                    }
                    @if $tab-background-gradient-active != null {
                        .#{$prefix}frame-mc {
                            background-color: $tab-base-color-active;
                            background-repeat: repeat-x;
                            background-image: theme-background-image($theme-name, 'tab/tab-default-top-active-bg.gif');
                        }
                    }
                }

                .#{$prefix}tab-bottom-active {
                    .#{$prefix}frame-tl,
                    .#{$prefix}frame-bl,
                    .#{$prefix}frame-tr,
                    .#{$prefix}frame-br,
                    .#{$prefix}frame-tc,
                    .#{$prefix}frame-bc {
                        background-image: theme-background-image($theme-name, 'tab/tab-default-bottom-active-corners.gif');
                    }
                    .#{$prefix}frame-ml,
                    .#{$prefix}frame-mr {
                        background-image: theme-background-image($theme-name, 'tab/tab-default-bottom-active-sides.gif');
                    }
                    @if $tab-background-gradient-active != null {
                        .#{$prefix}frame-mc {
                            background-color: $tab-base-color-active;
                            background-repeat: repeat-x;
                            background-image: theme-background-image($theme-name, 'tab/tab-default-bottom-active-bg.gif');
                        }
                    }
                }

                .#{$prefix}tab-top-disabled {
                    .#{$prefix}frame-tl,
                    .#{$prefix}frame-bl,
                    .#{$prefix}frame-tr,
                    .#{$prefix}frame-br,
                    .#{$prefix}frame-tc,
                    .#{$prefix}frame-bc {
                        background-image: theme-background-image($theme-name, 'tab/tab-default-top-disabled-corners.gif');
                    }
                    .#{$prefix}frame-ml,
                    .#{$prefix}frame-mr {
                        background-image: theme-background-image($theme-name, 'tab/tab-default-top-disabled-sides.gif');
                    }
                    @if $tab-background-gradient-disabled != null {
                        .#{$prefix}frame-mc {
                            background-repeat: repeat-x;
                            background-image: theme-background-image($theme-name, 'tab/tab-default-top-disabled-bg.gif');
                        }
                    }
                }

                .#{$prefix}tab-bottom-disabled {
                    .#{$prefix}frame-tl,
                    .#{$prefix}frame-bl,
                    .#{$prefix}frame-tr,
                    .#{$prefix}frame-br,
                    .#{$prefix}frame-tc,
                    .#{$prefix}frame-bc {
                        background-image: theme-background-image($theme-name, 'tab/tab-default-bottom-disabled-corners.gif');
                    }
                    .#{$prefix}frame-ml,
                    .#{$prefix}frame-mr {
                        background-image: theme-background-image($theme-name, 'tab/tab-default-bottom-disabled-sides.gif');
                    }
                    @if $tab-background-gradient-disabled != null {
                        .#{$prefix}frame-mc {
                            background-repeat: repeat-x;
                            background-image: theme-background-image($theme-name, 'tab/tab-default-bottom-disabled-bg.gif');
                        }
                    }
                }
            }
        }
    }