:root {
  --nexa-violet: #6a0dad;
  --nexa-violet-dark: #4b0082;
  --nexa-bg: #2e004f;
  --nexa-text-light: #ffffff;
  --nexa-text-muted: #e6e6e6;
}

/* === Base === */
html, body { height: 100%; }
body {
  background: var(--nexa-bg);
  display: flex;
  flex-direction: column;
}
a { text-decoration: none; }
#app { flex: 1 0 auto; }

/* === Titres === */
h1:not(.title-no-bg),
.h1:not(.title-no-bg) {
  color: var(--nexa-text-light);
  background: var(--nexa-violet);
  padding: 1rem;
  margin-bottom: 1.5rem;
  text-transform: uppercase;
  font-size: 2rem;
}
h1, h2, h3, h4, h5, h6 {
  color: var(--nexa-text-light) !important;
}

/* === Cartes & Widgets === */
.card,
.card-body,
.card-header,
.card-footer {
  background-color: var(--nexa-violet) !important;
  color: var(--nexa-text-light) !important;
  box-shadow: 0 0.3rem 0.75rem rgba(0,0,0,0.15);
}
.card-body { padding: 1.5rem; }

/* === Navbar === */
.navbar,
.navbar-dark,
.bg-dark {
  background-color: var(--nexa-violet-dark) !important;
  color: var(--nexa-text-light) !important;
}
.navbar .nav-link,
.navbar .navbar-brand {
  color: var(--nexa-text-light) !important;
}
.navbar .nav-link:hover,
.navbar .navbar-brand:hover {
  color: #f0e6ff !important;
}
.navbar-brand img { max-height: 75px; max-width: 150px; }
.navbar .nav-link,
.navbar .dropdown-item {
  text-transform: uppercase;
  padding: 0.5rem 0.75rem;
}

/* === Liens === */
a, a:visited {
  color: var(--nexa-text-light) !important;
}
a:hover, a:focus {
  color: #f0e6ff !important;
  text-decoration: underline;
}

/* === Utilisateur === */
.align-self-center h3,
.align-self-center p,
.user-info,
.user-balance,
.user-balance span,
.profile-header {
  color: var(--nexa-text-light) !important;
  font-weight: 600;
}

/* === Listes === */
.list-group-item {
  background-color: var(--nexa-bg);
  color: var(--nexa-text-light) !important;
  border: 1px solid var(--nexa-violet);
}
.list-group-item.active {
  background-color: var(--nexa-violet) !important;
  border-color: var(--nexa-violet-dark) !important;
}
.list-group-item:hover {
  background-color: var(--nexa-violet-dark) !important;
  color: #f0e6ff !important;
}

/* === Textes sombres === */
.text-dark,
.text-muted,
.text-secondary {
  color: var(--nexa-text-muted) !important;
}

/* === Footer === */
footer.text-bg-dark,
footer.text-bg-dark.py-5.text-center.mt-auto {
  background-color: var(--nexa-violet-dark) !important;
  color: var(--nexa-text-light) !important;
}
footer.text-bg-dark a,
footer.text-bg-dark.py-5.text-center.mt-auto a {
  color: var(--nexa-text-light) !important;
}
footer.text-bg-dark a:hover,
footer.text-bg-dark.py-5.text-center.mt-auto a:hover {
  color: #f0e6ff !important;
}

/* === Menu déroulant utilisateur === */
.dropdown-menu {
  background-color: var(--nexa-violet-dark) !important;
  color: var(--nexa-text-light) !important;
  border: 1px solid var(--nexa-violet) !important;
}
.dropdown-menu .dropdown-item {
  color: var(--nexa-text-light) !important;
}
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus {
  background-color: var(--nexa-violet) !important;
  color: #f0e6ff !important;
}

/* === Effets glitch === */
.glitch-title {
  font-family: 'Orbitron', sans-serif;
  color: #c9a0ff !important;
  animation: glitch 1s infinite;
}
.glitch-text {
  font-style: italic;
  color: #f5f5f5 !important;
  opacity: 0.8;
}
.glitch-hint {
  font-size: 0.9rem;
  color: #f5f5f5 !important;
  opacity: 0.6;
}
.glitch-img {
  filter: hue-rotate(270deg) contrast(1.2);
  animation: glitchFade 3s infinite;
}

@keyframes glitch {
  0% { text-shadow: 2px 0 violet, -2px 0 #8a2be2; }
  50% { text-shadow: -2px 0 #c9a0ff, 2px 0 #8a2be2; }
  100% { text-shadow: 2px 0 #8a2be2, -2px 0 violet; }
}

@keyframes glitchFade {
  0% { opacity: 0.6; transform: translate(0, 0); }
  25% { opacity: 0.4; transform: translate(1px, -1px); }
  50% { opacity: 0.6; transform: translate(-1px, 1px); }
  75% { opacity: 0.5; transform: translate(1px, 1px); }
  100% { opacity: 0.6; transform: translate(0, 0); }
}