:root {
    --swiper-pagination-bullet-size: 12px;
    --swiper-pagination-bullet-horizontal-gap: 6px;
    --swiper-pagination-bullet-inactive-color: #d3d3d3;
    --swiper-pagination-bullet-inactive-opacity: 0.8;
    --swiper-pagination-color: #012c53;

    --swiper-nav-color: #000000de;
    --swiper-nav-bg: #d3d3d3cc;
    --swiper-nav-bg-hover: #e2e3e3cc;
}

/* Base visibility/state for swiper blocks */
:is(.applications-product-list, .applications-product-packs, .packs-list) {
    visibility: hidden;
}

:is(.applications-product-list, .applications-product-packs, .packs-list).swiper-initialized {
    visibility: visible;
}

:is(.applications-product-list, .applications-product-packs, .packs-list).is-layout-grid {
    display: block;
}

/* Wrapper structure */
.wp-block-group.applications-product-list .wp-block-group__inner-container.swiper-wrapper,
.wp-block-group.applications-product-packs .wp-block-group__inner-container.swiper-wrapper,
.packs-list .wp-block-group__inner-container.swiper-wrapper {
    display: flex !important;
}

.packs-list .wp-block-group > .wp-block-group__inner-container {
    height: 100%;
    display: flex;
    flex-flow: column;
    justify-content: space-around;
}

.packs-list.related .wp-block-group__inner-container.swiper-wrapper {
    gap: 24px;
}

/* Slides */
:is(.applications-product-list, .applications-product-packs, .packs-list) .swiper-slide {
    width: clamp(300px, 28vw, 380px);
    height: auto;
    margin-right: 0 !important;
}

/* Prev/next arrows on main swiper */
.swiper .swiper-button-next,
.swiper .swiper-button-prev {
    color: var(--swiper-nav-color);
    background-color: var(--swiper-nav-bg);
    width: 56px;
    height: 56px;
    border-radius: 56px;
    top: 50%;
    margin-top: -28px !important;
    transition:
        opacity 200ms ease,
        transform 200ms ease,
        background-color 100ms linear,
        color 100ms linear,
        visibility 0s linear 200ms;
}

.features-after-nav,
.swiper-after-nav {
    display: flex;
    flex-flow: row;
    width: 100%;
    justify-content: flex-end;
    margin-top: 20px;
}

/* Compact arrows after nav */
.features-after-nav .swiper-button-next,
.features-after-nav .swiper-button-prev,
.swiper-after-nav .swiper-button-next,
.swiper-after-nav .swiper-button-prev {
    color: var(--swiper-nav-color);
    background-color: var(--swiper-nav-bg);
    width: 36px;
    height: 36px;
    border-radius: 8px;
    position: static;
    margin: 0 16px 0 0;
    transition:
        opacity 200ms ease,
        transform 200ms ease,
        background-color 100ms linear,
        color 100ms linear,
        visibility 0s linear 200ms;
}

.swiper-button-next,
.swiper-button-prev {
    transition: all 0.3s ease;
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
    background-color: var(--swiper-nav-bg-hover);
}

.swiper .swiper-button-next::after,
.swiper .swiper-button-prev::after {
    content: "";
    width: 50px;
    height: 50px;
    display: block;
}

.features-after-nav .swiper-button-next::after,
.features-after-nav .swiper-button-prev::after,
.swiper-after-nav .swiper-button-next::after,
.swiper-after-nav .swiper-button-prev::after {
    content: "";
    width: 30px;
    height: 30px;
    display: block;
}

.swiper-button-next::after {
    background: url("../icons/chevron-right.svg") center / contain no-repeat;
}

.swiper-button-prev::after {
    background: url("../icons/chevron-left.svg") center / contain no-repeat;
}

.swiper .swiper-button-disabled {
    opacity: 0;
    transform: scale(0.85);
    pointer-events: none;
    visibility: hidden;
}

.features-after-nav .swiper-button-disabled,
.swiper-after-nav .swiper-button-disabled {
    opacity: 0.35;
    transform: none;
    pointer-events: none;
    visibility: visible;
}

.swiper-after-nav .swiper-pagination {
    top: initial;
    bottom: initial;
}

.is-touch-device .swiper .swiper-button-next,
.is-touch-device .swiper .swiper-button-prev {
    display: none !important;
}

/* Overflow behavior */
.applications-product-list,
.packs-list {
    overflow: hidden;
}

/* Fix: avoid clipping in related packs slider */
.packs-list.related {
    overflow: visible;
}

