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

a {
  @apply underline;
}

.chat {
  @apply p-2 rounded-lg border shadow-lg mb-5 mx-6;
}

.chat--bad {
  @apply bg-red-50;
}

.chat--good {
  @apply bg-green-50;
}

.message {
  @apply flex border-t py-2 text-sm;
}

.message:nth-child(1) {
  @apply border-t-0;
}

.message__time {
  @apply w-12 text-gray-400 flex-shrink-0;
}

.message__user {
  @apply w-16 font-bold flex-shrink-0;
}

.message__user::after {
  content: ":";
}

.message__caption {
  @apply text-gray-400 border-t text-sm italic p-3 text-center;
}