@use '@mskcc/themes/tokens' as tk;
@use '@carbon/styles/scss/config' as *;
@use '@mskcc/fundamentals/src/_variables.scss' as v;
@use '@mskcc/fundamentals/src/_mixins.scss' as m;
@use '@mskcc/colors' as c;
@use '@carbon/styles/scss/components/content-switcher';

@mixin msk-content-switcher {
    @include content-switcher.content-switcher;
    .#{$prefix}--content-switcher {
        --#{$prefix}-layer-selected-inverse: #{tk.$msk--color-bg-action-selected-inverse};
    }
    .#{$prefix}--content-switcher-btn {
        --#{$prefix}-border-inverse: #{tk.$msk--color-border};
        --#{$prefix}-text-secondary: #{tk.$msk--color-content-action};

        background-color: transparent;
        font-family: v.$msk--global-font-family;
        justify-content: center;

        &::before {
            --#{$prefix}-border-subtle: #{c.$msk--cool-gray-30};
        }
    }
}
