/* Server module: status + information pages */

/* ---------- status ---------- */
.server-status__overall { font-size: 13px; padding: 6px 14px; }
.server-status__grid { display: grid; gap: 14px; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); }
.server-status__players {
  grid-row: span 3; display: flex; flex-direction: column; justify-content: center;
  padding: 28px; background: var(--lk-grad-surface); border-color: var(--lk-line-2); box-shadow: var(--lk-shadow);
}
.server-status__players .lk-stat__value { margin-top: 10px; font-size: clamp(3rem, 2.2rem + 2.6vw, 4.4rem); }
.server-status__cta { align-self: flex-start; margin-top: 20px; }
.server-status__tile {
  display: flex; align-items: center; gap: 16px; min-width: 0;
  padding: 18px 20px; border-radius: var(--lk-radius);
  background: rgba(21, 16, 39, .8); border: 1px solid var(--lk-line);
}
.server-status__tile.is-down { border-color: rgba(251, 113, 133, .4); background: var(--lk-danger-bg); }
.server-status__tile.is-down .lk-icon-tile { background: var(--lk-danger-bg); border-color: rgba(251, 113, 133, .35); color: var(--lk-danger); }
.server-status__body { flex: 1; min-width: 0; }
.server-status__name { margin: 0 0 2px !important; font-size: var(--lk-fs-lg) !important; }
.server-status__desc { margin: 0 !important; color: var(--lk-text-3); font-size: var(--lk-fs-sm); }
.server-status__note { display: flex; gap: 10px; align-items: flex-start; max-width: 72ch; color: var(--lk-text-3); font-size: var(--lk-fs-sm); }
.server-status__note i { margin-top: 4px; color: var(--lk-blue-400); }
@media (max-width: 760px) {
  .server-status__grid { grid-template-columns: minmax(0, 1fr); }
  .server-status__players { grid-row: auto; padding: 22px; }
}
@media (max-width: 420px) {
  .server-status__tile { padding: 16px; gap: 12px; }
  .server-status__tile .lk-icon-tile { width: 40px; height: 40px; font-size: 16px; }
}

/* ---------- information: job class population ---------- */
.server-classes { padding: 20px 24px; }
.server-classes__list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px;
}
.server-classes__row {
  display: grid; grid-template-columns: minmax(110px, 42%) minmax(40px, 1fr) auto; align-items: center; gap: 14px;
  padding: 9px 0; border-bottom: 1px solid var(--lk-line);
}
@media (max-width: 569px) { .server-info-stats > .lk-stat:last-child { grid-column: 1 / -1; } }
.server-classes__name { color: var(--lk-text); font-weight: 600; font-size: 14.5px; overflow-wrap: anywhere; }
.server-classes__count { min-width: 92px; text-align: right; font-variant-numeric: tabular-nums; font-weight: 700; color: #fff; font-size: 14.5px; }
.server-classes__count small { display: inline-block; min-width: 46px; margin-left: 8px; color: var(--lk-text-3); font-weight: 500; font-size: 12.5px; }
.server-classes__bar {
  -webkit-appearance: none; appearance: none; display: block; width: 100%; height: 8px;
  border: 0; border-radius: var(--lk-radius-pill); background: rgba(255, 255, 255, .06); overflow: hidden; color: var(--lk-purple-500);
}
.server-classes__bar::-webkit-progress-bar { background: rgba(255, 255, 255, .06); border-radius: var(--lk-radius-pill); }
.server-classes__bar::-webkit-progress-value { background: var(--lk-grad-brand); border-radius: var(--lk-radius-pill); }
.server-classes__bar::-moz-progress-bar { background: var(--lk-grad-brand); border-radius: var(--lk-radius-pill); }
@media (max-width: 860px) {
  .server-classes__list { grid-template-columns: minmax(0, 1fr); }
  .server-classes__row:last-child { border-bottom: 0; }
}
@media (min-width: 861px) {
  .server-classes__row:nth-last-child(-n+2):nth-child(odd), .server-classes__row:last-child { border-bottom: 0; }
}
@media (max-width: 480px) {
  .server-classes { padding: 14px 16px; }
  .server-classes__row { grid-template-columns: minmax(0, 1fr) auto; row-gap: 5px; padding: 8px 0; }
  .server-classes__bar { height: 6px; }
  .server-classes__bar { grid-column: 1 / -1; grid-row: 2; }
}
