/* ============================================================
   MMS — main.css (Bootstrap 5.3)
   Подключается ПОСЛЕ темы, которую ставит каркас платформы.
   Здесь только то, чего нет ни в Bootstrap, ни в платформе: предметные
   сетки (расписание, табель, месяц), карточка записи, подобранные ширины
   и высоты. Ряды, кнопки, переключатели, отступы и цвета — классами
   Bootstrap в разметке; своё правило — с причиной, почему их не хватило.
   ============================================================ */

/* ─── 1. ТЕМА ────────────────────────────────────────────────
   Тему — Bootstrap, Cosmo или Flatly — и фирменный цвет своей темы
   ставит каркас платформы по настройкам (вкладка «Оформление»). Цвета
   здесь — только токенами `--bs-*`: они следуют за темой и тёмным
   режимом. */

/* Ширины страниц — не здесь: с платформы 0.62.0 их задаёт вкладка
   «Оформление» (списки во всю ширину — `settings_defaults` в `core/apps.py`).
   Формы остаются узкими — объявляют w-form (core/tests_page_width.py). */
/* Фон шапки и меню задаёт платформа: меню — оттенком фирменного цвета своей
   темы (platforma.E018 не даёт вписать его здесь). */


/* Перекраску компонентов Bootstrap под фирменный цвет (.btn-primary,
   .btn-outline-primary, focus-кольца, .nav-*) делает платформа — только для
   своей темы. Cosmo и Flatly красят компоненты сами. */

/* ─── 2. КАРКАС ─────────────────────────────────────────────
   Шапку, меню, сетку страницы и её ширины рисует платформа
   (platforma/css/platform.css). Здесь их правил нет и быть не должно:
   правило большего веса перебило бы каркас (проверка platforma.E018). */

/* Таблица списка `.rt`, `.num`, `.sub` — платформа. */

/* ─── 4. ДНИ МЕСЯЦА (заказы, оплаты) ────────────────────────
   День — кнопка Bootstrap (`btn btn-sm`, выбранный — `btn-primary`, выходной —
   `text-danger border-danger-subtle`). Своё — то, чего у кнопки нет: ровная
   ширина однозначных и двузначных чисел и подчёркивание сегодняшнего дня. */
.day { min-width: 30px; }
.day.now { font-weight: 700; box-shadow: inset 0 -2px 0 var(--bs-primary); }

/* Пары «поле — значение» `dl.kv` — платформа. */

/* Каркас и `.no-print` при печати прячет платформа. */


/* Таблицы формы центра — утилитами Bootstrap в разметке (`p-1`, `py-1 px-2`,
   `fs-tiny`, `text-body-secondary`); своё здесь только узкое числовое поле. */

/* Узкое числовое поле (минуты, интервал): оформление — `form-control-sm`,
   здесь только то, чего у Bootstrap нет, — ширина в четыре знака и центровка. */
.num-narrow { width: 4em; text-align: center; }

/* ─── Расписание: статус записи — цветом левой кромки карточки ───
   Цвет статуса задан один раз (--appt-status) — для кромки карточки и точки
   легенды разом, чтобы они не расходились (apps/schedule/tests_legend_colors.py).
   «Запланирована» — синий цветом, а не ролью --bs-primary: основной цвет своей
   темы — фирменный красный, и запланированная слилась бы с отменённой. 
   Роли темы, а не числа: цвет состояния задаётся ролью набора стилей
   (руководство платформы, §33) и следует за темой и тёмным режимом. */
.appt-card.status-scheduled,   .legend-dot.status-scheduled   { --appt-status: var(--bs-blue); }
.appt-card.status-confirmed,   .legend-dot.status-confirmed   { --appt-status: var(--bs-success); }
.appt-card.status-in-progress, .legend-dot.status-in-progress { --appt-status: var(--bs-warning); }
.appt-card.status-done,        .legend-dot.status-done        { --appt-status: var(--bs-secondary); }
.appt-card.status-cancelled,   .legend-dot.status-cancelled   { --appt-status: var(--bs-danger); }
.appt-card.status-no-show,     .legend-dot.status-no-show     { --appt-status: var(--bs-dark); }

