/* ═══════════════════════════════════════════════════════════════════════════
   Стили модуля «Сотрудники». Только поверх токенов хоста (styles.css).
   Классы фильтров (filter-bar, filter-chip, svc-…, cm-…) и модалок
   (modal…, form-…) переиспользуем у хоста — здесь только hr-специфика.
   ВАЖНО: внутри CSS-комментариев НЕЛЬЗЯ писать звёздочку-слэш подряд
   (как в «.svc-* / .cm-*» без пробелов) — это досрочно закрывает комментарий,
   и парсер молча съедает первое правило после него. Уже наступали.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ─── Единая шапка модуля: заголовок+сегодня+вкладки стабильны на всех
   вкладках; действия Реестра — аккуратным блоком ниже. Один разделитель снизу.
   ЖЕЛЕЗНОЕ ПРАВИЛО РАСКЛАДКИ (не менять при правках!): всё прижато ВЛЕВО,
   выравнивание только через gap. Никаких space-between, распорок (flex-spacer),
   margin-left:auto — именно они раньше раскидывали кнопки при каждой правке. */
.hr-header { margin-bottom: 12px; }
/* Строка 1 (по образцу «Графики и Табель»): заголовок · поиск (растянут) · дата · отмена/возврат */
.hr-head { display: flex; align-items: center; gap: 14px; flex-wrap: nowrap; margin-bottom: 12px; }
.hr-title { font-family: var(--font-serif); font-size: 20px; line-height: 1; color: var(--ink); white-space: nowrap; flex-shrink: 0; }
.hr-title-mon { color: var(--ink-3); font-style: italic; font-size: 17px; }
.hr-head .hr-search { flex: 0 1 340px; }
.hr-date { font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-2); white-space: nowrap; flex-shrink: 0; }
.hr-head .hr-ur-group { flex-shrink: 0; }
/* Строка 2: [+ Специалист] · вкладки · статус (справа) */
.hr-tabsrow { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.hr-tabsrow .hr-add-btn { flex-shrink: 0; }
.hr-ur-group { display: inline-flex; flex-shrink: 0; }
.hr-add-btn { padding: 7px 14px !important; font-size: 13px !important; flex-shrink: 0; }
/* Строка 3: фильтры · сортировка · архив (статус переехал в строку 2) */
.hr-filterrow { display: flex; align-items: center; justify-content: flex-start; gap: 10px; flex-wrap: wrap; }
.hr-filter-chips { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }

/* ─── Скролл как в «Графики и табель»: шапка модуля стоит, скроллится только
   содержимое. body.is-hr ставит app.js (render), схема 1:1 с body.is-schedules. */
body.is-hr .content { overflow: hidden; display: flex; flex-direction: column; }
body.is-hr .content > .hr-header { flex-shrink: 0; }
body.is-hr .content > .hr-body { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; }
/* Реестр: скроллится сама таблица (thead и колонка ФИО — sticky внутри неё) */
body.is-hr .content > .hr-body-registry { overflow: hidden; display: flex; flex-direction: column; }
body.is-hr .hr-body-registry > .hr-table-wrap { flex: 1; min-height: 0; overflow: auto; }
/* Списки: чипы и заголовок стоят, скроллятся только строки; шапка №/ФИО/… — sticky */
body.is-hr .content > .hr-body-lists { overflow: hidden; display: flex; flex-direction: column; }
body.is-hr .hr-body-lists > .hr-lists-bar,
body.is-hr .hr-body-lists > .hr-lists-title { flex-shrink: 0; }
body.is-hr .hr-body-lists > .card { flex: 1; min-height: 0; overflow: auto; }
body.is-hr .hr-body-lists .dict-table thead th { position: sticky; top: 0; z-index: 2; }
/* Журнал: фильтр стоит, скроллится только лента записей */
body.is-hr .content > .hr-body-journal { overflow: hidden; display: flex; flex-direction: column; }
body.is-hr .hr-body-journal > .hr-journal { flex: 1; min-height: 0; display: flex; flex-direction: column; }
body.is-hr .hr-body-journal .hr-jfilter { flex-shrink: 0; }
body.is-hr .hr-body-journal .hr-jlist { flex: 1; min-height: 0; overflow-y: auto; }

/* ─── Вкладки ─────────────────────────────────────────────────────────────── */
.hr-subnav { display: flex; flex-wrap: wrap; gap: 4px; }
.hr-subnav-btn { display: inline-flex; align-items: center; gap: 7px; padding: 7px 13px; border: 1px solid transparent; border-radius: var(--radius-sm); background: transparent; color: var(--ink-2); font-family: var(--font-sans); font-size: 13.5px; font-weight: 500; cursor: pointer; transition: background .12s, color .12s, border-color .12s; }
.hr-subnav-btn svg { color: var(--ink-3); }
.hr-subnav-btn:hover { background: var(--surface-2); color: var(--ink); }
.hr-subnav-btn.active { background: var(--surface); border-color: var(--hairline); color: var(--ink); box-shadow: 0 1px 2px rgba(20,23,26,.04); }
.hr-subnav-btn.active svg { color: var(--ink); }
.hr-subnav-badge { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--hue-vlek); color: #fff; font-size: 11px; font-weight: 600; line-height: 18px; text-align: center; }

/* ─── Поиск ───────────────────────────────────────────────────────────────── */
.hr-search { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border: 1px solid var(--hairline); border-radius: var(--radius-sm); background: var(--surface); flex: 1; min-width: 220px; max-width: 340px; }
.hr-search svg { color: var(--ink-3); flex-shrink: 0; }
.hr-search input { border: none; outline: none; background: transparent; font-family: var(--font-sans); font-size: 13.5px; color: var(--ink); width: 100%; }

/* ─── Полоса фильтров (сортировка/архив) ──────────────────────────────────── */
.hr-sortbtn { gap: 6px; }
.hr-sortbtn svg { vertical-align: -2px; margin-right: 3px; }
/* Маркер сортировки на кнопке «Все»: приглушённый = по фамилии, яркий = по срокам */
.hr-sortmark { display: inline-flex; align-items: center; margin-left: 4px; opacity: .4; }
.hr-sortmark svg { vertical-align: middle; }
.hr-sortmark.is-srok { opacity: 1; }

/* ─── Шапка «сегодня» ─────────────────────────────────────────────────────── */
.hr-today { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 12px; color: var(--ink-2); margin-bottom: 10px; }
.hr-today-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--hue-vlek); box-shadow: 0 0 0 3px color-mix(in srgb, var(--hue-vlek) 22%, transparent); }

