From 1414ef2c1c6e9697e74575c784995e339a1e4d29 Mon Sep 17 00:00:00 2001
From: gsinghpal <gur_preet.singh@outlook.com>
Date: Thu, 14 May 2026 08:42:26 -0400
Subject: [PATCH] =?UTF-8?q?fix(fusion=5Fclock):=20NFC=20kiosk=20header=20?=
 =?UTF-8?q?=E2=80=94=20center=20logo=20at=20top,=20stack=20clock+date=20be?=
 =?UTF-8?q?low?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 fusion_clock/static/src/scss/nfc_kiosk.scss | 20 +++++++++++---------
 1 file changed, 11 insertions(+), 9 deletions(-)

diff --git a/fusion_clock/static/src/scss/nfc_kiosk.scss b/fusion_clock/static/src/scss/nfc_kiosk.scss
index 51ad317d..64e0fd6c 100644
--- a/fusion_clock/static/src/scss/nfc_kiosk.scss
+++ b/fusion_clock/static/src/scss/nfc_kiosk.scss
@@ -99,14 +99,15 @@ html:has(#nfc_kiosk_root) {
 // ─────────────────────────────────────────────────────────────────────
 // Header chrome — logo, time, date, location, settings
 // ─────────────────────────────────────────────────────────────────────
-// Logo on a subtle frosted-glass pill — just enough lift to keep dark logos
-// readable against the dark gradient, without looking like a glaring sticker.
+// Logo centered at the top, on a subtle frosted-glass pill — just enough lift
+// to keep dark logos readable on the dark gradient.
 .nfc-kiosk__logo {
     position: absolute;
     top: 1.25rem;
-    left: 1.5rem;
+    left: 50%;
+    transform: translateX(-50%);
     max-height: 52px;
-    max-width: 200px;
+    max-width: 220px;
     object-fit: contain;
     background: rgba(255, 255, 255, 0.20);
     backdrop-filter: blur(24px) saturate(180%);
@@ -122,8 +123,8 @@ html:has(#nfc_kiosk_root) {
 }
 
 @keyframes nfc-logo-in {
-    from { opacity: 0; transform: translateY(-12px) scale(0.94); }
-    to   { opacity: 1;  transform: translateY(0) scale(1); }
+    from { opacity: 0; transform: translateX(-50%) translateY(-12px) scale(0.94); }
+    to   { opacity: 1;  transform: translateX(-50%) translateY(0) scale(1); }
 }
 
 .nfc-kiosk__company {
@@ -139,9 +140,10 @@ html:has(#nfc_kiosk_root) {
 // When a logo is present, the company-name text is redundant — hide it.
 .nfc-kiosk__logo ~ .nfc-kiosk__company { display: none; }
 
+// Clock + date stack vertically below the logo, all centered.
 .nfc-kiosk__time {
     position: absolute;
-    top: 1.75rem;
+    top: 6.25rem;            // sits below the logo (logo bottom ≈ 90px)
     left: 50%;
     transform: translateX(-50%);
     font-size: 2.5rem;
@@ -165,10 +167,10 @@ html:has(#nfc_kiosk_root) {
 
 .nfc-kiosk__date {
     position: absolute;
-    top: 5.25rem;
+    top: 9.75rem;            // sits below the time
     left: 50%;
     transform: translateX(-50%);
-    font-size: 0.9rem;
+    font-size: 0.85rem;
     color: var(--nfc-text-muted);
     letter-spacing: 0.05em;
     text-transform: uppercase;