/* ==========================================================================
   THEME-AWARE COLOR VARIABLES
   --------------------------------------------------------------------------
   Each extended palette color gets a CSS custom property used by the
   .text-* and .border-* utilities below. Solid fills (.bg-*, .text-bg-*,
   .btn-*, .btn-outline-*) intentionally stay constant across themes since
   they already pair with explicit white/black text and don't lose contrast
   when the surrounding page switches theme.

   Only .text-* and .border-* need a lighter, more saturated variant in dark
   mode to remain legible against a dark surface (e.g. Bootstrap's default
   dark surface ~#212529).
   ========================================================================== */

[data-bs-theme=light] {
    --clr-coral-text: #D9480F;
    --clr-teal-text: #0D9488;
    --clr-cyan-text: #0EA5C9;
    --clr-indigo-text: #3730A3;
    --clr-violet-text: #7C3AED;
    --clr-lilac-text: #8B5CF6;
    --clr-rose-text: #E11D48;
    --clr-amber-text: #D97706;
    --clr-olive-text: #556B2F;
    --clr-lime-text: #65A30D;
    --clr-mint-text: #10B981;
    --clr-peach-text: #FB923C;
    --clr-purple-text: #800080;
    --clr-sand-text: #A16207;
    --clr-slate-text: #334155;
    --clr-smoke-text: #475569;
    --clr-glass-text: #0F172A;
    --clr-ocean-text: #0369A1;
    --clr-sunset-text: #F97316;
    --clr-marigold-text: #B45309;
    --clr-plum-text: #6D28D9;

    /* subtle backgrounds (very light tint) + subtle borders (light tint) */
    --clr-coral-bg-subtle: #FAE9E2;
    --clr-coral-border-subtle: #F2BFAB;
    --clr-teal-bg-subtle: #E2F2F1;
    --clr-teal-border-subtle: #AADAD5;
    --clr-cyan-bg-subtle: #E2F4F9;
    --clr-cyan-border-subtle: #ABE0EC;
    --clr-indigo-bg-subtle: #E7E6F4;
    --clr-indigo-border-subtle: #B9B7DF;
    --clr-violet-bg-subtle: #EFE7FD;
    --clr-violet-border-subtle: #D1BAF9;
    --clr-lilac-bg-subtle: #F1EBFE;
    --clr-lilac-border-subtle: #D6C6FC;
    --clr-rose-bg-subtle: #FBE4E9;
    --clr-rose-border-subtle: #F5B0BF;
    --clr-amber-bg-subtle: #FAEFE1;
    --clr-amber-border-subtle: #F2CFA8;
    --clr-olive-bg-subtle: #EBEDE6;
    --clr-olive-border-subtle: #C4CBB6;
    --clr-lime-bg-subtle: #EDF4E2;
    --clr-lime-border-subtle: #C9DFAA;
    --clr-mint-bg-subtle: #E2F7F0;
    --clr-mint-border-subtle: #ABE7D3;
    --clr-peach-bg-subtle: #FFF2E8;
    --clr-peach-border-subtle: #FED9BB;
    --clr-purple-bg-subtle: #F0E0F0;
    --clr-purple-border-subtle: #D3A6D3;
    --clr-sand-bg-subtle: #F4ECE1;
    --clr-sand-border-subtle: #DEC8A8;
    --clr-slate-bg-subtle: #E7E8EB;
    --clr-slate-border-subtle: #B8BDC4;
    --clr-smoke-bg-subtle: #E9EBED;
    --clr-smoke-border-subtle: #BFC4CB;
    --clr-glass-bg-subtle: #E2E3E5;
    --clr-glass-border-subtle: #ABAEB4;
    --clr-ocean-bg-subtle: #E1EDF4;
    --clr-ocean-border-subtle: #A7CBDE;
    --clr-sunset-bg-subtle: #FEEEE3;
    --clr-sunset-border-subtle: #FDCEAD;
    --clr-marigold-bg-subtle: #F6EAE1;
    --clr-marigold-border-subtle: #E5C3A9;
    --clr-plum-bg-subtle: #EDE5FA;
    --clr-plum-border-subtle: #CCB4F2;

    /* theme-color family subtle variants */
    --clr-theme-color-bg-subtle: #E0FFF6;
    --clr-theme-color-border-subtle: #A6FFE4;
    --clr-theme-color-light-bg-subtle: #EAFFFA;
    --clr-theme-color-light-border-subtle: #C0FFF2;
    --clr-theme-color-dark-bg-subtle: #E0F3EE;
    --clr-theme-color-dark-border-subtle: #A6DBCD;
    --clr-theme-color-darker-bg-subtle: #E0EEEA;
    --clr-theme-color-darker-border-subtle: #A6CCC2;

    /* new colors — text */
    --clr-ruby-text: #9F1239;
    --clr-fuchsia-text: #A21CAF;
    --clr-cobalt-text: #1D4ED8;
    --clr-jade-text: #047857;
    --clr-gold-text: #92700A;
    --clr-navy-text: #1E3A5F;
    --clr-terracotta-text: #9A4219;
    --clr-bronze-text: #7B3510;
    --clr-berry-text: #6B1237;
    --clr-dusk-text: #5B5382;

    /* new colors — subtle backgrounds & borders */
    --clr-ruby-bg-subtle: #FDE8EE;
    --clr-ruby-border-subtle: #F9B4C4;
    --clr-fuchsia-bg-subtle: #FAE5FD;
    --clr-fuchsia-border-subtle: #EFAAF9;
    --clr-cobalt-bg-subtle: #E8EEFB;
    --clr-cobalt-border-subtle: #AABEF2;
    --clr-jade-bg-subtle: #E5F4EE;
    --clr-jade-border-subtle: #A3D9C2;
    --clr-gold-bg-subtle: #FBF4DC;
    --clr-gold-border-subtle: #EDDA94;
    --clr-navy-bg-subtle: #E7EBF0;
    --clr-navy-border-subtle: #A5B3C5;
    --clr-terracotta-bg-subtle: #FAE9E0;
    --clr-terracotta-border-subtle: #F2C2A3;
    --clr-bronze-bg-subtle: #F6ECE3;
    --clr-bronze-border-subtle: #E5C9A8;
    --clr-berry-bg-subtle: #FAE6EF;
    --clr-berry-border-subtle: #F2AECA;
    --clr-dusk-bg-subtle: #EEECF5;
    --clr-dusk-border-subtle: #C5C0DC;

    /* text-emphasis for all colors */
    --clr-coral-text-emphasis: #7D2909;
    --clr-teal-text-emphasis: #064E3B;
    --clr-cyan-text-emphasis: #0A5A6E;
    --clr-indigo-text-emphasis: #1E1B69;
    --clr-violet-text-emphasis: #3B0764;
    --clr-lilac-text-emphasis: #4C1D95;
    --clr-rose-text-emphasis: #8B0D2C;
    --clr-amber-text-emphasis: #854D0E;
    --clr-olive-text-emphasis: #2F3D17;
    --clr-lime-text-emphasis: #3A5A06;
    --clr-mint-text-emphasis: #064E3B;
    --clr-peach-text-emphasis: #9A3E04;
    --clr-purple-text-emphasis: #4A0072;
    --clr-sand-text-emphasis: #5E3A03;
    --clr-slate-text-emphasis: #1A2433;
    --clr-smoke-text-emphasis: #1F2937;
    --clr-glass-text-emphasis: #030712;
    --clr-ocean-text-emphasis: #0B3F6E;
    --clr-sunset-text-emphasis: #9A3A07;
    --clr-marigold-text-emphasis: #6D3204;
    --clr-plum-text-emphasis: #3B0F86;
    --clr-theme-color-text-emphasis: #006B4B;
    --clr-theme-color-light-text-emphasis: #1A8C6B;
    --clr-theme-color-dark-text-emphasis: #005C42;
    --clr-theme-color-darker-text-emphasis: #003D2E;
    --clr-ruby-text-emphasis: #6B0E27;
    --clr-fuchsia-text-emphasis: #701A7D;
    --clr-cobalt-text-emphasis: #11307A;
    --clr-jade-text-emphasis: #03523C;
    --clr-gold-text-emphasis: #6B5007;
    --clr-navy-text-emphasis: #0F1F37;
    --clr-terracotta-text-emphasis: #6E2D0E;
    --clr-bronze-text-emphasis: #542408;
    --clr-berry-text-emphasis: #4A0C25;
    --clr-dusk-text-emphasis: #3E3A5A;
}

