/* Охра CRM: Chatwoot в оформлении Home Art. Ядро Chatwoot не правим — стиль подмешивает nginx
   (sub_filter в chat.ohra-crm.conf), убирается одной строкой там же.
   Терракота вместо синего — в ohra-chatwoot-theme.css (собирается автоматически), здесь — всё остальное:
   тёплые нейтральные цвета, шрифт Manrope, лишние пункты меню.
   :not(#\#) даёт селектору вес идентификатора — так наши правила сильнее правил Chatwoot при любом порядке загрузки. */

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('/ohra-fonts/Manrope-normal-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('/ohra-fonts/Manrope-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Нейтральные цвета: бумага и чернила Home Art вместо холодного серого (тройки RGB, как у Chatwoot). */
:not(#\#):root {
  --slate-1: 253 251 247 !important;
  --slate-2: 248 243 234 !important; /* --ha-paper */
  --slate-3: 241 233 219 !important; /* --ha-paper-2 */
  --slate-4: 236 227 212 !important;
  --slate-5: 230 220 203 !important; /* --ha-line */
  --slate-6: 221 209 190 !important;
  --slate-7: 207 192 171 !important;
  --slate-8: 184 166 146 !important;
  --slate-9: 150 131 119 !important;
  --slate-10: 128 109 98 !important;
  --slate-11: 107 82 72 !important; /* --ha-ink-2 */
  --slate-12: 61 36 27 !important; /* --ha-ink */
  --gray-1: 253 251 247 !important;
  --gray-2: 248 243 234 !important;
  --gray-3: 241 233 219 !important;
  --gray-4: 236 227 212 !important;
  --gray-5: 230 220 203 !important;
  --gray-6: 221 209 190 !important;
  --gray-7: 207 192 171 !important;
  --gray-8: 184 166 146 !important;
  --gray-9: 150 131 119 !important;
  --gray-10: 128 109 98 !important;
  --gray-11: 107 82 72 !important;
  --gray-12: 61 36 27 !important;
  --background-color: 248 243 234 !important;
  --surface-1: 251 248 242 !important;
  --surface-2: 255 255 255 !important;
  --border-container: 233 224 208 !important;
  --border-strong: 222 210 190 !important;
  --border-weak: 236 228 214 !important;
  --label-background: 245 239 229 !important;
}

/* Шрифт Manrope везде, кроме кода. */
body:not(#\#),
body:not(#\#) :not(code, pre, kbd, samp) {
  font-family: 'Manrope', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif !important;
}

/* Меню: то, чем школа не пользуется (Капитан, звонки, компании, кампании, справочный центр).
   Пункты ищем по адресам ссылок и значкам — они стабильнее названий и не зависят от языка. */
li:has(a[href*="/captain/"]),
li:has(a[href$="/calls"]),
li:has(a[href*="/calls?"]),
li:has(a[href*="/companies"]),
li:has(a[href*="/campaigns"]),
li:has(a[href*="/portals"]),
/* платные функции Chatwoot (в бесплатной версии не работают) и шаблоны WhatsApp — только сам пункт (> a),
   иначе :has зацепит и раздел «Настройки»/«Отчёты», внутри которого лежит ссылка */
li:has(> a[href*="/settings/sla"]),
li:has(> a[href*="/reports/sla"]),
li:has(> a[href*="/settings/audit-logs"]),
li:has(> a[href*="/settings/custom-roles"]),
li:has(> a[href*="/settings/security"]),
li:has(> a[href$="/settings/templates"]),
/* меню профиля: документация и журнал изменений Chatwoot, выбор темы (оформление одно — Home Art).
   Прячем обёртку пункта целиком — иначе в меню остаётся пустой промежуток. */
div:has(> li.n-dropdown-item a[href*="chatwoot.com"]),
div:has(> li.n-dropdown-item .i-lucide-palette) {
  display: none !important;
}

/* Внутри Охры (класс ставит ohra-chatwoot.js): вход и выход — только через Охру. */
.ohra-embed div:has(> li.n-dropdown-item .i-lucide-power),
.ohra-embed div:has(> li.n-dropdown-item a[href="/super_admin"]) {
  display: none !important;
}

/* ——— Меню диалогов (правки владельца 06.10.2026) ———
   Название школы с логотипом сверху не нужно: проект один. */
aside > section > div:first-child:has(img) {
  display: none !important;
}
/* У каналов — только название, без служебного кода канала («· AKeZ…»). */
aside nav li a bdi,
aside nav li a span:has(+ bdi) {
  display: none !important;
}
/* Разделы Chatwoot, которые менеджеру не нужны: «Упоминания» (заметки с @), «Участвующие»,
   «Контакты» (клиенты живут в Охре, поиск сверху ищет и по людям). */
aside li[name="Mentions"],
aside li[name="Participating"],
aside li:has(> a[name="Contacts"]) {
  display: none !important;
}
/* Подпись под разделом: что в нём лежит (ставит ohra-chatwoot.js). */
aside a.ohra-hinted {
  height: auto !important;
  min-height: 2rem;
  align-items: flex-start !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}
aside a.ohra-hinted > span:first-child,
aside a.ohra-hinted > div:first-child {
  margin-top: 2px;
}
aside .ohra-hint {
  display: block;
  white-space: normal;
  font-size: 12px !important;
  line-height: 1.3;
  font-weight: 400 !important;
  color: rgb(var(--slate-10));
  margin-top: 1px;
}

/* ——— Вставки Охры (06.10.2026): полоса над перепиской, боковые панели, «Задачи» и «Этапы воронки» в меню ——— */
iframe.ohra-bar {
  display: block;
  flex-shrink: 0;
  width: 100%;
  height: 52px;
  border: 0;
  background: #fff;
}
iframe.ohra-counts {
  position: absolute;
  width: 1px;
  height: 1px;
  border: 0;
  left: -10px;
  top: -10px;
  opacity: 0;
  pointer-events: none;
}
.ohra-drawer {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
}
.ohra-drawer--right {
  justify-content: flex-end;
  left: auto;
  width: min(560px, 100vw);
}
.ohra-drawer__shade {
  position: absolute;
  inset: 0;
  background: rgba(61, 36, 27, 0.22);
}
.ohra-drawer__panel {
  position: relative;
  height: 100%;
  background: #f8f3ea;
  box-shadow: 0 20px 48px rgba(61, 36, 27, 0.22);
}
.ohra-drawer--right .ohra-drawer__panel {
  width: min(560px, 100vw);
}
.ohra-drawer--left .ohra-drawer__panel {
  width: min(440px, 100vw);
}
.ohra-drawer__frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}
/* Пункты меню — как соседние пункты Chatwoot */
aside li.ohra-menu {
  list-style: none;
}
aside a.ohra-menu__a {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 5px 6px;
  border-radius: 8px;
  color: rgb(var(--slate-12));
  font-size: 14px;
  text-decoration: none;
}
aside a.ohra-menu__a:hover {
  background: rgb(var(--slate-3));
}
aside a.ohra-menu__a svg {
  flex-shrink: 0;
  margin-top: 2px;
}
aside .ohra-menu__text {
  display: grid;
  flex: 1;
  min-width: 0;
}
aside .ohra-menu__badge {
  flex-shrink: 0;
  min-width: 20px;
  padding: 2px 6px;
  border-radius: 999px;
  background: #b84e28;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  line-height: 16px;
}
aside .ohra-menu__badge[hidden] {
  display: none;
}
/* «Метки» в меню заменены «Этапами воронки»; метка «заявка» остаётся на самой переписке */
aside li:has(> div > button .i-lucide-tag) {
  display: none !important;
}
/* Встроенный ИИ Chatwoot (работает только с OpenAI и не знает наших курсов) — прячем; свой черновик ответа
   появится, когда будет ключ DeepSeek */
button.text-n-violet-9 {
  display: none !important;
}
/* ——— Упрощение Chatwoot (правки владельца 06.10.2026) ———
   Галочки массового выбора и расширенные фильтры в списке: действий над группой у нас нет. */
.conversations-list div:has(> input[type='checkbox']),
div.relative:has(> #toggleConversationFilterButton) {
  display: none !important;
}
/* Панель контакта: объединение — в Охре (карточки склеиваются там), удаление контакта оторвало бы переписку
   от карточки клиента; макросы не используем. */
button:has(> .i-ph-arrows-merge),
button:has(> .i-ph-trash),
.ohra-hide,
li:has(> a[href*='/settings/macros']) {
  display: none !important;
}
/* Кнопка «сведения о клиенте» — заметная: терракотовая рамка и подложка (Chatwoot прибивает её к краю,
   поэтому остаётся круглой, подпись — во всплывающей подсказке) */
button.ohra-contact-btn {
  width: 36px !important;
  height: 36px !important;
  background: #f6e3d8 !important;
  border: 1.5px solid #b84e28 !important;
  color: #9c3f1d !important;
  box-shadow: 0 2px 8px rgba(61, 36, 27, 0.12);
}
button.ohra-contact-btn:hover {
  background: #b84e28 !important;
  color: #fff !important;
}
/* Режим «Задачи»: колонка Охры на месте списка переписок */
.ohra-tasks-mode .conversations-list-wrap {
  display: none !important;
}
iframe.ohra-tasks-panel {
  display: block;
  flex: 0 0 auto;
  width: 360px;
  max-width: 40vw;
  height: 100%;
  border: 0;
  border-right: 1px solid rgb(var(--slate-5));
  background: #f8f3ea;
}
aside li.ohra-menu--active a.ohra-menu__a {
  background: rgb(var(--slate-4));
  font-weight: 600;
}
/* Канал — плашкой в цвете мессенджера (ставит ohra-chatwoot.js) */
.ohra-ch {
  display: inline-flex !important;
  align-items: center;
  gap: 4px !important;
  padding: 1px 8px 1px 6px;
  border-radius: 999px;
  color: #fff !important;
  font-weight: 600;
}
.ohra-ch *,
.ohra-ch .text-n-slate-11 {
  color: #fff !important;
}
.ohra-ch--vk {
  background: #0077ff;
}
.ohra-ch--max {
  background: #7b3fe4;
}
.ohra-ch--tg {
  background: #168acd;
}
.ohra-ch-icon--vk {
  color: #0077ff;
}
.ohra-ch-icon--max {
  color: #7b3fe4;
}
.ohra-ch-icon--tg {
  color: #168acd;
}
/* значок «{ }» (канал через API) внутри плашки не нужен — цвет и название уже говорят, что за канал */
.ohra-ch .i-woot-api,
.ohra-ch span:has(> .i-woot-api) {
  display: none !important;
}
.ohra-ch-text--vk,
.ohra-ch-text--vk * {
  color: #0077ff !important;
  font-weight: 600;
}
.ohra-ch-text--max,
.ohra-ch-text--max * {
  color: #7b3fe4 !important;
  font-weight: 600;
}
.ohra-ch-text--tg,
.ohra-ch-text--tg * {
  color: #168acd !important;
  font-weight: 600;
}

/* ——— Правки 07.10.2026 ———
   Список диалогов: значок приоритета («Ничего») и кружок статуса не нужны — переписка открывается кликом по строке.
   Разделители рядом с ними тоже прячем. */
.conversations-list div.w-4:has(> [class*='i-woot-priority']),
.conversations-list div.w-4:has(> [class*='i-woot-status-']),
.conversations-list div.flex-shrink-0:has(> div > input[type='checkbox']),
.conversations-list div.flex-shrink-0:has(> div > input[type='checkbox']) + div.w-px {
  display: none !important;
}
/* «Завершить» без выпадающего списка («Отложено», «Отметить как ожидающий»): напоминания — задачами Охры */
.resolve-actions button[class*='rounded-l-none'] {
  display: none !important;
}
.resolve-actions button[class*='rounded-r-none'] {
  border-radius: 8px !important;
}
/* Боты Chatwoot не нужны: свои автоматизации — в Охре. Готовые ответы тоже правятся в Охре («Скрипты») и приходят сюда сами. */
li:has(> a[href*='/settings/agent-bots']),
li:has(> a[href*='/settings/automation']),
li:has(> a[href*='/settings/canned-response']) {
  display: none !important;
}
/* Иконка мессенджера вместо «{ }» (ставит ohra-chatwoot.js) */
.ohra-ch .i-woot-api,
.ohra-ch-text .i-woot-api,
.ohra-ch span:has(> .i-woot-api),
.ohra-ch-text span:has(> .i-woot-api),
.ohra-ch-icon {
  display: none !important;
}
.ohra-msg-icon {
  display: inline-flex;
  flex-shrink: 0;
  width: 14px;
  height: 14px;
}
.ohra-msg-icon svg {
  width: 100%;
  height: 100%;
}
aside span.grid:has(> .ohra-msg-icon) {
  display: flex !important;
  align-items: center;
  justify-content: center;
}
/* Окно скриптов — по центру поверх переписки */
.ohra-drawer--center {
  align-items: center;
  justify-content: center;
}
.ohra-drawer--center .ohra-drawer__panel {
  width: min(1080px, 96vw);
  height: min(760px, 92vh);
  border-radius: 16px;
  overflow: hidden;
}
/* Кнопка «Скрипты» над полем ответа */
button.ohra-scripts-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  margin-left: 8px;
  padding: 0 14px;
  border: 1.5px solid #b84e28;
  border-radius: 999px;
  background: #f6e3d8;
  color: #9c3f1d;
  font: 700 13px/1 Manrope, sans-serif;
  cursor: pointer;
}
button.ohra-scripts-btn:hover {
  background: #b84e28;
  color: #fff;
}
/* Подсказка в пустом поле — короче: про «/» и Shift+Enter не нужно, скрипты — кнопкой */
.ProseMirror p.empty-node::before {
  content: 'Сообщение клиенту…' !important;
}

