tss-btn-nobg /* Button */
button {
    font-family: inherit;
    color: var(--tss-default-foreground-color);
    background-color: var(--tss-default-background-color);
    border-color: var(--tss-default-border-color);
}

button:focus {
    outline: none;
}


a {
    color: var(--tss-link-color);
    text-decoration: none;
}

    a:hover {
        text-decoration: underline;
    }

.tss-btn {
    border: 1px solid transparent;
    border-radius: 2px;
    outline: transparent none medium;
    min-width: 80px;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    padding: 0px 16px;
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--tss-box-shadow);
}

    .tss-btn.tss-text-ellipsis,
    .tss-btn.tss-text-nowrap,
    .tss-btn.tss-text-breakspaces {
        display: inline-block;
    }

    .tss-btn.tss-textalign-left {
        justify-content: flex-start;
    }

    .tss-btn.tss-textalign-right {
        justify-content: flex-end;
    }

    .tss-btn.tss-textalign-center {
        justify-content: center;
    }

    .tss-btn:hover {
        color: var(--tss-default-foreground-hover-color);
        background-color: var(--tss-default-background-hover-color);
    }

    .tss-btn.tss-btn-nowrap {
        white-space: nowrap;
    }

.tss-btn.tss-small {
    min-height: 16px;
    margin: 4px;
    padding: 0px 8px;
}

.tss-btn:focus {
    outline: none;
}

.tss-btn.tss-disabled {
    color: var(--tss-disabled-foreground-color);
    background-color: var(--tss-disabled-background-color);
    border-color: var(--tss-disabled-background-color);
    pointer-events: none;
}

    .tss-btn.tss-disabled .tss-fontcolor-default {
        color: var(--tss-disabled-foreground-color);
    }

.tss-btn > i {
    text-decoration: none;
}

.tss-btn.tss-btn-icononhover > i {
    opacity: 0;
    transition: opacity .15s ease-in-out;
}

.tss-btn.tss-btn-icononhover:hover > i {
    opacity: 1;
}

.tss-btn > i + span:not(:empty) {
    margin-left: 10px;
    min-width: 16px;
}

.tss-btn > span:not(:empty) + i {
    margin-right: 10px;
    margin-left: 10px;
    min-width: 16px;
}

.tss-btn.tss-btn-default {
    color: var(--tss-default-foreground-color);
    border-color: transparent;
    box-shadow: none;
    background: transparent;
}

.tss-btn.tss-btn-default .tss-fontcolor-default {
    color: var(--tss-default-foreground-color);
}

    .tss-btn.tss-btn-default:hover {
        color: var(--tss-default-foreground-hover-color);
        background-color: var(--tss-default-background-hover-color);
        border-color: var(--tss-default-background-hover-color);
    }

        .tss-btn.tss-btn-default:hover .tss-fontcolor-default {
            color: var(--tss-default-foreground-hover-color);
        }

    .tss-btn.tss-btn-default:active {
        color: var(--tss-default-foreground-active-color);
        background-color: var(--tss-default-background-active-color);
        border-color: var(--tss-default-background-active-color);
    }

        .tss-btn.tss-btn-default:active .tss-fontcolor-default {
            color: var(--tss-default-foreground-active-color);
        }

.tss-btn.tss-btn-primary:not(.tss-disabled) {
    color: var(--tss-primary-foreground-color);
    background-color: var(--tss-primary-background-color);
    border-color: var(--tss-primary-border-color);
}

    .tss-btn.tss-btn-primary:not(.tss-disabled) .tss-fontcolor-default {
        color: var(--tss-primary-foreground-color);
    }

    .tss-btn.tss-btn-primary:not(.tss-disabled):hover {
        color: var(--tss-primary-foreground-hover-color);
        background-color: var(--tss-primary-background-hover-color);
    }

        .tss-btn.tss-btn-primary:not(.tss-disabled):hover .tss-fontcolor-default {
            color: var(--tss-primary-foreground-hover-color);
        }

    .tss-btn.tss-btn-primary:not(.tss-disabled):active {
        color: var(--tss-primary-foreground-active-color);
        background-color: var(--tss-primary-background-active-color);
    }

        .tss-btn.tss-btn-primary:not(.tss-disabled):active .tss-fontcolor-default {
            color: var(--tss-primary-foreground-active-color);
        }


