/* PrettyPhoto Mobile Fix - Verbesserte Darstellung auf kleinen Bildschirmen */

/* Mobile Optimierung für Lightbox */
@media screen and (max-width: 768px) {

    /* Lightbox Container vergrößern */
    div.pp_pic_holder {
        width: 95% !important;
        left: 2.5% !important;
        margin: 0 !important;
        max-width: none !important;
    }

    /* Bild-Container vergrößern */
    .pp_content_container {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Bild selbst maximieren */
    .pp_content {
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
        padding: 0 !important;
    }

    img.pp_expand,
    .pp_content img {
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
        max-height: 80vh !important;
        object-fit: contain;
    }

    /* Details Bereich */
    .pp_details {
        width: 100% !important;
    }

    /* Hintergrund anpassen */
    .pp_overlay {
        background: rgba(0, 0, 0, 0.9) !important;
    }

    /* Navigation Buttons besser sichtbar machen */
    a.pp_previous,
    a.pp_next {
        height: 100% !important;
        width: 50px !important;
        opacity: 0.8 !important;
    }

    a.pp_previous:hover,
    a.pp_next:hover {
        opacity: 1 !important;
    }

    /* Schließen Button vergrößern */
    a.pp_close {
        width: 50px !important;
        height: 50px !important;
        font-size: 24px !important;
        right: 5px !important;
        top: 5px !important;
    }

    /* Video Container für mobile Ansicht */
    .pp_content video,
    .pp_content iframe {
        width: 100% !important;
        height: auto !important;
        max-height: 60vh !important;
    }

    #pp_full_res {
        line-height: 0 !important;
    }
}

/* Spezielle Anpassungen für sehr kleine Bildschirme */
@media screen and (max-width: 480px) {
    div.pp_pic_holder {
        width: 98% !important;
        left: 1% !important;
    }

    /* Titel und Beschreibung */
    .pp_details h4 {
        font-size: 14px !important;
        margin: 5px 0 !important;
    }

    /* Social Media Buttons ggf. verkleinern */
    .pp_social {
        font-size: 12px !important;
    }

    /* Navigation vereinfachen */
    .pp_nav {
        margin: 0 !important;
    }
}

/* Landscape Mode auf Smartphones */
@media screen and (max-width: 768px) and (orientation: landscape) {

    img.pp_expand,
    .pp_content img {
        max-height: 85vh !important;
    }

    .pp_details {
        padding: 5px !important;
    }
}