[data-theme=light] {
    --_0-y2ZX: #ececec;
    --_1-y2ZX: var(--color-cold-gray-150);
    --_2-y2ZX: var(--color-white);
    --_3-y2ZX: var(--color-ripe-red-400);
    --_4-y2ZX: var(--color-ripe-red-600);
    --_5-y2ZX: var(--color-ripe-red-700);
    --_6-y2ZX: var(--color-cold-gray-900);
    --_7-y2ZX: var(--color-cold-gray-800);
    --_8-y2ZX: var(--color-cold-gray-700);
    --_9-y2ZX: var(--color-white);
    --_10-y2ZX: var(--color-cold-gray-900);
    --_11-y2ZX: var(--color-white);
    --_12-y2ZX: var(--color-white)
}

[data-theme=dark] {
    --_0-y2ZX: var(--color-cold-gray-850);
    --_1-y2ZX: var(--color-cold-gray-750);
    --_2-y2ZX: var(--color-white);
    --_3-y2ZX: var(--color-ripe-red-700);
    --_4-y2ZX: var(--color-ripe-red-600);
    --_5-y2ZX: var(--color-ripe-red-500);
    --_6-y2ZX: var(--color-white);
    --_7-y2ZX: var(--color-cold-gray-100);
    --_8-y2ZX: var(--color-cold-gray-200);
    --_9-y2ZX: var(--color-cold-gray-900);
    --_10-y2ZX: var(--color-white);
    --_11-y2ZX: var(--color-cold-gray-900);
    --_12-y2ZX: var(--color-cold-gray-900)
}

.tv-button {
    color: var(--color-cold-gray-500);
    display: inline-block;
    font-size: 14px;
    line-height: 32px;
    margin: 0;
    min-width: 40px;
    padding: 1px 22px;
    position: relative;
    text-align: center;
    text-decoration: none;
    -webkit-user-select: none;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap;
    fill: currentColor;
    background-color: initial;
    border: none;
    border-radius: 4px;
    box-sizing: border-box;
    cursor: pointer;
    outline: 0;
    overflow: hidden;
    -webkit-tap-highlight-color: transparent;
    transition: background-color .35s ease, border-color .35s ease, color .35s ease
}

.tv-button.tv-button--danger_ghost,
.tv-button.tv-button--default,
.tv-button.tv-button--default_ghost,
.tv-button.tv-button--primary_ghost,
.tv-button.tv-button--secondary_ghost,
.tv-button.tv-button--state,
.tv-button.tv-button--success_ghost,
.tv-button.tv-button--warning_ghost {
    padding: 0 21px
}

.tv-button.i-active,
.tv-button.i-hover,
.tv-button:active {
    transition-duration: 60ms
}

@media (any-hover:hover) {
    .tv-button:hover {
        transition-duration: 60ms
    }
}

.tv-button svg {
    vertical-align: middle
}

.tv-button--block {
    display: block;
    text-align: center;
    width: 100%
}

.tv-button+.tv-button {
    margin-inline-start: 15px
}

.tv-button.tv-button--no-left-margin {
    margin-inline-start: 0
}

.tv-button__text {
    display: inline-block;
    position: relative
}

.tv-button__text--full-height {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    white-space: normal;
    width: 100%;
    word-wrap: break-word;
    line-height: 1.2em;
    margin: 11px 5px
}

.tv-button--default,
.tv-button--default_ghost,
a.tv-button--default:visited {
    background-color: var(--color-body-bg);
    border-color: var(--color-body-bg);
    color: #fff
}

.tv-button--default_ghost {
    color: var(--color-body-bg)
}

.tv-button--default_ghost.i-checked {
    background-color: var(--color-body-bg);
    border-color: var(--color-body-bg);
    color: #fff
}

.tv-button--default.i-active,
.tv-button--default:active,
.tv-button--default_ghost.i-active,
.tv-button--default_ghost:active {
    background-color: var(--_0-y2ZX);
    border-color: var(--_0-y2ZX);
    color: #fff;
    transform: translateY(1px)
}

.tv-button--default.i-hover,
.tv-button--default_ghost.i-hover {
    background-color: var(--color-button-hover-bg);
    border-color: var(--color-button-hover-bg);
    color: #fff
}

