*{box-sizing:border-box}body{margin:0;font-family:'IBM Plex Sans Arabic',Arial;background:#eef2f7;color:#101828}.topbar{height:76px;background:#fff;border-bottom:1px solid #dfe6ef;display:flex;align-items:center;justify-content:space-between;padding:0 22px;position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:12px}.brand img{width:52px;height:52px;object-fit:contain}.brand div{display:flex;flex-direction:column}.brand span{font-size:12px;color:#667085}.top-actions{display:flex;gap:8px;align-items:center}.top-actions button,.top-actions a{border:1px solid #d0d5dd;background:#fff;padding:10px 13px;border-radius:10px;color:#101828;text-decoration:none;cursor:pointer}.workspace{display:grid;grid-template-columns:190px minmax(360px,540px) minmax(420px,1fr);min-height:calc(100vh - 132px)}.sidebar{background:#101828;padding:18px 12px;position:sticky;top:76px;height:calc(100vh - 76px);overflow:auto}.tab{width:100%;text-align:right;border:0;background:transparent;color:#cbd5e1;padding:11px 12px;border-radius:9px;cursor:pointer;font-family:inherit}.tab:hover,.tab.active{background:#1f2a3d;color:#fff}.hint{color:#98a2b3;font-size:11px;line-height:1.7;padding:12px}.editor{padding:22px;overflow:auto}.panel{display:none}.panel.active{display:block}.panel h1{font-size:21px;margin:0 0 18px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.grid label,.panel>label{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:600}.grid label:has(textarea){grid-column:span 2}input,textarea,select{width:100%;border:1px solid #d0d5dd;border-radius:10px;background:#fff;padding:11px;font:inherit;color:#101828}textarea{min-height:90px;resize:vertical}input[type=color]{height:46px;padding:4px}.colors label{min-width:0}.preview-wrap{padding:20px;background:#dfe5ed;display:flex;flex-direction:column;min-width:0}.preview-label{font-size:11px;letter-spacing:2px;color:#667085;margin:0 0 8px}.preview-wrap iframe{width:100%;height:calc(100vh - 130px);border:0;border-radius:18px;background:#fff;box-shadow:0 18px 60px rgba(16,24,40,.18);transition:.25s;margin:auto}.preview-wrap.mobile iframe{max-width:390px}.savebar{position:fixed;bottom:0;right:190px;left:0;height:56px;background:#fff;border-top:1px solid #dfe6ef;display:flex;align-items:center;justify-content:space-between;padding:0 22px;z-index:30}.savebar button,.add,.upload button,.tools button{border:0;background:#0b63ce;color:#fff;padding:11px 18px;border-radius:10px;font:inherit;font-weight:700;cursor:pointer}.repeater{display:flex;flex-direction:column;gap:12px}.repeat-item{background:#fff;border:1px solid #dfe6ef;border-radius:13px;padding:13px;display:grid;grid-template-columns:1fr 1fr;gap:9px;position:relative}.repeat-item textarea{min-height:70px}.repeat-item .wide{grid-column:span 2}.remove{position:absolute;top:8px;left:8px;border:0;background:#fee4e2;color:#b42318;border-radius:8px;padding:5px 8px;cursor:pointer}.upload{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:8px;margin:18px 0}.media-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.media-item{background:#fff;border:1px solid #dfe6ef;border-radius:12px;padding:8px;display:flex;gap:10px;align-items:center}.media-item img{width:84px;height:62px;object-fit:cover;border-radius:8px}.media-item button{border:0;background:#fee4e2;color:#b42318;border-radius:7px;padding:5px 8px}.toggles{display:grid;grid-template-columns:1fr 1fr;gap:12px}.toggles label{background:#fff;border:1px solid #dfe6ef;padding:14px;border-radius:11px}.tools{display:flex;flex-wrap:wrap;gap:10px}.tools .danger{background:#b42318}.import{background:#101828;color:#fff;padding:11px 18px;border-radius:10px;cursor:pointer}.import input{display:none}small{color:#667085}@media(max-width:1100px){.workspace{grid-template-columns:170px 1fr}.preview-wrap{display:none}.savebar{right:170px}}@media(max-width:700px){.workspace{display:block}.sidebar{position:static;height:auto;display:flex;overflow:auto;white-space:nowrap}.tab{width:auto}.editor{padding:16px 16px 80px}.grid{grid-template-columns:1fr}.grid label:has(textarea){grid-column:auto}.savebar{right:0}.topbar{padding:0 12px}.brand span{display:none}.upload{grid-template-columns:1fr}.repeat-item{grid-template-columns:1fr}.repeat-item .wide{grid-column:auto}}
