.wrapper-designer{display:grid;gap:2rem;margin:2.4rem 0;padding:2rem;border:1px solid rgb(var(--color-border))}.wrapper-designer__heading{margin:0}.wrapper-designer__panel{display:grid;gap:2rem}.wrapper-designer__panel[hidden]{display:none}.wrapper-designer__field{display:grid;gap:.8rem;min-width:0;margin:0;padding:0;border:0}.wrapper-designer__field .form__label{margin-bottom:0;padding:0}.wrapper-designer__choices{display:flex;flex-wrap:wrap;gap:.8rem 2rem}.wrapper-designer__choice{display:inline-flex;align-items:center;gap:.8rem;cursor:pointer}.wrapper-designer__choice input{width:1.8rem;height:1.8rem;margin:0;accent-color:rgb(var(--color-foreground))}.wrapper-designer__fonts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.wrapper-designer__font{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;min-height:10rem;padding:1.6rem 1.2rem;text-align:center;border:.1rem solid rgb(var(--color-border));border-radius:.4rem;cursor:pointer;transition:border-color var(--duration-short) ease,box-shadow var(--duration-short) ease}.wrapper-designer__font:hover{border-color:rgba(var(--color-foreground),.5)}.wrapper-designer__font:has(input:checked){border-color:rgb(var(--color-foreground));box-shadow:0 0 0 .1rem rgb(var(--color-foreground))}.wrapper-designer__font:has(input:focus-visible){outline:.2rem solid rgb(var(--color-keyboard-focus));outline-offset:.2rem}.wrapper-designer__font-preview{display:block;width:100%;max-width:24rem;height:auto}.wrapper-designer__font-name{font-size:1.1rem;text-transform:uppercase;letter-spacing:.2rem;opacity:.75}.wrapper-designer__color{display:flex;gap:1rem;align-items:stretch}.wrapper-designer__color .field__input{flex:1;min-width:0;text-transform:uppercase}.wrapper-designer__swatch{position:relative;flex:none;display:inline-flex;align-items:center;gap:1rem;padding:.5rem 1.4rem .5rem .5rem;border:1px solid rgb(var(--color-border));font-size:1.4rem;cursor:pointer}.wrapper-designer__swatch:hover,.wrapper-designer__swatch:focus-within{border-color:rgb(var(--color-foreground))}.wrapper-designer__swatch input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer}.wrapper-designer__swatch-ring{display:grid;place-items:center;width:3.4rem;height:3.4rem;padding:.3rem;border-radius:50%;background:conic-gradient(#ff4d4d,#ffb84d,#f5f54d,#4dff88,#4dc3ff,#6b4dff,#ff4dd2,#ff4d4d)}.wrapper-designer__swatch-fill{width:100%;height:100%;border-radius:50%}.wrapper-designer__swatch-fill.is-set{border:2px solid #fff;background:var(--swatch-color)}.wrapper-designer__dropzone{position:relative;border:1.5px dashed rgb(var(--color-border));background:rgba(var(--color-foreground),.02);transition:border-color .2s,background-color .2s}.wrapper-designer__dropzone:hover,.wrapper-designer__dropzone:focus-within,.wrapper-designer__dropzone.is-dragover{border-color:rgb(var(--color-foreground));background:rgba(var(--color-foreground),.05)}.wrapper-designer__dropzone.is-filled{border-style:solid;border-color:rgb(var(--color-foreground));background:rgb(var(--color-foreground));color:rgb(var(--color-background))}.wrapper-designer__dropzone.is-filled .button{border-color:rgb(var(--color-background));background:rgb(var(--color-background));color:rgb(var(--color-foreground));box-shadow:none}.wrapper-designer__dropzone-icon--filled,.wrapper-designer__dropzone.is-filled .wrapper-designer__dropzone-icon--empty{display:none}.wrapper-designer__dropzone.is-filled .wrapper-designer__dropzone-icon--filled{display:block;opacity:1}.wrapper-designer__dropzone.has-preview .wrapper-designer__dropzone-icon--filled{display:none}.wrapper-designer__dropzone-preview{width:auto;height:auto;max-width:16rem;max-height:10rem;padding:.8rem;border-radius:.4rem;background:rgb(var(--color-background));object-fit:contain}.wrapper-designer__dropzone-preview[hidden]{display:none}.wrapper-designer__dropzone input{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;width:100%;height:100%;opacity:0;cursor:pointer}.wrapper-designer__dropzone-body{display:grid;justify-items:center;gap:1rem;padding:2.4rem 1.6rem;text-align:center;pointer-events:none}.wrapper-designer__dropzone-icon{opacity:.6}.wrapper-designer__dropzone-text{font-size:1.3rem;opacity:.75;overflow-wrap:anywhere}.wrapper-designer__dropzone.is-filled .wrapper-designer__dropzone-text{font-weight:600;opacity:1}.wrapper-designer__hint{margin:0;font-size:1.3rem;opacity:.75}.wrapper-designer__download{justify-self:start;font-size:1.4rem}
/*# sourceMappingURL=/cdn/shop/t/17/assets/component-wrapper-designer.css.map */