/* GODSON brand colours (matches godsonfoundationindia.org): orange #FF6B0D for actions, teal #00646B / #00545B for structure,
   mint-white backgrounds. Loaded after every other stylesheet so these exact values win. Plain solid colours, no decoration. */
:root {
  --bg: #f3f8f6;
  --surface: #ffffff;
  --surface-2: #eaf5f3;
  --border: #d9e8e3;
  --text: #12363b;
  --muted: #4f6f72;
  --primary: #00646b;
  --primary-hover: #00545b;
  --primary-soft: #e2f2ef;
  --orange: #ff6b0d;
  --orange-hover: #e85a00;
  --orange-soft: #fff0e4;
  --gold: #ff8a3d;
  --navy: #014b54;
  --ok: #00806b;
  --ok-soft: #e3f4ee;
  --warn: #9a4a00;
  --warn-soft: #fff2e5;
  --info: #00646b;
  --info-soft: #e6f3f4;
  --focus: #00646b;
  --chart: #00646b;
  --chart-soft: #9fd3cf;
  --godson-orange: #ff6b0d;
  --godson-teal: #00545b;
}
body { background-color: var(--bg); }

/* Main action buttons: website orange with white text, like "Donate Now". */
body .btn.btn-primary, body .btn.btn-primary:visited, .btn-primary { background: #ff6b0d; border-color: #ff6b0d; color: #fff; }
body .btn.btn-primary:hover:not(:disabled), body .btn.btn-primary:focus-visible { background: #e85a00; border-color: #e85a00; color: #fff; }

/* Headings in website teal. */
h1, h2, h3, .page-title { color: #00545b; }

/* WhatsApp / Email tab bar: the CRM's general menu rule stacks every <nav> vertically; keep these tabs in a row. */
nav.hub-tabs { flex-direction: row; }

/* Donation trend chart (colours set inside the app). */
svg stop[stop-color="#e8bd42"] { stop-color: #ff6b0d; }
svg polyline[stroke="#b68b12"] { stroke: #ff6b0d; }
svg line[stroke="#e8edf1"] { stroke: #e0ece7; }

/* Today: Successful = green, Pending = orange, Failed = red. Solid colours, white text. */
.today-metrics .today-success { background: #16a34a; border-color: #16a34a; color: #fff; }
.today-metrics .today-success .today-stat-title, .today-metrics .today-success strong { color: #fff; }
.today-metrics .today-success small { color: #dcfce7; }
.today-metrics .today-success .today-stat-icon { background: #fff; color: #16a34a; border-color: #fff; }
.today-metrics .today-pending-failed { background: transparent; border-color: transparent; box-shadow: none; gap: 10px; }
.today-metrics .today-pending-failed > button { border-radius: 14px; border: 1px solid transparent; color: #fff; }
.today-metrics .today-pending-failed > button:not(.today-failed) { background: #ff6b0d; border-color: #ff6b0d; }
.today-metrics .today-pending-failed > button.today-failed { background: #d92d3a; border-color: #d92d3a; }
.today-metrics .today-pending-failed > button strong, .today-metrics .today-pending-failed > button .today-count-label, .today-metrics .today-pending-failed > button .today-count-label * { color: #fff; }
.today-metrics .today-pending-failed > button small { color: #fff1e6; }
.today-metrics .today-pending-failed > button .today-count-label > span[aria-hidden] { background: rgba(255,255,255,.22); color: #fff; }
.today-metrics button[aria-pressed="true"] { outline: 3px solid #00545b; outline-offset: 2px; }

/* WhatsApp & Email dashboard number cards: solid colours, white text. */
.hub-root .hub-kpis .hub-kpi { border: 0; color: #fff; background: #00646b; box-shadow: none; }
.hub-root .hub-kpis .hub-kpi span, .hub-root .hub-kpis .hub-kpi b { color: #fff; }
.hub-root .hub-kpis .hub-kpi small { color: rgba(255,255,255,.85); }
.hub-root .hub-kpis .hub-kpi:first-child { background: #ff6b0d; }
.hub-root .hub-kpis .hub-kpi.green { background: #00808a; }
.hub-root .hub-kpis .hub-kpi.green + .hub-kpi.green { background: #0b8a5f; }
.hub-root .hub-kpis .hub-kpi.red { background: #d92d3a; }
.hub-root .hub-kpis .hub-kpi.grey { background: #5b7b7e; }

/* Section cards: soft teal header strip, teal titles, orange links. */
.hub-root .hub-card { border-color: #d9e8e3; }
.hub-root .hub-card > header { margin: -16px -18px 12px; padding: 12px 18px; background: #e2f2ef; border-bottom: 1px solid #d9e8e3; border-radius: 18px 18px 0 0; }
.hub-root .hub-card > header h3 { color: #00545b; }
.hub-root .hub-link { color: #e85a00; font-weight: 600; }
.hub-root .hub-stats li b { color: #00545b; }

/* Sending capacity band: teal with orange bar and button. */
.hub-root .hub-limit { background: #00646b; color: #fff; border: 0; }
.hub-root .hub-limit strong { color: #fff; }
.hub-root .hub-limit small { color: #cdeae6; }
.hub-root .hub-limit .hub-bar { background: rgba(255,255,255,.18); }
.hub-root .hub-limit .hub-bar i { background: #ff6b0d; }
.hub-root .hub-limit .btn-secondary { background: #ff6b0d; border-color: #ff6b0d; color: #fff; }
.hub-root .hub-limit-form label, .hub-root .hub-limit .hub-limit-hint { color: #e2f2ef; }

/* Selected WhatsApp / Email tab. */
.hub-root .hub-tabs button[aria-selected="true"] { background: #ff6b0d; color: #fff; border-color: #ff6b0d; }

/* Live donations box: solid sky blue with white text. */
.today-live-card { background: #1e90e0; border-color: #1e90e0; color: #fff; }
.today-live-card h2, .today-live-card .today-live-heading h2 { color: #fff; }
.today-live-card p, .today-live-card .today-gift-count { color: #fff; }
.today-live-card small { color: #e3f2fd; }
.today-live-card .today-amount { color: #fff; }
.today-live-card .donation-map-toggle { background: #ffffff; border-color: #ffffff; color: #1565c0; }
.today-live-card .donation-map-toggle span { color: #ff6b0d; }

/* ===== Colour by meaning (v9.8) ===== */
[data-tone="green"]  { --t1: #22c55e; --t2: #15803d; --ts: #e9f9ef; --ti: #116b33; }
[data-tone="purple"] { --t1: #8b5cf6; --t2: #6d28d9; --ts: #f2edff; --ti: #5b21b6; }
[data-tone="red"]    { --t1: #ff3b3b; --t2: #d90000; --ts: #ffecec; --ti: #b30000; }
[data-tone="orange"] { --t1: #ff8a3d; --t2: #e85a00; --ts: #fff1e6; --ti: #b54700; }
[data-tone="teal"]   { --t1: #0a9aa3; --t2: #00545b; --ts: #e3f4f2; --ti: #00545b; }
[data-tone="blue"]   { --t1: #38a8f0; --t2: #1570c4; --ts: #e8f4fd; --ti: #11589b; }
[data-tone="slate"]  { --t1: #7b979a; --t2: #4d6b6e; --ts: #eef3f3; --ti: #3f5b5e; }
[data-tone="brand"]  { --t1: #00646b; --t2: #ff6b0d; --ts: #f3f9f8; --ti: #00545b; }

/* Today: Successful = bright green, Pending = purple, Failed = bright red */
.today-metrics .today-success { background: linear-gradient(135deg, #22c55e 0%, #15803d 100%); border-color: #15803d; box-shadow: 0 12px 24px -14px rgba(21, 128, 61, .7); }
.today-metrics .today-success .today-stat-icon { color: #15803d; }
.today-metrics .today-pending-failed > button:not(.today-failed) { background: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%); border-color: #6d28d9; box-shadow: 0 12px 24px -14px rgba(109, 40, 217, .7); }
.today-metrics .today-pending-failed > button:not(.today-failed) small { color: #ede9fe; }
.today-metrics .today-pending-failed > button.today-failed { background: linear-gradient(135deg, #ff3b3b 0%, #d90000 100%); border-color: #d90000; box-shadow: 0 12px 24px -14px rgba(217, 0, 0, .7); }
.today-metrics .today-pending-failed > button.today-failed small { color: #ffe4e4; }

/* WhatsApp & Email number tiles: colour by what they count */
.hub-root .hub-kpis .hub-kpi[data-tone] { background: linear-gradient(135deg, var(--t1) 0%, var(--t2) 100%); box-shadow: 0 12px 22px -14px var(--t2); border-radius: 16px; }
.hub-root .hub-kpis .hub-kpi[data-tone] b { font-size: 1.9rem; letter-spacing: -.01em; }

/* Section cards (WhatsApp, Email and every page): white body, coloured accent and header by topic */
.hub-root .hub-card[data-tone], main section.card[data-tone] { position: relative; border: 1px solid #dfeae6; border-radius: 18px; background: #fff;
  box-shadow: 0 1px 2px rgba(0, 84, 91, .06), 0 10px 24px -18px rgba(0, 84, 91, .45); overflow: hidden; }
.hub-root .hub-card[data-tone]::before, main section.card[data-tone]::before { content: ""; position: absolute; left: 0; top: 0; right: 0; height: 4px;
  background: linear-gradient(90deg, var(--t1), var(--t2)); }
.hub-root .hub-card[data-tone] > header { background: var(--ts); border-bottom-color: color-mix(in srgb, var(--t1) 25%, #ffffff); }
.hub-root .hub-card[data-tone] > header h3, main section.card[data-tone] > h2, main section.card[data-tone] > h3,
main section.card[data-tone] > header h2, main section.card[data-tone] > header h3, main section.card[data-tone] .card-title { color: var(--ti); }
.hub-root .hub-card[data-tone] .hub-stats li b { color: var(--ti); }

/* Donations & finance: the five steps, each its own colour */
.finance-stage[data-tone] { background: linear-gradient(135deg, var(--t1) 0%, var(--t2) 100%); border: 0; border-radius: 16px; color: #fff;
  box-shadow: 0 12px 22px -14px var(--t2); }
.finance-stage[data-tone] * { color: #fff; }
.finance-stage[data-tone] small, .finance-stage[data-tone] span { color: rgba(255, 255, 255, .88); }

/* Number tiles on other pages */
.stat { border-radius: 16px; border: 1px solid #dfeae6; box-shadow: 0 10px 22px -18px rgba(0, 84, 91, .5); }
.stat.stat-plain, .stat.stat-info { background: linear-gradient(135deg, #e8f4fd 0%, #ffffff 100%); border-left: 5px solid #1e90e0; }
.stat.stat-warn { background: linear-gradient(135deg, #fff1e6 0%, #ffffff 100%); border-left: 5px solid #ff6b0d; }
.stat.stat-danger { background: linear-gradient(135deg, #ffecec 0%, #ffffff 100%); border-left: 5px solid #ff2a2a; }
.stat:not(.stat-plain):not(.stat-info):not(.stat-warn):not(.stat-danger) { background: linear-gradient(135deg, #e3f4f2 0%, #ffffff 100%); border-left: 5px solid #00646b; }

/* Info notes, empty states and tab bars */
.alert.alert-info { background: #e8f4fd; border: 1px solid #b9dcf6; border-left: 5px solid #1e90e0; border-radius: 14px; color: #11466f; }
main .empty { background: linear-gradient(135deg, #f3f9f8 0%, #fff7f0 100%); border: 1.5px dashed #b9d9d4; border-radius: 16px; }
main .tabs { background: #ffffff; border: 1px solid #dfeae6; border-radius: 14px; box-shadow: 0 8px 18px -16px rgba(0, 84, 91, .5); }
main .tabs .tab-active, main .tabs [aria-selected="true"] { background: #ff6b0d; color: #fff; border-radius: 10px; border-bottom-color: transparent; }
main .tabs .tab-active .tab-count { background: rgba(255, 255, 255, .25); color: #fff; }

/* Badges: vivid, readable pills */
.badge-ok { background: #dcfce7; color: #116b33; }
.badge-warn { background: #fff1e6; color: #b54700; }
.badge-danger { background: #ffe1e1; color: #b30000; }
.badge-info { background: #e3f0fd; color: #11589b; }
.badge-muted { background: #eef3f3; color: #3f5b5e; }

/* Sending capacity band stays a solid teal band (it is also a .hub-card) */
.hub-root .hub-limit, .hub-root .hub-limit[data-tone] { background: linear-gradient(135deg, #0a9aa3 0%, #00545b 100%); color: #fff; border: 0; border-radius: 18px; box-shadow: 0 12px 22px -14px #00545b; }
.hub-root .hub-limit[data-tone]::before { display: none; }
.hub-root .hub-limit strong { color: #fff; }
.hub-root .hub-limit small { color: #d6f0ee; }

/* Live donations: navy blue card with golden-yellow text (replaces the sky-blue version above) */
.today-live-card { background: linear-gradient(135deg, #0d2b5e 0%, #071b3d 100%); border-color: #0d2b5e; color: #ffc83d; box-shadow: 0 14px 28px -16px rgba(7, 27, 61, .8); }
.today-live-card h2, .today-live-card .today-live-heading h2 { color: #ffc83d; }
.today-live-card p, .today-live-card .today-gift-count { color: #ffd766; }
.today-live-card .today-amount { color: #ffc83d; }
.today-live-card small { color: #f3d98b; }
.today-live-card .donation-map-toggle { background: rgba(255, 200, 61, .08); border-color: rgba(255, 200, 61, .55); color: #ffc83d; }
.today-live-card .donation-map-toggle span { color: #ffc83d; }
/* Live badge: white pill, sky-blue text and dot */
.today-live-card .today-sync { background: #ffffff; color: #1e90e0; border: 1px solid #ffffff; font-weight: 700; box-shadow: 0 4px 10px -6px rgba(0, 0, 0, .45); }
.today-live-card .today-sync i { background: #1e90e0; box-shadow: 0 0 0 3px rgba(30, 144, 224, .2); }

/* Left menu: proper orange when pointing at or opening a menu */
a.nav-link:hover, a.nav-link:focus-visible { background: #ff6b0d; color: #fff; }
a.nav-link:hover .nav-icon, a.nav-link:focus-visible .nav-icon, a.nav-link:hover span, a.nav-link:focus-visible span { color: #fff; }
a.nav-link.nav-active, a.nav-link.nav-active:hover, .today-shell a.nav-link.nav-active { background: #ff6b0d; color: #fff; box-shadow: 0 8px 16px -10px rgba(255, 107, 13, .9); }
a.nav-link.nav-active .nav-icon, a.nav-link.nav-active span { color: #fff; }
