/* Базовые стили для мини-приложения */
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
    sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#root {
  min-height: 100vh;
}

/* Стили для Telegram WebApp */
.tg-viewport {
  height: 100vh;
  overflow: hidden;
}

/* Анимации */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fade-in {
  animation: fadeIn 0.3s ease-out;
}

/* Стили для кнопок */
.btn-primary {
  @apply bg-indigo-600 text-white font-bold py-4 px-4 rounded-xl hover:bg-indigo-700 focus:outline-none focus:ring-4 focus:ring-indigo-300 transition-transform transform hover:scale-105 duration-300 disabled:bg-indigo-400 disabled:scale-100 disabled:cursor-not-allowed;
}

/* Стили для полей ввода */
.input-field {
  @apply w-full bg-slate-50 border-none rounded-xl p-4 placeholder-gray-400 focus:ring-2 focus:ring-blue-500 transition duration-200;
}

/* Стили для карточек */
.card {
  @apply bg-white/80 rounded-2xl p-6 shadow-sm;
}

/* Стили для заголовков */
.title {
  @apply text-3xl sm:text-4xl font-extrabold text-gray-800;
}

.subtitle {
  @apply text-gray-600;
}