@value radius-xs, fill-base, fill-tap, primary, primary-tap, shadow-color from '../../default.css';

:global {
    .mp-carousel {
        position: relative;
        & > div > img {
            width: 100%;
            height: auto;
        }
        .mp-dots {
            position: absolute;
            bottom: 0.2rem;
            width: 100%;
            text-align: center;

            span {
                background: fill-tap;
                width: 0.2rem;
                height: 0.2rem;
                display: inline-block;
                margin: 0 0.1rem;
                box-shadow: shadow-color 0px 0px 3px;
            }

            span.mp-active {
                background: fill-base;
            }
        }
    }
}