1.containerInput {
2  background-color: #000;
3  position: relative;
4  overflow: hidden;
5  margin: 0;
6  padding: 0 0 4px 0;
7  z-index: 1;
8  font-size: 15px;
9}
10
11.containerInput::before {
12  content: '';
13  width: 110%;
14  aspect-ratio: 1;
15  position: absolute;
16  inset: 0 0 0 0;
17  margin: auto;
18  animation: rotate6234 2.5s ease-in-out infinite;
19  z-index: -1;
20  background-image: conic-gradient(from 0deg at 50% 50%, #073AFF00 0%, #FF0000FF 25%, #073AFF00 25%);
21}
22
23.containerInput > input {
24  width: 210px;
25  height: 50px;
26  font-size: inherit;
27  color: #fff;
28  border: none;
29  padding: 12px;
30  background-color: #0a0a0a;
31  outline: 5px solid #0a0a0a;
32}
33
34.containerInput > input:focus {
35  outline: none;
36}
37
38.containerInput > input:not(:placeholder-shown) {
39  outline: none;
40}
41
42.containerInput > input:not(:placeholder-shown):valid {
43  outline: 4px solid rgb(0, 255, 183);
44  border-radius: 0;
45}
46
47@keyframes rotate6234 {
48  from {
49    transform: rotate(0deg);
50  }
51
52  to {
53    transform: rotate(360deg);
54  }
55}