/* К-247 — классический интерфейс кабинета по макету «К Биржа ЗЧ К-247».
   Раскладка макета сохранена, базовый цвет — синий: жёлто-чёрная гамма осталась
   айдентикой уличных павильонов и в интерфейс не переносится. Цвет выбирает
   сам пользователь, --k-accent перекрашивает все акцентные зоны разом. */

:root {
  --k-accent: #2F5BA8;
  --k-on: #FFFFFF;
  --k-dark: #404040;
  --k-bar: #7E7F7E;
  /* текст поверх серой полосы: белый читается при любой схеме,
     на светлых схемах ниже возвращается сам акцент — как в макете */
  --k-onbar: #FFFFFF;
  --k-th: #D8D9D8;
  --k-th2: #BEBFBE;
  --k-panel: #F1F2F1;
  /* Линия рамки. Была #000000 — на 41 правиле и 2px это давало жёсткую сетку
     из чёрных прямоугольников. #8A8782 держит контраст 3.6:1 к белому, то есть
     граница остаётся различимой, но перестаёт резать. */
  --k-line: #8A8782;
  --k-line-soft: #DCDAD5;   /* внутренние разделители, где рамка не нужна */
  --k-accepted: #00FF00;
  --k-return: #FAE4D5;
  --k-rejected: #F8CAAC;
  --k-selected: #DCE6F7;
  --k-alert: #FF0000;
  --k-white: #FFFFFF;
  --k-ink: #000000;
  --e: cubic-bezier(.22, 1, .36, 1);
}

