.quiqqer-bricks-slider-basicSlider {
    --_qui-bricks-slider-basicSlider-direction: var(--qui-bricks-slider-basicSlider-direction, var(--qui-bricks-slider-basicSlider-settings-direction), row);
    --_qui-bricks-slider-basicSlider-direction--mobile: var(--qui-bricks-slider-basicSlider-direction--mobile, var(--_qui-bricks-slider-basicSlider-settings-direction--mobile, column));
    --_qui-bricks-slider-basicSlider-slider-height: var(--qui-bricks-slider-basicSlider-slider-height, var(--_qui-bricks-slider-basicSlider-settings-slider-height, initial));
    --_qui-bricks-slider-basicSlider-slider-height--mobile: var(--qui-bricks-slider-basicSlider-slider-height--mobile, var(--_qui-bricks-slider-basicSlider-settings-slider-height--mobile, initial));
    --_qui-bricks-slider-basicSlider-image-maxWidth: var(--qui-bricks-slider-basicSlider-image-maxWidth, var(--_qui-bricks-slider-basicSlider-settings-image-maxWidth, initial));
    --_qui-bricks-slider-basicSlider-textPosition: var(--qui-bricks-slider-basicSlider-textPosition, var(--_qui-bricks-slider-basicSlider-settings-textPosition, center));
    --_qui-bricks-slider-basicSlider-dot-bgColor: var(--qui-bricks-slider-basicSlider-dot-bgColor, #e2e2e2);
    --_qui-bricks-slider-basicSlider-dot-borderColor: var(--qui-bricks-slider-basicSlider-dot-borderColor, #e2e2e2);
    --_qui-bricks-slider-basicSlider-dot-active-bgColor: var(--qui-bricks-slider-basicSlider-dot-active-bgColor, currentColor);
    --_qui-bricks-slider-basicSlider-dot-active-borderColor: var(--qui-bricks-slider-basicSlider-dot-active-borderColor, currentColor);
}

.quiqqer-bricks-slider-basicSlider-control {
    display: flex;
    flex-direction: var(--_qui-bricks-slider-basicSlider-direction);
    gap: 2rem;
}

.quiqqer-bricks-slider-basicSlider-control__content,
.quiqqer-bricks-slider-basicSlider-control__sliderWrapper {
    flex-grow: 1;
    width: 50%;
}

.quiqqer-bricks-slider-basicSlider-control__sliderWrapper {
    position: relative;
    text-align: center;
}

/* slider */
.quiqqer-bricks-slider-basicSlider-control__slider {
    margin: 0;
    padding: 0;
    list-style: none;
    height: var(--_qui-bricks-slider-basicSlider-slider-height);
    display: flex;
    justify-content: center;
}

/* slider entry */
.quiqqer-bricks-slider-basicSlider-control__slider li {
    display: none;
    list-style: none;
    opacity: 0;
    padding: 0;
    margin: 0;
}

.quiqqer-bricks-slider-basicSlider-control__slider li:nth-child(1) {
    display: block;
    opacity: 1;
}

.quiqqer-bricks-slider-basicSlider-control__slider picture {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.quiqqer-bricks-slider-basicSlider-control__slider img {
    display: block;
    max-width: 100%;
    width: min(100%, var(--_qui-bricks-slider-basicSlider-image-maxWidth));
}

.quiqqer-bricks-slider-basicSlider-control__content {
    display: flex;
    align-items: var(--_qui-bricks-slider-basicSlider-textPosition);
}

/* dot nav */
.quiqqer-bricks-slider-basicSlider-control__dotNav {
    display: flex;
    justify-content: center;
    margin: 1rem 0 0 0;
    padding: 0;
    list-style: none;
}

.quiqqer-bricks-slider-basicSlider-control__dotNav :where(li) {
    background-color: var(--_qui-bricks-slider-basicSlider-dot-bgColor);
    border: 2px solid var(--_qui-bricks-slider-basicSlider-dot-borderColor);
    border-radius: 10px;
    display: inline-block;
    font-size: 0;
    height: 5px;
    margin: 0 5px;
    padding-left: 0;
    transition: all 0.2s ease-in-out;
    width: 5px;
}

.quiqqer-bricks-slider-basicSlider-control__dotNav :where(li.active) {
    background-color: var(--_qui-bricks-slider-basicSlider-dot-active-bgColor);
    border-color: var(--_qui-bricks-slider-basicSlider-dot-active-borderColor);
    transform: scale(1.5);
}

@media screen and (max-width: 768px) {
    .quiqqer-bricks-slider-basicSlider-control {
        flex-direction: var(--_qui-bricks-slider-basicSlider-direction--mobile, column);
    }

    .quiqqer-bricks-slider-basicSlider-control__slider {
        height: var(--_qui-bricks-slider-basicSlider-slider-height--mobile);
    }

    .quiqqer-bricks-slider-basicSlider-control__content,
    .quiqqer-bricks-slider-basicSlider-control__sliderWrapper {
        width: 100%;
    }
}