/* ─── Классы вместо встроенных стилей ──────────────────────────
   Наборы, которые шаблоны повторяли числом в style="…", названы здесь один
   раз. !important — намеренно: класс заменяет встроенный стиль, а встроенный
   стиль перебивал любые правила; без него замена меняла бы вид там, где рядом
   стоит более частное правило. Замены и остаток — manage.py inline_styles. */
.clickable             { cursor: pointer !important; }  /* указатель-рука */
.scroll-list           { max-height: 280px !important; }  /* список с прокруткой */

/* ─── Страница: templates/chat/chat.html ───
   Раскладка, список бесед, пузыри и поле ввода — классами Bootstrap в разметке
   и в `static/js/chat.js`. Здесь только то, чего в Bootstrap нет. */
/* Окно бесед: не ниже 500px, чтобы пустая беседа не схлопывалась, и не выше
   70% экрана — дальше прокручивается лента внутри. */
.chat-layout { min-height: 500px; max-height: 70vh; }
.chat-sidebar { width: 280px; }
/* Сообщение не шире 80% ленты: своё прижато вправо (`ms-auto`), чужое влево. */
.message { max-width: 80%; }
/* Переносы строк из текста сообщения показывает стиль. Прежде их подменял
   JS на <br>, ради чего текст приходилось экранировать вручную. */
.message-bubble { white-space: pre-wrap; }
/* Поле ввода не растягивается мышью и растёт не выше трёх строк. */
.chat-text { resize: none; max-height: 80px; }

/* ─── Страница: templates/dicts/center_form.html ───
   Перенесено из блока <style> шаблона: правила этой страницы. */
/* Выключенное рабочее место в форме центра. Класс вешался с самого начала, а
   правила к нему не было: строка ничем не отличалась от рабочей, хотя в
   расписании такого места нет. */
.wp-inactive > td { opacity: .55; }

/* Динамическое показ/скрытие элементов «Смены» и «Оффсеты» по чекбоксу центра.
   Действует и на колонки в таблице РМ, и на строки «Оффсет до/после» в расписании центра. */
form.center-form:not(.has-shifts) .col-shifts { display: none; }
form.center-form:not(.has-offsets) .col-offsets { display: none; }

/* ─── Страница: templates/orders/order_form.html ───
   Перенесено из блока <style> шаблона: правила этой страницы. */
/* Классы-хуки JS (валидация полей, ячейки итогов, выпадашки автокомплита) —
   на токенах Bootstrap, поддержка тёмной темы. Разметка формы — Bootstrap. */
.field-hint { border-color: var(--bs-danger) !important; box-shadow: 0 0 0 .2rem rgba(var(--bs-danger-rgb), .12) !important; }
.item-total-display { text-align: right; font-variant-numeric: tabular-nums; padding: .35rem .1rem; font-weight: 600; }

/* ─── Общее для расписания и табеля ───
   Ряды навигации, чипы центров, переключатели и итоги — классами Bootstrap в
   разметке (`d-flex flex-wrap gap-N`, `btn rounded-pill`, `btn-group`). Своё —
   только ширина подписи месяца: без неё кнопки листания прыгают по ширине
   названия месяца. */
.ts-month-label { min-width:200px; }

/* ─── Страница: templates/schedule/calendar.html ───
   Перенесено из блока <style> шаблона: правила этой страницы. */

/* Grid */
.cal-wrap { overflow-x:auto; overflow-y:auto; max-height:calc(100vh - 220px); border:1px solid var(--bs-border-color); }
.cal-table { width:100%; border-collapse:collapse; table-layout:fixed; font-size:12px; }
.cal-table th { padding:4px; text-align:center; border:1px solid var(--bs-border-color); background:var(--bs-secondary-bg); font-size:12px; white-space:nowrap; }
.cal-table th.time-col { width:52px; text-align:right; padding-right:6px; position:-webkit-sticky; position:sticky; left:0; z-index:1; background:var(--bs-secondary-bg); }
.cal-table th.today { background:var(--bs-warning-bg-subtle); }
.cal-table th.weekend { color:var(--bs-primary); }

