/* =========================================================
   Gruenfeld Lohnunternehmen & Handel
   Design-Tokens: Feld-Gruen, Werkstatt-Stahl, Diesel-Rost, Weizen-Gold
   ========================================================= */

@import url("https://fonts.googleapis.com/css2?family=Rajdhani:wght@500;600;700&family=Archivo:wght@600;700;800&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@500;600&display=swap");

:root {
  --field-900: #1c2417;
  --field-800: #2a3521;
  --field-700: #3c4a2d;
  --field-600: #4f6238;
  --steel-800: #2b2f31;
  --steel-600: #4a5054;
  --steel-300: #b9c0c2;
  --wheat-500: #d8a73e;
  --wheat-400: #e6bc5c;
  --rust-600: #b4502b;
  --rust-500: #c96538;
  --cream-100: #f4f0e4;
  --cream-50: #faf8f2;
  --ok-500: #4f8a3f;
  --danger-500: #b4402e;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: "Inter", system-ui, sans-serif;
  background: var(--cream-100);
  color: var(--steel-800);
  margin: 0;
}

.font-display {
  font-family: "Archivo", "Rajdhani", sans-serif;
  letter-spacing: -0.01em;
}

.font-technical {
  font-family: "Rajdhani", sans-serif;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.font-mono {
  font-family: "JetBrains Mono", monospace;
}

/* Feld-Furchen Hintergrundmuster fuer Hero-Bereiche */
.field-rows {
  background-image: repeating-linear-gradient(
    100deg,
    rgba(244, 240, 228, 0.05) 0px,
    rgba(244, 240, 228, 0.05) 2px,
    transparent 2px,
    transparent 34px
  );
}

/* Stempel-Look fuer Status-Badges auf Maschinenkarten */
.stamp {
  display: inline-block;
  transform: rotate(-8deg);
  border: 3px solid currentColor;
  border-radius: 6px;
  padding: 0.15rem 0.75rem;
  font-family: "Rajdhani", sans-serif;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  opacity: 0.92;
}

.stamp-sold {
  color: var(--rust-600);
}

.stamp-sale {
  color: var(--ok-500);
}

.stamp-own {
  color: var(--steel-600);
}

.stamp-customer {
  color: var(--wheat-500);
}

/* Scrollbar dezent */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--cream-100); }
::-webkit-scrollbar-thumb { background: var(--field-600); border-radius: 6px; }

/* Fokus-Sichtbarkeit */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--wheat-500);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}

/* Ticket-Karte fuer Slot-Auswahl */
.slot-btn {
  border: 2px solid var(--field-700);
  transition: all 0.15s ease;
}
.slot-btn:hover:not(:disabled) {
  background: var(--field-700);
  color: var(--cream-50);
}
.slot-btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
  text-decoration: line-through;
}

.card-hover {
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.card-hover:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 30px -12px rgba(28, 36, 23, 0.35);
}