[data-bs-theme=dark] {
    --clr-coral-text: #E8916F;
    --clr-teal-text: #6EBFB8;
    --clr-cyan-text: #6EC9DF;
    --clr-indigo-text: #8783C8;
    --clr-violet-text: #B089F4;
    --clr-lilac-text: #B99DFA;
    --clr-rose-text: #ED7791;
    --clr-amber-text: #E8AD6A;
    --clr-olive-text: #99A682;
    --clr-lime-text: #A3C86E;
    --clr-mint-text: #70D5B3;
    --clr-peach-text: #FDBE8A;
    --clr-purple-text: #B366B3;
    --clr-sand-text: #C7A16A;
    --clr-slate-text: #858D99;
    --clr-smoke-text: #9199A5;
    --clr-glass-text: #6F747F;
    --clr-ocean-text: #68A5C7;
    --clr-sunset-text: #FBAB73;
    --clr-marigold-text: #D2986B;
    --clr-plum-text: #A77EE8;

    /* subtle backgrounds (very dark tint) + subtle borders (mid-dark tint, more visible) */
    --clr-coral-bg-subtle: #270D03;
    --clr-coral-border-subtle: #622007;
    --clr-teal-bg-subtle: #021B18;
    --clr-teal-border-subtle: #06433D;
    --clr-cyan-bg-subtle: #031E24;
    --clr-cyan-border-subtle: #064A5A;
    --clr-indigo-bg-subtle: #0A091D;
    --clr-indigo-border-subtle: #191649;
    --clr-violet-bg-subtle: #160A2B;
    --clr-violet-border-subtle: #381A6B;
    --clr-lilac-bg-subtle: #19112C;
    --clr-lilac-border-subtle: #3F296F;
    --clr-rose-bg-subtle: #29050D;
    --clr-rose-border-subtle: #650D20;
    --clr-amber-bg-subtle: #271501;
    --clr-amber-border-subtle: #623603;
    --clr-olive-bg-subtle: #0F1308;
    --clr-olive-border-subtle: #263015;
    --clr-lime-bg-subtle: #121D02;
    --clr-lime-border-subtle: #2D4906;
    --clr-mint-bg-subtle: #032117;
    --clr-mint-border-subtle: #07533A;
    --clr-peach-bg-subtle: #2D1A0B;
    --clr-peach-border-subtle: #71421B;
    --clr-purple-bg-subtle: #170017;
    --clr-purple-border-subtle: #3A003A;
    --clr-sand-bg-subtle: #1D1201;
    --clr-sand-border-subtle: #482C03;
    --clr-slate-bg-subtle: #090C0F;
    --clr-slate-border-subtle: #171D26;
    --clr-smoke-bg-subtle: #0D0F13;
    --clr-smoke-border-subtle: #20262F;
    --clr-glass-bg-subtle: #030408;
    --clr-glass-border-subtle: #070A13;
    --clr-ocean-bg-subtle: #01131D;
    --clr-ocean-border-subtle: #012F48;
    --clr-sunset-bg-subtle: #2D1504;
    --clr-sunset-border-subtle: #70340A;
    --clr-marigold-bg-subtle: #200F02;
    --clr-marigold-border-subtle: #512504;
    --clr-plum-bg-subtle: #140727;
    --clr-plum-border-subtle: #311262;

    /* new colors — text */
    --clr-ruby-text: #FB7185;
    --clr-fuchsia-text: #E879F9;
    --clr-cobalt-text: #93C5FD;
    --clr-jade-text: #6EE7B7;
    --clr-gold-text: #FCD34D;
    --clr-navy-text: #7EB3D6;
    --clr-terracotta-text: #FCA574;
    --clr-bronze-text: #DDB06A;
    --clr-berry-text: #F9A8D4;
    --clr-dusk-text: #C4BEE0;

    /* new colors — subtle backgrounds & borders */
    --clr-ruby-bg-subtle: #20050C;
    --clr-ruby-border-subtle: #510E26;
    --clr-fuchsia-bg-subtle: #210023;
    --clr-fuchsia-border-subtle: #550058;
    --clr-cobalt-bg-subtle: #06102B;
    --clr-cobalt-border-subtle: #0F276D;
    --clr-jade-bg-subtle: #011612;
    --clr-jade-border-subtle: #034B35;
    --clr-gold-bg-subtle: #221A00;
    --clr-gold-border-subtle: #574202;
    --clr-navy-bg-subtle: #05080D;
    --clr-navy-border-subtle: #0E1B2E;
    --clr-terracotta-bg-subtle: #270C04;
    --clr-terracotta-border-subtle: #612110;
    --clr-bronze-bg-subtle: #1C0901;
    --clr-bronze-border-subtle: #4A2305;
    --clr-berry-bg-subtle: #1A060D;
    --clr-berry-border-subtle: #430F24;
    --clr-dusk-bg-subtle: #0F0E1C;
    --clr-dusk-border-subtle: #2D2A4A;

    /* theme-color family subtle variants */
    --clr-theme-color-bg-subtle: #002E20;
    --clr-theme-color-border-subtle: #007351;
    --clr-theme-color-light-bg-subtle: #0E2E27;
    --clr-theme-color-light-border-subtle: #227362;
    --clr-theme-color-dark-bg-subtle: #001B14;
    --clr-theme-color-dark-border-subtle: #004432;
    --clr-theme-color-darker-bg-subtle: #00140F;
    --clr-theme-color-darker-border-subtle: #003225;


    /* text-emphasis for all colors */
    --clr-coral-text-emphasis: #FDBA74;
    --clr-teal-text-emphasis: #99F6E4;
    --clr-cyan-text-emphasis: #A5F3FC;
    --clr-indigo-text-emphasis: #C7D2FE;
    --clr-violet-text-emphasis: #DDD6FE;
    --clr-lilac-text-emphasis: #EDE9FE;
    --clr-rose-text-emphasis: #FBCFE8;
    --clr-amber-text-emphasis: #FDE68A;
    --clr-olive-text-emphasis: #D9F99D;
    --clr-lime-text-emphasis: #D9F99D;
    --clr-mint-text-emphasis: #A7F3D0;
    --clr-peach-text-emphasis: #FED7AA;
    --clr-purple-text-emphasis: #E9D5E9;
    --clr-sand-text-emphasis: #FEF3C7;
    --clr-slate-text-emphasis: #CBD5E1;
    --clr-smoke-text-emphasis: #D1D5DB;
    --clr-glass-text-emphasis: #E5E7EB;
    --clr-ocean-text-emphasis: #BAE6FD;
    --clr-sunset-text-emphasis: #FED7AA;
    --clr-marigold-text-emphasis: #FDE68A;
    --clr-plum-text-emphasis: #DDD6FE;
    --clr-theme-color-text-emphasis: #7FFFD4;
    --clr-theme-color-light-text-emphasis: #CCFFF4;
    --clr-theme-color-dark-text-emphasis: #4FFFC4;
    --clr-theme-color-darker-text-emphasis: #3DFFB3;
    --clr-ruby-text-emphasis: #FECDD3;
    --clr-fuchsia-text-emphasis: #F5D0FE;
    --clr-cobalt-text-emphasis: #BFDBFE;
    --clr-jade-text-emphasis: #A7F3D0;
    --clr-gold-text-emphasis: #FEF08A;
    --clr-navy-text-emphasis: #BFDBFE;
    --clr-terracotta-text-emphasis: #FED7AA;
    --clr-bronze-text-emphasis: #FDE68A;
    --clr-berry-text-emphasis: #FBCFE8;
    --clr-dusk-text-emphasis: #DDD6FE;
}

/* Fallback for browsers/pages that never set data-bs-theme at all
   (defaults to the light palette so nothing breaks pre-Bootstrap-5.3) */
:root {

    /* solid theme colors */
    --clr-theme-color: #00FFB3;
    --clr-theme-color-light: #4CFFD9;
    --clr-theme-color-dark: #00986F;
    --clr-theme-color-darker: #006E52;

    /* subtle backgrounds + borders (already defined in your file, but add root fallback here too) */
    --clr-theme-color-bg-subtle: #E0FFF6;
    --clr-theme-color-border-subtle: #A6FFE4;
    --clr-theme-color-light-bg-subtle: #EAFFFA;
    --clr-theme-color-light-border-subtle: #C0FFF2;
    --clr-theme-color-dark-bg-subtle: #E0F3EE;
    --clr-theme-color-dark-border-subtle: #A6DBCD;
    --clr-theme-color-darker-bg-subtle: #E0EEEA;
    --clr-theme-color-darker-border-subtle: #A6CCC2;

    /* text emphasis variants */
    --clr-theme-color-text-emphasis: #006B4B;
    --clr-theme-color-light-text-emphasis: #1A8C6B;
    --clr-theme-color-dark-text-emphasis: #005C42;
    --clr-theme-color-darker-text-emphasis: #003D2E;

    --clr-coral-text: #D9480F;
    --clr-teal-text: #0D9488;
    --clr-cyan-text: #0EA5C9;
    --clr-indigo-text: #3730A3;
    --clr-violet-text: #7C3AED;
    --clr-lilac-text: #8B5CF6;
    --clr-rose-text: #E11D48;
    --clr-amber-text: #D97706;
    --clr-olive-text: #556B2F;
    --clr-lime-text: #65A30D;
    --clr-mint-text: #10B981;
    --clr-peach-text: #FB923C;
    --clr-purple-text: #800080;
    --clr-sand-text: #A16207;
    --clr-slate-text: #334155;
    --clr-smoke-text: #475569;
    --clr-glass-text: #0F172A;
    --clr-ocean-text: #0369A1;
    --clr-sunset-text: #F97316;
    --clr-marigold-text: #B45309;
    --clr-plum-text: #6D28D9;

    --clr-coral-bg-subtle: #FAE9E2;
    --clr-coral-border-subtle: #F2BFAB;
    --clr-teal-bg-subtle: #E2F2F1;
    --clr-teal-border-subtle: #AADAD5;
    --clr-cyan-bg-subtle: #E2F4F9;
    --clr-cyan-border-subtle: #ABE0EC;
    --clr-indigo-bg-subtle: #E7E6F4;
    --clr-indigo-border-subtle: #B9B7DF;
    --clr-violet-bg-subtle: #EFE7FD;
    --clr-violet-border-subtle: #D1BAF9;
    --clr-lilac-bg-subtle: #F1EBFE;
    --clr-lilac-border-subtle: #D6C6FC;
    --clr-rose-bg-subtle: #FBE4E9;
    --clr-rose-border-subtle: #F5B0BF;
    --clr-amber-bg-subtle: #FAEFE1;
    --clr-amber-border-subtle: #F2CFA8;
    --clr-olive-bg-subtle: #EBEDE6;
    --clr-olive-border-subtle: #C4CBB6;
    --clr-lime-bg-subtle: #EDF4E2;
    --clr-lime-border-subtle: #C9DFAA;
    --clr-mint-bg-subtle: #E2F7F0;
    --clr-mint-border-subtle: #ABE7D3;
    --clr-peach-bg-subtle: #FFF2E8;
    --clr-peach-border-subtle: #FED9BB;
    --clr-purple-bg-subtle: #F0E0F0;
    --clr-purple-border-subtle: #D3A6D3;
    --clr-sand-bg-subtle: #F4ECE1;
    --clr-sand-border-subtle: #DEC8A8;
    --clr-slate-bg-subtle: #E7E8EB;
    --clr-slate-border-subtle: #B8BDC4;
    --clr-smoke-bg-subtle: #E9EBED;
    --clr-smoke-border-subtle: #BFC4CB;
    --clr-glass-bg-subtle: #E2E3E5;
    --clr-glass-border-subtle: #ABAEB4;
    --clr-ocean-bg-subtle: #E1EDF4;
    --clr-ocean-border-subtle: #A7CBDE;
    --clr-sunset-bg-subtle: #FEEEE3;
    --clr-sunset-border-subtle: #FDCEAD;
    --clr-marigold-bg-subtle: #F6EAE1;
    --clr-marigold-border-subtle: #E5C3A9;
    --clr-plum-bg-subtle: #EDE5FA;
    --clr-plum-border-subtle: #CCB4F2;

    --clr-theme-color-bg-subtle: #E0FFF6;
    --clr-theme-color-border-subtle: #A6FFE4;
    --clr-theme-color-light-bg-subtle: #EAFFFA;
    --clr-theme-color-light-border-subtle: #C0FFF2;
    --clr-theme-color-dark-bg-subtle: #E0F3EE;
    --clr-theme-color-dark-border-subtle: #A6DBCD;
    --clr-theme-color-darker-bg-subtle: #E0EEEA;
    --clr-theme-color-darker-border-subtle: #A6CCC2;

    /* new colors — text */
    --clr-ruby-text: #9F1239;
    --clr-fuchsia-text: #A21CAF;
    --clr-cobalt-text: #1D4ED8;
    --clr-jade-text: #047857;
    --clr-gold-text: #92700A;
    --clr-navy-text: #1E3A5F;
    --clr-terracotta-text: #9A4219;
    --clr-bronze-text: #7B3510;
    --clr-berry-text: #6B1237;
    --clr-dusk-text: #5B5382;

    /* new colors — subtle backgrounds & borders */
    --clr-ruby-bg-subtle: #FDE8EE;
    --clr-ruby-border-subtle: #F9B4C4;
    --clr-fuchsia-bg-subtle: #FAE5FD;
    --clr-fuchsia-border-subtle: #EFAAF9;
    --clr-cobalt-bg-subtle: #E8EEFB;
    --clr-cobalt-border-subtle: #AABEF2;
    --clr-jade-bg-subtle: #E5F4EE;
    --clr-jade-border-subtle: #A3D9C2;
    --clr-gold-bg-subtle: #FBF4DC;
    --clr-gold-border-subtle: #EDDA94;
    --clr-navy-bg-subtle: #E7EBF0;
    --clr-navy-border-subtle: #A5B3C5;
    --clr-terracotta-bg-subtle: #FAE9E0;
    --clr-terracotta-border-subtle: #F2C2A3;
    --clr-bronze-bg-subtle: #F6ECE3;
    --clr-bronze-border-subtle: #E5C9A8;
    --clr-berry-bg-subtle: #FAE6EF;
    --clr-berry-border-subtle: #F2AECA;
    --clr-dusk-bg-subtle: #EEECF5;
    --clr-dusk-border-subtle: #C5C0DC;

    /* text-emphasis for all colors */
    --clr-coral-text-emphasis: #7D2909;
    --clr-teal-text-emphasis: #064E3B;
    --clr-cyan-text-emphasis: #0A5A6E;
    --clr-indigo-text-emphasis: #1E1B69;
    --clr-violet-text-emphasis: #3B0764;
    --clr-lilac-text-emphasis: #4C1D95;
    --clr-rose-text-emphasis: #8B0D2C;
    --clr-amber-text-emphasis: #854D0E;
    --clr-olive-text-emphasis: #2F3D17;
    --clr-lime-text-emphasis: #3A5A06;
    --clr-mint-text-emphasis: #064E3B;
    --clr-peach-text-emphasis: #9A3E04;
    --clr-purple-text-emphasis: #4A0072;
    --clr-sand-text-emphasis: #5E3A03;
    --clr-slate-text-emphasis: #1A2433;
    --clr-smoke-text-emphasis: #1F2937;
    --clr-glass-text-emphasis: #030712;
    --clr-ocean-text-emphasis: #0B3F6E;
    --clr-sunset-text-emphasis: #9A3A07;
    --clr-marigold-text-emphasis: #6D3204;
    --clr-plum-text-emphasis: #3B0F86;
    --clr-theme-color-text-emphasis: #006B4B;
    --clr-theme-color-light-text-emphasis: #1A8C6B;
    --clr-theme-color-dark-text-emphasis: #005C42;
    --clr-theme-color-darker-text-emphasis: #003D2E;
    --clr-ruby-text-emphasis: #6B0E27;
    --clr-fuchsia-text-emphasis: #701A7D;
    --clr-cobalt-text-emphasis: #11307A;
    --clr-jade-text-emphasis: #03523C;
    --clr-gold-text-emphasis: #6B5007;
    --clr-navy-text-emphasis: #0F1F37;
    --clr-terracotta-text-emphasis: #6E2D0E;
    --clr-bronze-text-emphasis: #542408;
    --clr-berry-text-emphasis: #4A0C25;
    --clr-dusk-text-emphasis: #3E3A5A;
}

