/* 0.3.10 — branded Stem uit de Regio audiospeler */
.sudr-player-wrap.sudr-player-wrap--custom{
  --sudr-player-rust:var(--sudr-rust,#bd6545);
  --sudr-player-petrol:var(--sudr-petrol,#216667);
  --sudr-player-cream:#f4ede3;
  --sudr-player-ink:#202833;
  --sudr-player-deck:#182330;
  display:block!important;
  width:100%!important;
  min-height:0!important;
  height:auto!important;
  margin:24px 0 0!important;
  padding:0!important;
  border:0!important;
  border-radius:22px!important;
  overflow:hidden!important;
  color:#fff!important;
  background:var(--sudr-player-deck)!important;
  box-shadow:0 18px 42px rgba(28,34,39,.15)!important;
  box-sizing:border-box!important;
}
.sudr-player-wrap--custom,.sudr-player-wrap--custom *{box-sizing:border-box}
.sudr-player-audio{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important}
.sudr-player-wrap--custom .sudr-player-brand{
  display:flex!important;
  align-items:center!important;
  gap:15px!important;
  min-height:102px!important;
  margin:0!important;
  padding:18px 22px!important;
  background:
    radial-gradient(circle at 88% 18%,rgba(244,237,227,.13),transparent 27%),
    linear-gradient(120deg,var(--sudr-player-rust) 0%,#9b5942 48%,var(--sudr-player-petrol) 100%)!important;
}
.sudr-player-wrap--custom .sudr-player-logo{
  display:grid!important;
  place-items:center!important;
  flex:0 0 64px!important;
  width:64px!important;
  height:64px!important;
  padding:6px!important;
  border-radius:14px!important;
  overflow:hidden!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 8px 22px rgba(23,28,34,.16)!important;
}
.sudr-player-wrap--custom .sudr-player-logo img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important;margin:0!important;padding:0!important}
.sudr-player-wrap--custom .sudr-player-artwork{display:block!important;flex:0 0 62px!important;width:62px!important;height:62px!important;border-radius:14px!important;overflow:hidden!important;background:rgba(255,255,255,.12)!important;box-shadow:0 8px 22px rgba(23,28,34,.16)!important}
.sudr-player-wrap--custom .sudr-player-artwork img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;margin:0!important;padding:0!important}
.sudr-player-wrap--custom .sudr-player-logo--text{color:var(--sudr-player-rust)!important;font-size:1.9rem!important;font-weight:900!important}
.sudr-player-wrap--custom .sudr-player-brandcopy{display:flex!important;flex:1 1 auto!important;min-width:0!important;flex-direction:column!important;gap:2px!important;margin:0!important;padding:0!important;color:#fff!important}
.sudr-player-wrap--custom .sudr-player-eyebrow{display:block!important;margin:0 0 2px!important;color:rgba(255,255,255,.72)!important;font-size:.68rem!important;font-weight:800!important;letter-spacing:.12em!important;text-transform:uppercase!important}
.sudr-player-wrap--custom .sudr-player-brandcopy strong{display:block!important;margin:0!important;color:#fff!important;font-size:1.12rem!important;line-height:1.18!important;font-weight:850!important}
.sudr-player-wrap--custom .sudr-player-podcast-name{display:block!important;min-width:0!important;margin:3px 0 0!important;color:rgba(255,255,255,.82)!important;font-size:.78rem!important;font-weight:650!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.sudr-player-wrap--custom .sudr-player-deck{display:block!important;width:100%!important;margin:0!important;padding:15px 22px 18px!important;background:var(--sudr-player-deck)!important}
.sudr-player-wrap--custom .sudr-player-episode-meta{display:flex!important;align-items:center!important;gap:7px!important;margin:0 0 12px!important;color:rgba(255,255,255,.68)!important;font-size:.72rem!important;font-weight:650!important;font-variant-numeric:tabular-nums!important}
.sudr-player-wrap--custom .sudr-player-timeline{display:block!important;width:100%!important;min-width:0!important;margin:0 0 13px!important;padding:0!important}
.sudr-player-wrap--custom .sudr-player-line-meta{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;width:100%!important;margin:0 0 7px!important;padding:0!important}
.sudr-player-wrap--custom .sudr-player-status{display:block!important;min-width:0!important;margin:0!important;color:rgba(255,255,255,.73)!important;font-size:.7rem!important;font-weight:650!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.sudr-player-wrap--custom .sudr-player-times{display:flex!important;flex:0 0 auto!important;align-items:center!important;gap:5px!important;width:auto!important;margin:0!important;padding:0!important;color:rgba(255,255,255,.73)!important;font-size:.7rem!important;font-weight:760!important;font-variant-numeric:tabular-nums!important;white-space:nowrap!important}
.sudr-player-wrap--custom .sudr-player-times span{display:inline!important;width:auto!important;min-width:0!important;height:auto!important;margin:0!important;padding:0!important;white-space:nowrap!important}
.sudr-player-wrap--custom input[type="range"].sudr-player-progress{
  --sudr-progress:0%;
  display:block!important;
  float:none!important;
  position:static!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:6px!important;
  min-height:6px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  cursor:pointer!important;
  background:linear-gradient(to right,var(--sudr-player-rust) 0,var(--sudr-player-rust) var(--sudr-progress),rgba(255,255,255,.16) var(--sudr-progress),rgba(255,255,255,.16) 100%)!important;
}
.sudr-player-progress::-webkit-slider-runnable-track{height:6px!important;border:0!important;border-radius:999px!important;background:transparent!important}
.sudr-player-progress::-moz-range-track{height:6px!important;border:0!important;border-radius:999px!important;background:rgba(255,255,255,.16)!important}
.sudr-player-progress::-moz-range-progress{height:6px!important;border-radius:999px!important;background:var(--sudr-player-rust)!important}
.sudr-player-progress::-webkit-slider-thumb{width:16px!important;height:16px!important;margin-top:-5px!important;border:3px solid #fff!important;border-radius:50%!important;appearance:none!important;-webkit-appearance:none!important;background:var(--sudr-player-rust)!important;box-shadow:0 2px 7px rgba(0,0,0,.26)!important;opacity:0;transition:opacity .15s ease!important}
.sudr-player-progress::-moz-range-thumb{width:12px!important;height:12px!important;border:3px solid #fff!important;border-radius:50%!important;background:var(--sudr-player-rust)!important;box-shadow:0 2px 7px rgba(0,0,0,.26)!important;opacity:0;transition:opacity .15s ease!important}
.sudr-player-wrap--custom:hover .sudr-player-progress::-webkit-slider-thumb,.sudr-player-progress:focus::-webkit-slider-thumb{opacity:1}
.sudr-player-wrap--custom:hover .sudr-player-progress::-moz-range-thumb,.sudr-player-progress:focus::-moz-range-thumb{opacity:1}
.sudr-player-wrap--custom .sudr-player-controls{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px!important;width:100%!important;min-width:0!important;margin:0!important;padding:0!important}
.sudr-player-wrap--custom .sudr-player-primary,.sudr-player-wrap--custom .sudr-player-secondary{display:flex!important;align-items:center!important;gap:9px!important;margin:0!important;padding:0!important}
.sudr-player-wrap--custom button{float:none!important;position:relative!important;margin:0!important;text-indent:0!important;line-height:1!important;font-family:inherit!important;cursor:pointer!important;-webkit-tap-highlight-color:transparent}
.sudr-player-wrap--custom .sudr-player-play{
  display:grid!important;
  place-items:center!important;
  flex:0 0 58px!important;
  width:58px!important;
  min-width:58px!important;
  max-width:58px!important;
  height:58px!important;
  min-height:58px!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  color:#fff!important;
  background:var(--sudr-player-rust)!important;
  box-shadow:0 8px 20px rgba(0,0,0,.24)!important;
  transition:transform .18s ease,filter .18s ease!important;
}
.sudr-player-wrap--custom .sudr-player-play:hover{transform:translateY(-1px) scale(1.02);filter:brightness(1.06)}
.sudr-player-wrap--custom .sudr-player-play .sudr-icon-play{display:inline!important;font-size:1.14rem!important;line-height:1!important;transform:translateX(2px)}
.sudr-player-wrap--custom .sudr-player-play .sudr-icon-pause{display:none!important;font-size:1.2rem!important;font-weight:900!important;letter-spacing:-.12em!important;transform:translateX(-1px)}
.sudr-player-wrap--custom.is-playing .sudr-icon-play{display:none!important}
.sudr-player-wrap--custom.is-playing .sudr-icon-pause{display:inline!important}
.sudr-player-wrap--custom .sudr-player-skip{
  display:grid!important;
  place-items:center!important;
  flex:0 0 44px!important;
  width:44px!important;
  min-width:44px!important;
  max-width:44px!important;
  height:44px!important;
  min-height:44px!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  color:rgba(255,255,255,.76)!important;
  background:transparent!important;
  box-shadow:none!important;
}
.sudr-player-wrap--custom .sudr-player-skip:hover{color:#fff!important;background:rgba(255,255,255,.08)!important}
.sudr-player-wrap--custom .sudr-player-skip svg{display:block!important;width:38px!important;height:38px!important;margin:0!important;overflow:visible!important;fill:none!important;stroke:currentColor!important;stroke-width:2.15!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.sudr-player-wrap--custom .sudr-player-skip svg text{fill:currentColor!important;stroke:none!important;font:800 9px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}
.sudr-player-wrap--custom .sudr-player-speed,.sudr-player-wrap--custom .sudr-player-mute{
  display:grid!important;
  place-items:center!important;
  flex:0 0 42px!important;
  width:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  height:42px!important;
  min-height:42px!important;
  padding:0!important;
  border:1px solid rgba(255,255,255,.15)!important;
  border-radius:50%!important;
  color:#fff!important;
  background:rgba(255,255,255,.05)!important;
  box-shadow:none!important;
  font-size:.75rem!important;
  font-weight:800!important;
}
.sudr-player-wrap--custom .sudr-player-speed:hover,.sudr-player-wrap--custom .sudr-player-mute:hover{background:rgba(255,255,255,.11)!important}
.sudr-player-wrap--custom .sudr-player-mute svg{display:block!important;width:19px!important;height:19px!important;fill:currentColor!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.sudr-player-wrap--custom .sudr-volume-off{display:none!important}
.sudr-player-wrap--custom.is-muted .sudr-volume-on{display:none!important}
.sudr-player-wrap--custom.is-muted .sudr-volume-off{display:inline!important}
.sudr-player-play:focus-visible,.sudr-player-skip:focus-visible,.sudr-player-speed:focus-visible,.sudr-player-mute:focus-visible,.sudr-player-progress:focus-visible{outline:3px solid rgba(244,237,227,.45)!important;outline-offset:3px!important}
@media(max-width:760px){
  .sudr-player-wrap.sudr-player-wrap--custom{border-radius:18px!important}
  .sudr-player-wrap--custom .sudr-player-brand{min-height:88px!important;padding:15px 16px!important;gap:12px!important}
  .sudr-player-wrap--custom .sudr-player-artwork{flex-basis:52px!important;width:52px!important;height:52px!important;border-radius:12px!important}
  .sudr-player-wrap--custom .sudr-player-logo{flex-basis:54px!important;width:54px!important;height:54px!important;border-radius:12px!important}
  .sudr-player-wrap--custom .sudr-player-brandcopy strong{font-size:1rem!important}
  .sudr-player-wrap--custom .sudr-player-deck{padding:14px 16px 16px!important}
}
@media(max-width:480px){
  .sudr-player-wrap--custom .sudr-player-brand{min-height:82px!important}
  .sudr-player-wrap--custom .sudr-player-artwork{flex-basis:46px!important;width:46px!important;height:46px!important;border-radius:10px!important}
  .sudr-player-wrap--custom .sudr-player-eyebrow{font-size:.62rem!important}
  .sudr-player-wrap--custom .sudr-player-podcast-name{font-size:.72rem!important}
  .sudr-player-wrap--custom .sudr-player-controls{gap:8px!important}
  .sudr-player-wrap--custom .sudr-player-primary{gap:4px!important}
  .sudr-player-wrap--custom .sudr-player-secondary{gap:5px!important}
  .sudr-player-wrap--custom .sudr-player-play{flex-basis:52px!important;width:52px!important;min-width:52px!important;max-width:52px!important;height:52px!important;min-height:52px!important}
  .sudr-player-wrap--custom .sudr-player-skip{flex-basis:38px!important;width:38px!important;min-width:38px!important;max-width:38px!important;height:38px!important;min-height:38px!important}
  .sudr-player-wrap--custom .sudr-player-skip svg{width:34px!important;height:34px!important}
  .sudr-player-wrap--custom .sudr-player-speed,.sudr-player-wrap--custom .sudr-player-mute{flex-basis:38px!important;width:38px!important;min-width:38px!important;max-width:38px!important;height:38px!important;min-height:38px!important}
  .sudr-player-wrap--custom .sudr-player-status{font-size:.65rem!important}
  .sudr-player-wrap--custom .sudr-player-times{font-size:.65rem!important}
}
@media(max-width:370px){
  .sudr-player-wrap--custom .sudr-player-logo{display:none!important}
  .sudr-player-wrap--custom .sudr-player-primary{gap:2px!important}
  .sudr-player-wrap--custom .sudr-player-secondary{gap:3px!important}
}

/* 0.3.11 - playerlogo en volumeregeling */
.sudr-player-wrap--custom .sudr-player-logo{
  display:grid!important;
  place-items:center!important;
  flex:0 0 76px!important;
  width:76px!important;
  height:76px!important;
  padding:0!important;
  border:1px solid rgba(255,255,255,.18)!important;
  border-radius:16px!important;
  overflow:hidden!important;
  background:transparent!important;
  box-shadow:0 9px 24px rgba(23,28,34,.22)!important;
}
.sudr-player-wrap--custom .sudr-player-logo img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  border-radius:15px!important;
}
.sudr-player-wrap--custom .sudr-player-volume{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
}
.sudr-player-wrap--custom input[type="range"].sudr-player-volume-range{
  --sudr-volume:100%;
  display:block!important;
  float:none!important;
  position:static!important;
  width:100px!important;
  min-width:72px!important;
  max-width:100px!important;
  height:4px!important;
  min-height:4px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  cursor:pointer!important;
  background:linear-gradient(to right,var(--sudr-player-rust) 0,var(--sudr-player-rust) var(--sudr-volume),rgba(255,255,255,.18) var(--sudr-volume),rgba(255,255,255,.18) 100%)!important;
}
.sudr-player-volume-range::-webkit-slider-runnable-track{
  height:4px!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
}
.sudr-player-volume-range::-moz-range-track{
  height:4px!important;
  border:0!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.18)!important;
}
.sudr-player-volume-range::-moz-range-progress{
  height:4px!important;
  border-radius:999px!important;
  background:var(--sudr-player-rust)!important;
}
.sudr-player-volume-range::-webkit-slider-thumb{
  width:14px!important;
  height:14px!important;
  margin-top:-5px!important;
  border:2px solid #fff!important;
  border-radius:50%!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  background:var(--sudr-player-rust)!important;
  box-shadow:0 2px 6px rgba(0,0,0,.28)!important;
}
.sudr-player-volume-range::-moz-range-thumb{
  width:12px!important;
  height:12px!important;
  border:2px solid #fff!important;
  border-radius:50%!important;
  background:var(--sudr-player-rust)!important;
  box-shadow:0 2px 6px rgba(0,0,0,.28)!important;
}
.sudr-player-volume-range:focus-visible{outline:3px solid rgba(244,237,227,.45)!important;outline-offset:5px!important}

@media(max-width:760px){
  .sudr-player-wrap--custom .sudr-player-logo{
    display:grid!important;
    flex-basis:64px!important;
    width:64px!important;
    height:64px!important;
    border-radius:14px!important;
  }
  .sudr-player-wrap--custom .sudr-player-logo img{border-radius:13px!important}
  .sudr-player-wrap--custom input[type="range"].sudr-player-volume-range{
    width:82px!important;
    min-width:64px!important;
    max-width:82px!important;
  }
}
@media(max-width:480px){
  .sudr-player-wrap--custom .sudr-player-logo{
    display:grid!important;
    flex-basis:60px!important;
    width:60px!important;
    height:60px!important;
  }
  .sudr-player-wrap--custom input[type="range"].sudr-player-volume-range{
    width:66px!important;
    min-width:58px!important;
    max-width:66px!important;
  }
  .sudr-player-wrap--custom .sudr-player-volume{gap:5px!important}
}
@media(max-width:370px){
  .sudr-player-wrap--custom .sudr-player-logo{
    display:grid!important;
    flex-basis:50px!important;
    width:50px!important;
    height:50px!important;
  }
  .sudr-player-wrap--custom .sudr-player-brand{gap:9px!important;padding-left:12px!important;padding-right:12px!important}
  .sudr-player-wrap--custom .sudr-player-brandcopy strong{font-size:.92rem!important}
  .sudr-player-wrap--custom input[type="range"].sudr-player-volume-range{width:56px!important;min-width:52px!important;max-width:56px!important}
}


/* 0.3.99 — pop-outknop: speler in een nieuw scherm openen */
.sudr-player-wrap--custom .sudr-player-brand{position:relative!important}
.sudr-player-wrap--custom .sudr-player-brandcopy{padding-right:52px!important}
.sudr-player-wrap--custom .sudr-player-popout{
  display:grid!important;
  place-items:center!important;
  position:absolute!important;
  top:18px!important;
  right:20px!important;
  width:40px!important;
  height:40px!important;
  margin:0!important;
  padding:0!important;
  border:1px solid rgba(255,255,255,.24)!important;
  border-radius:50%!important;
  color:#fff!important;
  background:rgba(24,35,48,.22)!important;
  box-shadow:none!important;
  text-decoration:none!important;
  transition:background .15s ease,transform .15s ease!important;
}
.sudr-player-wrap--custom .sudr-player-popout:hover{color:#fff!important;background:rgba(24,35,48,.42)!important;transform:translateY(-1px)!important}
.sudr-player-wrap--custom .sudr-player-popout:focus-visible{outline:3px solid rgba(244,237,227,.55)!important;outline-offset:3px!important}
.sudr-player-wrap--custom .sudr-player-popout svg{display:block!important;width:19px!important;height:19px!important;fill:none!important;stroke:currentColor!important;stroke-width:2!important;stroke-linecap:round!important;stroke-linejoin:round!important}
@media(max-width:760px){
  .sudr-player-wrap--custom .sudr-player-brandcopy{padding-right:45px!important}
  .sudr-player-wrap--custom .sudr-player-popout{top:15px!important;right:14px!important;width:36px!important;height:36px!important}
  .sudr-player-wrap--custom .sudr-player-popout svg{width:17px!important;height:17px!important}
}


