/* ==========================================================
   NERDIUM BUILDER PUBLIC
   MOBILE GALLERY SWIPE V1
========================================================== */

@media (max-width: 700px) {

    /*
     * Csak a valódi GALÉRIA.
     * Az .nbp-image-grid változatlan marad.
     */
    .nerdium-builder-public .nbp-gallery {
        display: flex !important;
        grid-template-columns: none !important;

        gap: 12px;

        width: 100%;

        overflow-x: auto;
        overflow-y: hidden;

        padding: 0 0 8px;
        margin: 0;

        scroll-snap-type: x mandatory;
        scroll-padding-left: 0;

        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;

        scrollbar-width: none;
    }


    .nerdium-builder-public .nbp-gallery::-webkit-scrollbar {
        display: none;
    }


    /*
     * 86% = a következő kép széle már látszik.
     * Ez jelzi az olvasónak, hogy oldalra húzható.
     */
    .nerdium-builder-public .nbp-gallery > .nbp-gallery-item {
        flex: 0 0 100%;

        min-width: 0;

        margin: 0;

        scroll-snap-align: start;
        scroll-snap-stop: always;
    }


    .nerdium-builder-public .nbp-gallery .nbp-gallery-button {
        display: block;

        width: 100%;
        max-width: none;

        aspect-ratio: 16 / 9;

        margin: 0;
        padding: 0;

        overflow: hidden;

        border:
            1px solid
            rgba(215, 177, 92, 0.34);

        border-radius: 14px;

        background:
            #090c10;

        box-shadow:
            0 8px 24px
            rgba(0, 0, 0, 0.26);

        touch-action: pan-x;
    }


    .nerdium-builder-public .nbp-gallery .nbp-gallery-button img {
        display: block;

        width: 100%;
        height: 100%;

        margin: 0;

        object-fit: cover;
        object-position: center;

        border-radius: 0;
    }


    /*
     * Ha van képaláírás, az is együtt lapozzon
     * a saját képével.
     */
    .nerdium-builder-public .nbp-gallery figcaption {
        margin-top: 7px;
    }

}


/* ==========================================================
   NERDIUM MOBILE GALLERY
   INTERACTIVE PREVIEW V2
========================================================== */

@media (max-width: 700px) {

    .nerdium-builder-public .nbp-gallery {
        cursor: grab;
    }

    .nerdium-builder-public .nbp-gallery.nbp-gallery-dragging {
        cursor: grabbing;
        scroll-snap-type: none;
    }

    .nerdium-builder-public .nbp-gallery-button {
        pointer-events: auto !important;
        cursor: pointer;
    }

    .nerdium-builder-public .nbp-gallery img {
        -webkit-user-drag: none;
        user-select: none;
    }

}


/*
 * Az admin Live Preview iframe legyen ténylegesen interaktív.
 */
.ab6-live-preview-stage {
    pointer-events: auto !important;
}

.ab6-live-preview iframe {
    position: relative;
    z-index: 1;

    pointer-events: auto !important;
}


/* ==========================================================
   NERDIUM MOBILE GALLERY NAVIGATION V1
========================================================== */

@media (max-width: 700px) {

    .nbp-gallery-mobile-shell {
        position: relative;

        width: 100%;

        padding-bottom: 30px;
    }


    .nbp-gallery-mobile-shell
    > .nbp-gallery {
        margin-bottom: 0;
    }


    .nbp-gallery-nav {
        position: absolute;
        top: calc(50% - 15px);

        z-index: 5;

        display: grid;

        width: 38px;
        height: 38px;

        place-items: center;

        padding: 0;

        border:
            1px solid
            rgba(255,255,255,.22);

        border-radius: 50%;

        color: #ffffff;

        background:
            rgba(10,12,15,.72);

        backdrop-filter:
            blur(6px);

        cursor: pointer;

        font-size: 28px;
        line-height: 1;

        box-shadow:
            0 4px 16px
            rgba(0,0,0,.25);
    }


    .nbp-gallery-prev {
        left: 8px;
    }


    .nbp-gallery-next {
        right: 8px;
    }


    .nbp-gallery-nav:disabled {
        opacity: .25;

        pointer-events: none;
    }


    .nbp-gallery-counter {
        position: absolute;

        left: 50%;
        bottom: 3px;

        transform:
            translateX(-50%);

        color:
            rgba(255,255,255,.72);

        font-size: 12px;
        font-weight: 700;

        letter-spacing:
            .04em;
    }

}


