/* Atualização 121 — Setas da seção Músicas: direção correta e hover sem deslocar
   Correção somente CSS, sem scripts e sem alteração no banco. */

#music .music-slide__visual{
  position:relative!important;
  overflow:visible!important;
}

#music .music-carousel__arrows,
#music .music-arrows-v116,
#music .music-arrows-v117{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  pointer-events:none!important;
  z-index:60!important;
  display:block!important;
  transform:none!important;
}

/* Base igual para os dois botões */
#music .music-prev,
#music .music-next{
  position:absolute!important;
  top:50%!important;
  width:78px!important;
  height:78px!important;
  min-width:78px!important;
  min-height:78px!important;
  padding:0!important;
  margin:0!important;
  border-radius:999px!important;
  border:2px solid rgba(48,30,8,.95)!important;
  background:
    radial-gradient(circle at 30% 22%, rgba(255,243,176,.95), transparent 32%),
    linear-gradient(145deg,#f0c760 0%,#d9a744 48%,#b97820 100%)!important;
  color:#231504!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  pointer-events:auto!important;
  cursor:pointer!important;
  opacity:1!important;
  box-shadow:
    0 16px 34px rgba(0,0,0,.34),
    0 0 0 3px rgba(222,173,83,.20),
    inset 0 2px 0 rgba(255,255,255,.42),
    inset 0 -8px 16px rgba(81,45,8,.25)!important;
  transition:filter .18s ease, box-shadow .18s ease, background .18s ease!important;
  font-size:0!important;
  line-height:0!important;
  -webkit-tap-highlight-color:transparent!important;
}

/* Posição fixa: hover não muda posição nem escala */
#music .music-prev{
  left:-40px!important;
  right:auto!important;
  transform:translate(0,-50%)!important;
}
#music .music-next{
  right:-40px!important;
  left:auto!important;
  transform:translate(0,-50%)!important;
}

#music .music-prev:hover,
#music .music-next:hover,
#music .music-prev:focus-visible,
#music .music-next:focus-visible{
  transform:translate(0,-50%)!important;
  filter:brightness(1.08) saturate(1.06)!important;
  box-shadow:
    0 18px 42px rgba(0,0,0,.39),
    0 0 0 7px rgba(222,173,83,.16),
    inset 0 2px 0 rgba(255,255,255,.46),
    inset 0 -8px 16px rgba(81,45,8,.27)!important;
}

#music .music-prev:active,
#music .music-next:active{
  transform:translate(0,-50%)!important;
  filter:brightness(.98)!important;
}

/* Esconde qualquer ícone/texto herdado */
#music .music-prev > *,
#music .music-next > *{
  display:none!important;
}

/* Chevron real: esquerda aponta para esquerda; direita aponta para direita */
#music .music-prev::before,
#music .music-next::before{
  content:''!important;
  display:block!important;
  width:20px!important;
  height:30px!important;
  background:#231504!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
  transform:none!important;
}

#music .music-prev::before{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 44'%3E%3Cpath fill='black' d='M25.8 4.7 21.1 0 0 22l21.1 22 4.7-4.7L9.2 22z'/%3E%3C/svg%3E")!important;
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 44'%3E%3Cpath fill='black' d='M25.8 4.7 21.1 0 0 22l21.1 22 4.7-4.7L9.2 22z'/%3E%3C/svg%3E")!important;
}

#music .music-next::before{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 44'%3E%3Cpath fill='black' d='M2.2 4.7 6.9 0 28 22 6.9 44 2.2 39.3 18.8 22z'/%3E%3C/svg%3E")!important;
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 44'%3E%3Cpath fill='black' d='M2.2 4.7 6.9 0 28 22 6.9 44 2.2 39.3 18.8 22z'/%3E%3C/svg%3E")!important;
}

@media (max-width:1050px){
  #music .music-prev{left:12px!important;}
  #music .music-next{right:12px!important;}
  #music .music-prev,
  #music .music-next{
    width:58px!important;
    height:58px!important;
    min-width:58px!important;
    min-height:58px!important;
  }
  #music .music-prev::before,
  #music .music-next::before{
    width:15px!important;
    height:23px!important;
  }
}