/* ─── Таблица реестра ─────────────────────────────────────────────────────── */
.hr-table-wrap { overflow-x: auto; border: 1px solid var(--hairline); border-radius: 12px; background: var(--surface); }
.hr-table { border-collapse: collapse; width: 100%; font-size: 13px; }
.hr-table thead th { position: sticky; top: 0; background: var(--surface-2); color: var(--ink-3); font-weight: 500; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; padding: 10px 8px; text-align: center; border-bottom: 1px solid var(--hairline); white-space: nowrap; z-index: 2; }
.hr-table th.hr-col-fio { text-align: left; left: 0; z-index: 3; }
.hr-table td { padding: 9px 8px; border-bottom: 1px solid var(--hairline); text-align: center; vertical-align: middle; }
.hr-table tbody tr:last-child td { border-bottom: none; }
.hr-col-fio { width: 300px; min-width: 260px; text-align: left !important; position: sticky; left: 0; background: var(--surface); z-index: 1; }
.hr-row:hover .hr-col-fio { background: var(--surface-2); }
.hr-row.open .hr-col-fio { background: var(--surface-2); }

/* цветная полоска службы у левого края строки */
.svc-strip-rp  { box-shadow: inset 3px 0 0 var(--hue-duty); }
.svc-strip-rdc { box-shadow: inset 3px 0 0 var(--hue-courses); }
.svc-strip-dpv { box-shadow: inset 3px 0 0 var(--hue-sim); }

