/* Lizard-Wawi — Custom Styles über Tailwind CDN. */

body {
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
}

.font-mono,
code,
pre {
  font-family: 'Geist Mono', 'JetBrains Mono', 'Fira Code', monospace;
}

/* Dezentes Grid-Pattern auf schwarzem Hintergrund — Linear/Vercel-Style. */
.bg-grid {
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
  background-size: 32px 32px;
}

/* Dashboard-Kacheln — touch-optimiert (min. 44px Tap-Target, hier deutlich größer). */
.tile {
  display: block;
  padding: 1.5rem;
  background: rgb(15 15 15);
  border: 1px solid rgb(38 38 38);
  border-radius: 0.5rem;
  transition: all 0.15s ease;
  min-height: 120px;
}

.tile:hover,
.tile:focus {
  border-color: #00ff88;
  background: rgb(20 20 20);
  outline: none;
}

.tile:active {
  transform: scale(0.98);
}

/* Renderingstil für Shopify body_html im Detail-View (Beschreibung + Nährwert-Tabelle). */
.prose-content {
  color: rgb(212 212 216);
  line-height: 1.6;
}
.prose-content p { margin: 0.5rem 0; }
.prose-content h3 {
  font-size: 0.875rem;
  font-weight: 600;
  color: white;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 1.25rem;
  margin-bottom: 0.5rem;
}
.prose-content ul {
  list-style: disc;
  padding-left: 1.5rem;
  margin: 0.5rem 0;
  color: rgb(161 161 170);
}
.prose-content li { margin: 0.25rem 0; }
.prose-content strong { color: white; font-weight: 500; }

/* Dünne Scrollbar im Bestand-Table. */
.scroll-thin::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
.scroll-thin::-webkit-scrollbar-track {
  background: transparent;
}
.scroll-thin::-webkit-scrollbar-thumb {
  background: rgb(38 38 38);
  border-radius: 4px;
}
.scroll-thin::-webkit-scrollbar-thumb:hover {
  background: rgb(64 64 64);
}