/* ── Global ─────────────────────────────────────────────────── */
* { box-sizing: border-box; }

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  -webkit-font-smoothing: antialiased;
  font-size: 14px;
  color: #1e293b;
}

/* ── Tabular numbers for amounts ────────────────────────────── */
.num { font-variant-numeric: tabular-nums; letter-spacing: 0.01em; }

/* ── Sidebar nav links ──────────────────────────────────────── */
.nav-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  color: rgb(var(--brand-300));
  text-decoration: none;
  transition: background-color 0.15s, color 0.15s;
}
.nav-link:hover { background-color: rgba(255,255,255,0.08); color: #fff; }
.nav-active    { background-color: rgb(var(--brand-800)) !important; color: #fff !important; }

/* ── Stat cards ─────────────────────────────────────────────── */
.stat-card {
  border-radius: 14px;
  padding: 18px 20px;
  border: 1px solid rgb(var(--brand-100));
  transition: box-shadow 0.15s, transform 0.15s;
}
.stat-card:hover {
  box-shadow: 0 4px 20px rgb(var(--brand-800) / 0.08);
  transform: translateY(-1px);
}
.stat-label {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: #6b7280;
  margin-bottom: 10px;
}
.stat-value {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
}
.stat-sub {
  font-size: 11px;
  color: #94a3b8;
  margin-top: 4px;
}

/* ── Tables ─────────────────────────────────────────────────── */
table { border-collapse: collapse; width: 100%; }

.tbl-head th {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  padding: 12px 20px;
}
.tbl-cell td {
  font-size: 13px;
  padding: 11px 20px;
}

/* ── Badges ─────────────────────────────────────────────────── */
.badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.6;
}

/* ── Page section titles ────────────────────────────────────── */
.section-title {
  font-size: 15px;
  font-weight: 600;
  color: rgb(var(--brand-900));
}

/* ── Scrollbar ──────────────────────────────────────────────── */
::-webkit-scrollbar         { width: 5px; height: 5px; }
::-webkit-scrollbar-track   { background: rgb(var(--brand-50)); }
::-webkit-scrollbar-thumb   { background: rgb(var(--brand-300)); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgb(var(--brand-400)); }

/* ── Focus ──────────────────────────────────────────────────── */
:focus-visible { outline: 2px solid rgb(var(--brand-600)); outline-offset: 2px; }

/* ── Print ──────────────────────────────────────────────────── */
@media print {
  aside, header, footer, .no-print { display: none !important; }
  .lg\:ml-64 { margin-left: 0 !important; }
}

/* ── Mobile sidebar ─────────────────────────────────────────── */
#sidebar.open { transform: translateX(0) !important; }

/* ── Flash banner ticker ────────────────────────────────────── */
.ticker-wrap { width: 100%; }
.ticker-inner {
  display: inline-block;
  white-space: nowrap;
  animation: ticker-scroll 35s linear infinite;
}
.ticker-inner:hover { animation-play-state: paused; }
.ticker-text { display: inline-block; }

@keyframes ticker-scroll {
  0%   { transform: translateX(100vw); }
  100% { transform: translateX(-100%); }
}

/* ── Membership tier progress bar ───────────────────────────── */
.tier-track {
  height: 14px;
  background: rgba(0,0,0,0.10);
  border-radius: 999px;
  overflow: visible;
  position: relative;
}
.tier-fill {
  height: 100%;
  border-radius: 999px;
  position: relative;
  overflow: hidden;
  transition: width 1.4s cubic-bezier(0.4,0,0.2,1);
}
.tier-fill::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.45) 50%, transparent 100%);
  background-size: 60% 100%;
  animation: tier-chase 1.8s ease-in-out infinite;
}
@keyframes tier-chase {
  0%   { background-position: -80% center; }
  100% { background-position: 180% center; }
}
.tier-dot {
  width: 18px; height: 18px;
  border-radius: 50%;
  border: 3px solid #fff;
  animation: tier-pulse 1.6s ease-out infinite;
  position: absolute;
  top: 50%; right: -9px;
  transform: translateY(-50%);
  z-index: 2;
}
@keyframes tier-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(255,255,255,0.7); }
  70%  { box-shadow: 0 0 0 8px rgba(255,255,255,0); }
  100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); }
}
.tier-fill-silver { background: linear-gradient(90deg, #94a3b8, #cbd5e1); }
.tier-dot-silver  { background: #94a3b8; }
.tier-fill-gold   { background: linear-gradient(90deg, #d97706, #fbbf24); }
.tier-dot-gold    { background: #f59e0b; }
.tier-fill-diamond{ background: linear-gradient(90deg, #7c3aed, #a78bfa); }
.tier-dot-diamond { background: #8b5cf6; }