@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700;800&display=swap');
@tailwind base;
@tailwind components;
@tailwind utilities;

* {
  @apply m-0 p-0 box-border;
}

html,
body {
  @apply w-full h-full;
}

body {
  @apply bg-gray-50 font-sans;
  font-family: Nunito, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
}

:root {
  color-scheme: light;
  --google-blue: #4285F4;
  --google-red: #EA4335;
  --google-yellow: #FBBC04;
  --google-green: #34A853;
}

@layer components {
  .btn-primary {
    @apply px-4 py-2 bg-[#4285F4] text-white rounded-lg hover:bg-blue-600 transition-colors font-medium;
  }

  .btn-danger {
    @apply px-4 py-2 bg-[#EA4335] text-white rounded-lg hover:bg-red-600 transition-colors font-medium;
  }

  .btn-ghost {
    @apply px-4 py-2 bg-transparent text-gray-700 rounded-lg hover:bg-gray-100 transition-colors font-medium;
  }

  .card {
    @apply bg-white rounded-xl shadow-sm border border-gray-100 p-4;
  }

  .card-lg {
    @apply bg-white rounded-2xl shadow-sm border border-gray-100 p-6;
  }
}