package main

// footerComponent renders the kraft-paper footer with a torn top edge.
templ footerComponent(data FooterData) {
	<div data-block="coffee:footer" class="coffee-torn-top bg-card text-card-foreground pt-12 pb-8 mt-12">
		<div class="max-w-5xl mx-auto px-6 grid gap-8 md:grid-cols-3 coffee-body">
			<div>
				<h4 class="coffee-display text-xl text-primary mb-2">Hello there</h4>
				<p class="text-sm text-muted-foreground">Pull up a seat. Pastries from 7, coffee until late.</p>
			</div>
			if data.ShowLocation {
				<div>
					<h4 class="coffee-display text-xl text-primary mb-2">Visit</h4>
					<address class="not-italic text-sm text-foreground whitespace-pre-line">42 Roastery Lane
City, State 9000</address>
				</div>
			}
			<div>
				<h4 class="coffee-display text-xl text-primary mb-2">Stay in touch</h4>
				if data.NewsletterText != "" {
					<p class="text-sm text-muted-foreground mb-3">{ data.NewsletterText }</p>
				} else {
					<p class="text-sm text-muted-foreground mb-3">Slow notes from the bar. Brew tips, seasonal pours, no spam.</p>
				}
				<form class="flex gap-2" action="#" method="post" onsubmit="event.preventDefault();">
					<label class="sr-only" for="coffee-newsletter-email">Email</label>
					<input id="coffee-newsletter-email" name="email" type="email" required placeholder="you@cafe.com" class="flex-1 px-3 py-2 text-sm coffee-body bg-input text-foreground border border-border rounded-sm focus:outline-none focus:ring-2 focus:ring-ring"/>
					<button type="submit" class="kraft-tag">Subscribe</button>
				</form>
			</div>
		</div>
		<div class="max-w-5xl mx-auto px-6 mt-10 pt-6 border-t coffee-pencil-rule text-xs coffee-body text-muted-foreground flex flex-wrap gap-2 justify-between">
			<span>© Coffee theme — kraft paper edition.</span>
			<span>Hand-drawn with care.</span>
		</div>
	</div>
}