/**
 * PXA Marquee Text - Styles
 * Version: 1.4.1
 * Robust gegen Theme-Überschreibungen
 */

.pxa-marquee-wrapper {
    overflow: hidden !important;
    position: relative !important;
    width: 100% !important;
    background: transparent;
    white-space: nowrap !important;
    line-height: 1 !important;
    margin: 0 !important; /* Kein Margin standardmäßig */
    display: block !important;
}

.pxa-marquee-container {
    display: inline-flex !important;
    white-space: nowrap !important;
    will-change: transform !important;
    margin: 0 !important;
    padding: 0 !important;
    /* Animation wird inline gesetzt - nicht hier überschreiben! */
}

.pxa-marquee-text {
    display: inline-flex !important;
    align-items: center !important;
    white-space: nowrap !important;
    padding: 0 !important;
    margin: 0 !important;
}

.pxa-marquee-text span {
    display: inline-block !important;
    white-space: nowrap !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Pause bei Hover */
.pxa-marquee-wrapper.pause-on-hover:hover .pxa-marquee-container {
    animation-play-state: paused !important;
}

/* WordPress fügt manchmal p-Tags um Shortcodes - entferne deren Abstände */
p > .pxa-marquee-wrapper,
.pxa-marquee-wrapper + .pxa-marquee-wrapper {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Entferne Abstände von umgebenden p-Tags */
p:has(> .pxa-marquee-wrapper) {
    margin: 0 !important;
    padding: 0 !important;
}

/* Barrierefreiheit: Animation stoppen bei prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
    .pxa-marquee-container {
        animation: none !important;
    }
    
    .pxa-marquee-wrapper {
        overflow-x: auto !important;
    }
}

/* Responsives Verhalten für sehr kleine Screens */
@media (max-width: 480px) {
    .pxa-marquee-wrapper {
        font-size: 14px !important;
    }
}

/* Barrierefreiheit: Animation stoppen bei prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
    .pxa-marquee-container {
        animation: none !important;
    }
    
    .pxa-marquee-wrapper {
        overflow-x: auto;
    }
}

/* Optionale visuelle Verbesserungen */
.pxa-marquee-wrapper::before,
.pxa-marquee-wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 50px;
    pointer-events: none;
    z-index: 2;
}

/* Fade-Effekt am Anfang und Ende (optional) */
.pxa-marquee-wrapper.fade-edges::before {
    left: 0;
    background: linear-gradient(to right, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}

.pxa-marquee-wrapper.fade-edges::after {
    right: 0;
    background: linear-gradient(to left, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}

/* Responsives Verhalten */
@media (max-width: 768px) {
    .pxa-marquee-text span {
        font-size: 18px;
    }
}

@media (max-width: 480px) {
    .pxa-marquee-text span {
        font-size: 16px;
    }
}