/* KI-Fragen-Chat: Knopf unten rechts ÜBER dem Barrierefreiheits-Knopf (Ally, unten rechts); der schwebende Warenkorb sitzt unten links. */
.hu-chat-knopf { position: fixed; right: 20px; bottom: 96px; z-index: 9997; width: 56px; height: 56px; border-radius: 50%; border: 0; padding: 0;
  background: #5BAE22; color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 4px 14px rgba(0,0,0,.25); }
.hu-chat-knopf[hidden] { display: none; }
.hu-chat-knopf:hover, .hu-chat-knopf:focus-visible { background: #4c9a1a; outline: none; }
.hu-chat-knopf:focus-visible { box-shadow: 0 0 0 3px #fff, 0 0 0 5px #5BAE22; }

.hu-chat-blase { position: fixed; right: 20px; bottom: 96px; z-index: 9997; display: flex; align-items: center; gap: 10px; max-width: 270px;
  background: #fff; color: #1f2937; border-radius: 12px; box-shadow: 0 4px 16px rgba(0,0,0,.2); padding: 10px 6px 10px 12px; font-size: 14px; line-height: 1.4; }
.hu-chat-avatar { flex: none; display: block; width: 42px; height: 42px; border-radius: 50%; overflow: hidden; }
.hu-chat-avatar svg { display: block; }
.hu-chat-kopf-links { display: flex; align-items: center; gap: 10px; }
.hu-chat-kopf .hu-chat-avatar { width: 34px; height: 34px; box-shadow: 0 0 0 2px #fff; }
.hu-chat-blase-text { background: none; border: 0; padding: 0; margin: 0; text-align: left; color: inherit; font: inherit; text-transform: none; letter-spacing: normal; cursor: pointer; }
.hu-chat-blase-zu, .hu-chat-zu { background: none; border: 0; cursor: pointer; font-size: 20px; line-height: 1; padding: 0 4px; color: inherit; }

.hu-chat-fenster { position: fixed; right: 20px; bottom: 164px; z-index: 99990; width: 360px; max-width: calc(100vw - 24px);
  height: 680px; max-height: calc(100vh - 184px); display: flex; flex-direction: column; background: #fff; color: #1f2937;
  border-radius: 14px; box-shadow: 0 8px 30px rgba(0,0,0,.28); overflow: hidden; font-size: 15px; line-height: 1.45; }
.hu-chat-fenster[hidden] { display: none; }
.hu-chat-kopf { display: flex; align-items: center; justify-content: space-between; background: #5BAE22; color: #fff; padding: 12px 12px 12px 16px; font-weight: 700; }
.hu-chat-verlauf { flex: 1 1 auto; overflow-y: auto; padding: 12px; display: flex; flex-direction: column; gap: 8px; background: #f6f7f5; }
.hu-chat-msg { max-width: 85%; padding: 8px 12px; border-radius: 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
.hu-chat-user { align-self: flex-end; background: #5BAE22; color: #fff; border-bottom-right-radius: 4px; }
.hu-chat-assistant { align-self: flex-start; background: #fff; border: 1px solid #e3e6e1; border-bottom-left-radius: 4px; }
.hu-chat-hinweis { align-self: center; background: transparent; color: #4b5563; font-size: 13px; text-align: center; }
.hu-chat-msg a { color: inherit; text-decoration: underline; }
.hu-chat-tippt { letter-spacing: 2px; }
.hu-chat-form { display: flex; gap: 8px; padding: 10px; border-top: 1px solid #e3e6e1; }
.hu-chat-eingabe { flex: 1 1 auto; resize: none; border: 1px solid #cfd4cc; border-radius: 8px; padding: 8px; font: inherit; min-height: 44px; }
.hu-chat-senden { background: #5BAE22; color: #fff; border: 0; border-radius: 8px; padding: 0 14px; font-weight: 700; cursor: pointer; }
.hu-chat-senden:disabled { opacity: .6; cursor: default; }
.hu-chat-klein { margin: 0; padding: 0 12px 10px; font-size: 12px; color: #6b7280; }
.hu-chat-klein a { color: #3f7d16; }

/* Handy: Fenster fast bildschirmfüllend, Knopf bleibt über dem Barrierefreiheits-Knopf */
@media (max-width: 480px) {
  .hu-chat-knopf { right: 14px; bottom: 88px; width: 52px; height: 52px; }
  .hu-chat-blase { right: 14px; bottom: 88px; max-width: calc(100vw - 28px); }
  .hu-chat-fenster { left: 8px; right: 8px; bottom: 8px; width: auto; max-width: none; height: auto; max-height: calc(100vh - 16px); max-height: calc(100dvh - 16px); top: 8px; }
  .hu-chat-klein { padding-right: 64px; }   /* rechts frei für den Barrierefreiheits-Knopf */
}
