/* Sekcja opinii (pd_reviews v3) — Swiper NIETKNIĘTY (standardowy overflow hidden),
   rozwinięcia w osobnej warstwie .pd_reviews_overlay zakotwiczonej w sekcji.
   Świadomie tylko klasyczny CSS (absolute + z-index) — bez clip-path/:has,
   żeby minifikacja CSS (Super Speed) niczego nie zjadła. */

.pd_reviews_section {
    position: relative; /* kontekst dla warstwy rozwinięć nad dalszą treścią */
    z-index: 5;
    padding: 50px 0;
}

.pd_reviews_section__inner {
    max-width: 1640px;
    margin: 0 auto;
    padding: 0 15px;
    position: relative;
}

.pd_reviews_section_title {
    color: var(--mr_color__primary);
    font-weight: var(--mr_fontweight__bold);
    font-size: var(--mr_fontsize__title);
    text-align: center;
    margin-bottom: max(12px, 1.2rem);
}

.pd_reviews_section_subtitle {
    text-align: center;
    margin-bottom: max(88px, 8.8rem);
}

/* --- Swiper (stockowy) --- */
.pd_reviews_swiper_wrap {
    position: relative;
}

/* przestrzeń na box-shadow kart: padding rozszerza obszar przycinania Swipera,
   ujemny margines kompensuje layout (Swiper odejmuje padding przy liczeniu
   szerokości slajdów, więc układ kafelków się nie zmienia) */
.pd_reviews_swiper {
    padding: 20px;
    margin: -20px;
}

/* --- Karta = zdjęcie; statyczna, przycięta do najniższego --- */
.pd_reviews_card {
    position: relative;
    height: var(--pdrev-min, auto);
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 4px 4px 15px 0 #EDF3FE;
}

.pd_reviews_card img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 8px;
}

.pd_reviews_card_link {
    display: block;
    cursor: zoom-in;
}

/* --- Gradient + "Przeczytaj całą opinię" tylko na kartach przyciętych --- */
.pd_reviews_card:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 90px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.92) 75%);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
}

.pd_reviews_card_more {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 12px;
    z-index: 2;
    text-align: center;
    font-weight: 600;
    text-decoration: underline;
    color: #1d2e5e;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
}

.pd_reviews_card.is-clipped:after {
    opacity: 1;
}

.pd_reviews_card.is-clipped .pd_reviews_card_more {
    opacity: 1;
    pointer-events: auto; /* klik w etykietę otwiera lightbox */
}

/* --- Warstwa rozwinięć: absolute w wrapperze slidera, wysokość 0, nad wszystkim.
       Lewa/prawa krawędź = viewport slidera (padding wrapu na strzałki). --- */
.pd_reviews_overlay {
    position: absolute;
    top: 0;
    left: 60px;
    right: 60px;
    height: 0;
    overflow: visible;
    z-index: 60;
    pointer-events: none; /* pusta warstwa nie blokuje slidera */
}

.pd_reviews_overlay .pd_reviews_expander {
    position: absolute;
    top: 0;
    overflow: hidden;
    border-radius: 8px;
    background: #fff;
    box-shadow: 4px 4px 15px 0 #EDF3FE; /* identyczny jak karta — stały, bez zmiany przy rozwinięciu */
    transition: height 0.35s ease;
    cursor: zoom-in;
    pointer-events: auto;
}

.pd_reviews_overlay .pd_reviews_expander img {
    display: block;
    width: 100%;
    height: auto;
}

/* Klon = pikselowa kopia karty: gradient + etykieta jak na karcie pod spodem.
   Fade-in ma opóźnienie, żeby kończyć się razem z animacją wysokości (0.35s) —
   w chwili usunięcia klon wygląda 1:1 jak karta, podmiana jest niewidoczna. */
.pd_reviews_overlay .pd_reviews_expander .pd_reviews_expander_fade {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 90px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.92) 75%);
    pointer-events: none;
    opacity: 1;
    transition: opacity 0.25s ease 0.1s;
}

.pd_reviews_overlay .pd_reviews_expander .pd_reviews_card_more {
    opacity: 1;
    pointer-events: none; /* klik obsługuje cały klon (lightbox) */
    transition: opacity 0.25s ease 0.1s;
}

/* rozwijanie: gradient i etykieta gasną szybciej, bez opóźnienia */
.pd_reviews_overlay .pd_reviews_expander.is-expanding .pd_reviews_expander_fade,
.pd_reviews_overlay .pd_reviews_expander.is-expanding .pd_reviews_card_more {
    opacity: 0;
    transition: opacity 0.2s ease;
}

