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

@layer base {
  :root {
    --background: 255 255 255;
    --foreground: 42 31 23;
  }

  * {
    @apply font-sans;
  }

  body {
    @apply bg-cream-50 text-brown-900 font-sans;
    font-feature-settings: "rlig" 1, "calt" 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  html {
    scroll-behavior: smooth;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    @apply font-display;
  }
}

@layer utilities {
  .text-balance {
    text-wrap: balance;
  }

  .parallax {
    transform: translateZ(0);
    will-change: transform;
  }

  .glass {
    @apply bg-white/80 backdrop-blur-md border border-pistachio-200/30 shadow-lg;
  }

  .glass-dark {
    @apply bg-brown-900/80 backdrop-blur-md border border-brown-700/30;
  }

  .glow-pistachio {
    box-shadow: 0 0 30px rgba(45, 159, 94, 0.3);
  }

  .glow-gold {
    box-shadow: 0 0 20px rgba(228, 184, 0, 0.4);
  }

  .glow-brown {
    box-shadow: 0 0 30px rgba(156, 127, 95, 0.3);
  }
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  @apply bg-cream-100;
}

::-webkit-scrollbar-thumb {
  @apply bg-pistachio-500 rounded-full;
}

::-webkit-scrollbar-thumb:hover {
  @apply bg-pistachio-600;
}