/* OMC TV Modul 0.7.0 - Kinolayout (OMC-TV-07A). Farben aus dem OMC-Theme (var(--...)), mit Rueckfallwerten fuer fremde Themes. */
.omctv{--o-bg:var(--bg,#070b12);--o-card:var(--card,#0c121c);--o-card2:var(--card2,#0e1521);--o-line:var(--line,rgba(120,150,190,.13));--o-line2:var(--line2,rgba(120,150,190,.22));
 --o-txt:var(--txt,#e7edf6);--o-mut:var(--mut,#7e8aa0);--o-mut2:var(--mut2,#9aa6bc);--o-acc:var(--accent,#3d9bff);--o-acc2:var(--accent2,#5fb0ff);--o-glow:var(--glow,rgba(61,155,255,.45));--o-gold:var(--gold,#e9c46a);
 max-width:1400px;margin:0 auto;color:var(--o-txt);font-family:inherit;line-height:1.45}

/* Breite NUR auf der TV-Seite: das Theme begrenzt .omc-page auf 880px (style.css). Body-Klasse kommt vom Plugin. */
body.omctv-seite main.omc-page{max-width:1480px;padding:32px 40px 72px}
body.omctv-seite main.omc-page .page-kicker{margin-bottom:6px}
body.omctv-seite main.omc-page h1.page-title{font-size:34px;margin:0 0 20px}
body.omctv-seite main.omc-page .content{color:var(--txt,#e7edf6)}

/* Player 16:9 */
.omctv-bild{position:relative;aspect-ratio:16/9;width:100%;background:#000;border-radius:14px;overflow:hidden;border:1px solid var(--o-line2);box-shadow:0 0 0 1px rgba(0,0,0,.4),0 24px 60px -24px var(--o-glow),0 30px 80px -40px rgba(0,0,0,.9)}
.omctv-video{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain;background:#000}
.omctv-live{position:absolute;left:14px;top:14px;display:inline-flex;align-items:center;gap:7px;padding:5px 10px;border-radius:999px;background:rgba(7,11,18,.72);border:1px solid var(--o-line2);font:700 11px/1 'Saira',system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--o-txt);pointer-events:none}
.omctv-live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--red,#f24e5e);box-shadow:0 0 8px var(--red,#f24e5e)}
.omctv-lage{position:absolute;left:14px;top:50px;padding:7px 12px;border-radius:8px;background:rgba(7,11,18,.85);border:1px solid var(--o-line2);font-size:14px}
.omctv-lage[hidden]{display:none}
.omctv-lage.schlecht{border-color:var(--red,#f24e5e)}
.omctv-leiste{position:absolute;left:0;right:0;bottom:0;display:flex;gap:12px;align-items:center;padding:28px 14px 14px;background:linear-gradient(transparent,rgba(4,7,12,.82))}
.omctv-leiste button{background:rgba(12,18,28,.78);color:var(--o-txt);border:1px solid var(--o-line2);border-radius:8px;padding:8px 16px;font:600 13px/1 'Saira',system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;min-height:40px;backdrop-filter:blur(6px)}
.omctv-leiste button:hover{border-color:var(--o-acc);color:var(--o-acc2)}
.omctv-ton{background:var(--o-acc) !important;border-color:var(--o-acc) !important;color:#04101f !important}
.omctv-ton[aria-pressed="true"]{background:rgba(12,18,28,.78) !important;color:var(--o-txt) !important;border-color:var(--o-line2) !important}
.omctv-leiste button:focus-visible,.omctv-lautstaerke:focus-visible{outline:2px solid var(--o-acc2);outline-offset:2px}
.omctv-lautstaerke{flex:0 1 160px;accent-color:var(--o-acc)}
.omctv-voll{margin-left:auto}
/* Kino: Bedienleiste auf Geraeten mit Maus nur bei Bewegung/Fokus, damit das Senderbild (Bauchbinde) frei bleibt. Touch: immer sichtbar. */
@media (hover:hover) and (pointer:fine){
 .omctv-leiste{opacity:0;transition:opacity .25s}
 .omctv-bild:hover .omctv-leiste,.omctv-bild:focus-within .omctv-leiste,.omctv-bild.omctv-zeigen .omctv-leiste{opacity:1}
}
.omctv-bild{max-width:max(1000px,calc((100vh - 32px) * 16 / 9));margin:0 auto}
.omctv-bild:fullscreen{border-radius:0;border:0;box-shadow:none}
.omctv-bild:-webkit-full-screen{border-radius:0;border:0;width:100%;height:100%}

/* Jetzt / Danach als Karten */
.omctv-info{margin-top:22px}
.omctv-karten{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:16px}
.omctv-karte{position:relative;display:flex;flex-direction:column;gap:4px;padding:16px 18px 18px;background:linear-gradient(180deg,var(--o-card2),var(--o-card));border:1px solid var(--o-line2);border-radius:12px;min-width:0}
.omctv-etikett{font:600 12px/1 'Saira',system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--o-mut)}
.omctv-jetzt{border-color:rgba(61,155,255,.42)}
.omctv-jetzt .omctv-etikett{color:var(--o-acc2)}
.omctv-karte b{font:700 20px/1.25 'Saira',system-ui,sans-serif;color:var(--o-txt);overflow-wrap:anywhere}
.omctv-zeit{font-size:13px;color:var(--o-mut2);font-variant-numeric:tabular-nums}
.omctv-zeit:empty{display:none}
.omctv-fortschritt{display:block;height:3px;margin-top:10px;border-radius:3px;background:var(--o-line2);overflow:hidden}
.omctv-fortschritt i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--o-acc),var(--o-acc2));transition:width .6s}

/* Programm (EPG) */
body .omctv h2.omctv-plan-titel{font:700 13px/1 'Saira',system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--o-mut2);margin:32px 0 10px}
.omctv-plan{list-style:none;margin:0;padding:0 !important;border-top:1px solid var(--o-line2)}
.omctv-plan li{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:4px 18px;align-items:baseline;padding:13px 14px;border-bottom:1px solid var(--o-line);border-left:3px solid transparent}
.omctv-plan time{font:600 15px/1.3 'Saira',system-ui,sans-serif;font-variant-numeric:tabular-nums;color:var(--o-mut2)}
.omctv-plan .omctv-titel{font-size:16px;color:var(--o-txt);overflow-wrap:anywhere}
.omctv-plan .omctv-beschr{grid-column:2 / 4;font-size:13px;color:var(--o-mut);overflow-wrap:anywhere}
.omctv-plan .omctv-dauer{font-size:12px;color:var(--o-mut);font-variant-numeric:tabular-nums;white-space:nowrap}
.omctv-plan li.laeuft{background:linear-gradient(90deg,rgba(61,155,255,.12),rgba(61,155,255,0) 70%);border-left-color:var(--o-acc)}
.omctv-plan li.laeuft time{color:var(--o-acc2)}
.omctv-plan li.laeuft .omctv-titel{font-weight:700}
.omctv-plan li.laeuft .omctv-dauer::before{content:"Läuft · ";color:var(--o-gold);font-weight:700;letter-spacing:.04em}
.omctv-fuss{margin:18px 0 0 !important;font-size:12px;color:var(--o-mut)}
.omctv-extern{display:inline-block;margin:6px 10px 0 0;color:var(--o-acc2)}

/* Tablet */
@media (max-width:900px){
 body.omctv-seite main.omc-page{padding:24px 24px 56px}
 body.omctv-seite main.omc-page h1.page-title{font-size:28px;margin-bottom:16px}
}
/* Smartphone */
@media (max-width:640px){
 body.omctv-seite main.omc-page{padding:18px 12px 48px}
 body.omctv-seite main.omc-page .page-kicker{font-size:11px}
 body.omctv-seite main.omc-page h1.page-title{font-size:24px;margin-bottom:12px}
 .omctv-bild{border-radius:10px}
 .omctv-leiste{gap:8px;padding:22px 8px 8px}
 .omctv-leiste button{padding:8px 12px;font-size:12px}
 .omctv-lautstaerke{display:none}
 .omctv-live{left:8px;top:8px;font-size:10px;padding:4px 8px}
 .omctv-lage{left:8px;top:38px;font-size:13px}
 .omctv-info{margin-top:14px}
 .omctv-karten{grid-template-columns:1fr;gap:10px}
 .omctv-karte{padding:13px 14px 14px}
 .omctv-karte b{font-size:17px}
 .omctv-plan li{grid-template-columns:52px minmax(0,1fr);padding:11px 8px}
 .omctv-plan .omctv-dauer{grid-column:2}
 .omctv-plan .omctv-beschr{grid-column:2}
 .omctv-plan time{font-size:14px}
 .omctv-plan .omctv-titel{font-size:15px}
}