/* ============================================================
   PLAYERS — màn "Thuê Player", bản NEBULA 2.0 (gate theo data-theme).
   Neon & theme khác giữ NGUYÊN .players-legacy (style ở components.css).
   Tái dùng .glcard / .glcover / .glp__* / .glcats / .gltoolbar / .glwrap (home.css).
   ============================================================ */

/* ---- Gate: chỉ hiện bản Nebula khi data-theme="nebula" ---- */
.players-neb { display: none; }
:root[data-theme="nebula"] .players-neb    { display: block; }
:root[data-theme="nebula"] .players-legacy { display: none; }

/* wrap tier APP (thoáng hơn chút ở đáy, đúng mẫu) */
.glwrap--app { padding-bottom: 90px; }

/* ---- Header màn: kicker (.gl-kick dùng chung) + tiêu đề ---- */
.plhead__title { font-size: clamp(24px, 3vw, 28px); font-weight: 800; letter-spacing: -.02em; margin: 0 0 22px; color: var(--ink); }

/* ---- Tab game: chip glass (.glcats .cat); active = pill tím-nhạt chữ tối (đúng mẫu) ---- */
.glcats .cat.is-active {
  background: var(--violet-tint); border-color: transparent;
  color: var(--bg); font-weight: 600;
}
.glcats .cat.is-active:hover { color: var(--bg); border-color: transparent; }

/* ---- Nút lọc "Đang online": khi bật → cyan (Xèng/online) ---- */
:root[data-theme="nebula"] .gltoolbar .pl-online.is-active {
  background: rgba(var(--cyan-rgb), .12); border-color: rgba(var(--cyan-rgb), .3); color: var(--cyan);
}

/* ---- Lưới player: auto-fit như mẫu (min 205px) ---- */
.plgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(205px, 1fr)); gap: 18px; }

/* ---- Badge Offline (góc dưới phải cover) — song hành .glbadge--online ---- */
.glbadge--offline { bottom: 12px; right: 12px; color: var(--ink-soft); background: rgba(0, 0, 0, .42); backdrop-filter: blur(4px); }

/* ---- Nhãn kết quả + nút "Xem thêm" ---- */
.pl-nb-result { color: var(--n-label, var(--muted)); font-size: 14px; font-weight: 600; margin: 0 2px 16px; }
.pl-nb-result b { color: var(--ink); }

.pl-more { display: flex; justify-content: center; margin-top: 32px; }
.pl-more__btn {
  border: 1px solid rgba(var(--hl-rgb), .14); background: rgba(var(--hl-rgb), .05);
  color: var(--ink); font-family: inherit; font-weight: 600; font-size: 14.5px;
  padding: 13px 30px; border-radius: 12px; cursor: pointer; transition: background var(--ease);
}
.pl-more__btn:hover { background: rgba(var(--hl-rgb), .1); }

/* ---- Trạng thái rỗng (Nebula) ---- */
.pl-empty {
  grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: 66px 24px; border: 1.5px dashed rgba(var(--hl-rgb), .13); border-radius: 20px; background: rgba(var(--hl-rgb), .02);
}
.pl-empty__ic {
  width: 74px; height: 74px; border-radius: 20px; display: grid; place-items: center; font-size: 34px; margin-bottom: 18px;
  background: rgba(var(--violet-rgb), .14); border: 1px solid rgba(var(--violet-rgb), .32); color: var(--violet-tint);
}
.pl-empty__t { font-size: 18px; font-weight: 800; margin-bottom: 7px; color: var(--ink); }
.pl-empty__d { font-size: 14px; color: var(--muted); max-width: 400px; line-height: 1.6; }

/* dòng "game · 🔥 lượt thuê" (.glp__game dùng chung) — tách nhẹ khỏi tên */
.plgrid .glp__game { margin-top: 3px; }

/* ---- Skeleton loading (shimmer) ---- */
@keyframes glShimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.glsk { background: linear-gradient(90deg, rgba(var(--hl-rgb), .05) 25%, rgba(var(--hl-rgb), .12) 37%, rgba(var(--hl-rgb), .05) 63%); background-size: 400% 100%; animation: glShimmer 1.4s ease infinite; border-radius: 8px; }
.glsk-card { pointer-events: none; }
.glsk-line { height: 13px; }