@start-base/react-form-elements/OTPInput/styles.css

Simplify form elements and form management. Selection of user friendly inputs and wide customization abilities to match your design and functionality.

.SUI-OTPInput-module-root-wwPpn{display:flex;gap:1rem;margin-bottom:var(--rfe-spacing);width:100%}.SUI-OTPInput-module-inputRoot-jkviO{display:flex;flex-direction:column;pointer-events:all;position:relative;width:100%}.SUI-OTPInput-module-inputs-MO9YY{align-items:center;color:var(--rfe-black);display:flex;gap:1rem;position:relative}.SUI-OTPInput-module-label-uqr06{color:var(--rfe-color);font-size:var(--rfe-font-size);line-height:1;margin-bottom:var(--rfe-label-spacing)}.SUI-OTPInput-module-errorLabel-3AWYV{color:var(--rfe-color-error);font-size:var(--rfe-error-font-size);pointer-events:none}.SUI-OTPInput-module-resendContainer-eOH31{color:var(--rfe-black);display:flex;justify-content:space-between;margin-top:var(--rfe-label-spacing)}.SUI-OTPInput-module-resend-IcTLo{background:none;border:0;color:var(--rfe-black);font-size:var(--rfe-placeholder-font-size);line-height:16px;margin:0;opacity:.5;padding:0;pointer-events:none}.SUI-OTPInput-module-resendActive-Id97P{color:var(--rfe-black);cursor:pointer;font-weight:500;opacity:1;pointer-events:all;text-decoration:underline}.SUI-OTPInput-module-time-RyRk2{color:var(--rfe-color-error);font-size:var(--rfe-placeholder-font-size);line-height:16px;text-align:right}.SUI-Slot-module-slot-QvdLC{align-items:center;background-color:var(--rfe-background);border:1px solid var(--rfe-border);border-radius:var(--rfe-border-radius);color:var(--rfe-color);display:flex;font-family:var(--rfe-font-family);font-size:var(--rfe-font-size);justify-content:center;line-height:24px;min-height:var(--rfe-input-height);position:relative;transition:all .25s;width:100%}.SUI-Slot-module-slotActive-GLSyp{box-shadow:var(--rfe-focus)}.SUI-Slot-module-slotDisabled-NoGFU{background:var(--rfe-background-disabled);color:var(--rfe-color);cursor:not-allowed;opacity:1}.SUI-Slot-module-slotError-SKIPw{border-color:var(--rfe-color-error)!important}.SUI-Slot-module-caretRoot-gGAxC{align-items:center;display:flex;inset:0;justify-content:center;pointer-events:none;position:absolute;width:100%}.SUI-Slot-module-caret-vz2Rq{animation:SUI-Slot-module-caret-blink-Okl7v 1.2s ease-out infinite;background-color:var(--rfe-black);min-height:calc(var(--rfe-input-height)/3);width:1px}@keyframes SUI-Slot-module-caret-blink-Okl7v{0%,70%,to{opacity:1}20%,50%{opacity:0}}