/* ─────────────────────────────────────────────────────────────────────────
   Terms & Policies — self-contained docs layout (sticky nav + content panel).
   Solid icefire (NO gradients). Scoped under .page-terms. Replaces the shared
   server-info.css .terms-* rules that were overlapping nav and content.
   ───────────────────────────────────────────────────────────────────────── */
.page-terms .tm-layout {
  display: grid; grid-template-columns: 256px 1fr; gap: 20px; align-items: start;
}

/* ── Side nav ───────────────────────────────────────────────────────────── */
.page-terms .tm-nav-card {
  position: sticky; top: 16px;
  display: flex; flex-direction: column;
  padding: 18px; border-radius: 16px;
  background: rgba(10, 14, 26, 0.82); border: 1px solid rgba(255, 255, 255, 0.08);
}
.page-terms .tm-nav-card > h2 {
  display: flex; align-items: center; gap: 9px; margin: 0 0 12px;
  font-family: var(--font-cinzel, "Cinzel", serif); font-size: 0.68rem; font-weight: 800;
  letter-spacing: 0.18em; text-transform: uppercase; color: rgba(176, 190, 197, 0.7);
}
.page-terms .tm-nav-card > h2 i { color: #52a7ff; font-size: 1rem; }
.page-terms #terms-nav { display: flex; flex-direction: column; gap: 6px; }
.page-terms #terms-nav .btn {
  width: 100%; box-sizing: border-box; cursor: pointer;
  display: flex; align-items: center; gap: 10px; text-align: left;
  padding: 12px 14px; border-radius: 10px;
  font-family: var(--font-cinzel, "Cinzel", serif); font-size: 0.8rem; font-weight: 700; line-height: 1.25;
  color: rgba(207, 216, 220, 0.82);
  background: rgba(4, 8, 16, 0.4); border: 1px solid rgba(255, 255, 255, 0.08);
  transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}
.page-terms #terms-nav .btn i { color: #52a7ff; font-size: 1.05rem; flex: none; }
.page-terms #terms-nav .btn:hover { border-color: rgba(82, 167, 255, 0.4); color: #eceff1; background: rgba(82, 167, 255, 0.06); }
.page-terms #terms-nav .btn.btn-gold {
  color: #1a1206; background: #e9b949; border-color: #f6d98a;
}
.page-terms #terms-nav .btn.btn-gold i { color: #1a1206; }

/* ── Content panel ──────────────────────────────────────────────────────── */
.page-terms .tm-content-card {
  padding: 28px 30px; border-radius: 16px; min-height: 420px;
  background: rgba(13, 18, 32, 0.86); border: 1px solid rgba(255, 255, 255, 0.08); border-left: 4px solid #52a7ff;
}
.page-terms #terms-section-title {
  margin: 0 0 10px; font-family: var(--font-cinzel, "Cinzel", serif); font-size: 0.7rem; font-weight: 800;
  letter-spacing: 0.18em; text-transform: uppercase; color: #e9b949;
}
.page-terms #terms-section-content h1 {
  margin: 0 0 14px; font-family: var(--font-cinzel, "Cinzel", serif); font-size: 1.6rem; font-weight: 900; color: #eceff1; line-height: 1.15;
}
.page-terms #terms-section-content h2 {
  margin: 24px 0 12px; font-family: var(--font-cinzel, "Cinzel", serif); font-size: 1.12rem; font-weight: 800; color: #8fcaff;
}
.page-terms #terms-section-content p {
  margin: 0 0 13px; font-size: 0.92rem; line-height: 1.7; color: rgba(207, 216, 220, 0.88);
}
.page-terms #terms-section-content ul {
  list-style: none; padding: 0; margin: 0 0 14px; display: flex; flex-direction: column; gap: 9px;
}
.page-terms #terms-section-content li {
  padding: 13px 15px; border-radius: 11px;
  background: rgba(10, 14, 26, 0.6); border: 1px solid rgba(255, 255, 255, 0.06); border-left: 3px solid rgba(82, 167, 255, 0.55);
  font-size: 0.88rem; line-height: 1.6; color: rgba(207, 216, 220, 0.85);
}
.page-terms #terms-section-content li strong {
  display: block; margin-bottom: 3px;
  font-family: var(--font-cinzel, "Cinzel", serif); font-weight: 800; font-size: 0.92rem; color: #eceff1;
}

/* Punishment table */
.page-terms .tos-table-wrapper {
  overflow-x: auto; margin: 8px 0; border-radius: 12px; border: 1px solid rgba(255, 255, 255, 0.08);
}
.page-terms #terms-section-content table {
  width: 100%; border-collapse: collapse; min-width: 420px; background: rgba(10, 14, 26, 0.6);
}
.page-terms #terms-section-content th, .page-terms #terms-section-content td {
  padding: 11px 14px; text-align: left; border-bottom: 1px solid rgba(255, 255, 255, 0.06); font-size: 0.86rem; color: #dbe7f5;
}
.page-terms #terms-section-content thead th {
  font-family: var(--font-cinzel, "Cinzel", serif); text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.72rem;
  color: rgba(82, 167, 255, 0.9); font-weight: 800; background: rgba(4, 8, 16, 0.5);
}
.page-terms #terms-section-content tbody tr:last-child td { border-bottom: none; }

/* Footer notes */
.page-terms .tos-footer-note {
  margin-top: 18px; padding: 14px 16px; border-radius: 11px;
  background: rgba(10, 14, 26, 0.6); border: 1px solid rgba(82, 167, 255, 0.28); border-left: 3px solid #52a7ff;
  font-size: 0.85rem; line-height: 1.6; color: rgba(207, 216, 220, 0.85);
}
.page-terms .tos-footer-note strong { color: #8fcaff; }
.page-terms .tos-footer-note.warning {
  border-color: rgba(233, 185, 73, 0.4); border-left-color: #e9b949; color: #f2e2b6;
}
.page-terms .tos-footer-note.warning strong { color: #e9b949; }

@media (max-width: 760px) {
  .page-terms .tm-layout { grid-template-columns: 1fr; gap: 14px; }
  .page-terms .tm-nav-card { position: static; }
  .page-terms .tm-content-card { padding: 22px 20px; }
  .page-terms #terms-section-content h1 { font-size: 1.34rem; }
}
