.otp-modal{position:fixed;z-index:9999;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center}.otp-modal-content{background-color:#fff;border-radius:10px;box-shadow:0 4px 20px rgba(0,0,0,.3);max-width:450px;width:90%;max-height:90vh;overflow-y:auto;position:relative}.otp-modal-header{padding:20px 25px 15px;border-bottom:1px solid #e0e0e0;display:flex;justify-content:space-between;align-items:center}.otp-modal-header h3{margin:0;color:#333;font-size:20px;font-weight:600}.otp-close{font-size:28px;font-weight:700;color:#aaa;cursor:pointer;line-height:1;transition:color .3s ease}.otp-close:hover{color:#000}.otp-modal-body{padding:25px;text-align:center}.otp-modal-body p{margin:0 0 25px;color:#666;font-size:16px;line-height:1.5}.otp-input-container{display:flex;justify-content:center;gap:10px;margin-bottom:25px}.otp-input{width:40px;height:40px;border:2px solid #ddd;border-radius:6px;text-align:center;font-size:16px;font-weight:600;color:#333;transition:all .3s ease;outline:none}.otp-input:focus{border-color:#007cba;box-shadow:0 0 0 3px rgba(0,124,186,.1)}.otp-input.filled{border-color:#28a745;background-color:#f8fff9}.otp-actions{display:flex;gap:15px;justify-content:center;margin-bottom:20px}.otp-btn{padding:12px 24px;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;min-width:120px}.otp-btn-primary{background-color:#007cba;color:#fff}.otp-btn-primary:hover{background-color:#005a87;transform:translateY(-1px)}.otp-btn-primary:disabled{background-color:#ccc;cursor:not-allowed;transform:none}.otp-btn-secondary{background-color:#f8f9fa;color:#6c757d;border:1px solid #dee2e6}.otp-btn-secondary:hover{background-color:#e9ecef;color:#495057}.otp-message{font-size:14px;font-weight:500;padding:10px;border-radius:4px;margin-top:15px;min-height:20px}.otp-message.success{background-color:#d4edda;color:#155724;border:1px solid #c3e6cb}.otp-message.error{background-color:#f8d7da;color:#721c24;border:1px solid #f5c6cb}@media (max-width:480px){.otp-modal-content{width:95%;margin:20px}.otp-modal-header,.otp-modal-body{padding:20px}.otp-input{width:35px;height:35px;font-size:14px}.otp-actions{flex-direction:column;gap:10px}.otp-btn{width:100%}}.otp-modal{animation:fadeIn .3s ease}.otp-modal-content{animation:slideIn .3s ease}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes slideIn{from{opacity:0;transform:translateY(-50px)}to{opacity:1;transform:translateY(0)}}.otp-btn.loading{position:relative;color:transparent}.otp-btn.loading:after{content:'';position:absolute;width:16px;height:16px;top:50%;left:50%;margin-left:-8px;margin-top:-8px;border:2px solid transparent;border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}