/* Theme System using CSS Variables */

:root {
  /* Default - Midnight Blue */
  --primary-color: #0a2463;
  --secondary-color: #0e3a43;
  --accent-color: #00d4ff;
  --success-color: #0edd8f;
  --bg-light: #0d1520;
  --text-dark: #e0e0e0;
  --card-bg: #162240;
  --navbar-bg: #000a15;
}

/* Theme 1: Professional Navy - Navy & Gold */
body.theme-professional-navy {
  --primary-color: #001f3f;
  --secondary-color: #708090;
  --accent-color: #ffc107;
  --success-color: #28a745;
  --bg-light: #f8f9fa;
  --text-dark: #222;
  --card-bg: #ffffff;
  --navbar-bg: #001f3f;
}

/* Theme 2: Modern Gray - Gray & Navy with Silver */
body.theme-modern-gray {
  --primary-color: #2c3e50;
  --secondary-color: #95a5a6;
  --accent-color: #c0c0c0;
  --success-color: #27ae60;
  --bg-light: #ecf0f1;
  --text-dark: #2c3e50;
  --card-bg: #ffffff;
  --navbar-bg: #2c3e50;
}

/* Theme 3: Classic Navy - Traditional Navy & Charcoal with Brass */
body.theme-classic-navy {
  --primary-color: #003d7a;
  --secondary-color: #36454f;
  --accent-color: #b8860b;
  --success-color: #2d5016;
  --bg-light: #f5f5f5;
  --text-dark: #2f4f4f;
  --card-bg: #fafafa;
  --navbar-bg: #003d7a;
}

/* Theme 4: Electric Blue - Black with Vibrant Electric Blue */
body.theme-electric-blue {
  --primary-color: #0066ff;
  --secondary-color: #1a1a1a;
  --accent-color: #00d4ff;
  --success-color: #00ff88;
  --bg-light: #0f0f0f;
  --text-dark: #ffffff;
  --card-bg: #1a1a1a;
  --navbar-bg: #000000;
}

/* Theme 5: Midnight Blue - Dark with Deep Blue & Cyan */
body.theme-midnight-blue {
  --primary-color: #0a2463;
  --secondary-color: #0e3a43;
  --accent-color: #00d4ff;
  --success-color: #0edd8f;
  --bg-light: #0d1520;
  --text-dark: #e0e0e0;
  --card-bg: #162240;
  --navbar-bg: #000a15;
}

/* Theme 6: Urban Tech - Black with Vibrant Blue & White */
body.theme-urban-tech {
  --primary-color: #1e88e5;
  --secondary-color: #121212;
  --accent-color: #ffffff;
  --success-color: #00e676;
  --bg-light: #212121;
  --text-dark: #ffffff;
  --card-bg: #1e1e1e;
  --navbar-bg: #000000;
}

/* Apply theme colors to elements */
.navbar {
  background-color: var(--navbar-bg) !important;
}

.btn-primary {
  background-color: var(--primary-color) !important;
  border-color: var(--primary-color) !important;
}

.btn-primary:hover {
  background-color: var(--secondary-color) !important;
  border-color: var(--secondary-color) !important;
}

.btn-outline-primary {
  color: var(--primary-color) !important;
  border-color: var(--primary-color) !important;
}

.btn-outline-primary:hover {
  background-color: var(--primary-color) !important;
  border-color: var(--primary-color) !important;
}

.btn-warning {
  background-color: var(--accent-color) !important;
  border-color: var(--accent-color) !important;
  color: #000 !important;
}

.btn-warning:hover {
  opacity: 0.9;
}

.hero-section {
  background-color: var(--navbar-bg) !important;
}

.services-overview {
  background: linear-gradient(135deg, var(--card-bg) 0%, var(--bg-light) 100%) !important;
}

.services-overview .card {
  background-color: var(--card-bg) !important;
  color: var(--text-dark) !important;
}

.services-overview i {
  background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%) !important;
}

.card {
  background-color: var(--card-bg) !important;
  color: var(--text-dark) !important;
  border-color: var(--secondary-color) !important;
}

.card-title {
  color: var(--text-dark) !important;
}

.card-body {
  background-color: var(--card-bg) !important;
}

.text-muted {
  color: var(--secondary-color) !important;
}

.text-warning {
  color: var(--accent-color) !important;
}

.bg-light {
  background-color: var(--bg-light) !important;
}

.bg-dark {
  background-color: var(--navbar-bg) !important;
}

.cta-section {
  background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%) !important;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--text-dark) !important;
}

body {
  background-color: var(--bg-light) !important;
  color: var(--text-dark) !important;
}

.hero-section h1 {
  color: #ffffff !important;
}

.hero-section .lead {
  color: #ffffff !important;
}

.footer {
  background-color: var(--navbar-bg) !important;
  border-top-color: var(--secondary-color) !important;
}

.footer a {
  color: var(--accent-color) !important;
}

.filter-btn.active {
  background-color: var(--primary-color) !important;
}

.services-overview .card:hover {
  border-color: var(--accent-color) !important;
}

.carousel-indicators button.active {
  background-color: var(--accent-color) !important;
}

/* Dark theme text adjustments */
body.theme-electric-blue,
body.theme-midnight-blue,
body.theme-urban-tech {
  background-color: var(--bg-light) !important;
}

body.theme-electric-blue .text-muted,
body.theme-midnight-blue .text-muted,
body.theme-urban-tech .text-muted {
  color: #b0b0b0 !important;
}

body.theme-electric-blue .card,
body.theme-midnight-blue .card,
body.theme-urban-tech .card {
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3) !important;
}
