.social-login-wrapper{margin:20px 0}.social-login-separator{text-align:center;position:relative;margin:20px 0}.social-login-separator:before,.social-login-separator:after{content:'';position:absolute;top:50%;width:40%;height:1px;background-color:#e5e7eb}.social-login-separator:before{left:0}.social-login-separator:after{right:0}.social-login-separator span{background:#fff;padding:0 15px;color:#6b7280;font-size:13px;font-weight:500}.social-login-buttons{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.social-login-button{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;border-radius:8px;text-decoration:none;font-size:14px;font-weight:500;transition:all .2s ease;border:1px solid #e5e7eb;background:#fff;color:#374151;cursor:pointer;box-sizing:border-box}.social-login-button:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.1);text-decoration:none}.social-login-button:active{transform:translateY(0)}.social-login-button svg,.social-login-button img{width:20px;height:20px;flex-shrink:0}.social-login-otp-toggle{background:#fff !important;background-color:#fff !important;border-color:#16a34a;color:#16a34a}.social-login-otp-toggle:hover{background:#16a34a !important;background-color:#16a34a !important;border-color:#16a34a;color:#fff}.social-login-otp-toggle:hover svg{stroke:#fff}.social-login-google{border-color:#ea4335;color:#ea4335}.social-login-google:hover{background:#ea4335;border-color:#ea4335;color:#fff}.social-login-google:hover svg path{fill:#fff}.social-login-facebook{border-color:#1877f2;color:#1877f2}.social-login-facebook:hover{background:#1877f2;border-color:#1877f2;color:#fff}.social-login-facebook:hover svg path{fill:#fff}.social-login-zalo{border-color:#0068ff;color:#0068ff}.social-login-zalo:hover{background:#0068ff;border-color:#0068ff;color:#fff}.social-login-otp-form{margin-top:20px;padding:24px;background:#f9fafb;border:1px solid #e5e7eb;border-radius:12px}.otp-form-header{text-align:center;margin-bottom:20px}.otp-form-header h3{margin:0 0 8px;font-size:18px;font-weight:600;color:#111827}.otp-form-header p{margin:0;font-size:14px;color:#6b7280}.otp-form-group{margin-bottom:16px}.otp-form-group label{display:block;margin-bottom:6px;font-size:13px;font-weight:500;color:#374151}.otp-form-group input{width:100%;padding:12px 14px;font-size:15px;border:1px solid #d1d5db;border-radius:8px;box-sizing:border-box;transition:border-color .2s,box-shadow .2s}.otp-form-group input:focus{outline:none;border-color:#16a34a;box-shadow:0 0 0 3px rgba(22,163,74,.1)}.otp-form-group input::placeholder{color:#9ca3af}.otp-input-wrapper{display:flex;gap:12px;margin-bottom:16px}.otp-prefix-group{flex:0 0 100px;margin-bottom:0}.otp-prefix-group input{text-align:center;font-weight:600;letter-spacing:2px;background:#e5e7eb;text-transform:uppercase}.otp-code-group{flex:1;margin-bottom:0}.otp-code-group input{text-align:center;font-size:18px;font-weight:600;letter-spacing:4px}.otp-submit-btn{width:100%;padding:12px 20px;font-size:15px;font-weight:600;color:#fff;background:#16a34a;border:none;border-radius:8px;cursor:pointer;transition:background .2s,transform .1s}.otp-submit-btn:hover{background:#15803d}.otp-submit-btn:active{transform:scale(.98)}.otp-submit-btn:disabled{background:#9ca3af;cursor:not-allowed}.otp-submit-btn.loading{position:relative;color:transparent}.otp-submit-btn.loading:after{content:'';position:absolute;width:20px;height:20px;top:50%;left:50%;margin-left:-10px;margin-top:-10px;border:2px solid #fff;border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.otp-sent-info{background:#dcfce7;border:1px solid #86efac;border-radius:8px;padding:12px 16px;margin-bottom:16px}.otp-sent-info p{margin:0;font-size:14px;color:#166534}.otp-sent-info .otp-expires{font-size:12px;color:#15803d;margin-top:4px}.otp-resend{text-align:center;margin-top:12px}.otp-resend-btn{background:0 0;border:none;color:#16a34a;font-size:14px;font-weight:500;cursor:pointer;text-decoration:underline}.otp-resend-btn:hover{color:#15803d}.otp-resend-btn:disabled{color:#9ca3af;cursor:not-allowed;text-decoration:none}.otp-back-btn{display:block;width:100%;margin-top:16px;padding:10px;background:0 0;border:1px solid #d1d5db;border-radius:8px;color:#6b7280;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.otp-back-btn:hover{background:#f3f4f6;color:#374151}.otp-message{margin-top:16px;padding:12px 14px;border-radius:8px;font-size:14px;display:none}.otp-message.success{display:block;background:#dcfce7;border:1px solid #86efac;color:#166534}.otp-message.error{display:block;background:#fef2f2;border:1px solid #fecaca;color:#dc2626}.social-login-error{margin-top:16px;padding:12px 14px;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;color:#dc2626;font-size:14px}#loginform .social-login-wrapper{margin-top:20px;padding-top:20px;border-top:1px solid #e5e7eb}@media (max-width:480px){.social-login-buttons{grid-template-columns:1fr}.social-login-button{padding:11px 14px;font-size:13px}.social-login-separator span{font-size:12px}.social-login-otp-form{padding:16px}.otp-input-wrapper{flex-direction:column;gap:12px}.otp-prefix-group{flex:1}.otp-form-group input{padding:11px 12px;font-size:14px}.otp-submit-btn{padding:11px 16px;font-size:14px}}body.rtl .social-login-separator:before{left:auto;right:0}body.rtl .social-login-separator:after{right:auto;left:0}