/* Chatfenster der Startseite: Kopf, Eingabe, FAQ-Fläche und Vollbild im gleichen Aufbau und mit den gleichen Stilen wie bei Own Your Place
   (website/creator.html, Abschnitt "Olivia: Eingabe, FAQ, Vollbild"). Die Klassen heißen gleich, damit beide Seiten Zeile für Zeile vergleichbar bleiben.
   Die Nachrichtenblasen und das Kontaktformular behalten ihre bisherigen Stile. FAQ-Reiter, FAQ-Fläche und Vollbild-Knopf gibt es nur am Handy. */

/* ── Kopf ── */
.chat-head{padding:16px 20px;border-bottom:1px solid rgba(var(--text-primaer-rgb),0.08);display:flex;align-items:center;justify-content:space-between;}
.chat-who{display:flex;align-items:center;gap:10px;font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:13px;letter-spacing:0.05em;color:var(--text-primaer);}
.chat-av{width:36px;height:36px;border-radius:999px;border:1.5px solid var(--orange);background:url('/assets/olivia-profil.jpg') 50% 50%/112%;box-shadow:0 0 16px rgba(var(--orange-rgb),0.35);}
.chat-tools{display:flex;align-items:center;gap:10px;}
.chat-on{display:flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;border:1px solid rgba(31,140,59,0.4);font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:0.1em;color:var(--text-meta);}
.chat-on i{width:6px;height:6px;border-radius:999px;background:#1f8c3b;animation:pulseDot 2s ease-in-out infinite;}

/* ── Vollbild-Knopf mit leuchtendem Kreis, Hinweis darunter ── */
.chat-tool-wrap{position:relative;display:inline-flex;}
.chat-tool{display:grid;place-items:center;width:32px;height:32px;border-radius:999px;border:1.5px solid rgba(var(--orange-rgb),0.7);background:none;color:var(--text-primaer);cursor:pointer;position:relative;padding:0;}
.chat-tool:hover{border-color:var(--orange);color:var(--orange);}
.chat-tool::after{content:'';position:absolute;inset:-6px;border-radius:999px;border:1.5px solid rgba(var(--orange-rgb),0.55);animation:ringPuls 2.2s ease-out infinite;pointer-events:none;}
.chat-tool[data-benutzt="1"]::after{display:none;}
.chat-tool .ic-zu{display:none;}
#olivia-chat[data-voll="1"] .chat-tool .ic-zu{display:inline;}
#olivia-chat[data-voll="1"] .chat-tool .ic-auf{display:none;}
@keyframes ringPuls{0%{transform:scale(.85);opacity:.9;}100%{transform:scale(1.35);opacity:0;}}
.chat-hint{position:absolute;top:40px;right:0;white-space:nowrap;background:rgba(20,16,11,0.96);border:1px solid rgba(var(--orange-rgb),0.45);border-radius:8px;padding:7px 12px;font-size:11px;font-family:'Space Grotesk',sans-serif;color:var(--text-primaer);transition:opacity .6s ease;pointer-events:none;z-index:10;}

/* ── Nachrichten und FAQ-Fläche (die Fläche deckt nur den Nachrichtenbereich, Kopf und Eingabe bleiben frei) ── */
.chat-main{position:relative;display:flex;flex-direction:column;}
.faq-tab{position:absolute;right:0;top:50%;transform:translateY(-50%);z-index:4;writing-mode:vertical-rl;padding:16px 8px;border:1px solid rgba(var(--orange-rgb),0.55);border-right:none;border-radius:12px 0 0 12px;background:rgba(var(--orange-rgb),0.16);color:var(--orange-hell);font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:12px;letter-spacing:0.18em;cursor:pointer;box-shadow:0 0 18px -4px rgba(var(--orange-rgb),0.45);}
.faq-tab:hover{background:rgba(var(--orange-rgb),0.28);}
.faq-panel{position:absolute;top:0;right:0;bottom:0;width:min(380px,94%);z-index:6;display:flex;flex-direction:column;background:rgba(16,12,9,0.97);border-left:1px solid rgba(var(--orange-rgb),0.4);box-shadow:-24px 0 50px -20px rgba(0,0,0,0.8);transform:translateX(104%);visibility:hidden;transition:transform .32s cubic-bezier(.2,.9,.3,1),visibility 0s .32s;}
.faq-panel.offen{transform:none;visibility:visible;transition-delay:0s;}
.faq-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid rgba(var(--text-primaer-rgb),0.1);font-family:'Space Grotesk',sans-serif;font-size:13px;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-primaer);}
.faq-zu{background:none;border:none;color:var(--text-primaer);font-size:24px;line-height:1;cursor:pointer;padding:0 4px;}
.faq-liste{overflow-y:auto;padding:6px 14px 20px;-webkit-overflow-scrolling:touch;}
.faq-gruppe{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:var(--orange-hell);margin:18px 4px 8px;}
button.faq-gruppe{display:flex;align-items:center;justify-content:space-between;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid rgba(var(--text-primaer-rgb),0.1);padding:14px 4px;margin:0;cursor:pointer;}
button.faq-gruppe::after{content:'+';font-size:16px;line-height:1;color:var(--orange-hell);}
button.faq-gruppe[aria-expanded=true]::after{content:'\2212';}
.faq-box{padding:10px 0 4px;}
.faq-box[hidden]{display:none;}
.faq-q{display:block;width:100%;text-align:left;background:rgba(var(--text-primaer-rgb),0.05);border:1px solid rgba(var(--text-primaer-rgb),0.1);border-radius:12px;color:var(--text-sekundaer);font-family:'Inter',sans-serif;font-size:13.5px;line-height:1.45;padding:11px 14px;margin:0 0 7px;cursor:pointer;transition:background .2s,border-color .2s;}
.faq-q:hover{background:rgba(var(--orange-rgb),0.14);border-color:rgba(var(--orange-rgb),0.5);color:var(--text-primaer);}
@media (min-width:768px){.faq-tab,.faq-panel{display:none;}}

