/* BACKGROUND OVERHAUL */
body {
  background-color: #020617 !important;
  background-image: 
    radial-gradient(circle at center, transparent 0%, #020617 95%),
    url('https://images.unsplash.com/photo-1618005182384-a83a8bd57fbe?q=80&w=2564&auto=format&fit=crop'); 
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
}

/* GLASS CARDS */
.card {
  background: rgba(15, 23, 42, 0.45) !important;
  backdrop-filter: blur(12px) saturate(160%);
  border: 1px solid rgba(56, 189, 248, 0.15) !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
  border-radius: 2px !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* CYBER GLOW HOVER */
.card:hover {
  border-color: rgba(56, 189, 248, 0.9) !important;
  box-shadow: 0 0 30px rgba(14, 165, 233, 0.3);
  transform: translateY(-4px) scale(1.01);
}

/* TITLES & TEXT */
h2 {
  color: #38bdf8 !important;
  text-shadow: 0 0 8px rgba(56, 189, 248, 0.5);
  font-family: 'Courier New', Courier, monospace; /* Terminal vibe */
  letter-spacing: 3px;
  font-weight: bold;
}

/* SCANLINE ANIMATION */
body::after {
  content: " ";
  position: fixed;
  top: 0; left: 0; bottom: 0; right: 0;
  background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.1) 50%);
  background-size: 100% 4px;
  z-index: 100;
  pointer-events: none;
  opacity: 0.2;
}

/* STATUS PULSE (CYAN) */
.status-indicator-online {
  background-color: #38bdf8 !important;
  box-shadow: 0 0 12px #38bdf8;
  animation: pulseGlow 2s infinite ease-in-out;
}

@keyframes pulseGlow {
  0% { opacity: 0.5; transform: scale(0.9); }
  50% { opacity: 1; transform: scale(1.1); }
  100% { opacity: 0.5; transform: scale(0.9); }
}
