From 46c60259c9fbe25aeed08194b00ba1253e183bd3 Mon Sep 17 00:00:00 2001
From: isaacclad <sense.corporate@gmail.com>
Date: Wed, 15 Jul 2026 21:31:13 +0000
Subject: [PATCH] Fill customer display promo card with cover image, no shadow.

Drop the soft shadow and letterboxing so the promo photo edge-to-edge
covers the hero card via object-cover.
---
 resources/views/pos/customer-display.blade.php | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/resources/views/pos/customer-display.blade.php b/resources/views/pos/customer-display.blade.php
index 913fe79..0c07c87 100644
--- a/resources/views/pos/customer-display.blade.php
+++ b/resources/views/pos/customer-display.blade.php
@@ -57,12 +57,11 @@
                 {{-- Promo with image: large hero + copy (side-by-side on landscape kiosks) --}}
                 <div x-show="!!state.promo?.image_url"
                      class="flex min-h-0 flex-1 flex-col gap-4 p-4 sm:gap-5 sm:p-6 lg:flex-row lg:items-stretch lg:gap-8 lg:p-8">
-                    {{-- Flex-sized card; image absolutely centered and scaled to fit (object-contain) --}}
-                    <div class="relative min-h-0 max-h-[52vh] flex-[1.35] overflow-hidden rounded-[1.75rem] bg-white shadow-[0_20px_50px_-24px_rgba(15,23,42,0.28)] ring-1 ring-slate-200/90 sm:max-h-[56vh] sm:rounded-[2rem] lg:max-h-none lg:flex-1">
-                        <div class="pointer-events-none absolute inset-0 bg-gradient-to-br from-slate-50 via-white to-indigo-50/30"></div>
+                    {{-- Image fills the card (object-cover), no shadow --}}
+                    <div class="relative min-h-0 max-h-[52vh] flex-[1.35] overflow-hidden rounded-[1.75rem] bg-slate-100 ring-1 ring-slate-200/90 sm:max-h-[56vh] sm:rounded-[2rem] lg:max-h-none lg:flex-1">
                         <img :src="state.promo?.image_url"
                              :alt="state.promo?.headline || state.location_name || 'Promo'"
-                             class="absolute left-1/2 top-1/2 z-[1] max-h-[calc(100%-1.5rem)] max-w-[calc(100%-1.5rem)] -translate-x-1/2 -translate-y-1/2 object-contain object-center sm:max-h-[calc(100%-2rem)] sm:max-w-[calc(100%-2rem)] lg:max-h-[calc(100%-2.5rem)] lg:max-w-[calc(100%-2.5rem)]">
+                             class="absolute inset-0 z-[1] h-full w-full object-cover object-center">
                     </div>
                     <div class="flex shrink-0 flex-col justify-center gap-3.5 px-1 pb-1 text-center sm:gap-4 sm:px-2 lg:w-[min(36%,24rem)] lg:px-1 lg:pb-0 lg:text-left xl:w-[min(34%,26rem)]">
                         <div>