.dialog-content { display: flex; flex-direction: column; margin-top: 2rem; } .form-container { display: flex; flex-direction: row; justify-content: space-between; gap: 24px; align-items: flex-start; } .menu-form { flex: 1; display: flex; flex-direction: column; gap: 16px; } .form-field { width: 100%; } .iframe-container { flex: 1; display: flex; flex-direction: column; align-items: flex-end; max-width: 50%; gap: 10px; } .iframe { width: 100%; height: 600px; border: 1px solid #ddd; border-radius: 8px; box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); } .editor-controls { display: flex; gap: 10px; width: 100%; justify-content: flex-end; } .html-editor { width: 100%; height: 600px; font-family: 'Courier New', Courier, monospace; font-size: 13px; border: 1px solid #ddd; border-radius: 8px; padding: 10px; resize: vertical; background-color: #fcfcfc; box-shadow: inset 0px 2px 5px rgba(0, 0, 0, 0.05); } .action-container { display: flex; justify-content: flex-end; gap: 1em; padding: 1.5em; }