/* Erya Brew — Forest Green theme */
/* Primary: deep forest green  ·  Terracotta accent from logo */
:root {
  --primary-50:  #f0f7f0;
  --primary-100: #d6ebd7;
  --primary-200: #aed1af;
  --primary-300: #7fb480;
  --primary-400: #579758;
  --primary-500: #3a7740;
  --primary-600: #2d5e32;
  --primary-700: #1f4325;
  --primary-800: #163119;
  --primary-900: #0f210f;
  --primary-950: #07140a;

  --accent:       var(--primary-600);
  --accent-hover: var(--primary-700);
  --accent-press: var(--primary-800);
  --accent-soft:  var(--primary-50);

  --sp-color-primary:        var(--primary-500);
  --sp-color-primary-hover:  var(--primary-600);
  --sp-color-primary-dark:   var(--primary-700);
  --sp-color-primary-subtle: var(--primary-50);
  --sp-color-primary-muted:  var(--primary-200);
  --border-focus: var(--primary-400);
  --shadow-focus: 0 0 0 4px rgba(58,119,64,.20);

  /* Terracotta — from the Erya Brew cup logo */
  --terra-500: #A0522D;
  --terra-400: #C0643A;
  --terra-100: #FAE0D5;
  --terra-50:  #FDF4F0;

  --fg-success: var(--success-600);
  --fg-warning: var(--warning-600);
  --fg-danger:  var(--danger-600);
  --fg-info:    var(--info-600);
}

/* ── Badge variants ─────────────────────────────────────────────── */
.badge-green {
  background: var(--primary-50);
  color: var(--primary-700);
  border: 1px solid var(--primary-200);
}
.badge-green .dot { background: var(--primary-500); }

.badge-terra {
  background: var(--terra-50);
  color: var(--terra-500);
  border: 1px solid var(--terra-100);
}
.badge-terra .dot { background: var(--terra-500); }

/* ── Stat chip ──────────────────────────────────────────────────── */
.stat-chip {
  background: #fff;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
  padding: 14px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.stat-chip__icon {
  width: 36px; height: 36px;
  border-radius: var(--radius-md);
  display: grid; place-items: center;
  flex-shrink: 0;
}
.stat-chip__label {
  font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .08em;
  color: var(--fg-3);
}
.stat-chip__value { font-size: 22px; font-weight: 700; color: var(--fg-1); }

/* ── KPI card ───────────────────────────────────────────────────── */
.kpi-card {
  background: #fff;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
  padding: 20px 22px;
  display: flex; flex-direction: column; gap: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,.04);
  transition: box-shadow var(--dur-fast);
}
.kpi-card:hover { box-shadow: 0 4px 8px rgba(0,0,0,.06); }
.kpi-card__label {
  font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .08em;
  color: var(--fg-3);
}
.kpi-card__value { font-size: 28px; font-weight: 700; color: var(--fg-1); letter-spacing: -.02em; }
.kpi-card__sub   { font-size: 12px; color: var(--fg-3); }
.kpi-card__trend {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 12px; font-weight: 600;
}
.kpi-card__trend--up   { color: var(--fg-success); }
.kpi-card__trend--down { color: var(--fg-danger);  }
