/* Eco Well Life — storefront base styles (complements Tailwind CDN) */
:root { color-scheme: light; }
html { font-family: 'Inter', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

/* Headings a touch tighter for a modern look */
h1, h2, h3 { letter-spacing: -0.01em; }

.line-clamp-2 {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.line-clamp-3 {
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Hide number input spinners for a cleaner look */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type="number"] { -moz-appearance: textfield; }

/* Search suggestions dropdown animation */
#search-results:not(.hidden) { animation: fade .12s ease-out; }
@keyframes fade { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

/* HTMX visual hint while fetching suggestions */
.htmx-request #search-input { opacity: .7; }

/* Scroll reveal (progressive enhancement) */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity .6s cubic-bezier(.22,1,.36,1), transform .6s cubic-bezier(.22,1,.36,1); }
.reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}

/* Toast */
.toast {
  position: fixed; left: 50%; bottom: 1.5rem; transform: translateX(-50%);
  z-index: 60; background: #0f172a; color: #fff; font-size: .8125rem;
  padding: .5rem 1rem; border-radius: 9999px; box-shadow: 0 8px 24px rgba(16,24,40,.18);
  opacity: 0; transition: opacity .3s ease; pointer-events: none;
}
