.HPColorSwatch_root{background-image:linear-gradient(45deg,#e0e0e0 25%,transparent 0),linear-gradient(-45deg,#e0e0e0 25%,transparent 0),linear-gradient(45deg,transparent 75%,#e0e0e0 0),linear-gradient(-45deg,transparent 75%,#e0e0e0 0);background-position:0 0,0 7px,7px -7px,-7px 0;background-size:14px 14px;overflow:hidden;border-radius:1000px}.HPColorSwatch_root__bordered{border:1px solid var(--zds-color-border-primary)}.HPColorSwatch_color{aspect-ratio:1}.HPColorSwatchButton_root{display:block;align-items:normal;width:100%;padding:0;text-align:left;background:none;border:none;border-radius:0;-webkit-appearance:none;appearance:none}.HPColorSwatchButton_root:focus-visible,.HPColorSwatchButton_root__focus{outline:3px solid var(--zds-color-border-focus-primary)!important;outline-offset:0}.HPColorSwatchButton_root:hover:not(:disabled),.HPColorSwatchButton_root__hover:not(:disabled){position:relative}.HPColorSwatchButton_root:hover:not(:disabled):after,.HPColorSwatchButton_root__hover:not(:disabled):after{position:absolute;inset:0;border:2px solid;border-radius:inherit;pointer-events:none;content:"";border-color:var(--zds-color-brand-blue-60)}.HPColorSwatchButton_root__selected{position:relative}.HPColorSwatchButton_root__selected:after{position:absolute;inset:0;border:2px solid;border-radius:inherit;pointer-events:none;content:"";border-color:var(--zds-color-border-brand-primary)!important}.HPColorSwatchButton_root{border-radius:1000px}.ZDSSkeletonImage_img__hide{display:none}.HPIconResultThumbnail_root{display:block;align-items:normal;width:100%;padding:0;text-align:left;background:none;border:none;border-radius:0;-webkit-appearance:none;appearance:none}.HPIconResultThumbnail_root:focus-visible,.HPIconResultThumbnail_root__focus{outline:3px solid var(--zds-color-border-focus-primary)!important;outline-offset:0}.HPIconResultThumbnail_root:hover:not(:disabled),.HPIconResultThumbnail_root__hover:not(:disabled){position:relative}.HPIconResultThumbnail_root:hover:not(:disabled):after,.HPIconResultThumbnail_root__hover:not(:disabled):after{position:absolute;inset:0;border:2px solid;border-radius:inherit;pointer-events:none;content:"";border-color:var(--zds-color-brand-blue-60)}.HPIconResultThumbnail_root__selected{position:relative}.HPIconResultThumbnail_root__selected:after{position:absolute;inset:0;border:2px solid;border-radius:inherit;pointer-events:none;content:"";border-color:var(--zds-color-border-brand-primary)!important}.HPIconResultThumbnail_root{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:8px}.HPIconResultThumbnail_root:disabled{opacity:.5}.HPIconResultThumbnail_root .HPIconResultThumbnail_image{width:100%;aspect-ratio:1}.HPIconResultThumbnail_uploadShield{position:absolute;top:0;left:0;display:flex;opacity:.5;align-items:center;justify-content:center;width:100%;height:100%;background:#fff;cursor:wait}.HPIconResultThumbnail_loadingIcon{position:absolute}.HPDraggableButton_root{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .25s ease}.HPDraggableButton_root>button{box-shadow:var(--box-shadow);transition:box-shadow .3s ease;transform:translate3d(var(--translate-x,0),var(--translate-y,0),0) scale(var(--scale,1))}.HPDraggableButton_root:not(.HPDraggableButton_handle)>button{touch-action:none}.HPDraggableButton_root:not(.HPDraggableButton_handle)>button:focus-visible:not(.HPDraggableButton_active .HPDraggableButton_root:not(.HPDraggableButton_handle)>button){box-shadow:0 0 0 3px #4c9ffe}.HPDraggableButton_root.HPDraggableButton_dragging{z-index:1;transition:none}.HPDraggableButton_root.HPDraggableButton_dragging *{cursor:grabbing}.HPDraggableButton_root.HPDraggableButton_dragging>button{--scale:1.06;--box-shadow:-1px 0 15px 0 rgba(34,33,81,0.01),0px 15px 15px 0 rgba(34,33,81,0.25)}.HPDraggableButton_root.HPDraggableButton_dragging>button:focus-visible{--box-shadow:0 0px 10px 2px #4c9ffe}.HPDraggableButton_root.HPDraggableButton_dragging label{opacity:0;animation:none}.HPDraggableButton_root.HPDraggableButton_dragging>button,.HPDraggableButton_root.HPDraggableButton_dragOverlay>button{animation:HPDraggableButton_pop .25s cubic-bezier(.18,.67,.6,1.22)}@keyframes HPDraggableButton_pop{0%{transform:translate3d(var(--translate-x,0),var(--translate-y,0),0) scale(1)}to{box-shadow:var(--box-shadow);transform:translate3d(var(--translate-x,0),var(--translate-y,0),0) scale(var(--scale))}}