/* ================================================================
   AdminPro — dashboard.css
   Styles specific to the Dashboard page (pages/dashboard.php).
   Imported via: public/assets/css/dashboard.css
   ================================================================ */

/* ── Welcome Banner ──────────────────────────────────────────────── */
.dash-welcome {
  background: linear-gradient(135deg, var(--ap-primary) 0%, #7c3aed 60%, var(--ap-pink) 100%);
  border-radius: var(--radius-xl);
  padding: 1.25rem 1.75rem;
  color: #fff;
  position: relative;
  overflow: hidden;
  margin-bottom: 1.25rem;
}
.dash-welcome::before {
  content: '';
  position: absolute; top: -40px; right: -30px;
  width: 220px; height: 220px; border-radius: 50%;
  background: rgba(255,255,255,.06);
}
.dash-welcome::after {
  content: '';
  position: absolute; bottom: -50px; right: 120px;
  width: 150px; height: 150px; border-radius: 50%;
  background: rgba(255,255,255,.04);
}
.dash-welcome-title { font-size: 1.3rem; font-weight: 800; margin-bottom: .2rem; }
.dash-welcome-sub   { font-size: .9rem; opacity: .85; margin-bottom: 0; }
.dash-welcome-badge {
  display: inline-flex; align-items: center; gap: .4rem;
  background: rgba(255,255,255,.18); backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 20px; padding: .25rem .75rem;
  font-size: .78rem; font-weight: 600; color: #fff; margin-bottom: .65rem;
}

/* ── KPI Stat Cards ──────────────────────────────────────────────── */
.dash-stat-card {
  background: var(--ap-surface);
  border: 1px solid var(--ap-border);
  border-radius: var(--radius-lg);
  padding: 1.1rem 1.25rem;
  position: relative; overflow: hidden;
  transition: var(--transition); height: 100%;
}
.dash-stat-card:hover        { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.dash-stat-accent-bar {
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}
.dash-stat-icon {
  width: 42px; height: 42px; border-radius: var(--radius-md);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem; margin-bottom: .75rem;
}
.dash-stat-value   { font-size: 1.75rem; font-weight: 800; letter-spacing: -.04em; color: var(--ap-text-1); line-height: 1; margin-bottom: .25rem; }
.dash-stat-label   { font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .07em; color: var(--ap-text-3); margin-bottom: .5rem; }
.dash-stat-trend   { display: inline-flex; align-items: center; gap: .2rem; font-size: .78rem; font-weight: 600; padding: .18rem .5rem; border-radius: 20px; }
.dash-stat-trend.up   { background: var(--ap-success-soft); color: var(--ap-success); }
.dash-stat-trend.down { background: var(--ap-danger-soft);  color: var(--ap-danger);  }
.dash-stat-compare { font-size: .78rem; color: var(--ap-text-4); margin-left: .25rem; }

/* ── Row helpers ─────────────────────────────────────────────────── */
.row-label { font-size: .875rem; font-weight: 600; color: var(--ap-text-1); }
.row-sub   { font-size: .8125rem; color: var(--ap-text-3); margin-top: .1rem; }
.row-value { font-size: .9375rem; font-weight: 700; color: var(--ap-text-1); }