99fae003-67ce-4295-aeb8-94fcd4f67082/colorThemes.css

/* ============================================ */
/* LIGHT THEME VARIANTS */
/* ============================================ */

/* Light Theme - Minimal */
:root {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #000000e6;
  --primary-cta: #1a1a1a;
  --secondary-cta: #ffffff;
  --accent: #bebebe;
  --background-accent: #c4c4c4;
}

/* Light Theme - Minimal Light Blue */
:root[data-theme="minimal-light-blue"] {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #000a18e6;
  --primary-cta: #409fff;
  --secondary-cta: #ffffff;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
}

/* Light Theme - Minimal Dark Blue */
:root[data-theme="minimal-dark-blue"] {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #000612e6;
  --primary-cta: #15479c;
  --secondary-cta: #ffffff;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
}

/* Light Theme - Minimal Light Green */
:root[data-theme="minimal-light-green"] {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #00120ae6;
  --primary-cta: #15ad59;
  --secondary-cta: #ffffff;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
}

/* Light Theme - Minimal Dark Green */
:root[data-theme="minimal-dark-green"] {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #000f06e6;
  --primary-cta: #0a7039;
  --secondary-cta: #ffffff;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
}

/* Light Theme - Minimal Light Red */
:root[data-theme="minimal-light-red"] {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #120006e6;
  --primary-cta: #e63946;
  --secondary-cta: #ffffff;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
}

/* Light Theme - Minimal Dark Red */
:root[data-theme="minimal-dark-red"] {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #0f0003e6;
  --primary-cta: #c1121f;
  --secondary-cta: #ffffff;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
}

/* Light Theme - Minimal Light Purple */
:root[data-theme="minimal-light-purple"] {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #0a0018e6;
  --primary-cta: #8b5cf6;
  --secondary-cta: #ffffff;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
}

/* Light Theme - Minimal Dark Purple */
:root[data-theme="minimal-dark-purple"] {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #080015e6;
  --primary-cta: #7c3aed;
  --secondary-cta: #ffffff;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
}

/* Light Theme - Minimal Light Orange */
:root[data-theme="minimal-light-orange"] {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #120a00e6;
  --primary-cta: #ff8c42;
  --secondary-cta: #ffffff;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
}

/* Light Theme - Minimal Dark Orange */
:root[data-theme="minimal-dark-orange"] {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #0f0600e6;
  --primary-cta: #e8590c;
  --secondary-cta: #ffffff;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
}

/* Light Theme - Minimal Light Cyan */
:root[data-theme="minimal-light-cyan"] {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #001212e6;
  --primary-cta: #16d4f6;
  --secondary-cta: #ffffff;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
}

/* Light Theme - Minimal Dark Cyan */
:root[data-theme="minimal-dark-cyan"] {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #000f0fe6;
  --primary-cta: #00c9e8;
  --secondary-cta: #ffffff;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
}

/* Light Theme - Minimal Light Yellow */
:root[data-theme="minimal-light-yellow"] {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #121200e6;
  --primary-cta: #ffcf40;
  --secondary-cta: #ffffff;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
}

/* Light Theme - Minimal Dark Yellow */
:root[data-theme="minimal-dark-yellow"] {
  --background: #ffffff;
  --card: #fcfcfc;
  --foreground: #0f0f00e6;
  --primary-cta: #ffae00;
  --secondary-cta: #ffffff;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
}

/* Light Theme - Brutalist Red */
:root[data-theme="brutalist-red"] {
  --background: #ffffff;
  --card: #fafafa;
  --foreground: #000000;
  --primary-cta: #ff0000;
  --secondary-cta: #ffffff;
  --accent: #e5e5e5;
  --background-accent: #f5f5f5;
}

/* Light Theme - Brutalist Blue */
:root[data-theme="brutalist-blue"] {
  --background: #ffffff;
  --card: #fafafa;
  --foreground: #000000;
  --primary-cta: #0066ff;
  --secondary-cta: #ffffff;
  --accent: #e5e5e5;
  --background-accent: #f5f5f5;
}

/* Light Theme - Brutalist Green */
:root[data-theme="brutalist-green"] {
  --background: #ffffff;
  --card: #fafafa;
  --foreground: #000000;
  --primary-cta: #00cc00;
  --secondary-cta: #ffffff;
  --accent: #e5e5e5;
  --background-accent: #f5f5f5;
}

/* Light Theme - Brutalist Purple */
:root[data-theme="brutalist-purple"] {
  --background: #ffffff;
  --card: #fafafa;
  --foreground: #000000;
  --primary-cta: #9933ff;
  --secondary-cta: #ffffff;
  --accent: #e5e5e5;
  --background-accent: #f5f5f5;
}