.cal-table td { padding:1px 2px; border:1px solid var(--bs-border-color); vertical-align:top; height:26px; cursor:pointer; }
.cal-table td:hover { background:rgba(var(--bs-primary-rgb),0.06); }
.cal-table td.time-col { text-align:right; padding-right:6px; color:var(--bs-secondary-color); font-size:11px; vertical-align:middle; cursor:default; position:-webkit-sticky; position:sticky; left:0; z-index:1; background:var(--bs-body-bg); }
.cal-table td.off { background:var(--bs-secondary-bg); }
.cal-table td.today { background:var(--bs-warning-bg-subtle); }

.appt-card { display:block; padding:1px 4px; border-radius:3px; color:var(--bs-white); text-decoration:none; font-size:11px; line-height:1.3; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; border-left:3px solid var(--appt-status, transparent); margin-bottom:1px; }
.appt-card:hover { opacity:0.85; text-decoration:none; color:var(--bs-white); }
.appt-card.status-cancelled, .appt-card.status-no-show { opacity:0.5; text-decoration:line-through; }
.appt-card.no-lab { background:var(--bs-danger-bg-subtle)!important; border-left-color:var(--bs-danger)!important; color:var(--bs-danger-text-emphasis)!important; }
.appt-card[draggable="true"] { cursor:grab; }
.appt-card[draggable="true"]:active { cursor:grabbing; }
.cal-table td.drag-over { background:rgba(var(--bs-primary-rgb),0.12)!important; outline:2px dashed var(--bs-primary); outline-offset:-2px; }

.legend-dot { width:10px; height:10px; border-radius:2px; display:inline-block; background:var(--appt-status); }

/* ─── Страница: templates/study/patient_studies.html ───
   Перенесено из блока <style> шаблона: правила этой страницы. */
/* Зона загрузки файла (класс — хук drag&drop в JS). Токены Bootstrap. */
.file-dropzone { border: 2px dashed var(--bs-info-border-subtle); border-radius: .375rem; padding: 1.5rem; text-align: center; color: var(--bs-info-text-emphasis); cursor: pointer; transition: background .15s; }
.file-dropzone:hover { background: var(--bs-info-bg-subtle); }

/* ─── Страница: templates/timesheet/timesheet_month.html ───
   Перенесено из блока <style> шаблона: правила этой страницы. */


/* Month calendar grid */
.month-grid { width:100%; border-collapse:collapse; table-layout:fixed; }
.month-grid th { padding:6px 4px; font-size:12px; font-weight:700; text-align:center; border-bottom:2px solid var(--bs-border-color); }
.month-grid th.weekend { color:var(--bs-danger); }
.month-grid td { border:1px solid var(--bs-border-color); vertical-align:top; padding:4px 6px; height:90px; font-size:12px; }
.month-grid td.empty-cell { background:var(--bs-secondary-bg); }
.month-grid td.weekend { background:var(--bs-danger-bg-subtle); }
.month-grid td.today-cell { background:var(--bs-warning-bg-subtle); }
.month-grid td.dayoff-cell { background:var(--bs-secondary-bg); }


/* Время сотрудника в клетке месяца — мельче `fs-tiny` самой клетки. */
.emp-time { font-size:10px; }


/* ─── Страница: templates/timesheet/timesheet_table.html ───
   Перенесено из блока <style> шаблона: правила этой страницы. */

.ts-table { width:100%; border-collapse:collapse; font-size:12px; table-layout:auto; }
.ts-table th { padding:4px 2px; font-size:11px; text-align:center; border-bottom:2px solid var(--bs-border-color); font-weight:700; white-space:nowrap; position:-webkit-sticky; position:sticky; top:0; z-index:3; background:var(--bs-secondary-bg); }
/* Боковые колонки (Центр, Должность, См, Сотрудник). При прокрутке вбок липнет
   только «Сотрудник» (решение владельца 10.10.2026): липкие все разом стояли бы
   у одного края друг на друге. В шапке «Сотрудник» — угол (top+left). */