/* Скриншоты клиентов — небольшими, но читаемыми; по клику Chatwoot открывает на весь экран (правка владельца 07.10.2026). */
[data-bubble-name="image"] img {
  width: auto !important;
  height: auto !important;
  max-width: min(280px, 100%) !important;
  max-height: 320px !important;
  object-fit: contain;
  cursor: zoom-in;
}
[data-bubble-name="image"] {
  padding: 6px !important;
}

/* Контраст: клиент — белый пузырь с рамкой, мы — персиковый (правка владельца 07.10.2026; не понравится — убрать этот блок). */
[data-bubble-name].bg-n-slate-4 {
  background-color: #ffffff !important;
  box-shadow: inset 0 0 0 1px #e2d3c2;
}
[data-bubble-name].bg-n-solid-blue {
  background-color: #f2d2bf !important;
}
.dark [data-bubble-name].bg-n-slate-4 {
  background-color: #2a201b !important;
  box-shadow: inset 0 0 0 1px #4a3a31;
}

/* Кнопки «Скрипты · Подсказать скрипт · Большой ИИ» — рядом слева, «развернуть» — справа. */
.reply-box > :first-child:has(.ohra-scripts-btn) {
  justify-content: flex-start !important;
  gap: 8px;
}
.reply-box > :first-child:has(.ohra-scripts-btn) > :last-child:not(.ohra-scripts-btn) {
  margin-left: auto;
}

