@include wrap-class() {
    .wcc-nav-tab {
        .wcc-nav-tab-item {
            margin: 0;
            padding: 0;
        }
        .wcc-nav-tab-button-icon {
            display: inline-flex;
            padding-right: 5px;
        }
        .wcc-nav-tab-button {
            border: none;
            cursor: pointer;
            color: lighten(color(primary, font), 20%);
            background: transparent;
            font-weight: 500;
        }
        .wcc-nav-tabs-container {
            ul {
                list-style: none;
                padding-left: 0;
            }
        }
    }
    .wcc-nav-tab-content-container {
        position: relative;
    }
    .wcc-vertical-tab {
        @extend %flex;
        width: 100%;
        & > .wcc-nav-tabs-container {
            width: 18%;
        }
        & > .wcc-nav-tab-content-container {
            width: 82%;
        }
        .wcc-nav-tab-button {
            @extend %flex;
            @extend %align-center;
            padding: 12px 10px;
            width: 100%;
            &:hover,
            &:focus,
            &:active {
                color: color(primary, base);
            }
            &.wcc-nav-tab-has-subtitle {
                justify-content: space-between;
            }
        }
        .wcc-vertical-tabs {
            margin: 0;
            .wcc-nav-tab-item {
                border-left: 4px solid;
                border-left-color: transparent;
                border-bottom: 1px solid $border-color;
                color: #2A3646;
                .wcc-nav-tab-button:hover {
                    color: #0C66E4;
                }
                &.active,&.hover {
                    background: #F1F8FE;
                    margin-right: -1px;
                    .wcc-nav-tab-button {
                        color: #0C66E4;
                        background-color: #F1F8FE;
                    }
                }
            }
        }
        .wcc-nav-tab-content-container {
            padding: 0px 20px 15px 20px;
        }
        .wcc-vertical-tabs {
            height: 100%;
        }
        .wcc-nav-tab-setion-header--inner {
            margin-left: -20px;
            margin-right: -20px;
        }
    }
    .wcc-horizontal-tab {
        .wcc-horizontal-tabs {
            @extend %flex;
            margin: 0;
            .wcc-nav-tab-item {
                border-color: transparent;
                color: color(primary, font);
                .wcc-nav-tab-button {
                    padding: 12px 20px;
                    width: 100%;
                    height: 61px;
                    &.active {
                        border-color: color(primary, base);
                        color: #1863dc;
                    }
                }
                &.active {
                    border-color: color(primary, base);
                    color: #1863dc;
                }
            }
            .wcc-nav-tab-item .active{
                .wcc-nav-tab-button {
                    color: #1863dc;
                }
            }
        }
        .wcc-nav-tab-content-container {
            background: color(mono, white);
        }
    }
    .wcc-nav-tab-section-header {
        margin-top: -15px;
        border-bottom: 1px solid #d9d9d9;
        padding: 5px 0;
    }
    .wcc-nav-tab-section-actions button {
        margin-left: 10px;
    }
    .wcc-banner-selector-section {
        background-color: #F1F8FE;
        height: 61px;
        border-radius: 12px 12px 0px 0px;
        margin: 0px 0px 20px 0px;
    }
    .wcc-horizontal-tab {
        .wcc-nav-tab-horizontal-bar,.wcc-horizontal-tabs{
            background-color: #F1F8FE;
        }
    }
    .wcc-nav-tab-section-cookies .wcc-vertical-tab .wcc-nav-tab-item{

        border-bottom: none;
        border-left: none;
        border-radius: 9px;
        &.active {
            border-bottom: none;
            border-left: none;
            background-color: #F1F8FE;
            
            .wcc-nav-tab-button {
                border-bottom: none;
                border-left: none;
                border-radius: 9px;
            }
        }
    }
    .wcc-nav-tab-section-cookies .wcc-vertical-tab .wcc-nav-tabs-container{
        border-right: 1px solid $border-color;
        padding-right: 16px;
    }
    .wcc-customise-section-content .wcc-vertical-tab .wcc-nav-tabs-container{
        border-right: 1px solid $border-color;
        padding-right: 16px;
        margin-bottom: 16px;
    }
}
