.otp-page{display:flex;justify-content:center;align-items:center;min-height:calc(100vh - 90px);padding:40px 20px;background-color:var(--bg-gray)}.otp-page .otp-form-container{background-color:var(--white);border-radius:var(--border-radius-large);box-shadow:var(--box-shadow-light);padding:40px;width:100%;max-width:450px;display:flex;flex-direction:column;align-items:center}.otp-page .otp-title{font-size:var(--heading4);font-weight:600;color:var(--secondary-color);text-align:center;margin-bottom:20px}.otp-page .otp-instruction{font-size:var(--basefont);color:var(--secondary-color);text-align:center;margin-bottom:30px}.otp-page .otp-input-group{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:25px;width:100%}.otp-page .otp-input{width:100%;height:50px;border:1px solid var(--light-gray);border-radius:var(--border-radius);font-size:var(--heading5);font-weight:600;color:var(--secondary-color);text-align:center;background-color:var(--white);transition:border-color .3s ease,box-shadow .3s ease}.otp-page .otp-input:focus{border-color:#ff5630;box-shadow:0 0 0 2px #ff563033;outline:none}.otp-page .otp-error{color:#ff5630;font-size:var(--smallfont);margin-bottom:15px;text-align:center}.otp-page .otp-resend{display:flex;justify-content:center;align-items:center;margin-bottom:25px;font-size:var(--smallfont);color:var(--secondary-color)}.otp-page .resend-button{background:none;border:none;color:#ff5630;font-size:var(--smallfont);font-weight:500;cursor:pointer;padding:0;margin-left:5px;text-decoration:none}.otp-page .resend-button:hover{text-decoration:underline}.otp-page .verify-button{cursor:pointer;transition:all .3s ease;margin-bottom:20px;width:100%}.otp-page .back-to-signin{text-align:center;font-size:var(--smallfont);color:var(--secondary-color)}.otp-page .back-to-signin a{color:#ff5630;text-decoration:none;font-weight:500}.otp-page .back-to-signin a:hover{text-decoration:underline}@media(max-width:768px){.otp-page .otp-form-container{padding:30px 20px}.otp-page .otp-input-group{gap:8px}.otp-page .otp-input{height:45px;font-size:calc(var(--heading5) - 2px)}}@media(max-width:480px){.otp-page{padding:20px 10px}.otp-page .otp-form-container{padding:20px 15px}.otp-page .otp-title{font-size:var(--heading5)}.otp-page .otp-instruction{font-size:var(--smallfont)}.otp-page .otp-input-group{gap:6px}.otp-page .otp-input{height:40px;font-size:var(--basefont)}}