.tss-btn.tss-btn-danger:not(.tss-disabled) {
    color: var(--tss-danger-foreground-color);
    background-color: var(--tss-danger-background-color);
    border-color: var(--tss-danger-border-color);
}

    .tss-btn.tss-btn-danger:not(.tss-disabled) .tss-fontcolor-default {
        color: var(--tss-danger-foreground-color);
    }

    .tss-btn.tss-btn-danger:not(.tss-disabled):hover {
        color: var(--tss-danger-foreground-hover-color);
        background-color: var(--tss-danger-background-hover-color);
    }

        .tss-btn.tss-btn-danger:not(.tss-disabled):hover .tss-fontcolor-default {
            color: var(--tss-danger-foreground-hover-color);
        }

    .tss-btn.tss-btn-danger:not(.tss-disabled):active {
        color: var(--tss-danger-foreground-active-color);
        background-color: var(--tss-danger-background-active-color);
    }

        .tss-btn.tss-btn-danger:not(.tss-disabled):active .tss-fontcolor-default {
            color: var(--tss-danger-foreground-active-color);
        }

.tss-btn.tss-btn-success:not(.tss-disabled) {
    color: var(--tss-success-foreground-color);
    background-color: var(--tss-success-background-color);
    border-color: var(--tss-success-border-color);
}

    .tss-btn.tss-btn-success:not(.tss-disabled) .tss-fontcolor-default {
        color: var(--tss-success-foreground-color);
    }

    .tss-btn.tss-btn-success:not(.tss-disabled):hover {
        color: var(--tss-success-foreground-hover-color);
        background-color: var(--tss-success-background-hover-color);
    }

        .tss-btn.tss-btn-success:not(.tss-disabled):hover .tss-fontcolor-default {
            color: var(--tss-success-foreground-hover-color);
        }

    .tss-btn.tss-btn-success:not(.tss-disabled):active {
        color: var(--tss-success-foreground-active-color);
        background-color: var(--tss-success-background-active-color);
    }

        .tss-btn.tss-btn-success:not(.tss-disabled):active .tss-fontcolor-default {
            color: var(--tss-success-foreground-active-color);
        }

.tss-btn.tss-btn-noborder {
    border-color: transparent;
    box-shadow: none;
}

    .tss-btn.tss-btn-noborder:hover {
        border-color: transparent;
    }

.tss-btn.tss-btn-nobg {
    background: transparent;
    background-color: transparent;
    box-shadow: none;
}

.tss-btn.tss-btn-primary.tss-btn-nobg,
.tss-btn.tss-btn-primary.tss-btn-nobg .tss-fontcolor-default {
    color: var(--tss-primary-background-color);
}

    .tss-btn.tss-btn-primary.tss-btn-nobg:hover,
    .tss-btn.tss-btn-primary.tss-btn-nobg:hover .tss-fontcolor-default {
        color: var(--tss-primary-background-hover-color);
    }

    .tss-btn.tss-btn-primary.tss-btn-nobg:active,
    .tss-btn.tss-btn-primary.tss-btn-nobg:active .tss-fontcolor-default {
        color: var(--tss-primary-background-active-color);
    }


.tss-btn.tss-btn-danger.tss-btn-nobg,
.tss-btn.tss-btn-danger.tss-btn-nobg .tss-fontcolor-default {
    color: var(--tss-danger-background-color);
}

    .tss-btn.tss-btn-danger.tss-btn-nobg:hover {
        color: var(--tss-danger-background-hover-color);
        background-color: var(--tss-danger-background-hover-color);
    }

        .tss-btn.tss-btn-danger.tss-btn-nobg:hover .tss-fontcolor-default {
            color: var(--tss-danger-background-hover-color);
        }

    .tss-btn.tss-btn-danger.tss-btn-nobg:active {
        color: var(--tss-danger-background-active-color);
        background-color: var(--tss-danger-background-active-color);
    }

        .tss-btn.tss-btn-danger.tss-btn-nobg:active .tss-fontcolor-default {
            color: var(--tss-danger-background-active-color);
        }


.tss-btn.tss-btn-success.tss-btn-nobg,
.tss-btn.tss-btn-success.tss-btn-nobg .tss-fontcolor-default {
    color: var(--tss-success-background-color);
}

    .tss-btn.tss-btn-success.tss-btn-nobg:hover {
        color: var(--tss-success-background-hover-color);
        background-color: var(--tss-success-background-hover-color);
    }

        .tss-btn.tss-btn-success.tss-btn-nobg:hover .tss-fontcolor-default {
            color: var(--tss-success-background-hover-color);
        }

    .tss-btn.tss-btn-success.tss-btn-nobg:active,
    .tss-btn.tss-btn-success.tss-btn-nobg:active .tss-fontcolor-default {
        color: var(--tss-success-background-active-color);
    }