.hr-fio-wrap { display: flex; align-items: center; gap: 8px; }
.hr-expander { width: 22px; height: 22px; flex-shrink: 0; border: 1px solid var(--hairline); border-radius: 6px; background: var(--surface); color: var(--ink-2); cursor: pointer; font-size: 11px; line-height: 1; display: flex; align-items: center; justify-content: center; }
.hr-expander:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.hr-fio-main { cursor: pointer; min-width: 0; }
.hr-fio-name { font-weight: 600; color: var(--ink); font-size: 13.5px; }
.hr-fio-sub { font-size: 11.5px; color: var(--ink-3); margin-top: 1px; }
.hr-row-arch .hr-fio-name { color: var(--ink-3); }
/* Значок статуса связки с телефоном — в свободном месте после ФИО */
.hr-link-badge { margin-left: auto; flex-shrink: 0; display: inline-flex; align-items: center; gap: 1px; padding: 3px 7px; border-radius: 20px; border: 1px solid; cursor: default; }
.hr-lb-on { color: var(--hue-vac); border-color: color-mix(in srgb, var(--hue-vac) 45%, transparent); background: color-mix(in srgb, var(--hue-vac) 10%, transparent); }
.hr-lb-wait { color: var(--hue-icao); border-color: color-mix(in srgb, var(--hue-icao) 45%, transparent); background: color-mix(in srgb, var(--hue-icao) 9%, transparent); }

/* ячейки допусков */
.hr-gcol { min-width: 92px; }
.hr-gcell { min-width: 92px; }
.hr-gcell-date { font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-2); }
.hr-gcell-left { font-size: 11px; font-weight: 600; margin-top: 2px; }
.hr-dash { color: var(--ink-4); }
.hr-gcell-none { background: transparent; }
.hr-near { min-width: 110px; background: var(--surface-2); }
.hr-row.open .hr-near { background: var(--surface-3); }
th.hr-near { background: var(--surface-3) !important; text-align: center; }

.hr-empty-row { padding: 40px 16px !important; text-align: center; color: var(--ink-3); }

/* ─── Статус-фильтр в тулбаре ─────────────────────────────────────────────── */
.hr-statusfilter { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink-3); }
.hr-statusfilter select { padding: 6px 10px; border: 1px solid var(--hairline); border-radius: 8px; font-size: 13px; background: var(--surface); }
.hr-status-arch { font-size: 13px; color: var(--hue-vlek); font-weight: 500; }

/* ─── Вкладки внутри карточки ─────────────────────────────────────────────── */
.hr-ctabs { display: flex; gap: 3px; margin-bottom: 12px; border-bottom: 1px solid var(--hairline); }
.hr-ctab { padding: 7px 14px; border: none; background: transparent; color: var(--ink-3); font-family: var(--font-sans); font-size: 13px; font-weight: 500; cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.hr-ctab:hover { color: var(--ink); }
.hr-ctab.active { color: var(--ink); border-bottom-color: var(--hue-courses); }
.hr-ctab-body { min-height: 80px; max-height: 460px; overflow-y: auto; overflow-x: hidden; padding-right: 4px; }
.hr-sv-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 7px 2px; border-bottom: 1px solid var(--hairline); font-size: 13px; color: var(--ink); }
.hr-sv-st { font-size: 11.5px; color: var(--ink-3); font-family: var(--font-mono); }

/* ─── Детальная карточка (раскрытие) ──────────────────────────────────────── */
.hr-row-detail > td { padding: 0 !important; background: var(--bg); }
.hr-card { padding: 18px 20px; border-top: 2px solid var(--hue-courses); }
.hr-card-cols { display: grid; grid-template-columns: minmax(320px, 1fr) minmax(340px, 1.2fr); gap: 28px; align-items: start; }
@media (max-width: 1100px) { .hr-card-cols { grid-template-columns: 1fr; } }
.hr-card-sec { font-family: var(--font-mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-3); margin: 4px 0 10px; }
.hr-card-personal .form-grid { margin-bottom: 16px; }
.hr-card-personal .form-row { grid-template-columns: 130px 1fr; }
.hr-sectors { display: flex; gap: 14px; flex-wrap: wrap; }
.hr-sector { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--ink); cursor: pointer; }
.hr-card-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; align-items: center; }

/* Блок host-фактов (read-only) в карточке */
.hr-host-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 18px; margin-bottom: 10px; }
.hr-fact { display: flex; justify-content: space-between; gap: 10px; font-size: 12.5px; border-bottom: 1px dotted var(--hairline); padding: 3px 0; }
.hr-fact span { color: var(--ink-3); }
.hr-fact b { color: var(--ink); font-weight: 600; text-align: right; }
.hr-openhost { margin-bottom: 4px; }