/* Light Theme - Brutalist Orange */
:root[data-theme="brutalist-orange"] {
  --background: #ffffff;
  --card: #fafafa;
  --foreground: #000000;
  --primary-cta: #ff6600;
  --secondary-cta: #ffffff;
  --accent: #e5e5e5;
  --background-accent: #f5f5f5;
}

/* Light Theme - Brutalist Cyan */
:root[data-theme="brutalist-cyan"] {
  --background: #ffffff;
  --card: #fafafa;
  --foreground: #000000;
  --primary-cta: #00ccff;
  --secondary-cta: #ffffff;
  --accent: #e5e5e5;
  --background-accent: #f5f5f5;
}

/* Light Theme - Brutalist Yellow */
:root[data-theme="brutalist-yellow"] {
  --background: #ffffff;
  --card: #fafafa;
  --foreground: #000000;
  --primary-cta: #ffcc00;
  --secondary-cta: #ffffff;
  --accent: #e5e5e5;
  --background-accent: #f5f5f5;
}

/* Light Theme - Brutalist Pink */
:root[data-theme="brutalist-pink"] {
  --background: #ffffff;
  --card: #fafafa;
  --foreground: #000000;
  --primary-cta: #ff0066;
  --secondary-cta: #ffffff;
  --accent: #e5e5e5;
  --background-accent: #f5f5f5;
}

/* Light Theme - Light Blue */
:root[data-theme="light-blue"] {
  --background: #f8fcff;
  --card: #ffffff;
  --foreground: #00101f;
  --primary-cta: #409fff;
  --secondary-cta: #ffffff;
  --accent: #c7e2fc;
  --background-accent: #9bcfff;
}

/* Light Theme - Dark Blue */
:root[data-theme="dark-blue"] {
  --background: #f5faff;
  --card: #f1f8ff;
  --foreground: #001122;
  --primary-cta: #15479c;
  --secondary-cta: #ffffff;
  --accent: #a8cce8;
  --background-accent: #7ba3cf;
}

/* Light Theme - Dark Green */
:root[data-theme="dark-green"] {
  --background: #fafffb;
  --card: #f7fffa;
  --foreground: #001a0a;
  --primary-cta: #0a7039;
  --secondary-cta: #ffffff;
  --accent: #a8d9be;
  --background-accent: #6bbf8e;
}

/* Light Theme - Light Red */
:root[data-theme="light-red"] {
  --background: #fffafa;
  --card: #fff7f7;
  --foreground: #1a0000;
  --primary-cta: #e63946;
  --secondary-cta: #ffffff;
  --accent: #f5c4c7;
  --background-accent: #f09199;
}

/* Light Theme - Dark Red */
:root[data-theme="dark-red"] {
  --background: #fffcfc;
  --card: #fffafa;
  --foreground: #220000;
  --primary-cta: #c1121f;
  --secondary-cta: #ffffff;
  --accent: #f0b8bc;
  --background-accent: #e07a82;
}

/* Light Theme - Light Purple */
:root[data-theme="light-purple"] {
  --background: #fbfaff;
  --card: #f7f5ff;
  --foreground: #0f0022;
  --primary-cta: #8b5cf6;
  --secondary-cta: #ffffff;
  --accent: #d8cef5;
  --background-accent: #c4a8f9;
}

/* Light Theme - Dark Purple */
:root[data-theme="dark-purple"] {
  --background: #fcfcff;
  --card: #fafaff;
  --foreground: #150022;
  --primary-cta: #7c3aed;
  --secondary-cta: #ffffff;
  --accent: #cfc2f0;
  --background-accent: #ba9bf1;
}

/* Light Theme - Soft Peach */
:root[data-theme="soft-peach"] {
  --background: #fff8f5;
  --card: #fff0eb;
  --foreground: #3d2c29;
  --primary-cta: #e8a090;
  --secondary-cta: #ffffff;
  --accent: #f5d5cc;
  --background-accent: #f0c4b8;
}

/* Light Theme - Soft Lavender */
:root[data-theme="soft-lavender"] {
  --background: #f8f5ff;
  --card: #f0ebff;
  --foreground: #2d2940;
  --primary-cta: #a890e8;
  --secondary-cta: #ffffff;
  --accent: #d5ccf5;
  --background-accent: #c4b8f0;
}

