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

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: 'Binance Plex', 'TrustWallet', Geeza, 'Ping Fang', ui-sans-serif, -apple-system, 'Segoe UI', Roboto, Ubuntu, Cantarell, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: #1b1b1c;
  color: #e2e8f0;
  min-height: 100vh;
  /* Мобильная оптимизация */
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

button,
input,
textarea,
select {
  font-family: inherit;
}

#root {
  min-height: 100vh;
}

@layer components {
  .btn-primary {
    @apply bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded-lg transition-colors duration-200;
  }

  .btn-secondary {
    @apply bg-gray-700 hover:bg-gray-600 text-white font-medium py-2 px-4 rounded-lg transition-colors duration-200;
  }

  .input-field {
    @apply w-full px-4 py-2 bg-gray-800 border border-gray-700 rounded-lg text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent;
  }

  .card {
    @apply bg-gray-800 rounded-xl shadow-lg p-6 border border-gray-700;
  }

  /* Мобильные улучшения */
  .touch-target {
    @apply min-h-[44px] min-w-[44px];
  }

  .mobile-safe-area {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
  }

  /* Адаптивные отступы */
  @media (max-width: 320px) {
    .container-mobile {
      @apply px-3;
    }
  }

  @media (min-width: 321px) and (max-width: 375px) {
    .container-mobile {
      @apply px-4;
    }
  }

  @media (min-width: 376px) {
    .container-mobile {
      @apply px-4;
    }
  }
}
