/* =========================================================
   Image Carousel
   ========================================================= */

.sb-icar,
.pb-icar {
    --sb-icar-radius: .75rem;
    padding-left: 2px;
    padding-right: 2px;
    box-sizing: border-box;

    /* caption tokens */
    --sb-icar-cap-bg: rgba(0, 0, 0, .45);
    --sb-icar-cap-fg: rgba(255, 255, 255, .95);
    --sb-icar-cap-border: rgba(255, 255, 255, .14);
}

/* Theme toggle aware */
html[data-theme="light"] .sb-icar,
html[data-theme="light"] .pb-icar {
    --sb-icar-cap-bg: rgba(255, 255, 255, .72);
    --sb-icar-cap-fg: #111;
    --sb-icar-cap-border: rgba(16, 24, 40, .16);
}

html[data-theme="dark"] .sb-icar,
html[data-theme="dark"] .pb-icar {
    --sb-icar-cap-bg: rgba(0, 0, 0, .50);
    --sb-icar-cap-fg: rgba(255, 255, 255, .92);
    --sb-icar-cap-border: rgba(234, 240, 255, .14);
}

.sb-icar .carousel,
.pb-icar .carousel {
    width: 100%;
    max-width: 100%;
}

.sb-icar .carousel-inner,
.pb-icar .carousel-inner {
    overflow: hidden; /* keep things tidy */
    border-radius: var(--sb-icar-radius, .75rem);
}

/* Images */
.sb-icar .carousel-item img,
.pb-icar .carousel-item img {
    width: 100%;
    height: var(--sb-icar-h, 400px);
    object-fit: var(--sb-icar-fit, cover);
    object-position: var(--sb-icar-pos, center center);
    border-radius: var(--sb-icar-radius, .75rem);
    display: block;
}

/* Caption */
.sb-icar .carousel-caption,
.pb-icar .carousel-caption {
    background: var(--sb-icar-cap-bg);
    color: var(--sb-icar-cap-fg);
    border: 1px solid var(--sb-icar-cap-border);
    border-radius: var(--sb-icar-radius, .75rem);
    padding: .5rem .75rem;

    /* improve readability on busy images */
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

/* Caption text balance */
.sb-icar .carousel-caption h5,
.pb-icar .carousel-caption h5 {
    margin-bottom: .25rem;
    color: inherit;
}

.sb-icar .carousel-caption p,
.pb-icar .carousel-caption p {
    margin-bottom: 0;
    color: inherit;
    opacity: .95;
}
