/* Contact Page Dark Mode Styles */

[data-theme="dark"] .contact-container {
  background-color: #121212;
  color: #e0e0e0;
}

[data-theme="dark"] .contact-info {
  background-color: #1a1a1a;
  color: #f0f0f0;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  border: 1px solid #333;
}

[data-theme="dark"] .contact-info p {
  color: #bbb;
}

[data-theme="dark"] .contact-item i {
  background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .contact-form-container {
  background-color: #1e1e1e;
  color: #e0e0e0;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  border: 1px solid #333;
}

[data-theme="dark"] .contact-form-container h2 {
  color: #f0f0f0;
}

[data-theme="dark"] .form-group label {
  color: #bbb;
}

[data-theme="dark"] .form-group input,
[data-theme="dark"] .form-group select,
[data-theme="dark"] .form-group textarea {
  background-color: #2d2d2d;
  border-color: #444;
  color: #e0e0e0;
}

[data-theme="dark"] .form-group input:focus,
[data-theme="dark"] .form-group select:focus,
[data-theme="dark"] .form-group textarea:focus {
  border-color: #555;
  box-shadow: 0 0 0 2px rgba(74, 74, 74, 0.3);
  background-color: #333;
  color: #f0f0f0;
}

[data-theme="dark"] .submit-btn {
  background-color: #4a4a4a;
  color: #f0f0f0;
  border: 1px solid #555;
}

[data-theme="dark"] .submit-btn:hover {
  background-color: #666;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .map-container {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  border: 1px solid #333;
}

[data-theme="dark"] .alert {
  background-color: #2d2d2d;
  border-color: #333;
}

[data-theme="dark"] .alert-success {
  background-color: rgba(76, 175, 80, 0.1);
  border-left: 4px solid #4caf50;
  color: #4caf50;
}

[data-theme="dark"] .alert-danger {
  background-color: rgba(244, 67, 54, 0.1);
  border-left: 4px solid #f44336;
  color: #f44336;
}

/* Responsive styles */
@media (max-width: 992px) {
  [data-theme="dark"] .contact-info,
  [data-theme="dark"] .contact-form-container {
    padding: 30px;
  }
}

@media (max-width: 768px) {
  [data-theme="dark"] .contact-info,
  [data-theme="dark"] .contact-form-container {
    padding: 25px;
  }
}

@media (max-width: 576px) {
  [data-theme="dark"] .contact-info,
  [data-theme="dark"] .contact-form-container {
    padding: 20px;
  }
}