/* public-member/assets/css/main.css */
body { 
    background: #f8fafc; 
    font-family: "Figtree", "Google Sans", sans-serif; 
    color: #1e293b; 
    -webkit-font-smoothing: antialiased;
}
.mono { font-family: 'JetBrains Mono', monospace; }
.mesh-bg { position: fixed; inset: 0; z-index: -1; opacity: 0.5; background-image: radial-gradient(at 0% 0%, #eff6ff 0, transparent 50%), radial-gradient(at 100% 0%, #fff7ed 0, transparent 50%); }

/* Card Tiers */
.elite-card { width: 100%; aspect-ratio: 1.6/1; border-radius: 28px; padding: 24px; position: relative; overflow: hidden; color: white; display: flex; flex-direction: column; justify-content: space-between; box-shadow: 0 25px 50px -12px rgba(0,0,0,0.2); }
.tier-new-guest, .tier-silver { background: linear-gradient(135deg, #94a3b8, #475569); }
.tier-happy-eater { background: linear-gradient(135deg, #34d399, #059669); }
.tier-flavor-hunter { background: linear-gradient(135deg, #60a5fa, #2563eb); }
.tier-foodie-friend { background: linear-gradient(135deg, #c084fc, #7e22ce); }
.tier-gourmet-lover { background: linear-gradient(135deg, #f43f5e, #be123c); }
.tier-master-taster, .tier-gold { background: linear-gradient(135deg, #fbbf24, #b45309); }
.tier-legendary-vip, .tier-platinum { background: linear-gradient(135deg, #1e293b, #000000); }
.tier-heart-of-di-rinting { background: linear-gradient(135deg, #ef4444, #7f1d1d); }

/* Bill / Receipt specific */
.receipt-card { 
    width: 100%; max-width: 400px; background-color: #ffffff; position: relative; 
    border: 1px solid #e2e8f0; border-radius: 24px; overflow: hidden;
}
.divider-dashed { border-bottom: 1px dashed #cbd5e1; }

/* Navigation Bar */
.bottom-nav { 
    position: fixed; bottom: 0; left: 0; right: 0; height: 80px; 
    background: rgba(255,255,255,0.95); backdrop-filter: blur(15px); 
    display: flex; justify-content: space-around; align-items: center; 
    z-index: 100; border-radius: 32px 32px 0 0; 
    box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.05); border-top: 1px solid #f8fafc;
}
.nav-item { flex: 1; text-align: center; color: #94a3b8; font-size: 9px; font-weight: 800; text-transform: uppercase; cursor: pointer; transition: 0.3s; text-decoration: none; }
.nav-item.active { color: #2563eb; }
.nav-item .material-symbols-rounded { font-size: 22px; display: block; margin-bottom: 2px; }

/* ⚡️ Clean Minimalist Backdrop Blur for Sheets */
#bottom-sheet-overlay, 
.fixed.inset-0.bg-slate-900\/50,
.fixed.inset-0.bg-black\/50 {
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    background-color: rgba(15, 23, 42, 0.4) !important; /* ดำจางนวลตากำลังดี */
    z-index: 5000 !important;
}

#bottom-sheet {
    z-index: 5001 !important;
}

#bottom-sheet {
    box-shadow: 0 -12px 30px -5px rgba(0, 0, 0, 0.04);
    border-top: 1px solid rgba(226, 232, 240, 0.6);
}