/*
 * Brand color tokens, mirrored in the iOS app's Color+Brand.swift /
 * Assets.xcassets color sets so both platforms share one palette.
 *
 * Loaded after Bootstrap so these can override Bootstrap's theme
 * variables. Bootstrap's utility classes that build colors from
 * `rgba(var(--bs-x-rgb), alpha)` (bg-*, text-*, border-*, link-*)
 * pick up the root overrides below automatically. Components that
 * hardcode their own per-variant CSS variables (.btn-*, .alert-*) are
 * overridden explicitly further down.
 *
 * Error/destructive color is intentionally left as Bootstrap's
 * default danger red — not redefined here.
 */
:root {
  /* Main brand colors */
  --color-brand-primary: #16A34A;       /* Vibrant emerald: primary buttons, active states, checkmarks */
  --color-brand-primary-hover: #15803D; /* Darker emerald: button hover states */
  --color-brand-dark: #064E3B;          /* Deep forest green: headings, footer background, strong borders */

  /* Backgrounds */
  --color-bg-base: #FFFFFF;   /* Main app background */
  --color-bg-subtle: #F0FDF4; /* Secondary sections, cards, alternating rows */

  /* Text */
  --color-text-main: #1F2937;
  --color-text-muted: #4B5563;

  /* Complementary / contextual */
  --color-accent-amber: #D97706; /* "Pending" status, warnings, highlighted values (e.g. fair market value) */
  --color-accent-blue: #0284C7;  /* Links, tooltip icons, "open"/informational status */

  /* Disabled / inactive */
  --color-disabled-bg: #E5E7EB;
  --color-disabled-text: #9CA3AF;

  /* Borders / dividers */
  --color-border: #E5E7EB;
  --color-border-strong: #D1D5DB;

  /* Neutral status (e.g. user-canceled — not an error) */
  --color-status-neutral: #6B7280;

  /* Category/chart palette — keep red out of this set; it's reserved for errors */
  --chart-1: #16A34A;
  --chart-2: #D97706;
  --chart-3: #0284C7;
  --chart-4: #7C3AED;
  --chart-5: #DB2777;
  --chart-6: #64748B;

  /* Bootstrap theme variable overrides */
  --bs-primary: #16A34A;
  --bs-primary-rgb: 22, 163, 74;
  --bs-success: #16A34A;
  --bs-success-rgb: 22, 163, 74;
  --bs-warning: #D97706;
  --bs-warning-rgb: 217, 119, 6;
  --bs-info: #0284C7;
  --bs-info-rgb: 2, 132, 199;
  --bs-body-color: var(--color-text-main);
  --bs-body-color-rgb: 31, 41, 55;
  --bs-link-color: var(--color-accent-blue);
  --bs-link-color-rgb: 2, 132, 199;
  --bs-link-hover-color: #026A9E;
  --bs-border-color: var(--color-border);
}

/* WB-011 (P0): Auto dark mode is intentionally DISABLED.
 *
 * A `@media (prefers-color-scheme: dark)` block used to live here. It flipped
 * the custom --color-* vars (and therefore --bs-body-color) to a light text
 * palette, but the page chrome — body `bg-light`, `bg-white` cards, default
 * Bootstrap component backgrounds, and `text-dark`/`bg-light` utility classes
 * used throughout the templates — is hardcoded light and does NOT read these
 * variables. The result for any visitor whose OS is in dark mode was near-white
 * text on still-white surfaces (e.g. the landing-page feature tiles rendered
 * invisible). The light theme is the only fully-designed theme, so we render it
 * for everyone regardless of OS preference.
 *
 * A real dark mode must override --bs-body-bg and audit every hardcoded
 * bg-*/text-* utility in the templates; track that as a deliberate feature
 * rather than an OS-preference auto-switch. Do not re-add this block without
 * that work. */

/* .btn-primary hardcodes its own bg/border vars, so the root --bs-primary
   override above doesn't reach it — set explicitly. */
.btn-primary {
  --bs-btn-bg: var(--color-brand-primary);
  --bs-btn-border-color: var(--color-brand-primary);
  --bs-btn-hover-bg: var(--color-brand-primary-hover);
  --bs-btn-hover-border-color: var(--color-brand-primary-hover);
  --bs-btn-active-bg: var(--color-brand-primary-hover);
  --bs-btn-active-border-color: var(--color-brand-primary-hover);
  --bs-btn-disabled-bg: var(--color-disabled-bg);
  --bs-btn-disabled-border-color: var(--color-disabled-bg);
  --bs-btn-disabled-color: var(--color-disabled-text);
}

/* .btn-outline-primary also hardcodes its own color vars — not reached by
   the root --bs-primary-rgb override above. */
.btn-outline-primary {
  --bs-btn-color: var(--color-brand-primary);
  --bs-btn-border-color: var(--color-brand-primary);
  --bs-btn-hover-bg: var(--color-brand-primary);
  --bs-btn-hover-border-color: var(--color-brand-primary);
  --bs-btn-active-bg: var(--color-brand-primary-hover);
  --bs-btn-active-border-color: var(--color-brand-primary-hover);
  --bs-btn-focus-shadow-rgb: 22, 163, 74;
}

.btn-warning {
  --bs-btn-bg: var(--color-accent-amber);
  --bs-btn-border-color: var(--color-accent-amber);
  --bs-btn-color: #fff;
  --bs-btn-hover-bg: #B45309;
  --bs-btn-hover-border-color: #B45309;
  --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: #B45309;
  --bs-btn-active-border-color: #B45309;
}

/* .alert-* variants also hardcode their own color/bg/border vars. */
.alert-warning {
  --bs-alert-color: #92400E;
  --bs-alert-bg: #FFFBEB;
  --bs-alert-border-color: #FDE68A;
}

.alert-info {
  --bs-alert-color: #075985;
  --bs-alert-bg: #F0F9FF;
  --bs-alert-border-color: #BAE6FD;
}

.alert-danger {
  --bs-alert-color: #991B1B;
  --bs-alert-bg: #FEF2F2;
  --bs-alert-border-color: #FECACA;
}

/* "Neutral" status badge for non-error end states (e.g. user-canceled
   subscription) — pair with .badge or similar, not provided by Bootstrap. */
.text-bg-neutral {
  color: #fff;
  background-color: var(--color-status-neutral);
}