/* === Theme color === */

.text-theme-color {
    color: var(--clr-theme-color) !important;
}

.bg-theme-color {
    background-color: var(--clr-theme-color) !important;
}

.text-bg-theme-color {
    background-color: var(--clr-theme-color) !important;
    color: #000 !important;
}

.text-theme-color-light {
    color: var(--clr-theme-color-light) !important;
}

.bg-theme-color-light {
    background-color: var(--clr-theme-color-light) !important;
}

.text-bg-theme-color-light {
    background-color: var(--clr-theme-color-light) !important;
    color: #000 !important;
}

.text-theme-color-dark {
    color: var(--clr-theme-color-dark) !important;
}

.bg-theme-color-dark {
    background-color: var(--clr-theme-color-dark) !important;
}

.text-bg-theme-color-dark {
    background-color: var(--clr-theme-color-dark) !important;
    color: #fff !important;
}

.text-theme-color-darker {
    color: var(--clr-theme-color-darker) !important;
}

.bg-theme-color-darker {
    background-color: var(--clr-theme-color-darker) !important;
}

.text-bg-theme-color-darker {
    background-color: var(--clr-theme-color-darker) !important;
    color: #fff !important;
}


/* === Theme color subtle variants === */
.bg-theme-color-subtle {
    background-color: var(--clr-theme-color-bg-subtle) !important;
}

.border-theme-color-subtle {
    border: 1px solid var(--clr-theme-color-border-subtle) !important;
}

.bg-theme-color-light-subtle {
    background-color: var(--clr-theme-color-light-bg-subtle) !important;
}

.border-theme-color-light-subtle {
    border: 1px solid var(--clr-theme-color-light-border-subtle) !important;
}

.bg-theme-color-dark-subtle {
    background-color: var(--clr-theme-color-dark-bg-subtle) !important;
}

.border-theme-color-dark-subtle {
    border: 1px solid var(--clr-theme-color-dark-border-subtle) !important;
}

.bg-theme-color-darker-subtle {
    background-color: var(--clr-theme-color-darker-bg-subtle) !important;
}

.border-theme-color-darker-subtle {
    border: 1px solid var(--clr-theme-color-darker-border-subtle) !important;
}

/* === Text-subtle utilities (new) === */
.text-theme-color-subtle {
    color: var(--clr-theme-color-text-emphasis) !important;
}

.text-theme-color-light-subtle {
    color: var(--clr-theme-color-light-text-emphasis) !important;
}

.text-theme-color-dark-subtle {
    color: var(--clr-theme-color-dark-text-emphasis) !important;
}

.text-theme-color-darker-subtle {
    color: var(--clr-theme-color-darker-text-emphasis) !important;
}

/* === Solid buttons === */
.btn-theme-color {
    color: #000 !important;
    background-color: var(--clr-theme-color) !important;
    border-color: var(--clr-theme-color) !important;
}

.btn-theme-color:hover,
.btn-theme-color:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(0, 255, 179, 0.25);
}

.btn-theme-color-light {
    color: #000 !important;
    background-color: var(--clr-theme-color-light) !important;
    border-color: var(--clr-theme-color-light) !important;
}

.btn-theme-color-light:hover,
.btn-theme-color-light:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(76, 255, 217, 0.25);
}

.btn-theme-color-dark {
    color: #fff !important;
    background-color: var(--clr-theme-color-dark) !important;
    border-color: var(--clr-theme-color-dark) !important;
}

.btn-theme-color-dark:hover,
.btn-theme-color-dark:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(0, 152, 111, 0.25);
}

.btn-theme-color-darker {
    color: #fff !important;
    background-color: var(--clr-theme-color-darker) !important;
    border-color: var(--clr-theme-color-darker) !important;
}

.btn-theme-color-darker:hover,
.btn-theme-color-darker:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(0, 110, 82, 0.25);
}

/* === Outline buttons === */
.btn-outline-theme-color {
    color: var(--clr-theme-color);
    border-color: var(--clr-theme-color);
    background-color: transparent;
}

.btn-outline-theme-color:hover,
.btn-outline-theme-color:focus {
    color: #000;
    background-color: var(--clr-theme-color);
}

.btn-outline-theme-color-light {
    color: var(--clr-theme-color-light);
    border-color: var(--clr-theme-color-light);
    background-color: transparent;
}

.btn-outline-theme-color-light:hover,
.btn-outline-theme-color-light:focus {
    color: #000;
    background-color: var(--clr-theme-color-light);
}

.btn-outline-theme-color-dark {
    color: var(--clr-theme-color-dark);
    border-color: var(--clr-theme-color-dark);
    background-color: transparent;
}

.btn-outline-theme-color-dark:hover,
.btn-outline-theme-color-dark:focus {
    color: #fff;
    background-color: var(--clr-theme-color-dark);
}

.btn-outline-theme-color-darker {
    color: var(--clr-theme-color-darker);
    border-color: var(--clr-theme-color-darker);
    background-color: transparent;
}

.btn-outline-theme-color-darker:hover,
.btn-outline-theme-color-darker:focus {
    color: #fff;
    background-color: var(--clr-theme-color-darker);
}

/* === Solid buttons for theme-color subtles === */
.btn-theme-color-subtle {
    color: #000 !important;
    /* readable on pastel */
    background-color: var(--clr-theme-color-bg-subtle) !important;
    border-color: var(--clr-theme-color-bg-subtle) !important;
}

.btn-theme-color-subtle:hover,
.btn-theme-color-subtle:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(0, 255, 179, 0.25);
}

.btn-theme-color-light-subtle {
    color: #000 !important;
    background-color: var(--clr-theme-color-light-bg-subtle) !important;
    border-color: var(--clr-theme-color-light-bg-subtle) !important;
}

.btn-theme-color-light-subtle:hover,
.btn-theme-color-light-subtle:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(76, 255, 217, 0.25);
}

.btn-theme-color-dark-subtle {
    color: #fff !important;
    background-color: var(--clr-theme-color-dark-bg-subtle) !important;
    border-color: var(--clr-theme-color-dark-bg-subtle) !important;
}

.btn-theme-color-dark-subtle:hover,
.btn-theme-color-dark-subtle:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(0, 152, 111, 0.25);
}

.btn-theme-color-darker-subtle {
    color: #fff !important;
    background-color: var(--clr-theme-color-darker-bg-subtle) !important;
    border-color: var(--clr-theme-color-darker-bg-subtle) !important;
}

.btn-theme-color-darker-subtle:hover,
.btn-theme-color-darker-subtle:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(0, 110, 82, 0.25);
}

/* === Outline buttons for theme-color subtles === */
.btn-outline-theme-color-subtle {
    color: var(--clr-theme-color-bg-subtle);
    border-color: var(--clr-theme-color-bg-subtle);
    background-color: transparent;
}

.btn-outline-theme-color-subtle:hover,
.btn-outline-theme-color-subtle:focus {
    color: #000;
    background-color: var(--clr-theme-color-bg-subtle);
}

.btn-outline-theme-color-light-subtle {
    color: var(--clr-theme-color-light-bg-subtle);
    border-color: var(--clr-theme-color-light-bg-subtle);
    background-color: transparent;
}

.btn-outline-theme-color-light-subtle:hover,
.btn-outline-theme-color-light-subtle:focus {
    color: #000;
    background-color: var(--clr-theme-color-light-bg-subtle);
}

.btn-outline-theme-color-dark-subtle {
    color: var(--clr-theme-color-dark-bg-subtle);
    border-color: var(--clr-theme-color-dark-bg-subtle);
    background-color: transparent;
}

.btn-outline-theme-color-dark-subtle:hover,
.btn-outline-theme-color-dark-subtle:focus {
    color: #fff;
    background-color: var(--clr-theme-color-dark-bg-subtle);
}

.btn-outline-theme-color-darker-subtle {
    color: var(--clr-theme-color-darker-bg-subtle) !important;
    border-color: var(--clr-theme-color-darker-bg-subtle) !important;
    background-color: transparent !important;
}

.btn-outline-theme-color-darker-subtle:hover,
.btn-outline-theme-color-darker-subtle:focus {
    color: #fff !important;
    background-color: var(--clr-theme-color-darker-bg-subtle) !important;
}

/* === Border utilities === */
.border-theme-color {
    border: 1px solid #00FFB3 !important;
}

.border-theme-color-light {
    border: 1px solid #4CFFD9 !important;
}

.border-theme-color-dark {
    border: 1px solid #00986F !important;
}

.border-theme-color-darker {
    border: 1px solid #006E52 !important;
}

.border-coral {
    border: 1px solid var(--clr-coral-text) !important;
}

.border-teal {
    border: 1px solid var(--clr-teal-text) !important;
}

.border-cyan {
    border: 1px solid var(--clr-cyan-text) !important;
}

.border-indigo {
    border: 1px solid var(--clr-indigo-text) !important;
}

.border-violet {
    border: 1px solid var(--clr-violet-text) !important;
}

.border-lilac {
    border: 1px solid var(--clr-lilac-text) !important;
}

.border-rose {
    border: 1px solid var(--clr-rose-text) !important;
}

.border-amber {
    border: 1px solid var(--clr-amber-text) !important;
}

.border-olive {
    border: 1px solid var(--clr-olive-text) !important;
}

.border-lime {
    border: 1px solid var(--clr-lime-text) !important;
}

.border-mint {
    border: 1px solid var(--clr-mint-text) !important;
}

