.center-stage {
     position: fixed;
     inset: 0;
     display: grid;
     place-items: center;
     background: #f8f9fa;
     padding: 16px;
 }

 .login-card {
     width: 100%;
     max-width: 380px;
     padding: 2.2rem 2.5rem;
     border-radius: 1rem;
     background: #fff;
     box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
 }

 .login-card .form-control {
     border-radius: 0.5rem;
 }

 .btn-login {
     width: 100%;
     border-radius: 0.6rem;
     font-size: 1.1rem;
     padding: 0.8rem;
     margin-top: 1.2rem;
 }

 .welcome-text {
     text-align: center;
     margin-bottom: 1.5rem;
 }

 .welcome-text h5 {
     font-weight: 600;
     margin-bottom: 0.3rem;
 }

 .welcome-text small {
     color: #6c757d;
 }

 .d-none {
     display: none !important;
 }

 .spinner-wrap {
     display: flex;
     align-items: center;
     gap: 10px;
     padding: 12px;
 }

 .lds-dual-ring {
     display: inline-block;
     width: 32px;
     height: 32px;
 }

 .lds-dual-ring:after {
     content: " ";
     display: block;
     width: 24px;
     height: 24px;
     margin: 4px;
     border-radius: 50%;
     border: 3px solid #999;
     border-color: #999 transparent #999 transparent;
     animation: lds-dual-ring 1s linear infinite;
 }

 @keyframes lds-dual-ring {
     0% {
         transform: rotate(0)
     }

     100% {
         transform: rotate(360deg)
     }
 }

 .otp-wrap {
     display: flex;
     gap: .5rem;
     justify-content: center;
 }

 .otp-input {
     width: 40px;
     text-align: center;
     font-size: 1.25rem;
 }