
.text-color {
    color: var(--color)
}

.text-color-alt {
    color: var(--sec-color);
}

.text-color-bg {
    color: var(--bg-color);
}
.text-color-bg-alt {
    color: var(--sec-bg-color);
}
.text-color-action {
    color: var(--action-color);
}
.text-color-bg-grad {
    background: var(--bg-color-grad);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; /* Makes the text itself transparent */
}
.text-color-bg-grad-alt {
    background: var(--sec-bg-color-grad);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; /* Makes the text itself transparent */
}

.background-color {
    background-color: var(--color)
}

.background-color-alt {
    background-color: var(--sec-color);
}

.background-color-bg {
    background-color: var(--bg-color);
}
.background-color-bg-alt {
    background-color: var(--sec-bg-color);
}
.background-color-action {
    background-color: var(--action-color);
}
.background-color-bg-grad {
    background: var(--bg-color-grad);
}
.background-color-bg-grad-alt {
    background: var(--sec-bg-color-grad);
}

.bg-color-grad {
    background: var(--bg-color-grad);
    color: var(--color);
}

.background-color-bg-grad-alt {
    background: var(--sec-bg-color-grad);
    color: var(--sec-color);
}

.action-color {
    color: var(--action-color);
}

