.custom-input{display:flex;flex-wrap:wrap;flex-direction:column;align-items:start;justify-content:start;gap:.8rem;color:rgb(var(--color-body-text));cursor:pointer;position:relative;font-size:var(--font-size-paragraph-small);line-height:var(--line-height-paragraph-small);text-align:left}.inline-flex{display:inline-flex}.custom-input.custom-input--horizontal{width:100%}.custom-input.custom-input--horizontal .custom-input__field{display:flex;flex-direction:row;align-items:center;justify-content:start;gap:1.6rem;width:100%}.custom-input.custom-input--horizontal .custom-input__field input{flex-grow:1}.custom-input.custom-input--horizontal .custom-input__button{flex-shrink:0;background:none;border:none;padding:0;cursor:pointer;transition:opacity var(--duration-short) ease-in-out}.custom-input.custom-input--horizontal .custom-input__button:hover{opacity:.65}.custom-input.custom-input--error:has(.alert-message),.custom-input.custom-input--attention:has(.alert-message),.custom-input.custom-input--success:has(.alert-message){margin-bottom:calc(1.8rem + (var(--grid-mobile-vertical-spacing) / 2))}.custom-input.custom-input--error .alert-message,.custom-input.custom-input--attention .alert-message,.custom-input.custom-input--success .alert-message{display:flex;width:100%;position:relative;bottom:0;padding:0;margin-top:0}.custom-input .alert-message{font-size:var(--font-size-paragraph-extra-small);line-height:var(--line-height-paragraph-extra-small);margin-bottom:0}.custom-input .alert-message svg{width:1.6rem}.custom-input span:not(.custom-input__icon):first-child{font-family:var(--font-body-family-secondary);font-weight:700}.custom-input span:not(.custom-input__icon,.badge,.custom-input__span){display:block;width:100%;font-weight:500}.custom-input:has(input[type=checkbox],input[type=radio])>span:first-of-type{font-weight:400;padding-top:.1rem;margin-bottom:-.1rem;font-family:var(--font-body-family)}.custom-input:has(input[type=checkbox],input[type=radio]){flex-direction:row-reverse;align-items:center;flex-wrap:nowrap}.custom-input .custom-input__field{position:relative;background-color:rgb(var(--color-white));width:100%;border-radius:var(--inputs-radius)}.custom-input .custom-input__field,.custom-input .custom-input__field>*,.custom-input .custom-input__field option{font-size:var(--font-size-paragraph-small);line-height:var(--line-height-paragraph-small);color:inherit}.custom-input .custom-input__field>*{padding:1.2rem 1.6rem}.custom-input .custom-input__field select{padding-right:2.4rem;background:none;border-radius:var(--inputs-radius);-webkit-appearance:none!important;appearance:none!important;font-family:inherit}.custom-input .custom-input__field:has(select):after,.custom-input .custom-input__field:has(select):before{position:absolute;display:block;right:1.6rem;content:"";transform:translateY(-50%);border:.5rem solid transparent;border-bottom:none}.custom-input .custom-input__field:has(select):before{top:50%;border-top-color:rgb(var(--color-foreground))}.custom-input .custom-input__field:has(select):after{top:calc(50% - .2rem);border-top-color:rgb(var(--color-white))}.custom-input .custom-input__field option{min-height:unset;padding:0}.custom-input input:not([type=radio],[type=checkbox]){width:100%;border:none;outline:none;font-family:var(--font-heading-family);color:rgb(var(--color-foreground));background:none}.custom-input textarea{width:100%;max-width:100%;min-width:100%;min-height:10rem;border:none;outline:none;display:block;background:none;font-family:inherit}.custom-input select{width:100%;border:none;outline:none;display:block;border-right:solid 1.6rem transparent;cursor:pointer}.custom-input .custom-input__field{--outline-size: .1rem;outline-offset:-.1rem;--outline-color: var(--color-strong-line);outline:solid var(--outline-size) rgb(var(--outline-color));transition:outline var(--duration-short) ease-in-out}.custom-input:has(:focus-visible) .custom-input__field input,.custom-input:has(:focus-visible) .custom-input__field textarea,.custom-input:has(:focus-visible) .custom-input__field select{box-shadow:none}.custom-input:has(:focus-visible) .custom-input__icon:before{content:"";width:100%;height:100%;outline:solid .1rem currentColor;outline-offset:.2rem;position:absolute;top:0;left:0;bottom:0;right:0}.custom-input .custom-input__icon{--outline-color: var(--color-body-text);--outline-size: .1rem;align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;position:relative;outline:solid var(--outline-size) rgb(var(--outline-color));outline-offset:-.1rem;min-height:2rem;min-width:2rem;background-color:rgb(var(--color-white));border-radius:.4rem;margin-left:.1rem}.custom-input .custom-input__field:has(:hover:not([disabled],.disabled)){--outline-color: var(--color-body-text)}.custom-input .custom-input__field:has(:active:not([disabled],.disabled)),.custom-input .custom-input__field:has(:target:not([disabled],.disabled)),.custom-input .custom-input__field:has(:focus:not([disabled],.disabled)){--outline-color: var(--color-body-text)}.custom-input:has(input[type=radio]) .custom-input__icon{border-radius:50%}.custom-input.custom-input--error .custom-input__field,.custom-input.custom-input--error .custom-input__icon{--outline-size: .1rem}.custom-input:has(:focus-visible) .custom-input__field{--outline-size: .2rem}.custom-input.custom-input--error .custom-input__field,.custom-input.custom-input--error:has(:focus-visible) .custom-input__field,.custom-input.custom-input--error .custom-input__icon{--outline-color: var(--color-error) !important}.custom-input:has(input[type=radio],input[type=checkbox]) input{position:absolute!important;overflow:hidden;width:.1rem;height:.1rem;margin:-.1rem;padding:0;border:0;clip:rect(0 0 0 0);word-wrap:normal!important}.custom-input:has(input[type=radio],input[type=checkbox]) .custom-input__icon svg{display:block;position:absolute;top:50%;left:50%;width:60%;height:60%;color:currentColor;fill:currentColor;opacity:1;pointer-events:all;z-index:0;transform:translate(-50%,-50%) scale(0)}.custom-input:has(input[type=radio],input[type=checkbox]) .custom-input__icon input:checked+svg{transform:translate(-50%,-50%) scale(1)}.custom-input:has(input[type=radio]) .custom-input__icon:after{content:"";position:absolute;top:50%;left:50%;width:35%;height:35%;border-radius:50%;background-color:currentColor;transform:translate(-50%,-50%) scale(0)}.custom-input:has(input[type=radio]) .custom-input__icon:has(input:checked):after{transform:translate(-50%,-50%) scale(1)}.custom-input:has(input[type=checkbox]) .custom-input__icon:after{content:"";position:absolute;border-radius:0;left:50%;top:50%;width:25%;height:50%;border-right:.1rem solid currentColor;border-bottom:.1rem solid currentColor;transform:translate(-50%,-60%) rotate(45deg) scale(0)}.custom-input:not(.custom-input--error):has(input[type=radio]:not([disabled]):checked,input[type=checkbox]:not([disabled]):checked) .custom-input__icon{background-color:rgb(var(--color-body-text))}.custom-input:not(.custom-input--error):has(input[type=radio]:disabled,input[type=checkbox]:disabled) .custom-input__icon{background-color:rgb(var(--color-strong-line));--outline-color: var(--color-strong-line);color:rgb(var(--color-white))}.custom-input:not(.custom-input--error):has(input[type=checkbox]:not([disabled]):checked) .custom-input__icon:after{border-color:rgb(var(--color-white))}.custom-input:not(.custom-input--error):has(input[type=radio]:not([disabled]):checked,input[type=checkbox]:not([disabled]):checked) .custom-input__icon svg path{fill:rgb(var(--color-white))}.custom-input:not(.custom-input--error):has(input[type=radio]:not([disabled]):checked) .custom-input__icon:after{background-color:rgb(var(--color-white))}.custom-input:has(input[type=checkbox]) .custom-input__icon:has(input:checked):after{transform:translate(-50%,-60%) rotate(45deg) scale(1)}.custom-input .custom-input__icon:has(svg):after{display:none!important}.custom-input:has(:disabled) .custom-input__icon,.custom-input:has(:disabled) .custom-input__field{opacity:.5}.custom-input .custom-input__field select[disabled]>option,.custom-input .custom-input__field select[disabled]{color:currentColor;opacity:1}.custom-input:has(:disabled) *,.custom-input:has(:disabled){cursor:not-allowed}.custom-input-field+.custom-input-field{margin-top:2.4rem}body .custom-input-field>*+*{margin-top:.8rem}
/*# sourceMappingURL=/cdn/shop/t/3/assets/p80-custom-inputs.css.map */