/* ==========================================================
   NERDIUM MOBILE GALLERY
   FINAL VISUAL POLISH V2
========================================================== */

@media (max-width: 700px) {

    .nbp-gallery-mobile-shell {
        position: relative;

        width: 100%;

        padding:
            0
            0
            38px;
    }


    /*
     * Egy teljes kép / oldal.
     * Nem mutatjuk a következő kép szélét,
     * mert már van navigáció és számláló.
     */
    .nbp-gallery-mobile-shell
    .nbp-gallery {
        gap: 12px;

        padding-bottom: 0;
    }


    .nbp-gallery-mobile-shell
    .nbp-gallery-item {
        flex:
            0
            0
            100%;

        width: 100%;

        overflow: hidden;

        border-radius: 14px;
    }


    /*
     * Finom képkiemelés.
     */
    .nbp-gallery-mobile-shell
    .nbp-gallery-button {
        position: relative;

        border:
            1px solid
            rgba(215, 177, 92, .32);

        border-radius: 14px;

        background:
            #090c10;

        box-shadow:
            0 10px 28px
            rgba(0, 0, 0, .28);
    }


    /*
     * Nagyon enyhe belső fény,
     * hogy a kép tényleg kártyának hasson.
     */
    .nbp-gallery-mobile-shell
    .nbp-gallery-button::after {
        content: "";

        position: absolute;
        inset: 0;

        pointer-events: none;

        border-radius: inherit;

        box-shadow:
            inset 0 0 0 1px
            rgba(255, 255, 255, .035);
    }


    /*
     * Navigációs nyilak.
     */
    .nbp-gallery-nav {
        top: 50%;

        width: 34px;
        height: 34px;

        transform:
            translateY(-50%);

        border:
            1px solid
            rgba(255, 255, 255, .18);

        background:
            rgba(7, 10, 13, .76);

        box-shadow:
            0 4px 14px
            rgba(0, 0, 0, .28);

        backdrop-filter:
            blur(7px);

        font-size: 23px;

        transition:
            opacity .18s ease,
            background .18s ease,
            transform .18s ease;
    }


    .nbp-gallery-prev {
        left: 10px;
    }


    .nbp-gallery-next {
        right: 10px;
    }


    .nbp-gallery-nav:active {
        transform:
            translateY(-50%)
            scale(.93);
    }


    .nbp-gallery-nav:disabled {
        opacity: .18;
    }


    /*
     * Számláló.
     */
    .nbp-gallery-counter {
        bottom: 2px;

        min-width: 52px;

        padding:
            5px
            10px;

        border:
            1px solid
            rgba(215, 177, 92, .22);

        border-radius: 999px;

        color:
            rgba(235, 226, 205, .88);

        background:
            rgba(14, 17, 21, .88);

        box-shadow:
            0 3px 12px
            rgba(0, 0, 0, .18);

        font-size: 11px;
        font-weight: 800;

        letter-spacing:
            .06em;
    }


    /*
     * Képaláírás esetén se változzon
     * maga a képkeret mérete.
     */
    .nbp-gallery-mobile-shell
    figcaption {
        padding:
            8px
            4px
            0;

        color:
            rgba(255, 255, 255, .58);

        font-size: 12px;
        line-height: 1.45;
    }

}


/* ==========================================================
   NERDIUM MOBILE GALLERY
   OUTER SHELL V3
========================================================== */

