From 569d0a41e209b8b8ab0c48b3d4c2c83516c8a292 Mon Sep 17 00:00:00 2001
From: Josh Wright <josh@Joshs-MacBook-Pro.local>
Date: Sun, 5 Apr 2026 15:19:46 -0400
Subject: [PATCH] polish: more padding and line spacing in month calendar
 pills, taller min row

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 app/globals.css                  |  2 +-
 components/ParkMonthCalendar.tsx | 10 +++++-----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/app/globals.css b/app/globals.css
index 949c3f0..0de1000 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -118,7 +118,7 @@
 /* sm+: let rows breathe and grow with their content (cells are wide enough) */
 @media (min-width: 640px) {
   .park-calendar-grid {
-    grid-auto-rows: minmax(96px, auto);
+    grid-auto-rows: minmax(108px, auto);
   }
 }
 
diff --git a/components/ParkMonthCalendar.tsx b/components/ParkMonthCalendar.tsx
index c1f0582..86cbd82 100644
--- a/components/ParkMonthCalendar.tsx
+++ b/components/ParkMonthCalendar.tsx
@@ -203,16 +203,16 @@ export function ParkMonthCalendar({ parkId, year, month, monthData, today, timez
                     background: "var(--color-ph-bg)",
                     border: "1px solid var(--color-ph-border)",
                     borderRadius: 5,
-                    padding: "5px 6px",
+                    padding: "8px 6px",
                     textAlign: "center",
                   }}>
                     <div style={{ fontSize: "0.6rem", fontWeight: 700, color: "var(--color-ph-label)", textTransform: "uppercase", letterSpacing: "0.05em" }}>
                       Passholder
                     </div>
-                    <div style={{ fontSize: "0.65rem", color: "var(--color-ph-hours)", marginTop: 3 }}>
+                    <div style={{ fontSize: "0.65rem", color: "var(--color-ph-hours)", marginTop: 4 }}>
                       {dayData.hoursLabel}
                     </div>
-                    <div style={{ fontSize: "0.58rem", color: "var(--color-ph-label)", opacity: 0.75, marginTop: 2, letterSpacing: "0.04em" }}>
+                    <div style={{ fontSize: "0.58rem", color: "var(--color-ph-label)", opacity: 0.75, marginTop: 3, letterSpacing: "0.04em" }}>
                       {tzAbbr}
                     </div>
                   </div>
@@ -221,13 +221,13 @@ export function ParkMonthCalendar({ parkId, year, month, monthData, today, timez
                     background: "var(--color-open-bg)",
                     border: "1px solid var(--color-open-border)",
                     borderRadius: 5,
-                    padding: "5px 6px",
+                    padding: "8px 6px",
                     textAlign: "center",
                   }}>
                     <div style={{ fontSize: "0.65rem", color: "var(--color-open-hours)" }}>
                       {dayData.hoursLabel}
                     </div>
-                    <div style={{ fontSize: "0.58rem", color: "var(--color-open-hours)", opacity: 0.6, marginTop: 3, letterSpacing: "0.04em" }}>
+                    <div style={{ fontSize: "0.58rem", color: "var(--color-open-hours)", opacity: 0.6, marginTop: 4, letterSpacing: "0.04em" }}>
                       {tzAbbr}
                     </div>
                   </div>