/* ==========================================================================
   PHP2SHELL CRYPT // GOTHIC NEON DARK AESTHETIC
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@700;900&family=Cinzel:wght@600;700;800;900&family=JetBrains+Mono:wght@400;600;700;800&display=swap');

:root {
  --void-black: #030305;
  --crypt-dark: #07070d;
  --crypt-surface: #0c0c14;
  --crypt-border: #1a1726;
  
  --neon-blood: #ff003c;
  --neon-blood-glow: rgba(255, 0, 60, 0.6);
  --neon-toxic: #00ff66;
  --neon-toxic-glow: rgba(0, 255, 102, 0.5);
  --neon-amber: #ffaa00;
  --neon-amber-glow: rgba(255, 170, 0, 0.5);
  --neon-purple: #bd00ff;
  --neon-purple-glow: rgba(189, 0, 255, 0.5);
  --neon-cyan: #00f0ff;
}

body {
  font-family: 'Cinzel', serif;
  background-color: var(--void-black);
  color: #e2e8f0;
  background-image: 
    radial-gradient(circle at 50% 0%, rgba(255, 0, 60, 0.08) 0%, transparent 60%),
    radial-gradient(circle at 10% 40%, rgba(189, 0, 255, 0.05) 0%, transparent 40%),
    radial-gradient(circle at 90% 70%, rgba(0, 255, 102, 0.03) 0%, transparent 50%),
    linear-gradient(rgba(255, 255, 255, 0.015) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.015) 1px, transparent 1px);
  background-size: 100% 100%, 100% 100%, 100% 100%, 30px 30px, 30px 30px;
}

.font-gothic {
  font-family: 'Cinzel Decorative', 'Cinzel', Georgia, serif;
}

.font-cinzel {
  font-family: 'Cinzel', Georgia, serif;
}

.font-mono {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
}

/* Gothic Neon Glow Effects */
.neon-blood {
  color: var(--neon-blood);
  text-shadow: 0 0 5px var(--neon-blood), 0 0 15px var(--neon-blood-glow), 0 0 30px var(--neon-blood);
}

.neon-toxic {
  color: var(--neon-toxic);
  text-shadow: 0 0 5px var(--neon-toxic), 0 0 15px var(--neon-toxic-glow);
}

.neon-amber {
  color: var(--neon-amber);
  text-shadow: 0 0 5px var(--neon-amber), 0 0 15px var(--neon-amber-glow);
}

.neon-purple {
  color: var(--neon-purple);
  text-shadow: 0 0 5px var(--neon-purple), 0 0 15px var(--neon-purple-glow);
}

.neon-cyan {
  color: var(--neon-cyan);
  text-shadow: 0 0 5px var(--neon-cyan), 0 0 15px rgba(0, 240, 255, 0.4);
}

/* Neon Borders & Shadows */
.box-neon-blood {
  border-color: #ff003c !important;
  box-shadow: 0 0 15px rgba(255, 0, 60, 0.4), inset 0 0 8px rgba(255, 0, 60, 0.2);
}

.box-neon-toxic {
  border-color: #00ff66 !important;
  box-shadow: 0 0 15px rgba(0, 255, 102, 0.4), inset 0 0 8px rgba(0, 255, 102, 0.15);
}

.box-neon-amber {
  border-color: #ffaa00 !important;
  box-shadow: 0 0 15px rgba(255, 170, 0, 0.4), inset 0 0 8px rgba(255, 170, 0, 0.15);
}

.box-neon-purple {
  border-color: #bd00ff !important;
  box-shadow: 0 0 15px rgba(189, 0, 255, 0.4), inset 0 0 8px rgba(189, 0, 255, 0.15);
}

/* Flicker & Glow Animations */
@keyframes occult-pulse {
  0%, 100% {
    opacity: 1;
    filter: drop-shadow(0 0 8px #ff003c);
  }
  50% {
    opacity: 0.7;
    filter: drop-shadow(0 0 2px #ff003c);
  }
}

.animate-occult-pulse {
  animation: occult-pulse 2s ease-in-out infinite;
}

@keyframes neon-flicker {
  0%, 19.999%, 22%, 62.999%, 64%, 64.999%, 70%, 100% {
    opacity: 1;
    text-shadow: 0 0 6px #ff003c, 0 0 15px rgba(255, 0, 60, 0.8), 0 0 30px #ff003c;
  }
  20%, 21.999%, 63%, 63.999%, 65%, 69.999% {
    opacity: 0.35;
    text-shadow: none;
  }
}

.animate-flicker {
  animation: neon-flicker 5s infinite;
}

/* Dark Occult Scrollbar */
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
::-webkit-scrollbar-track {
  background: #030305;
}
::-webkit-scrollbar-thumb {
  background: #2a1122;
  border: 1px solid #ff003c;
  border-radius: 2px;
}
::-webkit-scrollbar-thumb:hover {
  background: #ff003c;
  box-shadow: 0 0 8px #ff003c;
}

/* Inputs & Textareas */
textarea:focus, input:focus, select:focus {
  outline: none;
  border-color: #ff003c !important;
  box-shadow: 0 0 15px rgba(255, 0, 60, 0.5) !important;
}