test/themes/allThemes.css
/* Theme Colors */
.b_c.colors{
  border: none;
  --b_bg: rgb(200 200 200);
}
:root[data-theme='dark'] .b_c, .dark .b_c{
  --b_bg: rgb(43 43 43);
}

.b_c.colors.info, :root[data-theme='dark'] .colors.info{
  --b_bg: rgb(57 167 213);
  --b_d: rgb(238 247 255);
  --b_svg: rgb(255 255 255);
  --b_t: rgb(255 255 255);
}

.b_c.warning.colors, :root[data-theme='dark'] .colors.warning{
  --b_bg: rgb(255 144 72);
  --b_d: rgb(255 247 239 / 90%);
  --b_t: rgb(255 255 255);
  --b_svg: rgb(255 255 255);
}

.b_c.error.colors, :root[data-theme='dark'] .colors.error{
  --b_bg: rgb(196 48 48);
  --b_d: rgb(238 247 255 / 80%);
  --b_t: rgb(255 255 255);
  --b_svg: rgb(255 255 255);
}

.b_c.success.colors, :root[data-theme='dark'] .colors.success{
  --b_bg: rgb(41 173 65);
  --b_d: rgb(248 255 247 / 96%);
  --b_t: rgb(255 255 255);
  --b_svg: rgb(255 255 255);
}

/* Theme gradient */

.b_c.gradient {
  border: none;
  box-shadow: 0 2px 10px hsl(0deg 0% 4% / 11%);
  background: linear-gradient(60deg, #e9e9e9, #fff 20%);
}

.b_c.gradient.info {
  background: linear-gradient(60deg, #cde3fb, #fff 20%);
  --b_t: rgb(10 10 10 / .7);
  --b_svg: rgb(48 160 207);
  --b_t: rgb(10 10 10);
}

.b_c.warning.gradient {
  background: linear-gradient(60deg, #fbe1cd, #fff 20%);
  --b_t: rgb(10 10 10 / .7);
  --b_t: rgb(10 10 10);
  --b_svg: rgb(162 87 0);
}

.b_c.error.gradient {
  background: linear-gradient(60deg, #fbcdcd, #fff 20%);
  --b_t: rgb(10 10 10 / .7);
  --b_t: rgb(10 10 10);
  --b_svg: rgb(162 0 0);
}

.b_c.success.gradient {
  background: linear-gradient(60deg, #cdfbcf, #fff 20%);
  --b_t: rgb(10 10 10 / .7);
  --b_t: rgb(10 10 10);
  --b_svg: rgb(0 162 91);
}

.dark .gradient, :root[data-theme='dark'] .gradient {
  --b_t: white !important;
  background: linear-gradient(60deg, #494747, #302c2c 22%);
}

.dark .gradient.success, :root[data-theme='dark'] .success.gradient{
  background: linear-gradient(80deg, #254626, #252726 22%);
  --b_d: rgb(239 255 244 / 82%);
  --b_svg: rgb(0 162 91);
}

.dark .gradient.error, :root[data-theme='dark'] .error.gradient{
  background: linear-gradient(80deg, #4a1f1f, #2b2424 22%);
  --b_d: rgb(255 244 244 / 83%);
  --b_svg: rgb(203 53 53);
}

.dark .gradient.warning, :root[data-theme='dark'] .warning.gradient{
  background: linear-gradient(80deg, #53451a, #2b2823 22%);
  --b_d: rgb(255 250 236/.8);
  --b_svg: rgb(217 163 11);
}

.dark .gradient.info, :root[data-theme='dark'] .info.gradient{
  background: linear-gradient(80deg, #2a4551, #212425 22%);
  --b_d: rgb(237 248 255 / 70%);
  --b_svg: rgb(48 160 207);
}

/* Theme Light */

.b_c.light {
  border: none;
  box-shadow:0 3px 10px rgb(10 10 10 /.1);
}

.b_c.light.info {
  --b_bg: rgb(255 255 255);
  --b_d: rgb(120 120 120);
  --b_svg: rgb(48 160 207);
  --b_t: rgb(40 40 40);
}

.b_c.warning.light {
  --b_bg: rgb(255 255 255);
  --b_d: rgb(120 120 120);
  --b_t: rgb(40 40 40);
  --b_svg: rgb(200 96 34);
}

.b_c.error.light {
  --b_bg: rgb(255 255 255);
  --b_d: rgb(120 120 120);
  --b_t: rgb(40 40 40);
  --b_svg: rgb(205 53 53);
}

.b_c.success.light {
  --b_bg: rgb(255 255 255);
  --b_d: rgb(120 120 120);
  --b_t: rgb(40 40 40);
  --b_svg: #4CAF50;
}

.dark .b_c.light, :root[data-theme='dark'] .b_c.light {
  --b_bg: rgb(48 44 44);
  --b_d: rgb(227 227 227);
  --b_t: rgb(255 255 255);
}

/* Theme chackra */

.b_c.chackra {
  border: none;
  box-shadow:0 3px 12px rgb(10 10 10 /.03);
}

.b_c.chackra.info {
  --b_bg: rgb(199 245 255);
  --b_d: rgb(6 47 58 /.8);
  --b_svg: rgb(48 160 207);
  --b_t: rgb(6 47 58);
}

.b_c.warning.chackra {
  --b_bg: rgb(255 226 174);
  --b_d: rgb(72 37 3/.8);
  --b_t: rgb(72 37 3);
  --b_svg: rgb(162 87 0);
}

.b_c.error.chackra {
  --b_bg: rgb(255 212 212);
  --b_d: rgb(67 6 6/.8);
  --b_t: rgb(67 6 6);
  --b_svg: rgb(162 0 0);
}

.b_c.success.chackra {
  --b_bg: rgb(198 255 229);
  --b_d: rgb(3 69 39/.8);
  --b_t: rgb(3 69 39);
  --b_svg: rgb(0 162 91);
}

.dark .success.chackra, :root[data-theme='dark'] .success.chackra{
  --b_bg: rgb(31 41 36);
  --b_t: rgb(70 228 123);
  --b_d: rgb(70 228 123/.65);
}

.dark .error.chackra, :root[data-theme='dark'] .error.chackra{
  --b_bg: rgb(52 32 32);
  --b_d: rgb(246 109 109/.8);
  --b_t: rgb(246 109 109);
  --b_svg: rgb(195 53 53);
}

.dark .info.chackra, :root[data-theme='dark'] .info.chackra{
  --b_bg: rgb(29 44 48);
  --b_d: rgb(134 208 228 / .7);
  --b_t: rgb(134 208 228);
}

.dark .warning.chackra, :root[data-theme='dark'] .warning.chackra{
  --b_bg: rgb(48 36 24);
  --b_d: rgb(235 186 138 / .7);
  --b_t: rgb(235 186 138);
  --b_svg: rgb(213 114 0);
}

