/* ═══════════════════════════════════════════════════════════════
   VynDeal Theme — "Sage" (Light & Fresh greens)
   ─────────────────────────────────────────────────────────────
   The 4th theme. Anchored at #E8EEEC. Light, airy, leafy greens
   throughout — fresh-leaf accents, gentle forest text, soft mint
   surfaces. No brown, no coffee, no brass.
   
   Aesthetic: early-morning spring foliage. Premium without
   feeling heavy. Built for hours of focused work.
   ─────────────────────────────────────────────────────────── */

[data-theme="sage"] {
  /* Backgrounds — soft mint canvas, pure white cards */
  --bg:            #E8EEEC;
  --surface:       #FFFFFF;
  --surface2:      #DCE8E3;
  --card:          #FFFFFF;

  /* Foundation greens — medium forest, never brown */
  --navy:          #1F4D38;
  --text:          #1A3D2E;
  --text2:         #4A6B5C;
  --text3:         #8AA398;

  /* Accents — light, fresh leafy green */
  --purple:        #4FAB7C;
  --purple2:       #3A8862;
  --accent:        #4FAB7C;
  --purplefade:    rgba(79,171,124,.12);

  /* Borders — green-tinted, soft */
  --border:        rgba(79,171,124,.20);
  --border2:       rgba(79,171,124,.30);

  /* Hero / dark sections — medium forest gradient */
  --hero-bg:       linear-gradient(135deg, #1F4D38, #2E6E4F);
  --hero-text:     #F0F7F3;

  /* Buttons */
  --btn-bg:        #4FAB7C;
  --btn-text:      #FFFFFF;

  /* Status colors */
  --red:           #C45A4A;
  --green:         #4FAB7C;
  --amber:         #D4A55F;
}

/* Nav bar */
[data-theme="sage"] .nav {
  background: rgba(244,250,247,.97) !important;
  border-bottom-color: var(--border) !important;
}

/* Nav logo "Deal" accent — fresh green */
[data-theme="sage"] .nav-logo span,
[data-theme="sage"] .footer-logo span {
  color: #4FAB7C !important;
}
[data-theme="sage"] a.nav-logo {
  color: #1A3D2E !important;
}

/* Mega-menu dropdown — pure white card against mint */
[data-theme="sage"] .dropdown {
  background: #FFFFFF !important;
  border-color: rgba(79,171,124,.20) !important;
  box-shadow: 0 12px 40px rgba(31,77,56,.10) !important;
}
[data-theme="sage"] .dropdown a:hover {
  background: rgba(79,171,124,.12) !important;
  color: #3A8862 !important;
}
[data-theme="sage"] .dropdown-title {
  color: #8AA398 !important;
  border-bottom-color: rgba(79,171,124,.20) !important;
}

/* Nav menu items */
[data-theme="sage"] .nav-item > a,
[data-theme="sage"] .nav-item > button {
  color: #4A6B5C !important;
}
[data-theme="sage"] .nav-item > a:hover,
[data-theme="sage"] .nav-item > button:hover {
  color: #3A8862 !important;
  background: rgba(79,171,124,.12) !important;
}

/* Sign in / Start free trial buttons */
[data-theme="sage"] .btn-signin {
  color: #4FAB7C !important;
  border-color: #4FAB7C !important;
}
[data-theme="sage"] .btn-signin:hover {
  background: #4FAB7C !important;
  color: #FFFFFF !important;
}
[data-theme="sage"] .btn-trial {
  background: #4FAB7C !important;
  color: #FFFFFF !important;
}
[data-theme="sage"] .btn-trial:hover {
  background: #3A8862 !important;
}

/* Mobile menu */
[data-theme="sage"] .mobile-menu {
  background: #F4FAF7 !important;
}
[data-theme="sage"] .mobile-menu a,
[data-theme="sage"] .mm-group > button {
  color: #4A6B5C !important;
  border-bottom-color: rgba(79,171,124,.15) !important;
}
[data-theme="sage"] .mm-sub {
  background: rgba(79,171,124,.08) !important;
}
[data-theme="sage"] .mm-signin {
  color: #4FAB7C !important;
}
[data-theme="sage"] .mm-trial {
  background: #4FAB7C !important;
  color: #FFFFFF !important;
}

/* Hamburger lines */
[data-theme="sage"] .hamburger span {
  background: #1A3D2E !important;
}
[data-theme="sage"] .hamburger.open span:nth-child(1),
[data-theme="sage"] .hamburger.open span:nth-child(3) {
  background: #4FAB7C !important;
}

/* Footer — medium forest, not cocoa */
[data-theme="sage"] .footer,
[data-theme="sage"] .vd-footer {
  background: #1F4D38 !important;
}
[data-theme="sage"] .footer-logo span,
[data-theme="sage"] .vd-footer-logo span {
  color: #8FD4B0 !important;
}
[data-theme="sage"] .footer-bottom,
[data-theme="sage"] .vd-footer-bottom {
  border-top-color: rgba(255,255,255,.10) !important;
}

/* Sections with --navy inline become medium forest */
[data-theme="sage"] [style*="background:var(--navy)"] {
  background: #1F4D38 !important;
}
[data-theme="sage"] [style*="background:var(--navy)"] h1,
[data-theme="sage"] [style*="background:var(--navy)"] h2,
[data-theme="sage"] [style*="background:var(--navy)"] h3,
[data-theme="sage"] [style*="background:var(--navy)"] p {
  color: #F0F7F3 !important;
}

/* Gradient sections in sage palette */
[data-theme="sage"] [style*="linear-gradient(135deg,#7c6fff"],
[data-theme="sage"] [style*="linear-gradient(135deg,var(--purple)"],
[data-theme="sage"] [style*="linear-gradient(135deg,var(--accent)"] {
  background: linear-gradient(135deg, #4FAB7C, #3A8862) !important;
}

/* Tag pills — green tint on mint */
[data-theme="sage"] [style*="background:rgba(124,111,255,.12)"],
[data-theme="sage"] .tag {
  background: rgba(79,171,124,.12) !important;
  color: #3A8862 !important;
}

/* Tables — pure white pops on mint canvas */
[data-theme="sage"] table {
  background: #FFFFFF;
}
[data-theme="sage"] th {
  color: #1A3D2E !important;
  background: #F0F7F3;
}
[data-theme="sage"] td {
  color: #4A6B5C !important;
}
[data-theme="sage"] th.vy,
[data-theme="sage"] th[class*="vy"] {
  background: linear-gradient(135deg, #4FAB7C, #3A8862) !important;
  color: #FFFFFF !important;
}
[data-theme="sage"] td.vy {
  background: rgba(79,171,124,.10) !important;
  color: #1A3D2E !important;
  font-weight: 600;
}

/* Hero stat numbers — light leafy green */
[data-theme="sage"] .hero-stat-num,
[data-theme="sage"] [style*="font-size:36px;font-weight:800"] {
  color: #8FD4B0 !important;
}

/* Input fields */
[data-theme="sage"] input,
[data-theme="sage"] textarea,
[data-theme="sage"] select {
  background: #FFFFFF !important;
  color: #1A3D2E !important;
  border-color: rgba(79,171,124,.30) !important;
}
[data-theme="sage"] input:focus,
[data-theme="sage"] textarea:focus,
[data-theme="sage"] select:focus {
  border-color: #4FAB7C !important;
  outline: 2px solid rgba(79,171,124,.20);
  outline-offset: -1px;
}

/* FAQ items */
[data-theme="sage"] [onclick*="toggleFaq"] {
  color: #1A3D2E !important;
}
[data-theme="sage"] [onclick*="toggleFaq"] * {
  color: #1A3D2E !important;
}

/* Theme toggle widget */
[data-theme="sage"] #vd-theme-toggle {
  background: #FFFFFF !important;
  border-color: rgba(79,171,124,.30) !important;
}
[data-theme="sage"] .vd-theme-btn.active {
  background: #4FAB7C !important;
  box-shadow: 0 2px 8px rgba(79,171,124,.30) !important;
}

/* Article body */
[data-theme="sage"] .art-main p,
[data-theme="sage"] .art-main li {
  color: #4A6B5C !important;
}
[data-theme="sage"] .art-main h1,
[data-theme="sage"] .art-main h2,
[data-theme="sage"] .art-main h3 {
  color: #1A3D2E !important;
}
[data-theme="sage"] .art-main strong,
[data-theme="sage"] .art-main b {
  color: #1F4D38 !important;
}

/* Callout boxes — sage palette variants */
[data-theme="sage"] .problem-callout {
  background: rgba(196,90,74,.08) !important;
  border-left-color: #C45A4A !important;
  color: #4A6B5C !important;
}
[data-theme="sage"] .solution-callout {
  background: rgba(79,171,124,.12) !important;
  border-left-color: #4FAB7C !important;
  color: #4A6B5C !important;
}
[data-theme="sage"] .vyndeal-callout {
  background: rgba(143,212,176,.18) !important;
  border-left-color: #4FAB7C !important;
  color: #4A6B5C !important;
}