.border-peach {
    border: 1px solid var(--clr-peach-text) !important;
}

.border-purple {
    border: 1px solid var(--clr-purple-text) !important;
}

.border-sand {
    border: 1px solid var(--clr-sand-text) !important;
}

.border-slate {
    border: 1px solid var(--clr-slate-text) !important;
}

.border-smoke {
    border: 1px solid var(--clr-smoke-text) !important;
}

.border-glass {
    border: 1px solid var(--clr-glass-text) !important;
}

.border-ocean {
    border: 1px solid var(--clr-ocean-text) !important;
}

.border-sunset {
    border: 1px solid var(--clr-sunset-text) !important;
}

.border-marigold {
    border: 1px solid var(--clr-marigold-text) !important;
}

.border-plum {
    border: 1px solid var(--clr-plum-text) !important;
}

/* === Extended Bootstrap Utilities (20 colors) === */

/* Coral */
.bg-coral {
    background-color: #D9480F !important;
}

.text-coral {
    color: var(--clr-coral-text) !important;
}

.text-bg-coral {
    background-color: #D9480F !important;
    color: #fff !important;
}

.bg-coral-subtle {
    background-color: var(--clr-coral-bg-subtle) !important;
}

.border-coral-subtle {
    border: 1px solid var(--clr-coral-border-subtle) !important;
}

/* Teal */
.bg-teal {
    background-color: #0D9488 !important;
}

.text-teal {
    color: var(--clr-teal-text) !important;
}

.text-bg-teal {
    background-color: #0D9488 !important;
    color: #fff !important;
}

.bg-teal-subtle {
    background-color: var(--clr-teal-bg-subtle) !important;
}

.border-teal-subtle {
    border: 1px solid var(--clr-teal-border-subtle) !important;
}

/* Cyan */
.bg-cyan {
    background-color: #0EA5C9 !important;
}

.text-cyan {
    color: var(--clr-cyan-text) !important;
}

.text-bg-cyan {
    background-color: #0EA5C9 !important;
    color: #fff !important;
}

.bg-cyan-subtle {
    background-color: var(--clr-cyan-bg-subtle) !important;
}

.border-cyan-subtle {
    border: 1px solid var(--clr-cyan-border-subtle) !important;
}

/* Indigo */
.bg-indigo {
    background-color: #3730A3 !important;
}

.text-indigo {
    color: var(--clr-indigo-text) !important;
}

.text-bg-indigo {
    background-color: #3730A3 !important;
    color: #fff !important;
}

.bg-indigo-subtle {
    background-color: var(--clr-indigo-bg-subtle) !important;
}

.border-indigo-subtle {
    border: 1px solid var(--clr-indigo-border-subtle) !important;
}

/* Violet */
.bg-violet {
    background-color: #7C3AED !important;
}

.text-violet {
    color: var(--clr-violet-text) !important;
}

.text-bg-violet {
    background-color: #7C3AED !important;
    color: #fff !important;
}

.bg-violet-subtle {
    background-color: var(--clr-violet-bg-subtle) !important;
}

.border-violet-subtle {
    border: 1px solid var(--clr-violet-border-subtle) !important;
}

/* Lilac */
.bg-lilac {
    background-color: #8B5CF6 !important;
}

.text-lilac {
    color: var(--clr-lilac-text) !important;
}

.text-bg-lilac {
    background-color: #8B5CF6 !important;
    color: #fff !important;
}

/* Rose */
.bg-rose {
    background-color: #E11D48 !important;
}

.text-rose {
    color: var(--clr-rose-text) !important;
}

.text-bg-rose {
    background-color: #E11D48 !important;
    color: #fff !important;
}

/* Amber */
.bg-amber {
    background-color: #D97706 !important;
}

.text-amber {
    color: var(--clr-amber-text) !important;
}

.text-bg-amber {
    background-color: #D97706 !important;
    color: #fff !important;
}

/* Olive */
.bg-olive {
    background-color: #556B2F !important;
}

.text-olive {
    color: var(--clr-olive-text) !important;
}

.text-bg-olive {
    background-color: #556B2F !important;
    color: #fff !important;
}

/* Lime */
.bg-lime {
    background-color: #65A30D !important;
}

.text-lime {
    color: var(--clr-lime-text) !important;
}

.text-bg-lime {
    background-color: #65A30D !important;
    color: #fff !important;
}

/* Mint */
.bg-mint {
    background-color: #10B981 !important;
}

.text-mint {
    color: var(--clr-mint-text) !important;
}

.text-bg-mint {
    background-color: #10B981 !important;
    color: #fff !important;
}

/* Peach */
.bg-peach {
    background-color: #FB923C !important;
}

.text-peach {
    color: var(--clr-peach-text) !important;
}

.text-bg-peach {
    background-color: #FB923C !important;
    color: #fff !important;
}

/* Purple */
.bg-purple {
    background-color: #800080 !important;
}

.text-purple {
    color: var(--clr-purple-text) !important;
}

.text-bg-purple {
    background-color: #800080 !important;
    color: #fff !important;
}

/* Sand */
.bg-sand {
    background-color: #A16207 !important;
}

.text-sand {
    color: var(--clr-sand-text) !important;
}

.text-bg-sand {
    background-color: #A16207 !important;
    color: #fff !important;
}

/* Slate */
.bg-slate {
    background-color: #334155 !important;
}

.text-slate {
    color: var(--clr-slate-text) !important;
}

.text-bg-slate {
    background-color: #334155 !important;
    color: #fff !important;
}

/* Smoke */
.bg-smoke {
    background-color: #475569 !important;
}

.text-smoke {
    color: var(--clr-smoke-text) !important;
}

.text-bg-smoke {
    background-color: #475569 !important;
    color: #fff !important;
}

/* Glass */
.bg-glass {
    background-color: #0F172A !important;
}

.text-glass {
    color: var(--clr-glass-text) !important;
}

.text-bg-glass {
    background-color: #0F172A !important;
    color: #fff !important;
}

/* Ocean */
.bg-ocean {
    background-color: #0369A1 !important;
}

.text-ocean {
    color: var(--clr-ocean-text) !important;
}

.text-bg-ocean {
    background-color: #0369A1 !important;
    color: #fff !important;
}

/* Sunset */
.bg-sunset {
    background-color: #F97316 !important;
}

.text-sunset {
    color: var(--clr-sunset-text) !important;
}

.text-bg-sunset {
    background-color: #F97316 !important;
    color: #fff !important;
}

/* Marigold */
.bg-marigold {
    background-color: #B45309 !important;
}

.text-marigold {
    color: var(--clr-marigold-text) !important;
}

.text-bg-marigold {
    background-color: #B45309 !important;
    color: #fff !important;
}

/* Plum */
.bg-plum {
    background-color: #6D28D9 !important;
}

.text-plum {
    color: var(--clr-plum-text) !important;
}

.text-bg-plum {
    background-color: #6D28D9 !important;
    color: #fff !important;
}

/* Outline buttons for extended palette */
.btn-outline-coral {
    color: #D9480F;
    border-color: #D9480F;
    background-color: transparent;
}

.btn-outline-coral:hover,
.btn-outline-coral:focus {
    color: #fff;
    background-color: #D9480F;
    border-color: #D9480F;
}

.btn-outline-teal {
    color: #0D9488 !important;
    border-color: #0D9488 !important;
    background-color: transparent !important;
}

.btn-outline-teal:hover,
.btn-outline-teal:focus {
    color: #fff !important;
    background-color: #0D9488 !important;
    border-color: #0D9488 !important;
}

.btn-outline-cyan {
    color: #0EA5C9;
    border-color: #0EA5C9;
    background-color: transparent;
}

.btn-outline-cyan:hover,
.btn-outline-cyan:focus {
    color: #fff;
    background-color: #0EA5C9;
    border-color: #0EA5C9;
}

.btn-outline-indigo {
    color: #3730A3;
    border-color: #3730A3;
    background-color: transparent;
}

.btn-outline-indigo:hover,
.btn-outline-indigo:focus {
    color: #fff;
    background-color: #3730A3;
    border-color: #3730A3;
}

.btn-outline-violet {
    color: #7C3AED;
    border-color: #7C3AED;
    background-color: transparent;
}

.btn-outline-violet:hover,
.btn-outline-violet:focus {
    color: #fff;
    background-color: #7C3AED;
    border-color: #7C3AED;
}

.btn-outline-lilac {
    color: #8B5CF6;
    border-color: #8B5CF6;
    background-color: transparent;
}

.btn-outline-lilac:hover,
.btn-outline-lilac:focus {
    color: #fff;
    background-color: #8B5CF6;
    border-color: #8B5CF6;
}

.btn-outline-rose {
    color: #E11D48 !important;
    border-color: #E11D48 !important;
    background-color: transparent;
}

.btn-outline-rose:hover,
.btn-outline-rose:focus {
    color: #fff;
    background-color: #E11D48;
    border-color: #E11D48;
}

.btn-outline-amber {
    color: #D97706;
    border-color: #D97706;
    background-color: transparent;
}

.btn-outline-amber:hover,
.btn-outline-amber:focus {
    color: #fff;
    background-color: #D97706;
    border-color: #D97706;
}

.btn-outline-olive {
    color: #556B2F;
    border-color: #556B2F;
    background-color: transparent;
}

.btn-outline-olive:hover,
.btn-outline-olive:focus {
    color: #fff;
    background-color: #556B2F;
    border-color: #556B2F;
}

.btn-outline-lime {
    color: #65A30D;
    border-color: #65A30D;
    background-color: transparent;
}

.btn-outline-lime:hover,
.btn-outline-lime:focus {
    color: #fff;
    background-color: #65A30D;
    border-color: #65A30D;
}

.btn-outline-mint {
    color: #10B981;
    border-color: #10B981;
    background-color: transparent;
}

.btn-outline-mint:hover,
.btn-outline-mint:focus {
    color: #fff;
    background-color: #10B981;
    border-color: #10B981;
}

.btn-outline-peach {
    color: #FB923C;
    border-color: #FB923C;
    background-color: transparent;
}

.btn-outline-peach:hover,
.btn-outline-peach:focus {
    color: #fff;
    background-color: #FB923C;
    border-color: #FB923C;
}

.btn-outline-sand {
    color: #A16207;
    border-color: #A16207;
    background-color: transparent;
}

.btn-outline-sand:hover,
.btn-outline-sand:focus {
    color: #fff;
    background-color: #A16207;
    border-color: #A16207;
}

.btn-outline-slate {
    color: #334155;
    border-color: #334155;
    background-color: transparent;
}

.btn-outline-slate:hover,
.btn-outline-slate:focus {
    color: #fff;
    background-color: #334155;
    border-color: #334155;
}

.btn-outline-smoke {
    color: #475569;
    border-color: #475569;
    background-color: transparent;
}

.btn-outline-smoke:hover,
.btn-outline-smoke:focus {
    color: #fff;
    background-color: #475569;
    border-color: #475569;
}

.btn-outline-glass {
    color: #0F172A;
    border-color: #0F172A;
    background-color: transparent;
}

.btn-outline-glass:hover,
.btn-outline-glass:focus {
    color: #fff;
    background-color: #0F172A;
    border-color: #0F172A;
}

.btn-outline-ocean {
    color: #0369A1;
    border-color: #0369A1;
    background-color: transparent;
}

.btn-outline-ocean:hover,
.btn-outline-ocean:focus {
    color: #fff;
    background-color: #0369A1;
    border-color: #0369A1;
}

