.qr-container{display:flex;flex-wrap:wrap;gap:30px;margin-top:20px}
.qr-options{flex:1;min-width:300px;background:#f8f9fa;padding:20px;border-radius:8px;border:1px solid #eee;box-sizing:border-box}
.qr-preview{flex:1;min-width:300px;display:flex;flex-direction:column;align-items:center;background:#fff;padding:20px;border-radius:8px;border:1px solid #eee;min-height:500px;box-sizing:border-box}
#qrcode{margin:auto;padding:10px;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,0.05)}
#qrcode canvas,#qrcode img{max-width:100%;height:auto;display:block}
.qr-action-area{width:100%;text-align:center;padding-top:20px;border-top:1px solid #eee;margin-top:auto}
.color-picker-box{display:flex;align-items:center;gap:15px}
.color-item{display:flex;align-items:center;gap:5px}
.layui-form-label{width:85px;padding:9px 10px}
.layui-input-block{margin-left:115px}
#logoPreview img{width:40px;height:40px;object-fit:cover;border-radius:4px;border:1px solid #ddd}
.logo-upload-area{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.preset-logos-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(40px, 1fr));
    gap: 10px;
}
.preset-logo-item {
    width: 100%;
    aspect-ratio: 1;
    border: 1px solid #eee;
    border-radius: 4px;
    cursor: pointer;
    padding: 4px;
    transition: all 0.2s;
    object-fit: contain;
    background: #fff;
    box-sizing: border-box;
}
.preset-logo-item:hover {
    border-color: #1E9FFF;
    transform: scale(1.05);
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
@media screen and (max-width:768px){.layui-form-label{float:none;width:100%;padding:0 0 5px 0;text-align:left}.layui-input-block{margin-left:0}.qr-container{gap:15px;flex-direction:column}.qr-options,.qr-preview{min-width:0;width:100%;padding:15px}}

/* 修复PC端标签换行导致的错位问题 - 仅在PC端生效 */
@media screen and (min-width: 769px) {
    .layui-form-label {
        width: auto !important;
        padding: 9px 10px !important;
    }
    .layui-input-block {
        margin-left: 0px !important;
    }
}