@media (any-hover:hover) {
    .tv-button--default:hover,
    .tv-button--default_ghost:hover {
        background-color: var(--color-button-hover-bg);
        border-color: var(--color-button-hover-bg);
        color: #fff
    }
}

.tv-button--default_ghost .tv-button__loader-item {
    background-color: var(--color-button-hover-bg)
}

.tv-button--default_ghost.i-hover .tv-button__loader-item {
    background-color: #fff
}

@media (any-hover:hover) {
    .tv-button--default_ghost:hover .tv-button__loader-item {
        background-color: #fff
    }
}

.tv-button--default,
.tv-button--default.i-checked,
.tv-button--default_ghost,
.tv-button--default_ghost.i-checked {
    border: 1px solid;
    border-color: var(--color-section-separator-border);
    color: var(--color-tv-button-checked)
}

.tv-button--default.i-hover,
.tv-button--default_ghost.i-hover {
    border-color: var(--color-section-separator-border);
    color: var(--color-tv-button-checked)
}

@media (any-hover:hover) {
    .tv-button--default:hover,
    .tv-button--default_ghost:hover {
        border-color: var(--color-section-separator-border);
        color: var(--color-tv-button-checked)
    }
}

.tv-button--default.i-active,
.tv-button--default:active,
.tv-button--default_ghost.i-active,
.tv-button--default_ghost:active {
    border-color: var(--color-section-separator-border);
    color: var(--color-tv-button-checked)
}

.tv-button--primary,
.tv-button--primary_ghost,
a.tv-button--primary:visited {
    background-color: var(--_6-y2ZX);
    border-color: var(--_6-y2ZX);
    color: var(--_9-y2ZX)
}

.tv-button--primary_ghost {
    color: var(--_6-y2ZX)
}

.tv-button--primary_ghost.i-checked {
    background-color: var(--_6-y2ZX);
    border-color: var(--_6-y2ZX);
    color: var(--_9-y2ZX)
}

.tv-button--primary.i-active,
.tv-button--primary:active,
.tv-button--primary_ghost.i-active,
.tv-button--primary_ghost:active {
    background-color: var(--_8-y2ZX);
    border-color: var(--_8-y2ZX);
    color: var(--_9-y2ZX);
    transform: translateY(1px)
}

.tv-button--primary.i-hover,
.tv-button--primary_ghost.i-hover {
    background-color: var(--_7-y2ZX);
    border-color: var(--_7-y2ZX);
    color: var(--_9-y2ZX)
}

@media (any-hover:hover) {
    .tv-button--primary:hover,
    .tv-button--primary_ghost:hover {
        background-color: var(--_7-y2ZX);
        border-color: var(--_7-y2ZX);
        color: var(--_9-y2ZX)
    }
}

.tv-button--primary_ghost .tv-button__loader-item {
    background-color: var(--_7-y2ZX)
}

.tv-button--primary_ghost.i-hover .tv-button__loader-item {
    background-color: var(--_9-y2ZX)
}

@media (any-hover:hover) {
    .tv-button--primary_ghost:hover .tv-button__loader-item {
        background-color: var(--_9-y2ZX)
    }
}

.tv-button--secondary,
.tv-button--secondary_ghost,
a.tv-button--secondary:visited {
    background-color: var(--color-cold-gray-100);
    border-color: var(--color-cold-gray-100);
    color: var(--color-cold-gray-500)
}

.tv-button--secondary_ghost {
    color: var(--color-cold-gray-500)
}

.tv-button--secondary_ghost.i-checked {
    background-color: var(--color-cold-gray-100);
    border-color: var(--color-cold-gray-100);
    color: var(--color-cold-gray-500)
}

.tv-button--secondary.i-active,
.tv-button--secondary:active,
.tv-button--secondary_ghost.i-active,
.tv-button--secondary_ghost:active {
    background-color: #d1dbf0;
    border-color: #d1dbf0;
    color: var(--color-cold-gray-500);
    transform: translateY(1px)
}

.tv-button--secondary.i-hover,
.tv-button--secondary_ghost.i-hover {
    background-color: #e1e7f5;
    border-color: #e1e7f5;
    color: var(--color-cold-gray-500)
}