/* Light Theme - Soft Blush */
:root[data-theme="soft-blush"] {
  --background: #fff5f8;
  --card: #ffebf0;
  --foreground: #3d2930;
  --primary-cta: #e890a8;
  --secondary-cta: #ffffff;
  --accent: #f5ccd5;
  --background-accent: #f0b8c4;
}

/* Light Theme - Soft Periwinkle */
:root[data-theme="soft-periwinkle"] {
  --background: #f5f8ff;
  --card: #ebf0ff;
  --foreground: #292d40;
  --primary-cta: #90a8e8;
  --secondary-cta: #ffffff;
  --accent: #ccd5f5;
  --background-accent: #b8c4f0;
}


/* ============================================ */
/* DARK THEME VARIANTS */
/* ============================================ */

/* Dark Theme - Minimal */
:root[data-theme="dark"] {
  --background: #0a0a0a;
  --card: #1a1a1a;
  --foreground: #ffffffe6;
  --primary-cta: #e6e6e6;
  --secondary-cta: #1a1a1a;
  --accent: #737373;
  --background-accent: #737373;
}

/* Dark Theme - Minimal Light Blue */
:root[data-theme="dark-minimal-light-blue"] {
  --background: #0a0a0a;
  --card: #1a1a1a;
  --foreground: #f0f8ffe6;
  --primary-cta: #cee7ff;
  --secondary-cta: #1a1a1a;
  --accent: #737373;
  --background-accent: #737373;
}

/* Dark Theme - Minimal Dark Blue */
:root[data-theme="dark-minimal-dark-blue"] {
  --background: #0a0a0a;
  --card: #1a1a1a;
  --foreground: #f0f5fce6;
  --primary-cta: #3891f6;
  --secondary-cta: #1a1a1a;
  --accent: #737373;
  --background-accent: #737373;
}

/* Dark Theme - Minimal Light Green */
:root[data-theme="dark-minimal-light-green"] {
  --background: #0a0a0a;
  --card: #1a1a1a;
  --foreground: #f5fffae6;
  --primary-cta: #80da9b;
  --secondary-cta: #1a1a1a;
  --accent: #737373;
  --background-accent: #737373;
}

/* Dark Theme - Minimal Dark Green */
:root[data-theme="dark-minimal-dark-green"] {
  --background: #0a0a0a;
  --card: #1a1a1a;
  --foreground: #f0fff8e6;
  --primary-cta: #1cde5d;
  --secondary-cta: #1a1a1a;
  --accent: #737373;
  --background-accent: #737373;
}

/* Dark Theme - Minimal Light Red */
:root[data-theme="dark-minimal-light-red"] {
  --background: #0a0a0a;
  --card: #1a1a1a;
  --foreground: #fff5f5e6;
  --primary-cta: #ff7a7a;
  --secondary-cta: #1a1a1a;
  --accent: #737373;
  --background-accent: #737373;
}

/* Dark Theme - Minimal Dark Red */
:root[data-theme="dark-minimal-dark-red"] {
  --background: #0a0a0a;
  --card: #1a1a1a;
  --foreground: #fff0f0e6;
  --primary-cta: #ff3d4a;
  --secondary-cta: #1a1a1a;
  --accent: #737373;
  --background-accent: #737373;
}

/* Dark Theme - Minimal Light Purple */
:root[data-theme="dark-minimal-light-purple"] {
  --background: #0a0a0a;
  --card: #1a1a1a;
  --foreground: #f8f5ffe6;
  --primary-cta: #c89bff;
  --secondary-cta: #1a1a1a;
  --accent: #737373;
  --background-accent: #737373;
}

/* Dark Theme - Minimal Dark Purple */
:root[data-theme="dark-minimal-dark-purple"] {
  --background: #0a0a0a;
  --card: #1a1a1a;
  --foreground: #f5f0fce6;
  --primary-cta: #b366ff;
  --secondary-cta: #1a1a1a;
  --accent: #737373;
  --background-accent: #737373;
}

/* Dark Theme - Minimal Light Orange */
:root[data-theme="dark-minimal-light-orange"] {
  --background: #0a0a0a;
  --card: #1a1a1a;
  --foreground: #fffaf5e6;
  --primary-cta: #ffaa70;
  --secondary-cta: #1a1a1a;
  --accent: #737373;
  --background-accent: #737373;
}

/* Dark Theme - Minimal Dark Orange */
:root[data-theme="dark-minimal-dark-orange"] {
  --background: #0a0a0a;
  --card: #1a1a1a;
  --foreground: #fff8f0e6;
  --primary-cta: #ff8c42;
  --secondary-cta: #1a1a1a;
  --accent: #737373;
  --background-accent: #737373;
}


