.pe1hud-iss-live {
    --pe1hud-iss-height: 480px;
    --pe1hud-border: rgba(22, 53, 82, .22);
    --pe1hud-bg: #edf5fb;
    --pe1hud-dark: #0d2538;
    --pe1hud-muted: #587084;
    --pe1hud-past: #ffb000;
    --pe1hud-future: #42d6ff;
    --pe1hud-base-font-size: 12px;
    --pe1hud-radio-font-size: 12px;
    display: grid;
    gap: 16px;
    width: 100%;
    margin: 18px 0;
    box-sizing: border-box;
}
.pe1hud-iss-live * { box-sizing: border-box; }
.pe1hud-iss-layout-side { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.pe1hud-iss-layout-stack { grid-template-columns: 1fr; }
.pe1hud-iss-panel { min-width: 0; border: 1px solid var(--pe1hud-border); background: var(--pe1hud-bg); box-shadow: 0 5px 18px rgba(13,37,56,.08); overflow: hidden; }
.pe1hud-iss-panel-title { min-height: 45px; display: flex; align-items: center; padding: 10px 14px; background: rgba(255,255,255,.54); border-bottom: 1px solid var(--pe1hud-border); color: var(--pe1hud-dark); font-size: calc(var(--pe1hud-base-font-size) + 4px); font-weight: 700; letter-spacing: .01em; }
.pe1hud-iss-title-row { justify-content: space-between; gap: 12px; }
.pe1hud-iss-follow-label { display: inline-flex; align-items: center; gap: 6px; font-size: var(--pe1hud-base-font-size); font-weight: 600; color: var(--pe1hud-muted); white-space: nowrap; }
.pe1hud-iss-follow-label input { margin: 0; }
.pe1hud-iss-video-wrap { width: 100%; height: var(--pe1hud-iss-height); background: #000; }
.pe1hud-iss-video-wrap iframe { display: block; width: 100%; height: 100%; border: 0; }
.pe1hud-iss-map { width: 100%; height: var(--pe1hud-iss-height); background: #09131e; }
.pe1hud-iss-note, .pe1hud-iss-status { min-height: 35px; padding: 8px 12px; font-size: var(--pe1hud-base-font-size); line-height: 1.45; color: var(--pe1hud-muted); background: rgba(255,255,255,.58); border-top: 1px solid var(--pe1hud-border); }
.pe1hud-iss-status.is-error { color: #a11616; font-weight: 600; }
.pe1hud-iss-info { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 0; border-top: 1px solid var(--pe1hud-border); background: rgba(255,255,255,.7); }
.pe1hud-iss-info span { min-width: 0; padding: 8px 6px; text-align: center; font-size: max(9px, calc(var(--pe1hud-base-font-size) - 2px)); color: var(--pe1hud-muted); border-right: 1px solid var(--pe1hud-border); }
.pe1hud-iss-info span:last-child { border-right: 0; }
.pe1hud-iss-info b { display: block; margin-top: 2px; color: var(--pe1hud-dark); font-size: var(--pe1hud-base-font-size); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pe1hud-iss-legend { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; padding: 7px 12px; font-size: max(9px, calc(var(--pe1hud-base-font-size) - 1px)); color: var(--pe1hud-muted); background: rgba(255,255,255,.7); border-top: 1px solid var(--pe1hud-border); }
.pe1hud-iss-legend span { display: inline-flex; align-items: center; gap: 6px; }
.pe1hud-iss-legend i { width: 24px; height: 3px; display: inline-block; }
.pe1hud-iss-legend i.past { background: var(--pe1hud-past); }
.pe1hud-iss-legend i.future { background: var(--pe1hud-future); }
.pe1hud-iss-legend i.qth { width: 9px; height: 9px; border-radius: 50%; background: #1667b7; border: 2px solid #fff; box-shadow: 0 0 0 1px #1667b7; }

/* Extra specifiek + !important om te voorkomen dat WordPress-thema CSS de MapLibre marker naar 100% breed trekt. */
.pe1hud-iss-map .maplibregl-marker.pe1hud-iss-marker,
.pe1hud-iss-marker {
    position: relative !important;
    width: 68px !important;
    min-width: 68px !important;
    max-width: 68px !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    display: flex !important;
    flex: 0 0 68px !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 2px solid #fff !important;
    border-radius: 18px !important;
    background: #e51e25 !important;
    color: #fff !important;
    font: 800 12px/1 Arial,sans-serif !important;
    letter-spacing: .08em !important;
    white-space: nowrap !important;
    box-shadow: 0 2px 10px rgba(0,0,0,.5) !important;
    overflow: visible !important;
}
.pe1hud-iss-marker::after { content:''; position:absolute; left:50%; bottom:-8px; transform:translateX(-50%); width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; border-top:8px solid #fff; }
.pe1hud-iss-marker::before { content:none !important; display:none !important; }
.pe1hud-iss-map .maplibregl-marker.pe1hud-qth-marker,
.pe1hud-qth-marker { width:16px !important; min-width:16px !important; max-width:16px !important; height:16px !important; min-height:16px !important; max-height:16px !important; border-radius:50% !important; background:#1667b7 !important; border:3px solid #fff !important; box-shadow:0 1px 7px rgba(0,0,0,.5) !important; padding:0 !important; margin:0 !important; }
.pe1hud-iss-map .maplibregl-ctrl-attrib { font-size: 10px; }

.pe1hud-iss-radio-panel { grid-column: 1 / -1; }
.pe1hud-iss-radio-panel > .pe1hud-iss-panel-title { font-size:calc(var(--pe1hud-radio-font-size) + 4px); }
.pe1hud-iss-radio-only { grid-template-columns:1fr; margin:0; gap:0; min-width:0; }
.pe1hud-iss-radio-only .pe1hud-iss-panel { width:100%; min-width:0; }
.pe1hud-iss-radio-only .pe1hud-iss-panel-title { min-height:0; padding:9px 10px; gap:7px; flex-wrap:wrap; }
.pe1hud-iss-radio-only .pe1hud-iss-panel-title > span { min-width:0; }
.pe1hud-iss-radio-only .pe1hud-iss-alert-toggle { margin-left:auto; padding:5px 7px; }
.pe1hud-iss-radio-only .pe1hud-iss-radio-summary { flex-direction:column; align-items:flex-start; gap:3px; padding:9px 10px; }
.pe1hud-iss-radio-only .pe1hud-iss-radio-countdown { max-width:100%; white-space:normal; }
.pe1hud-iss-radio-only .pe1hud-iss-radio-grid { grid-template-columns:1fr; }
.pe1hud-iss-radio-only .pe1hud-iss-radio-box { padding:10px; }
.pe1hud-iss-radio-only .pe1hud-iss-radio-box + .pe1hud-iss-radio-box { border-left:0; border-top:1px solid var(--pe1hud-border); }
.pe1hud-iss-radio-only .pe1hud-iss-pass-row { grid-template-columns:24px minmax(0,1fr); gap:7px; padding:7px 0; }
.pe1hud-iss-radio-only .pe1hud-iss-freq { display:grid; grid-template-columns:1fr; gap:2px; }
.pe1hud-iss-radio-only .pe1hud-iss-radio-note { padding:8px 10px; }
.pe1hud-iss-radio-only .pe1hud-iss-mode-row,
.pe1hud-iss-radio-only .pe1hud-iss-pass-data { overflow-wrap:anywhere; }
.pe1hud-iss-radio-summary { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:12px 14px; background:#eef7ff; border-bottom:1px solid var(--pe1hud-border); }
.pe1hud-iss-radio-state { color:var(--pe1hud-dark); font-size:calc(var(--pe1hud-radio-font-size) + 2px); }
.pe1hud-iss-radio-countdown { flex:0 0 auto; font-size:calc(var(--pe1hud-radio-font-size) + 4px); font-weight:800; color:#1b4d74; white-space:nowrap; }
.pe1hud-iss-radio-panel.is-soon .pe1hud-iss-radio-summary { background:#fff3cf; }
.pe1hud-iss-radio-panel.is-soon .pe1hud-iss-radio-countdown { color:#9b5d00; }
.pe1hud-iss-radio-panel.is-live { border-color:#2b8a3e; box-shadow:0 0 0 2px rgba(43,138,62,.13),0 5px 18px rgba(13,37,56,.08); }
.pe1hud-iss-radio-panel.is-live .pe1hud-iss-radio-summary { background:#dff4e3; }
.pe1hud-iss-radio-panel.is-live .pe1hud-iss-radio-state strong,
.pe1hud-iss-radio-panel.is-live .pe1hud-iss-radio-countdown { color:#167229; }
.pe1hud-iss-radio-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0; }
.pe1hud-iss-radio-box { min-width:0; padding:12px 14px; background:rgba(255,255,255,.55); }
.pe1hud-iss-radio-box + .pe1hud-iss-radio-box { border-left:1px solid var(--pe1hud-border); }
.pe1hud-iss-radio-box h4 { margin:0 0 9px; color:var(--pe1hud-dark); font-size:calc(var(--pe1hud-radio-font-size) + 1px); }
.pe1hud-iss-pass-row { display:grid; grid-template-columns:28px minmax(0,1fr); gap:8px; padding:8px 0; border-top:1px solid rgba(22,53,82,.12); font-size:var(--pe1hud-radio-font-size); line-height:1.45; color:var(--pe1hud-muted); }
.pe1hud-iss-pass-row:first-child { border-top:0; padding-top:0; }
.pe1hud-iss-pass-row b { color:var(--pe1hud-dark); }
.pe1hud-iss-pass-data { min-width:0; display:flex; flex-direction:column; gap:1px; }
.pe1hud-iss-pass-data > span { display:block; min-width:0; }
.pe1hud-iss-pass-data strong { color:var(--pe1hud-dark); font-weight:700; }
.pe1hud-iss-pass-date { display:block; margin-bottom:2px; }
.pe1hud-iss-pass-nr { width:24px; height:24px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#dceaf6; color:#28506f; font-weight:800; }
.pe1hud-iss-mode-row { padding:8px 0; border-top:1px solid rgba(22,53,82,.12); font-size:var(--pe1hud-radio-font-size); color:var(--pe1hud-dark); }
.pe1hud-iss-mode-row:first-of-type { border-top:0; }
.pe1hud-iss-freq { display:flex; flex-wrap:wrap; gap:5px 13px; margin-top:4px; color:var(--pe1hud-muted); }
.pe1hud-iss-freq b { color:var(--pe1hud-dark); }
.pe1hud-iss-mode-note { margin-top:3px; font-size:max(9px, calc(var(--pe1hud-radio-font-size) - 1px)); line-height:1.4; color:var(--pe1hud-muted); }
.pe1hud-iss-mode-status { display:inline-block; margin-left:5px; padding:2px 5px; border-radius:3px; background:#e8edf1; color:#5e6b75; font-size:max(8px, calc(var(--pe1hud-radio-font-size) - 3px)); font-weight:800; vertical-align:1px; }
.pe1hud-iss-mode-status.is-active { background:#d9f2df; color:#167229; }
.pe1hud-iss-mode-status.is-off { background:#f4dfdf; color:#9d2525; }
.pe1hud-iss-mode-status.is-conditional { background:#fff0c7; color:#8c5c00; }
.pe1hud-iss-ariss-status { margin-bottom:4px; font-size:max(8px, calc(var(--pe1hud-radio-font-size) - 2px)); color:var(--pe1hud-muted); }
.pe1hud-iss-radio-note { padding:9px 14px; border-top:1px solid var(--pe1hud-border); background:rgba(255,255,255,.65); color:var(--pe1hud-muted); font-size:max(9px, calc(var(--pe1hud-radio-font-size) - 1px)); line-height:1.45; }
.pe1hud-iss-muted { color:var(--pe1hud-muted); font-size:var(--pe1hud-radio-font-size); }
.pe1hud-iss-alert-toggle { appearance:none; border:1px solid rgba(22,53,82,.24); background:#fff; color:#36566e; border-radius:4px; padding:6px 9px; font-size:max(9px, calc(var(--pe1hud-radio-font-size) - 1px)); font-weight:600; line-height:1.2; font-family:inherit; cursor:pointer; white-space:nowrap; }
.pe1hud-iss-alert-toggle.is-on { background:#dff4e3; border-color:#87b993; color:#146526; }

@media (max-width: 900px) {
    .pe1hud-iss-layout-side { grid-template-columns:1fr; }
    .pe1hud-iss-radio-grid { grid-template-columns:1fr; }
    .pe1hud-iss-radio-box + .pe1hud-iss-radio-box { border-left:0; border-top:1px solid var(--pe1hud-border); }
}
@media (max-width: 600px) {
    .pe1hud-iss-live { gap:12px; }
    .pe1hud-iss-video-wrap, .pe1hud-iss-map { height:min(var(--pe1hud-iss-height),390px); }
    .pe1hud-iss-info { grid-template-columns:repeat(2,1fr); }
    .pe1hud-iss-info span { border-bottom:1px solid var(--pe1hud-border); }
    .pe1hud-iss-title-row { align-items:center; }
    .pe1hud-iss-radio-summary { align-items:flex-start; flex-direction:column; gap:4px; }
    .pe1hud-iss-radio-countdown { white-space:normal; }
}

/* Als van video/kaart maar één hoofdblok zichtbaar is, gebruik de volledige breedte. */
.pe1hud-iss-layout-side.pe1hud-iss-single-primary > .pe1hud-iss-video-panel,
.pe1hud-iss-layout-side.pe1hud-iss-single-primary > .pe1hud-iss-map-panel {
    grid-column: 1 / -1;
}