:root {
  --success-light: #65aa68;
  --success: #288b2d;
  --success-dark: #1e6721;
  --error-light: #f59483;
  --error: #cf543e;
  --error-dark: #a1412f;
  --warning-light: #fbb763;
  --warning: #dd8519;
  --warning-dark: #bb7115;
  --info-light: #6ba7fc;
  --info: #3377d8;
  --info-dark: #2a5fac;
  --white: #ffffff;
  --black: #000000;
}
:root[data-theme=light] {
  --bg-light: hsl(0,0%, 100%);
  --bg: hsl(0,0%, 96%);
  --bg-dark: hsl(0,0%, 90%);
  --fg-light: hsl(0,0%, 50%);
  --fg: hsl(0,0%, 5%);
  --fg-dark: hsl(0,0%, 0%);
}
:root[data-theme=dark] {
  --bg-dark: hsl(0,0%, 5%);
  --bg: hsl(0,0%, 15%);
  --bg-light: hsl(0,0%, 25%);
  --fg-light: hsl(0,0%, 70%);
  --fg: hsl(0,0%, 95%);
  --fg-dark: hsl(0,0%, 100%);
}

html[data-theme=light] body.skinSmart {
  --primary-light: color-mix(in sRGB, var(--bg) 84%, var(--primary));
  --primary: #115E59;
  --primary-dark: #094843;
  --secondary-light: color-mix(in sRGB, var(--bg) 84%, var(--secondary));
  --secondary: #38BDF8;
  --secondary-dark: #1096d1;
}

html[data-theme=dark] body.skinSmart {
  --primary-light: color-mix(in sRGB, var(--bg) 84%, var(--primary));
  --primary: #00a396;
  --primary-dark: #0f766e;
  --secondary-light: color-mix(in sRGB, var(--bg) 84%, var(--secondary));
  --secondary: #078cc5;
  --secondary-dark: #0284c7;
}

/*# sourceMappingURL=theme.css.map */