/* Flow designer and step configuration menus. */
:root{--panel:398px;--light:#a6e3ff;--navy:#102b46}
.topbar{background:#102b46;border-color:#213c56;color:#eef6ff;height:47px;min-height:47px}.topbar .app-name{font-size:18px;letter-spacing:-.35px;color:#f1f7ff;font-weight:600}.topbar .breadcrumb-link,.topbar .breadcrumb span{color:#c1d2e4}.topbar .breadcrumb .icon{color:#829db6}.topbar .search-button,.topbar .icon-btn{color:#d0dfee}.topbar .search-button kbd{background:#24425e;color:#d1dfed;border-color:#3e5871}.sidebar{background:#102b46;border-right:1px solid #28425b;padding-top:15px}.brand img{width:30px;height:30px}.sidebar .nav-item.active{background:#315575}.sidebar .nav-item:hover{background:#284963}
.designer-heading{min-height:75px;padding-top:11px;padding-bottom:11px}.designer-heading h1{font-size:20px;letter-spacing:-.3px;margin-top:3px}.designer-category{font-size:10px}.designer-heading-actions .btn{min-height:33px;font-size:11px;border-radius:3px}.designer-workspace .graph-panel-header{height:43px;min-height:43px;padding-block:7px;background:#fff}.canvas-caption h2{font-size:12px}.designer-workspace{background:#f4f5f8}.designer-workspace .vertical-viewport{background-color:#f5f6f9;background-image:radial-gradient(#c9d2dd .7px,transparent .7px);background-size:18px 18px}.designer-workspace .graph-panel-footer{height:41px;min-height:41px;background:#fff}
.designer-workspace>.step-editor{order:-1;border-right:1px solid #d1dbe7;border-left:0;box-shadow:4px 0 14px #112f4d08;flex-basis:var(--panel);width:var(--panel)}.designer-workspace .step-editor-header{min-height:77px;padding:14px 18px;gap:10px}.pane-type-mark{height:32px;width:32px;background:#e9f1fa;color:#356c9e;display:grid;place-items:center;border-radius:4px;flex-shrink:0}.pane-type-mark .icon{height:17px;width:17px}.step-editor-header>div{overflow:hidden;min-width:0}.step-editor-header h2{font-size:14px;line-height:1.45;margin:3px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#213e5b;font-weight:600}.pane-context{font-size:10px;color:#5d738c}
.pane-navigation{padding:0 17px;gap:18px;min-height:42px;overflow:auto;scrollbar-width:none;flex-shrink:0}.pane-navigation [role=tab]{position:relative;white-space:nowrap;border-bottom:2px solid transparent;font-size:11px;padding:12px 0 10px;color:#526981}.pane-navigation [role=tab][aria-selected=true]{border-color:#2869ad;color:#174f87;font-weight:600}.pane-navigation [role=tab]:hover{color:#174f87}.pane-navigation [role=tab]:focus-visible{outline:2px solid #4f82bc;outline-offset:-3px}
.designer-workspace .step-editor-body{padding:20px 19px;scroll-behavior:auto}.step-menu[hidden]{display:none!important}.step-menu{display:block;animation:menu-in .12s ease-out}.step-editor-body .step-menu>label,.step-editor-body .resource-submenu>label{margin-bottom:17px;font-size:12px}.step-editor-body input,.step-editor-body textarea,.step-editor-body select{border-radius:3px;min-height:36px;padding:8px 10px;font-size:12px;border-color:#cbd6e3;color:#254461;box-shadow:none}.step-editor-body textarea{min-height:80px;line-height:1.6}.step-editor-body .compact-grid{gap:12px}.step-editor-body .compact-grid label{margin-bottom:17px;font-size:11px}.step-editor-body input::placeholder,.step-editor-body textarea::placeholder{color:#728298}.step-editor-body .menu-intro{margin-bottom:20px}.menu-intro h3,.resource-list-heading h3{margin:0 0 5px;font-size:13px;font-weight:600;color:#2a496a}.menu-intro p,.resource-list-heading p{font-size:11px;line-height:1.55;color:#61758c;margin:0}.menu-empty{font-size:12px;line-height:1.6;color:#64788f;margin:14px 0}
.general-extra,.resource-more{border-top:1px solid #e1e7ef;margin-top:2px;padding-top:13px}.general-extra>summary,.resource-more>summary{font-size:11px;color:#4d6b8d;cursor:pointer;margin-bottom:17px}.general-extra>label,.resource-more>label{font-size:11px}.general-extra .danger{font-size:11px;color:#983d45}.step-editor-body .connection-list{margin:0 0 20px;display:flex;flex-direction:column;gap:9px}.connection-list>div{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid #dce4ee;padding:10px 12px;border-radius:3px;font-size:12px;color:#355578}.connection-list>div>span{display:flex;gap:8px;align-items:center}.connection-list .icon{height:14px;width:14px;flex-shrink:0}.menu-separator{height:1px;background:#e1e7ef;margin:21px 0}
.resource-list-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:17px}.resource-list-heading h3{font-size:12px}.resource-list-heading h3>span{font-size:10px;color:#61758c;margin-left:4px;font-weight:400}.resource-list-heading p{font-size:10px;max-width:205px}.resource-list-heading .btn{font-size:10px;min-height:29px;padding:6px 8px;gap:4px;flex-shrink:0;border-radius:3px}.resource-list-heading .btn .icon{width:11px;height:11px}.resource-rows{display:flex;flex-direction:column;gap:10px}.resource-row{border:1px solid #d8e1ec;border-radius:4px;background:#fff;overflow:hidden}.resource-row-heading{display:flex;align-items:center;gap:9px;padding:11px 12px 8px}.resource-type-icon{width:27px;height:29px;background:#edf3f9;display:grid;place-items:center;border-radius:3px;color:#4a729c;flex-shrink:0}.resource-type-icon .icon{width:15px;height:15px}.resource-name{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px;text-align:left;padding:0;background:none;border:0;cursor:pointer;font:inherit}.resource-name strong{font-size:12px;font-weight:550;color:#284f77;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.resource-name small{font-size:10px;color:#62788f}.resource-name:hover strong{text-decoration:underline;text-underline-offset:2px}.resource-row-heading>.icon-btn{width:21px;height:21px;padding:4px;margin-left:auto;color:#73879e}.resource-row-heading>.icon-btn .icon{width:13px;height:13px}.resource-row-usage{display:flex;align-items:center;gap:9px;padding:7px 12px 9px;background:#fafbfd;border-top:1px solid #edf0f5}.resource-row-usage>span{font-size:10px;color:#657a91;margin-right:auto}.step-editor-body .resource-row-usage select{font-size:11px;padding:4px 23px 4px 8px;min-height:28px;width:139px;background-color:#fff;margin:0}.resource-row-usage .icon-btn{height:24px;width:23px;padding:5px;color:#52749b}.resource-row-usage .icon-btn .icon{width:12px;height:12px}
.resource-zero{display:flex;flex-direction:column;align-items:center;text-align:center;padding:32px 13px 22px;border:1px dashed #c8d7e8;border-radius:4px;background:#fbfcfe}.resource-zero>.icon{height:25px;width:25px;color:#7795b5}.resource-zero h4{font-size:12px;color:#355676;margin:14px 0 6px;font-weight:550}.resource-zero p{font-size:11px;line-height:1.6;color:#61758c;max-width:230px;margin:0 0 17px}.resource-back{display:flex;align-items:center;gap:6px;font:inherit;font-size:11px;color:#41688e;padding:0 0 17px;border:0;background:none;cursor:pointer}.resource-back .icon{height:13px;width:13px}.resource-back:hover{color:#174f87}.resource-submenu .menu-intro{margin-bottom:17px}.resource-submenu .resource-more{margin-bottom:18px}.resource-search{margin:0 0 10px}.resource-search input{padding-left:32px}.resource-picker-results{display:flex;flex-direction:column;max-height:245px;min-height:50px;overflow:auto;border-top:1px solid #e0e7f0;border-bottom:1px solid #e0e7f0;scrollbar-width:thin}.resource-pick-row{display:flex;align-items:center;gap:10px;text-align:left;min-height:60px;padding:10px 5px;border:0;border-bottom:1px solid #edf1f6;background:#fff;cursor:pointer;font:inherit;flex-shrink:0}.resource-pick-row:last-child{border-bottom:0}.resource-pick-row:hover{background:#f2f6fb}.resource-pick-row>span:nth-child(2){display:flex;flex-direction:column;gap:4px;min-width:0}.resource-pick-row strong{font-size:12px;font-weight:500;color:#2c527b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.resource-pick-row small{font-size:10px;color:#647a93}.resource-pick-row>.icon{width:14px;height:14px;margin-left:auto;color:#5279a7;flex-shrink:0}.resource-picker-create{padding-top:16px}.pending-resource{display:flex;align-items:center;gap:8px;font:inherit;font-size:11px;color:#7b602d;border:1px solid #e3d5b8;background:#fffbf2;padding:10px;width:100%;border-radius:3px;margin-top:13px;cursor:pointer}.pending-resource .icon{width:12px;height:12px;flex-shrink:0}
.designer-workspace .step-editor-footer{min-height:59px;padding:11px 17px;gap:8px;background:#fff}.step-editor-footer .draft-state{margin-right:auto;font-size:9px}.step-editor-footer .btn{font-size:11px;min-height:33px;padding:7px 11px}.step-editor-footer .ghost{margin-right:0}.step-editor-footer .btn.primary{min-width:84px;border-radius:3px;background:#225f9e;border-color:#225f9e}.step-editor-footer .btn.primary:hover{background:#194d82}
.designer-workspace .process-node{padding:15px 17px 13px;border-radius:4px;border-color:#c8d4e1;box-shadow:0 2px 4px #263d5510}.designer-workspace .process-node.selected{padding:14px 16px 12px;border-color:#2873bd;box-shadow:0 0 0 2px #2873bd22}.process-node-type{font-size:9px;margin-bottom:6px}.designer-workspace .process-node>strong{font-size:14px;min-height:36px;line-height:1.35;margin-bottom:5px}.canvas-node-description{font-size:10px;height:28px;line-height:1.4;margin-bottom:6px}.designer-workspace .process-node-owner{font-size:10px;height:14px;min-height:14px;margin-bottom:7px}.designer-workspace .node-flows{padding-top:8px;gap:4px}.designer-workspace .node-flow{font-size:9px}.designer-workspace .flow-names{font-size:9px}.designer-workspace .process-node.goal{background:#173e60;border-color:#173e60}.canvas-add{width:25px;height:25px;border-radius:3px;color:#3a6d9e}.canvas-add .icon{width:12px;height:12px}.canvas-add:hover{background:#225f9e}
@keyframes menu-in{from{opacity:.6}to{opacity:1}}@media(prefers-reduced-motion:reduce){.step-menu{animation:none}}
@media(min-width:1500px){:root{--panel:420px}.designer-workspace .step-editor-body{padding:23px}}
@media(max-width:1099px){.designer-workspace>.step-editor{left:0;right:auto;top:0;bottom:0;width:min(398px,calc(100% - 34px));box-shadow:8px 0 24px #1436541b}.designer-heading{min-height:73px}.designer-heading h1{font-size:19px}}
@media(max-width:760px){.topbar{height:43px;min-height:43px}.topbar .app-name{font-size:16px}.designer-heading{min-height:72px}.designer-heading h1{font-size:19px}.designer-workspace .graph-panel-header{height:42px;min-height:42px}.designer-workspace .step-editor-header{padding:13px 16px;min-height:72px}.designer-workspace .step-editor-body{padding:18px 17px}.pane-navigation{gap:16px;padding:0 16px}.pane-navigation [role=tab]{font-size:11px}.designer-workspace .step-editor-footer{min-height:57px;padding:10px 15px}.step-editor-body .compact-grid{grid-template-columns:1fr 1fr;gap:12px}.sidebar .brand img{width:27px;height:27px}}
@media(max-width:480px){.designer-workspace>.step-editor{width:100%;left:0;right:0;border-right:0;box-shadow:none}.pane-navigation{gap:14px}.pane-navigation [role=tab]{font-size:10px}.resource-list-heading{gap:6px}.resource-list-heading p{max-width:170px}.resource-list-heading .btn{font-size:9px}.resource-row-usage{gap:6px}.resource-row-usage select{width:132px}.step-editor-footer .draft-state{font-size:8px}.step-editor-footer .btn{font-size:10px;padding-inline:9px}.designer-heading h1{font-size:18px}}
@media print{.step-menu{animation:none}}
/* Three usual assignments fit without an extra scroll in a compact window. */
.resource-row-heading{padding:7px 10px 6px}.resource-row-heading .resource-type-icon{width:25px;height:25px}.resource-row-usage{padding:4px 10px 5px}.step-editor-body .resource-row-usage select{height:27px;min-height:27px;padding-block:3px}.resource-rows{gap:9px}
@media(max-width:760px){.designer-heading-actions .btn{font-size:0;min-height:32px;width:32px;padding:8px;gap:0}.designer-heading-actions .btn .icon{height:14px;width:14px}}
