Fix QR show/create mobile layout and action bar styling.

Port the monolith QR mobile CSS (fixed bottom bar, safe-area inset, page background) and restore horizontal padding on create/show pages — shared with Ladill Events.

Co-authored-by: Cursor <cursoragent@cursor.com>

resources/css/app.css

@@ -14,3 +14,65 @@
 [x-cloak] {
     display: none !important;
 }
+
+/* QR create/show: flush mobile action bar to the physical screen bottom (mobile only) */
+@media (max-width: 1023px) {
+    .mobile-action-bar {
+        position: fixed;
+        inset-inline: 0;
+        bottom: 0;
+        z-index: 50;
+        display: flex;
+        flex-direction: column;
+        background-color: #fff;
+    }
+
+    .mobile-action-bar__toolbar {
+        display: flex;
+        height: 4rem;
+        flex-shrink: 0;
+        align-items: center;
+        gap: 0.75rem;
+        border-top: 1px solid rgb(226 232 240);
+        background-color: #fff;
+        padding-inline: 1rem;
+    }
+
+    .mobile-action-bar__inset-fill {
+        flex-shrink: 0;
+        width: 100%;
+        background-color: #fff;
+        height: env(safe-area-inset-bottom, 0px);
+        min-height: max(env(safe-area-inset-bottom, 0px), 20px);
+    }
+}
+
+/* Extra white bleed behind the bar for any remaining viewport gap on mobile */
+.qr-mobile-bottom-bleed {
+    position: fixed;
+    inset-inline: 0;
+    bottom: 0;
+    z-index: 48;
+    pointer-events: none;
+    background-color: #fff;
+    height: calc(4rem + env(safe-area-inset-bottom, 0px) + 24px);
+    min-height: calc(4rem + 24px);
+}
+
+html.qr-mobile-page {
+    background-color: #fff;
+}
+
+html.qr-mobile-page body {
+    background-color: #fff;
+}
+
+.mobile-stats-card {
+    width: calc(66.666667% - 0.5rem);
+}
+
+@media (min-width: 640px) {
+    .mobile-stats-card {
+        width: auto;
+    }
+}

resources/views/layouts/user.blade.php

@@ -45,7 +45,7 @@
 
             <main @class([
                 'flex-1 lg:p-6 lg:pb-6',
-                'p-0 max-lg:pb-[calc(4rem+max(env(safe-area-inset-bottom,0px),20px))]' => $qrMobilePage,
+                'px-4 pt-4 max-lg:pb-[calc(4rem+max(env(safe-area-inset-bottom,0px),20px))]' => $qrMobilePage,
                 'p-0 pb-24 lg:p-6 lg:pb-6' => $mobileFullScreenPage && ! $qrMobilePage,
                 'p-6 pb-24 lg:pb-6' => ! $mobileFullScreenPage,
             ])>