/* ==========================================================================
   Алёна — ИИ-консультант в правом нижнем углу.
   Токены и типографика — из styles.css, свои только размеры окна чата.
   ========================================================================== */

:root{
  --alena-w:380px;
  /* Отступ снизу растёт, пока висит баннер cookie: его высоту подставляет alena.js */
  --alena-bottom:24px;
  --alena-h:min(620px,calc(100vh - var(--alena-bottom) - 108px));
}

/* ---------- Кнопка ---------- */
.alena-launcher{
  position:fixed;
  right:24px;
  bottom:var(--alena-bottom);
  /* Ниже баннера cookie (60) и его окна настроек (70): согласие важнее чата */
  z-index:58;
  transition:bottom var(--ease);
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:13px 20px 13px 16px;
  border:0;
  border-radius:999px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff;
  font-family:var(--font);
  font-size:15px;
  font-weight:600;
  cursor:pointer;
  box-shadow:var(--shadow-cta);
}
.alena-launcher:hover{transform:translateY(-2px);box-shadow:var(--shadow-cta-hover);}
.alena-launcher:focus-visible{outline:2px solid #fff;outline-offset:3px;}
.alena-launcher[hidden]{display:none;}
/* Фото Алёны с зелёной точкой «на связи» */
.alena-launcher__face{position:relative;display:block;width:30px;height:30px;flex:none;}
.alena-launcher__face img{
  width:30px;height:30px;border-radius:50%;object-fit:cover;
  border:1.5px solid rgba(255,255,255,.5);display:block;
}
.alena-launcher__dot{
  position:absolute;right:-1px;bottom:-1px;
  width:9px;height:9px;border-radius:50%;
  background:#7CFFB2;
  border:2px solid var(--accent-2);
}

/* ---------- Окно ---------- */
.alena{
  position:fixed;
  right:24px;
  bottom:var(--alena-bottom);
  z-index:59;
  display:flex;
  flex-direction:column;
  width:var(--alena-w);
  height:var(--alena-h);
  border:1px solid var(--line-3);
  border-radius:20px;
  background:#0a0a12;
  box-shadow:0 24px 60px rgba(0,0,0,.6);
  overflow:hidden;
  font-family:var(--font);
}
.alena[hidden]{display:none;}

.alena__head{
  display:flex;
  align-items:center;
  gap:12px;
  padding:16px 16px 14px;
  border-bottom:1px solid var(--line);
  background:var(--accent-bg);
}
.alena__avatar{
  position:relative;
  width:38px;height:38px;flex:none;
}
.alena__avatar img{
  width:38px;height:38px;border-radius:50%;object-fit:cover;
  border:1px solid var(--accent-line);display:block;
}
.alena__online{
  position:absolute;right:0;bottom:0;
  width:10px;height:10px;border-radius:50%;
  background:#7CFFB2;
  border:2px solid #0a0a12;
}
.alena__who{display:flex;flex-direction:column;gap:2px;min-width:0;}
.alena__name{font-size:15px;font-weight:600;color:var(--heading);}
.alena__role{font-size:12px;color:var(--muted-3);}
.alena__close{
  margin-left:auto;
  width:32px;height:32px;
  border:0;border-radius:8px;
  background:transparent;color:var(--muted-2);
  font-size:20px;line-height:1;cursor:pointer;
  transition:background var(--ease),color var(--ease);
}
.alena__close:hover{background:var(--surface-3);color:var(--text);}

.alena__log{
  flex:1;
  overflow-y:auto;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:10px;
  scrollbar-width:thin;
}
.alena__msg{
  max-width:88%;
  padding:11px 14px;
  border-radius:14px;
  font-size:14.5px;
  line-height:1.55;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
.alena__msg--alena{
  align-self:flex-start;
  background:var(--surface-3);
  border:1px solid var(--line);
  color:var(--text);
  border-bottom-left-radius:5px;
}
.alena__msg--user{
  align-self:flex-end;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff;
  border-bottom-right-radius:5px;
}
.alena__msg a{color:var(--accent-soft);}
.alena__msg--note{
  align-self:center;
  max-width:100%;
  background:none;
  border:0;
  color:var(--dim);
  font-size:12.5px;
  text-align:center;
}

/* Три точки, пока Алёна думает */
.alena__typing{display:inline-flex;gap:4px;align-items:center;height:10px;}
.alena__typing span{
  width:6px;height:6px;border-radius:50%;
  background:var(--muted-3);
  animation:alena-blink 1.2s infinite;
}
.alena__typing span:nth-child(2){animation-delay:.2s;}
.alena__typing span:nth-child(3){animation-delay:.4s;}
@keyframes alena-blink{0%,60%,100%{opacity:.25;}30%{opacity:1;}}

/* ---------- Быстрые подсказки ---------- */
.alena__chips{display:flex;flex-wrap:wrap;gap:8px;padding:0 16px 12px;}
.alena__chip{
  padding:8px 12px;
  border:1px solid var(--accent-line);
  border-radius:999px;
  background:var(--accent-bg);
  color:var(--accent-soft);
  font-family:var(--font);
  font-size:13px;
  cursor:pointer;
  transition:background var(--ease),color var(--ease);
}
.alena__chip:hover{background:rgba(30,144,255,.14);color:#fff;}
/* «Другой вопрос» — не тема, а переход к свободному вводу, поэтому нейтральный */
.alena__chip--own{border-color:var(--line-3);background:var(--surface-3);color:var(--muted-2);}
.alena__chip--own:hover{background:var(--surface-3);color:#fff;}

/* ---------- Форма контактов ---------- */
.alena__lead{
  margin:2px 0 0;
  padding:14px;
  border:1px solid var(--accent-line);
  border-radius:14px;
  background:var(--accent-bg-2);
  display:flex;
  flex-direction:column;
  gap:9px;
}
.alena__lead-title{margin:0;font-size:14px;font-weight:600;color:var(--heading);}
.alena__input{
  width:100%;
  padding:11px 13px;
  border:1px solid var(--line-3);
  border-radius:10px;
  background:rgba(255,255,255,.04);
  color:var(--text);
  font-family:var(--font);
  font-size:14px;
}
.alena__input::placeholder{color:var(--ghost);}
.alena__input:focus{outline:none;border-color:var(--accent);}
.alena__consent{display:flex;gap:9px;font-size:12px;line-height:1.45;color:var(--muted-3);}
.alena__consent a{color:var(--accent-soft);}
.alena__consent input{margin-top:2px;flex:none;accent-color:var(--accent);}
.alena__send-lead{
  padding:11px 16px;
  border:0;border-radius:10px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff;font-family:var(--font);font-size:14px;font-weight:600;
  cursor:pointer;
}
.alena__send-lead:disabled{opacity:.6;cursor:default;}
.alena__error{margin:0;font-size:12.5px;color:#FF8A8A;}
.alena__hidden-field{position:absolute;left:-9999px;opacity:0;}

/* ---------- Ввод ---------- */
.alena__form{
  display:flex;
  gap:8px;
  padding:12px;
  border-top:1px solid var(--line);
  background:var(--surface);
}
.alena__field{
  flex:1;
  max-height:96px;
  padding:11px 13px;
  border:1px solid var(--line-3);
  border-radius:12px;
  background:rgba(255,255,255,.04);
  color:var(--text);
  font-family:var(--font);
  font-size:14.5px;
  line-height:1.4;
  resize:none;
}
.alena__field::placeholder{color:var(--ghost);}
.alena__field:focus{outline:none;border-color:var(--accent);}
.alena__submit{
  width:44px;flex:none;
  border:0;border-radius:12px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff;font-size:17px;cursor:pointer;
  transition:opacity var(--ease);
}
.alena__submit:disabled{opacity:.45;cursor:default;}
.alena__legal{
  margin:0;
  padding:0 14px 12px;
  font-size:11px;
  line-height:1.4;
  color:var(--dim);
  text-align:center;
}
.alena__legal a{color:var(--muted-3);}

/* ---------- Мобильные ---------- */
@media (max-width:560px){
  .alena{
    right:0;bottom:0;
    width:100%;
    height:100dvh;
    border-radius:0;
    border:0;
  }
  .alena-launcher{right:16px;padding:12px 18px 12px 14px;font-size:14px;}
}

@media (prefers-reduced-motion:reduce){
  .alena-launcher{transition:none;}
  .alena__typing span{animation:none;opacity:.6;}
}