@media (any-hover:hover) {
    .tv-button--secondary:hover,
    .tv-button--secondary_ghost:hover {
        background-color: #e1e7f5;
        border-color: #e1e7f5;
        color: var(--color-cold-gray-500)
    }
}

.tv-button--secondary_ghost .tv-button__loader-item {
    background-color: #e1e7f5
}

.tv-button--secondary_ghost.i-hover .tv-button__loader-item {
    background-color: var(--color-cold-gray-500)
}

@media (any-hover:hover) {
    .tv-button--secondary_ghost:hover .tv-button__loader-item {
        background-color: var(--color-cold-gray-500)
    }
}

.tv-button--success,
.tv-button--success_ghost,
a.tv-button--success:visited {
    background-color: var(--color-success);
    border-color: var(--color-success);
    color: var(--_2-y2ZX)
}

.tv-button--success_ghost {
    color: var(--color-success)
}

.tv-button--success_ghost.i-checked {
    background-color: var(--color-success);
    border-color: var(--color-success);
    color: var(--_2-y2ZX)
}

.tv-button--success.i-active,
.tv-button--success:active,
.tv-button--success_ghost.i-active,
.tv-button--success_ghost:active {
    background-color: var(--color-success-active);
    border-color: var(--color-success-active);
    color: var(--_2-y2ZX);
    transform: translateY(1px)
}

.tv-button--success.i-hover,
.tv-button--success_ghost.i-hover {
    background-color: var(--color-success-hover);
    border-color: var(--color-success-hover);
    color: var(--_2-y2ZX)
}

@media (any-hover:hover) {
    .tv-button--success:hover,
    .tv-button--success_ghost:hover {
        background-color: var(--color-success-hover);
        border-color: var(--color-success-hover);
        color: var(--_2-y2ZX)
    }
}

.tv-button--success_ghost .tv-button__loader-item {
    background-color: var(--color-success-hover)
}

.tv-button--success_ghost.i-hover .tv-button__loader-item {
    background-color: var(--_2-y2ZX)
}

@media (any-hover:hover) {
    .tv-button--success_ghost:hover .tv-button__loader-item {
        background-color: var(--_2-y2ZX)
    }
}

.tv-button--danger,
.tv-button--danger_ghost,
a.tv-button--danger:visited {
    background-color: var(--_3-y2ZX);
    border-color: var(--_3-y2ZX);
    color: var(--_2-y2ZX)
}

.tv-button--danger_ghost {
    color: var(--_3-y2ZX)
}

.tv-button--danger_ghost.i-checked {
    background-color: var(--_3-y2ZX);
    border-color: var(--_3-y2ZX);
    color: var(--_2-y2ZX)
}

.tv-button--danger.i-active,
.tv-button--danger:active,
.tv-button--danger_ghost.i-active,
.tv-button--danger_ghost:active {
    background-color: var(--_5-y2ZX);
    border-color: var(--_5-y2ZX);
    color: var(--_2-y2ZX);
    transform: translateY(1px)
}

.tv-button--danger.i-hover,
.tv-button--danger_ghost.i-hover {
    background-color: var(--_4-y2ZX);
    border-color: var(--_4-y2ZX);
    color: var(--_2-y2ZX)
}

@media (any-hover:hover) {
    .tv-button--danger:hover,
    .tv-button--danger_ghost:hover {
        background-color: var(--_4-y2ZX);
        border-color: var(--_4-y2ZX);
        color: var(--_2-y2ZX)
    }
}

.tv-button--danger_ghost .tv-button__loader-item {
    background-color: var(--_4-y2ZX)
}

.tv-button--danger_ghost.i-hover .tv-button__loader-item {
    background-color: var(--_2-y2ZX)
}

@media (any-hover:hover) {
    .tv-button--danger_ghost:hover .tv-button__loader-item {
        background-color: var(--_2-y2ZX)
    }
}

.tv-button--warning,
.tv-button--warning_ghost,
a.tv-button--warning:visited {
    background-color: var(--color-tan-orange-500);
    border-color: var(--color-tan-orange-500);
    color: #fff
}

