/* STEP42 — Upgrade grafico player singoli Dorisan */

:root{
  --ds42-bg-1:#03060c;
  --ds42-bg-2:#091321;
  --ds42-bg-3:#111827;
  --ds42-blue:#59b7ff;
  --ds42-blue-2:#7ed0ff;
  --ds42-red:#ff304f;
  --ds42-red-2:#ff5f79;
  --ds42-gold:#f4c778;
  --ds42-white:#f7f9ff;
  --ds42-soft:rgba(255,255,255,.72);
  --ds42-border:rgba(89,183,255,.24);
  --ds42-border-hot:rgba(244,199,120,.65);
}

.ds41-audio-wrap{
  position:relative;
  overflow:hidden;
  display:grid;
  gap:10px;
  width:100%;
  padding:14px 14px 12px 14px;
  border-radius:20px;
  border:1px solid var(--ds42-border);
  background:
    linear-gradient(135deg, rgba(255,48,79,.10), transparent 28%),
    linear-gradient(225deg, rgba(89,183,255,.12), transparent 34%),
    radial-gradient(circle at 8% 12%, rgba(255,48,79,.14), transparent 35%),
    radial-gradient(circle at 92% 18%, rgba(89,183,255,.18), transparent 34%),
    linear-gradient(145deg, rgba(3,6,12,.98), rgba(8,18,34,.95) 55%, rgba(6,13,27,.98));
  box-shadow:
    0 18px 34px rgba(0,0,0,.30),
    0 0 0 1px rgba(255,255,255,.03) inset,
    0 0 24px rgba(89,183,255,.06);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.ds41-audio-wrap::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.05), transparent);
  transform:translateX(-120%);
  transition:transform .7s ease;
  pointer-events:none;
}

.ds41-audio-wrap:hover{
  transform:translateY(-1px);
  border-color:rgba(89,183,255,.42);
  box-shadow:
    0 22px 38px rgba(0,0,0,.34),
    0 0 0 1px rgba(255,255,255,.04) inset,
    0 0 28px rgba(89,183,255,.10);
}

.ds41-audio-wrap:hover::before{
  transform:translateX(120%);
}

.ds41-audio-label{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--ds42-white);
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  line-height:1.2;
}

.ds41-audio-label::before{
  content:"◉";
  color:var(--ds42-gold);
  font-size:.9rem;
  text-shadow:0 0 10px rgba(244,199,120,.45);
}

.ds41-audio-sub{
  color:var(--ds42-blue-2);
  font-size:.82rem;
  font-weight:800;
  line-height:1.35;
  letter-spacing:.03em;
  text-shadow:0 0 8px rgba(89,183,255,.08);
}

.ds41-audio{
  width:100%;
  height:46px;
  border-radius:14px;
  background:rgba(7,12,22,.92);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.03) inset,
    0 8px 18px rgba(0,0,0,.22);
  accent-color:var(--ds42-blue);
  filter:drop-shadow(0 0 12px rgba(89,183,255,.12));
}

.ds41-audio::-webkit-media-controls-panel{
  background:
    linear-gradient(90deg, rgba(255,48,79,.10), rgba(8,14,26,.92) 18%, rgba(8,14,26,.96) 82%, rgba(89,183,255,.10));
  border-radius:14px;
}

.ds41-audio::-webkit-media-controls-play-button,
.ds41-audio::-webkit-media-controls-mute-button{
  filter:brightness(1.1) contrast(1.05);
}

.ds41-audio::-webkit-media-controls-current-time-display,
.ds41-audio::-webkit-media-controls-time-remaining-display{
  color:var(--ds42-white);
  font-weight:800;
  text-shadow:0 0 6px rgba(89,183,255,.12);
}

.ds41-audio::-webkit-media-controls-timeline{
  filter:saturate(1.1) brightness(1.02);
}

.ds41-audio::-webkit-media-controls-volume-slider{
  filter:saturate(1.05);
}

.d30-track.ds41-playing .ds41-audio-wrap,
.d29-track.ds41-playing .ds41-audio-wrap,
.d27-track.ds41-playing .ds41-audio-wrap{
  border-color:var(--ds42-border-hot);
  box-shadow:
    0 0 0 1px rgba(244,199,120,.14) inset,
    0 18px 40px rgba(0,0,0,.36),
    0 0 26px rgba(244,199,120,.12),
    0 0 18px rgba(89,183,255,.10);
}

.d30-track.ds41-playing .ds41-audio-label,
.d29-track.ds41-playing .ds41-audio-label,
.d27-track.ds41-playing .ds41-audio-label{
  color:#fff6df;
}

.d30-track.ds41-playing .ds41-audio-sub,
.d29-track.ds41-playing .ds41-audio-sub,
.d27-track.ds41-playing .ds41-audio-sub{
  color:#ffe5b3;
}

.d30-track.ds41-playing .ds41-audio-wrap::after,
.d29-track.ds41-playing .ds41-audio-wrap::after,
.d27-track.ds41-playing .ds41-audio-wrap::after{
  content:"IN ASCOLTO";
  position:absolute;
  top:12px;
  right:12px;
  padding:5px 10px;
  border-radius:999px;
  font-size:.64rem;
  font-weight:900;
  letter-spacing:.12em;
  color:#0a0d13;
  background:linear-gradient(135deg, var(--ds42-gold), #fff0c8);
  box-shadow:0 6px 14px rgba(244,199,120,.24);
}

@media(max-width:720px){
  .ds41-audio-wrap{
    padding:12px 12px 10px 12px;
    border-radius:18px;
    gap:8px;
  }

  .ds41-audio{
    height:50px;
  }

  .ds41-audio-label{
    font-size:.74rem;
    letter-spacing:.10em;
  }

  .ds41-audio-sub{
    font-size:.78rem;
  }

  .d30-track.ds41-playing .ds41-audio-wrap::after,
  .d29-track.ds41-playing .ds41-audio-wrap::after,
  .d27-track.ds41-playing .ds41-audio-wrap::after{
    top:10px;
    right:10px;
    font-size:.58rem;
    padding:4px 8px;
  }
}