/*#region button */

button span {
    color: var(--ts-clr-244);
}

/*#region button - btn-24 */

.btn-24-dark {
    background-image: linear-gradient(0deg, var(--ts-clr-24) 20%, var(--ts-clr-34) 80%);
}
    .btn-24-dark::before {
        background-image: linear-gradient(0deg, var(--ts-clr-34) 20%, var(--ts-clr-44) 80%);
    }

.btn-24-light {
    background-image: linear-gradient(0deg, var(--ts-clr-224) 20%, var(--ts-clr-214) 80%);
}
    .btn-24-light::before {
        background-image: linear-gradient(0deg, var(--ts-clr-214) 20%, var(--ts-clr-204) 80%);
    }

/*#endregion */

/*#region */

/*#endregion */

/* -- btn-24 -- */


.btn-orange {
    background-image: linear-gradient(0deg, var(--ts-clr-orange-0) 20%, var(--ts-clr-orange-1) 80%);
}
    .btn-orange::before {
        background-image: linear-gradient(0deg, var(--ts-clr-orange-1) 20%, var(--ts-clr-orange-2) 80%);
    }

.btn-lime {
    background-image: linear-gradient(0deg, var(--ts-clr-lime-0) 20%, var(--ts-clr-lime-1) 80%);
}
    .btn-lime::before {
        background-image: linear-gradient(0deg, var(--ts-clr-lime-1) 20%, var(--ts-clr-lime-2) 80%);
    }

.btn-red {
    background-image: linear-gradient(0deg, var(--ts-clr-red-0) 20%, var(--ts-clr-red-1) 80%);
}
    .btn-red::before {
        background-image: linear-gradient(0deg, var(--ts-clr-red-1) 20%, var(--ts-clr-red-2) 80%);
    }

.btn-blue {
    background-image: linear-gradient(0deg, var(--ts-clr-blue-0) 20%, var(--ts-clr-blue-1) 80%);
}
    .btn-blue::before {
        background-image: linear-gradient(0deg, var(--ts-clr-blue-1) 20%, var(--ts-clr-blue-2) 80%);
    }

/*#endregion */