.copyInput {
display: flex; position: relative; width: 100%; &__input { border-radius: $base-border-radius 0 0 $base-border-radius; border: $base-border; border-right: 0; margin: 0; padding: 5px 0 6px 10px; flex: 1; transition: all 0.3s ease; appearance: none; font-size: 14px; &:focus { border-color: $primary-color; } @include media($mobile) { border: $base-border; border-radius: $base-border-radius; } } &__button { border-radius: 0 $base-border-radius $base-border-radius 0; position: relative; overflow: visible; @include media($mobile) { display: none; } } &__notification { @keyframes notification { 0% { opacity: 0; transform: translate3d(-50%, 0, 0); } 30%, 70% { opacity: 1; } 100% { opacity: 0; transform: translate3d(-50%, -10px, 0); } } animation: notification 1.2s $CurveFastOutSlowIn; position: absolute; top: -100%; left: 50%; background: $green; padding: 8px 15px 8px 10px; border-radius: $base-border-radius; line-height: 14px; font-size: 14px; display: flex; align-items: center; text-transform: capitalize; letter-spacing: normal; font-weight: 600; &:before { content: ''; background: url('/assets/img/icon-check-white.svg'); background-size: 100%; width: 18px; height: 18px; margin-right: 5px; } }
}