.btn-outline-sunset {
    color: #F97316;
    border-color: #F97316;
    background-color: transparent;
}

.btn-outline-sunset:hover,
.btn-outline-sunset:focus {
    color: #fff;
    background-color: #F97316;
    border-color: #F97316;
}

.btn-outline-marigold {
    color: #B45309;
    border-color: #B45309;
    background-color: transparent;
}

.btn-outline-marigold:hover,
.btn-outline-marigold:focus {
    color: #fff;
    background-color: #B45309;
    border-color: #B45309;
}

.btn-outline-plum {
    color: #6D28D9 !important;
    border-color: #6D28D9 !important;
    background-color: transparent !important;
}

.btn-outline-plum:hover,
.btn-outline-plum:focus {
    color: #fff;
    background-color: #6D28D9;
    border-color: #6D28D9;
}

/* Solid buttons for extended palette */
.btn-coral {
    color: #fff !important;
    background-color: #D9480F !important;
    border-color: #D9480F !important;
}

.btn-coral:hover,
.btn-coral:focus {
    filter: brightness(0.95) !important;
    box-shadow: 0 0 0 .25rem rgba(217, 72, 15, 0.25) !important;
    background-color: #D9480F !important;
    border-color: #D9480F !important;
}

.btn-teal {
    color: #fff !important;
    background-color: #0D9488 !important;
    border-color: #0D9488 !important;
}

.btn-teal:hover,
.btn-teal:focus {
    filter: brightness(0.95) !important;
    box-shadow: 0 0 0 .25rem rgba(13, 148, 136, 0.25) !important;
    background-color: #0D9488 !important;
    border-color: #0D9488 !important;
}

.btn-cyan {
    color: #fff !important;
    background-color: #0EA5C9 !important;
    border-color: #0EA5C9 !important;
}

.btn-cyan:hover,
.btn-cyan:focus {
    filter: brightness(0.95) !important;
    box-shadow: 0 0 0 .25rem rgba(14, 165, 201, 0.25) !important;
    background-color: #0EA5C9 !important;
    border-color: #0EA5C9 !important;
}

.btn-indigo {
    color: #fff;
    background-color: #3730A3;
    border-color: #3730A3;
}

.btn-indigo:hover,
.btn-indigo:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(55, 48, 163, 0.25);
    background-color: #3730A3;
    border-color: #3730A3;
}

.btn-violet {
    color: #fff;
    background-color: #7C3AED;
    border-color: #7C3AED;
}

.btn-violet:hover,
.btn-violet:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(124, 58, 237, 0.25);
    background-color: #7C3AED;
    border-color: #7C3AED;
}

.btn-lilac {
    color: #fff;
    background-color: #8B5CF6;
    border-color: #8B5CF6;
}

.btn-lilac:hover,
.btn-lilac:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(139, 92, 246, 0.25);
    background-color: #8B5CF6;
    border-color: #8B5CF6;
}

.btn-rose {
    color: #fff !important;
    background-color: #E11D48 !important;
    border-color: #E11D48 !important;
}

.btn-rose:hover,
.btn-rose:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(225, 29, 72, 0.25);
    background-color: #E11D48;
    border-color: #E11D48;
}

.btn-amber {
    color: #fff;
    background-color: #D97706;
    border-color: #D97706;
}

.btn-amber:hover,
.btn-amber:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(217, 119, 6, 0.25);
    background-color: #D97706;
    border-color: #D97706;
}

.btn-olive {
    color: #fff;
    background-color: #556B2F;
    border-color: #556B2F;
}

.btn-olive:hover,
.btn-olive:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(85, 107, 47, 0.25);
    background-color: #556B2F;
    border-color: #556B2F;
}

.btn-lime {
    color: #fff;
    background-color: #65A30D;
    border-color: #65A30D;
}

.btn-lime:hover,
.btn-lime:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(101, 163, 13, 0.25);
    background-color: #65A30D;
    border-color: #65A30D;
}

.btn-mint {
    color: #fff;
    background-color: #10B981;
    border-color: #10B981;
}

.btn-mint:hover,
.btn-mint:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(16, 185, 129, 0.25);
    background-color: #10B981;
    border-color: #10B981;
}

.btn-peach {
    color: #fff;
    background-color: #FB923C;
    border-color: #FB923C;
}

.btn-peach:hover,
.btn-peach:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(251, 146, 60, 0.25);
    background-color: #FB923C;
    border-color: #FB923C;
}

.btn-sand {
    color: #fff;
    background-color: #A16207;
    border-color: #A16207;
}

.btn-sand:hover,
.btn-sand:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(161, 98, 7, 0.25);
    background-color: #A16207;
    border-color: #A16207;
}

.btn-slate {
    color: #fff;
    background-color: #334155;
    border-color: #334155;
}

.btn-slate:hover,
.btn-slate:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(51, 65, 85, 0.25);
    background-color: #334155;
    border-color: #334155;
}

.btn-smoke {
    color: #fff;
    background-color: #475569;
    border-color: #475569;
}

.btn-smoke:hover,
.btn-smoke:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(71, 85, 105, 0.25);
    background-color: #475569;
    border-color: #475569;
}

.btn-glass {
    color: #fff;
    background-color: #0F172A;
    border-color: #0F172A;
}

.btn-glass:hover,
.btn-glass:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(15, 23, 42, 0.25);
    background-color: #0F172A;
    border-color: #0F172A;
}

.btn-ocean {
    color: #fff;
    background-color: #0369A1;
    border-color: #0369A1;
}

.btn-ocean:hover,
.btn-ocean:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(3, 105, 161, 0.25);
    background-color: #0369A1;
    border-color: #0369A1;
}

.btn-sunset {
    color: #fff;
    background-color: #F97316;
    border-color: #F97316;
}

.btn-sunset:hover,
.btn-sunset:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(249, 115, 22, 0.25);
    background-color: #F97316;
    border-color: #F97316;
}

.btn-marigold {
    color: #fff;
    background-color: #B45309;
    border-color: #B45309;
}

.btn-marigold:hover,
.btn-marigold:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(180, 83, 9, 0.25);
    background-color: #B45309;
    border-color: #B45309;
}

.btn-plum {
    color: #fff;
    background-color: #6D28D9;
    border-color: #6D28D9;
}

.btn-plum:hover,
.btn-plum:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(109, 40, 217, 0.25);
    background-color: #6D28D9;
    border-color: #6D28D9;
}


/* ==========================================================================
   SUBTLE BACKGROUND & BORDER VARIABLES
   --------------------------------------------------------------------------
   Light theme: pale tinted backgrounds with a slightly more saturated border
   tint, matching Bootstrap's own *-bg-subtle / *-border-subtle pattern.
   Dark theme: inverted — deep, muted tinted backgrounds with a brighter (but
   still muted) border tint, so subtle badges/alerts stay legible on a dark
   surface instead of looking like a stray pastel rectangle.
   ========================================================================== */

[data-bs-theme=light] {
    --clr-coral-bg-subtle: #FBEDE7;
    --clr-coral-border-subtle: #F2BFAB;
    --clr-teal-bg-subtle: #E7F4F3;
    --clr-teal-border-subtle: #AADAD5;
    --clr-cyan-bg-subtle: #E7F6FA;
    --clr-cyan-border-subtle: #ABE0EC;
    --clr-indigo-bg-subtle: #EBEAF6;
    --clr-indigo-border-subtle: #B9B7DF;
    --clr-violet-bg-subtle: #F2EBFD;
    --clr-violet-border-subtle: #D1BAF9;
    --clr-lilac-bg-subtle: #F3EFFE;
    --clr-lilac-border-subtle: #D6C6FC;
    --clr-rose-bg-subtle: #FCE8ED;
    --clr-rose-border-subtle: #F4B0BF;
    --clr-amber-bg-subtle: #FBF1E6;
    --clr-amber-border-subtle: #F2CFA8;
    --clr-olive-bg-subtle: #EEF0EA;
    --clr-olive-border-subtle: #C4CBB6;
    --clr-lime-bg-subtle: #F0F6E7;
    --clr-lime-border-subtle: #C9DFAA;
    --clr-mint-bg-subtle: #E7F8F2;
    --clr-mint-border-subtle: #ABE6D3;
    --clr-peach-bg-subtle: #FFF4EC;
    --clr-peach-border-subtle: #FED9BB;
    --clr-purple-bg-subtle: #F2E6F2;
    --clr-purple-border-subtle: #D3A6D3;
    --clr-sand-bg-subtle: #F6EFE6;
    --clr-sand-border-subtle: #DEC8A8;
    --clr-slate-bg-subtle: #EBECEE;
    --clr-slate-border-subtle: #B8BCC4;
    --clr-smoke-bg-subtle: #EDEEF0;
    --clr-smoke-border-subtle: #BFC4CA;
    --clr-glass-bg-subtle: #E7E8EA;
    --clr-glass-border-subtle: #ABAEB4;
    --clr-ocean-bg-subtle: #E6F0F6;
    --clr-ocean-border-subtle: #A7CADE;
    --clr-sunset-bg-subtle: #FEF1E8;
    --clr-sunset-border-subtle: #FDCEAD;
    --clr-marigold-bg-subtle: #F8EEE6;
    --clr-marigold-border-subtle: #E5C3A9;
    --clr-plum-bg-subtle: #F0EAFB;
    --clr-plum-border-subtle: #CCB4F2;
    --clr-theme-color-bg-subtle: #E6FFF7;
    --clr-theme-color-border-subtle: #A6FFE4;
    --clr-theme-color-light-bg-subtle: #EDFFFB;
    --clr-theme-color-light-border-subtle: #C0FFF2;
    --clr-theme-color-dark-bg-subtle: #E6F5F1;
    --clr-theme-color-dark-border-subtle: #A6DBCD;
    --clr-theme-color-darker-bg-subtle: #E6F0EE;
    --clr-theme-color-darker-border-subtle: #A6CCC2;

    /* new colors — subtle backgrounds & borders */
    --clr-ruby-bg-subtle: #FDE8EE;
    --clr-ruby-border-subtle: #F9B4C4;
    --clr-fuchsia-bg-subtle: #FAE5FD;
    --clr-fuchsia-border-subtle: #EFAAF9;
    --clr-cobalt-bg-subtle: #E8EEFB;
    --clr-cobalt-border-subtle: #AABEF2;
    --clr-jade-bg-subtle: #E5F4EE;
    --clr-jade-border-subtle: #A3D9C2;
    --clr-gold-bg-subtle: #FBF4DC;
    --clr-gold-border-subtle: #EDDA94;
    --clr-navy-bg-subtle: #E7EBF0;
    --clr-navy-border-subtle: #A5B3C5;
    --clr-terracotta-bg-subtle: #FAE9E0;
    --clr-terracotta-border-subtle: #F2C2A3;
    --clr-bronze-bg-subtle: #F6ECE3;
    --clr-bronze-border-subtle: #E5C9A8;
    --clr-berry-bg-subtle: #FAE6EF;
    --clr-berry-border-subtle: #F2AECA;
    --clr-dusk-bg-subtle: #EEECF5;
    --clr-dusk-border-subtle: #C5C0DC;

    /* text-emphasis for all colors */
    --clr-coral-text-emphasis: #7D2909;
    --clr-teal-text-emphasis: #064E3B;
    --clr-cyan-text-emphasis: #0A5A6E;
    --clr-indigo-text-emphasis: #1E1B69;
    --clr-violet-text-emphasis: #3B0764;
    --clr-lilac-text-emphasis: #4C1D95;
    --clr-rose-text-emphasis: #8B0D2C;
    --clr-amber-text-emphasis: #854D0E;
    --clr-olive-text-emphasis: #2F3D17;
    --clr-lime-text-emphasis: #3A5A06;
    --clr-mint-text-emphasis: #064E3B;
    --clr-peach-text-emphasis: #9A3E04;
    --clr-purple-text-emphasis: #4A0072;
    --clr-sand-text-emphasis: #5E3A03;
    --clr-slate-text-emphasis: #1A2433;
    --clr-smoke-text-emphasis: #1F2937;
    --clr-glass-text-emphasis: #030712;
    --clr-ocean-text-emphasis: #0B3F6E;
    --clr-sunset-text-emphasis: #9A3A07;
    --clr-marigold-text-emphasis: #6D3204;
    --clr-plum-text-emphasis: #3B0F86;
    --clr-theme-color-text-emphasis: #006B4B;
    --clr-theme-color-light-text-emphasis: #1A8C6B;
    --clr-theme-color-dark-text-emphasis: #005C42;
    --clr-theme-color-darker-text-emphasis: #003D2E;
    --clr-ruby-text-emphasis: #6B0E27;
    --clr-fuchsia-text-emphasis: #701A7D;
    --clr-cobalt-text-emphasis: #11307A;
    --clr-jade-text-emphasis: #03523C;
    --clr-gold-text-emphasis: #6B5007;
    --clr-navy-text-emphasis: #0F1F37;
    --clr-terracotta-text-emphasis: #6E2D0E;
    --clr-bronze-text-emphasis: #542408;
    --clr-berry-text-emphasis: #4A0C25;
    --clr-dusk-text-emphasis: #3E3A5A;
}

