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

.bg-secondary {
    background: var(--mdb-secondary) !important;
}

.bg-dark {
    background: var(--mdb-dark) !important;
}

.bg-info {
    background: var(--mdb-info) !important;
}

.bg-glass {
    background: hsla(0, 0%, 100%, 0.10);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    /* Force GPU acceleration */
    /* https://graffino.com/til/CjT2jrcLHP-how-to-fix-filter-blur-performance-issue-in-safari */
    transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
}

.bg-glass-dark {
    background: hsla(0, 0%, 0%, 0.25);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    /* Force GPU acceleration */
    /* https://graffino.com/til/CjT2jrcLHP-how-to-fix-filter-blur-performance-issue-in-safari */
    transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
}

.bg-glass-white {
    background: hsla(0, 0%, 100%, 0.75);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    /* Force GPU acceleration */
    /* https://graffino.com/til/CjT2jrcLHP-how-to-fix-filter-blur-performance-issue-in-safari */
    transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
}