/* ==========================================================================
   RB CHARITABLE TRUST - BRAND DESIGN SYSTEM & PALETTE
   Extracted from the official RB Charitable Trust brand logo:
   - Primary Dark Green: Laurel wreath and trust banner (#014C2B)
   - Secondary Bright Green: Helping hands and environmental elements (#01A006)
   - Primary Blue: RB monogram and blue design elements (#05539E)
   - Accent Orange: Ribbon and supporting highlights (#FE9603)
   - Accent Yellow: Stars in the logo (#FCCF02)
   - White: Main backgrounds, cards, text (#FFFFFF)
   - Neutral Gray: Supporting text, subtle borders (#1F2937, #4B5563, #E5E7EB)
   ========================================================================== */

:root {
  /* ── 1. SEMANTIC TOKENS ── */
  --color-primary: #014C2B;
  --color-primary-dark: #013B21;
  --color-primary-light: #F0F7F3;
  --color-primary-rgb: 1, 76, 43;

  --color-secondary: #01A006;
  --color-secondary-hover: #018505;
  --color-secondary-light: #E8F7E9;
  --color-secondary-rgb: 1, 160, 6;

  --color-brand-blue: #05539E;
  --color-brand-blue-hover: #044380;
  --color-brand-blue-light: #EDF4FA;
  --color-brand-blue-rgb: 5, 83, 158;

  --color-accent: #FE9603;
  --color-accent-hover: #E08200;
  --color-accent-light: #FFF7EB;
  --color-accent-rgb: 254, 150, 3;

  --color-highlight: #FCCF02;
  --color-highlight-hover: #E5BB00;
  --color-highlight-light: #FEFDE8;
  --color-highlight-rgb: 252, 207, 2;

  --color-background: #F8FAFC;
  --color-background-alt: #F0F7F3;
  --color-surface: #FFFFFF;

  --color-text: #1F2937;
  --color-text-muted: #4B5563;
  --color-text-subtle: #6B7280;
  --color-border: #E5E7EB;
  --color-border-subtle: #F3F4F6;

  --color-success: #01A006;
  --color-danger: #DC2626;

  /* ── 2. BRAND COLOR ALIASES ── */
  --brand-green-dark: var(--color-primary);
  --brand-green-bright: var(--color-secondary);
  --brand-blue: var(--color-brand-blue);
  --brand-blue-hover: var(--color-brand-blue-hover);
  --brand-cyan: #1872c6;
  --brand-green: var(--color-primary);
  --brand-green-hover: var(--color-primary-dark);
  --brand-orange: var(--color-accent);
  --brand-orange-hover: var(--color-accent-hover);
  --brand-yellow: var(--color-highlight);

  /* ── 3. LEGACY CORE SYSTEM MAPPING ── */
  --primary-orange: var(--color-accent);
  --primary-orange-hover: var(--color-accent-hover);
  --primary-orange-dark: var(--color-accent-hover);
  --primary-orange-light: var(--color-accent-light);
  --primary-orange-soft: #fef5e7;

  --secondary-teal: var(--color-primary);
  --secondary-teal-hover: var(--color-primary-dark);
  --secondary-teal-dark: var(--color-primary-dark);
  --secondary-teal-light: var(--color-primary-light);
  --secondary-teal-soft: #e2efe7;

  --bg-white: #FFFFFF;
  --bg-cream: #F8FAFC;
  --bg-navy: #013B21;

  --text-dark: #1F2937;
  --border-light: #E5E7EB;

  /* ── 4. THEME SHORTHAND VARIABLES (Used in Modern Themes) ── */
  --s: var(--color-brand-blue);          /* RB Monogram Blue */
  --sl: #2575C0;                          /* Lighter Blue */
  --sd: var(--color-brand-blue-hover);    /* Darker Blue */
  --g: var(--color-primary);             /* Laurel Dark Green */
  --gl: var(--color-secondary);           /* Helping Hands Bright Green */
  --o: var(--color-accent);              /* Ribbon Orange */
  --ol: #FFB347;                         /* Light Orange */
  --y: var(--color-highlight);           /* Star Yellow */
  --yd: var(--color-highlight-hover);    /* Deep Yellow */

  --bg-warm: #F8FAFC;
  --bg-warm2: #F0F7F3;
  --ch: #1F2937;
  --muted: #4B5563;
  --subtle: #6B7280;
  --white: #FFFFFF;
}

/* Base Body Styling */
body {
  color: var(--color-text);
  background-color: var(--color-surface);
  font-family: 'Outfit', 'Inter', sans-serif;
}

/* Card Standards */
.foundation-card,
.card-brand {
  background-color: #FFFFFF !important;
  border-radius: 18px !important;
  border: 1px solid var(--color-border);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
  transition: all 0.3s ease;
}

.foundation-card:hover,
.card-brand:hover {
  border-color: var(--color-primary) !important;
  box-shadow: 0 12px 30px rgba(1, 76, 43, 0.12) !important;
  transform: translateY(-3px);
}

