/* 
 * PFL Agro-tec UG Website
 * Dark-Mode Stilvorlage
 */

/* Dark Mode */
.dark-mode {
  /* Grundfarben für Dark Mode */
  --text-dark: #f5f5f5;
  --text-medium: #aaaaaa;
  --text-light: #e0e0e0;
  --bg-light: #121212;
  --bg-medium: #1e1e1e;
  --bg-dark: #0a0a0a;
  
  /* Anpassung der Primär- und Sekundärfarben für besseren Kontrast */
  --primary-color: #5CCA60;
  --primary-dark: #4BB950;
  --primary-light: #B8E8BA;
  
  --secondary-color: #42A5F5;
  --secondary-dark: #2196F3;
  --secondary-light: #BBDEFB;
  
  /* Schatten anpassen für Dark Mode */
  --box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
  
  /* Grundfarben anwenden */
  color: var(--text-dark);
  background-color: var(--bg-light);
}

.dark-mode header {
  background-color: rgba(18, 18, 18, 0.95);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

.dark-mode nav a {
  color: var(--text-light);
}

.dark-mode .mobile-menu-toggle span {
  background: var(--text-light);
}

.dark-mode .service-card,
.dark-mode .contact-form,
.dark-mode .testimonial-content {
  background-color: var(--bg-medium);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}

.dark-mode .about-preview,
.dark-mode .testimonials {
  background-color: var(--bg-dark);
}

/* Sicherstellen, dass die page-hero Sektion schwarz statt grün ist */
.dark-mode .page-hero {
  background-color: var(--bg-dark);
}

.dark-mode input[type="text"],
.dark-mode input[type="email"],
.dark-mode input[type="tel"],
.dark-mode textarea,
.dark-mode select {
  background-color: var(--bg-light);
  border: 1px solid #333;
  color: var(--text-light);
}

.dark-mode input:focus,
.dark-mode textarea:focus,
.dark-mode select:focus {
  border-color: var(--primary-color);
}

.dark-mode .checkmark {
  background-color: var(--bg-light);
  border: 1px solid #333;
}

.dark-mode .cookie-banner {
  background-color: var(--bg-dark);
  border-top: 1px solid #333;
}

/* Verstärkter Schatten für Elemente im Dark Mode */
.dark-mode .project-slide,
.dark-mode .about-image {
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.4);
}

/* Spezielle Anpassungen für bessere Lesbarkeit im Dark Mode */
.dark-mode .service-card h3 {
  color: var(--primary-color);
}

.dark-mode .testimonial-content:before {
  color: rgba(92, 202, 96, 0.2);
}

.dark-mode .footer-col h4:after {
  background-color: var(--primary-color);
}

/* Anpassung der Animationen für Dark Mode */
.dark-mode .animate-in {
  opacity: 0;
  transform: translateY(20px);
}

.dark-mode .animate-in.active {
  opacity: 1;
  transform: translateY(0);
}

/* Dark Mode Mobile Nav */
@media (max-width: 992px) {
  .dark-mode nav {
    background-color: var(--bg-medium);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
  }
}