/* Dark Theme - Minimal Light Yellow */
:root[data-theme="dark-minimal-light-yellow"] {
  --background: #0a0a0a;
  --card: #1a1a1a;
  --foreground: #fffffae6;
  --primary-cta: #fde047;
  --secondary-cta: #1a1a1a;
  --accent: #737373;
  --background-accent: #737373;
}

/* Dark Theme - Minimal Dark Yellow */
:root[data-theme="dark-minimal-dark-yellow"] {
  --background: #0a0a0a;
  --card: #1a1a1a;
  --foreground: #fffef5e6;
  --primary-cta: #facc15;
  --secondary-cta: #1a1a1a;
  --accent: #737373;
  --background-accent: #737373;
}

/* Dark Theme - Brutalist Red */
:root[data-theme="dark-brutalist-red"] {
  --background: #000000;
  --card: #1b1b1b;
  --foreground: #ffffff;
  --primary-cta: #ff0000;
  --secondary-cta: #151515;
  --accent: #303030;
  --background-accent: #303030;
}

/* Dark Theme - Brutalist Blue */
:root[data-theme="dark-brutalist-blue"] {
  --background: #000000;
  --card: #1b1b1b;
  --foreground: #ffffff;
  --primary-cta: #0066ff;
  --secondary-cta: #151515;
  --accent: #303030;
  --background-accent: #303030;
}

/* Dark Theme - Brutalist Green */
:root[data-theme="dark-brutalist-green"] {
  --background: #000000;
  --card: #1b1b1b;
  --foreground: #ffffff;
  --primary-cta: #00cc00;
  --secondary-cta: #151515;
  --accent: #303030;
  --background-accent: #303030;
}

/* Dark Theme - Brutalist Purple */
:root[data-theme="dark-brutalist-purple"] {
  --background: #000000;
  --card: #1b1b1b;
  --foreground: #ffffff;
  --primary-cta: #9933ff;
  --secondary-cta: #151515;
  --accent: #303030;
  --background-accent: #303030;
}

/* Dark Theme - Brutalist Orange */
:root[data-theme="dark-brutalist-orange"] {
  --background: #000000;
  --card: #1b1b1b;
  --foreground: #ffffff;
  --primary-cta: #ff6600;
  --secondary-cta: #151515;
  --accent: #303030;
  --background-accent: #303030;
}

/* Dark Theme - Brutalist Yellow */
:root[data-theme="dark-brutalist-yellow"] {
  --background: #000000;
  --card: #1b1b1b;
  --foreground: #ffffff;
  --primary-cta: #ffcc00;
  --secondary-cta: #151515;
  --accent: #303030;
  --background-accent: #303030;
}

/* Dark Theme - Brutalist Pink */
:root[data-theme="dark-brutalist-pink"] {
  --background: #000000;
  --card: #1b1b1b;
  --foreground: #ffffff;
  --primary-cta: #ff0066;
  --secondary-cta: #151515;
  --accent: #303030;
  --background-accent: #303030;
}

/* Dark Theme - Light Blue */
:root[data-theme="dark-light-blue"] {
  --background: #010912;
  --card: #152840;
  --foreground: #e6f0ff;
  --primary-cta: #cee7ff;
  --secondary-cta: #0e1a29;
  --accent: #3f5c79;
  --background-accent: #004a93;
}

/* Dark Theme - Dark Blue */
:root[data-theme="dark-dark-blue"] {
  --background: #00070e;
  --card: #152840;
  --foreground: #e6f0ff;
  --primary-cta: #3891f6;
  --secondary-cta: #0e1a29;
  --accent: #3f5c79;
  --background-accent: #016ad3;
}

/* Dark Theme - Light Green */
:root[data-theme="dark-light-green"] {
  --background: #000802;
  --card: #0b1a0b;
  --foreground: #e6ffe6;
  --primary-cta: #80da9b;
  --secondary-cta: #07170b;
  --accent: #38714a;
  --background-accent: #2c6541;
}

/* Dark Theme - Dark Green */
:root[data-theme="dark-dark-green"] {
  --background: #000602;
  --card: #0d1d0d;
  --foreground: #e6ffe6;
  --primary-cta: #1cde5d;
  --secondary-cta: #0a1f0f;
  --accent: #2e6841;
  --background-accent: #0d6b32;
}

/* Dark Theme - Light Red */
:root[data-theme="dark-light-red"] {
  --background: #080000;
  --card: #1e0d0d;
  --foreground: #ffe6e6;
  --primary-cta: #ff7a7a;
  --secondary-cta: #1e0909;
  --accent: #7b4242;
  --background-accent: #65292c;
}

