/* =========================================
   Parwan — Light gray + soft gold (NO dark green)
   Load LAST — wave86
   ========================================= */

:root {
  --pw-gray-50: #F7F8FA;
  --pw-gray-100: #F0F2F5;
  --pw-gray-200: #E8EAED;
  --pw-gray-300: #D1D5DB;
  --pw-gray-400: #9CA3AF;
  --pw-gray-500: #6B7280;
  --pw-gray-600: #4B5563;
  --pw-gray-700: #374151;
  --pw-gray-800: #2D3238;

  --pw-gold-soft: #F3EBD8;
  --pw-gold-light: #E8DCC4;
  --pw-gold: #D4BC8A;
  --pw-gold-deep: #C4A86E;

  --pw-footer-bg: #2D3238;
  --pw-footer-bg-dark: #1F2937;
  --pw-footer-text: rgba(255, 255, 255, 0.84);
  --pw-footer-muted: rgba(255, 255, 255, 0.68);
  --pw-footer-heading: #F5F0E6;
  --pw-footer-accent: #D4BC8A;
}

/* —— LIGHT (default look user wants) —— */
:root,
[data-theme="light"] {
  --green: var(--pw-gold);
  --green-dark: var(--pw-gray-700);
  --green-deep: var(--pw-gray-700);
  --green-mid: var(--pw-gold);
  --green-soft: rgba(212, 188, 138, 0.12);
  --accent: var(--pw-gold-deep);
  --accent-hover: var(--pw-gold);
  --peach: var(--pw-gold-light);
  --gold: var(--pw-gold);
  --bg: var(--pw-gray-100);
  --bg-light: #FFFFFF;
  --text: var(--pw-gray-600);
  --text-main: var(--pw-gray-600);
  --muted: var(--pw-gray-500);
  --heading: var(--pw-gray-700);
  --ink: var(--pw-gray-600);
  --line: var(--pw-gray-200);
  --border: var(--pw-gray-200);
  --surface: #FFFFFF;
  --surface-2: var(--pw-gray-50);
  --card-bg: #FFFFFF;
  --white: #FFFFFF;
  --primary: var(--pw-gold-deep);
  --loader-bg: var(--pw-gray-100);
  --shadow: 0 10px 28px rgba(55, 65, 81, 0.07);
}

/* —— DARK toggle = soft charcoal gray, still NO green —— */
[data-theme="dark"] {
  --green: var(--pw-gold-light);
  --green-dark: var(--pw-gray-200);
  --green-deep: var(--pw-gray-200);
  --green-mid: var(--pw-gold-light);
  --green-soft: rgba(232, 220, 196, 0.08);
  --accent: var(--pw-gold-light);
  --accent-hover: var(--pw-gold);
  --peach: var(--pw-gold-light);
  --gold: var(--pw-gold);
  --bg: var(--pw-gray-800);
  --bg-light: #363C44;
  --text: var(--pw-gray-200);
  --text-main: var(--pw-gray-200);
  --muted: var(--pw-gray-400);
  --heading: #FFFFFF;
  --ink: var(--pw-gray-200);
  --line: rgba(232, 234, 237, 0.12);
  --border: rgba(232, 234, 237, 0.12);
  --surface: #363C44;
  --surface-2: #404650;
  --card-bg: #363C44;
  --white: #363C44;
  --primary: var(--pw-gold-light);
  --loader-bg: var(--pw-gray-800);
  --shadow: 0 14px 36px rgba(0, 0, 0, 0.28);
}

html[data-theme="light"] {
  background: var(--pw-gray-100) !important;
  color: var(--pw-gray-600) !important;
}
html[data-theme="dark"] {
  background: var(--pw-gray-800) !important;
  color: var(--pw-gray-200) !important;
}

body.page-wave,
body.page-home,
body.page-story,
body.page-cinema {
  background: var(--bg) !important;
  color: var(--text) !important;
}

/* —— Buttons — soft gold, gray text —— */
.page-wave .btn-wave,
.page-story .btn-wave,
.btn-wave {
  background: linear-gradient(135deg, var(--pw-gold) 0%, var(--pw-gold-light) 100%) !important;
  color: var(--pw-gray-700) !important;
  border: none !important;
  box-shadow: 0 8px 22px rgba(196, 168, 110, 0.22) !important;
}
.page-wave .btn-wave:hover,
.btn-wave:hover {
  background: linear-gradient(135deg, var(--pw-gold-deep) 0%, var(--pw-gold) 100%) !important;
  box-shadow: 0 12px 28px rgba(196, 168, 110, 0.28) !important;
}

.page-wave .btn-wave-outline,
.btn-wave-outline {
  background: #FFFFFF !important;
  color: var(--pw-gray-600) !important;
  border-color: var(--pw-gray-300) !important;
}
[data-theme="dark"] .btn-wave-outline {
  background: rgba(255, 255, 255, 0.05) !important;
  color: var(--pw-gray-200) !important;
  border-color: rgba(232, 234, 237, 0.2) !important;
}
.btn-wave-outline:hover {
  background: var(--pw-gold-soft) !important;
  border-color: var(--pw-gold) !important;
  color: var(--pw-gray-700) !important;
}
[data-theme="dark"] .btn-wave-outline:hover {
  color: var(--pw-gold-light) !important;
}