[data-bs-theme=dark] {
    --clr-coral-bg-subtle: #270D03;
    --clr-coral-border-subtle: #6C2408;
    --clr-teal-bg-subtle: #021B18;
    --clr-teal-border-subtle: #064A44;
    --clr-cyan-bg-subtle: #031E24;
    --clr-cyan-border-subtle: #075264;
    --clr-indigo-bg-subtle: #0A091D;
    --clr-indigo-border-subtle: #1C1852;
    --clr-violet-bg-subtle: #160A2B;
    --clr-violet-border-subtle: #3E1D76;
    --clr-lilac-bg-subtle: #19112C;
    --clr-lilac-border-subtle: #462E7B;
    --clr-rose-bg-subtle: #29050D;
    --clr-rose-border-subtle: #700E24;
    --clr-amber-bg-subtle: #271501;
    --clr-amber-border-subtle: #6C3C03;
    --clr-olive-bg-subtle: #0F1308;
    --clr-olive-border-subtle: #2A3618;
    --clr-lime-bg-subtle: #121D02;
    --clr-lime-border-subtle: #325206;
    --clr-mint-bg-subtle: #032117;
    --clr-mint-border-subtle: #085C40;
    --clr-peach-bg-subtle: #2D1A0B;
    --clr-peach-border-subtle: #7E491E;
    --clr-purple-bg-subtle: #170017;
    --clr-purple-border-subtle: #400040;
    --clr-sand-bg-subtle: #1D1201;
    --clr-sand-border-subtle: #503104;
    --clr-slate-bg-subtle: #090C0F;
    --clr-slate-border-subtle: #1A202A;
    --clr-smoke-bg-subtle: #0D0F13;
    --clr-smoke-border-subtle: #242A34;
    --clr-glass-bg-subtle: #030408;
    --clr-glass-border-subtle: #080C15;
    --clr-ocean-bg-subtle: #01131D;
    --clr-ocean-border-subtle: #023450;
    --clr-sunset-bg-subtle: #2D1504;
    --clr-sunset-border-subtle: #7C3A0B;
    --clr-marigold-bg-subtle: #200F02;
    --clr-marigold-border-subtle: #5A2A04;
    --clr-plum-bg-subtle: #140727;
    --clr-plum-border-subtle: #36146C;
    --clr-theme-color-bg-subtle: #002E20;
    --clr-theme-color-border-subtle: #00805A;
    --clr-theme-color-light-bg-subtle: #0E2E27;
    --clr-theme-color-light-border-subtle: #26806C;
    --clr-theme-color-dark-bg-subtle: #001B14;
    --clr-theme-color-dark-border-subtle: #004C38;
    --clr-theme-color-darker-bg-subtle: #00140F;
    --clr-theme-color-darker-border-subtle: #003729;

    /* new colors — subtle backgrounds & borders */
    --clr-ruby-bg-subtle: #20050C;
    --clr-ruby-border-subtle: #510E26;
    --clr-fuchsia-bg-subtle: #210023;
    --clr-fuchsia-border-subtle: #550058;
    --clr-cobalt-bg-subtle: #06102B;
    --clr-cobalt-border-subtle: #0F276D;
    --clr-jade-bg-subtle: #011612;
    --clr-jade-border-subtle: #034B35;
    --clr-gold-bg-subtle: #221A00;
    --clr-gold-border-subtle: #574202;
    --clr-navy-bg-subtle: #05080D;
    --clr-navy-border-subtle: #0E1B2E;
    --clr-terracotta-bg-subtle: #270C04;
    --clr-terracotta-border-subtle: #612110;
    --clr-bronze-bg-subtle: #1C0901;
    --clr-bronze-border-subtle: #4A2305;
    --clr-berry-bg-subtle: #1A060D;
    --clr-berry-border-subtle: #430F24;
    --clr-dusk-bg-subtle: #0F0E1C;
    --clr-dusk-border-subtle: #2D2A4A;

    /* text-emphasis for all colors */
    --clr-coral-text-emphasis: #FDBA74;
    --clr-teal-text-emphasis: #99F6E4;
    --clr-cyan-text-emphasis: #A5F3FC;
    --clr-indigo-text-emphasis: #C7D2FE;
    --clr-violet-text-emphasis: #DDD6FE;
    --clr-lilac-text-emphasis: #EDE9FE;
    --clr-rose-text-emphasis: #FBCFE8;
    --clr-amber-text-emphasis: #FDE68A;
    --clr-olive-text-emphasis: #D9F99D;
    --clr-lime-text-emphasis: #D9F99D;
    --clr-mint-text-emphasis: #A7F3D0;
    --clr-peach-text-emphasis: #FED7AA;
    --clr-purple-text-emphasis: #E9D5E9;
    --clr-sand-text-emphasis: #FEF3C7;
    --clr-slate-text-emphasis: #CBD5E1;
    --clr-smoke-text-emphasis: #D1D5DB;
    --clr-glass-text-emphasis: #E5E7EB;
    --clr-ocean-text-emphasis: #BAE6FD;
    --clr-sunset-text-emphasis: #FED7AA;
    --clr-marigold-text-emphasis: #FDE68A;
    --clr-plum-text-emphasis: #DDD6FE;
    --clr-theme-color-text-emphasis: #7FFFD4;
    --clr-theme-color-light-text-emphasis: #CCFFF4;
    --clr-theme-color-dark-text-emphasis: #4FFFC4;
    --clr-theme-color-darker-text-emphasis: #3DFFB3;
    --clr-ruby-text-emphasis: #FECDD3;
    --clr-fuchsia-text-emphasis: #F5D0FE;
    --clr-cobalt-text-emphasis: #BFDBFE;
    --clr-jade-text-emphasis: #A7F3D0;
    --clr-gold-text-emphasis: #FEF08A;
    --clr-navy-text-emphasis: #BFDBFE;
    --clr-terracotta-text-emphasis: #FED7AA;
    --clr-bronze-text-emphasis: #FDE68A;
    --clr-berry-text-emphasis: #FBCFE8;
    --clr-dusk-text-emphasis: #DDD6FE;
}

/* Fallback for pages that never set data-bs-theme */
:root {
    --clr-coral-bg-subtle: #FBEDE7;
    --clr-coral-border-subtle: #F2BFAB;
    --clr-teal-bg-subtle: #E7F4F3;
    --clr-teal-border-subtle: #AADAD5;
    --clr-cyan-bg-subtle: #E7F6FA;
    --clr-cyan-border-subtle: #ABE0EC;
    --clr-indigo-bg-subtle: #EBEAF6;
    --clr-indigo-border-subtle: #B9B7DF;
    --clr-violet-bg-subtle: #F2EBFD;
    --clr-violet-border-subtle: #D1BAF9;
    --clr-lilac-bg-subtle: #F3EFFE;
    --clr-lilac-border-subtle: #D6C6FC;
    --clr-rose-bg-subtle: #FCE8ED;
    --clr-rose-border-subtle: #F4B0BF;
    --clr-amber-bg-subtle: #FBF1E6;
    --clr-amber-border-subtle: #F2CFA8;
    --clr-olive-bg-subtle: #EEF0EA;
    --clr-olive-border-subtle: #C4CBB6;
    --clr-lime-bg-subtle: #F0F6E7;
    --clr-lime-border-subtle: #C9DFAA;
    --clr-mint-bg-subtle: #E7F8F2;
    --clr-mint-border-subtle: #ABE6D3;
    --clr-peach-bg-subtle: #FFF4EC;
    --clr-peach-border-subtle: #FED9BB;
    --clr-purple-bg-subtle: #F2E6F2;
    --clr-purple-border-subtle: #D3A6D3;
    --clr-sand-bg-subtle: #F6EFE6;
    --clr-sand-border-subtle: #DEC8A8;
    --clr-slate-bg-subtle: #EBECEE;
    --clr-slate-border-subtle: #B8BCC4;
    --clr-smoke-bg-subtle: #EDEEF0;
    --clr-smoke-border-subtle: #BFC4CA;
    --clr-glass-bg-subtle: #E7E8EA;
    --clr-glass-border-subtle: #ABAEB4;
    --clr-ocean-bg-subtle: #E6F0F6;
    --clr-ocean-border-subtle: #A7CADE;
    --clr-sunset-bg-subtle: #FEF1E8;
    --clr-sunset-border-subtle: #FDCEAD;
    --clr-marigold-bg-subtle: #F8EEE6;
    --clr-marigold-border-subtle: #E5C3A9;
    --clr-plum-bg-subtle: #F0EAFB;
    --clr-plum-border-subtle: #CCB4F2;
    --clr-theme-color-bg-subtle: #E6FFF7;
    --clr-theme-color-border-subtle: #A6FFE4;
    --clr-theme-color-light-bg-subtle: #EDFFFB;
    --clr-theme-color-light-border-subtle: #C0FFF2;
    --clr-theme-color-dark-bg-subtle: #E6F5F1;
    --clr-theme-color-dark-border-subtle: #A6DBCD;
    --clr-theme-color-darker-bg-subtle: #E6F0EE;
    --clr-theme-color-darker-border-subtle: #A6CCC2;

    /* new colors — subtle backgrounds & borders */
    --clr-ruby-bg-subtle: #FDE8EE;
    --clr-ruby-border-subtle: #F9B4C4;
    --clr-fuchsia-bg-subtle: #FAE5FD;
    --clr-fuchsia-border-subtle: #EFAAF9;
    --clr-cobalt-bg-subtle: #E8EEFB;
    --clr-cobalt-border-subtle: #AABEF2;
    --clr-jade-bg-subtle: #E5F4EE;
    --clr-jade-border-subtle: #A3D9C2;
    --clr-gold-bg-subtle: #FBF4DC;
    --clr-gold-border-subtle: #EDDA94;
    --clr-navy-bg-subtle: #E7EBF0;
    --clr-navy-border-subtle: #A5B3C5;
    --clr-terracotta-bg-subtle: #FAE9E0;
    --clr-terracotta-border-subtle: #F2C2A3;
    --clr-bronze-bg-subtle: #F6ECE3;
    --clr-bronze-border-subtle: #E5C9A8;
    --clr-berry-bg-subtle: #FAE6EF;
    --clr-berry-border-subtle: #F2AECA;
    --clr-dusk-bg-subtle: #EEECF5;
    --clr-dusk-border-subtle: #C5C0DC;

    /* text-emphasis for all colors */
    --clr-coral-text-emphasis: #7D2909;
    --clr-teal-text-emphasis: #064E3B;
    --clr-cyan-text-emphasis: #0A5A6E;
    --clr-indigo-text-emphasis: #1E1B69;
    --clr-violet-text-emphasis: #3B0764;
    --clr-lilac-text-emphasis: #4C1D95;
    --clr-rose-text-emphasis: #8B0D2C;
    --clr-amber-text-emphasis: #854D0E;
    --clr-olive-text-emphasis: #2F3D17;
    --clr-lime-text-emphasis: #3A5A06;
    --clr-mint-text-emphasis: #064E3B;
    --clr-peach-text-emphasis: #9A3E04;
    --clr-purple-text-emphasis: #4A0072;
    --clr-sand-text-emphasis: #5E3A03;
    --clr-slate-text-emphasis: #1A2433;
    --clr-smoke-text-emphasis: #1F2937;
    --clr-glass-text-emphasis: #030712;
    --clr-ocean-text-emphasis: #0B3F6E;
    --clr-sunset-text-emphasis: #9A3A07;
    --clr-marigold-text-emphasis: #6D3204;
    --clr-plum-text-emphasis: #3B0F86;
    --clr-theme-color-text-emphasis: #006B4B;
    --clr-theme-color-light-text-emphasis: #1A8C6B;
    --clr-theme-color-dark-text-emphasis: #005C42;
    --clr-theme-color-darker-text-emphasis: #003D2E;
    --clr-ruby-text-emphasis: #6B0E27;
    --clr-fuchsia-text-emphasis: #701A7D;
    --clr-cobalt-text-emphasis: #11307A;
    --clr-jade-text-emphasis: #03523C;
    --clr-gold-text-emphasis: #6B5007;
    --clr-navy-text-emphasis: #0F1F37;
    --clr-terracotta-text-emphasis: #6E2D0E;
    --clr-bronze-text-emphasis: #542408;
    --clr-berry-text-emphasis: #4A0C25;
    --clr-dusk-text-emphasis: #3E3A5A;
}

