/* Transfer Timeline — list of clubs to re-order. Tap-to-swap works
   on mobile without needing drag-drop libraries; each item shows an
   up/down arrow pair. Top = earliest. */

.tt-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tt-item {
  display: grid;
  grid-template-columns: 40px 1fr auto auto;
  gap: 10px;
  align-items: center;
  background: var(--tg-surface);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  padding: 12px 10px;
  font-size: 14px;
  font-weight: 600;
}
.tt-item .idx {
  font-family: "Bebas Neue", sans-serif;
  font-size: 22px;
  color: var(--tg-gold);
  text-align: center;
}
.tt-item .arrow {
  background: var(--tg-surface-2);
  border: none;
  color: var(--tg-text);
  width: 30px; height: 30px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 14px;
}
.tt-item .arrow:disabled { opacity: 0.25; cursor: not-allowed; }

.tt-item.correct { background: rgba(62,207,142,0.15); border-color: var(--tg-good); }
.tt-item.wrong   { background: rgba(255,92,122,0.12); border-color: var(--tg-warn); }
.tt-item .year {
  font-family: "Bebas Neue", sans-serif;
  font-size: 14px;
  color: var(--tg-dim);
  margin-left: 6px;
}