@media (max-width: 700px) {

    /*
     * A teljes galéria központi panelje.
     * Szándékosan visszafogottabb, mint maga a képkeret.
     */
    .nbp-gallery-mobile-shell {
        position: relative;

        width: 100%;

        padding:
            12px
            12px
            44px;

        border:
            1px solid
            rgba(215, 177, 92, .16);

        border-radius: 18px;

        background:
            linear-gradient(
                145deg,
                rgba(215, 177, 92, .035),
                rgba(255, 255, 255, .012) 42%,
                rgba(0, 0, 0, .045)
            ),
            rgba(12, 15, 19, .66);

        box-shadow:
            0 12px 34px
            rgba(0, 0, 0, .18),
            inset 0 1px 0
            rgba(255, 255, 255, .025);

        overflow: hidden;
    }


    /*
     * A galéria ne érjen hozzá közvetlenül
     * a külső panel széléhez.
     */
    .nbp-gallery-mobile-shell
    > .nbp-gallery {
        width: 100%;

        margin: 0;

        border-radius: 14px;
    }


    /*
     * A számláló kicsit beljebb kerül
     * a külső panel aljába.
     */
    .nbp-gallery-mobile-shell
    .nbp-gallery-counter {
        bottom: 9px;
    }


    /*
     * Nyilak maradjanak vizuálisan a kép közepén.
     */
    .nbp-gallery-mobile-shell
    .nbp-gallery-nav {
        z-index: 6;
    }

}

/* ==========================================================
   NERDIUM_MOBILE_COMPONENTS_V692
   Mobil vizuális összetartás + 2 oszlopos képes rács
========================================================== */

@media (max-width: 720px) {

    /* ------------------------------------------------------
       KÉP + SZÖVEG
       Mobilon is egyértelműen egy komponensnek hasson.
    ------------------------------------------------------ */

    .nerdium-builder-public .nbp-image-text {
        grid-template-columns: 1fr !important;
        gap: 14px !important;

        width: 100%;
        padding: 12px;

        border: 1px solid rgba(217, 180, 91, 0.36);
        border-radius: 16px;

        background:
            linear-gradient(
                180deg,
                rgba(217, 180, 91, 0.035),
                rgba(255, 255, 255, 0.012)
            );

        box-shadow:
            0 10px 28px rgba(0, 0, 0, 0.14),
            inset 0 1px 0 rgba(255, 255, 255, 0.018);

        overflow: hidden;
    }

    .nerdium-builder-public
    .nbp-image-text[data-position="right"]
    .nbp-image-text-media {
        order: 0 !important;
    }

    .nerdium-builder-public .nbp-image-text-media {
        overflow: hidden;
        border-radius: 12px;
    }

    .nerdium-builder-public .nbp-image-text-media img {
        width: 100%;
        border-radius: 12px;
    }

    .nerdium-builder-public .nbp-image-text-content {
        min-width: 0;
        padding: 0 4px 4px;
    }

    .nerdium-builder-public .nbp-image-text-title {
        margin-top: 0;
        margin-bottom: 10px;
    }

    .nerdium-builder-public .nbp-image-text-content > .nbp-html {
        margin: 0;
    }


    /* ------------------------------------------------------
       KÉPES RÁCS
       Mobilon két kép egy sorban.
    ------------------------------------------------------ */

    .nerdium-builder-public .nbp-image-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 8px !important;
    }

    /* Egyetlen kép ne legyen feleslegesen fél szélességű. */
    .nerdium-builder-public
    .nbp-image-grid:has(> :only-child) {
        grid-template-columns: 1fr !important;
    }

    .nerdium-builder-public .nbp-image-grid > * {
        min-width: 0;
    }

    .nerdium-builder-public .nbp-image-grid img {
        display: block;
        width: 100%;
        height: auto;

        min-width: 0;
        min-height: 0;
        max-height: none;

        aspect-ratio: 4 / 3;
        object-fit: cover;
        object-position: center;

        border-radius: 10px;
    }
}

@media (max-width: 420px) {

    .nerdium-builder-public .nbp-image-text {
        padding: 10px;
        gap: 12px !important;
        border-radius: 14px;
    }

    .nerdium-builder-public .nbp-image-grid {
        gap: 7px !important;
    }
}