.ts-table th.wp-col, .ts-table th.emp-col { text-align:left; background:var(--bs-body-bg); z-index:4; font-size:12px; padding:4px 6px; white-space:nowrap; width:1px; }
.ts-table th.emp-col { left:0; z-index:5; }
.ts-table th.weekend { background:var(--bs-danger-bg-subtle); }
.ts-table th.today-col { background:var(--bs-warning-bg-subtle); border:1px solid var(--bs-primary); }
.ts-table th.dayoff-col { background:var(--bs-secondary-bg); }
/* Статистические колонки справа (ДН, ФКТ, ПЛН, ВСЕГО) — минимальная ширина по содержимому */
.ts-table th.stats-col { width:1px; white-space:nowrap; padding:4px 6px; }

.ts-table td { padding:2px 1px; border:1px solid var(--bs-border-color); text-align:center; vertical-align:middle; font-size:10px; white-space:nowrap; height:26px; }
.ts-table td.wp-col, .ts-table td.emp-col { text-align:left; padding:2px 6px; font-size:12px; background:var(--bs-body-bg); width:1px; white-space:nowrap; }
.ts-table td.emp-col { position:-webkit-sticky; position:sticky; left:0; z-index:2; }
.ts-table td.weekend { background:var(--bs-danger-bg-subtle); }
.ts-table td.today-col { background:var(--bs-warning-bg-subtle); }
.ts-table td.dayoff-col { background:var(--bs-secondary-bg); }
.ts-table td.has-data { background:var(--bs-success-bg-subtle); position:relative; }
.ts-table td.stats-col { font-weight:700; background:var(--bs-secondary-bg); font-size:11px; width:1px; white-space:nowrap; padding:2px 6px; }

/* Отклонения времени и длительности — `text-primary` / `text-danger` в разметке. */

.ts-table a { color:inherit; text-decoration:none; }
.ts-table a:hover { text-decoration:underline; }
.ts-time { font-size:9px; color:inherit; display:block; line-height:1.1; font-weight:400; }
.ts-table th .ts-time { border-top:1px solid var(--bs-border-color); margin-top:2px; padding-top:2px; }
/* Режим «Часы»: показываем длительности вместо ✓. */
.ts-table.mode-hours .ts-checkmark { display:none; }
.ts-table:not(.mode-hours) .ts-hours-fact,
.ts-table:not(.mode-hours) .ts-hours-plan { display:none; }


/* Bulk planning checkboxes — hidden by default, shown in planning mode */
.ts-check { position:absolute; top:1px; right:1px; z-index:3; width:13px; height:13px; cursor:pointer; accent-color:var(--bs-danger); display:none; }
.ts-assign-check { position:absolute; top:1px; left:1px; z-index:3; width:13px; height:13px; cursor:pointer; accent-color:var(--bs-primary); display:none; }
.ts-table td.empty-cell { position:relative; }
/* Planning mode active */
.planning-mode .ts-check, .planning-mode .ts-assign-check { display:block; }
/* Запланированные (без часов) — жёлтый фон, видно что «запланировано, можно снять» */
/* Зелёный (`.has-data`) / оранжевый (`planned-only`) — во всех режимах,
   чтобы сразу видеть отработанные и запланированные-но-пустые ячейки. */
.ts-table td.has-data.planned-only { background:var(--bs-warning-bg-subtle); }
.ts-table td.has-data.planned-only.weekend { background:var(--bs-warning-border-subtle); }
.ts-table td.has-data.planned-only.today-col { background:var(--bs-warning-border-subtle); }
/* Просрочено — запланированная ячейка в прошлом без заполненных часов */
.ts-table td.has-data.planned-only.no-hours { background:var(--bs-danger-bg-subtle); }
/* Отработанные и начатые ячейки своего класса не носят: они зелёные правилом
   `.has-data`, которое и так перекрывает выходной и сегодняшний день. */
/* Редактируемые ячейки — жирная нижняя граница; фон не трогается: цвет
   состояния (запланировано, просрочено, отработано) виден и в окне правки. */
.ts-table td.has-data.is-editable { border-bottom:3px solid var(--bs-success); }
/* Заблокированные ячейки (несовместимы с текущим режимом/сотрудниками) */
.planning-mode .ts-table td.locked-cell { opacity:0.35; pointer-events:none; }

