.crop-image-segment[data-v-588e4390]{--demo-spacing:12px;--icon-wrap-size:56px;--icon-size:28px;--icon-size-2:16px;--transparent-black:rgba(0,0,0,.5);--vp-c-bg-soft:#f8f8f8;--hover-bg:#003057}.crop-image-segment .section[data-v-588e4390]{display:flex;gap:16px;width:100%}.crop-image-segment .remove-picture[data-v-588e4390],.crop-image-segment .select-picture[data-v-588e4390]{background:var(--transparent-black);border-radius:50%;cursor:pointer;height:var(--icon-wrap-size);position:relative;transition:background-color .3s;width:var(--icon-wrap-size)}.crop-image-segment .remove-picture .select-icon[data-v-588e4390],.crop-image-segment .select-picture .select-icon[data-v-588e4390]{align-items:center;display:flex;height:var(--icon-size);justify-content:center;width:var(--icon-size)}.crop-image-segment .remove-picture .select-icon svg[data-v-588e4390],.crop-image-segment .select-picture .select-icon svg[data-v-588e4390]{height:100%;width:100%;fill:#fff}.crop-image-segment .remove-picture input[data-v-588e4390],.crop-image-segment .select-picture input[data-v-588e4390]{cursor:pointer;font-size:0;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%}.crop-image-segment .remove-picture[data-v-588e4390]:hover,.crop-image-segment .select-picture[data-v-588e4390]:hover{background:var(--hover-bg);transition:background-color .3s}.crop-image-segment .remove-picture[data-v-588e4390]{align-items:center;display:flex;height:var(--icon-wrap-size);justify-content:center;width:var(--icon-wrap-size);z-index:1}.crop-image-segment .remove-picture .select-icon[data-v-588e4390]{height:var(--icon-size-2);width:var(--icon-size-2)}.crop-image-segment .remove-picture .select-icon svg[data-v-588e4390]{height:100%;width:100%;fill:#fff}.crop-image-segment .preview[data-v-588e4390]{display:flex;height:100%;justify-content:center;width:100%}.crop-image-segment .preview img[data-v-588e4390]{height:auto;max-height:100%;max-width:100%;width:auto}.crop-image-segment .modal-wrap[data-v-588e4390]{height:100vh;left:0;overflow:hidden;position:fixed;top:0;width:100vw;z-index:99}.crop-image-segment .modal-wrap .modal-mask[data-v-588e4390]{background-color:#656c85cc;height:100%;left:0;position:absolute;top:0;width:100%}.crop-image-segment .modal-wrap .modal-scroll-view[data-v-588e4390]{height:100%;left:0;overflow:auto;position:absolute;top:0;width:100%}.crop-image-segment .modal-wrap .modal[data-v-588e4390]{align-items:center;background-color:var(--vp-c-bg-soft);border-radius:4px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;margin:100px auto;max-width:calc(100vw - var(--demo-spacing));position:relative;width:900px}.crop-image-segment .modal-wrap .modal .modal-title[data-v-588e4390]{align-items:center;border-bottom:1px solid var(--vp-c-divider);box-sizing:border-box;display:flex;height:60px;padding:0 var(--demo-spacing);width:100%}@media only screen and (max-width:600px){.crop-image-segment .modal-wrap .modal .modal-title[data-v-588e4390]{flex-direction:column;height:auto}}.crop-image-segment .modal-wrap .modal .modal-title .title[data-v-588e4390]{color:var(--vp-button-alt-text);color:#000;font-family:Inter,sans-serif;font-size:16px;font-weight:700}@media only screen and (max-width:600px){.crop-image-segment .modal-wrap .modal .modal-title .title[data-v-588e4390]{font-size:14px;padding:12px 5px}}.crop-image-segment .modal-wrap .modal .modal-title .tools[data-v-588e4390]{align-items:center;display:flex;flex:1;justify-content:flex-end;overflow:hidden}.crop-image-segment .modal-wrap .modal .modal-title .tools .btn[data-v-588e4390]{background-color:var(--vp-button-alt-bg);border:1px solid transparent;border-radius:4px;color:#b58f2f;cursor:pointer;display:inline-block;font-size:14px;line-height:32px;margin-left:var(--demo-spacing);padding:0 30px;position:relative;text-align:center;transition:color .25s,border-color .25s,background-color .25s;white-space:nowrap}.crop-image-segment .modal-wrap .modal .modal-title .tools .btn.primary[data-v-588e4390]{background-color:#b58f2f;border-color:#b58f2f;color:#fff}.crop-image-segment .modal-wrap .modal .modal-title .tools .btn[data-v-588e4390]:hover{background-color:#332910;border-color:#332910;color:#000}@media only screen and (max-width:600px){.crop-image-segment .modal-wrap .modal .modal-title .tools .btn[data-v-588e4390]{font-size:12px;margin:5px;padding:0 10px}}.crop-image-segment .modal-wrap .modal .modal-content[data-v-588e4390]{align-items:center;display:flex;flex-direction:column;height:100%;justify-content:center;padding:var(--demo-spacing);width:100%}
