/**
 * themes.css
 * Vorbereitung für Dark Mode und Theme-Switching
 * Projekt: Transparentes Villach
 */

/* ==========================================================================
   Dark Mode (Vorbereitet für spätere Implementation)
   ========================================================================== */

/* 
  Dark Mode wird in einer späteren Iteration implementiert.
  Diese Datei bereitet die Struktur vor.
*/

@media (prefers-color-scheme: dark) {
  /*
  :root {
    --color-text: #E5E5E5;
    --color-text-light: #B0B0B0;
    --color-text-muted: #8A8A8A;
    
    --color-bg: #1A1A1A;
    --color-bg-light: #2A2A2A;
    --color-bg-alt: #333333;
    
    --color-border: #3A3A3A;
    --color-border-light: #2F2F2F;
    
    --color-primary: #FDB913;
    --color-primary-dark: #E5A50F;
    --color-primary-light: #FECA4D;
    
    --color-secondary: #0066CC;
    --color-secondary-light: #3385DB;
    
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -2px rgba(0, 0, 0, 0.3);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.4), 0 10px 10px -5px rgba(0, 0, 0, 0.3);
  }
  
  .site-header {
    background-color: var(--color-bg-light);
  }
  
  .site-footer {
    background-color: #0F0F0F;
  }
  
  .section-hero {
    background: linear-gradient(135deg, #2A2A2A 0%, #1A1A1A 100%);
  }
  */
}

/* ==========================================================================
   Theme Toggle Button (für spätere Implementation)
   ========================================================================== */

/*
.theme-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: var(--spacing-sm);
  background: none;
  border: none;
  cursor: pointer;
  color: var(--color-text);
  border-radius: var(--border-radius-sm);
  transition: background-color var(--transition-fast);
}

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

.theme-toggle:focus {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}

.theme-toggle-icon {
  width: 20px;
  height: 20px;
}
*/

/* ==========================================================================
   High Contrast Mode (für Barrierefreiheit)
   ========================================================================== */

@media (prefers-contrast: high) {
  :root {
    --color-border: #000000;
    --color-border-light: #333333;
  }
  
  .btn-outline {
    border-width: var(--border-width-thick);
  }
  
  .nav-link:focus,
  .btn:focus,
  a:focus {
    outline-width: 3px;
    outline-offset: 3px;
  }
}

/* ==========================================================================
   Reduced Motion (für Barrierefreiheit)
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  
  .spinner {
    animation: none;
    border-top-color: var(--color-primary);
  }
}

/* ==========================================================================
   Print Styles
   ========================================================================== */

@media print {
  /* Verstecke Navigation und Footer beim Drucken */
  .site-header,
  .site-footer,
  .nav-toggle,
  .btn,
  .theme-toggle {
    display: none !important;
  }
  
  /* Optimiere für Druck */
  body {
    background: white;
    color: black;
    font-size: 12pt;
    line-height: 1.5;
  }
  
  .main-content {
    padding: 0;
  }
  
  /* Links anzeigen */
  a[href]:after {
    content: " (" attr(href) ")";
    font-size: 10pt;
    color: #666;
  }
  
  /* Seitenumbrüche */
  h1, h2, h3, h4, h5, h6 {
    page-break-after: avoid;
    page-break-inside: avoid;
  }
  
  .card {
    page-break-inside: avoid;
  }
  
  /* Entferne Schatten und Effekte */
  *,
  *::before,
  *::after {
    box-shadow: none !important;
    text-shadow: none !important;
  }
}