/* 068 — Ajuste premium da seção Músicas
   Reduz o comprimento do player Spotify no desktop e reposiciona as setas para não embolar no player.
   Mobile preserva as setas sobre a capa, como definido nas atualizações 066/067. */

@media (min-width: 761px){
  .music .music-carousel{
    max-width:min(1180px,88vw)!important;
  }

  .music .music-slide.is-active,
  .music .music-slide{
    grid-template-columns:minmax(260px,380px) minmax(320px,520px)!important;
    gap:clamp(34px,4.4vw,72px)!important;
    justify-content:center!important;
  }

  .music .music-slide__content{
    width:min(520px,32vw)!important;
    max-width:520px!important;
    min-width:320px!important;
    justify-self:start!important;
  }

  .music .music-embed{
    width:100%!important;
    max-width:520px!important;
    min-height:142px!important;
    height:142px!important;
    margin:16px 0 12px!important;
    border-radius:14px!important;
    overflow:hidden!important;
  }

  .music .music-embed iframe,
  .music .music-embed__empty{
    width:100%!important;
    max-width:520px!important;
    min-height:142px!important;
    height:142px!important;
  }

  /* O JS 068 calcula as posições exatas. Este CSS só garante que as setas fiquem livres do player. */
  .music-carousel.music-carousel--desktop-player-arrows .music-carousel__arrows{
    left:0!important;
    top:0!important;
    width:100%!important;
    height:0!important;
    max-width:none!important;
    transform:none!important;
    display:block!important;
    pointer-events:none!important;
    z-index:72!important;
  }

  .music-carousel.music-carousel--desktop-player-arrows .music-carousel__arrows button{
    position:absolute!important;
    top:var(--music-arrow-y,220px)!important;
    margin:0!important;
    transform:none!important;
    pointer-events:auto!important;
    width:clamp(46px,3.25vw,54px)!important;
    height:clamp(46px,3.25vw,54px)!important;
    min-width:46px!important;
    min-height:46px!important;
  }

  .music-carousel.music-carousel--desktop-player-arrows .music-carousel__arrows .music-prev{
    left:var(--music-prev-x,0px)!important;
    right:auto!important;
  }

  .music-carousel.music-carousel--desktop-player-arrows .music-carousel__arrows .music-next{
    left:var(--music-next-x,0px)!important;
    right:auto!important;
  }

  .music-carousel.music-carousel--desktop-player-arrows .music-carousel__arrows .music-prev:hover,
  .music-carousel.music-carousel--desktop-player-arrows .music-carousel__arrows .music-prev:focus-visible,
  .music-carousel.music-carousel--desktop-player-arrows .music-carousel__arrows .music-next:hover,
  .music-carousel.music-carousel--desktop-player-arrows .music-carousel__arrows .music-next:focus-visible{
    transform:scale(1.055)!important;
  }

  .music-carousel.music-carousel--desktop-player-arrows .music-carousel__arrows .music-prev:active,
  .music-carousel.music-carousel--desktop-player-arrows .music-carousel__arrows .music-next:active{
    transform:scale(.98)!important;
  }

  /* Garante respiro visual entre player e a seta direita */
  .music-carousel.music-carousel--desktop-player-arrows .music-carousel__arrows .music-next{
    box-shadow:
      0 18px 42px rgba(0,0,0,.64),
      0 0 0 1px rgba(255,255,255,.08) inset,
      0 0 28px rgba(215,255,53,.24)!important;
  }
}

@media (min-width: 761px) and (max-width: 1120px){
  .music .music-slide.is-active,
  .music .music-slide{
    grid-template-columns:minmax(240px,340px) minmax(300px,460px)!important;
    gap:42px!important;
  }
  .music .music-slide__content,
  .music .music-embed,
  .music .music-embed iframe,
  .music .music-embed__empty{
    max-width:460px!important;
  }
}
