/*
 * HR Docs 2.0
 * Unified visual design system
 * Presentation only — no application logic
 */

:root {
    /* Основные цвета */
    --hr2-bg: #F5F7FB;
    --hr2-surface: #FFFFFF;
    --hr2-surface-alt: #F8FAFC;
    --hr2-text: #172033;
    --hr2-muted: #64748B;
    --hr2-border: #E2E8F0;

    /* Акценты */
    --hr2-primary: #1D4ED8;
    --hr2-primary-hover: #1E40AF;
    --hr2-primary-soft: #EFF6FF;

    /* Состояния */
    --hr2-success: #15803D;
    --hr2-warning: #B45309;
    --hr2-danger: #B91C1C;

    /* Размеры и отступы */
    --hr2-space-1: 4px;
    --hr2-space-2: 8px;
    --hr2-space-3: 12px;
    --hr2-space-4: 16px;
    --hr2-space-5: 24px;
    --hr2-space-6: 32px;

    /* Геометрия */
    --hr2-radius-sm: 8px;
    --hr2-radius-md: 12px;
    --hr2-radius-lg: 16px;

    /* Элементы управления */
    --hr2-control-height: 38px;
    --hr2-control-border: #CBD5E1;

    /* Типографика */
    --hr2-font: Inter, system-ui, -apple-system,
        BlinkMacSystemFont, "Segoe UI", sans-serif;

    /* Эффекты */
    --hr2-shadow: 0 2px 12px rgba(15, 23, 42, 0.05);
    --hr2-focus: 0 0 0 3px rgba(29, 78, 216, 0.16);
}


/* HR2 PEOPLE SHELL V1 */

/* Общая геометрия */
html {
    background: var(--hr2-bg);
    color: var(--hr2-text);
}

/* Верхняя панель */
.topbar {
    padding: 14px clamp(16px, 2.5vw, 36px);
    gap: 16px;
    background: var(--hr2-surface);
    border-bottom: 1px solid var(--hr2-border);
}

.topbar-brand strong {
    font-size: 19px;
    letter-spacing: -0.025em;
    color: var(--hr2-text);
}

.topbar-brand span,
.topbar .user-block span {
    color: var(--hr2-muted);
}

.topbar .user-block {
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px 14px;
    min-width: 0;
}

/* Навигация администратора */
.topbar .user-block > a {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 7px 10px;
    border-radius: var(--hr2-radius-sm);
    color: var(--hr2-primary) !important;
    font-size: 13px;
    text-decoration: none;
}

.topbar .user-block > a:hover {
    background: var(--hr2-primary-soft);
}

/* Кнопка выхода */
.topbar .user-block button.secondary {
    min-height: 36px;
    padding: 8px 14px;
    border: 1px solid var(--hr2-border);
    border-radius: var(--hr2-radius-sm);
    background: var(--hr2-surface-alt);
    color: var(--hr2-text);
}

/* Рабочая область реестра */
.content.people-page {
    padding: 24px clamp(14px, 2.4vw, 40px) 42px;
}

/* Заголовок */
.people-page .welcome {
    margin-bottom: 18px;
}

.people-page .welcome h1 {
    margin: 0 0 6px;
    font-size: clamp(22px, 2.1vw, 28px);
    line-height: 1.2;
    letter-spacing: -0.02em;
    color: var(--hr2-text);
}

.people-page .welcome p {
    color: var(--hr2-muted);
    font-size: 14px;
}

/* Адаптация */
@media (max-width: 860px) {
    .topbar {
        flex-wrap: wrap;
        align-items: flex-start;
    }

    .topbar .user-block {
        justify-content: flex-start;
    }
}


