.fieldGenerator{display:flex;flex-direction:column-reverse;width:100%}.code-generator--wrapper small{font-size:x-small;color:var(--m4uo-text-muted)}.code-generation--description{padding:1rem 0 2rem;display:flex;gap:1rem;flex-direction:column}.code-generation--description p,.code-generation--description ul{margin:0;color:var(--m4uo-text-dim)}.article-generator--wrapper h2{color:var(--m4uo-text-muted)}.code-generation--description a{color:var(--m4uo-text-muted);text-decoration:none;border-bottom:1px dashed var(--m4uo-text-muted);transition:opacity .3s}.code-generation--description a:hover{opacity:.8}.code-generator--header h1.h1{background:var(--m4uo-bg-light);color:var(--m4uo-text-muted);text-align:center;padding:1rem;border:1px solid rgba(6,182,212,.2);border-radius:8px;text-transform:uppercase;letter-spacing:.1em}.fieldGenerator .code-generator--wrapper{width:100%;display:grid;grid-template-columns:minmax(400px,60%) 1fr;gap:2rem}.locationContainer{display:flex;line-height:1.2;margin-left:.5rem}.fieldGenerator .code-generator--wrapper .firstColumn,.fieldPreviewBox,.donateContainer,.codePreviewBox{background:var(--m4uo-bg-light);border:1px solid rgba(255,255,255,.1);padding:1.5rem;height:100%;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.fieldGenerator .code-generator--wrapper .firstColumn{display:flex;gap:1.5rem;flex-direction:column}.secondColumn{gap:2rem;display:flex;flex-direction:column}.donateContainer{font-family:var(--font-m4uo-mono);font-size:1.2rem;font-weight:600;line-height:1.5;text-align:center}.donateContainer p{margin-top:0;margin-bottom:1rem}.donateContainer a{background:var(--m4uo-text-muted);color:#000;font-weight:900;padding:10px 20px;border-radius:4px;text-decoration:none;display:inline-block;margin:1rem auto;text-transform:uppercase;letter-spacing:.1em;transition:all .3s ease;box-shadow:0 0 15px #06b6d433}.donateContainer a:hover{transform:translateY(-2px);box-shadow:0 0 25px #06b6d480;background:var(--m4uo-text-muted)}.code-generator--header>*{margin:0}.code-generator--wrapper h2{color:var(--m4uo-text-muted);margin:0;font-weight:700;font-family:var(--font-m4uo-mono);text-transform:uppercase;letter-spacing:.05em}.instructions{padding-left:1.5rem;color:var(--m4uo-text-dim);line-height:1.8;margin-top:.5rem}.instructions mark{background:#06b6d426;color:var(--m4uo-text-muted);padding:2px 6px;border-radius:4px;font-family:var(--font-m4uo-mono);font-size:.9em}.fieldGenerator form{display:flex;flex-direction:column;gap:12px}.fieldGenerator .formField{width:100%;display:flex;align-items:center;gap:10px}.formField label[for=selectLocation]{white-space:nowrap}.formField select,.formField input[type=text],.fieldColumn input[type=number],.formField fieldset,.fieldColumn textarea{background:#0000004d;border:1px solid rgba(255,255,255,.2);color:var(--m4uo-text-dim);padding:8px 12px;border-radius:4px;font-family:var(--font-m4uo-sans);transition:border-color .3s,box-shadow .3s}.formField select:focus,.formField input[type=text]:focus,.fieldColumn input[type=number]:focus,.fieldColumn textarea:focus{outline:none;border-color:var(--m4uo-text-muted);box-shadow:0 0 8px #06b6d44d}.formField select option{background:var(--m4uo-bg);color:var(--m4uo-text-dim)}.fieldColumn{width:100%;display:flex;gap:8px;flex-direction:column}.formField>label>*{word-wrap:break-word}.codePreviewBox{width:100%;grid-area:2/1/2/3}.codePreviewBox .codePreview{word-wrap:break-word;border:1px solid rgba(255,255,255,.1);background:#00000080;color:var(--m4uo-text-muted);font-family:var(--font-m4uo-mono);border-radius:8px;padding:1.5rem;font-size:14px;line-height:1.6}.copyButton--container{display:flex;gap:1rem;height:max-content;align-items:center}.codePreviewBox--heading{display:flex;justify-content:space-between;gap:1rem;margin-bottom:1rem}.codePreviewBox--heading .copyButton{display:inline-flex;align-items:center;background:transparent;color:var(--m4uo-text-muted);border:1px solid var(--m4uo-text-muted);padding:6px 16px;border-radius:4px;height:40px;gap:.5rem;cursor:pointer;z-index:1;font-family:var(--font-m4uo-mono);font-weight:700;text-transform:uppercase;transition:all .3s ease}.codePreviewBox--heading .copyButton[disabled]{opacity:.3;cursor:not-allowed;border-color:var(--m4uo-text-dim);color:var(--m4uo-text-dim)}.codePreviewBox svg{width:24px;fill:currentColor}.codePreviewBox--heading .copyButton:hover:not([disabled]){background:var(--m4uo-text-muted);color:#000;box-shadow:0 0 15px #06b6d466}span.copy--tooltip{z-index:0;opacity:0;transform:translate(150%);color:var(--m4uo-emerald);font-weight:700;font-size:14px;font-family:var(--font-m4uo-mono)}span.copy--tooltip.activeTooltip{animation:slide 4s}.code-generation--description h3{margin-bottom:.7rem;color:var(--m4uo-text-muted)}@keyframes slide{0%{transform:translate(150%);opacity:0}20%{opacity:1}30%{transform:translate(0);opacity:1}70%{transform:translate(0);opacity:1}90%{transform:translate(150%);opacity:0}to{transform:translate(150%);opacity:0}}@media only screen and (max-width:990px){.fieldGenerator .secondColumn,.fieldGenerator .code-generator--wrapper,.fieldGenerator .codePreviewBox--heading{display:flex;flex-direction:column}.fieldGenerator .copyButton--container{justify-content:flex-start}}
/*# sourceMappingURL=/cdn/shop/t/286/assets/field-generator.css.map */