/* ==========================================================================
   «База знаний ИИ» (kb-ai.js) — с 11.08.2026 встроена в Свод-Чат (chat-svod2):
   рендерится внутрь #cs2Body, поэтому визуальный язык — токены --cs2-* и
   готовые компоненты .cs2-* (карточки, кнопки, таблицы, KPI, сегменты).
   Здесь только специфичная для раздела вёрстка (.kba-*). Фолбэки в var() —
   на случай легаси-открытия #kbAiTab вне Свод-Чата.
   ========================================================================== */
.kba-wrap { color: var(--cs2-text, #16192b); font-size: 13.5px; }
.kba-ic { display: inline-flex; vertical-align: -2px; }
.kba-ic svg { width: 100%; height: 100%; }
.kba-muted { color: var(--cs2-text-3, #8b91a6); font-style: italic; }
.kba-empty { padding: 34px 20px; text-align: center; color: var(--cs2-text-2, #5a6178); font-size: 13.5px; line-height: 1.7; }

/* ---------- страница 1: категории ---------- */
.kba-p1 { display: grid; grid-template-columns: 250px 1fr; gap: 14px; align-items: start; }
@media (max-width: 900px) { .kba-p1 { grid-template-columns: 1fr; } }
.kba-cat-panel { position: sticky; top: 0; }
.kba-cat-list { padding: 6px 8px 8px; max-height: calc(100vh - 260px); overflow-y: auto; }
.kba-cat-row {
    display: flex; justify-content: space-between; align-items: center; gap: 8px;
    padding: 8px 10px; border-radius: 9px; cursor: pointer; font-size: 12.5px;
    color: var(--cs2-text-2, #5a6178); transition: background .12s ease, color .12s ease;
}
.kba-cat-row:hover { background: var(--cs2-surface-2, #f6f7fb); color: var(--cs2-text, #16192b); }
/* активный пункт — как в сайдбаре Свод-Чата: светлая акцентная заливка */
.kba-cat-row.active { background: var(--cs2-accent-soft, rgba(99,102,241,.10)); color: var(--cs2-accent, #6366f1); font-weight: 600; }
.kba-cat-cnt { font-size: 11px; color: var(--cs2-text-3, #8b91a6); white-space: nowrap; font-variant-numeric: tabular-nums; }
.kba-cat-row.active .kba-cat-cnt { color: var(--cs2-accent, #6366f1); opacity: .8; }
.kba-cat-row.misc { border-top: 1px dashed var(--cs2-line, #e6e8f0); margin-top: 6px; padding-top: 10px; border-radius: 0 0 9px 9px; }

/* Пометки генератора v1 (13.08.2026): категория/инструкция, предложенная ИИ */
.kba-ai-badge {
    display: inline-block; font-size: 9px; font-weight: 700; line-height: 1;
    padding: 3px 5px; margin-left: 5px; border-radius: 5px; vertical-align: 1px;
    color: #92600a; background: rgba(245, 158, 11, .16); letter-spacing: .04em;
}
.kba-cat-prop { color: #b45309; font-weight: 700; margin-left: 2px; }
.kba-instr-card.proposed { border-color: rgba(245, 158, 11, .45); }
.kba-ic-approve { display: flex; align-items: center; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
.kba-ic-approve .kba-muted { font-size: 11px; }

.kba-minis { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin-bottom: 12px; }
.kba-mini { gap: 7px; }
.kba-mini-input {
    width: 100%; border: 1px solid var(--cs2-line, #e6e8f0); border-radius: 9px; padding: 7px 10px;
    font-size: 12.5px; font-family: inherit; background: var(--cs2-surface-2, #f6f7fb); color: var(--cs2-text, #16192b);
}
.kba-mini-input:focus { outline: none; border-color: var(--cs2-accent, #6366f1); background: var(--cs2-surface, #fff); }

.kba-row-actions { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; }
.kba-cur-cat { font-size: 14px; font-weight: 700; letter-spacing: -.01em; display: flex; align-items: center; gap: 8px; }
.kba-instr-box { min-height: 180px; }
.kba-instr-row { padding: 13px 16px; border-bottom: 1px solid var(--cs2-line-soft, #eff1f6); cursor: pointer; transition: background .12s ease; }
.kba-instr-row:last-child { border-bottom: none; }
.kba-instr-row:hover { background: var(--cs2-surface-2, #f6f7fb); }
.kba-instr-title { font-size: 13.5px; font-weight: 600; margin-bottom: 3px; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.kba-instr-preview { font-size: 12.5px; color: var(--cs2-text-2, #5a6178); }

/* ---------- страница 2: инструкция ---------- */
.kba-p2-head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.kba-p2-cat { font-size: 15px; font-weight: 700; letter-spacing: -.01em; }
.kba-p2-layout { display: grid; grid-template-columns: 1fr 260px; gap: 14px; }
@media (max-width: 900px) { .kba-p2-layout { grid-template-columns: 1fr; } }
.kba-instr-cards { display: flex; flex-direction: column; gap: 10px; }
.kba-instr-card { padding: 14px 18px; cursor: pointer; transition: border-color .14s ease, box-shadow .14s ease; }
.kba-instr-card:hover { border-color: var(--cs2-accent-line, rgba(99,102,241,.28)); box-shadow: var(--cs2-shadow-md, 0 6px 20px rgba(16,24,40,.07)); }
.kba-instr-card.editing { border-color: var(--cs2-accent, #6366f1); cursor: default; padding: 16px 18px; box-shadow: var(--cs2-shadow-md, 0 6px 20px rgba(16,24,40,.07)); }
.kba-ic-title { font-size: 14px; font-weight: 700; margin-bottom: 6px; display: flex; align-items: center; gap: 8px; }
.kba-ic-edithint { font-size: 11px; font-weight: 500; color: var(--cs2-text-3, #8b91a6); display: inline-flex; align-items: center; gap: 3px; opacity: 0; transition: opacity .12s ease; }
.kba-instr-card:hover .kba-ic-edithint { opacity: 1; }
.kba-ic-body { font-size: 13px; line-height: 1.65; color: var(--cs2-text, #16192b); word-break: break-word; }
.kba-ic-body p { margin: 0 0 6px; }
.kba-ic-meta { font-size: 10.5px; color: var(--cs2-text-3, #8b91a6); margin-top: 8px; }

.kba-edit-title {
    width: 100%; border: 1px solid var(--cs2-line, #e6e8f0); border-radius: 9px; padding: 8px 11px;
    font-size: 14px; font-weight: 600; font-family: inherit; margin-bottom: 10px;
    background: var(--cs2-surface-2, #f6f7fb); color: var(--cs2-text, #16192b); box-sizing: border-box;
}
.kba-edit-title:focus { outline: none; border-color: var(--cs2-accent, #6366f1); background: var(--cs2-surface, #fff); }
.kba-rt-toolbar {
    display: flex; align-items: center; gap: 4px; flex-wrap: wrap;
    background: var(--cs2-surface-2, #f6f7fb); border: 1px solid var(--cs2-line, #e6e8f0);
    border-radius: 9px 9px 0 0; padding: 6px 8px; border-bottom: none;
}
.kba-rt-toolbar select { font-size: 12px; border: 1px solid var(--cs2-line, #e6e8f0); border-radius: 7px; padding: 4px 6px; font-family: inherit; background: var(--cs2-surface, #fff); color: var(--cs2-text, #16192b); }
.kba-rt-btn { border: none; background: transparent; width: 28px; height: 28px; border-radius: 7px; cursor: pointer; font-size: 13px; color: var(--cs2-text, #16192b); display: inline-flex; align-items: center; justify-content: center; font-family: inherit; }
.kba-rt-btn:hover { background: var(--cs2-accent-soft, rgba(99,102,241,.10)); }
.kba-rt-sep { width: 1px; height: 20px; background: var(--cs2-line, #e6e8f0); margin: 0 4px; }
.kba-rt-color { display: inline-flex; align-items: center; gap: 3px; font-size: 12px; font-weight: 700; cursor: pointer; padding: 0 4px; color: var(--cs2-text, #16192b); }
.kba-rt-color input[type="color"] { width: 20px; height: 20px; border: none; padding: 0; cursor: pointer; background: none; }
.kba-rt-hl { background: #fff3c4; border-radius: 3px; padding: 0 3px; color: #1c2430; }
.kba-richtext {
    border: 1px solid var(--cs2-line, #e6e8f0); border-radius: 0 0 9px 9px; padding: 12px 14px;
    font-size: 13.5px; line-height: 1.65; min-height: 140px;
    background: var(--cs2-surface, #fff); color: var(--cs2-text, #16192b); outline: none; word-break: break-word;
}
.kba-richtext:focus { border-color: var(--cs2-accent, #6366f1); }
.kba-edit-actions { display: flex; gap: 8px; margin-top: 12px; align-items: center; flex-wrap: wrap; }
.kba-right { margin-left: auto; }
.kba-danger-soft { color: var(--cs2-red, #ef4444); }
.kba-move-row { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--cs2-line, #e6e8f0); flex-wrap: wrap; }
.kba-move-row label { font-size: 12px; color: var(--cs2-text-2, #5a6178); white-space: nowrap; display: inline-flex; align-items: center; gap: 5px; }

.kba-history { margin-top: 12px; border-top: 1px solid var(--cs2-line, #e6e8f0); padding-top: 10px; display: flex; flex-direction: column; gap: 5px; max-height: 220px; overflow-y: auto; }
.kba-hist-row { display: flex; gap: 10px; align-items: center; font-size: 12px; flex-wrap: wrap; }
.kba-hist-act { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; border-radius: 999px; padding: 2px 8px; background: var(--cs2-accent-soft, rgba(99,102,241,.10)); color: var(--cs2-accent, #6366f1); }
.kba-hist-act.create { background: var(--cs2-green-soft, rgba(16,185,129,.12)); color: var(--cs2-green, #10b981); }
.kba-hist-act.delete { background: var(--cs2-red-soft, rgba(239,68,68,.10)); color: var(--cs2-red, #ef4444); }
.kba-hist-act.move { background: var(--cs2-amber-soft, rgba(245,158,11,.12)); color: var(--cs2-amber, #f59e0b); }

.kba-eval-side { display: flex; flex-direction: column; gap: 10px; align-self: start; }
.kba-eval-note { font-size: 12px; line-height: 1.55; color: var(--cs2-text-2, #5a6178); }
.kba-eval-action {
    background: var(--cs2-accent-soft, rgba(99,102,241,.10)); border: 1px solid var(--cs2-accent-line, rgba(99,102,241,.28));
    border-radius: var(--cs2-r, 12px); padding: 11px 13px; font-size: 12.5px; font-weight: 600;
    color: var(--cs2-accent, #6366f1); cursor: pointer; display: flex; align-items: center; gap: 6px;
    transition: filter .12s ease;
}
.kba-eval-action:hover { filter: brightness(.96); }

/* ---------- страница 3: обращения (полная таблица) ---------- */
.kba-p3-bar { display: flex; align-items: center; gap: 10px; margin: 12px 0 10px; flex-wrap: wrap; }
.kba-p3-search {
    display: inline-flex; align-items: center; gap: 6px; flex: 1; min-width: 190px; max-width: 320px;
    border: 1px solid var(--cs2-line, #e6e8f0); border-radius: 9px; padding: 0 10px; height: 32px;
    background: var(--cs2-surface, #fff); color: var(--cs2-text-3, #8b91a6);
}
.kba-p3-search:focus-within { border-color: var(--cs2-accent, #6366f1); }
.kba-p3-search input { flex: 1; border: none; outline: none; background: none; font: inherit; font-size: 12.5px; color: var(--cs2-text, #16192b); }

/* ---------- правки Алекса 14.08.2026 ---------- */
/* навигация на самой странице (сегмент-контрол из шапки Свод-Чата убран) */
.kba-pagenav { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.kba-pagenav a.cs2-btn { text-decoration: none; }
.kba-pagenav .cs2-btn.active { border-color: var(--cs2-accent, #6366f1); color: var(--cs2-accent, #6366f1); }

/* категории: подкатегории, карандаш правки, форма, кнопка добавления */
.kba-cat-row { position: relative; }
.kba-cat-row.child { margin-left: 16px; }
.kba-cat-row.child::before { content: ''; position: absolute; left: -9px; top: 50%; width: 6px; height: 1px; background: var(--cs2-line, #e6e8f0); }
.kba-cat-pen {
    border: none; background: none; cursor: pointer; color: var(--cs2-text-3, #8b91a6);
    padding: 2px; border-radius: 5px; display: none; align-items: center; flex: none;
}
.kba-cat-row:hover .kba-cat-pen { display: inline-flex; }
.kba-cat-pen:hover { color: var(--cs2-accent, #6366f1); background: var(--cs2-accent-soft, rgba(99,102,241,.10)); }
.kba-cat-form { display: flex; flex-direction: column; gap: 6px; padding: 8px; border: 1px dashed var(--cs2-accent-line, rgba(99,102,241,.28)); border-radius: 9px; margin: 4px 0; }
.kba-cat-form input, .kba-cat-form select {
    font: inherit; font-size: 12.5px; padding: 6px 8px; border: 1px solid var(--cs2-line, #e6e8f0);
    border-radius: 7px; background: var(--cs2-surface, #fff); color: var(--cs2-text, #16192b); width: 100%;
}
.kba-cat-form-btns { display: flex; gap: 6px; }
.kba-cat-add {
    display: flex; align-items: center; gap: 6px; padding: 9px 10px; margin-top: 4px; cursor: pointer;
    font-size: 12.5px; font-weight: 600; color: var(--cs2-accent, #6366f1); border-radius: 9px;
}
.kba-cat-add:hover { background: var(--cs2-accent-soft, rgba(99,102,241,.10)); }
.kba-instr-cnt { font-size: 11px; color: var(--cs2-text-3, #8b91a6); font-weight: 500; margin-left: auto; flex: none; }
.kba-instr-title { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }

/* карточка инструкции: чтение сначала, действия по кнопкам */
.kba-instr-card.focus { border-color: var(--cs2-accent, #6366f1); box-shadow: 0 0 0 3px var(--cs2-accent-soft, rgba(99,102,241,.10)); }
.kba-ic-actions { display: flex; align-items: center; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.kba-ic-kw {
    margin-top: 10px; font-size: 12px; color: var(--cs2-text-2, #5a6178);
    background: var(--cs2-bg, #f6f7fb); border-radius: 8px; padding: 7px 10px;
    display: flex; align-items: baseline; gap: 5px; flex-wrap: wrap;
}

/* блок улучшений от ИИ на карточке */
.kba-ic-suggs { margin-top: 12px; border: 1px solid var(--cs2-amber-line, rgba(245,158,11,.35)); border-radius: 10px; overflow: hidden; }
.kba-ic-suggs-t {
    display: flex; align-items: center; gap: 6px; padding: 8px 12px; font-size: 12px; font-weight: 700;
    color: #92600a; background: rgba(245,158,11,.10);
}
.kba-sugg { padding: 10px 12px; border-top: 1px dashed var(--cs2-line, #e6e8f0); }
.kba-sugg-text { font-size: 12.5px; line-height: 1.5; }
.kba-sugg-meta { font-size: 11px; color: var(--cs2-text-3, #8b91a6); margin-top: 3px; }
.kba-sugg-btns { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }

/* редактор: ключевые фразы + дополнительные категории */
.kba-edit-kw { display: flex; flex-direction: column; gap: 4px; margin-top: 10px; }
.kba-edit-kw label { font-size: 11.5px; font-weight: 600; color: var(--cs2-text-2, #5a6178); display: inline-flex; align-items: center; gap: 5px; }
.kba-edit-kw input {
    font: inherit; font-size: 12.5px; padding: 7px 10px; border: 1px solid var(--cs2-line, #e6e8f0);
    border-radius: 8px; background: var(--cs2-surface, #fff); color: var(--cs2-text, #16192b);
}
.kba-edit-kw input:focus { outline: none; border-color: var(--cs2-accent, #6366f1); }
.kba-edit-extracats { margin-top: 10px; font-size: 12.5px; }
.kba-edit-extracats summary { cursor: pointer; font-weight: 600; color: var(--cs2-text-2, #5a6178); display: inline-flex; align-items: center; gap: 5px; }
.kba-extracats-list { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 8px; max-height: 160px; overflow-y: auto; }
.kba-extracat { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; cursor: pointer; min-width: 180px; }

/* обращения: фильтр по инструкции и подпись инструкции в строке */
.kba-instr-filter { display: inline-flex; align-items: center; gap: 5px; max-width: 340px; }
.kba-instr-filter button { border: none; background: none; cursor: pointer; font-size: 14px; line-height: 1; color: inherit; padding: 0 2px; }
.kba-p3-instr { font-size: 11px; color: var(--cs2-text-3, #8b91a6); margin-top: 3px; max-width: 220px; }