.hosted-component{border-radius:8px;flex-direction:column;justify-content:flex-start;align-items:stretch;width:100%;min-height:320px;display:flex;position:relative;overflow:hidden}.hosted-component--empty{border:1px dashed var(--border-color);justify-content:center;min-height:160px}.hosted-component-body{flex-direction:column;flex:1;justify-content:flex-start;align-items:stretch;min-height:0;display:flex}.hosted-component-body>*{flex:1;min-height:0}.hosted-component--inert{pointer-events:none;-webkit-user-select:none;user-select:none}.ComponentPickerModal{flex-direction:row;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;inset:0}@supports (height:100dvh){.ComponentPickerModal{height:100dvh}}.ComponentPickerModal{-webkit-backdrop-filter:blur();backdrop-filter:blur();z-index:10;background-color:var(--modal-blur);opacity:0}.ComponentPickerModal.active{opacity:1}.ComponentPickerModal{animation:.2s ease-out forwards hdm-modal-container-blur-show}.ComponentPickerModal.is-closing{animation:.2s ease-out forwards hdm-modal-container-blur-hide}.ComponentPickerModal>.hdm-modal-content{animation:.2s ease-out forwards hdm-modal-content-scale-show}.ComponentPickerModal.is-closing>.hdm-modal-content{animation:.2s ease-out forwards hdm-modal-content-scale-hide}.ComponentPickerModal>.hdm-modal-content{background-color:var(--modal-bg);border:1px solid var(--border-color);box-sizing:border-box;opacity:0;border-radius:20px;flex-direction:column;justify-content:flex-start;align-items:stretch;width:1080px;max-width:92vw;height:min(900px,90dvh);display:flex;overflow:hidden}.ComponentPickerModal>.hdm-modal-content>.header{border-bottom:1px solid var(--border-color);box-sizing:border-box;flex-direction:row;justify-content:space-between;align-items:center;width:100%;padding:15px;display:flex}.ComponentPickerModal>.hdm-modal-content>.header h2{white-space:nowrap;text-overflow:ellipsis;max-width:calc(100% - 50px);padding-left:10px;font-size:1.15rem;overflow:hidden}.ComponentPickerModal>.hdm-modal-content>.header button{border-radius:10px;flex-direction:row;justify-content:center;align-items:center;width:30px;height:30px;display:flex}.ComponentPickerModal>.hdm-modal-content>.header button svg{color:var(--text-secondary)}.ComponentPickerModal>.hdm-modal-content>.header button:hover{background-color:var(--background)}.ComponentPickerModal>.hdm-modal-content>.header{flex-shrink:0}.ComponentPickerModal>.hdm-modal-content>.component-picker-body{flex:1;grid-template-columns:340px minmax(0,1fr);min-height:0;display:grid}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue{box-sizing:border-box;border-right:1px solid var(--border-color);flex-direction:column;justify-content:flex-start;align-items:stretch;gap:10px;min-width:0;min-height:0;padding:10px;display:flex}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.hdm-component-search-bar{background-color:var(--modal-bg2);flex-shrink:0;width:100%}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list{flex-direction:column;flex:1;justify-content:flex-start;align-items:stretch;gap:10px;min-height:0;display:flex;overflow-y:auto}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card{box-sizing:border-box;border:1px solid var(--border-color);background-color:var(--modal-bg2);cursor:pointer;border-radius:15px;flex-direction:row;flex-shrink:0;justify-content:space-between;align-items:center;gap:10px;height:50px;padding:0 10px 0 0;transition:background-color .2s ease-in-out,border-color .2s ease-in-out;display:flex}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card:hover{background-color:color-mix(in oklab, var(--text-primary) 4%, var(--modal-bg2))}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card.selected{border-color:var(--primary-color);background-color:color-mix(in oklab, var(--primary-color) 8%, var(--modal-bg2))}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card>.component-picker-card-main{min-width:0;height:100%;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;flex-direction:row;flex:1;justify-content:flex-start;align-items:center;gap:10px;padding:0 0 0 10px;display:flex}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card>.component-picker-card-main>img{border-radius:5px;flex-shrink:0}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card>.component-picker-card-main>svg{flex-shrink:0}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card>.component-picker-card-main>.component-picker-card-info{flex-direction:column;flex:1;justify-content:flex-start;align-items:stretch;min-width:0;display:flex}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card>.component-picker-card-main>.component-picker-card-info>.component-picker-card-title,.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card>.component-picker-card-main>.component-picker-card-info>.component-picker-card-desc{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card>.component-picker-card-main>.component-picker-card-info>.component-picker-card-title{color:var(--text-primary)}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card>.component-picker-card-main>.component-picker-card-info>.component-picker-card-title>.component-picker-card-highlight{color:var(--primary-color);background-color:color-mix(in oklab, var(--primary-color) 15%, transparent);border-radius:3px}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card>.component-picker-card-main>.component-picker-card-info>.component-picker-card-desc{color:var(--text-secondary);font-size:.85rem}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card>.component-picker-card-open{flex-shrink:0}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card>.component-picker-card-open svg{color:var(--text-secondary);transition:color .2s ease-in-out}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue>.component-picker-list>.component-picker-card>.component-picker-card-open:hover svg{color:var(--text-primary)}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-preview{background-color:var(--background);flex-direction:column;justify-content:flex-start;align-items:stretch;min-width:0;min-height:0;display:flex;overflow:hidden}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-preview.component-picker-preview--empty{justify-content:center}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-preview>.component-picker-preview-component{border-radius:0;flex:1;min-height:0}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-preview>.component-picker-identity{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:6px;padding:10px;display:flex}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-preview>.component-picker-identity>.component-picker-identity-name{color:var(--text-primary);overflow-wrap:anywhere;font-size:1rem;font-weight:600}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-preview>.component-picker-identity>.component-picker-identity-date{color:var(--text-secondary);font-size:.75rem}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-preview>.component-picker-identity>.component-picker-identity-description{max-width:420px;color:var(--text-secondary);margin:0;font-size:.8rem;line-height:1.4}.ComponentPickerModal>.hdm-modal-content>.component-picker-separator{border-top:1px dashed var(--border-color);flex-shrink:0;width:100%}.ComponentPickerModal>.hdm-modal-content>.actions-buttons{box-sizing:border-box;flex-direction:row;flex-shrink:0;justify-content:flex-end;align-items:center;gap:15px;width:100%;padding:10px;display:flex}.ComponentPickerModal>.hdm-modal-content>.actions-buttons>.component-picker-status{min-width:0;color:var(--text-secondary);flex:1;margin:0;font-size:.85rem}.ComponentPickerModal>.hdm-modal-content>.actions-buttons>.component-picker-status.error{color:var(--red-color)}.ComponentPickerModal>.hdm-modal-content>.actions-buttons>p.component-picker-status{text-indent:10px}.ComponentPickerModal>.hdm-modal-content>.actions-buttons>.component-picker-version{flex-direction:row;justify-content:flex-start;align-items:center;display:flex}.ComponentPickerModal>.hdm-modal-content>.actions-buttons>.component-picker-version select{width:260px;max-width:100%}@media (width<=760px){.ComponentPickerModal>.hdm-modal-content>.component-picker-body{grid-template-rows:minmax(0,2fr) minmax(0,3fr);grid-template-columns:minmax(0,1fr)}.ComponentPickerModal>.hdm-modal-content>.component-picker-body>.component-picker-catalogue{border-right:none;border-bottom:1px solid var(--border-color)}.ComponentPickerModal>.hdm-modal-content>.actions-buttons{flex-wrap:wrap;gap:10px}.ComponentPickerModal>.hdm-modal-content>.actions-buttons>.component-picker-status{flex-basis:100%}}.component-reference-card{flex-direction:column;gap:8px;display:flex}.component-reference-card .component-reference{border:1px solid var(--border-color,#e5e7eb);background-color:var(--background-secondary,transparent);border-radius:10px;grid-template-columns:24px 1fr;align-items:center;gap:2px 8px;padding:8px 10px;display:grid}.component-reference-card .component-reference svg,.component-reference-card .component-reference img{flex-shrink:0;grid-row:1/3;align-self:center}.component-reference-card .component-reference .component-reference-name{color:var(--text-primary);overflow-wrap:anywhere;grid-column:2;font-size:.85rem}.component-reference-card .component-reference .component-reference-type,.component-reference-card .component-reference .component-reference-id{color:var(--text-secondary);overflow-wrap:anywhere;grid-column:2;font-size:.75rem}.component-reference-card .component-reference .component-reference-id{font-family:monospace}.component-reference-card .component-reference.component-reference--error{border-color:var(--red-color,#dc2626);background-color:color-mix(in oklab, var(--red-color,#dc2626) 10%, transparent)}.component-reference-card .component-reference.component-reference--error svg{color:var(--red-color,#dc2626)}.component-reference-card .component-reference-hint{color:var(--text-secondary);font-size:.75rem;line-height:1.4}.component-reference-card .component-reference-hint.component-reference-hint--warning{color:var(--red-color,#dc2626)}
