/* ============================================================
   Ghana (GH) Theme — Red / Gold / Green / Black Star palette
   Distinct from NG (green+orange), KE (dark red/black), ZA (rainbow).
   Warm gold-amber appbar, cream backdrop, red accents, black-star
   flag bands. No external assets.
   ============================================================ */

:root {
  --brand: #E8890C;
  --brand2: #F2A900;
  --brand3: #C26E00;
  --bg: #fbf5e9;
  --card: #fffdf8;
  --ink: #2a1f0e;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  background: #f0e6cf;
  color: var(--ink);
}

.app { background: #fdf8ee; box-shadow: 0 0 40px rgba(150, 90, 10, 0.18); }

/* Flag strip: Red / Gold / Green horizontal bands with black star center dot */
.flagstrip {
  height: 9px;
  background: linear-gradient(
    to bottom,
    #CE1126 0 33.33%,
    #FCD116 33.33% 66.66%,
    #006B3F 66.66% 100%
  );
}

/* App bar: rich gold-amber gradient */
.appbar {
  background: linear-gradient(150deg, #C26E00 0%, #E8890C 50%, #F2A900 100%);
  border-radius: 0 0 30px 30px;
  box-shadow: 0 10px 24px rgba(194, 110, 0, 0.35);
}
.appbar .brand { letter-spacing: 0.6px; }
.appbar .brand .logo { border-radius: 50%; background: rgba(0, 0, 0, 0.85); color: #FCD116; }

.wallet-card { border-radius: 16px; background: rgba(255, 255, 255, 0.18); }
.wallet-card .acts a { color: #C26E00; }

/* Warm cream cards with gold top border */
.card, .cat, .badge, .testi {
  background: var(--card);
  border-radius: 16px;
  box-shadow: 0 3px 12px rgba(150, 90, 10, 0.1);
}
.card { border-top: 3px solid #E8890C; }
.cat { border-top: 3px solid #CE1126; }
.badge { border-bottom: 3px solid #006B3F; }

/* Buttons: amber -> deep orange */
.btn {
  background: linear-gradient(135deg, #E8890C, #C26E00);
  border-radius: 16px;
  box-shadow: 0 5px 16px rgba(232, 137, 12, 0.4);
  letter-spacing: 0.3px;
}
.btn.secondary { background: #f3e6c8; color: #7a4a05; }

/* Promo: bold red banner with gold stars vibe */
.promo {
  background: linear-gradient(120deg, #CE1126 0%, #e63946 100%);
  border-radius: 16px;
  box-shadow: 0 8px 22px rgba(206, 17, 38, 0.4);
  border: 1.5px solid rgba(252, 209, 22, 0.5);
}

/* Chips: gold outline pills */
.chip {
  color: #C26E00;
  border: 1.5px solid #E8890C;
  background: #fdf3d8;
  border-radius: 999px;
  font-weight: 800;
}

/* Stats bar: gold -> green */
.stats {
  background: linear-gradient(135deg, #E8890C, #006B3F);
  border-radius: 16px;
}

.howto .n { background: #E8890C; box-shadow: 0 3px 8px rgba(232, 137, 12, 0.4); }

.price { color: #C26E00; }
a { color: #C26E00; }

.tabbar { border-top: 2px solid #efe3c6; }
.tabbar a.on { color: #C26E00; }

.pill.g { background: #dcfce7; color: #166534; }