export function PrayerBox({ text }: { text: string }) {
  return (
    <section
      aria-label="Today's prayer"
      className="rounded-2xl border border-[var(--gold)]/30 bg-[var(--gold)]/8 p-6"
      style={{ backgroundColor: "color-mix(in oklab, var(--gold) 8%, transparent)" }}
    >
      <h3 className="font-serif text-xl font-semibold text-primary">Today's Prayer</h3>
      <p className="mt-3 font-serif text-lg italic leading-relaxed text-foreground/85">
        {text}
      </p>
    </section>
  );
}