/**
 * CM Lightbox - Custom Styles for GLightbox
 * Version: 3.0.0
 *
 * @package CmLightbox
 * @since 3.0.0
 */

/* ==========================================================================
   WordPress Gallery Integration
   ========================================================================== */

/**
 * Gallery container styling
 */
.gallery {
    position: relative;
}

/**
 * Gallery items with lightbox
 */
.gallery a.glightbox-gallery {
    position: relative;
    display: inline-block;
    overflow: hidden;
    border-radius: 4px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.gallery a.glightbox-gallery:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/**
 * Gallery images
 */
.gallery a.glightbox-gallery img {
    width: 100%;
    height: auto;
    display: block;
    transition: opacity 0.2s ease;
}

.gallery a.glightbox-gallery:hover img {
    opacity: 0.9;
}

/* ==========================================================================
   Video Links
   ========================================================================== */

/**
 * Video link base styling
 */
a.glightbox-video {
    position: relative;
    display: inline-block;
}

/* ==========================================================================
   Custom Elements
   ========================================================================== */

/**
 * Elements with cm-lightbox class
 */
.cm-lightbox {
    cursor: pointer;
    transition: opacity 0.2s ease;
}

.cm-lightbox:hover {
    opacity: 0.8;
}

/**
 * Disabled lightbox elements
 */
.cm-no-lightbox,
.cm-no-lightbox * {
    cursor: default !important;
}

/* ==========================================================================
   GLightbox Custom Styles
   ========================================================================== */

/**
 * Override GLightbox default height for cm-lightbox elements
 */
.glightbox-custom-height .gslide-image img,
.glightbox-custom-height .gslide-inline {
    max-height: var(--cm-max-height, 90vh) !important;
}

/**
 * Hide description when disabled
 */
.glightbox-no-desc .gslide-description {
    display: none !important;
}

/**
 * Custom close button styling
 */
.gclose {
    opacity: 0.7;
    transition: opacity 0.3s ease;
}

.gclose:hover {
    opacity: 1;
}

/* ==========================================================================
   Mobile Responsive
   ========================================================================== */

@media (max-width: 768px) {
    /**
     * Mobile gallery adjustments
     */
    .gallery a.glightbox-gallery:before {
        width: 40px;
        height: 40px;
        margin: -20px 0 0 -20px;
    }

    .gallery a.glightbox-gallery:after {
        width: 20px;
        height: 20px;
        margin: -10px 0 0 -10px;
    }

}

@media (max-width: 480px) {
    /**
     * Small mobile adjustments
     */
    .gslide-description {
        font-size: 12px !important;
    }
}

/* ==========================================================================
   Accessibility
   ========================================================================== */

/**
 * Focus states for keyboard navigation
 */
.gallery a.glightbox-gallery:focus,
.cm-lightbox:focus,
a.glightbox-video:focus {
    outline: 2px solid #007cba;
    outline-offset: 2px;
}

/**
 * Reduced motion support
 */
@media (prefers-reduced-motion: reduce) {
    .gallery a.glightbox-gallery,
    .gallery a.glightbox-gallery img,
    .cm-lightbox,
    a.glightbox-video {
        transition: none;
    }

    .gallery a.glightbox-gallery:hover {
        transform: none;
    }
}

/* ==========================================================================
   High Contrast Mode Support
   ========================================================================== */

@media (prefers-contrast: high) {
    .goverlay {
        background: rgba(0, 0, 0, 0.95) !important;
    }

    .gclose {
        background: white !important;
        color: black !important;
    }
}

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

@media print {
    .gallery a.glightbox-gallery:before,
    .gallery a.glightbox-gallery:after {
        display: none;
    }
}

/* ==========================================================================
   Custom cm-lightbox Height Control
   ========================================================================== */

/**
 * Support für spezielle Höheneinstellungen
 */
body.glightbox-open .glightbox-custom .gslide-image {
    --cm-max-height: var(--custom-height, 90vh);
}

body.glightbox-open .glightbox-custom .gslide-image img {
    max-height: var(--cm-max-height) !important;
    object-fit: contain;
}

/* Für Inline-Content (falls verwendet) */
body.glightbox-open .glightbox-custom .gslide-inline {
    max-height: var(--cm-max-height) !important;
    overflow: auto;
}