/* =============================================
   HIRSCH-CHATBOT – Frontend-Widget
   Nutzt die Design-System-Variablen aus main.css.
   ============================================= */
.lh-cb { position:fixed; right:clamp(1rem,3vw,2rem); bottom:clamp(1rem,3vw,2rem); z-index:9000; font-family:var(--font-body); }

.lh-cb-toggle { display:inline-flex; align-items:center; gap:0.6rem; height:56px; padding:0 1.3rem 0 1.1rem; border-radius:0; background:var(--gold-500); color:var(--white); box-shadow:0 10px 30px rgba(182,159,107,0.4),0 2px 8px rgba(0,0,0,0.15); transition:transform var(--dur-fast),background var(--dur-fast),padding var(--dur-fast); }
.lh-cb-toggle:hover { background:var(--gold-600); transform:translateY(-2px); }
.lh-cb-ico { display:inline-flex; flex-shrink:0; }
.lh-cb-ico-x { display:none; }
.lh-cb.is-open .lh-cb-ico-chat { display:none; }
.lh-cb.is-open .lh-cb-ico-x { display:inline-flex; }
.lh-cb-teaser { font-family:var(--font-body); font-weight:500; font-size:0.92rem; letter-spacing:0.01em; white-space:nowrap; }
.lh-cb.is-open .lh-cb-teaser { display:none; }
.lh-cb.is-open .lh-cb-toggle { padding:0; width:56px; justify-content:center; }

/* Link-Button in den Antworten (eckig). */
.lh-cb-link { display:inline-flex; align-items:center; gap:0.3rem; margin-top:0.35rem; padding:0.45rem 0.85rem; background:var(--gold-500); color:var(--white) !important; font-size:0.82rem; font-weight:500; letter-spacing:0.03em; text-decoration:none !important; transition:background var(--dur-fast); }
.lh-cb-link:hover { background:var(--gold-600); }

/* Wichtig: schlägt display:flex, damit das hidden-Attribut greift (Schließen). */
.lh-cb-panel[hidden] { display:none; }
.lh-cb-panel { position:absolute; right:0; bottom:74px; width:min(440px,calc(100vw - 2rem)); height:min(680px,calc(100vh - 6rem)); background:var(--cream); box-shadow:0 24px 70px rgba(30,26,21,0.32); display:flex; flex-direction:column; overflow:hidden; animation:lhCbIn 0.32s var(--ease-out); }
@keyframes lhCbIn { from { opacity:0; transform:translateY(16px) scale(0.98); } to { opacity:1; transform:none; } }

