.recova-attachment-input__root{gap:var(--recova-dimension-x2);margin-inline:calc(var(--recova-attachment-input-extend-x) * -1);flex-direction:column;display:flex}.recova-attachment-input__dropzone{justify-content:center;align-items:center;gap:var(--recova-dimension-x2);border:1px dashed var(--recova-color-palette-gray-500);border-radius:var(--recova-radius-r3);height:120px;padding-inline:var(--recova-dimension-x4);margin-inline:var(--recova-attachment-input-extend-x);flex-direction:column;transition:border-color .2s;display:flex}.recova-attachment-input__dropzone[data-dragging-over]{border-style:solid;border-color:var(--recova-color-stroke-neutral-solid)}.recova-attachment-input__dropzone:is(:disabled,[disabled],[data-disabled]){cursor:not-allowed}.recova-attachment-input__dropzoneLabel{color:var(--recova-color-fg-neutral-subtle);font-size:var(--recova-font-size-t4);line-height:var(--recova-font-size-t4);font-weight:var(--recova-font-weight-medium);text-align:center}.recova-attachment-input__dropzoneLabel:is(:disabled,[disabled],[data-disabled]){color:var(--recova-color-fg-disabled)}.recova-attachment-input__container{gap:var(--recova-dimension-x2);padding-top:var(--recova-dimension-x1);margin-top:calc(var(--recova-dimension-x1) * -1);padding-inline:var(--recova-attachment-input-extend-x);display:flex;overflow-x:auto}.recova-attachment-input__itemGroup{gap:var(--recova-dimension-x2);margin:0;padding:0;list-style:none;display:flex}
.recova-attachment-input-item__root{isolation:isolate;justify-content:center;align-items:center;gap:var(--recova-dimension-x2_5);border-radius:var(--recova-radius-r3);--remove-button-mask-size:var(--recova-dimension-x6);--remove-button-mask-offset:var(--recova-dimension-x1_5);outline:var(--recova-dimension-x0_5) solid transparent;outline-offset:var(--recova-dimension-x0_5);height:80px;display:flex;position:relative}.recova-attachment-input-item__root:is(:focus-visible,[data-focus-visible]){outline:var(--recova-dimension-x0_5) solid var(--recova-color-stroke-focus-ring);outline-offset:var(--recova-dimension-x0_5)}.recova-attachment-input-item__root:before{content:"";border-radius:inherit;pointer-events:none;-webkit-mask-image:linear-gradient(#000,#000),url("data:image/svg+xml;utf8,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"12\" cy=\"12\" r=\"12\" fill=\"white\"/></svg>");-webkit-mask-size:100% 100%, var(--remove-button-mask-size) var(--remove-button-mask-size);-webkit-mask-position:0 0, right calc(0px - var(--remove-button-mask-offset)) top calc(0px - var(--remove-button-mask-offset));-webkit-mask-composite:source-out;mask-image:linear-gradient(#000,#000),url("data:image/svg+xml;utf8,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"12\" cy=\"12\" r=\"12\" fill=\"white\"/></svg>");-webkit-mask-repeat:no-repeat;-webkit-mask-size:100% 100%, var(--remove-button-mask-size) var(--remove-button-mask-size);mask-size:100% 100%, var(--remove-button-mask-size) var(--remove-button-mask-size);-webkit-mask-position:0 0, right calc(0px - var(--remove-button-mask-offset)) top calc(0px - var(--remove-button-mask-offset));mask-position:0 0, right calc(0px - var(--remove-button-mask-offset)) top calc(0px - var(--remove-button-mask-offset));position:absolute;inset:0;transform:translateZ(0);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-composite:source-out;mask-composite:subtract}.recova-attachment-input-item__root[role=button]:not([aria-grabbed=true]):not([data-readonly]){cursor:grab}.recova-attachment-input-item__root[aria-grabbed=true]{--remove-button-mask-size:0px;--remove-button-mask-offset:0px}.recova-attachment-input-item__image{object-fit:cover;border-radius:inherit;width:100%;height:100%;-webkit-mask-image:linear-gradient(#000,#000),url("data:image/svg+xml;utf8,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"12\" cy=\"12\" r=\"12\" fill=\"white\"/></svg>");-webkit-mask-size:100% 100%, var(--remove-button-mask-size) var(--remove-button-mask-size);-webkit-mask-position:0 0, right calc(0px - var(--remove-button-mask-offset)) top calc(0px - var(--remove-button-mask-offset));-webkit-mask-composite:source-out;mask-image:linear-gradient(#000,#000),url("data:image/svg+xml;utf8,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"12\" cy=\"12\" r=\"12\" fill=\"white\"/></svg>");-webkit-mask-repeat:no-repeat;-webkit-mask-size:100% 100%, var(--remove-button-mask-size) var(--remove-button-mask-size);mask-size:100% 100%, var(--remove-button-mask-size) var(--remove-button-mask-size);-webkit-mask-position:0 0, right calc(0px - var(--remove-button-mask-offset)) top calc(0px - var(--remove-button-mask-offset));mask-position:0 0, right calc(0px - var(--remove-button-mask-offset)) top calc(0px - var(--remove-button-mask-offset));transform:translateZ(0);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-composite:source-out;mask-composite:subtract}.recova-attachment-input-item__thumbnail{width:var(--recova-dimension-x12);height:var(--recova-dimension-x12);background-color:var(--recova-color-bg-neutral-weak);border-radius:var(--recova-radius-r2);--recova-icon-size:var(--recova-dimension-x6);--recova-icon-color:var(--recova-color-fg-neutral-subtle);flex-shrink:0;justify-content:center;align-items:center;display:flex}.recova-attachment-input-item__metadata{flex-direction:column;flex-grow:1;width:100%;display:flex}.recova-attachment-input-item__name{word-break:break-all;font-size:var(--recova-font-size-t2);line-height:var(--recova-line-height-t2);font-weight:var(--recova-font-weight-medium);color:var(--recova-color-fg-neutral);overflow:hidden}.recova-attachment-input-item__size{font-size:var(--recova-font-size-t1);line-height:var(--recova-line-height-t1);font-weight:var(--recova-font-weight-regular);color:var(--recova-color-fg-neutral-subtle)}.recova-attachment-input-item__backdrop{border-radius:inherit;-webkit-mask-image:linear-gradient(#000,#000),url("data:image/svg+xml;utf8,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"12\" cy=\"12\" r=\"12\" fill=\"white\"/></svg>");-webkit-mask-size:100% 100%, var(--remove-button-mask-size) var(--remove-button-mask-size);-webkit-mask-position:0 0, right calc(0px - var(--remove-button-mask-offset)) top calc(0px - var(--remove-button-mask-offset));-webkit-mask-composite:source-out;mask-image:linear-gradient(#000,#000),url("data:image/svg+xml;utf8,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"12\" cy=\"12\" r=\"12\" fill=\"white\"/></svg>");-webkit-mask-repeat:no-repeat;-webkit-mask-size:100% 100%, var(--remove-button-mask-size) var(--remove-button-mask-size);mask-size:100% 100%, var(--remove-button-mask-size) var(--remove-button-mask-size);-webkit-mask-position:0 0, right calc(0px - var(--remove-button-mask-offset)) top calc(0px - var(--remove-button-mask-offset));mask-position:0 0, right calc(0px - var(--remove-button-mask-offset)) top calc(0px - var(--remove-button-mask-offset));flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0;transform:translateZ(0);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-composite:source-out;mask-composite:subtract}.recova-attachment-input-item__actionButton{text-align:center;width:100%;height:100%;font:inherit;cursor:pointer;border-radius:inherit;transition:outline-color var(--recova-duration-d3) var(--recova-timing-function-easing);outline:var(--recova-dimension-x0_5) solid transparent;outline-offset:calc(var(--recova-dimension-x0_5) * -1);background:0 0;border:none;flex-direction:column;justify-content:center;align-items:center;padding:0;display:flex}.recova-attachment-input-item__actionButton:is(:focus-visible,[data-focus-visible]){outline:var(--recova-dimension-x0_5) solid var(--recova-color-stroke-focus-ring);outline-offset:calc(var(--recova-dimension-x0_5) * -1)}.recova-attachment-input-item__actionButton{font-size:var(--recova-font-size-t2);line-height:var(--recova-line-height-t2);font-weight:var(--recova-font-weight-medium);gap:var(--recova-dimension-x1);--recova-icon-size:var(--recova-dimension-x6)}.recova-attachment-input-item__removeButton{top:calc(var(--recova-dimension-x1) * -1);right:calc(var(--recova-dimension-x1) * -1);width:var(--recova-dimension-x5);height:var(--recova-dimension-x5);background-color:var(--recova-color-bg-layer-default);border-radius:var(--recova-radius-full);cursor:pointer;transition:background-color .2s, outline-color var(--recova-duration-d3) var(--recova-timing-function-easing);outline:var(--recova-dimension-x0_5) solid transparent;outline-offset:calc(var(--recova-dimension-x0_5) * -1);border:none;justify-content:center;align-items:center;padding:0;display:flex;position:absolute}.recova-attachment-input-item__removeButton:is(:focus-visible,[data-focus-visible]){outline:var(--recova-dimension-x0_5) solid var(--recova-color-stroke-focus-ring);outline-offset:calc(var(--recova-dimension-x0_5) * -1)}.recova-attachment-input-item__removeButton{box-shadow:inset 0 0 0 1px var(--recova-color-stroke-neutral-weak);--recova-icon-size:var(--recova-dimension-x2_5);--recova-icon-color:var(--recova-color-fg-neutral)}@media (hover:hover) and (pointer:fine){.recova-attachment-input-item__removeButton:not(:is(:disabled,[disabled],[data-disabled])):is(:hover,[data-hover]){background-color:var(--recova-color-bg-layer-default-pressed)}}@media not all and (hover:hover) and (pointer:fine){.recova-attachment-input-item__removeButton:not(:is(:disabled,[disabled],[data-disabled])):is(:active,[data-active]){background-color:var(--recova-color-bg-layer-default-pressed)}}.recova-attachment-input-item__removeButton:is(:disabled,[disabled],[data-disabled]){cursor:not-allowed;--recova-icon-color:var(--recova-color-fg-disabled)}[aria-grabbed=true] .recova-attachment-input-item__removeButton{display:none}.recova-attachment-input-item__root--type_general{width:160px;padding-inline:var(--recova-dimension-x4)}.recova-attachment-input-item__root--type_general:before{box-shadow:inset 0 0 0 1px var(--recova-color-stroke-neutral-weak)}.recova-attachment-input-item__thumbnail--type_general[data-has-overlay]{display:none}.recova-attachment-input-item__thumbnail--type_general[data-readonly],[aria-grabbed=true] .recova-attachment-input-item__thumbnail--type_general{--recova-icon-color:var(--recova-color-fg-disabled)}.recova-attachment-input-item__metadata--type_general[data-has-overlay]{display:none}.recova-attachment-input-item__name--type_general[data-readonly],[aria-grabbed=true] .recova-attachment-input-item__name--type_general,.recova-attachment-input-item__size--type_general[data-readonly],[aria-grabbed=true] .recova-attachment-input-item__size--type_general{color:var(--recova-color-fg-disabled)}.recova-attachment-input-item__actionButton--type_general{color:var(--recova-color-fg-neutral-subtle);--recova-icon-color:var(--recova-color-fg-neutral-subtle)}.recova-attachment-input-item__root--type_image{width:80px;transition:opacity .2s}.recova-attachment-input-item__root--type_image:before{z-index:1;box-shadow:inset 0 0 0 1px var(--recova-color-stroke-neutral-subtle)}.recova-attachment-input-item__root--type_image[data-readonly],.recova-attachment-input-item__root--type_image[aria-grabbed=true]{opacity:.5}.recova-attachment-input-item__thumbnail--type_image,.recova-attachment-input-item__metadata--type_image{display:none}.recova-attachment-input-item__badge--type_image{bottom:0;height:var(--recova-dimension-x6);padding-inline:var(--recova-dimension-x1);background-color:var(--recova-color-bg-overlay);border-radius:0 0 var(--recova-radius-r3) var(--recova-radius-r3);justify-content:center;align-items:center;display:flex;position:absolute;inset-inline:0}.recova-attachment-input-item__badgeLabel--type_image{text-overflow:ellipsis;white-space:nowrap;font-size:var(--recova-font-size-t2);line-height:var(--recova-line-height-t2);font-weight:var(--recova-font-weight-medium);color:var(--recova-color-palette-static-white);overflow:hidden}.recova-attachment-input-item__backdrop--type_image{background:var(--recova-color-bg-overlay)}.recova-attachment-input-item__actionButton--type_image{color:var(--recova-color-palette-static-white);--recova-icon-color:var(--recova-color-palette-static-white)}
.recova-attachment-input-trigger__root{justify-content:center;align-items:center;gap:var(--recova-dimension-x1);width:80px;height:80px;font:inherit;box-shadow:inset 0 0 0 1px var(--recova-color-stroke-neutral-weak);cursor:pointer;border-radius:var(--recova-radius-r3);transition:background-color .2s, outline-color var(--recova-duration-d3) var(--recova-timing-function-easing);outline:var(--recova-dimension-x0_5) solid transparent;outline-offset:calc(var(--recova-dimension-x0_5) * -1);background-color:#0000;border:none;flex-direction:column;flex-shrink:0;padding:0;display:flex}.recova-attachment-input-trigger__root:is(:focus-visible,[data-focus-visible]){outline:var(--recova-dimension-x0_5) solid var(--recova-color-stroke-focus-ring);outline-offset:calc(var(--recova-dimension-x0_5) * -1)}@media (hover:hover) and (pointer:fine){.recova-attachment-input-trigger__root:not(:is(:disabled,[disabled],[data-disabled])):is(:hover,[data-hover]){background-color:var(--recova-color-bg-transparent-pressed)}}@media not all and (hover:hover) and (pointer:fine){.recova-attachment-input-trigger__root:not(:is(:disabled,[disabled],[data-disabled])):is(:active,[data-active]){background-color:var(--recova-color-bg-transparent-pressed)}}.recova-attachment-input-trigger__root:is(:disabled,[disabled],[data-disabled]){cursor:not-allowed}.recova-attachment-input-trigger__icon{width:var(--recova-dimension-x6);height:var(--recova-dimension-x6);color:var(--recova-color-fg-neutral-subtle);flex-shrink:0}.recova-attachment-input-trigger__icon:is(:disabled,[disabled],[data-disabled]){color:var(--recova-color-fg-disabled)}.recova-attachment-input-trigger__itemCountArea{font-size:var(--recova-font-size-t2);line-height:var(--recova-line-height-t2)}.recova-attachment-input-trigger__itemCount{color:var(--recova-color-fg-neutral);font-size:var(--recova-font-size-t2);line-height:var(--recova-line-height-t2);font-weight:var(--recova-font-weight-regular)}.recova-attachment-input-trigger__itemCount[data-empty]{color:var(--recova-color-fg-neutral-subtle)}.recova-attachment-input-trigger__itemCount:is(:disabled,[disabled],[data-disabled]){color:var(--recova-color-fg-disabled)}.recova-attachment-input-trigger__maxItemCount{color:var(--recova-color-fg-neutral-subtle);font-size:var(--recova-font-size-t2);line-height:var(--recova-line-height-t2);font-weight:var(--recova-font-weight-regular)}.recova-attachment-input-trigger__maxItemCount:is(:disabled,[disabled],[data-disabled]){color:var(--recova-color-fg-disabled)}
