:root,
[data-bs-theme=light] {

    /* --------------------------------------------------------
       CORE COLORS (HSL & Emphasis sets)
       -------------------------------------------------------- */

    --bs-blue: hsla(216, 98%, 52%, 1);
    --bs-blue-subtle: hsla(216, 98%, 82%, 1);
    --bs-blue-emphasis: hsla(216, 98%, 40%, 1);

    --bs-indigo: hsla(263, 90%, 51%, 1);
    --bs-indigo-subtle: hsla(263, 90%, 81%, 1);
    --bs-indigo-emphasis: hsla(263, 90%, 40%, 1);

    --bs-purple: hsla(261, 51%, 51%, 1);
    --bs-purple-subtle: hsla(261, 51%, 91%, 1);
    --bs-purple-emphasis: hsla(261, 51%, 31%, 1);

    --bs-pink: hsla(312, 33%, 94%, 1);
    --bs-pink-subtle: hsla(330, 67%, 82%, 1);
    --bs-pink-emphasis: hsla(330, 67%, 32%, 1);

    --bs-red: hsla(354, 70%, 54%, 1);
    --bs-red-subtle: hsla(354, 70%, 84%, 1);
    --bs-red-emphasis: hsla(354, 70%, 34%, 1);

    --bs-orange: hsla(27, 98%, 54%, 1);
    --bs-orange-subtle: hsla(27, 98%, 84%, 1);
    --bs-orange-emphasis: hsla(27, 98%, 34%, 1);

    --bs-yellow: hsla(45, 100%, 51%, 1);
    --bs-yellow-subtle: hsla(45, 100%, 81%, 1);
    --bs-yellow-emphasis: hsla(45, 100%, 31%, 1);

    --bs-green: hsla(152, 69%, 31%, 1);
    --bs-green-subtle: hsla(152, 69%, 61%, 1);
    --bs-green-emphasis: hsla(152, 69%, 21%, 1);

    --bs-teal: hsla(162, 73%, 46%, 1);
    --bs-teal-subtle: hsla(162, 73%, 76%, 1);
    --bs-teal-emphasis: hsla(162, 73%, 26%, 1);

    --bs-cyan: hsla(190, 90%, 50%, 1);
    --bs-cyan-subtle: hsla(190, 90%, 80%, 1);
    --bs-cyan-emphasis: hsla(190, 90%, 30%, 1);

    /* --------------------------------------------------------
       NEUTRALS (Black / White / Gray palette)
       -------------------------------------------------------- */

    --bs-black: hsla(0, 0%, 0%, 1);
    --bs-black-subtle: hsla(0, 0%, 20%, 1);
    --bs-black-emphasis: hsla(0, 0%, 10%, 1);

    --bs-white: hsla(0, 0%, 100%, 1);
    --bs-white-subtle: hsla(0, 0%, 90%, 1);
    --bs-white-emphasis: hsla(0, 0%, 80%, 1);

    --bs-gray: #a2a6cd !important;
    --bs-gray-dark: #343a40 !important;
    --bs-gray-100: #f8f9fa !important;
    --bs-gray-200: #e9ecef !important;
    --bs-gray-300: #dee2e6 !important;
    --bs-gray-400: #ced4da !important;
    --bs-gray-500: #adb5bd !important;
    --bs-gray-600: #6c757d !important;
    --bs-gray-700: #495057 !important;
    --bs-gray-800: #343a40 !important;
    --bs-gray-900: #212529 !important;

    /* --------------------------------------------------------
       BRAND COLORS (Primary, Secondary, etc.)
       -------------------------------------------------------- */

    --bs-primary: #00543d !important;
    --bs-secondary: #55298a !important;
    --bs-success: #198754 !important;
    --bs-warning: #ffc107 !important;
    --bs-danger: #dc3545 !important;
    --bs-error: #ff2400 !important;

    --bs-primary-rgb: 0, 84, 61 !important;
    --bs-secondary-rgb: 85, 41, 138 !important;
    --bs-success-rgb: 25, 135, 84 !important;
    --bs-warning-rgb: 255, 193, 7 !important;
    --bs-danger-rgb: 220, 53, 69 !important;
    --bs-error-rgb: 255, 36, 0 !important;
    
    /* --------------------------------------------------------
       CONTAINER / SURFACE COLORS
       -------------------------------------------------------- */

    --bs-container-primary: #e3efe3 !important;
    --bs-light-primary: #e3efe3 !important;
    --bs-container-secondary: #f5ebf3 !important;

    --bs-tertiary: #1e1e1e !important;
    --bs-container-tertiary: #f5f5eb !important;

    --bs-light-grey: #f5f5f5 !important;

    --bs-container-primary-rgb: 227, 239, 227 !important;
    --bs-light-primary-rgb: 227, 239, 227 !important;
    --bs-container-secondary-rgb: 245, 235, 243 !important;
    --bs-tertiary-rgb: 30, 30, 30 !important;
    --bs-container-tertiary-rgb: 245, 245, 235 !important;
    --bs-light-grey-rgb: 245, 245, 245 !important;

    /* --------------------------------------------------------
       TYPOGRAPHY
       -------------------------------------------------------- */

    --bs-primary-text-emphasis: #052c65 !important;
    --bs-secondary-text-emphasis: #2b2f32 !important;
    --bs-success-text-emphasis: #0a3622 !important;
    --bs-info-text-emphasis: #055160 !important;
    --bs-warning-text-emphasis: #664d03 !important;
    --bs-danger-text-emphasis: #58151c !important;
    --bs-light-text-emphasis: #495057 !important;
    --bs-dark-text-emphasis: #495057 !important;

    

    --bs-white-rgb: 255, 255, 255 !important;
    --bs-black-rgb: 0, 0, 0 !important;
    --bs-font-sans-serif: "Oxygen", sans-serif !important;
    --bs-font-monospace: "Oxygen", sans-serif !important;
    --bs-gradient: linear-gradient(180deg, hsla(0, 0%, 100%, .15), hsla(0, 0%, 100%, 0)) !important;

    /* Body colors */
 
    --bs-body-font-family: var(--bs-font-sans-serif) !important;
    --bs-body-font-size: 1rem !important;
    --bs-body-font-weight: 400 !important;
    --bs-body-line-height: 1.5 !important;
    --bs-body-color: #212529 !important;
    --bs-body-color-rgb: 33, 37, 41 !important;
    --bs-body-bg: #fff !important;
    --bs-body-bg-rgb: 255, 255, 255 !important;

    /* Emphasis */

    --bs-emphasis-color: #000 !important;
    --bs-emphasis-color-rgb: 0, 0, 0 !important;
    --bs-secondary-color: rgba(33, 37, 41, .75) !important;
    --bs-secondary-color-rgb: 33, 37, 41 !important;
    --bs-secondary-bg: #e9ecef !important;
    --bs-secondary-bg-rgb: 233, 236, 239 !important;
    --bs-tertiary-color: rgba(33, 37, 41, .5) !important;
    --bs-tertiary-color-rgb: 33, 37, 41 !important;
    --bs-tertiary-bg: #f8f9fa !important;
    --bs-tertiary-bg-rgb: 248, 249, 250 !important;
    --bs-heading-color: inherit !important;

    /* --------------------------------------------------------
       LINK COLORS
       -------------------------------------------------------- */

    --bs-link-color: #00543d !important;
    --bs-link-color-rgb: 0, 84, 61 !important;
    --bs-link-decoration: underline !important;
    --bs-link-hover-color: #004331 !important;
    --bs-link-hover-color-rgb: 0, 67, 49 !important;
    --bs-code-color: #d63384 !important;

    /* --------------------------------------------------------
       HIGHLIGHTING & FEEDBACK
       -------------------------------------------------------- */

    --bs-highlight-color: #212529 !important;
    --bs-highlight-bg: #fff3cd !important;

    --bs-form-valid-color: #198754 !important;
    --bs-form-valid-border-color: #198754 !important;

    --bs-form-invalid-color: #dc3545 !important;
    --bs-form-invalid-border-color: #dc3545

    /* --------------------------------------------------------
       BORDER & SHADOW SYSTEM
       -------------------------------------------------------- */

    --bs-border-width: 1px !important;
    --bs-border-style: solid !important;
    --bs-border-color: #dee2e6 !important;
    --bs-border-color-translucent: rgba(0, 0, 0, .175) !important;
    --bs-border-radius: 0.375rem !important;
    --bs-border-radius-sm: 0.25rem !important;
    --bs-border-radius-lg: 0.5rem !important;
    --bs-border-radius-xl: 1rem !important;
    --bs-border-radius-xxl: 2rem !important;
    --bs-border-radius-2xl: var(--bs-border-radius-xxl) !important;
    --bs-border-radius-pill: 50rem !important;  

    /* Shadows */

    --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, .15) !important;
    --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, .075) !important;
    --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, .175) !important;
    --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, .075) !important;

    /* --------------------------------------------------------
       FOCUS RING
       -------------------------------------------------------- */

    --bs-focus-ring-width: 0.25rem !important;
    --bs-focus-ring-opacity: 0.25 !important;
    --bs-focus-ring-color: rgba(13, 110, 253, .25) !important;

    /* --------------------------------------------------------
       SUBTLE BACKGROUNDS
       -------------------------------------------------------- */

    --bs-primary-bg-subtle: #e3efe3 !important;
    --bs-secondary-bg-subtle: #e2e3e5 !important;
    --bs-success-bg-subtle: #d1e7dd !important;
    --bs-info-bg-subtle: #cff4fc !important;
    --bs-warning-bg-subtle: #fff3cd !important;
    --bs-danger-bg-subtle: #f8d7da !important;
    --bs-light-bg-subtle: #fcfcfd !important;
    --bs-dark-bg-subtle: #ced4da !important;

    /* Subtle borders */

    --bs-primary-border-subtle: #9ec5fe !important;
    --bs-secondary-border-subtle: #c4c8cb !important;
    --bs-success-border-subtle: #a3cfbb !important;
    --bs-info-border-subtle: #9eeaf9 !important;
    --bs-warning-border-subtle: #ffe69c !important;
    --bs-danger-border-subtle: #f1aeb5 !important;
    --bs-light-border-subtle: #e9ecef !important;
    --bs-dark-border-subtle: #adb5bd !important;


}

