/* ==========================================
   MOBILE TOUCH TARGET OPTIMIZATION
   Mindestgröße: 44px × 44px (Apple HIG)
   ========================================== */

/* Buttons - Minimum Touch Target Size */
.button,
.btn,
a.button,
button {
    min-height: 44px;
    min-width: 44px;
    padding: 12px 20px;
}

/* Wichtige Buttons größer auf Mobile */
@media (max-width: 768px) {
    .button.primary,
    .button.secondary,
    .button.whatsapp {
        min-height: 48px;
        padding: 14px 24px;
        font-size: 1rem;
    }

    /* Trust-Bar Touch-Optimierung */
    .trust-item {
        min-height: 36px;
        padding: 6px 8px;
    }

    /* Header Actions Touch-Optimierung */
    .header-actions .action,
    .header-actions .lang-switch {
        min-height: 44px;
        min-width: 44px;
        padding: 10px 12px;
    }

    /* Navigation Touch-Optimierung */
    .nav-list a {
        min-height: 44px;
        padding: 12px 14px;
        display: flex;
        align-items: center;
    }

    /* Form Inputs Touch-Optimierung */
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    textarea,
    select {
        min-height: 44px;
        padding: 12px 16px;
        font-size: 16px; /* Verhindert Auto-Zoom auf iOS */
    }

    /* Checkboxen & Radio Buttons größer */
    input[type="checkbox"],
    input[type="radio"] {
        width: 28px;
        height: 28px;
        margin: 8px;
        cursor: pointer;
    }

    /* Custom Checkbox Labels */
    input[type="checkbox"] + label,
    input[type="radio"] + label {
        min-height: 44px;
        display: flex;
        align-items: center;
        padding: 8px;
        cursor: pointer;
    }

    /* Kostenrechner Checkboxen */
    .cost-item.optional-cost {
        min-height: 52px;
        padding: 8px 12px;
    }

    .cost-item input[type="checkbox"] {
        width: 32px;
        height: 32px;
        margin-right: 12px;
    }

    /* Toggle Buttons größer */
    .preis-toggle-btn,
    #toggleDetails {
        min-height: 48px;
        padding: 14px 20px;
        font-size: 1rem;
        touch-action: manipulation; /* Schnelleres Tap-Response */
    }

    /* Links mit Icons */
    a[href^="tel:"],
    a[href^="mailto:"],
    a[href^="https://wa.me/"] {
        min-height: 44px;
        padding: 10px 16px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
    }

    /* Image Gallery Touch */
    .image-gallery button,
    .gallery-nav button {
        min-width: 48px;
        min-height: 48px;
        padding: 12px;
    }

    /* Dropdown Sub-Menu Items */
    .sub-menu a {
        min-height: 48px;
        padding: 12px 20px;
    }

    /* Cards & Clickable Areas */
    .property-card,
    .card {
        padding: 16px;
        border-radius: 12px;
    }

    /* Vermeidung zu enger Abstände */
    .booking-buttons {
        gap: 12px;
        flex-direction: column;
        width: 100%;
    }

    .booking-buttons .button {
        width: 100%;
        justify-content: center;
    }
}

/* Extra Small Mobile (< 400px) */
@media (max-width: 400px) {
    .button {
        font-size: 0.9rem;
        padding: 12px 16px;
    }

    .trust-bar-inner {
        gap: 8px;
    }

    .trust-item {
        font-size: 0.75rem;
    }
}

/* Tablet Optimization (768px - 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
    .button {
        min-height: 42px;
        padding: 10px 18px;
    }

    input[type="checkbox"],
    input[type="radio"] {
        width: 24px;
        height: 24px;
    }
}

/* ==========================================
   ACCESSIBILITY IMPROVEMENTS
   ========================================== */

/* Größerer Focus State für Tastatur-Navigation */
*:focus {
    outline: 3px solid #194b67;
    outline-offset: 3px;
}

/* Skip-Links für Tastatur-Nutzer */
.skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: #194b67;
    color: white;
    padding: 12px 20px;
    text-decoration: none;
    z-index: 10000;
}

.skip-link:focus {
    top: 0;
}

/* Tap Highlight entfernen (für sauberes Design) */
* {
    -webkit-tap-highlight-color: rgba(25, 75, 103, 0.2);
    tap-highlight-color: rgba(25, 75, 103, 0.2);
}

/* Smooth Scrolling */
html {
    scroll-behavior: smooth;
}

/* ==========================================
   PERFORMANCE OPTIMIZATIONS
   ========================================== */

/* Verhindert Layout Shifts */
img,
video,
iframe {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Hardware Acceleration für Buttons */
.button,
.btn {
    transform: translateZ(0);
    will-change: transform;
}

/* Touch-Action Optimierung */
.scrollable {
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
}

/* Verhindert Double-Tap Zoom auf Buttons */
button,
a.button,
.button {
    touch-action: manipulation;
}
