/* =============================================================================
   Слой эргономики (глобальный): компактность + липкие шапки/итоги таблиц.
   Не меняет палитру, шрифты и разметку — только уплотняет отступы и «приклеивает»
   шапку и строку «Итого» при прокрутке длинных таблиц.
   Действует внутри .erp-content (боковое меню и верхняя панель не затронуты).
   Откат: убрать <link ... ergonomics.css> из base.html или удалить этот файл.

   Подстройка плотности — меняй --erg-cell-y (вертикальные отступы ячеек).
   ============================================================================= */

:root {
  --erg-cell-y: .3rem;   /* вертикальный отступ в ячейках обычных таблиц */
}

/* ---- 1. КОМПАКТНОСТЬ (только отступы; размер шрифта не трогаем) ---- */

/* поменьше воздуха вокруг контента */
.erp-content { padding: 10px 16px 18px; }

/* карточки: плотнее внутри и меньше зазор между ними */
.erp-content .card { margin-bottom: .75rem; }
.erp-content .card-body { padding: .7rem .85rem; }
.erp-content .card-body.py-2 { padding-top: .5rem; padding-bottom: .5rem; }

/* строки обычных таблиц ниже (табличный .table-sm и табель НЕ трогаем —
   они и так плотные / со своей вёрсткой) */
.erp-content .table:not(.table-sm):not(.timesheet-grid) > :not(caption) > * > * {
  padding-top: var(--erg-cell-y);
  padding-bottom: var(--erg-cell-y);
}

/* поля ввода чуть ниже — комфортно, но компактнее */
.erp-content .form-control:not(.form-control-sm),
.erp-content .form-select:not(.form-select-sm) {
  padding-top: .3rem;
  padding-bottom: .3rem;
}

/* заголовки разделов — меньше нижний отступ */
.erp-content h1, .erp-content h2, .erp-content h4, .erp-content h5 { margin-bottom: .5rem; }

/* ---- 2. ЛИПКИЕ ШАПКИ И ИТОГИ (длинные таблицы) ----

   Bootstrap оборачивает таблицы в .table-responsive (overflow-x:auto) — это
   скролл-контейнер, поэтому шапку липним к ВЕРХУ этого контейнера (top:0), а
   самому контейнеру задаём максимальную высоту: длинная таблица прокручивается
   внутри со «залипшей» шапкой, короткая (меньше высоты) — скролла не получает.
   Табельную сетку не трогаем — у неё свой контейнер (inline max-height) и своё
   залипание. */

:root { --erg-table-maxh: calc(100vh - 210px); }

.erp-content .table-responsive { max-height: var(--erg-table-maxh); }

.erp-content .table-responsive > .table:not(.timesheet-grid) > thead > tr > th,
.erp-content .table-responsive > .table:not(.timesheet-grid) > thead > tr > td {
  position: sticky;
  top: 0;
  z-index: 3;
  background: var(--surface, #fff);
  /* при border-collapse рамка «уезжает» — рисуем её тенью, чтобы осталась видимой */
  box-shadow: inset 0 -1px 0 var(--border-strong, #d3d1c7);
}
.erp-content .table-responsive > .table:not(.timesheet-grid) > thead.table-light > tr > th,
.erp-content .table-responsive > .table:not(.timesheet-grid) > thead > tr > th.table-light {
  background: var(--surface-2, #faf9f4);
}

/* строка «Итого» (tfoot) липнет к низу контейнера, пока таблица прокручивается */
.erp-content .table-responsive > .table:not(.timesheet-grid) > tfoot > tr > th,
.erp-content .table-responsive > .table:not(.timesheet-grid) > tfoot > tr > td {
  position: sticky;
  bottom: 0;
  z-index: 2;
  background: var(--surface-2, #faf9f4);
  box-shadow: inset 0 1px 0 var(--border-strong, #d3d1c7);
}

/* цифры в денежных/числовых колонках — по разряду (мелочь, но читается лучше) */
.erp-content .table td.num, .erp-content .table th.num,
.erp-content .table .text-end { font-variant-numeric: tabular-nums; }