@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');

/* ── Reset background to goonies plum ── */
html,
body,
#app {
  background: #0f0a1a !important;
  min-width: 100vw !important;
  min-height: 100vh !important;
}

/* Replace glassmorphism orbs with goonies palette */
#fixed-bg > div:nth-child(2) {
  background: linear-gradient(135deg, #a98cff, #7b2ff7) !important;
  opacity: 0.18 !important;
}
#fixed-bg > div:nth-child(3) {
  background: linear-gradient(135deg, #e94560, #ff6b8a) !important;
  opacity: 0.14 !important;
}
#fixed-bg > div:nth-child(4) {
  background: linear-gradient(135deg, #c471ed, #a98cff) !important;
  opacity: 0.12 !important;
}

/* ── VT323 everywhere ── */
* {
  font-family: 'VT323', monospace !important;
}

/* ── Hide GitHub badge, language selector, login/admin ── */
.github-badge {
  display: none !important;
}
.absolute.right-4.top-4,
[class*='language-switch'],
.language-selector {
  display: none !important;
}
/* Hide Login nav link (keep Admin visible for logged-in users) */
nav a[href="/login"] {
  display: none !important;
}
nav li:has(a[href="/login"]) {
  display: none !important;
}
/* Hide Login button on home page */
a.glass-button[href="/login"] {
  display: none !important;
}

/* ── Server name: pink VT323 + heart ── */
.font-pacifico {
  font-family: 'VT323', monospace !important;
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: #ff69b4 !important;
  color: #ff69b4 !important;
}
/* Heart emoji already injected by JS patch — no ::after needed */

/* ══════════════════════════════════════════
   Nav bar — match goonies.gg layout:
   logo left, links right, clean & minimal
   ══════════════════════════════════════════ */

/* Nav outer container — match goonies.gg .nav-header */
nav.nav-container {
  background: rgba(15, 10, 26, 0.75) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border: none !important;
  border-bottom: 1px solid rgba(169, 140, 255, 0.1) !important;
  border-radius: 0 !important;
}

/* Hide the original gradient line (replaced by border-bottom above) */
.nav-gradient-line {
  display: none !important;
}

/* Inner nav layout — match goonies.gg .nav-container */
nav .flex.justify-center {
  justify-content: space-between !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  height: auto !important;
  padding: 16px 0 !important;
}
/* Override Tailwind px-4/sm:px-6/lg:px-8 on the max-w-7xl wrapper */
nav .max-w-7xl {
  padding-left: 24px !important;
  padding-right: 24px !important;
}

/* ── Logo (left side) ── */
nav .absolute.left-0 {
  position: relative !important;
  left: auto !important;
}
.logo-link,
.logo-link .logo-text {
  font-family: 'VT323', monospace !important;
  font-weight: 400 !important;
  color: #e94560 !important;
  -webkit-text-fill-color: #e94560 !important;
  font-size: 22px !important;
  letter-spacing: 2px !important;
  text-decoration: none !important;
  background: transparent !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
  border: none !important;
  box-shadow: none !important;
}
.logo-link:hover,
.logo-link:hover .logo-text {
  color: #ff6b8a !important;
  -webkit-text-fill-color: #ff6b8a !important;
  background: transparent !important;
}

/* ── Links container (right side) ── */
nav .hidden.md\:flex {
  display: flex !important;
}
.menu-nav {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}
.nav-glow-bg {
  display: none !important;
}
.item-glow-effect {
  display: none !important;
}
.menu-items-list {
  gap: 8px !important;
  background: transparent !important;
  padding: 0 !important;
}

/* ── Individual nav links ── */
nav a,
nav button,
nav span {
  font-family: 'VT323', monospace !important;
  letter-spacing: 1px !important;
}
.menu-link {
  color: rgba(255, 255, 255, 0.6) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.6) !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  padding: 6px 14px !important;
  border-radius: 0 !important;
  text-decoration: none !important;
}
.menu-link:hover {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: transparent !important;
}
.menu-link.link-active {
  color: rgba(255, 255, 255, 0.9) !important;
}

/* Kill 3D flip animation */
.menu-item-3d {
  perspective: none !important;
  transform-style: flat !important;
  overflow: hidden !important;
}
.menu-item-3d,
.menu-item-3d:hover {
  transform: none !important;
}
.menu-link.menu-back {
  display: none !important;
}
.menu-link.menu-front {
  transform: none !important;
  position: static !important;
  opacity: 1 !important;
}
.menu-item-3d:hover .menu-link.menu-front {
  transform: none !important;
  opacity: 1 !important;
}