/* HR2 INTEGRATION V2 — page-specific visual system, no business logic */
body.hr2-ui {
    margin: 0;
    min-width: 320px;
    background: #f5f7fb;
    color: #152338;
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
}
body.hr2-ui, body.hr2-ui input, body.hr2-ui select, body.hr2-ui button {
    font-family: var(--hr2-font);
}
body.hr2-ui :is(a, button, input, select, summary):focus-visible {
    outline: 2px solid var(--hr2-primary);
    outline-offset: 2px;
}
body.hr2-ui .topbar.hr2-topbar {
    display: flex;
    align-items: center;
    min-height: 72px;
    padding: 10px clamp(16px, 2.3vw, 36px);
    gap: clamp(12px, 2vw, 30px);
    background: var(--hr2-surface);
    border-bottom: 1px solid var(--hr2-border);
}
body.hr2-ui .topbar-brand {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    flex: 0 0 auto;
    gap: 11px;
}
body.hr2-ui .hr2-brand-mark {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    background: #182c46;
    border-radius: 11px;
    color: #fff;
    font-size: 21px;
    line-height: 1;
    box-shadow: 0 3px 10px #182c461a;
}
body.hr2-ui .hr2-brand-copy {display: flex; flex-direction: column; gap: 3px;}
body.hr2-ui .hr2-brand-copy strong {color: #172a46; font-size: 17px; font-weight: 800; letter-spacing: -.035em; line-height: 1.15;}
body.hr2-ui .hr2-brand-copy > span {color: #8794a6; font-size: 11px; white-space: nowrap;}
body.hr2-ui .hr2-primary-nav {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    min-width: 0;
    overflow-x: auto;
    gap: 4px;
    padding: 4px 0;
    scrollbar-width: thin;
}
body.hr2-ui .hr2-nav-link {
    display: inline-flex;
    flex: none;
    align-items: center;
    min-height: 36px;
    padding: 9px 13px;
    color: #64748b;
    font-size: 13px;
    font-weight: 650;
    text-decoration: none;
    white-space: nowrap;
    border-radius: 8px;
}
body.hr2-ui .hr2-nav-link:hover {background: #f3f6fb; color: #2055ca;}
body.hr2-ui .hr2-nav-link.is-current {background: #eef3fb; color: #1b4bb2;}
body.hr2-ui .topbar.hr2-topbar .user-block {display:flex; flex: 0 0 auto; gap: 10px; align-items:center; flex-wrap: nowrap; min-width: 0;}
body.hr2-ui .hr2-user-avatar {width: 34px; height: 34px; flex: 0 0 34px; display:grid;place-items:center; background: #e8effa; color: #3c5d90; font-size: 14px; font-weight: 750; border-radius: 50%;}
body.hr2-ui .topbar .user-block .hr2-user-identity {display:flex;flex-direction:column;text-align:left;gap:2px;max-width:190px;}
body.hr2-ui .hr2-user-identity strong {font-size:12px!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
body.hr2-ui .hr2-user-identity span {font-size:11px!important;color:#718198;}
body.hr2-ui .hr2-logout.secondary {border:1px solid #d9e2ed;min-height:36px!important;padding:8px 12px!important;margin:0!important;background:#fff;color:#52647b;border-radius:8px;font-weight:650;cursor:pointer;}
body.hr2-ui .hr2-logout:hover {background:#f4f7fc;}
body.hr2-ui .content.people-page {
    width: 100%;
    max-width: 1720px;
    margin: 0 auto;
    padding: 28px clamp(16px, 2.35vw, 36px) 48px;
    min-width: 0;
}
body.hr2-ui .hr2-breadcrumb {font-size:12px;color:#8793a3;margin-bottom:18px;}
body.hr2-ui .hr2-breadcrumb span {margin:0 5px;color:#a9b5c3;}
body.hr2-ui .hr2-breadcrumb strong {font-weight:650;color:#536781;}
body.hr2-ui .people-page .welcome,
body.hr2-ui .accounting-workspace > .welcome {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    flex-wrap:wrap;
    gap: 16px;
    padding: 0;
    border: 0;
    border-radius: 0;
    margin: 0 0 24px;
    box-shadow: none;
    background: transparent;
}
body.hr2-ui .people-page .welcome h1,
body.hr2-ui .accounting-workspace > .welcome h1 {font-size:clamp(25px,2.1vw,30px);margin:0 0 7px;line-height:1.2;letter-spacing:-.035em;color:#16253b;font-weight:780;}
body.hr2-ui .people-page .welcome p {color:#697b90;font-size:13px;line-height:1.5;margin:0;}
body.hr2-ui .people-workspace-actions {display:flex;gap:9px;align-items:center;flex-wrap:wrap;}
body.hr2-ui .people-workspace-actions button,
body.hr2-ui .people-workspace-actions .manage-objects-action {
    min-height:38px;
    padding:8px 14px;
    margin:0;
    width:auto;
    border-radius:8px;
    font-size:12px;
    font-weight:700;
    white-space:nowrap;
}
body.hr2-ui .people-workspace-actions .add-person-action {background:#2055ca;border-color:#2055ca;color:#fff;}
body.hr2-ui .people-workspace-actions .add-person-action:hover {background:#163d9b;}
body.hr2-ui .people-workspace-actions .manage-objects-action {background:#fff;border-color:#cdd7e4;color:#33445d;}
/* Manager counts, admin task cards, accountant queues: distinct roles, shared geometry. */
body.hr2-ui .manager-docs-tabs {gap:14px; margin:0 0 24px;}
body.hr2-ui .manager-docs-tab {
    display:flex;flex-direction:column;gap:8px;align-items:flex-start;
    background:#fff;color:#172b45;min-height:113px;border-radius:12px;
    border:1px solid #e2e8f1;padding:17px 20px;margin:0;
    box-shadow:0 2px 9px #1b324e09;
    width:100%;
}
body.hr2-ui .manager-docs-tab:hover {border-color:#b7cbe9;background:#fcfdff;}
body.hr2-ui .manager-docs-tab.is-active {border:1px solid #86a9ee;background:#f8fbff;}
body.hr2-ui .manager-docs-tab span {font-size:12px;font-weight:700;color:#697c92;}
body.hr2-ui .manager-docs-tab strong {font-size:28px;font-weight:800;line-height:1;color:#152338;}
body.hr2-ui .manager-docs-tab small {color:#8290a0;font-size:11px;}
body.hr2-ui .hr-task-board {margin:0 0 24px;}
body.hr2-ui .hr-task-board-top {margin-bottom:12px;}
body.hr2-ui .hr-task-board-top h2 {font-size:17px;color:#21324c;}
body.hr2-ui .hr-task-board-top p {font-size:12px;color:#697b90;}
body.hr2-ui .hr-task-back {color:#2055ca;}
body.hr2-ui .hr-task-cards {gap:14px;}
body.hr2-ui .hr-task-card {min-height:110px;padding:17px 20px;border:1px solid #e2e8f1;border-radius:12px;box-shadow:0 2px 9px #1b324e09;}
body.hr2-ui .hr-task-card span {font-size:12px;color:#697c92;}
body.hr2-ui .hr-task-card strong {font-size:29px;color:#152338;line-height:1.1;}
body.hr2-ui .hr-task-card small {font-size:11px;color:#8290a0;}
body.hr2-ui .hr-task-card b {font-size:12px;color:#2055ca;}
body.hr2-ui .hr-task-card.selected {border-color:#86a9ee;background:#f8fbff;}
body.hr2-ui .hr-task-card:hover {border-color:#a9bfe4;}
body.hr2-ui .accounting-workspace .hr-task-board {margin:0 0 24px;}
body.hr2-ui .accounting-queue-tabs {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
body.hr2-ui .accounting-queue-tabs a,
body.hr2-ui .accounting-queue-tabs a.queue-all,
body.hr2-ui .accounting-queue-tabs a.queue-employment,
body.hr2-ui .accounting-queue-tabs a.queue-dismissal {
    display:flex;flex-direction:row;align-items:center;justify-content:space-between;
    gap:10px;min-height:60px;padding:12px 17px;font-size:13px;font-weight:700;
    border:1px solid #dfe6ef;background:#fff;color:#536984;border-radius:10px;
    box-shadow:none;transform:none;
}
body.hr2-ui .accounting-queue-tabs a strong {font-size:18px;color:inherit;}
body.hr2-ui .accounting-queue-tabs a.active {border-color:#88aaf0;background:#eef4ff;color:#2055ca;box-shadow:none;}
body.hr2-ui .accounting-queue-tabs a:hover {border-color:#b5c9ea;background:#f8fbff;}
/* Full register is a single aligned panel like approved prototype. */
body.hr2-ui .hr2-register-section {margin-top:0;border:1px solid #e2e8f1;border-radius:12px;background:#fff;box-shadow:0 2px 9px #1b324e09;overflow:hidden;}
body.hr2-ui .hr2-register-bar {display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:17px 19px;border-bottom:1px solid #e2e8f1;}
body.hr2-ui .hr2-register-title h2 {margin:0 0 5px;font-size:16px;font-weight:750;letter-spacing:-.02em;color:#1e2c43;}
body.hr2-ui .hr2-register-title p {margin:0;font-size:12px;color:#718198;line-height:1.4;}
body.hr2-ui .hr2-register-tools {display:flex;align-items:center;gap:9px;flex-wrap:wrap;}
body.hr2-ui .hr2-register-count {white-space:nowrap;background:#f1f6fb;color:#56708e;font-size:12px;font-weight:700;padding:7px 11px;border-radius:7px;}
body.hr2-ui .hr2-register-count strong {font-variant-numeric:tabular-nums;}
body.hr2-ui .hr2-reset-filters {font-size:12px;font-weight:700;color:#2055ca;text-decoration:none;padding:8px;white-space:nowrap;}
body.hr2-ui .hr2-reset-filters:hover {text-decoration:underline;}
body.hr2-ui #hr-export-xlsx.hr2-export {width:auto;margin:0;padding:9px 13px;min-height:36px;border:1px solid #d5e2db;border-radius:8px;background:#f2fbf5;color:#197049;font-size:12px;font-weight:750;cursor:pointer;}
body.hr2-ui #hr-export-xlsx.hr2-export:hover {background:#e7f7ee;}
body.hr2-ui .hr2-table-panel.card {margin:0!important;padding:0!important;border:0;border-radius:0;box-shadow:none;overflow:hidden;}
body.hr2-ui .hr2-table-scroll {max-width:100%;overflow-x:auto;scrollbar-color:#bdc9da #f5f7fb;}
body.hr2-ui .people-data-table {width:100%;border-collapse:separate!important;border-spacing:0!important;table-layout:fixed!important;color:#435169;}
body.hr2-ui .people-data-table thead th.filter-heading,
body.hr2-ui .people-data-table thead th {
    border-bottom:1px solid #e2e8f1;
    border-right:1px solid #eef2f7;
    background:#f9fbfe!important;
    padding:12px 10px!important;
    text-align:left;
    vertical-align:top!important;
}
body.hr2-ui .people-data-table thead th:last-child {border-right:0;}
body.hr2-ui .people-data-table .column-title {
    display:block;
    font-size:12px!important;font-weight:750!important;line-height:18px!important;
    color:#536984;margin:0 0 8px!important;min-height:18px!important;
}
body.hr2-ui .people-data-table .column-no-filter .column-title {margin-bottom:0!important;}
body.hr2-ui .people-data-table :is(.column-filter, .column-find, #date-range-button) {
    min-height:36px!important;height:36px!important;width:100%!important;
    margin:0!important;border:1px solid #d4dfeb!important;border-radius:7px!important;
    background:#fff!important;font-size:12px!important;color:#34445d!important;
    box-shadow:none;
}
body.hr2-ui .people-data-table .column-filter {padding:0 9px!important;font-weight:500!important;}
body.hr2-ui .people-data-table .column-filter::placeholder {color:#97a6b8;}
body.hr2-ui .people-data-table #date-range-button {padding:0 10px!important;}
body.hr2-ui .people-data-table .column-find {font-weight:700!important;color:#2055ca!important;background:#eef4ff!important;cursor:pointer;}
body.hr2-ui .people-data-table .column-find:hover {background:#e1edff!important;}
body.hr2-ui #created-sort-value + button {background:#eef4ff!important;border-color:#d4dfeb!important;color:#2055ca!important;}
body.hr2-ui .hr2-statement-hint {display:flex;align-items:center;min-height:36px;padding:0 9px;color:#72829a;background:#fff;border:1px solid #d4dfeb;border-radius:7px;font-size:12px;font-weight:500;}
body.hr2-ui .people-data-table tbody tr > td:not([colspan]) {
    padding:12px 10px!important;font-size:13px!important;line-height:1.45!important;
    vertical-align:middle!important;border-bottom:1px solid #ecf0f5;
    color:#435169;
}
body.hr2-ui .people-data-table tbody tr:hover > td:not([colspan]) {background:#fafcff;}
body.hr2-ui .people-data-table tbody td:first-child > strong > a {font-weight:700!important;font-size:13px;color:#20324e;text-decoration:none;}
body.hr2-ui .people-data-table tbody td:first-child > strong > a:hover {color:#2055ca;text-decoration:underline;}
body.hr2-ui .people-data-table .person-inline-meta-row {margin-top:6px;gap:6px;}
body.hr2-ui .people-data-table .person-inline-phone {font-size:11px!important;color:#8391a4;}
body.hr2-ui .people-data-table .person-inline-documents span {font-size:11px!important;font-weight:650;}
body.hr2-ui .people-data-table .person-inline-documents .docs-alert {background:#fff5df!important;color:#956014!important;}
body.hr2-ui .people-data-table .work-status-select {
    height:36px;min-height:36px;border-radius:7px;padding:6px 8px;
    font-size:12px!important;font-weight:700;max-width:100%;
}
body.hr2-ui .people-data-table .work-status-select:disabled {opacity:1;}
body.hr2-ui .hr2-statement-cell {min-width:185px;}
body.hr2-ui .hr2-statement-status {display:inline-flex;align-items:center;gap:6px;white-space:nowrap;padding:6px 8px;margin:2px 0;border-radius:6px;font-size:11px;font-weight:750;line-height:1.4;}
body.hr2-ui .hr2-statement-status::before {content:"";width:6px;height:6px;border-radius:50%;background:currentColor;}
body.hr2-ui .hr2-statement-status.employment {color:#956014;background:#fff5df;}
body.hr2-ui .hr2-statement-status.dismissal {color:#b2434c;background:#fff0f1;}
body.hr2-ui .hr2-statement-status.none {color:#6c7c90;background:#f1f4f8;}
body.hr2-ui .people-data-table .person-actions-cell {min-width:242px!important;}
body.hr2-ui .people-data-table .open-action {background:#2055ca!important;border:1px solid #2055ca!important;color:#fff!important;border-radius:7px;}
body.hr2-ui .people-data-table .archive-action {background:#fff!important;border:1px solid #cfdaec!important;color:#2856b4!important;border-radius:7px;}
body.hr2-ui .people-data-table .open-action:hover {background:#163d9b!important;}
body.hr2-ui .people-data-table .archive-action:hover {background:#eef4ff!important;}
body.hr2-ui .people-data-table .person-action-menu > summary {border-color:#cfdaec;color:#536984;border-radius:7px;}
body.hr2-ui .people-data-table .person-action-menu[open] > summary {border-color:#90afe8;background:#eef4ff;}
body.hr2-ui #hr-live-pagination.hr2-pagination {padding:14px 18px;background:#fff;color:#657993;font-size:12px;}
body.hr2-ui .hr2-pagination nav {margin:0!important;font-size:12px!important;}
body.hr2-ui .hr2-pagination a {font-size:12px;color:#2055ca;font-weight:700;text-decoration:none;}
/* Modal forms keep the original form elements + submission mechanics. */
body.hr2-ui dialog.people-workspace-dialog {border:1px solid #e0e8f1;border-radius:14px;box-shadow:0 26px 100px #14233e38;}
body.hr2-ui .people-dialog-heading {padding:17px 22px;border-bottom:1px solid #e2e8f1;}
body.hr2-ui .people-dialog-heading strong {font-size:17px;color:#172b45;}
body.hr2-ui .people-dialog-body {padding:21px 22px;}
body.hr2-ui .people-dialog-body label {font-size:12px;font-weight:700;color:#52657f;}
body.hr2-ui .people-dialog-body :is(input,select) {min-height:42px;border:1px solid #d4dfeb!important;border-radius:8px!important;background:#fff;}
body.hr2-ui .people-dialog-body button[type=submit]:not(.person-delete-actions button) {background:#2055ca;border-radius:8px;}
body.hr2-ui .people-dialog-close {background:#f1f5fa!important;border-radius:8px;color:#536984!important;}
body.hr2-ui .person-delete-box, body.hr2-ui .object-delete-box {border-radius:14px;}
@media (max-width:960px) {
    body.hr2-ui .topbar.hr2-topbar {flex-wrap:wrap;gap:8px 16px;}
    body.hr2-ui .hr2-primary-nav {order:3;flex:1 0 100%;}
    body.hr2-ui .topbar .user-block {margin-left:auto;}
}
@media (max-width:700px) {
    body.hr2-ui .content.people-page {padding:20px 12px 34px;}
    body.hr2-ui .manager-docs-tabs {grid-template-columns:1fr;gap:9px;}
    body.hr2-ui .manager-docs-tab {min-height:85px;padding:13px 15px;}
    body.hr2-ui .hr-task-cards {grid-template-columns:1fr;}
    body.hr2-ui .accounting-queue-tabs {grid-template-columns:1fr;gap:9px;}
    body.hr2-ui .accounting-queue-tabs a {min-height:48px;}
    body.hr2-ui .topbar .user-block .hr2-user-identity {display:none;}
    body.hr2-ui .hr2-register-bar {padding:15px 13px;}
    body.hr2-ui .hr2-register-tools {width:100%;}
    body.hr2-ui .hr2-register-title {width:100%;}
    body.hr2-ui .people-page .welcome {gap:12px;}
    body.hr2-ui .people-workspace-actions {width:100%;}
}
@media (prefers-reduced-motion:reduce) {
    body.hr2-ui *, body.hr2-ui *::before, body.hr2-ui *::after {transition:none!important;scroll-behavior:auto!important;}
}
