/**
 * Impressum Generator - Responsive Styles
 * Media Queries für responsive Designs
 * Version: 1.1.0
 */

/* Tablets und kleinere Desktops */
@media screen and (max-width: 992px) {
    .impressum-generator-container {
        padding: 15px;
    }
    
    .form-container {
        padding: 20px;
    }
}

/* Größere Smartphones und Tablets */
@media screen and (max-width: 768px) {
    /* Anpassungen für den Schrittindikator */
    .step-indicator {
        flex-direction: column;
        margin-bottom: 20px;
    }

    .step {
        margin: 5px 0;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding: 10px 15px;
    }
    
    .step::before {
        margin-right: 10px;
    }
    
    /* Anpassungen für Buttons */
    .buttons {
        flex-direction: column;
    }

    .btn {
        margin: 5px 0;
        width: 100%;
        text-align: center;
    }
    
    /* Anpassungen für Tooltips */
    .tooltip {
        width: 200px;
        margin-left: -100px;
    }
    
    /* Größere Eingabefelder für Touch-Geräte */
    .impressum-generator-container input[type="text"],
    .impressum-generator-container input[type="email"],
    .impressum-generator-container input[type="tel"],
    .impressum-generator-container input[type="url"],
    .impressum-generator-container select {
        height: 44px; /* Größere Tappable-Fläche für Touch-Geräte */
    }
    
    /* Anpassungen für die Ergebnisanzeige */
    .result-container {
        max-height: 400px;
    }
}

/* Kleine Smartphones */
@media screen and (max-width: 480px) {
    .impressum-generator-container header h1 {
        font-size: 24px;
    }
    
    .form-step h2 {
        font-size: 20px;
    }
    
    .form-container {
        padding: 15px;
        border-radius: 6px;
    }
    
    /* Kleinere Abstände für begrenzte Bildschirmgröße */
    .form-group {
        margin-bottom: 15px;
    }
    
    /* Anpassungen für Tooltips auf sehr kleinen Bildschirmen */
    .tooltip {
        width: 180px;
        margin-left: -90px;
        font-size: 12px;
        padding: 8px;
    }
    
    /* Kleinere Schrift für die Ergebnisanzeige */
    .result-content {
        font-size: 14px;
    }
    
    /* Anpassungen für die Fortschrittsleiste */
    .progress-container {
        height: 4px;
    }
    
    /* Anpassungen für den Disclaimer */
    .disclaimer {
        font-size: 12px;
        padding: 10px;
    }
}

/* Druckoptimierungen */
@media print {
    .impressum-generator-container {
        max-width: 100%;
        padding: 0;
    }
    
    .step-indicator,
    .buttons,
    .help-icon,
    .form-container {
        display: none !important;
    }
    
    .form-step.active {
        display: none !important;
    }
    
    .result-container {
        border: none;
        padding: 0;
        margin: 0;
        max-height: none;
        overflow: visible;
    }
    
    .result-content {
        font-family: 'Times New Roman', Times, serif;
        font-size: 12pt;
        line-height: 1.4;
    }
    
    .disclaimer {
        display: none;
    }
    
    .impressum-generator-footer {
        font-size: 10pt;
        color: #999;
        border-top: 1px solid #ddd;
        padding-top: 10px;
        margin-top: 20px;
    }
    
    /* Seitenumbruchoptimierungen */
    h1, h2, h3 {
        break-after: avoid;
    }
    
    p, li {
        orphans: 3;
        widows: 3;
    }
}

/* Hohe DPI Bildschirme */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .impressum-generator-container {
        font-smoothing: antialiased;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}

/* Dunkelmodus-Unterstützung */
@media (prefers-color-scheme: dark) {
    .impressum-generator-container {
        /* Keine Dunkelmodus-Stile standardmäßig, 
           kann aber für ein zukünftiges Dark Mode Feature aktiviert werden */
    }
}
