:root {
    /* Purple Theme (Default) */
    --purple-primary-color: #8b26f6;
    --purple-secondary-color: #4f46e5;
    --purple-background-color: #f8f7fd;
    --purple-chat-bg: #ffffff;
    --purple-text-color: #1f2937;
    --purple-border-color: #e5e7eb;
    --purple-gradient-start: #8b5cf6;
    --purple-gradient-end: #6366f1;
    --purple-input-focus-shadow: rgba(124, 58, 237, 0.2);

    --purple-gray-light: #f1f5f9;
    --purple-gray-medium: #cbd5e1;
    --purple-gray-text: #64748b;
    --purple-assistant-text: #1f2937;
    


    /* Blue Ocean Theme */
    --ocean-primary-color: #0ea5e9;
    --ocean-secondary-color: #0284c7;
    --ocean-background-color: #f0f9ff;
    --ocean-chat-bg: #ffffff;
    --ocean-text-color: #0c4a6e;
    --ocean-border-color: #bae6fd;
    --ocean-gradient-start: #0ea5e9;
    --ocean-gradient-end: #0284c7;
    --ocean-input-focus-shadow: rgba(14, 165, 233, 0.2);

    --ocean-gray-light: #f0f9ff;
    --ocean-gray-medium: #bae6fd;
    --ocean-gray-text: #0c4a6e;
    --ocean-assistant-text: #0c4a6e;

    /* Green Nature Theme */
    --nature-primary-color: #10b981;
    --nature-secondary-color: #059669;
    --nature-background-color: #ecfdf5;
    --nature-chat-bg: #ffffff;
    --nature-text-color: #064e3b;
    --nature-border-color: #a7f3d0;
    --nature-gradient-start: #10b981;
    --nature-gradient-end: #059669;
    --nature-input-focus-shadow: rgba(16, 185, 129, 0.2);

    --nature-gray-light: #f0fffa;
    --nature-gray-medium: #bafdea;
    --nature-gray-text: #0c6e5a;
    --nature-assistant-text: #0c6e43;

    /* Rose Theme */
    --rose-primary-color: #ec4899;
    --rose-secondary-color: #db2777;
    --rose-background-color: #fdf2f8;
    --rose-chat-bg: #ffffff;
    --rose-text-color: #831843;
    --rose-border-color: #fbcfe8;
    --rose-gradient-start: #ec4899;
    --rose-gradient-end: #db2777;
    --rose-input-focus-shadow: rgba(236, 72, 153, 0.2);

    --rose-gray-light: #fdf2f8;
    --rose-gray-medium: #fbcfe8;
    --rose-gray-text: #831843;
    --rose-assistant-text: #831843;

    /* Slate Theme */
    --slate-primary-color: #475569;
    --slate-secondary-color: #334155;
    --slate-background-color: #f8fafc;
    --slate-chat-bg: #ffffff;
    --slate-text-color: #0f172a;
    --slate-border-color: #e2e8f0;
    --slate-gradient-start: #475569;
    --slate-gradient-end: #334155;
    --slate-input-focus-shadow: rgba(71, 85, 105, 0.2);

    --slate-gray-light: #f8fafc;
    --slate-gray-medium: #e2e8f0;
    --slate-gray-text: #475569;
    --slate-assistant-text: #0f172a;

    /* Gold Theme */
    --gold-primary-color: #b45309;
    --gold-secondary-color: #92400e;
    --gold-background-color: #fffbeb;
    --gold-chat-bg: #ffffff;
    --gold-text-color: #78350f;
    --gold-border-color: #fcd34d;
    --gold-gradient-start: #b45309;
    --gold-gradient-end: #92400e;
    --gold-input-focus-shadow: rgba(180, 83, 9, 0.2);

    --gold-gray-light: #fffbeb;
    --gold-gray-medium: #fcd34d;
    --gold-gray-text: #92400e;
    --gold-assistant-text: #78350f;

    /* Turquoise Theme */
    --turquoise-primary-color: #0d9488;
    --turquoise-secondary-color: #0f766e;
    --turquoise-background-color: #f0fdfa;
    --turquoise-chat-bg: #ffffff;
    --turquoise-text-color: #134e4a;
    --turquoise-border-color: #5eead4;
    --turquoise-gradient-start: #0d9488;
    --turquoise-gradient-end: #0f766e;
    --turquoise-input-focus-shadow: rgba(13, 148, 136, 0.2);

    --turquoise-gray-light: #f0fdfa;
    --turquoise-gray-medium: #5eead4;
    --turquoise-gray-text: #0f766e;
    --turquoise-assistant-text: #134e4a;

    /* Night Theme */
    --night-primary-color: #7c3aed;
    --night-secondary-color: #6d28d9;
    --night-background-color: #111827;
    --night-chat-bg: #1f2937;
    --night-text-color: #e5e7eb;
    --night-border-color: #374151;
    --night-gradient-start: #7c3aed;
    --night-gradient-end: #6d28d9;
    --night-input-focus-shadow: rgba(124, 58, 237, 0.2);

    --night-gray-light: #374151;
    --night-gray-medium: #4b5563;
    --night-gray-text: #9ca3af;
    --night-assistant-text: #e5e7eb;
    


    /* Default Theme (turquoise) */
    --primary-color: var(--turquoise-primary-color);
    --secondary-color: var(--turquoise-secondary-color);
    --background-color: var(--turquoise-background-color);
    --chat-bg: var(--turquoise-chat-bg);
    --text-color: var(--turquoise-text-color);
    --border-radius: 12px;
    --border-color: var(--turquoise-border-color);
    --gradient-start: var(--turquoise-gradient-start);
    --gradient-end: var(--turquoise-gradient-end);
    --input-focus-shadow: var(--turquoise-input-focus-shadow);

    --gray-light: var(--turquoise-gray-light);
    --gray-medium: var(--turquoise-gray-medium);
    --gray-text: var(--turquoise-gray-text);
    --assistant-text: var(--turquoise-assistant-text);

    --danger-color: #dc2626;
}
  
