/* ════════════════════════════════════════════════════════════════
   EducService AI chatbot — floating widget
   ═══════════════════════════════════════════════════════════════ */

#educChat { --ec-navy:#0d1b2a; --ec-navy2:#172a46; --ec-gold:#e2b14d; --ec-gold-l:#fbe79b;
            --ec-text:#1f2933; --ec-muted:#6b7785; --ec-bg:#fff; --ec-bub-bg:#f3f5f8;
            --ec-blue:#7cc1f2; --ec-shadow:0 16px 40px rgba(8,14,28,.18), 0 4px 12px rgba(8,14,28,.08); }

/* ─── floating action button ─── */
#educChat .ec-fab {
  position: fixed; right: 22px; bottom: 22px; z-index: 9998;
  width: 60px; height: 60px; border-radius: 50%; cursor: pointer;
  background: linear-gradient(135deg, var(--ec-navy2), var(--ec-navy));
  color: var(--ec-gold-l); border: 2px solid var(--ec-gold);
  box-shadow: var(--ec-shadow);
  transition: transform .2s, box-shadow .2s, opacity .2s, bottom .25s, width .2s, height .2s;
  display: flex; align-items: center; justify-content: center;
}
#educChat .ec-fab:hover { transform: translateY(-2px) scale(1.04); }
#educChat .ec-fab.hidden    { opacity: 0; transform: scale(.6); pointer-events: none; }
/* Mini-mode: уменьшается при скролле и не закрывает контент */
#educChat .ec-fab.mini      { width: 44px; height: 44px; opacity: .55; border-width: 1.5px; }
#educChat .ec-fab.mini:hover { opacity: 1; }
#educChat .ec-fab.mini svg  { width: 20px; height: 20px; }
/* Хидер: пользователь нажал «спрятать» — сворачиваем в маленькую полупрозрачную точку */
#educChat .ec-fab.tucked    { width: 32px; height: 32px; opacity: .35; border-width: 1px; }
#educChat .ec-fab.tucked:hover { opacity: 1; }
#educChat .ec-fab.tucked svg { width: 14px; height: 14px; }
#educChat .ec-fab.tucked .ec-fab-pulse { display: none; }
/* Когда на странице есть mobile sticky price-bar (.has-price-bar на body),
   поднимаем кнопку выше, чтобы не пересекались. */
body.has-price-bar #educChat .ec-fab { bottom: 86px; }
#educChat .ec-fab-pulse {
  position: absolute; inset: -6px; border: 2px solid var(--ec-gold);
  border-radius: 50%; opacity: 0; animation: ec-pulse 2.6s ease-out infinite;
}
@keyframes ec-pulse {
  0%   { opacity: .55; transform: scale(.85); }
  80%  { opacity: 0;   transform: scale(1.35); }
  100% { opacity: 0;   transform: scale(1.35); }
}

/* ─── panel ─── */
#educChat .ec-panel {
  position: fixed; right: 22px; bottom: 22px; z-index: 9999;
  width: 380px; max-width: calc(100vw - 28px); height: 560px; max-height: calc(100vh - 60px);
  background: var(--ec-bg); border-radius: 18px; box-shadow: var(--ec-shadow);
  display: flex; flex-direction: column; overflow: hidden;
  transform: translateY(20px) scale(.96); opacity: 0; pointer-events: none;
  transition: transform .26s cubic-bezier(.2,.7,.2,1), opacity .2s;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
}
#educChat .ec-panel.open { transform: translateY(0) scale(1); opacity: 1; pointer-events: auto; }

/* ─── header ─── */
#educChat .ec-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; background: linear-gradient(135deg, var(--ec-navy), var(--ec-navy2));
  color: #fff;
}
#educChat .ec-head-l { display: flex; align-items: center; gap: 10px; }
#educChat .ec-avatar {
  width: 38px; height: 38px; border-radius: 50%;
  background: rgba(251,231,155,.12); border: 1.5px solid var(--ec-gold);
  display: flex; align-items: center; justify-content: center;
}
#educChat .ec-title { font-weight: 700; font-size: 14.5px; line-height: 1.2; }
#educChat .ec-sub   { font-size: 11.5px; color: rgba(255,255,255,.7); margin-top: 2px;
                     display: flex; align-items: center; gap: 5px; }
#educChat .ec-dot   { width: 6px; height: 6px; border-radius: 50%; background: #4ade80;
                     box-shadow: 0 0 0 0 rgba(74,222,128,.7); animation: ec-blink 2s infinite; }
@keyframes ec-blink { 0%,100% { box-shadow: 0 0 0 0 rgba(74,222,128,.7); }
                      50%     { box-shadow: 0 0 0 5px rgba(74,222,128,0); } }