/* Button Standards */
.btn-primary-orange,
.btn-orange {
  background-color: var(--color-accent) !important;
  color: #FFFFFF !important;
  font-weight: 700;
  border-radius: 9999px;
  padding: 0.75rem 1.75rem;
  transition: all 0.25s ease;
  box-shadow: 0 4px 14px rgba(254, 150, 3, 0.35);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.btn-primary-orange:hover,
.btn-orange:hover {
  background-color: var(--color-accent-hover) !important;
  color: #FFFFFF !important;
  box-shadow: 0 6px 20px rgba(224, 130, 0, 0.45);
  transform: translateY(-1px);
}

.btn-secondary-teal,
.btn-teal,
.btn-green {
  background-color: var(--color-primary) !important;
  color: #FFFFFF !important;
  font-weight: 700;
  border-radius: 9999px;
  padding: 0.75rem 1.75rem;
  transition: all 0.25s ease;
  box-shadow: 0 4px 14px rgba(1, 76, 43, 0.3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.btn-secondary-teal:hover,
.btn-teal:hover,
.btn-green:hover {
  background-color: var(--color-primary-dark) !important;
  color: #FFFFFF !important;
  box-shadow: 0 6px 20px rgba(1, 59, 33, 0.4);
  transform: translateY(-1px);
}

.btn-blue {
  background-color: var(--color-brand-blue) !important;
  color: #FFFFFF !important;
  font-weight: 700;
  border-radius: 9999px;
  padding: 0.75rem 1.75rem;
  transition: all 0.25s ease;
  box-shadow: 0 4px 14px rgba(5, 83, 158, 0.3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.btn-blue:hover {
  background-color: var(--color-brand-blue-hover) !important;
  color: #FFFFFF !important;
  box-shadow: 0 6px 20px rgba(4, 67, 128, 0.4);
  transform: translateY(-1px);
}

/* Links */
a.brand-link,
.link-teal {
  color: var(--color-primary);
  transition: color 0.2s ease;
}

a.brand-link:hover,
.link-teal:hover {
  color: var(--color-secondary);
}

/* Badge styling */
.badge-teal,
.badge-green {
  background-color: var(--color-primary-light) !important;
  color: var(--color-primary) !important;
  border: 1px solid #C5DFD0;
}

.badge-orange {
  background-color: var(--color-accent-light) !important;
  color: var(--color-accent-hover) !important;
  border: 1px solid #FEEFD6;
}

.badge-blue {
  background-color: var(--color-brand-blue-light) !important;
  color: var(--color-brand-blue) !important;
  border: 1px solid #DBE9F5;
}

/* Form inputs focus state */
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 3px rgba(1, 76, 43, 0.15) !important;
}

/* Global Overrides for Tailwind classes across legacy templates */
.bg-green-500, .bg-green-600, .bg-emerald-600 {
  background-color: var(--color-secondary) !important;
}

.bg-green-700, .bg-green-800, .bg-green-900, .bg-emerald-700, .bg-teal-600, .bg-teal-700, .bg-teal-800 {
  background-color: var(--color-primary) !important;
}

.hover\:bg-green-600:hover, .hover\:bg-emerald-600:hover {
  background-color: var(--color-secondary-hover) !important;
}

.hover\:bg-green-700:hover, .hover\:bg-green-800:hover, .hover\:bg-emerald-700:hover, .hover\:bg-teal-700:hover {
  background-color: var(--color-primary-dark) !important;
}

.text-green-500, .text-green-600, .text-emerald-500, .text-emerald-600 {
  color: var(--color-secondary) !important;
}

.text-green-700, .text-green-800, .text-emerald-700, .text-teal-600, .text-teal-700, .text-teal-800 {
  color: var(--color-primary) !important;
}

.hover\:text-green-600:hover, .hover\:text-emerald-600:hover {
  color: var(--color-secondary-hover) !important;
}

.hover\:text-green-700:hover, .hover\:text-green-800:hover, .hover\:text-emerald-700:hover {
  color: var(--color-primary-dark) !important;
}

.border-green-500, .border-green-600, .border-emerald-500 {
  border-color: var(--color-secondary) !important;
}

.border-green-700, .border-green-800, .border-emerald-700, .border-teal-500 {
  border-color: var(--color-primary) !important;
}

.bg-amber-500, .bg-amber-600, .bg-orange-500, .bg-orange-600 {
  background-color: var(--color-accent) !important;
}

.hover\:bg-amber-600:hover, .hover\:bg-amber-700:hover, .hover\:bg-orange-600:hover, .hover\:bg-orange-700:hover {
  background-color: var(--color-accent-hover) !important;
}

.text-amber-500, .text-amber-600, .text-orange-500, .text-orange-600 {
  color: var(--color-accent) !important;
}

.hover\:text-amber-500:hover, .hover\:text-amber-600:hover, .hover\:text-orange-500:hover, .hover\:text-orange-600:hover {
  color: var(--color-accent-hover) !important;
}

.border-amber-500, .border-amber-600, .border-orange-500, .border-orange-600 {
  border-color: var(--color-accent) !important;
}

/* Intercept classes referencing hardcoded old teal (#0F8B8D) */
.text-\[\#0F8B8D\] {
  color: var(--color-primary) !important;
}
.hover\:text-\[\#0F8B8D\]:hover {
  color: var(--color-secondary) !important;
}
.bg-\[\#0F8B8D\] {
  background-color: var(--color-primary) !important;
}
.hover\:bg-\[\#0F8B8D\]:hover {
  background-color: var(--color-primary-dark) !important;
}
.border-\[\#0F8B8D\] {
  border-color: var(--color-primary) !important;
}
.focus\:ring-\[\#0F8B8D\]:focus {
  --tw-ring-color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
}
.from-\[\#0F8B8D\] {
  --tw-gradient-from: var(--color-primary) !important;
  --tw-gradient-to: rgb(1 76 43 / 0) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.to-\[\#0F8B8D\] {
  --tw-gradient-to: var(--color-primary) !important;
}

/* Intercept classes referencing hardcoded old orange (#F4A640) */
.text-\[\#F4A640\] {
  color: var(--color-accent) !important;
}
.hover\:text-\[\#F4A640\]:hover {
  color: var(--color-accent-hover) !important;
}
.bg-\[\#F4A640\] {
  background-color: var(--color-accent) !important;
}
.hover\:bg-\[\#F4A640\]:hover {
  background-color: var(--color-accent-hover) !important;
}
.border-\[\#F4A640\] {
  border-color: var(--color-accent) !important;
}
.from-\[\#F4A640\] {
  --tw-gradient-from: var(--color-accent) !important;
  --tw-gradient-to: rgb(254 150 3 / 0) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.to-\[\#F4A640\] {
  --tw-gradient-to: var(--color-accent) !important;
}
.shadow-\[\#F4A640\]\/25 {
  --tw-shadow-color: rgb(254 150 3 / 0.25) !important;
}

/* Intercept classes referencing previous blue (#1070B0) */
.text-\[\#1070B0\] {
  color: var(--color-brand-blue) !important;
}
.hover\:text-\[\#1070B0\]:hover {
  color: var(--color-brand-blue-hover) !important;
}
.bg-\[\#1070B0\] {
  background-color: var(--color-primary) !important;
}
.hover\:bg-\[\#1070B0\]:hover {
  background-color: var(--color-primary-dark) !important;
}
.border-\[\#1070B0\] {
  border-color: var(--color-primary) !important;
}
.focus\:ring-\[\#1070B0\]:focus {
  --tw-ring-color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
}

/* Intercept previous dark blue (#0d5b90) */
.bg-\[\#0d5b90\] {
  background-color: var(--color-primary-dark) !important;
}
.hover\:bg-\[\#0d5b90\]:hover {
  background-color: var(--color-primary-dark) !important;
}

/* Intercept previous orange (#F0A010) */
.text-\[\#F0A010\] {
  color: var(--color-accent) !important;
}
.hover\:text-\[\#F0A010\]:hover {
  color: var(--color-accent-hover) !important;
}
.bg-\[\#F0A010\] {
  background-color: var(--color-accent) !important;
}
.hover\:bg-\[\#F0A010\]:hover {
  background-color: var(--color-accent-hover) !important;
}
.border-\[\#F0A010\] {
  border-color: var(--color-accent) !important;
}

/* Intercept previous dark orange (#d48b0a) */
.text-\[\#d48b0a\] {
  color: var(--color-accent-hover) !important;
}
.bg-\[\#d48b0a\] {
  background-color: var(--color-accent-hover) !important;
}
.hover\:bg-\[\#d48b0a\]:hover {
  background-color: var(--color-accent-hover) !important;
}

/* Surface backgrounds and soft borders */
.bg-\[\#FFF8F1\] {
  background-color: var(--color-background) !important;
}
.border-\[\#FEECDC\] {
  border-color: #E2EFE7 !important;
}
.text-\[\#D98E2B\] {
  color: var(--color-accent-hover) !important;
}
.bg-\[\#D98E2B\] {
  background-color: var(--color-accent-hover) !important;
}
.hover\:bg-\[\#D98E2B\]:hover {
  background-color: var(--color-accent-hover) !important;
}
.bg-\[\#F0FDFD\] {
  background-color: var(--color-primary-light) !important;
}
.border-\[\#CCFBF1\] {
  border-color: #C5DFD0 !important;
}

/* Intercept old mustard/gold theme buttons (#D4AF37, #B8860B) */
.text-\[\#D4AF37\], .text-\[\#B8860B\] {
  color: var(--color-accent) !important;
}
.border-\[\#D4AF37\] {
  border-color: var(--color-accent) !important;
}
.bg-\[\#D4AF37\], .bg-\[\#B8860B\] {
  background-color: var(--color-accent) !important;
}