/* выбранная пользователем схема перекрашивает все акцентные зоны */
[data-accent="1"]  { --k-accent: #FFFF00; --k-on: #000000; --k-onbar: #FFFF00; }
[data-accent="2"]  { --k-accent: #FFC000; --k-on: #000000; }
[data-accent="3"]  { --k-accent: #1CA4DB; --k-on: #000000; }
[data-accent="4"]  { --k-accent: #2F5BA8; --k-on: #FFFFFF; }
[data-accent="5"]  { --k-accent: #FF46B8; --k-on: #000000; }
[data-accent="6"]  { --k-accent: #E70079; --k-on: #FFFFFF; }
[data-accent="7"]  { --k-accent: #9CF600; --k-on: #404040; }
[data-accent="8"]  { --k-accent: #6FAC46; --k-on: #000000; }
[data-accent="9"]  { --k-accent: #7E7F7E; --k-on: #FFFFFF; }
[data-accent="10"] { --k-accent: #000000; --k-on: #FFFF00; }
[data-accent="11"] { --k-accent: #990099; --k-on: #FFFFFF; }
[data-accent="12"] { --k-accent: #6F2F9F; --k-on: #FFFF00; }

body.classic {
  background: #FFFFFF;
  color: #000;
  font-family: "Wix Madefor Text", Arial, sans-serif;
  font-size: 12.5px;
  line-height: 1.35;
  margin: 0;
  padding: 8px;
}

body.classic * { box-sizing: border-box; }
:where(body.classic) button, :where(body.classic) input,
:where(body.classic) select, :where(body.classic) textarea { font: inherit; color: inherit; }

/* ---------------- шапка ---------------- */
.kbar {
  background: var(--k-accent); color: var(--k-on, #000);
  border: 1px solid var(--k-line);
  padding: 8px 10px;
  display: grid; gap: 8px;
}
.kbar__top { display: grid; grid-template-columns: auto auto 1fr auto auto; align-items: center; gap: 12px; }
.kbar__brand { line-height: 1.15; }
.kbar__brand b { display: block; font-size: 13px; text-decoration: underline; }
.kbar__brand span { display: block; font-size: 21px; font-weight: 700; letter-spacing: -0.02em; }
.kbar__logo { font: italic 900 42px/1 Arial, sans-serif; letter-spacing: -0.04em; }
.kbar__badge {
  background: var(--k-alert); color: #fff; min-width: 34px; height: 26px; padding: 0 8px;
  display: inline-flex; align-items: center; justify-content: center; font-weight: 700;
  border-radius: 4px; position: relative; border: 0; font: inherit; font-weight: 700; cursor: pointer;
}
.kbar__badge::after { content: ""; position: absolute; left: 10px; bottom: -6px; border: 6px solid transparent; border-top-color: var(--k-alert); }
.kbar__user {
  background: #fff; border: 1px solid var(--k-line); border-radius: 6px;
  padding: 6px 12px; display: grid; gap: 2px; text-align: right; font-size: 12.5px; color: #000;
}
.kbar__user b { font-weight: 700; }
.kbar__role { display: inline-block; background: var(--k-dark); color: #fff; padding: 2px 8px; border-radius: 3px; font-size: 11px; }
.kbar__balance {
  background: var(--k-dark); color: #fff; border: 0; border-radius: 6px;
  padding: 12px 18px; cursor: pointer; font-size: 13px;
}
.kbar__balance:hover { background: #000; }

.kbar__row { display: grid; grid-template-columns: minmax(0, 1fr) 170px repeat(var(--nav, 4), minmax(90px, 150px)); gap: 8px; }
.kbar__search { background: #fff; color: var(--k-ink); border: 1px solid var(--k-line); border-radius: 5px; padding: 8px 10px; min-height: 38px; }
.kbtn {
  background: #fff; color: var(--k-ink);
  border: 1px solid var(--k-line); border-radius: 7px; min-height: 38px;
  padding: 6px 10px; cursor: pointer; font-size: 13px; text-align: center;
  transition: background 200ms var(--e), transform 260ms var(--e);
}
.kbtn:hover { background: var(--k-selected); transform: translateY(-1px); }
.kbtn.is-on { background: var(--k-dark); color: #fff; }
.kbtn--dark { background: var(--k-dark); color: #fff; border-color: var(--k-dark); }
.kbtn--dark:hover { background: #000; color: #fff; }
.kbtn--sm { min-height: 28px; padding: 3px 8px; font-size: 12px; }

/* ---------------- рабочая область ---------------- */
.kwork { display: grid; gap: 8px; align-items: start; }
body.k-classic .kwork { margin-top: 8px; }
.kwork--2 { grid-template-columns: 58fr 42fr; }
.kwork--3 { grid-template-columns: 1fr 1.45fr 1fr; }
.kwork--4 { grid-template-columns: 1fr 1.15fr 1.15fr 1fr; }
.kwork--1 { grid-template-columns: 1fr; }
@media (max-width: 1500px) { .kwork--4 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 1200px) { .kwork--2, .kwork--3 { grid-template-columns: 1fr; } }
/* телефон: панели одной колонкой и для четырёх панелей — две колонки по 170 px рвали слова,
   номера КП ложились поверх сумм («Поток заявок» менеджера, проверка 26.09, M23) */
@media (max-width: 700px) { .kwork--2, .kwork--3, .kwork--4 { grid-template-columns: minmax(0, 1fr); } }

.kpanel {
  border: 1px solid var(--k-line); background: #fff; border-radius: 10px; overflow: hidden;
  /* колонка не шире панели: широкие таблицы прокручиваются в .kwrap, а не раздвигают панель под обрезку */
  display: grid; grid-template-rows: auto minmax(0, 1fr); grid-template-columns: minmax(0, 1fr);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
}
.kpanel__head {
  background: var(--k-dark); color: #fff; text-align: center; padding: 5px 8px;
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; font-size: 13px;
}
.kpanel__head b { grid-column: 2; font-weight: 400; }
.kpanel__win { display: inline-flex; gap: 8px; }
/* вкладки раздела и кнопки окна («Свернуть», «Развернуть») в шапке панели — через 8 px (правило промежутков между целями;
   кнопки окна стояли через 6 px, перепроверка 23.09.2026). В minimal кнопок окна нет, в modern панелей kpanel нет */
.kpanel__win button { background: none; border: 0; color: #fff; cursor: pointer; opacity: 0.8; font-size: 13px; line-height: 1; padding: 2px 4px; }
.kpanel__win button:hover { opacity: 1; }
.kpanel__body { padding: 8px; overflow: auto; max-height: calc(100svh - var(--k-chrome, 210px)); }
.kpanel.is-collapsed .kpanel__body { display: none; }
.kpanel.is-collapsed { grid-template-rows: auto; }
/* Телефон: вкладки панели уходят второй строкой, заголовок переносится, кнопки окна остаются
   на экране. В одну строку «Список ТС / Оборудование / Оснащение» и «_ □» уезжали за правый край. */
@media (max-width: 560px) {
  .kpanel__head { grid-template-columns: minmax(0, 1fr) auto; row-gap: 8px; }
  .kpanel__head > b { grid-column: 1; grid-row: 1; min-width: 0; overflow-wrap: anywhere; text-align: left; }
  .kpanel__head > .kpanel__win:first-child { grid-column: 1 / -1; grid-row: 2; flex-wrap: wrap; justify-content: flex-start; min-width: 0; }
  .kpanel__head > .kpanel__win:first-child:empty { display: none; }
  .kpanel__head > .kpanel__win:last-child { grid-column: 2; grid-row: 1; }
  .kpanel__win button[data-min], .kpanel__win button[data-max] { min-width: 44px; min-height: 44px; }
}

/* ---------------- жёлтые блоки-сводки ---------------- */
.kinfo { background: var(--k-accent); color: var(--k-on, #000); border: 1px solid var(--k-line); padding: 8px 10px; margin-bottom: 8px; }
.kinfo dl { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 10px; margin: 0; }
.kinfo dt { font-size: 12.5px; }
.kinfo dd { margin: 0; text-align: right; font-weight: 700; white-space: nowrap; }
.kinfo__title { font-weight: 700; text-decoration: underline; margin-bottom: 6px; }

.kbar-title {
  background: var(--k-bar); color: var(--k-onbar); text-align: center;
  padding: 4px 8px; font-size: 12.5px; margin: 8px 0 6px;
}

/* ---------------- фильтры ---------------- */
.kfilters { display: grid; gap: 4px; margin-bottom: 8px; }
.kfilt { display: grid; grid-template-columns: 46% minmax(0, 1fr); align-items: center; gap: 6px; }
.kfilt > span { font-size: 12.5px; }
.kfilt select, .kfilt input {
  border: 1px solid var(--k-line); border-radius: 4px; background: #fff;
  padding: 4px 6px; min-height: 26px; width: 100%; text-align: right;
}

/* ---------------- карточка заявки в ленте ---------------- */
.kcard { border: 1px solid var(--k-accent); border-radius: 10px; background: #fff; padding: 10px 12px; margin-bottom: 8px; }
.kcard.is-on { background: var(--k-selected); }
.kcard--accent { background: var(--k-accent); color: var(--k-on, #000); border-color: var(--k-accent); }
.kcard__t { font-weight: 700; margin-bottom: 6px; }
.kcard__meta { font-size: 12px; margin-top: 6px; }
.kcard ol { margin: 6px 0 6px 18px; padding: 0; }
.kcard__acts { display: grid; grid-auto-flow: column; gap: 6px; margin-top: 8px; }

/* ---------------- строки списков ---------------- */
.krow {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto; gap: 6px; align-items: center;
  width: 100%; text-align: left; background: #fff; border: 1px solid var(--k-line); border-radius: 4px;
  padding: 4px 8px; margin-bottom: 4px; cursor: pointer; min-height: 30px;
  transition: background 200ms var(--e);
}
.krow:hover { background: var(--k-selected); }
.krow.is-on { background: var(--k-selected); }
.krow.is-accepted { background: var(--k-accepted); }
.krow.is-return { background: var(--k-return); }
.krow.is-rejected { background: var(--k-rejected); }
.krow__tag { border: 1px solid var(--k-line); border-radius: 4px; padding: 1px 8px; font-size: 12px; background: #fff; white-space: nowrap; }
.krow__tag--hot { background: var(--k-accent); color: var(--k-on, #000); }
.krow__tag--new { background: var(--k-alert); color: #fff; border-color: var(--k-alert); }

/* ---------------- таблицы ---------------- */
.ktable { width: 100%; border-collapse: collapse; font-size: 12px; }
.ktable th {
  background: var(--k-th); border: 1px solid var(--k-line-soft); padding: 5px 6px; font-weight: 400;
  position: sticky; top: 0; z-index: 1; white-space: nowrap;
}
.ktable td { border: 1px solid var(--k-line-soft); padding: 4px 6px; background: #fff; }
.ktable tr:hover td { background: #fafaf5; }
.ktable tr.is-best td { background: var(--k-selected); }
.ktable tr.is-accepted td { background: var(--k-accepted); }
.ktable tr.is-return td { background: var(--k-return); }
.ktable .num { text-align: right; white-space: nowrap; }
.ktable .cen { text-align: center; }
.ktable--sub { margin: 4px 0; }
.kwrap { overflow-x: auto; }
.ksection { font-size: 12.5px; margin: 8px 0 4px; }

/* ---------------- формы ---------------- */
.kform { display: grid; gap: 6px; }
.kfield { display: grid; grid-template-columns: 42% minmax(0, 1fr); gap: 6px; align-items: center; }
.kfield > span { font-size: 12.5px; }
.kfield input, .kfield select, .kfield textarea {
  border: 1px solid var(--k-line); border-radius: 4px; padding: 4px 6px; min-height: 28px; width: 100%; background: #fff;
}
.kfield textarea { min-height: 60px; }
.kline { display: grid; gap: 4px; align-items: center; margin-bottom: 4px; }
.kline input, .kline select { border: 1px solid #9a9a9a; border-radius: 4px; padding: 3px 5px; min-height: 26px; width: 100%; background: #fff; }
.kline--item { grid-template-columns: 24px minmax(0, 1fr) 70px minmax(0, 1fr) 30px; }
.kline--offer { grid-template-columns: 24px repeat(7, minmax(0, 1fr)) 30px; }
/* вторая строка варианта КП: НДС, количество, «в наличии» (раскладка была инлайн-стилем в classic-crm.js) */
.kline--offer2 { grid-template-columns: 24px 120px 120px minmax(0, 1fr); }
/* гарантия позиции (правки 06.10, Б15.5): строка варианта КП «список срока и галочка „Гарантия изготовителя“» (classic-crm.js:
   lineRow продавца и форма КП площадки) и та же галочка в формах позиции («Мои товары», каталог менеджера).
   Поле галочки — 18 px внутри подписи: общие правила .kline input и .kfield input растянули бы его на всю ширину, а правило
   окон (app.css: поля окна не меньше 44 × 44) — до 44 px; цель нажатия — подпись целиком (в окне и на телефоне 44 px) */
.kwar { grid-template-columns: 24px 220px minmax(0, 1fr); gap: 4px 12px; margin-bottom: 8px; }
.kwar--pick { grid-template-columns: 220px minmax(0, 1fr); }
.kwar__f { display: grid; gap: 2px; min-width: 0; }
.kwar__flag { display: inline-flex; flex-wrap: nowrap; align-items: center; gap: 8px; min-height: 28px; min-width: 0; justify-self: start; align-self: end; cursor: pointer; }
.kwar__flag > span { min-width: 0; }
:is(#app, body) .kwar__flag > input[type="checkbox"] { flex: 0 0 auto; width: 18px; height: 18px; min-width: 0; min-height: 0; margin: 0; padding: 0; }
.kwar__flag > input:disabled + span { opacity: 0.55; }
.kwar-field > .kwar__flag { align-self: center; }
@media (max-width: 600px) {
  .kline.kwar { grid-template-columns: 24px minmax(0, 1fr); gap: 8px 6px; }
  .kline.kwar.kwar--pick { grid-template-columns: minmax(0, 1fr); }
  .kwar > .kwar__f, .kwar > .kwar__flag { grid-column: -2 / -1; }
  :is(#app, body) .kwar select { min-height: 44px; }
  .kwar__flag { min-height: 44px; }
}
/* колонка «Гарантия» у покупателя (правки 06.10, Б15.5; шаг Г4.4; ui.js warrantyHtml): срок, под ним — чья гарантия
   («изготовителя», «продавца», «по условиям»). Щит — гарантия изготовителя от 2 лет: значок не нажимается, это пометка.
   .kwarr-line — та же гарантия одной строкой под названием позиции в корзине и в заказе. Ссылка «Открыть условия гарантии»
   — одна на таблицу (витрина — над таблицей, состав КП — под ней); на телефоне цель не ниже 44 px */
.kwarr { display: inline-grid; justify-items: start; gap: 1px; line-height: 1.25; text-align: left; vertical-align: middle; }
.kwarr__t { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.kwarr__n { white-space: nowrap; }
.kwarr--shield .kwarr__t { font-weight: 600; }
:is(.kwarr--shield, .kwarr-line) > .ic, .kwarr--shield .kwarr__t > .ic { flex: 0 0 auto; color: #1E6B34; }
.kwarr-line { display: flex; align-items: center; gap: 4px; margin-top: 2px; line-height: 1.25; }
.kwarr-terms { margin: 0 0 6px; display: flex; justify-content: flex-end; }
.kexchange-expanded > .kwarr-terms { margin: 6px 0 0; justify-content: flex-start; }
/* состав КП с колонкой «Гарантия» — 11 колонок: на 1366 px таблица стала шире панели предложений и прокручивалась вбок;
   поля ячеек и колонка «Состояние, комментарии» немного уже (было 6 px и 120 px) — таблица помещается, как прежде */
.kexchange-kp-lines :is(th, td) { padding-inline: 5px; }
.kexchange-kp-lines .kp-cond { min-width: 100px; }
/* цель ссылки — не ниже 44 px на любой ширине, а не только на телефоне (независимая проверка Г4–Г5, п. 9: на планшете 768 px было 28 px) */
.kwarr-link { display: inline-flex; align-items: center; min-height: 44px; font-size: 12.5px; color: inherit; text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 600px) {
  .kwarr-terms { justify-content: flex-start; }
  .kwarr-link { min-height: 44px; font-size: 14px; }
}
@media (max-width: 1400px) { .kline--offer { grid-template-columns: 24px repeat(4, minmax(0, 1fr)); } }

.kgrey { background: var(--k-th); border: 1px solid #9a9a9a; border-radius: 4px; padding: 4px 8px; font-size: 12px; }
.kpos { background: var(--k-panel); border: 1px solid #c9c9c9; padding: 6px 8px; margin-bottom: 6px; }
.kpos__t { font-weight: 700; margin-bottom: 6px; font-size: 12.5px; }
.ktotals { display: grid; grid-auto-flow: column; justify-content: start; gap: 8px; align-items: center; margin-top: 8px; }

/* ---------------- чат ---------------- */
.kchat { border: 1px solid #9a9a9a; border-radius: 6px; background: #fff; margin-top: 8px; }
.kchat__label { background: var(--k-th); border-bottom: 1px solid #c9c9c9; padding: 2px 8px; font-size: 11.5px; color: #555; }
.kchat__log { max-height: 200px; overflow-y: auto; padding: 6px 8px; display: grid; gap: 5px; }
.kmsg { border: 1px solid #d5d5d5; border-radius: 6px; padding: 5px 8px; max-width: 85%; font-size: 12px; }
.kmsg--me { margin-left: auto; background: var(--k-selected); }
.kmsg b { display: block; font-weight: 400; color: #666; font-size: 11px; }
.kchat__send { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; padding: 6px 8px; border-top: 1px solid #e2e2e2; }
.kchat__send textarea { border: 1px solid #c9c9c9; border-radius: 4px; padding: 4px 6px; min-height: 46px; }
.kchat__rule { font-size: 11px; color: #777; padding: 0 8px 6px; }

/* ---------------- блоки-плитки (главная); общий подвал убран правкой №21 от 13.09 ---------------- */
.kfoot__block {
  background: var(--k-accent); color: var(--k-on, #000);
  border: 1px solid var(--k-line); border-radius: 10px; padding: 12px 14px;
  display: grid; gap: 8px; align-content: start;
}
.kfoot__block b { font-size: 15px; }
.kfoot__acts { display: grid; grid-auto-flow: column; gap: 8px; justify-content: start; }

/* ---------------- мелочи ---------------- */
.kstat { font-size: 11.5px; padding: 1px 6px; border: 1px solid var(--k-line); border-radius: 4px; background: #fff; white-space: nowrap; }
.kstat--ok { background: var(--k-accepted); }
.kstat--wait { background: #fff; }
.kstat--off { background: #eee; color: #777; }
.kstat--ret { background: var(--k-return); }
.kdim { color: #666; }
.kempty { color: #888; padding: 10px 4px; font-size: 12px; }
.knowrap { white-space: nowrap; }
.kmoney { white-space: nowrap; }
.kmini { font-size: 11px; color: inherit; opacity: 0.62; }
/* поверх заливки акцентом приглушать нечем: контраст там и так на пределе */
.kinfo .kmini, .kfoot__block .kmini,
.kcard--accent .kmini, .kregion .kmini, .krow__tag--hot .kmini { opacity: 1; }

/* модалка и уведомление наследуются из app.css */

/* ---------------- плашка региона на бирже ---------------- */
.kregion {
  display: grid; grid-template-columns: auto minmax(120px, 180px) minmax(0, 1fr);
  gap: 8px; align-items: center;
  background: var(--k-bar); color: var(--k-onbar);
  border: 1px solid var(--k-line); padding: 5px 8px; margin-bottom: 8px;
}
.kregion__t { font-size: 12.5px; font-weight: 700; }
.kregion .kmini { color: #EDEDED; }
.kregion select { background: #fff; color: #000; }

/* ---------------- центр уведомлений ---------------- */
.kbell { position: relative; }
.knotes-drop {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 40;
  width: min(420px, 92vw); max-height: 60vh; overflow: auto;
  background: #fff; color: #000; border: 1px solid var(--k-line); border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .22);
}
.knotes-drop b {
  display: block; position: sticky; top: 0; z-index: 1;
  background: var(--k-bar); color: var(--k-onbar);
  padding: 8px 14px; font-size: 12.5px;
}
/* Кнопка внутри блочного контейнера всё равно сжимается по содержимому —
   отсюда был рваный правый край списка. Ширину задаём явно. */
.knote {
  display: grid; gap: 3px; width: 100%;
  padding: 10px 14px; border: 0; border-bottom: 1px solid #E6E6E3;
  font-size: 12.5px; line-height: 1.35; text-align: left; cursor: pointer;
  background: none; color: inherit;
  transition: background 160ms var(--e);
}
.knote:last-child { border-bottom: 0; }
.knote > span { display: block; text-wrap: pretty; }
.knote time { color: #7A7A78; font-size: 11px; }
.knote:hover { background: var(--k-selected); }
.knote:hover time { color: inherit; opacity: 0.7; }
/* непрочитанное — насыщеннее фоном и жирнее, без цветной полосы слева */
.knote--new { font-weight: 700; background: color-mix(in srgb, var(--k-accent) 14%, #fff); }
.knote--new:hover { background: color-mix(in srgb, var(--k-accent) 26%, #fff); }

/* ---------------- плашка бесплатной доставки: полоса в потоке над витриной ---------------- */
.kpromo {
  grid-column: 1 / -1;
  display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: center; gap: 8px;
  background: var(--k-accent); color: var(--k-on, #000); border: 1px solid var(--k-line);
  border-radius: 10px; padding: 4px 4px 4px 16px;
}
.kpromo__t { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 24px; margin: 0; }
.kpromo__t span { font-size: 14px; line-height: 1.4; }
.kpromo__t strong { font-size: 18px; }
.kpromo__x {
  width: 44px; height: 44px; display: grid; place-items: center;
  background: none; border: 0; border-radius: 8px; color: inherit; cursor: pointer;
  transition: background 160ms var(--e);
}
.kpromo__x:hover { background: rgba(0, 0, 0, .14); }
.kpromo__x:focus-visible { outline: 2px solid currentColor; outline-offset: -4px; }
@media (max-width: 520px) {
  .kpromo { padding-left: 12px; }
  .kpromo__t { flex-direction: column; gap: 0; }
  .kpromo__t span { font-size: 13px; }
}

/* ---------------- сортируемые заголовки ---------------- */
.ktable th[data-sort] { cursor: pointer; user-select: none; }
.ktable th[data-sort]:hover { background: var(--k-accent); color: var(--k-on, #000); }

/* ---------------- строка подбора менеджера ---------------- */
.kline--pick {
  grid-template-columns: repeat(4, minmax(0, 1fr)) 64px 110px 140px minmax(0, 1fr) minmax(0, 1.2fr) auto auto auto;
  align-items: center;
}
.kline--pick label.kbtn { display: grid; place-items: center; cursor: pointer; }
/* «Мои товары»: поиск и кнопки одной строкой; на узком экране поле поиска на всю ширину, кнопки ниже по две */
.kline--goods { grid-template-columns: minmax(0, 1fr) auto auto auto auto; }
.kline--goods label.kbtn { display: grid; place-items: center; cursor: pointer; }
.kline--goodsf { grid-template-columns: auto auto minmax(0, 1fr); }
@media (max-width: 600px) {
  .kline.kline--goods, .kline.kline--goodsf { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 8px; }
  .kline--goods > #gdQ { grid-column: 1 / -1; min-height: 44px; }
  .kline--goods > .kbtn { min-height: 44px; }
  .kline--goodsf > span:empty { display: none; }
}
@media (max-width: 1400px) {
  .kline--pick { grid-template-columns: repeat(3, minmax(0, 1fr)) 64px 110px; }
  .kline--pick > :nth-child(n + 6) { grid-column: span 1; }
}
/* телефон: строка «Дополнить КП» в две колонки — в пять колонок поля сжимались до 39 px (проверка 26.09, M24);
   комментарий варианта во всю строку, сумма и «Убрать вариант» под ним */
@media (max-width: 600px) {
  .kline.kline--pick { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kline--pick > [data-f="comment"] { grid-column: 1 / -1; }
  .kline--pick > .kin-qty { max-width: none; }
}

/* ================= УАТ К-247: управление автотранспортом ================= */
.kuat-nav {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: center;
  background: var(--k-bar); color: var(--k-onbar); border: 1px solid var(--k-line);
  padding: 6px 10px; margin-bottom: 8px;
}
.kuat-nav b { font-size: 12.5px; letter-spacing: 0.02em; }
.kuat-nav span { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
/* телефон: разделы УАТ — строкой с прокруткой под заголовком; справа от длинного заголовка они уходили за правый край
   (проверка 26.09, L22) */
@media (max-width: 600px) {
  .kuat-nav { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .kuat-nav span { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; min-width: 0; }
  .kuat-nav span > .kbtn { flex: 0 0 auto; white-space: nowrap; }
}

.ktable--grid th { position: sticky; top: 0; z-index: 2; }
.ktable--grid td { padding: 2px 4px; }
.ktable--grid input, .ktable--grid select {
  width: 100%; min-width: 60px; border: 1px solid transparent; background: transparent;
  font: inherit; font-size: 12px; padding: 3px 4px; border-radius: 3px;
}
.ktable--grid input:hover, .ktable--grid select:hover { border-color: #c9c9c9; }
/* фокус в редактируемой таблице обязан быть заметнее обычной рамки */
.ktable--grid input:focus, .ktable--grid select:focus { outline: 2px solid var(--k-dark); outline-offset: -2px; border-color: var(--k-dark); background: #fff; }
.ktable--grid input[type="date"], .ktable--grid input[type="datetime-local"] { min-width: 118px; }
.kuat-add { margin-top: 6px; }

.kuat-split { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 10px; align-items: start; }
@media (max-width: 1100px) { .kuat-split { grid-template-columns: minmax(0, 1fr); } }
.kuat-card { border: 1px solid var(--k-line); border-radius: 10px; background: var(--k-panel); padding: 10px; display: grid; gap: 6px; }
.kuat-photo {
  aspect-ratio: 4 / 3; background: #fff; border: 1px solid #c9c9c9;
  display: grid; place-items: center; overflow: hidden;
}
.kuat-photo img { width: 100%; height: 100%; object-fit: cover; }
.kuat-dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 8px; margin: 0; font-size: 12px; }
.kuat-dl dt { color: #666; }
.kuat-dl dd { margin: 0; text-align: right; font-weight: 700; }

/* календарь планировщика */
.kuat-planner { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 10px; align-items: start; }
@media (max-width: 1000px) { .kuat-planner { grid-template-columns: minmax(0, 1fr); } }
.kuat-day { cursor: pointer; position: relative; }
.kuat-day.has { background: var(--k-accent); color: var(--k-on, #000); font-weight: 700; }
.kuat-day.now { outline: 1px solid var(--k-line); outline-offset: -2px; }
.kuat-day.sel { background: var(--k-bar); color: var(--k-onbar); }
.kuat-day i { display: block; font-style: normal; font-size: 9px; }
.kuat-daycard { border: 1px solid var(--k-line); background: var(--k-panel); padding: 8px; margin-top: 8px; }
.kuat-daycard ul { margin: 4px 0 6px 16px; font-size: 12px; }

/* заявка на перевозку */
.kuat-trip { display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 10px; align-items: start; }
@media (max-width: 1200px) { .kuat-trip { grid-template-columns: minmax(0, 1fr); } }
.kuat-form { border: 1px solid var(--k-line); border-radius: 10px; background: var(--k-panel); padding: 10px; }
.kuat-grp { border-top: 1px solid #c9c9c9; padding: 6px 0; }
.kuat-grp > b { display: block; font-size: 11.5px; margin-bottom: 4px; }
.kuat-f { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 6px; align-items: center; margin-bottom: 3px; }
.kuat-f > span { font-size: 11px; color: #555; }
.kuat-f input, .kuat-f select { width: 100%; border: 1px solid #9a9a9a; border-radius: 4px; font: inherit; font-size: 12px; padding: 3px 5px; }

/* график рейсов */
.kuat-td { padding: 2px; vertical-align: top; }
.kuat-cell {
  display: block; width: 100%; min-height: 40px; border: 1px dashed #c2c2c2; background: #fff;
  font: inherit; font-size: 11px; text-align: left; padding: 3px 5px; cursor: pointer;
  transition: background 320ms cubic-bezier(.22, 1, .36, 1), transform 500ms cubic-bezier(.22, 1, .36, 1);
}
.kuat-cell:hover { background: var(--k-accent); color: var(--k-on, #000); transform: translateY(-2px); }
.kuat-cell.has { border: 1px solid var(--k-line); background: var(--k-accepted); }
.kuat-cell b { display: block; }
.kuat-cell span { color: #555; }

/* запрос запчастей */
.kuat-req { border: 1px solid var(--k-line); border-radius: 10px; background: var(--k-panel); padding: 12px 14px; margin-top: 8px; }
.kuat-req__tag {
  display: inline-block; background: var(--k-accent); color: var(--k-on, #000);
  border: 1px solid var(--k-line); padding: 2px 12px; font-weight: 700; letter-spacing: 0.04em; margin-bottom: 4px;
}

/* показатели */
.kuat-vrow > td { background: var(--k-panel); }
.kuat-vrow.is-on > td { background: var(--k-accent); color: var(--k-on, #000); }
.kuat-mrow > td { font-size: 11.5px; }
.kuat-mrow.is-year > td { border-top: 1px solid var(--k-line); font-weight: 700; }
.kuat-neg { color: #B00020; }

/* ---- результаты поиска предложений (API v1, этап 1): контейнер, плашка, пагинация ---- */
.kres { min-width: 0; }
.kres-bar, .kres-status {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px;
  margin: 0 0 8px; padding: 6px 10px; border-radius: 6px; font-size: 12.5px;
}
.kres-bar { background: var(--k-selected); color: #1F2A3C; }
.kres-bar span { flex: 1 1 180px; font-weight: 700; }
.kres-status { color: #555; }
.kres-status--err { background: #FBE9E9; color: #8A1C1C; }
.kres__count { margin: 0 0 6px; }
.kres__sep td { background: #F2F2F2; font-weight: 700; font-size: 12px; padding: 6px 7px; }
.kres-pager { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
.kres-pager__n { font-size: 12px; color: #666; }
.kres-btn.kbtn--sm { min-height: 44px; min-width: 44px; padding: 8px 14px; }
.kres-btn:disabled { opacity: .45; cursor: not-allowed; transform: none; }
/* тач-цели экранов результатов классами, без инлайновых style: kres-btn — любая kbtn (в т.ч. «Найти», «выбрать»,
   «правка», «удалить»), kres-ctl — селекты и поля фильтров рядом с результатами */
.kbtn.kres-btn, select.kres-ctl, input.kres-ctl { min-height: 44px; min-width: 44px; }
.kbtn.kres-btn { display: inline-flex; align-items: center; justify-content: center; }
@media (max-width: 600px) {
  :is(#app, body) .kbtn.kres-btn, :is(#app, body) .kres-ctl { min-height: 44px; min-width: 44px; }
  .kres-pager, .kres-bar, .kres-status { gap: 8px; }
  .kres-pager__n { flex: 1 1 100%; }
}
.kshopf__reset[hidden] { display: none; }

/* смена пароля и прочие действия строкой: кнопка и пояснение (чистый старт 16.09) */
.kline--acts { grid-template-columns: auto minmax(0, 1fr); gap: 8px; margin: 4px 0 8px; }
@media (max-width: 600px) { .kline--acts { grid-template-columns: minmax(0, 1fr); } }

/* «О нас» и «Контакты»: отступ таблицы и кнопки вместо прежних инлайн-стилей (приёмка 17.09) */
.kinfo-gap { margin-top: 8px; }
/* Возврат и получение заказа (поток KOP, ревью «право» 17.09): вместо инлайн-стилей окна возврата, цели не меньше 44 px */
.kret-gap { margin-top: 8px; }
.kret-attach { display: inline-grid; place-items: center; min-height: 44px; margin-top: 8px; }
.kret-file { grid-template-columns: minmax(0, 1fr) auto; }
.kret-received { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 8px 0; }
.kret-received .kbtn { min-height: 44px; }

/* ---------------- раскладки строк и блоков классами вместо инлайн-стилей (проверка 26.09, L24) ----------------
   Сетки были атрибутом style в classic.js, classic-crm.js и uat.js: медиазапрос их не перебивает, и на телефоне
   четыре-пять колонок сжимали поля до 12–40 px, поле поиска перекрывалось кнопкой (M26). Ниже 600 px строки
   фильтров и кнопок идут в две колонки, поле поиска — во всю строку. */
.kline--c1 { grid-template-columns: minmax(0, 1fr); }
.kline--c2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kline--c3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kline--c4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kline--c5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.kline--c3a { grid-template-columns: repeat(3, minmax(0, 1fr)) auto; }
.kline--c4a { grid-template-columns: repeat(4, minmax(0, 1fr)) auto; }
.kline--start { grid-template-columns: auto; justify-content: start; }
.kline--lead { grid-template-columns: auto minmax(0, 1fr); }
.kline--tail { grid-template-columns: minmax(0, 1fr) auto; }
.kline--mid { grid-template-columns: auto minmax(0, 1fr) auto; }
.kline--pager { grid-template-columns: auto auto minmax(0, 1fr); }
.kline--week { grid-template-columns: auto auto minmax(0, 1fr) auto; }
.kline--qty { grid-template-columns: 70px minmax(0, 1fr); }
.kline--chips { display: flex; flex-wrap: wrap; gap: 8px; }
/* «Заказы» покупателя: период, даты «Своего периода» (.kperiod, скрыты, пока выбран готовый период — Б8, 06.10), гос. номер,
   режим, поиск — в строку; не помещаются — переносятся */
.kline--ord { display: flex; flex-wrap: wrap; }
.kline--ord > select { flex: 0 1 150px; width: auto; min-width: 0; }
.kline--ord > input { flex: 1 1 160px; width: auto; min-width: 0; }
.kline--ord > .kbtn, .kline--ord > .kperiod { flex: 0 0 auto; }
.kline--cat { grid-template-columns: minmax(0, 1fr) minmax(0, 240px) auto auto; }
.kline--addr { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) auto; }
.kline--f2 { grid-template-columns: repeat(2, minmax(0, 200px)) auto minmax(0, 1fr); }
.kline--f2x { grid-template-columns: repeat(2, minmax(0, 160px)) auto auto minmax(0, 1fr); }
.kline--f3 { grid-template-columns: repeat(3, minmax(0, 190px)) auto minmax(0, 1fr); }
.kline--task { grid-template-columns: minmax(0, 1fr) 120px 90px 90px; }
.krow--3 { grid-template-columns: minmax(0, 1fr) auto auto; }
.kcard__acts--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kcard__acts--end { grid-auto-flow: column; justify-content: end; }
.kcard__acts--split { grid-auto-flow: column; justify-content: space-between; align-items: center; }
.kgrey--c2, .kgrey--c3 { display: grid; gap: 4px 8px; margin-bottom: 4px; }
.kgrey--c2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kgrey--c3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kgrey--c3 > :last-child { text-align: right; }
.kgrid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.kgrid4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.kgrid21 { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 8px; }
.kboard { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; align-items: start; }
.kboard > .kpos { min-height: 220px; }
.kring { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px; align-items: center; margin-top: 6px; }
.ktasks { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 12px; align-items: center; }
.kcal-split { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 10px; align-items: start; }
.ktiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.kbtn.ktile { min-height: 150px; font-size: 16px; background: var(--k-dark); color: #fff; border-color: #000; }
.kbtn.ktile:hover { background: #000; color: #fff; }
.kstack { display: grid; gap: 8px; }
.kform--narrow { max-width: 720px; }
.knote-area { width: 100%; min-height: 120px; border: 1px solid #000; border-radius: 4px; padding: 6px; }
.kbtn--file { display: inline-grid; place-items: center; }
.kbtn--link { display: inline-grid; place-items: center; padding: 4px 12px; }
.kcap { text-transform: capitalize; }
.kin-num { text-align: right; }
.kin-qty { max-width: 64px; }
.kin-full { width: 100%; }
.kin-w56 { width: 56px; }
.kin-w64 { width: 64px; }
.kmt4 { margin-top: 4px; }
.kmt6 { margin-top: 6px; }
.kmt8 { margin-top: 8px; }
.kmt10 { margin-top: 10px; }
.kmb4 { margin-bottom: 4px; }
.kmb6 { margin-bottom: 6px; }
.kmb8 { margin-bottom: 8px; }
.kmy6 { margin-top: 6px; margin-bottom: 6px; }
/* столбики графиков и полоса выполнения: в атрибуте style — только вычисляемая высота или ширина */
.kbars { display: flex; align-items: flex-end; gap: 2px; height: 90px; }
.kbars__i { flex: 1; display: block; background: var(--k-dark); }
.kbars__axis { display: flex; justify-content: space-between; font-size: 10px; color: #777; }
.kmonths { display: flex; align-items: flex-end; gap: 10px; height: 140px; }
.kmonths__m { flex: 1; min-width: 0; display: grid; grid-template-rows: 1fr auto; align-items: end; }
.kmonths__m > .kmini { text-align: center; }
.kmonths__bars { display: flex; align-items: flex-end; gap: 2px; height: 110px; }
.kmonths__i { flex: 1; display: block; background: var(--k-accent); border: 1px solid #000; }
.kmonths__i--closed { background: var(--k-dark); }
.kprog { display: block; height: 10px; background: #eee; border: 1px solid #999; }
.kprog > i { display: block; height: 100%; background: var(--k-accent); }
.kth-34 { width: 34px; }
.kth-80 { width: 80px; }
.kth-90 { width: 90px; }
.kth-190 { width: 190px; }
/* УАТ «Показатели»: раскрыть помесячные строки машины — иконка с подписью для чтения с экрана (L23) */
/* аудит 28.09, N41: общее .kicon-btn (partner-revisions.css, 30 px) идёт позже и сужало кнопку до 30 × 44 на любой ширине —
   правило сильнее; поля 2 px сверху и снизу — между кнопками соседних строк 9 px (было 5: поля ячейки 2 + 2 и линия 1) */
.kbtn.kicon-btn.kuat-exp { min-width: 44px; min-height: 44px; margin-block: 2px; }
@media (max-width: 600px) {
  .kline:is(.kline--c3, .kline--c4, .kline--c5, .kline--c3a, .kline--c4a, .kline--cat, .kline--addr, .kline--f2, .kline--f2x, .kline--f3, .kline--task, .kline--week, .kline--pager) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .kline:is(.kline--c3, .kline--c5, .kline--c3a, .kline--task) > :last-child:nth-child(odd) { grid-column: 1 / -1; }
  .kline:is(.kline--f2, .kline--f2x, .kline--f3, .kline--pager, .kline--week) > span:empty { display: none; }
  .kline:is(.kline--cat, .kline--addr) > input, .kline--cat > select, .kline--week > .kmini, .kline--pager > .kmini { grid-column: 1 / -1; }
  /* «Заказы»: период — во всю строку, под ним даты «Своего периода» (Б8); гос. номер и режим — в строку; поле поиска и
     «поиск» — последней строкой. Места считаются с конца строки: блок дат стоит вторым и бывает скрыт */
  .kline.kline--ord { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .kline--ord > select, .kline--ord > input { width: 100%; }
  .kline--ord > :first-child, .kline--ord > .kperiod { grid-column: 1 / -1; }
  .kline--ord > :nth-last-child(4), .kline--ord > :nth-last-child(3) { grid-column: span 3; }
  .kline--ord > :nth-last-child(2) { grid-column: span 4; }
  .kline--ord > :nth-last-child(1) { grid-column: span 2; }
  .kline--lead { grid-template-columns: minmax(0, 1fr); }
  .kgrid2, .kgrid21, .kboard, .ktasks, .kcal-split, .kgrey--c3 { grid-template-columns: minmax(0, 1fr); }
  .kgrey--c3 > :last-child { text-align: left; }
  .kgrid4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kboard > .kpos { min-height: 0; }
  .kbtn.ktile { min-height: 96px; font-size: 14px; }
  /* поля и списки классических видов не ниже 44 px (правило 8; были 26–30 px, проверка 26.09, L21) */
  body.classic :is(#kwork, .modal) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not([type="range"]):not([type="color"]), select) { min-height: 44px; }
}