/* === Subtle background & border utilities === */

/* Coral */
.bg-coral-subtle {
    background-color: var(--clr-coral-bg-subtle) !important;
}

.border-coral-subtle {
    border: 1px solid var(--clr-coral-border-subtle) !important;
}

/* Teal */
.bg-teal-subtle {
    background-color: var(--clr-teal-bg-subtle) !important;
}

.border-teal-subtle {
    border: 1px solid var(--clr-teal-border-subtle) !important;
}

/* Cyan */
.bg-cyan-subtle {
    background-color: var(--clr-cyan-bg-subtle) !important;
}

.border-cyan-subtle {
    border: 1px solid var(--clr-cyan-border-subtle) !important;
}

/* Indigo */
.bg-indigo-subtle {
    background-color: var(--clr-indigo-bg-subtle) !important;
}

.border-indigo-subtle {
    border: 1px solid var(--clr-indigo-border-subtle) !important;
}

/* Violet */
.bg-violet-subtle {
    background-color: var(--clr-violet-bg-subtle) !important;
}

.border-violet-subtle {
    border: 1px solid var(--clr-violet-border-subtle) !important;
}

/* Lilac */
.bg-lilac-subtle {
    background-color: var(--clr-lilac-bg-subtle) !important;
}

.border-lilac-subtle {
    border: 1px solid var(--clr-lilac-border-subtle) !important;
}

/* Rose */
.bg-rose-subtle {
    background-color: var(--clr-rose-bg-subtle) !important;
}

.border-rose-subtle {
    border: 1px solid var(--clr-rose-border-subtle) !important;
}

/* Amber */
.bg-amber-subtle {
    background-color: var(--clr-amber-bg-subtle) !important;
}

.border-amber-subtle {
    border: 1px solid var(--clr-amber-border-subtle) !important;
}

/* Olive */
.bg-olive-subtle {
    background-color: var(--clr-olive-bg-subtle) !important;
}

.border-olive-subtle {
    border: 1px solid var(--clr-olive-border-subtle) !important;
}

/* Lime */
.bg-lime-subtle {
    background-color: var(--clr-lime-bg-subtle) !important;
}

.border-lime-subtle {
    border: 1px solid var(--clr-lime-border-subtle) !important;
}

/* Mint */
.bg-mint-subtle {
    background-color: var(--clr-mint-bg-subtle) !important;
}

.border-mint-subtle {
    border: 1px solid var(--clr-mint-border-subtle) !important;
}

/* Peach */
.bg-peach-subtle {
    background-color: var(--clr-peach-bg-subtle) !important;
}

.border-peach-subtle {
    border: 1px solid var(--clr-peach-border-subtle) !important;
}

/* Purple */
.bg-purple-subtle {
    background-color: var(--clr-purple-bg-subtle) !important;
}

.border-purple-subtle {
    border: 1px solid var(--clr-purple-border-subtle) !important;
}

/* Sand */
.bg-sand-subtle {
    background-color: var(--clr-sand-bg-subtle) !important;
}

.border-sand-subtle {
    border: 1px solid var(--clr-sand-border-subtle) !important;
}

/* Slate */
.bg-slate-subtle {
    background-color: var(--clr-slate-bg-subtle) !important;
}

.border-slate-subtle {
    border: 1px solid var(--clr-slate-border-subtle) !important;
}

/* Smoke */
.bg-smoke-subtle {
    background-color: var(--clr-smoke-bg-subtle) !important;
}

.border-smoke-subtle {
    border: 1px solid var(--clr-smoke-border-subtle) !important;
}

/* Glass */
.bg-glass-subtle {
    background-color: var(--clr-glass-bg-subtle) !important;
}

.border-glass-subtle {
    border: 1px solid var(--clr-glass-border-subtle) !important;
}

/* Ocean */
.bg-ocean-subtle {
    background-color: var(--clr-ocean-bg-subtle) !important;
}

.border-ocean-subtle {
    border: 1px solid var(--clr-ocean-border-subtle) !important;
}

/* Sunset */
.bg-sunset-subtle {
    background-color: var(--clr-sunset-bg-subtle) !important;
}

.border-sunset-subtle {
    border: 1px solid var(--clr-sunset-border-subtle) !important;
}

/* Marigold */
.bg-marigold-subtle {
    background-color: var(--clr-marigold-bg-subtle) !important;
}

.border-marigold-subtle {
    border: 1px solid var(--clr-marigold-border-subtle) !important;
}

/* Plum */
.bg-plum-subtle {
    background-color: var(--clr-plum-bg-subtle) !important;
}

.border-plum-subtle {
    border: 1px solid var(--clr-plum-border-subtle) !important;
}

/* Theme Color */
.bg-theme-color-subtle {
    background-color: var(--clr-theme-color-bg-subtle) !important;
}

.border-theme-color-subtle {
    border: 1px solid var(--clr-theme-color-border-subtle) !important;
}

/* Theme Color Light */
.bg-theme-color-light-subtle {
    background-color: var(--clr-theme-color-light-bg-subtle) !important;
}

.border-theme-color-light-subtle {
    border: 1px solid var(--clr-theme-color-light-border-subtle) !important;
}

/* Theme Color Dark */
.bg-theme-color-dark-subtle {
    background-color: var(--clr-theme-color-dark-bg-subtle) !important;
}

.border-theme-color-dark-subtle {
    border: 1px solid var(--clr-theme-color-dark-border-subtle) !important;
}

/* Theme Color Darker */
.bg-theme-color-darker-subtle {
    background-color: var(--clr-theme-color-darker-bg-subtle) !important;
}

.border-theme-color-darker-subtle {
    border: 1px solid var(--clr-theme-color-darker-border-subtle) !important;
}

/* ==========================================================================
   NEW COLORS — 10 extended palette additions
   ruby · fuchsia · cobalt · jade · gold · navy · terracotta · bronze · berry · dusk
   ========================================================================== */

/* Ruby */
.bg-ruby {
    background-color: #9F1239 !important;
}

.text-ruby {
    color: var(--clr-ruby-text) !important;
}

.text-bg-ruby {
    background-color: #9F1239 !important;
    color: #fff !important;
}

.bg-ruby-subtle {
    background-color: var(--clr-ruby-bg-subtle) !important;
}

.border-ruby {
    border: 1px solid var(--clr-ruby-text) !important;
}

.border-ruby-subtle {
    border: 1px solid var(--clr-ruby-border-subtle) !important;
}

.btn-outline-ruby {
    color: #9F1239;
    border-color: #9F1239;
    background-color: transparent;
}

.btn-outline-ruby:hover,
.btn-outline-ruby:focus {
    color: #fff;
    background-color: #9F1239;
    border-color: #9F1239;
}

.btn-ruby {
    color: #fff;
    background-color: #9F1239;
    border-color: #9F1239;
}

.btn-ruby:hover,
.btn-ruby:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(159, 18, 57, 0.25);
    background-color: #9F1239;
    border-color: #9F1239;
}

/* Fuchsia */
.bg-fuchsia {
    background-color: #C026D3 !important;
}

.text-fuchsia {
    color: var(--clr-fuchsia-text) !important;
}

.text-bg-fuchsia {
    background-color: #C026D3 !important;
    color: #fff !important;
}

.bg-fuchsia-subtle {
    background-color: var(--clr-fuchsia-bg-subtle) !important;
}

.border-fuchsia {
    border: 1px solid var(--clr-fuchsia-text) !important;
}

.border-fuchsia-subtle {
    border: 1px solid var(--clr-fuchsia-border-subtle) !important;
}

.btn-outline-fuchsia {
    color: #C026D3;
    border-color: #C026D3;
    background-color: transparent;
}

.btn-outline-fuchsia:hover,
.btn-outline-fuchsia:focus {
    color: #fff;
    background-color: #C026D3;
    border-color: #C026D3;
}

.btn-fuchsia {
    color: #fff;
    background-color: #C026D3;
    border-color: #C026D3;
}

.btn-fuchsia:hover,
.btn-fuchsia:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(192, 38, 211, 0.25);
    background-color: #C026D3;
    border-color: #C026D3;
}

/* Cobalt */
.bg-cobalt {
    background-color: #1D4ED8 !important;
}

.text-cobalt {
    color: var(--clr-cobalt-text) !important;
}

.text-bg-cobalt {
    background-color: #1D4ED8 !important;
    color: #fff !important;
}

.bg-cobalt-subtle {
    background-color: var(--clr-cobalt-bg-subtle) !important;
}

.border-cobalt {
    border: 1px solid var(--clr-cobalt-text) !important;
}

.border-cobalt-subtle {
    border: 1px solid var(--clr-cobalt-border-subtle) !important;
}

.btn-outline-cobalt {
    color: #1D4ED8;
    border-color: #1D4ED8;
    background-color: transparent;
}

