/* Нейтральная палитра исходного приложения. Этот файл отвечает за
   аккуратную современную компоновку, не вводя новую цветовую тему. */
:root {
  --ink: #1f2a38;
  --ink-soft: #2f4a6b;
  --paper: #f6f4ef;
  --surface: #fff;
  --surface-sunk: #faf9f5;
  --line: #e2ddcf;
  --line-strong: #cfc9bb;
  --text: #242220;
  --text-muted: #5c584f;
  --text-faint: #8a8578;
  --danger: #9c2b1f;
  --success: #2f6f4f;
  --r-sm: 8px;
  --r-md: 11px;
  --r-lg: 14px;
}

html { color-scheme: light; }
body { background: var(--paper); color: var(--text); line-height: 1.5; }
button { touch-action: manipulation; }
:where(button, a, input, select, textarea, summary):focus-visible {
  outline: 3px solid #7591b2;
  outline-offset: 2px;
}

/* Вход, витрина и верхняя навигация остаются светлыми. */
.auth-screen { min-height: 100dvh; background: #f0eee8; }
.auth-card { max-width: 410px; padding: clamp(22px, 4vw, 34px); border: 1px solid var(--line); border-radius: 16px; box-shadow: none; }
.auth-title { font-family: var(--font-sans); font-size: 23px; letter-spacing: -.025em; }
.auth-tab { min-height: 42px; border-radius: 9px; }
.auth-form { gap: 14px; }
.auth-form input { min-height: 44px; border-radius: 9px; font-size: 15px; }
.auth-form button[type="submit"] { min-height: 44px; border-radius: 9px; font-weight: 650; }
.auth-note { color: var(--text-muted); line-height: 1.55; }
.landing { background: var(--paper); }
.landing-hero { background: #f2efe9; border-radius: 0 0 24px 24px; }
.landing-feature, .landing-demo, .landing-honest { background: var(--surface); border-color: var(--line); box-shadow: none; }
.landing-cta { background: var(--ink-soft); }

:is(#app, #admin-app) .topbar {
  background: #fff; color: var(--ink); border-bottom: 1px solid var(--line);
  box-shadow: none;
}
:is(#app, #admin-app) .topbar-inner { max-width: 1480px; }
:is(#app, #admin-app) .topbar .eyebrow { color: #6e7884; font-size: 10px; font-weight: 700; letter-spacing: .1em; margin-bottom: 2px; }
:is(#app, #admin-app) .topbar h1 { font-family: var(--font-sans); color: var(--ink); font-size: 20px; line-height: 1.2; font-weight: 700; }
:is(#app, #admin-app) .who { color: #5a6877; }
:is(#app, #admin-app) .topbar-actions > .btn.ghost,
#app .topbar-more summary { background: #fff; color: var(--ink-soft); border-color: var(--line-strong); }
:is(#app, #admin-app) .topbar-actions > .btn.ghost:hover,
#app .topbar-more summary:hover { background: #f4f2ed; border-color: #a8b6c4; }
#app .topbar-more-panel { background: #fff; border-color: var(--line); }
#app .topbar-more-panel .btn.ghost { background: #fff; color: var(--ink); border-color: transparent; }
#app .topbar-more-panel .btn.ghost:hover { background: #f2f0eb; }
:is(#app, #admin-app) .topbar-inner.tabs-row { padding-bottom: 9px; }
:is(#app, #admin-app) .workspace-tabs {
  background: #f1f0ec; border: 1px solid var(--line); border-radius: 11px;
  gap: 3px; padding: 4px;
}
:is(#app, #admin-app) .ws-tab { min-height: 40px; color: #4f5f70; border-radius: 8px; font-size: 13px; font-weight: 550; }
:is(#app, #admin-app) .ws-tab:hover { background: #fff; color: var(--ink-soft); border-color: var(--line); }
:is(#app, #admin-app) .ws-tab.active {
  background: #fff; color: var(--ink-soft); border-color: #c9d5e0;
  box-shadow: inset 0 -2px 0 var(--ink-soft); font-weight: 700;
}
:is(#app, #admin-app) .ws-badge { background: #e9edf2; color: var(--ink-soft); }
:is(#app, #admin-app) .container { max-width: 1300px; padding-top: 20px; }
#app .container:has(#tab-content-ai-chat:not(.hidden)) { max-width: 1600px; }
.bell-icon { display: block; width: 20px; height: 20px; color: var(--ink-soft); }
#app .topbar .bell-btn { width: 40px; min-width: 40px; padding: 7px; }
.bell-badge { border-color: #fff; }
.bell-panel { background: #fff; border-color: var(--line); }
.bell-panel-head { background: #f6f4ef; border-bottom-color: var(--line); }

/* Формы и карточки: ровные размеры, чёткие границы, без полупрозрачных заливок. */
:is(#app, #admin-app) .btn { min-height: 38px; border-radius: 9px; font-weight: 600; }
:is(#app, #admin-app) .btn.primary,
:is(#app, #admin-app) .btn.dark { background: var(--ink-soft); color: #fff; }
:is(#app, #admin-app) .btn.primary:hover,
:is(#app, #admin-app) .btn.dark:hover { background: #223a55; }
:is(#app, #admin-app) .container .btn.ghost { background: #fff; color: var(--ink); border-color: var(--line-strong); }
:is(#app, #admin-app) .container .btn.ghost:hover { background: #f2f0eb; border-color: #a8b6c4; }
:is(#app, #admin-app) .panel,
:is(#app, #admin-app) .adm-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: none; }
:is(#app, #admin-app) .hint { background: #f2f0eb; border: 1px solid var(--line); border-radius: 9px; color: #5b6268; line-height: 1.6; }
:is(#app, #admin-app) .empty-state { padding: 32px 18px; background: #faf9f5; border: 1px dashed var(--line-strong); border-radius: 12px; }
:is(#app, #admin-app) .summary-card { background: #fff; border-color: var(--line); border-radius: 12px; }
:is(#app, #admin-app) .fs-trigger { background: #fff; border-color: var(--line-strong); border-radius: 9px; min-height: 40px; }
:is(#app, #admin-app) :where(.container, .app-drawer) input:is([type="text"], [type="search"], [type="date"], [type="datetime-local"], [type="time"], [type="number"], [type="email"], [type="password"]),
:is(#app, #admin-app) :where(.container, .app-drawer) textarea,
:is(#app, #admin-app) :where(.container, .app-drawer) select:not(.fs-select select) {
  min-height: 40px; background: #fff; border: 1px solid var(--line-strong);
  border-radius: 9px; color: var(--text);
}
:is(#app, #admin-app) input::placeholder,
:is(#app, #admin-app) textarea::placeholder { color: #7b8188; }

#app .record-card { background: #fff; border-color: var(--line); border-radius: 12px; box-shadow: none; }
#app .record-header:hover { background: #faf9f5; }
#app .record-body { background: #faf9f5; border-top-color: var(--line); }
#app #tab-content-tasks .task-card { background: #fff; border-color: var(--line); box-shadow: none; }
#app #tab-content-tasks .task-card.is-done { background: #faf9f5; }
#app #tab-content-tasks .day-nav { background: #f1f0ec; border-color: var(--line); }
#app #tab-content-tasks .day-cell:not(.selected) { background: #fff; border-color: var(--line-strong); }
#app .case-subtabs { background: #f1f0ec; border-bottom-color: var(--line); }
#app .case-subtab.active { background: #fff; color: var(--ink-soft); border-bottom-color: var(--ink-soft); }
#app .tl-event:nth-child(odd) { background: #faf9f5; }
#app .org-search-dropdown { background: #fff; border-color: var(--line); }
#app .ref-filter.active, #app .cases-type-btn.active, #app .org-subtab.active {
  background: #eaf0f7 !important; color: var(--ink-soft) !important; border-color: #9fb2c7 !important;
}
#app #cases-type-filter, #app #ref-filters, #app #org-subtabs { gap: 7px; flex-wrap: wrap; }

/* Справочник: прежние цвета, удобная современная область чтения. */
#app .reference-workspace { display: grid; grid-template-columns: minmax(280px, 350px) minmax(0, 1fr); gap: 16px; align-items: start; }
#app #reference-list.records-list {
  max-height: min(72vh, 820px); overflow-y: auto !important; overflow-x: hidden;
  background: #fff; border-color: var(--line); border-radius: 12px;
  scrollbar-width: thin; scrollbar-color: #c0b9ad #f6f4ef;
}
#app .ref-card { border-bottom-color: #eeeae1; }
#app .ref-card.selected { background: #eaf0f7; box-shadow: inset 3px 0 0 var(--ink-soft); }
#app .ref-row { gap: 6px; padding: 4px 8px; min-width: 0; flex-wrap: nowrap; cursor: default; }
#app .ref-pin { display: grid; place-items: center; width: 40px; height: 48px; font-size: 23px; color: #8a8578; border-radius: 7px; }
#app .ref-pin:hover, #app .ref-pin:focus-visible { background: #edf2f7; color: var(--ink-soft); }
#app .ref-pin.active { color: #a6631a; }
#app .ref-open { flex: 1 1 auto; min-width: 0; display: grid; gap: 4px; padding: 8px 6px; background: transparent; border: 0; text-align: left; cursor: pointer; color: var(--ink); }
#app .ref-open:hover .ref-heading { color: var(--ink-soft); }
#app .ref-heading, #app .ref-title { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#app .ref-heading { font-size: 14px; font-weight: 700; }
#app .ref-title { font-size: 12.5px; color: var(--text-muted); }
#app .reference-detail {
  min-height: 360px; max-height: min(72vh, 820px); overflow-y: auto;
  padding: clamp(20px, 3vw, 36px); background: #fcfbf8; color: var(--ink);
  border: 1px solid var(--line); border-radius: 12px;
  scrollbar-width: thin; scrollbar-color: #c0b9ad #f6f4ef;
}
#app .reference-detail-empty { display: grid; place-items: center; min-height: 280px; text-align: center; color: var(--text-muted); line-height: 1.6; }
#app .ref-detail-kicker { color: var(--ink-soft); font-size: 12px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
#app .ref-detail-heading { max-width: 45em; margin: 12px 0 20px; color: var(--ink); font-size: clamp(20px, 2vw, 25px); line-height: 1.35; }
#app .ref-detail-rule { height: 1px; background: var(--line); margin-bottom: 22px; }
#app .ref-article-text { max-width: 76ch; font-size: 16px; line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; }
#app .ref-source-note { margin-top: 22px; padding-top: 14px; border-top: 1px solid var(--line); color: var(--text-muted); font-size: 12.5px; line-height: 1.55; }
#app .ref-source-note a { color: var(--ink-soft); text-decoration: underline; text-underline-offset: 2px; }
#app .ref-notes-heading { margin: 24px 0 9px; color: var(--ink-soft); font-size: 12px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
#app .reference-detail textarea { display: block; width: 100%; min-height: 100px; padding: 12px 14px; resize: vertical; line-height: 1.55; }
#app .ref-delete { margin-top: 14px; }

/* Чат: сохранены размеры и структура, названия имеют одинаковую высоту. */
#app #tab-content-ai-chat .ai-chat-layout { background: #fff; border-color: var(--line); box-shadow: none; }
#app #tab-content-ai-chat .ai-chat-sidebar { background: #f7f6f2 !important; border-color: var(--line) !important; }
#app #tab-content-ai-chat .ai-chat-main,
#app #tab-content-ai-chat .ai-chat-messages { background: #fff; }
#app #tab-content-ai-chat .ai-chat-list { gap: 3px; }
#app #tab-content-ai-chat .ai-chat-list-item {
  display: flex; flex-wrap: nowrap; justify-content: flex-start; box-sizing: border-box;
  width: 100%; height: 52px; min-height: 52px; max-height: 52px;
  padding: 8px !important; border: 1px solid transparent !important;
  border-left: 3px solid transparent !important; color: #33465c;
  font-size: 13px; font-weight: 550; transform: none !important;
}
#app #tab-content-ai-chat .ai-chat-list-item:hover { background: #f0eee8 !important; }
#app #tab-content-ai-chat .ai-chat-list-item.active {
  background: #eaf0f7 !important; color: var(--ink-soft); border-left-color: var(--ink-soft) !important;
}
#app #tab-content-ai-chat .ai-chat-list-item .ai-chat-labels {
  display: flex; flex: 1 1 0; flex-direction: column; justify-content: center;
  min-width: 0; height: 38px; overflow: hidden;
}
#app #tab-content-ai-chat .ai-chat-list-item .ai-chat-title {
  display: block; flex: 0 0 auto; min-width: 0; width: 100%; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 600; line-height: 1.4;
}
#app #tab-content-ai-chat .ai-chat-list-item .ai-chat-case-tag {
  display: block; flex: 0 0 auto; min-width: 0; max-width: 100%; padding: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  background: transparent; color: #68788b; font-size: 10.5px; line-height: 1.35;
}
#app #tab-content-ai-chat .ai-chat-list-item .ai-chat-rename,
#app #tab-content-ai-chat .ai-chat-list-item .ai-chat-delete { flex: 0 0 28px; opacity: .85; }
#app #tab-content-ai-chat .ai-chat-bubble.user { background: #f0f3f8 !important; border-color: #e1e8f0; }
#app #tab-content-ai-chat .ai-chat-input-inner { background: #fff; border-color: var(--line); box-shadow: none; }

#admin-app .adm-kpi { background: #fff; border-color: var(--line); border-top: 3px solid var(--ink-soft); }
#admin-app .admin-table th { background: #f1f0ec; color: var(--ink); border-color: var(--line); }

@media (max-width: 760px) {
  :is(#app, #admin-app) .topbar h1 { font-size: 16px; }
  :is(#app, #admin-app) .topbar-inner { padding: 9px 12px; }
  :is(#app, #admin-app) .topbar-inner.tabs-row { padding: 3px 12px 9px; }
  :is(#app, #admin-app) .container { padding: 14px max(12px, env(safe-area-inset-right)) 44px max(12px, env(safe-area-inset-left)); }
  :is(#app, #admin-app) .ws-tab { min-height: 44px; }
  :is(#app, #admin-app) .container .btn { min-height: 44px; }
  :is(#app, #admin-app) :where(.container, .app-drawer) input:is([type="text"], [type="search"], [type="date"], [type="datetime-local"], [type="time"], [type="number"], [type="email"], [type="password"]),
  :is(#app, #admin-app) :where(.container, .app-drawer) textarea,
  :is(#app, #admin-app) :where(.container, .app-drawer) select:not(.fs-select select) { font-size: 16px; min-height: 44px; }
  #app #cases-type-filter, #app #ref-filters, #app #org-subtabs { flex-wrap: nowrap; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-bottom: 4px; }
  #app #cases-type-filter .btn, #app #ref-filters .btn, #app #org-subtabs .btn { flex: 0 0 auto; white-space: nowrap; }
  #app .reference-workspace { grid-template-columns: minmax(0, 1fr); }
  #app #reference-list.records-list { max-height: 280px; }
  #app .reference-detail { max-height: none; min-height: 260px; padding: 20px 17px; scroll-margin-top: 16px; }
  #app .ref-article-text { font-size: 15px; line-height: 1.75; }
  #app #tab-content-ai-chat .ai-chat-list-item { height: 54px; min-height: 54px; max-height: 54px; }
  #app #tab-content-ai-chat .ai-chat-list-item .ai-chat-rename,
  #app #tab-content-ai-chat .ai-chat-list-item .ai-chat-delete { flex-basis: 34px; }
}
