synthesis-widget/dist/synthesis-widget.css

Embeddable React widget for displaying a catalog in an iframe modal with chatbot integration

:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--vui-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--vui-color-dialog-backdrop: rgba(0, 0, 0, .04);--vui-color-dialog-close-hover: rgba(0, 0, 0, .04);--vui-z-index-dialog: 1000}#root{margin:0 auto;width:100%}body{margin:0;display:flex;min-width:300px;min-height:100vh}img,video{max-width:100%;height:auto}h1,h2,h3,h4,h5,h6{text-wrap:balance;margin:0}p{text-wrap:pretty;margin:0}img,video,svg{display:block;height:auto;max-width:100%}*,*:before,*:after{box-sizing:border-box}.synthesis-trigger{width:3rem;height:3rem;border-radius:50%;border:none;position:fixed;bottom:1rem;right:1rem;box-shadow:var(--vui-shadow-sm);overflow:hidden;cursor:pointer;padding:0;transition:all .2s ease-in}.synthesis-trigger:hover{width:3.75rem;height:3.75rem}.synthesis__img{width:100%;height:100%;object-fit:cover}.synthesis-dialog{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:none;z-index:var(--vui-z-index-dialog);display:flex;align-items:center;justify-content:center;padding:0;padding-top:2rem;box-sizing:border-box;border-radius:1rem;box-shadow:var(--vui-shadow-sm);margin:auto;opacity:0;transform:scale(.95);transition:opacity .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1);pointer-events:none}.synthesis-dialog__close{border:none;background-color:transparent;width:2rem;height:2rem;padding:0;display:grid;place-items:center;transition:background-color .2s ease-in;border-radius:.25rem;cursor:pointer;position:absolute;top:.25rem;right:.25rem}.synthesis-dialog__close:hover{background-color:var(--vui-color-dialog-close-hover)}.synthesis-dialog__inframe{width:100%;height:100%;border:none}.synthesis-dialog::backdrop{background:var(--vui-color-dialog-backdrop);opacity:0;transition:opacity .3s ease}.synthesis-dialog[open]{opacity:1;transform:scale(1);pointer-events:all}.synthesis-dialog[open]::backdrop{opacity:1}