.tss-btn.tss-btn-link {
    border: none;
    background: none;
    color: var(--tss-link-color);
    text-decoration: none;
    min-width: unset;
    box-shadow: none;
}

    .tss-btn.tss-btn-link,
    .tss-btn.tss-btn-link .tss-fontcolor-default {
        color: var(--tss-link-color);
    }

        .tss-btn.tss-btn-link:hover {
            border: none;
            background: none;
            background-color: transparent;
            color: var(--tss-link-color);
        }

            .tss-btn.tss-btn-link:hover .tss-fontcolor-default {
                color: var(--tss-link-color);
            }

            .tss-btn.tss-btn-link:hover > span {
                text-decoration: underline;
            }

        .tss-btn.tss-btn-link.tss-disabled {
            color: var(--tss-disabled-foreground-color);
            background-color: unset;
            border-color: unset;
        }

            .tss-btn.tss-btn-link.tss-disabled .tss-fontcolor-default {
                color: var(--tss-disabled-foreground-color);
            }

        .tss-btn.tss-btn-link:hover > i {
            text-decoration: none !important;
        }

        .tss-btn.tss-btn-link.tss-dark,
        .tss-btn.tss-btn-link.tss-dark .tss-fontcolor-default {
            color: var(--tss-default-foreground-color);
        }

        .tss-btn.tss-btn-link.tss-danger,
        .tss-btn.tss-btn-link.tss-danger .tss-fontcolor-default {
            color: var(--tss-danger-background-color);
        }

            .tss-btn.tss-btn-link.tss-danger:hover,
            .tss-btn.tss-btn-link.tss-danger:hover .tss-fontcolor-default {
                color: var(--tss-danger-background-color);
            }

            .tss-btn.tss-btn-link.tss-danger.tss-disabled,
            .tss-btn.tss-btn-link.tss-danger.tss-disabled .tss-fontcolor-default {
                color: var(--tss-disabled-foreground-color);
            }

.tss-btn.tss-btn-nominsize {
    min-height: unset;
    min-width: unset;
}

.tss-btn.tss-btn-remove-padding {
    padding: 0px;
}

.tss-btn.tss-btn-less-padding {
    padding: 0px 8px;
}

.tss-btn.tss-small.tss-btn-less-padding {
    padding: 0px 4px;
}

.tss-btn.tss-btn-less-padding > span:not(:empty) + i {
    margin-right: 0px;
}


.tss-btn.tss-btn-remove-margin {
    margin: 0px;
}

.tss-btn.tss-btn-linkonhover:hover,
.tss-btn.tss-btn-linkonhover:hover .tss-fontcolor-default {
    color: var(--tss-link-color);
}

    .tss-btn.tss-btn-linkonhover:hover > span {
        text-decoration: underline;
    }

    .tss-btn.tss-btn-linkonhover:hover > i {
        text-decoration: none !important;
    }

.tss-btn.tss-btn-linkonhover.tss-dark,
.tss-btn.tss-btn-linkonhover.tss-dark .tss-fontcolor-default {
    color: var(--tss-default-foreground-color);
}

.tss-btn.tss-btn-linkonhover.tss-danger,
.tss-btn.tss-btn-linkonhover.tss-danger .tss-fontcolor-default {
    color: var(--tss-danger-background-color);
}

    .tss-btn.tss-btn-linkonhover.tss-danger:hover,
    .tss-btn.tss-btn-linkonhover.tss-danger:hover .tss-fontcolor-default {
        color: var(--tss-danger-background-color);
    }

    .tss-btn.tss-btn-linkonhover.tss-danger.tss-disabled,
    .tss-btn.tss-btn-linkonhover.tss-danger.tss-disabled .tss-fontcolor-default {
        color: var(--tss-disabled-foreground-color);
    }

.tss-btn.tss-btn-nohover:hover {
    background: none;
    background-color: transparent;
    border: 1px solid transparent;
}

.tss-btn.tss-btn-link.tss-btn-nohover:hover {
    border: none;
}

.tss-link-no-underline {
    text-decoration: none;
}

    .tss-link-no-underline:hover {
        text-decoration: none;
    }


.tss-toggle-btn-unchecked .tss-image {
    filter: saturate(0);
}

.tss-toggle-btn-unchecked .tss-fontcolor-default {
    color: var(--tss-disabled-foreground-color);
}