.tv-button--warning_ghost {
    color: var(--color-tan-orange-500)
}

.tv-button--warning_ghost.i-checked {
    background-color: var(--color-tan-orange-500);
    border-color: var(--color-tan-orange-500);
    color: #fff
}

.tv-button--warning.i-active,
.tv-button--warning:active,
.tv-button--warning_ghost.i-active,
.tv-button--warning_ghost:active {
    background-color: var(--color-tan-orange-a600);
    border-color: var(--color-tan-orange-a600);
    color: #fff;
    transform: translateY(1px)
}

.tv-button--warning.i-hover,
.tv-button--warning_ghost.i-hover {
    background-color: var(--color-tan-orange-a400);
    border-color: var(--color-tan-orange-a400);
    color: #fff
}

@media (any-hover:hover) {
    .tv-button--warning:hover,
    .tv-button--warning_ghost:hover {
        background-color: var(--color-tan-orange-a400);
        border-color: var(--color-tan-orange-a400);
        color: #fff
    }
}

.tv-button--warning_ghost .tv-button__loader-item {
    background-color: var(--color-tan-orange-a400)
}

.tv-button--warning_ghost.i-hover .tv-button__loader-item {
    background-color: #fff
}

@media (any-hover:hover) {
    .tv-button--warning_ghost:hover .tv-button__loader-item {
        background-color: #fff
    }
}

.tv-button--link,
.tv-button--link:visited {
    color: var(--color-link-primary-default);
    fill: var(--color-link-primary-default)
}

@media (any-hover:hover) {
    .tv-button--link:hover {
        color: var(--color-link-primary-hover);
        fill: var(--color-link-primary-hover)
    }
}

.tv-button--link:active {
    color: var(--color-link-primary-active);
    fill: var(--color-link-primary-active)
}

.tv-button--link:focus {
    outline: auto;
    outline-offset: 2px
}

.tv-button--link:focus-visible {
    outline: auto;
    outline-offset: 2px
}

.tv-button--link:focus:not(:focus-visible) {
    outline: none
}

.tv-button--danger_ghost,
.tv-button--default_ghost,
.tv-button--primary_ghost,
.tv-button--secondary_ghost,
.tv-button--success_ghost,
.tv-button--warning_ghost {
    background-color: var(--color-static-transparent);
    border-style: solid;
    border-width: 1px
}

.tv-button--danger_ghost.tv-button--size_large,
.tv-button--default_ghost.tv-button--size_large,
.tv-button--primary_ghost.tv-button--size_large,
.tv-button--secondary_ghost.tv-button--size_large,
.tv-button--success_ghost.tv-button--size_large,
.tv-button--warning_ghost.tv-button--size_large {
    border-width: 2px
}

.tv-button--danger_ghost.tv-button--size_large.tv-button--thin-border,
.tv-button--default_ghost.tv-button--size_large.tv-button--thin-border,
.tv-button--primary_ghost.tv-button--size_large.tv-button--thin-border,
.tv-button--secondary_ghost.tv-button--size_large.tv-button--thin-border,
.tv-button--success_ghost.tv-button--size_large.tv-button--thin-border,
.tv-button--warning_ghost.tv-button--size_large.tv-button--thin-border {
    border-width: 1px
}

@media (any-hover:hover) {
    .tv-button--default_ghost:hover {
        background-color: var(--_0-y2ZX)
    }
}

.tv-button.i-disabled,
.tv-button.i-disabled:active,
.tv-button:disabled,
.tv-button:disabled:active {
    background-color: var(--_1-y2ZX);
    border-color: var(--_1-y2ZX);
    color: var(--color-text-disabled);
    cursor: default
}

@media (any-hover:hover) {
    .tv-button.i-disabled:hover,
    .tv-button:disabled:hover {
        background-color: var(--_1-y2ZX);
        border-color: var(--_1-y2ZX);
        color: var(--color-text-disabled);
        cursor: default
    }
}

.tv-button.i-disabled:active,
.tv-button:disabled:active {
    transform: translateY(0)
}

.tv-button--size_xsmall {
    border-radius: 1px;
    font-size: 11px;
    font-weight: 400;
    line-height: 15px;
    padding: 2px 7px
}

