:root{–bg:#2a2a2a;–panel:#6a6868;–text:#fff;–hover:rgba(255,255,255,.10);
–divider:rgba(255,255,255,.28);–radius:10px;–shadow:0 12px 24px rgba(0,0,0,.35);
–gap:32px;–pad:40px;–panelWidth:560px}
.vod-wrap{max-width:1680px;margin:32px auto 60px;padding:0 var(–pad);
display:flex;gap:var(–gap);align-items:flex-start;background:var(–bg);color:var(–text)}
.vod-video{flex:1 1 auto;min-width:640px;background:#000;border-radius:var(–radius);
overflow:hidden;box-shadow:var(–shadow)}
.vod-frame{width:100%;aspect-ratio:16/9;border:0;display:block}
.vod-panel{flex:0 0 var(–panelWidth);background:var(–panel);border-radius:var(–radius);
box-shadow:var(–shadow);padding:16px 28px;max-height:calc(100vh – 96px);
overflow:auto;position:sticky;top:32px}
.vod-menu{list-style:none;margin:0;padding:0}
.vod-menu li+li{border-top:1px solid var(–divider)}
.vod-menu a{display:block;color:var(–text);text-decoration:none;line-height:1.5;
padding:18px 4px;font-size:1.05rem;font-weight:500}
.vod-menu a:hover{background:var(–hover)}
.vod-menu a.active{background:rgba(255,255,255,.18);font-weight:600}
@media (max-width:1100px){.vod-wrap{flex-direction:column;gap:24px}
.vod-video{min-width:100%}.vod-panel{width:100%;flex:0 0 auto;position:static;max-height:none}}
/* Gör sidans body mörk även i WP-teman som annars är ljusa */
.entry-content,.wp-block-post-content{background:#2a2a2a;color:#fff}

(function(){
const iframe = document.getElementById(‘vodPlayer’);
if(!iframe) return;
const player = new Vimeo.Player(iframe);
const menu = document.getElementById(‘vodMenu’);

function setActive(a){ document.querySelectorAll(‘#vodMenu a’).forEach(x=>x.classList.remove(‘active’)); a.classList.add(‘active’); }

menu.addEventListener(‘click’, (e)=>{
const a = e.target.closest(‘a’); if(!a) return; e.preventDefault();
const id = a.dataset.id || ‘1125969798’;
player.loadVideo(id).then(()=>player.play().catch(()=>{})).catch(()=>{});
setActive(a);
});

// markera första länk som aktiv
const first = document.querySelector(‘#vodMenu a’); if(first) first.classList.add(‘active’);
})();