/*
Spring theme suggestions for index_v2.html / index_v2.css
Usage:
1. Add one of these classes to , for example:
2. Keep the existing layout and component CSS intact.
*/
body.theme-spring-moss {
--bg-primary: #f3f3ea;
--bg-secondary: #fbfbf5;
--bg-tertiary: #eef0e1;
--bg-hover: #e3e8d3;
--border: #cfd7b8;
--border-light: #dde4ca;
--text-primary: #253023;
--text-secondary: #5d6d59;
--text-muted: #87907e;
--accent: #506b2f;
--accent-dim: #738b55;
--team-red: #c96b64;
--team-blue: #6687bf;
--q3-black: #394136;
--q3-red: #c14d48;
--q3-green: #5b8d36;
--q3-yellow: #ccad36;
--q3-blue: #4e82d6;
--q3-cyan: #4aa7ab;
--q3-magenta: #a564a2;
--q3-white: #ffffff;
--q3-orange: #d08136;
--q3-gray: #8d9386;
}
body.theme-spring-blossom {
--bg-primary: #fff5f4;
--bg-secondary: #fffdf9;
--bg-tertiary: #fbe8e6;
--bg-hover: #f7ddd9;
--border: #e8c8c3;
--border-light: #f0d8d3;
--text-primary: #3a2729;
--text-secondary: #7c5f62;
--text-muted: #a08689;
--accent: #b55f6d;
--accent-dim: #cb8a95;
--team-red: #cf6660;
--team-blue: #6d8ec1;
--q3-black: #463537;
--q3-red: #d1514a;
--q3-green: #6ea34e;
--q3-yellow: #d3b14e;
--q3-blue: #5d88d7;
--q3-cyan: #59aeb0;
--q3-magenta: #c06cab;
--q3-white: #ffffff;
--q3-orange: #d88645;
--q3-gray: #938183;
}
body.theme-spring-rain {
--bg-primary: #eef5f2;
--bg-secondary: #f8fcfa;
--bg-tertiary: #e1ece8;
--bg-hover: #d4e3dd;
--border: #bdd1ca;
--border-light: #d3e1dc;
--text-primary: #233235;
--text-secondary: #5c7576;
--text-muted: #849597;
--accent: #3f7d74;
--accent-dim: #69a097;
--team-red: #ca736a;
--team-blue: #5f87c5;
--q3-black: #334143;
--q3-red: #c2574f;
--q3-green: #4f965c;
--q3-yellow: #c9b24c;
--q3-blue: #4d86dc;
--q3-cyan: #3fa9b4;
--q3-magenta: #a966b1;
--q3-white: #ffffff;
--q3-orange: #cf8547;
--q3-gray: #7d9190;
}
body.theme-spring-sunrise {
--bg-primary: #fff7ec;
--bg-secondary: #fffdf7;
--bg-tertiary: #f9ebcf;
--bg-hover: #f4dfba;
--border: #e5cda3;
--border-light: #efdcbc;
--text-primary: #34281e;
--text-secondary: #7a6654;
--text-muted: #9e8a78;
--accent: #b8752f;
--accent-dim: #cf9b67;
--team-red: #c7655f;
--team-blue: #6787c1;
--q3-black: #45392e;
--q3-red: #c7534d;
--q3-green: #6f9a42;
--q3-yellow: #cea63a;
--q3-blue: #4f83d5;
--q3-cyan: #4ba9aa;
--q3-magenta: #ab68a6;
--q3-white: #ffffff;
--q3-orange: #d07b31;
--q3-gray: #8e8377;
}
body.theme-spring-moss-dusk {
--bg-primary: #101612;
--bg-secondary: #161d18;
--bg-tertiary: #1f2822;
--bg-hover: #2a352d;
--border: #364239;
--border-light: #445147;
--text-primary: #dae5d7;
--text-secondary: #9eb19a;
--text-muted: #74846f;
--accent: #88a95d;
--accent-dim: #6f894d;
--team-red: #d3726d;
--team-blue: #7195d2;
--q3-black: #586456;
--q3-red: #d85a53;
--q3-green: #79b650;
--q3-yellow: #ddbf53;
--q3-blue: #66a0f0;
--q3-cyan: #59b9be;
--q3-magenta: #c57bbf;
--q3-white: #ffffff;
--q3-orange: #dc9650;
--q3-gray: #93a08e;
}
body.theme-spring-blossom-night {
--bg-primary: #171215;
--bg-secondary: #20181c;
--bg-tertiary: #2b2026;
--bg-hover: #382930;
--border: #4a373f;
--border-light: #5b434d;
--text-primary: #efe1e5;
--text-secondary: #b99aa1;
--text-muted: #90757c;
--accent: #d28697;
--accent-dim: #b76d7d;
--team-red: #dc7771;
--team-blue: #7692d0;
--q3-black: #5d4d52;
--q3-red: #db5f56;
--q3-green: #82b768;
--q3-yellow: #dfbf61;
--q3-blue: #6798ec;
--q3-cyan: #61b8bd;
--q3-magenta: #d07cc2;
--q3-white: #ffffff;
--q3-orange: #df9654;
--q3-gray: #a08f94;
}
body.theme-spring-rain-storm {
--bg-primary: #0f1719;
--bg-secondary: #152025;
--bg-tertiary: #1d2b30;
--bg-hover: #27373d;
--border: #365059;
--border-light: #45636c;
--text-primary: #dce8e7;
--text-secondary: #9eb5b3;
--text-muted: #708785;
--accent: #6aa9a0;
--accent-dim: #4f8b84;
--team-red: #d3766d;
--team-blue: #74a0db;
--q3-black: #57686a;
--q3-red: #d65e56;
--q3-green: #62b27a;
--q3-yellow: #d7c05b;
--q3-blue: #67a1f1;
--q3-cyan: #5ec1cf;
--q3-magenta: #bc79cb;
--q3-white: #ffffff;
--q3-orange: #db9452;
--q3-gray: #8ea4a1;
}
body.theme-spring-sunrise-ember {
--bg-primary: #17120d;
--bg-secondary: #221a14;
--bg-tertiary: #2d241c;
--bg-hover: #393026;
--border: #4f4131;
--border-light: #604d3c;
--text-primary: #efe1cf;
--text-secondary: #bea78d;
--text-muted: #907c69;
--accent: #d39b52;
--accent-dim: #b9813f;
--team-red: #d8736c;
--team-blue: #7393d0;
--q3-black: #67584a;
--q3-red: #d65f54;
--q3-green: #86b256;
--q3-yellow: #e0bb4f;
--q3-blue: #699ae9;
--q3-cyan: #5db8bb;
--q3-magenta: #c17ab7;
--q3-white: #ffffff;
--q3-orange: #e19548;
--q3-gray: #a09284;
}