/* Tactical Survival 3D Custom CSS & Visual Polish */
* {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

body {
  font-family: 'Tajawal', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}

/* Glassmorphism Tactical Components */
.glass-tactical {
  background: rgba(12, 20, 16, 0.82);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.tactical-card {
  background: linear-gradient(135deg, rgba(14, 24, 19, 0.92) 0%, rgba(8, 14, 12, 0.96) 100%);
}

.glass-alert {
  background: rgba(185, 28, 28, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.text-gradient-gold {
  background: linear-gradient(135deg, #fef08a 0%, #f59e0b 50%, #d97706 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Shimmer animations on health & shield bars */
.shield-shimmer {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.4) 50%, transparent 100%);
  animation: shimmerMove 2.5s infinite linear;
}

.health-shimmer {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.3) 50%, transparent 100%);
  animation: shimmerMove 3s infinite linear;
}

@keyframes shimmerMove {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

/* Pulse on vital indicator */
.vital-pulse-dot {
  animation: vitalPulse 1.5s infinite ease-in-out;
}
@keyframes vitalPulse {
  0%, 100% { transform: scale(1); opacity: 1; box-shadow: 0 0 0 0 rgba(52, 211, 153, 0.7); }
  50% { transform: scale(1.2); opacity: 0.8; box-shadow: 0 0 0 6px rgba(52, 211, 153, 0); }
}

/* Screen Damage & Shield Flash Vignettes */
#damage-vignette {
  background: radial-gradient(circle at center, transparent 40%, rgba(220, 38, 38, 0.65) 100%);
}
#shield-flash {
  background: radial-gradient(circle at center, transparent 40%, rgba(56, 189, 248, 0.5) 100%);
}

/* Radar Scanline */
.radar-scanline {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 0%, rgba(34, 211, 238, 0.3) 50%, transparent 100%);
  animation: radarScan 2.5s infinite linear;
  pointer-events: none;
}
@keyframes radarScan {
  0% { transform: translateY(-100%); }
  100% { transform: translateY(100%); }
}

/* Weapon slot active state */
.w-slot {
  transition: all 0.15s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.w-slot.active {
  border-color: #f59e0b;
  background: rgba(245, 158, 11, 0.25);
  transform: translateY(-3px);
  box-shadow: 0 4px 15px rgba(245, 158, 11, 0.4);
}

/* Reticle Lines */
.cross-top { transform: translateY(-4px); }
.cross-bottom { transform: translateY(4px); }
.cross-left { transform: translateX(-4px); }
.cross-right { transform: translateX(4px); }

/* Damage Floaters (Combat Numbers) */
.damage-floater {
  position: absolute;
  font-family: 'Orbitron', sans-serif;
  font-weight: 900;
  font-size: 16px;
  pointer-events: none;
  animation: floatDamage 0.8s ease-out forwards;
}
@keyframes floatDamage {
  0% { transform: translate(-50%, -50%) scale(0.6); opacity: 0; }
  20% { transform: translate(-50%, -65%) scale(1.2); opacity: 1; }
  100% { transform: translate(-50%, -100%) scale(0.9); opacity: 0; }
}

/* Fade in modal screens */
@keyframes fadeIn {
  from { opacity: 0; transform: scale(0.96); }
  to { opacity: 1; transform: scale(1); }
}
.animate-fade-in {
  animation: fadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}