.left-section{flex:0 0 64%;border-radius:.5rem;overflow-y:auto;padding:20px;flex-direction:column;max-height:calc(90vh - 132px);z-index:5;position:relative}.left-section,.right-section{background:white;display:flex;min-height:580px}.right-section{flex:0 0 35%;height:580px;max-height:580px;border-radius:5px;position:sticky;top:0;padding:5px;flex-direction:column;align-items:stretch;overflow:hidden}.qr-display-wrapper{width:100%;flex-direction:column;margin:0;padding:1rem 0;min-height:350px;top:0;bottom:0;height:100%}#qrCode,.qr-code-container,.qr-display-wrapper,.visiting-card-wrapper{display:flex;align-items:center;justify-content:center;position:relative;transition:none}#qrCode,.qr-code-container,.visiting-card-wrapper{margin:2rem auto;width:350px;height:300px;background:transparent;min-height:300px}.tab-navigation{position:sticky;top:0;background:white;z-index:100;padding:10px;box-shadow:0 2px 5px rgba(0,0,0,.1)}@media (max-width:768px){.left-section{padding:8px!important}.visiting-card-wrapper{width:326px!important}.container{flex-direction:column;width:calc(100% - 2rem);max-width:calc(100% - 2rem)}.left-section,.right-section{flex:0 0 100%;width:100%}}.title{font-size:1rem;font-weight:700;color:#4a5568}.header,.title{text-align:center}.header{position:relative;margin-bottom:2rem;margin-top:1rem}.icon-button{color:#005cc8;font-size:1.2rem;background:none;border:none;cursor:pointer}.icon-button:hover{color:#2c5282}.slider-label{display:block;color:#4a5568;font-weight:medium}.generate-button-wrapper{padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.generate-button{width:120px;position:relative;display:inline-flex;text-align:center;padding:.5rem;font-weight:500;transition:all .3s ease-out;border:2px solid #ffa400;border-radius:5px;box-shadow:0 2px 4px rgba(0,0,0,.1);overflow:hidden}.generate-button,.generate-button-background{align-items:center;justify-content:center;background-color:#FFA400}.generate-button-background{position:absolute;inset:0;display:flex;width:100%;height:100%;color:white;transform:translateX(-100%);transition:transform .3s ease}.generate-button-text,.generate-button:hover .generate-button-background{transform:translateX(0)}.generate-button-text{position:relative;color:white;transition:all .3s ease}.generate-button:hover .generate-button-text{transform:translateX(100%);visibility:hidden}.generate-button-text-hidden{position:relative;visibility:hidden}.generate-button-icon{width:1.5rem;height:1.5rem}.reset-button-wrapper{padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.reset-button{width:120px;position:relative;display:inline-flex;text-align:center;padding:.5rem;font-weight:500;transition:all .3s ease-out;border:2px solid #ffa400;border-radius:5px;box-shadow:0 2px 4px rgba(0,0,0,.1);overflow:hidden}.reset-button,.reset-button-background{align-items:center;justify-content:center;background-color:#FFA400}.reset-button-background{position:absolute;inset:0;display:flex;width:100%;height:100%;color:white;transform:translateX(-100%);transition:transform .3s ease}.reset-button-text,.reset-button:hover .reset-button-background{transform:translateX(0)}.reset-button-text{position:relative;padding-left:12px;padding-right:12px;color:white;transition:all .3s ease}.reset-button:hover .reset-button-text{transform:translateX(100%);visibility:hidden}.reset-button-text-hidden{position:relative;visibility:hidden}.reset-button-icon{font-size:1.5rem}.disabled-button{opacity:.5;cursor:not-allowed}.error-message{color:#ef4444;margin-bottom:1rem}.qr-code-img{margin:0 auto;display:block}img[alt="QR Frame"]{position:absolute!important;top:0!important;left:0!important;right:0!important;bottom:0!important;margin:auto!important;z-index:10!important}.qr-component-fade-enter{opacity:0}.qr-component-fade-enter-active{opacity:1;transition:opacity .3s ease-in}.qr-component-fade-exit{opacity:1}.qr-component-fade-exit-active{opacity:0;transition:opacity .3s ease-out}.qr-placeholder{min-height:500px;display:flex;align-items:center;justify-content:center;width:100%}.component-container{min-height:500px;position:relative}.soft-fade{animation:softFadeIn .4s ease-in-out forwards}@keyframes softFadeIn{0%{opacity:0}to{opacity:1}}.action-buttons-container{display:flex;align-items:center;gap:4px;margin-right:-8px}.action-button{position:relative;background:transparent;border:none;cursor:pointer;border-radius:6px;padding:6px 8px;transition:all .2s ease}.action-button:hover{background-color:rgba(0,0,0,.05)}.action-button:active{transform:translateY(1px)}.action-button:focus{outline:none;box-shadow:0 0 0 2px rgba(1,185,174,.2)}.action-button:disabled{opacity:.5;cursor:not-allowed}@keyframes shakeAnimation{0%{transform:translateX(0)}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}to{transform:translateX(0)}}.shake-animation{animation:shakeAnimation .5s}@media (max-width:768px){.left-section{min-height:auto;max-height:none;height:auto;overflow-y:visible}.action-buttons-container{flex-wrap:wrap;justify-content:center;margin-left:7rem}.action-button{padding:4px}.action-button i{font-size:18px!important}.action-button span{font-size:10px}.qr-preview-header{font-size:.95rem}}@media (min-width:1024px){.action-buttons-container{gap:8px}}.qr-preview-header{flex-basis:5%;max-height:5%;justify-content:center}.qr-preview-display,.qr-preview-header{min-height:0;overflow:hidden;display:flex;align-items:center}.qr-preview-display{flex-basis:90%;flex-direction:column;justify-content:flex-end;aspect-ratio:1/1;width:100%;height:auto;max-height:100%;position:relative;background:#fff}.qr-preview-tip{flex-basis:5%;min-height:0;max-height:5%;overflow:hidden;display:flex;align-items:center;justify-content:center}.qr-preview-display .qr-code-container,.qr-preview-display .qr-display-wrapper,.qr-preview-display img{max-width:100%;max-height:100%;width:100%;height:100%;-o-object-fit:contain;object-fit:contain;box-sizing:border-box;position:absolute;left:0;top:0;right:0;bottom:0;margin:auto}.qr-preview-display img{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain;display:block;margin:0 auto}.qr-centered{flex-direction:column!important;height:100%!important}.qr-centered,.qr-centered .qr-image-container{display:flex!important;justify-content:center!important;align-items:center!important;position:relative!important;width:100%!important}.qr-centered .qr-image-container{height:auto!important;margin:auto!important}.qr-centered canvas,.qr-centered img,.qr-centered svg{margin:0 auto!important;position:relative!important;z-index:5!important}.qr-centered img[alt="QR Frame"]{position:absolute!important;top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;margin:0!important;z-index:10!important;max-width:100%!important;max-height:100%!important}.qr-frame-container{position:relative!important;width:100%!important;height:100%!important}.qr-frame-container,.qr-preview-display .qr-image-container{display:flex!important;justify-content:center!important;align-items:center!important}.qr-preview-display .qr-image-container{position:absolute!important;top:50%!important;left:0!important;right:0!important;transform:translateY(-50%)!important;margin:0 auto!important;text-align:-webkit-center!important}.qr-preview-display img{position:relative!important;top:auto!important;left:auto!important;transform:none!important;max-height:100%!important;max-width:100%!important}.qr-with-frame{display:flex!important;justify-content:center!important;align-items:center!important;position:relative!important;width:100%!important;height:100%!important}.qr-with-frame img:not([alt="QR Frame"]){z-index:5!important;position:relative!important}.qr-with-frame img[alt="QR Frame"]{z-index:10!important}