/* aurora-theme.css */

/* Root theme variables */
:root {
  --genre-color: #ffffff;
  --genre-bg-video: "";
}

/* Basic genre accent */
body[data-genre] {
  transition: background-color 0.4s ease, box-shadow 0.4s ease;
}

body[data-genre="reggaeton"] {
  background: radial-gradient(circle at top, #FF6A00 0%, #1b1b1b 60%);
}

body[data-genre="rnb"] {
  background: radial-gradient(circle at top, #7A4EC7 0%, #111122 60%);
}

body[data-genre="international_reggae"] {
  background: radial-gradient(circle at top, #2FAF4A 0%, #101810 60%);
}

body[data-genre="hiphop"] {
  background: radial-gradient(circle at top, #1E90FF 0%, #0b0b16 60%);
}

body[data-genre="swing"] {
  background: radial-gradient(circle at top, #D4A037 0%, #1a1408 60%);
}

body[data-genre="heavyrap"] {
  background: radial-gradient(circle at top, #B30000 0%, #080808 60%);
}

body[data-genre="frontiewave"] {
  background: radial-gradient(circle at top, #5A2FD8 0%, #090918 60%);
}

/* Genre accent for buttons, sliders, etc. */
.button-genre,
.slider-genre,
.waveform-accent {
  color: var(--genre-color);
  border-color: var(--genre-color);
}

/* Avatar personality modes */
body[data-avatar-mode="reggaetonBody"] .avatar {
  animation: reggaeton-sway 1.2s infinite ease-in-out;
  box-shadow: 0 0 25px rgba(255, 106, 0, 0.7);
}

body[data-avatar-mode="rnbSmooth"] .avatar {
  animation: rnb-roll 2.4s infinite ease-in-out;
  box-shadow: 0 0 25px rgba(122, 78, 199, 0.7);
}

body[data-avatar-mode="reggaeRelax"] .avatar {
  animation: reggae-sway 2.0s infinite ease-in-out;
  box-shadow: 0 0 25px rgba(47, 175, 74, 0.7);
}

body[data-avatar-mode="hiphopSharp"] .avatar {
  animation: hiphop-nod 0.8s infinite steps(2, end);
  box-shadow: 0 0 25px rgba(30, 144, 255, 0.7);
}

body[data-avatar-mode="swingBounce"] .avatar {
  animation: swing-bounce 1.4s infinite ease-out;
  box-shadow: 0 0 25px rgba(212, 160, 55, 0.7);
}

body[data-avatar-mode="heavyStare"] .avatar {
  animation: heavy-stare 3s infinite linear;
  box-shadow: 0 0 35px rgba(179, 0, 0, 0.9);
}

body[data-avatar-mode="frontierFloat"] .avatar {
  animation: frontier-float 3.2s infinite ease-in-out;
  box-shadow: 0 0 35px rgba(90, 47, 216, 0.9);
}

/* Avatar transition pulse */
body[data-avatar-transition] .avatar {
  transform: scale(1.05);
  filter: brightness(1.2);
}

/* Visualizer modes */
body[data-visualizer-mode="reggaetonPulse"] .visualizer {
  --viz-color: #FF6A00;
  animation: viz-pulse 1s infinite;
}

body[data-visualizer-mode="rnbWaves"] .visualizer {
  --viz-color: #7A4EC7;
  animation: viz-wave 2s infinite;
}

body[data-visualizer-mode="reggaeIsland"] .visualizer {
  --viz-color: #2FAF4A;
  animation: viz-sway 1.8s infinite;
}

body[data-visualizer-mode="hiphopBlocks"] .visualizer {
  --viz-color: #1E90FF;
  animation: viz-blocks 0.8s infinite;
}

body[data-visualizer-mode="swingRetro"] .visualizer {
  --viz-color: #D4A037;
  animation: viz-retro 1.4s infinite;
}

body[data-visualizer-mode="heavySpike"] .visualizer {
  --viz-color: #B30000;
  animation: viz-spike 0.6s infinite;
}

body[data-visualizer-mode="frontierNebula"] .visualizer {
  --viz-color: #5A2FD8;
  animation: viz-nebula 2.6s infinite;
}

/* Visualizer transition flash */
body[data-visualizer-transition] .visualizer {
  filter: brightness(1.4);
}

/* Smart Fader UI (example) */
.smart-fader {
  position: relative;
  width: 240px;
  height: 8px;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  overflow: hidden;
}

.smart-fader__fill {
  position: absolute;
  height: 100%;
  width: 50%;
  background: var(--genre-color);
  transition: width 0.4s ease;
}

/* Keyframes (you can refine later) */

@keyframes reggaeton-sway {
  0% { transform: translateX(-4px) rotate(-1deg); }
  50% { transform: translateX(4px) rotate(1deg); }
  100% { transform: translateX(-4px) rotate(-1deg); }
}

@keyframes rnb-roll {
  0% { transform: rotate(-2deg); }
  50% { transform: rotate(2deg); }
  100% { transform: rotate(-2deg); }
}

@keyframes reggae-sway {
  0% { transform: translateX(-6px); }
  50% { transform: translateX(6px); }
  100% { transform: translateX(-6px); }
}

@keyframes hiphop-nod {
  0% { transform: translateY(0); }
  50% { transform: translateY(4px); }
  100% { transform: translateY(0); }
}

@keyframes swing-bounce {
  0% { transform: translateY(0); }
  40% { transform: translateY(-8px); }
  100% { transform: translateY(0); }
}

@keyframes heavy-stare {
  0% { transform: scale(1); }
  50% { transform: scale(1.02); }
  100% { transform: scale(1); }
}

@keyframes frontier-float {
  0% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
  100% { transform: translateY(0); }
}

@keyframes viz-pulse {
  0% { transform: scaleY(0.6); }
  50% { transform: scaleY(1.2); }
  100% { transform: scaleY(0.6); }
}

@keyframes viz-wave {
  0% { transform: translateX(0); }
  50% { transform: translateX(8px); }
  100% { transform: translateX(0); }
}

@keyframes viz-sway {
  0% { transform: translateX(-4px); }
  50% { transform: translateX(4px); }
  100% { transform: translateX(-4px); }
}

@keyframes viz-blocks {
  0% { transform: scaleY(0.5); }
  50% { transform: scaleY(1.4); }
  100% { transform: scaleY(0.5); }
}

@keyframes viz-retro {
  0% { transform: scaleY(0.7); }
  50% { transform: scaleY(1.3); }
  100% { transform: scaleY(0.7); }
}

@keyframes viz-spike {
  0% { transform: scaleY(0.4); }
  50% { transform: scaleY(1.6); }
  100% { transform: scaleY(0.4); }
}

@keyframes viz-nebula {
  0% { transform: translateY(0) blur(0px); }
  50% { transform: translateY(-4px) blur(2px); }
  100% { transform: translateY(0) blur(0px); }
}