/* RT Web Player — rti-Integration (Status-Punkt · Konto-Reiter)
   Alle Regeln sind unter #rtwp-player gescoped und nutzen !important,
   damit sie sich im eingebauten Player (Theme + Player-CSS mit vielen
   !important-Regeln) genauso durchsetzen wie im abgeschotteten Popup. */

/* ── Punkt-Container in der Mini-Leiste ─────────────────────────── */
#rtwp-player .rtwp-acct {
    display: inline-flex !important;
    align-items: center !important;
    vertical-align: middle !important;
    margin: 0 0 0 8px !important;
}

/* ── Status-Punkt (Mini-Leiste) ─────────────────────────────────
   angemeldet = grün gefüllt · nicht angemeldet = grauer Ring.
   Doppelte Kontur → auf jedem Kanal-Farbton klar erkennbar.        */
#rtwp-player .rtwp-acct-dot {
    display: inline-block !important;
    width: 10px !important;
    height: 10px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
    vertical-align: middle !important;
    background: transparent !important;
    border: 1.5px solid rgba(230, 230, 232, .8) !important;
    box-shadow: 0 0 0 1.5px rgba(0, 0, 0, .35) !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    cursor: pointer !important;
}
#rtwp-player .rtwp-acct-dot:hover {
    border-color: #fff !important;
    box-shadow: 0 0 0 1.5px rgba(0, 0, 0, .35), 0 0 6px rgba(255, 255, 255, .35) !important;
}
#rtwp-player .rtwp-acct-dot.is-on {
    background: #2ecc71 !important;
    border-color: rgba(255, 255, 255, .55) !important;
    box-shadow: 0 0 0 1.5px rgba(0, 0, 0, .35), 0 0 5px rgba(46, 204, 113, .55) !important;
}

/* ── „Konto"-Reiter: nur der Punkt, kein Text ───────────────────── */
#rtwp-player .rtwp-tab-konto {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
}
#rtwp-player .rtwp-konto-dot {
    display: inline-block !important;
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
    vertical-align: middle !important;
    background: transparent !important;
    border: 1.5px solid rgba(200, 200, 208, .85) !important;
    flex: 0 0 auto !important;
}
#rtwp-player .rtwp-konto-dot.is-on {
    background: #2ecc71 !important;
    border-color: #2ecc71 !important;
    box-shadow: 0 0 5px rgba(46, 204, 113, .55) !important;
}

/* ── Inhalt des „Konto"-Reiters ─────────────────────────────────── */
#rtwp-player .rtwp-konto-body { font-family: inherit !important; color: #F2EFE9 !important; font-size: 13px !important; }
#rtwp-player .rtwp-konto-intro { margin: 0 0 10px !important; font-size: 13px !important; color: #C9C6CF !important; }
#rtwp-player .rtwp-konto-hi { font-size: 14px !important; margin: 0 0 14px !important; color: #F2EFE9 !important; font-weight: 400 !important; }
#rtwp-player .rtwp-konto-hi strong { color: #fff !important; font-weight: 700 !important; }
#rtwp-player .rtwp-konto-actions { display: flex !important; align-items: center !important; gap: 14px !important; flex-wrap: wrap !important; }

#rtwp-player .rtwp-konto-link {
    color: #F2EFE9 !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
    font-size: 13px !important;
    background: none !important;
}
#rtwp-player .rtwp-konto-link:hover { color: #fff !important; }
#rtwp-player .rtwp-konto-logout {
    -webkit-appearance: none !important;
    appearance: none !important;
    border: 1px solid rgba(255, 255, 255, .4) !important;
    background: transparent !important;
    color: #F2EFE9 !important;
    border-radius: 999px !important;
    padding: 5px 16px !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    cursor: pointer !important;
    font-family: inherit !important;
    text-transform: none !important;
    width: auto !important;
}
#rtwp-player .rtwp-konto-logout:hover { background: rgba(255, 255, 255, .12) !important; }

/* Login-Formular im Reiter */
#rtwp-player .rtwp-acct-form { display: flex !important; align-items: center !important; gap: 8px !important; flex-wrap: wrap !important; }
#rtwp-player .rtwp-acct-inp {
    border: 1px solid rgba(255, 255, 255, .35) !important;
    background: rgba(255, 255, 255, .1) !important;
    color: #fff !important;
    border-radius: 6px !important;
    padding: 7px 10px !important;
    font-size: 14px !important;
    max-width: 220px !important;
    font-family: inherit !important;
}
#rtwp-player .rtwp-acct-inp::placeholder { color: rgba(255, 255, 255, .55) !important; }
#rtwp-player .rtwp-acct-btn {
    -webkit-appearance: none !important;
    appearance: none !important;
    border: 1px solid rgba(255, 255, 255, .45) !important;
    background: transparent !important;
    color: #F2EFE9 !important;
    border-radius: 999px !important;
    padding: 7px 16px !important;
    font-size: 13px !important;
    cursor: pointer !important;
    font-family: inherit !important;
    text-transform: none !important;
    width: auto !important;
}
#rtwp-player .rtwp-acct-btn:hover { background: rgba(200, 16, 46, .25) !important; border-color: #ff4d6a !important; }
#rtwp-player .rtwp-acct-hint { width: 100% !important; font-size: 12px !important; color: #C9C6CF !important; margin: 8px 0 4px !important; }
#rtwp-player .rtwp-acct-msg  { width: 100% !important; font-size: 12px !important; margin-top: 6px !important; color: #6fe0a1 !important; }
#rtwp-player .rtwp-acct-msg.err { color: #ff8a8a !important; }

/* ── Hell-Theme: dunkle Schrift ─────────────────────────────────── */
#rtwp-player[data-theme="light"] .rtwp-konto-body,
#rtwp-player[data-theme="light"] .rtwp-konto-hi,
#rtwp-player[data-theme="light"] .rtwp-konto-hi strong,
#rtwp-player[data-theme="light"] .rtwp-konto-link,
#rtwp-player[data-theme="light"] .rtwp-konto-logout,
#rtwp-player[data-theme="light"] .rtwp-acct-btn { color: #0F0F14 !important; }
#rtwp-player[data-theme="light"] .rtwp-konto-intro,
#rtwp-player[data-theme="light"] .rtwp-acct-hint { color: #55535c !important; }
#rtwp-player[data-theme="light"] .rtwp-konto-logout,
#rtwp-player[data-theme="light"] .rtwp-acct-btn { border-color: rgba(0, 0, 0, .3) !important; }
#rtwp-player[data-theme="light"] .rtwp-acct-inp {
    border-color: rgba(0, 0, 0, .25) !important;
    background: rgba(0, 0, 0, .05) !important;
    color: #0F0F14 !important;
}
#rtwp-player[data-theme="light"] .rtwp-acct-inp::placeholder { color: rgba(0, 0, 0, .45) !important; }