/* Reproductor global permanente de jingles. Compartido por todas las páginas. */
html.has-global-player body { padding-bottom: 76px; }

.jingles-icon-btn {
  border: 0;
  padding: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--navy);
  background: var(--surface-container, #f3f4f7);
  transition: background var(--dur-fast, 160ms) var(--ease, ease), transform var(--dur-fast, 160ms) var(--ease, ease), color var(--dur-fast, 160ms) var(--ease, ease);
}
.jingles-icon-btn:hover { background: var(--red, #930000); color: #fff; transform: scale(1.06); }
.jingles-icon-btn:active { transform: scale(.94); }
.jingles-icon-btn svg { width: 18px; height: 18px; }
.jingles-icon-btn--sm { width: 32px; height: 32px; }
.jingles-icon-btn--sm svg { width: 15px; height: 15px; }
.jingles-icon-btn[hidden] { display: none; }
.jingles-icon-btn[aria-pressed="true"],
.jingles-icon-btn[data-repeat-mode="all"],
.jingles-icon-btn[data-repeat-mode="one"] { background: var(--red, #930000) !important; color: #fff !important; }
[data-repeat-btn] { position: relative; }
.jingles-repeat-one {
  position: absolute; top: -2px; right: -2px; width: 14px; height: 14px;
  border-radius: 50%; background: var(--navy, #010e28); color: #fff;
  border: 1.5px solid #fff; font: 700 8px/1 sans-serif;
  display: flex; align-items: center; justify-content: center;
}

.jingles-eq { display: flex; align-items: flex-end; gap: 3px; opacity: 0; pointer-events: none; transition: opacity 180ms ease; }
.jingles-eq.is-active { opacity: 1; }
.jingles-eq span { width: 3px; height: 14%; border-radius: 3px; background: linear-gradient(180deg, #ed1c24, var(--red, #930000)); animation: player-eq-bounce 900ms ease-in-out infinite; animation-play-state: paused; }
.jingles-eq.is-active span { animation-play-state: running; }
.jingles-eq span:nth-child(1) { animation-duration: 780ms; }
.jingles-eq span:nth-child(2) { animation-duration: 640ms; animation-delay: 90ms; }
.jingles-eq span:nth-child(3) { animation-duration: 900ms; animation-delay: 40ms; }
.jingles-eq span:nth-child(4) { animation-duration: 560ms; animation-delay: 160ms; }
.jingles-eq span:nth-child(5) { animation-duration: 820ms; animation-delay: 210ms; }
@keyframes player-eq-bounce { 0%,100% { height: 14%; } 50% { height: 100%; } }
.jingles-eq--mini { position: absolute; inset: 0; align-items: center; justify-content: center; height: auto; background: rgba(1,14,40,.45); border-radius: 4px; }
.jingles-eq--mini span { height: 8px; }
.jingles-eq--footer { position: static; align-items: center; height: 18px; flex-shrink: 0; }
.jingles-eq--footer span { height: 30%; }

.jingles-player {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 1000;
  min-height: 76px; background: var(--navy, #010e28); color: #fff;
  border-top: 1px solid rgba(255,255,255,.18);
  display: grid; grid-template-columns: minmax(220px,1fr) minmax(320px,2fr) minmax(160px,.7fr);
  align-items: center; gap: 24px; padding: 10px 24px;
  box-shadow: 0 -12px 34px rgba(1,14,40,.22);
}
.jingles-player[hidden] { display: none; }
.jingles-player__track { display: flex; align-items: center; gap: 12px; min-width: 0; }
.jingles-player__cover { position: relative; width: 48px; height: 48px; border-radius: 4px; overflow: hidden; background: #071837 center/cover no-repeat; flex-shrink: 0; }
.jingles-player__meta { min-width: 0; }
.jingles-player__title { display: block; color: #fff; font: 600 14px/1.3 var(--font-body, sans-serif); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: none; }
.jingles-player__title:hover { text-decoration: underline; text-underline-offset: 3px; }
.jingles-player__category { color: rgba(255,255,255,.72); font-size: 12px; margin: 2px 0 0; }
.jingles-player__extras { display: flex; align-items: center; gap: 4px; flex-shrink: 0; margin-left: auto; }
.jingles-player .jingles-icon-btn { width: 34px; height: 34px; background: transparent; color: rgba(255,255,255,.72); }
.jingles-player .jingles-icon-btn:hover { background: rgba(255,255,255,.12); color: #fff; }
.jingles-player .jingles-icon-btn--sm { width: 30px; height: 30px; }
.jingles-player__center { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; }
.jingles-player__controls { display: flex; align-items: center; gap: 12px; }
.jingles-player__playbtn { border: 0; width: 44px; height: 44px; border-radius: 50%; background: var(--red, #930000); color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: background 160ms ease, transform 160ms ease; }
.jingles-player__playbtn:hover { background: #b00000; transform: scale(1.05); }
.jingles-player__playbtn:active { transform: scale(.92); }
.jingles-player__playbtn svg { width: 20px; height: 20px; }
.jingles-player__progress { display: flex; align-items: center; gap: 10px; width: 100%; max-width: 520px; }
.jingles-player__time { color: rgba(255,255,255,.72); font-size: 11px; font-variant-numeric: tabular-nums; width: 38px; flex-shrink: 0; }
.jingles-player__time:last-child { text-align: right; }
.jingles-tooltip-wrap { position: relative; flex: 1; display: flex; }
.jingles-player__seek, .jingles-player__volume-slider { appearance: none; -webkit-appearance: none; height: 4px; border-radius: 2px; background: rgba(255,255,255,.2); cursor: pointer; }
.jingles-player__seek { width: 100%; }
.jingles-player__volume-slider { width: 90px; }
.jingles-player__seek::-webkit-slider-thumb, .jingles-player__volume-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 12px; height: 12px; border-radius: 50%; background: #fff; }
.jingles-player__seek::-moz-range-thumb, .jingles-player__volume-slider::-moz-range-thumb { width: 12px; height: 12px; border: 0; border-radius: 50%; background: #fff; }
.jingles-player__seek::-webkit-slider-thumb { background: var(--red, #930000); }
.jingles-player__seek::-moz-range-thumb { background: var(--red, #930000); }
.jingles-player__volume { display: flex; align-items: center; gap: 8px; justify-self: end; }
.jingles-player__close { border: 1px solid rgba(255,255,255,.28) !important; color: #fff !important; flex-shrink: 0; }
.jingles-player__close:hover { background: var(--red, #930000) !important; border-color: var(--red, #930000) !important; }

.jingles-toast { position: fixed; left: 50%; bottom: 94px; z-index: 1200; transform: translate(-50%,12px); background: #010e28; color: #fff; padding: 11px 20px; border-radius: 3px; box-shadow: 0 10px 30px rgba(1,14,40,.25); opacity: 0; pointer-events: none; transition: opacity 180ms ease, transform 180ms ease; }
.jingles-toast.is-visible { opacity: 1; transform: translate(-50%,0); }

html.has-global-player .ade-launcher { bottom: 96px; }
html.has-global-player .ade-whatsapp { bottom: 170px; }
html.has-global-player .ade-panel { bottom: 112px; }

@media (max-width: 767px) {
  html.has-global-player body { padding-bottom: 190px; }
  .jingles-player { grid-template-columns: 1fr; grid-template-areas: "track" "center" "volume"; gap: 7px; padding: 8px 14px 12px; }
  .jingles-player__track { grid-area: track; }
  .jingles-player__center { grid-area: center; }
  .jingles-player__volume { grid-area: volume; justify-self: stretch; }
  .jingles-player__volume-slider { flex: 1; width: auto; }
  .jingles-player__controls { gap: 6px; }
  .jingles-player__extras { gap: 0; }
  html.has-global-player .ade-launcher { bottom: 202px; }
  html.has-global-player .ade-whatsapp { bottom: 276px; }
  html.has-global-player .ade-panel { bottom: 202px; }
  .jingles-toast { bottom: 202px; }
}

@media (prefers-reduced-motion: reduce) {
  .jingles-eq span { animation: none !important; }
  .jingles-player, .jingles-icon-btn, .jingles-player__playbtn, .jingles-toast { transition: none !important; }
}