.wave-header .nav-links .nav-cta,
.nav-links .nav-cta {
  background: linear-gradient(135deg, var(--pw-gold-deep), var(--pw-gold)) !important;
  color: var(--pw-gray-700) !important;
}
.wave-header .nav-links .nav-cta:hover {
  background: linear-gradient(135deg, var(--pw-gold), var(--pw-gold-light)) !important;
}

/* —— Header — white, gray links, gold hover —— */
.wave-header .brand-text strong,
[data-theme="dark"] .wave-header .brand-text strong {
  color: var(--pw-gray-700) !important;
}
.wave-header .brand-text span {
  color: var(--pw-gray-500) !important;
}
.wave-header .nav-links > a,
[data-theme="dark"] .wave-header .nav-links > a,
[data-theme="dark"] .wave-header .nav-more-btn {
  color: var(--pw-gray-600) !important;
}
.wave-header .nav-links > a::after,
[data-theme="dark"] .wave-header .nav-links > a::after {
  background: var(--pw-gold) !important;
}
.wave-header .nav-links > a:hover,
.wave-header .nav-links > a.active,
[data-theme="dark"] .wave-header .nav-links > a:hover,
[data-theme="dark"] .wave-header .nav-links > a.active {
  color: var(--pw-gold-deep) !important;
}
[data-theme="dark"] .wave-header .nav-more-menu a:hover {
  background: var(--pw-gold-soft) !important;
}

/* —— Kickers & stats — gold + gray only —— */
.page-wave .wave-kicker,
.page-wave [class*="-kicker"],
.page-wave .hm-care-kicker,
.page-wave .hm-credo-kicker,
.page-info .info-kicker {
  color: var(--pw-gold-deep) !important;
}
[data-theme="dark"] .page-wave .wave-kicker,
[data-theme="dark"] .page-wave [class*="-kicker"] {
  color: var(--pw-gold-light) !important;
}

.page-wave .stat-card h3,
.page-cinema .stat-card h3 {
  color: var(--pw-gold-deep) !important;
}
[data-theme="dark"] .page-wave .stat-card h3,
[data-theme="dark"] .page-cinema .stat-card h3 {
  color: var(--pw-gold-light) !important;
}

.page-wave .section-title h2,
[data-theme="dark"] .page-wave .section-title h2 {
  color: var(--heading) !important;
}

/* —— Cards — white on light gray —— */
[data-theme="light"] .page-wave .stat-card,
[data-theme="light"] .page-cinema .pw-why-card {
  background: #FFFFFF !important;
  border-color: var(--pw-gray-200) !important;
  box-shadow: 0 6px 20px rgba(55, 65, 81, 0.06) !important;
}
[data-theme="dark"] .page-wave .stat-card,
[data-theme="dark"] .page-cinema .pw-why-card {
  background: var(--surface) !important;
  border-color: rgba(232, 234, 237, 0.1) !important;
}

.page-wave .urdu-section,
.page-cinema .urdu-section {
  border-left-color: var(--pw-gold) !important;
  background: #FFFFFF !important;
}
[data-theme="dark"] .page-wave .urdu-section,
[data-theme="dark"] .page-cinema .urdu-section {
  background: var(--surface) !important;
  border-left-color: var(--pw-gold-light) !important;
}

/* —— Header — white bar matches logo.png background —— */
.wave-header.site-header,
.page-jfi .pw-jfi-header.site-header {
  background: #ffffff !important;
  border-bottom: 1px solid #E8EAED !important;
}

.wave-header.site-header .brand img,
.page-wave .wave-header .brand img,
.site-header.wave-header .brand img,
.page-jfi .pw-jfi-header .brand img {
  background: transparent !important;
}

/* —— Footer — dark charcoal + gold (no green) —— */
.site-footer {
  background: #2D3238 !important;
  color: rgba(255, 255, 255, 0.82) !important;
  border-top: none !important;
}
.site-footer h4,
.site-footer .phone {
  color: #C9A86E !important;
}
.site-footer a {
  color: rgba(255, 255, 255, 0.58) !important;
}
.site-footer a:hover {
  color: #D4BC8A !important;
}
.site-footer .footer-about p {
  color: var(--pw-footer-muted) !important;
}
.site-footer .footer-bottom {
  border-top-color: rgba(255, 255, 255, 0.12) !important;
  color: var(--pw-footer-muted) !important;
}
.site-footer .footer-bottom .tag {
  color: var(--pw-footer-accent) !important;
}
[data-theme="dark"] .site-footer {
  background: var(--pw-footer-bg-dark) !important;
  color: var(--pw-footer-text) !important;
}
[data-theme="dark"] .site-footer h4,
[data-theme="dark"] .site-footer .phone {
  color: var(--pw-footer-heading) !important;
}