[data-theme="purple"] {
--primary-color: var(--purple-primary-color);
--secondary-color: var(--purple-secondary-color);
--background-color: var(--purple-background-color);
--chat-bg: var(--purple-chat-bg);
--text-color: var(--purple-text-color);
--border-color: var(--purple-border-color);
--gradient-start: var(--purple-gradient-start);
--gradient-end: var(--purple-gradient-end);
--input-focus-shadow: var(--purple-input-focus-shadow);

--gray-light: var(--purple-gray-light);
--gray-medium: var(--purple-gray-medium);
--gray-text: var(--purple-gray-text);
--assistant-text: var(--purple-assistant-text);

}

[data-theme="ocean"] {
--primary-color: var(--ocean-primary-color);
--secondary-color: var(--ocean-secondary-color);
--background-color: var(--ocean-background-color);
--chat-bg: var(--ocean-chat-bg);
--text-color: var(--ocean-text-color);
/* --border-color: var(--ocean-border-color); */
--border-color: var(--purple-border-color);
--gradient-start: var(--ocean-gradient-start);
--gradient-end: var(--ocean-gradient-end);
--input-focus-shadow: var(--ocean-input-focus-shadow);

--gray-light: var(--purple-gray-light);
--gray-medium: var(--purple-gray-medium);
--gray-text: var(--purple-gray-text);
--assistant-text: var(--purple-assistant-text);

/* --gray-light: var(--ocean-gray-light);
--gray-medium: var(--ocean-gray-medium);
--gray-text: var(--ocean-gray-text);
--assistant-text: var(--ocean-assistant-text); */

}

[data-theme="nature"] {
--primary-color: var(--nature-primary-color);
--secondary-color: var(--nature-secondary-color);
--background-color: var(--nature-background-color);
--chat-bg: var(--nature-chat-bg);
--text-color: var(--nature-text-color);
/* --border-color: var(--nature-border-color); */
--border-color: var(--purple-border-color);
--gradient-start: var(--nature-gradient-start);
--gradient-end: var(--nature-gradient-end);
--input-focus-shadow: var(--nature-input-focus-shadow);

--gray-light: var(--purple-gray-light);
--gray-medium: var(--purple-gray-medium);
--gray-text: var(--purple-gray-text);
--assistant-text: var(--purple-assistant-text);

/* --gray-light: var(--nature-gray-light);
--gray-medium: var(--nature-gray-medium);
--gray-text: var(--nature-gray-text);
--assistant-text: var(--nature-assistant-text); */
}

