/* ============================================================
   Страница игрока.

   Подключается только ею. Общего с матчем у неё нет, поэтому
   game.css здесь не нужен.
   ============================================================ */

/* --- карточка ------------------------------------------------
   Фото слева, крупное имя справа, под ним личные сведения строкой
   и регалии. Так устроены карточки игроков на больших спортивных
   сайтах: одна широкая полоса, а не таблица. */

.player-card {
  display: flex;
  gap: 18px;
  margin-bottom: 18px;
  padding: 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: var(--shadow-card);
}

/* Фото прямоугольное: это портрет, а не значок команды. Нет
   фото — силуэт, пустая рамка читалась бы как незагрузившаяся
   картинка. */
.player-card__photo {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 120px;
  height: 150px;
  overflow: hidden;
  color: var(--text-mute);
  background: var(--surface-sunk);
  border-radius: 6px;
}

.player-card__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }

.player-card__body { min-width: 0; }

.player-card__name {
  margin: 0 0 10px;
  font-size: var(--fs-xl);
  font-weight: 700;
  line-height: 1.1;
}

.player-card__facts { margin: 0 0 12px; font-size: var(--fs-sm); }

.player-card__fact { display: flex; gap: 6px; padding: 1px 0; }
.player-card__fact dt { color: var(--text-mute); }
.player-card__fact dd { margin: 0; font-weight: 600; }

/* --- регалии -------------------------------------------------
   Строкой значков рядом с именем. Одинаковые свёрнуты в счётчик:
   три бронзы это один значок с цифрой, а не три подряд. */

.player-card__regalia { display: flex; flex-wrap: wrap; gap: 10px; }

.player-award { position: relative; display: inline-flex; }

/* Достоинство задаётся цветом элемента, а форма — значком:
   медаль и кубок различаются рисунком, золото и серебро цветом.
   Оттенки свои, в теме их не было. */
.player-award--gold   { color: hsl(45 85% 47%); }
.player-award--silver { color: hsl(210 10% 62%); }
.player-award--bronze { color: hsl(25 62% 47%); }
.player-award--personal { color: var(--data-mark); }

.player-award__count {
  position: absolute;
  right: -4px;
  bottom: -2px;
  min-width: 15px;
  padding: 0 3px;
  font-size: var(--fs-xs);
  font-weight: 700;
  line-height: 15px;
  text-align: center;
  color: var(--on-accent);
  background: var(--text-soft);
  border-radius: 8px;
}

/* --- карьера ------------------------------------------------- */

.player-career,
.player-stat-block {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: var(--shadow-card);
  overflow: hidden;
}

.player-career__title,
.player-totals__head {
  margin: 0;
  padding: 10px 12px;
  font-size: var(--fs-sm);
  font-weight: 700;
  text-transform: uppercase;
  border-bottom: 1px solid var(--line);
}

.player-career__table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }

.player-career__table th {
  padding: 6px 8px;
  font-size: var(--fs-xs);
  font-weight: 600;
  text-align: left;
  color: var(--text-mute);
  border-bottom: 1px solid var(--line);
}

.player-career__table td { padding: 6px 8px; }

.player-career__row { cursor: pointer; }
.player-career__row:nth-child(even) { background: var(--surface-alt); }
.player-career__row:hover { background: var(--accent-soft); }
.player-career__row--current { background: var(--accent-soft); box-shadow: inset 3px 0 0 var(--accent); }

.player-career__season { white-space: nowrap; color: var(--text-mute); }
.player-career__award { display: block; font-size: var(--fs-xs); color: var(--data-mark); }

.player-career__team { white-space: nowrap; }
.player-career__team img { width: 20px; height: 20px; object-fit: contain; vertical-align: middle; margin-right: 5px; }

.player-career__place { white-space: nowrap; text-align: center; }
.player-career__place .player-award { vertical-align: middle; margin-right: 4px; }

/* --- показатели ---------------------------------------------- */

.player-totals__match { font-weight: 600; }
.player-totals__match + .player-totals__match { font-weight: 400; color: var(--text-mute); text-transform: none; }

.player-totals__numbers {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  padding: 12px;
  border-bottom: 1px solid var(--line);
}

.player-totals__number { text-align: center; }

.player-totals__value {
  display: block;
  font-size: var(--fs-lg);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.player-totals__value--negative { color: var(--loss); }

.player-totals__label { font-size: var(--fs-xs); color: var(--text-mute); }

/* Позитив и негатив разведены и по цвету, и по отступу: без
   разделения два списка читались как один длинный.

   Цвета смысловые, а не темы федерации: красный здесь значит
   «в минус» независимо от того, какого цвета логотип. */
.player-totals__section + .player-totals__section { margin-top: 10px; }

.player-totals__section-title {
  padding: 7px 12px;
  font-size: var(--fs-xs);
  font-weight: 700;
  text-transform: uppercase;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.player-totals__section--positive .player-totals__section-title {
  color: var(--data-mark);
  background: var(--data-soft);
}

.player-totals__section--negative .player-totals__section-title {
  color: var(--loss);
  background: var(--loss-soft);
}

.player-totals__list { margin: 0; font-size: var(--fs-sm); }

.player-totals__row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 4px 12px;
}

.player-totals__row dd { margin: 0; font-variant-numeric: tabular-nums; }

/* Показатель, помеченный источником как главный. */
.player-totals__row--main { font-weight: 700; }

.player-totals__section--negative .player-totals__row dd { color: var(--loss); }

@media (max-width: 575.98px) {
  .player-card { gap: 12px; padding: 12px; }
  .player-card__photo { width: 84px; height: 106px; }
  .player-card__name { font-size: var(--fs-lg); }
  .player-career__table { font-size: var(--fs-xs); }
}