/* =========================================
   Moringa MODI – Custom Theme Enhancement
   ========================================= */

/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800&family=Lora:ital,wght@0,600;1,400&display=swap');

/* Root palette */
:root {
  --moringa-dark:   #1a3a0a;
  --moringa-mid:    #2d5a1b;
  --moringa-light:  #4a8a28;
  --moringa-pale:   #a8d878;
  --moringa-cream:  #f7faf0;
  --moringa-gold:   #d4a017;
}

/* Base font */
body, html {
  font-family: 'Nunito', 'Segoe UI', sans-serif !important;
}

/* ---- HEADER ---- */
header {
  background: #fff !important;
  border-bottom: 3px solid var(--moringa-pale) !important;
  box-shadow: 0 2px 12px rgba(45,90,27,0.10) !important;
}

/* ---- HERO BANNER ---- */
.hero-section, [class*="hero"], [class*="banner-container"] {
  border-radius: 12px;
  overflow: hidden;
}

/* ---- PRODUCT CARDS ---- */
.product-card, [class*="product-card"], 
div[class*="grid"] > div[class*="group"] {
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 18px rgba(45,90,27,0.10) !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
  border: 1px solid #e8f5d8 !important;
  background: #fff !important;
}

div[class*="grid"] > div[class*="group"]:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 12px 32px rgba(45,90,27,0.18) !important;
}

/* Product image zoom */
div[class*="group"] img {
  transition: transform 0.4s ease !important;
}
div[class*="group"]:hover img {
  transform: scale(1.06) !important;
}

/* Product name */
div[class*="group"] .font-medium,
div[class*="group"] p.font-medium {
  color: var(--moringa-dark) !important;
  font-weight: 700 !important;
  font-size: 0.98rem !important;
}

/* Price */
.final-price, [class*="final-price"],
p.final-price {
  color: var(--moringa-mid) !important;
  font-size: 1.15rem !important;
  font-weight: 800 !important;
}

/* ---- BUTTONS ---- */
button[class*="bg-navyBlue"],
a[class*="bg-navyBlue"],
button[class*="primary"],
[type="submit"]:not([class*="newsletter"]) {
  background: var(--moringa-mid) !important;
  border-color: var(--moringa-mid) !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  transition: background 0.2s, transform 0.15s !important;
}

button[class*="bg-navyBlue"]:hover,
a[class*="bg-navyBlue"]:hover {
  background: var(--moringa-dark) !important;
  transform: translateY(-2px) !important;
}

/* Add to cart button */
button[class*="cart"], 
button[aria-label*="cart"],
button[aria-label*="Cart"] {
  background: var(--moringa-mid) !important;
  border-radius: 8px !important;
}

/* ---- CATEGORY PAGE ---- */
.category-header, [class*="category-image"] {
  border-radius: 12px !important;
}

/* ---- OFFER BANNER (top ticker) ---- */
div[class*="offer-information"],
.offer-information {
  background: var(--moringa-dark) !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 0.88rem !important;
  letter-spacing: 0.04em !important;
}

/* ---- SERVICES SECTION ---- */
div[class*="services"] svg,
div[class*="service"] svg {
  color: var(--moringa-mid) !important;
}

/* ---- FOOTER ---- */
footer {
  background: var(--moringa-dark) !important;
  color: #d4e8c0 !important;
}
footer a {
  color: var(--moringa-pale) !important;
}
footer a:hover {
  color: #fff !important;
}
footer h4, footer h3, footer .font-semibold {
  color: #fff !important;
}
footer p[class*="footer-text"],
footer .copyright {
  color: #a8d878 !important;
  border-top: 1px solid rgba(168,216,120,0.3) !important;
  padding-top: 12px !important;
}

/* ---- BREADCRUMBS ---- */
nav[aria-label="breadcrumb"] li,
nav[aria-label="breadcrumb"] a {
  color: var(--moringa-mid) !important;
}

/* ---- PRODUCT DETAIL ---- */
.product-title, h1[class*="product"] {
  font-family: 'Lora', serif !important;
  color: var(--moringa-dark) !important;
}

/* ---- PAGE BACKGROUND ---- */
main, #app > div {
  background: var(--moringa-cream) !important;
}

/* ---- NEWSLETTER ---- */
section[class*="newsletter"] {
  background: linear-gradient(135deg, var(--moringa-dark), var(--moringa-mid)) !important;
  border-radius: 12px !important;
}

/* ---- SCROLLBAR ---- */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #f0f7e8; }
::-webkit-scrollbar-thumb { background: var(--moringa-light); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--moringa-dark); }