@import "tailwindcss";

:root {
  --background: #FAF9F6;
  --foreground: #013220;
  --primary: #E2725B;
  --secondary: #8A9A5B;
  --accent: #F4A460;
  --cream: #FAF9F6;
  --deep-forest: #013220;
}

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-primary: var(--primary);
  --color-secondary: var(--secondary);
  --color-accent: var(--accent);
  --color-cream: var(--cream);
  --color-deep-forest: var(--deep-forest);
  --font-serif: "Playfair Display", serif;
  --font-sans: "Inter", sans-serif;
}

@layer base {
  /* Hide scrollbar for Chrome, Safari and Opera */
  .no-scrollbar::-webkit-scrollbar {
    display: none;
  }

  /* Hide scrollbar for IE, Edge and Firefox */
  .no-scrollbar {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
  }

  html {
    scroll-behavior: smooth;
  }
}

body {
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-sans);
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-serif);
}