public-ui-kolibri

@use '../mixins/to-rem' as *; @use './input-core' as *; @layer kol-theme-component { .kol-input { background-color: transparent; height: to-rem(40); padding: 0 to-rem(10); border: none; &::placeholder { color: var(--color-subtle); } } .kol-input-container { position: relative; padding: 0; gap: 0; grid-template-columns: auto max-content min-content; &__adornment { position: absolute; top: to-rem(-2); &--start { left: 0; } &--end { right: 0; } } &:has(&__adornment--start:not(:empty)) .kol-input { padding-left: to-rem(48); } &:has(&__adornment--start &__smart-button + &__icon) .kol-input { padding-left: to-rem(76); } &:has(&__adornment--end:not(:empty)) .kol-input { padding-right: to-rem(48); } &:has(&__adornment--end &__icon + &__smart-button) .kol-input { padding-right: to-rem(76); } &__container { position: relative; z-index: 1; } } }