[data-bs-theme=dark] {
    /* Core */
    --bs-body-bg: #121212 !important;
    --bs-body-bg-rgb: 18, 18, 18 !important;
    --bs-body-color: #e6e6e6 !important;
    --bs-body-color-rgb: 230, 230, 230 !important;

    --bs-emphasis-color: #fff !important;
    --bs-emphasis-color-rgb: 255, 255, 255 !important;

    --bs-secondary-color: rgba(230, 230, 230, .75) !important;
    --bs-secondary-bg: #2b2b2b !important;

    --bs-tertiary-color: rgba(230, 230, 230, .5) !important;
    --bs-tertiary-bg: #1d1d1d !important;

    /* Neutrals */
    --bs-black: #fff !important;
    --bs-black-subtle: #ccc !important;
    --bs-black-emphasis: #e6e6e6 !important;

    --bs-white: #000 !important;
    --bs-white-subtle: #111 !important;
    --bs-white-emphasis: #222 !important;

    --bs-gray-100: #2e2e2e !important;
    --bs-gray-200: #3a3a3a !important;
    --bs-gray-300: #444 !important;
    --bs-gray-400: #555 !important;
    --bs-gray-500: #777 !important;
    --bs-gray-600: #999 !important;
    --bs-gray-700: #bbb !important;
    --bs-gray-800: #ddd !important;
    --bs-gray-900: #f1f1f1 !important;

    /* Brand Colors — slightly brightened for dark mode contrast */
    --bs-primary: #3ad0a7 !important;
    --bs-secondary: #a97be4 !important;
    --bs-success: #49d07e !important;
    --bs-warning: #ffd85e !important;
    --bs-danger: #ff6f7e !important;

    --bs-primary-rgb: 58, 208, 167 !important;
    --bs-secondary-rgb: 169, 123, 228 !important;
    --bs-success-rgb: 73, 208, 126 !important;
    --bs-warning-rgb: 255, 216, 94 !important;
    --bs-danger-rgb: 255, 111, 126 !important;

    /* Containers */
    --bs-container-primary: #1e2a26 !important;
    --bs-container-secondary: #2d2634 !important;
    --bs-container-tertiary: #232323 !important;

    /* Subtle backgrounds tuned darker */
    --bs-primary-bg-subtle: #0f2922 !important;
    --bs-secondary-bg-subtle: #261b34 !important;
    --bs-success-bg-subtle: #0f2c1f !important;
    --bs-warning-bg-subtle: #433514 !important;
    --bs-danger-bg-subtle: #3b1a1f !important;

    /* Text Emphasis */
    --bs-primary-text-emphasis: #baffec !important;
    --bs-secondary-text-emphasis: #e1c6ff !important;
    --bs-success-text-emphasis: #b6ffd1 !important;
    --bs-warning-text-emphasis: #ffeea6 !important;
    --bs-danger-text-emphasis: #ffccd4 !important;

    /* Borders */
    --bs-border-color: rgba(255,255,255,.25) !important;
    --bs-border-color-translucent: rgba(255,255,255,.15) !important;

    /* Shadows (lightened for dark mode) */
    --bs-box-shadow: 0 0.5rem 1rem rgba(0,0,0,.5) !important;
    --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0,0,0,.4) !important;
    --bs-box-shadow-lg: 0 1rem 3rem rgba(0,0,0,.6) !important;

    /* Focus Rings */
    --bs-focus-ring-color: rgba(255,255,255,.35) !important;

    /* Links */
    --bs-link-color: #42e2bd !important;
    --bs-link-hover-color: #2bbf9e !important;
    --bs-link-color-rgb: 66, 226, 189 !important;
    --bs-link-hover-color-rgb: 43, 191, 158 !important;
}

    /* Buttons */





