
.theme-light {
    --bg-primary: #f8fafc;
    --bg-secondary: #f1f5f9;
    --bg-tertiary: #e2e8f0;
    --bg-image: url('../images/backgrounds/light.png');
    --text-primary: #0f172a;
    --text-secondary: #334155;
    --text-tertiary: #64748b;
    --text-muted: #94a3b8;
    --border-color: rgba(15, 23, 42, 0.08);
    --border-strong: rgba(15, 23, 42, 0.16);
    --card-bg: rgba(255, 255, 255, 0.7);
    --card-shadow: 0 8px 32px 0 rgba(148, 163, 184, 0.12);
    --input-bg: rgba(255, 255, 255, 0.8);
    --input-border: rgba(15, 23, 42, 0.12);
    --input-focus: var(--primary);
    --hover-bg: rgba(15, 23, 42, 0.04);
    --table-bg: rgba(255, 255, 255, 0.5);
    --table-hover-bg: rgba(15, 23, 42, 0.02);
    --table-stripe-bg: rgba(15, 23, 42, 0.01);
    --link-color: #7c3aed;
    --link-hover: #6d28d9;
    --dropdown-bg: rgba(255, 255, 255, 0.95);
    --dropdown-text: #0f172a;
    --dropdown-hover-bg: #f1f5f9;
    --navbar-bg: rgba(255, 255, 255, 0.8);
    --navbar-text: #334155;
    --badge-opacity: 1;

    --primary: #7c3aed;
    --primary-hover: #6d28d9;
    --primary-light: #a78bfa;
    --primary-dark: #5b21b6;
    --secondary: #db2777;
    --secondary-hover: #be185d;
    --glow-color: rgba(124, 58, 237, 0.15);
    --hero-bg-glow: radial-gradient(circle at 50% 0%, rgba(124, 58, 237, 0.08) 0%, rgba(219, 39, 119, 0.01) 70%, transparent 100%);
}

.theme-dark {
    --bg-primary: #050609;
    --bg-secondary: #0a0c12;
    --bg-tertiary: #111420;
    --bg-image: url('../images/backgrounds/dark.jpg');
    --text-primary: #f8fafc;
    --text-secondary: #cbd5e1;
    --text-tertiary: #94a3b8;
    --text-muted: #64748b;
    --border-color: rgba(255, 255, 255, 0.06);
    --border-strong: rgba(255, 255, 255, 0.12);
    --card-bg: rgba(10, 12, 18, 0.6);
    --card-shadow: 0 16px 40px 0 rgba(0, 0, 0, 0.4);
    --input-bg: rgba(17, 20, 32, 0.5);
    --input-border: rgba(255, 255, 255, 0.08);
    --input-focus: #c084fc;
    --hover-bg: rgba(255, 255, 255, 0.04);
    --table-bg: transparent;
    --table-hover-bg: rgba(255, 255, 255, 0.02);
    --table-stripe-bg: rgba(255, 255, 255, 0.01);
    --link-color: #c084fc;
    --link-hover: #d8b4fe;
    --dropdown-bg: rgba(10, 12, 18, 0.95);
    --dropdown-text: #f8fafc;
    --dropdown-hover-bg: rgba(255, 255, 255, 0.06);
    --navbar-bg: rgba(10, 12, 18, 0.75);
    --navbar-text: #cbd5e1;
    --badge-opacity: 1;

    --primary: #a855f7;
    --primary-hover: #9333ea;
    --primary-light: #c084fc;
    --primary-dark: #7e22ce;
    --secondary: #ec4899;
    --secondary-hover: #db2777;
    --glow-color: rgba(168, 85, 247, 0.3);
    --hero-bg-glow: radial-gradient(circle at 50% 0%, rgba(168, 85, 247, 0.18) 0%, rgba(236, 72, 153, 0.02) 60%, transparent 100%);
}

