@tailwind base;
@tailwind components;
@tailwind utilities;
@font-face {
  font-family: 'Montserrat Bold';
  src: url('../assets/fonts/Montserrat-Bold.ttf') format('truetype');
}

@font-face {
  font-family: 'Montserrat Medium';
  src: url('../assets/fonts/Montserrat-Medium.ttf') format('truetype');
}

@font-face {
  font-family: 'Montserrat Regular';
  src: url('../assets/fonts/Montserrat-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Montserrat SemiBold';
  src: url('../assets/fonts/Montserrat-SemiBold.ttf') format('truetype');
}

@layer base {
  html {
    font-family: 'Montserrat Regular';
    color: theme('colors.secondary');
  }
  input::-webkit-input-placeholder {
    font-family: 'Montserrat Regular';
    color: theme('colors.neutral.20');
  }
  input:-ms-input-placeholder {
    font-family: 'Montserrat Regular';
    color: theme('colors.neutral.20');
  }
  input::-ms-input-placeholder {
    font-family: 'Montserrat Regular';
    color: theme('colors.neutral.20');
  }
  input::placeholder {
    font-family: 'Montserrat Regular';
    color: theme('colors.neutral.20');
  }
  input[type='password'] {
    font-family: Verdana;
    letter-spacing: 0.125em;
  }
  input[type='password']::-webkit-input-placeholder {
    font-family: 'Montserrat Regular';
    letter-spacing: normal;
  }
  input[type='password']:-ms-input-placeholder {
    font-family: 'Montserrat Regular';
    letter-spacing: normal;
  }
  input[type='password']::-ms-input-placeholder {
    font-family: 'Montserrat Regular';
    letter-spacing: normal;
  }
  input[type='password']::placeholder {
    font-family: 'Montserrat Regular';
    letter-spacing: normal;
  }
  input[type='number'] {
    -moz-appearance: textfield;
  }
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
}

@layer utilities {
  /* Hide scrollbar for Chrome, Safari and Opera */
  .no-scrollbar::-webkit-scrollbar {
    display: none;
  }
  /* Hide scrollbar for IE, Edge and Firefox */
  .no-scrollbar {
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */
  }
}

body {
  background-color: gray;
  overscroll-behavior: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

:root {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

:root::-webkit-scrollbar {
  display: none;
}

#root {
  min-height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-top: constant(safe-area-inset-top);
  padding-top: env(safe-area-inset-top);
}

.content {
  background-color: theme('colors.screen');
  width: theme('content.width');
  padding: theme('content.padding.y') theme('content.padding.x')
    theme('content.padding.b');
  position: relative;
  padding-bottom: calc(4rem + constant(safe-area-inset-bottom));
  padding-bottom: calc(4rem + env(safe-area-inset-bottom));
}

.content-full {
  background-color: theme('colors.white');
  width: theme('content.width');
  position: relative;
  padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom);
}

.max-w-content {
  max-width: theme('content.width');
}

.w-content {
  width: theme('content.width');
}

.bg-gradient {
  background: theme('colors.white');
  background: linear-gradient(
    135deg,
    theme('colors.white') 0%,
    theme('colors.gray') 100%
  );
}

.scroll-x {
  @apply flex overflow-x-scroll max-w-[100vw] no-scrollbar scroll-smooth  space-x-3 px-4;
}

.scroll-y {
  @apply no-scrollbar scroll-smooth;
}

.top-shadow {
  -webkit-box-shadow: 0px -3px 6px -1px rgba(0, 0, 0, 0.15);
  box-shadow: 0px -3px 6px -1px rgba(0, 0, 0, 0.15);
}

.entrance-page {
  position: relative;
  -webkit-animation: entrancefromright 0.3s;
  animation: entrancefromright 0.3s;
  animation-iteration-count: 1;
  -webkit-animation-iteration-count: 1;
}

@-webkit-keyframes entrancefromright {
  from {
    opacity: 0.5;
    left: 1.5rem;
  }
  to {
    opacity: 1;
    left: 0;
  }
}

@keyframes entrancefromright {
  from {
    opacity: 0.5;
    left: 1.5rem;
  }
  to {
    opacity: 1;
    left: 0;
  }
}
/*# sourceMappingURL=index.css.map */