@yoobic/yobi 7.7.120 → 7.7.124

package/dist/design-system/p-a9b344e7.entry.js

@@ -1 +0,0 @@
-import{r as t,c as e,h as a,H as r,a as o}from"./p-34197588.js";import{y as i,U as n,W as c,Y as s,b as p,t as l,_ as d,X as h,T as b}from"./p-8c6ff567.js";import"./p-4d956bd4.js";import{g as m}from"./p-76fdfe1c.js";import"./p-473a381c.js";import{f}from"./p-16ea8a14.js";import{c as g,a as y}from"./p-02c39f41.js";import{b as u}from"./p-4919d5c9.js";import{s as v}from"./p-b39e12c8.js";import{i as x}from"./p-f28b725b.js";import{c as w}from"./p-49116cc4.js";import"./p-ca07fb1e.js";import"./p-e0d6fbed.js";import"./p-81cde160.js";import"./p-bd19a341.js";import"./p-478a812f.js";import"./p-7b8c6197.js";import"./p-ba9a1e5a.js";import"./p-cf23f5c7.js";import"./p-9b8752ac.js";import"./p-b5003a96.js";import"./p-8822dd6d.js";import"./p-9c28d18f.js";import"./p-16ec81f2.js";import"./p-b71f650c.js";import"./p-ed132d63.js";import"./p-a4d0bd7f.js";import"./p-a33e7e8f.js";import"./p-a1142cd3.js";import"./p-1f1c180f.js";import"./p-659a953c.js";import"./p-ba705441.js";import"./p-773567d1.js";import"./p-338ff9dc.js";import"./p-88c8100b.js";var k,z;!function(t){t.left="left",t.right="right",t.undo="undo"}(k||(k={})),function(t){t.image="image",t.textimage="textimage",t.text="text"}(z||(z={}));const j=class{constructor(a){t(this,a),this.validityChanged=e(this,"validityChanged",7),this.inputChanged=e(this,"inputChanged",7),this.blockMoves=e(this,"blockMoves",7),this.validators=[],this.mode=z.text,this.showInstructionView=!0,this.animated=!0,this.shuffled=!0,this.values=[],this.swipeCards=[],this.animationDelay=this.animated?.25:0,this.cardsElements=[],this.swipeButtons=[]}onIsVisibleChanged(){setTimeout((()=>this.displayFooterElement(!this.showInstructionView)),150)}get hasImage(){return this.isMode(z.image)||this.isMode(z.textimage)}get hasText(){return this.isMode(z.text)||this.isMode(z.textimage)}get hasTwoCategories(){var t,e;return!(!(null===(t=this.categories)||void 0===t?void 0:t.length)||2!==(null===(e=this.categories)||void 0===e?void 0:e.filter((t=>t)).length))}get buttons(){const t=t=>{var e,a;return null===(a=null===(e=this.swipeButtons)||void 0===e?void 0:e.filter((e=>(null==e?void 0:e.id)===`swipe-${t}`)))||void 0===a?void 0:a[0]};return{left:t(k.left),undo:t(k.undo),right:t(k.right)}}get currentCard(){return this.swipeCards[this.swipeCards.reduce(((t,e,a)=>e.swipedDirection?a+1:t),0)]}get currentCardElement(){var t;return this.getCardElement(null===(t=this.currentCard)||void 0===t?void 0:t.id)}get formHeight(){var t;return null===(t=i(this.host,"form"))||void 0===t?void 0:t.clientHeight}onRequireChanged(){this.validate()}onValuesChanged(){this.isMode(z.image)||this.spyOnValuesChanged(this.values)}onImagesChanged(){this.isMode(z.text)||this.spyOnValuesChanged(this.images)}onCategoriesChanged(){if(!this.hasDuplicatesValues){const t=this.livePreview&&!this.hasTwoCategories;g(this.outerContainerElement,t,"NOTFULFILLEDCATEGORIES"),t&&(this.showInstructionView=!0)}}componentWillLoad(){this.shuffleCardValues(),this.revealCards=!this.showInstructionView,this.swipeCards=this.initCards()}componentDidLoad(){this.outerContainerElement&&(this.displayFooterElement(!1),this.showInstructionView||this.initDraggable())}componentWillUpdate(){this.hasDataChanged&&(this.cardValues=[],this.shuffleCardValues(),this.revealCards=!0,this.swipeCards=this.initCards())}componentDidUpdate(){this.revealCards&&(this.hasDataChanged=!1,this.revealCards=!1,this.initDraggable()),setTimeout((()=>this.lockSwipeButtons(!1)),750)}validate(){var t;const e=null===(t=this.swipeCards.filter((t=>t.swipedDirection)))||void 0===t?void 0:t.length;return this.validity=e===(this.hasImage?this.images.length:this.values.length),this.validityChanged.emit(this.validity),this.validity}hasEmptyValue(t){return!(null==t?void 0:t.length)||!!(null==t?void 0:t.filter((t=>!t)).length)}shuffleCardValues(){const t=this.hasImage?this.images.filter((t=>this.isMode(z.textimage)?null==t?void 0:t._filename:t)):this.values.filter((t=>t));this.cardValues=this.shuffled?v(t):t}getCardElement(t){var e;return null===(e=this.cardsElements)||void 0===e?void 0:e.find((e=>(null==e?void 0:e.id)===t))}spyOnValuesChanged(t){if(this.hasTwoCategories){const e=this.hasEmptyValue(t);this.hasDuplicatesValues=1===y(this.values);const a=this.livePreview&&(e||this.hasDuplicatesValues),r=this.isMode(z.textimage)&&e?"NOEMPTYVALUES":this.hasDuplicatesValues?"NODUPLICATEVALUES":"";g(this.outerContainerElement,a,r),this.hasDataChanged=!a,a&&(this.showInstructionView=!0)}}getUserAnswer(){const t=t=>{var e,a;return this.isMode(z.image)?d(null===(a=null===(e=this.answer)||void 0===e?void 0:e[0])||void 0===a?void 0:a[0])?t._downloadURL:t._downloadURL.split("/").pop():this.isMode(z.textimage)?t._filename:t},e=e=>this.swipeCards.filter((t=>t.swipedDirection===e)).map((e=>t(e.value)));u([e(k.left),e(k.right)],this)}displayFooterElement(t=!0){const e=i(this.host,"yoo-ion-slide");if(e){const a=e.querySelector("yoo-form-footer");a&&!this.livePreview&&(a.style.display=t?"block":"none")}}initDraggable(){this.cardsElements.filter((t=>!n.get(t))).forEach((t=>this.getDraggableInstance(t))),this.cardsElements.forEach((t=>null==t?void 0:t.classList.remove("revealing")))}initCards(){var t;return(null===(t=this.cardValues)||void 0===t?void 0:t.map((t=>({id:m(),value:t}))))||[]}lockSwipeButtons(t=!0){this.swipeButtons.forEach((e=>e.disabled=t))}swipeCard(t){this.currentCard&&(this.lockSwipeButtons(),this.buttons[t].style.removeProperty("transform"),this.backgroundElement.removeAttribute("direction"),this.currentCardElement.setAttribute("swiped",t),this.currentCard.swipedDirection=t,this.getUserAnswer())}getSwipedState(t){const e=[.35,.65];return{swipedDirection:t<e[0]?k.left:t>e[1]?k.right:null,isCardThrowable:!x(t,e[0],e[1])}}setSwipingColor(t){if(this.currentCardElement){const e=this.currentCardElement.querySelector(".content-category"),a=[k.left,k.right].includes(t);e.textContent=this.getSwipedCategoryValue(t),[this.backgroundElement,this.currentCardElement].forEach((e=>{a?e.setAttribute("direction",t):e.removeAttribute("direction")}))}}getDraggableInstance(t){return c().then((e=>{if(!e||!t)return;this.revealCards=!1;const a=this.host.clientWidth/2,r=e(),o=e({paused:!0}),i=t=>t.classList.contains("current");o.fromTo(this.buttons.left,1,{scale:1.5},{scale:1},0).fromTo(this.buttons.right,1,{scale:1},{scale:1.5},1).progress(.5);const c=t=>{i(t)&&(this.blockMoves.emit(!0),null==r||r.kill())},s=(t,e)=>{if(i(e)){const e=w((t+a)/(2*a),0,1);o.progress(e),this.setSwipingColor(this.getSwipedState(e).swipedDirection)}},p=e=>{if(i(e)){const e=this.getSwipedState(o.progress());e.isCardThrowable?this.swipeCard(e.swipedDirection):r.to(t,this.animationDelay,{left:0,top:0}).to([this.buttons.left,this.buttons.right],{scale:1,ease:h.easeInOut},0)}else b(t,this.animationDelay,{left:0,top:0})};return new n(t,{bound:this.outerContainerElement,type:"left, top",cursor:"grab",zIndexBoost:!1,onDragStart(){c(this.target)},onDrag(){s(this.x,this.target)},onDragEnd(){p(this.target)}})}))}clickToSwipe(t){this.buttons[t].disabled||(this.setSwipingColor(t),setTimeout((()=>this.swipeCard(t)),400))}async undoSwipe(){const t=this.swipeCards[this.swipeCards.reduce(((t,e,a)=>e.swipedDirection?a:t),0)];if(!this.buttons.undo.disabled&&(null==t?void 0:t.swipedDirection)){this.lockSwipeButtons();const e=this.getCardElement(null==t?void 0:t.id);e&&(e.style.removeProperty("top"),e.style.removeProperty("left"),e.removeAttribute("swiped"),null==t||delete t.swipedDirection,setTimeout((()=>{this.getUserAnswer()}),225))}}isMode(t){return this.mode===t}getSwipedCategoryValue(t){var e;return(null===(e=this.categories)||void 0===e?void 0:e.length)&&s(t===k.left?this.categories[0]:t===k.right?this.categories[1]:"")}renderCards(){return a("div",{class:"stacked-cards-container"},this.swipeCards.map(((t,e,r)=>{var o;const i=r.indexOf(this.currentCard)||0,n=-1!==i;return a("div",Object.assign({class:{"card-container":!0,current:e===i,second:n&&e===i+1,third:n&&e===i+2,revealing:this.revealCards},id:t.id,ref:t=>this.cardsElements[e]=t},Object.assign({type:this.mode},t.swipedDirection&&{direction:t.swipedDirection})),this.hasImage&&a("div",{class:"content-image",style:{backgroundImage:`url("${t.value._downloadURL}")`}}),this.hasText&&a("div",{class:"content-text"},s((null===(o=t.value)||void 0===o?void 0:o._filename)||t.value)),a("div",{class:"content-category"}))})))}renderInstructionCategory(t){const e=t===k.left,r=e?"danger-light":"light-orange",o=p(this.host)?r:"light-to-dark",i=p(this.host)?"large":"medium",n=this.categories&&s(e?this.categories[0]:this.categories[1]);return a("div",{class:`category ${t}`},a("yoo-tag",{noBackground:p(this.host),color:r,size:"large",icon:`big-arrow-${t}`,iconOnlyColor:o,iconOnlySize:i}),a("p",{class:`${r}`},n),a("span",{class:"stable"},l(`SWIPE${t.toUpperCase()}`)))}renderTopDescription(){return a("div",{class:"top-description"},a("h1",null,s(this.label)),a("span",{class:"stable"},l(this.description||"CARDSWIPEDEFAULTINSTRUCTIONS")))}renderInstructions(){const t=(this.isMode(z.textimage)?!this.hasEmptyValue(this.images)&&!this.hasEmptyValue(this.values):!this.hasEmptyValue(this.images)||!this.hasEmptyValue(this.values))&&this.hasTwoCategories&&!this.hasDuplicatesValues;return a("div",{class:"instructions-container"},this.renderTopDescription(),a("div",{class:"categories"},this.renderInstructionCategory(k.left),a("yoo-icon",{size:"extra-extra-large",name:"swipe-explanation",color:"stable-alt"}),this.renderInstructionCategory(k.right)),this.instructionsDocument&&a("div",{class:"document"},a("div",{class:"document-title"},l("ATTACHMENTS")),a("yoo-form-document",{document:this.instructionsDocument,readonly:!0,onInputChanged:t=>t.stopPropagation()})),a("yoo-button",{disabled:!t,size:p(this.host)&&!this.livePreview?"medium":"large",color:"app-color",onClick:()=>{this.revealCards=!0,this.showInstructionView=!1,this.displayFooterElement()}},l("START")))}renderSwipeButtons(){return a("div",{class:"swipe-buttons"},[k.left,k.undo,k.right].map(((t,e)=>this.renderSwipeAction(t,e))))}renderSwipeAction(t,e){var r;const o=t===k.undo,i=t===k.left,n=!p(this.host)||this.livePreview,c=o?p(this.host)?"light":"stable-alt-to-text-color":i?"danger-light":"light-orange",l=o?"undo":`big-arrow-${t}`,d=i?0:1;return a("div",{class:"swipe-action"},a("yoo-button",{shape:"circular",rippleType:"unbounded",id:`swipe-${t}`,size:o&&!n?"medium":"large",fill:n||o?"solid":"transparent",color:o?n?"stable-light":"text-color":c.concat("-20"),ref:t=>this.swipeButtons[e]=t,onClick:()=>o?this.undoSwipe():this.clickToSwipe(t)},a("yoo-icon",{name:l,color:c,size:n?"medium":o?"small":"large"})),!o&&(null===(r=this.categories)||void 0===r?void 0:r.length)&&a("span",{class:c},s(this.categories[d])))}renderGame(){return a("div",{class:"game-container"},p(this.host)&&!this.livePreview&&this.renderTopDescription(),a("div",{class:"swipecards-container"},a("div",{class:"background",ref:t=>this.backgroundElement=t},this.renderCards()),this.renderSwipeButtons()))}renderSummary(){const t=t=>{var e,a;return(null===(e=this.value)||void 0===e?void 0:e.length)&&(null===(a=this.answer)||void 0===a?void 0:a.length)?s(t):""},e=t=>{var e;return(null===(e=this.images.find((e=>e[this.isMode(z.image)?"_downloadURL":"_filename"].includes(t))))||void 0===e?void 0:e._downloadURL)||""},r=(t,e)=>this.answer[t].find((t=>e.includes(t)))?"valid":"invalid";return this.categories.map(((o,i)=>[a("div",{class:"category-title"},t(o)),a("ul",null,Array.from(new Set(this.value[i])).map((t=>{var o;return a("li",{class:r(i,t)},!!(null===(o=this.images)||void 0===o?void 0:o.length)&&a("yoo-img",{src:e(t)}),!this.isMode(z.image)&&a("yoo-truncate",null,s(t)))})))]))}renderAlertDuplicates(){return this.livePreview&&a("yoo-banner",{class:"danger"})}render(){var t;return a(r,Object.assign({},this.formHeight&&{style:{height:`${this.formHeight}px`}},{class:Object.assign(Object.assign({},f(this.host)),{"live-preview":this.livePreview,"swiper-no-swiping":!this.readonly})}),a("div",{class:"outer-container",ref:t=>this.outerContainerElement=t},this.renderAlertDuplicates(),this.readonly?(null===(t=this.answer)||void 0===t?void 0:t.length)&&this.renderSummary():[this.showInstructionView&&this.renderInstructions(),!this.showInstructionView&&this.renderGame()]))}get host(){return o(this)}static get watchers(){return{isVisible:["onIsVisibleChanged"],required:["onRequireChanged"],values:["onValuesChanged"],images:["onImagesChanged"],categories:["onCategoriesChanged"]}}};j.style=':root{--ease-in-back:cubic-bezier(0.36, 0, 0.66, -0.56);--ease-in-circ:cubic-bezier(0.55, 0, 1, 0.45);--ease-in-cubic:cubic-bezier(0.32, 0, 0.67, 0);--ease-in-expo:cubic-bezier(0.7, 0, 0.84, 0);--ease-in-quad:cubic-bezier(0.11, 0, 0.5, 0);--ease-in-quart:cubic-bezier(0.5, 0, 0.75, 0);--ease-in-quint:cubic-bezier(0.64, 0, 0.78, 0);--ease-in-sine:cubic-bezier(0.12, 0, 0.39, 0);--ease-out-back:cubic-bezier(0.34, 1.56, 0.64, 1);--ease-out-circ:cubic-bezier(0, 0.55, 0.45, 1);--ease-out-cubic:cubic-bezier(0.33, 1, 0.68, 1);--ease-out-expo:cubic-bezier(0.16, 1, 0.3, 1);--ease-out-quad:cubic-bezier(0.5, 1, 0.89, 1);--ease-out-quart:cubic-bezier(0.25, 1, 0.5, 1);--ease-out-quint:cubic-bezier(0.22, 1, 0.36, 1);--ease-out-sine:cubic-bezier(0.61, 1, 0.88, 1);--ease-in-out-back:cubic-bezier(0.68, -0.6, 0.32, 1.6);--ease-in-out-circ:cubic-bezier(0.85, 0, 0.15, 1);--ease-in-out-cubic:cubic-bezier(0.65, 0, 0.35, 1);--ease-in-out-expo:cubic-bezier(0.87, 0, 0.13, 1);--ease-in-out-quad:cubic-bezier(0.45, 0, 0.55, 1);--ease-in-out-quart:cubic-bezier(0.76, 0, 0.24, 1);--ease-in-out-quint:cubic-bezier(0.83, 0, 0.17, 1);--ease-in-out-sine:cubic-bezier(0.37, 0, 0.63, 1)}.tippy-box,.tippy-popper{white-space:pre-wrap}.tippy-box .tippy-tooltip,.tippy-popper .tippy-tooltip{padding:var(--spacing-02, 0.125rem)}.tippy-box{-webkit-box-shadow:var(--shadow-03, 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-03, 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.1))}.tippy-box .tippy-content.editable{padding:0}.tippy-box .tippy-content .flex{display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around}.tippy-box .tippy-content .hidden{display:none}.tippy-box .tippy-content .editable-content{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;color:var(--dark, #000000)}.tippy-box .tippy-content .editable-content .text-content{min-width:5rem;-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.tippy-box .tippy-content .editable-content .text-content>div{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.tippy-box .tippy-content .editable-content.readonly{padding:var(--spacing-08, 0.5rem)}.tippy-box .tippy-content .editable-content .maxchar-content{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-item-align:end;align-self:flex-end;height:var(--spacing-24, 1.5rem);padding-right:var(--spacing-08, 0.5rem)}.tippy-box .tippy-content .editable-content .action-content{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.tippy-box .tippy-content .editable-content .action-content yoo-button{padding:0 var(--spacing-08, 0.5rem)}.tippy-box .tippy-content .editable-content .action-content .edit-content{-ms-flex-align:center;align-items:center}.tippy-box .tippy-content .editable-content .action-content .edit-content yoo-icon{padding-left:var(--spacing-08, 0.5rem);cursor:pointer}.tippy-box .tippy-content .editable-content .edit-content>*{cursor:pointer}.tippy-box .tippy-content .request-access{padding:var(--spacing-08, 0.5rem)}.tippy-box .tippy-content .request-access .title{margin-bottom:var(--spacing-08, 0.5rem);font-weight:var(--font-weight-700, 700)}.tippy-box .tippy-content .request-access .sub-title{display:-ms-flexbox;display:flex;margin-bottom:var(--spacing-08, 0.5rem);font-weight:var(--font-weight-300, 300);font-size:var(--font-size-14, 0.875rem)}.tippy-box .tippy-content .request-access .sub-title yoo-avatar{margin:0 var(--spacing-04, 0.25rem)}.tippy-box .tippy-content .request-access yoo-button{max-width:8rem}.tippy-box[data-theme~=startameeting] .tippy-content{padding:0;border-radius:var(--border-radius-04, 0.25rem)}.tippy-box[data-theme~=large]{font-size:var(--font-size-16, 1rem)}.tippy-box[data-theme~=large] .tippy-content{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=large] .tippy-content .editable-content{padding:var(--spacing-04, 0.25rem)}.tippy-box[data-theme~=large] .tippy-content .editable-content .text-content{padding-right:var(--spacing-16, 1rem)}.tippy-box[data-theme~=large] .tippy-content .editable-content yoo-icon{margin:0 var(--spacing-04, 0.25rem)}.tippy-box[data-theme~=small]{font-size:var(--font-size-16, 1rem)}.tippy-box[data-theme~=small] .tippy-content{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=small] .tippy-content .editable-content{padding:var(--spacing-04, 0.25rem)}.tippy-box[data-theme~=small] .tippy-content .editable-content .text-content{padding-right:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=small] .tippy-content .editable-content yoo-icon{margin:0 var(--spacing-04, 0.25rem)}.tippy-box[data-theme~=accent]{background-color:var(--accent, #276ef1)}.tippy-box[data-theme~=accent] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=accent] .tippy-svg-arrow{fill:var(--accent, #276ef1)}.tippy-box[data-theme~=accent][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--accent, #276ef1)}.tippy-box[data-theme~=accent][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--accent, #276ef1)}.tippy-box[data-theme~=accent][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--accent, #276ef1)}.tippy-box[data-theme~=accent][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--accent, #276ef1)}.tippy-box[data-theme~=anthracite]{background-color:var(--anthracite, #1a1a1a)}.tippy-box[data-theme~=anthracite] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=anthracite] .tippy-svg-arrow{fill:var(--anthracite, #1a1a1a)}.tippy-box[data-theme~=anthracite][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--anthracite, #1a1a1a)}.tippy-box[data-theme~=anthracite][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--anthracite, #1a1a1a)}.tippy-box[data-theme~=anthracite][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--anthracite, #1a1a1a)}.tippy-box[data-theme~=anthracite][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--anthracite, #1a1a1a)}.tippy-box[data-theme~=app-color]{background-color:var(--app-color)}.tippy-box[data-theme~=app-color] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=app-color] .tippy-svg-arrow{fill:var(--app-color)}.tippy-box[data-theme~=app-color][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--app-color)}.tippy-box[data-theme~=app-color][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--app-color)}.tippy-box[data-theme~=app-color][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--app-color)}.tippy-box[data-theme~=app-color][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--app-color)}.tippy-box[data-theme~=danger]{background-color:var(--danger, #d44333)}.tippy-box[data-theme~=danger] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=danger] .tippy-svg-arrow{fill:var(--danger, #d44333)}.tippy-box[data-theme~=danger][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--danger, #d44333)}.tippy-box[data-theme~=danger][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--danger, #d44333)}.tippy-box[data-theme~=danger][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--danger, #d44333)}.tippy-box[data-theme~=danger][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--danger, #d44333)}.tippy-box[data-theme~=danger-light]{background-color:var(--danger-light, #f46885)}.tippy-box[data-theme~=danger-light] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=danger-light] .tippy-svg-arrow{fill:var(--danger-light, #f46885)}.tippy-box[data-theme~=danger-light][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--danger-light, #f46885)}.tippy-box[data-theme~=danger-light][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--danger-light, #f46885)}.tippy-box[data-theme~=danger-light][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--danger-light, #f46885)}.tippy-box[data-theme~=danger-light][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--danger-light, #f46885)}.tippy-box[data-theme~=dark]{background-color:var(--dark, #000000)}.tippy-box[data-theme~=dark] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=dark] .tippy-svg-arrow{fill:var(--dark, #000000)}.tippy-box[data-theme~=dark][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--dark, #000000)}.tippy-box[data-theme~=dark][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--dark, #000000)}.tippy-box[data-theme~=dark][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--dark, #000000)}.tippy-box[data-theme~=dark][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--dark, #000000)}.tippy-box[data-theme~=energized]{background-color:var(--energized, #fed05b)}.tippy-box[data-theme~=energized] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=energized] .tippy-svg-arrow{fill:var(--energized, #fed05b)}.tippy-box[data-theme~=energized][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--energized, #fed05b)}.tippy-box[data-theme~=energized][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--energized, #fed05b)}.tippy-box[data-theme~=energized][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--energized, #fed05b)}.tippy-box[data-theme~=energized][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--energized, #fed05b)}.tippy-box[data-theme~=info]{background-color:var(--info, #fc459e)}.tippy-box[data-theme~=info] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=info] .tippy-svg-arrow{fill:var(--info, #fc459e)}.tippy-box[data-theme~=info][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--info, #fc459e)}.tippy-box[data-theme~=info][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--info, #fc459e)}.tippy-box[data-theme~=info][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--info, #fc459e)}.tippy-box[data-theme~=info][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--info, #fc459e)}.tippy-box[data-theme~=light]{background-color:var(--light, #ffffff)}.tippy-box[data-theme~=light] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=light] .tippy-svg-arrow{fill:var(--light, #ffffff)}.tippy-box[data-theme~=light][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--light, #ffffff)}.tippy-box[data-theme~=light][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--light, #ffffff)}.tippy-box[data-theme~=light][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--light, #ffffff)}.tippy-box[data-theme~=light][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--light, #ffffff)}.tippy-box[data-theme~=light-orange]{background-color:var(--light-orange, #fcae49)}.tippy-box[data-theme~=light-orange] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=light-orange] .tippy-svg-arrow{fill:var(--light-orange, #fcae49)}.tippy-box[data-theme~=light-orange][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--light-orange, #fcae49)}.tippy-box[data-theme~=light-orange][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--light-orange, #fcae49)}.tippy-box[data-theme~=light-orange][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--light-orange, #fcae49)}.tippy-box[data-theme~=light-orange][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--light-orange, #fcae49)}.tippy-box[data-theme~=light-to-text-color]{background-color:var(--light-to-text-color, #ffffff)}.tippy-box[data-theme~=light-to-text-color] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=light-to-text-color] .tippy-svg-arrow{fill:var(--light-to-text-color, #ffffff)}.tippy-box[data-theme~=light-to-text-color][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--light-to-text-color, #ffffff)}.tippy-box[data-theme~=light-to-text-color][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--light-to-text-color, #ffffff)}.tippy-box[data-theme~=light-to-text-color][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--light-to-text-color, #ffffff)}.tippy-box[data-theme~=light-to-text-color][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--light-to-text-color, #ffffff)}.tippy-box[data-theme~=royal]{background-color:var(--royal, #7577ff)}.tippy-box[data-theme~=royal] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=royal] .tippy-svg-arrow{fill:var(--royal, #7577ff)}.tippy-box[data-theme~=royal][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--royal, #7577ff)}.tippy-box[data-theme~=royal][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--royal, #7577ff)}.tippy-box[data-theme~=royal][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--royal, #7577ff)}.tippy-box[data-theme~=royal][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--royal, #7577ff)}.tippy-box[data-theme~=stable]{background-color:var(--stable, #adadad)}.tippy-box[data-theme~=stable] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=stable] .tippy-svg-arrow{fill:var(--stable, #adadad)}.tippy-box[data-theme~=stable][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--stable, #adadad)}.tippy-box[data-theme~=stable][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--stable, #adadad)}.tippy-box[data-theme~=stable][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--stable, #adadad)}.tippy-box[data-theme~=stable][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--stable, #adadad)}.tippy-box[data-theme~=stable-alt]{background-color:var(--stable-alt, #d0d0d0)}.tippy-box[data-theme~=stable-alt] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=stable-alt] .tippy-svg-arrow{fill:var(--stable-alt, #d0d0d0)}.tippy-box[data-theme~=stable-alt][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--stable-alt, #d0d0d0)}.tippy-box[data-theme~=stable-alt][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--stable-alt, #d0d0d0)}.tippy-box[data-theme~=stable-alt][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--stable-alt, #d0d0d0)}.tippy-box[data-theme~=stable-alt][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--stable-alt, #d0d0d0)}.tippy-box[data-theme~=stable-light]{background-color:var(--stable-light, #f1f1f1)}.tippy-box[data-theme~=stable-light] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=stable-light] .tippy-svg-arrow{fill:var(--stable-light, #f1f1f1)}.tippy-box[data-theme~=stable-light][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--stable-light, #f1f1f1)}.tippy-box[data-theme~=stable-light][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--stable-light, #f1f1f1)}.tippy-box[data-theme~=stable-light][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--stable-light, #f1f1f1)}.tippy-box[data-theme~=stable-light][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--stable-light, #f1f1f1)}.tippy-box[data-theme~=stable-ultralight]{background-color:var(--stable-ultralight, #fafafa)}.tippy-box[data-theme~=stable-ultralight] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=stable-ultralight] .tippy-svg-arrow{fill:var(--stable-ultralight, #fafafa)}.tippy-box[data-theme~=stable-ultralight][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--stable-ultralight, #fafafa)}.tippy-box[data-theme~=stable-ultralight][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--stable-ultralight, #fafafa)}.tippy-box[data-theme~=stable-ultralight][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--stable-ultralight, #fafafa)}.tippy-box[data-theme~=stable-ultralight][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--stable-ultralight, #fafafa)}.tippy-box[data-theme~=success]{background-color:var(--success, #3aa76d)}.tippy-box[data-theme~=success] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=success] .tippy-svg-arrow{fill:var(--success, #3aa76d)}.tippy-box[data-theme~=success][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--success, #3aa76d)}.tippy-box[data-theme~=success][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--success, #3aa76d)}.tippy-box[data-theme~=success][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--success, #3aa76d)}.tippy-box[data-theme~=success][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--success, #3aa76d)}.tippy-box[data-theme~=text-color]{background-color:var(--text-color, #807f83)}.tippy-box[data-theme~=text-color] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=text-color] .tippy-svg-arrow{fill:var(--text-color, #807f83)}.tippy-box[data-theme~=text-color][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--text-color, #807f83)}.tippy-box[data-theme~=text-color][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--text-color, #807f83)}.tippy-box[data-theme~=text-color][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--text-color, #807f83)}.tippy-box[data-theme~=text-color][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--text-color, #807f83)}.tippy-box[data-theme~=warning]{background-color:var(--warning, #ff6402)}.tippy-box[data-theme~=warning] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=warning] .tippy-svg-arrow{fill:var(--warning, #ff6402)}.tippy-box[data-theme~=warning][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--warning, #ff6402)}.tippy-box[data-theme~=warning][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--warning, #ff6402)}.tippy-box[data-theme~=warning][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--warning, #ff6402)}.tippy-box[data-theme~=warning][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--warning, #ff6402)}.tippy-box[data-theme~=anthracite-to-text-color]{background-color:var(--anthracite-to-text-color, #1a1a1a)}.tippy-box[data-theme~=anthracite-to-text-color] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=anthracite-to-text-color] .tippy-svg-arrow{fill:var(--anthracite-to-text-color, #1a1a1a)}.tippy-box[data-theme~=anthracite-to-text-color][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--anthracite-to-text-color, #1a1a1a)}.tippy-box[data-theme~=anthracite-to-text-color][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--anthracite-to-text-color, #1a1a1a)}.tippy-box[data-theme~=anthracite-to-text-color][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--anthracite-to-text-color, #1a1a1a)}.tippy-box[data-theme~=anthracite-to-text-color][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--anthracite-to-text-color, #1a1a1a)}:root{--safe-area-inset-top:0;--safe-area-inset-right:0;--safe-area-inset-bottom:0;--safe-area-inset-left:0}@supports (top: constant(safe-area-inset-top)){:root{--safe-area-inset-top:constant(safe-area-inset-top);--safe-area-inset-right:constant(safe-area-inset-right);--safe-area-inset-bottom:constant(safe-area-inset-bottom);--safe-area-inset-left:constant(safe-area-inset-left)}}@supports (top: env(safe-area-inset-top)){:root{--safe-area-inset-top:env(safe-area-inset-top);--safe-area-inset-right:env(safe-area-inset-right);--safe-area-inset-bottom:env(safe-area-inset-bottom);--safe-area-inset-left:env(safe-area-inset-left)}}.fr-popup.fr-active{z-index:30004 !important;display:block !important;opacity:1 !important}.app-color{color:var(--app-color);fill:var(--app-color)}.success{color:var(--success, #3aa76d);fill:var(--success, #3aa76d)}.danger{color:var(--danger, #d44333);fill:var(--danger, #d44333)}.danger-light{color:var(--danger-light, #f46885);fill:var(--danger-light, #f46885)}.energized{color:var(--energized, #fed05b);fill:var(--energized, #fed05b)}.royal{color:var(--royal, #7577ff);fill:var(--royal, #7577ff)}.info{color:var(--info, #fc459e);fill:var(--info, #fc459e)}.dark{color:var(--dark, #000000);fill:var(--dark, #000000)}.dark-to-light{color:var(--dark-to-light, #000000);fill:var(--dark-to-light, #000000)}.text-color{color:var(--text-color, #807f83);fill:var(--text-color, #807f83)}.text-color-to-light-60{color:var(--text-color-to-light-60, #807f83);fill:var(--text-color-to-light-60, #807f83)}.light{color:var(--light, #ffffff);fill:var(--light, #ffffff)}.light-to-dark{color:var(--light-to-dark, #ffffff);fill:var(--light-to-dark, #ffffff)}.light-orange{color:var(--light-orange, #fcae49);fill:var(--light-orange, #fcae49)}.stable{color:var(--stable, #adadad);fill:var(--stable, #adadad)}.stable-light{color:var(--stable-light, #f1f1f1);fill:var(--stable-light, #f1f1f1)}.stable-alt{color:var(--stable-alt, #d0d0d0);fill:var(--stable-alt, #d0d0d0)}.warning{color:var(--warning, #ff6402);fill:var(--warning, #ff6402)}.accent{color:var(--accent, #276ef1);fill:var(--accent, #276ef1)}.text-color-to-stable{color:var(--text-color-to-stable, #807f83);fill:var(--text-color-to-stable, #807f83)}.stable-to-stable-20{color:var(--stable-to-stable-20, #adadad);fill:var(--stable-to-stable-20, #adadad)}.stable-to-light{color:var(--stable-to-light, #adadad);fill:var(--stable-to-light, #adadad)}.stable-alt-to-light-10{color:var(--stable-alt-to-light-10, #d0d0d0);fill:var(--stable-alt-to-light-10, #d0d0d0)}@-webkit-keyframes fade-out{from{opacity:1}to{opacity:0}}@keyframes fade-out{from{opacity:1}to{opacity:0}}.hidden{display:none !important}.flex{display:-ms-flexbox !important;display:flex !important}.block{display:block !important}:host{display:block;height:100%}:host .outer-container{height:100%}:host .outer-container yoo-banner{height:0}:host .outer-container .game-container,:host .outer-container .instructions-container{-webkit-transition:opacity 1s ease-in-out;transition:opacity 1s ease-in-out}:host .outer-container .instructions-container .top-description{padding:var(--spacing-08, 0.5rem) var(--spacing-16, 1rem);padding-bottom:var(--spacing-16, 1rem);background:var(--dark-to-light, #000000)}:host .outer-container .instructions-container .top-description h1{margin:0;color:var(--light-to-dark, #ffffff)}:host .outer-container .instructions-container .categories{display:inline-grid;grid-template-columns:1fr 0.5fr 1fr;width:100%;margin:var(--spacing-24, 1.5rem) 0;text-align:center}:host .outer-container .instructions-container .categories yoo-icon{margin:0 auto}:host .outer-container .instructions-container .categories .category{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:100%;padding:0;color:var(--stable, #adadad)}:host .outer-container .instructions-container .categories .category p{max-width:75%;margin:auto;padding:var(--spacing-16, 1rem) 0}:host .outer-container .instructions-container .categories .category yoo-tag{margin:0 auto}:host .outer-container .instructions-container yoo-button{padding:var(--spacing-16, 1rem)}:host .outer-container .instructions-container .document{background-color:var(--light-to-dark, #ffffff)}:host .outer-container .instructions-container .document .document-title{padding:0 var(--spacing-16, 1rem);font-size:var(--font-size-16, 1rem)}:host .outer-container .instructions-container .document yoo-form-document{--outer-container-padding:cssvar(spacing-16) cssvar(spacing-16);width:calc(100% - cssvar(spacing-16))}:host .outer-container .game-container{position:relative;height:100%}:host .outer-container .game-container .swipecards-container{height:100%;overflow:hidden}:host .outer-container .game-container .swipecards-container [direction].card-container{z-index:5;-webkit-transition:-webkit-transform 0.35s !important;transition:-webkit-transform 0.35s !important;transition:transform 0.35s !important;transition:transform 0.35s, -webkit-transform 0.35s !important;-webkit-transform:translate(0%, 9%) scale(1);transform:translate(0%, 9%) scale(1);opacity:1}:host .outer-container .game-container .swipecards-container [direction].card-container.current .content-category{color:var(--light, #ffffff);opacity:1 !important;-webkit-transition:opacity 0.35s linear;transition:opacity 0.35s linear}:host .outer-container .game-container .swipecards-container [direction].card-container.current.card-container+.card-container{-webkit-transform:translate(0%, 9%) scale(1);transform:translate(0%, 9%) scale(1);opacity:1}:host .outer-container .game-container .swipecards-container [direction].card-container.current.card-container+.card-container .content-image,:host .outer-container .game-container .swipecards-container [direction].card-container.current.card-container+.card-container .content-text{opacity:1 !important}:host .outer-container .game-container .swipecards-container [direction].card-container.current.card-container+.card-container+.card-container{-webkit-transform:translate(0%, 3.5%) scale(0.95);transform:translate(0%, 3.5%) scale(0.95);opacity:1}:host .outer-container .game-container .swipecards-container [direction].card-container.current.card-container+.card-container+.card-container+.card-container{-webkit-transform:translate(0%, -2%) scale(0.9);transform:translate(0%, -2%) scale(0.9);opacity:0.7}:host .outer-container .game-container .swipecards-container [direction=left].background,:host .outer-container .game-container .swipecards-container [direction=left].current>.content-category{background-color:var(--danger-light, #f46885) !important}:host .outer-container .game-container .swipecards-container [direction=left].current{-webkit-transform:translate(0%, 9%) scale(1) rotate(-3.5deg) !important;transform:translate(0%, 9%) scale(1) rotate(-3.5deg) !important}:host .outer-container .game-container .swipecards-container [direction=right].background,:host .outer-container .game-container .swipecards-container [direction=right].current>.content-category{background-color:var(--light-orange, #fcae49) !important}:host .outer-container .game-container .swipecards-container [direction=right].current{-webkit-transform:translate(0%, 9%) scale(1) rotate(3.5deg) !important;transform:translate(0%, 9%) scale(1) rotate(3.5deg) !important}:host .outer-container .game-container .swipecards-container .background{position:relative;width:100%;background-color:var(--dark-to-light, #000000);-webkit-transition:background-color 0.25s ease-in-out;transition:background-color 0.25s ease-in-out}:host .outer-container .game-container .swipecards-container .background:after{display:block;height:0;padding-top:85%;content:""}:host .outer-container .game-container .swipecards-container .stacked-cards-container{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:100%;width:65%;max-width:25rem;height:100%;margin-top:var(--spacing-16, 1rem)}:host .outer-container .game-container .swipecards-container .stacked-cards-container.rtl{top:50%;right:50%;-webkit-transform:translate(50%, -50%);transform:translate(50%, -50%)}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;max-width:16rem;height:100%;max-height:21.3333333333rem;margin:0 auto;overflow:hidden;color:var(--dark, #000000);font-size:var(--font-size-28, 1.75rem);text-align:center;background-color:var(--stable-light, #f1f1f1);border-radius:var(--border-radius-08, 0.5rem);-webkit-box-shadow:var(--shadow-05, -0.375rem -0.375rem 0.5rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-05, -0.375rem -0.375rem 0.5rem 0 rgba(0, 0, 0, 0.1));-webkit-transition:opacity 0.25s, background-color 0.25s, -webkit-transform 0.25s;transition:opacity 0.25s, background-color 0.25s, -webkit-transform 0.25s;transition:transform 0.25s, opacity 0.25s, background-color 0.25s;transition:transform 0.25s, opacity 0.25s, background-color 0.25s, -webkit-transform 0.25s;will-change:transform}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container:not([direction]){-webkit-transform:translate(0, -5%) scale(0.85);transform:translate(0, -5%) scale(0.85);opacity:0}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container.current{z-index:3}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container.current:not(.revealing){-webkit-transform:translate(0%, 9%) scale(1);transform:translate(0%, 9%) scale(1);opacity:1;-webkit-transition-delay:175ms;transition-delay:175ms}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container.current.revealing{-webkit-animation:"current" 0.25s ease-in-out;animation:"current" 0.25s ease-in-out;-webkit-animation-delay:150ms;animation-delay:150ms;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@-webkit-keyframes current{to{-webkit-transform:translate(0%, 9%) scale(1);transform:translate(0%, 9%) scale(1);opacity:1}}@keyframes current{to{-webkit-transform:translate(0%, 9%) scale(1);transform:translate(0%, 9%) scale(1);opacity:1}}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container.second{z-index:2}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container.second:not(.revealing){-webkit-transform:translate(0%, 3.5%) scale(0.95);transform:translate(0%, 3.5%) scale(0.95);opacity:1;-webkit-transition-delay:350ms;transition-delay:350ms}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container.second.revealing{-webkit-animation:"second" 0.25s ease-in-out;animation:"second" 0.25s ease-in-out;-webkit-animation-delay:300ms;animation-delay:300ms;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@-webkit-keyframes second{to{-webkit-transform:translate(0%, 3.5%) scale(0.95);transform:translate(0%, 3.5%) scale(0.95);opacity:1}}@keyframes second{to{-webkit-transform:translate(0%, 3.5%) scale(0.95);transform:translate(0%, 3.5%) scale(0.95);opacity:1}}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container.third{z-index:1}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container.third:not(.revealing){-webkit-transform:translate(0%, -2%) scale(0.9);transform:translate(0%, -2%) scale(0.9);opacity:0.7;-webkit-transition-delay:525ms;transition-delay:525ms}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container.third.revealing{-webkit-animation:"third" 0.25s ease-in-out;animation:"third" 0.25s ease-in-out;-webkit-animation-delay:450ms;animation-delay:450ms;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@-webkit-keyframes third{to{-webkit-transform:translate(0%, -2%) scale(0.9);transform:translate(0%, -2%) scale(0.9);opacity:0.7}}@keyframes third{to{-webkit-transform:translate(0%, -2%) scale(0.9);transform:translate(0%, -2%) scale(0.9);opacity:0.7}}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container:after{display:block;height:0;padding-top:133%;content:""}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container.current .content-image,:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container.current .content-text,:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container[direction] .content-image,:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container[direction] .content-text{opacity:1 !important}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container[swiped]{-webkit-animation:fade-out 1s ease-out;animation:fade-out 1s ease-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container[swiped=left]{-webkit-transform:translate(-100%, 15%) rotate(-15deg);transform:translate(-100%, 15%) rotate(-15deg)}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container[swiped=right]{-webkit-transform:translate(100%, 15%) rotate(15deg);transform:translate(100%, 15%) rotate(15deg)}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container .content-category,:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container .content-image,:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container .content-text{position:absolute;width:100%;height:100%;opacity:0}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container .content-category,:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container .content-text{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container .content-image{height:100%;background-repeat:no-repeat;background-position-x:center;background-size:100%;-webkit-transition:opacity 0.25s linear;transition:opacity 0.25s linear}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container[type=textimage] .content-image{top:0;bottom:3.5rem;height:calc(100% - 3.5rem)}:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container[type=textimage] .content-text,:host .outer-container .game-container .swipecards-container .stacked-cards-container .card-container[type=textimage] .content-category{bottom:0;height:3.5rem}:host .outer-container .game-container .swipecards-container .swipe-buttons{position:absolute;left:50%;z-index:1;display:inline-grid;grid-template-columns:1fr 1fr 1fr;width:100%;max-width:85%;line-height:2.5;-webkit-transform:translate(-50%, 80%);transform:translate(-50%, 80%)}:host .outer-container .game-container .swipecards-container .swipe-buttons .swipe-action{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:start;justify-content:flex-start;text-align:center}:host .outer-container .game-container .swipecards-container .swipe-buttons .swipe-action yoo-button{-webkit-transition:-webkit-transform 0.8s linear;transition:-webkit-transform 0.8s linear;transition:transform 0.8s linear;transition:transform 0.8s linear, -webkit-transform 0.8s linear}:host([readonly]){height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}:host([readonly]) .outer-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host([readonly]) .outer-container .category-title{margin-bottom:var(--spacing-08, 0.5rem)}:host([readonly]) .outer-container ul{display:grid;grid-gap:var(--spacing-16, 1rem);grid-template-columns:repeat(auto-fill, 6rem);margin:0;padding-left:0;list-style:none}:host([readonly]) .outer-container ul+.category-title{margin-top:var(--spacing-16, 1rem)}:host([readonly]) .outer-container ul li{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;height:8rem;overflow:hidden;border-style:solid;border-width:var(--border-width-01, 0.0625rem);border-radius:var(--border-radius-08, 0.5rem)}:host([readonly]) .outer-container ul li.invalid{border-color:var(--danger, #d44333)}:host([readonly]) .outer-container ul li.invalid yoo-img::before{position:absolute;width:100%;height:100%;background:var(--danger-20, rgba(212, 67, 51, 0.2));content:""}:host([readonly]) .outer-container ul li.invalid yoo-truncate{background:var(--danger, #d44333)}:host([readonly]) .outer-container ul li.valid{border-color:var(--success, #3aa76d)}:host([readonly]) .outer-container ul li.valid yoo-img::before{position:absolute;width:100%;height:100%;background:var(--success-20, rgba(58, 167, 109, 0.2));content:""}:host([readonly]) .outer-container ul li.valid yoo-truncate{background:var(--success, #3aa76d)}:host([readonly]) .outer-container ul li yoo-img{position:relative;-ms-flex-positive:1;flex-grow:1}:host([readonly]) .outer-container ul li yoo-truncate{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;color:var(--light, #ffffff);font-size:var(--font-size-14, 0.875rem)}:host([readonly]) .outer-container ul li yoo-truncate:only-child{--max-lines:4;height:100%;padding:0 var(--spacing-08, 0.5rem)}:host([readonly]) .outer-container ul li yoo-truncate:not(:only-child){--max-lines:1;height:2.125rem;padding:0 var(--spacing-04, 0.25rem)}:host(.web:not(.live-preview)) .instructions-container .top-description{background:unset}:host(.web:not(.live-preview)) .instructions-container yoo-button{position:absolute;right:0;bottom:0;z-index:1}:host(.web:not(.live-preview)) .instructions-container::after{position:absolute;bottom:0px;display:block;width:100%;height:4rem;background-color:var(--light-to-dark, #ffffff);border-top:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1);content:""}:host(.web:not(.live-preview)) .game-container .top-description{margin-bottom:var(--spacing-24, 1.5rem)}:host(.web:not(.live-preview)) .game-container .background{max-height:21rem}:host(.web:not(.live-preview)) .game-container .background .stacked-cards-container{top:20%;margin-top:unset;-webkit-transform:translate(-50%, 0);transform:translate(-50%, 0)}:host(.web:not(.live-preview)) .game-container .swipe-buttons{-ms-flex-align:start;align-items:start;max-width:unset;height:10rem;margin-top:1rem;margin-top:var(--spacing-08, 0.5rem);-webkit-transform:translate(-50%, 0);transform:translate(-50%, 0)}:host(.web:not(.live-preview)) .game-container .swipe-buttons .swipe-action:nth-child(2){-ms-flex-item-align:end;align-self:end}:host(.web:not(.live-preview)) .top-description{text-align:center}:host(.web:not(.live-preview)) .top-description h1{margin:var(--spacing-08, 0.5rem) 0;color:var(--dark-to-light, #000000)}';export{j as yoo_form_swipe_cards}

