/* =========================================================
   IMEI-HUB.COM — Particle & Special Effects
   ========================================================= */

/* Neon border glow effect on cards */
.card-glow {
  position: relative;
}
.card-glow::after {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(0,140,255,0.3), transparent 50%, rgba(0,229,255,0.2));
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
  z-index: -1;
}
.card-glow:hover::after { opacity: 1; }

/* Shimmer line */
.shimmer {
  position: relative;
  overflow: hidden;
}
.shimmer::after {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 60%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.04), transparent);
  animation: shimmer-move 2.5s infinite;
}
@keyframes shimmer-move {
  to { left: 200%; }
}

/* Blue line scan */
.scan-line {
  position: relative;
  overflow: hidden;
}
.scan-line::after {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 2px; height: 100%;
  background: linear-gradient(to bottom, transparent, var(--blue-primary), transparent);
  animation: scan-vertical 3s ease infinite;
  opacity: 0.4;
}
@keyframes scan-vertical {
  0%   { top: -100%; }
  100% { top: 100%; }
}

/* Glowing dot pulse */
.pulse-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--cyan-neon);
  animation: pulse-glow 2s ease infinite;
}

/* Status indicators */
.status-available {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.75rem;
  font-weight: 600;
  color: #00C864;
}
.status-available::before {
  content: '';
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #00C864;
  box-shadow: 0 0 6px #00C864;
}
.status-unavailable {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--text-muted);
}
.status-unavailable::before {
  content: '';
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--text-muted);
}
.status-coming-soon {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.75px;
  font-weight: 600;
  color: #FFAA00;
}
.status-coming-soon::before {
  content: '';
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #FFAA00;
  box-shadow: 0 0 6px #FFAA00;
}

/* Number counter */
.stat-number {
  font-size: 2.8rem;
  font-weight: 700;
  background: linear-gradient(135deg, var(--blue-primary), var(--cyan-neon));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  line-height: 1;
}

/* Tech grid background pattern */
.tech-bg {
  background-image:
    linear-gradient(rgba(0,140,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,140,255,0.03) 1px, transparent 1px);
  background-size: 60px 60px;
}

/* Hexagon grid decoration */
.hex-decoration {
  position: absolute;
  width: 300px; height: 300px;
  opacity: 0.03;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='52'%3E%3Cpolygon points='30,2 58,17 58,47 30,62 2,47 2,17' fill='none' stroke='%23008CFF' stroke-width='1'/%3E%3C/svg%3E");
  background-size: 60px 52px;
}

/* Glow rings */
.glow-ring {
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(0,140,255,0.1);
  animation: ring-pulse 4s ease infinite;
}
@keyframes ring-pulse {
  0%, 100% { opacity: 0.4; transform: scale(1); }
  50%       { opacity: 0.1; transform: scale(1.05); }
}
