Button hover

.hover-button {
    position: relative;
    display: flex;
    align-items: center;
    color: white;
    border: none;
    border-radius: 50px;
    padding: 0px 40px;
    font-size: 16px;
    cursor: pointer;
    overflow: hidden;
    transition: color 0.3s ease;
    height: 40px;
}

.hover-button::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #7C10AE;
    transition: transform 0.3s ease;
    z-index: 0;
}

.hover-button::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: transperend;
    transform: translateX(-100%);
    transition: transform 0.3s ease;
    z-index: 0;
}

.button-text {
    position: relative;
    z-index: 1;
    transition: transform 0.3s ease;
}

.button-icon {
    position: absolute;
    right: -30px;
    opacity: 0;
    transition: right 0.3s ease, opacity 0.3s ease;
    z-index: 1;
}

.hover-button:hover::before {
    transform: translateX(100%);
}

.hover-button:hover::after {
    transform: translateX(0);
}

.hover-button:hover .button-text {
    transform: translateX(-20px);
  color: #7C10AE;
}

.hover-button:hover .button-icon {
    right: 0px;
    opacity: 1;
  background:#7C10AE;
  border-radius: 50px;
  padding: 10px 7px;
}

<button class="hover-button">
        <span class="button-text">Обсудить проект</span>
        <span class="button-icon"><svg width="27" height="16" viewBox="0 0 27 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19.6774 1L24.6385 5.92523C25.8942 7.17186 25.9069 9.18031 24.6669 10.4112L19.7679 15.2744" stroke="white" stroke-linecap="round"/>
<path d="M21.9501 8.13721L0.5 8.13721" stroke="white" stroke-linecap="round"/>
</svg></span>
    </button>