.lh-cb-head { background:var(--forest-800); color:var(--white); padding:0.9rem 1.1rem; display:flex; align-items:center; gap:0.7rem; flex-shrink:0; }
.lh-cb-avatar { position:relative; width:40px; height:40px; flex-shrink:0; display:flex; align-items:center; justify-content:center; background:var(--gold-500); color:var(--white); }
.lh-cb-dot { position:absolute; right:-2px; bottom:-2px; width:11px; height:11px; background:#46c46a; border:2px solid var(--forest-800); }
.lh-cb-head-text { display:flex; flex-direction:column; flex:1; min-width:0; line-height:1.25; }
.lh-cb-title { font-family:var(--font-display); font-size:1.2rem; font-weight:500; letter-spacing:0.01em; }
.lh-cb-subtitle { font-size:0.72rem; letter-spacing:0.03em; color:var(--gold-300); }
.lh-cb-x { color:var(--gold-300); font-size:1.6rem; line-height:1; width:32px; height:32px; flex-shrink:0; }
.lh-cb-x:hover { color:var(--white); }

/* Frage-Vorschläge (Chips) unter der Begrüßung. */
.lh-cb-chips { display:flex; flex-direction:column; align-items:flex-start; gap:0.45rem; margin-top:0.2rem; }
.lh-cb-chip { max-width:90%; text-align:left; background:var(--white); color:var(--forest-700); border:1px solid var(--gold-300); padding:0.5rem 0.85rem; font-family:var(--font-body); font-size:0.86rem; line-height:1.4; cursor:pointer; transition:background var(--dur-fast),color var(--dur-fast),border-color var(--dur-fast); }
.lh-cb-chip:hover { background:var(--gold-500); color:var(--white); border-color:var(--gold-500); }

.lh-cb-body { position:relative; flex:1; overflow-y:auto; padding:1rem; display:flex; flex-direction:column; gap:0.6rem; background:var(--cream); }

.lh-cb-msg { max-width:85%; padding:0.65rem 0.9rem; font-size:0.92rem; line-height:1.55; border-radius:2px; word-wrap:break-word; }
.lh-cb-msg a { color:var(--gold-700); text-decoration:underline; }
.lh-cb-bot { background:var(--white); color:var(--forest-800); align-self:flex-start; box-shadow:0 2px 8px rgba(0,0,0,0.05); }
.lh-cb-user { background:var(--gold-500); color:var(--white); align-self:flex-end; }
.lh-cb-user a { color:#fff; }

.lh-cb-typing { display:flex; gap:4px; align-items:center; }
.lh-cb-typing span { width:7px; height:7px; border-radius:50%; background:var(--forest-300); animation:lhCbBlink 1.2s infinite ease-in-out; }
.lh-cb-typing span:nth-child(2) { animation-delay:0.2s; }
.lh-cb-typing span:nth-child(3) { animation-delay:0.4s; }
@keyframes lhCbBlink { 0%,80%,100% { opacity:0.3; } 40% { opacity:1; } }

.lh-cb-consent { padding:0.5rem; display:flex; flex-direction:column; gap:0.8rem; }
.lh-cb-consent p { font-size:0.86rem; color:var(--forest-600); line-height:1.6; margin:0; }
.lh-cb-privacy { font-size:0.8rem; color:var(--gold-700); text-decoration:underline; }
.lh-cb-agree { align-self:flex-start; background:var(--gold-500); color:var(--white); font-family:var(--font-body); font-weight:500; font-size:0.8rem; letter-spacing:0.12em; text-transform:uppercase; padding:0.7rem 1.4rem; transition:background var(--dur-fast); }
.lh-cb-agree:hover { background:var(--gold-600); }

.lh-cb-input[hidden] { display:none; }
.lh-cb-input { display:flex; gap:0.5rem; padding:0.7rem; border-top:1px solid var(--forest-100); background:var(--white); flex-shrink:0; }
.lh-cb-input input { flex:1; border:1px solid var(--forest-200); background:var(--cream); padding:0.7rem 0.9rem; font-family:var(--font-body); font-size:0.92rem; color:var(--forest-800); outline:none; transition:border-color var(--dur-fast); }
.lh-cb-input input:focus { border-color:var(--gold-500); background:var(--white); }
.lh-cb-input button { flex-shrink:0; width:44px; background:var(--gold-500); color:var(--white); display:flex; align-items:center; justify-content:center; transition:background var(--dur-fast); }
.lh-cb-input button:hover { background:var(--gold-600); }

/* ---------- Mobil: Vollbild, Notch & Tastatur berücksichtigen ---------- */
@media (max-width:600px) {
  .lh-cb-panel {
    position:fixed; top:0; left:0; right:0; bottom:0;
    width:100%; height:100vh; height:100dvh; max-height:none;
    box-shadow:none;
  }
  /* Notch/Safe-Areas oben und unten. */
  .lh-cb-head { padding-top:calc(0.9rem + env(safe-area-inset-top)); padding-left:calc(1.1rem + env(safe-area-inset-left)); padding-right:calc(1.1rem + env(safe-area-inset-right)); }
  .lh-cb-body { padding-left:calc(1rem + env(safe-area-inset-left)); padding-right:calc(1rem + env(safe-area-inset-right)); }
  .lh-cb-input { padding-bottom:calc(0.7rem + env(safe-area-inset-bottom)); padding-left:calc(0.7rem + env(safe-area-inset-left)); padding-right:calc(0.7rem + env(safe-area-inset-right)); }
  /* 16px verhindert das automatische Zoomen von iOS beim Fokussieren. */
  .lh-cb-input input { font-size:16px; }
  .lh-cb-body { -webkit-overflow-scrolling:touch; }
  /* Hintergrund nicht scrollen, solange der Chat offen ist. */
  body.lh-cb-lock { overflow:hidden; }
}

@media (prefers-reduced-motion:reduce) {
  .lh-cb-panel { animation:none; }
  .lh-cb-typing span { animation:none; }
}