Define btn-secondary to match btn-primary sizing and alignment.

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

resources/css/app.css

@@ -140,6 +140,45 @@ html.qr-mobile-page body {
         padding: 0.625rem 1.25rem;
     }
 
+    .btn-secondary {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        gap: 0.5rem;
+        border-radius: 9999px;
+        border: 1px solid rgb(226 232 240);
+        background-color: #fff;
+        padding: 0.5rem 1rem;
+        font-size: 0.875rem;
+        line-height: 1.25rem;
+        font-weight: 600;
+        color: rgb(51 65 85);
+        box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+        transition: background-color 0.15s ease, border-color 0.15s ease;
+    }
+
+    .btn-secondary:hover {
+        background-color: rgb(248 250 252);
+        border-color: rgb(203 213 225);
+    }
+
+    .btn-secondary:disabled {
+        opacity: 0.6;
+        pointer-events: none;
+    }
+
+    .btn-group {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: 0.5rem;
+    }
+
+    .btn-group > form {
+        display: inline-flex;
+        margin: 0;
+    }
+
     .btn-fab {
         display: inline-flex;
         height: 2.75rem;

resources/views/frontdesk/service-queues/console.blade.php

@@ -13,7 +13,7 @@
       <h1 class="mt-2 text-xl font-semibold text-slate-900">{{ $counter['name'] ?? 'Counter' }}</h1>
       <p class="mt-1 text-sm text-slate-500">{{ $counter['branch'] ?? '' }} · Ladill Queue console</p>
     </div>
-    <div class="flex gap-2">
+    <div class="btn-group">
       <form method="POST" action="{{ route('frontdesk.service-queues.action', $counterUuid) }}">@csrf<input type="hidden" name="action" value="available"><button class="btn-secondary text-sm">Available</button></form>
       <form method="POST" action="{{ route('frontdesk.service-queues.action', $counterUuid) }}">@csrf<input type="hidden" name="action" value="offline"><button class="btn-secondary text-sm">Offline</button></form>
     </div>