.btn-outline-cobalt:hover,
.btn-outline-cobalt:focus {
    color: #fff;
    background-color: #1D4ED8;
    border-color: #1D4ED8;
}

.btn-cobalt {
    color: #fff;
    background-color: #1D4ED8;
    border-color: #1D4ED8;
}

.btn-cobalt:hover,
.btn-cobalt:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(29, 78, 216, 0.25);
    background-color: #1D4ED8;
    border-color: #1D4ED8;
}

/* Jade */
.bg-jade {
    background-color: #047857 !important;
}

.text-jade {
    color: var(--clr-jade-text) !important;
}

.text-bg-jade {
    background-color: #047857 !important;
    color: #fff !important;
}

.bg-jade-subtle {
    background-color: var(--clr-jade-bg-subtle) !important;
}

.border-jade {
    border: 1px solid var(--clr-jade-text) !important;
}

.border-jade-subtle {
    border: 1px solid var(--clr-jade-border-subtle) !important;
}

.btn-outline-jade {
    color: #047857;
    border-color: #047857;
    background-color: transparent;
}

.btn-outline-jade:hover,
.btn-outline-jade:focus {
    color: #fff;
    background-color: #047857;
    border-color: #047857;
}

.btn-jade {
    color: #fff;
    background-color: #047857;
    border-color: #047857;
}

.btn-jade:hover,
.btn-jade:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(4, 120, 87, 0.25);
    background-color: #047857;
    border-color: #047857;
}

/* Gold */
.bg-gold {
    background-color: #B7860B !important;
}

.text-gold {
    color: var(--clr-gold-text) !important;
}

.text-bg-gold {
    background-color: #B7860B !important;
    color: #fff !important;
}

.bg-gold-subtle {
    background-color: var(--clr-gold-bg-subtle) !important;
}

.border-gold {
    border: 1px solid var(--clr-gold-text) !important;
}

.border-gold-subtle {
    border: 1px solid var(--clr-gold-border-subtle) !important;
}

.btn-outline-gold {
    color: #B7860B;
    border-color: #B7860B;
    background-color: transparent;
}

.btn-outline-gold:hover,
.btn-outline-gold:focus {
    color: #fff;
    background-color: #B7860B;
    border-color: #B7860B;
}

.btn-gold {
    color: #fff;
    background-color: #B7860B;
    border-color: #B7860B;
}

.btn-gold:hover,
.btn-gold:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(183, 134, 11, 0.25);
    background-color: #B7860B;
    border-color: #B7860B;
}

/* Navy */
.bg-navy {
    background-color: #1E3A5F !important;
}

.text-navy {
    color: var(--clr-navy-text) !important;
}

.text-bg-navy {
    background-color: #1E3A5F !important;
    color: #fff !important;
}

.bg-navy-subtle {
    background-color: var(--clr-navy-bg-subtle) !important;
}

.border-navy {
    border: 1px solid var(--clr-navy-text) !important;
}

.border-navy-subtle {
    border: 1px solid var(--clr-navy-border-subtle) !important;
}

.btn-outline-navy {
    color: #1E3A5F;
    border-color: #1E3A5F;
    background-color: transparent;
}

.btn-outline-navy:hover,
.btn-outline-navy:focus {
    color: #fff;
    background-color: #1E3A5F;
    border-color: #1E3A5F;
}

.btn-navy {
    color: #fff;
    background-color: #1E3A5F;
    border-color: #1E3A5F;
}

.btn-navy:hover,
.btn-navy:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(30, 58, 95, 0.25);
    background-color: #1E3A5F;
    border-color: #1E3A5F;
}

/* Terracotta */
.bg-terracotta {
    background-color: #C05621 !important;
}

.text-terracotta {
    color: var(--clr-terracotta-text) !important;
}

.text-bg-terracotta {
    background-color: #C05621 !important;
    color: #fff !important;
}

.bg-terracotta-subtle {
    background-color: var(--clr-terracotta-bg-subtle) !important;
}

.border-terracotta {
    border: 1px solid var(--clr-terracotta-text) !important;
}

.border-terracotta-subtle {
    border: 1px solid var(--clr-terracotta-border-subtle) !important;
}

.btn-outline-terracotta {
    color: #C05621;
    border-color: #C05621;
    background-color: transparent;
}

.btn-outline-terracotta:hover,
.btn-outline-terracotta:focus {
    color: #fff;
    background-color: #C05621;
    border-color: #C05621;
}

.btn-terracotta {
    color: #fff;
    background-color: #C05621;
    border-color: #C05621;
}

.btn-terracotta:hover,
.btn-terracotta:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(192, 86, 33, 0.25);
    background-color: #C05621;
    border-color: #C05621;
}

/* Bronze */
.bg-bronze {
    background-color: #92400E !important;
}

.text-bronze {
    color: var(--clr-bronze-text) !important;
}

.text-bg-bronze {
    background-color: #92400E !important;
    color: #fff !important;
}

.bg-bronze-subtle {
    background-color: var(--clr-bronze-bg-subtle) !important;
}

.border-bronze {
    border: 1px solid var(--clr-bronze-text) !important;
}

.border-bronze-subtle {
    border: 1px solid var(--clr-bronze-border-subtle) !important;
}

.btn-outline-bronze {
    color: #92400E;
    border-color: #92400E;
    background-color: transparent;
}

.btn-outline-bronze:hover,
.btn-outline-bronze:focus {
    color: #fff;
    background-color: #92400E;
    border-color: #92400E;
}

.btn-bronze {
    color: #fff;
    background-color: #92400E;
    border-color: #92400E;
}

.btn-bronze:hover,
.btn-bronze:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(146, 64, 14, 0.25);
    background-color: #92400E;
    border-color: #92400E;
}

/* Berry */
.bg-berry {
    background-color: #831843 !important;
}

.text-berry {
    color: var(--clr-berry-text) !important;
}

.text-bg-berry {
    background-color: #831843 !important;
    color: #fff !important;
}

.bg-berry-subtle {
    background-color: var(--clr-berry-bg-subtle) !important;
}

.border-berry {
    border: 1px solid var(--clr-berry-text) !important;
}

.border-berry-subtle {
    border: 1px solid var(--clr-berry-border-subtle) !important;
}

.btn-outline-berry {
    color: #831843;
    border-color: #831843;
    background-color: transparent;
}

.btn-outline-berry:hover,
.btn-outline-berry:focus {
    color: #fff;
    background-color: #831843;
    border-color: #831843;
}

.btn-berry {
    color: #fff;
    background-color: #831843;
    border-color: #831843;
}

.btn-berry:hover,
.btn-berry:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(131, 24, 67, 0.25);
    background-color: #831843;
    border-color: #831843;
}

/* Dusk */
.bg-dusk {
    background-color: #6E6594 !important;
}

.text-dusk {
    color: var(--clr-dusk-text) !important;
}

.text-bg-dusk {
    background-color: #6E6594 !important;
    color: #fff !important;
}

.bg-dusk-subtle {
    background-color: var(--clr-dusk-bg-subtle) !important;
}

.border-dusk {
    border: 1px solid var(--clr-dusk-text) !important;
}

.border-dusk-subtle {
    border: 1px solid var(--clr-dusk-border-subtle) !important;
}

.btn-outline-dusk {
    color: #6E6594;
    border-color: #6E6594;
    background-color: transparent;
}

.btn-outline-dusk:hover,
.btn-outline-dusk:focus {
    color: #fff;
    background-color: #6E6594;
    border-color: #6E6594;
}

.btn-dusk {
    color: #fff;
    background-color: #6E6594;
    border-color: #6E6594;
}

.btn-dusk:hover,
.btn-dusk:focus {
    filter: brightness(0.95);
    box-shadow: 0 0 0 .25rem rgba(110, 101, 148, 0.25);
    background-color: #6E6594;
    border-color: #6E6594;
}

/* ==========================================================================
   TEXT-EMPHASIS UTILITIES — Bootstrap 5 .text-*-emphasis pattern
   Darker shade in light mode, lighter/brighter in dark mode.
   Designed for use on .bg-*-subtle backgrounds.
   ========================================================================== */

.text-coral-emphasis {
    color: var(--clr-coral-text-emphasis) !important;
}

.text-teal-emphasis {
    color: var(--clr-teal-text-emphasis) !important;
}

.text-cyan-emphasis {
    color: var(--clr-cyan-text-emphasis) !important;
}

.text-indigo-emphasis {
    color: var(--clr-indigo-text-emphasis) !important;
}

.text-violet-emphasis {
    color: var(--clr-violet-text-emphasis) !important;
}

.text-lilac-emphasis {
    color: var(--clr-lilac-text-emphasis) !important;
}

.text-rose-emphasis {
    color: var(--clr-rose-text-emphasis) !important;
}

.text-amber-emphasis {
    color: var(--clr-amber-text-emphasis) !important;
}

.text-olive-emphasis {
    color: var(--clr-olive-text-emphasis) !important;
}

.text-lime-emphasis {
    color: var(--clr-lime-text-emphasis) !important;
}

.text-mint-emphasis {
    color: var(--clr-mint-text-emphasis) !important;
}

.text-peach-emphasis {
    color: var(--clr-peach-text-emphasis) !important;
}

.text-purple-emphasis {
    color: var(--clr-purple-text-emphasis) !important;
}

.text-sand-emphasis {
    color: var(--clr-sand-text-emphasis) !important;
}

.text-slate-emphasis {
    color: var(--clr-slate-text-emphasis) !important;
}

.text-smoke-emphasis {
    color: var(--clr-smoke-text-emphasis) !important;
}

.text-glass-emphasis {
    color: var(--clr-glass-text-emphasis) !important;
}

.text-ocean-emphasis {
    color: var(--clr-ocean-text-emphasis) !important;
}

.text-sunset-emphasis {
    color: var(--clr-sunset-text-emphasis) !important;
}

.text-marigold-emphasis {
    color: var(--clr-marigold-text-emphasis) !important;
}

.text-plum-emphasis {
    color: var(--clr-plum-text-emphasis) !important;
}

.text-theme-color-emphasis {
    color: var(--clr-theme-color-text-emphasis) !important;
}

.text-theme-color-light-emphasis {
    color: var(--clr-theme-color-light-text-emphasis) !important;
}

.text-theme-color-dark-emphasis {
    color: var(--clr-theme-color-dark-text-emphasis) !important;
}

.text-theme-color-darker-emphasis {
    color: var(--clr-theme-color-darker-text-emphasis) !important;
}

.text-ruby-emphasis {
    color: var(--clr-ruby-text-emphasis) !important;
}

.text-fuchsia-emphasis {
    color: var(--clr-fuchsia-text-emphasis) !important;
}

.text-cobalt-emphasis {
    color: var(--clr-cobalt-text-emphasis) !important;
}

.text-jade-emphasis {
    color: var(--clr-jade-text-emphasis) !important;
}

.text-gold-emphasis {
    color: var(--clr-gold-text-emphasis) !important;
}

.text-navy-emphasis {
    color: var(--clr-navy-text-emphasis) !important;
}

.text-terracotta-emphasis {
    color: var(--clr-terracotta-text-emphasis) !important;
}

.text-bronze-emphasis {
    color: var(--clr-bronze-text-emphasis) !important;
}

.text-berry-emphasis {
    color: var(--clr-berry-text-emphasis) !important;
}

.text-dusk-emphasis {
    color: var(--clr-dusk-text-emphasis) !important;
}