/* Майстер сторінок порталу (SspPageWizard): геометрія з udc.creatio.com, 1440px */
.sw { position: fixed; inset: 0; z-index: 100000; background: #ebeeef; font-family: 'Bpmonline Open Sans', Arial, sans-serif; color: #444; overflow: hidden; }
.sw-hdr { position: absolute; left: 0; top: 0; right: 0; height: 40px; background: #fff; box-shadow: rgba(0,0,0,.2) 0 1px 5px 0; z-index: 5; }
.sw-btn { display: inline-block; box-sizing: border-box; height: 26px; padding: 4px 10.5px; border: 1px solid transparent; border-radius: 2px; font: 15px/16px 'Bpmonline Open Sans', sans-serif; text-transform: uppercase; color: #006ce0; cursor: pointer; white-space: nowrap; }
.sw-btn.green { background: #22ac14; color: #fff; }
.sw-btn.blue { background: #006ce0; color: #fff; height: 30px; padding: 4.5px 10.5px 5.5px; line-height: 18px; }
.sw-hdr > .sw-btn { position: absolute; top: 7px; }
.sw-hdr > .sw-btn.green { left: 16px; }
.sw-hdr > .sw-btn:not(.green) { left: 114px; }
.sw-modes { position: absolute; left: 615px; top: 7px; display: flex; gap: 9px; }
.sw-mode { box-sizing: border-box; height: 33px; padding: 3px 10.5px 8px; border: 1px solid transparent; font: 15px/18px 'Bpmonline Open Sans', sans-serif; text-transform: uppercase; color: #006ce0; cursor: pointer; border-radius: 2px; }
.sw-mode.on { color: #444; border-bottom: 3px solid #ff4013; border-radius: 0; padding-bottom: 6px; }
.sw-gear { position: absolute; right: 16px; top: 7px; width: 26px; height: 26px; background: url(/img/sd/pw/PageDesignerHeaderViewConfig-PageWizardPropertiesPageIcon.svg) no-repeat center / 26px 26px; cursor: pointer; }
/* ліва панель 300px */
.sw-left { position: absolute; left: 0; top: 40px; bottom: 32px; width: 300px; box-sizing: border-box; background: #fff; border: 1px solid #e6e6e6; border-top: 0; border-radius: 3px 3px 0 0; overflow: auto; }
.sw-grp { background: #fff; }
.sw-gcap { position: relative; display: flex; align-items: center; height: 32px; box-sizing: border-box; border-bottom: 1px solid #e6e6e6; padding-left: 16px; cursor: pointer; font: 15px/22px 'Bpmonline Open Sans', sans-serif; color: #444; }
.sw-grp.ent .sw-gcap { background: #e4ebfa; border-bottom-color: #d7dbe6; }
.sw-gico { width: 16px; height: 16px; margin: 2px 10px 0 0; background: url(/img/sd/pw/ElementDataSourceViewModel-DataModelImage.svg) no-repeat center / 16px; }
.sw-gico.ent { background-image: url(/img/sd/pw/EntityDataSourceViewModel-DataModelImage.svg); }
.sw-gmenu { position: absolute; left: 249px; top: 9px; width: 16px; height: 16px; background: url(/img/sd/pw/EntityDataSourceViewModel-DataModelMenuImage.svg) no-repeat center / 16px; }
.sw-gmark { position: absolute; left: 270px; top: 3.5px; width: 16px; height: 16px; background: url(/img/sd/pw/data3.svg) no-repeat center / 16px; }
.sw-grp.closed .sw-gmark { background-image: url(/img/sd/pw/data1.svg); }
.sw-sub { margin: 0 0 0 40px; height: 30.5px; width: 263px; font: 15px/30.5px 'Bpmonline Open Sans', sans-serif; color: #4e7bd8; }
.sw-items { padding: 5px 0 0 40px; }
.sw-gbody { padding-top: 5px; }
.sw-items + .sw-sub { margin-top: 2px; }
.sw-item { display: flex; align-items: center; box-sizing: border-box; width: 253px; height: 32px; margin-bottom: 2px; border: 1px solid rgba(0,0,0,.1); background: #fff; cursor: move; }
.sw-item img { width: 16px; height: 16px; margin: 0 5px 0 3px; }
.sw-item span { font: 14px/18.2px 'Bpmonline Open Sans', sans-serif; color: #444; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 220px; }
.sw-item.used { cursor: default; } .sw-item.used span { color: #aeaeae; }

/* центр */
.sw-center { position: absolute; left: 307px; top: 46px; right: 6px; bottom: 6px; }
.sw-title { height: 50px; background: #fff; border: 1px solid #e6e6e6; border-bottom: 0; border-radius: 3px 3px 0 0; box-sizing: border-box; padding: 10px 20px 0 20px; }
.sw-title input { display: block; width: 100%; box-sizing: border-box; height: 37.5px; border: 1px solid #fff; border-bottom: 1px dotted #c8c8c8; padding: 0 11px 0 0; outline: 0; font: 26px 'Bpmonline Open Sans Light', 'Bpmonline Open Sans', sans-serif; color: #444; background: #fff; }
.sw-actions { height: 56px; background: #fff; border: 1px solid #e6e6e6; border-top: 0; border-radius: 0 0 3px 3px; box-sizing: border-box; }
.sw-body { display: flex; margin-top: 6px; }
.sw-profile { width: 304px; flex: none; }
.sw-gwrap { background: #fff; border: 1px solid #e6e6e6; border-radius: 3px; padding: 20px; box-sizing: content-box; }
.sw-profile .sw-gwrap { width: 256px; }
.sw-grid { position: relative; }
.sw-main { flex: 1; min-width: 0; }
.sw-head { background: #fff; border: 1px solid #e6e6e6; border-radius: 3px; padding: 18px 18px 18px 18px; box-sizing: border-box; }
.sw-head .sw-gwrap { border: 0; padding: 2px 2px 2px 2px; }
.sw-cell { position: absolute; height: 50px; box-sizing: border-box; border: 1px solid #eee; }
.sw-cell.over { background: #eef3fb; }
.sw-el { position: absolute; box-sizing: border-box; display: flex; align-items: center; background: rgba(255,255,255,.8); border: 1px solid #b4c1d2; cursor: move; padding-left: 8px; }
.sw-el img { width: 16px; height: 16px; margin-right: 0; }
.sw-el span:not(.sw-elacts) { font: 14px 'Bpmonline Open Sans', sans-serif; color: #444; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sw-el.sel { border-color: #006ce0; }
.sw-elacts { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); display: none; gap: 2px; }
.sw-el:hover .sw-elacts { display: flex; }
.sw-elacts i { width: 24px; height: 24px; cursor: pointer; background: no-repeat center / 16px; }
.sw-elacts i.set { background-image: url(/img/sd/pw/GridLayoutEditItemModel-SettingsImage.png); }
.sw-elacts i.rm { background-image: url(/img/sd/pw/GridLayoutEditItemModel-RemoveImage.png); }
/* вкладки */
.sw-tabs { margin-top: 6px; background: #fff; border: 1px solid #e6e6e6; border-radius: 3px; min-height: 638px; box-sizing: border-box; padding: 14px 0 20px 20px; }
.sw-tabc { padding-right: 20px; }
.sw-tabbar { position: relative; display: flex; height: 32px; border-bottom: 1px solid #dbdbdb; padding-right: 40px; }
.sw-tscroll { width: 30px; height: 30px; flex: none; background: url(/img/sd/pw/left-arrow-icon-sprite.png) no-repeat 0 0 / 30px auto; }
.sw-tscroll.r { background-image: url(/img/sd/pw/right-arrow-icon-sprite.png); }
.sw-tabbar ul { display: flex; flex: 1; margin: 0 0 0 8px; padding: 0; list-style: none; gap: 20px; }
.sw-tabbar li { box-sizing: border-box; height: 32px; padding: 3px 6px 0; font: 14px/26px 'Bpmonline Open Sans', sans-serif; text-transform: uppercase; color: #4e7bd8; cursor: pointer; white-space: nowrap; }
.sw-tabbar li.on { color: #444; border-bottom: 3px solid #ff4013; }
.sw-ttools { position: absolute; right: 40px; top: 2px; display: flex; }
.sw-ttools i { width: 24px; height: 27px; cursor: pointer; background: no-repeat center 5px / 16px; }
.sw-ttools i.add { background-image: url(/img/sd/pw/ViewModelSchemaDesignerViewGenerator-Add.png); }
.sw-ttools i.edit { background-image: url(/img/sd/pw/ViewModelSchemaDesignerViewGenerator-Edit.png); }
.sw-ttools i.del { background-image: url(/img/sd/pw/ViewModelSchemaDesignerViewGenerator-Delete.png); }
.sw-tabc { padding-top: 20px; }
.sw-det { position: relative; display: flex; align-items: flex-start; height: 30px; margin-bottom: 0; padding-top: 1px; box-sizing: border-box; }
.sw-dmark { position: absolute; left: -4px; top: 2px; width: 24px; height: 24px; background: url(/img/sd/pw/arrow_group.svg) no-repeat center / 24px; transform: rotate(-90deg); }
.sw-dcap { margin-left: 29px; font: 15px/22px 'Bpmonline Open Sans', sans-serif; color: #4e7bd8; }
.sw-det.inh .sw-dcap { color: #999; }
.sw-dtools { display: none; margin-left: 20px; gap: 14px; font-size: 14px; color: #444; }
.sw-det:hover .sw-dtools { display: flex; }
.sw-dtools span { display: inline-flex; align-items: center; cursor: pointer; }
.sw-dtools i { width: 16px; height: 16px; margin-right: 8px; background: no-repeat center / 16px; }
.sw-dtools i.edit { background-image: url(/img/sd/pw/ViewModelSchemaDesignerViewGenerator-Edit.png); }
.sw-dtools i.del { background-image: url(/img/sd/pw/ViewModelSchemaDesignerViewGenerator-Delete.png); }
.sw-tabbtns { display: flex; gap: 18px; margin-top: 18px; }
/* бізнес-правила */
.sw-rules { position: absolute; left: 6px; top: 46px; right: 6px; bottom: 6px; background: #fff; border: 1px solid #e6e6e6; box-sizing: border-box; padding: 20px; }
.sw-rules > .sw-btn { position: absolute; left: 20px; top: 20px; }
.sw-empty { position: absolute; left: 0; right: 0; top: 73px; text-align: center; }
.sw-empty img { width: 135px; height: 139px; margin-bottom: 52px; }
.sw-e1 { font: 24px 'Bpmonline Open Sans Light', sans-serif; color: #999; }
.sw-e2 { width: 477px; height: 100px; box-sizing: border-box; margin: 0 auto; padding: 11px 0 0 30px; text-align: left; box-shadow: #54b8df -3px 0 0 0; font: 28px/38px 'Bpmonline Open Sans Light', sans-serif; color: #999; }
.sw-e1 + .sw-e2 { margin-top: 29px; }
.sw-e2 a { color: #4e7bd8; text-decoration: none; }
/* вихідний код */
.sw-src { position: absolute; left: 6px; top: 46px; right: 6px; bottom: 6px; background: #fff; border: 1px solid #e6e6e6; box-sizing: border-box; padding: 49px 26px 20px 26px; }
.sw-ace { height: 100%; overflow: auto; font: 12px/16px Monaco, Menlo, 'Ubuntu Mono', Consolas, source-code-pro, monospace; color: #404040; }
.sw-line { display: flex; white-space: pre; }
.sw-ln { display: none; }
.sw-code { padding-left: 0; }
