label {
  @apply first-letter:uppercase;
}

.TextField .input {
  @apply rounded-8 outline-none px-3 text-gray-800;
}

.TextField .input::placeholder {
  @apply text-gray-700 first-letter:uppercase font-light text-b3;
}

.TextField.outlined .input {
  background: none;
  @apply bg-none border border-gray-800;
}

.TextField.TextField-MD {
  @apply [&_.input]:h-[48px] [&_.label-text]:text-b2 [&_.input::placeholder]:text-b3 [&_.input]:text-b3;
}

.TextField .leftIcon {
  @apply absolute border-r border-white px-2;
}

.TextField-leftIcon.TextField-MD .input {
  @apply pl-[60px];
}
.TextField-icon {
  @apply absolute border-gray-200 [&_*]:text-gray-200 cursor-pointer;
}
.TextField-icon-left {
  @apply left-3 border-r pr-3;
}

.TextField-rightIcon.TextField-MD .input {
  @apply pr-[60px];
}

.TextField-icon-right {
  @apply right-3;
}

.TextField .input:disabled {
  @apply bg-black-400;
}

.list-options {
  @apply z-10 !p-0 text-left !rounded-xl bg-white-100 absolute -mt-3 max-h-60 w-full overflow-auto py-1;
}