*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#1a1a2e,#16213e);color:#e4e6ea;min-height:100vh;line-height:1.6}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-weight:500;color:#b8bcc8;font-size:.9rem}.form-group input,.form-group textarea,.form-group select{width:100%;padding:12px;background:#ffffff14;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:#e4e6ea;font-size:14px;transition:all .3s ease}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:#00d4aa;box-shadow:0 0 0 2px #00d4aa1a}.form-group input::placeholder,.form-group textarea::placeholder{color:#6c757d}.form-group input:disabled,.form-group textarea:disabled,.form-group select:disabled{opacity:.6;cursor:not-allowed}.btn{padding:12px 20px;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:8px;width:100%}.btn-primary{background:linear-gradient(135deg,#00d4aa,#00b894);color:#fff}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 15px #00d4aa66}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{background:#6c757d;cursor:not-allowed;transform:none}.btn-secondary{background:#ffffff1a;color:#e4e6ea;border:1px solid rgba(255,255,255,.2)}.btn-secondary:hover:not(:disabled){background:#ffffff26;border-color:#ffffff4d}.btn-link{background:none;color:#00d4aa;border:none;padding:4px 8px;font-size:.9rem;text-decoration:underline;width:auto}.btn-link:hover{color:#00b894}.btn-spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top:2px solid white;border-radius:50%;animation:spin 1s linear infinite}.loading-spinner{width:40px;height:40px;border:4px solid rgba(0,212,170,.3);border-top:4px solid #00d4aa;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.section{background:#ffffff0d;border-radius:12px;padding:30px;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.section:hover{background:#ffffff14;border-color:#00d4aa33}.section h2{font-size:1.5rem;color:#00d4aa;margin-bottom:20px}.error-message{background:#b454541a;color:#ff6b6b;padding:12px;border-radius:6px;font-size:13px;margin-top:10px;border:1px solid rgba(180,84,84,.3);display:none}.error-message.show{display:block}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#ffffff0d;border-radius:4px}::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}@media(max-width:768px){.section{padding:20px}.section h2{font-size:1.3rem}}@media(max-width:480px){.btn{padding:10px 16px;font-size:13px}.form-group input,.form-group textarea,.form-group select{padding:10px;font-size:13px}}.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.login-card{background:#ffffff0d;border-radius:16px;padding:40px;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);max-width:400px;width:100%;box-shadow:0 8px 32px #0000004d}.login-header{text-align:center;margin-bottom:40px}.login-header h1{font-size:2.5rem;font-weight:700;color:#00d4aa;margin-bottom:10px;text-shadow:0 2px 4px rgba(0,212,170,.3)}.login-header p{color:#b8bcc8;font-size:1rem}.language-selector{margin-top:20px}.language-dropdown{padding:8px 16px;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:#e4e6ea;font-size:.9rem;cursor:pointer;transition:all .2s ease;min-width:150px}.language-dropdown:hover{background:#ffffff26;border-color:#ffffff4d}.language-dropdown:focus{outline:none;border-color:#00d4aa;box-shadow:0 0 0 2px #00d4aa33}.language-dropdown option{background:#1e1e2e;color:#e4e6ea}.login-form{display:flex;flex-direction:column;gap:20px}@media(max-width:480px){.login-card{padding:30px 20px}.login-header h1{font-size:2rem}}.generate-section{background:#ffffff0d;border-radius:12px;padding:30px;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:transform .5s cubic-bezier(.4,0,.2,1),box-shadow .3s ease}.generate-section:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.generate-section h2{font-size:1.5rem;color:#00d4aa;margin-bottom:25px}.generate-form{display:flex;flex-direction:column;gap:20px}@media(max-width:480px){.generate-section{padding:20px}.generate-section h2{font-size:1.3rem}}.active-qr-section{background:#ffffff0d;border-radius:12px;padding:30px;border:1px solid rgba(0,212,170,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:relative;overflow:hidden;animation:slideInFromTop .6s cubic-bezier(.16,1,.3,1);transform-origin:top center}.active-qr-section.success-mode{border-color:#2f8f4680;background:#2f8f460d}.active-qr-section:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#00d4aa,#00b894);animation:shimmer 2s ease-in-out infinite}@keyframes slideInFromTop{0%{opacity:0;transform:translateY(-20px) scale(.98)}60%{opacity:1;transform:translateY(5px) scale(1)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes shimmer{0%,to{opacity:.6}50%{opacity:1}}.active-qr-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;gap:15px}.active-qr-section h2{font-size:1.5rem;color:#00d4aa;margin:0}.cancel-charge-btn{padding:8px 16px;background:#b4545426;border:1px solid rgba(180,84,84,.3);border-radius:6px;color:#ff6b6b;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap}.cancel-charge-btn:hover{background:#b4545440;border-color:#b4545480;transform:translateY(-1px)}.cancel-charge-btn:active{transform:translateY(0)}.qr-subtitle{color:#b8bcc8;font-size:.9rem;margin-bottom:25px;font-style:italic}.qr-display{text-align:center}.qr-info{display:flex;flex-direction:column;margin-bottom:20px;gap:15px}.qr-info-row{display:flex;justify-content:space-between;align-items:center;width:100%;gap:15px}.status-badge{padding:6px 14px;border-radius:20px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.status-badge.pending{background:#8a8f98;color:#fff}.status-badge.under_review{background:#f39c12;color:#fff}.status-badge.depix_sent{background:#2f8f46;color:#fff}.status-badge.error{background:#b45454;color:#fff}.status-badge.refunded{background:#9b59b6;color:#fff}.status-badge.expired{background:#7f8c8d;color:#fff}.qr-amount{font-size:1.6rem;font-weight:700;color:#00d4aa;margin:0;white-space:nowrap}.qr-memo{display:flex;align-items:center;gap:6px;margin:0;padding:8px 12px;background:#00d4aa14;border-radius:6px;border-left:3px solid rgba(0,212,170,.5);text-align:left;flex:1;min-width:0}.qr-memo label{font-size:.8rem;color:#fff9;font-weight:600;margin:0;white-space:nowrap}.qr-memo span{font-size:.9rem;color:#fffffff2;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.qr-id{font-family:Courier New,monospace;font-size:.75rem;color:#ffffff80;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.payer-info{background:#00d4aa1a;border:1px solid rgba(0,212,170,.3);border-radius:8px;padding:20px;margin:20px 0;animation:slideIn .3s ease-out}.payer-info h3{color:#00d4aa;margin-bottom:15px;font-size:1.1rem}.payer-details{display:flex;flex-direction:column;gap:12px;text-align:left}.payer-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.1);gap:10px}.payer-row:last-child{border-bottom:none}.payer-row label{font-weight:600;color:#b8bcc8;min-width:120px}.payer-row span{color:#e4e6ea;text-align:right;flex:1;word-break:break-word}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.qr-image-container{margin:30px 0;display:flex;justify-content:center;align-items:center}.qr-image{max-width:100%;width:300px;height:auto;border-radius:12px;border:2px solid rgba(255,255,255,.1);box-shadow:0 8px 25px #00d4aa33}.qr-placeholder{width:300px;height:300px;max-width:100%;border:2px dashed rgba(255,255,255,.3);border-radius:12px;display:flex;align-items:center;justify-content:center;color:#6c757d;font-style:italic;font-size:1.1rem}.copy-section{margin-top:20px;display:flex;flex-direction:column;gap:10px}.copy-paste-code{min-height:80px;resize:vertical;font-family:Courier New,monospace;font-size:11px;width:100%}@media(max-width:768px){.active-qr-header{flex-wrap:wrap}.cancel-charge-btn{width:100%;margin-top:10px}}.success-overlay{position:absolute;inset:0;background:#2f8f46f2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;z-index:10;cursor:pointer;animation:fadeIn .3s ease-out;border-radius:12px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.success-content{text-align:center;padding:40px 20px}.success-checkmark{width:120px;height:120px;margin:0 auto 30px}.checkmark-svg{width:100%;height:100%;display:block}.checkmark-circle{stroke:#fff;stroke-width:2;stroke-miterlimit:10;animation:checkmarkCircle .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark-check{transform-origin:50% 50%;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:48;stroke-dashoffset:48;animation:checkmarkCheck .3s .6s cubic-bezier(.65,0,.45,1) forwards}@keyframes checkmarkCircle{0%{stroke-dasharray:0 157}to{stroke-dasharray:157 157}}@keyframes checkmarkCheck{0%{stroke-dashoffset:48}to{stroke-dashoffset:0}}.success-title{color:#fff;font-size:2rem;font-weight:700;margin-bottom:15px;text-shadow:0 2px 4px rgba(0,0,0,.2)}.success-message{color:#ffffffe6;font-size:1.1rem;font-weight:500}@media(max-width:480px){.active-qr-section{padding:20px;margin-bottom:20px}.active-qr-section h2{font-size:1.3rem}.qr-subtitle{font-size:.85rem}.qr-info{gap:12px}.qr-info-row{flex-direction:column;align-items:flex-start;gap:10px}.qr-amount{font-size:1.3rem}.qr-id{text-align:left;font-size:.7rem}.qr-memo{width:100%}.qr-memo label{font-size:.75rem}.qr-memo span{font-size:.85rem;white-space:normal;word-break:break-word}.qr-image,.qr-placeholder{width:250px;height:250px}.payer-row{flex-direction:column;align-items:flex-start}.payer-row span{text-align:left}.success-checkmark{width:100px;height:100px;margin-bottom:20px}.success-title{font-size:1.5rem}.success-message{font-size:1rem}}.history-section{background:#ffffff0d;border-radius:12px;padding:30px;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:15px}.history-section h2{font-size:1.5rem;color:#00d4aa;margin:0}.status-filter{padding:8px 12px;font-size:12px;min-width:140px;background:#ffffff14;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:#e4e6ea;cursor:pointer;transition:all .3s ease}.status-filter:focus{outline:none;border-color:#00d4aa;box-shadow:0 0 0 2px #00d4aa1a}.history-list{max-height:600px;overflow-y:auto;padding-right:5px}.history-item{display:flex;justify-content:space-between;align-items:center;padding:15px;background:#ffffff08;border-radius:8px;margin-bottom:10px;border:1px solid rgba(255,255,255,.1);transition:all .3s ease;gap:15px;cursor:pointer;position:relative}.history-item:after{content:"→";position:absolute;right:15px;top:50%;transform:translateY(-50%);opacity:0;color:#00d4aa;font-size:1.2rem;font-weight:700;transition:all .3s ease}.history-item:hover{background:#00d4aa14;border-color:#00d4aa66;transform:translate(4px);padding-right:40px}.history-item:hover:after{opacity:1;right:15px}.history-item:active{transform:translate(2px);background:#00d4aa1f}.history-info{flex:1;min-width:0}.history-amount{font-weight:600;color:#00d4aa;font-size:1.1rem;margin-bottom:5px}.history-date{font-size:.85rem;color:#6c757d;margin-bottom:3px}.history-id{font-size:.75rem;color:#6c757d;font-family:Courier New,monospace;margin-bottom:3px}.history-memo{font-size:.85rem;color:#b8bcc8;font-style:italic;margin-top:5px}.history-payer{font-size:.75rem;color:#00d4aa;margin-top:3px}.loading-history{text-align:center;color:#6c757d;font-style:italic;padding:40px 20px}.history-list::-webkit-scrollbar{width:6px}.history-list::-webkit-scrollbar-track{background:#ffffff0d;border-radius:3px}.history-list::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}.history-list::-webkit-scrollbar-thumb:hover{background:#ffffff4d}@media(max-width:768px){.history-section{padding:20px}.history-section h2{font-size:1.3rem}.history-item{flex-direction:column;align-items:flex-start;gap:10px;padding-right:15px}.history-item:after{top:auto;bottom:15px;right:15px;transform:translateY(0)}.history-item:hover{padding-right:45px}.status-badge{align-self:flex-start}.history-list{max-height:400px}}@media(max-width:480px){.section-header{flex-direction:column;align-items:flex-start}.status-filter{width:100%}}.toast{position:fixed;top:20px;right:20px;background:#00d4aaf2;color:#fff;padding:15px 25px;border-radius:8px;font-weight:600;font-size:14px;transform:translate(400px);transition:transform .3s ease;z-index:1000;box-shadow:0 4px 20px #00d4aa66;max-width:320px;word-wrap:break-word}.toast.show{transform:translate(0)}.toast.error{background:#b45454f2;box-shadow:0 4px 20px #b4545466}@media(max-width:480px){.toast{top:10px;right:10px;left:10px;max-width:none;transform:translateY(-100px)}.toast.show{transform:translateY(0)}}.dashboard-container{min-height:100vh;padding-bottom:20px}.dashboard-header{background:#ffffff0d;border-bottom:1px solid rgba(255,255,255,.1);padding:20px;position:sticky;top:0;z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.header-content{max-width:1400px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:15px}.header-content h1{font-size:2rem;color:#00d4aa;margin:0;text-shadow:0 2px 4px rgba(0,212,170,.3)}.user-info{display:flex;align-items:center;gap:15px;font-size:.9rem}.user-info span{color:#b8bcc8}.language-dropdown-header{padding:6px 12px;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:#e4e6ea;font-size:.85rem;cursor:pointer;transition:all .2s ease}.language-dropdown-header:hover{background:#ffffff26;border-color:#ffffff4d}.language-dropdown-header:focus{outline:none;border-color:#00d4aa;box-shadow:0 0 0 2px #00d4aa33}.language-dropdown-header option{background:#1e1e2e;color:#e4e6ea}.dashboard-main{max-width:1400px;margin:0 auto;padding:30px 20px}.dashboard-grid{display:grid;grid-template-columns:1fr;gap:30px}.active-qr-container{max-height:0;opacity:0;overflow:hidden;transition:max-height .5s cubic-bezier(.4,0,.2,1),opacity .4s cubic-bezier(.4,0,.2,1),margin .5s cubic-bezier(.4,0,.2,1);margin-bottom:0}.active-qr-container.visible{max-height:2000px;opacity:1;margin-bottom:30px}@media(min-width:968px){.dashboard-grid{grid-template-columns:2fr 1fr;gap:40px}}@media(max-width:768px){.header-content h1{font-size:1.5rem}.user-info{font-size:.8rem;gap:10px}.dashboard-main{padding:20px 15px}.active-qr-container.visible{margin-bottom:20px}}.realtime-indicator{position:fixed;bottom:20px;right:20px;background:#000c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:8px 14px;border-radius:20px;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;z-index:1000;transition:all .3s ease}.realtime-dot{width:8px;height:8px;border-radius:50%;background:#6c757d;animation:pulse 2s ease-in-out infinite}.realtime-indicator.connected .realtime-dot{background:#2f8f46}.realtime-indicator.connecting .realtime-dot{background:#f39c12}.realtime-indicator.error .realtime-dot,.realtime-indicator.disconnected .realtime-dot{background:#b45454;animation:none}.realtime-text{color:#e4e6ea}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.7}}@media(max-width:480px){.header-content{flex-direction:column;align-items:flex-start}.user-info{width:100%;justify-content:space-between}.realtime-indicator{bottom:10px;right:10px;font-size:11px;padding:6px 10px}}.loading-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.loading-screen p{color:#b8bcc8;font-size:1rem}
