/*.player {*/
/*  padding: 1vw;*/
/*}*/


/*.player-cover-image {*/
/*  ;*/
/*  animation: bga 60s linear infinite;*/
/*}*/

/*@keyframes bga {*/
/*  50% {*/
/*    transform: scale(2)*/
/*  }*/
/*}*/

/*.items-start {*/
/*  align-items: flex-start;*/
/*  margin-top: 15px;*/
/*}*/

.player-button {
  font-weight: 300;
}

.player-program {

  background-image: linear-gradient(transparent, rgb(0 0 0 / 98%));

}

.player-program-badge {
  font-weight: 700;

}

/* === Controles derecha: icono + texto en una sola línea (no en columna) === */
.player-right .player-button,
.player-right .player-button-store,
.player-right .player-button-tv,
.player-right .player-button-volume-toggle {
  flex-direction: row;
  gap: .4rem;
  white-space: nowrap;
}

/* Hacemos los botones un poco más compactos para que entren todos en una línea */
.player-right .player-button {
  font-size: 11px;
}

/* === Stores junto al botón de TV === */
.online-tv,
.online-tv-header {
  display: flex;
  align-items: center;
  gap: .5rem;
}

/* Botones store dentro del player (desktop) */
.player-button-store {
  min-width: 44px;
}

/* Botones store compactos en header (mobile) */
.btn-store {
  padding: .5rem;
  --i-size: 18px;
}

/* === Redes sociales en el header (tablet/móvil) ===
   En desktop quedan en la barra del player. En <=1300px, el CSS del tema
   oculta .player-social, así que las mostramos arriba. */
.header-social{
  display: none;
  align-items: center;
  justify-content: flex-end;
  gap: .4rem;
  flex-wrap: wrap;
  max-width: 62vw;
}
@media (max-width: 1300px){
  .header-social{ display: flex; }
}

.header-social .player-social-item{
  padding: .35rem;
  --i-size: 16px;
  border-color: rgba(255,255,255,.65);
  background: rgba(0,0,0,.15);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.header-social .player-social-item:hover{
  border-color: rgba(255,255,255,.95);
}
/* Tamaño del nombre de la canción (Now Playing) */
.song-now .song-title{
  font-size: 12px !important;
  line-height: 1.2;
}

/* === MARQUEE INFINITO (solo Now Playing) === */
.song-now .song-title,
.song-now .song-artist{
  display: block !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

.song-now .mq-active{
  overflow: hidden !important;
  white-space: nowrap !important;
}

.song-now .mq-inner{
  display: inline-flex;
  align-items: center;
  gap: var(--mq-gap, 24px);
  will-change: transform;
  animation: mq-scroll var(--mq-duration, 12s) linear infinite;
}

.song-now .mq-inner .mq-text{
  flex: none;
}

@keyframes mq-scroll{
  from{ transform: translateX(0); }
  to{ transform: translateX(calc(-1 * var(--mq-distance, 120px))); }
}

@media (prefers-reduced-motion: reduce){
  .song-now .mq-inner{ animation: none !important; transform: none !important; }
}
/* === RESTAURAR PLAYER ABAJO (por si quedó pisado) === */
.player{
  position: fixed !important;
  inset: auto 0 0 !important;
  z-index: 100 !important;
}
@media (min-width: 992px){
  .player{
    inset: auto 8vw 1.5vw !important; /* respeta el layout desktop original */
  }
}

/* === PULSE SEGURO: solo anima la imagen de fondo, sin cambiar posiciones === */
.player-cover-image.song-cover{
  transform-origin: center center;
  will-change: transform;
  animation: bgPulse 16s ease-in-out infinite;
}

@keyframes bgPulse{
  0%, 100% { transform: scale(1.0); }
  50%      { transform: scale(1.20); } /* subí a 1.10 si querés más efecto */
}
/* ↓ Disminuir el blur de la carátula usada como fondo */
.player-cover-image.song-cover{
  -webkit-filter: blur(6px) !important;
  filter: blur(6px) !important;
}
/* === FIX CIERRE MODAL TV (sin mover el modal) === */

/* Solo aseguramos que el modal quede arriba de la web */
#modal-tv{
  z-index: 9999 !important;
}

/* El contenedor del video como referencia */
#modal-tv .modal-body-video{
  position: relative !important;
  z-index: 1 !important;
}

/* El iframe no debe “tapar” el botón */
#modal-tv .modal-body-video iframe{
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  display: block !important;
  z-index: 1 !important;
}

/* Botón cerrar siempre por encima del iframe */
#modal-tv > [data-close]{
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  z-index: 10000 !important;

  width: 44px !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 999px !important;
  background: rgba(0,0,0,.55) !important;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
#modal-tv > [data-close] svg{
  width: 22px !important;
  height: 22px !important;
}