[data-theme="rose"] {
--primary-color: var(--rose-primary-color);
--secondary-color: var(--rose-secondary-color);
--background-color: var(--rose-background-color);
--chat-bg: var(--rose-chat-bg);
--text-color: var(--rose-text-color);
/* --border-color: var(--rose-border-color); */
--border-color: var(--purple-border-color);
--gradient-start: var(--rose-gradient-start);
--gradient-end: var(--rose-gradient-end);
--input-focus-shadow: var(--rose-input-focus-shadow);

--gray-light: var(--purple-gray-light);
--gray-medium: var(--purple-gray-medium);
--gray-text: var(--purple-gray-text);
--assistant-text: var(--purple-assistant-text);

/* --gray-light: var(--rose-gray-light);
--gray-medium: var(--rose-gray-medium);
--gray-text: var(--rose-gray-text);
--assistant-text: var(--rose-assistant-text); */
}


[data-theme="slate"] {
--primary-color: var(--slate-primary-color);
--secondary-color: var(--slate-secondary-color);
--background-color: var(--slate-background-color);
--chat-bg: var(--slate-chat-bg);
--text-color: var(--slate-text-color);
/* --border-color: var(--slate-border-color); */
--border-color: var(--purple-border-color);
--gradient-start: var(--slate-gradient-start);
--gradient-end: var(--slate-gradient-end);
--input-focus-shadow: var(--slate-input-focus-shadow);

--gray-light: var(--purple-gray-light);
--gray-medium: var(--purple-gray-medium);
--gray-text: var(--purple-gray-text);
--assistant-text: var(--purple-assistant-text);

/* --gray-light: var(--slate-gray-light);
--gray-medium: var(--slate-gray-medium);
--gray-text: var(--slate-gray-text);
--assistant-text: var(--slate-assistant-text); */
}

[data-theme="gold"] {
--primary-color: var(--gold-primary-color);
--secondary-color: var(--gold-secondary-color);
--background-color: var(--gold-background-color);
--chat-bg: var(--gold-chat-bg);
--text-color: var(--gold-text-color);
/* --border-color: var(--gold-border-color); */
--border-color: var(--purple-border-color);
--gradient-start: var(--gold-gradient-start);
--gradient-end: var(--gold-gradient-end);
--input-focus-shadow: var(--gold-input-focus-shadow);

--gray-light: var(--purple-gray-light);
--gray-medium: var(--purple-gray-medium);
--gray-text: var(--purple-gray-text);
--assistant-text: var(--purple-assistant-text);

/* --gray-light: var(--gold-gray-light);
--gray-medium: var(--gold-gray-medium);
--gray-text: var(--gold-gray-text);
--assistant-text: var(--gold-assistant-text); */
}

[data-theme="turquoise"] {
--primary-color: var(--turquoise-primary-color);
--secondary-color: var(--turquoise-secondary-color);
--background-color: var(--turquoise-background-color);
--chat-bg: var(--turquoise-chat-bg);
--text-color: var(--turquoise-text-color);
/* --border-color: var(--turquoise-border-color); */
--border-color: var(--purple-border-color);
--gradient-start: var(--turquoise-gradient-start);
--gradient-end: var(--turquoise-gradient-end);
--input-focus-shadow: var(--turquoise-input-focus-shadow);

--gray-light: var(--purple-gray-light);
--gray-medium: var(--purple-gray-medium);
--gray-text: var(--purple-gray-text);
--assistant-text: var(--purple-assistant-text);

/* --gray-light: var(--turquoise-gray-light);
--gray-medium: var(--turquoise-gray-medium);
--gray-text: var(--turquoise-gray-text);
--assistant-text: var(--turquoise-assistant-text); */
}
  
[data-theme="night"] {
    --primary-color: var(--night-primary-color);
    --secondary-color: var(--night-secondary-color);
    --background-color: var(--night-background-color);
    --chat-bg: var(--night-chat-bg);
    --text-color: var(--night-text-color);
    --border-color: var(--night-border-color);
    --gradient-start: var(--night-gradient-start);
    --gradient-end: var(--night-gradient-end);
    --input-focus-shadow: var(--night-input-focus-shadow);

    --gray-light: var(--night-gray-light);
    --gray-medium: var(--night-gray-medium);
    --gray-text: var(--night-gray-text);
    --assistant-text: var(--night-assistant-text);
}
  