.bg-primary {
    background-color: var(--primary-500) !important;
}

.bg-tertiary {
    background-color: var(--primary-100) !important;
}

.bg-stroke {
    background-color: var(--base-stroke) !important;
}

.bg-white {
    background-color: white;
    color: initial;
}

.bg-primary-50 {
    background-color: var(--primary-50) !important;
}

.bg-primary-100 {
    background-color: var(--primary-100) !important;
}

.bg-primary-300 {
    background-color: var(--primary-300) !important;
}


.bg-danger-subtle {
    background-color: var(--danger-200);
}

.text-primary {
    color: var(--primary-500) !important;
}

.text-primary-800 {
    color: var(--primary-800) !important;
}

.text-primary-darker {
    color: var(--primary-700) !important;
}

.text-secondary {
    color: var(--base-grey) !important;
}

.text-accent {
    color: var(--accent-300) !important;
}

.border-primary {
    border-color: var(--primary-500) !important;
}

/* #region MARK: Badge */

.badge-primary {
    background-color: var(--primary-500);
    color: var(--bs-black);
}
.badge-primary-subtle {
    background-color: var(--primary-50);
    color: var(--bs-black);
}
.badge-primary-darker {
    background-color: var(--primary-600);
    color: var(--bs-white);
}

.badge-secondary {
    background-color: var(--primary-200);
    color: var(--bs-black);
}
.badge-secondary-empty {
    background-color: transparent;
    color: var(--bs-black);
    border: var(--primary-200) 1px dashed;
}

.badge-tertiary {
    background-color: var(--primary-100);
    color: var(--bs-black);
}

.badge-danger-subtle {
    background-color: var(--danger-200);
    color: var(--bs-black);
}

/* #endregion Badge */

/* #region MARK: Border */
.border-secondary {
    border-color: var(--primary-200) !important;
}
/* #endregion Border */