/*
Theme Name: Eldritch Child
Theme URI: https://wondersccg.com
Description: Child theme of Eldritch for Call of the Stones Raffle page
Author: Wonders of The First
Author URI: https://wondersccg.com
Template: eldritch
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: eldritch-child
*/

/* Tailwind CSS Base Styles */
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600;700&display=swap');

/* CSS Variables - Design System */
:root {
  --background: 0 0% 0%;
  --foreground: 0 0% 100%;
  --card: 220 20% 12%;
  --card-foreground: 0 0% 100%;
  --popover: 220 20% 12%;
  --popover-foreground: 0 0% 100%;
  --primary: 195 100% 62%;
  --primary-foreground: 0 0% 0%;
  --secondary: 250 60% 35%;
  --secondary-foreground: 0 0% 100%;
  --muted: 220 15% 20%;
  --muted-foreground: 0 0% 70%;
  --accent: 250 80% 60%;
  --accent-foreground: 0 0% 100%;
  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 0 0% 100%;
  --border: 220 15% 20%;
  --input: 220 20% 15%;
  --ring: 195 100% 62%;
  --radius: 0.75rem;
  --shadow-glow: 0 0 40px hsl(195 100% 62% / 0.3);
  --shadow-card: 0 20px 60px hsl(0 0% 0% / 0.5);
}

/* Base Styles */
* {
  border-color: hsl(var(--border));
}

body {
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
  font-family: 'Jost', sans-serif;
}

/* Custom Animations */
@keyframes fade-in {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes gradient-shift {
  0%, 100% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
}

.animate-fade-in {
  animation: fade-in 0.6s ease-out;
}

.animate-gradient-shift {
  animation: gradient-shift 8s ease infinite;
}

.shadow-glow {
  box-shadow: var(--shadow-glow);
}