.tv-button--size_xsmall.tv-button--danger_ghost,
.tv-button--size_xsmall.tv-button--default,
.tv-button--size_xsmall.tv-button--default_ghost,
.tv-button--size_xsmall.tv-button--primary_ghost,
.tv-button--size_xsmall.tv-button--secondary_ghost,
.tv-button--size_xsmall.tv-button--state,
.tv-button--size_xsmall.tv-button--success_ghost,
.tv-button--size_xsmall.tv-button--warning_ghost {
    padding: 1px 6px
}

.tv-button--size_xsmall+.tv-button--size_xsmall {
    margin-inline-start: 10px
}

.tv-button--size_small {
    font-size: 13px;
    line-height: 25px;
    padding: 1px 12px
}

.tv-button--size_small.tv-button--danger_ghost,
.tv-button--size_small.tv-button--default,
.tv-button--size_small.tv-button--default_ghost,
.tv-button--size_small.tv-button--primary_ghost,
.tv-button--size_small.tv-button--secondary_ghost,
.tv-button--size_small.tv-button--state,
.tv-button--size_small.tv-button--success_ghost,
.tv-button--size_small.tv-button--warning_ghost {
    padding: 0 11px
}

.tv-button--size_small+.tv-button--size_small {
    margin-inline-start: 10px
}

.tv-button--size_large {
    font-size: 17px;
    line-height: 44px;
    padding: 1px 30px
}

.tv-button--size_large.tv-button--danger_ghost,
.tv-button--size_large.tv-button--default,
.tv-button--size_large.tv-button--default_ghost,
.tv-button--size_large.tv-button--primary_ghost,
.tv-button--size_large.tv-button--secondary_ghost,
.tv-button--size_large.tv-button--state,
.tv-button--size_large.tv-button--success_ghost,
.tv-button--size_large.tv-button--warning_ghost {
    padding: 0 29px
}

.tv-button--size_promo {
    border-radius: 120px;
    font-size: 24px;
    line-height: 54px;
    padding: 1px 40px
}

.tv-button--size_promo.tv-button--danger_ghost,
.tv-button--size_promo.tv-button--default,
.tv-button--size_promo.tv-button--default_ghost,
.tv-button--size_promo.tv-button--primary_ghost,
.tv-button--size_promo.tv-button--secondary_ghost,
.tv-button--size_promo.tv-button--state,
.tv-button--size_promo.tv-button--success_ghost,
.tv-button--size_promo.tv-button--warning_ghost {
    padding: 0 39px
}

.tv-button--no-padding {
    padding: 1px
}

.tv-button--no-padding.tv-button--danger_ghost,
.tv-button--no-padding.tv-button--default,
.tv-button--no-padding.tv-button--default_ghost,
.tv-button--no-padding.tv-button--primary_ghost,
.tv-button--no-padding.tv-button--secondary_ghost,
.tv-button--no-padding.tv-button--state,
.tv-button--no-padding.tv-button--success_ghost,
.tv-button--no-padding.tv-button--warning_ghost {
    padding: 0
}

.tv-button--state {
    background: var(--color-static-transparent);
    border-style: solid;
    border-width: 1px;
    text-align: center
}

.tv-button--state:after {
    content: "";
    display: inline-block
}

.tv-button--state__checked,
.tv-button--state__uncheck-hint,
.tv-button--state__unchecked {
    display: block;
    height: 0;
    transition: opacity .2625s ease, transform .2625s ease
}

