.ded-ai { padding: 14px; border: 1px solid color-mix(in srgb, var(--ded-primary) 13%, transparent); border-radius: 18px; background: linear-gradient(145deg, color-mix(in srgb, var(--ded-accent) 25%, #fff), color-mix(in srgb, var(--ded-surface) 88%, #fff)); }
.ded-ai-heading { display: grid; grid-template-columns: 38px minmax(0, 1fr) 8px; gap: 10px; align-items: center; }
.ded-ai-avatar { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; color: #fff; background: var(--ded-primary); box-shadow: 0 8px 18px color-mix(in srgb, var(--ded-primary) 22%, transparent); }
.ded-ai-avatar svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.6; }
.ded-ai-heading h3 { margin: 0; color: var(--ded-primary); font: inherit; font-size: 14px; font-weight: 820; line-height: 1.2; }
.ded-ai-heading p { margin: 3px 0 0; color: color-mix(in srgb, var(--ded-text) 64%, #fff); font-size: 10.5px; line-height: 1.3; }
.ded-ai-status { width: 8px; height: 8px; border-radius: 50%; background: #31a879; box-shadow: 0 0 0 4px rgba(49,168,121,.13); }
.ded-ai-messages { display: flex; flex-direction: column; gap: 7px; max-height: 210px; margin-top: 12px; padding-right: 3px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--ded-primary) 45%, transparent) transparent; }
.ded-ai-messages::-webkit-scrollbar { width: 4px; height: 4px; }
.ded-ai-messages::-webkit-scrollbar-track { background: transparent; }
.ded-ai-messages::-webkit-scrollbar-thumb { border-radius: 999px; background: color-mix(in srgb, var(--ded-primary) 45%, transparent); }
.ded-ai-messages::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--ded-primary) 70%, transparent); }
.ded-ai-message { align-self: flex-start; max-width: 88%; padding: 9px 11px; border-radius: 12px 12px 12px 4px; color: var(--ded-text); background: #fff; box-shadow: 0 4px 12px rgba(18,47,45,.07); font-size: 12px; line-height: 1.42; white-space: pre-wrap; overflow-wrap: anywhere; }
.ded-ai-message.is-user { align-self: flex-end; border-radius: 12px 12px 4px 12px; color: #fff; background: var(--ded-primary); }
.ded-ai-message.is-thinking { color: color-mix(in srgb, var(--ded-text) 62%, #fff); font-style: italic; }
.ded-ai-topics { display: flex; gap: 6px; margin-top: 10px; padding-bottom: 2px; overflow-x: auto; scrollbar-width: none; }
.ded-ai-topics::-webkit-scrollbar { display: none; }
.ded-ai-topic { appearance: none; flex: 0 0 auto; min-height: 34px; margin: 0; padding: 0 11px; border: 1px solid color-mix(in srgb, var(--ded-primary) 16%, transparent); border-radius: 999px; color: var(--ded-primary); background: #fff; cursor: pointer; font: inherit; font-size: 10.5px; font-weight: 760; white-space: nowrap; }
.ded-ai-topic:hover { color: #fff; background: var(--ded-primary); }
.ded-ai-topic:focus-visible { outline: 3px solid color-mix(in srgb, var(--ded-primary) 18%, transparent); outline-offset: 2px; }
@media (min-width: 641px) and (hover: hover) and (pointer: fine) {
  .ded-ai-topics { cursor: grab; user-select: none; }
  .ded-ai-topics.is-dragging { cursor: grabbing; scroll-behavior: auto; }
  .ded-ai-topics.is-dragging .ded-ai-topic { pointer-events: none; }
}
.ded-ai-form { display: grid; grid-template-columns: minmax(0, 1fr) 42px; gap: 7px; align-items: end; margin-top: 10px; padding: 5px; border: 1px solid color-mix(in srgb, var(--ded-primary) 16%, transparent); border-radius: 14px; background: #fff; transition: border-color .18s ease, box-shadow .18s ease; }
.ded-ai-form:focus-within { border-color: var(--ded-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ded-primary) 11%, transparent); }
.ded-ai-form textarea { display: block; width: 100%; min-height: 38px; max-height: 100px; margin: 0; padding: 9px 8px; resize: none; overflow-y: auto; border: 0; outline: 0; color: var(--ded-text); background: transparent; box-shadow: none; font: inherit; font-size: 12px; line-height: 1.4; }
.ded-ai-form button { appearance: none; display: grid; place-items: center; width: 42px; height: 42px; margin: 0; padding: 0; border: 0; border-radius: 11px; color: #fff; background: var(--ded-primary); cursor: pointer; }
.ded-ai-form button:disabled { cursor: wait; opacity: .55; }
.ded-ai-form button:focus-visible { outline: 3px solid color-mix(in srgb, var(--ded-primary) 20%, transparent); outline-offset: 2px; }
.ded-ai-form button svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.ded-ai-disclaimer { margin: 8px 2px 0; color: color-mix(in srgb, var(--ded-text) 55%, #fff); font-size: 9px; line-height: 1.35; }
.ded-contact-dialog[dir="rtl"] .ded-ai-message { border-radius: 12px 12px 4px 12px; }
.ded-contact-dialog[dir="rtl"] .ded-ai-message.is-user { border-radius: 12px 12px 12px 4px; }
@media (max-width: 640px) {
  .ded-ai { padding: 11px; border-radius: 16px; }
  .ded-ai-messages { max-height: min(190px, 25dvh); scrollbar-width: none; -ms-overflow-style: none; }
  .ded-ai-messages::-webkit-scrollbar { display: none; width: 0; height: 0; }
  .ded-ai-message { max-width: 92%; padding: 8px 10px; font-size: 11.5px; }
  .ded-ai-heading p { display: none; }
  .ded-ai-topic { min-height: 32px; }
}

/* Keep the assistant flat, compact and isolated from theme button styles. */
.ded-contact-dialog .ded-ai {
  border: 0 !important;
  outline: 0 !important;
  background: color-mix(in srgb, var(--ded-accent) 16%, var(--ded-surface)) !important;
  background-image: none !important;
  box-shadow: none !important;
}
.ded-contact-dialog .ded-ai-heading h3,
.ded-contact-dialog .ded-ai-heading p {
  border: 0 !important;
  outline: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
.ded-contact-dialog button.ded-ai-topic {
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 1px solid color-mix(in srgb, var(--ded-primary) 18%, transparent) !important;
  border-radius: 999px !important;
  color: var(--ded-primary) !important;
  background: color-mix(in srgb, var(--ded-surface) 82%, #fff) !important;
  background-image: none !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 10.5px !important;
  font-weight: 760 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  text-transform: none !important;
}
.ded-contact-dialog button.ded-ai-topic::before,
.ded-contact-dialog button.ded-ai-topic::after { content: none !important; display: none !important; }
.ded-contact-dialog button.ded-ai-topic:hover { color: #fff !important; background: var(--ded-primary) !important; }
.ded-contact-dialog button.ded-ai-topic:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--ded-accent) 75%, #fff) !important;
  outline-offset: 2px !important;
}
.ded-contact-dialog .ded-ai-form {
  border: 1px solid color-mix(in srgb, var(--ded-primary) 15%, transparent) !important;
  outline: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}
.ded-contact-dialog .ded-ai-form:focus-within {
  border-color: var(--ded-primary) !important;
  outline: 0 !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ded-accent) 58%, transparent) !important;
}
.ded-contact-dialog .ded-ai-form textarea,
.ded-contact-dialog .ded-ai-form textarea:focus {
  border: 0 !important;
  outline: 0 !important;
  color: var(--ded-text) !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  font: inherit !important;
}
.ded-contact-dialog .ded-ai-form button {
  appearance: none !important;
  width: 42px !important;
  min-width: 42px !important;
  max-width: 42px !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 11px !important;
  color: #fff !important;
  background: var(--ded-primary) !important;
  background-image: none !important;
  box-shadow: none !important;
}
.ded-contact-dialog .ded-ai-form button::before,
.ded-contact-dialog .ded-ai-form button::after { content: none !important; display: none !important; }
.ded-contact-dialog .ded-ai-form button:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--ded-accent) 75%, #fff) !important;
  outline-offset: 2px !important;
}