.hr-key-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13px; color: var(--ink-2); margin-bottom: 4px; }
.hr-keyval { font-family: var(--font-mono); font-size: 15px; letter-spacing: .08em; color: var(--ink); background: var(--surface-2); padding: 2px 8px; border-radius: 6px; }
.hr-key-note { font-size: 11.5px; color: var(--ink-3); }
.hr-arch-form { display: inline-flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.hr-arch-form input { padding: 7px 10px; border: 1px solid var(--hairline); border-radius: 8px; font-size: 13px; min-width: 200px; }

/* ─── Блоки допусков в карточке ───────────────────────────────────────────── */
.hr-block { border: 1px solid var(--hairline); border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; background: var(--surface); }
.hr-block-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.hr-block-title { font-weight: 600; font-size: 13px; color: var(--ink); }
.hr-mini-btn { padding: 5px 10px !important; font-size: 12px !important; display: inline-flex; align-items: center; gap: 4px; }
.hr-block-actions { display: flex; gap: 6px; flex-shrink: 0; }
.hr-rec-active { display: flex; align-items: center; gap: 6px 14px; flex-wrap: wrap; font-size: 12.5px; color: var(--ink-2); margin-bottom: 8px; }
.hr-rec-active .hr-rec-badge { margin-left: auto; }
.hr-rec-empty-row { color: var(--ink-4); }
.hr-rec-fld i { color: var(--ink-3); font-style: normal; }
/* Нормы допуска — две ровные подстроки: метка · значение · источник */
.hr-rec-terms { display: flex; flex-direction: column; gap: 4px; padding-top: 8px; border-top: 1px solid var(--hairline); }
.hr-term-line { display: grid; grid-template-columns: 84px 1fr auto; align-items: baseline; gap: 10px; font-size: 11.5px; }
.hr-term-lbl { text-transform: uppercase; font-size: 9.5px; letter-spacing: 0.05em; color: var(--ink-4); }
.hr-term-val { color: var(--ink-2); }
.hr-term-src { color: var(--ink-4); font-style: italic; white-space: nowrap; }
.hr-rec-terms-none { border-top: none; padding-top: 4px; color: var(--ink-4); }
.hr-rec-badge { font-size: 11px; font-weight: 600; border: 1px solid; border-radius: 20px; padding: 1px 8px; }
.hr-rec-empty { font-size: 12.5px; color: var(--ink-4); }
.hr-rec-hist { margin-top: 6px; display: flex; flex-direction: column; gap: 2px; }
.hr-rec-hist-row { font-size: 11.5px; color: var(--ink-3); }
.hr-recform { margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--hairline); display: flex; flex-direction: column; gap: 8px; }
.hr-recform-row { display: grid; grid-template-columns: 150px 1fr; align-items: center; gap: 10px; }
.hr-recform-row span { font-size: 12px; color: var(--ink-3); }
.hr-recform-row input { padding: 7px 10px; border: 1px solid var(--hairline); border-radius: 8px; font-size: 13px; }
.hr-recform-actions { display: flex; gap: 8px; }

/* ─── Модалка добавления ──────────────────────────────────────────────────── */
.hr-add-choose { display: flex; gap: 12px; }
.hr-add-big { flex: 1; padding: 20px !important; font-size: 14px !important; justify-content: center; }
.hr-import-list { display: flex; flex-direction: column; gap: 4px; max-height: 52vh; overflow-y: auto; }
.hr-import-row { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; padding: 9px 12px; border: 1px solid var(--hairline); border-radius: 8px; background: var(--surface); cursor: pointer; text-align: left; }
.hr-import-row:hover { background: var(--surface-2); border-color: var(--ink-3); }
.hr-import-fio { font-weight: 600; font-size: 13.5px; color: var(--ink); }
.hr-import-meta { font-size: 11.5px; color: var(--ink-3); }

/* ─── Списки + Excel ──────────────────────────────────────────────────────── */
.hr-lists-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; justify-content: space-between; margin-bottom: 10px; }
.hr-lists-bar .filter-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.hr-lists-title { font-family: var(--font-serif); font-size: 18px; color: var(--ink-2); margin-bottom: 10px; }
.hr-passcols { display: flex; align-items: center; gap: 10px 16px; flex-wrap: wrap; padding: 10px 12px; margin-bottom: 12px; background: var(--surface-2, rgba(0,0,0,0.03)); border: 1px solid var(--line, rgba(0,0,0,0.08)); border-radius: 8px; }
.hr-passcols-lbl { font-size: 12.5px; color: var(--ink-2); width: 100%; }
.hr-passcol { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--ink); cursor: pointer; user-select: none; }
.hr-passcol input { cursor: pointer; }

