
/* cb-slider dots*/
/* ========== CB Slider pagination (Swiper) ========== */
:root{
    --cb-dot: #d7d7d7;          /* inactive dot */
}

.cb-carousel-block{
    margin-block-start: calc(var(--wp--custom--gap--vertical) * 2.5);
}

.wp-block-cb-carousel-v2 .cb-pagination.swiper-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;                  /* space between bullets */
    padding-block: 8px;
}

/* base dot */
.wp-block-cb-carousel-v2 .cb-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--cb-dot);
    opacity: 1;                                 /* override Swiper default */
    margin: 0 6px !important;                   /* Swiper adds its own margin */
    transition: width .25s ease, background-color .2s ease, transform .25s ease;
}

/* active pill */
.wp-block-cb-carousel-v2 .cb-pagination .cb-pagination-bullet.swiper-pagination-bullet-active {
    width: 44px;                                /* pill length */
    background: var(--wp--custom--color--secondary);
}

/* hover/focus states (better a11y) */
.wp-block-cb-carousel-v2 .cb-pagination .swiper-pagination-bullet:hover {
    transform: scale(1.05);
}
.wp-block-cb-carousel-v2 .cb-pagination .swiper-pagination-bullet:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp--custom--color--secondary);
}

/* compact on small screens */
@media (max-width: 480px){
    .wp-block-cb-carousel-v2 .cb-pagination .swiper-pagination-bullet { width: 7px; height: 7px; }
    .wp-block-cb-carousel-v2 .cb-pagination .swiper-pagination-bullet-active { width: 34px; }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
    .wp-block-cb-carousel-v2 .cb-pagination .swiper-pagination-bullet { transition: none; }
}

/* cb-slider dots*/