/* ============================================================
   Kenya (KE) Theme — Black / Red / Green / White shield palette
   Distinct from NG (green+orange), GH (gold), ZA (rainbow Y).
   Dark charcoal-to-red appbar, horizontal KES flag bands,
   shield-like cards with a bold left border. No external assets.
   ============================================================ */

:root {
  --brand: #B02A30;
  --brand2: #7A1F24;
  --brand3: #006643;
  --bg: #f2efec;
  --card: #ffffff;
  --ink: #1c1a18;
}

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

.app { background: #faf8f6; box-shadow: 0 0 40px rgba(0, 0, 0, 0.18); }

/* Flag strip: Black / Red / Green horizontal bands with white edge lines */
.flagstrip {
  height: 9px;
  background: linear-gradient(
    to bottom,
    #000000 0 25%,
    #ffffff 25% 28%,
    #B02A30 28% 58%,
    #ffffff 58% 61%,
    #006643 61% 100%
  );
}

/* App bar: charcoal black -> Kenyan red (shield mood) */
.appbar {
  background: linear-gradient(150deg, #161616 0%, #3a1013 45%, #B02A30 100%);
  border-radius: 14px 14px 22px 22px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35);
}
.appbar .brand { letter-spacing: 0.8px; }
.appbar .brand .logo { border-radius: 6px; background: rgba(255, 255, 255, 0.2); }

.wallet-card { border-radius: 14px; background: rgba(255, 255, 255, 0.13); }
.wallet-card .acts a { color: #7A1F24; }

/* Shield cards: sharp-ish radius + thick red left edge */
.card, .cat, .badge, .testi {
  background: var(--card);
  border-radius: 12px;
  box-shadow: 0 3px 10px rgba(20, 20, 20, 0.08);
}
.card { border-left: 5px solid #B02A30; }
.cat { border-top: 3px solid #006643; }
.badge { border-bottom: 3px solid #000000; }

/* Buttons: deep red gradient, squared radius */
.btn {
  background: linear-gradient(135deg, #B02A30, #7A1F24);
  border-radius: 10px;
  box-shadow: 0 5px 14px rgba(176, 42, 48, 0.35);
  letter-spacing: 0.4px;
}
.btn.secondary { background: #efe7e6; color: #5c1a1d; }

/* Promo: bold red banner with black underline stripe */
.promo {
  background: linear-gradient(120deg, #B02A3A 0%, #d94a3d 100%);
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(176, 42, 48, 0.4);
  border-bottom: 4px solid #161616;
}

/* Chips: red outline square-ish pills */
.chip {
  color: #7A1F24;
  border: 1.5px solid #B02A30;
  background: #fdecec;
  border-radius: 6px;
  font-weight: 800;
}

/* Stats bar: black -> green */
.stats {
  background: linear-gradient(135deg, #161616, #006643);
  border-radius: 12px;
}

.howto .n { background: #B02A30; box-shadow: 0 3px 8px rgba(176, 42, 48, 0.35); }

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

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

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