/* D-series slider */
.d-series.swiper {
    position: relative;
    overflow: hidden;
    min-height: 520px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.d-series .swiper-wrapper {
    align-items: center;
}

.d-series .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.d-series .swiper-slide .wp-block-group__inner-container {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.d-series .swiper-slide > .wp-block-group__inner-container img,
.d-series .swiper-slide img.wp-image-15838,
.d-series .swiper-slide img.wp-image-15839,
.d-series .swiper-slide img.wp-image-15840 {
    display: block;
    width: 100%;
    max-width: 1100px;
    height: auto;
    object-fit: contain;
}

.d-series .swiper-button-prev,
.d-series .swiper-button-next {
    color: #fff;
}

.d-series-controls {
    margin-top: 20px;
}

.d-series-pagination {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 16px;
    position: static !important;
}

.d-series-pagination .swiper-pagination-bullet {
    width: 100px;
    height: auto;
    margin: 0 !important;
    background: transparent;
    border-radius: 0;
    opacity: 1;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    cursor: pointer;
}

.d-series-pagination .swiper-pagination-bullet img {
    width: 80px;
    height: 80px;
    display: block;
    object-fit: contain;
    opacity: 0.6;
    transition: transform 0.25s ease, opacity 0.25s ease;
}

.d-series-pagination .bullet-label {
    margin-top: 6px;
    font-size: 14px;
    line-height: 1.2;
    color: black;
    text-align: center;
    opacity: 0.7;
    transition: opacity 0.25s ease;
}

.d-series-pagination .swiper-pagination-bullet-active img {
    opacity: 1;
    transform: scale(1.08);
}

.d-series-pagination .swiper-pagination-bullet-active .bullet-label {
    opacity: 1;
}

@media (max-width: 767px) {
    .d-series.swiper {
        min-height: 0;
    }

    .d-series-pagination .swiper-pagination-bullet {
        width: 84px;
    }

    .d-series-pagination .swiper-pagination-bullet img {
        width: 64px;
        height: 64px;
    }
}

@media (max-width: 767px) {
    .features-list {
        overflow: hidden;
    }

    .features-list > .wp-block-group__inner-container.swiper-wrapper {
        display: flex !important;
        gap: 0 !important;
    }

    .features-list > .wp-block-group__inner-container > .wp-block-group.swiper-slide {
        height: auto;
        box-sizing: border-box;
        flex-shrink: 0;
        width: calc(80% - 16px) !important;
    }
}

@media (max-width: 480px) {
    .features-list > .wp-block-group__inner-container > .wp-block-group.swiper-slide {
        height: auto;
        box-sizing: border-box;
        flex-shrink: 0;
        width: 90% !important;
    }
}

/* Nav dots */
.applications-product-packs .swiper-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(var(--swiper-pagination-bullet-horizontal-gap) * 2);
}

.applications-product-packs .swiper-pagination-bullet {
    width: var(--swiper-pagination-bullet-size);
    min-width: var(--swiper-pagination-bullet-size);
    height: var(--swiper-pagination-bullet-size);
    margin: 0 !important;
    border-radius: 999px;
    opacity: var(--swiper-pagination-bullet-inactive-opacity);
    background: var(--swiper-pagination-bullet-inactive-color);
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.20);
    transition:
        width 0.35s cubic-bezier(0.2, 0.8, 0.2, 1),
        min-width 0.35s cubic-bezier(0.2, 0.8, 0.2, 1),
        transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1),
        background-color 0.35s ease,
        opacity 0.35s ease,
        box-shadow 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
    will-change: width, transform, box-shadow;
}

.applications-product-packs .swiper-pagination-bullet:hover {
    opacity: 1;
    transform: translateY(-1px);
    box-shadow:
        0 2px 4px rgba(0, 0, 0, 0.14),
        0 6px 14px rgba(0, 0, 0, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.24);
}

.applications-product-packs .swiper-pagination-bullet-active {
    width: 40px;
    min-width: 40px;
    opacity: 1;
    background: var(--swiper-pagination-color);
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.22),
        0 8px 18px rgba(0, 0, 0, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.applications-product-packs .swiper-pagination-bullet:active {
    transform: scale(0.97);
}

.applications-product-packs .swiper-pagination.swiper-pagination-lock {
    display: none;
}

.applications-product-packs .swiper-pagination-bullet:focus-visible {
    outline: none;
    opacity: 1;
    box-shadow:
        0 0 0 4px rgba(1, 44, 83, 0.14),
        0 8px 18px rgba(0, 0, 0, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

@media (prefers-reduced-motion: reduce) {
    .applications-product-packs .swiper-pagination-bullet {
        transition: none;
    }
}
