/* ====== Базовый блок ассистента на странице ====== */
.iifin-assistant{max-width:760px;margin:0 auto;padding:16px;border-radius:12px;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.06)}
.iifin-assistant__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.iifin-assistant__title{font-weight:700;font-size:20px}
.iifin-assistant__plan{font-size:14px;color:#0369a1}
.iifin-assistant__hints{background:#f8fafc;border:1px solid #e5e7eb;border-radius:10px;padding:10px 12px;margin:10px 0 14px}
.iifin-assistant__chat{min-height:160px;max-height:520px;overflow:auto;border:1px solid #e5e7eb;border-radius:10px;padding:12px;background:#fafafa}
.iifin-assistant__form{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.iifin-assistant__input{flex:1;border:1px solid #e5e7eb;border-radius:10px;padding:10px 12px;min-height:44px}
.iifin-assistant__send{border:0;border-radius:10px;background:#0b7e95;color:#fff;padding:10px 14px;cursor:pointer}
.iifin-assistant__send:disabled{opacity:.5;cursor:not-allowed}
.iifin-assistant__upgrade{margin-top:12px;padding:10px 12px;background:#fff3cd;border:1px solid #facc15;border-radius:10px}
.hidden{display:none}

/* ====== Сообщения ====== */
.iifin-msg{display:flex;gap:8px;margin:8px 0}
.iifin-avatar{width:28px;height:28px;border-radius:50%}
.iifin-avatar.user{background:#0a5bd3}
.iifin-avatar.bot{background:#0b7e95}
.iifin-bubble{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:8px 10px;max-width:85%;white-space:pre-wrap}

/* typing indicator */
.iifin-msg.typing .iifin-bubble{display:flex;align-items:center}
.dots{display:inline-flex;gap:4px}
.dots span{display:block;width:6px;height:6px;border-radius:50%;background:#9ca3af;animation:bl 1.2s infinite}
.dots span:nth-child(2){animation-delay:.2s}
.dots span:nth-child(3){animation-delay:.4s}
@keyframes bl {0%,80%,100%{opacity:.2} 40%{opacity:1}}

/* ====== FAB (плавающая кнопка) ====== */
.iifin-assistant-fab{
  position:fixed; right:20px;
  bottom:calc(20px + var(--iifin-fab-lift, 0px) + env(safe-area-inset-bottom, 0px));
  z-index:2147483640; /* ниже модалки, выше контента */
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 14px; border-radius:999px; border:none;
  background:#0b7e95; color:#fff; font-weight:600; cursor:pointer;
  box-shadow:0 8px 24px rgba(0,0,0,.18);
}
.iifin-assistant-fab:hover{ filter:brightness(1.05); }
.iifin-fab-icon{ font-size:18px; line-height:1; }
@media (max-width:767px){
  .iifin-assistant-fab{ padding:12px; }
  .iifin-fab-label{ display:none; } /* на мобиле только иконка */
}
/* при конфликте с фикс-навигацией можно просто добавить к body класс .iifin-fab--lift */
.iifin-fab--lift .iifin-assistant-fab{ --iifin-fab-lift:72px; }

/* ====== Модалка: всегда поверх всего ====== */
.iifin-assistant-modal{ position:fixed; inset:0; z-index:2147483646; display:none; }
.iifin-assistant-modal.open{ display:block; }

/* затемняющий фон */
.iifin-assistant-overlay{
  position:fixed; inset:0;
  background:rgba(17,24,39,.45);
  backdrop-filter: blur(1.5px);
}

/* окно */
.iifin-assistant-dialog{
  position:fixed; right:24px; bottom:24px;
  width:min(640px, calc(100% - 32px));
  max-height:min(80vh, 88dvh);
  background:#fff; border-radius:14px; overflow:hidden;
  display:flex; flex-direction:column;
  box-shadow:0 20px 60px rgba(0,0,0,.25);
  z-index:2147483647; /* выше фона и FAB */
}

/* планшет/мобилка — прижимаем к краям и даём высоту */
@media (max-width:1023px){
  .iifin-assistant-dialog{
    left:12px; right:12px; bottom:12px;
    width:auto; max-height:calc(100dvh - 24px);
    border-radius:16px 16px 12px 12px;
  }
}

/* полноэкранный режим */
.iifin-assistant-dialog.fullscreen{
  inset:max(env(safe-area-inset-top,0px),12px)
       max(env(safe-area-inset-right,0px),12px)
       max(env(safe-area-inset-bottom,0px),12px)
       max(env(safe-area-inset-left,0px),12px);
  width:auto; height:auto; max-height:none; border-radius:12px;
}

.iifin-assistant-head{
  display:flex; align-items:center; gap:12px;
  padding:12px 16px; background:#f7f7f7; border-bottom:1px solid #ececec;
}
.iifin-assistant-title{ font-weight:700; }
.iifin-assistant-plan{ margin-left:auto; color:#0b7e95; font-weight:600; }
.iifin-assistant-close,
.iifin-assistant-expand{
  background:transparent; border:none; font-size:20px; line-height:1;
  cursor:pointer; color:#555; margin-left:6px;
}

/* ====== Чат внутри модалки ====== */
.iifin-chat{ display:flex; flex-direction:column; padding:12px; gap:10px; }
.iifin-chat-log{
  flex:1 1 auto; overflow:auto;
  background:#fafafa; border:1px solid #eee; border-radius:12px; padding:10px;
  max-height:60vh; -webkit-overflow-scrolling:touch;
}
.iifin-chat-form .iifin-chat-row{ display:flex; gap:8px; margin-top:8px; }
.iifin-chat-form input[type="text"]{ flex:1; padding:10px 12px; border:1px solid #ddd; border-radius:10px; min-height:44px; }
.iifin-chat-actions{ display:flex; gap:8px; margin-top:6px; flex-wrap:wrap; }
.iifin-disclaimer{ margin-top:8px; font-size:12px; color:#6b7280; }

/* пузырьки в модалке */
.iifin-msg{ display:flex; gap:8px; margin:8px 0; }
.iifin-avatar{ width:28px; height:28px; border-radius:50%; background:#d5eef2; }
.iifin-avatar.user{ background:#cfe5cf; }
.iifin-bubble{ background:#fff; border:1px solid #eee; border-radius:10px; padding:8px 10px; max-width:95%; }
.iifin-msg--user .iifin-bubble{ background:#e7f6e7; }
.iifin-msg.typing .dots{ display:inline-flex; gap:4px; }
.iifin-msg.typing .dots span{ display:inline-block; width:6px; height:6px; border-radius:50%; background:#999; animation:iifin-blink 1.2s infinite ease-in-out; }
.iifin-msg.typing .dots span:nth-child(2){ animation-delay:.15s; }
.iifin-msg.typing .dots span:nth-child(3){ animation-delay:.3s; }
@keyframes iifin-blink{ 0%,80%,100%{opacity:.2;transform:translateY(0)} 40%{opacity:1;transform:translateY(-2px)} }

/* ====== Сворачиваемые подсказки (чтобы не занимали экран на мобиле) ====== */
.iifin-tips{ border:1px solid #e6eef0; border-radius:12px; padding:8px 12px; background:#f9fcfd; margin:10px 0; }
.iifin-tips > summary{ cursor:pointer; font-weight:700; color:#0b7e95; margin-bottom:6px; }
.iifin-tips[open] > summary{ margin-bottom:8px; }

/* Мобильные правки: больше места под историю, перенос кнопок */
@media (max-width:767px){
  .iifin-chat-log{
    max-height: calc(100dvh - 260px - env(safe-area-inset-bottom, 0px));
  }
  .iifin-chat-form .iifin-chat-row{ flex-wrap:wrap; }
  .iifin-chat-actions{ flex-wrap:wrap; gap:6px; }
  #iifin-send-profile{ flex:1 1 100%; }
  .iifin-tips[open]{ max-height:40vh; overflow:auto; }
}
/* Больше «воздуха» у нижних кнопок модалки */
.iifin-chat-actions{
  padding: 0 12px 12px;
  justify-content: flex-end;
}

/* На узких экранах — две колонки */
@media (max-width: 767px){
  .iifin-chat-actions .iifin-button{
    flex: 1 1 48%;
    min-width: 44%;
  }
}

/* 1) Общая полировка отступов/типографики */
.iifin-assistant-dialog { border-radius: 16px; }
.iifin-chat { gap: 12px; }
.iifin-bubble { line-height: 1.45; }
@media (max-width: 767px){
  .iifin-bubble { font-size: 15px; }
}

/* 2) Кнопки и фокус */
.iifin-button, .iifin-assistant__send, .iifin-assistant-fab {
  outline: none;
}
.iifin-button:focus-visible,
.iifin-assistant__send:focus-visible,
.iifin-assistant-fab:focus-visible {
  box-shadow: 0 0 0 3px rgba(11,126,149,.25);
}
.iifin-button:hover, .iifin-assistant__send:hover { filter: brightness(1.03); }

/* 3) Липкая панель ввода и safe-area */
.iifin-chat form.iifin-chat-form {
  position: sticky;
  bottom: 0;
  background: #fff;
  padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));
  z-index: 2;
  border-top: 1px solid #eee;
}
@supports (padding: max(0px)) {
  .iifin-chat form.iifin-chat-form {
    padding-bottom: max(8px, env(safe-area-inset-bottom, 0px));
  }
}
.iifin-chat-row input[type="text"] {
  min-height: 44px;
}

/* 4) Плавное раскрытие подсказок */
.iifin-tips {
  overflow: hidden;
  transition: max-height .25s ease;
}
.iifin-tips:not([open]) { max-height: 2.25rem; } /* виден только summary */
.iifin-tips[open]       { max-height: 40vh; }

/* 5) Мягкое поднятие FAB при появлении нижней панели */
.iifin-assistant-fab {
  transition: bottom .25s ease, filter .15s ease;
}

/* 6) Аккуратные полосы прокрутки (необязательно) */
.iifin-chat-log::-webkit-scrollbar { width: 10px; }
.iifin-chat-log::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,.12); border-radius: 10px;
}

/* Страница /assistant/ — мобильная раскладка формы */
@media (max-width: 767px){
  .iifin-assistant__form{
    flex-wrap: wrap;
    row-gap: 10px;
  }
  .iifin-assistant__form .iifin-assistant__input{
    flex: 1 1 100%;
    min-height: 48px;
  }
  .iifin-assistant__form .iifin-assistant__send{
    flex: 0 0 44%;
    min-height: 48px;
  }
  /* кнопка "Отправить мои данные", которую JS добавляет в строку действий */
  .iifin-chat-actions #iifin-send-profile{
    flex: 1 1 100%;
    min-height: 48px;
  }
  /* Чуть больше воздуха снизу, чтобы кнопки не «липли» к краю экрана */
  .iifin-assistant{ padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px)); }
}

