/* Vistio Business v1.0.8.3 — larger fixed live preview, separate from templates and fields. */
:root{--vb107-border:rgba(213,171,99,.32)}

#workspace .premium-editor .preview-fit-viewport,
#workspace .premium-editor .vb107-fit-viewport{
  box-sizing:border-box;position:relative;display:block;width:100%;min-width:0;
  background:radial-gradient(ellipse at 50% 0%,rgba(218,163,82,.07),transparent 64%);
}
#workspace .premium-editor .vb107-fit-viewport>#live-preview.preview-stage{
  box-sizing:border-box;transform-origin:top left!important;
  overflow:visible!important;max-height:none!important;
}
#workspace .premium-editor .preview-shell{
  border-color:var(--vb107-border)!important;
  box-shadow:0 22px 56px rgba(0,0,0,.36),inset 0 1px rgba(255,255,255,.06);
}
#workspace .premium-editor .vb107-custom-design-form{margin:22px 0 20px!important;width:100%;}
.vb107-expand-preview,.vb107-fullscreen{display:none!important}

@media(min-width:1051px){
  #workspace .premium-editor .editor-split,
  #workspace .premium-editor .v03-editor-split{
    display:grid!important;
    grid-template-columns:minmax(0,.96fr) minmax(450px,1.04fr)!important;
    gap:24px!important;align-items:start!important;
    height:clamp(700px,calc(100dvh - 190px),1180px)!important;
    min-height:0!important;max-height:none!important;
    overflow:hidden!important;position:relative!important;
  }
  #workspace .premium-editor .editor-split>.form-content{
    box-sizing:border-box!important;min-width:0!important;min-height:0!important;
    height:100%!important;max-height:100%!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    overscroll-behavior-y:contain!important;
    padding:2px 16px 28px 4px!important;
    scrollbar-width:thin;scrollbar-color:#be8e52 #15110d;
  }
  #workspace .premium-editor .editor-split>.live-preview-column{
    box-sizing:border-box!important;display:flex!important;flex-direction:column!important;
    gap:10px!important;position:sticky!important;top:8px!important;
    align-self:start!important;width:100%!important;
    height:clamp(700px,calc(100dvh - 190px),1180px)!important;
    min-height:700px!important;max-height:1180px!important;
    padding:0 4px 4px!important;overflow:hidden!important;overscroll-behavior:none!important;
  }
  #workspace .premium-editor .live-preview-column>.live-label{margin:0!important;flex:0 0 auto!important;min-height:42px!important}
  #workspace .premium-editor .live-preview-column>.preview-shell{
    display:flex!important;flex:1 1 auto!important;min-height:0!important;max-height:100%!important;
    flex-direction:column!important;overflow:hidden!important;
  }
  #workspace .premium-editor .preview-shell>.preview-toolbar{
    display:flex!important;align-items:center!important;justify-content:flex-start!important;
    gap:9px!important;flex:0 0 auto!important;flex-wrap:wrap!important;padding:10px 12px!important;
  }
  #workspace .premium-editor .preview-shell>.preview-canvas{
    box-sizing:border-box!important;display:flex!important;flex-direction:column!important;
    flex:1 1 auto!important;min-height:0!important;max-height:none!important;
    padding:6px 6px 8px!important;overflow:hidden!important;
  }
  #workspace .premium-editor .preview-canvas>.vb107-fit-viewport{
    height:100%!important;min-height:0!important;flex:1 1 auto!important;
    overflow:hidden!important;border-radius:16px;
  }
  #workspace .premium-editor .vb107-fit-viewport>#live-preview.preview-stage{
    position:absolute!important;display:block!important;
    top:0;left:0;width:390px;max-width:none!important;
    height:auto!important;min-height:0!important;margin:0!important;
    overflow:visible!important;transform-origin:top left!important;
  }
  #workspace .premium-editor .preview-insights,
  #workspace .premium-editor .preview-foot,
  #workspace .premium-editor .vb102-preview-examples{display:none!important}
  #workspace .premium-editor .editor-split>.live-preview-column::-webkit-scrollbar,
  #workspace .premium-editor .preview-canvas::-webkit-scrollbar,
  #workspace .premium-editor .vb107-fit-viewport::-webkit-scrollbar{display:none!important}
}

@media(max-width:1050px){
  #workspace .premium-editor .editor-split,
  #workspace .premium-editor .v03-editor-split{
    display:flex!important;flex-direction:column!important;gap:18px!important;
    height:auto!important;max-height:none!important;min-height:0!important;overflow:visible!important;
  }
  #workspace .premium-editor .editor-split>.live-preview-column{
    display:block!important;order:-1!important;
    position:static!important;top:auto!important;width:100%!important;
    height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important;
  }
  #workspace .premium-editor .editor-split>.form-content{
    order:2!important;width:100%!important;height:auto!important;
    max-height:none!important;min-height:0!important;overflow:visible!important;
  }
  #workspace .premium-editor .preview-canvas>.vb107-fit-viewport{
    height:auto!important;min-height:0!important;overflow:visible!important;display:flex;justify-content:center;
  }
  #workspace .premium-editor .vb107-fit-viewport>#live-preview.preview-stage{
    position:static!important;top:auto!important;left:auto!important;
    transform:none!important;width:100%!important;height:auto!important;
    margin:0 auto!important;min-height:0!important;
  }
}
