/* ===============================
   WORLD SHOOTOUT - GALLERY GRID
   Based on Razor HTML structure
   =============================== */

.photo_slider_wrap {
    padding: 30px 15px;
    box-sizing: border-box;
}

    /* Turn existing UL slider into clean grid */
    .photo_slider_wrap .slider {
        max-width: 1100px;
        margin: 0 auto;
        padding: 0;
        list-style: none;
        display: grid !important;
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 24px !important;
        align-items: start;
        box-sizing: border-box;
    }

        /* Remove any slider spacing */
        .photo_slider_wrap .slider > li {
            margin: 0 !important;
            padding: 0 !important;
            list-style: none;
            width: auto !important;
            min-width: 0 !important;
            transform: none !important;
        }

            /* Figure layout */
            .photo_slider_wrap .slider > li figure {
                margin: 0;
                display: flex;
                flex-direction: column;
                align-items: center;
                background: transparent;
            }

                /* Image container (the framed "box") */
                .photo_slider_wrap .slider > li figure a.competition_image {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    width: 100%;
                    aspect-ratio: 4 / 3; /* consistent frame size */
                    overflow: hidden;
                    border-radius: 6px;
                    background: transparent;
                    box-shadow: none !important;
                    transition: none !important;
                    text-decoration: none;
                    position: relative;
                }

                    /* Image itself - keep natural ratio, no cropping */
                    .photo_slider_wrap .slider > li figure a.competition_image img {
                        width: auto !important;
                        height: auto !important;
                        max-width: 100% !important;
                        max-height: 100% !important;
                        object-fit: contain !important; /* preserve ratio */
                        object-position: center center;
                        display: block;
                        border-radius: 4px;
                        filter: none !important;
                        opacity: 1 !important;
                    }

                /* Blur + color overlay on hover */
                .photo_slider_wrap .slider > li figure a.competition_image {
                    position: relative;
                    overflow: hidden;
                }

                    /* Smooth blur effect */
                    .photo_slider_wrap .slider > li figure a.competition_image img {
                        transition: filter 0.3s ease;
                    }

                    .photo_slider_wrap .slider > li figure a.competition_image:hover img,
                    .photo_slider_wrap .slider > li figure a.competition_image:focus img {
                        filter: blur(4px);
                    }

                    /* Color overlay */
                    .photo_slider_wrap .slider > li figure a.competition_image::after {
                        content: "";
                        position: absolute;
                        inset: 0;
                        background: rgba(146, 186, 214, 0); /* #92bad6 */
                        transition: background 0.3s ease;
                        pointer-events: none;
                    }

                    .photo_slider_wrap .slider > li figure a.competition_image:hover::after,
                    .photo_slider_wrap .slider > li figure a.competition_image:focus::after {
                        background: rgba(146, 186, 214, 0.55);
                    }

        /* Remove potential overlay effects */
        .photo_slider_wrap .slider .zoom_ico {
            pointer-events: none;
            opacity: 0.85;
        }

        /* Caption styling */
        .photo_slider_wrap .slider > li figure figcaption {
            margin-top: 8px;
            padding: 0 6px;
            font-size: 12px;
            line-height: 1.3;
            color: #333;
            text-align: center;
            word-break: break-word;
        }

/* Responsive */
@media (max-width: 1100px) {
    .photo_slider_wrap .slider {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

@media (max-width: 760px) {
    .photo_slider_wrap .slider {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 18px !important;
    }
}

@media (max-width: 480px) {
    .photo_slider_wrap .slider {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }
}

/* Limit to first 100 images (25 rows × 4) */
.photo_slider_wrap .slider > li:nth-child(n+101) {
    display: none !important;
}