@layer components { .sci-input-container-v2 { @apply relative h-[2.75rem] flex items-center; } .sci-input-container-v2 input { @apply w-full h-full bg-transparent p-0.5 border rounded outline-none absolute top-0 pl-2; border-color: var(--sn-sleepy-grey); } .sci-input-container-v2 input::placeholder { color: var(--sn-sleepy-grey); } .sci-input-container-v2 input:focus { border-color: var(--sn-sleepy-grey); box-shadow: none; } .sci-input-container-v2 .sn-icon { @apply m-2; color: var(--sn-black) } .sci-input-container-v2.right-icon .sn-icon { @apply absolute right-0; } .sci-input-container-v2.left-icon input { @apply pl-10; } .sci-input-container-v2.right-icon input { @apply pr-10; } }