.dtg-audio-player{
  --dtg-bg:#064e3b;
  --dtg-bg2:#064e3b;
  --dtg-accent:#c8a95b;
  --dtg-accent2:#c8a95b;
  --dtg-text:#fff;
  --dtg-muted:rgba(255,255,255,0.65);
  --dtg-track:rgba(255,255,255,0.15);
  position:relative;
  width:100%;
  max-width:560px;
  background:linear-gradient(135deg,var(--dtg-bg),var(--dtg-bg2));
  border-radius:14px;
  padding:16px 20px;
  color:var(--dtg-text);
  font-family:inherit;
  box-shadow:0 8px 24px rgba(0,0,0,0.18);
  box-sizing:border-box;
}
.dtg-audio-player *{box-sizing:border-box}
.dtg-audio-player[data-state="loading"],
.dtg-audio-player[data-state="empty"]{
  min-height:80px;display:flex;align-items:center;justify-content:center;color:var(--dtg-muted);font-size:13px
}
.dtg-audio-player[data-state="ready"]{display:block}

.dtg-row{display:flex;align-items:center;gap:14px}
.dtg-controls{display:flex;align-items:center;gap:10px;flex-shrink:0}
.dtg-btn{
  background:none;border:none;color:var(--dtg-text);cursor:pointer;
  width:32px;height:32px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  padding:0;transition:background .15s ease,color .15s ease,transform .15s ease;
}
.dtg-btn:hover{background:rgba(255,255,255,0.1)}
.dtg-btn:active{transform:scale(0.92)}
.dtg-btn svg{width:16px;height:16px;fill:currentColor}
.dtg-btn.dtg-play{
  width:42px;height:42px;background:var(--dtg-accent);color:#064e3b;border-radius:10px;
  box-shadow:0 4px 12px rgba(200,169,91,0.35);
}
.dtg-btn.dtg-play:hover{background:#d8bd7e;transform:scale(1.04)}
.dtg-btn.dtg-play svg{width:20px;height:20px;fill:#064e3b}
.dtg-btn.dtg-active{color:var(--dtg-accent)}

.dtg-meta{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.dtg-label{font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dtg-muted);font-weight:600}
.dtg-title{font-size:15px;font-weight:600;color:var(--dtg-accent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.dtg-cover{
  width:46px;height:46px;border-radius:8px;background:var(--dtg-track) center/cover;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;color:var(--dtg-muted);
}
.dtg-cover svg{width:20px;height:20px;fill:currentColor}
.dtg-cover.has-img{background-color:transparent}

.dtg-extra{display:flex;align-items:center;gap:4px;flex-shrink:0}

.dtg-progress-row{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:11px;color:var(--dtg-muted);font-variant-numeric:tabular-nums}
.dtg-progress{flex:1;height:8px;background:var(--dtg-track);border-radius:4px;cursor:pointer;position:relative;overflow:hidden;touch-action:none}
.dtg-progress-fill{height:100%;background:linear-gradient(90deg,var(--dtg-accent),var(--dtg-accent2));border-radius:4px;width:0;transition:width .1s linear}
.dtg-progress:hover .dtg-progress-fill{background:var(--dtg-accent)}

.dtg-volume-wrap{position:relative;display:inline-flex;align-items:center}
.dtg-volume-slider{
  position:absolute;right:100%;top:50%;transform:translateY(-50%);
  width:0;height:24px;overflow:hidden;transition:width .2s ease;
  background:rgba(0,0,0,0.3);border-radius:20px;display:flex;align-items:center;padding:0
}
.dtg-volume-wrap:hover .dtg-volume-slider,
.dtg-volume-wrap:focus-within .dtg-volume-slider{width:90px;padding:0 10px}
.dtg-volume-slider input{
  width:70px;-webkit-appearance:none;appearance:none;background:transparent;
  height:4px;outline:none;
}
.dtg-volume-slider input::-webkit-slider-runnable-track{height:3px;background:var(--dtg-track);border-radius:3px}
.dtg-volume-slider input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:10px;height:10px;border-radius:50%;background:var(--dtg-accent);margin-top:-3.5px;cursor:pointer}
.dtg-volume-slider input::-moz-range-track{height:3px;background:var(--dtg-track);border-radius:3px}
.dtg-volume-slider input::-moz-range-thumb{width:10px;height:10px;border-radius:50%;background:var(--dtg-accent);border:none;cursor:pointer}

.dtg-queue{
  position:absolute;top:100%;right:0;margin-top:8px;
  width:320px;max-width:90vw;max-height:380px;overflow-y:auto;
  background:#064e3b;border-radius:10px;padding:8px;
  box-shadow:0 12px 32px rgba(0,0,0,0.35);
  z-index:1000;
  display:none;
}
.dtg-queue.is-open{display:block}
.dtg-queue-item{
  display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:6px;cursor:pointer;
  transition:background .15s ease;
}
.dtg-queue-item:hover{background:rgba(255,255,255,0.08)}
.dtg-queue-item.is-current{background:rgba(200,169,91,0.15)}
.dtg-queue-item.is-current .dtg-q-title{color:var(--dtg-accent)}
.dtg-q-cover{width:32px;height:32px;border-radius:5px;background:var(--dtg-track) center/cover;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--dtg-muted)}
.dtg-q-cover svg{width:14px;height:14px;fill:currentColor}
.dtg-q-num{font-size:11px;color:var(--dtg-muted);width:18px;text-align:right;flex-shrink:0}
.dtg-q-title{flex:1;font-size:13px;color:var(--dtg-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dtg-q-empty{padding:14px;text-align:center;color:var(--dtg-muted);font-size:12px}

@media (max-width:540px){
  .dtg-audio-player{padding:12px 14px}
  .dtg-cover{width:38px;height:38px}
  .dtg-btn{width:28px;height:28px}
  .dtg-btn.dtg-play{width:38px;height:38px}
  .dtg-btn.dtg-play svg{width:16px;height:16px}
  .dtg-title{font-size:14px}
  .dtg-label{font-size:8px;letter-spacing:1px}
  .dtg-extra{gap:2px}
  .dtg-extra .dtg-shuffle,.dtg-extra .dtg-repeat{display:none}
  .dtg-volume-wrap:hover .dtg-volume-slider,
  .dtg-volume-wrap:focus-within .dtg-volume-slider{width:0;padding:0}
  .dtg-progress-row{margin-top:8px;font-size:10px}
}

/* ===== Dock fixe — porté dans le plugin pour être présent sur TOUTES les pages
   (avant, ces règles n'existaient que dans le bloc PJAX inline de certaines pages,
   d'où le lecteur en bas-gauche sur /evenements et /archives-numeriques). ===== */
#dtg-pjax-player-dock{display:none;position:fixed;left:50%;bottom:14px;transform:translateX(-50%);width:min(560px,calc(100vw - 28px));z-index:99996;overflow:visible}
body.dtg-pjax-docked{padding-bottom:128px}
body.dtg-pjax-docked #dtg-pjax-player-dock{display:block}
body.dtg-pjax-docked #dtg-pjax-player-dock .dtg-audio-player{max-width:none;width:100%;box-shadow:0 18px 44px rgba(0,0,0,.32);overflow:visible}
body.dtg-pjax-docked #dtg-pjax-player-dock .dtg-queue{top:auto;bottom:calc(100% + 10px);right:0;left:auto;width:min(360px,calc(100vw - 28px));max-height:min(380px,55vh);z-index:100000}
body.dtg-pjax-docked #dtg-pjax-player-dock .dtg-volume-slider{right:0;left:auto;bottom:calc(100% + 6px);top:auto;transform:none}
@media (max-width:540px){
  body.dtg-pjax-docked{padding-bottom:118px}
  #dtg-pjax-player-dock{bottom:10px;width:calc(100vw - 20px)}
  body.dtg-pjax-docked #dtg-pjax-player-dock .dtg-queue{left:0;right:0;width:100%;max-width:100%;bottom:calc(100% + 8px);max-height:48vh}
}

/* ===== État réduit : pilule compacte ancrée en bas à droite =====
   On rétrécit le dock lui-même (et on retire son transform de centrage) plutôt
   que de mettre la pilule en position:fixed — car le transform du dock servirait
   de bloc englobant et fausserait le positionnement fixed. */
body.dtg-dock-min #dtg-pjax-player-dock{left:auto;right:14px;transform:none;width:auto}
.dtg-audio-player.is-minimized{
  width:auto!important;max-width:calc(100vw - 28px);padding:8px 12px;cursor:grab;
}
.dtg-audio-player.is-minimized .dtg-row{gap:10px}
.dtg-audio-player.is-minimized .dtg-progress-row,
.dtg-audio-player.is-minimized .dtg-label,
.dtg-audio-player.is-minimized .dtg-prev,
.dtg-audio-player.is-minimized .dtg-next,
.dtg-audio-player.is-minimized .dtg-shuffle,
.dtg-audio-player.is-minimized .dtg-repeat,
.dtg-audio-player.is-minimized .dtg-volume-wrap,
.dtg-audio-player.is-minimized .dtg-queue-btn{display:none!important}
.dtg-audio-player.is-minimized .dtg-meta{max-width:46vw}
.dtg-audio-player.is-minimized .dtg-title{font-size:14px}