/**
 * pm-carousel — Frontend stílusok
 *
 * Tartalmazza az Owl Carousel navigációs gomb stílusokat,
 * és az equal-height slide elrendezést.
 * Betöltve: wp_enqueue_scripts (frontend) — register.php kezeli.
 */

/* ========================= SLIDE ELRENDEZÉS ======================== */

.pm-carousel__slider.owl-carousel .owl-stage {
    display: flex;
    align-items: stretch;   /* minden slide azonos magasságú */
}

.pm-carousel__slider.owl-carousel .owl-stage .owl-item {
    margin: 0 1px;
}

.pm-carousel__slider.owl-carousel .owl-stage .owl-item > .pm-carousel__slide {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.pm-carousel__slider.owl-carousel .owl-item img {
    width: auto;
}

/* ========================= NAVIGÁCIÓS GOMBOK ====================== */

/* Ha az Owl Carousel nav:false-t kap, .disabled osztályt tesz a nav-ra */
body .owl-nav.disabled {
    display: none !important;
}

/* Pöttyök elrejtése ha data-dots nem "1" (hiányzó vagy "0" attribútum esetén is) */
.pm-carousel:not([data-dots="1"]) .owl-dots {
    display: none !important;
}

/* Ha a user bekapcsolta a pöttyöket, mindig legyenek láthatók —
   az Owl Carousel olykor "disabled" osztályt tesz rájuk (pl. 1 oldal),
   de más CSS-ek és a téma is elrejtheti ezt */
.pm-carousel[data-dots="1"] .owl-dots {
    display: block !important;
}

/* ========================= PÖTTYÖK (DOTS) ========================= */

/* Explicit stílusok, hogy a téma CSS ne nyomhassa felül az owl-theme szabályokat */
body .owl-dots {
    text-align: center;
    margin-top: 10px;
    -webkit-tap-highlight-color: transparent;
}

body .owl-dots .owl-dot {
    display: inline-block;
    zoom: 1;
}

body .owl-dots .owl-dot span {
    width:         10px;
    height:        10px;
    margin:        5px 7px;
    background:    #c8c8c8;
    display:       block;
    border-radius: 50%;
    transition:    background 0.2s ease;
}

body .owl-dots .owl-dot.active span,
body .owl-dots .owl-dot:hover span {
    background: #555;
}

body .owl-nav {
    text-align: center;
}

body .owl-nav button .nav-btn {
    font-family: dashicons;
    font-size:   26px;
}

body .owl-nav button .nav-btn.prev-slide::before {
    content: "\f340";   /* dashicons-arrow-left-alt2 */
}

body .owl-nav button .nav-btn.next-slide::before {
    content: "\f344";   /* dashicons-arrow-right-alt2 */
}

@media screen and (min-width: 1024px) {
    body .owl-nav button {
        margin: 25px;
    }
}

@media screen and (max-width: 1023px) {
    body .owl-nav button {
        width: 30%;
    }
    body .owl-nav button.owl-prev {
        margin: 20px 20% 20px 0;
    }
    body .owl-nav button.owl-next {
        margin: 20px 0 20px 20%;
    }
}