/*
    Copyright 2026 | DragonPilot alias Alexander, Thomas Niesner | IT seit 1997
    Handgemachtes anstatt ständige Fixes und oder Bug Fehlersuche | statische Webseiten
    seit internet beginns | ex Unternehmung "die-netzwerk-macher.de" ob nun Inviduelle
    Programmierung oder Templates CMS Optimierungen Wordpress; Drupal; Burning Board;
    Woltlab Suite; Jomla; oder sonstige Exoten- somit diese TLD Webseite(n)
    die-foto-macher.de | fpv-de.com, beginn 2026 - 9 Phase TGv1.9.4 <stable> !

   TG CHAT
   --------------------------------------------------
   Eigenständiges Chat-CSS
*/
#tg-live-chat {
    position: fixed;
    margin: 0;
    width: 400px;
    max-width: calc(100vw - 40px);
    padding: 0;
    background: #000000;
    color: #C2E6F2;
    border: 2px solid #C2E6F2;
    border-radius: 20px;
    z-index: 99990;
    box-sizing: border-box;
}
        #tg-live-chat h1 {
            margin-top: 0;
        }
        #tg-live-chat-status {
            margin-bottom: 20px;
            opacity: 0.8;
        }
        #tg-live-chat-messages {
            min-height: 260px;
            max-height: 500px;
            overflow-y: auto;
            margin-bottom: 20px;
            padding: 15px;
            border: 1px solid currentColor;
            border-radius: 10px;
        }
        .tg-live-chat-message {
            margin-bottom: 15px;
            padding-bottom: 10px;
            border-bottom: 1px solid currentColor;
        }
        .tg-live-chat-message strong {
            display: block;
            margin-bottom: 4px;
        }
        #tg-live-chat-input {
            width: calc(100% - 110px);
            box-sizing: border-box;
            padding: 10px;
        }
        #tg-live-chat-send {
            width: 95px;
            margin-left: 10px;
            padding: 10px;
            cursor: pointer;
        }
/* ==================================================
   DragonPilot Chat Override
   gleiche Optik wie KJen
   ================================================== */
.tg-chat-sprechblase {
    position:fixed;
    left:120px;
    bottom:48px;
    width:400px;
    max-width:calc(100vw - 150px);
    background:#000000 !important;
    border:2px solid #C2E6F2 !important;
    border-radius:20px;
    color:#C2E6F2 !important;
    z-index:99990;
}
.tg-chat-sprechblase-kopf {
    background:#000000 !important;
    color:#FFFFFF !important;
}
.tg-chat-sprechblase-inhalt {
    background:#000000 !important;
    color:#C2E6F2 !important;
}
.tg-chat-nachricht-user {
    background:#000000 !important;
    border:1px solid #FFFFFF;
    color:#FFFFFF;
}
.tg-chat-eingabe input {
    background:#000000 !important;
    color:#FFFFFF !important;
    border:1px solid #FFFFFF;
}
.tg-chat-eingabe button {
    background:#000000 !important;
    color:#FFFFFF !important;
    border:1px solid #FFFFFF;
}
/* ==================================================
   DragonPilot Live Chat
   Felder und Bereiche wie KJen-Dialog
   ================================================= */
dialog#tg-live-chat {
    position: fixed !important;
    inset: auto auto 48px 120px !important;

    width: 400px;
    max-width: calc(100vw - 150px);
    max-height: 520px;
    margin: 0 !important;
    padding: 0;

    background: #000000;
    color: #C2E6F2;
    border: 2px solid #C2E6F2;
    border-radius: 20px;
    overflow: hidden;
    box-sizing: border-box;
    z-index: 99990;
}
dialog#tg-live-chat::backdrop {
    background: transparent;
}
/* --------------------------------------------------
   Kopf
   -------------------------------------------------- */
.tg-live-chat-kopf {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    border-radius: 17px 17px 0 0;
    background: #000000;
    color: #FFFFFF;
}
/* --------------------------------------------------
   Nachrichtenbereich
   -------------------------------------------------- */
#tg-live-chat-messages {
    min-height: 260px;
    max-height: 450px;
    overflow-y: auto;
    margin: 0;
    padding: 14px;
    border: 0;
    border-radius: 0;
    background: #000000;
    color: #C2E6F2;
    box-sizing: border-box;
}
/* --------------------------------------------------
   einzelne DP-Nachricht
   -------------------------------------------------- */
.tg-live-chat-message {
    display: inline-block;
    margin: 8px 0 0 0;
    padding: 10px 14px;
    border: 1px solid #C2E6F2;
    border-radius: 16px;
    background: #000000;
    color: #C2E6F2;
    line-height: 1.4;
    box-sizing: border-box;
}
/* --------------------------------------------------
   Eingabebereich
   -------------------------------------------------- */
.tg-live-chat-eingabe {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 0;
    padding: 14px;
    background: #000000;
    box-sizing: border-box;
}
/* --------------------------------------------------
   Eingabefeld
   -------------------------------------------------- */
.tg-live-chat-eingabe input {
    flex: 1;
    min-width: 0;
    width: auto;
    padding: 9px 12px;
    border: 1px solid #FFFFFF;
    border-radius: 12px;
    background: #000000;
    color: #FFFFFF;
    box-sizing: border-box;
    outline: none;
}
.tg-live-chat-eingabe input::placeholder {
    color: #C2E6F2;
}
/* --------------------------------------------------
   Senden
   -------------------------------------------------- */
.tg-live-chat-eingabe button {
    flex: 0 0 auto;
    width: auto;
    margin-left: 0;
    padding: 9px 13px;
    border: 1px solid #FFFFFF;
    border-radius: 12px;
    background: #000000;
    color: #FFFFFF;
    cursor: pointer;
    box-sizing: border-box;
}
.tg-live-chat-eingabe button:hover {
    background: #FFFFFF;
    color: #000000;
}
/* x */
.tg-live-chat-schliessen {
    border: 0;
    background: transparent;
    color: #FFFFFF;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    padding: 2px 6px;
}