/* ===========================================================
   Spacivo Marquee — right-to-left scrolling ticker. Self-contained plugin
   CSS (no dependency on the active theme). Two identical .spacivo-marquee__set
   blocks are rendered server-side so translating the track by exactly -50%
   loops seamlessly with no JS-driven scroll logic needed.
   =========================================================== */

.spacivo-marquee { overflow: hidden; background: #8A1748; }
.spacivo-marquee__track {
  display: flex; width: max-content;
  animation-name: spacivo-marquee-scroll;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.spacivo-marquee:hover .spacivo-marquee__track { animation-play-state: paused; }

@keyframes spacivo-marquee-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

.spacivo-marquee__set { display: flex; align-items: center; flex-shrink: 0; }
.spacivo-marquee__item {
  display: inline-flex; align-items: center; gap: .6rem;
  padding: 1rem 1.5rem; color: #fff; font-size: .95rem; font-weight: 500; white-space: nowrap;
}
.spacivo-marquee__icon { width: 16px; height: 16px; flex-shrink: 0; object-fit: contain; }
.spacivo-marquee__icon--default {
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .9rem; line-height: 1; color: rgba(255,255,255,.85); width: auto; height: auto;
}

.spacivo-marquee-unconfigured-notice {
  font-size: .85rem; color: #a22022; background: #fff3f3; border: 1px dashed #a22022;
  padding: .75rem 1rem; margin: 1rem auto; max-width: 1280px;
}
.spacivo-marquee-unconfigured-notice a { color: #8A1748; font-weight: 600; }

@media (prefers-reduced-motion: reduce) {
  .spacivo-marquee__track { animation: none; }
}

@media (max-width: 750px) {
  .spacivo-marquee__item { padding: .75rem 1rem; font-size: .85rem; gap: .4rem; }
  .spacivo-marquee__icon { width: 14px; height: 14px; }
}