/* ── Hide Home link (logo is the home link) ── */
nav li:has(> .menu-item-3d > a[href="/"]) {
  display: none !important;
}
nav .menu-item-wrapper:has(a[href="/"]) {
  display: none !important;
}

/* ── Cards / glass panels → solid goonies cards ── */
/* Scope to main content only, exclude nav */
main [class*="backdrop-blur"],
.glass,
.glassmorphism,
section > [class*="bg-white/"],
section > [class*="bg-black/"] {
  background: rgba(42, 31, 61, 0.9) !important;
  border: 2px solid #a98cff !important;
  border-radius: 10px !important;
  backdrop-filter: none !important;
}

/* ── Primary CTA button (Register Now) ── */
.register-button {
  background: #a98cff !important;
  border: 3px solid #a98cff !important;
  border-radius: 4px !important;
  box-shadow: 4px 4px 0 rgba(0, 0, 0, 0.4) !important;
  color: #0f0a1a !important;
  font-weight: bold !important;
  transition: transform 0.08s ease-out, box-shadow 0.08s ease-out !important;
}
.register-button span,
.register-button svg {
  color: #0f0a1a !important;
  fill: #0f0a1a !important;
}
.register-button:hover {
  transform: translate(-2px, -2px) !important;
  box-shadow: 6px 6px 0 rgba(0, 0, 0, 0.4) !important;
  background: #c4b5fd !important;
  color: #0f0a1a !important;
}

/* ── Secondary button (Login on home page) ── */
.glass-button {
  background: transparent !important;
  border: 3px solid #a98cff !important;
  border-radius: 4px !important;
  box-shadow: 4px 4px 0 rgba(0, 0, 0, 0.3) !important;
  color: #fff !important;
  transition: transform 0.08s ease-out, box-shadow 0.08s ease-out !important;
}
.glass-button span,
.glass-button svg {
  color: #fff !important;
}
.glass-button:hover {
  background: rgba(169, 140, 255, 0.15) !important;
  transform: translate(-2px, -2px) !important;
  box-shadow: 6px 6px 0 rgba(0, 0, 0, 0.3) !important;
  color: #fff !important;
}

/* ── Form submit buttons ── */
button[type="submit"],
button[class*="bg-gradient"],
button[class*="bg-blue"] {
  background: #a98cff !important;
  border: 3px solid #a98cff !important;
  border-radius: 4px !important;
  box-shadow: 4px 4px 0 rgba(0, 0, 0, 0.4) !important;
  color: #0f0a1a !important;
  font-weight: bold !important;
}
button[type="submit"]:hover,
button[class*="bg-gradient"]:hover,
button[class*="bg-blue"]:hover {
  background: #c4b5fd !important;
  transform: translate(-2px, -2px) !important;
  box-shadow: 6px 6px 0 rgba(0, 0, 0, 0.4) !important;
}

/* ── Input fields ── */
input[type="text"],
input[type="password"],
input[type="email"],
textarea,
select {
  background: rgba(15, 10, 26, 0.8) !important;
  border: 2px solid rgba(169, 140, 255, 0.3) !important;
  border-radius: 4px !important;
  color: #e0e0e0 !important;
  font-family: 'VT323', monospace !important;
  font-size: 18px !important;
}
input:focus,
textarea:focus,
select:focus {
  border-color: #a98cff !important;
  box-shadow: 0 0 0 2px rgba(169, 140, 255, 0.2) !important;
}

/* ── Headings ── */
h1, h2, h3 {
  font-family: 'VT323', monospace !important;
  letter-spacing: 2px !important;
}

/* ── Step chips (1. Basic Info, 2. Submit) ── */
.step-chip {
  font-size: 18px !important;
  padding: 6px 16px !important;
}

/* ── Accent colors: links only (not buttons) ── */
p a, span a, footer a, div > a:not([class*="bg-"]):not(nav a) {
  color: #a98cff !important;
}
p a:hover, span a:hover, footer a:hover {
  color: #c4b5fd !important;
}

/* ── Footer ── */
footer,
footer * {
  color: #555 !important;
  font-family: 'VT323', monospace !important;
}
footer a,
footer a * {
  color: #7b2ff7 !important;
}

/* ── Status badges ── */
.text-green-400,
[class*="text-green"] {
  color: #4ade80 !important;
}
.text-red-400,
[class*="text-red"] {
  color: #f87171 !important;
}

/* ── Subtle noise overlay on body ── */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  opacity: 0.03;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 200px 200px;
}