[data-theme="light"] .wave-below {
  background: var(--pw-gray-100) !important;
}
[data-theme="dark"] .wave-below {
  background: var(--pw-gray-800) !important;
}

.wave-blob-main {
  background: rgba(212, 188, 138, 0.08) !important;
}
.wave-blob-corner {
  background: rgba(232, 234, 237, 0.12) !important;
}

.back-top {
  background: var(--pw-gold) !important;
  color: var(--pw-gray-700) !important;
}

[data-theme="dark"] .mobile-action-bar {
  background: rgba(45, 50, 56, 0.96) !important;
  border-top-color: rgba(232, 234, 237, 0.12) !important;
}

/* —— Cinema hero — light gray feel —— */
.page-cinema {
  --pw-deep: var(--pw-gray-100);
  --pw-navy: #FFFFFF;
  --pw-warm: var(--pw-gold-deep);
  --pw-warm-soft: var(--pw-gold-light);
  --pw-violet: var(--pw-gray-400);
  --pw-blue: var(--pw-gray-400);
  --pw-text: var(--pw-gray-700);
  --pw-muted: var(--pw-gray-500);
}
[data-theme="dark"] .page-cinema {
  --pw-deep: var(--pw-gray-800);
  --pw-navy: #363C44;
  --pw-text: var(--pw-gray-200);
  --pw-muted: var(--pw-gray-400);
}

[data-theme="light"] .page-cinema .pw-hero-pro-mesh {
  background:
    radial-gradient(ellipse 55% 45% at 12% 20%, rgba(212, 188, 138, 0.14), transparent 65%),
    radial-gradient(ellipse 45% 50% at 88% 75%, rgba(232, 234, 237, 0.5), transparent 60%),
    linear-gradient(160deg, #F0F2F5 0%, #F7F8FA 50%, #E8EAED 100%) !important;
}
[data-theme="dark"] .page-cinema .pw-hero-pro-mesh {
  background:
    radial-gradient(ellipse 55% 45% at 12% 20%, rgba(212, 188, 138, 0.08), transparent 65%),
    radial-gradient(ellipse 45% 50% at 88% 75%, rgba(232, 234, 237, 0.04), transparent 60%),
    linear-gradient(160deg, #2D3238 0%, #363C44 50%, #404650 100%) !important;
}

.page-cinema .pw-hero-pro-frames {
  box-shadow: 0 24px 48px rgba(55, 65, 81, 0.1), 0 0 0 1px var(--pw-gray-200) !important;
}
[data-theme="dark"] .page-cinema .pw-hero-pro-frames {
  background: #363C44 !important;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(232, 234, 237, 0.08) !important;
}
[data-theme="light"] .page-cinema .pw-hero-pro-frames {
  background: #FFFFFF !important;
}

.page-cinema .pw-hero-pro-ring {
  border-color: rgba(212, 188, 138, 0.35) !important;
}
.page-cinema .pw-cinema-dot.is-active {
  background: linear-gradient(90deg, var(--pw-gold-deep), var(--pw-gold-light)) !important;
}
.page-cinema .pw-cinema-progress span {
  background: linear-gradient(90deg, var(--pw-gray-400), var(--pw-gold), var(--pw-gold-light)) !important;
}

.page-cinema .btn-wave {
  background: linear-gradient(135deg, var(--pw-gold-deep), var(--pw-gold)) !important;
  color: var(--pw-gray-700) !important;
}
.page-cinema .btn-wave-outline {
  color: var(--pw-gray-600) !important;
  border-color: var(--pw-gray-300) !important;
  background: #FFFFFF !important;
}
[data-theme="dark"] .page-cinema .btn-wave-outline {
  background: rgba(255, 255, 255, 0.05) !important;
  color: var(--pw-gray-200) !important;
  border-color: rgba(232, 234, 237, 0.2) !important;
}

[data-theme="light"] .page-cinema .hm-credo {
  background: linear-gradient(155deg, #F0F2F5 0%, #FFFFFF 50%, #F7F8FA 100%) !important;
  color: var(--pw-gray-700) !important;
}
[data-theme="dark"] .page-cinema .hm-credo {
  background: linear-gradient(155deg, #2D3238 0%, #363C44 50%, #404650 100%) !important;
}
.page-cinema .hm-credo-line {
  background: linear-gradient(90deg, transparent, var(--pw-gold), var(--pw-gray-300), transparent) !important;
}

.page-contact .ct-hero-main,
.page-causes .cz-hero-main,
.page-achievements .ah-hero-main,
.page-stories .st-hero-main {
  background: #FFFFFF !important;
  box-shadow: 0 20px 44px rgba(55, 65, 81, 0.08) !important;
}
[data-theme="dark"] .page-contact .ct-hero-main,
[data-theme="dark"] .page-causes .cz-hero-main,
[data-theme="dark"] .page-achievements .ah-hero-main,
[data-theme="dark"] .page-stories .st-hero-main {
  background: #363C44 !important;
  box-shadow: 0 20px 44px rgba(0, 0, 0, 0.25) !important;
}