/* First-batch refresh: training task management. */

.training-layout {
  gap: 20px;
}

.training-page-heading {
  min-height: 108px;
}

.summary-band {
  border: 1px solid var(--fd-color-line);
  border-radius: var(--fd-radius-md);
  box-shadow: none;
}

.summary-band > div {
  min-height: 112px;
  padding: 20px 22px;
}

.summary-band span,
.summary-band small {
  color: var(--fd-color-muted);
}

.summary-band strong {
  color: var(--fd-color-ink);
}

.training-section {
  border: 1px solid var(--fd-color-line);
  border-radius: var(--fd-radius-md);
  box-shadow: none;
}

.section-head {
  min-height: 74px;
  padding: 16px 20px;
}

.section-head > p {
  color: var(--fd-color-muted);
}

.task-form {
  padding: 24px 22px 20px;
  gap: 18px;
}

.task-form input,
.task-form select {
  min-height: var(--fd-control-height-lg);
}

.assignee-fieldset {
  padding: 16px;
  border-color: var(--fd-color-line);
  background: var(--fd-color-surface-soft);
}

.assignee-option {
  min-height: 44px;
  border-color: var(--fd-color-line);
}

.task-list {
  padding: 0 22px;
}

.task-item {
  margin: 0;
  border: 0;
  border-bottom: 1px solid var(--fd-color-line);
  border-radius: 0;
  box-shadow: none;
}

.task-item:last-child { border-bottom: 0; }

.task-item-head { padding: 20px 0 14px; }
.task-progress { padding: 0 0 18px; }
.task-item-actions { padding-right: 0; }

.task-progress-track { height: 6px; }

.task-operation-toast {
  position: fixed;
  z-index: 100;
  top: 50%;
  left: 50%;
  max-width: min(440px, calc(100vw - 32px));
  padding: 12px 16px;
  color: #1f2937;
  border: 1px solid var(--fd-color-line);
  border-radius: var(--fd-radius-sm);
  background: #fff;
  box-shadow: 0 12px 28px rgba(15, 23, 42, .16);
  font-size: var(--fd-font-size-body);
  line-height: var(--fd-line-height-body);
  transform: translate(-50%, -50%);
}

.task-operation-toast.is-success { color: #146c5b; border-color: #9ed8cb; background: #f1faf8; }
.task-operation-toast.is-error { color: #b42318; border-color: #f1b7b1; background: #fff6f5; }

.attempt-detail-dialog {
  border-color: var(--fd-color-line);
  border-radius: var(--fd-radius-lg);
}

@media (max-width: 720px) {
  .training-layout { padding-inline: 16px; }
  .training-page-heading { min-height: 0; }
  .summary-band > div { min-height: 88px; padding: 16px; }
  .section-head,
  .task-form { padding-inline: 16px; }
  .task-list { padding-inline: 16px; }
}