@st-namespace 'TextButton-deprecated-st-css';
:import {
    -st-from: "../internal/WixUiCoreComponents/components/CoreButtonNext/CoreButtonNext.st.css";
    -st-default: ButtonNext;
}

:import {
    -st-from: "../../common/formatters.st";
    -st-named: color, fallback, font, applyOpacity;
}

/*Defaults*/
:vars {
    PrimaryColor: color-8;
    SecondaryColor: color-5;
    LinkColor: color-5;
    DisabledColor: color-3;
    DefaultFont: "{theme: 'Body-M', size: '16px', lineHeight: '1.5em'}";
    MobileDefaultFont: "{theme: 'Body-M', size: '14px', lineHeight: '1.44em'}";
}

/*Overrides*/
:vars {
    /*
      The color of the text instead of the default
      @default color-8 for primary, color-5 for others
    */
    MainTextColor: --overridable;
    /*
      The font of the text instead of the default font
      @default {theme: 'Body-M', size: '16px', lineHeight: '1.5em'} and {theme: 'Body-M', size: '14px', lineHeight: '1.44em'} for mobile
    */
    MainTextFont: --overridable;
}

/*
 * The color of the text instead of the default
 * @type color
 * @default --wix-color-8 for primary | overrides: { --wix-color-5 for others
 */
@property st-global(--wix-ui-tpa-text-button-main-text-color);

/*
 * The font of the text instead of the default font
 * @type font
 * @default [Desktop] preset: 'Body-M' | overrides: { size: '16px', lineHeight: '1.5em'} [Mobile] preset: 'Body-M' | overrides: { size: '14px', lineHeight: '1.44em'}
 */
@property st-global(--wix-ui-tpa-text-button-main-text-font);

.root {
    -st-extends: ButtonNext;
    -st-states: priority(enum(link, primary, secondary)), mobile;
    /*css goes here*/
    background-color: transparent;
    text-decoration: none;
    border: none;
    padding: 0;
    font: fallback(font(value(MainTextFont)), font(value(DefaultFont)))
}

.root:mobile {
    font: fallback(font(value(MainTextFont)), font(value(MobileDefaultFont)))
}

/* Primary */

:vars {
    PrimaryTextColor: color(fallback(value(MainTextColor), value(PrimaryColor)));
}

.root:priority(primary) {
    color: value(PrimaryTextColor);
}

.root:priority(primary):active,
.root:priority(primary):focus,
.root:priority(primary):hover {
    color: applyOpacity(value(PrimaryTextColor), 0.7);
}

/* Secondary */

:vars {
    SecondaryTextColor: color(fallback(value(MainTextColor), value(SecondaryColor)));
}

.root:priority(secondary) {
    color: value(SecondaryTextColor);
}

.root:priority(secondary):active,
.root:priority(secondary):focus,
.root:priority(secondary):hover {
    color: applyOpacity(value(SecondaryTextColor), 0.7);
}

/* Link */

:vars {
    LinkTextColor: color(fallback(value(MainTextColor), value(LinkColor)));
}

.root:priority(link) {
    color: value(LinkTextColor);
    text-decoration: underline;
}

.root:priority(link):active,
.root:priority(link):focus,
.root:priority(link):hover {
    color: applyOpacity(value(LinkTextColor), 0.7);
}

/* Disabled */

.root:priority(primary):disabled,
.root:priority(link):disabled,
.root:priority(secondary):disabled {
    color: color(value(DisabledColor))
}

.affixIcon svg {
    height: 1.5em;
    width: 1.5em;
    margin: calc(-1 * (1.5em / 4)) 0;
}

.affixIcon svg:not([fill="currentColor"]) path {
    stroke: currentColor;
    fill: none;
}

.prefix-icon::after, .suffix-icon::before {
    content: '';
    width: 4px;
    height: 1px;
    display: inline-block;
}

/* st-namespace-reference="../../../../src/components/TextButton/TextButton.deprecated.st.css" */