/* Dark Theme - Dark Red */
:root[data-theme="dark-dark-red"] {
  --background: #060000;
  --card: #1d0d0d;
  --foreground: #ffe6e6;
  --primary-cta: #ff3d4a;
  --secondary-cta: #1f0a0a;
  --accent: #7b2d2d;
  --background-accent: #b8111f;
}

/* Dark Theme - Light Purple */
:root[data-theme="dark-light-purple"] {
  --background: #020008;
  --card: #0b1a1d;
  --foreground: #f0e6ff;
  --primary-cta: #c89bff;
  --secondary-cta: #0b0717;
  --accent: #684f7b;
  --background-accent: #65417c;
}

/* Dark Theme - Dark Purple */
:root[data-theme="dark-dark-purple"] {
  --background: #020006;
  --card: #1d0d1d;
  --foreground: #f0e6ff;
  --primary-cta: #b366ff;
  --secondary-cta: #1a0a29;
  --accent: #59437b;
  --background-accent: #6b28d9;
}

/* Dark Theme - Light Orange */
:root[data-theme="dark-light-orange"] {
  --background: #080200;
  --card: #1a0d0b;
  --foreground: #ffe6d5;
  --primary-cta: #ffaa70;
  --secondary-cta: #170b07;
  --accent: #7b5e4a;
  --background-accent: #b8541e;
}

/* Dark Theme - Dark Orange */
:root[data-theme="dark-dark-orange"] {
  --background: #060200;
  --card: #1d0d0b;
  --foreground: #ffe6d5;
  --primary-cta: #ff8c42;
  --secondary-cta: #1f0a00;
  --accent: #7b5337;
  --background-accent: #b8400c;
}

/* Dark Theme - Soft Peach */
:root[data-theme="dark-soft-peach"] {
  --background: #1a1210;
  --card: #2a201d;
  --foreground: #ffe8e0;
  --primary-cta: #e8a090;
  --secondary-cta: #1a1210;
  --accent: #6b4d45;
  --background-accent: #8b5d50;
}

/* Dark Theme - Soft Lavender */
:root[data-theme="dark-soft-lavender"] {
  --background: #121018;
  --card: #1d1a28;
  --foreground: #e8e0ff;
  --primary-cta: #a890e8;
  --secondary-cta: #121018;
  --accent: #4d456b;
  --background-accent: #5d508b;
}

/* Dark Theme - Soft Blush */
:root[data-theme="dark-soft-blush"] {
  --background: #1a1014;
  --card: #2a1d22;
  --foreground: #ffe0e8;
  --primary-cta: #e890a8;
  --secondary-cta: #1a1014;
  --accent: #6b4555;
  --background-accent: #8b5068;
}


/* ============================================ */
/* MULTI-COLOR COMBO THEME VARIANTS */
/* ============================================ */

/* Light - Blue Purple */
:root[data-theme="blue-purple"] {
  --background: #f8faff;
  --card: #f0f4ff;
  --foreground: #1a1a2e;
  --primary-cta: #3b82f6;
  --secondary-cta: #ffffff;
  --accent: #d5c6ff;
  --background-accent: #b394fa;
}

/* Light - Blue Orange */
:root[data-theme="blue-orange"] {
  --background: #f7fafd;
  --card: #eff6fc;
  --foreground: #1a2433;
  --primary-cta: #2563eb;
  --secondary-cta: #ffffff;
  --accent: #f8c093;
  --background-accent: #f5b78b;
}

/* Light - Navy Gold */
:root[data-theme="navy-gold"] {
  --background: #f7f9fc;
  --card: #eff3f8;
  --foreground: #1a2433;
  --primary-cta: #1e3a8a;
  --secondary-cta: #ffffff;
  --accent: #fbbf24;
  --background-accent: #d97706;
}

/* Light - Charcoal Yellow */
:root[data-theme="charcoal-yellow"] {
  --background: #fafafa;
  --card: #f0f0f0;
  --foreground: #1a1a1a;
  --primary-cta: #262626;
  --secondary-cta: #ffffff;
  --accent: #fbbf24;
  --background-accent: #f59e0b;
}

/* Dark - Blue Purple */
:root[data-theme="dark-blue-purple"] {
  --background: #0a0e1a;
  --card: #121626;
  --foreground: #e0e8ff;
  --primary-cta: #3b82f6;
  --secondary-cta: #0a0e1a;
  --accent: #a78bfa;
  --background-accent: #8b5cf6;
}