.ecApp{--c-bg:#f3f4f6;--c-panel:#ffffff;--c-border:#d1d5db;--c-text:#111827;--c-sub:#fff;--c-yellow:#f4c542;--c-transparent:transparent;--c-btn-border:#fff;--c-btn-text-color:#fff;--zone-w: 720px;--zone-h: 960px;background:var(--c-bg);color:var(--c-text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;border:1px solid var(--c-border);border-radius:0;overflow:hidden}.ecHeader{display:grid;grid-template-columns:120px 1fr;align-items:center;gap:10px;padding:14px 16px;background:var(--c-panel);border-bottom:1px solid var(--c-border);width:100%}.ecSide-header{display:flex;align-items:center;justify-content:end}.ecBack{background:transparent;border:0;cursor:pointer;color:var(--c-text);font-size:14px}.ecTitle{text-align:center;line-height:1.1}.ecTitleMain{font-size:22px;font-weight:600}.ecTitleSub{font-size:13px;color:var(--c-sub)}.ecClose{width:40px;height:25px;border:0;background:transparent;cursor:pointer;font-size:26px;line-height:1;justify-self:end;color:#fff}.ecBody{display:grid;grid-template-columns:1fr 520px;min-height:calc(100vh - 80px)}.ecPreview{background:#fff;border-right:1px solid var(--c-border);display:flex;align-items:center;justify-content:center;flex-direction:column;padding:18px}.ecPreviewInner{width:min(760px,100%);aspect-ratio:4/5;background-size:contain;background-position:center;position:relative;display:flex;align-items:center;justify-content:center;background-size:cover;background-repeat:no-repeat}.ecZone{width:min(var(--zone-w),88%);height:auto;aspect-ratio:calc(var(--zone-w) / var(--zone-h));background:#ffffff0d;border-radius:8px;display:flex;align-items:center;justify-content:center}.ecZone canvas{width:100%;height:100%;display:block}.ecSide{background:#0061a0;padding:16px;display:flex;flex-direction:column;gap:12px;max-height:100vh;overflow:auto}.ecRow{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.ecRowLabel{font-size:13px;color:var(--c-sub);margin-top:4px}.ecQty{display:flex;flex-direction:Column;gap:6px}.ecQtyContainer{display:flex;gap:10px}.ecQtyBtn{width:36px;height:36px;border:1px solid var(--c-border);background:#fff;cursor:pointer;border-radius:6px;font-size:18px}.ecQtyInput{width:62px;height:36px;border:1px solid var(--c-border);border-radius:6px;text-align:center;font-size:14px}.ecFieldsWrap{border-top:1px solid var(--c-border);padding-top:12px;overflow:auto;min-height:0;flex:1}.ofa-pages{display:flex;gap:10px}[data-page-select]{padding:5px 10px;border:1px solid #0061a0;border-radius:5px;background-color:transparent;min-width:70px}[data-page-prev],[data-page-next]{padding:5px 10px;border:1px solid #fff;color:#fff;border-radius:5px;background-color:transparent;min-width:85px;display:flex;align-items:center;gap:10px;justify-content:center;width:calc(33% - 20px)}[data-page-prev] span,[data-page-next] span{line-height:0px}.ecFields{display:flex;flex-direction:column;gap:10px}.ecSide .field{display:flex;flex-direction:column;border:1px solid var(--c-border);border-radius:8px;padding:10px}.ecSide .field.active{outline:2px solid rgba(59,130,246,.35);border-color:#3b82f659;background:#007aff14!important}.row{display:none;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px}.field.active .row{display:flex}.input,.select{width:100%;border:1px solid var(--c-border);border-radius:6px;padding:8px 10px;font-size:14px;font-family:var(--font-body-family);height:40px}.loader{width:40px;height:40px;border:4px solid #eee;border-top:4px solid #333;border-radius:50%;display:block!important;animation:rotate 1s linear infinite}@keyframes rotate{to{transform:rotate(360deg)}}.num{width:90px}.btn-sm{border:1px solid var(--c-border);background:#fff;padding:8px 10px;border-radius:6px;cursor:pointer}button.btn-sm.js-curve-inc,button.btn-sm.js-curve-dec{border:0px;outline:0px;height:28px;border-radius:0}.btn-danger{border-color:#fecaca;background:#fff5f5;color:#991b1b}.btn-toggle[aria-pressed=true]{outline:2px solid rgba(59,130,246,.35)}.ecActions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}.ecBtn{border:1px solid var(--c-border);border-radius:6px;padding:12px 10px;cursor:pointer;font-size:14px;background:#fff}.ecBtnPrimary{background:var(--c-transparent);border-color:var(--c-btn-border);color:var(--c-btn-text-color);font-weight:600}.ecNotes{width:100%}.ecNotesBtn{width:100%;border:1px solid var(--c-border);background:#fff;border-radius:6px;padding:12px 10px;cursor:pointer;font-size:14px}.ofa-fill-current.next{transform:rotate(-180deg)}.ecBtnCart{background:var(--c-transparent);border-color:var(--c-btn-border);font-weight:700;padding:14px 12px;color:var(--c-btn-text-color)}.ecExportRow{display:flex;gap:8px;flex-wrap:wrap}.ecBtnGhost{background:#fff}.ofa-customizer.show{display:block!important}@media(min-width:1101px){.sticky{position:sticky;top:0;height:100vh}}@media(max-width:1100px){.ecBody{grid-template-columns:1fr}.ecPreview{border-right:0;border-bottom:1px solid var(--c-border)}}.ecPreview{width:100%}.ecPreviewInner{width:min(760px,100%)}.ecZone{width:100%;max-width:var(--zone-w);margin:0 auto;height:auto;aspect-ratio:calc(var(--zone-w) / var(--zone-h));position:relative}.ecZone .canvas-container,.ecZone canvas{width:100%!important;height:100%!important;display:block}.popular_images_container{position:fixed;top:0;left:0;right:0;bottom:0;z-index:22;background-color:#0000004d;height:100%;width:100%;display:none;align-items:center;justify-content:center}.popular_images_container.active{display:flex}.popular_images_wrapper{display:flex;flex-direction:column;max-width:450px;max-height:520px;background-color:#fff;color:#000;overflow-y:auto;border-radius:5px}.ofaCurveTrack,.ofaCurveTicks,.ofaCurveThumb{display:block!important}.popular_images_header{display:flex;align-items:center;justify-content:space-between;padding:10px 20px 0;font-size:24px}.popular-images{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;justify-items:center;list-style:none;padding:40px 20px;gap:10px}.popular-images__item{border:2px solid #ddd;border-radius:5px;display:flex;align-items:center;justify-content:center;padding:10px}.popular-images__item img{width:100%;height:auto}.popular-images__item:hover{border-color:#000;cursor:pointer}[data-popular-images-close]{cursor:pointer;padding:10px}@media(max-width:1100px){.ecZone{max-width:100%}}@media(max-width:600px){.ecHeader{grid-template-columns:1fr;padding:14px 0}}
/*# sourceMappingURL=/cdn/shop/t/43/assets/engraving-customizer.css.map */
