@import "tailwindcss";

@theme {
  --color-brand: #f59e0b; /* Amber 500 */
  --color-bg: #0a0a0c;
  --color-surface: #16161a;
}

@layer base {
  body {
    @apply bg-bg text-white selection:bg-brand selection:text-black;
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
  }
}

@layer components {
  .nav-link {
    @apply text-gray-400 hover:text-brand transition-colors font-medium px-3 py-2 rounded-lg;
  }
  .nav-link.active {
    @apply text-brand bg-brand/10;
  }
  
  .btn-primary {
    @apply bg-brand text-black font-bold px-6 py-3 rounded-xl hover:bg-white transition-all active:scale-95;
  }
  
  .section-title {
    @apply text-3xl md:text-4xl font-black mb-8 flex items-center gap-4;
  }
  .section-title::after {
    content: '';
    @apply h-1 flex-grow bg-gradient-to-r from-brand to-transparent rounded-full;
  }

  .glass-card {
    @apply bg-white/5 backdrop-blur-md border border-white/10 rounded-2xl p-6;
  }
}

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

.animate-fade-in {
  animation: fadeIn 0.8s ease forwards;
}

/* Hide scrollbar but keep functionality */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Map Placeholder Styling */
.map-placeholder {
  background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url('https://tse-mm.bing.com/th?q=map+location+satellite');
  background-size: cover;
  background-position: center;
}