/* ── Eingabe: Pille, runder Sprechknopf, runder Sendepfeil, Hinweiszeile ── */
.chat-in{display:block;padding:0 16px 16px;}
.chat-row{display:flex;gap:8px;align-items:flex-end;}
.chat-pille{flex:1;min-width:0;padding:4px 16px;border-radius:26px;background:rgba(34,28,25,.93);border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.04);transition:border-color .2s;}
.chat-pille:focus-within{border-color:rgba(var(--orange-rgb),.55);}
.chat-field{font-family:'Inter',sans-serif;color:#fff;outline:none;min-width:0;width:100%;background:transparent;border:none;border-radius:0;padding:9px 0;font-size:16px;box-sizing:border-box;}
.chat-field::placeholder{color:var(--text-meta);}
.chat-mic,.chat-stop,.chat-send{width:44px;height:44px;border-radius:50%;flex:none;display:grid;place-items:center;cursor:pointer;padding:0;}
.chat-mic,.chat-stop{background:rgba(48,30,16,.95);border:1px solid rgba(var(--orange-rgb),.5);color:var(--orange-hell);}
.chat-mic:hover{background:rgba(var(--orange-rgb),.2);}
.chat-stop{box-shadow:0 0 12px rgba(var(--orange-rgb),.35);animation:pulseDot 2s ease-in-out infinite;}
.chat-send{border:none;background:linear-gradient(160deg,#ecd3a3,#cfae82 55%,#a98860);color:#1a0d02;box-shadow:0 6px 20px rgba(var(--orange-rgb),.4);}
.chat-mic[hidden],.chat-stop[hidden],.chat-tipp[hidden],.chat-hoert[hidden]{display:none;}
.chat-hoert{display:flex;align-items:center;gap:8px;margin-bottom:8px;padding:7px 12px;background:rgba(48,30,16,.95);border:1px solid rgba(var(--orange-rgb),.28);border-radius:12px;font-size:12px;color:rgba(255,255,255,.75);}
.chat-hoert i{width:6px;height:6px;border-radius:50%;background:var(--orange);animation:pulseDot .9s ease-in-out infinite;}
.chat-tipp{text-align:center;color:rgba(255,255,255,.5);font-size:11.5px;margin:7px 0 0;}

/* ── Vollbild (am Handy): Kopf oben, Nachrichten füllen die Mitte, Eingabe unten. Höhe und Lage folgen der sichtbaren Fläche, auch mit Tastatur
   (--vvh und --vvtop setzt faq-sdi.js aus visualViewport). Die Stile des Seitenaufbaus (fixed, volle Breite) bleiben, hier kommt nur der Rest dazu. ── */
body:has(#olivia-chat[data-voll="1"]),html:has(#olivia-chat[data-voll="1"]){overflow:hidden;overscroll-behavior:none;}
#olivia-chat[data-voll="1"]{display:flex!important;flex-direction:column;height:var(--vvh,100svh)!important;top:var(--vvtop,0)!important;bottom:auto!important;border:none!important;background:linear-gradient(160deg,#1c1510,#100c09)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:none!important;}
#olivia-chat[data-voll="1"] .chat-head{padding:14px max(16px,calc((100% - 760px)/2));}
#olivia-chat[data-voll="1"] .chat-main{flex:1;min-height:0;}
#olivia-chat[data-voll="1"] .olivia-msgs{flex:1!important;max-height:none!important;min-height:0!important;padding:28px max(20px,calc((100% - 760px)/2));overscroll-behavior:contain;}
#olivia-chat[data-voll="1"] .chat-in{padding:6px max(16px,calc((100% - 760px)/2)) calc(10px + env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(14,9,6,0),rgba(14,9,6,.55) 45%);}
#olivia-chat[data-voll="1"] .chat-dsgvo{padding:0 max(16px,calc((100% - 760px)/2)) calc(14px + env(safe-area-inset-bottom))!important;}
#olivia-chat[data-voll="1"] .chat-hint{display:none;}
#olivia-chat[data-voll="1"] .faq-panel{width:min(420px,94%);}
@media (max-width:767px){#olivia-chat[data-voll="1"] .faq-tab{padding:14px 7px;}}