:root{--primary-color: #3F51B5;--accent-color: #C5CAE9;--text-color: #212121;--background-color: #F5F5F5;--border-color: #E0E0E0}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,sans-serif;background-color:var(--background-color);color:var(--text-color);line-height:1.6}.container{display:flex;min-height:100vh;padding:20px;gap:20px}.left-panel{flex:1;background:#fff;padding:20px;border-radius:8px;box-shadow:0 2px 4px #0000001a;display:flex;flex-direction:column;gap:20px;max-width:500px}.template-selection,.common-fields,.template-specific-fields,.document-management{background:#fff;padding:15px;border-radius:6px;border:1px solid var(--border-color)}h2{color:var(--primary-color);margin-bottom:15px;font-size:1.2rem}.field{margin-bottom:15px}label{display:block;margin-bottom:5px;font-weight:500}input[type=text],select,textarea{width:100%;padding:8px 12px;border:1px solid var(--border-color);border-radius:4px;font-size:14px}.add-document{display:flex;gap:10px;margin-bottom:15px}.add-document input{flex:1}.document-list{max-height:300px;overflow-y:auto;border:1px solid var(--border-color);border-radius:4px;padding:10px}.document-list ul{list-style:none}.document-list li{display:flex;align-items:center;padding:8px;border-bottom:1px solid var(--border-color);cursor:move}.document-list li:last-child{border-bottom:none}.document-list li .drag-handle{cursor:move;margin-right:10px;color:var(--primary-color)}.document-list li label{display:flex;align-items:center;gap:8px;margin:0;cursor:pointer}.document-list li input[type=checkbox]{margin-right:8px}#emailPreview ul{list-style:none;padding-left:0;margin:15px 0}#emailPreview ul li{margin-bottom:8px;display:flex;align-items:center;gap:8px}.right-panel{flex:2;display:flex;flex-direction:column;gap:20px}.actions{display:flex;gap:10px;align-items:center}button{background-color:var(--primary-color);color:#fff;border:none;padding:10px 20px;border-radius:4px;cursor:pointer;font-weight:500;transition:background-color .2s}button:hover{background-color:#303f9f}.status{padding:10px;border-radius:4px;display:none}.status.success{display:block;background-color:#e8f5e9;color:#2e7d32}.status.error{display:block;background-color:#ffebee;color:#c62828}.preview-container{flex:1;background:#fff;padding:20px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.preview-frame{width:100%;height:calc(100vh - 200px);border:1px solid var(--border-color);border-radius:4px;overflow:auto;padding:20px}.preview-frame[contenteditable=true]{outline:none;background-color:#fff;cursor:text}.preview-frame[contenteditable=true]:focus{box-shadow:0 0 0 2px var(--primary-color)}.preview-frame[contenteditable=true]:hover{border-color:var(--primary-color)}.dropzone{border:2px dashed var(--primary-color);border-radius:6px;background:var(--accent-color);color:var(--primary-color);text-align:center;padding:18px 10px;margin-bottom:15px;transition:background .2s,border-color .2s;cursor:pointer}.dropzone.dragover{background:#e3e8fa;border-color:#303f9f}@media (max-width: 1024px){.container{flex-direction:column}.left-panel{max-width:none}.preview-frame{height:500px}}