@media print {
  .ts-table td, .ts-table th { font-size:8px; padding:1px; }
}
/* Квадратик легенды табеля: цвет и рамка — утилитами в разметке, размер — здесь:
   утилит размера в пикселях у Bootstrap нет. */
.ts-swatch { display:inline-block; width:14px; height:14px; vertical-align:middle; }

/* ─── Личный кабинет врача ──────────────────────────────────────
   Свой каркас (`templates/client_area/base.html`): врач приходит со старой
   системы и не должен заметить перехода — строка сверху, узкая колонка со
   ссылками, содержимое справа. Раскладка, меню и цвета — классами Bootstrap в
   разметке (`row`/`col`, `nav nav-pills`, утилиты); здесь только то, чего в
   Bootstrap нет: высота логотипа, ширина колонки меню и запрет содержимому
   распирать колонку.

   Цвета и шрифты кабинета — только токенами темы: владелец вправе одной
   кнопкой на «Оформлении» перевести всю систему, включая кабинет, на другую
   тему (`core/tests_cabinet_styles.py`). Облик 3dtomo приезжает умолчаниями
   вкладки, а не отсюда (`core/apps.py`, `settings_defaults`). */
.cab-logo img { height: 38px; width: auto; }
/* Фон кабинета — фон темы, как у прежней системы, а не серый фон рабочих
   страниц: каркас платформы ставит телу `bg-body-tertiary` (с `!important`),
   а снять класс у тела страница-наследник не может — только добавить свой
   (`body_class`). Цвет — токеном темы. Согласовано планом этапа 3.3. */
.cab-page { background-color: var(--bs-body-bg) !important; }
/* Колонка `col` по умолчанию не уже своего содержимого: широкая таблица
   вытолкнула бы её за край окна. */
.cab-main { min-width: 0; }
/* Ширины — как у 3dtomo (Bootstrap 4), решение владельца 14.10.2026. Контейнер
   там не шире 1140px: у Bootstrap 5 на экранах от 1400px он 1320px, и
   страница выходила шире прежней. Промежуток сетки там 30px, у Bootstrap 5 —
   24px (`g-4`), а классом такого числа нет. Колонка меню — 285px вместе с
   промежутком (ссылки 255px), содержимое — остальные 855px (таблица 825px).
   На телефоне меню во всю ширину (`col-12`). */
@media (min-width: 1400px) {
  .cab-container { max-width: 1140px; }
}
/* Поле контейнера — половина промежутка, как у Bootstrap 4 (15px), иначе
   ряд с промежутком 30px съезжал на 3px влево от контейнера. */
.cab-container, .cab-row { --bs-gutter-x: 30px; }
@media (min-width: 768px) {
  .cab-nav { width: 285px; }
}
/* Планшет: колонка уже, но не настолько, чтобы пункты ломались в две строки
   и страница уезжала вбок, — так сделано у 3dtomo, и это их дефект. Ссылки —
   200px. */
@media (min-width: 768px) and (max-width: 1199.98px) {
  .cab-nav { width: 230px; }
}
/* Линия под шапкой таблицы кабинета — 2px, как у 3dtomo (Bootstrap 4). У
   Bootstrap 5 штатный разделитель (`table-group-divider`) рисует её цветом
   текста, то есть тёмной, а нужна светло-серая — цвет границ таблицы. Поэтому
   только толщина: цвет остаётся токеном темы. Согласовано владельцем
   14.10.2026. */
.cab-head-line > tr > th { border-bottom-width: 2px; }

/* Старые браузеры (iOS 12 и Safari 12): флексовый `gap` там не работает.
   Свои ряды поэтому — классами `d-flex gap-N` в разметке: запасные отступы для
   них ставит каркас платформы («Старые браузеры» её руководства). Ряд, который
   держит `display:flex` своим правилом, запасного отступа не получит. */

/* История в окне правки смены — `list-group-flush`; своё — высота прокрутки. */
.ts-hist { max-height: 150px; }

/* ─── Подпись месяца в заказах и оплатах ───
   Постоянной ширины, иначе кнопки «назад» и «вперёд» прыгают при переходе
   между месяцами разной длины названия. */
.ord-month-label { min-width: 150px; }