/**
 * Galaxia Token (GXA) – Design System
 * App: GXAz · Ecosystem utility token
 * Accent: #C77DFF · Gradient: #C77DFF → #7B5CFF
 * "Chart the Unknown Possibilities of Existence." 🚀
 */

:root {
  /* GXAz branding */
  --gxa-accent: #C77DFF;
  --gxa-accent-from: #C77DFF;
  --gxa-accent-to: #7B5CFF;
  --gxa-glow: rgba(199, 125, 255, 0.4);

  /* Shared design system */
  --galaxia-bg: #05050F;
  --galaxia-nav-bg: #0D0D2B;
  --galaxia-surface: #1A1A4E;
  --galaxia-border: #2A2A5A;
  --galaxia-text: #F0EEFF;
  --galaxia-text-muted: rgba(240, 238, 255, 0.5);
  --galaxia-card-bg: rgba(255, 255, 255, 0.05);
  --galaxia-input-bg: #1A1A4E;
  --galaxia-focus: #00D4FF;
  --galaxia-success: #06D6A0;
  --galaxia-error: #FF6B6B;
  --galaxia-warning: #FFD166;

  /* Typography */
  --font-heading: 'Space Grotesk', system-ui, sans-serif;
  --font-body: 'DM Sans', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;
}

/* Base – never use light backgrounds */
body {
  background: var(--galaxia-bg);
  color: var(--galaxia-text);
  font-family: var(--font-body);
  font-weight: 400;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 600;
}

/* Cards */
.galaxia-card {
  background: var(--galaxia-card-bg);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid var(--galaxia-border);
  border-radius: 16px;
}

/* Primary button – GXAz gradient */
.galaxia-btn-primary {
  background: linear-gradient(135deg, var(--gxa-accent-from), var(--gxa-accent-to));
  color: #F0EEFF;
  border: none;
  border-radius: 12px;
  padding: 12px 24px;
  font-weight: 600;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.galaxia-btn-primary:hover {
  transform: scale(1.03);
  box-shadow: 0 0 24px var(--gxa-glow);
}

/* Secondary button */
.galaxia-btn-secondary {
  background: transparent;
  color: #00D4FF;
  border: 1px solid #00D4FF;
  border-radius: 12px;
  padding: 12px 24px;
  font-weight: 500;
  cursor: pointer;
  transition: opacity 0.2s ease;
}
.galaxia-btn-secondary:hover {
  opacity: 0.9;
}

/* Inputs */
.galaxia-input {
  background: var(--galaxia-input-bg);
  border: 1px solid var(--galaxia-border);
  border-radius: 10px;
  color: var(--galaxia-text);
  padding: 12px 16px;
}
.galaxia-input:focus {
  outline: none;
  border-color: var(--galaxia-focus);
}

/* Nav */
.galaxia-nav {
  background: var(--galaxia-nav-bg);
  border-bottom: 1px solid var(--galaxia-border);
}

/* Logo glow – GXAz accent */
.galaxia-logo {
  filter: drop-shadow(0 0 12px var(--gxa-accent));
}

/* Code / addresses */
.galaxia-mono, .galaxia-address {
  font-family: var(--font-mono);
}

/* Transitions */
.galaxia-enter {
  animation: galaxia-enter 200ms ease-out forwards;
}
@keyframes galaxia-enter {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}