/* Mobile Responsive */
@media (max-width: 768px) {
    .conversion-funnel {
        margin: 10px;
        padding: 20px;
    }
    
    .funnel-navigation {
        flex-direction: column;
        gap: 10px;
    }
    
    .funnel-navigation .btn {
        width: 100%;
        min-height: 44px; /* Touch-friendly */
        min-width: 44px;
    }
    
    .radio-group, .checkbox-group {
        grid-template-columns: 1fr;
    }
    
    /* Touch-friendly Form Elements */
    .form-group input, .form-group select, .form-group textarea {
        min-height: 44px;
        font-size: 16px; /* Prevents zoom on iOS */
    }
    
    .radio-option, .checkbox-option {
        min-height: 44px;
        padding: 12px;
    }
    
    /* Progressive Disclosure Mobile */
    .form-group[style*="display: none"] {
        display: none !important;
    }
    
    /* Swipe Navigation Hints */
    .funnel-step::before {
        content: "← Swipe für Navigation →";
        display: block;
        text-align: center;
        font-size: 12px;
        color: #6c757d;
        margin-bottom: 10px;
    }
}

/* Topic-spezifische Mobile-Optimierungen */
@media (max-width: 768px) {
    /* Heilkraft & THP - Größere Buttons für ältere Zielgruppe */
    [data-topic="heilkraft"] .btn,
    [data-topic="thp"] .btn,
    [data-topic="senioren-tierpflege"] .btn,
    [data-topic="krankheitsspezifisch"] .btn {
        min-height: 48px;
        font-size: 18px;
    }
    
    /* Hunde & Katzen - Standard Mobile */
    [data-topic="hund-ernaehrung"] .btn,
    [data-topic="katze-ernaehrung"] .btn,
    [data-topic="pferd-ernaehrung"] .btn,
    [data-topic="welpen-ernaehrung"] .btn,
    [data-topic="rassen-spezifisch"] .btn {
        min-height: 44px;
        font-size: 16px;
    }
}

/* Auto-Save Indicator */
.auto-save-indicator {
    position: fixed;
    top: 20px;
    right: 20px;
    background: #28a745;
    color: white;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 12px;
    z-index: 1000;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.auto-save-indicator.show {
    opacity: 1;
}

.auto-save-indicator.saving {
    background: #ffc107;
    color: #212529;
}

.auto-save-indicator.error {
    background: #dc3545;
}

/* Progressive Disclosure Animations */
.form-group {
    transition: all 0.3s ease;
    opacity: 1;
    transform: translateY(0);
}

.form-group.hidden {
    opacity: 0;
    transform: translateY(-10px);
    pointer-events: none;
}

/* Topic-spezifische Farben */
[data-topic="hund-ernaehrung"] .progress-fill {
    background: linear-gradient(90deg, #4a7c59 0%, #28a745 100%);
}

[data-topic="katze-ernaehrung"] .progress-fill {
    background: linear-gradient(90deg, #6f42c1 0%, #e83e8c 100%);
}

[data-topic="heilkraft"] .progress-fill {
    background: linear-gradient(90deg, #fd7e14 0%, #ffc107 100%);
}

[data-topic="pferd-ernaehrung"] .progress-fill {
    background: linear-gradient(90deg, #20c997 0%, #17a2b8 100%);
}

[data-topic="welpen-ernaehrung"] .progress-fill {
    background: linear-gradient(90deg, #ffc107 0%, #fd7e14 100%);
}

[data-topic="thp"] .progress-fill {
    background: linear-gradient(90deg, #6f42c1 0%, #e83e8c 100%);
}

[data-topic="senioren-tierpflege"] .progress-fill {
    background: linear-gradient(90deg, #6c757d 0%, #495057 100%);
}

[data-topic="krankheitsspezifisch"] .progress-fill {
    background: linear-gradient(90deg, #dc3545 0%, #e83e8c 100%);
}

[data-topic="rassen-spezifisch"] .progress-fill {
    background: linear-gradient(90deg, #17a2b8 0%, #6f42c1 100%);
}

[data-topic="general"] .progress-fill {
    background: linear-gradient(90deg, #4a7c59 0%, #28a745 100%);
}