#educChat .ec-close {
  width: 28px; height: 28px; border-radius: 50%; border: none; cursor: pointer;
  background: rgba(255,255,255,.08); color: rgba(255,255,255,.85); font-size: 14px;
  display: flex; align-items: center; justify-content: center; transition: background .15s;
}
#educChat .ec-close:hover { background: rgba(255,255,255,.18); }

/* ─── body / messages ─── */
#educChat .ec-body {
  flex: 1; overflow-y: auto; padding: 16px 14px; display: flex; flex-direction: column; gap: 8px;
  background: linear-gradient(180deg, #fbfcfd 0%, #f4f6f9 100%);
}
#educChat .ec-msg { display: flex; max-width: 100%; }
#educChat .ec-msg-user { justify-content: flex-end; }
#educChat .ec-msg-assistant { justify-content: flex-start; }
#educChat .ec-bubble {
  padding: 9px 13px; border-radius: 14px; font-size: 13.5px; line-height: 1.5;
  max-width: 86%; word-wrap: break-word; box-shadow: 0 1px 2px rgba(8,14,28,.05);
}
#educChat .ec-msg-user .ec-bubble {
  background: linear-gradient(135deg, var(--ec-navy2), var(--ec-navy));
  color: #fff; border-bottom-right-radius: 4px;
}
#educChat .ec-msg-assistant .ec-bubble {
  background: var(--ec-bub-bg); color: var(--ec-text); border-bottom-left-radius: 4px;
}
#educChat .ec-bubble p { margin: 0 0 8px 0; }
#educChat .ec-bubble p:last-child { margin-bottom: 0; }
#educChat .ec-bubble ul { margin: 6px 0 6px 0; padding-left: 18px; }
#educChat .ec-bubble li { margin: 2px 0; }
#educChat .ec-bubble a { color: var(--ec-blue); text-decoration: underline; }
#educChat .ec-bubble strong { color: var(--ec-navy); }

/* typing indicator */
#educChat .ec-typing .ec-bubble {
  display: inline-flex; gap: 4px; padding: 12px 14px;
}
#educChat .ec-typing .ec-bubble span {
  width: 7px; height: 7px; border-radius: 50%; background: #b3bcc7;
  animation: ec-bounce 1.2s infinite ease-in-out;
}
#educChat .ec-typing .ec-bubble span:nth-child(2) { animation-delay: .15s; }
#educChat .ec-typing .ec-bubble span:nth-child(3) { animation-delay: .3s; }
@keyframes ec-bounce { 0%,80%,100% { transform: scale(.7); opacity: .5; }
                       40%        { transform: scale(1);  opacity: 1; } }

/* ─── quick replies ─── */
#educChat .ec-quick { padding: 8px 12px; display: flex; gap: 6px; flex-wrap: wrap; background: #fbfcfd; border-top: 1px solid #eef1f5; }
#educChat .ec-q {
  padding: 7px 12px; border-radius: 16px; border: 1px solid #d8dde5; background: #fff;
  color: var(--ec-navy); font-size: 12px; cursor: pointer; transition: all .15s;
}
#educChat .ec-q:hover { background: var(--ec-navy); color: #fff; border-color: var(--ec-navy); }

/* ─── form ─── */
#educChat .ec-form {
  display: flex; gap: 8px; padding: 11px 12px; background: #fff;
  border-top: 1px solid #eef1f5;
}
#educChat .ec-input {
  flex: 1; padding: 10px 12px; border: 1px solid #d8dde5; border-radius: 22px;
  font-size: 13.5px; outline: none; color: var(--ec-text);
  font-family: inherit; transition: border-color .15s, box-shadow .15s;
}
#educChat .ec-input:focus { border-color: var(--ec-navy); box-shadow: 0 0 0 3px rgba(13,27,42,.08); }
#educChat .ec-send {
  width: 40px; height: 40px; border-radius: 50%; border: none; cursor: pointer;
  background: linear-gradient(135deg, var(--ec-navy2), var(--ec-navy));
  color: var(--ec-gold-l); display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; transition: transform .15s;
}
#educChat .ec-send:hover { transform: scale(1.06); }

/* ─── mobile ─── */
@media (max-width: 480px) {
  #educChat .ec-fab { right: 14px; bottom: 14px; width: 50px; height: 50px; }
  #educChat .ec-fab svg { width: 22px; height: 22px; }
  #educChat .ec-fab.mini { width: 40px; height: 40px; }
  #educChat .ec-fab.tucked { width: 28px; height: 28px; }
  body.has-price-bar #educChat .ec-fab { bottom: 78px; }
  #educChat .ec-panel {
    right: 0; bottom: 0; width: 100vw; max-width: 100vw;
    height: 100dvh; max-height: 100dvh; border-radius: 0;
  }
  #educChat .ec-quick { display: none; }
}
