/* Solo2 - Theme System */
/* Dynamic theme definitions, semantic utilities, and light theme overrides */

/* ============================================================
   THEME DEFINITIONS
   ============================================================ */

/* Default: Dark (Indigo) */
:root, [data-theme="dark"] {
    --bg-dark: #0f172a;      /* slate-900 */
    --bg-primary: #1e1b4b;   /* indigo-950 */
    --bg-secondary: #1e3a5f; /* blue-900 tinted */
    --accent: #6366f1;       /* indigo-500 */
    --accent-dark: #4f46e5;  /* indigo-600 */
    --accent-light: #818cf8; /* indigo-400 */
    --text-primary: #ffffff;
    --text-secondary: #a5b4fc;
    --text-muted: #6b7280;
    --card-bg: rgba(255,255,255,0.05);
    --card-border: rgba(255,255,255,0.1);
    --input-bg: rgba(255,255,255,0.1);
    --input-border: rgba(255,255,255,0.2);
}

/* Light theme */
[data-theme="light"] {
    --bg-dark: #f8fafc;      /* slate-50 */
    --bg-primary: #e0e7ff;   /* indigo-100 */
    --bg-secondary: #c7d2fe; /* indigo-200 */
    --accent: #4f46e5;       /* indigo-600 */
    --accent-dark: #4338ca;  /* indigo-700 */
    --accent-light: #6366f1; /* indigo-500 */
    --text-primary: #1e1b4b;
    --text-secondary: #4338ca;
    --text-muted: #6b7280;
    --card-bg: rgba(255,255,255,0.8);
    --card-border: rgba(79,70,229,0.2);
    --input-bg: rgba(255,255,255,0.9);
    --input-border: rgba(79,70,229,0.3);
}

/* Blue theme */
[data-theme="blue"] {
    --bg-dark: #0c1929;      /* dark navy */
    --bg-primary: #0f2942;   /* deep blue */
    --bg-secondary: #1a3a5c; /* blue */
    --accent: #3b82f6;       /* blue-500 */
    --accent-dark: #2563eb;  /* blue-600 */
    --accent-light: #60a5fa; /* blue-400 */
    --text-primary: #ffffff;
    --text-secondary: #93c5fd;
    --text-muted: #64748b;
    --card-bg: rgba(255,255,255,0.05);
    --card-border: rgba(59,130,246,0.2);
    --input-bg: rgba(255,255,255,0.1);
    --input-border: rgba(59,130,246,0.3);
}

/* Solarized theme */
[data-theme="solarized"] {
    --bg-dark: #002b36;      /* base03 */
    --bg-primary: #073642;   /* base02 */
    --bg-secondary: #094452; /* base02 lighter */
    --accent: #2aa198;       /* cyan */
    --accent-dark: #268bd2;  /* blue */
    --accent-light: #93a1a1; /* base1 */
    --text-primary: #fdf6e3; /* base3 */
    --text-secondary: #93a1a1;
    --text-muted: #657b83;
    --card-bg: rgba(7,54,66,0.8);
    --card-border: rgba(42,161,152,0.3);
    --input-bg: rgba(0,43,54,0.8);
    --input-border: rgba(42,161,152,0.4);
}

/* ============================================================
   THEME-AWARE SEMANTIC UTILITIES
   ============================================================ */

/* Text */
.text-theme           { color: var(--text-primary); }
.text-theme-secondary { color: var(--text-secondary); }
.text-theme-muted     { color: var(--text-muted); }

/* Backgrounds */
.bg-theme-primary     { background: var(--bg-primary); }
.bg-theme-secondary   { background: var(--bg-secondary); }
.bg-theme-accent      { background: var(--accent); }
.bg-theme-accent-dark { background: var(--accent-dark); }
.bg-theme-surface     { background: var(--card-bg); }

/* Borders */
.border-theme         { border-color: var(--card-border); }

/* Opacity variants (color-mix) */
.bg-theme-primary\/30    { background: color-mix(in srgb, var(--bg-primary) 30%, transparent); }
.bg-theme-primary\/50    { background: color-mix(in srgb, var(--bg-primary) 50%, transparent); }
.bg-theme-secondary\/20  { background: color-mix(in srgb, var(--bg-secondary) 20%, transparent); }
.bg-theme-secondary\/30  { background: color-mix(in srgb, var(--bg-secondary) 30%, transparent); }
.bg-theme-secondary\/50  { background: color-mix(in srgb, var(--bg-secondary) 50%, transparent); }
.bg-theme-secondary\/90  { background: color-mix(in srgb, var(--bg-secondary) 90%, transparent); }
.bg-theme-accent-dark\/40 { background: color-mix(in srgb, var(--accent-dark) 40%, transparent); }
.bg-theme-accent-dark\/50 { background: color-mix(in srgb, var(--accent-dark) 50%, transparent); }

/* Gradient card */
.bg-theme-gradient-card  { background: linear-gradient(to bottom right, color-mix(in srgb, var(--accent-dark) 50%, transparent), color-mix(in srgb, var(--bg-secondary) 50%, transparent)); }

/* Hover / Focus */
.hover\:text-theme:hover              { color: var(--text-primary); }
.hover\:bg-theme-accent:hover         { background: var(--accent); }
.hover\:bg-theme-accent-dark:hover    { background: var(--accent-dark); }
.focus\:border-theme-accent:focus     { border-color: var(--accent); }

/* ============================================================
   LIGHT THEME OVERRIDES (Tailwind class remapping)
   ============================================================ */

[data-theme="light"] .text-white { color: var(--text-primary) !important; }
[data-theme="light"] .border-white\/10 { border-color: rgba(79, 70, 229, 0.2) !important; }
/* Command Center colors with better contrast */
[data-theme="light"] .text-green-400 { color: #15803d !important; }
[data-theme="light"] .text-yellow-400 { color: #a16207 !important; }
[data-theme="light"] .text-amber-400 { color: #b45309 !important; }
[data-theme="light"] .text-emerald-400 { color: #059669 !important; }
[data-theme="light"] .text-red-400 { color: #dc2626 !important; }
/* Indigo text (used in modal JS files) */
[data-theme="light"] .text-indigo-200 { color: #3730a3 !important; }
[data-theme="light"] .text-indigo-300 { color: #4338ca !important; }
[data-theme="light"] .text-indigo-400 { color: #4f46e5 !important; }
[data-theme="light"] .text-indigo-500 { color: #6366f1 !important; }
/* Panel & modal backgrounds */
[data-theme="light"] .bg-white\/5 { background: rgba(79, 70, 229, 0.08) !important; }
[data-theme="light"] .bg-white\/10 { background: rgba(79, 70, 229, 0.12) !important; }
[data-theme="light"] .bg-indigo-600 { background: var(--accent) !important; }
[data-theme="light"] .hover\:bg-indigo-500:hover { background: var(--accent-light) !important; }
[data-theme="light"] .hover\:bg-indigo-600\/30:hover { background: rgba(79, 70, 229, 0.2) !important; }
[data-theme="light"] .bg-indigo-900\/50 { background: rgba(79, 70, 229, 0.15) !important; }
[data-theme="light"] .bg-indigo-950\/50 { background: rgba(79, 70, 229, 0.1) !important; }
[data-theme="light"] .border-indigo-500\/30 { border-color: rgba(79, 70, 229, 0.3) !important; }
/* Modal border visibility */
[data-theme="light"] .modal-content { border-color: var(--card-border); }