/* Раздел «Мои клиенты» (этап 4a CRM): меню раздела, таблица /clients, форма клиента, заглушка /client/{id}.
   Строгий B2B: тонкие границы, плотные строки, радиус не больше 4px, серая палитра и один акцент. */
:root {
    --cls-text: #1d1d1f;
    --cls-muted: #6e6e73;
    --cls-line: #dcdce0;
    --cls-bg: #f5f5f7;
    --cls-accent: #0068d0;
    --cls-green: #2e8b47;
    --cls-yellow: #d9a400;
    --cls-red: #d0342c;
    --cls-orange: #d9730d;
    --cls-grey: #c7c7cc;
}

/* ---------- раскладка: меню слева, содержимое справа ---------- */
@media (min-width: 900px) {
    .container:has(> .cls-nav) {
        display: flex; flex-direction: row; flex-wrap: nowrap; align-items: flex-start; justify-content: flex-start;
        gap: 0; max-width: none; margin: 0; width: 100%; padding: 0 32px 0 252px; box-sizing: border-box;
    }
    .container:has(> .cls-nav) > :not(.cls-nav):not(script):not(style):not(link) { flex: 1 1 auto; min-width: 0; }
}
/* телефон и планшет: поля страницы 16px слева и справа */
@media (max-width: 899px) {
    .container:has(> .cls-nav) { width: 100%; max-width: none; margin: 0; padding: 0 16px; box-sizing: border-box; }
}

/* ---------- меню раздела ---------- */
.cls-nav {
    box-sizing: border-box; font-family: inherit; color: var(--cls-text);
    background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; padding: 8px 0;
}
.cls-nav-title {
    padding: 6px 14px 8px; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--cls-muted);
}
.cls-nav-link {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    padding: 8px 14px; font-size: 14px; line-height: 1.3; color: var(--cls-text); text-decoration: none;
    border-left: 2px solid transparent;
}
.cls-nav-link[hidden] { display: none; }
.cls-nav-link:hover { background: var(--cls-bg); color: var(--cls-text); text-decoration: none; }
.cls-nav-link.on { border-left-color: var(--cls-accent); color: var(--cls-accent); font-weight: 600; background: var(--cls-bg); }
.cls-nav-badge {
    min-width: 18px; padding: 1px 5px; box-sizing: border-box; border-radius: 4px;
    background: var(--cls-accent); color: #fff; font-size: 11px; font-weight: 600; text-align: center; line-height: 16px;
}
.cls-nav-badge[hidden] { display: none; }
@media (min-width: 900px) {
    /* меню закреплено слева от края экрана, от шапки сайта (60px) до низа страницы */
    .cls-nav {
        position: fixed; left: 0; top: 60px; bottom: 0; z-index: 5; width: 220px;
        border-width: 0 1px 0 0; border-radius: 0; padding: 14px 0; overflow-y: auto;
    }
}
@media (max-width: 899px) {
    .cls-nav { display: flex; flex-wrap: wrap; gap: 6px; width: 100%; margin: 10px 0 12px; padding: 8px; }
    .cls-nav-title { width: 100%; padding: 0 2px 2px; }
    .cls-nav-link { padding: 6px 10px; font-size: 13px; border: 1px solid var(--cls-line); border-radius: 4px; }
    .cls-nav-link.on { border-color: var(--cls-accent); }
}

