:root {
    --bg-primary: #ffffff;
    --bg-secondary: #f1f5f9;
    --bg-card: #ffffff;
    --text-heading: #1e293b;
    --text-body: #475569;
    --text-muted: #475569;
    --border-color: #e2e8f0;
    --input-text: #1e293b;
    --primary-color: #0891b2;
    --primary-hover: #0e7490;
    --secondary-color: #0f172a;
    --success-color: #10b981;
    --error-color: #ef4444;
    --warning-color: #f59e0b;
    --info-color: #3b82f6;
}

[data-theme='dark'] {
    --bg-primary: #020617;
    --bg-secondary: #0f172a;
    --bg-card: #0f172a;
    --text-heading: #f8fafc;
    --text-body: #94a3b8;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --input-text: #f8fafc;
}

.bg-primary { background-color: var(--bg-primary); }
.bg-secondary { background-color: var(--bg-secondary); }
.bg-card { background-color: var(--bg-card); }
.text-heading { color: var(--text-heading); }
.text-body { color: var(--text-body); }
.text-muted { color: var(--text-muted); }
.border-theme { border-color: var(--border-color); }
.themeable { transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease; }

.bg-cyan-500, .bg-primary-btn { background-color: var(--primary-color) !important; }
.hover\:bg-cyan-400:hover, .hover\:bg-primary-btn:hover { background-color: var(--primary-hover) !important; }
.text-cyan-500, .text-cyan-600 { color: var(--primary-color) !important; }
.border-cyan-500 { border-color: var(--primary-color) !important; }

.bg-green-500 { background-color: var(--success-color) !important; }
.bg-red-500 { background-color: var(--error-color) !important; }
.bg-yellow-500 { background-color: var(--warning-color) !important; }
.bg-blue-500 { background-color: var(--info-color) !important; }
.text-green-500 { color: var(--success-color) !important; }
.text-red-500 { color: var(--error-color) !important; }
.text-yellow-500 { color: var(--warning-color) !important; }
.text-blue-500 { color: var(--info-color) !important; }