:root{--primary-dark: #072931;--primary-medium: #0a3d47;--secondary-teal: #3F2DBF;--secondary-teal-dark: #2F228F;--accent-cyan: #00d4ff;--text-dark: #072931;--text-medium: #0a3d47;--text-light: #f8fafc;--white: #ffffff;--gray-light: #f1f5f9;--gray-medium: #e2e8f0;--success: #10b981;--warning: #f59e0b;--error: #ef4444;--gradient-primary: linear-gradient(135deg, #F36A3D 0%, #F36A3D 100%);--gradient-background: linear-gradient(to bottom, #F36A3D 0%, #D9468C 50%, #3F2DBF 100%);--gradient-teal: linear-gradient(135deg, #3F2DBF 0%, #2F228F 100%);--shadow-soft: 0 4px 15px rgba(7,41,49,.1);--shadow-medium: 0 8px 25px rgba(7,41,49,.15);--shadow-teal: 0 4px 15px rgba(63,45,191,.3)}*{margin:0;padding:0;box-sizing:border-box}html{min-height:100%;background:var(--gradient-background);background-attachment:fixed;-webkit-text-size-adjust:100%}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:var(--text-dark);background:transparent;min-height:100vh;overflow-x:hidden;-webkit-text-size-adjust:100%}.notranslate,.no-translate{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-user-select:none;user-select:none}app-home-usr,app-login-usr,app-register-usr,app-recharge-home,app-amount-confirm,app-payment-method,app-payment-card,app-payment-qr,app-invoice,app-favoritos-usr,app-cambiar-pin{display:block;padding-top:60px!important;padding-bottom:40px!important;min-height:100vh;background:transparent}.btn-primary{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:15px;border:none;border-radius:25px;background:linear-gradient(to right,#79275f,#c372a8,#79275f);color:#fff;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #667eea4d,inset 0 0 0 2px #ffffff80;position:relative;overflow:hidden;text-align:center;text-decoration:none}.btn-primary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.btn-primary:hover:not(:disabled):before{left:100%}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px #667eea66}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{opacity:.6;cursor:not-allowed;background:#e2e8f0;color:#64748b;box-shadow:none}.btn-secondary{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:13px;border:2px solid rgba(255,255,255,.6);border-radius:25px;background:#ffffff26;color:#fff;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s ease;text-align:center;text-decoration:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);position:relative;overflow:hidden}.btn-secondary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.btn-secondary:hover:before{left:100%}.btn-secondary:hover{background:#ffffff47;transform:translateY(-2px);box-shadow:0 8px 25px #667eea4d}.btn-secondary:active{transform:translateY(0)}.card{background:#ffffff1a;border:1px solid rgb(124,124,124);border-radius:16px;padding:20px;box-shadow:0 8px 32px #0003;margin-bottom:16px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.form-group label{display:block;font-size:14px;font-weight:600;margin-bottom:6px;color:#ffffffe6}.form-group input,.form-group select{width:100%;padding:12px 14px;border:1.5px solid rgba(255,255,255,.4);border-radius:8px;font-size:16px;color:#333;background:#fff;outline:none;transition:border-color .2s}.form-group input::placeholder,.form-group select::placeholder{color:#aaa}.form-group input:focus,.form-group select:focus{border-color:#fffc}.error-text{color:#fca5a5;font-size:13px;margin-top:4px}.page-container{max-width:480px;margin:0 auto;padding:16px}.section-title{font-size:20px;font-weight:700;color:#fff;margin-bottom:16px;text-shadow:0 1px 3px rgba(0,0,0,.3)}.spinner-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px}.spinner-wrap p{color:#ffffffbf!important}.spinner{width:48px;height:48px;border:5px solid rgba(255,255,255,.2);border-top-color:#c372a8;border-radius:50%;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
