@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  :root {
    /* Premium Light Mode (Silver/White focused) */
    --background: 210 20% 98%;
    /* Silver-ish White */
    --foreground: 0 0% 5%;
    /* True Black for maximum contrast */

    --card: 0 0% 100%;
    --card-foreground: 0 0% 5%;

    --popover: 0 0% 100%;
    --popover-foreground: 0 0% 5%;

    --primary: 45 93% 47%;
    /* Gold (Yellow-ish) */
    --primary-foreground: 0 0% 5%;
    /* Black text on Gold */

    --secondary: 0 0% 90%;
    /* Light Silver */
    --secondary-foreground: 0 0% 5%;

    --muted: 210 20% 90%;
    --muted-foreground: 215 16% 40%;

    --accent: 45 93% 47%;
    /* Gold */
    --accent-foreground: 0 0% 10%;

    --destructive: 0 84.2% 60.2%;
    --destructive-foreground: 210 40% 98%;

    --border: 0 0% 90%;
    --input: 0 0% 90%;
    --ring: 45 93% 47%;
    /* Gold Ring */

    --radius: 0.5rem;
  }

  .dark {
    /* Luxury Dark Mode (Black/Gold/Silver) */
    --background: 0 0% 5%;
    /* Deepest Black */
    --foreground: 0 0% 100%;
    /* Pure White for max contrast */

    --card: 0 0% 8%;
    /* Dark Gray */
    --card-foreground: 0 0% 100%;

    --popover: 0 0% 8%;
    --popover-foreground: 0 0% 100%;

    --primary: 45 93% 47%;
    /* Gold */
    --primary-foreground: 0 0% 0%;

    --secondary: 0 0% 15%;
    /* Dark Silver/Gray */
    --secondary-foreground: 0 0% 100%;

    --muted: 0 0% 15%;
    --muted-foreground: 0 0% 70%;

    --accent: 0 0% 15%;
    --accent-foreground: 0 0% 98%;

    --destructive: 0 62.8% 30.6%;
    --destructive-foreground: 0 0% 98%;

    --border: 0 0% 20%;
    --input: 0 0% 20%;
    --ring: 45 93% 47%;
  }
}

@layer base {
  * {
    @apply border-border;
  }

  body {
    @apply bg-background text-foreground;
  }
}

/* Subtle Color Changing Background */
@keyframes niceGradient {
  0% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }

  100% {
    background-position: 0% 50%;
  }
}

.bg-animate-subtle {
  background: linear-gradient(-45deg, #ffffff, #f8f5e6, #fffef9, #faf8f0);
  background-size: 400% 400%;
  animation: niceGradient 15s ease infinite;
}

/* Dark mode variant if system pref is dark */
@media (prefers-color-scheme: dark) {
  .bg-animate-subtle {
    background: linear-gradient(-45deg, #1a1a1a, #2a2518, #1f1f1f, #2c2820);
    /* Lighter dark with subtle warm tones */
    background-size: 400% 400%;
  }
}


/* Gold Gradient Text */
.text-gradient-gold {
  @apply bg-clip-text text-transparent bg-gradient-to-r from-yellow-500 via-amber-300 to-yellow-600;
}