:root {
  --dash-border: rgba(0, 0, 0, 0.06);
  --dash-muted: #67748e;
  --dash-title: #2f2f36;
  --dash-surface: #ffffff;
  --dash-bg: #f6f7fb;
}

/* Opt-in only (do not affect other admin pages) */
body.dashboard-page.bg-gray-100,
body.admin-pro.bg-gray-100 {
  background: var(--dash-bg) !important;
}

body.dashboard-page .dash-hero,
body.admin-pro .dash-hero {
  border: 1px solid var(--dash-border);
  border-radius: 14px;
  background: var(--dash-surface);
}

body.dashboard-page .dash-hero h4,
body.dashboard-page .dash-hero h5,
body.admin-pro .dash-hero h4,
body.admin-pro .dash-hero h5 {
  color: var(--dash-title);
  margin: 0;
}

body.dashboard-page .dash-subtitle,
body.admin-pro .dash-subtitle {
  color: var(--dash-muted);
  font-size: .9rem;
}

body.dashboard-page .dash-kpi,
body.admin-pro .dash-kpi {
  border: 1px solid var(--dash-border);
  border-radius: 14px;
  background: var(--dash-surface);
  overflow: hidden;
  position: relative;
}

body.dashboard-page .dash-kpi::before,
body.admin-pro .dash-kpi::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: rgba(58, 65, 111, 0.35);
}

body.dashboard-page .dash-kpi[data-accent="primary"]::before,
body.admin-pro .dash-kpi[data-accent="primary"]::before { background: rgba(203, 12, 159, 0.55); }
body.dashboard-page .dash-kpi[data-accent="info"]::before,
body.admin-pro .dash-kpi[data-accent="info"]::before { background: rgba(23, 193, 232, 0.55); }
body.dashboard-page .dash-kpi[data-accent="success"]::before,
body.admin-pro .dash-kpi[data-accent="success"]::before { background: rgba(130, 214, 22, 0.60); }
body.dashboard-page .dash-kpi[data-accent="warning"]::before,
body.admin-pro .dash-kpi[data-accent="warning"]::before { background: rgba(251, 207, 51, 0.65); }
body.dashboard-page .dash-kpi[data-accent="danger"]::before,
body.admin-pro .dash-kpi[data-accent="danger"]::before { background: rgba(234, 6, 6, 0.45); }
body.dashboard-page .dash-kpi[data-accent="dark"]::before,
body.admin-pro .dash-kpi[data-accent="dark"]::before { background: rgba(58, 65, 111, 0.55); }

body.dashboard-page .dash-kpi .label,
body.admin-pro .dash-kpi .label {
  color: var(--dash-muted);
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
}

body.dashboard-page .dash-kpi .value,
body.admin-pro .dash-kpi .value {
  font-size: 1.45rem;
  font-weight: 800;
  color: var(--dash-title);
  line-height: 1.1;
}

body.dashboard-page .dash-kpi .meta,
body.admin-pro .dash-kpi .meta {
  color: var(--dash-muted);
  font-size: .8rem;
}

body.dashboard-page .dash-panel,
body.admin-pro .dash-panel {
  border: 1px solid var(--dash-border);
  border-radius: 14px;
  background: var(--dash-surface);
}

body.dashboard-page .dash-panel .panel-title,
body.admin-pro .dash-panel .panel-title {
  font-weight: 800;
  color: var(--dash-title);
}

/* Charts */
body.dashboard-page .dash-chart {
  height: 280px;
}

/* Tables */
body.dashboard-page .dash-table thead th,
body.admin-pro .dash-table thead th {
  background: #f6f7fb;
}

body.dashboard-page .dash-table td,
body.dashboard-page .dash-table th,
body.admin-pro .dash-table td,
body.admin-pro .dash-table th {
  white-space: nowrap;
}

/* Top lists */
body.dashboard-page .dash-toplist,
body.admin-pro .dash-toplist {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

body.dashboard-page .dash-toprow,
body.admin-pro .dash-toprow {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--dash-border);
  border-radius: 12px;
  background: #fff;
}

body.dashboard-page .dash-toprow:hover,
body.admin-pro .dash-toprow:hover {
  background: #fafbff;
}

body.dashboard-page .dash-rank,
body.admin-pro .dash-rank {
  width: 30px;
  min-width: 30px;
  text-align: center;
  color: var(--dash-muted);
  font-weight: 900;
  font-size: .9rem;
}

body.dashboard-page .dash-avatar,
body.admin-pro .dash-avatar {
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 12px;
  object-fit: cover;
  background: #f1f3f8;
  border: 1px solid var(--dash-border);
}

body.dashboard-page .dash-topmeta,
body.admin-pro .dash-topmeta {
  min-width: 0;
}

body.dashboard-page .dash-track,
body.admin-pro .dash-track {
  font-weight: 900;
  font-size: .95rem;
  color: var(--dash-title);
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.dashboard-page .dash-artist,
body.admin-pro .dash-artist {
  color: var(--dash-muted);
  font-size: .82rem;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.dashboard-page .dash-username,
body.admin-pro .dash-username {
  color: var(--dash-muted);
  font-weight: 800;
}

body.dashboard-page .dash-topright,
body.admin-pro .dash-topright {
  margin-left: auto;
  text-align: right;
}

body.dashboard-page .dash-badge,
body.admin-pro .dash-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #f6f7fb;
  border: 1px solid var(--dash-border);
  color: var(--dash-title);
  font-weight: 900;
  font-size: .82rem;
}

/* Rankings panel tweaks */
body.admin-pro #rankings-artistas .nav-pills .nav-link {
  font-weight: 800;
}

body.admin-pro #rankings-artistas .dash-topright .btn {
  padding: .35rem .6rem;
}
