/*
Theme Name: Niwala Foundation Revamp
Theme URI: https://niwalafoundation.org/
Description: Complete modern, emotionally engaging, mobile-friendly humanitarian redesign for Niwala Foundation. Built with clean typography (Poppins & Inter), donation conversion optimization, verified trust compliance, and GiveWP / WPForms compatibility.
Author: Niwala Foundation Design & Web Team
Author URI: https://niwalafoundation.org/
Template: helpgrove
Version: 2.0.0
License: GNU General Public License v2 or later
Text Domain: niwala-revamp
*/

/* Core Color Variables */
:root {
  --primary-green: #238636;
  --deep-green: #14532D;
  --accent-orange: #F59E0B;
  --warm-cream: #FFF9F0;
  --white: #FFFFFF;
  --dark-text: #252525;
  --light-gray: #F5F7F5;
  --font-heading: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

body {
  font-family: var(--font-body);
  color: var(--dark-text);
  background-color: var(--warm-cream);
  line-height: 1.6;
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  color: var(--dark-text);
  font-weight: 700;
  line-height: 1.25;
}

a {
  color: var(--primary-green);
  text-decoration: none;
  transition: all 0.2s ease;
}

a:hover {
  color: var(--deep-green);
}

.btn-donate {
  background-color: var(--accent-orange) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  padding: 12px 28px !important;
  border-radius: 9999px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 4px 14px rgba(245, 158, 11, 0.35) !important;
  border: none !important;
  cursor: pointer !important;
}

.btn-donate:hover {
  background-color: #D97706 !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(245, 158, 11, 0.45) !important;
}

.btn-volunteer {
  background-color: #ECFDF5 !important;
  color: var(--deep-green) !important;
  font-weight: 600 !important;
  padding: 12px 24px !important;
  border-radius: 9999px !important;
  border: 1px solid #A7F3D0 !important;
  transition: all 0.2s ease !important;
}

.btn-volunteer:hover {
  background-color: #D1FAE5 !important;
}