/* ============================================
   UTILITIES
   ============================================ */

.color-primary   { color: var(--color-primary); }
.color-secondary { color: var(--color-secondary); }
.color-dark      { color: var(--color-dark); }
.color-mid       { color: var(--color-mid); }
.color-light     { color: var(--color-light); }

.bg-primary   { background-color: var(--color-primary); }
.bg-secondary { background-color: var(--color-secondary); }
.bg-dark      { background-color: var(--color-dark); }
.bg-mid       { background-color: var(--color-mid); }
.bg-light     { background-color: var(--color-light); }
.bg-white     { background-color: var(--color-white); }

.font-size-sm  { font-size: var(--font-size-sm); }
.font-size-md  { font-size: var(--font-size-md); }
.font-size-lg  { font-size: var(--font-size-lg); }
.font-size-xl  { font-size: var(--font-size-xl); }
.font-size-2xl { font-size: var(--font-size-2xl); }
.font-size-3xl { font-size: var(--font-size-3xl); }

.font-weight-regular { font-weight: var(--font-weight-regular); }
.font-weight-medium  { font-weight: var(--font-weight-medium); }
.font-weight-bold    { font-weight: var(--font-weight-bold); }
.font-weight-black   { font-weight: var(--font-weight-black); }