/*
* FooGallery Custom CSS
* This file is created by adding custom CSS on FooGallery Settings page in wp-admin
* Created : 10 Aug 2026, 11:57 am
*/

/* ==========================================================
   ZSŁ — FooGallery
   Zoom głównego zdjęcia
   ========================================================== */

.zsl-fg-zoom-image {
    -webkit-user-select: none;
    user-select: none;

    -webkit-user-drag: none;

    touch-action: none;

    transform-origin: 50% 50% !important;

    transition:
        transform 160ms ease-out;

    will-change: transform;

    cursor: zoom-in !important;
}


/* Powiększone zdjęcie */
.zsl-fg-zoom-image[data-zsl-zoomed="1"] {
    cursor: grab !important;
}


/* Przeciąganie powiększonego zdjęcia */
.zsl-fg-zoom-image.zsl-fg-zoom-active {
    cursor: grabbing !important;

    transition: none;
}


/* ==========================================================
   ZSŁ — FooGallery
   Płynny free-scroll paska miniaturek
   PC + telefon + tablet
   ========================================================== */

.zsl-free-thumbs {
    cursor: grab;

    -webkit-user-select: none;
    user-select: none;

    /*
     * Przejmujemy gest dotykowy na pasku.
     * Dzięki temu zdjęcia przesuwają się
     * dokładnie razem z palcem.
     */
    touch-action: none !important;

    overscroll-behavior: contain;

    -webkit-tap-highlight-color: transparent;
}


/*
 * WAŻNE:
 * nie ustawiamy pointer-events:none.
 *
 * Obrazki zachowują możliwość kliknięcia/tapnięcia,
 * dzięki czemu natywny wybór zdjęcia FooGallery działa.
 */
.zsl-free-thumbs img {
    -webkit-user-drag: none;

    user-select: none;
}


/* Cały kafelek miniatury pozostaje klikalny */
.zsl-free-thumbs figure {
    cursor: pointer;
}


/* Ręczne przeciąganie */
.zsl-free-thumbs-dragging,
.zsl-free-thumbs-dragging * {
    cursor: grabbing !important;
}


/*
 * Podczas przeciągania pasek nie może mieć
 * transition FooGallery.
 *
 * Transform jest aktualizowany 1:1
 * razem z kursorem albo palcem.
 */
.zsl-free-thumbs-dragging .fg-panel-thumbs-stage {
    transition: none !important;
}


/*
 * Tak samo podczas bezwładności.
 */
.zsl-free-thumbs-inertia .fg-panel-thumbs-stage {
    transition: none !important;
}


/*
 * Przyspieszenie renderowania transformacji.
 */
.fg-panel-thumbs-stage {
    will-change: transform;
}


/* ==========================================================
   TELEFON / TABLET
   ========================================================== */

@media (pointer: coarse) {

    .zsl-fg-zoom-image,
    .zsl-fg-zoom-image[data-zsl-zoomed="1"],
    .zsl-fg-zoom-image.zsl-fg-zoom-active,
    .zsl-free-thumbs,
    .zsl-free-thumbs-dragging,
    .zsl-free-thumbs-dragging * {
        cursor: default !important;
    }

}


/* ==========================================================
   PREFERS REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

    .zsl-fg-zoom-image {
        transition: none;
    }

    .zsl-free-thumbs-dragging .fg-panel-thumbs-stage,
    .zsl-free-thumbs-inertia .fg-panel-thumbs-stage {
        transition: none !important;
    }

}