import { INK, MUTE } from "../theme";

/* Lege staat: gestippeld kader met titel en toelichting */
export default function EmptyState({ title, children }) {
  return (
    <div style={{ border: `2px dashed ${MUTE}`, padding: 24, textAlign: "center", color: MUTE }}>
      <p style={{ margin: 0, fontWeight: 600, color: INK }}>{title}</p>
      <p style={{ margin: "8px 0 0", fontSize: 14 }}>{children}</p>
    </div>
  );
}