/*
 * =================================================================================================
 * 💖 BUBBLEGUM PUNK THEME (LIGHT) 💖
 *
 * This isn't just a theme. It's a statement.
 * Unapologetically loud, pink, and quirky.
 * =================================================================================================
 */
 :root,
 [data-bs-theme=light] {
   /* --- CORE VIBE --- */
   --bs-pink:    #FF007A;   /* 💖 Hyper Pink (Our Queen) */
   --bs-green:   #CFFF50;   /* 🧪 Toxic Slime */
   --bs-purple:  #A328D6;   /* 👾 Graffiti Purple */
   --bs-yellow:  #F9F871;   /* ⚡ Neon Lemon */
   --bs-cyan:    #00F5D4;   /* 💎 Glitchy Teal */
   --bs-blue:    #00A9E0;   /* 💦 Splash Zone */
 
   /* Let's redefine ALL the core colors to match the new energy */
   --bs-primary:       var(--bs-pink);
   --bs-secondary:     var(--bs-green);
   --bs-success:       var(--bs-cyan);
   --bs-info:          var(--bs-blue);
   --bs-warning:       var(--bs-yellow);
   --bs-danger:        #FF3D3D; /* 🚨 Code Red Rave */
   
   /* --- BACKGROUNDS & TEXT --- */
   /* No more boring white! */
   --bs-body-bg:             #FFF5FD;   /* A soft, dreamy pink canvas */
   --bs-body-color:          #4A003D;   /* Dark Plum (instead of black) for text */
   --bs-heading-color:       var(--bs-purple); /* Make headings POP */
   --bs-secondary-color:     rgba(74, 0, 61, 0.75); /* Plum, but softer */
   --bs-tertiary-color:      rgba(74, 0, 61, 0.5);
   
   /* Make cards and containers pure white to contrast the pink background */
   --bs-tertiary-bg:         #FFFFFF;
   --bs-secondary-bg:        #FEF9FE;
 
   /* --- LINKS & CODE --- */
   --bs-link-color:          var(--bs-pink);
   --bs-link-hover-color:    var(--bs-purple);
   --bs-code-color:          var(--bs-purple);
 
   /* --- BORDERS & SHADOWS: LET'S GET QUIRKY --- */
   --bs-border-width:        2px; /* Chunky borders! */
   --bs-border-color:        #FFD6F5; /* Pink-tinted border color */
   --bs-border-color-translucent: rgba(74, 0, 61, 0.2);
   --bs-border-radius:       1rem;   /* Super bubbly and round */
   --bs-border-radius-sm:    0.5rem;
   --bs-border-radius-lg:    1.5rem;
   --bs-border-radius-pill:  50rem;
 
   /* Say goodbye to black shadows, hello to colored glows! */
   --bs-box-shadow:          0 4px 12px rgba(255, 0, 122, 0.2);
   --bs-box-shadow-sm:       0 2px 4px rgba(255, 0, 122, 0.15);
   --bs-box-shadow-lg:       0 8px 30px rgba(255, 0, 122, 0.25);
   --bs-box-shadow-inset:    inset 0 1px 4px rgba(74, 0, 61, 0.2);
 
   /* --- THE GRADIENT: THE SOUL OF THE THEME --- */
   --bs-gradient: linear-gradient(75deg, var(--bs-primary), var(--bs-secondary));
 
   /* --- Don't forget the RGB values for Bootstrap components! --- */
   --bs-primary-rgb: 255, 0, 122;
   --bs-secondary-rgb: 207, 255, 80;
   --bs-body-color-rgb: 74, 0, 61;
   --bs-body-bg-rgb: 255, 245, 253;
 }
 
 
 /*
  * =================================================================================================
  * 🌙🦇 CYBER GOTH THEME (DARK) 🦇🌙
  *
  * The lights are out, the neon is ON.
  * A dark, moody theme with vibrant, glowing accents.
  * =================================================================================================
  */
 [data-bs-theme=dark] {
   color-scheme: dark;
 
   /* --- BACKGROUNDS & TEXT --- */
   --bs-body-bg:           #1D001A;   /* Deep, dark space purple */
   --bs-body-color:        #FFE9FA;   /* Light pink text for high contrast */
   --bs-heading-color:     var(--bs-cyan); /* Glowing cyan headings */
   
   --bs-tertiary-bg:       #2E0028;   /* A slightly lighter container background */
   --bs-secondary-bg:      #3A0033;
   --bs-secondary-color:   rgba(255, 233, 250, 0.75);
   --bs-tertiary-color:    rgba(255, 233, 250, 0.5);
 
   /* --- LINKS & CODE --- */
   /* Using the Toxic Slime for links gives it that cyber look */
   --bs-link-color:          var(--bs-green);
   --bs-link-hover-color:    var(--bs-cyan);
   --bs-code-color:          var(--bs-pink);
 
   /* --- BORDERS & SHADOWS: NEON GLOWS --- */
   --bs-border-color:        #5C004F;
   --bs-border-color-translucent: rgba(255, 255, 255, 0.15);
   
   /* Redefine shadows to be neon glows */
   --bs-box-shadow:          0 0 15px rgba(var(--bs-primary-rgb), 0.4);
   --bs-box-shadow-lg:       0 0 30px rgba(var(--bs-primary-rgb), 0.5);
   
   /* --- EMPHASIS & SUBTLE BACKGROUNDS --- */
   /* These are for alerts, badges, etc. They'll be dark with glowing text. */
   --bs-primary-text-emphasis:   #FF8AD1;
   --bs-secondary-text-emphasis: #E2FF8A;
   --bs-success-text-emphasis:   #8AFFEB;
   --bs-info-text-emphasis:      #7ADCF5;
   --bs-warning-text-emphasis:   #FAF8A8;
   --bs-danger-text-emphasis:    #FF8A8A;
   
   --bs-primary-bg-subtle:   #3D002B;
   --bs-secondary-bg-subtle: #415215;
   --bs-success-bg-subtle:   #00332B;
   --bs-info-bg-subtle:      #00313D;
   --bs-warning-bg-subtle:   #3E3D1C;
   --bs-danger-bg-subtle:    #520E0E;
 }