:root {
    /* Default Theme (Indigo/Purple) */
    --color-primary: #4f46e5;      /* indigo-600 */
    --color-primary-light: #818cf8; /* indigo-400 */
    --color-primary-dark: #3730a3;  /* indigo-800 */
    --color-secondary: #9333ea;    /* purple-600 */
    --color-accent: #f59e0b;       /* amber-500 */
    
    --color-background: #f3f4f6;   /* gray-100 */
    --color-surface: #ffffff;      /* white */
    --color-surface-alt: #f8fafc;  /* slate-50 */
    
    --color-text-main: #1f2937;    /* gray-800 */
    --color-text-muted: #6b7280;   /* gray-500 */
    --color-text-inverted: #ffffff; /* white */
    
    --color-border: #e5e7eb;       /* gray-200 */
    --color-border-light: #f3f4f6; /* gray-100 */

    /* Status Colors */
    --color-success: #22c55e;      /* green-500 */
    --color-warning: #eab308;      /* yellow-500 */
    --color-warning-dark: #a16207; /* yellow-700 */
    --color-danger: #ef4444;       /* red-500 */
    --color-info: #3b82f6;         /* blue-500 */
}

[data-theme="dark-gold"] {
    --color-primary: #f59e0b;      /* amber-500 */
    --color-primary-light: #fbbf24; /* amber-400 */
    --color-primary-dark: #b45309;  /* amber-700 */
    --color-secondary: #cbd5e1;    /* slate-300 */
    --color-accent: #3b82f6;       /* blue-500 */
    
    --color-background: #0f172a;   /* slate-900 */
    --color-surface: #1e293b;      /* slate-800 */
    --color-surface-alt: #334155;  /* slate-700 */
    
    --color-text-main: #f8fafc;    /* slate-50 */
    --color-text-muted: #94a3b8;   /* slate-400 */
    --color-text-inverted: #f8fafc; /* ensure icons/text stay visible on dark surfaces */
    
    --color-border: #334155;       /* slate-700 */
    --color-border-light: #1e293b; /* slate-800 */

    /* Status Colors - Adjusted for Dark Mode */
    --color-success: #4ade80;      /* green-400 */
    --color-warning: #facc15;      /* yellow-400 */
    --color-warning-dark: #fef08a; /* yellow-200 - lighter for dark mode text */
    --color-danger: #f87171;       /* red-400 */
    --color-info: #60a5fa;         /* blue-400 */
}

[data-theme="ocean-teal"] {
    --color-primary: #0d9488;      /* teal-600 */
    --color-primary-light: #2dd4bf; /* teal-400 */
    --color-primary-dark: #115e59;  /* teal-800 */
    --color-secondary: #0ea5e9;    /* sky-500 */
    --color-accent: #f43f5e;       /* rose-500 */
    
    --color-background: #f0f9ff;   /* sky-50 */
    --color-surface: #ffffff;      /* white */
    --color-surface-alt: #f0f9ff;  /* sky-50 */
    
    --color-text-main: #134e4a;    /* teal-900 */
    --color-text-muted: #64748b;   /* slate-500 */
    --color-text-inverted: #ffffff; /* white */
    
    --color-border: #ccfbf1;       /* teal-100 */
    --color-border-light: #e0f2fe; /* sky-100 */
}

[data-theme="nigeria-green"] {
    --color-primary: #008751;      /* Nigeria flag green */
    --color-primary-light: #00a862; /* lighter green */
    --color-primary-dark: #006b40;  /* darker green */
    --color-secondary: #ffffff;    /* white from flag */
    --color-accent: #fbbf24;       /* amber accent */
    
    --color-background: #f9fafb;   /* gray-50 */
    --color-surface: #ffffff;      /* white */
    --color-surface-alt: #f0fdf4;  /* green-50 */
    
    --color-text-main: #1f2937;    /* gray-800 */
    --color-text-muted: #6b7280;   /* gray-500 */
    --color-text-inverted: #ffffff; /* white */
    
    --color-border: #d1fae5;       /* green-100 */
    --color-border-light: #dcfce7; /* green-50 */
}

[data-theme="vibrant-orange"] {
    --color-primary: #f97316;      /* orange-500 */
    --color-primary-light: #fb923c; /* orange-400 */
    --color-primary-dark: #c2410c;  /* orange-700 */
    --color-secondary: #facc15;    /* yellow-400 */
    --color-accent: #6366f1;       /* indigo-500 */
    
    --color-background: #fffaf5;   /* very light orange tint */
    --color-surface: #ffffff;      /* white */
    --color-surface-alt: #fff7ed;  /* orange-50 */
    
    --color-text-main: #431407;    /* orange-950 */
    --color-text-muted: #9a3412;   /* orange-700 */
    --color-text-inverted: #ffffff; /* white */
    
    --color-border: #ffedd5;       /* orange-100 */
    --color-border-light: #fff7ed; /* orange-50 */
}

.theme-transition {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}