toggle-corp/react-store

:root {
    --width-search-input-icon: 16px;
}

.search-input {
    position: relative;

    .icon {
        display: flex;
        position: absolute;
        top: 0;
        bottom: calc(var(--width-separator-medium) + var(--spacing-extra-small-alt));
        left: 0;
        align-items: flex-end;
        justify-content: flex-start;
        width: var(--width-search-input-icon);
        color: var(--color-text-label);
    }

    &.disabled {
        .icon {
            color: var(--color-text-disabled);
        }
    }

    :global {
        .raw-input {
            padding-left: var(--width-search-input-icon);
        }
    }
}