/* Agent-Zwischenschritte ("Details / Calling RAG...") ausblenden */
details.step-messages {
  display: none !important;
}

/* Container als Flex-Spalte — Inhalt wächst nach oben, Kreis bleibt unten */
.chat-container {
  display: flex !important;
  flex-direction: column;
  align-items: flex-end;
  width: auto !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  overflow: visible !important;
}

.chat-container.bottom-left {
  align-items: flex-start;
}

/* Im collapsed-Zustand nur so breit wie der Kreis */
.chat-container.chat-collapsed {
  width: 56px !important;
}

/* Toggle Button — runder Kreis, immer sichtbar */
.chat-container .ai-deepchat--header {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  padding: 0;
  cursor: pointer;
  border: none;
  border-radius: 50%;
  background: var(--color-primary, #333);
  color: #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  transition: transform 0.2s ease;
  /* Überschreibt sticky-chatbot.css Balken-Styles */
  border-top: none;
  border-bottom: none;
  border-left: none;
  border-right: none;
  border-radius: 50%;
}

.chat-container .ai-deepchat--header:hover,
.chat-container .ai-deepchat--header:active,
.chat-container .ai-deepchat--header.active {
  transform: none;
  background-color: var(--color-primary, #333) !important;
  background: var(--color-primary, #333) !important;
}

.chat-container .ai-deepchat--header:focus {
  outline: none;
}

/* Toggle-Icon verstecken */
.chat-container .ai-deepchat--header .toggle-icon {
  display: none;
}

/* Bot-Icon sichtbar, X versteckt — collapsed */
.chat-container .ai-deepchat--icon-bot { display: flex; }
.chat-container .ai-deepchat--icon-close { display: none; }

/* X sichtbar, Bot versteckt — open */
.chat-container.chat-open .ai-deepchat--icon-bot { display: none; }
.chat-container.chat-open .ai-deepchat--icon-close { display: flex; }

/* Chat collapsed — nur Kreis sichtbar */
.chat-container.chat-collapsed {
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  margin-bottom: 20px;
  transform: none !important;
}

.chat-container.chat-collapsed .ai-deepchat--chat-header,
.chat-container.chat-collapsed .chat-element {
  display: none;
}

/* Chat open — vollständiges Fenster */
.chat-container.chat-open {
  background-color: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  transform: none !important;
}

.chat-container.chat-open .chat-element {
  background-color: #fff;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.chat-container.chat-open .ai-deepchat--chat-header {
  display: flex;
}

.chat-container.chat-open .chat-element {
  display: block;
}

/* Chat Header (Label + Dropdown) */
.ai-deepchat--chat-header {
  align-items: center;
  width: 100%;
  padding: 10px 15px;
  background: var(--color-primary, #333);
  color: #fff;
  font-weight: bold;
  box-sizing: border-box;
}

.ai-deepchat--chat-header .ai-deepchat--label {
  flex: 1;
  padding: 0 4px;
}

.ai-deepchat--chat-header .chat-dropdown {
  position: relative;
  display: inline-block;
}

.ai-deepchat--chat-header .chat-dropdown-button {
  display: inline-flex;
  align-items: center;
  padding: 0.5rem;
  cursor: pointer;
  color: #fff;
  border: none;
  border-radius: 0.375rem;
  background-color: transparent;
}