/* Green Difference Spa - Hero Enhancement + Logo Override */
/* Injected: 2026-07-15 */

/* Smoother font rendering */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Source hero removed from Home.tsx — newhero.js handles all hero styling */

/* Header is solid white (no transparency/blur) per brand directive */

/* Product image glow is now in newhero.css */

/* Scrolling ticker/badge row - soften */
.overflow-hidden .flex.animate-marquee span,
.overflow-hidden .flex span {
  font-weight: 500 !important;
}

/* ============================================================
   LOGO OVERRIDE - Replace green circle icon with "D" logo
   ============================================================ */

/* Hide the old green circle with leaf icon in navbar brand link */
header a[href="/"] > div.rounded-full.bg-brand-green {
  display: none !important;
}

/* Style the injected logo image */
header a[href="/"] > img.gds-logo-mark {
  height: 52px;
  width: auto;
  flex-shrink: 0;
  transition: transform 0.2s ease, filter 0.2s ease;
  filter: drop-shadow(0 1px 3px rgba(0,0,0,0.15));
}

/* Slightly larger on desktop */
@media (min-width: 768px) {
  header a[href="/"] > img.gds-logo-mark {
    height: 56px;
  }
}

/* Hover effect — subtle scale like the old icon had */
header a[href="/"] > img.gds-logo-mark:hover,
header a[href="/"]:hover > img.gds-logo-mark {
  transform: scale(1.05);
  filter: drop-shadow(0 2px 6px rgba(208,152,14,0.3));
}

/* On mobile: also hide the "GDS" text and show logo instead */
header a[href="/"] > div.sm\:hidden {
  display: none !important;
}

/* Make brand link always show as row (for mobile: logo + hidden text) */
header a[href="/"] {
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
}

/* On mobile, show the text columns that were hidden */
@media (max-width: 639px) {
  header a[href="/"] > div.hidden.sm\:flex {
    display: flex !important;
  }
  /* Slightly smaller text on mobile for balance with logo */
  header a[href="/"] > div.hidden.sm\:flex span:first-child {
    font-size: 18px !important;
  }
  header a[href="/"] > img.gds-logo-mark {
    height: 44px;
  }
}

/* Dead data-loc selectors removed (they only exist in Manus dev builds, not Vite production).
   Checkout buttons and nav colors now styled natively in React components. */