/* dk-ai-chat.css v1.1 — волшебные искры на кнопке-зубе + кнопка «Начать новый чат» в шапке; остальное из v1.0 (фирменные тона, пузыри, печать, мобильная версия) */

/* ── Плавающая кнопка ── */
#dk-ai-launcher {
  position: fixed; right: 22px; bottom: 22px; z-index: 99998;
  width: 60px; height: 60px; border-radius: 50%;
  background: linear-gradient(135deg, #E3B65A 0%, #C79434 55%, #A87A2A 100%);
  border: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 22px rgba(38, 32, 25, .28);
  transition: transform .2s ease, box-shadow .2s ease;
}
#dk-ai-launcher:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(38, 32, 25, .34); }

/* волшебные искры вокруг зуба */
#dk-ai-launcher::before,
#dk-ai-launcher::after {
  content: '\2726';
  position: absolute; color: #ffffff; pointer-events: none;
  text-shadow: 0 0 6px rgba(255, 240, 200, .95);
  animation: dk-ai-spark 2.6s infinite ease-in-out;
}
#dk-ai-launcher::before { top: 6px; right: 9px; font-size: 11px; }
#dk-ai-launcher::after { bottom: 9px; left: 8px; font-size: 8px; animation-delay: 1.3s; }
#dk-ai-launcher .dk-ai-launcher-tooth::after {
  content: '\2727';
  position: absolute; top: 12px; left: 13px; font-size: 7px; color: #fff7e6;
  pointer-events: none; animation: dk-ai-spark 2.6s infinite ease-in-out .7s;
}
#dk-ai-launcher.dk-ai-open::before,
#dk-ai-launcher.dk-ai-open::after { display: none; }
@keyframes dk-ai-spark {
  0%, 100% { opacity: 0; transform: scale(.5) rotate(0deg); }
  50% { opacity: 1; transform: scale(1.15) rotate(18deg); }
}
#dk-ai-launcher svg { width: 32px; height: 32px; display: block; }
#dk-ai-launcher .dk-ai-launcher-close { display: none; color: #fff; font-size: 26px; line-height: 1; }
#dk-ai-launcher.dk-ai-open .dk-ai-launcher-tooth { display: none; }
#dk-ai-launcher.dk-ai-open .dk-ai-launcher-close { display: block; }

/* ── Окно чата ── */
#dk-ai-window {
  position: fixed; right: 22px; bottom: 94px; z-index: 99999;
  width: 372px; max-width: calc(100vw - 44px);
  height: min(600px, calc(100vh - 130px));
  display: flex; flex-direction: column; overflow: hidden;
  background: #f7f2e9; border-radius: 18px;
  box-shadow: 0 18px 48px rgba(38, 32, 25, .30);
  opacity: 0; transform: translateY(14px); pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
}
#dk-ai-window.dk-ai-open { opacity: 1; transform: translateY(0); pointer-events: auto; }

/* ── Шапка ── */
.dk-ai-header {
  background: #262019; color: #fff;
  padding: 14px 16px; display: flex; align-items: center; gap: 11px;
  border-bottom: 3px solid #C79434;
}
.dk-ai-header svg { width: 30px; height: 30px; flex: 0 0 auto; }
.dk-ai-title { font-size: 15px; font-weight: 600; letter-spacing: .02em; line-height: 1.25; }
.dk-ai-status { font-size: 11.5px; color: #cdbfa5; display: flex; align-items: center; gap: 5px; }
.dk-ai-status::before {
  content: ''; width: 7px; height: 7px; border-radius: 50%;
  background: #3fae6a; box-shadow: 0 0 6px rgba(63, 174, 106, .8);
}
.dk-ai-reset {
  margin-left: auto; background: none; border: none; cursor: pointer;
  color: #cdbfa5; font-size: 17px; line-height: 1; padding: 2px 6px;
  transition: color .2s ease;
}
.dk-ai-reset:hover { color: #E3B65A; }
.dk-ai-close {
  background: none; border: none; cursor: pointer;
  color: #cdbfa5; font-size: 22px; line-height: 1; padding: 2px 4px;
  transition: color .2s ease;
}
.dk-ai-close:hover { color: #fff; }

/* ── Лента сообщений ── */
.dk-ai-messages {
  flex: 1 1 auto; overflow-y: auto; padding: 14px 12px 8px;
  display: flex; flex-direction: column; gap: 9px;
  scrollbar-width: thin; scrollbar-color: #d9c9a8 transparent;
}
.dk-ai-messages::-webkit-scrollbar { width: 5px; }
.dk-ai-messages::-webkit-scrollbar-thumb { background: #d9c9a8; border-radius: 3px; }

.dk-ai-msg {
  max-width: 84%; padding: 9px 13px; border-radius: 14px;
  font-size: 14px; line-height: 1.45; white-space: pre-wrap; word-wrap: break-word;
}
.dk-ai-msg-bot {
  align-self: flex-start; background: #ffffff; color: #262019;
  border: 1px solid #e3d3ae; border-bottom-left-radius: 5px;
}
.dk-ai-msg-user {
  align-self: flex-end; background: #262019; color: #f7f2e9;
  border-bottom-right-radius: 5px;
}

/* ── Индикатор «печатает…» ── */
.dk-ai-typing { display: flex; gap: 5px; align-items: center; padding: 12px 14px; }
.dk-ai-typing span {
  width: 7px; height: 7px; border-radius: 50%; background: #C79434;
  animation: dk-ai-blink 1.2s infinite ease-in-out;
}
.dk-ai-typing span:nth-child(2) { animation-delay: .18s; }
.dk-ai-typing span:nth-child(3) { animation-delay: .36s; }
@keyframes dk-ai-blink { 0%, 80%, 100% { opacity: .25; } 40% { opacity: 1; } }

/* ── Дисклеймер ── */
.dk-ai-note {
  padding: 0 14px 7px; font-size: 10.5px; line-height: 1.35; color: #9b8a6c; text-align: center;
}

/* ── Поле ввода ── */
.dk-ai-inputrow {
  display: flex; gap: 8px; align-items: center;
  padding: 10px 12px; background: #ffffff; border-top: 1px solid #e7dcc3;
}
.dk-ai-input {
  flex: 1 1 auto; border: none; outline: none; background: transparent;
  font-size: 14px; color: #262019; padding: 8px 2px;
  border-bottom: 1px solid #d9c9a8; transition: border-color .2s ease;
}
.dk-ai-input:focus { border-bottom-color: #C79434; }
.dk-ai-input::placeholder { color: #b8a888; }
.dk-ai-send {
  flex: 0 0 auto; width: 38px; height: 38px; border-radius: 50%;
  border: none; cursor: pointer; background: #262019; color: #E3B65A;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; transition: background .22s ease;
}
.dk-ai-send:hover { background: #008080; color: #fff; }
.dk-ai-send:disabled { opacity: .45; cursor: default; }

/* ── Мобильная версия ── */
@media (max-width: 480px) {
  #dk-ai-window {
    right: 10px; left: 10px; bottom: 88px;
    width: auto; max-width: none; height: min(70vh, 560px);
  }
  #dk-ai-launcher { right: 16px; bottom: 16px; }
}

/* ── Уважение к reduced-motion ── */
@media (prefers-reduced-motion: reduce) {
  #dk-ai-launcher, #dk-ai-window, .dk-ai-send, .dk-ai-close { transition: none; }
  .dk-ai-typing span { animation: none; opacity: .7; }
  #dk-ai-launcher::before, #dk-ai-launcher::after,
  #dk-ai-launcher .dk-ai-launcher-tooth::after { animation: none; opacity: .8; }
}
