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

@layer base {
  html {
    scroll-behavior: smooth;
  }
  
  body {
    font-family: Arial, Helvetica, sans-serif;
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
}

@layer components {
  .btn-primary {
    @apply bg-bulls-blue text-white px-6 py-3 rounded-md font-medium hover:bg-blue-600 transition-colors duration-200;
  }
  
  .btn-secondary {
    @apply bg-white text-bulls-gray border border-gray-300 px-6 py-3 rounded-md font-medium hover:bg-gray-50 transition-colors duration-200;
  }
  
  .section-padding {
    @apply py-16 px-4 sm:px-6 lg:px-8;
  }
  
  .container-max {
    @apply max-w-7xl mx-auto;
  }
  
  .hero-text {
    @apply text-white font-bold tracking-wide;
  }
  
  .product-card {
    @apply bg-white rounded-lg shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300;
  }
  
  .nav-link {
    @apply text-white hover:text-bulls-blue transition-colors duration-200 font-medium;
  }
}