/* styles/pages/employee-hr-card.css — карточка сотрудника без учётной записи (#/hr/employees/:id): только кадровые данные. Только токены темы. */
.ehc { display: grid; gap: var(--space-4); align-content: start; }
.ehc-hero { display: flex; align-items: center; gap: var(--space-4); flex-wrap: wrap; padding: var(--space-4) 0; }
.ehc-hero__main { flex: 1 1 260px; min-width: 0; }
.ehc-name { margin: 0; font-size: var(--text-xl, 22px); font-weight: 700; line-height: 1.25; color: var(--text-primary); overflow-wrap: anywhere; }
.ehc-sub { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.ehc-panel { padding-bottom: var(--space-4); }
.ehc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--space-3) var(--space-5); margin: 0; padding: var(--space-3) var(--space-4) 0; }
.ehc-grid dt { font-size: 12px; color: var(--text-muted); margin-bottom: 2px; }
.ehc-grid dd { margin: 0; font-size: var(--text-base); color: var(--text-primary); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.ehc-empty { color: var(--text-muted); }
.ehc-note { margin: 0; padding: var(--space-3) var(--space-4) var(--space-3); max-width: 68ch; font-size: 13.5px; line-height: 1.5; color: var(--text-secondary); }
.ehc-panel > .btn { margin: 0 var(--space-4); }

@media (max-width: 760px) {
  .ehc-hero .btn { width: 100%; }
  .ehc-grid { grid-template-columns: 1fr 1fr; padding-inline: var(--space-3); }
  .ehc-panel > .btn { margin-inline: var(--space-3); width: calc(100% - 2 * var(--space-3)); }
}