/* ─── Журнал ──────────────────────────────────────────────────────────────── */
.hr-jfilter { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; font-size: 13px; color: var(--ink-3); }
.hr-jfilter select { padding: 6px 10px; border: 1px solid var(--hairline); border-radius: 8px; font-size: 13px; }
.hr-jlist { display: flex; flex-direction: column; gap: 2px; }
.hr-jrow { display: flex; gap: 12px; padding: 8px 10px; border-bottom: 1px solid var(--hairline); font-size: 13px; }
.hr-jwhen { font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-3); flex-shrink: 0; min-width: 84px; }
.hr-jmsg { color: var(--ink); }

/* ─── Пустое состояние + настройки ────────────────────────────────────────── */
.hr-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 56px 24px; text-align: center; color: var(--ink-3); }
.hr-empty-title { font-family: var(--font-serif); font-size: 22px; color: var(--ink-2); }
.hr-empty-note { font-size: 13.5px; max-width: 460px; line-height: 1.5; }
.hr-settings-hint { font-size: 13.5px; color: var(--ink-2); max-width: 640px; line-height: 1.5; margin-bottom: 16px; }
.hr-tiers { display: flex; flex-direction: column; gap: 8px; max-width: 420px; }
.hr-tier { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border: 1px solid var(--hairline); border-radius: var(--radius-sm); background: var(--surface); }
.hr-tier-dot { width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0; }
.hr-tier-label { flex: 1; font-size: 14px; color: var(--ink); font-weight: 500; }
.hr-tier-state { font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-3); text-transform: uppercase; letter-spacing: .04em; }
.hr-tier-overdue { border-style: dashed; }

/* ─── Настройки: пороги уведомлений по каждому пункту ──────────────────────── */
.hr-nrows { display: flex; flex-direction: column; gap: 8px; max-width: 720px; }
.hr-nrow { display: grid; grid-template-columns: 220px 1fr auto; align-items: center; gap: 14px; padding: 10px 14px; border: 1px solid var(--hairline); border-radius: var(--radius-sm); background: var(--surface); }
.hr-nrow-title { font-weight: 600; font-size: 13.5px; color: var(--ink); }
.hr-nrow-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.hr-nedit { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; border: 1px solid; border-radius: 20px; padding: 2px 4px 2px 10px; }
.hr-nedit-x { border: none; background: transparent; color: inherit; cursor: pointer; font-size: 14px; line-height: 1; padding: 0 4px; opacity: .7; }
.hr-nedit-x:hover { opacity: 1; }
.hr-nrow-add { display: inline-flex; align-items: center; gap: 6px; }
.hr-nadd-inp { width: 66px; padding: 6px 8px; border: 1px solid var(--hairline); border-radius: 8px; font-size: 13px; font-family: var(--font-mono); }
.hr-naddbtn { white-space: nowrap; }

/* ─── Настройки: таблица сроков (В-7) — на базе host .dict-table ───────────── */
.hr-terms-table .hr-term-name { font-weight: 600; color: var(--ink); font-family: var(--font-sans); }
.hr-term-inp { width: 58px; padding: 6px 8px; border: 1px solid var(--hairline); border-radius: 8px; font-size: 13px; font-family: var(--font-mono); text-align: center; }
.hr-term-u { font-size: 11.5px; color: var(--ink-3); margin-left: 2px; }
.hr-eng-levels { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; }
.hr-eng-levels > span { display: inline-flex; align-items: center; gap: 4px; }
.hr-eng-levels .hr-term-inp { width: 50px; }

