/* ===== Form Designer ===== */
body.designer{overflow:hidden}
.dz{display:grid;grid-template-columns:250px 1fr 300px;height:calc(100vh - 46px)}
.flist{background:#fff;border-right:1px solid #d0d5dd;overflow:auto;padding:8px;font:13px "Segoe UI",Arial}
.flist .g{font-size:10.5px;font-weight:800;letter-spacing:.6px;color:#667085;text-transform:uppercase;margin:10px 4px 3px}
.flist a{display:block;padding:5px 8px;border-radius:6px;color:#1d2433;text-decoration:none;cursor:pointer}
.flist a:hover{background:#f2f4f7}
.flist a.on{background:#b3261e;color:#fff}
.flist a .chg{float:right;font-size:10px;background:#fdf3e1;color:#8a5300;border-radius:8px;padding:0 6px}
.flist a.on .chg{background:#fff}
.flist .newf{width:100%;margin:4px 0 6px;background:#1f5fa8;color:#fff;border:none;border-radius:6px;padding:7px;font-weight:600;cursor:pointer}
.dmain{overflow:auto}
.dempty{color:#fff;text-align:center;margin-top:80px;font:15px "Segoe UI",Arial}
.dside{background:#fff;border-left:1px solid #d0d5dd;overflow:auto;padding:12px;font:13px "Segoe UI",Arial}
.dside h4{margin:0 0 6px;font-size:14px}
.dside .muted{color:#667085;font-size:12px}
.dside .sbtn{display:block;width:100%;text-align:left;margin:5px 0;border:1px solid #d0d5dd;background:#fff;border-radius:6px;padding:7px 10px;cursor:pointer;font:13px "Segoe UI",Arial}
.dside .sbtn:hover{background:#f7f8fa}
.dside .sbtn.red{color:#b3261e}
.dside label{display:block;font-size:12px;color:#667085;font-weight:600;margin:8px 0 3px}
.dside input[type=text],.dside select,.dside textarea{width:100%;padding:6px 8px;border:1px solid #d0d5dd;border-radius:6px;font:13px "Segoe UI",Arial}
.dside .ck{display:flex;align-items:center;gap:6px;color:#344054;font-weight:400}
.dside hr{border:none;border-top:1px solid #e4e7ec;margin:12px 0}
.dside .help{background:#f7f8fa;border-radius:6px;padding:8px 10px;color:#475467;font-size:12px;line-height:1.5}
/* paper in design mode */
form.paper.dmode input,form.paper.dmode textarea,form.paper.dmode select{cursor:pointer;caret-color:transparent}
form.paper.dmode .dl{outline:1px dashed rgba(31,95,168,.45);cursor:text;border-radius:2px}
form.paper.dmode .dl:hover{background:rgba(31,95,168,.12)}
form.paper.dmode .relabel{background:rgba(255,193,7,.25)}
form.paper.dmode .du{cursor:pointer}
form.paper.dmode .du:hover{outline:2px solid rgba(31,95,168,.35)}
form.paper.dmode .dsel{outline:2px solid #1f5fa8!important;background:rgba(31,95,168,.06)}
form.paper.dmode [data-x]{outline:1px dashed #1a7f4b;background:rgba(26,127,75,.07);cursor:pointer}
form.paper.dmode [data-x].dsel{outline:2px solid #1a7f4b!important}
.addend{display:block;margin:10px auto 30px;border:2px dashed #fff;background:transparent;color:#fff;border-radius:8px;padding:8px 18px;font:14px "Segoe UI",Arial;cursor:pointer}
.fdform label{display:block;font-size:12px;color:#667085;font-weight:600;margin:9px 0 3px}
.fdform label.inl{display:flex;align-items:center;gap:6px;color:#344054;font-weight:400}
.fdform input:not([type=checkbox]),.fdform select{width:100%;padding:7px 9px;border:1px solid #d0d5dd;border-radius:6px;font:13px "Segoe UI",Arial}
.toast{position:fixed;right:18px;bottom:18px;background:#1d2433;color:#fff;padding:10px 16px;border-radius:8px;z-index:99;opacity:0;transition:opacity .2s;pointer-events:none;font:14px "Segoe UI",Arial}
.toast.on{opacity:1}.toast.err{background:#b3261e}