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

@layer base {
  html {
    scroll-behavior: smooth;
  }
  body {
    @apply font-sans bg-bgLight text-textMain;
  }
}

/* Custom Swiper Styles */
.swiper-pagination-bullet-active {
  background: #1976F3 !important;
  width: 24px !important;
  border-radius: 4px !important;
}

.swiper-button-next,
.swiper-button-prev {
  color: #1976F3 !important;
  background: white;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.swiper-button-next::after,
.swiper-button-prev::after {
  font-size: 16px !important;
  font-weight: bold;
}

/* Scrollbar behaviors */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Direct font overrides */
body, p, span, a, input, select, button {
  font-family: 'Inter', sans-serif;
}

h1, h2, h3, h4, h5, h6, .font-outfit {
  font-family: 'Outfit', sans-serif;
}

/* Force container max-width to 1400px on large displays */
@media (min-width: 1400px) {
  .container {
    max-w-screen-2xl: 1400px;
    max-width: 1400px !important;
  }
}