
[data-bs-theme] {
    --bc-main-yellow: #FFC700;
    --bc-main-orange: #F9BC72;
    --bc-main-blue: #009EF7;
    --bc-main-purple: #6F77FC;
    --bc-main-green: #50CD89;
    
    --ac-apparel: #2755C9;
    --ac-entertainment: #F14194;
    --ac-business: #7C4AE6;
    --ac-food: #FFC700;
    --ac-finance: #349139;
    --ac-health: #E83631;
    --ac-goods: #CF9866;
    --ac-education: #1ADF74;
    --ac-estate: #B4B4B4;
    --ac-sport: #F5EE2D;
    --ac-travel: #008DC1;
}

[data-bs-theme=light] {
    --bc-fade-yellow: #FFF8DD;
    --bc-fade-orange: #fdefdf;
    --bc-fade-blue: #d3efff;
    --bc-fade-purple: lavender;
    --bc-fade-green: #E8FFF3;
}

[data-bs-theme=dark] {
    --bc-fade-yellow: #392F28;
    --bc-fade-orange: #3d2b16;
    --bc-fade-blue: #1c3443;
    --bc-fade-purple: #2d3061;
    --bc-fade-green: #1e3b2c;
}

.badge-yellow {
    color: var(--bc-main-yellow) !important;
    background-color: var(--bc-fade-yellow) !important;
}

.badge-orange {
    color: var(--bc-main-orange) !important;
    background-color: var(--bc-fade-orange) !important;
}

.badge-blue {
    color: var(--bc-main-blue) !important;
    background-color: var(--bc-fade-blue) !important;
}

.badge-purple {
    color: var(--bc-main-purple) !important;
    background-color: var(--bc-fade-purple) !important;
}

.badge-green {
    color: var(--bc-main-green) !important;
    background-color: var(--bc-fade-green) !important;
}

.bullet-apparel {
    background-color: var(--ac-apparel) !important;
}

.bullet-entertainment {
    background-color: var(--ac-entertainment) !important;
}

.bullet-business {
    background-color: var(--ac-business) !important;
}

.bullet-food {
    background-color: var(--ac-food) !important;
}

.bullet-finance {
    background-color: var(--ac-finance) !important;
}

.bullet-health {
    background-color: var(--ac-health) !important;
}

.bullet-goods {
    background-color: var(--ac-goods) !important;
}

.bullet-education {
    background-color: var(--ac-education) !important;
}

.bullet-estate {
    background-color: var(--ac-estate) !important;
}

.bullet-sport {
    background-color: var(--ac-sport) !important;
}

.bullet-trave {
    background-color: var(--ac-travel) !important;
}