body {
background-color: #F7F7F7;
background-image: url(Group_68.svg);
background-position: top;
background-repeat: repeat-x;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.center-box{
border-radius: 24px;
background: #FFF;
display: flex;
flex-direction: row-reverse;    margin-top: 5%;    box-shadow: 10px 10px 70px #0000000f; height: 600px;
}
.center-box-left {
background: linear-gradient(180deg, #4D4A77 0%, #2A2E65 100%);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border-radius: 20px 0 0 20px;
}
.center-box-right {
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
input.otp-input-text {
height: 45px;
border-radius: 7px;
border: 1px solid #ccc;
text-align: center;
font-family: 'IRANSans';
font-weight: 500;
font-size: 17px;
letter-spacing: 6px;
}
input.otp-input-btn {
background-color: #FFC107;
border: 0;
border-radius: 10px;
padding: 10px;
font-weight: 700;
box-shadow: 5px 5px 20px #ffc1075c;
}

.verify-page .otp-input-text{
    width: 35px;
    text-align: center;
}
.center-box-left-circle {
    display: flex;
    justify-content: center;
    margin-bottom: 15px;
    position: relative;
}
.center-box-left-circle img{position: absolute; top: 30px;}
.box-mask {
    position: absolute;
    width: 266px;
    height: 266px;
    background-color: #3d3d6f;
    border-radius: 1450px;
    top: 2px;
}
  .box {
    position: relative;
    width: 270px;
    height: 270px;
    border-radius: 50%;
    background: linear-gradient(45deg, transparent, transparent 40%, yellow),
      linear-gradient(#26262600, #ffffff00);
    animation: rotate 10s linear infinite;
  }
  
  .box:before,
  .box:after {
    content: " ";
    position: absolute;
    inset: 2px;
    background: linear-gradient(#161616, #262626);
    border-radius: inherit;
  }
  
  .box:before {
    background: linear-gradient(45deg, transparent, transparent 40%, yellow);
    filter: blur(32px);
  }
  
  @keyframes rotate {
    100% {
      transform: rotate(360deg);
      filter: hue-rotate(360deg);
    }
  }
  .re-send-otp{font-size: 11px; margin-top: 20px;}
  .re-send-otp span{color: royalblue;}

  
 .phone-readonly input{    width: 90px;
    text-align: center;
    border: 0;}