/* CRM «Двери» — базовые стили каркаса.
   Бренд-палитра: тёплое дерево (коричневая гамма), mobile-first. */
:root {
    --dv-primary: #7a4a24;        /* коричневый «дерево двери» */
    --dv-primary-dark: #5c3719;   /* тёмный акцент */
    --dv-bg: #f6f3ef;             /* тёплый светлый фон */
    --dv-card: #ffffff;
    --dv-border: #e6ddd2;
    --dv-text: #2c2620;
    --dv-muted: #9a8f80;
    --dv-danger: #c0392b;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: "Segoe UI", Roboto, Arial, sans-serif;
    background: var(--dv-bg);
    color: var(--dv-text);
}

a { color: var(--dv-primary); text-decoration: none; }
a:hover { text-decoration: underline; }

/* Верхняя панель */
.topbar {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 0 24px;
    height: 56px;
    background: var(--dv-primary);
    color: #fff;
    position: relative;
}
.topbar__brand { font-size: 18px; font-weight: 700; white-space: nowrap; }
.topbar__brand span { font-weight: 400; opacity: .85; }
.topbar__burger {
    display: none; background: none; border: none; color: #fff;
    font-size: 26px; line-height: 1; cursor: pointer; padding: 4px 8px; margin-left: auto;
}
.topbar__menu { display: flex; align-items: center; gap: 24px; flex: 1; }
.topbar__nav { display: flex; gap: 18px; flex: 1; }
.topbar .nav-link { color: #f0e6d8; font-size: 14px; }
.topbar .nav-link:hover { color: #fff; text-decoration: none; }
.topbar__user { display: flex; align-items: center; gap: 12px; font-size: 13px; }
.topbar__user .user-name { font-weight: 600; }
.topbar__user .user-role { opacity: .8; }
.topbar__user .logout { color: #ffd9d4; }

/* Контент */
.content { max-width: 1100px; margin: 0 auto; padding: 28px 24px; }
.page__title { margin: 0 0 6px; font-size: 24px; }
.page__greeting { margin: 0 0 20px; color: var(--dv-muted); }
.page__note { margin-top: 24px; color: var(--dv-muted); font-size: 13px; }

/* Карточки */
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.card {
    background: var(--dv-card);
    border: 1px solid var(--dv-border);
    border-radius: 10px;
    padding: 18px;
}
.card__title { font-size: 16px; font-weight: 600; margin-bottom: 6px; }
.card__hint { font-size: 12px; color: var(--dv-muted); }
.card--muted { opacity: .9; }

/* Логин */
.login-wrap {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #7a4a24 0%, #5c3719 100%);
}
.login-card {
    background: #fff;
    width: 360px;
    padding: 32px 28px;
    border-radius: 14px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .25);
}
.login-card__brand { font-size: 22px; font-weight: 700; color: var(--dv-primary); text-align: center; }
.login-card__brand span { font-weight: 400; opacity: .8; }
.login-card__subtitle { text-align: center; color: var(--dv-muted); margin: 4px 0 22px; }

.field { display: block; margin-bottom: 16px; }
.field__label { display: block; font-size: 13px; color: var(--dv-muted); margin-bottom: 6px; }
.field__input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--dv-border);
    border-radius: 8px;
    font-size: 15px;
}
.field__input:focus { outline: none; border-color: var(--dv-primary); }

