/* =========================================================
   Brennholz Server Status (HLL) - Core
   Theme bridge, Reset, Cards, Utilities, Shared helpers
   ========================================================= */

/* ---------- Theme bridge (scoped) ---------- */
.hll-dashboard-full,
.hll-player-profile,
.hll-detail-view,
.hll-mini-card {
  /* Falls main.css die Variablen hat: nutzen. Falls nicht: fallback. */
  --hll-bg: var(--bg, #0b1220);
  --hll-surface: var(--surface, rgba(17,26,45,.72));
  --hll-surface-hover: var(--surface-hover, rgba(255,255,255,.06));
  --hll-text: var(--text, rgba(255,255,255,.92));
  --hll-muted: var(--text-muted, rgba(255,255,255,.65));
  --hll-line: var(--line, rgba(255,255,255,.08));
  --hll-line-strong: var(--line-light, rgba(255,255,255,.15));
  --hll-gold: var(--gold, #f5d671);
  --hll-blue: var(--accent-blue, #38bdf8);

  --hll-radius: var(--radius, 16px);
  --hll-shadow: var(--shadow-lg, 0 18px 50px rgba(0,0,0,.30));
  --hll-shadow-sm: var(--shadow-md, 0 12px 35px rgba(0,0,0,.24));
}

/* ---------- Base / Reset ---------- */
.hll-dashboard-full,
.hll-player-profile,
.hll-detail-view {
  box-sizing: border-box;
}

.hll-dashboard-full *,
.hll-player-profile *,
.hll-detail-view * {
  box-sizing: border-box;
}

.hll-dashboard-full {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 14px;
  font-family: inherit; /* übernimmt Inter etc. aus main.css */
  color: var(--hll-text);
}

/* ---------- Wide mode (mehr Platz, aber NICHT fullscreen) ---------- */
.hll-dashboard-full.hll-wide {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  padding: 14px;
}

/* kleine Screens: normal */
@media (max-width: 520px) {
  .hll-dashboard-full,
  .hll-dashboard-full.hll-wide {
    padding: 12px;
  }
}

.hll-msg {
  padding: 14px 16px;
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.86);
}

.hll-empty {
  padding: 18px;
  text-align: center;
  opacity: .85;
}

/* ---------- Cards ---------- */
.hll-card {
  background: var(--hll-surface);
  border: 1px solid var(--hll-line);
  border-radius: var(--hll-radius);
  overflow: hidden;
  box-shadow: var(--hll-shadow);
}

.hll-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  background: rgba(255,255,255,.05);
  border-bottom: 1px solid rgba(255,255,255,.07);
  font-weight: 900;
  letter-spacing: .3px;
}

.hll-card-body {
  padding: 14px 16px;
}

.hll-body {
  padding: 14px 16px;
}

/* SCOPED: generic class "badge" */
:where(.hll-dashboard-full,.hll-player-profile,.hll-detail-view) .badge {
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.18);
  font-weight: 900;
  font-size: 12px;
  color: rgba(255,255,255,.92);
}

/* SCOPED: generic class "pulse" */
:where(.hll-dashboard-full,.hll-player-profile,.hll-detail-view) .pulse {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #19d37a;
  box-shadow: 0 0 0 0 rgba(25,211,122,.55);
  animation: hllPulse 1.5s infinite;
}

@keyframes hllPulse {
  0%   { box-shadow: 0 0 0 0 rgba(25,211,122,.55); }
  70%  { box-shadow: 0 0 0 12px rgba(25,211,122,0); }
  100% { box-shadow: 0 0 0 0 rgba(25,211,122,0); }
}

/* Tiny "updated" flash */
@keyframes hllFlash {
  from { filter: brightness(1.12); }
  to { filter: brightness(1); }
}
.hll-animate-flash {
  animation: hllFlash .35s ease-out;
}

/* ---------- Mini level badge ---------- */
.hll-lvl-mini {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 18px;
  padding: 0 7px;
  border-radius: 999px;
  border: 1px solid rgba(255,224,138,.28);
  background: rgba(255,224,138,.10);
  color: rgba(255,245,215,.95);
  font-size: 11px;
  font-weight: 1050;
  line-height: 1;
}

/* SCOPED: generic colors */
:where(.hll-dashboard-full,.hll-player-profile,.hll-detail-view) .text-red {
  color: rgba(255,107,107,.95);
}
:where(.hll-dashboard-full,.hll-player-profile,.hll-detail-view) .text-gold {
  color: rgba(255,224,138,.95);
}

/* Role cell with slot + badge */
/* SCOPED: generic class "role" */
:where(.hll-dashboard-full,.hll-player-profile,.hll-detail-view) .role {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 86px;
}

/* Name cell */
/* SCOPED: generic class "name" */
:where(.hll-dashboard-full,.hll-player-profile,.hll-detail-view) .name {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: rgba(255,255,255,.92);
  font-weight: 900;
  min-width: 0;
}

:where(.hll-dashboard-full,.hll-player-profile,.hll-detail-view) .name:hover {
  text-decoration: underline;
}

:where(.hll-dashboard-full,.hll-player-profile,.hll-detail-view) .name .hll-lvl-mini {
  flex: 0 0 auto;
}

/* Stats */
/* SCOPED: generic class "stat" */
:where(.hll-dashboard-full,.hll-player-profile,.hll-detail-view) .stat {
  text-align: center;
  font-weight: 950;
  font-size: 13px;
  color: rgba(255,255,255,.92);
  font-variant-numeric: tabular-nums;
}

/* SCOPED: generic class "muted" */
:where(.hll-dashboard-full,.hll-player-profile,.hll-detail-view) .muted {
  color: rgba(255,255,255,.55);
  font-weight: 850;
}

/* Name-Text ellipsis, Level-Badge zählt NICHT zur Breite */
.hll-squad-grid a.name,
.hll-grid-row .col-name a{
  position: relative;
  display: block;
  min-width: 0;
}

.hll-squad-grid a.name .hll-name-text,
.hll-grid-row .col-name a .hll-name-text{
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Nur wenn Level existiert, Platz reservieren */
.hll-squad-grid a.name.has-lvl .hll-name-text,
.hll-grid-row .col-name a.has-lvl .hll-name-text{
  padding-left: 34px;
}

/* Badge aus dem Text-Flow nehmen */
.hll-squad-grid a.name .hll-lvl-mini,
.hll-grid-row .col-name a .hll-lvl-mini{
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}