/* RCM_APP_28.8.3 (Luis): the sliding marquee, one shared component (static/js/card_marquee.js).
   A text that fits stands still; one that does not slides (force = always slides). JS adds enough
   clones that the track never shows a blank gap while moving. Moved here from entity_relation_card.css. */
.rcm-card-marquee{display:block;width:100%;min-width:0;overflow:hidden;white-space:nowrap}
.rcm-card-marquee-track{
    display:flex;
    align-items:center;
    width:max-content;
    min-width:max-content;
    gap:34px;
    transform:translateX(0);
    will-change:transform;
}
.rcm-card-marquee-copy{display:inline-block;white-space:nowrap;flex:0 0 auto}
.rcm-card-marquee-copy.is-clone{display:none}
.rcm-card-marquee.is-running .rcm-card-marquee-copy.is-clone{display:inline-block}
.rcm-card-marquee.is-running .rcm-card-marquee-track{
    animation:rcm-card-text-marquee var(--rcm-card-marquee-duration,10s) linear infinite;
}
@keyframes rcm-card-text-marquee{from{transform:translateX(0)}to{transform:translateX(calc(-1 * var(--rcm-card-marquee-distance,0px)))}}

/* Standing still with "..." instead of sliding: put .rcm-marquee-still on the marquee or on any
   parent (Events: an event that is over, event_cards.css). Reduced motion does the same everywhere. */
.rcm-marquee-still .rcm-card-marquee-track,
.rcm-card-marquee.rcm-marquee-still .rcm-card-marquee-track{animation:none!important;width:100%;min-width:0;transform:none}
.rcm-marquee-still .rcm-card-marquee-copy.is-clone,
.rcm-card-marquee.rcm-marquee-still .rcm-card-marquee-copy.is-clone{display:none!important}
.rcm-marquee-still .rcm-card-marquee-copy:first-child,
.rcm-card-marquee.rcm-marquee-still .rcm-card-marquee-copy:first-child{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}

@media(max-width:600px){
    .rcm-card-marquee-track{gap:28px}
}

@media(prefers-reduced-motion:reduce){
    .rcm-card-marquee.is-running .rcm-card-marquee-track{animation:none!important;width:100%;min-width:0;transform:none}
    .rcm-card-marquee.is-running .rcm-card-marquee-copy.is-clone{display:none!important}
    .rcm-card-marquee.is-running .rcm-card-marquee-copy:first-child{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
}
