.employee-training-panel { padding: 12px 16px 20px; }
.employee-training-toolbar, .employee-training-record-head, .employee-training-current-file { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.employee-training-toolbar { margin-bottom: 8px; }
.employee-training-record { padding: 12px 0; border-bottom: 1px solid var(--color-divider); overflow-wrap: anywhere; }
.employee-training-record-head > strong { flex: 1; min-width: 160px; }
.employee-training-details { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 16px; margin: 8px 0; }
.employee-training-details dt { color: var(--color-text-secondary); font-size: var(--type-secondary-size); }
.employee-training-details dd { margin: 2px 0 0; }
.employee-training-date-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 16px; }
.employee-training-full-width { width: 100%; }
.employee-training-attachment { max-width: 100%; height: auto; padding-inline: 0; white-space: normal; text-align: start; }
.employee-training-attachment > span { overflow-wrap: anywhere; min-width: 0; }
.employee-training-current-file { margin-bottom: 8px; overflow-wrap: anywhere; }
.employee-training-current-file > span { min-width: 0; flex: 1; }
@media (max-width: 480px) {
  .employee-training-panel { padding: 10px; }
  .employee-training-date-fields, .employee-training-details { grid-template-columns: minmax(0, 1fr); }
}