import { Card } from "@/components/ui/Card";
import { Text } from "@/components/ui/Text";
import { colors } from "@/lib/theme";

export function AssistedOrderExplainer({
  title = "Pharmacist order code",
  body = "You’ll get a GSH-XXXX code to copy, share, or screenshot. A pharmacist enters it on the admin page to create your order — then you pay at the branch.",
}: {
  title?: string;
  body?: string;
}) {
  return (
    <Card tone="brand" elevated={false} style={{ marginBottom: 12 }}>
      <Text variant="h3">{title}</Text>
      <Text variant="bodySm" color={colors.muted} style={{ marginTop: 6 }}>
        {body}
      </Text>
    </Card>
  );
}