
/* text colors */
.text-offside-black { color: var(--offside-black) !important; }
.text-primary-color { color: var(--primary-color); }
.text-base-white { color: var(--base-white); }
.text-base-gray { color: var(--base-gray); }
.text-true-black { color: var(--true-black); }
.text-sof-dark { color: var(--sof-dark); }
.text-secondary-line { color: var(--secondary-line); }
.text-passive-tab { color: var(--passive-tab); }
.text-secondary-menu-passive-gray { color: var(--secondary-menu-passive-gray); }
.text-reading-gray { color: var(--reading-gray); }
.text-on-tap-passive-gray-on-white { color: var(--on-tap-passive-gray-on-white); }
.text-medium-gray { color: var(--medium-gray); }
.text-dark-gray { color: var(--dark-gray); }

/* background colors */
.bg-base-white { background-color: var(--base-white); }
.bg-base-gray { background-color: var(--base-gray); }
.bg-secondary-line { background-color: var(--secondary-line); }
.bg-on-tap-passive-gray-on-white { background-color: var(--on-tap-passive-gray-on-white); }
.bg-passive-tab { background-color: var(--passive-tab); }
.bg-true-black {
    background-color: var(--true-black);
}

/* borders */
.border-bottom-secondary-line { border-bottom: 1px solid var(--secondary-line); }
.border-bottom-base-gray { border-bottom: 1px solid var(--base-gray); }
.border-passive-tab { border : 1px solid var(--passive-tab); }