.product-personalization{margin-top:1.5rem;margin-bottom:1.5rem}.personalization-fields{padding:1rem;border:1px solid #ddd;border-radius:4px;display:block;margin-top:1.5rem;font-family:var(--font-body-family)}.form__label{display:block;margin-bottom:2.5rem;margin-top:0rem;font-weight:600;font-size:1.6rem;color:#212b36}.personalization-field{margin-bottom:0}.personlaization-form__label{display:block;margin-bottom:.4rem;font-size:1.4rem;color:#637381;font-weight:400}.personalization-message{padding:12px 16px;border-radius:6px;margin:10px 0;font-size:14px;line-height:1.4;display:flex;align-items:center;gap:8px}.personalization-message--error{background-color:#fee;border:1px solid #fcc;color:#dc2626}.personalization-message--info{background-color:#eff7ff;border:1px solid #dbeafe;color:#1d4ed8}.personalization-message__icon{font-size:18px}.personalization-message__text{flex:1}.personalization-field__input{width:100%;padding:.625rem;border:1px solid #c4cdd5;font-size:1.5rem;color:#212b36;font-family:var(--font-body-family);background-color:#fff;box-shadow:0 0 0 1px transparent,0 1px #161d250d;transition:box-shadow .2s ease,border-color .2s ease}.personalization-field__input:focus{outline:none;border-color:#5c6ac4;box-shadow:0 0 0 1px #5c6ac4}.personalization-field__input::placeholder{color:#919eab}#personalization-inputs-container{display:flex;flex-direction:column;gap:1rem}.customizer{width:100%;position:relative;margin-right:auto;margin-left:auto}@media screen and (min-width: 750px){.customizer{position:sticky!important;top:3rem;z-index:2}}.customizer.constrain-height{--viewport-offset: 400px;--constrained-min-height: 300px;--constrained-height: max( var(--constrained-min-height), calc(100vh - var(--viewport-offset)) )}@media screen and (min-width: 750px){.customizer.constrain-height{--viewport-offset: 170px;--constrained-min-height: 500px}}.customizer.media-fit-contain{--contained-width: calc(var(--constrained-height) * var(--aspect-ratio));width:min(var(--contained-width),100%)}.customizer .image-container{padding-top:var(--ratio-percent);width:100%;position:relative;display:flex;justify-content:center;align-items:center;overflow:hidden;height:100%}.customizer.constrain-height .image-container{padding-top:min(var(--constrained-height),var(--ratio-percent))}.customizer .image-wrapper{width:100%;position:relative;z-index:0;overflow:hidden!important;max-width:500px}.customizer .base-image{display:block;max-width:100%;height:100%;width:100%;transition:opacity .4s cubic-bezier(.25,.46,.45,.94);border-radius:calc(var(--media-radius) - var(--media-border-width))}.customizer .canvas-container{display:none;position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.customizer canvas{width:100%;height:100%}.print-canvas-container{display:none;position:absolute;visibility:hidden}.product-media-container{--aspect-ratio: var(--preview-ratio);--ratio-percent: calc(1 / var(--aspect-ratio) * 100%);position:relative;width:100%;max-width:calc(100% - calc(var(--media-border-width) * 2))}.global-media-settings{position:relative;border:var(--media-border-width) solid rgba(var(--color-foreground),var(--media-border-opacity));border-radius:var(--media-radius);overflow:visible!important;background-color:rgb(var(--color-background))}.gradient{background:rgb(var(--color-background));background:var(--gradient-background);background-attachment:fixed}@media screen and (min-width: 750px){.product-media-container{max-width:100%}}.text-overlay{position:absolute;display:inline-block;color:#000;font-size:clamp(8px,1.75vw,12px);font-family:Kalam;z-index:1;opacity:0;letter-spacing:0em;font-weight:400;font-style:normal;white-space:nowrap;text-align:left;vertical-align:middle;line-height:1;transition:all .3s ease;transform-origin:center center}@media (max-width: 768px){.parent{transform:translate(-60%,-50%) rotate(1deg)!important}}.loading-indicator{display:none;position:relative;height:50px;width:100%;align-items:center;justify-content:center;color:#333;border-radius:0;border:1px solid #e0e0e0;cursor:wait;overflow:hidden}.loader{width:24px;height:24px;border:3px solid rgba(0,0,0,.1);border-radius:50%;border-top-color:#3498db;animation:spin .8s linear infinite;display:inline-block;vertical-align:middle}.loading-indicator:after{content:"";display:inline-block;vertical-align:middle;font-size:14px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.loading-indicator:after{font-size:12px;content:"Generating preview..."}.loader{width:20px;height:20px;border-width:2px;margin-right:8px}}
/*# sourceMappingURL=/cdn/shop/t/1/assets/personalizer.css.map */
