body{background-color:#EEEDF2}#payment.wrapper{width:100%;margin:200px auto;display:flex;align-items:center;justify-content:center}#payment .content{display:flex;flex-direction:column;justify-content:center;flex-grow:0;max-width:415px;background:#FFFFFF;border-radius:20px;box-sizing:border-box;padding:40px;margin:8px}#payment .logo-container{display:flex;gap:8px;align-items:center;justify-content:center}#payment .logo-container p{margin:0;font-family:'Onest';font-weight:500;font-size:19.2px;line-height:24px;color:#2D5BF4}#payment .status-icon{width:80px;height:80px;object-fit:contain;margin:50px auto 40px auto}#payment .content h1{font-family:'Onest',sans-serif;font-style:normal;font-weight:700;font-size:32px;line-height:44px;text-align:center;color:#2D5BF4;margin:0px auto 40px auto}#payment .content h1.failed{color:#0E1A3F;width:220px}#payment .content table{border-spacing:8px}#payment .content table td,#payment .content table th{text-align:left}#payment .content table th{width:120px;font-family:'Onest',sans-serif;font-style:normal;font-weight:400;font-size:12px;line-height:120%;color:#808080}#payment .content table td{width:147.2px;font-family:'Onest',sans-serif;font-style:normal;font-weight:400;font-size:12px;line-height:120%;color:#000000}#payment .content .button{display:flex;justify-content:center;align-items:center;width:224px;height:48px;background:#2D5BF4;border-radius:8px;font-family:'Onest',sans-serif;font-style:normal;font-weight:300;font-size:12px;line-height:16px;color:#FFFFFF;margin:40px auto 0 auto}#payment .content.payment{background-image:url("/static/img/payment/payment_bg.min.webp");background-position:center;background-size:cover;padding:24px}#payment .content.payment p{color:#FFFFFF}#payment .content.payment h1{font-family:'Onest',sans-serif;font-style:normal;font-weight:700;font-size:27px;line-height:37px;color:#FFFFFF;margin:30px auto 16px auto}#payment .content.payment h2{font-family:'Onest',sans-serif;font-style:normal;font-weight:700;font-size:27px;line-height:37px;color:#FFFFFF;text-align:center;margin:0 auto 0 auto}#payment .content.payment h2 .extra{color:#81A1D2;text-align:center;font-size:14px;font-weight:400;line-height:normal;letter-spacing:0.28px;margin-top:20px;margin-bottom:20px}#payment .content.payment .remind{color:#FFF;text-align:center;font-size:12px;font-weight:400;line-height:130%}#payment .content.payment ul{margin-top:40px;font-family:'Onest';font-style:normal;font-weight:400;font-size:12px;line-height:130%;color:#FFFFFF}#payment .content.payment .button{width:100%;height:68px;background:#FFFFFF;border-radius:8px;font-size:14px;line-height:19px;color:#2D5BF4}#email_input{display:flex;align-items:center;justify-content:center;width:335px;height:50px;border-radius:10px;box-sizing:border-box;padding:20px;margin:40px auto 50px auto;font-family:Manrope;font-weight:400;font-style:Regular;font-size:12px;line-height:120%;color:#808080;border:none;outline:none;background:#F5F5F5;transition:all 0.3s ease}#email_input::placeholder{color:#BDBDBD;opacity:1}#email_input:focus{background:#FFFFFF;border:2px solid #5B8DEF;box-shadow:0 0 0 4px rgba(91,141,239,0.1)}#email_input.valid,#email_input:not(:placeholder-shown):valid{border:2px solid #4CAF50;background:#FFFFFF}#email_input.valid:focus{box-shadow:0 0 0 4px rgba(76,175,80,0.1)}#email_input.invalid,#email_input:not(:placeholder-shown):invalid{border:2px solid #FF4757;background:#FFF5F5}#email_input.invalid:focus{box-shadow:0 0 0 4px rgba(255,71,87,0.1)}#payment .content.payment form{width:100%;display:flex;flex-direction:column;align-items:center;gap:0}#payment .content.payment .button{display:flex;align-items:center;justify-content:center;width:335px;height:50px;border-radius:10px;padding:20px;margin:0 auto;font-family:Manrope;font-weight:600;font-size:14px;line-height:120%;border:none;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:white;cursor:pointer;transition:all 0.3s ease;position:relative}#payment .content.payment .button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px rgba(102,126,234,0.4)}#payment .content.payment .button:active:not(:disabled){transform:translateY(0);box-shadow:0 4px 10px rgba(102,126,234,0.3)}#payment .content.payment .button:disabled,#payment .content.payment .button.disabled{background:#E0E0E0;color:#9E9E9E;cursor:not-allowed;opacity:0.7;transform:none;box-shadow:none}#payment .content.payment .button:disabled:hover,#payment .content.payment .button.disabled:hover{transform:none;box-shadow:none}#payment .content.payment .button:disabled[title]{position:relative}#payment .content.payment .button.loading{pointer-events:none;opacity:0.8}#email-error{color:#FF4757;font-family:Manrope;font-size:11px;font-weight:400;line-height:120%;margin:-35px auto 35px auto;display:flex;align-items:center;justify-content:center;gap:5px;animation:slideIn 0.3s ease;max-width:335px}@keyframes slideIn{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}#payment .payment-security-note{font-family:Manrope;font-size:11px;font-weight:400;line-height:140%;color:#9E9E9E;text-align:center;margin-top:15px;max-width:335px;margin-left:auto;margin-right:auto}@media (max-width:480px){#email_input,#payment .content.payment .button{width:100%;min-width:200px;max-width:100%}#email-error{max-width:90%}#payment .content.payment{margin:0px}}#payment .content.payment form{animation:fadeIn 0.5s ease}@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}#email_input:disabled{background:#F5F5F5;color:#BDBDBD;cursor:not-allowed}#payment .content.payment .button:not(:disabled):active{animation:pulse 0.3s ease}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(0.98)}100%{transform:scale(1)}}#payment .content.payment .button.loading::before{content:'';position:absolute;left:20px;width:14px;height:14px;border:2px solid #ffffff;border-top-color:transparent;border-radius:50%;animation:spin 0.6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#email_input:focus-visible{outline:3px solid #5B8DEF;outline-offset:2px}#payment .content.payment .button:focus-visible{outline:3px solid #667eea;outline-offset:2px}@media screen and (max-width:1400px){#payment.wrapper{margin:100px auto}}@media screen and (max-width:768px){#payment.wrapper{margin:8px 8px;box-sizing:border-box;max-width:calc(100% - 16px)}}