/* Chat-Widget — folgt dem Card-Designsystem der Sammlung Blaser */

.chat-widget{
  position: fixed;
  right: clamp(16px, 3vw, 28px);
  bottom: clamp(16px, 3vw, 28px);
  z-index: 50;
  font-family: var(--ff-body, 'Cormorant Garamond', Georgia, serif);
  color: var(--text, #E8DFCC);
}

/* Floating bubble */
.chat-widget__bubble{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: linear-gradient(180deg, var(--surface, #132A1F), var(--bg-2, #0F2218));
  border: 1px solid var(--gold, #C9A961);
  color: var(--gold, #C9A961);
  cursor: pointer;
  position: relative;
  transition: transform .3s ease, color .3s ease, border-color .3s ease;
  box-shadow: 0 18px 40px -22px rgba(0,0,0,.7), inset 0 1px 0 rgba(201,169,97,.12);
}
.chat-widget__bubble::before{
  content: "";
  position: absolute;
  inset: 5px;
  border: 1px solid rgba(201,169,97,.18);
  border-radius: 50%;
  pointer-events: none;
}
.chat-widget__bubble:hover{
  color: var(--gold-bright, #E5C76E);
  transform: translateY(-2px);
}
.chat-widget__bubble svg{ width: 22px; height: 22px; }

.chat-widget--open .chat-widget__bubble{ display: none; }

/* Panel */
.chat-widget__panel{
  display: none;
  flex-direction: column;
  width: min(380px, calc(100vw - 32px));
  height: min(560px, calc(100vh - 96px));
  background: linear-gradient(180deg, var(--surface, #132A1F), var(--bg-2, #0F2218));
  border: 1px solid var(--gold, #C9A961);
  position: relative;
  box-shadow: 0 30px 80px -30px rgba(0,0,0,.75);
}
.chat-widget__panel::before{
  content: "";
  position: absolute;
  inset: 6px;
  border: 1px solid rgba(201,169,97,.18);
  pointer-events: none;
}
.chat-widget--open .chat-widget__panel{ display: flex; }

/* Header */
.chat-widget__header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--line, rgba(201,169,97,.22));
  font-family: var(--ff-display, 'Cinzel', serif);
  font-size: 12px;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--gold, #C9A961);
}
.chat-widget__header-title{ display: inline-flex; align-items: center; gap: 10px; }
.chat-widget__header-rule{ width: 28px; height: 1px; background: var(--gold, #C9A961); }
.chat-widget__close{
  background: transparent;
  border: none;
  color: var(--gold, #C9A961);
  cursor: pointer;
  padding: 4px;
  display: inline-flex;
  transition: color .3s ease;
}
.chat-widget__close:hover{ color: var(--gold-bright, #E5C76E); }
.chat-widget__close svg{ width: 16px; height: 16px; }

/* Messages */
.chat-widget__messages{
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  scrollbar-width: thin;
  scrollbar-color: var(--gold-dim, #8B7340) transparent;
}
.chat-widget__messages::-webkit-scrollbar{ width: 6px; }
.chat-widget__messages::-webkit-scrollbar-thumb{
  background: var(--gold-dim, #8B7340);
  border-radius: 3px;
}
.chat-widget__messages::-webkit-scrollbar-track{ background: transparent; }

.chat-widget__msg{
  font-size: 16px;
  line-height: 1.55;
  max-width: 90%;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.chat-widget__msg--bot{
  align-self: flex-start;
  padding: 6px 4px 6px 14px;
  border-left: 2px solid var(--gold, #C9A961);
  color: var(--text, #E8DFCC);
}
.chat-widget__msg--user{
  align-self: flex-end;
  padding: 10px 14px;
  background: var(--surface-2, #17301F);
  border: 1px solid var(--line, rgba(201,169,97,.22));
  color: var(--cream, #F3EBDC);
}
.chat-widget__msg--error{
  align-self: stretch;
  text-align: center;
  font-style: italic;
  font-size: 14px;
  color: var(--gold-bright, #E5C76E);
  border-left: none;
  padding: 6px 0;
}

.chat-widget__typing{
  align-self: flex-start;
  display: inline-flex;
  gap: 5px;
  padding: 8px 14px 8px 14px;
  border-left: 2px solid var(--gold, #C9A961);
}
.chat-widget__typing span{
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold, #C9A961);
  opacity: .4;
  animation: chat-widget-pulse 1.2s infinite;
}
.chat-widget__typing span:nth-child(2){ animation-delay: .15s; }
.chat-widget__typing span:nth-child(3){ animation-delay: .3s; }
@keyframes chat-widget-pulse{
  0%,80%,100%{ opacity: .25; transform: translateY(0); }
  40%{ opacity: 1; transform: translateY(-3px); }
}

/* Input */
.chat-widget__form{
  display: flex;
  gap: 10px;
  align-items: flex-end;
  padding: 14px 16px 16px;
  border-top: 1px solid var(--line, rgba(201,169,97,.22));
}
.chat-widget__input{
  flex: 1 1 auto;
  background: transparent;
  border: 1px solid var(--line, rgba(201,169,97,.22));
  color: var(--cream, #F3EBDC);
  font-family: var(--ff-body, 'Cormorant Garamond', Georgia, serif);
  font-size: 16px;
  line-height: 1.45;
  padding: 10px 12px;
  resize: none;
  outline: none;
  max-height: 120px;
  transition: border-color .3s ease;
}
.chat-widget__input:focus{ border-color: var(--gold, #C9A961); }

.chat-widget__send{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  background: transparent;
  border: 1px solid var(--gold, #C9A961);
  color: var(--gold, #C9A961);
  cursor: pointer;
  transition: color .3s ease, background .3s ease;
  flex-shrink: 0;
}
.chat-widget__send:hover:not(:disabled){
  background: var(--gold, #C9A961);
  color: var(--bg, #0A1812);
}
.chat-widget__send:disabled{ opacity: .4; cursor: not-allowed; }
.chat-widget__send svg{ width: 16px; height: 16px; }

@media (prefers-reduced-motion: reduce){
  .chat-widget__bubble{ transition: none; }
  .chat-widget__typing span{ animation: none; opacity: .6; }
}
