/**
 * CBC Elementor Widgets - Styles
 *
 * @package CBC_Elementor_Widgets
 * @since 1.0.0
 */

/* ==========================================================================
   Text Marquee Widget
   ========================================================================== */

.cbc-text-marquee-wrapper {
    overflow: hidden;
    position: relative;
    width: 100%;
    box-sizing: border-box;
}

.cbc-marquee-inner {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    will-change: transform;
    /* Seamless loop container */
}

.cbc-marquee-text {
    display: inline-block;
    margin: 0;
    padding-right: 2rem;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Direction: Left */
.cbc-text-marquee-wrapper[data-direction="left"] .cbc-marquee-inner {
    animation: cbc-marquee-left var(--cbc-marquee-speed, 20s) linear infinite;
}

/* Direction: Right */
.cbc-text-marquee-wrapper[data-direction="right"] .cbc-marquee-inner {
    animation: cbc-marquee-right var(--cbc-marquee-speed, 20s) linear infinite;
}

.cbc-text-marquee-wrapper[data-direction-reverse="true"] .cbc-marquee-inner {
    animation-direction: reverse;
}

/* Pause on Hover */
.cbc-text-marquee-wrapper[data-pause-on-hover="yes"]:hover .cbc-marquee-inner {
    animation-play-state: paused;
}

/* Keyframes for Left Direction - uses dynamic distance when set, falls back to 50% */
@keyframes cbc-marquee-left {
    from {
        transform: translateX(var(--cbc-marquee-start, 0));
    }
    to {
        transform: translateX(var(--cbc-marquee-distance, -50%));
    }
}

/* Keyframes for Right Direction */
@keyframes cbc-marquee-right {
    from {
        transform: translateX(var(--cbc-marquee-distance, -50%));
    }
    to {
        transform: translateX(var(--cbc-marquee-start, 0));
    }
}

/* Accessibility: Respect user's motion preferences */
@media (prefers-reduced-motion: reduce) {
    .cbc-text-marquee-wrapper .cbc-marquee-inner {
        animation: none;
    }

    .cbc-text-marquee-wrapper {
        overflow-x: auto;
    }
}

/* Elementor Editor Compatibility */
.elementor-editor-active .cbc-text-marquee-wrapper .cbc-marquee-inner {
    animation-play-state: running;
}

/* RTL Support */
.rtl .cbc-text-marquee-wrapper[data-direction="left"] .cbc-marquee-inner {
    animation-name: cbc-marquee-right;
}

.rtl .cbc-text-marquee-wrapper[data-direction="right"] .cbc-marquee-inner {
    animation-name: cbc-marquee-left;
}

/* Responsive Adjustments */
@media screen and (max-width: 768px) {
    .cbc-marquee-text {
        padding: 0 1rem;
    }
}

@media screen and (max-width: 480px) {
    .cbc-marquee-text {
        padding: 0 0.5rem;
    }
}