/* ====== HD MP3 Player – FLAT & FULL ====== */
.hd-emp3-wrap{
  --bg:#131720;            /* sfondo player scuro */
  --fg:#f7f7f7;            /* testo */
  --muted:#9aa0ab;         /* testo secondario */
  --accent:#ed773a;        /* colore brand */
  --card:#131720;          /* bg card (uguale allo sfondo) */
  --bar:#2b3140;           /* binari slider */
  --radius:14px;
  --pad:16px;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--fg);
}

/* Variante chiara (selezionabile dal widget) */
.hd-emp3-wrap.theme-light{
  --bg:#ffffff;
  --fg:#0e1320;
  --muted:#616b7a;
  --accent:#ed773a;
  --card:#ffffff;
  --bar:#e6e8ee;
}

/* FULL WIDTH: occupa tutto lo spazio della colonna/section Elementor */
.hd-emp3-card{
  width:100%;
  display:flex;
  grid-template-columns: 140px 1fr;
  gap:16px;
  background:var(--card);
  color:var(--fg);
  padding:var(--pad);
  border-radius:var(--radius);
  border:1px solid transparent;  /* piatto: niente ombre */
  box-shadow:none;
}

/* Copertina opzionale */
.hd-emp3-cover img{
  width:100%; height:100%; object-fit:cover; border-radius:10px;
}

.hd-emp3-body{ display:flex; flex-direction:column; gap:12px; }
.hd-emp3-title{ margin:0; font-size:20px; font-weight:800; letter-spacing:.2px; }

/* --- NOW PLAYING --- */
.hd-emp3-nowplaying{
  display:grid;
  grid-template-columns:auto auto auto 1fr;
  align-items:center; gap:12px;
}
.hd-emp3-btn{
  width:44px; height:44px; display:grid; place-items:center;
  background:var(--accent); color:#fff; border:0; border-radius:10px;
  font-weight:700; font-size:18px; line-height:1; cursor:pointer;
  box-shadow:none; transition:opacity .15s ease, transform .05s ease;
}
.hd-emp3-btn:hover{ opacity:.92; }
.hd-emp3-btn:active{ transform:translateY(1px); }
.hd-emp3-btn:focus-visible{ outline:2px solid currentColor; outline-offset:2px; }

.hd-emp3-trackinfo{ display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:14px; }
.hd-emp3-tracktitle{ font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hd-emp3-time{ color:var(--muted); }

/* --- PROGRESS BAR FLAT --- */
.hd-emp3-progress{
  position:relative; height:6px; background:var(--bar);
  border-radius:999px; cursor:pointer; outline:none; overflow:hidden;
}
.hd-emp3-progress-bar{
  position:absolute; left:0; top:0; bottom:0; width:0%;
  background:var(--accent); border-radius:inherit; transition:width .1s linear;
}
/* niente knob/ombre: flat */

/* --- CONTROLLI SECONDARI --- */
.hd-emp3-controls{ display:flex; align-items:center; gap:16px; }

.hd-emp3-volume{ display:flex; align-items:center; gap:10px; color:var(--muted); font-size:14px; }

/* Range FLAT (track + thumb) */
.hd-emp3-volume-range{
  -webkit-appearance:none; appearance:none; width:200px; height:6px;
  background:var(--bar); border-radius:999px; outline:none;
}
.hd-emp3-volume-range:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.hd-emp3-volume-range::-webkit-slider-thumb{
  -webkit-appearance:none; width:16px; height:16px; border-radius:50%;
  background:var(--accent); border:0; cursor:pointer;
}
.hd-emp3-volume-range::-moz-range-thumb{
  width:16px; height:16px; border-radius:50%; background:var(--accent); border:0; cursor:pointer;
}
.hd-emp3-volume-range::-moz-range-track{ background:transparent; }

/* Download FLAT (outline) */
.hd-emp3-download{
  padding:8px 12px; border-radius:8px; text-decoration:none;
  border:1px solid var(--accent); color:var(--accent); background:transparent;
  font-weight:700; transition:background .15s ease, color .15s ease;
}
.hd-emp3-download:hover{ background:var(--accent); color:#fff; }

/* --- PLAYLIST --- */
.hd-emp3-playlist{
  list-style:none; margin:6px 0 0; padding:0; max-height:240px; overflow:auto;
  border-top:1px solid rgba(255,255,255,.06);
}
.hd-emp3-wrap.theme-light .hd-emp3-playlist{ border-top:1px solid rgba(0,0,0,.08); }

.hd-emp3-item{ padding:6px 0; border-bottom:1px dashed rgba(255,255,255,.06); }
.hd-emp3-wrap.theme-light .hd-emp3-item{ border-bottom:1px dashed rgba(0,0,0,.08); }
.hd-emp3-item:last-child{ border-bottom:none; }

.hd-emp3-trackbtn{
  width:100%; text-align:left; background:transparent; color:var(--fg);
  border:0; padding:10px 4px; border-radius:8px; cursor:pointer; font-weight:600;
  transition:background .15s ease, color .15s ease;
}
.hd-emp3-trackbtn:hover{ background:rgba(255,255,255,.05); }
.hd-emp3-wrap.theme-light .hd-emp3-trackbtn:hover{ background:rgba(0,0,0,.04); }
.hd-emp3-item.is-active .hd-emp3-trackbtn{ color:var(--accent); background:transparent; }

/* Messaggio "aggiungi traccia" */
.hd-emp3-note{
  background:transparent; color:var(--accent);
  padding:10px 0; border-radius:8px; font-weight:600;
}

/* Responsivo */
@media (max-width:840px){
  .hd-emp3-card{ grid-template-columns:1fr; }
  .hd-emp3-cover{ order:-1; }
}
@media (max-width:520px){
  .hd-emp3-nowplaying{ grid-template-columns:auto 1fr; row-gap:10px; }
  .hd-emp3-volume-range{ width:150px; }
}

/* Riduce animazioni */
@media (prefers-reduced-motion:reduce){
  .hd-emp3-progress-bar{ transition:none; }
}
