/*
Theme Name:   ProduzSite Child Theme
Theme URI:    https://produzsite.com
Description:  ProduzSite Child Theme para customizações
Author:       Produz Site
Author URI:   https://produzsite.com
Template:     hello-elementor
Version:      1.0.0
Text Domain:  produzsite-child-theme
*/

.user-names-wrapper {
  display: flex;
  flex-direction: column;
  gap: 1em;
  margin: 2em auto;
  max-width: 100%;
}

/* container “janela” de cada faixa */
.marquee {
  overflow: hidden;
  width: 100%;
  box-sizing: border-box;
}

/* animação da track */
.marquee-track {
  display: inline-flex;
  align-items: center;
}

/* direção e duração de cada faixa */
.marquee-top   .marquee-track { animation: scroll-left 23s linear infinite; }
.marquee-bottom .marquee-track { animation: scroll-right 23s linear infinite; }
.marquee-third  .marquee-track { animation: scroll-left 23s linear infinite; }

/* cada slide */
.marquee-track .slide {
  display: flex;
  align-items: center;
  flex: none;
  margin-right: 1em;
  padding: 1em;
  background: #111;
  border: 1px solid #222;
  border-radius: 4px;
}

/* avatar */
.marquee-track .avatar-wrap {
  width: 65px; height: 65px;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 1em;
}
.marquee-track .avatar-wrap img {
  width: 100%; height: auto;
}

/* texto */
.marquee-track .character-type {
  font-size: .7rem;
  color: #FFC60B;
  margin-bottom: .25em;
}
.marquee-track .user-name {
  font-size: 1.1rem;
  color: #fff;
  font-weight: bold;
}

/* Level abaixo do nome */
.marquee-track .character-level {
  font-size: .7rem;
  color: #fff;
  margin-top: .25em;
}

/* keyframes */
@keyframes scroll-left {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@keyframes scroll-right {
  from { transform: translateX(-50%); }
  to   { transform: translateX(0); }
}