/* 
 * Theme-Definitionen für Toolerie
 * Enthält CSS-Variablen für Light- und Dark-Mode
 */

:root {
  --primary-color: #3498db;
  --primary-hover: #2980b9;
  --error-color: #e74c3c;
  --background-color: #f5f5f5;
  --container-color: white;
  --text-color: #333;
  --hint-color: #7f8c8d;
  --favorite-color: #f1c40f;
  --favorite-hover: #f39c12;
  --translation-color: #9b59b6;
  --translation-hover: #8e44ad;
  --card-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  --border-color: #ddd;
  --secondary-bg: #f9f9f9;
  --tab-bg: #e9ecef;
  --slider-track-color: #d1d1d1;
  --slider-thumb-color: #3498db;
  --accent-color: #27ae60;
  --accent-hover: #219955;
}

[data-theme="dark"] {
  --primary-color: #4ea6ea;
  --primary-hover: #3498db;
  --error-color: #e74c3c;
  --background-color: #121212;
  --container-color: #1e1e1e;
  --text-color: #e0e0e0;
  --hint-color: #aaaaaa;
  --favorite-color: #f1c40f;
  --favorite-hover: #f39c12;
  --translation-color: #bb8ecc;
  --translation-hover: #a97bbd;
  --card-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
  --border-color: #444;
  --secondary-bg: #2a2a2a;
  --tab-bg: #2f2f2f;
  --slider-track-color: #555;
  --slider-thumb-color: #4ea6ea;
  --accent-color: #2ecc71;
  --accent-hover: #27ae60;
}