.btn {
    display: inline-block;
    width: 100%;
    padding: 11px;
    border: none;
    border-radius: 8px;
    font-size: 15px;
    cursor: pointer;
}
.btn--primary { background: var(--dv-primary); color: #fff; }
.btn--primary:hover { background: var(--dv-primary-dark); }

.alert { padding: 10px 12px; border-radius: 8px; font-size: 14px; margin-bottom: 16px; }
.alert--error { background: #fdecea; color: var(--dv-danger); border: 1px solid #f5c6cb; }
.alert__list { margin: 0; padding-left: 18px; }

/* Кнопки — варианты */
.btn--inline { width: auto; padding: 9px 16px; }
.btn--secondary { background: #f0ebe4; color: var(--dv-text); }
.btn--secondary:hover { background: #e6ddd2; text-decoration: none; }
.btn--danger { background: var(--dv-danger); color: #fff; }
.btn--danger:hover { background: #a93226; }
a.btn:hover { text-decoration: none; }

/* Карточка-ссылка на дашборде */
.card--link { display: block; color: inherit; transition: box-shadow .15s, transform .15s; }
.card--link:hover { text-decoration: none; box-shadow: 0 6px 18px rgba(122,74,36,.15); transform: translateY(-2px); }

/* Шапка страницы с действиями */
.page__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.page__head .page__title { margin: 0; }
.page__actions, .page__head .page__actions { display: flex; gap: 10px; align-items: center; }
.link-back { display: inline-block; font-size: 13px; color: var(--dv-muted); margin-bottom: 6px; }
.inline-form { display: inline; margin: 0; }

/* Бейдж */
.badge {
    display: inline-block; padding: 2px 10px; border-radius: 12px;
    background: #efe6da; color: var(--dv-primary); font-size: 12px; font-weight: 600;
}

/* Фильтры / поиск */
.filters { display: flex; gap: 10px; align-items: center; margin-bottom: 18px; flex-wrap: wrap; }
.filters__search { flex: 1; min-width: 240px; padding: 9px 12px; border: 1px solid var(--dv-border); border-radius: 8px; font-size: 14px; }
.filters__select { padding: 9px 12px; border: 1px solid var(--dv-border); border-radius: 8px; font-size: 14px; }
.filters__reset { font-size: 13px; color: var(--dv-muted); }

/* Таблица */
.table { width: 100%; border-collapse: collapse; background: var(--dv-card); border: 1px solid var(--dv-border); border-radius: 10px; overflow: hidden; }
.table th { text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .03em; color: var(--dv-muted); padding: 11px 14px; border-bottom: 1px solid var(--dv-border); background: #faf7f3; }
.table td { padding: 11px 14px; border-bottom: 1px solid var(--dv-border); font-size: 14px; }
.table tr:last-child td { border-bottom: none; }
.table__row--link { cursor: pointer; }
.table__row--link:hover td { background: #f7f3ee; }
.table__name { font-weight: 600; }

/* Пустое состояние */
.empty { padding: 40px; text-align: center; color: var(--dv-muted); background: var(--dv-card); border: 1px dashed var(--dv-border); border-radius: 10px; }
.muted { color: var(--dv-muted); font-size: 14px; }

/* Формы */
.form-card { background: var(--dv-card); border: 1px solid var(--dv-border); border-radius: 12px; padding: 22px; max-width: 760px; }
.form-row { display: flex; gap: 16px; flex-wrap: wrap; }
.form-row .field { flex: 1; min-width: 180px; margin-bottom: 14px; }
.field--wide { flex-basis: 100%; }
.form-block { border: 1px solid var(--dv-border); border-radius: 10px; padding: 14px 16px 4px; margin-bottom: 18px; }
.form-block legend { font-size: 13px; font-weight: 600; color: var(--dv-primary); padding: 0 6px; }
.form-actions { display: flex; gap: 10px; }
textarea.field__input { resize: vertical; font-family: inherit; }

/* Карточка деталей */
.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.detail-card { background: var(--dv-card); border: 1px solid var(--dv-border); border-radius: 10px; padding: 18px; margin-bottom: 16px; }
.detail-card__title { font-size: 15px; margin: 0 0 12px; }
.props { display: grid; grid-template-columns: 140px 1fr; gap: 6px 12px; margin: 0; }
.props dt { color: var(--dv-muted); font-size: 13px; }
.props dd { margin: 0; font-size: 14px; }
.props__multiline { white-space: pre-line; }

.detail-card__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.detail-card__head .detail-card__title { margin: 0; }

/* Быстрая смена стадии на карточке дела */
.stage-switch { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.stage-switch__label { font-size: 13px; color: var(--dv-muted); }
.stage-switch__select { width: auto; min-width: 200px; }

/* Воронка / канбан */
.board__hint { margin-top: -6px; margin-bottom: 14px; }
.board { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 12px; align-items: flex-start; }
.board__col { flex: 0 0 230px; background: #f0ebe4; border-radius: 10px; padding: 10px; min-height: 120px; }
.board__col-head { display: flex; align-items: center; justify-content: space-between; font-size: 13px; font-weight: 600; color: var(--dv-text); margin-bottom: 10px; padding: 0 4px; }
.board__count { background: #fff; color: var(--dv-muted); border-radius: 10px; padding: 1px 8px; font-size: 12px; }
.board__cards { display: flex; flex-direction: column; gap: 8px; min-height: 40px; }
.board-card { background: #fff; border: 1px solid var(--dv-border); border-radius: 8px; padding: 10px; cursor: pointer; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.board-card:hover { border-color: var(--dv-primary); }
.board-card__title { font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.board-card__sub { font-size: 12px; color: var(--dv-muted); margin-bottom: 6px; }
.board-card__meta { display: flex; justify-content: space-between; gap: 8px; font-size: 11px; color: var(--dv-muted); }
.board-card__resp { text-align: right; }

.alert--ok { background: #e8f5e9; color: #2e7d32; border: 1px solid #c8e6c9; }
.alert--warn { background: #fff4e5; color: #a15b00; border: 1px solid #ffe0b2; }
.extra-phone-row { display: flex; gap: 8px; align-items: center; margin-bottom: 6px; flex-wrap: wrap; }

/* Генерация документов на карточке дела */
.doc-gen { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.doc-gen__label { font-size: 13px; color: var(--dv-muted); }
.doc-gen__list { margin-top: 6px; }
code { background: #f0ebe4; padding: 1px 6px; border-radius: 4px; font-size: 13px; }

/* Редактор шаблонов */
.tpl-edit { display: grid; grid-template-columns: 1fr 280px; gap: 16px; align-items: start; }
.tpl-edit__form { max-width: none; }
.tpl-edit__area { font-family: "Consolas", "Courier New", monospace; font-size: 13px; line-height: 1.5; }
.tpl-edit__help { background: var(--dv-card); border: 1px solid var(--dv-border); border-radius: 10px; padding: 16px; position: sticky; top: 16px; }
.tpl-edit__help-title { margin: 0 0 8px; font-size: 15px; }
.tpl-edit__ph { list-style: none; padding: 0; margin: 10px 0; font-size: 12px; }
.tpl-edit__ph li { margin-bottom: 6px; color: var(--dv-muted); }
.tpl-edit__ph code { display: inline-block; margin-bottom: 2px; }

@media (max-width: 900px) {
    .tpl-edit { grid-template-columns: 1fr; }
    .tpl-edit__help { position: static; }
}
@media (max-width: 720px) {
    .detail-grid { grid-template-columns: 1fr; }
}

/* Счётчики на рабочем столе */
.stats { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 22px; }
.stat { flex: 1; min-width: 160px; background: var(--dv-card); border: 1px solid var(--dv-border); border-radius: 10px; padding: 16px 18px; color: inherit; transition: box-shadow .15s, transform .15s; }
.stat:hover { text-decoration: none; box-shadow: 0 6px 18px rgba(31,78,121,.12); transform: translateY(-2px); }
.stat__num { font-size: 28px; font-weight: 700; color: var(--dv-primary); line-height: 1.1; }
.stat__label { font-size: 13px; color: var(--dv-muted); margin-top: 4px; }
.stat--danger .stat__num { color: var(--dv-danger); }

/* Вкладки (раздел Задачи) */
.tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; border-bottom: 1px solid var(--dv-border); }
.tab { padding: 9px 14px; font-size: 14px; color: var(--dv-muted); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.tab:hover { text-decoration: none; color: var(--dv-text); }
.tab--active { color: var(--dv-primary); border-bottom-color: var(--dv-primary); font-weight: 600; }
.tab--danger { color: var(--dv-danger); }
.tab__count { display: inline-block; margin-left: 6px; background: #f0ebe4; color: var(--dv-muted); border-radius: 10px; padding: 0 7px; font-size: 12px; }
.tab--active .tab__count { background: #efe6da; color: var(--dv-primary); }

/* Строки задач: просрочка / выполнено */
.row--overdue td { background: #fdf0ee; }
.row--done td { color: var(--dv-muted); }
.row--done .table__name { text-decoration: line-through; }
.due--overdue { color: var(--dv-danger); font-weight: 600; }
.badge--danger { background: #fdecea; color: var(--dv-danger); margin-left: 6px; }
.badge--sub { background: #e6f4ea; color: #2e7d32; margin-left: 6px; }
.badge--muted { background: #eceff2; color: #6b7785; }
.badge--warn { background: #fff4d6; color: #9a6a00; }

/* Кнопки-мини и колонка действий в таблице */
.btn--mini { width: auto; padding: 4px 10px; font-size: 12px; display: inline-block; }
.table__actions { white-space: nowrap; text-align: right; }
.table__actions .inline-form { margin-right: 4px; }

/* Форма добавления задачи на карточке сделки */
.task-add { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 14px; }
.task-add__title { flex: 1; min-width: 200px; }
.task-add__due { width: auto; }
.task-add__resp { width: auto; min-width: 150px; }
.task-list { margin-bottom: 4px; }

/* Чекбокс-поля в формах */
.field--check { flex-direction: row; align-items: center; gap: 8px; display: flex; }
.field--check input { width: auto; }
.field--check span { font-size: 14px; }

/* Выбор подписанта в блоке генерации документов */
.doc-gen__signatory { display: flex; align-items: center; gap: 6px; }
.doc-gen__signatory select { width: auto; min-width: 220px; }

/* Поле с кнопкой (автозаполнение DaData) */
.field-with-btn { display: flex; gap: 8px; align-items: stretch; }
.field-with-btn .field__input { flex: 1; }
.field-with-btn .btn { white-space: nowrap; }
.dadata-hint { margin-top: 2px; min-height: 18px; }

/* Бейдж непрочитанных в навигации */
.nav-badge {
    display: inline-block; margin-left: 6px; min-width: 18px; padding: 0 5px;
    font-size: 12px; line-height: 18px; text-align: center; border-radius: 9px;
    background: var(--dv-danger); color: #fff;
}

/* Кнопки-фильтры (вместо выпадающих списков) */
.chip-filter { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.chip {
    display: inline-block; padding: 6px 14px; border-radius: 16px;
    border: 1px solid var(--dv-border); background: var(--dv-card);
    color: var(--dv-text); font-size: 14px; cursor: pointer; transition: all .12s;
}
.chip:hover { border-color: var(--dv-primary); }
.chip--active { background: var(--dv-primary); border-color: var(--dv-primary); color: #fff; }

/* Плашки каналов (цвет по источнику) */
.badge--vk { background: #e3f0ff; color: #0077ff; }
.badge--max { background: #efe6fb; color: #7b2ff2; }
.badge--telegram { background: #e1f3fb; color: #229ed9; }
.badge--email { background: #fdeaea; color: #c0392b; }
.chip--vk.chip--active { background: #0077ff; border-color: #0077ff; }
.chip--max.chip--active { background: #7b2ff2; border-color: #7b2ff2; }
.chip--telegram.chip--active { background: #229ed9; border-color: #229ed9; }
.chip--email.chip--active { background: #c0392b; border-color: #c0392b; }

/* Мессенджер (двухпанельный) */
.messenger {
    display: flex; height: calc(100vh - 140px); min-height: 420px;
    background: var(--dv-card); border: 1px solid var(--dv-border); border-radius: 8px;
    overflow: hidden;
}
.ms-list { width: 330px; flex-shrink: 0; border-right: 1px solid var(--dv-border);
           display: flex; flex-direction: column; }
.ms-list__head { padding: 10px; border-bottom: 1px solid var(--dv-border); }
.tabs--sm { gap: 4px; margin-bottom: 8px; }
.tabs--sm .tab { padding: 4px 8px; font-size: 12px; }
.chip-filter--sm { gap: 5px; margin-bottom: 0; }
.chip-filter--sm .chip { padding: 4px 10px; font-size: 12px; }
.ms-list__items { flex: 1; overflow-y: auto; }
.ms-item { display: block; padding: 10px 12px; border-bottom: 1px solid var(--dv-border);
           color: var(--dv-text); }
.ms-item:hover { background: var(--dv-bg); }
.ms-item--active { background: #eef4ff; }
.ms-item__top { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.ms-item__name { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ms-item__bottom { display: flex; justify-content: space-between; align-items: center;
                   gap: 6px; margin-top: 2px; }
.ms-item__preview { color: var(--dv-muted); font-size: 13px; white-space: nowrap;
                    overflow: hidden; text-overflow: ellipsis; }
.ms-item__time { color: var(--dv-muted); font-size: 11px; margin-top: 2px; }

.ms-chat { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.ms-chat__head { display: flex; justify-content: space-between; align-items: center;
                 gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--dv-border);
                 flex-wrap: wrap; }
.ms-chat__title { font-weight: 600; display: flex; align-items: center; gap: 8px; }
.ms-chat__actions { display: flex; gap: 6px; flex-wrap: wrap; }
.ms-feed { flex: 1; overflow-y: auto; padding: 14px; background: var(--dv-bg);
           display: flex; flex-direction: column; gap: 8px; }
.ms-feed .msg { max-width: 72%; padding: 8px 12px; border-radius: 12px; }
.ms-feed .msg--in { align-self: flex-start; background: #fff; border: 1px solid var(--dv-border); }
.ms-feed .msg--out { align-self: flex-end; background: #e7f0fb; }
.msg__body { white-space: pre-wrap; word-wrap: break-word; }
.msg__attach { margin-top: 4px; font-size: 13px; }
.msg-img { max-width: 220px; max-height: 220px; border-radius: 8px; display: block; }
.msg-doc { display: inline-block; padding: 6px 10px; background: rgba(0,0,0,.05);
           border-radius: 8px; color: var(--dv-primary); }
.msg__attach audio { max-width: 240px; height: 36px; }
.msg__info { margin-top: 4px; font-size: 11px; color: var(--dv-muted); }
.ms-reply { display: flex; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--dv-border); }
.ms-reply textarea { flex: 1; resize: vertical; min-height: 38px; }
.ms-reply .btn { width: auto; white-space: nowrap; }
.ms-attach { display: flex; align-items: center; justify-content: center; width: 40px;
             font-size: 20px; cursor: pointer; border: 1px solid var(--dv-border);
             border-radius: 8px; user-select: none; }
.ms-attach:hover { background: var(--dv-bg); }
.ms-filehint { padding: 0 14px 8px; font-size: 12px; color: var(--dv-muted); min-height: 4px; }

/* Транскрипт звонка */
.call-transcript-row td { background: var(--dv-bg); }
.call-transcript-row summary { cursor: pointer; color: var(--dv-primary); font-size: 13px; }
.call-transcript { margin-top: 6px; padding: 8px 10px; background: #fff;
                   border: 1px solid var(--dv-border); border-radius: 6px;
                   font-size: 13px; line-height: 1.5; white-space: pre-wrap; }
.ms-empty { flex: 1; display: flex; align-items: center; justify-content: center;
            color: var(--dv-muted); }
.empty--sm { padding: 20px; text-align: center; color: var(--dv-muted); }

/* Раздел «Чаты» (старый одностраничный — оставлен для совместимости) */
.chat { background: var(--dv-card); border: 1px solid var(--dv-border); border-radius: 8px; }
.chat__meta {
    display: flex; flex-wrap: wrap; gap: 16px; align-items: center;
    padding: 12px 16px; border-bottom: 1px solid var(--dv-border);
}
.chat__statusbar { display: flex; gap: 6px; margin-left: auto; }
.chat__feed {
    display: flex; flex-direction: column; gap: 8px;
    padding: 16px; max-height: 60vh; overflow-y: auto; background: var(--dv-bg);
}
.msg { max-width: 72%; padding: 8px 12px; border-radius: 12px; }
.msg--in { align-self: flex-start; background: #fff; border: 1px solid var(--dv-border); }
.msg--out { align-self: flex-end; background: #e7f0fb; }
.msg__body { white-space: pre-wrap; word-wrap: break-word; }
.msg__info { margin-top: 4px; font-size: 11px; color: var(--dv-muted); }
.chat__reply { display: flex; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--dv-border); }
.chat__reply textarea { flex: 1; resize: vertical; }
.chat__reply .btn { width: auto; white-space: nowrap; align-self: flex-end; }

/* Блок «Почта» в карточке клиента/сделки */
.mail-thread {
    display: flex; flex-direction: column; gap: 8px;
    max-height: 46vh; overflow-y: auto; margin-bottom: 12px;
    padding: 4px; background: var(--dv-bg); border-radius: 8px;
}
.mail-msg { max-width: 80%; padding: 8px 12px; border-radius: 12px; }
.mail-msg--in { align-self: flex-start; background: #fff; border: 1px solid var(--dv-border); }
.mail-msg--out { align-self: flex-end; background: #e7f0fb; }
.mail-msg__head {
    display: flex; gap: 10px; justify-content: space-between; align-items: baseline;
    font-size: 12px; color: var(--dv-muted); margin-bottom: 3px;
}
.mail-msg__body { white-space: pre-wrap; word-wrap: break-word; }
.mail-msg--failed { border: 1px solid #e0b4b4; background: #fdf3f3; }
.mail-send { display: flex; flex-direction: column; gap: 8px; }
.mail-send textarea { resize: vertical; }
.mail-send .btn { width: auto; align-self: flex-start; }

/* Календарь — сетка время×сотрудники */
.cal-nav { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.cal-nav .inline-form { margin: 0; }
.cal-wrap { overflow-x: auto; border: 1px solid var(--dv-border); border-radius: 8px; }
.cal-grid { border-collapse: collapse; width: 100%; background: var(--dv-card); }
.cal-grid th, .cal-grid td { border: 1px solid var(--dv-border); }
.cal-grid th { padding: 8px 10px; background: var(--dv-bg); font-size: 14px; white-space: nowrap; }
.cal-time-col { width: 64px; }
.cal-time { width: 64px; padding: 2px 8px; font-size: 12px; color: var(--dv-muted); text-align: right; white-space: nowrap; }
.cal-cell { height: 26px; min-width: 130px; padding: 0; vertical-align: top; }
.cal-cell--work { background: #eef5ff; }
.cal-cell--busy { background: #fff; }
.cal-event { display: block; height: 100%; padding: 2px 6px; font-size: 12px; line-height: 1.25;
    border-radius: 4px; text-decoration: none; color: #1f2d3d; }
.cal-event--appointment { background: #cfe8d6; border: 1px solid #93c9a4; }
.cal-event--hearing { background: #f6d9b8; border: 1px solid #e0ab6b; }
.cal-event__time { display: block; font-size: 11px; color: #4a5b6b; margin-top: 2px; }
.cal-scale { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 4px 0 12px; }
.cal-legend { margin-top: 10px; }
/* Рабочее время — интервалы по дням */
.workday { display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
    padding: 10px 0; border-bottom: 1px solid var(--dv-border); }
.workday__date { font-weight: 600; min-width: 110px; }
.workday__intervals { display: flex; gap: 8px; flex-wrap: wrap; flex: 1; min-width: 160px; }
.workday__iv { display: inline-flex; align-items: center; gap: 4px;
    background: #eef5ff; border: 1px solid #93b4dd; border-radius: 6px; padding: 3px 8px; font-size: 15px; }
.workday__del { border: none; background: none; color: #b23; cursor: pointer;
    font-size: 18px; line-height: 1; padding: 0 2px; }
.workday__add { margin-top: 0; }
@media (max-width: 820px) {
    .workday { flex-direction: column; align-items: stretch; gap: 8px; }
    .cal-scale { width: 100%; }
}
.cal-key { display: inline-block; width: 14px; height: 14px; border-radius: 3px; vertical-align: middle; }
.cal-key--work { background: #eef5ff; border: 1px solid #93b4dd; }
.cal-key--appointment { background: #cfe8d6; border: 1px solid #93c9a4; }
.cal-key--hearing { background: #f6d9b8; border: 1px solid #e0ab6b; }

/* Уведомления клиента: каналы-кнопки + степпер времени */
.notify-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 12px; }
.notify-label { min-width: 190px; font-weight: 600; color: var(--dv-muted); }
.radio-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.radio-chip { cursor: pointer; }
.radio-chip input { position: absolute; opacity: 0; width: 0; height: 0; }
.radio-chip span {
    display: inline-block; padding: 6px 12px; border: 1px solid var(--dv-border);
    border-radius: 16px; background: #fff; font-size: 14px; user-select: none;
}
.radio-chip input:checked + span { background: var(--dv-accent, #1a3d6d); color: #fff; border-color: var(--dv-accent, #1a3d6d); }
.stepper { display: inline-flex; align-items: center; gap: 10px; }
.stepper__val { min-width: 96px; text-align: center; font-weight: 600; }

.is-hidden { display: none; }

/* Подсветка новых авто-обращений (звонок/сайт/канал) в списке сделок — ТЗ 005 п.5 */
.table__row--new td { background: #fff8e1; }
.table__row--new:hover td { background: #fff3cd; }
.table__row--new td:first-child { border-left: 3px solid #f5a623; }
.badge--new { background: #f5a623; color: #fff; margin-left: 6px; }

/* Резюме звонка (аналитика нейросети) — ТЗ 005 доп. */
.call-summary { padding: 8px 10px; background: #eef6ff; border-left: 3px solid #1f4e79; border-radius: 4px; font-size: 14.5px; line-height: 1.5; }

/* Регистрация / раздел «Сотрудники» (план 024) */
.login-card__hint { margin-top: 14px; font-size: 14px; color: #667085; text-align: center; }
.login-card__hint a { color: #1F4E79; font-weight: 600; }
.section-title { font-size: 18px; font-weight: 700; color: #14294B; margin: 18px 0 10px; }
.field__input--sm { padding: 5px 8px; font-size: 14px; width: auto; max-width: 200px; }
.inline-form { display: inline-flex; gap: 6px; align-items: center; flex-wrap: wrap; margin: 0; }

/* Галочка с подписью в одну строку (настройка оповещений, план 025) */
.chk-line { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.chk-line input[type="checkbox"] { width: 18px; height: 18px; }

/* Календарь — мобильный вертикальный список (по умолчанию скрыт, включается в @media) */
.cal-mobile { display: none; }

/* ==========================================================================
   МОБИЛЬНАЯ ВЕРСИЯ (телефоны, планшеты в портрете). Крупный шрифт, без
   горизонтальной прокрутки: таблицы → карточки, меню → бургер, календарь →
   вертикальный список. Десктоп (выше 820px) не затрагивается.
   ========================================================================== */
@media (max-width: 820px) {
    /* --- Бургер-меню --- */
    .topbar { gap: 12px; padding: 0 14px; }
    .topbar__burger { display: block; }
    .topbar__menu {
        display: none; position: absolute; top: 56px; left: 0; right: 0; z-index: 60;
        flex-direction: column; align-items: stretch; gap: 0;
        background: var(--dv-primary-dark); padding: 6px 0;
        box-shadow: 0 10px 24px rgba(0,0,0,.28); max-height: calc(100vh - 56px); overflow-y: auto;
    }
    body.nav-open .topbar__menu { display: flex; }
    .topbar__nav { flex-direction: column; gap: 0; flex: none; }
    .topbar .nav-link { display: block; padding: 13px 20px; font-size: 16px; border-bottom: 1px solid rgba(255,255,255,.08); }
    .topbar__user {
        flex-wrap: wrap; gap: 10px 14px; padding: 12px 20px; font-size: 15px;
        border-top: 1px solid rgba(255,255,255,.18); margin-top: 4px;
    }
    .topbar__user .logout { margin-left: auto; }

    /* --- Контент шире, отступы меньше --- */
    .content { padding: 16px 12px; }
    .page__title { font-size: 22px; }
    .page__head { flex-direction: column; align-items: stretch; gap: 12px; }
    .page__head .page__actions { flex-wrap: wrap; }

    /* --- Фильтры/поиск в столбик --- */
    .filters { flex-direction: column; align-items: stretch; }
    .filters__search, .filters__select, .filters .btn { width: 100%; min-width: 0; font-size: 16px; }

    /* --- Формы и детали: одна колонка, крупнее --- */
    .form-card { padding: 16px; }
    .form-row { flex-direction: column; gap: 0; }
    .form-row .field { min-width: 0; }
    .field__input, textarea.field__input { font-size: 16px; }  /* 16px — iOS не зумит при фокусе */
    .detail-grid { grid-template-columns: 1fr; }
    .props { grid-template-columns: 1fr; gap: 2px 0; }
    .props dt { margin-top: 8px; }
    .props dd { font-size: 15px; }
    .stage-switch { flex-wrap: wrap; }
    .stage-switch__select { width: 100%; min-width: 0; }

    /* --- Счётчики рабочего стола: по 2 в ряд --- */
    .stat { min-width: 0; flex: 1 1 45%; }

    /* --- Таблицы → карточки (без прокрутки вбок) --- */
    .table { border: none; background: none; }
    .table thead { display: none; }
    .table tbody, .table tr, .table td { display: block; width: 100%; }
    .table tr {
        background: var(--dv-card); border: 1px solid var(--dv-border);
        border-radius: 10px; margin-bottom: 12px; padding: 8px 14px;
    }
    .table td {
        border: none; padding: 6px 0; font-size: 15px;
        display: flex; justify-content: space-between; align-items: baseline; gap: 14px;
    }
    .table td::before {
        content: attr(data-label); flex-shrink: 0; text-align: left;
        color: var(--dv-muted); font-size: 13px; font-weight: 600;
    }
    .table td[data-label]:not(.table__name) > * { text-align: right; }
    /* Название — крупной строкой-заголовком карточки, без подписи */
    .table td.table__name {
        display: block; font-size: 17px; font-weight: 700;
        padding: 2px 0 8px; margin-bottom: 4px; border-bottom: 1px solid var(--dv-border);
    }
    .table td.table__name::before { display: none; }
    /* Колонка действий (кнопки) — в ряд, по правому краю */
    .table td.table__actions, .table td:last-child:not([data-label]) {
        justify-content: flex-end; flex-wrap: wrap; padding-top: 8px;
    }
    .table td.table__actions::before, .table td:last-child:not([data-label])::before { display: none; }
    .table td .btn--mini, .table td .btn--inline { font-size: 14px; padding: 7px 12px; }
    /* Строки-транскрипты звонков и т.п. (colspan) — во всю ширину без подписи */
    .table td[colspan] { display: block; }
    .table td[colspan]::before { display: none; }

    /* --- Воронка сделок: колонки чуть уже --- */
    .board__col { flex-basis: 200px; }

    /* --- Календарь: прячем широкую сетку, показываем вертикальный список --- */
    .cal-wrap { display: none; }
    .cal-legend { display: none; }
    .cal-mobile { display: block; }
    .cal-nav { width: 100%; }
    .cal-nav .btn { flex: 1; }
    .cal-nav .inline-form { flex-basis: 100%; }
    .cal-nav .inline-form .field__input { width: 100%; }
}

/* Мобильный календарь — карточки событий, сгруппированные по сотруднику */
.cal-m-group { margin-bottom: 18px; }
.cal-m-group__name {
    font-size: 15px; font-weight: 700; color: var(--dv-primary);
    padding: 6px 0; border-bottom: 2px solid var(--dv-border); margin-bottom: 8px;
}
.cal-m-event {
    display: flex; gap: 12px; align-items: flex-start;
    background: var(--dv-card); border: 1px solid var(--dv-border);
    border-left: 4px solid var(--dv-muted); border-radius: 8px;
    padding: 12px 14px; margin-bottom: 8px; color: inherit;
}
.cal-m-event:hover { text-decoration: none; box-shadow: 0 2px 8px rgba(0,0,0,.08); }
.cal-m-event--appointment { border-left-color: #5aa06f; }
.cal-m-event--hearing { border-left-color: #d6912f; }
.cal-m-event__time { font-size: 17px; font-weight: 700; white-space: nowrap; }
.cal-m-event__body { flex: 1; }
.cal-m-event__type { font-size: 13px; color: var(--dv-muted); }
.cal-m-event__client { font-size: 16px; font-weight: 600; }
.cal-m-empty { color: var(--dv-muted); padding: 8px 0 4px; font-size: 15px; }

/* ── Дополнения CRM «Двери» ─────────────────────────────────────────────── */
/* Сетка формы (добавление/редактирование в несколько полей) */
.form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 14px;
    align-items: end;
    background: var(--dv-card);
    border: 1px solid var(--dv-border);
    border-radius: 10px;
    padding: 16px;
}
.field--action { display: flex; align-items: flex-end; }
.field--action .btn { width: 100%; }
/* Приглушённая строка таблицы (отключённый исполнитель и т.п.) */
.row--muted { opacity: .55; }
.row--muted .table__name { text-decoration: line-through; }

/* Терминальная колонка воронки «Отказ / потерян» */
.board__col--terminal .board__col-head { color: var(--dv-danger); }
.board__col--terminal { background: #fbf1ef; }

/* ── Отчёты и дашборды (§10) ─────────────────────────────────────────────── */
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin-bottom: 18px; }
.kpi { background: var(--dv-card); border: 1px solid var(--dv-border); border-radius: 10px; padding: 16px; text-align: center; }
.kpi__num { font-size: 30px; font-weight: 700; color: var(--dv-primary); line-height: 1; }
.kpi__label { font-size: 12.5px; color: var(--dv-muted); margin-top: 6px; }

/* Конверсии — горизонтальные бары */
.conv { display: grid; grid-template-columns: 160px 1fr 56px; align-items: center; gap: 12px; margin-bottom: 10px; }
.conv__label { font-size: 13.5px; color: var(--dv-text); }
.conv__bar { background: #efe6da; border-radius: 8px; height: 16px; overflow: hidden; }
.conv__fill { background: linear-gradient(90deg, var(--dv-primary), var(--dv-primary-dark)); height: 100%; border-radius: 8px; min-width: 2px; }
.conv__val { font-size: 13.5px; font-weight: 600; text-align: right; }

/* Пончик */
.report-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.donut-wrap { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.donut { width: 130px; height: 130px; flex-shrink: 0; }
.legend { list-style: none; margin: 0; padding: 0; font-size: 14px; }
.legend li { margin-bottom: 6px; }
.legend__dot { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 6px; vertical-align: middle; }

/* Строки таблицы отчёта */
.table__row--me td { background: #f7f0e6; }
.table__row--total td { font-weight: 700; background: #faf7f3; border-top: 2px solid var(--dv-border); }

@media (max-width: 720px) {
    .report-cols { grid-template-columns: 1fr; }
    .conv { grid-template-columns: 120px 1fr 44px; }
}

/* ── КП (§6) ─────────────────────────────────────────────────────────────── */
.kp-drop { width: 96px; height: 72px; border: 2px dashed var(--dv-border); border-radius: 8px;
    display: flex; align-items: center; justify-content: center; text-align: center;
    font-size: 11px; color: var(--dv-muted); cursor: pointer; background: #faf7f3; }
.kp-drop:hover, .kp-drop:focus { border-color: var(--dv-primary); outline: none; }
.kp-drop--active { border-color: var(--dv-primary); background: #f3e9dc; color: var(--dv-primary); }
.kp-photo { width: 96px; height: 72px; object-fit: cover; border-radius: 8px; border: 1px solid var(--dv-border); }
.kp-table td { vertical-align: middle; }

/* Печать КП: скрыть навигацию, формы, служебное */
@media print {
    .topbar, .no-print, .link-back { display: none !important; }
    .content { max-width: 100%; padding: 0; }
    .detail-card { border: none; padding: 6px 0; }
    body { background: #fff; }
    a { color: inherit; text-decoration: none; }
}