/* RWE-Portal Radio: Mini-Leiste (global), Forum-Karte, Radio-Seite */
#rweRadioBar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990; display: none; align-items: center; gap: 10px;
    padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px)); background: linear-gradient(135deg,#a70909,#5a0b0b); color: #fff;
    box-shadow: 0 -4px 16px rgba(0,0,0,.35); }
#rweRadioBar.an { display: flex; }
.mobile-footer-nav ~ #rweRadioBar, #rweRadioBar[style*="bottom: 5"] { padding-bottom: 8px; }
#rweRadioBar .rrb-logo img { width: 42px; height: 42px; border-radius: 8px; object-fit: cover; background: #fff; display: block; }
#rweRadioBar .rrb-info { flex: 1; min-width: 0; display: flex; flex-direction: column; color: #fff; text-decoration: none; }
#rweRadioBar .rrb-name { font-weight: 700; font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#rweRadioBar .rrb-sub { font-size: .75rem; opacity: .8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#rweRadioBar.live .rrb-sub::before { content: ''; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #ff4d4d; margin-right: 6px; animation: rrbpuls 1.2s infinite; }
#rweRadioBar.fehler .rrb-sub { color: #ffd0d0; opacity: 1; }
@keyframes rrbpuls { 50% { opacity: .3; } }
#rweRadioBar button { border: none; cursor: pointer; color: #fff; }
#rweRadioBar .rrb-play { width: 44px; height: 44px; border-radius: 50%; background: #fff; color: #a70909; font-size: 1.05rem; box-shadow: 0 0 14px rgba(255,255,255,.35); }
#rweRadioBar .rrb-x { width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,.15); }
html.rrb-aktiv body { padding-bottom: 64px; }

/* Forum-Karte (geteilter Radio-Link) */
.rradio-embed { display: flex; align-items: center; gap: 12px; margin: .6rem 0; padding: 12px 14px; max-width: 520px; border-radius: 14px; color: #fff;
    background: linear-gradient(160deg,#6e0d0d,#5a0b0b 70%); border: 1px solid rgba(167,9,9,.5); box-shadow: 0 4px 20px rgba(0,0,0,.3); }
.rradio-embed img { width: 56px; height: 56px; border-radius: 10px; object-fit: cover; background: #fff; flex: none; }
.rradio-embed .rre-info { flex: 1; min-width: 0; }
.rradio-embed .rre-name { font-weight: 700; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rradio-embed .rre-sub { font-size: .8rem; opacity: .8; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rradio-embed .rre-live { font-size: .7rem; font-weight: 700; color: #ff8d8d; letter-spacing: .06em; }
.rradio-embed .rre-play { width: 50px; height: 50px; border-radius: 50%; border: none; background: #fff; color: #a70909; font-size: 1.15rem; cursor: pointer; flex: none; box-shadow: 0 0 16px rgba(255,255,255,.3); }
.rradio-embed.live .rre-live::before { content: ''; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #ff4d4d; margin-right: 5px; animation: rrbpuls 1.2s infinite; }
.rradio-embed a.rre-mehr { color: #ffc9c9; font-size: .78rem; text-decoration: none; }

/* Radio-Seite */
.rp { max-width: 860px; margin: 0 auto; padding: 18px 14px 40px; }
.rp h1 { margin: 0 0 12px; display: flex; align-items: center; gap: 10px; }
.rp-suche { position: sticky; top: 0; z-index: 5; background: var(--bg, #fff); padding: 8px 0; }
.rp-suche input { width: 100%; box-sizing: border-box; padding: 12px 14px; font-size: 16px; border-radius: 12px; border: 1px solid #c9c9c9; }
.rp-reihe { display: flex; gap: 8px; overflow-x: auto; padding: 6px 0; scrollbar-width: none; }
.rp-reihe::-webkit-scrollbar { display: none; }
.rp-chip { flex: none; padding: 7px 14px; border-radius: 999px; border: 1px solid #bbb; background: transparent; color: inherit; font-size: .88rem; cursor: pointer; white-space: nowrap; }
.rp-chip.an { background: #a70909; border-color: #a70909; color: #fff; font-weight: 700; }
.rp-sel { padding: 7px 10px; border-radius: 999px; border: 1px solid #bbb; background: transparent; color: inherit; font-size: .88rem; max-width: 190px; }
.rp-liste { display: grid; gap: 10px; margin-top: 8px; }
.rp-karte { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; border: 1px solid rgba(128,128,128,.3); background: rgba(128,128,128,.07); }
.rp-karte.spielt { border-color: #a70909; box-shadow: 0 0 0 2px rgba(167,9,9,.25); }
.rp-karte img { width: 54px; height: 54px; border-radius: 10px; object-fit: cover; background: #fff; flex: none; }
.rp-karte .rp-info { flex: 1; min-width: 0; }
.rp-karte .rp-name { font-weight: 700; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rp-karte .rp-sub { font-size: .8rem; opacity: .75; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rp-btn { width: 40px; height: 40px; border-radius: 50%; border: none; background: rgba(128,128,128,.15); color: inherit; cursor: pointer; flex: none; font-size: .95rem; }
.rp-btn.fav.an { color: #e0245e; }
.rp-play { width: 46px; height: 46px; border-radius: 50%; border: none; background: #a70909; color: #fff; font-size: 1.05rem; cursor: pointer; flex: none; box-shadow: 0 0 14px rgba(167,9,9,.45); }
.rp-mehr { display: block; margin: 14px auto; padding: 10px 22px; border-radius: 999px; border: 1px solid #a70909; background: transparent; color: #a70909; font-weight: 700; cursor: pointer; }
.rp-leer { text-align: center; opacity: .7; padding: 30px 10px; }
.rp-eigen { background: linear-gradient(135deg,#a70909,#5a0b0b); color: #fff; border-color: #a70909; }
.rp-eigen .rp-btn { background: rgba(255,255,255,.18); color: #fff; }
.rp-eigen .rp-play { background: #fff; color: #a70909; }
.rp-hinweis { font-size: .78rem; opacity: .65; margin-top: 18px; text-align: center; }
