.input-text {
    composes: -v-bg-inapparent -v-h -v-pl -v-text from global;
    border-radius: 0.4rem;
}

.prefix {
    margin-right: var(--margin-md);
    color: var(--color-gray-300);
}

.input-text:hover .prefix {
    color: var(--color-dark);
}

.suffix {
    margin-left: var(--margin-md);
}

.input {
    composes: -v-text from global;
    color: var(--color-dark);
    border: none;
    outline: none;
    border-radius: var(--rounded-md);
    background-color: transparent;
}

.arrow-icons {
    composes: -v-w from global;
    opacity: 0;
}

.input-text:hover .arrow-icons {
    opacity: 1;
}

.arrow-icon-item {
    flex: 1;
}

.input-text .arrow-icons .icon-item {
    font-size: .8rem;
}