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

@layer base {
  html {
    scroll-behavior: smooth;
  }

  body {
    @apply bg-cream-50 text-gray-900 antialiased;
  }

  [lang='ur'] body {
    font-family: var(--font-urdu), var(--font-arabic), var(--font-inter), system-ui,
      sans-serif;
  }

  [lang='ar'] body,
  [lang='fa'] body {
    font-family: var(--font-arabic), var(--font-inter), system-ui, sans-serif;
  }

  [lang='ur'] .font-display {
    font-family: var(--font-urdu), var(--font-playfair), Georgia, serif;
  }

  [lang='ar'] .font-display,
  [lang='fa'] .font-display {
    font-family: var(--font-arabic), var(--font-playfair), Georgia, serif;
  }
}

@layer components {
  .btn-primary {
    @apply inline-flex items-center justify-center gap-2 rounded-lg bg-brand-700 px-6 py-3 text-sm font-semibold text-white shadow-premium transition-all duration-200 hover:bg-brand-800 hover:shadow-premium-lg active:scale-[0.98] disabled:cursor-not-allowed disabled:opacity-50;
  }

  .btn-secondary {
    @apply inline-flex items-center justify-center gap-2 rounded-lg border-2 border-brand-700 bg-white px-6 py-3 text-sm font-semibold text-brand-700 transition-all duration-200 hover:bg-brand-50 active:scale-[0.98];
  }

  .btn-gold {
    @apply inline-flex items-center justify-center gap-2 rounded-lg bg-gradient-to-r from-gold-500 to-gold-600 px-6 py-3 text-sm font-semibold text-white shadow-gold transition-all duration-200 hover:from-gold-600 hover:to-gold-700 active:scale-[0.98];
  }

  .card-premium {
    @apply rounded-2xl border border-cream-300/60 bg-white shadow-premium transition-all duration-300 hover:border-brand-200 hover:shadow-premium-lg;
  }

  .input-field {
    @apply w-full rounded-lg border border-cream-300 bg-white px-4 py-3 text-sm text-gray-900 placeholder:text-gray-400 transition-colors focus:border-brand-500 focus:outline-none focus:ring-2 focus:ring-brand-500/20;
  }

  .label-text {
    @apply mb-1.5 block text-sm font-medium text-gray-700;
  }

  .section-heading {
    @apply font-display text-3xl font-bold tracking-tight text-brand-900 md:text-4xl;
  }

  .gold-accent {
    @apply bg-gradient-to-r from-gold-400 to-gold-500 bg-clip-text text-transparent;
  }
}