#initial-screen{border:15px solid #ececf0}#form-builder-app{display:flex;width:100%;height:100vh;overflow:hidden}#form-components{width:45%;border-right:1px solid #ddd;padding-right:20px}#form-components h1{font-size:1.5em;margin-bottom:10px}#form-components h3{font-size:1.2em;color:#666;margin-bottom:15px}#form-builder{width:55%;padding-left:20px;overflow-y:auto;border:15px solid #fff}#form-builder-canvas{width:55%;padding-left:20px;overflow-y:auto;border:15px solid #fff}#form-builder-canvas h2{font-size:1.5em;margin-bottom:10px}#drop-zone-table{width:100%;border:2px;display:flex}#drop-zone{min-height:800px;width:100%;max-width:800px;border:2px dashed #fff;background-color:#f0f0f0;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;color:#666;padding:20px;margin-top:15px;border-radius:8px;box-shadow:0 4px 8px rgb(0 0 0 / .1);transition:background-color .3s , border-color .3s;gap:10px}#drop-zone:hover{background-color:#e0e0e0;border-color:#777}.draggable-component{background-color:#fff;border:1px solid #fff;border-color:#fff;width:100%;text-align:left;cursor:grab;border-radius:4px}.draggable-component:active{cursor:grabbing}#saved-forms-list{display:flex;flex-wrap:wrap;gap:20px;padding:0;margin:20px 0;list-style-type:none}.form-card{background-color:#f8f9fa;border:1px solid #dee2e6;border-radius:8px;box-shadow:0 4px 6px rgb(0 0 0 / .1);padding:20px;width:250px;box-sizing:border-box;transition:transform .2s}.form-card:hover{transform:translateY(-5px)}.form-card-content{text-align:left}.empty-card{width:21%;text-align:center;background-color:#e0e0e0;color:#999}.delete-form-btn{text-align:center;color:#faf8f8;background-color:#eb0707;text-align:center;border:1px solid #dee2e6;border-radius:8px;padding:10px;width:40%}.button-delete-componet{text-align:center;color:#faf8f8;background-color:#eb0707;text-align:center;border:1px solid #dee2e6;border-radius:8px;padding:10px;width:25%}.edit-form-btn{text-align:center;color:#faf8f8;background-color:#040d8d;text-align:center;border:1px solid #dee2e6;border-radius:8px;padding:10px;width:40%}.apply-customization{text-align:center;color:#faf8f8;background-color:#040d8d;text-align:center;border:1px solid #dee2e6;border-radius:8px;padding:10px;width:40%}.apply-sumit{text-align:center;color:#faf8f8;background-color:#424de7;text-align:center;border:1px solid #dee2e6;border-radius:8px;padding:10px;width:40%}.delete-all-form-btn{text-align:center;color:#faf8f8;background-color:#eb0707;text-align:center;border:1px solid #dee2e6;border-radius:8px;padding:10px;width:12%}.button-delete-card{text-align:center;color:#faf8f8;background-color:#eb0707;text-align:center;border:1px solid #dee2e6;border-radius:8px;padding:5px}.outLine{outline:0;display:block;unicode-bidi:isolate}.form-popup{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0 0 0 / .5)}.form-popup-content{background-color:#fff;margin:15% auto;padding:20px;border:1px solid #888;width:80%;max-width:600px;border-radius:10px}.close-popup{color:#aaa;float:right;font-size:28px;font-weight:700;cursor:pointer}.close-popup:hover,.close-popup:focus{color:#000;text-decoration:none;cursor:pointer}.draggable-component.selected{border:2px dashed red;background-color:#ffe6e6}.form-builder-form{width:100%}.drop-zone label{width:100%;display:flex;font-weight:bold!important;color:#070707;margin-right:10px;font-family:Arial,sans-serif;font-size:15px}.adjust-icon{cursor:pointer;margin-left:5px}.adjustment-container{padding:25px;margin-top:5px;background-color:#f9f9f9;font-family:Arial,sans-serif;width:flex}.adjustment-container label{margin-right:10px;width:150px;display:inline-block;font-weight:700;margin-bottom:10px}.adjustment-container input[type="number"]{width:47px;font-family:Arial,sans-serif;padding:3px;margin-bottom:10px}.adjustment-container select{width:100px;font-family:Arial,sans-serif;padding:3px;margin-bottom:10px}.adjustment-container input[type="text"]{width:300px;font-family:Arial,sans-serif;padding:3px}.adjustment-container button{margin-top:10px;padding:5px 15px;font-family:Arial,sans-serif;cursor:pointer}.help-message{font-size:.85em;color:#666;display:block;margin-top:5px;font-family:Arial,sans-serif}.close-button{background-color:#f44336;color:#fff;padding:5px 10px;font-family:Arial,sans-serif;font-weight:700;cursor:pointer;float:right;margin-bottom:5px;border:1px solid #dee2e6;border-radius:8px;width:40%}.close-button:hover{background-color:#d32f2f}.apply-button{background-color:#4caf50;color:#fff;border:none;padding:5px 15px;font-family:Arial,sans-serif;font-weight:700;cursor:pointer;margin-top:10px;border:1px solid #dee2e6;border-radius:8px;width:40%}.apply-button:hover{background-color:#388e3c}.tab{background-color:#fff;color:#333;text-align:center;transition:background-color .3s}.tab:hover{background-color:#e0e0e0}.draggable-container{background-color:#fafafa;transition:box-shadow .3s}.draggable-container:hover{box-shadow:0 4px 6px rgb(0 0 0 / .1)}