/*
 * Site foundation: checkbox shell, tabs and player list primitives.
 * Extracted from legacy shell core on 2026-04-07.
 */

/* Checkbox/label shell */
.check{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 7px 10px;
  border-radius: var(--control-radius);
  border: 1px solid var(--control-border);
  background: rgba(0,0,0,.14);
  cursor:pointer;
  user-select:none;
}
.check:hover{ border-color: rgba(255,255,255,.16); background: rgba(0,0,0,.16); }
.check input{ margin:0; }
.check.is-disabled{ opacity:.60; cursor:not-allowed; }


/* Tabs */
.modeTabs{ display:flex; gap:10px; margin-bottom: 14px; }
.tab{
  padding: 10px 12px;
  border-radius: var(--control-radius);
  border:1px solid var(--control-border);
  background: var(--control-bg);
  font-weight: 950;
  cursor:pointer;
}
.tab.is-active{ border-color: var(--control-border-active); background: var(--control-bg-active); }

/* Players grid + cards (из оригинала) */
.players-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 16px;
}
@media (max-width: 800px){ .players-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 520px){ .players-grid{ grid-template-columns: 1fr; } }

.player-card{
  position: relative;
  background: rgba(0,0,0,.18);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--r);
  padding: 14px;
  min-height: 110px;
  display:flex;
  align-items:flex-start;
  gap:14px;
  cursor:pointer;
  overflow:hidden;
}
.player-card:hover{
  transform: translateY(-2px);
  border-color: rgba(255,255,255,.18);
  box-shadow: 0 10px 26px rgba(0,0,0,.38);
  background: rgba(0,0,0,.22);
}
.player-card::before{
  content:'';
  position:absolute;
  left:0; top:0; bottom:0;
  width: 6px;
  background: rgba(255,255,255,.10);
}
.player-avatar{
  width:60px; height:60px;
  border-radius: var(--r);
  object-fit: cover;
  border: 1px solid rgba(255,255,255,.15);
  background: rgba(255,255,255,.05);
  flex:0 0 auto;
}
.player-info{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:5px; }
.player-name{ font-weight:900; font-size:15px; line-height:1.15; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
.player-meta{ color: var(--text700); font-size: 12px; font-weight:700; }
.player-value{
  font-weight:900;
  font-size:16px;
  padding:9px 12px;
  border-radius: var(--r);
  background: rgba(0,0,0,.30);
  border: 1px solid rgba(255,255,255,.12);
  flex:0 0 auto;
  white-space: nowrap;
}

/* All players list */
.controls{ display:flex; gap: 12px; align-items:center; flex-wrap:wrap; }
.viewSwitch{ display:flex; gap:8px; padding:4px; border:1px solid rgba(255,255,255,.10); background: rgba(0,0,0,.18); }
.viewBtn{
  padding:8px 10px;
  border:1px solid transparent;
  background: transparent;
  font-weight: 950;
  cursor:pointer;
  border-radius: var(--r);
  color: var(--text700);
}
.viewBtn.is-active{ color: var(--text900); border-color: rgba(255,255,255,.20); background: rgba(0,0,0,.26); }

.tableHead{
  display:grid;
  grid-template-columns: 1fr 110px 110px 110px 110px 110px;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.16);
  margin-bottom: 10px;
}
.tableHead--sticky{ position: sticky; top: var(--sticky-top); z-index: 20; }
.th{ border:none; background: transparent; color: var(--text700); font-weight: 950; cursor:pointer; text-align:center; padding:0; }
.th.is-left{ text-align:left; }
.th:hover{ color: var(--text900); }

.playersList{ display:flex; flex-direction:column; gap: 10px; }
.playersList[data-view="cards"]{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (max-width: 980px){ .playersList[data-view="cards"]{ grid-template-columns: 1fr; } }

.playerRow{
  display:grid;
  grid-template-columns: 1fr 110px 110px 110px 110px 110px;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.16);
}
.playersList[data-view="cards"] .playerRow{ grid-template-columns: 1fr; }
.playerRow:hover{ border-color: rgba(255,255,255,.22); background: rgba(0,0,0,.22); transform: translateY(-1px); }
.playerRow__left{ display:flex; align-items:center; gap: 12px; min-width:0; }
.playerRow__avatar img{
  width: 44px; height:44px; object-fit:cover; border-radius: var(--r);
  border:1px solid rgba(255,255,255,.12);
}
.playerRow__name{ font-weight: 950; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; }
.playerRow__steamid{ color: var(--text700); font-size: 12px; font-weight:700; }
.playerRow__right{ display:grid; grid-template-columns: repeat(5, 110px); gap:10px; align-items:center; justify-content:end; }
.playersList[data-view="cards"] .playerRow__right{ display:flex; flex-wrap:wrap; }
.num{ text-align:center; font-weight: 950; }
.badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 7px 10px;
  border: 1px solid var(--control-border);
  background: var(--control-bg);
  border-radius: 999px;
  font-weight: 950;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}
.badge--soft{ background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.08); }
.badge--ok{ border-color: rgba(63,185,80,.55); background: rgba(63,185,80,.10); }
.badge--warn{ border-color: rgba(255,211,107,.55); background: rgba(255,211,107,.08); }
.badge--danger{ border-color: rgba(248,81,73,.55); background: rgba(248,81,73,.10); }