package/dist/design-system/p-f4dc9a99.entry.js

@@ -1 +0,0 @@
-import{r as t,c as a,h as e,H as o,a as r}from"./p-34197588.js";import{s as i,n as p,bx as n,b as l,t as d,$ as c,a0 as b,Y as s}from"./p-8c6ff567.js";import"./p-4d956bd4.js";const m=class{constructor(e){t(this,e),this.validityChanged=a(this,"validityChanged",7),this.animated=!0,this.validity=!1,this.imagesRevealed=0}onValuesChanged(){this.images=this.values}onValidityChanged(){this.validityChanged.emit(this.validity)}componentWillLoad(){this.images=this.values}updateValidity(){const t=this.imagesRevealed===this.values.length;this.validity!==t&&(this.validity=t)}imageClicked(t,a){i("yoo-form-image-collection",{detailedView:!0,selectedPair:t},"bg-dark-40 fullscreen",p("Enter","X",!0),p("Leave","X",!0),!0).then((()=>{this.images[a].revealed||(this.imagesRevealed+=1,this.images[a].revealed=!0,this.updateValidity())}))}renderImages(){var t;return e("div",{class:"image-grid"},null===(t=this.images)||void 0===t?void 0:t.map(((t,a)=>e("div",{class:"image-container",style:this.animated?{"--image-index":a.toString()}:{},onClick:()=>this.imageClicked(t,a)},e("div",{class:"image",style:{"background-image":`url(${t.image})`}}),t.revealed&&[e("yoo-icon",{name:"check",color:"app-color",size:"medium"}),e("div",{class:"overlay"})]))))}renderDetailedView(){var t,a;return[e("yoo-navbar",{class:"transparent"},e("yoo-icon",{slot:"start",name:"close",onClick:()=>n(null)})),e("div",{class:"main-container"},e("yoo-img",{src:null===(t=this.selectedPair)||void 0===t?void 0:t.image,contained:!0,type:"background"}),e("div",{class:"detail-description",innerHTML:c(b(s(null===(a=this.selectedPair)||void 0===a?void 0:a.description)),!0)}),e("div",{class:"button"},e("yoo-button",{onClick:()=>n(null),color:"app-color",size:l(this.host)?"medium":"large"},d("YOOBICDONE"))))]}render(){return e(o,{class:{web:l(this.host)&&!this.livePreview}},this.detailedView?this.renderDetailedView():this.renderImages())}get host(){return r(this)}static get watchers(){return{values:["onValuesChanged"],validity:["onValidityChanged"]}}};m.style=':root{--ease-in-back:cubic-bezier(0.36, 0, 0.66, -0.56);--ease-in-circ:cubic-bezier(0.55, 0, 1, 0.45);--ease-in-cubic:cubic-bezier(0.32, 0, 0.67, 0);--ease-in-expo:cubic-bezier(0.7, 0, 0.84, 0);--ease-in-quad:cubic-bezier(0.11, 0, 0.5, 0);--ease-in-quart:cubic-bezier(0.5, 0, 0.75, 0);--ease-in-quint:cubic-bezier(0.64, 0, 0.78, 0);--ease-in-sine:cubic-bezier(0.12, 0, 0.39, 0);--ease-out-back:cubic-bezier(0.34, 1.56, 0.64, 1);--ease-out-circ:cubic-bezier(0, 0.55, 0.45, 1);--ease-out-cubic:cubic-bezier(0.33, 1, 0.68, 1);--ease-out-expo:cubic-bezier(0.16, 1, 0.3, 1);--ease-out-quad:cubic-bezier(0.5, 1, 0.89, 1);--ease-out-quart:cubic-bezier(0.25, 1, 0.5, 1);--ease-out-quint:cubic-bezier(0.22, 1, 0.36, 1);--ease-out-sine:cubic-bezier(0.61, 1, 0.88, 1);--ease-in-out-back:cubic-bezier(0.68, -0.6, 0.32, 1.6);--ease-in-out-circ:cubic-bezier(0.85, 0, 0.15, 1);--ease-in-out-cubic:cubic-bezier(0.65, 0, 0.35, 1);--ease-in-out-expo:cubic-bezier(0.87, 0, 0.13, 1);--ease-in-out-quad:cubic-bezier(0.45, 0, 0.55, 1);--ease-in-out-quart:cubic-bezier(0.76, 0, 0.24, 1);--ease-in-out-quint:cubic-bezier(0.83, 0, 0.17, 1);--ease-in-out-sine:cubic-bezier(0.37, 0, 0.63, 1)}.tippy-box,.tippy-popper{white-space:pre-wrap}.tippy-box .tippy-tooltip,.tippy-popper .tippy-tooltip{padding:var(--spacing-02, 0.125rem)}.tippy-box{-webkit-box-shadow:var(--shadow-03, 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-03, 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.1))}.tippy-box .tippy-content.editable{padding:0}.tippy-box .tippy-content .flex{display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around}.tippy-box .tippy-content .hidden{display:none}.tippy-box .tippy-content .editable-content{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;color:var(--dark, #000000)}.tippy-box .tippy-content .editable-content .text-content{min-width:5rem;-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.tippy-box .tippy-content .editable-content .text-content>div{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.tippy-box .tippy-content .editable-content.readonly{padding:var(--spacing-08, 0.5rem)}.tippy-box .tippy-content .editable-content .maxchar-content{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-item-align:end;align-self:flex-end;height:var(--spacing-24, 1.5rem);padding-right:var(--spacing-08, 0.5rem)}.tippy-box .tippy-content .editable-content .action-content{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.tippy-box .tippy-content .editable-content .action-content yoo-button{padding:0 var(--spacing-08, 0.5rem)}.tippy-box .tippy-content .editable-content .action-content .edit-content{-ms-flex-align:center;align-items:center}.tippy-box .tippy-content .editable-content .action-content .edit-content yoo-icon{padding-left:var(--spacing-08, 0.5rem);cursor:pointer}.tippy-box .tippy-content .editable-content .edit-content>*{cursor:pointer}.tippy-box .tippy-content .request-access{padding:var(--spacing-08, 0.5rem)}.tippy-box .tippy-content .request-access .title{margin-bottom:var(--spacing-08, 0.5rem);font-weight:var(--font-weight-700, 700)}.tippy-box .tippy-content .request-access .sub-title{display:-ms-flexbox;display:flex;margin-bottom:var(--spacing-08, 0.5rem);font-weight:var(--font-weight-300, 300);font-size:var(--font-size-14, 0.875rem)}.tippy-box .tippy-content .request-access .sub-title yoo-avatar{margin:0 var(--spacing-04, 0.25rem)}.tippy-box .tippy-content .request-access yoo-button{max-width:8rem}.tippy-box[data-theme~=startameeting] .tippy-content{padding:0;border-radius:var(--border-radius-04, 0.25rem)}.tippy-box[data-theme~=large]{font-size:var(--font-size-16, 1rem)}.tippy-box[data-theme~=large] .tippy-content{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=large] .tippy-content .editable-content{padding:var(--spacing-04, 0.25rem)}.tippy-box[data-theme~=large] .tippy-content .editable-content .text-content{padding-right:var(--spacing-16, 1rem)}.tippy-box[data-theme~=large] .tippy-content .editable-content yoo-icon{margin:0 var(--spacing-04, 0.25rem)}.tippy-box[data-theme~=small]{font-size:var(--font-size-16, 1rem)}.tippy-box[data-theme~=small] .tippy-content{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=small] .tippy-content .editable-content{padding:var(--spacing-04, 0.25rem)}.tippy-box[data-theme~=small] .tippy-content .editable-content .text-content{padding-right:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=small] .tippy-content .editable-content yoo-icon{margin:0 var(--spacing-04, 0.25rem)}.tippy-box[data-theme~=accent]{background-color:var(--accent, #276ef1)}.tippy-box[data-theme~=accent] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=accent] .tippy-svg-arrow{fill:var(--accent, #276ef1)}.tippy-box[data-theme~=accent][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--accent, #276ef1)}.tippy-box[data-theme~=accent][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--accent, #276ef1)}.tippy-box[data-theme~=accent][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--accent, #276ef1)}.tippy-box[data-theme~=accent][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--accent, #276ef1)}.tippy-box[data-theme~=anthracite]{background-color:var(--anthracite, #1a1a1a)}.tippy-box[data-theme~=anthracite] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=anthracite] .tippy-svg-arrow{fill:var(--anthracite, #1a1a1a)}.tippy-box[data-theme~=anthracite][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--anthracite, #1a1a1a)}.tippy-box[data-theme~=anthracite][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--anthracite, #1a1a1a)}.tippy-box[data-theme~=anthracite][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--anthracite, #1a1a1a)}.tippy-box[data-theme~=anthracite][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--anthracite, #1a1a1a)}.tippy-box[data-theme~=app-color]{background-color:var(--app-color)}.tippy-box[data-theme~=app-color] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=app-color] .tippy-svg-arrow{fill:var(--app-color)}.tippy-box[data-theme~=app-color][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--app-color)}.tippy-box[data-theme~=app-color][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--app-color)}.tippy-box[data-theme~=app-color][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--app-color)}.tippy-box[data-theme~=app-color][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--app-color)}.tippy-box[data-theme~=danger]{background-color:var(--danger, #d44333)}.tippy-box[data-theme~=danger] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=danger] .tippy-svg-arrow{fill:var(--danger, #d44333)}.tippy-box[data-theme~=danger][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--danger, #d44333)}.tippy-box[data-theme~=danger][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--danger, #d44333)}.tippy-box[data-theme~=danger][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--danger, #d44333)}.tippy-box[data-theme~=danger][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--danger, #d44333)}.tippy-box[data-theme~=danger-light]{background-color:var(--danger-light, #f46885)}.tippy-box[data-theme~=danger-light] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=danger-light] .tippy-svg-arrow{fill:var(--danger-light, #f46885)}.tippy-box[data-theme~=danger-light][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--danger-light, #f46885)}.tippy-box[data-theme~=danger-light][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--danger-light, #f46885)}.tippy-box[data-theme~=danger-light][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--danger-light, #f46885)}.tippy-box[data-theme~=danger-light][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--danger-light, #f46885)}.tippy-box[data-theme~=dark]{background-color:var(--dark, #000000)}.tippy-box[data-theme~=dark] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=dark] .tippy-svg-arrow{fill:var(--dark, #000000)}.tippy-box[data-theme~=dark][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--dark, #000000)}.tippy-box[data-theme~=dark][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--dark, #000000)}.tippy-box[data-theme~=dark][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--dark, #000000)}.tippy-box[data-theme~=dark][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--dark, #000000)}.tippy-box[data-theme~=energized]{background-color:var(--energized, #fed05b)}.tippy-box[data-theme~=energized] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=energized] .tippy-svg-arrow{fill:var(--energized, #fed05b)}.tippy-box[data-theme~=energized][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--energized, #fed05b)}.tippy-box[data-theme~=energized][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--energized, #fed05b)}.tippy-box[data-theme~=energized][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--energized, #fed05b)}.tippy-box[data-theme~=energized][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--energized, #fed05b)}.tippy-box[data-theme~=info]{background-color:var(--info, #fc459e)}.tippy-box[data-theme~=info] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=info] .tippy-svg-arrow{fill:var(--info, #fc459e)}.tippy-box[data-theme~=info][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--info, #fc459e)}.tippy-box[data-theme~=info][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--info, #fc459e)}.tippy-box[data-theme~=info][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--info, #fc459e)}.tippy-box[data-theme~=info][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--info, #fc459e)}.tippy-box[data-theme~=light]{background-color:var(--light, #ffffff)}.tippy-box[data-theme~=light] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=light] .tippy-svg-arrow{fill:var(--light, #ffffff)}.tippy-box[data-theme~=light][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--light, #ffffff)}.tippy-box[data-theme~=light][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--light, #ffffff)}.tippy-box[data-theme~=light][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--light, #ffffff)}.tippy-box[data-theme~=light][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--light, #ffffff)}.tippy-box[data-theme~=light-orange]{background-color:var(--light-orange, #fcae49)}.tippy-box[data-theme~=light-orange] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=light-orange] .tippy-svg-arrow{fill:var(--light-orange, #fcae49)}.tippy-box[data-theme~=light-orange][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--light-orange, #fcae49)}.tippy-box[data-theme~=light-orange][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--light-orange, #fcae49)}.tippy-box[data-theme~=light-orange][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--light-orange, #fcae49)}.tippy-box[data-theme~=light-orange][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--light-orange, #fcae49)}.tippy-box[data-theme~=light-to-text-color]{background-color:var(--light-to-text-color, #ffffff)}.tippy-box[data-theme~=light-to-text-color] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=light-to-text-color] .tippy-svg-arrow{fill:var(--light-to-text-color, #ffffff)}.tippy-box[data-theme~=light-to-text-color][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--light-to-text-color, #ffffff)}.tippy-box[data-theme~=light-to-text-color][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--light-to-text-color, #ffffff)}.tippy-box[data-theme~=light-to-text-color][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--light-to-text-color, #ffffff)}.tippy-box[data-theme~=light-to-text-color][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--light-to-text-color, #ffffff)}.tippy-box[data-theme~=royal]{background-color:var(--royal, #7577ff)}.tippy-box[data-theme~=royal] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=royal] .tippy-svg-arrow{fill:var(--royal, #7577ff)}.tippy-box[data-theme~=royal][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--royal, #7577ff)}.tippy-box[data-theme~=royal][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--royal, #7577ff)}.tippy-box[data-theme~=royal][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--royal, #7577ff)}.tippy-box[data-theme~=royal][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--royal, #7577ff)}.tippy-box[data-theme~=stable]{background-color:var(--stable, #adadad)}.tippy-box[data-theme~=stable] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=stable] .tippy-svg-arrow{fill:var(--stable, #adadad)}.tippy-box[data-theme~=stable][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--stable, #adadad)}.tippy-box[data-theme~=stable][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--stable, #adadad)}.tippy-box[data-theme~=stable][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--stable, #adadad)}.tippy-box[data-theme~=stable][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--stable, #adadad)}.tippy-box[data-theme~=stable-alt]{background-color:var(--stable-alt, #d0d0d0)}.tippy-box[data-theme~=stable-alt] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=stable-alt] .tippy-svg-arrow{fill:var(--stable-alt, #d0d0d0)}.tippy-box[data-theme~=stable-alt][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--stable-alt, #d0d0d0)}.tippy-box[data-theme~=stable-alt][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--stable-alt, #d0d0d0)}.tippy-box[data-theme~=stable-alt][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--stable-alt, #d0d0d0)}.tippy-box[data-theme~=stable-alt][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--stable-alt, #d0d0d0)}.tippy-box[data-theme~=stable-light]{background-color:var(--stable-light, #f1f1f1)}.tippy-box[data-theme~=stable-light] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=stable-light] .tippy-svg-arrow{fill:var(--stable-light, #f1f1f1)}.tippy-box[data-theme~=stable-light][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--stable-light, #f1f1f1)}.tippy-box[data-theme~=stable-light][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--stable-light, #f1f1f1)}.tippy-box[data-theme~=stable-light][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--stable-light, #f1f1f1)}.tippy-box[data-theme~=stable-light][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--stable-light, #f1f1f1)}.tippy-box[data-theme~=stable-ultralight]{background-color:var(--stable-ultralight, #fafafa)}.tippy-box[data-theme~=stable-ultralight] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=stable-ultralight] .tippy-svg-arrow{fill:var(--stable-ultralight, #fafafa)}.tippy-box[data-theme~=stable-ultralight][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--stable-ultralight, #fafafa)}.tippy-box[data-theme~=stable-ultralight][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--stable-ultralight, #fafafa)}.tippy-box[data-theme~=stable-ultralight][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--stable-ultralight, #fafafa)}.tippy-box[data-theme~=stable-ultralight][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--stable-ultralight, #fafafa)}.tippy-box[data-theme~=success]{background-color:var(--success, #3aa76d)}.tippy-box[data-theme~=success] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=success] .tippy-svg-arrow{fill:var(--success, #3aa76d)}.tippy-box[data-theme~=success][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--success, #3aa76d)}.tippy-box[data-theme~=success][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--success, #3aa76d)}.tippy-box[data-theme~=success][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--success, #3aa76d)}.tippy-box[data-theme~=success][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--success, #3aa76d)}.tippy-box[data-theme~=text-color]{background-color:var(--text-color, #807f83)}.tippy-box[data-theme~=text-color] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=text-color] .tippy-svg-arrow{fill:var(--text-color, #807f83)}.tippy-box[data-theme~=text-color][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--text-color, #807f83)}.tippy-box[data-theme~=text-color][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--text-color, #807f83)}.tippy-box[data-theme~=text-color][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--text-color, #807f83)}.tippy-box[data-theme~=text-color][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--text-color, #807f83)}.tippy-box[data-theme~=warning]{background-color:var(--warning, #ff6402)}.tippy-box[data-theme~=warning] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=warning] .tippy-svg-arrow{fill:var(--warning, #ff6402)}.tippy-box[data-theme~=warning][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--warning, #ff6402)}.tippy-box[data-theme~=warning][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--warning, #ff6402)}.tippy-box[data-theme~=warning][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--warning, #ff6402)}.tippy-box[data-theme~=warning][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--warning, #ff6402)}.tippy-box[data-theme~=anthracite-to-text-color]{background-color:var(--anthracite-to-text-color, #1a1a1a)}.tippy-box[data-theme~=anthracite-to-text-color] .tippy-tooltip{padding:var(--spacing-08, 0.5rem)}.tippy-box[data-theme~=anthracite-to-text-color] .tippy-svg-arrow{fill:var(--anthracite-to-text-color, #1a1a1a)}.tippy-box[data-theme~=anthracite-to-text-color][data-placement^=top]>.tippy-arrow::before{border-top-color:var(--anthracite-to-text-color, #1a1a1a)}.tippy-box[data-theme~=anthracite-to-text-color][data-placement^=bottom]>.tippy-arrow::before{border-bottom-color:var(--anthracite-to-text-color, #1a1a1a)}.tippy-box[data-theme~=anthracite-to-text-color][data-placement^=left]>.tippy-arrow::before{border-left-color:var(--anthracite-to-text-color, #1a1a1a)}.tippy-box[data-theme~=anthracite-to-text-color][data-placement^=right]>.tippy-arrow::before{border-right-color:var(--anthracite-to-text-color, #1a1a1a)}:root{--safe-area-inset-top:0;--safe-area-inset-right:0;--safe-area-inset-bottom:0;--safe-area-inset-left:0}@supports (top: constant(safe-area-inset-top)){:root{--safe-area-inset-top:constant(safe-area-inset-top);--safe-area-inset-right:constant(safe-area-inset-right);--safe-area-inset-bottom:constant(safe-area-inset-bottom);--safe-area-inset-left:constant(safe-area-inset-left)}}@supports (top: env(safe-area-inset-top)){:root{--safe-area-inset-top:env(safe-area-inset-top);--safe-area-inset-right:env(safe-area-inset-right);--safe-area-inset-bottom:env(safe-area-inset-bottom);--safe-area-inset-left:env(safe-area-inset-left)}}.fr-popup.fr-active{z-index:30004 !important;display:block !important;opacity:1 !important}:host{width:100%}:host .image-grid{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));margin:0 auto;padding:var(--spacing-16, 1rem);-webkit-column-gap:var(--spacing-16, 1rem);-moz-column-gap:var(--spacing-16, 1rem);column-gap:var(--spacing-16, 1rem);row-gap:var(--spacing-16, 1rem)}:host .image-grid .image-container{position:relative;cursor:pointer}:host .image-grid .image-container .image{background-position:center;background-size:cover;border-radius:var(--border-radius-08, 0.5rem);-webkit-box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1))}:host .image-grid .image-container .image:before{display:block;width:0;height:0;padding-bottom:calc(450 / 600 * 100%);content:""}:host .image-grid .image-container yoo-icon{position:absolute;top:var(--spacing-08, 0.5rem);right:var(--spacing-08, 0.5rem);z-index:3;background:var(--light, #ffffff);border-radius:50%}:host .image-grid .image-container .overlay{position:absolute;top:0;z-index:2;width:100%;height:100%;background:var(--stable-60, rgba(173, 173, 173, 0.6));border-radius:var(--border-radius-08, 0.5rem)}:host .main-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin:var(--spacing-32, 2rem) var(--spacing-16, 1rem)}:host .main-container .detail-description{padding:var(--spacing-24, 1.5rem) var(--spacing-16, 1rem);color:var(--light, #ffffff);text-align:center}:host .main-container yoo-img:before{display:block;width:0;height:0;padding-bottom:calc(3 / 4 * 100%);content:""}:host(.web) .image-grid{grid-template-columns:repeat(3, minmax(0, 1fr));max-width:114.5rem}:host(.web) .main-container{width:40%;max-width:37.5rem;margin:var(--spacing-32, 2rem) auto}:host(.web) .main-container .detail-description{padding:var(--spacing-32, 2rem) 0}:host(.web) .main-container .button{margin:auto}:host([detailed-view]){background:transparent !important}:host(:not(.web)) .main-container{height:100%;overflow:auto}:host(:not(.web)) .button{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;height:100%}:host(:not(.web)) .button yoo-button{width:100%}:host([animated]) .image-container{--image-index:0;-webkit-transform:translateY(100vh);transform:translateY(100vh);-webkit-animation-name:slide-up;animation-name:slide-up;-webkit-animation-duration:0.4s;animation-duration:0.4s;-webkit-animation-timing-function:var(--ease-out-quad);animation-timing-function:var(--ease-out-quad);-webkit-animation-delay:calc(0.5s + var(--image-index) * 0.1s);animation-delay:calc(0.5s + var(--image-index) * 0.1s);-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@-webkit-keyframes slide-up{from{-webkit-transform:translateY(100vh);transform:translateY(100vh)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slide-up{from{-webkit-transform:translateY(100vh);transform:translateY(100vh)}to{-webkit-transform:translateY(0);transform:translateY(0)}}';export{m as yoo_form_image_collection}