From f0b60f123ddb99618719557851dde00b865c099a Mon Sep 17 00:00:00 2001
From: chris <chris@chrisedwards.tech>
Date: Tue, 9 Jun 2026 21:05:13 -0400
Subject: [PATCH] Fix store closure message rendering in dark mode

Force explicit light-mode colors with inline styles so Bulma's dark
mode cannot override the closure banner text and background.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 estore/src/components/FeaturedProducts.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/estore/src/components/FeaturedProducts.tsx b/estore/src/components/FeaturedProducts.tsx
index a318ef4..8c3fd65 100644
--- a/estore/src/components/FeaturedProducts.tsx
+++ b/estore/src/components/FeaturedProducts.tsx
@@ -253,10 +253,10 @@ export default function FeaturedProducts() {
         {loading ? (
           <SkeletonGrid />
         ) : storeClosed ? (
-          <div style={{ textAlign: 'center', padding: '4rem 1rem' }}>
+          <div style={{ textAlign: 'center', padding: '4rem 1rem', color: '#363636', background: '#fff' }}>
             <p style={{ fontSize: '4rem', marginBottom: '1rem' }}>🎈</p>
-            <h2 className="title is-3">We&rsquo;re temporarily closed</h2>
-            <p className="has-text-grey" style={{ fontSize: '1.05rem', maxWidth: 480, margin: '0 auto 1.5rem' }}>
+            <h2 className="title is-3" style={{ color: '#363636' }}>We&rsquo;re temporarily closed</h2>
+            <p style={{ fontSize: '1.05rem', maxWidth: 480, margin: '0 auto 1.5rem', color: '#7a7a7a' }}>
               {closeMessage || 'Online ordering is paused right now. Please check back soon or contact us directly.'}
             </p>
             <a href="https://beachpartyballoons.com/contact/" className="button is-info is-medium">