/* ─── Обзор (дашборд сроков) ──────────────────────────────────────────────── */
.hr-ov-plate { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; margin-bottom: 14px; border: 1px solid var(--hairline); border-radius: var(--radius-sm); background: var(--surface); font-size: 13.5px; color: var(--ink); cursor: pointer; }
.hr-ov-plate:hover { background: var(--surface-2); }
.hr-ov-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 1000px) { .hr-ov-grid { grid-template-columns: 1fr; } }
.hr-ov-group { border: 1px solid var(--hairline); border-radius: 12px; background: var(--surface); overflow: hidden; }
.hr-ov-head { display: flex; align-items: center; gap: 8px; padding: 11px 14px; border-bottom: 2px solid var(--hairline); }
.hr-ov-dot { width: 10px; height: 10px; border-radius: 50%; }
.hr-ov-title { font-weight: 600; font-size: 14px; color: var(--ink); flex: 1; }
.hr-ov-count { font-family: var(--font-mono); font-size: 13px; color: var(--ink-2); background: var(--surface-2); padding: 1px 9px; border-radius: 10px; }
.hr-ov-note { padding: 8px 14px 4px; font-size: 11.5px; color: var(--ink-3); }
.hr-ov-list { max-height: 340px; overflow-y: auto; padding: 4px 6px 8px; }
.hr-ov-row { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; padding: 7px 8px; border: none; background: transparent; border-radius: 8px; cursor: pointer; font-size: 13px; color: var(--ink); }
.hr-ov-row:hover { background: var(--surface-2); }
.hr-ov-fio { flex: 1; font-weight: 500; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hr-ov-kind { font-family: var(--font-mono); font-size: 11px; color: var(--ink-3); background: var(--surface-2); padding: 1px 7px; border-radius: 8px; flex-shrink: 0; }
.hr-ov-date { font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-2); flex-shrink: 0; }
.hr-ov-left { font-size: 11.5px; font-weight: 600; flex-shrink: 0; min-width: 92px; text-align: right; }
.hr-ov-nd { font-family: var(--font-mono); font-size: 11px; color: var(--ink-3); }
.hr-ov-empty { padding: 14px; text-align: center; color: var(--ink-4); font-size: 12.5px; }

/* строка «уведомлять за …» в блоке допуска карточки */
.hr-rec-notify { margin-top: 6px; font-size: 11.5px; color: var(--ink-3); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.hr-nchip { font-family: var(--font-mono); font-weight: 600; color: var(--ink-2); background: var(--surface-2); padding: 1px 7px; border-radius: 10px; }
.hr-nnote { color: var(--ink-4); }

/* ═══ Экран «Заявки» (связка со спутником, этап A) ═══════════════════════════ */
.hr-req-wrap { max-width: 860px; }
.hr-req-list { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }
.hr-req { border: 1px solid var(--hairline); border-radius: 12px; padding: 12px 14px; background: var(--surface); }
.hr-req-done { opacity: 0.72; }
.hr-req-top { display: flex; align-items: center; gap: 9px; margin-bottom: 9px; }
.hr-req-fio { font-weight: 600; color: var(--ink); font-size: 14px; }
.hr-req-badge { font-size: 11px; padding: 2px 9px; border-radius: 20px; border: 1px solid; font-weight: 500; }
.hr-req-pend { color: var(--hue-icao); border-color: color-mix(in srgb, var(--hue-icao) 45%, transparent); }
.hr-req-ok { color: var(--hue-vac); border-color: color-mix(in srgb, var(--hue-vac) 55%, transparent); }
.hr-req-rej { color: var(--hue-vlek); border-color: color-mix(in srgb, var(--hue-vlek) 45%, transparent); }
.hr-req-sync { font-size: 11px; color: var(--ink-3); background: var(--surface-2); padding: 2px 8px; border-radius: 10px; }
.hr-req-cmp { display: flex; align-items: stretch; gap: 12px; }
.hr-req-col { flex: 1; display: flex; flex-direction: column; gap: 3px; }
.hr-req-lbl { font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--ink-4); }
.hr-req-col b { font-size: 13.5px; color: var(--ink); font-weight: 600; }
.hr-req-cur { font-size: 13px; color: var(--ink-2); }
.hr-req-arrow { align-self: center; color: var(--ink-4); font-size: 18px; }
.hr-req-reason { margin-top: 8px; font-size: 12.5px; color: var(--hue-vlek); }
.hr-req-actions { display: flex; gap: 8px; margin-top: 11px; }
.hr-rej-form { display: flex; gap: 7px; margin-top: 9px; align-items: center; flex-wrap: wrap; }
.hr-rej-inp { flex: 1; min-width: 180px; font-family: var(--font-sans); font-size: 13px; border: 1px solid var(--hairline); border-radius: 8px; padding: 7px 10px; background: var(--bg); color: var(--ink); }
.hr-rej-inp:focus { outline: none; border-color: var(--ink-3); }