.field-palette{background:#fff;border-right:1px solid #e5e7eb;flex-direction:column;height:100%;display:flex}.palette-header{border-bottom:1px solid #e5e7eb;padding:1.5rem}.palette-header h5{color:#1f2937;font-size:1rem;font-weight:600}.palette-content{flex:1;padding:1rem;overflow-y:auto}.field-category{margin-bottom:1.5rem}.field-category:last-child{margin-bottom:0}.category-title{text-transform:uppercase;letter-spacing:.05em;color:#6b7280;margin-bottom:.75rem;font-size:.75rem;font-weight:600}.field-list{grid-template-columns:repeat(2,1fr);gap:.5rem;display:grid}.field-item{cursor:grab;background:#fff;border:1px solid #e5e7eb;border-radius:.5rem;flex-direction:column;align-items:center;gap:.5rem;padding:.875rem .5rem;transition:all .2s;display:flex}.field-item:hover{background:#f9fafb;border-color:#0a3764;transform:translateY(-2px);box-shadow:0 4px 6px -1px #0000001a}.field-item:active{cursor:grabbing;transform:scale(.95)}.field-icon{color:#0a3764;background:#eef2ff;border-radius:.5rem;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;display:flex}.field-label{color:#374151;text-align:center;font-size:.75rem;font-weight:500;line-height:1.2}
.builder-container{background:#f9fafb;flex-direction:column;display:flex;position:fixed;inset:4rem 0 0 16rem}.builder-toolbar{z-index:10;background:#fff;border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.5rem;display:flex}.builder-toolbar input[type=text]{max-width:24rem}.builder-toolbar input[type=text]:focus{background:#f9fafb}.builder-toolbar .btn svg{display:block}.builder-main{flex:1;display:flex;overflow:hidden}.builder-palette{flex-shrink:0;width:16rem;overflow-y:auto}.builder-canvas{background:#f9fafb;flex:1;padding:2rem;overflow-y:auto}.builder-canvas.preview-mode{background:#fff;justify-content:center;padding:3rem 2rem;display:flex}.canvas-dropzone{background:#fff;border-radius:.75rem;min-height:100%;box-shadow:0 1px 3px #0000001a}.empty-state{text-align:center;color:#9ca3af;flex-direction:column;justify-content:center;align-items:center;min-height:32rem;padding:3rem;display:flex}.empty-state svg{opacity:.5;margin-bottom:1.5rem}.empty-state h4{color:#4b5563;margin-bottom:.5rem}.empty-state p{max-width:20rem}.form-fields-container{padding:2rem}.form-field-item{cursor:pointer;background:#fff;border:2px solid #e5e7eb;border-radius:.5rem;margin-bottom:1rem;padding:1rem;transition:all .2s;position:relative}.form-field-item:hover{border-color:#d1d5db;box-shadow:0 2px 4px #0000000d}.form-field-item.selected{border-color:#0a3764;box-shadow:0 0 0 3px #4f46e51a}.form-field-item[draggable=true]{cursor:grab}.form-field-item[draggable=true]:active{cursor:grabbing}.form-field-item.dragging{opacity:.5;border-style:dashed}.field-header{border-bottom:1px solid #e5e7eb;align-items:center;gap:.75rem;margin-bottom:.75rem;padding-bottom:.75rem;display:flex}.field-drag-handle{color:#9ca3af;cursor:grab;align-items:center;display:flex}.field-drag-handle:active{cursor:grabbing}.field-type-badge{text-transform:uppercase;color:#6b7280;letter-spacing:.05em;flex:1;font-size:.75rem;font-weight:600}.field-actions{gap:.25rem;display:flex}.btn-icon-sm{color:#6b7280;cursor:pointer;background:0 0;border:1px solid #e5e7eb;border-radius:.375rem;justify-content:center;align-items:center;width:1.75rem;height:1.75rem;padding:0;transition:all .15s;display:inline-flex}.btn-icon-sm:hover{color:#374151;background:#f3f4f6;border-color:#d1d5db}.btn-icon-sm.text-danger{color:#ef4444}.btn-icon-sm.text-danger:hover{background:#fef2f2;border-color:#fee2e2}.field-preview{pointer-events:none;opacity:.9}.builder-properties{background:#fff;border-left:1px solid #e5e7eb;flex-shrink:0;width:20rem;overflow-y:auto}.properties-content{flex-direction:column;height:100%;display:flex}.properties-header{border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;padding:1.5rem;display:flex}.properties-header h5{margin:0;font-size:1rem;font-weight:600}.properties-body{max-height:calc(100vh - 200px);padding:1.5rem;overflow-y:auto}.options-list{max-height:300px;overflow-y:auto}.options-list .option-item .input-group input:first-child{flex:1.5}.options-list .option-item .input-group input:nth-child(2){flex:1}.options-list .option-item .input-group .btn{padding:.25rem .5rem}.properties-empty{text-align:center;color:#9ca3af;flex-direction:column;justify-content:center;align-items:center;height:100%;padding:2rem;display:flex}.properties-empty svg{opacity:.5;margin-bottom:1rem}.properties-empty p{max-width:16rem}.form-preview-container{background:#fff;border-radius:.75rem;width:100%;max-width:800px;padding:3rem;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.form-preview-header{border-bottom:2px solid #e5e7eb;margin-bottom:2rem;padding-bottom:1.5rem}.form-preview-header h2{color:#111827;margin:0 0 .5rem;font-size:1.875rem;font-weight:700}.form-preview-header p{color:#6b7280;margin:0}.form-preview-fields .preview-field-item{margin-bottom:1.5rem}.form-preview-fields .preview-field-item:last-child{margin-bottom:0}.form-preview-actions{border-top:1px solid #e5e7eb;gap:1rem;padding-top:2rem;display:flex}.form-preview-actions .btn{cursor:not-allowed;opacity:.7}@media (max-width:1400px){.builder-properties{width:18rem}}@media (max-width:1200px){.builder-palette{width:14rem}.builder-properties{width:16rem}}@media (max-width:991px){.builder-container{left:0}.builder-palette,.builder-properties{z-index:20;position:absolute;top:0;bottom:0;box-shadow:0 10px 15px -3px #0000001a}.builder-palette{transition:left .3s;left:-16rem}.builder-palette.show{left:0}.builder-properties{transition:right .3s;right:-20rem}.builder-properties.show{right:0}}