From 07d68cf3bce2d800cbe9b44965d2b63da5eb397a Mon Sep 17 00:00:00 2001
From: DMleadgen <matt@dmleadgen.net>
Date: Fri, 27 Mar 2026 14:17:09 -0600
Subject: [PATCH] fix: restore white form surfaces

---
 components/contact-page.tsx               |  8 ++++----
 components/forms/contact-form.tsx         | 12 ++++++------
 components/forms/request-machine-form.tsx | 14 +++++++-------
 components/request-machine-section.tsx    |  6 +++---
 components/site-chat-widget.tsx           |  2 +-
 5 files changed, 21 insertions(+), 21 deletions(-)

diff --git a/components/contact-page.tsx b/components/contact-page.tsx
index 3cb4e5be..ee95dc0b 100644
--- a/components/contact-page.tsx
+++ b/components/contact-page.tsx
@@ -38,8 +38,8 @@ export function ContactPage() {
         </PublicSurface>
 
         <aside className="space-y-5">
-          <Card className="overflow-hidden rounded-[2rem] border-border/70 shadow-[0_20px_50px_rgba(0,0,0,0.08)]">
-            <CardContent className="bg-[radial-gradient(circle_at_top_left,rgba(196,154,52,0.16),transparent_55%),linear-gradient(180deg,rgba(255,255,255,0.98),rgba(247,244,236,0.98))] p-6">
+          <Card className="overflow-hidden rounded-[2rem] border-border/70 bg-background shadow-[0_20px_50px_rgba(0,0,0,0.08)]">
+            <CardContent className="bg-background p-6">
               <p className="text-xs font-semibold uppercase tracking-[0.18em] text-primary/80">Direct Options</p>
               <h2 className="mt-2 text-2xl font-semibold text-foreground">Reach the team directly</h2>
               <p className="mt-2 text-sm leading-relaxed text-muted-foreground">
@@ -47,7 +47,7 @@ export function ContactPage() {
               </p>
 
               <div className="mt-6 space-y-4">
-                <a href={businessConfig.publicCallUrl} className="flex items-start gap-4 rounded-2xl border border-border/60 bg-background/85 px-4 py-4 transition hover:border-primary/35 hover:bg-primary/[0.04]">
+                <a href={businessConfig.publicCallUrl} className="flex items-start gap-4 rounded-2xl border border-border/60 bg-background px-4 py-4 transition hover:border-primary/35">
                   <div className="flex h-11 w-11 items-center justify-center rounded-full bg-primary/10 text-primary">
                     <Phone className="h-5 w-5" />
                   </div>
@@ -58,7 +58,7 @@ export function ContactPage() {
                   </div>
                 </a>
 
-                <a href={`mailto:${businessConfig.email}?Subject=Rocky%20Mountain%20Vending%20Inquiry`} className="flex items-start gap-4 rounded-2xl border border-border/60 bg-background/85 px-4 py-4 transition hover:border-primary/35 hover:bg-primary/[0.04]">
+                <a href={`mailto:${businessConfig.email}?Subject=Rocky%20Mountain%20Vending%20Inquiry`} className="flex items-start gap-4 rounded-2xl border border-border/60 bg-background px-4 py-4 transition hover:border-primary/35">
                   <div className="flex h-11 w-11 items-center justify-center rounded-full bg-primary/10 text-primary">
                     <Mail className="h-5 w-5" />
                   </div>
diff --git a/components/forms/contact-form.tsx b/components/forms/contact-form.tsx
index 146ab69b..cc78aa9b 100644
--- a/components/forms/contact-form.tsx
+++ b/components/forms/contact-form.tsx
@@ -170,7 +170,7 @@ export function ContactForm({ onSubmit, className }: ContactFormProps) {
         <input id="confirm-email" type="email" {...register("confirmEmail")} className="sr-only" tabIndex={-1} />
       </div>
 
-      <div className="rounded-[1.75rem] border border-border/70 bg-background/85 p-5 shadow-sm md:p-6">
+      <div className="rounded-[1.75rem] border border-border/70 bg-background p-5 shadow-sm md:p-6">
         <PublicSectionHeader
           eyebrow="Step 1"
           title="How should we reach you?"
@@ -229,7 +229,7 @@ export function ContactForm({ onSubmit, className }: ContactFormProps) {
         </div>
       </div>
 
-      <div className="rounded-[1.75rem] border border-border/70 bg-background/85 p-5 shadow-sm md:p-6">
+      <div className="rounded-[1.75rem] border border-border/70 bg-background p-5 shadow-sm md:p-6">
         <PublicSectionHeader
           eyebrow="Step 2"
           title="What do you need help with?"
@@ -257,7 +257,7 @@ export function ContactForm({ onSubmit, className }: ContactFormProps) {
           />
         </div>
 
-        <div className="mt-5 grid gap-3 rounded-2xl border border-primary/10 bg-primary/[0.04] p-4 text-sm text-muted-foreground md:grid-cols-[auto_1fr]">
+        <div className="mt-5 grid gap-3 rounded-2xl border border-border/60 bg-background p-4 text-sm text-muted-foreground md:grid-cols-[auto_1fr]">
           <div className="flex h-10 w-10 items-center justify-center rounded-full bg-primary/10 text-primary">
             <Wrench className="h-4 w-4" />
           </div>
@@ -274,7 +274,7 @@ export function ContactForm({ onSubmit, className }: ContactFormProps) {
         </div>
       </div>
 
-      <div className="rounded-[1.75rem] border border-border/70 bg-background/85 p-5 shadow-sm md:p-6">
+      <div className="rounded-[1.75rem] border border-border/70 bg-background p-5 shadow-sm md:p-6">
         <PublicSectionHeader
           eyebrow="Step 3"
           title="Tell us the details"
@@ -298,7 +298,7 @@ export function ContactForm({ onSubmit, className }: ContactFormProps) {
         </div>
       </div>
 
-      <div className="rounded-[1.75rem] border border-border/70 bg-background/85 p-5 shadow-sm md:p-6">
+      <div className="rounded-[1.75rem] border border-border/70 bg-background p-5 shadow-sm md:p-6">
         <PublicSectionHeader
           eyebrow="Step 4"
           title="Text updates"
@@ -317,7 +317,7 @@ export function ContactForm({ onSubmit, className }: ContactFormProps) {
         </div>
       </div>
 
-      <div className="rounded-[1.5rem] border border-border/60 bg-muted/35 px-4 py-4 text-sm text-muted-foreground">
+      <div className="rounded-[1.5rem] border border-border/60 bg-background px-4 py-4 text-sm text-muted-foreground">
         <div className="flex flex-col gap-3 md:flex-row md:items-start md:justify-between">
           <div className="space-y-1">
             <p className="font-medium text-foreground">Need a faster handoff?</p>
diff --git a/components/forms/request-machine-form.tsx b/components/forms/request-machine-form.tsx
index fb2c7e10..9f3504fe 100644
--- a/components/forms/request-machine-form.tsx
+++ b/components/forms/request-machine-form.tsx
@@ -191,7 +191,7 @@ export function RequestMachineForm({ onSubmit, className }: RequestMachineFormPr
         <input id="confirm-email" type="email" {...register("confirmEmail")} className="sr-only" tabIndex={-1} />
       </div>
 
-      <div className="rounded-[1.75rem] border border-border/70 bg-background/85 p-5 shadow-sm md:p-6">
+      <div className="rounded-[1.75rem] border border-border/70 bg-background p-5 shadow-sm md:p-6">
         <PublicSectionHeader
           eyebrow="Step 1"
           title="Business contact"
@@ -274,21 +274,21 @@ export function RequestMachineForm({ onSubmit, className }: RequestMachineFormPr
         </div>
       </div>
 
-      <div className="rounded-[1.75rem] border border-border/70 bg-background/85 p-5 shadow-sm md:p-6">
+      <div className="rounded-[1.75rem] border border-border/70 bg-background p-5 shadow-sm md:p-6">
         <PublicSectionHeader
           eyebrow="Step 2"
           title="What should we plan for?"
           description="Tell us what kind of setup you'd like so we can recommend the right mix."
         />
 
-        <div className="mt-5 grid gap-3 rounded-[1.5rem] border border-border/60 bg-muted/25 p-4 md:grid-cols-2">
+        <div className="mt-5 grid gap-3 rounded-[1.5rem] border border-border/60 bg-background p-4 md:grid-cols-2">
           {MACHINE_TYPE_OPTIONS.map((option) => {
             const isChecked = selectedMachineTypes.includes(option.value)
             return (
               <label
                 key={option.value}
                 htmlFor={`machine-type-${option.value}`}
-                className="flex cursor-pointer items-start gap-3 rounded-xl border border-border/60 bg-background/90 px-4 py-3 transition hover:border-primary/35 hover:bg-primary/[0.04]"
+                className="flex cursor-pointer items-start gap-3 rounded-xl border border-border/60 bg-background px-4 py-3 transition hover:border-primary/35"
               >
                 <Checkbox
                   id={`machine-type-${option.value}`}
@@ -320,7 +320,7 @@ export function RequestMachineForm({ onSubmit, className }: RequestMachineFormPr
               },
             })}
           />
-          <div className="rounded-2xl border border-primary/10 bg-primary/[0.04] p-4 text-sm text-muted-foreground">
+          <div className="rounded-2xl border border-border/60 bg-background p-4 text-sm text-muted-foreground">
             <div className="flex items-center gap-2 font-medium text-foreground">
               <ClipboardCheck className="h-4 w-4 text-primary" />
               Free placement intake
@@ -332,7 +332,7 @@ export function RequestMachineForm({ onSubmit, className }: RequestMachineFormPr
         </div>
       </div>
 
-      <div className="rounded-[1.75rem] border border-border/70 bg-background/85 p-5 shadow-sm md:p-6">
+      <div className="rounded-[1.75rem] border border-border/70 bg-background p-5 shadow-sm md:p-6">
         <PublicSectionHeader
           eyebrow="Step 3"
           title="Anything else we should know?"
@@ -349,7 +349,7 @@ export function RequestMachineForm({ onSubmit, className }: RequestMachineFormPr
         </div>
       </div>
 
-      <div className="rounded-[1.75rem] border border-border/70 bg-background/85 p-5 shadow-sm md:p-6">
+      <div className="rounded-[1.75rem] border border-border/70 bg-background p-5 shadow-sm md:p-6">
         <PublicSectionHeader
           eyebrow="Step 4"
           title="Text updates"
diff --git a/components/request-machine-section.tsx b/components/request-machine-section.tsx
index 1736994f..469ae1f6 100644
--- a/components/request-machine-section.tsx
+++ b/components/request-machine-section.tsx
@@ -8,10 +8,10 @@ import { businessConfig } from "@/lib/seo-config"
 
 export function RequestMachineSection() {
   return (
-    <section id="request-machine" className="bg-[linear-gradient(180deg,rgba(247,244,236,0.55),rgba(255,255,255,0.98))] py-16 md:py-24">
+    <section id="request-machine" className="bg-background py-16 md:py-24">
       <div className="container mx-auto px-4">
         <div className="grid gap-8 lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)] lg:items-start">
-          <PublicSurface className="bg-[radial-gradient(circle_at_top_left,rgba(196,154,52,0.16),transparent_50%),linear-gradient(180deg,rgba(255,255,255,0.98),rgba(247,244,236,0.98))] p-6 md:p-8 lg:sticky lg:top-28">
+          <PublicSurface className="bg-background p-6 md:p-8 lg:sticky lg:top-28">
             <div className="inline-flex items-center gap-2 rounded-full bg-primary/10 px-3 py-1 text-xs font-semibold uppercase tracking-[0.16em] text-primary">
               <Package className="h-4 w-4" />
               Free Placement
@@ -43,7 +43,7 @@ export function RequestMachineSection() {
             </div>
           </PublicSurface>
 
-          <PublicSurface className="bg-background/95 p-5 md:p-7">
+          <PublicSurface className="bg-background p-5 md:p-7">
             <RequestMachineForm onSubmit={(data) => console.log("Machine request form submitted:", data)} />
           </PublicSurface>
         </div>
diff --git a/components/site-chat-widget.tsx b/components/site-chat-widget.tsx
index d17683ba..3d7105cd 100644
--- a/components/site-chat-widget.tsx
+++ b/components/site-chat-widget.tsx
@@ -567,7 +567,7 @@ export function SiteChatWidget() {
                     placeholder="Describe what you need"
                     rows={3}
                     disabled={isSending}
-                    className="min-h-24 w-full rounded-2xl border border-border/70 bg-background/85 px-4 py-3 text-sm text-foreground outline-none transition placeholder:text-muted-foreground focus:border-primary focus:ring-4 focus:ring-primary/15 disabled:cursor-not-allowed disabled:opacity-60"
+                    className="min-h-24 w-full rounded-2xl border border-border/70 bg-background px-4 py-3 text-sm text-foreground outline-none transition placeholder:text-muted-foreground focus:border-primary focus:ring-4 focus:ring-primary/15 disabled:cursor-not-allowed disabled:opacity-60"
                   />
 
                   <SupportHint