/* Custom CSS for Vietcombank Priority Event Check-in System */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400;1,600&family=Cinzel:wght@500;600;700;800;900&family=Playfair+Display:ital,wght@0,600;0,700;1,600&display=swap');

:root {
  --vcb-green: #005A36;
  --vcb-green-dark: #003B23;
  --vcb-green-light: #71BE44;
  --vcb-gold: #D4AF37;
  --vcb-gold-light: #F7E4A8;
  --vcb-gold-gradient: linear-gradient(135deg, #ECC876 0%, #D4AF37 50%, #997420 100%);
  --vcb-bg: #03140D;
}

body {
  font-family: 'Montserrat', sans-serif;
  background-color: var(--vcb-bg);
  -webkit-tap-highlight-color: transparent;
}

.font-priority {
  font-family: 'Cinzel', serif;
  letter-spacing: 0.15em;
}

.font-serif-title {
  font-family: 'Playfair Display', serif;
}

/* Vietcombank Priority Gold Text Gradient */
.gold-text-gradient {
  background: linear-gradient(135deg, #F9F1D8 0%, #E7C978 40%, #D4AF37 70%, #AB852A 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Glassmorphism Vietcombank Style */
.glass-panel {
  background: rgba(4, 28, 18, 0.78);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(212, 175, 55, 0.2);
}

.glass-card {
  background: rgba(6, 38, 25, 0.65);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(212, 175, 55, 0.12);
}

.glass-card:hover {
  border-color: rgba(212, 175, 55, 0.35);
}

/* Pulse animation for live status */
@keyframes pulse-live {
  0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(113, 190, 68, 0.7); }
  70% { transform: scale(1); box-shadow: 0 0 0 8px rgba(113, 190, 68, 0); }
  100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(113, 190, 68, 0); }
}

.live-badge {
  animation: pulse-live 2s infinite;
}

/* Row highlight on realtime update */
@keyframes flash-update {
  0% { background-color: rgba(113, 190, 68, 0.35); }
  100% { background-color: transparent; }
}

.row-updated {
  animation: flash-update 2.5s ease-out;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: rgba(3, 20, 13, 0.8);
}
::-webkit-scrollbar-thumb {
  background: rgba(212, 175, 55, 0.35);
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(212, 175, 55, 0.7);
}