'use client'

import { AlertTriangle } from 'lucide-react'

export function InfoBox() {
  return (
    <div className="bg-amber-50 border border-amber-200 rounded-xl p-6">
      <div className="flex items-start gap-4">
        <AlertTriangle className="w-6 h-6 text-amber-600 flex-shrink-0 mt-0.5" />
        <div>
          <h3 className="font-semibold text-amber-900">Wichtiger Hinweis</h3>
          <p className="text-sm text-amber-800 mt-1">
            Diese Backlog-Liste muss vollstaendig abgearbeitet sein, bevor BreakPilot in den
            Produktivbetrieb gehen kann. Alle kritischen Items muessen abgeschlossen sein. Der
            Fortschritt wird lokal im Browser gespeichert und kann mit &quot;Zuruecksetzen&quot;
            auf die Standardwerte zurueckgesetzt werden.
          </p>
          <p className="text-xs text-amber-700 mt-2">
            Letzte Aktualisierung: 2026-02-03
          </p>
        </div>
      </div>
    </div>
  )
}
