/* Shaktiva · Música de ambiente (Adrián, 2026-10-09). Se carga en todas las páginas.
   El botón lo crea assets/js/shaktiva-interactions.js (§2 sexies) al final del <body>: sin JS no hay música ni botón.
   Flotante abajo a la derecha, «que nos acompañe en la navegación». Lila con icono y texto lino (contraste 9,6:1),
   44 px de alto, radio de 2 px. Por encima del contenido y por debajo de la cesta, el aviso de la cesta y el banner
   de cookies; en móvil se esconde mientras el banner de cookies está abierto (ocupa todo el ancho abajo). */

.sk-musica{
  position:fixed;z-index:900;
  right:24px;bottom:calc(24px + env(safe-area-inset-bottom, 0px));
  display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 16px 0 12px;
  background:var(--shaktiva-lila-espacial,#4A2E73);color:#F4EEE6;border:0;border-radius:2px;cursor:pointer;
  font:500 var(--sk-sm,15px)/1 var(--shaktiva-font-text);letter-spacing:.06em;text-transform:uppercase;
  transition:box-shadow .25s ease;
}
.sk-musica:hover{box-shadow:inset 0 0 0 1px rgba(244,238,230,.7)}
.sk-musica svg{display:block;flex:none}
.sk-musica .sk-musica-pausa,.sk-musica[aria-pressed="true"] .sk-musica-play{display:none}
.sk-musica[aria-pressed="true"] .sk-musica-pausa{display:block}
/* mientras suena, las barras de la pausa respiran */
@media (prefers-reduced-motion:no-preference){
  .sk-musica[aria-pressed="true"] .sk-musica-pausa path{transform-origin:50% 50%;animation:sk-musica-respira 2.4s ease-in-out infinite}
}
@keyframes sk-musica-respira{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.72)}}

@media (max-width:767px){
  .sk-musica{right:16px;bottom:calc(16px + env(safe-area-inset-bottom, 0px))}
  body:has(.cky-consent-container:not(.cky-hide)) .sk-musica{display:none}
}
/* Al final de la página el botón tapaba la barra legal del pie: «Preferencias de cookies» a 1440 px (el control para
   retirar el consentimiento, que tiene que estar tan a mano como darlo) y el crédito a 1024 px (2026-11-13).
   Se reserva bajo el pie la altura del botón + su margen + aire: 44 + 24 + 20 = 88 px. En móvil no tapaba nada. */
@media (min-width:768px){
  body:has(.sk-musica) .shaktiva-footer-bottom{padding-bottom:88px}
}
/* con la cesta abierta, fuera */
body:has(#shaktiva-cart-drawer-wrapper.is-open) .sk-musica{display:none}
@media print{.sk-musica{display:none}}