/* «Редактировать» в меню сообщения и пометка «изменено» в пузыре (правка владельца 08.10.2026) */
.menu-container .ohra-menu-edit {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border-radius: 8px;
  font-size: 13px;
  cursor: pointer;
}
.menu-container .ohra-menu-edit:hover {
  background: #f6e3d8;
  color: #9c3f1d;
}
.ohra-edited {
  margin-left: 6px;
  font-size: 11px;
  color: #8a7a70;
  font-style: italic;
}

/* «Уведомления» Chatwoot не нужны: новые диалоги всплывают вверх списка (правка владельца 09.10.2026) */
aside li:has(> a[href*="/notifications"]),
aside a[href*="/notifications"],
aside li:has(> a[href*="/inbox-view"]),
aside a[href*="/inbox-view"] {
  display: none !important;
}

/* Этапы воронки в шапке Chatwoot (вариант A, 09.10.2026): имя слева ужимается, рамка этапов тянется до действий */
iframe.ohra-path {
  flex: 1 1 auto;
  min-width: 260px;
  height: 36px;
  border: 0;
  background: transparent;
  margin: 0 8px;
}
.ohra-head-left {
  flex: 0 1 auto !important;
  max-width: 34%;
}

/* Сортировка диалогов: подписи целиком. Chatwoot режет их до 10rem в кнопке и 16rem в списке —
   «Последняя активность: сначала…» и «Ожидающие ответа: сначала…» было не различить (владелец 23.10.2026). */
div.w-72.rounded-xl.absolute.z-40.top-full:not(#\#) {
  width: 28rem;
  max-width: calc(100vw - 32px);
}
div.w-72.rounded-xl.absolute.z-40.top-full:not(#\#) > div > span {
  flex-shrink: 0;
}
div.w-72.rounded-xl.absolute.z-40.top-full:not(#\#) button.max-w-40 {
  max-width: 19rem !important;
}
div.select-none.max-w-64.absolute:not(#\#) {
  max-width: none;
  width: max-content;
}
div.w-72.rounded-xl.absolute.z-40.top-full button span:not(#\#),
div.select-none.max-w-64.absolute button span:not(#\#) {
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
}