.movement-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 18px 0;
}

.movement-metrics article {
  display: grid;
  gap: 6px;
  min-height: 92px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}

.movement-metrics small { color: var(--muted); font-size: 11px; }
.movement-metrics strong { font-size: 25px; line-height: 1; }
.movement-metric-overdue strong { color: #d92d20; }

.movement-filters {
  display: grid;
  grid-template-columns: minmax(160px, .9fr) minmax(240px, 1.7fr) minmax(145px, .8fr) minmax(145px, .75fr) minmax(145px, .75fr) auto;
  gap: 12px;
  align-items: end;
  margin-bottom: 16px;
}

.movement-filters label { display: grid; gap: 6px; margin: 0; font-size: 10px; font-weight: 600; }
.movement-filters input,
.movement-filters select { min-width: 0; }
.movement-filter-clear { min-height: 38px; padding: 7px 12px; font-size: 10px; }

.movement-table td { vertical-align: middle; }
.movement-table td strong,
.movement-table td small { display: block; }
.movement-table td small { margin-top: 4px; color: var(--muted); }
.movement-table .movement-file { max-width: 270px; overflow-wrap: anywhere; }
.movement-table .movement-reason { max-width: 250px; }
.movement-table .movement-open { min-height: 32px; padding: 6px 11px; font-size: 10px; white-space: nowrap; }
.movement-table tr.is-overdue td { background: #fff8f7; }

.movement-badge {
  display: inline-flex;
  align-items: center;
  min-height: 25px;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 700;
  white-space: nowrap;
}

.movement-badge.open { background: #fff4e5; color: #9a5700; }
.movement-badge.overdue { background: #fee4e2; color: #b42318; }
.movement-badge.returned { background: #e9f8ef; color: #067647; }
.movement-badge.cancelled { background: #f2f4f7; color: #475467; }
.movement-versions { white-space: nowrap; }

@media (max-width: 1180px) {
  .movement-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .movement-filter-clear { width: max-content; }
}

@media (max-width: 760px) {
  .movement-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .movement-filters { grid-template-columns: 1fr; }
  .movement-filter-clear { width: 100%; }
}