/* --- Strzałki nawigacji (bez kropek) — chevron ze sprite'a motywu --- */
.pd_reviews_swiper_wrap .swiper-button-prev,
.pd_reviews_swiper_wrap .swiper-button-next {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid #189ab4;
    background: #fff;
    color: #189ab4;
    z-index: 70;
}

/* wyłączamy domyślny glif fontowy Swipera — ikonę daje sprite motywu */
.pd_reviews_swiper_wrap .swiper-button-prev:after,
.pd_reviews_swiper_wrap .swiper-button-next:after {
    content: none;
}

.pd_reviews_swiper_wrap .swiper-button-prev svg,
.pd_reviews_swiper_wrap .swiper-button-next svg {
    fill: currentColor;
}

.pd_reviews_swiper_wrap .swiper-button-next svg {
    transform: rotate(180deg);
}

.pd_reviews_swiper_wrap .swiper-button-prev {
    left: 0;
    transform: translateX(calc(-100% - 30px));
}

.pd_reviews_swiper_wrap .swiper-button-next {
    right: 0;
    transform: translateX(calc(100% + 30px));
}
@media screen and (max-width: 1100px) {
    .pd_reviews_swiper_wrap .swiper-button-prev {
        transform: translateX(-50%);
    }

    .pd_reviews_swiper_wrap .swiper-button-next {
        transform: translateX(50%);
    }
}

@media screen and (max-width: 767px) {

    .pd_reviews_swiper_wrap {
        padding: 0 12px;
    }

    .pd_reviews_overlay {
        left: 12px;
        right: 12px;
    }

    .pd_reviews_section_subtitle {
        margin-bottom: max(42px, 4.2rem);
    }

    .pd_reviews_sources {
        margin-top: max(180px, 18rem);
    }
}

/* --- PhotoSwipe: naprawa UI + warstwa nad menu ---
   Ikony skina (krzyżyk, strzałki, zoom) są w default-skin.min.css wskazywane
   RELATYWNYM url(default-skin.png/svg) — po połączeniu CSS przez CCC/Super Speed
   ścieżka bazowa się zmienia i grafiki 404-ują (na karcie produktu działa, bo
   tam CSS ładowany jest surowym tagiem). Wskazujemy je ABSOLUTNIE. --- */
.pswp {
    z-index: 9999 !important; /* galeria nad sticky menu */
}

.pswp__button,
.pswp__button--arrow--left:before,
.pswp__button--arrow--right:before {
    background-image: url(/themes/classic_child/assets/photoswipe/default-skin.png) !important;
}

@media (-webkit-min-device-pixel-ratio: 1.1), (min-resolution: 105dpi), (min-resolution: 1.1dppx) {
    .pswp--svg .pswp__button,
    .pswp--svg .pswp__button--arrow--left:before,
    .pswp--svg .pswp__button--arrow--right:before {
        background-image: url(/themes/classic_child/assets/photoswipe/default-skin.svg) !important;
    }

    .pswp--svg .pswp__button--arrow--left,
    .pswp--svg .pswp__button--arrow--right {
        background: none !important;
    }
}

/* --- Grid logotypów źródeł opinii pod sliderem --- */
.pd_reviews_sources {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 30px 60px;
    margin-top: max(82px, 8.2rem);
}

.pd_reviews_sources img {
    display: block;
    max-height: 44px;
    width: max(175px, 17.5rem);
}

@media screen and (max-width: 500px) {
    .pd_reviews_swiper_wrap {
        padding: 0;
    }

    .pd_reviews_overlay {
        left: 0;
        right: 0;
    }

    /* FEATURE: strzałki jak w pd_slider_category — gołe strzałki z ogonkiem
       (background-image, bez zmian w tpl/js), prawy dolny róg POD sliderem,
       w przestrzeni, którą i tak robi margines .pd_reviews_sources */
    .pd_reviews_swiper_wrap .swiper-button-prev,
    .pd_reviews_swiper_wrap .swiper-button-next {
        top: auto;
        bottom: -64px;
        left: auto;
        margin-top: 0;
        width: 22px;
        height: 22px;
        border: none;
        border-radius: 0;
        background: transparent url(/modules/pd_reviews/views/img/left-arrow-pd-slider.svg) center / 22px 22px no-repeat;
    }

    .pd_reviews_swiper_wrap .swiper-button-prev {
        right: 52px;
        transform: none;
    }

    .pd_reviews_swiper_wrap .swiper-button-next {
        right: 0;
        transform: rotate(180deg);
    }

    /* chowamy chevrony-kółka (ikonę daje background-image) */
    .pd_reviews_swiper_wrap .swiper-button-prev svg,
    .pd_reviews_swiper_wrap .swiper-button-next svg {
        display: none;
    }

    .pd_reviews_sources {
        margin-top: max(180px, 18rem);
    }
}