.tv-button--state__ellipsis-text {
    display: block;
    overflow-x: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

@media (any-hover:hover) {
    .tv-button--state.i-checked:hover .tv-button--state__checked,
    .tv-button--state.i-checked:hover .tv-button--state__uncheck-hint,
    .tv-button--state.i-checked:hover .tv-button--state__unchecked {
        will-change: opacity, transform
    }
}

.tv-button--state.i-checked .tv-button--state__unchecked,
.tv-button--state__checked,
.tv-button--state__uncheck-hint {
    opacity: 0
}

@media (any-hover:hover) {
    .tv-button--state.i-checked:hover .tv-button--state__checked {
        opacity: 0
    }
}

.tv-button--state.i-checked .tv-button--state__checked,
.tv-button--state__unchecked {
    opacity: 1
}

@media (any-hover:hover) {
    .tv-button--state.i-checked:hover .tv-button--state__uncheck-hint {
        opacity: 1
    }
    .tv-button--state.i-checked:hover .tv-button--state__checked {
        transform: translateY(-5px)
    }
}

.tv-button--state.i-checked .tv-button--state__unchecked,
.tv-button--state__checked,
.tv-button--state__uncheck-hint {
    transform: translateY(5px)
}

.tv-button--state.i-checked .tv-button--state__checked {
    transform: translateY(0)
}

@media (any-hover:hover) {
    .tv-button--state.i-checked:hover .tv-button--state__uncheck-hint {
        transform: translateY(0)
    }
}

.tv-button--state.tv-button--success {
    background-color: var(--color-static-transparent);
    color: var(--color-success)
}

.tv-button--state.tv-button--success.i-checked {
    background-color: var(--color-success);
    color: var(--_2-y2ZX)
}

@media (any-hover:hover) {
    .tv-button--state.tv-button--success:hover {
        background-color: var(--color-success-hover);
        color: var(--_2-y2ZX)
    }
}

.tv-button--state.tv-button--success:active {
    background-color: var(--color-success-active);
    color: var(--_2-y2ZX)
}

.tv-button--state.tv-button--danger {
    background-color: var(--color-static-transparent);
    color: var(--_3-y2ZX)
}

.tv-button--state.tv-button--danger.i-checked {
    background-color: var(--color-ripe-red-400);
    color: #fff
}

@media (any-hover:hover) {
    .tv-button--state.tv-button--danger:hover {
        background-color: var(--color-ripe-red-400);
        color: #fff
    }
}

.tv-button--state.tv-button--danger:active {
    background-color: var(--color-ripe-red-500);
    color: #fff
}

.tv-button--state.tv-button--primary {
    background-color: var(--color-static-transparent);
    color: var(--_10-y2ZX)
}

.tv-button--state.tv-button--primary.i-checked {
    background-color: var(--_8-y2ZX);
    color: var(--_11-y2ZX)
}

@media (any-hover:hover) {
    .tv-button--state.tv-button--primary:hover {
        background-color: var(--_7-y2ZX);
        color: var(--_11-y2ZX)
    }
}

.tv-button--state.tv-button--primary:active {
    background-color: var(--_8-y2ZX);
    color: var(--_11-y2ZX)
}

.tv-button--state.tv-button--primary_ghost-hover.i-checked {
    background-color: var(--color-static-transparent);
    color: var(--color-brand)
}

@media (any-hover:hover) {
    .tv-button--state.tv-button--primary_ghost-hover:hover {
        background-color: var(--color-brand-hover);
        color: var(--_2-y2ZX)
    }
}

.tv-button--state.tv-button--primary_ghost-hover:active {
    background-color: var(--color-brand-active);
    color: var(--_2-y2ZX)
}

.tv-button--state.tv-button--secondary {
    background-color: initial;
    color: var(--color-cold-gray-500)
}

.tv-button--state.tv-button--secondary.i-checked {
    background-color: var(--color-cold-gray-100);
    color: var(--color-cold-gray-500)
}

@media (any-hover:hover) {
    .tv-button--state.tv-button--secondary:hover {
        background-color: #e1e7f5;
        color: var(--color-cold-gray-500)
    }
}

.tv-button--state.tv-button--secondary:active {
    background-color: #d1dbf0;
    color: var(--color-cold-gray-500)
}

.tv-button--state.tv-button--warning {
    background-color: initial;
    color: var(--color-tan-orange-500)
}

.tv-button--state.tv-button--warning.i-checked {
    background-color: var(--color-tan-orange-500);
    color: #fff
}

@media (any-hover:hover) {
    .tv-button--state.tv-button--warning:hover {
        background-color: var(--color-tan-orange-a400);
        color: #fff
    }
}

.tv-button--state.tv-button--warning:active {
    background-color: var(--color-tan-orange-a600);
    color: #fff
}

.tv-button--state.tv-button--icon-with-text svg {
    margin-inline-end: 6px;
    margin-bottom: -8px;
    vertical-align: unset
}

.tv-button--icon {
    align-items: center;
    display: inline-flex;
    height: 34px;
    justify-content: center;
    min-width: auto;
    padding: 0 !important;
    width: 34px
}

.tv-button--icon.tv-button--size_xsmall {
    height: 19px;
    width: 19px
}

.tv-button--icon.tv-button--size_small {
    height: 27px;
    width: 27px
}

.tv-button--icon.tv-button--size_large {
    height: 46px;
    width: 46px
}

.tv-button__icon {
    display: flex;
    margin-inline-end: 7px
}

.tv-button--loader .tv-button__text {
    transition: opacity 175ms ease, transform 175ms ease
}

.tv-button--loader.i-start-load .tv-button__text {
    opacity: 0;
    transform: translateY(-5px)
}

.tv-button--loader.i-loading .tv-button__text {
    opacity: 0;
    transform: translateY(5px)
}

.tv-button--loader.i-stop-load .tv-button__text {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 175ms
}

.tv-button__loader {
    bottom: 0;
    font-size: 0;
    height: 100%;
    inset-inline-end: 0;
    inset-inline-start: 0;
    margin: 0 auto;
    opacity: 0;
    position: absolute;
    text-align: center;
    top: 0;
    transition: opacity .35s ease
}

.tv-button__loader:after {
    content: "";
    display: inline-block;
    height: 100%;
    vertical-align: middle
}

.tv-button--loader.i-loading .tv-button__loader,
.tv-button--loader.i-start-load .tv-button__loader {
    opacity: 1
}

.tv-button--loader.i-stop-load .tv-button__loader {
    opacity: 0
}

.tv-button__loader-item {
    background-color: var(--_12-y2ZX);
    border-radius: 100%;
    display: inline-block;
    height: 10px;
    margin-inline-end: 2px;
    margin-inline-start: 2px;
    opacity: 0;
    transform: translateY(12px) scale(.6);
    transition: transform .35s cubic-bezier(.68, -.55, .265, 1.55), opacity .35s ease;
    vertical-align: middle;
    width: 10px
}

.tv-button__loader-item:nth-child(2) {
    transition-delay: .11666667s
}

.tv-button__loader-item:nth-child(3) {
    transition-delay: 233.33333ms
}

.tv-button--default .tv-button__loader-item {
    background-color: var(--color-cold-gray-500)
}

.tv-button--loader.i-loading .tv-button__loader-item,
.tv-button--loader.i-start-load .tv-button__loader-item {
    opacity: 1
}

.tv-button--loader.i-stop-load .tv-button__loader-item {
    opacity: 0
}

.tv-button--loader.i-loading .tv-button__loader-item,
.tv-button--loader.i-start-load .tv-button__loader-item,
.tv-button--loader.i-stop-load .tv-button__loader-item {
    transform: translateY(0) scale(.6)
}

.tv-button--loader.i-loading .tv-button__loader-item,
.tv-button--loader.i-stop-load .tv-button__loader-item {
    animation: tv-button-loader-YjdHKsBM .96s ease-in-out infinite both
}

.tv-button--loader.i-loading .tv-button__loader-item:nth-child(2),
.tv-button--loader.i-stop-load .tv-button__loader-item:nth-child(2) {
    animation-delay: .151s
}

.tv-button--loader.i-loading .tv-button__loader-item:nth-child(3),
.tv-button--loader.i-stop-load .tv-button__loader-item:nth-child(3) {
    animation-delay: .32s
}

.tv-button--no-border-radius {
    border-radius: 0
}

.tv-button--no-border {
    border: none
}

.tv-button--connect {
    border-radius: 0
}

.tv-button--connect_left {
    border-end-start-radius: 0;
    border-start-start-radius: 0
}

.tv-button--connect_right {
    border-end-end-radius: 0;
    border-start-end-radius: 0
}

.tv-button--with-icon {
    align-items: center;
    display: inline-flex;
    transform: translate(0)
}

@keyframes tv-button-loader-YjdHKsBM {
    0%,
    to {
        transform: scale(.6)
    }
    50% {
        transform: scale(.9)
    }
}