.optional-file-input{display:block;width:100%;margin-bottom:1.6rem}.optional-file-input__hidden-files{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.optional-file-input .product-form__input{margin-bottom:.4rem}.optional-file-input .form__label{display:flex;flex-wrap:wrap;align-items:center;gap:0 .4rem}.optional-file-input .form__label .optional-file-input__title-main{font-weight:700;color:rgb(var(--color-foreground))}.optional-file-input__toggle{display:flex;flex-wrap:wrap;gap:.5rem}.optional-file-input__toggle input[type=radio]{clip:rect(0,0,0,0);overflow:hidden;position:absolute;height:1px;width:1px}.optional-file-input__toggle input[type=radio]+label{border:var(--variant-pills-border-width) solid rgba(var(--color-foreground),var(--variant-pills-border-opacity));background-color:rgb(var(--color-background));color:rgba(var(--color-foreground));border-radius:var(--variant-pills-radius);display:inline-flex;align-items:center;justify-content:center;gap:.5rem;margin:.7rem .2rem .2rem 0!important;padding:.75rem 1.25rem .65rem;font-size:.9rem;line-height:1;text-align:center;transition:border var(--duration-short) ease;cursor:pointer;position:relative}@media screen and (max-width:749px){.optional-file-input__toggle input[type=radio]+label{min-width:6rem;min-height:2.75rem;padding:.85rem 1.5rem;font-size:1rem}}.optional-file-input__toggle input[type=radio]+label:after{content:"";position:absolute;top:calc(var(--variant-pills-border-width) * -1);right:calc(var(--variant-pills-border-width) * -1);bottom:calc(var(--variant-pills-border-width) * -1);left:calc(var(--variant-pills-border-width) * -1);z-index:-1;border-radius:var(--variant-pills-radius);box-shadow:var(--variant-pills-shadow-horizontal-offset) var(--variant-pills-shadow-vertical-offset) var(--variant-pills-shadow-blur-radius) rgba(var(--color-shadow),var(--variant-pills-shadow-opacity))}.optional-file-input__toggle input[type=radio]+label:hover{border-color:rgb(var(--color-foreground))}.optional-file-input__toggle input[type=radio]:checked+label{border-color:rgba(var(--color-foreground),1)}.optional-file-input__toggle input[type=radio]:focus-visible+label{box-shadow:0 0 0 .3rem rgb(var(--color-background)),0 0 0 .5rem rgba(var(--color-foreground),.55)}.optional-file-input__meta{color:rgba(var(--color-foreground),.75)}.optional-file-input__upload-wrapper{margin-top:.4rem;padding:.75rem 1rem 1.25rem;background-color:rgba(var(--color-foreground),.04);border-radius:0rem}.optional-file-input__upload-wrapper[hidden]{display:none}.optional-file-input__tabs{display:flex;gap:0;margin-bottom:.75rem}.optional-file-input__tab{font-size:.95rem;font-weight:500;margin-right:1rem;color:rgba(var(--color-foreground),.7);padding:.5rem;margin-bottom:-2px;border:none;border-bottom:2px solid transparent;background:none;cursor:pointer;font-family:inherit;transition:color var(--duration-short) ease,border-color var(--duration-short) ease}.optional-file-input__tab:hover{color:rgb(var(--color-foreground))}.optional-file-input__tab--active{color:rgb(var(--color-foreground));border-bottom-color:rgb(var(--color-foreground))}.optional-file-input__panel{margin-top:0}.optional-file-input__panel.hidden{display:none}.optional-file-input__email-content{font-size:.95rem;font-weight:500;margin:0;line-height:1.5}.optional-file-input__email-content p:first-child{margin-top:0}.optional-file-input__email-content p:last-child{margin-bottom:0}.optional-file-input__upload-inner{display:flex;flex-direction:column;gap:.75rem}.optional-file-input__file-area{width:100%}.optional-file-input__thumbnails{display:flex;flex-direction:row;flex-wrap:wrap;gap:.5rem}.optional-file-input__thumbnail{position:relative;width:4rem;height:4rem;border-radius:.5rem;overflow:hidden;flex-shrink:0;background-color:rgba(var(--color-foreground),.08)}.optional-file-input__thumbnail-img{width:100%;height:100%;object-fit:cover;display:block}.optional-file-input__thumbnail--pdf .optional-file-input__thumbnail-icon{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;color:rgba(var(--color-foreground),.5)}.optional-file-input__thumbnail--pdf .optional-file-input__thumbnail-icon svg{width:1.5rem;height:1.5rem}.optional-file-input__thumbnail-remove{position:absolute;top:.25rem;right:.25rem;width:1.25rem;height:1.25rem;padding:0;margin:0;border:none;border-radius:50%;background-color:#0009;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color .2s ease}.optional-file-input__thumbnail-remove:hover{background-color:#000c}.optional-file-input__thumbnail-remove svg{width:.65rem;height:.65rem}.optional-file-input__help-text{font-size:.95rem;font-weight:500;color:rgb(var(--color-foreground));margin:0}.optional-file-input__file-area input[type=file]{display:none}.optional-file-input__file-label{display:flex;align-items:center;gap:1rem;cursor:pointer}.optional-file-input__file-button{display:inline-flex;align-items:center;padding:.75rem 1rem .65rem;background-color:rgb(var(--color-background));border:var(--variant-pills-border-width) solid rgba(var(--color-foreground),var(--variant-pills-border-opacity));border-radius:var(--variant-pills-radius);font-size:.9rem;line-height:1;color:rgb(var(--color-foreground));transition:border var(--duration-short) ease;position:relative}@media screen and (max-width:749px){.optional-file-input__file-label{width:100%}.optional-file-input__file-button{flex:1;justify-content:center;padding:1rem 1.5rem;font-size:1rem;min-height:3rem}}.optional-file-input__uploaded-icon{display:inline-flex;align-items:center;margin-right:.4rem}.optional-file-input__uploaded-icon .icon-checkmark{width:.9rem;height:.9rem}.optional-file-input__file-button:after{content:"";position:absolute;top:calc(var(--variant-pills-border-width) * -1);right:calc(var(--variant-pills-border-width) * -1);bottom:calc(var(--variant-pills-border-width) * -1);left:calc(var(--variant-pills-border-width) * -1);z-index:-1;border-radius:var(--variant-pills-radius);box-shadow:var(--variant-pills-shadow-horizontal-offset) var(--variant-pills-shadow-vertical-offset) var(--variant-pills-shadow-blur-radius) rgba(var(--color-shadow),var(--variant-pills-shadow-opacity))}.optional-file-input__file-label:hover .optional-file-input__file-button{border-color:rgb(var(--color-foreground))}.optional-file-input__file-name{font-size:.9rem;color:rgba(var(--color-foreground),.75)}
/*# sourceMappingURL=/cdn/shop/t/17/assets/component-optional-file-input.css.map */