iris-messenger/src/index.css

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

:root {
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
}

.btn, input, select {
    @apply rounded-full;
}

* {
  font-family: 'Lato', sans-serif;
}

.btn {
  @apply capitalize;
}

input[type='text'],
input[type='number'] {
  @apply rounded-full;
}

iframe {
  @apply rounded-sm my-4 w-full;
}

img, video {
  user-select: none;
}

.centered-placeholder::placeholder {
  text-align: center;
}

.link {
  @apply text-iris-blue hover:underline;
  text-decoration: none;
}

.pb-safe-area {
  padding-bottom: env(safe-area-inset-bottom);
}

.preformatted-wrap {
  white-space: pre-wrap;
  overflow-wrap: break-word;
  word-break: break-word;
}

/** Scroll bar settings **/
* {
  scrollbar-width: thin;  /* Mozilla specific */
}

::-webkit-scrollbar {
  @apply w-2;
}
::-webkit-scrollbar-track {
  /* box-shadow: inset 0 0 5px grey; */
  @apply bg-neutral-800;
  @apply rounded-md;
}
::-webkit-scrollbar-thumb {
  /* @apply bg-primary; */
  @apply bg-neutral-600;
  @apply rounded-md;
}

.full-width-note > div > img, .full-width-note > div > video, .full-width-note > iframe {
  @apply -mx-2 md:mx-0;
  @apply rounded-none md:rounded-sm;
  @apply max-w-[100vw] md:max-w-full;
}

.full-width-note > iframe {
  @apply w-[100vw] md:w-full;
}

html {
  @apply overflow-y-scroll; /* Always show scrollbar to avoid layout shift */
}