.qr-generator-container{max-width:850px;margin:0 auto 30px;background:#fff;border-radius:10px;box-shadow:0 0 20px rgb(0 0 0 / .1);overflow:hidden}.qr-generator-layout{display:flex;flex-wrap:wrap}.qr-controls{flex:3;min-width:350px;padding:20px 25px;border-right:1px solid #e9ecef}.qr-preview{flex:2;min-width:300px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:30px;position:relative}.qr-placeholder{width:100%;margin-bottom:30px;margin-top:30px;height:100%;max-width:300px;aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;background:#f0f0f0;border:2px dashed #ccc;border-radius:8px;color:#666;text-align:center}.qr-placeholder p{margin-bottom:0;padding:10px;line-height:1.3;font-size:16px}#qr-code-container{width:250px;height:250px;display:flex;align-items:center;justify-content:center;margin-bottom:20px}#qr-code-container canvas,#qr-code-container img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}#qr-loader-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgb(255 255 255 / .85);display:flex;align-items:center;justify-content:center;z-index:10;border-radius:0 10px 10px 0;transition:opacity 0.2s}.qr-loader{width:40px;height:40px;border:5px solid #f3f3f3;border-top:5px solid #2a73d9;border-radius:50%;animation:spin 1s linear infinite}.qr-tabs{display:flex;margin-bottom:20px;background-color:#e9ecef;border-radius:8px;padding:4px}.tab-link{flex:1;padding:6px 20px;cursor:pointer;border:none;background-color:#fff0;font-size:16px;font-weight:500;color:#495057;transition:color 0.3s,background-color 0.3s;border-radius:6px;text-align:center}.tab-link.active{color:#fff;background-color:#2a73d9;box-shadow:0 1px 3px rgb(0 0 0 / .1)}.tab-link.active:focus-visible{outline:2px solid #2a73d9;outline-offset:2px}.tab-link:not(.active):hover,.tab-link:not(.active):focus-visible{background-color:#fff0;color:#495057;outline:none}.tab-content{display:none}.tab-content.active{display:block}.qr-heading{color:#2c3e50;margin-top:0;font-size:26px;text-align:center;margin-bottom:10px}.qr-controls .color-input-group{display:flex;align-items:center;gap:10px}.qr-controls .color-input-group input[type="color"]{flex:0 0 50px;height:45px;padding:3px;border:1px solid #ddd;border-radius:6px;cursor:pointer;-webkit-appearance:none;appearance:none;background:none}.qr-controls .color-input-group input[type="color"]::-webkit-color-swatch-wrapper{padding:0}.qr-controls .color-input-group input[type="color"]::-webkit-color-swatch{border:none;border-radius:4px}.qr-controls .color-input-group .form-control{flex:1}.form-group{margin-bottom:10px}.form-row{display:flex;gap:15px;margin-bottom:15px}.form-row .form-group{flex:1;margin-bottom:0}.qr-controls label{display:block;margin-bottom:1px;font-weight:500;color:#333;font-size:17px}.qr-controls .form-control+label,.qr-controls .form-row+label{margin-top:15px}.checkbox-wrapper{display:flex;align-items:center;gap:6px;cursor:pointer;margin-top:10px}.checkbox-wrapper input[type="checkbox"]{margin:0;flex-shrink:0}.qr-generator-container .form-control{width:100%;padding:8px 9px;border:1px solid #ddd;border-radius:6px;font-size:16px;transition:border-color 0.3s;background-color:#fff}.qr-generator-container .qr-controls .form-control:hover,.qr-generator-container .qr-controls .form-control:focus,.qr-generator-container .qr-controls .form-control:active{background-color:#fff;border-radius:6px}.qr-generator-container .qr-controls .form-control:focus,.qr-generator-container .qr-controls input[type="text"]:focus,.qr-generator-container .qr-controls input[type="url"]:focus,.qr-generator-container .qr-controls input[type="email"]:focus,.qr-generator-container .qr-controls input[type="tel"]:focus,.qr-generator-container .qr-controls input[type="number"]:focus,.qr-generator-container .qr-controls input[type="datetime-local"]:focus,.qr-generator-container .qr-controls textarea:focus,.qr-generator-container .qr-controls select:focus{border-color:#80bdff;outline:0;box-shadow:0 0 0 .8px rgb(0 123 255 / .25)}.form-control[type="number"]{-webkit-appearance:none;-moz-appearance:textfield;appearance:textfield}.form-control[type="number"]::-webkit-inner-spin-button,.form-control[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}textarea.form-control{min-height:100px;resize:vertical}.qr-controls select.form-control{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:#fff url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 8L10 12L14 8' stroke='%236B7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 5px center;background-size:24px 24px;padding-right:40px;cursor:pointer;font-weight:400}.qr-generator-container .qr-controls input[type="color"]{width:100%;height:45px;padding:3px;border:1px solid #ddd;border-radius:6px;cursor:pointer}.qr-generator-container .btn-primary,.qr-generator-container .btn-secondary,.qr-generator-container .btn-outline{padding:8px 13px;border:none;border-radius:6px;font-size:16px;font-weight:500;cursor:pointer;transition:transform 0.2s ease;-webkit-appearance:none;appearance:none}.qr-generator-container .btn-primary{background:#2a73d9;color:#fff}.qr-generator-container .btn-secondary{background:#138644;color:#fff;display:inline-flex;align-items:center;justify-content:center}.qr-generator-container .qr-controls .btn-primary:hover,.qr-generator-container .qr-controls .btn-primary:focus{background:#2a73d9;color:#fff;outline:none}.qr-generator-container .qr-controls .btn-secondary:hover,.qr-generator-container .qr-controls .btn-secondary:focus{background:#138644;color:#fff;outline:none}.qr-generator-container .btn-secondary:disabled{background:#95a5a6;cursor:not-allowed}.qr-generator-container .btn-outline{background:#6c757d;border:1px solid #bdc3c7;color:#fff}.qr-generator-container .qr-controls .btn-outline:hover,.qr-generator-container .qr-controls .btn-outline:focus{background:#6c757d;color:#fff;outline:none}.qr-generator-container .qr-controls .btn-primary:active,.qr-generator-container .qr-controls .btn-secondary:active,.qr-generator-container .qr-controls .btn-outline:active,.qr-generator-container .qr-controls .toggle-settings-btn:active{transform:scale(.98)}.action-buttons{display:flex;gap:10px;justify-content:center}#download-btn:disabled{visibility:hidden;opacity:0;pointer-events:none;transition:opacity 0.2s ease-in-out,visibility 0s 0.2s}#download-btn.loading:disabled{visibility:visible;opacity:1;cursor:wait;transition-delay:0s}.btn-loader{display:none;width:18px;height:18px;border:2px solid rgb(255 255 255 / .5);border-top-color:#fff;border-radius:50%;animation:spin 0.8s linear infinite;margin-left:10px}#download-btn.loading .btn-loader{display:inline-block}.logo-preview-actions{display:flex;justify-content:center;gap:10px;margin-top:10px}.logo-preview-actions .btn-outline{width:auto;padding:5px 10px;font-size:14px}#logo-drop-area{border:2px dashed #ccc;border-radius:8px;padding:30px;text-align:center;color:#666;transition:border-color 0.3s,background-color 0.3s;margin-top:8px;display:flex;flex-direction:column;align-items:center;justify-content:center}#logo-drop-area.drag-over{border-color:#2a73d9;background-color:#f0f8ff}#logo-drop-area p{margin:0 0 10px;font-size:16px;text-align:center}#logo-drop-area .btn-outline{padding:6px 12px;font-size:14px;background:#fff0;color:#2a73d9;border:1px solid #2a73d9}#logo-preview-container{margin-top:15px;text-align:center}#logo-preview-img{max-width:100px;max-height:100px;border:1px solid #ddd;border-radius:4px;padding:5px;object-fit:contain}.logo-loader{width:30px;height:30px;border:4px solid #f3f3f3;border-top:4px solid #2a73d9;border-radius:50%;animation:spin 1s linear infinite}#logo-drop-area.loading p,#logo-drop-area.loading .btn-outline{display:none}#logo-drop-area.loading .logo-loader{display:block}.qr-preview #download-btn{margin-top:20px}.collapsible-settings-container{border:1.5px solid lightblue;border-radius:8px;margin-bottom:20px;overflow:hidden}.qr-generator-container .toggle-settings-btn{width:100%;text-align:left;position:relative;background:#fff0;border:none;padding:12px 20px;font-size:16px;font-weight:500;color:#333;cursor:pointer;transition:transform 0.2s ease;-webkit-appearance:none;appearance:none}.qr-generator-container .qr-controls .toggle-settings-btn:hover,.qr-generator-container .qr-controls .toggle-settings-btn:focus{background:#fff0;color:#333;outline:none}.qr-generator-container .qr-controls .toggle-settings-btn.open:hover,.qr-generator-container .qr-controls .toggle-settings-btn.open:focus{background-color:#eaf5fc}.qr-generator-container .toggle-settings-btn.open{background-color:#eaf5fc;color:#2980b9}.qr-generator-container .toggle-settings-btn:focus-visible{outline:2px solid #2980b9;outline-offset:2px;background-color:#eaf5fc;color:#2980b9}.qr-generator-container .toggle-settings-btn::after{content:'+';position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:28px;font-weight:300;line-height:1;color:#7f8c8d}.qr-generator-container .toggle-settings-btn.open::after{color:#2980b9}.qr-generator-container .toggle-settings-btn.open::after{content:'−'}.settings-panel{padding:20px;border-top:1px solid #e0e0e0}#qr-result{max-width:100%;max-height:500px;border:1px solid #eee;border-radius:8px;box-shadow:0 4px 12px rgb(0 0 0 / .1)}.qr-content-fields>div{margin-bottom:15px;padding:15px;background:#f8f9fa;border-radius:6px;border:1px solid #e0e0e0}.qr-controls input[type="datetime-local"]{padding:10px;background-color:#fff}.location-type-selector{display:flex;gap:15px;margin-bottom:15px}.radio-label-wrapper{display:inline-flex;align-items:center;gap:5px;cursor:pointer}.faq-list{margin-top:1rem}.faq-list dt{font-weight:500;font-size:1.1em;margin-top:1rem}.faq-list dd{margin-left:0;margin-top:.5rem;margin-bottom:1rem;padding-left:1rem;padding-bottom:10px;border-bottom:1px dashed #ddd}#cropper-modal{position:fixed;z-index:1050;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0 0 0 / .6);display:none;align-items:center;justify-content:center}#cropper-modal-content{background-color:#fff;padding:25px;border-radius:10px;width:90%;max-width:600px;box-shadow:0 5px 15px rgb(0 0 0 / .3)}#cropper-modal-content h3{text-align:center;margin-top:0;margin-bottom:20px;color:#333}#custom-cropper-container{width:100%;height:400px;margin-bottom:20px;background-color:#f0f0f0;cursor:move;position:relative;overflow:hidden;border-radius:8px}#custom-cropper-canvas{position:absolute;top:0;left:0}.cropper-modal-buttons{text-align:center;display:flex;justify-content:center;gap:15px}.cropper-modal-buttons button{padding:5px 13px;font-size:16px;font-weight:500;border-radius:6px;border:1px solid #fff0;cursor:pointer;transition:transform 0.2s ease,background-color 0.2s ease}.cropper-modal-buttons .btn-primary{background-color:#2a73d9;color:#fff}.cropper-modal-buttons .btn-outline{background-color:#6c757d;color:#fff}.crop-shape-selector{text-align:center;margin-bottom:20px;display:flex;justify-content:center;gap:25px}.crop-shape-selector label{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:16px}.crop-shape-selector input{width:18px;height:18px}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@media (max-width:768px){.qr-generator-container{padding:0;box-shadow:none;border-radius:0;border-top:1px solid #e9ecef;border-bottom:1px solid #e9ecef}.qr-generator-layout{flex-direction:column}.qr-controls{min-width:100%;width:100%;padding:15px 0;box-sizing:border-box;border-right:none}.qr-preview{border-bottom:none;min-width:100%;width:100%;padding:10px 0;padding-bottom:30px;box-sizing:border-box}.form-row{gap:15px}.form-row2{flex-direction:column}.location-type-selector{flex-wrap:wrap;row-gap:1px}.form-row .form-group{width:100%}#qr-code-container{width:100%;max-width:300px;margin:0 auto}.qr-controls .form-control{max-width:100%;box-sizing:border-box}.btn-primary,.btn-secondary,.btn-outline{box-sizing:border-box}.action-buttons{gap:10px}.qr-preview #download-btn{width:auto}.qr-controls input[type="radio"],.qr-controls input[type="checkbox"]{width:17px;height:17px}}