/* ---------- страница ---------- */
.cls { box-sizing: border-box; width: 100%; color: var(--cls-text); font-size: 14px; padding-bottom: 40px; }
.cls *, .cls *::before, .cls *::after { box-sizing: border-box; }
.cls-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 4px 0 12px; }
.cls-head-btns { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.cls-head-btns [hidden] { display: none; }
/* вкладки «Список» / «Связи» (как на /my-company) */
.cls-tab:focus:not(:focus-visible) { outline: none; }
.cls-tab-n { margin-left: 6px; color: var(--cls-muted); font-weight: 400; }
.cls-tab-n:empty { display: none; }
.cls-head-btns[hidden], #clsPaneList[hidden], #clsPaneLinks[hidden], #clsPaneReq[hidden], #clsReqTab[hidden], #clsAtt[hidden], .cls-rq-msg[hidden] { display: none; }
.cls-h1 { margin: 0; font-size: 22px; font-weight: 600; letter-spacing: -.01em; }
.cls-count { color: var(--cls-muted); font-size: 13px; font-weight: 400; margin-left: 6px; }
.cls-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 32px; padding: 0 14px;
    border: 1px solid var(--cls-line); border-radius: 4px; background: #fff; color: var(--cls-text);
    font: inherit; font-size: 13px; cursor: pointer; text-decoration: none; white-space: nowrap;
}
.cls-btn:hover { background: var(--cls-bg); text-decoration: none; color: var(--cls-text); }
.cls-btn-primary { background: var(--cls-accent); border-color: var(--cls-accent); color: #fff; }
.cls-btn-primary:hover { background: #005bb6; color: #fff; }
.cls-btn:disabled { opacity: .5; cursor: default; }

/* панель поиска и фильтров */
.cls-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.cls-input, .cls-select {
    height: 32px; padding: 0 10px; border: 1px solid var(--cls-line); border-radius: 4px; background: #fff;
    font: inherit; font-size: 13px; color: var(--cls-text); outline: none;
}
.cls-input:focus, .cls-select:focus { border-color: var(--cls-accent); }
.cls .cls-input, .cls .cls-select { margin: 0; box-sizing: border-box; }
.cls-bar .cls-search { flex: 1 1 240px; min-width: 0; }
.cls-bar .cls-select { flex: 0 1 200px; min-width: 0; }

/* таблица */
.cls-table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--cls-line); }
.cls-table th {
    padding: 8px 10px; text-align: left; white-space: normal; user-select: none; cursor: pointer;
    font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--cls-muted);
    background: var(--cls-bg); border-bottom: 1px solid var(--cls-line);
}
.cls-table th:hover { color: var(--cls-text); }
.cls-table th .cls-sort { display: inline-block; width: 10px; margin-left: 3px; color: var(--cls-accent); }
.cls-table th.num, .cls-table td.num { text-align: right; }
.cls-table td { padding: 7px 10px; border-bottom: 1px solid var(--cls-line); vertical-align: middle; line-height: 1.35; }
.cls-table tbody tr { cursor: pointer; }
.cls-table tbody tr:hover td { background: #fafafb; }
.cls-table tbody tr:last-child td { border-bottom: 0; }
.cls-name { font-weight: 600; }
.cls-select[hidden] { display: none; }
.cls-sub { color: var(--cls-muted); font-size: 12px; }
.cls-crops { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cls-empty { padding: 36px 16px; text-align: center; color: var(--cls-muted); background: #fff; border: 1px solid var(--cls-line); }
.cls-edit {
    width: 32px; height: 32px; padding: 0; border: 1px solid transparent; border-radius: 4px; background: none;
    color: var(--cls-muted); cursor: pointer; font-size: 13px;
}
.cls-edit:hover { border-color: var(--cls-line); color: var(--cls-text); background: #fff; }
.cls-edit svg { width: 14px; height: 14px; vertical-align: middle; }

/* таблица не шире своего блока: длинные заголовки переносятся, остаток — прокрутка внутри блока */
@media (min-width: 701px) {
    .cls div:has(> table.cls-table) { max-width: 100%; overflow-x: auto; }
}
.cls-table td { overflow-wrap: anywhere; }

/* статус воронки */
.cls-status {
    display: inline-block; padding: 1px 7px; border: 1px solid var(--cls-line); border-radius: 4px;
    font-size: 12px; line-height: 18px; white-space: nowrap; color: var(--cls-text); background: #fff;
}
.cls-status[data-s="client"], .cls-status[data-s="repeat"] { border-color: var(--cls-accent); color: var(--cls-accent); }

/* рейтинг — три кружка */
.cls-rate { display: inline-flex; gap: 4px; vertical-align: middle; }
.cls-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--cls-grey); flex: 0 0 auto; }
.cls-dot[data-v="1"] { background: var(--cls-green); }
.cls-dot[data-v="2"] { background: var(--cls-yellow); }
.cls-dot[data-v="3"] { background: var(--cls-red); }

/* телефон: строки — карточки */
@media (max-width: 700px) {
    .cls-table, .cls-table tbody { display: block; border: 0; background: none; }
    .cls-table thead { display: none; }
    .cls-table tr {
        display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; padding: 10px 12px; margin-bottom: 8px;
        background: #fff; border: 1px solid var(--cls-line); border-radius: 4px;
    }
    .cls-table td { display: block; padding: 0; border: 0; text-align: left; min-width: 0; }
    .cls-table td.num { text-align: left; }
    .cls-table td[data-l]:not(:empty)::before {
        content: attr(data-l) ': '; color: var(--cls-muted); font-size: 11px; text-transform: uppercase; letter-spacing: .04em;
    }
    .cls-table td.cls-c-name { grid-column: 1; }
    .cls-table td.cls-c-act { grid-column: 2; grid-row: 1; text-align: right; }
    .cls-table td.cls-c-wide { grid-column: 1 / -1; }
    .cls-table td.cls-c-wide:empty { display: none; }
    /* /prices: поля под названием на всю ширину — иначе колонка с кнопками забирала место и подписи рвались посреди слова */
    .prc-table td:not(.cls-c-name):not(.cls-c-act) { grid-column: 1 / -1; }
    /* название тоже на всю ширину, «Переименовать / Удалить» — строкой внизу карточки, иначе кнопки сжимали название до 54px */
    .prc-table td.cls-c-name { grid-column: 1 / -1; }
    .prc-table td.cls-c-act { grid-column: 1 / -1; grid-row: auto; display: flex; gap: 8px; }
    .prc-table td.cls-c-act .cls-btn { flex: 1 1 0; }
    .cls-crops { max-width: none; white-space: normal; }
    .cls-bar .cls-select { flex: 1 1 140px; }
}

/* общие поля сайта внутри раздела: глобальный input[type=search] без рамки и скруглённый зелёный epa_select — к виду раздела */
.cls input[type="search"].cls-input { height: 32px; padding: 0 10px; border: 1px solid var(--cls-line); border-radius: 4px; background: #fff; font-size: 13px; }
.cls input[type="search"].cls-input:focus { border-color: var(--cls-accent); }
.cls .es-btn { min-height: 32px; height: 32px; padding: 0 8px 0 10px; border: 1px solid var(--cls-line); border-radius: 4px; background: #fff; font-size: 13px; box-shadow: none; }
.cls .es-wrap.set .es-btn { border-color: var(--cls-line); }
.cls .es-wrap.open .es-btn, .cls .es-btn:focus-visible { border-color: var(--cls-accent); box-shadow: 0 0 0 2px rgba(0, 104, 208, .15); }
.cls .es-btn svg { width: 14px; height: 14px; }
.cls-bar .es-wrap { width: auto !important; flex: 0 1 200px; min-width: 0; }
.mkt-bar-f .es-wrap { flex: 0 1 220px; }
@media (max-width: 700px) {
    .cls-bar .es-wrap { flex: 1 1 140px; }
    .mkt-bar-f .es-wrap { flex: 1 1 100%; }
}

/* ---------- модалка формы ---------- */
.cls-modal { position: fixed; inset: 0; z-index: 10000; display: flex; align-items: flex-start; justify-content: center; padding: 40px 12px; background: rgba(29, 29, 31, .4); overflow-y: auto; }
.cls-modal[hidden] { display: none; }
.cls-dialog { width: 100%; max-width: 640px; background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; color: var(--cls-text); font-size: 14px; box-shadow: 0 8px 24px rgba(0, 0, 0, .12); }
.cls-dialog-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid var(--cls-line); }
.cls-dialog-head h2 { margin: 0; font-size: 16px; font-weight: 600; }
.cls-x { width: 28px; height: 28px; border: 0; background: none; font-size: 20px; line-height: 1; color: var(--cls-muted); cursor: pointer; border-radius: 4px; }
.cls-x:hover { background: var(--cls-bg); color: var(--cls-text); }
.cls-form { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 14px; padding: 16px; }
.cls-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cls-field.wide { grid-column: 1 / -1; }
.cls-field label, .cls-field .cls-lbl { font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--cls-muted); }
.cls-field .cls-input, .cls-field .cls-select { width: 100%; }
.cls-field textarea.cls-input { height: auto; min-height: 70px; padding: 7px 10px; resize: vertical; }
.cls-field.err .cls-input { border-color: var(--cls-red); }
.cls-err { color: var(--cls-red); font-size: 12px; }
.cls-err:empty { display: none; }
.cls-dialog-foot { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--cls-line); }
.cls-form-msg { margin-right: auto; align-self: center; color: var(--cls-red); font-size: 13px; }
/* модалка вне .cls: свои размеры полей, без выхода за край окна */
.cls-modal, .cls-modal *, .cls-modal *::before, .cls-modal *::after { box-sizing: border-box; }
.cls-modal .cls-input, .cls-modal .cls-select { margin: 0; max-width: 100%; height: 36px; }
/* строки позиций КП и сделки (.cc-r-f, .dl-r) задают 32px — в модалке как остальные поля */
.cls-modal .cc-r-f .cls-input, .cls-modal .dl-r .cls-select { height: 36px; }
.cls-modal textarea.cls-input { height: auto; min-height: 76px; line-height: 1.4; }
.cls-modal input[type="search"].cls-input { border: 1px solid var(--cls-line); border-radius: 4px; background: #fff; }
.cls-modal .es-wrap { width: 100% !important; }
.cls-modal .es-btn { min-height: 36px; height: 36px; padding: 0 8px 0 10px; border: 1px solid var(--cls-line); border-radius: 4px; background: #fff; font-size: 13px; box-shadow: none; }
.cls-modal .es-wrap.open .es-btn, .cls-modal .es-btn:focus-visible { border-color: var(--cls-accent); box-shadow: 0 0 0 2px rgba(0, 104, 208, .15); }
@media (max-width: 560px) {
    /* 16px — iOS не увеличивает страницу при фокусе, поля одной высоты и не наезжают друг на друга */
    .cls-modal .cls-input, .cls-modal .cls-select, .cls-modal .es-btn, .cls-modal .cls-rate-btn,
    .cls-modal .cc-r-f .cls-input, .cls-modal .dl-r .cls-select { font-size: 16px; height: 40px; min-height: 40px; }
    .cls-modal .cls-dialog-foot .cls-btn { height: 40px; min-height: 40px; }
    .cls-modal textarea.cls-input { height: auto; min-height: 88px; padding: 8px 10px; }
    .cls-modal .cls-field { gap: 6px; }
    .cls-modal .cls-form { gap: 14px; }
    .cls-modal { padding: 0; }
    .cls-dialog { min-height: 100%; border: 0; border-radius: 0; }
    .cls-form { grid-template-columns: 1fr; }
}

/* окна подтверждения и сообщений (views/layout/epa_dialogs.php) — в разделе CRM в том же строгом стиле */
body .epa-dlg-overlay { background: rgba(29, 29, 31, .4); -webkit-backdrop-filter: none; backdrop-filter: none; }
body .epa-dlg { max-width: 420px; padding: 16px; border: 1px solid var(--cls-line); border-radius: 4px; color: var(--cls-text); box-shadow: 0 8px 24px rgba(0, 0, 0, .12); }
body .epa-dlg-msg { font-size: 14px; }
body .epa-dlg-title { font-size: 16px; font-weight: 600; }
body .epa-dlg-input { height: 36px; margin-top: 12px; padding: 0 10px; border: 1px solid var(--cls-line); border-radius: 4px; font-size: 14px; }
body .epa-dlg-input:focus { border-color: var(--cls-accent); }
body .epa-dlg-btns { margin-top: 16px; }
body .epa-dlg-btn { min-width: 0; height: 32px; padding: 0 14px; border: 1px solid var(--cls-line); border-radius: 4px; font-size: 13px; font-weight: 400; color: var(--cls-text); }
body .epa-dlg-btn:hover { border-color: var(--cls-accent); }
body .epa-dlg-btn--ok { border-color: var(--cls-accent); background: var(--cls-accent); color: #fff; }
body .epa-dlg-btn--danger { border-color: var(--cls-red); background: var(--cls-red); color: #fff; }
body .epa-dlg-btn--ok:hover, body .epa-dlg-btn--danger:hover { filter: brightness(.92); }
body .epa-dlg-btn:focus-visible { outline: 2px solid var(--cls-accent); outline-offset: 2px; }
@media (max-width: 560px) {
    body .epa-dlg-overlay { padding: 12px; }
    body .epa-dlg-input { height: 40px; font-size: 16px; }
    body .epa-dlg-btn { flex: 1; height: 40px; font-size: 16px; }
}

/* кружки рейтинга в форме */
.cls-rate-edit { display: flex; flex-wrap: wrap; gap: 8px; }
.cls-rate-btn {
    display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 10px;
    border: 1px solid var(--cls-line); border-radius: 4px; background: #fff; font: inherit; font-size: 13px; color: var(--cls-text); cursor: pointer;
}
.cls-rate-btn:hover { background: var(--cls-bg); }
.cls-rate-btn .cls-dot { width: 14px; height: 14px; }
.cls-rate-btn .cls-rate-val { color: var(--cls-muted); }
.cls-hint { color: var(--cls-muted); font-size: 12px; }

/* реквизиты и подсказки DaData в форме клиента */
.cls-req { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 14px; padding: 12px; border: 1px solid var(--cls-line); border-radius: 4px; background: var(--cls-bg); }
.cls-req-head { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.cls-req-head .cls-lbl { font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--cls-muted); }
.cls-field[data-f="name"], .cls-field[data-f="req_inn"] { position: relative; }
.cls-sug { position: absolute; top: 100%; left: 0; right: 0; z-index: 20; display: flex; flex-direction: column; margin-top: 2px; max-height: 280px; overflow-y: auto; background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; box-shadow: 0 4px 12px rgba(0, 0, 0, .12); }
.cls-sug[hidden], .cls-sug:empty { display: none; }
.cls-sug-opt { display: flex; flex-direction: column; gap: 2px; width: 100%; padding: 8px 10px; border: 0; border-bottom: 1px solid var(--cls-line); background: #fff; color: var(--cls-text); font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.cls-sug-opt:last-child { border-bottom: 0; }
.cls-sug-opt:hover, .cls-sug-opt:focus { background: var(--cls-bg); outline: none; }
.cls-sug-opt small { color: var(--cls-muted); font-size: 12px; }
.cls-sug-opt small b { color: var(--cls-red); font-weight: 600; }
.cls-req-warn { padding: 6px 8px; border-left: 3px solid var(--cls-red); background: #fdf0ef; color: var(--cls-red); font-size: 12px; }
.cls-req-warn[hidden] { display: none; }
@media (max-width: 560px) {
    /* цель касания ≥40px; 16px в полях — iOS не увеличивает страницу при фокусе */
    .cls .cls-btn, .cls .cls-select, .cls .cls-input, .cls input[type="search"].cls-input, .cls .es-btn { height: 40px; min-height: 40px; }
    .cls .cls-select, .cls .cls-input, .cls input[type="search"].cls-input { font-size: 16px; }
    .cls textarea.cls-input { height: auto; }
    .cls .cls-tab { min-height: 40px; }
    .cls .cls-edit { width: 40px; height: 40px; }
    /* меню раздела — одна строка чипов 40px с прокруткой внутри блока (раньше 5 рядов по 54px: min-height + padding + рамка в content-box) */
    .cls-nav { flex-wrap: nowrap; align-items: center; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; padding: 6px 8px; }
    .cls-nav::-webkit-scrollbar { display: none; }
    .cls-nav-title { width: auto; flex: none; padding: 0 4px 0 2px; }
    .cls-nav-link { box-sizing: border-box; flex: none; height: 40px; min-height: 40px; padding: 0 12px; white-space: nowrap; }
    .cls-back { display: inline-flex; align-items: center; min-height: 40px; margin: 0 0 6px; }
    .rt-c { min-height: 40px; }
    .cls .rt-sel { height: 40px; }
    .container:has(> .cls-nav) .epa-plus-btn { width: 40px; height: 40px; min-width: 40px; }
    .cls-req { grid-template-columns: 1fr; gap: 14px; padding: 10px; }
    .cls-sug-opt { padding: 10px 12px; font-size: 15px; }
}

/* ---------- /client/{id} ---------- */
.cls-back { display: inline-block; margin: 4px 0 10px; color: var(--cls-accent); font-size: 13px; text-decoration: none; }
.cls-back:hover { text-decoration: underline; }
.cls-card { background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; padding: 16px; }
.cls-card-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 12px; }
.cls-props { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px 16px; margin: 0; }
.cls-props dt { font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--cls-muted); }
.cls-props dd { margin: 2px 0 0; word-break: break-word; }
.cls-note { margin-top: 14px; color: var(--cls-muted); font-size: 13px; }

/* ---------- карточка клиента (этап 4b): шапка, вкладки, контакты, визиты ---------- */
.cls-card-head .cls-h1 { flex: 1 1 auto; min-width: 0; word-break: break-word; }
.cls-hstatus { flex: 0 0 auto; }
.cls-hstatus[data-s="client"], .cls-hstatus[data-s="repeat"] { border-color: var(--cls-accent); color: var(--cls-accent); }
.cls-hrates { margin-bottom: 12px; }
.cls-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 14px; }
.cls-actions .cls-form-msg { margin-right: 0; }
.cls-actions [hidden] { display: none; }

/* вкладки */
.cls-tabs { display: flex; gap: 0; margin: 16px 0 0; border-bottom: 1px solid var(--cls-line); overflow-x: auto; scrollbar-width: none; }
.cls-tabs[hidden] { display: none; }
.cls-tabs::-webkit-scrollbar { display: none; }
/* на ПК вкладки переносятся на вторую строку: при боковом меню и ширине 1263–1349 последние уходили за край без полосы прокрутки */
@media (min-width: 701px) { .cls-tabs { flex-wrap: wrap; overflow-x: visible; } }
.cls-tab {
    flex: 0 0 auto; padding: 6px 14px; margin-bottom: -1px; border: 0; border-bottom: 2px solid transparent; background: none;
    font: inherit; font-size: 13px; line-height: 18px; color: var(--cls-muted); cursor: pointer; white-space: nowrap;
}
.cls-tab:hover { color: var(--cls-text); }
.cls-tab.on { color: var(--cls-accent); border-bottom-color: var(--cls-accent); font-weight: 600; }
.cls-panel { padding-top: 14px; }
.cls-panel[hidden] { display: none; }
.cls-soon { padding: 36px 16px; text-align: center; color: var(--cls-muted); background: #fff; border: 1px dashed var(--cls-line); border-radius: 4px; }

/* разделы внутри вкладки */
.cls-sec-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.cls-sec {
    margin: 18px 0 8px; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--cls-muted);
}
.cls-sec:first-child { margin-top: 0; }
.cls-sec-n { margin-left: 6px; color: var(--cls-text); font-weight: 400; letter-spacing: 0; }
.cls-legacy {
    margin: 0 0 10px; padding: 8px 12px; font-size: 13px; color: var(--cls-muted);
    background: var(--cls-bg); border: 1px solid var(--cls-line); border-radius: 4px;
}

/* таблицы без перехода по строке */
.cls-table.cls-static tbody tr { cursor: default; }
.cls-table.cls-static tbody tr:hover td { background: none; }
.cls-table.cls-static tbody tr.cls-click { cursor: pointer; }
.cls-table.cls-static tbody tr.cls-click:hover td { background: #fafafb; }
.cls-table td.cls-c-act { white-space: nowrap; text-align: right; width: 1%; }
.cls-c-act .cls-edit + .cls-edit { margin-left: 2px; }
.cls-c-act .cls-coop-end { margin-left: 6px; color: var(--cls-red); }
@media (max-width: 560px) { .cls-c-act .cls-coop-end { height: 40px; font-size: 16px; white-space: normal; } }
.cls-c-act .cls-edit[data-ct-del]:hover { color: var(--cls-red); }
.cls-sub-i { color: var(--cls-muted); font-size: 12px; white-space: nowrap; }

/* роль контакта и статусы */
.cls-role, .cls-st {
    display: inline-block; padding: 0 6px; border: 1px solid var(--cls-line); border-radius: 4px;
    font-size: 11px; font-weight: 600; letter-spacing: .04em; line-height: 18px; white-space: nowrap; color: var(--cls-muted); background: #fff;
}
.cls-role[data-r="lpr"] { border-color: var(--cls-accent); color: var(--cls-accent); }
.cls-role[data-r="lvr"] { color: var(--cls-text); }
.cls-st { font-weight: 400; letter-spacing: 0; font-size: 12px; }
.cls-st[data-s="open"], .cls-st[data-s="sent"] { border-color: var(--cls-accent); color: var(--cls-accent); }
.cls-st[data-s="review"] { border-color: var(--cls-orange); color: var(--cls-orange); }
.cls-st[data-s="approved"], .cls-st[data-s="closed"] { border-color: var(--cls-green); color: var(--cls-green); }
.cls-st[data-s="returned"] { border-color: var(--cls-red); color: var(--cls-red); }
.cls-st[data-s="draft"] { color: var(--cls-muted); }

/* свои выпадающие списки (тип личности, мышления, маркетинг) */
.cls-dd { position: relative; }
.cls-dd-btn {
    display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; height: 32px; padding: 0 10px;
    border: 1px solid var(--cls-line); border-radius: 4px; background: #fff; font: inherit; font-size: 13px; color: var(--cls-text);
    cursor: pointer; text-align: left;
}
.cls-dd-btn::after {
    content: ''; width: 6px; height: 6px; margin-top: -3px; flex: 0 0 auto;
    border-right: 1px solid var(--cls-muted); border-bottom: 1px solid var(--cls-muted); transform: rotate(45deg);
}
.cls-dd-btn:focus, .cls-dd-btn[aria-expanded="true"] { border-color: var(--cls-accent); outline: none; }
.cls-dd-btn[data-r=""] span { color: var(--cls-muted); }
.cls-dd-list {
    position: absolute; z-index: 5; top: calc(100% + 2px); left: 0; right: 0; margin: 0; padding: 4px 0; list-style: none;
    background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; box-shadow: 0 4px 12px rgba(0, 0, 0, .08);
}
.cls-dd-list[hidden] { display: none; }
.cls-dd-list li { padding: 7px 10px; font-size: 13px; cursor: pointer; }
.cls-dd-list li:hover, .cls-dd-list li:focus { background: var(--cls-bg); outline: none; }
.cls-dd-list li[aria-selected="true"] { color: var(--cls-accent); font-weight: 600; }

/* роль контакта — кнопки-переключатели, подсказка под ними */
.cls-roles { display: flex; flex-wrap: wrap; gap: 6px; }
.cls-role-opt {
    height: 32px; padding: 0 12px; border: 1px solid var(--cls-line); border-radius: 4px; background: #fff;
    font: inherit; font-size: 13px; color: var(--cls-text); cursor: pointer;
}
.cls-role-opt:hover { background: var(--cls-bg); }
.cls-role-opt:focus-visible { outline: 2px solid var(--cls-accent); outline-offset: 1px; }
.cls-role-opt[aria-checked="true"] { border-color: var(--cls-accent); background: var(--cls-accent); color: #fff; }
.cls-role-opt[data-v=""][aria-checked="false"] { color: var(--cls-muted); }
@media (max-width: 560px) {
    .cls-role-opt { flex: 1 1 auto; height: 40px; font-size: 15px; }
}

@media (max-width: 700px) {
    .cls-card { padding: 12px; }
    .cls-card-head .cls-h1 { flex-basis: 100%; font-size: 19px; }
    .cls-actions .cls-btn { flex: 1 1 auto; }
    .cls-tab { padding: 8px 10px; }
    .cls-table td.cls-c-act { width: auto; }
}

/* ---------- согласие на обработку ПДн (этап 4c): вкладка «Контакты» и страница подписанта /pd-consent ---------- */
.cls-pd { margin-top: 2px; font-size: 12px; line-height: 1.35; color: var(--cls-muted); }
.cls-pd[data-s="granted"] { color: var(--cls-green); }
.cls-pd[data-s="requested"] { color: var(--cls-accent); }
.cls-pd[data-s="refused"], .cls-pd[data-s="revoked"], .cls-pd[data-s="expired"] { color: var(--cls-red); }
.cls-pd-warn {
    margin: 0 0 12px; padding: 10px 12px; border: 1px solid var(--cls-red); border-left-width: 3px; border-radius: 4px;
    background: #fff; font-size: 13px; line-height: 1.4; color: var(--cls-text);
}
.cls-pd-list { display: flex; flex-direction: column; gap: 6px; }
.cls-pd-list .cls-btn { justify-content: flex-start; width: 100%; text-align: left; }
.cls-pd-note { margin: 0 0 12px; font-size: 13px; line-height: 1.4; color: var(--cls-muted); }
.cls-pd-hist { margin: 12px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--cls-line); }
.cls-pd-hist li { display: flex; gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--cls-line); font-size: 12px; color: var(--cls-text); }
.cls-pd-hist li span:first-child { flex: 0 0 auto; color: var(--cls-muted); white-space: nowrap; }
.cls-pd-body { padding: 16px; overflow-y: auto; }
.cls-pd-note[data-s="granted"] { color: var(--cls-green); font-weight: 600; }
.cls-pd-note[data-s="requested"] { color: var(--cls-accent); font-weight: 600; }
.cls-pd-note[data-s="refused"], .cls-pd-note[data-s="revoked"], .cls-pd-note[data-s="expired"] { color: var(--cls-red); font-weight: 600; }
.cls-pd-tip { margin: 12px 0 0; font-size: 12px; }
.cls-pd-h3 { margin: 16px 0 0; font-size: 13px; font-weight: 600; color: var(--cls-text); }
.cls-pd-h3 + .cls-pd-hist { margin-top: 6px; }

.pdc-doc {
    padding: 16px 18px; background: #fff; border: 1px solid var(--cls-line); border-radius: 4px;
    font-size: 14px; line-height: 1.5; color: var(--cls-text); overflow-wrap: anywhere;
}
.pdc-doc h1, .pdc-doc h2, .pdc-doc h3 { font-size: 16px; margin: 0 0 10px; }
.pdc-doc p { margin: 0 0 8px; }
.pdc-act, .pdc-done {
    margin-top: 12px; padding: 14px 18px; background: #fff; border: 1px solid var(--cls-line); border-radius: 4px;
    display: flex; flex-direction: column; gap: 10px;
}
.pdc-check { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.4; color: var(--cls-text); cursor: pointer; }
.pdc-check input { margin-top: 2px; flex: 0 0 auto; }
.pdc-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.pdc-st { font-size: 14px; font-weight: 600; color: var(--cls-text); }
.pdc-st-granted { color: var(--cls-green); }
.pdc-st-refused, .pdc-st-revoked, .pdc-st-expired, .pdc-st-cancelled { color: var(--cls-red); }
.pdc-st-requested { color: var(--cls-accent); }
.pdc-list { background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; }
.pdc-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-bottom: 1px solid var(--cls-line); }
.pdc-row:last-child { border-bottom: 0; }
.pdc-tx { min-width: 0; }
.pdc-revoke:hover { border-color: var(--cls-red); color: var(--cls-red); }

@media (max-width: 700px) {
    .pdc-doc, .pdc-act, .pdc-done { padding: 12px; }
    .pdc-row { flex-direction: column; align-items: stretch; }
    .pdc-btns .cls-btn { flex: 1 1 auto; }
}

/* ---------- посевные площади и план продаж (этап 4d) ---------- */
.cpl-dialog { max-width: 420px; }
.cpl-del:hover { color: var(--cls-red); }

/* автодополнение (список в body, position fixed) */
.cpl-ac {
    position: fixed; z-index: 10050; margin: 0; padding: 4px 0; list-style: none; max-height: 260px; overflow-y: auto;
    background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; box-shadow: 0 4px 12px rgba(0, 0, 0, .08);
    font-size: 13px; color: var(--cls-text);
}
.cpl-ac[hidden] { display: none; }
.cpl-ac li { display: flex; justify-content: space-between; gap: 10px; padding: 7px 10px; cursor: pointer; }
.cpl-ac li span { color: var(--cls-muted); font-size: 12px; white-space: nowrap; }
.cpl-ac li.on, .cpl-ac li:hover { background: var(--cls-bg); }
.cpl-ac li.cpl-ac-none { color: var(--cls-muted); cursor: default; background: none; }
.cpl-ac li.cpl-ac-new { color: var(--cls-accent); border-top: 1px solid var(--cls-line); }

/* посевные площади: блок года */
.cpl-year { margin-bottom: 12px; background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; }
.cpl-year-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 8px 10px; background: var(--cls-bg); border-bottom: 1px solid var(--cls-line); }
.cpl-year-n { font-size: 15px; font-weight: 600; }
.cpl-year-t { color: var(--cls-muted); font-size: 13px; }
.cpl-year-t b { color: var(--cls-text); font-weight: 600; }
.cpl-year-act { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.cpl-year-empty { padding: 14px 10px; color: var(--cls-muted); font-size: 13px; }
.cpl-crops { border: 0; }
.cpl-crops th:last-child, .cpl-crops td.cls-c-act { width: 64px; text-align: right; white-space: nowrap; }
.cpl-swatch { display: inline-block; width: 10px; height: 10px; margin-right: 8px; border-radius: 2px; vertical-align: -1px; background: var(--cls-grey); }

/* план продаж: панель */
.cpl-bar { align-items: center; margin-bottom: 4px; }
.cpl-lbl { font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--cls-muted); }
.cpl-season { width: auto; min-width: 90px; }
.cpl-prod { flex: 1 1 260px; min-width: 0; }
.cpl-bar-msg { min-height: 0; margin-bottom: 8px; color: var(--cls-red); font-size: 13px; }
.cpl-bar-msg:empty { display: none; }

/* план продаж: таблица */
.cpl-sales th { cursor: default; }
.cpl-sales td { vertical-align: top; }
.cpl-sales td.cls-c-name { min-width: 160px; }
.cpl-sales td.cls-c-act { width: 36px; text-align: right; }
.cpl-unit {
    margin-top: 4px; height: 22px; padding: 0 4px; border: 1px solid var(--cls-line); border-radius: 4px;
    background: #fff; font: inherit; font-size: 12px; color: var(--cls-muted);
}
.cpl-cell { min-width: 120px; }

/* ячейка с записями */
.cpl-c { display: flex; align-items: flex-start; gap: 4px; }
.cpl-c-empty { justify-content: flex-start; }
.cpl-ent {
    display: flex; flex-direction: column; align-items: flex-start; gap: 1px; min-width: 0; padding: 2px 4px; margin: -2px 0 0 -4px;
    border: 1px solid transparent; border-radius: 4px; background: none; font: inherit; color: var(--cls-text); text-align: left; cursor: pointer;
}
.cpl-ent:hover { border-color: var(--cls-line); background: #fff; }
.cpl-q { font-size: 15px; font-weight: 600; line-height: 1.25; white-space: nowrap; }
.cpl-q small { font-size: 12px; font-weight: 400; color: var(--cls-muted); }
.cpl-meta { display: inline-flex; align-items: center; gap: 5px; color: var(--cls-muted); font-size: 12px; white-space: nowrap; }
.cpl-sep { width: 4px; height: 4px; fill: currentColor; flex: 0 0 auto; }
.cpl-apr { font-size: 10px; font-variant: all-small-caps; letter-spacing: .04em; padding: 0 4px; border: 1px solid currentColor; border-radius: 3px; line-height: 14px; }
.cpl-apr-pending { color: var(--cls-orange); }
.cpl-apr-rejected { color: var(--cls-red); }
.cpl-plus {
    flex: 0 0 auto; width: 22px; height: 22px; padding: 0; border: 1px solid var(--cls-line); border-radius: 4px;
    background: #fff; font: inherit; font-size: 15px; line-height: 20px; color: var(--cls-muted); cursor: pointer;
}
.cpl-plus:hover { border-color: var(--cls-accent); color: var(--cls-accent); }
.cpl-chev { display: inline-block; width: 6px; height: 6px; margin-left: 2px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.cpl-sum[aria-expanded="true"] .cpl-chev { transform: rotate(-135deg) translate(-1px, -1px); }
.cpl-list { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; padding-left: 8px; border-left: 2px solid var(--cls-line); }
.cpl-list .cpl-q { font-size: 13px; }
.cpl-none { color: var(--cls-muted); }
.cpl-plus-sep { color: var(--cls-muted); font-weight: 400; }

/* поставщики — теги */
.cpl-sup { min-width: 160px; }
.cpl-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.cpl-tag {
    display: inline-flex; align-items: center; gap: 2px; max-width: 100%; padding: 1px 2px 1px 7px;
    border: 1px solid var(--cls-line); border-radius: 4px; background: var(--cls-bg); font-size: 12px; line-height: 18px; word-break: break-word;
}
.cpl-tag button { width: 18px; height: 18px; padding: 0; border: 0; border-radius: 4px; background: none; font-size: 14px; line-height: 1; color: var(--cls-muted); cursor: pointer; }
.cpl-tag button:hover { color: var(--cls-red); background: #fff; }
.cpl-sup-in { flex: 1 1 90px; min-width: 80px; height: 24px; padding: 0 6px; border: 1px solid transparent; border-radius: 4px; background: none; font: inherit; font-size: 12px; color: var(--cls-text); }
.cpl-sup-in:hover { border-color: var(--cls-line); }
.cpl-sup-in:focus { outline: 0; border-color: var(--cls-accent); background: #fff; }

/* итоги */
.cpl-total td { padding-top: 9px; padding-bottom: 9px; background: var(--cls-bg); border-top: 1px solid var(--cls-line); border-bottom: 0; }

/* мини-форма записи */
.cpl-pop {
    position: absolute; z-index: 10040; width: 260px; background: #fff; border: 1px solid var(--cls-line); border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .08); color: var(--cls-text); font-size: 14px;
}
.cpl-pop-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 6px 6px 12px; border-bottom: 1px solid var(--cls-line); font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--cls-muted); }
.cpl-pop-sub { margin-left: 4px; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--cls-text); }
.cpl-pop-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 12px; }
/* форма в body, вне .cls — поля по ширине формы, без вылета за край */
.cpl-pop .cls-field { min-width: 0; }
.cpl-pop .cls-input { display: block; width: 100%; max-width: 100%; margin: 0; box-sizing: border-box; }
.cpl-pop-foot { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 8px 12px; border-top: 1px solid var(--cls-line); }
.cpl-pop-foot .cls-form-msg { margin-right: auto; }
.cpl-btn-del { margin-right: auto; color: var(--cls-red); }
.cpl-pop-foot .cls-form-msg:not(:empty) + .cpl-btn-del { margin-right: 0; }

/* телефон: строки плана — карточки */
@media (max-width: 700px) {
    .cpl-year-act { margin-left: 0; width: 100%; }
    .cpl-year-act .cls-btn { margin-right: auto; }
    .cpl-crops { padding: 8px; }
    .cpl-sales tfoot { display: block; }
    .cpl-sales td.cls-c-name { min-width: 0; }
    .cpl-sales td.cpl-cell, .cpl-sales td.cpl-sup { grid-column: 1 / -1; display: flex; align-items: flex-start; gap: 8px; min-width: 0; padding-top: 6px; border-top: 1px solid var(--cls-line); }
    .cpl-sales td.cpl-cell::before, .cpl-sales td.cpl-sup::before { flex: 0 0 96px; padding-top: 3px; }
    .cpl-sales td.cpl-cell > *, .cpl-sales td.cpl-sup > * { min-width: 0; }
    .cpl-sales .cpl-tags { flex: 1 1 auto; }
    .cpl-sales td.cpl-sup-empty { display: none; }
    .cpl-total td { background: none; border-top: 0; padding: 0; }
    .cpl-sales .cpl-total { background: var(--cls-bg); }
    .cpl-sales .cpl-total td.cpl-cell { padding-top: 6px; }
    .cpl-q { white-space: normal; }
    .cpl-prod { flex-basis: 100%; }
}

/* мини-форма на телефоне — нижняя шторка */
@media (max-width: 560px) {
    .cpl-pop { position: fixed; left: 0 !important; right: 0; bottom: 0; top: auto !important; width: auto; border-width: 1px 0 0; border-radius: 4px 4px 0 0; box-shadow: 0 -4px 16px rgba(0, 0, 0, .12); padding-bottom: env(safe-area-inset-bottom); }
    .cpl-pop-body { padding: 14px 16px; }
    .cpl-pop-foot { padding: 10px 16px; }
}

/* ---------- маркетинговые расходы (этап 4e) ---------- */
.mkt-ic { display: inline-flex; width: 16px; height: 16px; flex: 0 0 auto; color: var(--cls-muted); font-style: normal; }
.mkt-ic svg { width: 16px; height: 16px; }
.mkt-ok { color: var(--cls-green); }

/* фильтры */
.mkt-bar-f { align-items: center; margin-bottom: 4px; }
.mkt-bar-f .mkt-type-f { flex: 0 1 220px; }
.mkt-period { display: inline-flex; align-items: center; gap: 4px; }
.mkt-period .cls-input { width: 140px; }
.mkt-dash { color: var(--cls-muted); }
.mkt-seg { display: inline-flex; }
.mkt-seg .cls-btn { padding: 0 10px; border-radius: 0; }
.mkt-seg .cls-btn + .cls-btn { margin-left: -1px; }
.mkt-seg .cls-btn:first-child { border-radius: 4px 0 0 4px; }
.mkt-seg .cls-btn:last-child { border-radius: 0 4px 4px 0; }
.mkt-reset { color: var(--cls-muted); }
.mkt-add { margin-left: auto; }

/* сводка */
.mkt-sum { display: grid; grid-template-columns: 220px 1fr; gap: 0; margin-bottom: 12px; border: 1px solid var(--cls-line); border-radius: 4px; background: #fff; }
.mkt-sum-total { display: flex; flex-direction: column; justify-content: center; gap: 4px; padding: 12px 14px; border-right: 1px solid var(--cls-line); }
.mkt-sum-total span { font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--cls-muted); }
.mkt-sum-total b { font-size: 20px; font-weight: 600; color: var(--cls-text); font-variant-numeric: tabular-nums; }
.mkt-bars { padding: 8px 14px; }
.mkt-bar-row { display: grid; grid-template-columns: 210px 1fr 130px; align-items: center; gap: 10px; padding: 3px 0; font-size: 13px; }
.mkt-bar-l { display: inline-flex; align-items: center; gap: 6px; color: var(--cls-text); min-width: 0; }
.mkt-bar { display: block; height: 8px; background: var(--cls-bg); border-radius: 2px; overflow: hidden; }
.mkt-bar span { display: block; height: 100%; background: #9aa1ab; border-radius: 2px; }
.mkt-bar-row.on .mkt-bar span { background: var(--cls-accent); }
.mkt-bar-row.on .mkt-bar-l { font-weight: 600; }
.mkt-sum-total em { font-style: normal; font-size: 12px; line-height: 1.4; color: var(--cls-muted); }
.mkt-bar-v { text-align: right; color: var(--cls-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* реестр */
.mkt-type { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.mkt-table td.mkt-amount { white-space: nowrap; font-variant-numeric: tabular-nums; font-weight: 600; }
.mkt-table tfoot td { padding: 8px 10px; border-top: 1px solid var(--cls-line); background: var(--cls-bg); font-weight: 600; }
.mkt-table tfoot .mkt-foot-n { color: var(--cls-muted); font-weight: 400; font-size: 12px; }
.mkt-desc { max-width: 320px; white-space: pre-line; word-break: break-word; }
.mkt-note { margin-top: 4px; padding-left: 8px; border-left: 2px solid var(--cls-red); color: var(--cls-text); font-size: 12px; }
.mkt-note b { font-weight: 600; color: var(--cls-red); }
.mkt-files { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.mkt-file {
    display: inline-flex; align-items: center; gap: 3px; height: 22px; padding: 0 5px; border: 1px solid var(--cls-line); border-radius: 3px;
    background: #fff; color: var(--cls-muted); font: inherit; font-size: 10px; font-weight: 600; letter-spacing: .03em; cursor: pointer;
}
.mkt-file svg { width: 12px; height: 12px; }
button.mkt-file:hover { border-color: var(--cls-accent); color: var(--cls-accent); }
.mkt-act { display: inline-flex; align-items: center; gap: 2px; white-space: nowrap; }
.mkt-send { height: 26px; padding: 0 8px; margin-right: 4px; font-size: 12px; border-color: var(--cls-accent); color: var(--cls-accent); }

/* форма */
.mkt-dd-v { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.mkt-dd-ph { color: var(--cls-muted); }
.mkt-dd .cls-dd-list li { display: flex; align-items: center; gap: 6px; }
.mkt-flist { display: flex; flex-direction: column; gap: 4px; margin-bottom: 6px; }
.mkt-flist:empty { display: none; }
.mkt-fitem { display: flex; align-items: center; gap: 8px; padding: 4px 6px; border: 1px solid var(--cls-line); border-radius: 4px; font-size: 13px; }
.mkt-fitem.new { border-style: dashed; }
.mkt-fname { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mkt-fsize { color: var(--cls-muted); font-size: 12px; white-space: nowrap; }
.mkt-warn { padding: 8px 10px; border-left: 2px solid var(--cls-accent); background: var(--cls-bg); font-size: 12px; color: var(--cls-text); }

@media (max-width: 900px) {
    .mkt-sum { grid-template-columns: 1fr; }
    .mkt-sum-total { flex-direction: row; align-items: baseline; justify-content: space-between; border-right: 0; border-bottom: 1px solid var(--cls-line); }
    .mkt-bar-row { grid-template-columns: minmax(0, 150px) 1fr auto; }
}
@media (max-width: 700px) {
    .mkt-bar-f .mkt-type-f { flex: 1 1 100%; }
    .mkt-period { flex: 1 1 100%; }
    .mkt-period .cls-input { flex: 1; width: auto; min-width: 0; }
    .mkt-seg { flex: 1 1 auto; }
    .mkt-seg .cls-btn { flex: 1; }
    .mkt-add { margin-left: 0; flex: 1 1 100%; }
    .mkt-bar-row { grid-template-columns: 1fr auto; gap: 2px 10px; }
    .mkt-bar-row .mkt-bar { grid-column: 1 / -1; grid-row: 2; }
    .mkt-desc { max-width: none; }
    .mkt-table tfoot { display: block; }
    .mkt-table tfoot tr { background: var(--cls-bg); }
    .mkt-table tfoot td { padding: 0; border: 0; background: none; }
    .mkt-table tfoot td:empty { display: none; }
    .mkt-table tfoot td.mkt-amount { grid-column: 2; grid-row: 1; text-align: right; }
    .mkt-table td.mkt-amount { font-size: 15px; }
    .mkt-send { margin: 0; }
    .mkt-act { flex-wrap: wrap; justify-content: flex-end; }
}

/* ---------- история клиента (этап 4f) ---------- */
.cls-hist-bar { margin-bottom: 10px; }
.cls-hist-seg { display: flex; flex-wrap: wrap; gap: 6px; }
.cls-hist-seg .cls-btn { padding: 0 10px; border-radius: 4px; margin: 0; gap: 6px; }
.cls-hist-seg .cls-btn.on { position: relative; z-index: 1; border-color: var(--cls-accent); color: var(--cls-accent); font-weight: 600; }
.cls-hist-n { font-size: 11px; color: var(--cls-muted); font-variant-numeric: tabular-nums; }
.cls-hist-note { margin-bottom: 10px; padding: 8px 12px; border: 1px solid var(--cls-line); border-left: 3px solid var(--cls-accent); background: #fff; font-size: 13px; color: var(--cls-muted); }
.cls-hist { border: 1px solid var(--cls-line); background: #fff; }
.cls-hist-day { padding: 6px 12px; background: var(--cls-bg); border-bottom: 1px solid var(--cls-line); font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--cls-muted); font-variant-numeric: tabular-nums; }
.cls-hist-row + .cls-hist-day { border-top: 1px solid var(--cls-line); }
.cls-hist-row { display: grid; grid-template-columns: 48px 20px minmax(0, 1fr) minmax(120px, 220px); gap: 10px; align-items: start; padding: 7px 12px; font-size: 13px; }
.cls-hist-row + .cls-hist-row { border-top: 1px solid var(--cls-line); }
.cls-hist-time { color: var(--cls-muted); font-variant-numeric: tabular-nums; line-height: 20px; }
.cls-hist-ic { display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; color: var(--cls-muted); font-style: normal; }
.cls-hist-ic svg { width: 16px; height: 16px; }
.cls-hist-row[data-t="report"] .cls-hist-ic, .cls-hist-row[data-t="sales"] .cls-hist-ic { color: var(--cls-accent); }
.cls-hist-body { min-width: 0; line-height: 20px; }
.cls-hist-head { color: var(--cls-text); overflow-wrap: anywhere; }
.cls-hist-obj a { font-weight: 600; }
.cls-hist-det { color: var(--cls-muted); overflow-wrap: anywhere; }
.cls-hist-det b { color: var(--cls-text); font-weight: 600; }
.cls-hist-who { color: var(--cls-muted); text-align: right; line-height: 20px; overflow-wrap: anywhere; }
.cls-hist-more { margin-top: 10px; text-align: center; }
@media (max-width: 899px) {
    .cls-hist-seg .cls-btn { flex: 1 1 auto; }
    .cls-hist-row { grid-template-columns: 20px minmax(0, 1fr) auto; grid-template-areas: "ic body time" "ic who who"; gap: 2px 10px; padding: 9px 12px; }
    .cls-hist-ic { grid-area: ic; }
    .cls-hist-body { grid-area: body; }
    .cls-hist-time { grid-area: time; }
    .cls-hist-who { grid-area: who; text-align: left; font-size: 12px; }
    .cls-hist-who:empty { display: none; }
    .cls-hist-more .cls-btn { width: 100%; justify-content: center; }
}

/* ===== Аналитика руководителя /analytics (этап 5) ===== */
.cls-an-bar { align-items: center; }
.cls-an-bar .cls-select { flex: 0 1 240px; }
.cls-an-bar .mkt-seg .cls-btn.on { position: relative; z-index: 1; border-color: var(--cls-accent); color: var(--cls-accent); font-weight: 600; }
#anBody.cls-an-busy { opacity: .55; pointer-events: none; }
.cls-an-sec { margin-top: 18px; padding: 14px 16px; background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; }
.cls-an-sh { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--cls-line); }
.cls-an-h2 { margin: 0; font-size: 15px; font-weight: 600; color: var(--cls-text); }
.cls-an-note { font-size: 12px; color: var(--cls-muted); }
.cls-an-h3 { margin: 16px 0 6px; font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--cls-muted); }
.cls-an-nr { padding: 10px 0; color: var(--cls-muted); font-size: 13px; }
.cls-an-bars { margin: 2px 0 10px; }
.cls-an-table { margin-top: 4px; }
.cls-an-table td small { display: block; font-size: 11px; color: var(--cls-muted); }
.cls-an-foot td { border-top: 1px solid var(--cls-text); font-weight: 600; }
.cls-an-num { padding: 0; border: 0; background: none; font: inherit; color: var(--cls-accent); cursor: pointer; font-variant-numeric: tabular-nums; }
.cls-an-num:hover { text-decoration: underline; }
.cls-an-zero { color: var(--cls-muted); }
.cls-an-rv { display: inline-flex; align-items: baseline; gap: 6px; }
.cls-an-rv em { font-style: normal; font-size: 11px; color: var(--cls-muted); min-width: 40px; text-align: right; }
.cls-an-links { display: flex; flex-wrap: wrap; gap: 6px 20px; margin-top: 10px; font-size: 13px; }
.cls-an-links > span { display: inline-flex; align-items: center; gap: 6px; }
.cls-an-kpi { display: flex; flex-wrap: wrap; border: 1px solid var(--cls-line); border-radius: 4px; }
.cls-an-k { flex: 1 1 150px; display: flex; flex-direction: column; gap: 3px; padding: 9px 12px; border-right: 1px solid var(--cls-line); }
.cls-an-k:last-child { border-right: 0; }
.cls-an-k span { font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--cls-muted); }
.cls-an-k b { font-size: 18px; font-weight: 600; color: var(--cls-text); font-variant-numeric: tabular-nums; }
.cls-an-k i { font-style: normal; font-size: 12px; color: var(--cls-muted); }
.cls-an-pct { display: inline-grid; grid-template-columns: 90px auto; align-items: center; gap: 8px; }
.cls-an-pct > span:last-child { font-variant-numeric: tabular-nums; }
.cls-an-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 4px; }
.cls-an-chip { padding: 3px 8px; border: 1px solid var(--cls-line); border-radius: 4px; font-size: 12px; color: var(--cls-muted); }
.cls-an-chip b { color: var(--cls-text); font-weight: 600; }
.cls-an-chip[data-s="granted"] b { color: var(--cls-green); }
.cls-an-red { color: var(--cls-red); }
.cls-an-more { margin-top: 8px; font-size: 12px; color: var(--cls-muted); }

@media (max-width: 700px) {
    .cls-an-bar .cls-select { flex: 1 1 100%; }
    .cls-an-sec { padding: 12px; }
    .cls-an-k { flex: 1 1 45%; border-right: 0; border-bottom: 1px solid var(--cls-line); }
    .cls-an-k:last-child { border-bottom: 0; }
    .cls-an-foot td { border-top: 0; }
    .cls-an-table tr.cls-an-foot { border-top: 1px solid var(--cls-text); }
    .cls-an-pct { grid-template-columns: 70px auto; }
    .cls-an-rv em { min-width: 0; }
}

/* /clients: плашка фильтра по консультанту (переход из /analytics) */
.cls-fresp { display: inline-flex; align-items: center; gap: 6px; padding: 0 4px 0 10px; height: 34px; border: 1px solid var(--cls-line); border-radius: 4px; background: #f4f6f8; font-size: 13px; color: #333; max-width: 100%; }
.cls-fresp[hidden] { display: none; }
.cls-fresp > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.cls-fresp-x { border: 0; background: none; width: 24px; height: 24px; font-size: 18px; line-height: 1; color: #777; cursor: pointer; border-radius: 4px; flex: none; }
.cls-fresp-x:hover { background: #e3e7ec; color: #222; }

/* Связи клиентов (вкладка «Связи» на /clients): облако клиентов, связи-стрелки, окно процента влияния */
.clk-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.clk-bar .cls-input { width: 260px; max-width: 100%; margin: 0; box-sizing: border-box; }
.clk-hint { font-size: 13px; color: var(--cls-muted); }
.clk-hint.on { color: var(--cls-accent); font-weight: 600; }
.clk-note { margin: 0 0 12px; padding: 8px 12px; border: 1px solid var(--cls-line); border-left: 3px solid var(--cls-orange); border-radius: 4px; background: #fff; font-size: 13px; color: var(--cls-text); }
.clk-note[hidden] { display: none; }
.clk-stage { border: 1px solid var(--cls-line); border-radius: 4px; background: #fbfcfd; background-image: radial-gradient(#e3e7ec 1px, transparent 1px); background-size: 20px 20px; overflow: hidden; }
.clk-svg { display: block; width: 100%; touch-action: none; user-select: none; -webkit-user-select: none; }
.clk-node { cursor: pointer; outline: none; transition: opacity .15s; }
.clk-node.drag { cursor: grabbing; }
.clk-circ { stroke: #fff; stroke-width: 2; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .18)); opacity: .92; transition: opacity .15s; }
.clk-node:hover .clk-circ, .clk-node:focus-visible .clk-circ { opacity: 1; }
.clk-ring { fill: none; stroke: transparent; stroke-width: 2; }
.clk-node.sel .clk-ring { stroke: var(--cls-accent); stroke-dasharray: 4 3; }
.clk-node.pickable:hover .clk-ring { stroke: var(--cls-muted); }
.clk-node:focus-visible .clk-ring { stroke: var(--cls-accent); }
.clk-ini { fill: #fff; font-size: 13px; font-weight: 700; letter-spacing: .5px; pointer-events: none; }
.clk-name { fill: var(--cls-text); font-size: 12px; pointer-events: none; paint-order: stroke; stroke: #fbfcfd; stroke-width: 3px; stroke-linejoin: round; }
.clk-node.dim, .clk-link.dim { opacity: .2; }
.clk-link { cursor: pointer; outline: none; transition: opacity .15s; }
.clk-hit { stroke: transparent; stroke-width: 14; }
.clk-rest { stroke: #c7c7cc; stroke-width: 2; }
.clk-fill { stroke-width: 3; stroke-linecap: round; }
.clk-pill { fill: #fff; stroke-width: 1; }
.clk-ptxt { font-size: 11px; font-weight: 700; pointer-events: none; }
.clk-link:hover .clk-rest, .clk-link:focus-visible .clk-rest { stroke: #9aa0a6; }
.clk-link:hover .clk-pill, .clk-link:focus-visible .clk-pill { stroke-width: 2; }
.clk-list { margin-top: 20px; }
.clk-list[hidden] { display: none; }
.clk-h2 { margin: 0 0 8px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--cls-muted); }
.clk-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 8px; vertical-align: -1px; flex: none; }
.clk-th-pct, .clk-td-pct { width: 160px; }
.clk-td-pct { white-space: nowrap; }
.clk-td-pct b { display: inline-block; min-width: 40px; text-align: right; font-size: 13px; }
.clk-mbar { display: inline-block; width: 90px; height: 6px; margin-right: 8px; background: #e6e8eb; border-radius: 3px; overflow: hidden; vertical-align: middle; }
.clk-mbar > span { display: block; height: 100%; }
.clk-td-act { width: 1%; text-align: right; }

.clk-dlg { width: 440px; max-width: calc(100vw - 32px); padding: 0; border: 1px solid var(--cls-line); border-radius: 4px; box-shadow: 0 12px 40px rgba(0, 0, 0, .18); color: var(--cls-text); }
.clk-dlg::backdrop { background: rgba(20, 24, 28, .35); }
.clk-dlg form { padding: 18px 20px 16px; }
.clk-dlg-h { margin-bottom: 12px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--cls-muted); }
.clk-pair { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 16px; font-size: 14px; }
.clk-who { display: inline-flex; align-items: center; font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.clk-verb { color: var(--cls-muted); }
.clk-lbl { display: block; margin-bottom: 6px; font-size: 13px; color: var(--cls-muted); }
.clk-pct { display: flex; align-items: center; gap: 12px; }
.clk-pct input[type=range] { flex: 1; min-width: 0; height: 6px; -webkit-appearance: none; appearance: none; border-radius: 3px; background: linear-gradient(to right, var(--clk-c, var(--cls-accent)) var(--clk-p, 30%), #e6e8eb var(--clk-p, 30%)); outline: none; }
.clk-pct input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 2px solid var(--clk-c, var(--cls-accent)); cursor: pointer; }
.clk-pct input[type=range]::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 2px solid var(--clk-c, var(--cls-accent)); cursor: pointer; }
.clk-pct .cls-input { width: 72px; text-align: right; }
.clk-prev { height: 4px; margin: 14px 0 10px; background: #c7c7cc; border-radius: 2px; overflow: hidden; }
.clk-prev > span { display: block; height: 100%; }
.clk-info { font-size: 12px; line-height: 1.45; color: var(--cls-muted); }
.clk-err { margin-top: 10px; font-size: 13px; color: var(--cls-red); }
.clk-err[hidden] { display: none; }
.clk-dlg-f { display: flex; align-items: center; gap: 8px; margin-top: 18px; }
.clk-sp { flex: 1; }
.clk-del { color: var(--cls-red); }
.clk-del[hidden] { display: none; }

@media (max-width: 700px) {
    .cls.clk { padding-left: 16px; padding-right: 16px; }
    .clk-bar .cls-input { width: 100%; }
    .clk-table thead { display: none; }
    .clk-table, .clk-table tbody, .clk-table tr, .clk-table td { display: block; width: auto; }
    .clk-table tr { padding: 10px 12px; border: 1px solid var(--cls-line); border-radius: 4px; margin-bottom: 8px; background: #fff; }
    .clk-table td { padding: 2px 0; border: 0; }
    .clk-table td[data-l]::before { content: attr(data-l); display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--cls-muted); }
    .clk-td-pct, .clk-td-act { text-align: left; }
    .clk-td-act { margin-top: 6px; }
    .clk-dlg form { padding: 16px; }
}

/* ---------- Задачи от руководителя (/boss-tasks) ---------- */
.bt-note { margin: 0 0 12px; padding: 10px 12px; border: 1px solid var(--cls-line); border-left: 3px solid var(--cls-orange); background: var(--cls-bg); color: var(--cls-text); font-size: 13px; }
.bt-tab-n { margin-left: 6px; }
.bt-card { border: 1px solid var(--cls-line); border-left: 3px solid var(--cls-accent); background: #fff; padding: 12px 14px; margin: 0 0 10px; min-width: 0; }
.bt-card.bt-done { border-left-color: var(--cls-green); }
.bt-card.bt-overdue { border-left-color: var(--cls-red); }
.bt-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.bt-who { font-size: 13px; color: var(--cls-muted); min-width: 0; overflow-wrap: anywhere; }
.bt-who b { color: var(--cls-text); font-weight: 600; }
.bt-st { flex: 0 0 auto; font-size: 12px; padding: 2px 8px; border: 1px solid var(--cls-line); color: var(--cls-muted); white-space: nowrap; }
.bt-st-new { border-color: var(--cls-accent); color: var(--cls-accent); }
.bt-st-done { border-color: var(--cls-green); color: var(--cls-green); }
.bt-st-overdue { border-color: var(--cls-red); color: var(--cls-red); }
.bt-text-v { margin: 8px 0 6px; font-size: 14px; color: var(--cls-text); white-space: pre-wrap; overflow-wrap: anywhere; }
.bt-meta { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 12px; color: var(--cls-muted); }
.bt-due-l.late { color: var(--cls-red); font-weight: 600; }
.bt-act { display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px; }
.bt-del { color: var(--cls-red); }
.bt-dlg .bt-f { width: 100%; box-sizing: border-box; }
.bt-dlg .es-wrap { display: block; width: 100% !important; max-width: 100%; min-width: 0; }   /* «Сотрудник» (свой список epa_select) — как поля срока: 32px, радиус 4px, на всю ширину, не выходит за окно */
.bt-dlg .es-btn { width: 100%; max-width: 100%; min-width: 0; min-height: 32px; height: 32px; padding: 0 8px 0 10px; border: 1px solid var(--cls-line); border-radius: 4px; background: #fff; font-size: 13px; color: var(--cls-text); box-shadow: none; overflow: hidden; }
.bt-dlg .es-wrap.set .es-btn { border-color: var(--cls-line); }
.bt-dlg .es-wrap.open .es-btn, .bt-dlg .es-btn:focus-visible { border-color: var(--cls-accent); box-shadow: 0 0 0 2px rgba(0, 104, 208, .15); }
.bt-dlg .es-btn svg { width: 14px; height: 14px; }
.bt-dlg .bt-f, .bt-dlg .bt-due .cls-input { border-radius: 4px; }
.bt-dlg .bt-text { resize: vertical; min-height: 84px; font: inherit; }
.bt-due { display: flex; gap: 8px; }
.bt-away { margin: 6px 0 2px; padding: 6px 10px; border: 1px solid var(--cls-line); border-left: 3px solid #6f9bd1; border-radius: 4px; font-size: 12px; color: var(--cls-muted); background: var(--cls-bg); overflow-wrap: anywhere; }
.bt-away-dep { padding: 0; border: 0; background: none; font: inherit; color: var(--cls-accent); text-decoration: underline; cursor: pointer; }
.bt-due .cls-input { flex: 1 1 0; min-width: 0; box-sizing: border-box; }
.bt-note-row { padding: 10px 12px; border-bottom: 1px solid var(--cls-line); cursor: pointer; }
.bt-note-row.unread { border-left: 3px solid var(--cls-accent); background: var(--cls-bg); }
.bt-note-t { font-size: 14px; color: var(--cls-text); overflow-wrap: anywhere; }
.bt-note-d { font-size: 12px; color: var(--cls-muted); margin-top: 2px; }
@media (max-width: 700px) {
    .bt-card { padding: 10px 12px; }
    .bt-act .cls-btn { flex: 1 1 auto; }
}

/* ---------- единый вид страниц раздела: /my-company, /today, /visits, /reports-myfield, /approvals — как /analytics ----------
   У страниц свои inline-стили (крупные скругления, тени, зелёные кнопки) и своё правило .container (width 92%, padding 0 4%).
   Здесь — только внутри раскладки с меню раздела; селектор body .container:has(> .cls-nav) сильнее страничных правил. */
body .container:has(> .cls-nav) { max-width: none !important; }
@media (min-width: 900px) {
    body .container:has(> .cls-nav) { width: 100%; margin: 0; padding: 0 32px 0 252px; gap: 0; justify-content: flex-start; }
}
@media (max-width: 899px) {
    body .container:has(> .cls-nav) { width: 100%; margin: 0; padding: 0 16px; }
}
body .container:has(> .cls-nav) > :is(.mc, .td, .vl, .vr, .apr) {
    max-width: none; width: 100%; margin: 0; padding: 0 0 40px; box-sizing: border-box;
    font-family: inherit; font-size: 14px; line-height: 1.45; color: var(--cls-text);
}
.container:has(> .cls-nav) :is(.mc, .td, .vl, .vr, .apr) *, .container:has(> .cls-nav) :is(.mc, .td, .vl, .vr, .apr) *::before { box-sizing: border-box; }
/* шапка: заголовок 22px / 600, отступы как у .cls-head */
.container:has(> .cls-nav) :is(.mc-head, .vl-top, .vr-head) { margin: 4px 0 12px; gap: 10px; }
.container:has(> .cls-nav) :is(.mc, .td, .vl, .vr, .apr) h1 {
    font-size: 22px; font-weight: 600; letter-spacing: -.01em; line-height: 1.25; margin: 0; overflow-wrap: anywhere;
}
.container:has(> .cls-nav) :is(.td, .apr) > h1 { margin: 4px 0 2px; }
.container:has(> .cls-nav) :is(.td-sub, .apr-sub) { font-size: 13px; color: var(--cls-muted); margin: 0 0 12px; }
/* карточки: белый фон, тонкая граница, радиус 4px, без теней */
.container:has(> .cls-nav) :is(.mc-card, .mc-kpi, .mc-wrap, .mc-cal, .mc-km-chart, .td-card, .td-empty, .vl-card, .vr-card, .apr-card) {
    border: 1px solid var(--cls-line); border-radius: 4px; box-shadow: none; background: #fff;
}
.container:has(> .cls-nav) :is(.td-card, .vr-card, .apr-card) { padding: 14px 16px; }
.container:has(> .cls-nav) :is(.vr-mat, .apr-row, .vkm-tot div, .vkm-start, .mc-cal-d, .mc-cal-item, .mc-thumb, .mc-table tr) { border-radius: 4px; }
.container:has(> .cls-nav) :is(.vr-mat, .apr-row) { border-color: var(--cls-line); }
.container:has(> .cls-nav) .td-head b { font-size: 15px; font-weight: 600; }
/* кнопки: 32px, радиус 4px, основная — акцентная синяя */
.container:has(> .cls-nav) :is(.mc-btn, .vl-btn, .vr-btn, .apr-btn, .td-done) {
    min-height: 32px; padding: 0 14px; border-radius: 4px; font-size: 13px; font-weight: 500; box-shadow: none;
    display: inline-flex; align-items: center; justify-content: center; gap: 6px; white-space: nowrap;
}
.container:has(> .cls-nav) :is(.mc-btn.green, .vl-btn:not(.no), .vr-btn:not(.no), .apr-btn:not(.no)) {
    background: var(--cls-accent); border-color: var(--cls-accent); color: #fff;
}
.container:has(> .cls-nav) :is(.mc-btn.green, .vl-btn:not(.no), .vr-btn:not(.no), .apr-btn:not(.no)):hover { background: #0058b0; border-color: #0058b0; color: #fff; }
.container:has(> .cls-nav) :is(.mc-btn:not(.green), .vl-btn.no, .vr-btn.no, .apr-btn.no) { background: #fff; border-color: var(--cls-line); color: var(--cls-text); }
.container:has(> .cls-nav) .td-done { border-color: var(--cls-accent); color: var(--cls-accent); }
.container:has(> .cls-nav) :is(.mc-seg, .vr-filter, .vl-rate, .vr-st, .apr-st, .mc-role, .mc-tag, .td-n, .td-late, .td-badge) { border-radius: 4px; }
.container:has(> .cls-nav) .vr-filter.active { background: var(--cls-accent); border-color: var(--cls-accent); }
/* /reports-myfield: фильтры и поиск как остальные кнопки и поля раздела — 32px, 13px, белый фон */
.container:has(> .cls-nav) .vr-filter { display: inline-flex; align-items: center; gap: 4px; min-height: 32px; padding: 0 12px; font-size: 13px; }
.container:has(> .cls-nav) .vr-filter:not(.active) { background: #fff; border-color: var(--cls-line); }
.container:has(> .cls-nav) .vr .vr-tools :is(select.vr-sel, input[type="search"].vr-search) { height: 32px; padding: 0 10px; font-size: 13px; background: #fff; border-radius: 4px; }
.container:has(> .cls-nav) :is(.td-all, .mc a:not(.mc-btn)) { color: var(--cls-accent); }
.container:has(> .cls-nav) .td-big strong { color: var(--cls-accent); font-weight: 600; }
.container:has(> .cls-nav) .td-badge { background: var(--cls-accent); }
/* поля ввода: 36px, радиус 4px, без внутренних отступов браузера */
.container:has(> .cls-nav) :is(.mc, .td, .vl, .vr, .apr) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea),
.mc-sheet :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea) {
    max-width: 100%; margin: 0; border: 1px solid var(--cls-line); border-radius: 4px; box-shadow: none; font-family: inherit; color: var(--cls-text);
}
.container:has(> .cls-nav) :is(.mc, .td, .vl, .vr, .apr) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select),
.mc-sheet :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select) { height: 36px; padding: 0 10px; font-size: 14px; }
.container:has(> .cls-nav) .mc-filters select { padding-right: 30px; }
.container:has(> .cls-nav) :is(.mc, .td, .vl, .vr, .apr) :is(input, select, textarea):focus { outline: none; border-color: var(--cls-accent); }
.container:has(> .cls-nav) :is(.vr-menu, .mc-pick-list) { border: 1px solid var(--cls-line); border-radius: 4px; box-shadow: 0 4px 12px rgba(0,0,0,.08); }
.container:has(> .cls-nav) :is(.vr-mi, .mc-pick-list button) { border-radius: 2px; }
:is(.vr-toast, .apr-toast, .mc-toast) { border-radius: 4px; }
.mc-sheet-body { border-radius: 4px; }
/* таблицы не выходят за блок */
.container:has(> .cls-nav) :is(.mc, .vl, .vr, .apr) table { max-width: 100%; }
/* отчёт о визите (/visit-report/new, /visit-report/{id}, /field-report/{id}/send): форма в стиле страниц компании */
.container:has(> .cls-nav) .vr > h1 { margin: 4px 0 2px; }
.container:has(> .cls-nav) .vr-sub { font-size: 13px; color: var(--cls-muted); margin: 0 0 12px; }
.container:has(> .cls-nav) .vr-card { margin-bottom: 12px; }
.container:has(> .cls-nav) .vr-card h2 { font-size: 15px; font-weight: 600; margin: 0 0 10px; }
.container:has(> .cls-nav) .vr-lbl { font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: .04em; color: var(--cls-muted); margin: 12px 0 4px; }
.container:has(> .cls-nav) .vr :is(input[type=text], input[type=date], select, textarea) { width: 100%; }
.container:has(> .cls-nav) .vr textarea { padding: 8px 10px; font-size: 14px; line-height: 1.45; }
.container:has(> .cls-nav) .vr-btn { font-family: inherit; cursor: pointer; text-decoration: none; }
.container:has(> .cls-nav) .vr-btn:is(.ghost, .del) { background: #fff; border-color: var(--cls-line); }
.container:has(> .cls-nav) .vr-btn.ghost { color: var(--cls-accent); }
.container:has(> .cls-nav) .vr-btn.del { color: var(--cls-red); }
.container:has(> .cls-nav) .vr-btn:is(.ghost, .del):hover { background: var(--cls-bg); border-color: var(--cls-line); }
.container:has(> .cls-nav) .vr-btn.ghost:hover { color: var(--cls-accent); }
.container:has(> .cls-nav) .vr-btn.del:hover { color: var(--cls-red); }
.container:has(> .cls-nav) .vr-btn:disabled { opacity: .5; cursor: default; }
.container:has(> .cls-nav) .vr-link { color: var(--cls-accent); font-weight: 500; }
.container:has(> .cls-nav) .vr-chip { border-color: var(--cls-line); border-radius: 4px; padding: 5px 10px; font-size: 13px; }
.container:has(> .cls-nav) .vr-chip.on { border-color: var(--cls-accent); background: var(--cls-accent); color: #fff; }
.container:has(> .cls-nav) .vr-x { border-radius: 4px; background: var(--cls-bg); }
.container:has(> .cls-nav) :is(.vr-ph, .vr-add, .vr-nt, .vr-pdf, .vr-st) { border-radius: 4px; }
.container:has(> .cls-nav) .vr-add { border-color: var(--cls-line); background: var(--cls-bg); color: var(--cls-accent); }
.container:has(> .cls-nav) .vr-nt { background: var(--cls-bg); }
.container:has(> .cls-nav) .vr-ac-list { border: 1px solid var(--cls-line); border-radius: 4px; box-shadow: 0 4px 12px rgba(0,0,0,.08); }
.container:has(> .cls-nav) .vr-ac-item:hover { background: var(--cls-bg); }
.container:has(> .cls-nav) .vr-check { font-weight: 500; }
.container:has(> .cls-nav) .vr-check input { accent-color: var(--cls-accent); }
.container:has(> .cls-nav) .vr-pick.on { outline-color: var(--cls-accent); }
.container:has(> .cls-nav) .vr-pick.on::after { background: var(--cls-accent); }
.container:has(> .cls-nav) .vr-arg { border-top-color: var(--cls-line); }
@media (max-width: 899px) {
    body .container:has(> .cls-nav) > :is(.mc, .td, .vl, .vr, .apr) { padding: 0 0 40px; }
}
/* телефон: шрифт полей 16px (без увеличения в iOS), высота 40px, сетки в одну колонку */
@media (max-width: 560px) {
    .container:has(> .cls-nav) :is(.mc, .td, .vl, .vr, .apr) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea),
    .mc-sheet :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea) { font-size: 16px; }
    .container:has(> .cls-nav) :is(.mc, .td, .vl, .vr, .apr) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select),
    .mc-sheet :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select) { height: 40px; }
    .container:has(> .cls-nav) .td-grid { grid-template-columns: minmax(0, 1fr); }
    .container:has(> .cls-nav) .vr-filter { min-height: 40px; }
    .container:has(> .cls-nav) .vr .vr-tools :is(select.vr-sel, input[type="search"].vr-search) { height: 40px; font-size: 16px; }
    .container:has(> .cls-nav) :is(.mc-head, .vl-top, .vr-head) > :is(.mc-btn, .vl-btn, .vr-btn) { min-height: 36px; }
    .mc-sheet-body { border-radius: 4px 4px 0 0; }
}
.container:has(> .cls-nav) .td-grid { grid-template-columns: repeat(auto-fill, minmax(min(400px, 100%), 1fr)); }

/* ---------- подвал сайта не уходит под закреплённое меню раздела ---------- */
@media (min-width: 900px) {
    body:has(.container > .cls-nav) footer:is(.page-footer, .footer) { margin-left: 220px; width: auto; box-sizing: border-box; }
}

/* ---------- карточка клиента: «Моя активность» ---------- */
.cls-mine { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--cls-line); font-size: 13px; color: var(--cls-muted); }
.cls-mine[hidden] { display: none; }
.cls-mine-t { font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; cursor: help; }
.cls-mine-i b { font-size: 15px; font-weight: 600; color: var(--cls-text); }

/* ---------- план продаж: % выполнения ---------- */
.cpl-pct { display: flex; flex-direction: column; gap: 4px; min-width: 64px; }
.cpl-pct b { font-size: 14px; font-weight: 600; }
.cpl-pct-bar { display: block; height: 4px; border-radius: 2px; background: var(--cls-line); overflow: hidden; }
.cpl-pct-bar i { display: block; height: 100%; background: var(--cls-accent); }
.cpl-pct-ok b { color: #1a7f37; } .cpl-pct-ok .cpl-pct-bar i { background: #1a7f37; }
.cpl-pct-mid b { color: #9a6700; } .cpl-pct-mid .cpl-pct-bar i { background: #bf8700; }
.cpl-pct-low b { color: #cf222e; } .cpl-pct-low .cpl-pct-bar i { background: #cf222e; }

/* ---------- /clients: цели (препарат) и шанс продажи по клиенту ---------- */
.cls-goals { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 12px; }
.cls-goals[hidden] { display: none; }
.cls-goal {
    display: inline-flex; align-items: center; max-width: 100%; height: 28px; border: 1px solid var(--cls-line); border-radius: 4px;
    background: #fff; color: var(--cls-text); font-size: 13px; box-sizing: border-box; overflow: hidden;
}
.cls-goal.on { border-color: var(--cls-accent); color: var(--cls-accent); }
.cls-goal-name {
    min-width: 0; height: 100%; padding: 0 8px; border: 0; background: none; color: inherit; font: inherit; cursor: pointer;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 260px;
}
.cls-goal.on .cls-goal-name { font-weight: 600; }
.cls-goal-x {
    flex: 0 0 auto; width: 26px; height: 100%; border: 0; border-left: 1px solid var(--cls-line); background: none;
    color: var(--cls-muted); font-size: 16px; line-height: 1; cursor: pointer;
}
.cls-goal-x:hover { color: var(--cls-red); }
.cls-goal-name:focus-visible, .cls-goal-x:focus-visible { outline: 2px solid var(--cls-accent); outline-offset: -2px; }
.cls-goal-by { flex: 1 1 100%; color: var(--cls-muted); font-size: 12px; }

/* окно «Добавить цель»: поиск препарата и подсказки */
.cls-dialog-sm { max-width: 480px; }
.cls-goal-sug { display: flex; flex-direction: column; margin: 6px 0 0; padding: 0; max-height: 260px; overflow-y: auto; border: 1px solid var(--cls-line); border-radius: 4px; }
.cls-goal-sug:empty, .cls-goal-sug[hidden] { display: none; }
.cls-goal-opt { display: block; width: 100%; padding: 8px 10px; border: 0; border-bottom: 1px solid var(--cls-line); background: #fff; color: var(--cls-text); font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.cls-goal-opt:last-child { border-bottom: 0; }
.cls-goal-opt:hover, .cls-goal-opt:focus { background: var(--cls-bg); outline: none; }
.cls-goal-none { padding: 8px 10px; color: var(--cls-muted); font-size: 13px; }

/* колонка цели в таблице: шанс продажи, % */
.cls-pct { display: inline-block; min-width: 40px; padding: 0 6px; border-radius: 4px; font-size: 12px; font-weight: 600; line-height: 20px; text-align: center; }
.cls-pct.hi { background: #e6f4ea; color: var(--cls-green); }
.cls-pct.mid { background: #fdf5dc; color: #9a6700; }
.cls-pct.lo { background: #fbe9e8; color: var(--cls-red); }
.cls-pct.na { background: none; color: var(--cls-muted); font-weight: 400; }

/* карточка клиента: тип личности · мышление · минуты под ролью контакта */
.cls-ct-type { margin-top: 2px; }
@media (max-width: 600px) {
    .cls-goal-name { max-width: 200px; }
}

/* ===== Настройки компании: позиции, отделы, матрица прав (/my-company/settings) ===== */
.mc-title-link { color: inherit; text-decoration: none; border-bottom: 1px dashed var(--cls-grey); }
.mc-title-link:hover { color: var(--cls-accent); border-bottom-color: var(--cls-accent); }
.cps-back { display: inline-block; margin: 4px 0 8px; color: var(--cls-muted); font-size: 14px; text-decoration: none; }
.cps-back:hover { color: var(--cls-accent); }
.cps-link { padding: 0; border: 0; background: none; color: var(--cls-accent); font: inherit; font-size: 13px; cursor: pointer; }
.cps-link:disabled { color: var(--cls-grey); cursor: default; }
.cps .cps-link[data-back] { margin-bottom: 10px; font-size: 14px; }
.cps-acts { display: inline-flex; gap: 6px; }
.cps-card { background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; padding: 16px; }
.cps-form { margin-bottom: 4px; }
.cps-rights { margin-top: 16px; }
.cps-mod { border: 1px solid var(--cls-line); border-radius: 4px; margin-bottom: 8px; }
.cps-mod.soon { background: var(--cls-bg); color: var(--cls-muted); }
.cps-mod-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 12px; border-bottom: 1px solid var(--cls-line); }
.cps-mod-name { font-weight: 600; display: inline-flex; align-items: center; gap: 8px; }
.cps-mod-acts { display: inline-flex; gap: 14px; flex-shrink: 0; }
.cps-soon { padding: 1px 6px; border-radius: 4px; background: var(--cls-grey); color: #fff; font-size: 11px; font-weight: 400; text-transform: lowercase; }
.cps-info { padding: 8px 12px; color: var(--cls-muted); font-size: 13px; }
.cps-hint { padding: 0 0 10px; }
.cps-fn { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 12px; min-height: 36px; box-sizing: border-box; }
.cps-fn + .cps-fn { border-top: 1px solid var(--cls-bg); }
.cps-check { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.cps-check input { width: 16px; height: 16px; margin: 0; accent-color: var(--cls-accent); }
.cps-check input:disabled + span { color: var(--cls-muted); }
.cps .cps-scope { flex: 0 0 150px; width: 150px; height: 32px; }
.cps-foot { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 12px; }
.cps-badge { display: inline-block; padding: 2px 8px; border-radius: 4px; background: var(--cls-bg); color: var(--cls-accent); font-size: 12px; font-weight: 600; }
.cps .cps-assign { width: 100%; max-width: 280px; }
.cps-move-text { margin: 0 0 10px; }
.cps-dept { background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; padding: 12px 16px; margin-bottom: 10px; }
.cps-dept > .cps-people { color: var(--cls-text); }
.cps-tree { list-style: none; margin: 0; padding: 0 0 0 18px; border-left: 1px solid var(--cls-line); }
.cps-tree.cps-root { padding-left: 0; border-left: 0; }
.cps-tree li { margin: 0; }
.cps-node { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding: 6px 0; }
.cps-tree:not(.cps-root) > li > .cps-node { position: relative; }
.cps-tree:not(.cps-root) > li > .cps-node::before { content: ''; position: absolute; left: -18px; top: 16px; width: 12px; border-top: 1px solid var(--cls-line); }
.cps-people { color: var(--cls-muted); font-size: 13px; }
.cps-people i { font-style: normal; color: var(--cls-orange); }
@media (max-width: 700px) {
    .cps-card { padding: 12px; }
    .cps-fn { flex-direction: column; align-items: stretch; gap: 6px; }
    .cps .cps-scope { flex: none; width: 100%; height: 40px; font-size: 16px; }
    .cps .cps-assign { max-width: none; height: 40px; font-size: 16px; }
    .cps-mod-head { flex-wrap: wrap; }
    .cps-foot { justify-content: stretch; }
    .cps-foot .cls-btn { flex: 1; }
    .cps-tree { padding-left: 12px; }
    .cps-tree:not(.cps-root) > li > .cps-node::before { left: -12px; width: 8px; }
}

/* сотрудники компании (общий блок «Сотрудники») */
.cls-person { display: flex; align-items: center; gap: 10px; min-width: 0; }
.cls-ava {
    flex: 0 0 32px; width: 32px; height: 32px; border-radius: 50%; overflow: hidden;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--cls-bg); border: 1px solid var(--cls-line); color: var(--cls-muted); font-size: 13px; font-weight: 600;
}
.cls-ava img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tm-h2 { margin: 20px 0 8px; font-size: 13px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--cls-muted); }
.tm-counts { display: flex; flex-wrap: wrap; gap: 6px 16px; padding: 8px 10px; background: var(--cls-bg); border: 1px solid var(--cls-line); border-radius: 4px; }
.tm-counts b { color: var(--cls-text); }
.tm-team tbody tr:not(.cls-click) { cursor: default; }
@media (min-width: 701px) { .tm-m { display: none; } }
@media (max-width: 700px) { .tm-team .tm-d { display: none; } }

/* О4: цены (/prices) и квоты (/quotas) */
.prc-pick { position: relative; }
.prc-sugg { position: absolute; left: 0; right: 0; top: 100%; z-index: 20; max-height: 240px; overflow-y: auto; background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; box-shadow: 0 4px 12px rgba(0, 0, 0, .08); }
.prc-sugg[hidden] { display: none; }
.prc-sugg button { display: block; width: 100%; padding: 6px 10px; border: 0; background: transparent; text-align: left; font: inherit; color: var(--cls-text); cursor: pointer; }
.prc-sugg button:hover, .prc-sugg button:focus-visible { background: var(--cls-bg); }
.prc-muted { color: var(--cls-muted); font-size: .85em; }
.prc-old { color: var(--cls-muted); text-decoration: line-through; }
.cls-dialog.prc-wide { max-width: 900px; }
.prc-table, .prc-prev, .prc-hist, .qt-table { font-size: 13px; }
.prc-prev, .prc-hist { display: block; max-height: 60vh; overflow: auto; }
.qt-yellow { color: var(--cls-yellow); font-weight: 600; }
.qt-red { color: var(--cls-red); font-weight: 600; }
.qt-mine td { background: #f0f6fd; }
.qt .cls-sec + .cls-sec { margin-top: 16px; }
.qt .cls-c-act { display: flex; flex-wrap: wrap; gap: 4px; }

/* О5: кружок сегмента и ёмкость клиента */
.cls-seg {
    display: inline-flex; align-items: center; justify-content: center; flex: 0 0 24px; width: 24px; height: 24px; border-radius: 50%;
    font-size: 12px; font-weight: 700; line-height: 1; color: #fff; background: var(--cls-grey); vertical-align: middle; cursor: default;
}
.cls-seg[data-seg="A"] { background: var(--cls-green); }
.cls-seg[data-seg="B"] { background: #7cc47f; }
.cls-seg[data-seg="C"] { background: var(--cls-yellow); }
.cls-seg[data-seg="D"] { background: var(--cls-red); }
.cls-name .cls-seg { margin: -2px 6px 0 0; }
.cls-table .cls-seg { width: 20px; height: 20px; flex-basis: 20px; font-size: 11px; }
.cls-invalid, .cls-input.cls-invalid { border-color: var(--cls-red) !important; }
.cap-head {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 16px; margin-bottom: 4px;
    padding: 8px 10px; background: var(--cls-bg); border: 1px solid var(--cls-line); border-radius: 4px; font-size: 13px; color: var(--cls-muted);
}
.cap-head-s { display: inline-flex; align-items: center; gap: 6px; color: var(--cls-text); }
.cap-head-s b { font-size: 15px; }
.cap-ro { margin: 6px 0 0; }
.cap-table { font-size: 13px; }
.cap-table th { cursor: default; white-space: nowrap; }
.cap-table td { vertical-align: middle; }
.cap-crop { white-space: nowrap; }
.cap-ha { color: var(--cls-muted); white-space: nowrap; }
.cap-cell { padding-top: 4px !important; padding-bottom: 4px !important; }
.cap-in { width: 96px; height: 32px; padding: 0 8px; text-align: right; font-variant-numeric: tabular-nums; }
.cap-in::placeholder { color: var(--cls-grey); opacity: 1; }
.cap-in:disabled { background: var(--cls-bg); color: var(--cls-text); }
.cap-ph, .cap-tot { white-space: nowrap; font-variant-numeric: tabular-nums; }
.cap-tot { font-weight: 600; }
.cap-table tfoot td { padding: 8px 10px; border-top: 1px solid var(--cls-line); background: var(--cls-bg); font-weight: 600; }
.cap-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-top: 16px; }
.cap-crops { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; font-size: 13px; color: var(--cls-muted); }
.cap-crops-t { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.cap-crops-i { white-space: nowrap; color: var(--cls-text); }
.cap-act { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.cap-none p { margin: 0 0 12px; }
.cls-seg-f { display: inline-flex; gap: 4px; align-items: center; }
@media (max-width: 700px) {
    .cls-card-head .cls-seg + .cls-h1 { flex-basis: calc(100% - 34px); }
    .cap-table tfoot { display: block; }
    .cap-table tr { grid-template-columns: 1fr 1fr; gap: 8px 10px; }
    .cap-table td.cap-crop { grid-column: 1 / -1; font-weight: 600; }
    .cap-table td.cap-ha { grid-column: 1 / -1; }
    .cap-table td.cap-cell { padding: 0 !important; }
    .cap-table td.cap-cell::before { display: block; content: attr(data-l); margin-bottom: 3px; }
    .cap-in { width: 100%; height: 40px; font-size: 16px; }
    .cap-table td.cap-ph, .cap-table td.cap-tot { grid-column: span 1; }
    .cap-table tfoot tr { background: var(--cls-bg); }
    .cap-table tfoot td { padding: 0; border: 0; background: none; }
    .cap-table tfoot td.cap-ttot { text-align: right; }
    .cap-table tfoot td.cap-ttot::before { content: none; }
    .cap-act { width: 100%; margin-left: 0; flex-direction: column; align-items: stretch; }
    .cap-act .cls-form-msg { margin-right: 0; }
    #capSave { width: 100%; height: 40px; }
}

/* О6: «Договоры» — шаблоны */
.ct-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 14px; }
.ct-meta { display: inline-flex; align-items: center; gap: 8px; color: var(--cls-muted); font-size: 13px; }
.ct-comment { margin: 0 0 14px; padding: 10px 12px; border: 1px solid var(--cls-line); border-left: 3px solid var(--cls-orange); border-radius: 4px; background: var(--cls-bg); font-size: 13px; }
.ct-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 10px 16px; }
.ct-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 6px; border: 1px solid var(--cls-line); border-bottom: 0; border-radius: 4px 4px 0 0; background: var(--cls-bg); }
.ct-toolbar .cls-btn { height: 30px; min-width: 30px; padding: 0 8px; font-size: 13px; }
.ct-sep { width: 1px; height: 20px; margin: 0 4px; background: var(--cls-line); }
.ct-b { font-weight: 700; }
.ct-i { font-style: italic; }
.ct-u { text-decoration: underline; }
.ct-field { width: auto; max-width: 280px; height: 30px; font-size: 13px; }
.ct-editor { box-sizing: border-box; min-height: 360px; max-height: 70vh; overflow-y: auto; padding: 20px 24px; border: 1px solid var(--cls-line); border-radius: 0 0 4px 4px; background: #fff; outline: none; }
.ct-editor:focus { border-color: var(--cls-accent); }
.ct-editor.ct-ro { min-height: 0; max-height: none; border-radius: 4px; }
.ct-editor.ct-clause { min-height: 200px; }
.ct-check { display: flex; align-items: center; gap: 8px; margin-top: 12px; cursor: pointer; }
.ct-check input { width: 16px; height: 16px; margin: 0; }
.ct-doc { font-family: "Times New Roman", Times, serif; font-size: 15px; line-height: 1.5; color: #000; overflow-wrap: anywhere; }
.ct-doc h2 { margin: 14px 0 8px; font-size: 18px; font-weight: 700; text-align: center; }
.ct-doc h3 { margin: 12px 0 6px; font-size: 16px; font-weight: 700; }
.ct-doc p { margin: 0 0 8px; }
.ct-doc ol, .ct-doc ul { margin: 0 0 8px; padding-left: 24px; }
.ct-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 16px; }
.ct-grow { flex: 1; }
.ct-danger { color: var(--cls-red); }
.ct-vers { font-size: 13px; }
.ct-vers tr.ct-cur td { background: var(--cls-bg); font-weight: 600; }
.ct-vcomment { margin-top: 3px; color: var(--cls-muted); font-weight: 400; }
.ct-diff { max-height: 50vh; overflow-y: auto; padding: 12px 16px; border: 1px solid var(--cls-line); border-radius: 4px; background: #fff; font-family: "Times New Roman", Times, serif; font-size: 14px; line-height: 1.5; }
.ct-diff p { margin: 0 0 6px; padding-left: 8px; border-left: 3px solid transparent; }
.ct-diff p.ch { border-left-color: var(--cls-orange); }
.ct-diff p.in { border-left-color: var(--cls-green); background: rgba(46, 139, 71, .08); }
.ct-diff p.dl { border-left-color: var(--cls-red); background: rgba(208, 52, 44, .07); color: var(--cls-muted); text-decoration: line-through; }
.ct-diff ins { text-decoration: none; background: rgba(46, 139, 71, .18); color: #1f6a35; }
.ct-diff del { background: rgba(208, 52, 44, .14); color: #a4261f; }
.ct-textarea { width: 100%; height: auto; min-height: 96px; padding: 8px 10px; resize: vertical; }
.ct-sheet { box-sizing: border-box; max-height: 70vh; overflow-y: auto; padding: 24px 28px; border: 1px solid var(--cls-line); border-radius: 4px; background: #fff;
    font-family: "Times New Roman", Times, serif; font-size: 15px; line-height: 1.5; color: #000; overflow-wrap: anywhere; }
.ct-sheet h2 { margin: 14px 0 8px; font-size: 18px; text-align: center; }
.ct-sheet h3 { margin: 12px 0 6px; font-size: 16px; }
.ct-sheet p { margin: 0 0 8px; }
.ct-pt { width: 100%; margin: 8px 0 12px; border-collapse: collapse; font-size: 13px; }
.ct-pt th, .ct-pt td { padding: 4px 6px; border: 1px solid #000; text-align: left; vertical-align: top; }
.ct-pt th { font-weight: 700; }
.ct-pt td.num, .ct-pt th.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ct-pt tr.ct-pt-sum td { font-weight: 700; }
.ct-pt tr.ct-pt-sum td:first-child { text-align: right; }
@media (max-width: 700px) {
    .ct-grid { grid-template-columns: 1fr; }
    .ct-field { max-width: none; flex: 1 1 100%; height: 40px; font-size: 16px; }
    .ct-editor { min-height: 260px; padding: 14px; font-size: 16px; }
    .ct-sheet { padding: 14px; font-size: 14px; }
    .ct-sheet .ct-pt { font-size: 12px; }
    .ct-actions .cls-btn { flex: 1 1 auto; height: 40px; }
    .ct-grow { display: none; }
}
@media print {
    body.ct-printing * { visibility: hidden !important; }
    body.ct-printing #ctSheet, body.ct-printing #ctSheet * { visibility: visible !important; }
    body.ct-printing #ctSheet { position: absolute; left: 0; top: 0; width: 100%; max-height: none; overflow: visible; padding: 0; border: 0; font-size: 12pt; }
    body.ct-printing .ct-pt { font-size: 10pt; }
}

/* ---------- договоры клиента (О7) ---------- */
.cls-st[data-s="head"] { border-color: var(--cls-accent); color: var(--cls-accent); }
.cls-st[data-s="price"] { border-color: var(--cls-orange); color: var(--cls-orange); }
.cls-st[data-s="signed"] { border-color: var(--cls-green); background: var(--cls-green); color: #fff; }
.cc-table .cls-c-act { white-space: nowrap; }
.cc-table tr.cls-click.on td { background: #fafafb; }
.cc-detail td { background: #fafafb; padding: 12px 16px; }
.cc-lines { display: flex; flex-direction: column; gap: 4px; }
.cc-line { display: grid; grid-template-columns: 1fr auto auto; gap: 4px 16px; font-size: 13px; padding: 4px 0; border-bottom: 1px solid var(--cls-line); }
.cc-line:last-child { border-bottom: 0; }
.cc-l-qty { color: var(--cls-muted); }
.cc-l-sum { font-variant-numeric: tabular-nums; min-width: 90px; text-align: right; }
.cc-l-low { grid-column: 1 / -1; color: var(--cls-orange); font-size: 12px; }
.cc-line.low .cc-l-name::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--cls-orange); margin-right: 6px; vertical-align: middle; }
.cc-steps-h, .cc-req-h { font-size: 12px; font-weight: 600; color: var(--cls-muted); text-transform: uppercase; letter-spacing: .03em; margin: 14px 0 6px; }
.cc-steps { list-style: none; margin: 0; padding: 0; font-size: 13px; }
.cc-steps li { padding: 4px 0 4px 12px; border-left: 2px solid var(--cls-line); }
.cc-steps li[data-s="returned"] { border-left-color: var(--cls-red); }
.cc-steps li[data-s="approved"], .cc-steps li[data-s="signed"] { border-left-color: var(--cls-green); }
.cc-s-at { color: var(--cls-muted); font-variant-numeric: tabular-nums; }
.cc-s-com { margin-top: 2px; white-space: pre-wrap; }
.cc-decide { margin-top: 12px; display: flex; flex-direction: column; gap: 8px; }
.cc-decide .cls-actions, .cc-foot { justify-content: flex-end; align-items: center; }
.cc-decide .cls-form-msg, .cc-foot .cls-form-msg { margin-right: auto; }
.cc-form { background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; padding: 16px; margin-bottom: 16px; }
.cc-form > .cls-field { margin-bottom: 12px; }
.cc-form > .cls-empty { border: 0; padding: 20px 0; }
.cc-rows-head, .cc-r { display: grid; grid-template-columns: minmax(0, 1fr) 60px 110px 110px 110px 32px; gap: 8px; align-items: center; }
.cc-rows-head { font-size: 12px; color: var(--cls-muted); text-transform: uppercase; letter-spacing: .03em; padding-bottom: 6px; border-bottom: 1px solid var(--cls-line); }
.cc-rows-head .num, .cc-r .num { text-align: right; }
.cc-r { padding: 6px 0; border-bottom: 1px solid var(--cls-line); }
.cc-r-name { overflow-wrap: anywhere; }
.cc-r-unit { color: var(--cls-muted); }
.cc-r-f > span { display: none; }
.cc-r-f .cls-input { width: 100%; height: 32px; padding: 4px 8px; }
.cc-r-f.err .cls-input, .cc-r-f.err .cls-select { border-color: var(--cls-red); }
.cc-r-sum { font-variant-numeric: tabular-nums; }
.cc-r .cls-edit { font-size: 18px; line-height: 1; }
.cc-add { margin-top: 8px; max-width: 420px; }
.cc-total { display: flex; justify-content: flex-end; gap: 16px; padding: 10px 40px 0 0; font-size: 15px; }
.cc-total b { font-variant-numeric: tabular-nums; }
.cc-req { padding: 0; }
.cc-foot { margin-top: 16px; }
@media (max-width: 700px) {
    .cc-rows-head { display: none; }
    .cc-r { grid-template-columns: 1fr 1fr 40px; grid-template-areas: "name name rm" "qty price price" "unit sum sum"; padding: 10px 0; }
    .cc-r-name { grid-area: name; font-weight: 600; }
    .cc-r-unit { grid-area: unit; }
    .cc-r-f:nth-of-type(1) { grid-area: qty; }
    .cc-r-f:nth-of-type(2) { grid-area: price; }
    .cc-r-sum { grid-area: sum; }
    .cc-r .cls-edit { grid-area: rm; justify-self: end; width: 40px; height: 40px; }
    .cc-r-f > span { display: block; font-size: 12px; color: var(--cls-muted); margin-bottom: 2px; }
    .cc-r-f .cls-input, .cc-form .cls-input, .cc-form .cls-select, .cc-decide .cls-input { height: 40px; font-size: 16px; }
    .cc-form textarea.cls-input, .cc-decide textarea.cls-input { height: auto; }
    .cc-total { padding-right: 0; }
    .cc-add { max-width: none; }
    .cc-line { grid-template-columns: 1fr auto; }
    .cc-l-qty { grid-column: 1 / -1; grid-row: 2; }
    .cc-foot .cls-btn, .cc-decide .cls-btn { flex: 1 1 auto; min-height: 40px; }
}

/* ---------- коммерческие предложения клиента (О10) ---------- */
.cls-st[data-s="approval"] { border-color: var(--cls-orange); color: var(--cls-orange); }
.cls-st[data-s="accepted"] { border-color: var(--cls-green); background: var(--cls-green); color: #fff; }
.cls-st[data-s="rejected"] { color: var(--cls-muted); }
.kp-fields { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.kp-fields .cls-input, .kp-fields .cls-select { width: 100%; height: 36px; }
.cc-r-f.low .cls-input { border-color: var(--cls-red); }
.kp-min { display: block; font-size: 12px; color: var(--cls-muted); }
.cc-r .kp-min, .cc-r .cc-l-low { display: block; font-size: 12px; margin-top: 2px; }
.kp-meta { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 12px; color: var(--cls-muted); margin-bottom: 8px; }
.kp-act { margin: 2px 0 2px 4px; }
.kp-low-hint { color: var(--cls-orange); margin-top: 8px; }
/* О10: вкладка «Шаблоны КП» в /contracts */
.cls-st[data-s="archived"] { color: var(--cls-muted); }
.kp-tpl tr[data-kp] { cursor: pointer; }
.kp-tpl tr.kp-tpl-arch td { color: var(--cls-muted); }
.kp-tpl-grid { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); margin-bottom: 12px; }
.kp-tpl-grid .cls-input, .kp-tpl-grid .cls-select { width: 100%; height: 36px; }
@media (max-width: 700px) {
    .kp-fields { grid-template-columns: 1fr; }
    .kp-fields .cls-input, .kp-fields .cls-select { height: 40px; font-size: 16px; }
    .kp-act { min-height: 40px; }
    .kp-tpl-grid { grid-template-columns: 1fr; }
    .kp-tpl-grid .cls-input, .kp-tpl-grid .cls-select { height: 40px; font-size: 16px; }
}

/* О8: рейтинг клиента — 5 кругов в шапке карточки и в списке */
.rt-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-bottom: 6px; }
.rt-c { display: inline-flex; align-items: center; gap: 6px; padding: 2px 4px 2px 2px; border-radius: 4px; cursor: pointer; font-size: 13px; }
.rt-c:hover, .rt-c:focus-visible, .rt-c.on { background: var(--cls-bg); outline: none; }
.rt-c .cls-seg { cursor: pointer; }
.rt-n { color: var(--cls-text); }
.rt-sel { width: auto; min-width: 0; height: 32px; padding: 0 10px; border-radius: 4px; font-size: 13px; }
.rt-total { margin-left: auto; font-size: 13px; font-weight: 600; color: var(--cls-text); white-space: nowrap; }
.rt-hint { margin-bottom: 12px; font-size: 13px; color: var(--cls-muted); white-space: pre-line; }
.rt-hint:empty { display: none; }
.rt-list { display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; }
.cls-table .rt-list .cls-seg { width: 16px; height: 16px; flex-basis: 16px; font-size: 10px; }
.rt-sum { margin-left: 4px; font-size: 13px; color: var(--cls-text); }
@media (max-width: 700px) {
    .rt-row { gap: 6px 10px; }
    .rt-total { flex-basis: 100%; margin-left: 0; }
    .cls-table .rt-list .cls-seg { width: 20px; height: 20px; flex-basis: 20px; font-size: 11px; }
}

/* О9: сделки — воронка, таблица, этапы, окно сделки */
.dl-c-grey { --dl-c: #8a9099; } .dl-c-blue { --dl-c: #5b7fa8; } .dl-c-teal { --dl-c: #4f8f8b; } .dl-c-green { --dl-c: #6a9a62; }
.dl-c-olive { --dl-c: #8d8c4e; } .dl-c-amber { --dl-c: #b8913f; } .dl-c-rust { --dl-c: #b06a4d; } .dl-c-plum { --dl-c: #8a6889; }
.dl-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--dl-c, #8a9099); flex: 0 0 10px; }
.dl-muted { color: var(--cls-muted); }
.dl-static { min-height: 36px; display: flex; align-items: center; }
.dl-dialog { max-width: 860px; }
.dl-find { position: relative; }
.dl-find-list { position: absolute; left: 0; right: 0; top: 100%; z-index: 5; margin: 2px 0 0; padding: 0; list-style: none; background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; max-height: 240px; overflow-y: auto; box-shadow: 0 4px 12px rgba(0,0,0,.08); }
.dl-find-list button { display: block; width: 100%; text-align: left; padding: 8px 10px; border: 0; background: none; font: inherit; color: var(--cls-text); cursor: pointer; }
.dl-find-list button:hover, .dl-find-list button:focus-visible { background: var(--cls-bg); outline: none; }
.dl-rows-head, .dl-r { display: grid; grid-template-columns: 130px minmax(0, 1fr) 50px 90px 100px 100px 32px; gap: 8px; align-items: center; }
.dl-rows-head { font-size: 12px; color: var(--cls-muted); text-transform: uppercase; letter-spacing: .03em; padding-bottom: 6px; border-bottom: 1px solid var(--cls-line); }
.dl-rows-head .num, .dl-r .num { text-align: right; }
.dl-r { padding: 6px 0; border-bottom: 1px solid var(--cls-line); }
.dl-r .cls-select { width: 100%; height: 32px; min-width: 0; }
.dl-r .cls-edit { font-size: 18px; line-height: 1; }
.dl-r-unit { color: var(--cls-muted); overflow-wrap: anywhere; }
.dl-lines-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 8px; }
.dl-lines-foot .cc-total { padding-top: 0; }
.dl-noprice { margin: 0 0 8px; padding: 10px 12px; border: 1px solid var(--cls-line); border-left: 3px solid var(--cls-yellow); border-radius: 4px; background: var(--cls-bg); font-size: 13px; color: var(--cls-text); }
.dl-noprice p { margin: 0; } .dl-noprice p + p { margin-top: 4px; }
.dl-noprice a { color: var(--cls-accent); font-weight: 600; }
/* сводка по этапам */
.dl-sums { display: flex; gap: 8px; margin-bottom: 12px; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 2px; }
.dl-sum { flex: 1 0 140px; min-width: 140px; border: 1px solid var(--cls-line); border-top: 3px solid var(--dl-c, #8a9099); border-radius: 4px; background: #fff; padding: 8px 10px; font-size: 13px; text-align: left; font-family: inherit; color: var(--cls-text); cursor: pointer; }
.dl-sum.on { box-shadow: inset 0 0 0 1px var(--cls-accent); }
.dl-sum-n { display: block; color: var(--cls-muted); font-size: 11px; text-transform: uppercase; letter-spacing: .03em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dl-sum b { display: block; margin-top: 2px; font-size: 15px; font-variant-numeric: tabular-nums; }
/* воронка */
.dl-board { display: flex; gap: 8px; overflow-x: auto; align-items: flex-start; padding-bottom: 8px; }
.dl-col { flex: 0 0 240px; background: var(--cls-bg); border: 1px solid var(--cls-line); border-radius: 4px; display: flex; flex-direction: column; max-height: calc(100vh - 240px); min-height: 160px; }
/* ПК: колонки и суммы переносятся на следующую строку, прокрутки вбок нет (на Windows мышью её не прокрутить); на телефоне — лента с прокруткой внутри блока */
@media (min-width: 701px) {
    .dl-sums { flex-wrap: wrap; overflow-x: visible; }
    .dl-sum { min-width: 0; }
    .dl-board { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); overflow-x: visible; }
    .dl-col { min-width: 0; max-height: min(560px, calc(100vh - 240px)); }
    .dl-card-m > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
.dl-col.over { box-shadow: inset 0 0 0 2px var(--cls-accent); }
.dl-col-h { padding: 8px 10px; border-bottom: 1px solid var(--cls-line); border-top: 3px solid var(--dl-c, #8a9099); border-radius: 4px 4px 0 0; background: #fff; }
.dl-col-t { display: flex; align-items: center; justify-content: space-between; gap: 6px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; }
.dl-col-s { font-size: 12px; color: var(--cls-muted); font-variant-numeric: tabular-nums; margin-top: 2px; }
.dl-col-b { padding: 6px; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.dl-card { background: #fff; border: 1px solid var(--cls-line); border-left: 3px solid var(--dl-c, #8a9099); border-radius: 4px; padding: 8px 10px; font-size: 13px; cursor: pointer; }
.dl-card[draggable="true"] { cursor: grab; }
.dl-card.drag { opacity: .4; }
.dl-card:hover { border-color: #b9c0c8; }
.dl-card-n { font-weight: 600; overflow-wrap: anywhere; }
.dl-card-a { margin-top: 2px; font-variant-numeric: tabular-nums; }
.dl-card-m { margin-top: 4px; display: flex; justify-content: space-between; gap: 8px; color: var(--cls-muted); font-size: 12px; }
.dl-card .cls-select { margin-top: 6px; width: 100%; }
.dl-list { display: none; }
/* таблица */
.dl-bar { flex-wrap: wrap; }
.dl-bar .cls-select { width: auto; min-width: 150px; }
.dl-st { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.cls-table tr.dl-tr { cursor: pointer; }
/* этапы */
.dl-stages { max-width: 720px; }
.dl-sg { display: grid; grid-template-columns: 24px minmax(0, 1fr) 150px 32px 32px auto; gap: 8px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--cls-line); }
.dl-sg.arch .cls-input { color: var(--cls-muted); text-decoration: line-through; }
.dl-sg-k { font-size: 11px; color: var(--cls-muted); text-transform: uppercase; letter-spacing: .03em; }
.dl-sg .cls-edit { width: 32px; height: 32px; }
.dl-sg-foot { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.dl-sg-foot .cls-form-msg { margin-right: auto; }
@media (max-width: 700px) {
    .dl-rows-head { display: none; }
    .dl-r { grid-template-columns: 1fr 1fr 40px; grid-template-areas: "type type rm" "prod prod prod" "qty price price" "unit sum sum"; padding: 10px 0; }
    .dl-r .dl-r-type { grid-area: type; } .dl-r .dl-r-prod { grid-area: prod; } .dl-r .dl-r-qty { grid-area: qty; } .dl-r .dl-r-price { grid-area: price; }
    .dl-r .dl-r-unit { grid-area: unit; } .dl-r .dl-r-sum { grid-area: sum; }
    .dl-r .cls-edit { grid-area: rm; justify-self: end; width: 40px; height: 40px; }
    .dl-r .cc-r-f > span { display: block; font-size: 12px; color: var(--cls-muted); margin-bottom: 2px; }
    .dl-r .cls-input, .dl-r .cls-select, .dl-dialog .cls-input, .dl-dialog .cls-select, .dl-card .cls-select, .dl-bar .cls-select, .dl-sg .cls-input, .dl-sg .cls-select { height: 40px; font-size: 16px; }
    .dl-dialog textarea.cls-input { height: auto; }
    .dl-lines-foot { flex-wrap: wrap; }
    .dl-noprice { font-size: 14px; }
    .dl-lines-foot .cls-btn { flex: 1 1 100%; min-height: 40px; }
    .dl-lines-foot .cc-total { padding-right: 0; width: 100%; }
    .dl-sum { flex: 0 0 132px; min-width: 132px; }
    .dl-board { display: none; }
    .dl-list { display: flex; flex-direction: column; gap: 6px; }
    .dl-bar .cls-select { flex: 1 1 100%; min-width: 0; }
    .dl-sg { grid-template-columns: 20px minmax(0, 1fr) 40px 40px; grid-template-areas: "k k k k" "dot name up down" "col col col arch"; }
    .dl-sg-k { grid-area: k; } .dl-sg .dl-dot { grid-area: dot; } .dl-sg .dl-sg-name { grid-area: name; }
    .dl-sg .dl-sg-up { grid-area: up; } .dl-sg .dl-sg-down { grid-area: down; } .dl-sg .dl-sg-col { grid-area: col; } .dl-sg .dl-sg-arch { grid-area: arch; }
    .dl-sg .cls-edit { width: 40px; height: 40px; }
    .dl-sg-foot .cls-btn { flex: 1 1 auto; min-height: 40px; }
}

/* ---------- счета клиента и блок «Долг» (О11) ---------- */
.cls-st[data-s="partial"] { border-color: var(--cls-orange); color: var(--cls-orange); }
.cls-st[data-s="paid"] { border-color: var(--cls-green); background: var(--cls-green); color: #fff; }
.cls-st[data-s="overdue"] { border-color: var(--cls-red); color: var(--cls-red); }
.cls-st[data-s="cancelled"] { color: var(--cls-muted); }
.inv-debt { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 32px; padding: 10px 12px; margin-bottom: 12px; border: 1px solid var(--cls-line); border-radius: 4px; }
.inv-debt.late { border-left: 3px solid var(--cls-red); }
.inv-debt-main, .inv-debt-late { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.inv-debt-l { font-size: 11px; font-variant: all-small-caps; letter-spacing: .04em; color: var(--cls-muted); }
.inv-debt b { font-size: 16px; font-variant-numeric: tabular-nums; }
.inv-debt-late b, .inv-late { color: var(--cls-red); }
.inv-debt-since { font-size: 12px; color: var(--cls-red); }
.inv-late small { font-size: 12px; }
.inv-table tr.inv-off td { color: var(--cls-muted); }
.inv-act { margin: 2px 0 2px 4px; white-space: nowrap; }
.inv-form-title { font-weight: 600; margin-bottom: 10px; }
.inv-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 8px; }
.inv-fields .cls-input, .inv-fields .cls-select { width: 100%; height: 36px; }
.inv-f-wide { grid-column: 1 / -1; }
.inv-f-wide .cls-hint { display: block; margin-top: 4px; font-size: 12px; }
.inv-amt { display: flex; gap: 6px; }
.inv-amt .cls-input { flex: 1 1 auto; min-width: 0; }
.inv-amt .cls-btn { flex: none; white-space: nowrap; }
.inv-pay-head { font-size: 11px; font-variant: all-small-caps; letter-spacing: .04em; color: var(--cls-muted); margin-bottom: 4px; }
.inv-pays { border-top: 1px solid var(--cls-line); margin-bottom: 8px; }
.inv-pay { display: grid; grid-template-columns: 90px 120px 140px minmax(0, 1fr); gap: 8px; padding: 5px 0; border-bottom: 1px solid var(--cls-line); font-size: 13px; }
.inv-pay .num { text-align: right; font-variant-numeric: tabular-nums; }
.inv-pay-c { color: var(--cls-muted); overflow-wrap: anywhere; }
@media (max-width: 700px) {
    .inv-fields { grid-template-columns: 1fr; }
    .inv-fields .cls-input, .inv-fields .cls-select { height: 40px; font-size: 16px; }
    .inv-act, .inv-amt .cls-btn { min-height: 40px; }
    .inv-pay { grid-template-columns: 1fr auto; }
    .inv-pay .inv-pay-c { grid-column: 1 / -1; }
}

/* О11: долги клиентов */
.dbt-tots { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
.dbt-tot { border: 1px solid var(--cls-line); border-radius: 4px; padding: 8px 12px; min-width: 0; }
.dbt-tot-n { display: block; font-size: 11px; font-variant: all-small-caps; letter-spacing: .04em; color: var(--cls-muted); }
.dbt-tot b { display: block; font-size: 18px; font-weight: 600; color: var(--cls-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dbt-tot.late b { color: #c0392b; }
.cls-debt-late { color: #c0392b; font-size: 12px; white-space: nowrap; }
.dbt-table tr.cls-click { cursor: pointer; }
@media (max-width: 767px) {
    .dbt-tots { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dbt .cls-input, .dbt .cls-select { height: 40px; font-size: 16px; }
}

/* О12: отсутствия — график месяца, заявления */
.abs-cover { border: 1px solid var(--cls-line); border-left: 3px solid var(--cls-accent); border-radius: 4px; padding: 8px 12px; margin-bottom: 12px; font-size: 13px; }
.abs-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.abs-month { display: flex; align-items: center; gap: 6px; }
.abs-month-n { min-width: 130px; text-align: center; font-weight: 600; }
.abs-nav { width: 36px; padding: 0; }
.abs-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12px; color: var(--cls-muted); }
.abs-lg { display: inline-flex; align-items: center; gap: 5px; }
.abs-sw { display: inline-block; width: 10px; height: 10px; border-radius: 2px; vertical-align: -1px; flex: none; }
.abs-t-vacation { background: #6f9bd1; }
.abs-t-sick { background: #d98a86; }
.abs-t-dayoff { background: #8fb3a0; }
.abs-t-trip { background: #d6b46a; }
.abs-review { background-image: repeating-linear-gradient(45deg, rgba(255,255,255,.55) 0 3px, transparent 3px 6px); }
.abs-h2 { font-size: 13px; font-weight: 600; font-variant: all-small-caps; letter-spacing: .05em; color: var(--cls-muted); margin: 20px 0 8px; }
.abs-scroll { overflow-x: auto; border: 1px solid var(--cls-line); border-radius: 4px; }
.abs-grid { border-collapse: collapse; width: 100%; font-size: 12px; }
.abs-grid th, .abs-grid td { border-bottom: 1px solid var(--cls-line); padding: 0; }
.abs-grid .abs-name { position: sticky; left: 0; z-index: 1; background: #fff; min-width: 160px; max-width: 220px; padding: 6px 10px; text-align: left; font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-right: 1px solid var(--cls-line); }
.abs-grid th.abs-name { font-size: 11px; font-variant: all-small-caps; letter-spacing: .04em; color: var(--cls-muted); }
.abs-grid .abs-d { width: 26px; min-width: 26px; height: 28px; text-align: center; }
.abs-grid th.abs-d { font-weight: 400; padding: 4px 0; line-height: 1.1; }
.abs-grid th.abs-d span { display: block; font-size: 12px; color: var(--cls-text); }
.abs-grid th.abs-d small { display: block; font-size: 10px; color: var(--cls-muted); }
.abs-grid .abs-d.off:not(.abs-on) { background: #fafafb; }
.abs-grid th.abs-d.today { box-shadow: inset 0 -2px 0 var(--cls-accent); }
.abs-grid th.abs-d.today span { color: var(--cls-accent); font-weight: 600; }
.abs-grid td.abs-on { background-clip: content-box; padding: 6px 0; cursor: pointer; }
.abs-grid td.abs-on.s { padding-left: 2px; }
.abs-grid td.abs-on.e { padding-right: 2px; }
.abs-list { display: none; }
.abs-li { border-bottom: 1px solid var(--cls-line); padding: 8px 0; }
.abs-li-n { font-weight: 600; margin-bottom: 4px; }
.abs-li-it { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; width: 100%; min-height: 40px; padding: 6px 0; border: 0; background: none; text-align: left; font: inherit; color: inherit; cursor: pointer; }
.abs-muted { color: var(--cls-muted); font-size: 12px; }
.abs-st { display: inline-block; font-size: 12px; padding: 1px 6px; border: 1px solid var(--cls-line); border-radius: 3px; white-space: nowrap; }
.abs-st.review { color: #8a6d1f; border-color: #e4d3a3; }
.abs-st.approved { color: var(--cls-green); border-color: #b9dcc3; }
.abs-st.rejected { color: #c0392b; border-color: #ebc0bb; }
.abs-st.cancelled { color: var(--cls-muted); }
.abs-acts { text-align: right; white-space: nowrap; }
.abs-acts .cls-btn + .cls-btn { margin-left: 6px; }
.abs-hint { display: block; margin-top: 4px; font-size: 12px; color: var(--cls-muted); }
.abs-item { font-size: 13px; }
.abs-row { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--cls-line); overflow-wrap: anywhere; }
.abs-k { color: var(--cls-muted); font-size: 12px; font-variant: all-small-caps; letter-spacing: .04em; }
.abs-link { border: 0; background: none; padding: 0; font: inherit; color: var(--cls-accent); text-decoration: underline; cursor: pointer; }
@media (max-width: 767px) {
    .abs-scroll { display: none; }
    .abs-list { display: block; }
    .abs .cls-input, .abs .cls-select { height: 40px; font-size: 16px; }
    .abs-nav { width: 40px; height: 40px; }
    .abs-month-n { flex: 1 1 auto; }
    .abs-row { grid-template-columns: 1fr; gap: 2px; }
    .abs-acts { text-align: left; white-space: normal; }
}

/* О12: значок отсутствия рядом с именем */
.abs-badge { display: inline-block; margin-left: 6px; padding: 0 6px; border: 1px solid var(--cls-line); border-left: 3px solid #6f9bd1; border-radius: 3px; font-size: 11px; font-weight: 400; line-height: 18px; color: var(--cls-muted); white-space: nowrap; vertical-align: 1px; }
.abs-b-sick { border-left-color: #d98a86; }
.abs-b-dayoff { border-left-color: #8fb3a0; }
.abs-b-trip { border-left-color: #d6b46a; }

/* О13: журнал действий */
.log-bar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.log-date { display: inline-flex; align-items: center; gap: 6px; }
.log-date span { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--cls-muted); }
.log-table .log-at { white-space: nowrap; }
.log-table .log-sys { color: var(--cls-muted); }
.log-table .log-cl { color: var(--cls-accent); text-decoration: none; }
.log-table .log-text { overflow-wrap: anywhere; }
.log-more { text-align: center; padding: 12px 0; }
.log-rem { padding: 12px 16px; }
.log-rem-h { font-weight: 600; margin-bottom: 2px; }
.log-rem-hint { font-size: 12px; color: var(--cls-muted); margin-bottom: 8px; }
.log-rule { display: flex; align-items: center; gap: 16px; padding: 8px 0; border-bottom: 1px solid var(--cls-line); }
.log-rule-n { flex: 1; min-width: 0; }
.log-chk, .log-days { display: inline-flex; align-items: center; gap: 6px; }
.log-days span { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--cls-muted); }
.log-days .cls-input { width: 72px; }
.log-rem-f { margin-top: 12px; display: flex; align-items: center; gap: 12px; }
.log-rem-msg { font-size: 12px; color: var(--cls-muted); }
@media (max-width: 767px) {
    .log .cls-input, .log .cls-select { height: 40px; font-size: 16px; }
    .log-bar > *, .log-date { width: 100%; }
    .log-date .cls-input { flex: 1; }
    .log-rule { flex-wrap: wrap; gap: 8px 16px; }
    .log-rule-n { flex-basis: 100%; }
}
/* ---------- план продаж: комментарии ---------- */
.cpl-cmt-btn { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; height: 22px; padding: 0 6px; border: 1px solid var(--cls-line); border-radius: 4px; background: #fff; font: inherit; font-size: 12px; color: var(--cls-muted); cursor: pointer; }
.cpl-cmt-btn:hover { border-color: var(--cls-accent); color: var(--cls-accent); }
.cpl-cmt-n { min-width: 14px; font-weight: 600; text-align: center; }
.cpl-cmt-btn.on .cpl-cmt-n { color: var(--cls-accent); }
.cpl-cmt-hist { max-height: 280px; overflow-y: auto; border: 1px solid var(--cls-line); border-radius: 4px; background: var(--cls-bg); }
.cpl-cmt-list { list-style: none; margin: 0; padding: 0; }
.cpl-cmt { padding: 8px 10px; border-bottom: 1px solid var(--cls-line); }
.cpl-cmt:last-child { border-bottom: 0; }
.cpl-cmt-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; font-size: 12px; }
.cpl-cmt-kind { padding: 0 6px; border: 1px solid var(--cls-line); border-left: 3px solid var(--cls-grey); border-radius: 3px; background: #fff; line-height: 18px; color: var(--cls-text); white-space: nowrap; }
.cpl-cmt-agreed { border-left-color: var(--cls-accent); }
.cpl-cmt-fact { border-left-color: var(--cls-green); }
.cpl-cmt-prod { font-weight: 600; color: var(--cls-text); }
.cpl-cmt-meta { color: var(--cls-muted); }
.cpl-cmt-text { margin-top: 4px; font-size: 13px; line-height: 1.4; color: var(--cls-text); white-space: pre-wrap; overflow-wrap: anywhere; }
.cpl-cmt-none { padding: 12px 10px; font-size: 13px; color: var(--cls-muted); }
.cpl-cmt-in { width: 100%; min-height: 80px; resize: vertical; box-sizing: border-box; }
.cpl-cmt-lost { margin-top: 12px; border: 1px solid var(--cls-line); border-radius: 4px; }
.cpl-cmt-lost-h { padding: 8px 10px; border-bottom: 1px solid var(--cls-line); font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--cls-muted); }
@media (max-width: 760px) {
    .cpl-cmt-btn { height: 32px; padding: 0 10px; }
    .cpl-cmt-in { font-size: 16px; }
}

/* О13: импорт из 1С и Битрикс24 (/import) */
.imp-form { padding: 14px 16px; margin-bottom: 14px; }
.imp-warn { margin-bottom: 10px; color: var(--cls-orange); }
.imp-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.imp-fld { display: flex; flex-direction: column; gap: 4px; min-width: 160px; }
.imp-fld > span { font-size: 12px; color: var(--cls-muted); }
.imp-file { flex: 1 1 240px; }
.imp-counts { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0; }
.imp-cnt { padding: 4px 10px; border-radius: 12px; font-size: 13px; border: 1px solid var(--cls-line); color: var(--cls-text); }
.imp-s-new { color: var(--cls-green); }
.imp-s-update { color: var(--cls-accent); }
.imp-s-skip { color: var(--cls-grey); }
.imp-s-bad { color: var(--cls-red); }
.imp-cnt.imp-s-new { border-color: var(--cls-green); }
.imp-cnt.imp-s-update { border-color: var(--cls-accent); }
.imp-cnt.imp-s-bad { border-color: var(--cls-red); }
.imp-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 10px; }
.imp-table td { vertical-align: top; }
.imp-st { white-space: nowrap; font-weight: 600; }
.imp-data { font-size: 12px; color: var(--cls-muted); word-break: break-word; max-width: 420px; }
.imp-h2 { margin: 22px 0 10px; font-size: 16px; font-weight: 600; color: var(--cls-text); }
@media (max-width: 760px) {
    .imp-row { flex-direction: column; align-items: stretch; }
    .imp-fld { min-width: 0; }
    .imp-fld select, .imp-fld input { font-size: 16px; }
    .imp-data { max-width: none; }
}

/* О5 «Маркетинг»: пороги сегментов (вкладки Сегментация / Доля продаж / Снижение от потенциала) */
.msg-intro {
    margin: 0 0 14px; padding: 10px 12px; font-size: 13px; line-height: 1.45; color: var(--cls-text);
    background: var(--cls-bg); border-left: 3px solid var(--cls-accent); border-radius: 0 4px 4px 0;
}
.msg-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 14px; align-items: start; }
.msg-card { min-width: 0; padding: 14px 16px; background: #fff; border: 1px solid var(--cls-line); border-radius: 4px; }
.msg-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.msg-title { margin: 0; font-size: 16px; font-weight: 600; color: var(--cls-text); }
.msg-badge { flex: 0 0 auto; padding: 2px 8px; font-size: 12px; color: var(--cls-muted); background: var(--cls-bg); border-radius: 10px; white-space: nowrap; }
.msg-hint { margin: 0 0 8px; line-height: 1.4; }
.msg-state { margin: 4px 0 8px; padding: 6px 10px; font-size: 12px; color: var(--cls-orange); background: #fdf3e7; border-radius: 4px; }
.msg-label { margin: 12px 0 6px; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--cls-muted); }
.msg-scale { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3px; }
.msg-step { min-width: 0; }
.msg-bar { display: block; height: 8px; background: var(--cls-grey); }
.msg-step:first-child .msg-bar { border-radius: 4px 0 0 4px; }
.msg-step:last-child .msg-bar { border-radius: 0 4px 4px 0; }
.msg-step[data-seg="A"] .msg-bar { background: var(--cls-green); }
.msg-step[data-seg="B"] .msg-bar { background: #7cc47f; }
.msg-step[data-seg="C"] .msg-bar { background: var(--cls-yellow); }
.msg-step[data-seg="D"] .msg-bar { background: var(--cls-red); }
.msg-card.unset { border-style: dashed; }
.msg-card.unset .msg-bar { opacity: .35; }
.msg-step-l { display: flex; flex-direction: column; gap: 1px; padding-top: 5px; font-size: 12px; line-height: 1.3; }
.msg-step-l b { font-weight: 700; color: var(--cls-text); }
.msg-step-l span { color: var(--cls-muted); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.msg-grid { display: flex; flex-direction: column; gap: 8px; }
.msg-field { display: grid; grid-template-columns: minmax(0, 1fr) 190px; align-items: center; gap: 10px; margin: 0; }
.msg-field label { display: inline-flex; align-items: center; gap: 8px; margin: 0; min-width: 0; font-size: 13px; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--cls-text); }
.msg-field label .cls-seg { width: 22px; height: 22px; flex-basis: 22px; font-size: 11px; }
.msg-in { position: relative; display: flex; align-items: center; }
.msg-in .cls-input { width: 100%; min-width: 0; padding-right: 34px; text-align: right; font-variant-numeric: tabular-nums; }
.msg-in .cls-input:disabled { background: var(--cls-bg); color: var(--cls-muted); }
.msg-unit { position: absolute; right: 10px; font-size: 13px; color: var(--cls-muted); pointer-events: none; }
.msg-d { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--cls-line); font-size: 13px; color: var(--cls-text); font-variant-numeric: tabular-nums; }
.msg-d .cls-seg { width: 22px; height: 22px; flex-basis: 22px; font-size: 11px; }
.msg-foot { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 12px; }
.msg-foot .cls-form-msg { min-width: 0; font-size: 12px; }
@media (max-width: 700px) {
    .msg-cards { grid-template-columns: minmax(0, 1fr); gap: 10px; }
    .msg-card { padding: 12px; }
    .msg-field { grid-template-columns: minmax(0, 1fr) minmax(0, 140px); gap: 8px; }
    .msg-step-l { font-size: 11px; }
    .msg-foot { flex-wrap: wrap; }
    .msg-foot .cls-btn { flex: 1 1 100%; justify-content: center; }
    .msg-foot .cls-form-msg { flex: 1 1 100%; margin: 0; }
}

/* вкладка «Заявки» — заявки в клиенты консультанту; блок «Требует внимания» над списком */
.cls .cls-tab-n-red { margin-left: 6px; display: inline-block; min-width: 18px; padding: 0 5px; border-radius: 9px; background: var(--cls-red); color: #fff; font-size: 11px; line-height: 18px; text-align: center; font-weight: 600; }
.cls .cls-tab-n-red:empty { display: none; }
.cls-rq-msg { margin: 0 0 12px; padding: 10px 12px; border-radius: 8px; background: #e9f7ef; color: var(--cls-text); font-size: 13px; overflow-wrap: anywhere; }
.cls-rq-msg.bad { background: #fdecec; }
.cls-rq-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 12px; }
.cls-rq { min-width: 0; display: flex; flex-direction: column; gap: 10px; padding: 14px; border: 1px solid var(--cls-line); border-radius: 10px; background: var(--cls-bg); overflow-wrap: anywhere; }
.cls-rq-head { display: flex; align-items: center; gap: 10px; min-width: 0; }
.cls-rq-ava { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; object-fit: cover; display: inline-flex; align-items: center; justify-content: center; background: var(--cls-line); color: var(--cls-muted); font-weight: 600; font-size: 14px; }
.cls-rq-who { min-width: 0; }
.cls-rq-name { display: block; font-weight: 600; color: var(--cls-text); text-decoration: none; }
a.cls-rq-name:hover { color: var(--cls-accent); }
.cls-rq-sub { color: var(--cls-muted); font-size: 12px; margin-top: 2px; }
.cls-rq-sub a { color: inherit; }
.cls-rq-desc { font-size: 13px; color: var(--cls-text); white-space: pre-line; }
.cls-rq-block { display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.cls-rq-block > b { font-size: 12px; color: var(--cls-muted); font-weight: 600; }
.cls-rq-srv { display: flex; justify-content: space-between; gap: 10px; min-width: 0; }
.cls-rq-srv > span:first-child { min-width: 0; }
.cls-rq-srv small { display: block; color: var(--cls-muted); font-size: 12px; }
.cls-rq-sum { flex: 0 0 auto; white-space: nowrap; }
.cls-rq-total { padding-top: 6px; border-top: 1px solid var(--cls-line); }
.cls-rq-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.cls-rq-chip { max-width: 100%; padding: 3px 8px; border-radius: 12px; background: var(--cls-line); font-size: 12px; }
.cls-rq-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; }
.cls-rq-acts .cls-btn { flex: 1 1 0; min-width: 0; }
.cls-att { margin: 0 0 14px; padding: 12px; border: 1px solid var(--cls-line); border-left: 3px solid var(--cls-orange); border-radius: 10px; background: var(--cls-bg); scroll-margin-top: 80px; }
.cls-att-h { font-weight: 600; font-size: 14px; margin-bottom: 8px; }
.cls-att-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 8px; }
.cls-att-i { min-width: 0; display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border: 1px solid var(--cls-line); border-radius: 8px; background: transparent; color: var(--cls-text); font: inherit; font-size: 13px; text-align: left; text-decoration: none; overflow-wrap: anywhere; }
a.cls-att-i, button.cls-att-i { cursor: pointer; }
a.cls-att-i:hover, button.cls-att-i:hover { border-color: var(--cls-accent); }
.cls-att-i.late { border-left: 3px solid var(--cls-red); }
.cls-att-i.soon { border-left: 3px solid var(--cls-yellow); }
.cls-att-t, .cls-att-x { color: var(--cls-muted); font-size: 12px; }
@media (max-width: 560px) {
    .cls-rq-acts .cls-btn { flex: 1 1 100%; }
    .cls-att-i { min-height: 40px; }
}

/* QA 26.10: счётчик у заголовка — бейдж, размеры кнопок по эталону (32px ПК / 40px телефон) */
.cls-count { display: inline-block; margin-left: 4px; padding: 0 6px; border: 1px solid var(--cls-line); border-radius: 4px; color: var(--cls-muted); font-size: 13px; font-weight: 400; line-height: 20px; vertical-align: middle; }
.cls-count:empty { display: none; }
.cls-table td.cls-c-name, .cls-table td.cls-c-name * { overflow-wrap: break-word; word-break: normal; }
.cls-back { display: inline-flex; align-items: center; min-height: 32px; }
.ct-toolbar .cls-btn { height: 32px; min-width: 32px; }
.ct-field { height: 32px; }
.container:has(> .cls-nav) .vkm-month button { width: 32px; height: 32px; }
@media (max-width: 700px) {
    /* «Позиции» в настройках компании: подписанные ячейки на всю ширину, имя не сжимается */
    .cps .cls-table tr { grid-template-columns: minmax(0, 1fr) auto; }
    .cps .cls-table td[data-l] { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
    .cls-head-btns { flex-wrap: wrap; margin-left: 0; width: 100%; }
    .cls-head-btns > * { flex: 1 1 auto; }
    .cls-x { width: 40px; height: 40px; }
    .cls-back { min-height: 40px; }
    .container:has(> .cls-nav) .cls-btn { height: 40px; min-height: 40px; font-size: 16px; }
    .container:has(> .cls-nav) :is(.mc-head, .vl-top, .vr-head, *) :is(.mc-btn, .vl-btn, .vr-btn, .apr-btn, .td-done) { min-height: 40px; font-size: 16px; }
    .container:has(> .cls-nav) .vr .vr-link { display: inline-flex; align-items: center; min-height: 40px; font-size: 16px; }
    .ct-toolbar .cls-btn { height: 40px; min-width: 40px; }
    .container:has(> .cls-nav) .vkm-month button { width: 40px; height: 40px; }
}

/* ФГИС, Ф1: раздел /fgis — документы по статусам, подключение, календарь сроков */
.fg-banner { margin: 0 0 12px; padding: 10px 14px; border-radius: 4px; background: #fff6e0; border: 1px solid var(--cls-yellow); color: var(--cls-text); font-size: 14px; line-height: 1.4; }
.fg-wrap { overflow-x: auto; }
.fg-table td { vertical-align: middle; }
.fg-muted { color: var(--cls-muted); font-size: 13px; }
.fg-err { color: var(--cls-red); font-size: 13px; }
.fg-soon { padding: 24px 0; color: var(--cls-muted); font-size: 14px; }
.fg-over { color: var(--cls-red); font-weight: 600; }
.fg-st { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: 12px; line-height: 18px; white-space: nowrap; background: var(--cls-bg); color: var(--cls-text); }
.fg-st-ready, .fg-st-approved { background: #e6f0fb; color: var(--cls-accent); }
.fg-st-on_approval, .fg-st-signing { background: #fff6e0; color: #8a6a00; }
.fg-st-sent, .fg-st-accepted { background: #e6f4ea; color: var(--cls-green); }
.fg-st-check_failed, .fg-st-rejected, .fg-st-error { background: #fdecea; color: var(--cls-red); }
.fg-act { white-space: nowrap; text-align: right; }
.fg-act .cls-btn { height: 32px; margin-left: 6px; }
.fg-log { margin: 0; padding-left: 20px; font-size: 14px; line-height: 1.5; }
.fg-log li { margin-bottom: 6px; }
.fg-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.fg-card { padding: 12px 14px; }
.fg-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; margin: 10px 0; }
.fg-grid label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--cls-muted); }
.fg-grid input, .fg-grid select { height: 32px; box-sizing: border-box; padding: 0 8px; border: 1px solid var(--cls-line); border-radius: 4px; font: inherit; font-size: 14px; color: var(--cls-text); }
.fg-check { display: flex; align-items: center; gap: 6px; min-height: 32px; font-size: 14px; }
.fg-saturn-act { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.fg-saturn-act .cls-btn { height: 32px; margin: 0; }
.fg-saturn-out { margin-top: 8px; }
.fg-plan { margin-top: 16px; }
.fg-plan-h { margin: 0 0 8px; font-size: 16px; }
.fg-plan-btn { height: 32px; margin: 4px 0 0; }
.fg-plan-btn:disabled { opacity: .5; cursor: default; }
.fg-plan-early { color: var(--cls-muted); }
.fg-plan-open { color: var(--cls-green, #2e7d32); }
.fg-plan-late { color: var(--cls-red); }
.fg-sat-form[hidden] { display: none; }
@media (max-width: 560px) {
    .fg-table thead { display: none; }
    .fg-table, .fg-table tbody, .fg-table tr, .fg-table td { display: block; width: 100%; box-sizing: border-box; }
    .fg-table tr { padding: 8px 0; border-bottom: 1px solid var(--cls-line); }
    .fg-table td { padding: 4px 0; border: 0; }
    .fg-table td[data-l]::before { content: attr(data-l) ': '; color: var(--cls-muted); font-size: 13px; }
    .fg-act { display: flex !important; flex-wrap: wrap; gap: 8px; text-align: left; }
    .fg-act .cls-btn { flex: 1 1 0; height: 40px; margin: 0; font-size: 16px; }
    .fg-cards { grid-template-columns: 1fr; }
    .fg-grid { grid-template-columns: 1fr; }
    .fg-grid input, .fg-grid select { height: 40px; font-size: 16px; }
    .fg-check { min-height: 40px; font-size: 16px; }
    .fg-saturn-act .cls-btn { flex: 1 1 100%; height: 40px; font-size: 16px; }
    .fg-plan-btn { width: 100%; height: 40px; font-size: 16px; }
}

/* ФГИС Ф2 — «Отгрузки» (/shipments): партии семян и отгрузки, поверх fg-* */
.sh-dlg{width:640px;max-width:calc(100vw - 32px)}
.sh-wide{grid-column:1/-1}
.sh-manual[hidden]{display:none}
.sh-flags{display:flex;flex-wrap:wrap;gap:4px 16px;margin:4px 0 10px}
.sh-num{text-align:right;white-space:nowrap}
@media(max-width:560px){
  .sh .cls-btn{height:40px;font-size:16px}
  .sh-flags{flex-direction:column}
  .sh-num{text-align:left}
}

/* ---------- оценка и отзывы о клиенте ---------- */
.cls-stars { display: flex; gap: 6px; }
.cls-star { width: 32px; height: 32px; padding: 0; border: 0; background: none; font-size: 26px; line-height: 32px; color: var(--cls-grey); cursor: pointer; }
.cls-star.on { color: var(--cls-yellow); }
.cls-rate-ok input { margin-right: 6px; }
.cls-rq-rate { margin-top: 6px; font-size: 14px; color: var(--cls-text); }
.cls-rq-rate-none { color: var(--cls-muted); }
.cls-rq-stars { color: var(--cls-yellow); letter-spacing: 1px; }
.cls-rq-lastrv { margin-top: 4px; color: var(--cls-muted); font-style: italic; overflow-wrap: anywhere; }
.cls-rv-list { display: flex; flex-direction: column; gap: 10px; }
.cls-rv-item { padding: 10px 12px; border: 1px solid var(--cls-line); border-radius: 4px; background: #fff; }
.cls-rv-top { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.cls-rv-text { margin-top: 6px; overflow-wrap: anywhere; white-space: pre-line; }
@media (max-width: 560px) {
    .cls-star { width: 40px; height: 40px; line-height: 40px; font-size: 30px; }
}