.theme-pink {
    --bg-primary: #060308;
    --bg-secondary: #0d0612;
    --bg-tertiary: #170a20;
    --bg-image: url('../images/backgrounds/pink.jpg');
    --text-primary: #fdf6fd;
    --text-secondary: #ebd7ee;
    --text-tertiary: #c2a6c7;
    --text-muted: #8b6b90;
    --border-color: rgba(236, 72, 153, 0.08);
    --border-strong: rgba(236, 72, 153, 0.16);
    --card-bg: rgba(13, 6, 18, 0.6);
    --card-shadow: 0 16px 40px 0 rgba(0, 0, 0, 0.45);
    --input-bg: rgba(23, 10, 32, 0.5);
    --input-border: rgba(236, 72, 153, 0.1);
    --input-focus: #f472b6;
    --hover-bg: rgba(236, 72, 153, 0.04);
    --table-bg: transparent;
    --table-hover-bg: rgba(236, 72, 153, 0.02);
    --table-stripe-bg: rgba(236, 72, 153, 0.01);
    --link-color: #f472b6;
    --link-hover: #f9a8d4;
    --dropdown-bg: rgba(13, 6, 18, 0.95);
    --dropdown-text: #fdf6fd;
    --dropdown-hover-bg: rgba(236, 72, 153, 0.06);
    --navbar-bg: rgba(13, 6, 18, 0.75);
    --navbar-text: #ebd7ee;
    --badge-opacity: 1;

    --primary: #ec4899;
    --primary-hover: #db2777;
    --primary-light: #f472b6;
    --primary-dark: #be185d;
    --secondary: #a855f7;
    --secondary-hover: #9333ea;
    --glow-color: rgba(236, 72, 153, 0.3);
    --hero-bg-glow: radial-gradient(circle at 50% 0%, rgba(236, 72, 153, 0.2) 0%, rgba(168, 85, 247, 0.02) 60%, transparent 100%);
}

.theme-ocean {
    --bg-primary: #02050c;
    --bg-secondary: #050b18;
    --bg-tertiary: #0b1428;
    --bg-image: url('../images/backgrounds/ocean.jpg');
    --text-primary: #f0f5ff;
    --text-secondary: #cbd5e1;
    --text-tertiary: #94a3b8;
    --text-muted: #64748b;
    --border-color: rgba(6, 182, 212, 0.08);
    --border-strong: rgba(6, 182, 212, 0.16);
    --card-bg: rgba(5, 11, 24, 0.6);
    --card-shadow: 0 16px 40px 0 rgba(0, 0, 0, 0.45);
    --input-bg: rgba(11, 20, 40, 0.5);
    --input-border: rgba(6, 182, 212, 0.1);
    --input-focus: #22d3ee;
    --hover-bg: rgba(6, 182, 212, 0.04);
    --table-bg: transparent;
    --table-hover-bg: rgba(6, 182, 212, 0.02);
    --table-stripe-bg: rgba(6, 182, 212, 0.01);
    --link-color: #22d3ee;
    --link-hover: #67e8f9;
    --dropdown-bg: rgba(5, 11, 24, 0.95);
    --dropdown-text: #f0f5ff;
    --dropdown-hover-bg: rgba(6, 182, 212, 0.06);
    --navbar-bg: rgba(5, 11, 24, 0.75);
    --navbar-text: #cbd5e1;
    --badge-opacity: 1;

    --primary: #06b6d4;
    --primary-hover: #0891b2;
    --primary-light: #22d3ee;
    --primary-dark: #0e7490;
    --secondary: #3b82f6;
    --secondary-hover: #2563eb;
    --glow-color: rgba(6, 182, 212, 0.3);
    --hero-bg-glow: radial-gradient(circle at 50% 0%, rgba(6, 182, 212, 0.2) 0%, rgba(59, 130, 246, 0.02) 60%, transparent 100%);
}

.theme-emerald {
    --bg-primary: #020403;
    --bg-secondary: #040907;
    --bg-tertiary: #08130f;
    --bg-image: url('../images/backgrounds/emerald.png');
    --text-primary: #f0fdf4;
    --text-secondary: #cbd5e1;
    --text-tertiary: #94a3b8;
    --text-muted: #64748b;
    --border-color: rgba(16, 185, 129, 0.08);
    --border-strong: rgba(16, 185, 129, 0.16);
    --card-bg: rgba(4, 9, 7, 0.6);
    --card-shadow: 0 16px 40px 0 rgba(0, 0, 0, 0.45);
    --input-bg: rgba(8, 19, 15, 0.5);
    --input-border: rgba(16, 185, 129, 0.1);
    --input-focus: #34d399;
    --hover-bg: rgba(16, 185, 129, 0.04);
    --table-bg: transparent;
    --table-hover-bg: rgba(16, 185, 129, 0.02);
    --table-stripe-bg: rgba(16, 185, 129, 0.01);
    --link-color: #34d399;
    --link-hover: #6ee7b7;
    --dropdown-bg: rgba(4, 9, 7, 0.95);
    --dropdown-text: #f0fdf4;
    --dropdown-hover-bg: rgba(16, 185, 129, 0.06);
    --navbar-bg: rgba(4, 9, 7, 0.75);
    --navbar-text: #cbd5e1;
    --badge-opacity: 1;

    --primary: #10b981;
    --primary-hover: #059669;
    --primary-light: #34d399;
    --primary-dark: #047857;
    --secondary: #84cc16;
    --secondary-hover: #65a30d;
    --glow-color: rgba(16, 185, 129, 0.3);
    --hero-bg-glow: radial-gradient(circle at 50% 0%, rgba(16, 185, 129, 0.2) 0%, rgba(132, 204, 22, 0.02) 60%, transparent 100%);
}
