.ng-carousel-slider {
    position: relative;
    width: 100%;
    background: var(--container-bg);
    padding: var(--container-padding);
    box-shadow: var(--container-shadow);
    border-radius: var(--container-border-radius);
    overflow: hidden;
    --swiper-transition-timing: ease;
    --swiper-pagination-color: var(--pagination-color, #007aff);
    --swiper-theme-color: var(--nav-color, #ffffff);
}

.ng-carousel-slider[data-height-mode="fullscreen"] {
    height: 100vh;
}

.ng-carousel-slider[data-height-mode="fixed"],
.ng-carousel-slider[data-height-mode="custom"] {
    height: var(--height-desktop);
}

.ng-carousel-slider .swiper-wrapper {
    height: 100%;
}

.ng-carousel-slider .swiper-slide {
    height: 100%;
    position: relative;
    border-radius: var(--slide-border-radius);
    background: var(--slide-bg);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    transition-timing-function: var(--swiper-transition-timing) !important;
    overflow: hidden;
}

.ng-carousel-slider .swiper-slide a {
    display: block;
    width: 100%;
    height: 100%;
}

/* Anpassen der Übergangseffekte für verschiedene Swiper-Komponenten */
.ng-carousel-slider .swiper-slide-shadow-left,
.ng-carousel-slider .swiper-slide-shadow-right,
.ng-carousel-slider .swiper-slide-shadow-top,
.ng-carousel-slider .swiper-slide-shadow-bottom {
    transition-timing-function: var(--swiper-transition-timing) !important;
}

.ng-carousel-slider .swiper-slide img,
.ng-carousel-slider .swiper-slide picture {
    width: 100%;
    height: 100%;
    object-fit: var(--image-fit);
    display: block;
    transition-timing-function: var(--swiper-transition-timing) !important;
}

.ng-carousel-slider .swiper-slide picture img {
    width: 100%;
    height: 100%;
    object-fit: var(--image-fit);
}

.ng-carousel-slider .slide-title {
    position: absolute;
    min-width: var(--title-min-width, 200px);
    max-width: var(--title-max-width, 600px);
    width: max-content;
    background: var(--title-background, rgba(0, 0, 0, 0.7));
    color: var(--title-color, #fff);
    padding: var(--title-padding, 15px);
    margin: 0;
    font-size: var(--title-font-size-desktop, 18px);
    transition-timing-function: var(--swiper-transition-timing) !important;
    text-align: var(--title-text-align, center);
    line-height: var(--title-line-height, 1.4);
    border-radius: 4px;
    z-index: 10;
    white-space: var(--title-word-wrap, normal);
    overflow-wrap: break-word;
    word-wrap: break-word;
    hyphens: auto;
}

/* Titel-Positionierung */
.ng-carousel-slider .slide-title[data-position="bottom"] {
    bottom: var(--title-padding, 15px);
    top: auto;
    left: 50%;
    right: auto;
    transform: translateX(-50%);
}

.ng-carousel-slider .slide-title[data-position="top"] {
    top: var(--title-padding, 15px);
    bottom: auto;
    left: 50%;
    right: auto;
    transform: translateX(-50%);
}

.ng-carousel-slider .slide-title[data-position="center"] {
    top: 50%;
    left: 50%;
    bottom: auto;
    right: auto;
    transform: translate(-50%, -50%);
}

.ng-carousel-slider .slide-title[data-position="custom"] {
    top: var(--title-offset-top, auto);
    bottom: var(--title-offset-bottom, auto);
    left: var(--title-offset-left, auto);
    right: var(--title-offset-right, auto);
    transform: none;
}

/* Wenn der Titel horizontal zentriert werden soll bei benutzerdefinierten Positionen */
.ng-carousel-slider .slide-title[data-position="custom"][data-center-x="true"] {
    left: 50%;
    transform: translateX(-50%);
}

/* Wenn der Titel vertikal zentriert werden soll bei benutzerdefinierten Positionen */
.ng-carousel-slider .slide-title[data-position="custom"][data-center-y="true"] {
    top: 50%;
    transform: translateY(-50%);
}

/* Wenn der Titel sowohl horizontal als auch vertikal zentriert werden soll */
.ng-carousel-slider .slide-title[data-position="custom"][data-center-x="true"][data-center-y="true"] {
    transform: translate(-50%, -50%);
}

/* Responsive Schriftgrößen */
@media screen and (max-width: 1024px) {
    .ng-carousel-slider .slide-title {
        font-size: var(--title-font-size-tablet, 16px);
        max-width: min(var(--title-max-width, 600px), 80vw);
        padding: calc(var(--title-padding, 15px) * 0.9);
    }
}

@media screen and (max-width: 768px) {
    .ng-carousel-slider .slide-title {
        font-size: var(--title-font-size-mobile, 14px);
        max-width: min(var(--title-max-width, 600px), 90vw);
        padding: calc(var(--title-padding, 15px) * 0.8);
    }
}

/* Navigation Buttons */
.ng-carousel-slider .swiper-button-next,
.ng-carousel-slider .swiper-button-prev {
    color: var(--nav-color, #ffffff);
    background: var(--nav-background, rgba(0, 0, 0, 0.5));
    width: var(--nav-size, 44px);
    height: var(--nav-size, 44px);
    border-radius: 50%;
    transition: background 0.3s var(--swiper-transition-timing);
}

.ng-carousel-slider .swiper-button-next:after,
.ng-carousel-slider .swiper-button-prev:after {
    font-size: calc(var(--nav-size, 44px) * 0.4);
}

/* Navigation Icons */
.ng-carousel-slider[data-nav-icon="arrow"] .swiper-button-next:after {
    content: "→";
}
.ng-carousel-slider[data-nav-icon="arrow"] .swiper-button-prev:after {
    content: "←";
}
.ng-carousel-slider[data-nav-icon="chevron"] .swiper-button-next:after {
    content: "›";
}
.ng-carousel-slider[data-nav-icon="chevron"] .swiper-button-prev:after {
    content: "‹";
}
.ng-carousel-slider[data-nav-icon="angle"] .swiper-button-next:after {
    content: "⟩";
}
.ng-carousel-slider[data-nav-icon="angle"] .swiper-button-prev:after {
    content: "⟨";
}

.ng-carousel-slider .swiper-button-next:hover,
.ng-carousel-slider .swiper-button-prev:hover {
    background: var(--nav-background, rgba(0, 0, 0, 0.8));
}

/* Pagination Positionierung */
.ng-carousel-slider[data-pagination-position="top"] .swiper-pagination {
    top: var(--pagination-distance, 10px);
    bottom: auto;
}

.ng-carousel-slider[data-pagination-position="bottom"] .swiper-pagination {
    bottom: var(--pagination-distance, 10px);
    top: auto;
}

.ng-carousel-slider[data-pagination-position="left"] .swiper-pagination,
.ng-carousel-slider[data-pagination-position="right"] .swiper-pagination {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: auto;
    height: auto;
    top: 50%;
    transform: translateY(-50%);
}

.ng-carousel-slider[data-pagination-position="left"] .swiper-pagination {
    left: var(--pagination-distance, 10px);
    right: auto;
}

.ng-carousel-slider[data-pagination-position="right"] .swiper-pagination {
    right: var(--pagination-distance, 10px);
    left: auto;
}

.ng-carousel-slider .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background: var(--pagination-background, rgba(255, 255, 255, 0.7));
    opacity: 1;
    transition: all 0.3s var(--swiper-transition-timing);
    margin: 0 5px;
    border: var(--pagination-border, none);
    box-sizing: border-box;
}

.ng-carousel-slider .swiper-pagination-bullet-active {
    background: var(--pagination-color, #007aff);
    opacity: 1;
    border: var(--pagination-border, none);
}

/* Responsive Anpassungen */
@media (max-width: 1024px) {
    .ng-carousel-slider[data-height-mode="fixed"],
    .ng-carousel-slider[data-height-mode="custom"] {
        height: var(--height-tablet);
    }
}

@media (max-width: 767px) {
    .ng-carousel-slider[data-height-mode="fixed"],
    .ng-carousel-slider[data-height-mode="custom"] {
        height: var(--height-mobile);
    }
}

@media (max-width: 400px) {
    .ng-carousel-slider[data-height-mode="fixed"],
    .ng-carousel-slider[data-height-mode="custom"] {
        height: var(--height-mobile);
    }
    
    .ng-carousel-slider .slide-title {
        font-size: var(--title-font-size-mobile);
        padding: calc(var(--title-padding) * 0.8);
    }
}