@import 'tailwindcss';
@plugin '@tailwindcss/forms';
@plugin '@tailwindcss/typography';

@theme {
  --font-display: "Orbitron", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
  --font-sans: "Rajdhani", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
  --font-mono: "Share Tech Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  --color-bg: #0b0f17;
  --color-surface: #0f172a; /* slate-900 */
  --color-muted: #94a3b8; /* slate-400 */
  --color-neon: #22d3ee; /* cyan-400 */
  --color-neon-fuchsia: #ff00e5;
  --color-acid: #a3ff12;
  --color-accent: #00ffd1;
  --color-danger: #ff3b81;
}

:root {
  color-scheme: dark;
}

html, body {
  height: 100%;
}

body {
  @apply bg-bg text-white/90 antialiased;
}

/* Utilities */
@utility btn-neon {
  @apply inline-flex items-center gap-2 rounded-md border border-neon/60 px-4 py-2 text-neon transition hover:border-neon hover:text-white focus:outline-none focus:ring-2 focus:ring-neon/50;
  box-shadow: 0 0 12px rgba(34, 211, 238, 0.30);
}

.btn-neon:hover {
  box-shadow: 0 0 24px rgba(34, 211, 238, 0.60);
}

@utility card-surface {
  @apply rounded-xl bg-surface/60 ring-1 ring-white/10 backdrop-blur-md shadow-[0_0_30px_rgba(34,211,238,0.06)] hover:shadow-[0_0_45px_rgba(255,0,229,0.10)] transition;
}

@utility neon-text {
  @apply text-transparent bg-clip-text bg-gradient-to-r from-neon via-accent to-neon-fuchsia;
}
