/* Ailex — het mediablok (23-10-2026, mediablok.js): vast onder de kop, de chat schuift eronder door. Hoog contrast: donkere tekst op wit. */
.ax-media { position: fixed; left: 12px; right: 12px; top: calc(var(--sg-kop, 84px) + var(--sg-melding, 0px) + max(env(safe-area-inset-top, 0px), var(--app-top, 0px)) + 4px); z-index: 8400;
  border-radius: 22px; border: 2px solid var(--ink, #262A4D); background: var(--kaart, #FFFFFF); color: var(--ink, #262A4D); box-shadow: var(--ax-diep);
  overflow: hidden; touch-action: pan-y; user-select: none; -webkit-user-select: none; font-family: var(--sg-letter); }
.ax-media[hidden] { display: none; }
.ax-media-beeld { position: relative; aspect-ratio: 16 / 9; max-height: 32vh; margin: 0 auto; background: #000; }
.ax-media-beeld[hidden] { display: none; }
.ax-media-yt { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
.ax-media-tvvak { position: absolute; inset: 0; background: #000; }   /* spelerpagina: de app legt hier haar eigen webview overheen */
.ax-media-tv { position: absolute; inset: 0; width: 100%; height: 100%; display: block; background: #000; object-fit: contain; }   /* 1.8.8 live tv */
.ax-media-rij { display: flex; align-items: center; gap: 10px; min-height: 64px; padding: 8px 10px 8px 12px; }
.ax-media-ico { flex: 0 0 auto; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 14px; background: var(--munt, #36D1A8); color: #1A1C3A; }
.ax-media-ico .mi { width: 24px; height: 24px; }
.ax-media-tekst { flex: 1 1 auto; min-width: 0; display: grid; gap: 2px; }
.ax-media-tekst b { font-weight: 800; font-size: 1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ax-media-tekst small { font-weight: 700; font-size: .8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ax-media-k { flex: 0 0 auto; min-height: 44px; padding: 0 12px; border-radius: 22px; border: 2px solid var(--ink, #262A4D); background: var(--kaart, #FFFFFF);
  color: var(--ink, #262A4D); font: 800 .85rem var(--sg-letter); }
.ax-media-k.groot { width: 52px; height: 52px; padding: 0; display: grid; place-items: center; border-radius: 50%; background: var(--blauw, #5B6CFF); border-color: var(--blauw, #5B6CFF); }
/* pauze: twee witte streepjes; doorgaan: een wit driehoekje */
.ax-p-pauze { width: 16px; height: 18px; border-left: 5px solid #FFFFFF; border-right: 5px solid #FFFFFF; box-sizing: border-box; }
.ax-p-speel { width: 0; height: 0; margin-left: 4px; border-style: solid; border-width: 10px 0 10px 16px; border-color: transparent transparent transparent #FFFFFF; }
.ax-media.pauze { border-style: dashed; }
.ax-media.pauze .ax-media-ico { background: var(--geel, #FFC83D); }
/* de radio-chip rechtsboven is overbodig zolang het blok er staat */
html.ax-media-aan .sch-radiochip { display: none !important; }
/* de chat begint onder het blok, en wat erachter schuift is weg */
html[data-vorm="plat"].ax-media-aan .log { padding-top: calc(var(--sg-kop) + var(--sg-melding, 0px) + var(--ax-media-h, 0px) + max(env(safe-area-inset-top, 0px), var(--app-top, 0px)));
  clip-path: inset(calc(var(--sg-kop) + var(--sg-melding, 0px) + var(--ax-media-h, 0px) + max(env(safe-area-inset-top, 0px), var(--app-top, 0px))) 0 0 0); }
@media (prefers-reduced-motion: reduce) { .ax-media { transition: none !important; } }