/* Light theme styles (light-theme.css) */
.light-theme {
  --color-bg: #f0f4f8;
  --color-text: #1a365d;
  --color-card-bg: #ffffff;
  --color-border: #d1d9e6;
  --color-nav-bg: #ffffff;
  --color-primary: #1267b7;
  --color-secondary: #0086a7;
  --color-accent: #4caf50;
  --color-heading: #0056b3;
}

body.light-theme {
  background-color: var(--color-bg);
  color: var(--color-text);
}

.light-theme .header_section {
  background-color: var(--color-card-bg);
  border-bottom: 1px solid var(--color-border);
}

.light-theme .navbar-nav {
  background-color: var(--color-card-bg);
}

.light-theme .nav-link {
  color: var(--color-text);
  background-color: var(--color-nav-bg);
  border: 1px solid var(--color-border);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.light-theme .nav-link:hover,
.light-theme .nav-link:focus {
  color: var(--color-primary);
  background-color: rgba(18, 103, 183, 0.1);
  box-shadow: 0 4px 8px rgba(18, 103, 183, 0.2);
}

.light-theme .nav-link.active {
  color: var(--color-primary);
  font-weight: bold;
  background-color: rgba(18, 103, 183, 0.2);
  box-shadow: 0 4px 8px rgba(18, 103, 183, 0.3);
}

.light-theme .footer_section {
  background-color: var(--color-card-bg);
  border-top: 1px solid var(--color-border);
}

.light-theme .profile-pic {
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
}

.light-theme #theme-toggle {
  background-color: var(--color-nav-bg);
  border: 2px solid var(--color-primary);
  color: var(--color-primary);
}

.light-theme #theme-toggle:hover {
  background-color: var(--color-primary);
  color: var(--color-bg);
}

.light-theme .whoami-container {
  background-color: var(--color-card-bg);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.light-theme .project-list li,
.light-theme .pagination,
.light-theme .aivoyager-list li {
  background-color: var(--color-card-bg);
}

.light-theme .insight {
  background-color: rgba(0, 0, 0, 0.05);
}

.light-theme .concept {
  background-color: rgba(0, 0, 0, 0.05);
}

.light-theme .example {
  background-color: rgba(0, 0, 0, 0.05);
}

.light-theme .glow-text {
  text-shadow: 0 0 10px var(--color-primary);
}

.light-theme .neon-border {
  border: 2px solid var(--color-primary);
  box-shadow: 0 0 10px var(--color-primary), inset 0 0 10px var(--color-primary);
}

/* New styles for h2 elements */
.light-theme h2 {
  color: var(--color-secondary);
}

#whoami-link {
  color: var(--color-primary);
  font-weight: bold;
  text-decoration: none;
  transition: color var(--transition-speed), text-shadow var(--transition-speed);
}

#whoami-link:hover {
  color: var(--color-secondary);
  text-shadow: 0 0 8px var(--color-secondary);
}




.light-theme #projects-title {
  color: #11914b;
  font-size: 2.5rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 1rem;
}



.light-theme .project-title a {
  color: var(--color-primary);
  text-decoration: underline;
  font-weight: bold;
  font-size: 1.8rem;
  transition: color var(--transition-speed);
}

.light-theme .project-title a:hover {
  color: var(--color-secondary); 
}


.light-theme .project-snippet {
  font-size: 1rem;
  color: #666666;
  margin-top: 0.2rem;
  line-height: 1.4;
}

.light-theme .project-date {
  font-size: 0.9rem;
  color: #999999;
  opacity: 0.8;
}


.light-theme .project-detail-container {
  background-color: #f9f9f9; /* Light background for light mode */
}

.light-theme .project-detail-title {
  color: var(--color-primary); /* Use the primary color for headings */
}

.light-theme .project-detail-meta {
  color: #666666; /* Darker gray for contrast in light mode */
}