.bg-primary-subtle {
    background-color: var(--bs-primary-bg-subtle)
}

.is-style-info {
    background-color: #d6efee;
    color: #094264;
    border-radius: 4px;
    box-sizing: border-box;
    padding: 32px;
}

.is-style-success {
    background-color: #d0eac4;
    color: #154a28;
    border-radius: 4px;
    box-sizing: border-box;
    padding: 32px;
}

.is-style-warning {
    background-color: #fbe7dd;
    color: #8a4b30;
    border-radius: 4px;
    box-sizing: border-box;
    padding: 32px;
}

.is-style-error {
    background-color: #ffdede;
    color: #8b343c;
    border-radius: 4px;
    box-sizing: border-box;
    padding: 32px;
}

.is-style-pink {
    background-color: #f5ebf3 !important;
    color: #55298a !important;
    border-radius: 4px;
    box-sizing: border-box;
    padding: 32px;
}

/* TEXT CLASSES */
.text-pink { color: var(--bs-pink) }

.text-a4a5a6 { color: #a4a5a6; }
.text-4f156a { color: #4f156a; }
.text-55298a { color: #55298a; }
.text-00543d { color: #00543d; }
.text-e3eFe3 { color: #e3eFe3; }
.text-f5ebf3 { color: #f5ebf3; }
.text-f5f5eb { color: #f5f5eb; }
.text-f5f5f5 { color: #f5f5f5; }

.text-indigo { color: var(--bs-indigo); }
.text-indigo-subtle { color: var(--bs-indigo-subtle); }
.text-indigo-emphasis { color: var(--bs-indigo-emphasis); }

.text-purple { color: var(--bs-purple); }
.text-purple-subtle { color: var(--bs-purple-subtle); }
.text-purple-emphasis { color: var(--bs-purple-emphasis); }

.text-pink { color: var(--bs-pink); }
.text-pink-subtle { color: var(--bs-pink-subtle); }
.text-pink-emphasis { color: var(--bs-pink-emphasis); }

.text-red { color: var(--bs-red); }
.text-red-subtle { color: var(--bs-red-subtle); }
.text-red-emphasis { color: var(--bs-red-emphasis); }

.text-orange { color: var(--bs-orange); }
.text-orange-subtle { color: var(--bs-orange-subtle); }
.text-orange-emphasis { color: var(--bs-orange-emphasis); }

.text-yellow { color: var(--bs-yellow); }
.text-yellow-subtle { color: var(--bs-yellow-subtle); }
.text-yellow-emphasis { color: var(--bs-yellow-emphasis); }

.text-green { color: var(--bs-green); }
.text-green-subtle { color: var(--bs-green-subtle); }
.text-green-emphasis { color: var(--bs-green-emphasis); }

.text-teal { color: var(--bs-teal); }
.text-teal-subtle { color: var(--bs-teal-subtle); }
.text-teal-emphasis { color: var(--bs-teal-emphasis); }

.text-cyan { color: var(--bs-cyan); }
.text-cyan-subtle { color: var(--bs-cyan-subtle); }
.text-cyan-emphasis { color: var(--bs-cyan-emphasis); }

.text-black { color: var(--bs-black); }
.text-black-subtle { color: var(--bs-black-subtle); }
.text-black-emphasis { color: var(--bs-black-emphasis); }

.text-white { color: var(--bs-white); }
.text-white-subtle { color: var(--bs-white-subtle); }
.text-white-emphasis { color: var(--bs-white-emphasis); }

.text-gray { color: var(--bs-gray); }
.text-gray-subtle { color: var(--bs-gray-subtle); }
.text-gray-emphasis { color: var(--bs-gray-emphasis); }

.text-gray-dark { color: var(--bs-gray-dark); }
.text-gray-dark-subtle { color: var(--bs-gray-dark-subtle); }
.text-gray-dark-emphasis { color: var(--bs-gray-dark-emphasis); }

.text-primary { color: var(--bs-primary); }
.text-primary-subtle { color: var(--bs-primary-subtle); }
.text-primary-emphasis { color: var(--bs-primary-emphasis); }

.text-light-primary { color: var(--bs-light-primary); }
.text-light-primary-subtle { color: var(--bs-light-primary-subtle); }
.text-light-primary-emphasis { color: var(--bs-light-primary-emphasis); }

.text-secondary { color: var(--bs-secondary); }
.text-secondary-subtle { color: var(--bs-secondary-subtle); }
.text-secondary-emphasis { color: var(--bs-secondary-emphasis); }

.text-tertiary { color: var(--bs-tertiary); }
.text-tertiary-subtle { color: var(--bs-tertiary-subtle); }
.text-tertiary-emphasis { color: var(--bs-tertiary-emphasis); }

.text-success { color: var(--bs-success); }
.text-success-subtle { color: var(--bs-success-subtle); }
.text-success-emphasis { color: var(--bs-success-emphasis); }

.text-warning { color: var(--bs-warning); }
.text-warning-subtle { color: var(--bs-warning-subtle); }
.text-warning-emphasis { color: var(--bs-warning-emphasis); }

.text-danger { color: var(--bs-danger); }
.text-danger-subtle { color: var(--bs-danger-subtle); }
.text-danger-emphasis { color: var(--bs-danger-emphasis); }

.text-error { color: var(--bs-error); }
.text-error-subtle { color: var(--bs-error-subtle); }
.text-error-emphasis { color: var(--bs-error-emphasis); }

/* BG CLASSES */

.bg-pink { background-color: var(--bs-pink) }
.bg-ebedee { background-color: #ebedee; }
.bg-4f156a { background-color: #4f156a; }
.bg-55298a { background-color: #55298a; }
.bg-00543d { background-color: #00543d; }
.bg-e3eFe3 { background-color: #e3eFe3; }
.bg-f5ebf3 { background-color: #f5ebf3; }
.bg-f5f5eb { background-color: #f5f5eb; }
.bg-f5f5f5 { background-color: #f5f5f5; }

.bg-indigo { background-color: var(--bs-indigo); }
.bg-indigo-subtle { background-color: var(--bs-indigo-subtle); }
.bg-indigo-emphasis { background-color: var(--bs-indigo-emphasis); }

.bg-purple { background-color: var(--bs-purple); }
.bg-purple-subtle { background-color: var(--bs-purple-subtle); }
.bg-purple-emphasis { background-color: var(--bs-purple-emphasis); }

.bg-pink { background-color: var(--bs-pink); }
.bg-pink-subtle { background-color: var(--bs-pink-subtle); }
.bg-pink-emphasis { background-color: var(--bs-pink-emphasis); }

.bg-red { background-color: var(--bs-red); }
.bg-red-subtle { background-color: var(--bs-red-subtle); }
.bg-red-emphasis { background-color: var(--bs-red-emphasis); }

.bg-orange { background-color: var(--bs-orange); }
.bg-orange-subtle { background-color: var(--bs-orange-subtle); }
.bg-orange-emphasis { background-color: var(--bs-orange-emphasis); }

.bg-yellow { background-color: var(--bs-yellow); }
.bg-yellow-subtle { background-color: var(--bs-yellow-subtle); }
.bg-yellow-emphasis { background-color: var(--bs-yellow-emphasis); }

.bg-green { background-color: var(--bs-green); }
.bg-green-subtle { background-color: var(--bs-green-subtle); }
.bg-green-emphasis { background-color: var(--bs-green-emphasis); }

.bg-teal { background-color: var(--bs-teal); }
.bg-teal-subtle { background-color: var(--bs-teal-subtle); }
.bg-teal-emphasis { background-color: var(--bs-teal-emphasis); }

.bg-cyan { background-color: var(--bs-cyan); }
.bg-cyan-subtle { background-color: var(--bs-cyan-subtle); }
.bg-cyan-emphasis { background-color: var(--bs-cyan-emphasis); }

.bg-black { background-color: var(--bs-black); }
.bg-black-subtle { background-color: var(--bs-black-subtle); }
.bg-black-emphasis { background-color: var(--bs-black-emphasis); }

.bg-white { background-color: var(--bs-white); }
.bg-white-subtle { background-color: var(--bs-white-subtle); }
.bg-white-emphasis { background-color: var(--bs-white-emphasis); }

.bg-opacity-10 {
  --bs-bg-opacity: 0.1;
}

.bg-opacity-25 {
  --bs-bg-opacity: 0.25;
}

.bg-opacity-50 {
  --bs-bg-opacity: 0.5;
}

.bg-opacity-75 {
  --bs-bg-opacity: 0.75;
}

.bg-opacity-100 {
  --bs-bg-opacity: 1;
}


.bg-gray { background-color: var(--bs-gray); }
.bg-gray-subtle { background-color: var(--bs-gray-subtle); }
.bg-gray-emphasis { background-color: var(--bs-gray-emphasis); }

.bg-gray-dark { background-color: var(--bs-gray-dark); }
.bg-gray-dark-subtle { background-color: var(--bs-gray-dark-subtle); }
.bg-gray-dark-emphasis { background-color: var(--bs-gray-dark-emphasis); }




.bg-light {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
}
.bg-primary { background-color: var(--bs-primary); }
.bg-primary-subtle { background-color: var(--bs-primary-subtle); }
.bg-primary-emphasis { background-color: var(--bs-primary-emphasis); }

.bg-light-primary { background-color: var(--bs-light-primary); }
.bg-light-primary-subtle { background-color: var(--bs-light-primary-subtle); }
.bg-light-primary-emphasis { background-color: var(--bs-light-primary-emphasis); }

.bg-secondary { background-color: var(--bs-secondary); }
.bg-secondary-subtle { background-color: var(--bs-secondary-subtle); }
.bg-secondary-emphasis { background-color: var(--bs-secondary-emphasis); }

.bg-tertiary { background-color: var(--bs-tertiary); }
.bg-tertiary-subtle { background-color: var(--bs-tertiary-subtle); }
.bg-tertiary-emphasis { background-color: var(--bs-tertiary-emphasis); }

.bg-success { background-color: var(--bs-success); }
.bg-success-subtle { background-color: var(--bs-success-subtle); }
.bg-success-emphasis { background-color: var(--bs-success-emphasis); }

.bg-warning { background-color: var(--bs-warning); }
.bg-warning-subtle { background-color: var(--bs-warning-subtle); }
.bg-warning-emphasis { background-color: var(--bs-warning-emphasis); }

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

.bg-error { background-color: var(--bs-error); }
.bg-error-subtle { background-color: var(--bs-error-subtle); }
.bg-error-emphasis { background-color: var(--bs-error-emphasis); }



/* TEXT/BG CLASSES */

.text-bg-indigo { background-color: var(--bs-indigo); color: var(--bs-white); }
.text-bg-indigo-subtle { background-color: var(--bs-indigo-subtle); color: var(--bs-indigo-emphasis); }

.text-bg-purple { background-color: var(--bs-purple); color: var(--bs-white); }
.text-bg-purple-subtle { background-color: var(--bs-purple-subtle); color: var(--bs-purple-emphasis); }

.text-bg-pink { background-color: var(--bs-pink); color: var(--bs-white); }
.text-bg-pink-subtle { background-color: var(--bs-pink-subtle); color: var(--bs-pink-emphasis); }

.text-bg-red { background-color: var(--bs-red); color: var(--bs-white); }
.text-bg-red-subtle { background-color: var(--bs-red-subtle); color: var(--bs-red-emphasis); }

.text-bg-orange { background-color: var(--bs-orange); color: var(--bs-white); }
.text-bg-orange-subtle { background-color: var(--bs-orange-subtle); color: var(--bs-orange-emphasis); }

.text-bg-yellow { background-color: var(--bs-yellow); color: var(--bs-white); }
.text-bg-yellow-subtle { background-color: var(--bs-yellow-subtle); color: var(--bs-yellow-emphasis); }

.text-bg-green { background-color: var(--bs-green); color: var(--bs-white); }
.text-bg-green-subtle { background-color: var(--bs-green-subtle); color: var(--bs-green-emphasis); }

.text-bg-teal { background-color: var(--bs-teal); color: var(--bs-white); }
.text-bg-teal-subtle { background-color: var(--bs-teal-subtle); color: var(--bs-teal-emphasis); }

.text-bg-cyan { background-color: var(--bs-cyan); color: var(--bs-white); }
.text-bg-cyan-subtle { background-color: var(--bs-cyan-subtle); color: var(--bs-cyan-emphasis); }

.text-bg-black { background-color: var(--bs-black); color: var(--bs-white); }
.text-bg-black-subtle { background-color: var(--bs-black-subtle); color: var(--bs-black-emphasis); }

.text-bg-white { background-color: var(--bs-white); color: var(--bs-black); }
.text-bg-white-subtle { background-color: var(--bs-white-subtle); color: var(--bs-white-emphasis); }

.text-bg-gray { background-color: var(--bs-gray); color: var(--bs-white); }
.text-bg-gray-subtle { background-color: var(--bs-gray-subtle); color: var(--bs-gray-emphasis); }

.text-bg-gray-dark { background-color: var(--bs-gray-dark); color: var(--bs-white); }
.text-bg-gray-dark-subtle { background-color: var(--bs-gray-dark-subtle); color: var(--bs-gray-dark-emphasis); }

.text-bg-light {
  color: #000 !important;
  background-color: RGBA(var(--bs-light-rgb), var(--bs-bg-opacity, 1)) !important;
}

.text-bg-primary { background-color: var(--bs-primary); color: var(--bs-white); }
.text-bg-primary-subtle { background-color: var(--bs-primary-subtle); color: var(--bs-primary-emphasis); }

.text-bg-light-primary { background-color: var(--bs-light-primary); color: var(--bs-primary); }
.text-bg-light-primary-subtle { background-color: var(--bs-light-primary-subtle); color: var(--bs-light-primary-emphasis); }

.text-bg-secondary { background-color: var(--bs-secondary); color: var(--bs-white); }
.text-bg-secondary-subtle { background-color: var(--bs-secondary-subtle); color: var(--bs-secondary-emphasis); }

.text-bg-tertiary { background-color: var(--bs-tertiary); color: var(--bs-white); }
.text-bg-tertiary-subtle { background-color: var(--bs-tertiary-subtle); color: var(--bs-tertiary-emphasis); }

.text-bg-success { background-color: var(--bs-success); color: var(--bs-white); }
.text-bg-success-subtle { background-color: var(--bs-success-subtle); color: var(--bs-success-emphasis); }

.text-bg-warning { background-color: var(--bs-warning); color: var(--bs-white); }
.text-bg-warning-subtle { background-color: var(--bs-warning-subtle); color: var(--bs-warning-emphasis); }

.text-bg-danger { background-color: var(--bs-danger); color: var(--bs-white); }
.text-bg-danger-subtle { background-color: var(--bs-danger-subtle); color: var(--bs-danger-emphasis); }

.text-bg-error { background-color: var(--bs-error); color: var(--bs-white); }
.text-bg-error-subtle { background-color: var(--bs-error-subtle); color: var(--bs-error-emphasis); }