@yoobic/yobi 8.5.15 → 8.5.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (21) hide show
  1. package/dist/cjs/yoo-card-list.cjs.entry.js +8 -2
  2. package/dist/cjs/yoo-entity.cjs.entry.js +10 -1
  3. package/dist/cjs/yoo-form-dynamic.cjs.entry.js +1 -1
  4. package/dist/cjs/yoo-form-table.cjs.entry.js +8 -2
  5. package/dist/collection/components/entities/card-list/default/card-list.css +7 -0
  6. package/dist/collection/components/entities/card-list/default/card-list.js +26 -1
  7. package/dist/collection/components/entities/entity/entity.js +10 -1
  8. package/dist/collection/components/form/form-dynamic/form-dynamic.js +1 -1
  9. package/dist/collection/components/form/form-table/form-table.js +8 -2
  10. package/dist/design-system/design-system.css +5 -0
  11. package/dist/design-system/yoo-card-list.entry.js +8 -2
  12. package/dist/design-system/yoo-entity.entry.js +11 -2
  13. package/dist/design-system/yoo-form-dynamic.entry.js +1 -1
  14. package/dist/design-system/yoo-form-table.entry.js +8 -2
  15. package/dist/esm/yoo-card-list.entry.js +8 -2
  16. package/dist/esm/yoo-entity.entry.js +11 -2
  17. package/dist/esm/yoo-form-dynamic.entry.js +1 -1
  18. package/dist/esm/yoo-form-table.entry.js +8 -2
  19. package/dist/types/components/entities/card-list/default/card-list.d.ts +3 -1
  20. package/dist/types/components.d.ts +1 -0
  21. package/package.json +1 -1
package/dist/cjs/yoo-card-list.cjs.entry.js CHANGED
@@ -11,13 +11,14 @@ const index$1 = require('./index-3ad228d9.js');
11
11
  require('./index-ec5dad3e.js');
12
12
  require('./_commonjsHelpers-94df2ea7.js');
13
13
 
14
- const cardListCss = "svg:not(:root){overflow:hidden}.bg-accent{background-color:var(--accent, #276ef1) !important}.accent{color:var(--accent, #276ef1);fill:var(--accent, #276ef1)}.bg-app-color{background-color:var(--app-color, #5a30f4) !important}.app-color{color:var(--app-color, #5a30f4);fill:var(--app-color, #5a30f4)}.bg-danger{background-color:var(--danger, #d44333) !important}.danger{color:var(--danger, #d44333);fill:var(--danger, #d44333)}.bg-dark{background-color:var(--dark, #000000) !important}.dark{color:var(--dark, #000000);fill:var(--dark, #000000)}.bg-energized{background-color:var(--energized, #ffc043) !important}.energized{color:var(--energized, #ffc043);fill:var(--energized, #ffc043)}.bg-info{background-color:var(--info, #d84c96) !important}.info{color:var(--info, #d84c96);fill:var(--info, #d84c96)}.bg-light{background-color:var(--light, #ffffff) !important}.light{color:var(--light, #ffffff);fill:var(--light, #ffffff)}.bg-stable{background-color:var(--stable, #adadad) !important}.stable{color:var(--stable, #adadad);fill:var(--stable, #adadad)}.bg-stable-alt{background-color:var(--stable-alt, #d0d0d0) !important}.stable-alt{color:var(--stable-alt, #d0d0d0);fill:var(--stable-alt, #d0d0d0)}.bg-stable-light{background-color:var(--stable-light, #f1f1f1) !important}.stable-light{color:var(--stable-light, #f1f1f1);fill:var(--stable-light, #f1f1f1)}.bg-stable-ultralight{background-color:var(--stable-ultralight, #fafafa) !important}.stable-ultralight{color:var(--stable-ultralight, #fafafa);fill:var(--stable-ultralight, #fafafa)}.bg-success{background-color:var(--success, #3aa76d) !important}.success{color:var(--success, #3aa76d);fill:var(--success, #3aa76d)}.bg-text-color{background-color:var(--text-color, #807f83) !important}.text-color{color:var(--text-color, #807f83);fill:var(--text-color, #807f83)}.bg-warning{background-color:var(--warning, #ed6e33) !important}.warning{color:var(--warning, #ed6e33);fill:var(--warning, #ed6e33)}.bg-wood{background-color:var(--wood, #99644c) !important}.wood{color:var(--wood, #99644c);fill:var(--wood, #99644c)}:host{display:block;height:100%;background:var(--card-list-background);cursor:pointer}:host yoo-tag.distance{--padding:0;margin-left:var(--spacing-08, 0.5rem)}:host .outer-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding-bottom:0.25rem;border-bottom:var(--border-bottom-outer-container);-webkit-transition:background-color 0.3s ease, padding 0.3s ease;transition:background-color 0.3s ease, padding 0.3s ease}:host .outer-container .content-container{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:var(--justify-content-content-container);justify-content:var(--justify-content-content-container);-ms-flex-pack:center;justify-content:center;width:100%;margin-right:var(--margin-content-container-right);margin-left:var(--margin-content-container-left);overflow:hidden}:host .outer-container .content-container.has-image{margin-left:0}:host .outer-container .content-container .heading-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:start;align-items:flex-start;-ms-flex-align:center;align-items:center;margin-bottom:var(--spacing-02, 0.125rem);font-size:var(--font-size-16, 1rem);line-height:1.5}:host .outer-container .content-container .heading-container .margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .content-container .heading-container yoo-avatars{margin-right:0.125rem}:host .outer-container .content-container .heading-container .card-heading{-ms-flex:1;flex:1;min-width:0;color:var(--dark, #000000)}:host .outer-container .content-container .heading-container .card-heading .heading-title{display:-webkit-box;max-height:calc((var(--font-size-16, 1rem) + 0.125rem) * 2);overflow:hidden;line-height:calc(var(--font-size-16, 1rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}:host .outer-container .content-container .heading-container .card-heading .heading-title span{display:block;overflow:hidden;text-overflow:ellipsis}:host .outer-container .content-container .heading-container .card-heading .heading-circle{display:inline-block;width:0.5rem;height:0.5rem;margin-right:0.2rem;border-radius:50%}:host .outer-container .content-container .heading-container .card-heading *{-webkit-margin-before:0;margin-block-start:0;-webkit-margin-after:0;margin-block-end:0}:host .outer-container .content-container .heading-container .card-heading .ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .subheading-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-bottom:var(--spacing-02, 0.125rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem)}:host .outer-container .content-container .subheading-container html,:host .outer-container .content-container .subheading-container body,:host .outer-container .content-container .subheading-container div:not([class^=fr-]),:host .outer-container .content-container .subheading-container span:not([class^=fr-]),:host .outer-container .content-container .subheading-container img:not([class^=fr-]),:host .outer-container .content-container .subheading-container applet,:host .outer-container .content-container .subheading-container object,:host .outer-container .content-container .subheading-container iframe,:host .outer-container .content-container .subheading-container h1,:host .outer-container .content-container .subheading-container h2,:host .outer-container .content-container .subheading-container h3,:host .outer-container .content-container .subheading-container h4,:host .outer-container .content-container .subheading-container h5,:host .outer-container .content-container .subheading-container h6,:host .outer-container .content-container .subheading-container p,:host .outer-container .content-container .subheading-container blockquote,:host .outer-container .content-container .subheading-container pre,:host .outer-container .content-container .subheading-container a,:host .outer-container .content-container .subheading-container abbr,:host .outer-container .content-container .subheading-container acronym,:host .outer-container .content-container .subheading-container address,:host .outer-container .content-container .subheading-container big,:host .outer-container .content-container .subheading-container cite,:host .outer-container .content-container .subheading-container code,:host .outer-container .content-container .subheading-container del,:host .outer-container .content-container .subheading-container dfn,:host .outer-container .content-container .subheading-container em,:host .outer-container .content-container .subheading-container font,:host .outer-container .content-container .subheading-container ins,:host .outer-container .content-container .subheading-container kbd,:host .outer-container .content-container .subheading-container q,:host .outer-container .content-container .subheading-container s,:host .outer-container .content-container .subheading-container samp,:host .outer-container .content-container .subheading-container small,:host .outer-container .content-container .subheading-container strike,:host .outer-container .content-container .subheading-container strong,:host .outer-container .content-container .subheading-container sub,:host .outer-container .content-container .subheading-container sup,:host .outer-container .content-container .subheading-container tt,:host .outer-container .content-container .subheading-container var,:host .outer-container .content-container .subheading-container dl,:host .outer-container .content-container .subheading-container dt,:host .outer-container .content-container .subheading-container dd,:host .outer-container .content-container .subheading-container ol,:host .outer-container .content-container .subheading-container ul,:host .outer-container .content-container .subheading-container li,:host .outer-container .content-container .subheading-container fieldset,:host .outer-container .content-container .subheading-container form,:host .outer-container .content-container .subheading-container label,:host .outer-container .content-container .subheading-container legend,:host .outer-container .content-container .subheading-container table,:host .outer-container .content-container .subheading-container caption,:host .outer-container .content-container .subheading-container tbody,:host .outer-container .content-container .subheading-container tfoot,:host .outer-container .content-container .subheading-container thead,:host .outer-container .content-container .subheading-container tr,:host .outer-container .content-container .subheading-container th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host .outer-container .content-container .subheading-container .text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .avatar-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end;margin-top:0.5rem;padding-right:0.3rem}:host .outer-container .content-container .avatar-container yoo-avatar{margin-right:0.75rem;margin-left:0.15rem}:host .outer-container .content-container .action-button-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end}:host .outer-container .content-container .slot-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between;color:var(--text-color, #807f83);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .slot-container .inner-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}:host(.firefox) .content-container{margin-bottom:0}:host(.web):not(.framed) .outer-container{padding-top:1rem;padding-bottom:1rem;background-color:transparent}:host(.web) .outer-container .card-list-image-container.large{min-width:3.875rem}:host(.web) .outer-container .card-list-image-container.medium{min-width:2.875rem}:host(.web) .outer-container .card-list-image-container.small{min-width:2.375rem}:host(.web) .outer-container .content-container .top-container .badges-container.show-more{position:relative;overflow:visible}:host(.web) .outer-container .content-container .top-container .badges-container.show-more .more-button{position:absolute;top:0;right:0;bottom:auto;left:auto;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;width:2rem;height:1.125rem;font-size:var(--font-size-18, 1.125rem)}:host(.web) .outer-container .content-container .top-container .badges-container.show-more .more-button yoo-icon{padding-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000)}:host(.locations) .outer-container .content-container .top-container .heading-container .date-card-text{padding-right:var(--spacing-16, 1rem)}:host(.locations.map) .outer-container{-ms-flex-align:center;align-items:center;background:var(--light, #ffffff)}:host(.collapsible) .outer-container,:host(.locations.no-kpi:not(.framed)) .outer-container{-ms-flex-align:start;align-items:flex-start;width:auto;border-bottom:none;border-radius:0.5rem}:host(.collapsible) .outer-container .content-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container{margin:0.5rem 0 0;border:none}:host(.collapsible) .outer-container .content-container .top-container .heading-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container .top-container .heading-container{-ms-flex-pack:justify;justify-content:space-between;padding-top:0 !important;padding-right:var(--spacing-08, 0.5rem)}:host(.collapsible) .outer-container .content-container .top-container .subheading-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container .top-container .subheading-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.collapsible) .outer-container .content-container{margin-top:0}:host(.locations.no-kpi.map) .outer-container{-ms-flex-align:start;align-items:flex-start;max-width:18.75rem}:host(.locations.no-kpi:not(.framed)) yoo-tag.distance{margin-right:0.75rem}:host(.web.framed) .outer-container .content-container .top-container .heading-container{font-size:var(--font-size-16, 1rem)}:host(.android) .outer-container .content-container .top-container .heading-container .heading-title{display:-webkit-box;max-height:calc((var(--font-size-18, 1.125rem) + 0.25rem) * 2);overflow:hidden;line-height:calc(var(--font-size-18, 1.125rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}:host{--margin-content-container-left:0;--margin-content-container-right:0;--padding-content-container:var(--spacing-04, 0.25rem) 0 var(--spacing-08, 0.5rem) 0;--border-bottom-outer-container:var(--border-width-01, 0.0625rem) solid var(--stable-alt-40, rgba(208, 208, 208, 0.4));--overflow-card-heading-text:hidden;--text-overflow-card-heading-text:ellipsis;--white-space-card-heading-text:normal;--padding-right-card-heading:unset;--max-height-heading:48px;--card-list-background:none;--justify-content-content-container:flex-start;--max-card-heading-height:26px;--height-lessons-outer-container:2.5rem;--heading-font-size:var(--font-size-14, 0.875rem)}:host yoo-truncate{--max-lines:2}:host .heart-icon{width:var(--icon-size-05, 4rem)}:host .heart-icon yoo-lottie{width:var(--icon-size-02, 1.5rem);height:var(--icon-size-05, 4rem);margin:auto}:host .heart-icon yoo-lottie yoo-icon{top:1.3rem}:host .outer-container{padding-top:var(--spacing-04, 0.25rem)}:host .outer-container.tapped{background-color:var(--stable-light, #f1f1f1);-webkit-transition:background-color 0.3s ease;transition:background-color 0.3s ease}:host .outer-container .video-container{width:100%;max-height:350px;padding-top:var(--spacing-08, 0.5rem)}:host .outer-container .rank-container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;min-width:1.5rem;color:var(--stable, #adadad);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .heading-container yoo-tag.margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .content-container .heading-container .progress-box{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;color:var(--dark, #000000)}:host .outer-container .content-container .heading-container .progress-box .icon-text{font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .tags-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;padding-bottom:var(--spacing-04, 0.25rem);overflow:hidden;line-height:15px}:host .outer-container .content-container .tags-container yoo-tag,:host .outer-container .content-container .tags-container .card-icon{margin:var(--spacing-04, 0.25rem) var(--spacing-08, 0.5rem) var(--spacing-02, 0.125rem) var(--spacing-02, 0.125rem)}:host .outer-container .content-container .tags-container .hashtag{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:0.4375rem;color:var(--text-color, #807f83);font-size:var(--font-size-12, 0.75rem);-webkit-transform:translateY(0.125rem);transform:translateY(0.125rem)}:host .outer-container .content-container .tags-container .card-icon{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}:host .outer-container .content-container .tags-container .card-icon yoo-icon{margin-right:0.4375rem}:host .outer-container .content-container .tags-container .row-action{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;line-height:1rem}:host .outer-container .content-container .top-container .video-container{display:-ms-inline-flexbox;display:inline-flex;height:230px}:host .outer-container .content-container .top-container .heading-container .date-card-text{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-left:auto;padding:0 var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem);text-align:right}:host .outer-container .content-container .top-container .heading-container .points-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding-right:var(--spacing-08, 0.5rem);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .top-container .heading-container .points-container .points{padding:0 0.35rem}:host .outer-container .content-container .top-container .flex{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .outer-container.active{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host .outer-container .image-video-preview{width:12.5rem;height:6.25rem;padding:var(--spacing-08, 0.5rem);pointer-events:none}:host .outer-container .image-video-preview yoo-img{--border-radius:var(--border-radius-08, 0.5rem);height:100%}:host(.mobile.rtl) .outer-container .content-container{margin-right:var(--margin-content-container-left);margin-left:var(--margin-content-container-right)}:host(.mobile.rtl) .outer-container .content-container.has-image{margin-right:0}:host(.mobile.rtl) .outer-container .content-container .tags-container yoo-tag,:host(.mobile.rtl) .outer-container .content-container .tags-container .card-icon{margin:var(--spacing-04, 0.25rem) var(--spacing-02, 0.125rem) var(--spacing-02, 0.125rem) var(--spacing-08, 0.5rem)}:host(.mobile.rtl) .outer-container .content-container .top-container .subheading-container{margin-right:0;margin-left:var(--spacing-32, 2rem)}:host(.current) .outer-container .rank-container{color:var(--app-color, #5a30f4)}:host(.current) .outer-container .content-container .leaderboard .heading-container .card-heading{color:var(--app-color, #5a30f4)}:host(.current.leaderboard){background-color:var(--app-color, #5a30f4) !important}:host(.current.leaderboard) .outer-container .rank-container{color:var(--light, #ffffff)}:host(.current.leaderboard) .outer-container .content-container .leaderboard .heading-container .card-heading{color:var(--light, #ffffff)}:host(.current.leaderboard) .outer-container .points-container{color:var(--light, #ffffff)}:host(.leaderboard.userranks){height:var(--spacing-40, 2.5rem)}:host(.leaderboard.userranks) .outer-container{height:100%;padding:0 !important}:host(.leaderboard.userranks) .icon-container{color:var(--app-color, #5a30f4) !important}:host(.leaderboard){padding-left:var(--spacing-16, 1rem);color:var(--dark, #000000);background-color:var(--light, #ffffff);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));opacity:1}:host(.secondary-view){--border-bottom-outer-container:0px;background:transparent}:host(.secondary-view) .outer-container{padding-top:var(--spacing-08, 0.5rem)}:host(.secondary-view) .outer-container .question-content{border-bottom:var(--border-bottom-outer-container)}:host(.secondary-view) .outer-container .content-container .heading-container{font-size:var(--font-size-16, 1rem)}:host(.secondary-view) .outer-container .content-container .heading-container .date-card-text{display:block;padding:0;line-height:normal;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.secondary-view) .outer-container .content-container .translate-container{position:relative;margin-bottom:var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-weight:normal;font-size:var(--font-size-16, 1rem);font-style:normal;font-stretch:normal;line-height:1;letter-spacing:normal}:host(.secondary-view) .outer-container .content-container .translate-container.active{margin-left:var(--spacing-04, 0.25rem);padding-left:var(--spacing-08, 0.5rem);border-left:var(--border-width-02, 0.125rem) solid var(--stable-alt, #d0d0d0)}:host(.secondary-view) .outer-container .content-container .translate-container .text{margin-bottom:var(--spacing-04, 0.25rem);color:var(--dark, #000000)}:host(.secondary-view) .outer-container .content-container .translate-container .text html,:host(.secondary-view) .outer-container .content-container .translate-container .text body,:host(.secondary-view) .outer-container .content-container .translate-container .text div:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text span:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text img:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text applet,:host(.secondary-view) .outer-container .content-container .translate-container .text object,:host(.secondary-view) .outer-container .content-container .translate-container .text iframe,:host(.secondary-view) .outer-container .content-container .translate-container .text h1,:host(.secondary-view) .outer-container .content-container .translate-container .text h2,:host(.secondary-view) .outer-container .content-container .translate-container .text h3,:host(.secondary-view) .outer-container .content-container .translate-container .text h4,:host(.secondary-view) .outer-container .content-container .translate-container .text h5,:host(.secondary-view) .outer-container .content-container .translate-container .text h6,:host(.secondary-view) .outer-container .content-container .translate-container .text p,:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote,:host(.secondary-view) .outer-container .content-container .translate-container .text pre,:host(.secondary-view) .outer-container .content-container .translate-container .text a,:host(.secondary-view) .outer-container .content-container .translate-container .text abbr,:host(.secondary-view) .outer-container .content-container .translate-container .text acronym,:host(.secondary-view) .outer-container .content-container .translate-container .text address,:host(.secondary-view) .outer-container .content-container .translate-container .text big,:host(.secondary-view) .outer-container .content-container .translate-container .text cite,:host(.secondary-view) .outer-container .content-container .translate-container .text code,:host(.secondary-view) .outer-container .content-container .translate-container .text del,:host(.secondary-view) .outer-container .content-container .translate-container .text dfn,:host(.secondary-view) .outer-container .content-container .translate-container .text em,:host(.secondary-view) .outer-container .content-container .translate-container .text font,:host(.secondary-view) .outer-container .content-container .translate-container .text ins,:host(.secondary-view) .outer-container .content-container .translate-container .text kbd,:host(.secondary-view) .outer-container .content-container .translate-container .text q,:host(.secondary-view) .outer-container .content-container .translate-container .text s,:host(.secondary-view) .outer-container .content-container .translate-container .text samp,:host(.secondary-view) .outer-container .content-container .translate-container .text small,:host(.secondary-view) .outer-container .content-container .translate-container .text strike,:host(.secondary-view) .outer-container .content-container .translate-container .text strong,:host(.secondary-view) .outer-container .content-container .translate-container .text sub,:host(.secondary-view) .outer-container .content-container .translate-container .text sup,:host(.secondary-view) .outer-container .content-container .translate-container .text tt,:host(.secondary-view) .outer-container .content-container .translate-container .text var,:host(.secondary-view) .outer-container .content-container .translate-container .text dl,:host(.secondary-view) .outer-container .content-container .translate-container .text dt,:host(.secondary-view) .outer-container .content-container .translate-container .text dd,:host(.secondary-view) .outer-container .content-container .translate-container .text ol,:host(.secondary-view) .outer-container .content-container .translate-container .text ul,:host(.secondary-view) .outer-container .content-container .translate-container .text li,:host(.secondary-view) .outer-container .content-container .translate-container .text fieldset,:host(.secondary-view) .outer-container .content-container .translate-container .text form,:host(.secondary-view) .outer-container .content-container .translate-container .text label,:host(.secondary-view) .outer-container .content-container .translate-container .text legend,:host(.secondary-view) .outer-container .content-container .translate-container .text table,:host(.secondary-view) .outer-container .content-container .translate-container .text caption,:host(.secondary-view) .outer-container .content-container .translate-container .text tbody,:host(.secondary-view) .outer-container .content-container .translate-container .text tfoot,:host(.secondary-view) .outer-container .content-container .translate-container .text thead,:host(.secondary-view) .outer-container .content-container .translate-container .text tr,:host(.secondary-view) .outer-container .content-container .translate-container .text th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote{padding-left:1rem;border-left:var(--border-width-04, 0.25rem) solid var(--stable, #adadad)}:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote:last-of-type blockquote p:last-of-type,:host(.secondary-view) .outer-container .content-container .translate-container .text p:last-of-type{padding-top:0;padding-bottom:0}:host(.secondary-view) .outer-container .content-container .translate-container .text ol,:host(.secondary-view) .outer-container .content-container .translate-container .text ul{margin:revert;padding:revert}:host(.secondary-view) .outer-container .content-container .translate-container .text h1{display:block;margin-top:0.67em;margin-right:0;margin-bottom:0.67em;margin-left:0;font-weight:bold;font-size:2em}:host(.secondary-view) .outer-container .content-container .translate-container .text h2{display:block;margin-top:0.83em;margin-right:0;margin-bottom:0.83em;margin-left:0;font-weight:bold;font-size:1.5em}:host(.secondary-view) .outer-container .content-container .translate-container .text h3{display:block;margin-top:1em;margin-right:0;margin-bottom:1em;margin-left:0;font-weight:bold;font-size:1.17em}:host(.secondary-view) .outer-container .content-container .translate-container .text h4{display:block;margin-top:1.33em;margin-right:0;margin-bottom:1.33em;margin-left:0;font-weight:bold}:host(.secondary-view) .outer-container .content-container .translate-container .text h5{display:block;margin-top:1.67em;margin-right:0;margin-bottom:1.67em;margin-left:0;font-weight:bold;font-size:0.83em}:host(.secondary-view) .outer-container .content-container .translate-container .text h6{display:block;margin-top:2.33em;margin-right:0;margin-bottom:2.33em;margin-left:0;font-weight:bold;font-size:0.67em}:host(.secondary-view) .outer-container .content-container .translate-container .text strong{font-weight:bold}:host(.secondary-view) .outer-container .content-container .translate-container .text em{font-style:italic}:host(.secondary-view) .outer-container .content-container .subheading-container{display:block;max-height:initial;overflow:visible;color:var(--dark, #000000);font-size:var(--font-size-16, 1rem);line-height:20px;white-space:pre-wrap;word-wrap:break-word}:host(.secondary-view) .outer-container .content-container .subheading-container html,:host(.secondary-view) .outer-container .content-container .subheading-container body,:host(.secondary-view) .outer-container .content-container .subheading-container div:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container span:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container img:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container applet,:host(.secondary-view) .outer-container .content-container .subheading-container object,:host(.secondary-view) .outer-container .content-container .subheading-container iframe,:host(.secondary-view) .outer-container .content-container .subheading-container h1,:host(.secondary-view) .outer-container .content-container .subheading-container h2,:host(.secondary-view) .outer-container .content-container .subheading-container h3,:host(.secondary-view) .outer-container .content-container .subheading-container h4,:host(.secondary-view) .outer-container .content-container .subheading-container h5,:host(.secondary-view) .outer-container .content-container .subheading-container h6,:host(.secondary-view) .outer-container .content-container .subheading-container p,:host(.secondary-view) .outer-container .content-container .subheading-container blockquote,:host(.secondary-view) .outer-container .content-container .subheading-container pre,:host(.secondary-view) .outer-container .content-container .subheading-container a,:host(.secondary-view) .outer-container .content-container .subheading-container abbr,:host(.secondary-view) .outer-container .content-container .subheading-container acronym,:host(.secondary-view) .outer-container .content-container .subheading-container address,:host(.secondary-view) .outer-container .content-container .subheading-container big,:host(.secondary-view) .outer-container .content-container .subheading-container cite,:host(.secondary-view) .outer-container .content-container .subheading-container code,:host(.secondary-view) .outer-container .content-container .subheading-container del,:host(.secondary-view) .outer-container .content-container .subheading-container dfn,:host(.secondary-view) .outer-container .content-container .subheading-container em,:host(.secondary-view) .outer-container .content-container .subheading-container font,:host(.secondary-view) .outer-container .content-container .subheading-container ins,:host(.secondary-view) .outer-container .content-container .subheading-container kbd,:host(.secondary-view) .outer-container .content-container .subheading-container q,:host(.secondary-view) .outer-container .content-container .subheading-container s,:host(.secondary-view) .outer-container .content-container .subheading-container samp,:host(.secondary-view) .outer-container .content-container .subheading-container small,:host(.secondary-view) .outer-container .content-container .subheading-container strike,:host(.secondary-view) .outer-container .content-container .subheading-container strong,:host(.secondary-view) .outer-container .content-container .subheading-container sub,:host(.secondary-view) .outer-container .content-container .subheading-container sup,:host(.secondary-view) .outer-container .content-container .subheading-container tt,:host(.secondary-view) .outer-container .content-container .subheading-container var,:host(.secondary-view) .outer-container .content-container .subheading-container dl,:host(.secondary-view) .outer-container .content-container .subheading-container dt,:host(.secondary-view) .outer-container .content-container .subheading-container dd,:host(.secondary-view) .outer-container .content-container .subheading-container ol,:host(.secondary-view) .outer-container .content-container .subheading-container ul,:host(.secondary-view) .outer-container .content-container .subheading-container li,:host(.secondary-view) .outer-container .content-container .subheading-container fieldset,:host(.secondary-view) .outer-container .content-container .subheading-container form,:host(.secondary-view) .outer-container .content-container .subheading-container label,:host(.secondary-view) .outer-container .content-container .subheading-container legend,:host(.secondary-view) .outer-container .content-container .subheading-container table,:host(.secondary-view) .outer-container .content-container .subheading-container caption,:host(.secondary-view) .outer-container .content-container .subheading-container tbody,:host(.secondary-view) .outer-container .content-container .subheading-container tfoot,:host(.secondary-view) .outer-container .content-container .subheading-container thead,:host(.secondary-view) .outer-container .content-container .subheading-container tr,:host(.secondary-view) .outer-container .content-container .subheading-container th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host(.secondary-view) .outer-container .content-container .subheading-container blockquote{padding-left:1rem;border-left:var(--border-width-04, 0.25rem) solid var(--stable, #adadad)}:host(.secondary-view) .outer-container .content-container .subheading-container blockquote:last-of-type blockquote p:last-of-type,:host(.secondary-view) .outer-container .content-container .subheading-container p:last-of-type{padding-top:0;padding-bottom:0}:host(.secondary-view) .outer-container .content-container .subheading-container ol,:host(.secondary-view) .outer-container .content-container .subheading-container ul{margin:revert;padding:revert}:host(.secondary-view) .outer-container .content-container .subheading-container h1{display:block;margin-top:0.67em;margin-right:0;margin-bottom:0.67em;margin-left:0;font-weight:bold;font-size:2em}:host(.secondary-view) .outer-container .content-container .subheading-container h2{display:block;margin-top:0.83em;margin-right:0;margin-bottom:0.83em;margin-left:0;font-weight:bold;font-size:1.5em}:host(.secondary-view) .outer-container .content-container .subheading-container h3{display:block;margin-top:1em;margin-right:0;margin-bottom:1em;margin-left:0;font-weight:bold;font-size:1.17em}:host(.secondary-view) .outer-container .content-container .subheading-container h4{display:block;margin-top:1.33em;margin-right:0;margin-bottom:1.33em;margin-left:0;font-weight:bold}:host(.secondary-view) .outer-container .content-container .subheading-container h5{display:block;margin-top:1.67em;margin-right:0;margin-bottom:1.67em;margin-left:0;font-weight:bold;font-size:0.83em}:host(.secondary-view) .outer-container .content-container .subheading-container h6{display:block;margin-top:2.33em;margin-right:0;margin-bottom:2.33em;margin-left:0;font-weight:bold;font-size:0.67em}:host(.secondary-view) .outer-container .content-container .subheading-container strong{font-weight:bold}:host(.secondary-view) .outer-container .content-container .subheading-container em{font-style:italic}:host(.secondary-view) .outer-container .content-container .subheading-container.comment-image{--border-radius:var(--border-radius-16, 1rem);margin-top:9px;overflow:hidden}:host(.secondary-view) .outer-container .content-container .subheading-container span.with-markdown{white-space:normal}:host(.secondary-view) .outer-container .content-container .subheading-container span.with-markdown img{width:100%;max-width:initial !important}:host(.secondary-view) .outer-container .content-container .top-container{padding:var(--spacing-08, 0.5rem);background:var(--stable-light-60, rgba(241, 241, 241, 0.6));border-radius:var(--border-radius-04, 0.25rem)}:host(.secondary-view) .outer-container .content-container .top-container .card-heading{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;width:100%;padding-right:var(--spacing-08, 0.5rem)}:host(.secondary-view) .outer-container .content-container .top-container .card-heading .card-heading-text{font-weight:var(--font-weight-700, 700)}:host(.secondary-view) .outer-container .content-container .top-container .heading-container .heading-title{display:block}:host(.secondary-view) .outer-container .content-container .top-container .heading-container .heading-title span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.secondary-view) .outer-container .content-container .top-container span{display:block;font-size:var(--font-size-16, 1rem)}:host(.secondary-view) .outer-container .content-container .slot-container yoo-img{margin-right:auto}:host(.secondary-view) .tags-container{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center;margin-top:-0.85rem;margin-left:1.875rem;font-size:var(--font-size-14, 0.875rem)}:host(.secondary-view) .tags-container .card-icon.right{margin-left:auto}:host(.secondary-view) .tags-container .card-icon.right yoo-icon{margin:0}:host(.secondary-view) .tags-container .row-action{width:100%;margin-top:-0.875rem;margin-left:1.25rem}:host(.secondary-view) .tags-container .row-action span{color:var(--dark, #000000)}:host(.secondary-view) .tags-container .bottom-action{margin-right:1.25rem;color:var(--text-color, #807f83)}:host(.questionsAnswers) .tags-container{margin-left:2.8125rem}:host(.questionsAnswers) .tags-container .card-icon:not(.heart-icon){margin:var(--spacing-16, 1rem) var(--spacing-16, 1rem) 0 0}:host(.questionsAnswers) .tags-container .row-action{margin-top:var(--spacing-08, 0.5rem);margin-left:0}:host(.entitycomments) .tags-container,:host(.feedsComments) .tags-container{margin-left:1.75rem}:host(.userranks) .outer-container,:host(.userhighscores) .outer-container{-ms-flex-align:center;align-items:center;padding:var(--spacing-08, 0.5rem) 0 !important;background-color:transparent;border-bottom:0}:host(.userranks) .heading-container,:host(.userhighscores) .heading-container{word-wrap:break-word}:host(.active) .outer-container{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host(.hoverable):hover .outer-container{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host(.filesFolders) .outer-container .content-container .subheading-container,:host(.files) .outer-container .content-container .subheading-container{margin:0;font-size:var(--font-size-12, 0.75rem)}:host(.filesFolders) .outer-container .content-container .subheading-container em,:host(.files) .outer-container .content-container .subheading-container em{color:var(--dark, #000000);font-weight:bold;background:#FDFB2F}:host(.locations.external) .outer-container .content-container .subheading-container{white-space:normal}:host(.products) .outer-container .content-container{border-bottom:none}:host(.outofstock),:host(.hidden){opacity:0.5}:host(.productweightpair) .outer-container .content-container .heading-container .date-card-text{color:var(--dark, #000000)}:host(.catalog-display.history) .outer-container .content-container{text-align:left}:host(.catalog-display.history) .outer-container .content-container .top-container .price{font-size:var(--font-size-12, 0.75rem)}:host(.catalog-display.history) .outer-container .content-container .top-container .tags-container{padding-bottom:var(--spacing-04, 0.25rem)}:host(.catalog-display){width:100%}:host(.catalog-display) .outer-container{-ms-flex-align:start;align-items:flex-start;font-size:var(--font-size-14, 0.875rem);border:none !important}:host(.catalog-display) .outer-container .content-container{-ms-flex-pack:center;justify-content:center;margin-left:1rem;padding:0;border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host(.catalog-display) .outer-container .content-container .top-container .card-heading{font-size:var(--font-size-14, 0.875rem)}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container{min-height:1rem;max-height:0.8rem;color:var(--dark, #000000);font-size:var(--font-size-12, 0.75rem);line-height:1rem}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container .subheading-grey{color:var(--stable, #adadad)}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container .subheading-price{color:var(--dark, #000000)}:host(.catalog-display) .outer-container .content-container .top-container .price{color:var(--text-color, #807f83)}:host(.catalog-display) .outer-container .content-container .top-container .tags-container{overflow:initial;line-height:normal}:host(.catalog-display.no-border) .outer-container .content-container{border-bottom:none}:host(.productbatch.archived) .outer-container .content-container{opacity:0.5}:host(.offline:not(.missions)) .outer-container{opacity:0.7}:host(.offline:not(.missions))::before,:host(.offline:not(.missions))::after{position:absolute;top:0;right:0;border-color:transparent;border-style:solid;content:\"\"}:host(.offline:not(.missions))::after{border-width:0.5em;border-top-color:var(--energized, #ffc043);border-right-color:var(--energized, #ffc043)}:host(.notifications) .outer-container{padding-top:var(--spacing-04, 0.25rem)}:host(.notes) .outer-container .content-container .heading-container .card-heading .heading-title{display:-webkit-box;max-height:calc((var(--font-size-18, 1.125rem) + 0.125rem) * 1);overflow:hidden;line-height:calc(var(--font-size-18, 1.125rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:1;}:host(.no-text-break) .outer-container .content-container .top-container .heading-container .card-heading{white-space:normal}:host(.lessons.web) .outer-container{height:var(--height-lessons-outer-container);min-height:0;margin:var(--spacing-04, 0.25rem) 0;padding-left:var(--spacing-08, 0.5rem);border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:var(--card-shadow-2, 0 0.3125rem 0.9375rem 0 rgba(40, 47, 54, 0.08));box-shadow:var(--card-shadow-2, 0 0.3125rem 0.9375rem 0 rgba(40, 47, 54, 0.08))}:host(.lessons.web) .outer-container .content-container{border-bottom:none}:host(.lessons.web) .outer-container .content-container .top-container{display:-ms-flexbox;display:flex}:host(.lessons.web) .outer-container .content-container .heading-container{-ms-flex:1;flex:1;width:75%;padding-right:var(--spacing-08, 0.5rem);font-size:var(--heading-font-size)}:host(.lessons.web) .outer-container .content-container .heading-container .card-heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding-top:0}:host(.lessons.web.finished) .outer-container{background-color:var(--app-color, #5a30f4)}:host(.lessons.web.finished) .outer-container .card-heading,:host(.lessons.web.finished) .outer-container .icon-container{color:var(--light-10, rgba(255, 255, 255, 0.1))}:host(.lessons.web.locked) .outer-container{background-color:var(--stable-alt, #d0d0d0)}:host(.lessons.web.locked) .outer-container .card-heading{color:var(--text-color, #807f83)}:host(.lessons.web.locked) .outer-container .top-container yoo-avatar{margin:0 0.75rem}:host(.missions.finished:not(.grid-cell)) .outer-container{padding-bottom:var(--spacing-16, 1rem)}:host(.courseselection) .outer-container .content-container{-ms-flex-pack:center;justify-content:center;margin-left:0}:host(.courseselection) .outer-container .content-container .top-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host(.courseselection) .outer-container .content-container .top-container .heading-container{-ms-flex-order:2;order:2;font-size:var(--font-size-16, 1rem)}:host(.courseselection) .outer-container .content-container .top-container .subheading-container{-ms-flex-order:1;order:1;color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem)}:host(.courseselection) .outer-container .content-container .top-container .subheading-container .todo{font-size:var(--font-size-14, 0.875rem)}:host(.courseselection) .outer-container .content-container .top-container .tags-container{padding-bottom:0}:host(.questions) .outer-container{padding-bottom:0;border-bottom:0}:host(.questions) .outer-container .content-container .top-container .heading-container{max-height:1.25rem;margin-bottom:0}:host(.questions) .outer-container .content-container .top-container .heading-container .card-heading .heading-title{color:var(--dark, #000000);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:var(--spacing-04, 0.25rem)}:host(.questions) .question-container.no-img{padding-top:var(--spacing-04, 0.25rem)}:host(.questions) .question-container.no-img .question-content{height:auto}:host(.questions) .question-container .question-content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:98px;margin-left:var(--spacing-08, 0.5rem);padding-bottom:var(--spacing-16, 1rem);border-bottom:var(--border-bottom-outer-container)}:host(.questions) .question-container .question-content .question-title{margin-bottom:var(--spacing-08, 0.5rem);font-weight:var(--font-weight-700, 700);font-size:var(--font-size-18, 1.125rem);word-break:break-word}:host(.questions) .question-container .question-content .question-icons{display:-ms-flexbox;display:flex;color:var(--stable-alt, #d0d0d0);font-size:var(--icon-size-01, 1rem)}:host(.questions) .question-container .question-content .question-icons .inner-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000);font-size:var(--font-size-18, 1.125rem)}:host(.questions) .question-container .question-content .question-icons .inner-container yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host(.questions) .question-container .question-content .subheadings{display:-ms-flexbox;display:flex;color:var(--text-color, #807f83)}:host(.questions) .question-container .question-content .subheadings .subheading-container{padding-right:var(--spacing-08, 0.5rem);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .question-content .subheadings .date-card-text{margin-right:var(--spacing-08, 0.5rem);color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .question-content .tags-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;overflow:hidden}:host(.questions) .question-container .question-content .tags-container .hashtag{margin-right:0.4375rem;color:var(--app-color, #5a30f4);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .image-video-preview{min-width:7.5rem;height:98px;padding:var(--spacing-08, 0.5rem);pointer-events:none}:host(.questions) .question-container .image-video-preview yoo-img{--border-radius:var(--border-radius-08, 0.5rem)}:host(.questions) .question-container .image-video-preview yoo-videoplayer-core{overflow:hidden;border-radius:var(--border-radius-08, 0.5rem)}:host(.card-feed) .outer-container{display:none}:host(.card-feed) .question-container{-ms-flex-pack:initial !important;justify-content:initial !important;background:var(--light-10, rgba(255, 255, 255, 0.1));border-bottom:none !important;-webkit-box-shadow:var(--grid-frame-shadow, 0 0.3125rem 0.9375rem 0.1875rem rgba(40, 47, 54, 0.15));box-shadow:var(--grid-frame-shadow, 0 0.3125rem 0.9375rem 0.1875rem rgba(40, 47, 54, 0.15))}:host(.card-feed) .question-container .image-video-preview{-ms-flex-negative:0;flex-shrink:0;-ms-flex-order:1;order:1;width:130px;height:89px;padding-right:var(--spacing-16, 1rem)}:host(.card-feed) .question-container .image-video-preview yoo-videoplayer-core{overflow:hidden;border-radius:5px}:host(.card-feed) .question-container .question-content{-ms-flex-pack:initial !important;justify-content:initial !important;-ms-flex-order:2;order:2;margin-left:0;padding:var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) 0}:host(.selected-content) .question-container{padding:0}:host(.selected-content) .question-container .image-video-preview{min-width:2rem;height:1.5rem;padding-left:0}:host(.selected-content) .question-container .question-content{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;height:auto;margin:0;padding-bottom:0;border-bottom:none}:host(.selected-content) .question-container .question-content .question-title{margin:0;font-weight:var(--font-weight-400, 400);font-size:var(--font-size-16, 1rem)}:host(.selected-content) .outer-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.selected-content) .outer-container .content-container .heading-container{margin-bottom:var(--spacing-02, 0.125rem)}:host(.selected-content) .outer-container .content-container .heading-container .card-heading .heading-title span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.selected-content) .outer-container .content-container .uifield-container{display:none}:host(.web.grid-cell){overflow:hidden}:host(.web.grid-cell) .outer-container{padding-top:var(--spacing-08, 0.5rem);padding-bottom:var(--spacing-08, 0.5rem)}:host(.web.grid-cell) .outer-container .content-container .tags-container{-ms-flex-wrap:initial;flex-wrap:initial}:host(.mobile.autocomplete-selection-mode) .question-container .question-title{font-size:var(--font-size-16, 1rem)}:host(.mobile.autocomplete-selection-mode) .subheading-container{margin-right:var(--spacing-32, 2rem)}:host(.no-border-bottom.mobile) .outer-container{border-bottom:none}:host(.no-border-bottom.mobile) .question-container .question-content{border-bottom:none}:host(.item-disabled){cursor:default}:host(.kanban) .outer-container{padding-top:0;padding-bottom:0}:host(.web.videocallusers) .outer-container{padding-top:0;padding-bottom:0}:host(.web.firefox) .outer-container{height:auto}:host(.violetproducts) .outer-container,:host(.violetbasketitems) .outer-container{-ms-flex-align:center;align-items:center}:host(.violetproducts) .outer-container yoo-icon.arrow,:host(.violetbasketitems) .outer-container yoo-icon.arrow{margin-top:var(--spacing-04, 0.25rem);margin-right:var(--spacing-04, 0.25rem);margin-bottom:auto}:host(.violetproducts) .content-container,:host(.violetbasketitems) .content-container{border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host(.form-permission) .outer-container{height:auto}:host(.pages) .outer-container{-ms-flex-align:center;align-items:center}:host(.missions.feed) .outer-container{border-bottom:none !important}:host(.calendarEvents) .outer-container .content-container .heading-container{margin-bottom:unset}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container .dot-event,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container .dot-event{margin-right:var(--spacing-04, 0.25rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container .icon-event,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container .icon-event{margin-right:var(--spacing-08, 0.5rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .title{font-weight:bold;font-size:var(--font-size-16, 1rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .time{color:var(--app-color, #5a30f4)}:host(.course-info) .outer-container,:host(.learning-manager) .outer-container{padding-top:var(--spacing-16, 1rem)}";
14
+ const cardListCss = "svg:not(:root){overflow:hidden}.bg-accent{background-color:var(--accent, #276ef1) !important}.accent{color:var(--accent, #276ef1);fill:var(--accent, #276ef1)}.bg-app-color{background-color:var(--app-color, #5a30f4) !important}.app-color{color:var(--app-color, #5a30f4);fill:var(--app-color, #5a30f4)}.bg-danger{background-color:var(--danger, #d44333) !important}.danger{color:var(--danger, #d44333);fill:var(--danger, #d44333)}.bg-dark{background-color:var(--dark, #000000) !important}.dark{color:var(--dark, #000000);fill:var(--dark, #000000)}.bg-energized{background-color:var(--energized, #ffc043) !important}.energized{color:var(--energized, #ffc043);fill:var(--energized, #ffc043)}.bg-info{background-color:var(--info, #d84c96) !important}.info{color:var(--info, #d84c96);fill:var(--info, #d84c96)}.bg-light{background-color:var(--light, #ffffff) !important}.light{color:var(--light, #ffffff);fill:var(--light, #ffffff)}.bg-stable{background-color:var(--stable, #adadad) !important}.stable{color:var(--stable, #adadad);fill:var(--stable, #adadad)}.bg-stable-alt{background-color:var(--stable-alt, #d0d0d0) !important}.stable-alt{color:var(--stable-alt, #d0d0d0);fill:var(--stable-alt, #d0d0d0)}.bg-stable-light{background-color:var(--stable-light, #f1f1f1) !important}.stable-light{color:var(--stable-light, #f1f1f1);fill:var(--stable-light, #f1f1f1)}.bg-stable-ultralight{background-color:var(--stable-ultralight, #fafafa) !important}.stable-ultralight{color:var(--stable-ultralight, #fafafa);fill:var(--stable-ultralight, #fafafa)}.bg-success{background-color:var(--success, #3aa76d) !important}.success{color:var(--success, #3aa76d);fill:var(--success, #3aa76d)}.bg-text-color{background-color:var(--text-color, #807f83) !important}.text-color{color:var(--text-color, #807f83);fill:var(--text-color, #807f83)}.bg-warning{background-color:var(--warning, #ed6e33) !important}.warning{color:var(--warning, #ed6e33);fill:var(--warning, #ed6e33)}.bg-wood{background-color:var(--wood, #99644c) !important}.wood{color:var(--wood, #99644c);fill:var(--wood, #99644c)}:host{display:block;height:100%;background:var(--card-list-background);cursor:pointer}:host yoo-tag.distance{--padding:0;margin-left:var(--spacing-08, 0.5rem)}:host .outer-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding-bottom:0.25rem;border-bottom:var(--border-bottom-outer-container);-webkit-transition:background-color 0.3s ease, padding 0.3s ease;transition:background-color 0.3s ease, padding 0.3s ease}:host .outer-container .content-container{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:var(--justify-content-content-container);justify-content:var(--justify-content-content-container);-ms-flex-pack:center;justify-content:center;width:100%;margin-right:var(--margin-content-container-right);margin-left:var(--margin-content-container-left);overflow:hidden}:host .outer-container .content-container.has-image{margin-left:0}:host .outer-container .content-container .heading-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:start;align-items:flex-start;-ms-flex-align:center;align-items:center;margin-bottom:var(--spacing-02, 0.125rem);font-size:var(--font-size-16, 1rem);line-height:1.5}:host .outer-container .content-container .heading-container .margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .content-container .heading-container yoo-avatars{margin-right:0.125rem}:host .outer-container .content-container .heading-container .card-heading{-ms-flex:1;flex:1;min-width:0;color:var(--dark, #000000)}:host .outer-container .content-container .heading-container .card-heading .heading-title{display:-webkit-box;max-height:calc((var(--font-size-16, 1rem) + 0.125rem) * 2);overflow:hidden;line-height:calc(var(--font-size-16, 1rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}:host .outer-container .content-container .heading-container .card-heading .heading-title span{display:block;overflow:hidden;text-overflow:ellipsis}:host .outer-container .content-container .heading-container .card-heading .heading-circle{display:inline-block;width:0.5rem;height:0.5rem;margin-right:0.2rem;border-radius:50%}:host .outer-container .content-container .heading-container .card-heading *{-webkit-margin-before:0;margin-block-start:0;-webkit-margin-after:0;margin-block-end:0}:host .outer-container .content-container .heading-container .card-heading .ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .subheading-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-bottom:var(--spacing-02, 0.125rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem)}:host .outer-container .content-container .subheading-container html,:host .outer-container .content-container .subheading-container body,:host .outer-container .content-container .subheading-container div:not([class^=fr-]),:host .outer-container .content-container .subheading-container span:not([class^=fr-]),:host .outer-container .content-container .subheading-container img:not([class^=fr-]),:host .outer-container .content-container .subheading-container applet,:host .outer-container .content-container .subheading-container object,:host .outer-container .content-container .subheading-container iframe,:host .outer-container .content-container .subheading-container h1,:host .outer-container .content-container .subheading-container h2,:host .outer-container .content-container .subheading-container h3,:host .outer-container .content-container .subheading-container h4,:host .outer-container .content-container .subheading-container h5,:host .outer-container .content-container .subheading-container h6,:host .outer-container .content-container .subheading-container p,:host .outer-container .content-container .subheading-container blockquote,:host .outer-container .content-container .subheading-container pre,:host .outer-container .content-container .subheading-container a,:host .outer-container .content-container .subheading-container abbr,:host .outer-container .content-container .subheading-container acronym,:host .outer-container .content-container .subheading-container address,:host .outer-container .content-container .subheading-container big,:host .outer-container .content-container .subheading-container cite,:host .outer-container .content-container .subheading-container code,:host .outer-container .content-container .subheading-container del,:host .outer-container .content-container .subheading-container dfn,:host .outer-container .content-container .subheading-container em,:host .outer-container .content-container .subheading-container font,:host .outer-container .content-container .subheading-container ins,:host .outer-container .content-container .subheading-container kbd,:host .outer-container .content-container .subheading-container q,:host .outer-container .content-container .subheading-container s,:host .outer-container .content-container .subheading-container samp,:host .outer-container .content-container .subheading-container small,:host .outer-container .content-container .subheading-container strike,:host .outer-container .content-container .subheading-container strong,:host .outer-container .content-container .subheading-container sub,:host .outer-container .content-container .subheading-container sup,:host .outer-container .content-container .subheading-container tt,:host .outer-container .content-container .subheading-container var,:host .outer-container .content-container .subheading-container dl,:host .outer-container .content-container .subheading-container dt,:host .outer-container .content-container .subheading-container dd,:host .outer-container .content-container .subheading-container ol,:host .outer-container .content-container .subheading-container ul,:host .outer-container .content-container .subheading-container li,:host .outer-container .content-container .subheading-container fieldset,:host .outer-container .content-container .subheading-container form,:host .outer-container .content-container .subheading-container label,:host .outer-container .content-container .subheading-container legend,:host .outer-container .content-container .subheading-container table,:host .outer-container .content-container .subheading-container caption,:host .outer-container .content-container .subheading-container tbody,:host .outer-container .content-container .subheading-container tfoot,:host .outer-container .content-container .subheading-container thead,:host .outer-container .content-container .subheading-container tr,:host .outer-container .content-container .subheading-container th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host .outer-container .content-container .subheading-container .text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .avatar-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end;margin-top:0.5rem;padding-right:0.3rem}:host .outer-container .content-container .avatar-container yoo-avatar{margin-right:0.75rem;margin-left:0.15rem}:host .outer-container .content-container .action-button-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end}:host .outer-container .content-container .slot-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between;color:var(--text-color, #807f83);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .slot-container .inner-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}:host(.firefox) .content-container{margin-bottom:0}:host(.web):not(.framed) .outer-container{padding-top:1rem;padding-bottom:1rem;background-color:transparent}:host(.web) .outer-container .card-list-image-container.large{min-width:3.875rem}:host(.web) .outer-container .card-list-image-container.medium{min-width:2.875rem}:host(.web) .outer-container .card-list-image-container.small{min-width:2.375rem}:host(.web) .outer-container .content-container .top-container .badges-container.show-more{position:relative;overflow:visible}:host(.web) .outer-container .content-container .top-container .badges-container.show-more .more-button{position:absolute;top:0;right:0;bottom:auto;left:auto;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;width:2rem;height:1.125rem;font-size:var(--font-size-18, 1.125rem)}:host(.web) .outer-container .content-container .top-container .badges-container.show-more .more-button yoo-icon{padding-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000)}:host(.locations) .outer-container .content-container .top-container .heading-container .date-card-text{padding-right:var(--spacing-16, 1rem)}:host(.locations.map) .outer-container{-ms-flex-align:center;align-items:center;background:var(--light, #ffffff)}:host(.collapsible) .outer-container,:host(.locations.no-kpi:not(.framed)) .outer-container{-ms-flex-align:start;align-items:flex-start;width:auto;border-bottom:none;border-radius:0.5rem}:host(.collapsible) .outer-container .content-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container{margin:0.5rem 0 0;border:none}:host(.collapsible) .outer-container .content-container .top-container .heading-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container .top-container .heading-container{-ms-flex-pack:justify;justify-content:space-between;padding-top:0 !important;padding-right:var(--spacing-08, 0.5rem)}:host(.collapsible) .outer-container .content-container .top-container .subheading-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container .top-container .subheading-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.collapsible) .outer-container .content-container{margin-top:0}:host(.locations.no-kpi.map) .outer-container{-ms-flex-align:start;align-items:flex-start;max-width:18.75rem}:host(.locations.no-kpi:not(.framed)) yoo-tag.distance{margin-right:0.75rem}:host(.web.framed) .outer-container .content-container .top-container .heading-container{font-size:var(--font-size-16, 1rem)}:host(.android) .outer-container .content-container .top-container .heading-container .heading-title{display:-webkit-box;max-height:calc((var(--font-size-18, 1.125rem) + 0.25rem) * 2);overflow:hidden;line-height:calc(var(--font-size-18, 1.125rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}:host{--margin-content-container-left:0;--margin-content-container-right:0;--padding-content-container:var(--spacing-04, 0.25rem) 0 var(--spacing-08, 0.5rem) 0;--border-bottom-outer-container:var(--border-width-01, 0.0625rem) solid var(--stable-alt-40, rgba(208, 208, 208, 0.4));--overflow-card-heading-text:hidden;--text-overflow-card-heading-text:ellipsis;--white-space-card-heading-text:normal;--padding-right-card-heading:unset;--max-height-heading:48px;--card-list-background:none;--justify-content-content-container:flex-start;--max-card-heading-height:26px;--height-lessons-outer-container:2.5rem;--heading-font-size:var(--font-size-14, 0.875rem)}:host yoo-truncate{--max-lines:2}:host .heart-icon{width:var(--icon-size-05, 4rem)}:host .heart-icon yoo-lottie{width:var(--icon-size-02, 1.5rem);height:var(--icon-size-05, 4rem);margin:auto}:host .heart-icon yoo-lottie yoo-icon{top:1.3rem}:host .outer-container{padding-top:var(--spacing-04, 0.25rem)}:host .outer-container.tapped{background-color:var(--stable-light, #f1f1f1);-webkit-transition:background-color 0.3s ease;transition:background-color 0.3s ease}:host .outer-container .video-container{width:100%;max-height:350px;padding-top:var(--spacing-08, 0.5rem)}:host .outer-container .rank-container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;min-width:1.5rem;color:var(--stable, #adadad);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .heading-container yoo-tag.margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .content-container .heading-container .progress-box{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;color:var(--dark, #000000)}:host .outer-container .content-container .heading-container .progress-box .icon-text{font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .tags-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;padding-bottom:var(--spacing-04, 0.25rem);overflow:hidden;line-height:15px}:host .outer-container .content-container .tags-container yoo-tag,:host .outer-container .content-container .tags-container .card-icon{margin:var(--spacing-04, 0.25rem) var(--spacing-08, 0.5rem) var(--spacing-02, 0.125rem) var(--spacing-02, 0.125rem)}:host .outer-container .content-container .tags-container .hashtag{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:0.4375rem;color:var(--text-color, #807f83);font-size:var(--font-size-12, 0.75rem);-webkit-transform:translateY(0.125rem);transform:translateY(0.125rem)}:host .outer-container .content-container .tags-container .card-icon{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}:host .outer-container .content-container .tags-container .card-icon yoo-icon{margin-right:0.4375rem}:host .outer-container .content-container .tags-container .row-action{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;line-height:1rem}:host .outer-container .content-container .top-container .video-container{display:-ms-inline-flexbox;display:inline-flex;height:230px}:host .outer-container .content-container .top-container .heading-container .date-card-text{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-left:auto;padding:0 var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem);text-align:right}:host .outer-container .content-container .top-container .heading-container .points-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding-right:var(--spacing-08, 0.5rem);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .top-container .heading-container .points-container .points{padding:0 0.35rem}:host .outer-container .content-container .top-container .flex{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .outer-container.active{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host .outer-container .image-video-preview{width:12.5rem;height:6.25rem;padding:var(--spacing-08, 0.5rem);pointer-events:none}:host .outer-container .image-video-preview yoo-img{--border-radius:var(--border-radius-08, 0.5rem);height:100%}:host(.mobile.rtl) .outer-container .content-container{margin-right:var(--margin-content-container-left);margin-left:var(--margin-content-container-right)}:host(.mobile.rtl) .outer-container .content-container.has-image{margin-right:0}:host(.mobile.rtl) .outer-container .content-container .tags-container yoo-tag,:host(.mobile.rtl) .outer-container .content-container .tags-container .card-icon{margin:var(--spacing-04, 0.25rem) var(--spacing-02, 0.125rem) var(--spacing-02, 0.125rem) var(--spacing-08, 0.5rem)}:host(.mobile.rtl) .outer-container .content-container .top-container .subheading-container{margin-right:0;margin-left:var(--spacing-32, 2rem)}:host(.current) .outer-container .rank-container{color:var(--app-color, #5a30f4)}:host(.current) .outer-container .content-container .leaderboard .heading-container .card-heading{color:var(--app-color, #5a30f4)}:host(.current.leaderboard){background-color:var(--app-color, #5a30f4) !important}:host(.current.leaderboard) .outer-container .rank-container{color:var(--light, #ffffff)}:host(.current.leaderboard) .outer-container .content-container .leaderboard .heading-container .card-heading{color:var(--light, #ffffff)}:host(.current.leaderboard) .outer-container .points-container{color:var(--light, #ffffff)}:host(.leaderboard.userranks){height:var(--spacing-40, 2.5rem)}:host(.leaderboard.userranks) .outer-container{height:100%;padding:0 !important}:host(.leaderboard.userranks) .icon-container{color:var(--app-color, #5a30f4) !important}:host(.leaderboard){padding-left:var(--spacing-16, 1rem);color:var(--dark, #000000);background-color:var(--light, #ffffff);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));opacity:1}:host(.secondary-view){--border-bottom-outer-container:0px;background:transparent}:host(.secondary-view) .outer-container{padding-top:var(--spacing-08, 0.5rem)}:host(.secondary-view) .outer-container .question-content{border-bottom:var(--border-bottom-outer-container)}:host(.secondary-view) .outer-container .content-container .heading-container{font-size:var(--font-size-16, 1rem)}:host(.secondary-view) .outer-container .content-container .heading-container .date-card-text{display:block;padding:0;line-height:normal;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.secondary-view) .outer-container .content-container .translate-container{position:relative;margin-bottom:var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-weight:normal;font-size:var(--font-size-16, 1rem);font-style:normal;font-stretch:normal;line-height:1;letter-spacing:normal}:host(.secondary-view) .outer-container .content-container .translate-container.active{margin-left:var(--spacing-04, 0.25rem);padding-left:var(--spacing-08, 0.5rem);border-left:var(--border-width-02, 0.125rem) solid var(--stable-alt, #d0d0d0)}:host(.secondary-view) .outer-container .content-container .translate-container .text{margin-bottom:var(--spacing-04, 0.25rem);color:var(--dark, #000000)}:host(.secondary-view) .outer-container .content-container .translate-container .text html,:host(.secondary-view) .outer-container .content-container .translate-container .text body,:host(.secondary-view) .outer-container .content-container .translate-container .text div:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text span:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text img:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text applet,:host(.secondary-view) .outer-container .content-container .translate-container .text object,:host(.secondary-view) .outer-container .content-container .translate-container .text iframe,:host(.secondary-view) .outer-container .content-container .translate-container .text h1,:host(.secondary-view) .outer-container .content-container .translate-container .text h2,:host(.secondary-view) .outer-container .content-container .translate-container .text h3,:host(.secondary-view) .outer-container .content-container .translate-container .text h4,:host(.secondary-view) .outer-container .content-container .translate-container .text h5,:host(.secondary-view) .outer-container .content-container .translate-container .text h6,:host(.secondary-view) .outer-container .content-container .translate-container .text p,:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote,:host(.secondary-view) .outer-container .content-container .translate-container .text pre,:host(.secondary-view) .outer-container .content-container .translate-container .text a,:host(.secondary-view) .outer-container .content-container .translate-container .text abbr,:host(.secondary-view) .outer-container .content-container .translate-container .text acronym,:host(.secondary-view) .outer-container .content-container .translate-container .text address,:host(.secondary-view) .outer-container .content-container .translate-container .text big,:host(.secondary-view) .outer-container .content-container .translate-container .text cite,:host(.secondary-view) .outer-container .content-container .translate-container .text code,:host(.secondary-view) .outer-container .content-container .translate-container .text del,:host(.secondary-view) .outer-container .content-container .translate-container .text dfn,:host(.secondary-view) .outer-container .content-container .translate-container .text em,:host(.secondary-view) .outer-container .content-container .translate-container .text font,:host(.secondary-view) .outer-container .content-container .translate-container .text ins,:host(.secondary-view) .outer-container .content-container .translate-container .text kbd,:host(.secondary-view) .outer-container .content-container .translate-container .text q,:host(.secondary-view) .outer-container .content-container .translate-container .text s,:host(.secondary-view) .outer-container .content-container .translate-container .text samp,:host(.secondary-view) .outer-container .content-container .translate-container .text small,:host(.secondary-view) .outer-container .content-container .translate-container .text strike,:host(.secondary-view) .outer-container .content-container .translate-container .text strong,:host(.secondary-view) .outer-container .content-container .translate-container .text sub,:host(.secondary-view) .outer-container .content-container .translate-container .text sup,:host(.secondary-view) .outer-container .content-container .translate-container .text tt,:host(.secondary-view) .outer-container .content-container .translate-container .text var,:host(.secondary-view) .outer-container .content-container .translate-container .text dl,:host(.secondary-view) .outer-container .content-container .translate-container .text dt,:host(.secondary-view) .outer-container .content-container .translate-container .text dd,:host(.secondary-view) .outer-container .content-container .translate-container .text ol,:host(.secondary-view) .outer-container .content-container .translate-container .text ul,:host(.secondary-view) .outer-container .content-container .translate-container .text li,:host(.secondary-view) .outer-container .content-container .translate-container .text fieldset,:host(.secondary-view) .outer-container .content-container .translate-container .text form,:host(.secondary-view) .outer-container .content-container .translate-container .text label,:host(.secondary-view) .outer-container .content-container .translate-container .text legend,:host(.secondary-view) .outer-container .content-container .translate-container .text table,:host(.secondary-view) .outer-container .content-container .translate-container .text caption,:host(.secondary-view) .outer-container .content-container .translate-container .text tbody,:host(.secondary-view) .outer-container .content-container .translate-container .text tfoot,:host(.secondary-view) .outer-container .content-container .translate-container .text thead,:host(.secondary-view) .outer-container .content-container .translate-container .text tr,:host(.secondary-view) .outer-container .content-container .translate-container .text th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote{padding-left:1rem;border-left:var(--border-width-04, 0.25rem) solid var(--stable, #adadad)}:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote:last-of-type blockquote p:last-of-type,:host(.secondary-view) .outer-container .content-container .translate-container .text p:last-of-type{padding-top:0;padding-bottom:0}:host(.secondary-view) .outer-container .content-container .translate-container .text ol,:host(.secondary-view) .outer-container .content-container .translate-container .text ul{margin:revert;padding:revert}:host(.secondary-view) .outer-container .content-container .translate-container .text h1{display:block;margin-top:0.67em;margin-right:0;margin-bottom:0.67em;margin-left:0;font-weight:bold;font-size:2em}:host(.secondary-view) .outer-container .content-container .translate-container .text h2{display:block;margin-top:0.83em;margin-right:0;margin-bottom:0.83em;margin-left:0;font-weight:bold;font-size:1.5em}:host(.secondary-view) .outer-container .content-container .translate-container .text h3{display:block;margin-top:1em;margin-right:0;margin-bottom:1em;margin-left:0;font-weight:bold;font-size:1.17em}:host(.secondary-view) .outer-container .content-container .translate-container .text h4{display:block;margin-top:1.33em;margin-right:0;margin-bottom:1.33em;margin-left:0;font-weight:bold}:host(.secondary-view) .outer-container .content-container .translate-container .text h5{display:block;margin-top:1.67em;margin-right:0;margin-bottom:1.67em;margin-left:0;font-weight:bold;font-size:0.83em}:host(.secondary-view) .outer-container .content-container .translate-container .text h6{display:block;margin-top:2.33em;margin-right:0;margin-bottom:2.33em;margin-left:0;font-weight:bold;font-size:0.67em}:host(.secondary-view) .outer-container .content-container .translate-container .text strong{font-weight:bold}:host(.secondary-view) .outer-container .content-container .translate-container .text em{font-style:italic}:host(.secondary-view) .outer-container .content-container .subheading-container{display:block;max-height:initial;overflow:visible;color:var(--dark, #000000);font-size:var(--font-size-16, 1rem);line-height:20px;white-space:pre-wrap;word-wrap:break-word}:host(.secondary-view) .outer-container .content-container .subheading-container html,:host(.secondary-view) .outer-container .content-container .subheading-container body,:host(.secondary-view) .outer-container .content-container .subheading-container div:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container span:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container img:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container applet,:host(.secondary-view) .outer-container .content-container .subheading-container object,:host(.secondary-view) .outer-container .content-container .subheading-container iframe,:host(.secondary-view) .outer-container .content-container .subheading-container h1,:host(.secondary-view) .outer-container .content-container .subheading-container h2,:host(.secondary-view) .outer-container .content-container .subheading-container h3,:host(.secondary-view) .outer-container .content-container .subheading-container h4,:host(.secondary-view) .outer-container .content-container .subheading-container h5,:host(.secondary-view) .outer-container .content-container .subheading-container h6,:host(.secondary-view) .outer-container .content-container .subheading-container p,:host(.secondary-view) .outer-container .content-container .subheading-container blockquote,:host(.secondary-view) .outer-container .content-container .subheading-container pre,:host(.secondary-view) .outer-container .content-container .subheading-container a,:host(.secondary-view) .outer-container .content-container .subheading-container abbr,:host(.secondary-view) .outer-container .content-container .subheading-container acronym,:host(.secondary-view) .outer-container .content-container .subheading-container address,:host(.secondary-view) .outer-container .content-container .subheading-container big,:host(.secondary-view) .outer-container .content-container .subheading-container cite,:host(.secondary-view) .outer-container .content-container .subheading-container code,:host(.secondary-view) .outer-container .content-container .subheading-container del,:host(.secondary-view) .outer-container .content-container .subheading-container dfn,:host(.secondary-view) .outer-container .content-container .subheading-container em,:host(.secondary-view) .outer-container .content-container .subheading-container font,:host(.secondary-view) .outer-container .content-container .subheading-container ins,:host(.secondary-view) .outer-container .content-container .subheading-container kbd,:host(.secondary-view) .outer-container .content-container .subheading-container q,:host(.secondary-view) .outer-container .content-container .subheading-container s,:host(.secondary-view) .outer-container .content-container .subheading-container samp,:host(.secondary-view) .outer-container .content-container .subheading-container small,:host(.secondary-view) .outer-container .content-container .subheading-container strike,:host(.secondary-view) .outer-container .content-container .subheading-container strong,:host(.secondary-view) .outer-container .content-container .subheading-container sub,:host(.secondary-view) .outer-container .content-container .subheading-container sup,:host(.secondary-view) .outer-container .content-container .subheading-container tt,:host(.secondary-view) .outer-container .content-container .subheading-container var,:host(.secondary-view) .outer-container .content-container .subheading-container dl,:host(.secondary-view) .outer-container .content-container .subheading-container dt,:host(.secondary-view) .outer-container .content-container .subheading-container dd,:host(.secondary-view) .outer-container .content-container .subheading-container ol,:host(.secondary-view) .outer-container .content-container .subheading-container ul,:host(.secondary-view) .outer-container .content-container .subheading-container li,:host(.secondary-view) .outer-container .content-container .subheading-container fieldset,:host(.secondary-view) .outer-container .content-container .subheading-container form,:host(.secondary-view) .outer-container .content-container .subheading-container label,:host(.secondary-view) .outer-container .content-container .subheading-container legend,:host(.secondary-view) .outer-container .content-container .subheading-container table,:host(.secondary-view) .outer-container .content-container .subheading-container caption,:host(.secondary-view) .outer-container .content-container .subheading-container tbody,:host(.secondary-view) .outer-container .content-container .subheading-container tfoot,:host(.secondary-view) .outer-container .content-container .subheading-container thead,:host(.secondary-view) .outer-container .content-container .subheading-container tr,:host(.secondary-view) .outer-container .content-container .subheading-container th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host(.secondary-view) .outer-container .content-container .subheading-container blockquote{padding-left:1rem;border-left:var(--border-width-04, 0.25rem) solid var(--stable, #adadad)}:host(.secondary-view) .outer-container .content-container .subheading-container blockquote:last-of-type blockquote p:last-of-type,:host(.secondary-view) .outer-container .content-container .subheading-container p:last-of-type{padding-top:0;padding-bottom:0}:host(.secondary-view) .outer-container .content-container .subheading-container ol,:host(.secondary-view) .outer-container .content-container .subheading-container ul{margin:revert;padding:revert}:host(.secondary-view) .outer-container .content-container .subheading-container h1{display:block;margin-top:0.67em;margin-right:0;margin-bottom:0.67em;margin-left:0;font-weight:bold;font-size:2em}:host(.secondary-view) .outer-container .content-container .subheading-container h2{display:block;margin-top:0.83em;margin-right:0;margin-bottom:0.83em;margin-left:0;font-weight:bold;font-size:1.5em}:host(.secondary-view) .outer-container .content-container .subheading-container h3{display:block;margin-top:1em;margin-right:0;margin-bottom:1em;margin-left:0;font-weight:bold;font-size:1.17em}:host(.secondary-view) .outer-container .content-container .subheading-container h4{display:block;margin-top:1.33em;margin-right:0;margin-bottom:1.33em;margin-left:0;font-weight:bold}:host(.secondary-view) .outer-container .content-container .subheading-container h5{display:block;margin-top:1.67em;margin-right:0;margin-bottom:1.67em;margin-left:0;font-weight:bold;font-size:0.83em}:host(.secondary-view) .outer-container .content-container .subheading-container h6{display:block;margin-top:2.33em;margin-right:0;margin-bottom:2.33em;margin-left:0;font-weight:bold;font-size:0.67em}:host(.secondary-view) .outer-container .content-container .subheading-container strong{font-weight:bold}:host(.secondary-view) .outer-container .content-container .subheading-container em{font-style:italic}:host(.secondary-view) .outer-container .content-container .subheading-container.comment-image{--border-radius:var(--border-radius-16, 1rem);margin-top:9px;overflow:hidden}:host(.secondary-view) .outer-container .content-container .subheading-container span.with-markdown{white-space:normal}:host(.secondary-view) .outer-container .content-container .subheading-container span.with-markdown img{width:100%;max-width:initial !important}:host(.secondary-view) .outer-container .content-container .top-container{padding:var(--spacing-08, 0.5rem);background:var(--stable-light-60, rgba(241, 241, 241, 0.6));border-radius:var(--border-radius-04, 0.25rem)}:host(.secondary-view) .outer-container .content-container .top-container .card-heading{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;width:100%;padding-right:var(--spacing-08, 0.5rem)}:host(.secondary-view) .outer-container .content-container .top-container .card-heading .card-heading-text{font-weight:var(--font-weight-700, 700)}:host(.secondary-view) .outer-container .content-container .top-container .heading-container .heading-title{display:block}:host(.secondary-view) .outer-container .content-container .top-container .heading-container .heading-title span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.secondary-view) .outer-container .content-container .top-container span{display:block;font-size:var(--font-size-16, 1rem)}:host(.secondary-view) .outer-container .content-container .slot-container yoo-img{margin-right:auto}:host(.secondary-view) .tags-container{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center;margin-top:-0.85rem;margin-left:1.875rem;font-size:var(--font-size-14, 0.875rem)}:host(.secondary-view) .tags-container .card-icon.right{margin-left:auto}:host(.secondary-view) .tags-container .card-icon.right yoo-icon{margin:0}:host(.secondary-view) .tags-container .row-action{width:100%;margin-top:-0.875rem;margin-left:1.25rem}:host(.secondary-view) .tags-container .row-action span{color:var(--dark, #000000)}:host(.secondary-view) .tags-container .bottom-action{margin-right:1.25rem;color:var(--text-color, #807f83)}:host(.questionsAnswers) .tags-container{margin-left:2.8125rem}:host(.questionsAnswers) .tags-container .card-icon:not(.heart-icon){margin:var(--spacing-16, 1rem) var(--spacing-16, 1rem) 0 0}:host(.questionsAnswers) .tags-container .row-action{margin-top:var(--spacing-08, 0.5rem);margin-left:0}:host(.entitycomments) .tags-container,:host(.feedsComments) .tags-container{margin-left:1.75rem}:host(.userranks) .outer-container,:host(.userhighscores) .outer-container{-ms-flex-align:center;align-items:center;padding:var(--spacing-08, 0.5rem) 0 !important;background-color:transparent;border-bottom:0}:host(.userranks) .heading-container,:host(.userhighscores) .heading-container{word-wrap:break-word}:host(.active) .outer-container{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host(.hoverable):hover .outer-container{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host(.filesFolders) .outer-container .content-container .subheading-container,:host(.files) .outer-container .content-container .subheading-container{margin:0;font-size:var(--font-size-12, 0.75rem)}:host(.filesFolders) .outer-container .content-container .subheading-container em,:host(.files) .outer-container .content-container .subheading-container em{color:var(--dark, #000000);font-weight:bold;background:#FDFB2F}:host(.locations.external) .outer-container .content-container .subheading-container{white-space:normal}:host(.products) .outer-container .content-container{border-bottom:none}:host(.outofstock),:host(.hidden){opacity:0.5}:host(.productweightpair) .outer-container .content-container .heading-container .date-card-text{color:var(--dark, #000000)}:host(.catalog-display.history) .outer-container .content-container{text-align:left}:host(.catalog-display.history) .outer-container .content-container .top-container .price{font-size:var(--font-size-12, 0.75rem)}:host(.catalog-display.history) .outer-container .content-container .top-container .tags-container{padding-bottom:var(--spacing-04, 0.25rem)}:host(.catalog-display){width:100%}:host(.catalog-display) .outer-container{-ms-flex-align:start;align-items:flex-start;font-size:var(--font-size-14, 0.875rem);border:none !important}:host(.catalog-display) .outer-container .content-container{-ms-flex-pack:center;justify-content:center;margin-left:1rem;padding:0;border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host(.catalog-display) .outer-container .content-container .top-container .card-heading{font-size:var(--font-size-14, 0.875rem)}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container{min-height:1rem;max-height:0.8rem;color:var(--dark, #000000);font-size:var(--font-size-12, 0.75rem);line-height:1rem}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container .subheading-grey{color:var(--stable, #adadad)}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container .subheading-price{color:var(--dark, #000000)}:host(.catalog-display) .outer-container .content-container .top-container .price{color:var(--text-color, #807f83)}:host(.catalog-display) .outer-container .content-container .top-container .tags-container{overflow:initial;line-height:normal}:host(.catalog-display.no-border) .outer-container .content-container{border-bottom:none}:host(.productbatch.archived) .outer-container .content-container{opacity:0.5}:host(.offline:not(.missions)) .outer-container{opacity:0.7}:host(.offline:not(.missions))::before,:host(.offline:not(.missions))::after{position:absolute;top:0;right:0;border-color:transparent;border-style:solid;content:\"\"}:host(.offline:not(.missions))::after{border-width:0.5em;border-top-color:var(--energized, #ffc043);border-right-color:var(--energized, #ffc043)}:host(.notifications) .outer-container{padding-top:var(--spacing-04, 0.25rem)}:host(.notes) .outer-container .content-container .heading-container .card-heading .heading-title{display:-webkit-box;max-height:calc((var(--font-size-18, 1.125rem) + 0.125rem) * 1);overflow:hidden;line-height:calc(var(--font-size-18, 1.125rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:1;}:host(.no-text-break) .outer-container .content-container .top-container .heading-container .card-heading{white-space:normal}:host(.lessons.web) .outer-container{height:var(--height-lessons-outer-container);min-height:0;margin:var(--spacing-04, 0.25rem) 0;padding-left:var(--spacing-08, 0.5rem);border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:var(--card-shadow-2, 0 0.3125rem 0.9375rem 0 rgba(40, 47, 54, 0.08));box-shadow:var(--card-shadow-2, 0 0.3125rem 0.9375rem 0 rgba(40, 47, 54, 0.08))}:host(.lessons.web) .outer-container .content-container{border-bottom:none}:host(.lessons.web) .outer-container .content-container .top-container{display:-ms-flexbox;display:flex}:host(.lessons.web) .outer-container .content-container .heading-container{-ms-flex:1;flex:1;width:75%;padding-right:var(--spacing-08, 0.5rem);font-size:var(--heading-font-size)}:host(.lessons.web) .outer-container .content-container .heading-container .card-heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding-top:0}:host(.lessons.web.finished) .outer-container{background-color:var(--app-color, #5a30f4)}:host(.lessons.web.finished) .outer-container .card-heading,:host(.lessons.web.finished) .outer-container .icon-container{color:var(--light-10, rgba(255, 255, 255, 0.1))}:host(.lessons.web.locked) .outer-container{background-color:var(--stable-alt, #d0d0d0)}:host(.lessons.web.locked) .outer-container .card-heading{color:var(--text-color, #807f83)}:host(.lessons.web.locked) .outer-container .top-container yoo-avatar{margin:0 0.75rem}:host(.missions.finished:not(.grid-cell)) .outer-container{padding-bottom:var(--spacing-16, 1rem)}:host(.courseselection) .outer-container .content-container{-ms-flex-pack:center;justify-content:center;margin-left:0}:host(.courseselection) .outer-container .content-container .top-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host(.courseselection) .outer-container .content-container .top-container .heading-container{-ms-flex-order:2;order:2;font-size:var(--font-size-16, 1rem)}:host(.courseselection) .outer-container .content-container .top-container .subheading-container{-ms-flex-order:1;order:1;color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem)}:host(.courseselection) .outer-container .content-container .top-container .subheading-container .todo{font-size:var(--font-size-14, 0.875rem)}:host(.courseselection) .outer-container .content-container .top-container .tags-container{padding-bottom:0}:host(.questions) .outer-container{padding-bottom:0;border-bottom:0}:host(.questions) .outer-container .content-container .top-container .heading-container{max-height:1.25rem;margin-bottom:0}:host(.questions) .outer-container .content-container .top-container .heading-container .card-heading .heading-title{color:var(--dark, #000000);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:var(--spacing-04, 0.25rem)}:host(.questions) .question-container.no-img{padding-top:var(--spacing-04, 0.25rem)}:host(.questions) .question-container.no-img .question-content{height:auto}:host(.questions) .question-container .question-content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:98px;margin-left:var(--spacing-08, 0.5rem);padding-bottom:var(--spacing-16, 1rem);border-bottom:var(--border-bottom-outer-container)}:host(.questions) .question-container .question-content .question-title{margin-bottom:var(--spacing-08, 0.5rem);font-weight:var(--font-weight-700, 700);font-size:var(--font-size-18, 1.125rem);word-break:break-word}:host(.questions) .question-container .question-content .question-icons{display:-ms-flexbox;display:flex;color:var(--stable-alt, #d0d0d0);font-size:var(--icon-size-01, 1rem)}:host(.questions) .question-container .question-content .question-icons .inner-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000);font-size:var(--font-size-18, 1.125rem)}:host(.questions) .question-container .question-content .question-icons .inner-container yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host(.questions) .question-container .question-content .subheadings{display:-ms-flexbox;display:flex;color:var(--text-color, #807f83)}:host(.questions) .question-container .question-content .subheadings .subheading-container{padding-right:var(--spacing-08, 0.5rem);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .question-content .subheadings .date-card-text{margin-right:var(--spacing-08, 0.5rem);color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .question-content .tags-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;overflow:hidden}:host(.questions) .question-container .question-content .tags-container .hashtag{margin-right:0.4375rem;color:var(--app-color, #5a30f4);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .image-video-preview{min-width:7.5rem;height:98px;padding:var(--spacing-08, 0.5rem);pointer-events:none}:host(.questions) .question-container .image-video-preview yoo-img{--border-radius:var(--border-radius-08, 0.5rem)}:host(.questions) .question-container .image-video-preview yoo-videoplayer-core{overflow:hidden;border-radius:var(--border-radius-08, 0.5rem)}:host(.card-feed) .outer-container{display:none}:host(.card-feed) .question-container{-ms-flex-pack:initial !important;justify-content:initial !important;background:var(--light-10, rgba(255, 255, 255, 0.1));border-bottom:none !important;-webkit-box-shadow:var(--grid-frame-shadow, 0 0.3125rem 0.9375rem 0.1875rem rgba(40, 47, 54, 0.15));box-shadow:var(--grid-frame-shadow, 0 0.3125rem 0.9375rem 0.1875rem rgba(40, 47, 54, 0.15))}:host(.card-feed) .question-container .image-video-preview{-ms-flex-negative:0;flex-shrink:0;-ms-flex-order:1;order:1;width:130px;height:89px;padding-right:var(--spacing-16, 1rem)}:host(.card-feed) .question-container .image-video-preview yoo-videoplayer-core{overflow:hidden;border-radius:5px}:host(.card-feed) .question-container .question-content{-ms-flex-pack:initial !important;justify-content:initial !important;-ms-flex-order:2;order:2;margin-left:0;padding:var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) 0}:host(.selected-content) .question-container{padding:0}:host(.selected-content) .question-container .image-video-preview{min-width:2rem;height:1.5rem;padding-left:0}:host(.selected-content) .question-container .question-content{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;height:auto;margin:0;padding-bottom:0;border-bottom:none}:host(.selected-content) .question-container .question-content .question-title{margin:0;font-weight:var(--font-weight-400, 400);font-size:var(--font-size-16, 1rem)}:host(.selected-content) .outer-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.selected-content) .outer-container .content-container .heading-container{margin-bottom:var(--spacing-02, 0.125rem)}:host(.selected-content) .outer-container .content-container .heading-container .card-heading .heading-title span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.selected-content) .outer-container .content-container .uifield-container{display:none}:host(.web.grid-cell){overflow:hidden}:host(.web.grid-cell) .outer-container{padding-top:var(--spacing-08, 0.5rem);padding-bottom:var(--spacing-08, 0.5rem)}:host(.web.grid-cell) .outer-container .content-container .tags-container{-ms-flex-wrap:initial;flex-wrap:initial}:host(.mobile.autocomplete-selection-mode) .question-container .question-title{font-size:var(--font-size-16, 1rem)}:host(.mobile.autocomplete-selection-mode) .subheading-container{margin-right:var(--spacing-32, 2rem)}:host(.no-border-bottom.mobile) .outer-container{border-bottom:none}:host(.no-border-bottom.mobile) .question-container .question-content{border-bottom:none}:host(.item-disabled){cursor:default}:host(.kanban) .outer-container{padding-top:0;padding-bottom:0}:host(.web.videocallusers) .outer-container{padding-top:0;padding-bottom:0}:host(.web.firefox) .outer-container{height:auto}:host(.violetproducts) .outer-container,:host(.violetbasketitems) .outer-container{-ms-flex-align:center;align-items:center}:host(.violetproducts) .outer-container yoo-icon.arrow,:host(.violetbasketitems) .outer-container yoo-icon.arrow{margin-top:var(--spacing-04, 0.25rem);margin-right:var(--spacing-04, 0.25rem);margin-bottom:auto}:host(.violetproducts) .content-container,:host(.violetbasketitems) .content-container{border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host(.form-permission) .outer-container{height:auto}:host(.pages) .outer-container{-ms-flex-align:center;align-items:center}:host(.missions.feed) .outer-container{border-bottom:none !important}:host(.calendarEvents) .outer-container .content-container .heading-container{margin-bottom:unset}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container .dot-event,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container .dot-event{margin-right:var(--spacing-04, 0.25rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container .icon-event,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container .icon-event{margin-right:var(--spacing-08, 0.5rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .title{font-weight:bold;font-size:var(--font-size-16, 1rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .time{color:var(--app-color, #5a30f4)}:host(.course-info) .outer-container,:host(.learning-manager) .outer-container{padding-top:var(--spacing-16, 1rem)}:host(.table) .top-container{display:-ms-flexbox;display:flex}:host(.table) .top-container .heading-container{-ms-flex:1;flex:1}";
15
15
 
16
16
  const MAX_AVATAR_DISPLAY = 3;
17
17
  const YooCardListComponent = class {
18
18
  constructor(hostRef) {
19
19
  index.registerInstance(this, hostRef);
20
20
  this.uiFieldsChanged = index.createEvent(this, "uiFieldsChanged", 7);
21
+ this.fieldFetchData = index.createEvent(this, "fieldFetchData", 7);
21
22
  this.avatarImgs = [];
22
23
  this.isMap = false;
23
24
  this.onTouchStart = () => cardListHelpers.toggleElementTapped(this.outerDiv, this.host);
@@ -276,10 +277,15 @@ const YooCardListComponent = class {
276
277
  this.entry.uiFields.fields.some((f) => index$1.isFieldWithNoValue(f) || !index$1.isNullOrUndefined(this.entry.uiFields.data[f.name])) &&
277
278
  !((_e = (_d = this.host) === null || _d === void 0 ? void 0 : _d.classList) === null || _e === void 0 ? void 0 : _e.contains('map')) &&
278
279
  !((_g = (_f = this.host) === null || _f === void 0 ? void 0 : _f.classList) === null || _g === void 0 ? void 0 : _g.contains('grid-cell'))) {
279
- return (index.h("div", { class: "uifield-container" }, index.h("yoo-form-dynamic", { class: "inline in-card secondary transparent", scrollable: false, forceReadonly: !((_j = (_h = this.host) === null || _h === void 0 ? void 0 : _h.classList) === null || _j === void 0 ? void 0 : _j.contains('form')), slides: [{ title: '', items: this.entry.uiFields.fields }], data: this.entry.uiFields.data, suffix: this.entry.uiFieldsSuffix, showTabs: false, formInputSize: "medium", showRecap: false, isPdf: this.entry.isPdf, onDataChanged: (ev) => {
280
+ return (index.h("div", { class: "uifield-container" }, index.h("yoo-form-dynamic", { class: "inline in-card secondary transparent", scrollable: false, ref: (el) => (this.uiFeldsformRef = el), forceReadonly: !((_j = (_h = this.host) === null || _h === void 0 ? void 0 : _h.classList) === null || _j === void 0 ? void 0 : _j.contains('form')), slides: [{ title: '', items: this.entry.uiFields.fields }], data: { ...this.entry.uiFields.data }, suffix: this.entry.uiFieldsSuffix, showTabs: false, formInputSize: "medium", showRecap: false, isPdf: this.entry.isPdf, onFieldFetchData: (ev) => {
281
+ ev.stopPropagation();
282
+ ev.detail.form = this.uiFeldsformRef;
283
+ this.fieldFetchData.emit(ev.detail);
284
+ }, onExtraDataChanged: (ev) => ev.stopPropagation(), onDataChanged: (ev) => {
280
285
  var _a, _b;
281
286
  ev.stopPropagation();
282
287
  if (!lodash.isEqual((_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.uiFields) === null || _b === void 0 ? void 0 : _b.data, ev === null || ev === void 0 ? void 0 : ev.detail)) {
288
+ this.entry.uiFields.data = { ...ev.detail };
283
289
  this.uiFieldsChanged.emit({ newdata: ev.detail });
284
290
  }
285
291
  } })));
package/dist/cjs/yoo-entity.cjs.entry.js CHANGED
@@ -97,9 +97,18 @@ const YooEntityComponent = class {
97
97
  this.closed.emit(true);
98
98
  }
99
99
  getCustomModelValue(key, data, fields) {
100
+ var _a;
100
101
  const field = fields.find((f) => f.name === key);
101
102
  if ((field === null || field === void 0 ? void 0 : field.type) === index$2.FormFieldType.user && data[key]) {
102
- return index$1.getUserDisplayName(data[key]);
103
+ if (lodash.isArray(data[key]) && ((_a = data[key]) === null || _a === void 0 ? void 0 : _a.length) <= 0) {
104
+ return '';
105
+ }
106
+ else if (lodash.isArray(data[key]) && data[key].length >= 1) {
107
+ return data[key].map((u) => index$1.getUserDisplayName(u)).join(', ');
108
+ }
109
+ else {
110
+ return index$1.getUserDisplayName(data[key]);
111
+ }
103
112
  }
104
113
  else if (key === '_ect' || (field && (field.type === index$2.FormFieldType.date || field.type === index$2.FormFieldType.datetime))) {
105
114
  return index$1.pipes.dateFormat.transform(data[key], ...[!field || field.type === index$2.FormFieldType.date ? 'L' : 'L LT']);
package/dist/cjs/yoo-form-dynamic.cjs.entry.js CHANGED
@@ -976,7 +976,7 @@ const YooFormDynamicComponent = class {
976
976
  }
977
977
  encodeFieldName(name) {
978
978
  // eslint-disable-next-line no-useless-escape
979
- return 'f-' + (name === null || name === void 0 ? void 0 : name.replace(/\./g, '-').replace(/_/g, '-').replace(/%/g, '-').replace(/\"/g, ''));
979
+ return 'f-' + (name === null || name === void 0 ? void 0 : name.replace(/\./g, '-').replace(/_/g, '-').replace(/%/g, '-').replace(/&/g, '-').replace(/\"/g, ''));
980
980
  }
981
981
  getFieldByCode(name, host) {
982
982
  const code = this.encodeFieldName(name);
package/dist/cjs/yoo-form-table.cjs.entry.js CHANGED
@@ -158,9 +158,15 @@ const YooFormTableComponent = class {
158
158
  finalValues = finalValues.concat(this.tmpValues.filter((v) => finalValues.findIndex((f) => f._id === v._id) < 0));
159
159
  }
160
160
  if (finalValues.length > 0) {
161
- return (index.h("yoo-grid", { class: { table: true, form: !this.readonly }, ref: (el) => (this.gridEl = el), displayType: this.displayType, collectionName: this.collectionName, entityType: this.entityType, showSearch: true, items: finalValues, model: this.model, hideAdvancedFilters: true, customModel: this.customModel, secondaryActions: this.secondaryActions, isLocal: this.isLocal, isPdf: this.isPdf, initialQuery: this.initialQuery, preventSearchReset: true, onSelected: (ev) => {
161
+ return (index.h("yoo-grid", { class: { table: true, form: !this.readonly }, ref: (el) => (this.gridEl = el), displayType: this.displayType, collectionName: this.collectionName, entityType: this.entityType, showSearch: true, items: finalValues, model: this.model, hideAdvancedFilters: true, customModel: this.customModel, secondaryActions: this.secondaryActions, secondaryActionsDropdown: index$1.isWeb(this.host), isLocal: this.isLocal, isPdf: this.isPdf, initialQuery: this.initialQuery, preventSearchReset: true, onSelected: (ev) => {
162
+ var _a, _b, _c;
162
163
  ev.stopPropagation();
163
- this.onSelectItem(ev.detail);
164
+ if (((_c = (_b = (_a = this.customModel) === null || _a === void 0 ? void 0 : _a.appearance) === null || _b === void 0 ? void 0 : _b.get('uifields')) === null || _c === void 0 ? void 0 : _c.length) > 0) {
165
+ //do nothing because the user can interract with the form
166
+ }
167
+ else {
168
+ this.onSelectItem(ev.detail);
169
+ }
164
170
  }, onInputChanged: (ev) => ev === null || ev === void 0 ? void 0 : ev.stopPropagation() }));
165
171
  }
166
172
  return null;
package/dist/collection/components/entities/card-list/default/card-list.css CHANGED
@@ -1734,4 +1734,11 @@ svg:not(:root) {
1734
1734
  :host(.course-info) .outer-container,
1735
1735
  :host(.learning-manager) .outer-container {
1736
1736
  padding-top: var(--spacing-16, 1rem);
1737
+ }
1738
+
1739
+ :host(.table) .top-container {
1740
+ display: flex;
1741
+ }
1742
+ :host(.table) .top-container .heading-container {
1743
+ flex: 1;
1737
1744
  }
package/dist/collection/components/entities/card-list/default/card-list.js CHANGED
@@ -264,10 +264,15 @@ export class YooCardListComponent {
264
264
  this.entry.uiFields.fields.some((f) => isFieldWithNoValue(f) || !isNullOrUndefined(this.entry.uiFields.data[f.name])) &&
265
265
  !((_e = (_d = this.host) === null || _d === void 0 ? void 0 : _d.classList) === null || _e === void 0 ? void 0 : _e.contains('map')) &&
266
266
  !((_g = (_f = this.host) === null || _f === void 0 ? void 0 : _f.classList) === null || _g === void 0 ? void 0 : _g.contains('grid-cell'))) {
267
- return (h("div", { class: "uifield-container" }, h("yoo-form-dynamic", { class: "inline in-card secondary transparent", scrollable: false, forceReadonly: !((_j = (_h = this.host) === null || _h === void 0 ? void 0 : _h.classList) === null || _j === void 0 ? void 0 : _j.contains('form')), slides: [{ title: '', items: this.entry.uiFields.fields }], data: this.entry.uiFields.data, suffix: this.entry.uiFieldsSuffix, showTabs: false, formInputSize: "medium", showRecap: false, isPdf: this.entry.isPdf, onDataChanged: (ev) => {
267
+ return (h("div", { class: "uifield-container" }, h("yoo-form-dynamic", { class: "inline in-card secondary transparent", scrollable: false, ref: (el) => (this.uiFeldsformRef = el), forceReadonly: !((_j = (_h = this.host) === null || _h === void 0 ? void 0 : _h.classList) === null || _j === void 0 ? void 0 : _j.contains('form')), slides: [{ title: '', items: this.entry.uiFields.fields }], data: { ...this.entry.uiFields.data }, suffix: this.entry.uiFieldsSuffix, showTabs: false, formInputSize: "medium", showRecap: false, isPdf: this.entry.isPdf, onFieldFetchData: (ev) => {
268
+ ev.stopPropagation();
269
+ ev.detail.form = this.uiFeldsformRef;
270
+ this.fieldFetchData.emit(ev.detail);
271
+ }, onExtraDataChanged: (ev) => ev.stopPropagation(), onDataChanged: (ev) => {
268
272
  var _a, _b;
269
273
  ev.stopPropagation();
270
274
  if (!isEqual((_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.uiFields) === null || _b === void 0 ? void 0 : _b.data, ev === null || ev === void 0 ? void 0 : ev.detail)) {
275
+ this.entry.uiFields.data = { ...ev.detail };
271
276
  this.uiFieldsChanged.emit({ newdata: ev.detail });
272
277
  }
273
278
  } })));
@@ -375,6 +380,26 @@ export class YooCardListComponent {
375
380
  }
376
381
  }
377
382
  }
383
+ }, {
384
+ "method": "fieldFetchData",
385
+ "name": "fieldFetchData",
386
+ "bubbles": true,
387
+ "cancelable": true,
388
+ "composed": true,
389
+ "docs": {
390
+ "tags": [],
391
+ "text": ""
392
+ },
393
+ "complexType": {
394
+ "original": "IFormSearch",
395
+ "resolved": "IFormSearch",
396
+ "references": {
397
+ "IFormSearch": {
398
+ "location": "import",
399
+ "path": "@shared/interfaces"
400
+ }
401
+ }
402
+ }
378
403
  }];
379
404
  }
380
405
  static get elementRef() { return "host"; }
package/dist/collection/components/entities/entity/entity.js CHANGED
@@ -35,9 +35,18 @@ export class YooEntityComponent {
35
35
  this.closed.emit(true);
36
36
  }
37
37
  getCustomModelValue(key, data, fields) {
38
+ var _a;
38
39
  const field = fields.find((f) => f.name === key);
39
40
  if ((field === null || field === void 0 ? void 0 : field.type) === FormFieldType.user && data[key]) {
40
- return getUserDisplayName(data[key]);
41
+ if (isArray(data[key]) && ((_a = data[key]) === null || _a === void 0 ? void 0 : _a.length) <= 0) {
42
+ return '';
43
+ }
44
+ else if (isArray(data[key]) && data[key].length >= 1) {
45
+ return data[key].map((u) => getUserDisplayName(u)).join(', ');
46
+ }
47
+ else {
48
+ return getUserDisplayName(data[key]);
49
+ }
41
50
  }
42
51
  else if (key === '_ect' || (field && (field.type === FormFieldType.date || field.type === FormFieldType.datetime))) {
43
52
  return pipes.dateFormat.transform(data[key], ...[!field || field.type === FormFieldType.date ? 'L' : 'L LT']);
package/dist/collection/components/form/form-dynamic/form-dynamic.js CHANGED
@@ -776,7 +776,7 @@ export class YooFormDynamicComponent {
776
776
  }
777
777
  encodeFieldName(name) {
778
778
  // eslint-disable-next-line no-useless-escape
779
- return 'f-' + (name === null || name === void 0 ? void 0 : name.replace(/\./g, '-').replace(/_/g, '-').replace(/%/g, '-').replace(/\"/g, ''));
779
+ return 'f-' + (name === null || name === void 0 ? void 0 : name.replace(/\./g, '-').replace(/_/g, '-').replace(/%/g, '-').replace(/&/g, '-').replace(/\"/g, ''));
780
780
  }
781
781
  getFieldByCode(name, host) {
782
782
  const code = this.encodeFieldName(name);
package/dist/collection/components/form/form-table/form-table.js CHANGED
@@ -142,9 +142,15 @@ export class YooFormTableComponent {
142
142
  finalValues = finalValues.concat(this.tmpValues.filter((v) => finalValues.findIndex((f) => f._id === v._id) < 0));
143
143
  }
144
144
  if (finalValues.length > 0) {
145
- return (h("yoo-grid", { class: { table: true, form: !this.readonly }, ref: (el) => (this.gridEl = el), displayType: this.displayType, collectionName: this.collectionName, entityType: this.entityType, showSearch: true, items: finalValues, model: this.model, hideAdvancedFilters: true, customModel: this.customModel, secondaryActions: this.secondaryActions, isLocal: this.isLocal, isPdf: this.isPdf, initialQuery: this.initialQuery, preventSearchReset: true, onSelected: (ev) => {
145
+ return (h("yoo-grid", { class: { table: true, form: !this.readonly }, ref: (el) => (this.gridEl = el), displayType: this.displayType, collectionName: this.collectionName, entityType: this.entityType, showSearch: true, items: finalValues, model: this.model, hideAdvancedFilters: true, customModel: this.customModel, secondaryActions: this.secondaryActions, secondaryActionsDropdown: isWeb(this.host), isLocal: this.isLocal, isPdf: this.isPdf, initialQuery: this.initialQuery, preventSearchReset: true, onSelected: (ev) => {
146
+ var _a, _b, _c;
146
147
  ev.stopPropagation();
147
- this.onSelectItem(ev.detail);
148
+ if (((_c = (_b = (_a = this.customModel) === null || _a === void 0 ? void 0 : _a.appearance) === null || _b === void 0 ? void 0 : _b.get('uifields')) === null || _c === void 0 ? void 0 : _c.length) > 0) {
149
+ //do nothing because the user can interract with the form
150
+ }
151
+ else {
152
+ this.onSelectItem(ev.detail);
153
+ }
148
154
  }, onInputChanged: (ev) => ev === null || ev === void 0 ? void 0 : ev.stopPropagation() }));
149
155
  }
150
156
  return null;
package/dist/design-system/design-system.css CHANGED
@@ -9091,6 +9091,11 @@ https://github.com/mdn/interactive-examples/issues/887
9091
9091
  src: url("assets/fonts/yoobicons/yoobicons.woff2?a88rxl") format("woff2"), url("assets/fonts/yoobicons/yoobicons.ttf?a88rxl") format("truetype"), url("assets/fonts/yoobicons/yoobicons.woff?a88rxl") format("woff"), url("assets/fonts/yoobicons/yoobicons.svg?a88rxl#yoobicons") format("svg");
9092
9092
  font-display: swap;
9093
9093
  }
9094
+ .tippy-box {
9095
+ color: var(--light, #ffffff);
9096
+ background-color: var(--dark, #000000);
9097
+ }
9098
+
9094
9099
  @font-face {
9095
9100
  font-weight: 100;
9096
9101
  font-family: "Lato";
package/dist/design-system/yoo-card-list.entry.js CHANGED
@@ -7,13 +7,14 @@ import { am as isImage, ak as isVideo, an as downloadFile, t as translate, H as
7
7
  import './index-4bbbf966.js';
8
8
  import './_commonjsHelpers-f4d11124.js';
9
9
 
10
- const cardListCss = "svg:not(:root){overflow:hidden}.bg-accent{background-color:var(--accent, #276ef1) !important}.accent{color:var(--accent, #276ef1);fill:var(--accent, #276ef1)}.bg-app-color{background-color:var(--app-color, #5a30f4) !important}.app-color{color:var(--app-color, #5a30f4);fill:var(--app-color, #5a30f4)}.bg-danger{background-color:var(--danger, #d44333) !important}.danger{color:var(--danger, #d44333);fill:var(--danger, #d44333)}.bg-dark{background-color:var(--dark, #000000) !important}.dark{color:var(--dark, #000000);fill:var(--dark, #000000)}.bg-energized{background-color:var(--energized, #ffc043) !important}.energized{color:var(--energized, #ffc043);fill:var(--energized, #ffc043)}.bg-info{background-color:var(--info, #d84c96) !important}.info{color:var(--info, #d84c96);fill:var(--info, #d84c96)}.bg-light{background-color:var(--light, #ffffff) !important}.light{color:var(--light, #ffffff);fill:var(--light, #ffffff)}.bg-stable{background-color:var(--stable, #adadad) !important}.stable{color:var(--stable, #adadad);fill:var(--stable, #adadad)}.bg-stable-alt{background-color:var(--stable-alt, #d0d0d0) !important}.stable-alt{color:var(--stable-alt, #d0d0d0);fill:var(--stable-alt, #d0d0d0)}.bg-stable-light{background-color:var(--stable-light, #f1f1f1) !important}.stable-light{color:var(--stable-light, #f1f1f1);fill:var(--stable-light, #f1f1f1)}.bg-stable-ultralight{background-color:var(--stable-ultralight, #fafafa) !important}.stable-ultralight{color:var(--stable-ultralight, #fafafa);fill:var(--stable-ultralight, #fafafa)}.bg-success{background-color:var(--success, #3aa76d) !important}.success{color:var(--success, #3aa76d);fill:var(--success, #3aa76d)}.bg-text-color{background-color:var(--text-color, #807f83) !important}.text-color{color:var(--text-color, #807f83);fill:var(--text-color, #807f83)}.bg-warning{background-color:var(--warning, #ed6e33) !important}.warning{color:var(--warning, #ed6e33);fill:var(--warning, #ed6e33)}.bg-wood{background-color:var(--wood, #99644c) !important}.wood{color:var(--wood, #99644c);fill:var(--wood, #99644c)}:host{display:block;height:100%;background:var(--card-list-background);cursor:pointer}:host yoo-tag.distance{--padding:0;margin-left:var(--spacing-08, 0.5rem)}:host .outer-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding-bottom:0.25rem;border-bottom:var(--border-bottom-outer-container);-webkit-transition:background-color 0.3s ease, padding 0.3s ease;transition:background-color 0.3s ease, padding 0.3s ease}:host .outer-container .content-container{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:var(--justify-content-content-container);justify-content:var(--justify-content-content-container);-ms-flex-pack:center;justify-content:center;width:100%;margin-right:var(--margin-content-container-right);margin-left:var(--margin-content-container-left);overflow:hidden}:host .outer-container .content-container.has-image{margin-left:0}:host .outer-container .content-container .heading-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:start;align-items:flex-start;-ms-flex-align:center;align-items:center;margin-bottom:var(--spacing-02, 0.125rem);font-size:var(--font-size-16, 1rem);line-height:1.5}:host .outer-container .content-container .heading-container .margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .content-container .heading-container yoo-avatars{margin-right:0.125rem}:host .outer-container .content-container .heading-container .card-heading{-ms-flex:1;flex:1;min-width:0;color:var(--dark, #000000)}:host .outer-container .content-container .heading-container .card-heading .heading-title{display:-webkit-box;max-height:calc((var(--font-size-16, 1rem) + 0.125rem) * 2);overflow:hidden;line-height:calc(var(--font-size-16, 1rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}:host .outer-container .content-container .heading-container .card-heading .heading-title span{display:block;overflow:hidden;text-overflow:ellipsis}:host .outer-container .content-container .heading-container .card-heading .heading-circle{display:inline-block;width:0.5rem;height:0.5rem;margin-right:0.2rem;border-radius:50%}:host .outer-container .content-container .heading-container .card-heading *{-webkit-margin-before:0;margin-block-start:0;-webkit-margin-after:0;margin-block-end:0}:host .outer-container .content-container .heading-container .card-heading .ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .subheading-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-bottom:var(--spacing-02, 0.125rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem)}:host .outer-container .content-container .subheading-container html,:host .outer-container .content-container .subheading-container body,:host .outer-container .content-container .subheading-container div:not([class^=fr-]),:host .outer-container .content-container .subheading-container span:not([class^=fr-]),:host .outer-container .content-container .subheading-container img:not([class^=fr-]),:host .outer-container .content-container .subheading-container applet,:host .outer-container .content-container .subheading-container object,:host .outer-container .content-container .subheading-container iframe,:host .outer-container .content-container .subheading-container h1,:host .outer-container .content-container .subheading-container h2,:host .outer-container .content-container .subheading-container h3,:host .outer-container .content-container .subheading-container h4,:host .outer-container .content-container .subheading-container h5,:host .outer-container .content-container .subheading-container h6,:host .outer-container .content-container .subheading-container p,:host .outer-container .content-container .subheading-container blockquote,:host .outer-container .content-container .subheading-container pre,:host .outer-container .content-container .subheading-container a,:host .outer-container .content-container .subheading-container abbr,:host .outer-container .content-container .subheading-container acronym,:host .outer-container .content-container .subheading-container address,:host .outer-container .content-container .subheading-container big,:host .outer-container .content-container .subheading-container cite,:host .outer-container .content-container .subheading-container code,:host .outer-container .content-container .subheading-container del,:host .outer-container .content-container .subheading-container dfn,:host .outer-container .content-container .subheading-container em,:host .outer-container .content-container .subheading-container font,:host .outer-container .content-container .subheading-container ins,:host .outer-container .content-container .subheading-container kbd,:host .outer-container .content-container .subheading-container q,:host .outer-container .content-container .subheading-container s,:host .outer-container .content-container .subheading-container samp,:host .outer-container .content-container .subheading-container small,:host .outer-container .content-container .subheading-container strike,:host .outer-container .content-container .subheading-container strong,:host .outer-container .content-container .subheading-container sub,:host .outer-container .content-container .subheading-container sup,:host .outer-container .content-container .subheading-container tt,:host .outer-container .content-container .subheading-container var,:host .outer-container .content-container .subheading-container dl,:host .outer-container .content-container .subheading-container dt,:host .outer-container .content-container .subheading-container dd,:host .outer-container .content-container .subheading-container ol,:host .outer-container .content-container .subheading-container ul,:host .outer-container .content-container .subheading-container li,:host .outer-container .content-container .subheading-container fieldset,:host .outer-container .content-container .subheading-container form,:host .outer-container .content-container .subheading-container label,:host .outer-container .content-container .subheading-container legend,:host .outer-container .content-container .subheading-container table,:host .outer-container .content-container .subheading-container caption,:host .outer-container .content-container .subheading-container tbody,:host .outer-container .content-container .subheading-container tfoot,:host .outer-container .content-container .subheading-container thead,:host .outer-container .content-container .subheading-container tr,:host .outer-container .content-container .subheading-container th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host .outer-container .content-container .subheading-container .text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .avatar-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end;margin-top:0.5rem;padding-right:0.3rem}:host .outer-container .content-container .avatar-container yoo-avatar{margin-right:0.75rem;margin-left:0.15rem}:host .outer-container .content-container .action-button-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end}:host .outer-container .content-container .slot-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between;color:var(--text-color, #807f83);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .slot-container .inner-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}:host(.firefox) .content-container{margin-bottom:0}:host(.web):not(.framed) .outer-container{padding-top:1rem;padding-bottom:1rem;background-color:transparent}:host(.web) .outer-container .card-list-image-container.large{min-width:3.875rem}:host(.web) .outer-container .card-list-image-container.medium{min-width:2.875rem}:host(.web) .outer-container .card-list-image-container.small{min-width:2.375rem}:host(.web) .outer-container .content-container .top-container .badges-container.show-more{position:relative;overflow:visible}:host(.web) .outer-container .content-container .top-container .badges-container.show-more .more-button{position:absolute;top:0;right:0;bottom:auto;left:auto;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;width:2rem;height:1.125rem;font-size:var(--font-size-18, 1.125rem)}:host(.web) .outer-container .content-container .top-container .badges-container.show-more .more-button yoo-icon{padding-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000)}:host(.locations) .outer-container .content-container .top-container .heading-container .date-card-text{padding-right:var(--spacing-16, 1rem)}:host(.locations.map) .outer-container{-ms-flex-align:center;align-items:center;background:var(--light, #ffffff)}:host(.collapsible) .outer-container,:host(.locations.no-kpi:not(.framed)) .outer-container{-ms-flex-align:start;align-items:flex-start;width:auto;border-bottom:none;border-radius:0.5rem}:host(.collapsible) .outer-container .content-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container{margin:0.5rem 0 0;border:none}:host(.collapsible) .outer-container .content-container .top-container .heading-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container .top-container .heading-container{-ms-flex-pack:justify;justify-content:space-between;padding-top:0 !important;padding-right:var(--spacing-08, 0.5rem)}:host(.collapsible) .outer-container .content-container .top-container .subheading-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container .top-container .subheading-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.collapsible) .outer-container .content-container{margin-top:0}:host(.locations.no-kpi.map) .outer-container{-ms-flex-align:start;align-items:flex-start;max-width:18.75rem}:host(.locations.no-kpi:not(.framed)) yoo-tag.distance{margin-right:0.75rem}:host(.web.framed) .outer-container .content-container .top-container .heading-container{font-size:var(--font-size-16, 1rem)}:host(.android) .outer-container .content-container .top-container .heading-container .heading-title{display:-webkit-box;max-height:calc((var(--font-size-18, 1.125rem) + 0.25rem) * 2);overflow:hidden;line-height:calc(var(--font-size-18, 1.125rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}:host{--margin-content-container-left:0;--margin-content-container-right:0;--padding-content-container:var(--spacing-04, 0.25rem) 0 var(--spacing-08, 0.5rem) 0;--border-bottom-outer-container:var(--border-width-01, 0.0625rem) solid var(--stable-alt-40, rgba(208, 208, 208, 0.4));--overflow-card-heading-text:hidden;--text-overflow-card-heading-text:ellipsis;--white-space-card-heading-text:normal;--padding-right-card-heading:unset;--max-height-heading:48px;--card-list-background:none;--justify-content-content-container:flex-start;--max-card-heading-height:26px;--height-lessons-outer-container:2.5rem;--heading-font-size:var(--font-size-14, 0.875rem)}:host yoo-truncate{--max-lines:2}:host .heart-icon{width:var(--icon-size-05, 4rem)}:host .heart-icon yoo-lottie{width:var(--icon-size-02, 1.5rem);height:var(--icon-size-05, 4rem);margin:auto}:host .heart-icon yoo-lottie yoo-icon{top:1.3rem}:host .outer-container{padding-top:var(--spacing-04, 0.25rem)}:host .outer-container.tapped{background-color:var(--stable-light, #f1f1f1);-webkit-transition:background-color 0.3s ease;transition:background-color 0.3s ease}:host .outer-container .video-container{width:100%;max-height:350px;padding-top:var(--spacing-08, 0.5rem)}:host .outer-container .rank-container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;min-width:1.5rem;color:var(--stable, #adadad);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .heading-container yoo-tag.margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .content-container .heading-container .progress-box{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;color:var(--dark, #000000)}:host .outer-container .content-container .heading-container .progress-box .icon-text{font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .tags-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;padding-bottom:var(--spacing-04, 0.25rem);overflow:hidden;line-height:15px}:host .outer-container .content-container .tags-container yoo-tag,:host .outer-container .content-container .tags-container .card-icon{margin:var(--spacing-04, 0.25rem) var(--spacing-08, 0.5rem) var(--spacing-02, 0.125rem) var(--spacing-02, 0.125rem)}:host .outer-container .content-container .tags-container .hashtag{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:0.4375rem;color:var(--text-color, #807f83);font-size:var(--font-size-12, 0.75rem);-webkit-transform:translateY(0.125rem);transform:translateY(0.125rem)}:host .outer-container .content-container .tags-container .card-icon{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}:host .outer-container .content-container .tags-container .card-icon yoo-icon{margin-right:0.4375rem}:host .outer-container .content-container .tags-container .row-action{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;line-height:1rem}:host .outer-container .content-container .top-container .video-container{display:-ms-inline-flexbox;display:inline-flex;height:230px}:host .outer-container .content-container .top-container .heading-container .date-card-text{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-left:auto;padding:0 var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem);text-align:right}:host .outer-container .content-container .top-container .heading-container .points-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding-right:var(--spacing-08, 0.5rem);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .top-container .heading-container .points-container .points{padding:0 0.35rem}:host .outer-container .content-container .top-container .flex{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .outer-container.active{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host .outer-container .image-video-preview{width:12.5rem;height:6.25rem;padding:var(--spacing-08, 0.5rem);pointer-events:none}:host .outer-container .image-video-preview yoo-img{--border-radius:var(--border-radius-08, 0.5rem);height:100%}:host(.mobile.rtl) .outer-container .content-container{margin-right:var(--margin-content-container-left);margin-left:var(--margin-content-container-right)}:host(.mobile.rtl) .outer-container .content-container.has-image{margin-right:0}:host(.mobile.rtl) .outer-container .content-container .tags-container yoo-tag,:host(.mobile.rtl) .outer-container .content-container .tags-container .card-icon{margin:var(--spacing-04, 0.25rem) var(--spacing-02, 0.125rem) var(--spacing-02, 0.125rem) var(--spacing-08, 0.5rem)}:host(.mobile.rtl) .outer-container .content-container .top-container .subheading-container{margin-right:0;margin-left:var(--spacing-32, 2rem)}:host(.current) .outer-container .rank-container{color:var(--app-color, #5a30f4)}:host(.current) .outer-container .content-container .leaderboard .heading-container .card-heading{color:var(--app-color, #5a30f4)}:host(.current.leaderboard){background-color:var(--app-color, #5a30f4) !important}:host(.current.leaderboard) .outer-container .rank-container{color:var(--light, #ffffff)}:host(.current.leaderboard) .outer-container .content-container .leaderboard .heading-container .card-heading{color:var(--light, #ffffff)}:host(.current.leaderboard) .outer-container .points-container{color:var(--light, #ffffff)}:host(.leaderboard.userranks){height:var(--spacing-40, 2.5rem)}:host(.leaderboard.userranks) .outer-container{height:100%;padding:0 !important}:host(.leaderboard.userranks) .icon-container{color:var(--app-color, #5a30f4) !important}:host(.leaderboard){padding-left:var(--spacing-16, 1rem);color:var(--dark, #000000);background-color:var(--light, #ffffff);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));opacity:1}:host(.secondary-view){--border-bottom-outer-container:0px;background:transparent}:host(.secondary-view) .outer-container{padding-top:var(--spacing-08, 0.5rem)}:host(.secondary-view) .outer-container .question-content{border-bottom:var(--border-bottom-outer-container)}:host(.secondary-view) .outer-container .content-container .heading-container{font-size:var(--font-size-16, 1rem)}:host(.secondary-view) .outer-container .content-container .heading-container .date-card-text{display:block;padding:0;line-height:normal;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.secondary-view) .outer-container .content-container .translate-container{position:relative;margin-bottom:var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-weight:normal;font-size:var(--font-size-16, 1rem);font-style:normal;font-stretch:normal;line-height:1;letter-spacing:normal}:host(.secondary-view) .outer-container .content-container .translate-container.active{margin-left:var(--spacing-04, 0.25rem);padding-left:var(--spacing-08, 0.5rem);border-left:var(--border-width-02, 0.125rem) solid var(--stable-alt, #d0d0d0)}:host(.secondary-view) .outer-container .content-container .translate-container .text{margin-bottom:var(--spacing-04, 0.25rem);color:var(--dark, #000000)}:host(.secondary-view) .outer-container .content-container .translate-container .text html,:host(.secondary-view) .outer-container .content-container .translate-container .text body,:host(.secondary-view) .outer-container .content-container .translate-container .text div:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text span:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text img:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text applet,:host(.secondary-view) .outer-container .content-container .translate-container .text object,:host(.secondary-view) .outer-container .content-container .translate-container .text iframe,:host(.secondary-view) .outer-container .content-container .translate-container .text h1,:host(.secondary-view) .outer-container .content-container .translate-container .text h2,:host(.secondary-view) .outer-container .content-container .translate-container .text h3,:host(.secondary-view) .outer-container .content-container .translate-container .text h4,:host(.secondary-view) .outer-container .content-container .translate-container .text h5,:host(.secondary-view) .outer-container .content-container .translate-container .text h6,:host(.secondary-view) .outer-container .content-container .translate-container .text p,:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote,:host(.secondary-view) .outer-container .content-container .translate-container .text pre,:host(.secondary-view) .outer-container .content-container .translate-container .text a,:host(.secondary-view) .outer-container .content-container .translate-container .text abbr,:host(.secondary-view) .outer-container .content-container .translate-container .text acronym,:host(.secondary-view) .outer-container .content-container .translate-container .text address,:host(.secondary-view) .outer-container .content-container .translate-container .text big,:host(.secondary-view) .outer-container .content-container .translate-container .text cite,:host(.secondary-view) .outer-container .content-container .translate-container .text code,:host(.secondary-view) .outer-container .content-container .translate-container .text del,:host(.secondary-view) .outer-container .content-container .translate-container .text dfn,:host(.secondary-view) .outer-container .content-container .translate-container .text em,:host(.secondary-view) .outer-container .content-container .translate-container .text font,:host(.secondary-view) .outer-container .content-container .translate-container .text ins,:host(.secondary-view) .outer-container .content-container .translate-container .text kbd,:host(.secondary-view) .outer-container .content-container .translate-container .text q,:host(.secondary-view) .outer-container .content-container .translate-container .text s,:host(.secondary-view) .outer-container .content-container .translate-container .text samp,:host(.secondary-view) .outer-container .content-container .translate-container .text small,:host(.secondary-view) .outer-container .content-container .translate-container .text strike,:host(.secondary-view) .outer-container .content-container .translate-container .text strong,:host(.secondary-view) .outer-container .content-container .translate-container .text sub,:host(.secondary-view) .outer-container .content-container .translate-container .text sup,:host(.secondary-view) .outer-container .content-container .translate-container .text tt,:host(.secondary-view) .outer-container .content-container .translate-container .text var,:host(.secondary-view) .outer-container .content-container .translate-container .text dl,:host(.secondary-view) .outer-container .content-container .translate-container .text dt,:host(.secondary-view) .outer-container .content-container .translate-container .text dd,:host(.secondary-view) .outer-container .content-container .translate-container .text ol,:host(.secondary-view) .outer-container .content-container .translate-container .text ul,:host(.secondary-view) .outer-container .content-container .translate-container .text li,:host(.secondary-view) .outer-container .content-container .translate-container .text fieldset,:host(.secondary-view) .outer-container .content-container .translate-container .text form,:host(.secondary-view) .outer-container .content-container .translate-container .text label,:host(.secondary-view) .outer-container .content-container .translate-container .text legend,:host(.secondary-view) .outer-container .content-container .translate-container .text table,:host(.secondary-view) .outer-container .content-container .translate-container .text caption,:host(.secondary-view) .outer-container .content-container .translate-container .text tbody,:host(.secondary-view) .outer-container .content-container .translate-container .text tfoot,:host(.secondary-view) .outer-container .content-container .translate-container .text thead,:host(.secondary-view) .outer-container .content-container .translate-container .text tr,:host(.secondary-view) .outer-container .content-container .translate-container .text th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote{padding-left:1rem;border-left:var(--border-width-04, 0.25rem) solid var(--stable, #adadad)}:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote:last-of-type blockquote p:last-of-type,:host(.secondary-view) .outer-container .content-container .translate-container .text p:last-of-type{padding-top:0;padding-bottom:0}:host(.secondary-view) .outer-container .content-container .translate-container .text ol,:host(.secondary-view) .outer-container .content-container .translate-container .text ul{margin:revert;padding:revert}:host(.secondary-view) .outer-container .content-container .translate-container .text h1{display:block;margin-top:0.67em;margin-right:0;margin-bottom:0.67em;margin-left:0;font-weight:bold;font-size:2em}:host(.secondary-view) .outer-container .content-container .translate-container .text h2{display:block;margin-top:0.83em;margin-right:0;margin-bottom:0.83em;margin-left:0;font-weight:bold;font-size:1.5em}:host(.secondary-view) .outer-container .content-container .translate-container .text h3{display:block;margin-top:1em;margin-right:0;margin-bottom:1em;margin-left:0;font-weight:bold;font-size:1.17em}:host(.secondary-view) .outer-container .content-container .translate-container .text h4{display:block;margin-top:1.33em;margin-right:0;margin-bottom:1.33em;margin-left:0;font-weight:bold}:host(.secondary-view) .outer-container .content-container .translate-container .text h5{display:block;margin-top:1.67em;margin-right:0;margin-bottom:1.67em;margin-left:0;font-weight:bold;font-size:0.83em}:host(.secondary-view) .outer-container .content-container .translate-container .text h6{display:block;margin-top:2.33em;margin-right:0;margin-bottom:2.33em;margin-left:0;font-weight:bold;font-size:0.67em}:host(.secondary-view) .outer-container .content-container .translate-container .text strong{font-weight:bold}:host(.secondary-view) .outer-container .content-container .translate-container .text em{font-style:italic}:host(.secondary-view) .outer-container .content-container .subheading-container{display:block;max-height:initial;overflow:visible;color:var(--dark, #000000);font-size:var(--font-size-16, 1rem);line-height:20px;white-space:pre-wrap;word-wrap:break-word}:host(.secondary-view) .outer-container .content-container .subheading-container html,:host(.secondary-view) .outer-container .content-container .subheading-container body,:host(.secondary-view) .outer-container .content-container .subheading-container div:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container span:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container img:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container applet,:host(.secondary-view) .outer-container .content-container .subheading-container object,:host(.secondary-view) .outer-container .content-container .subheading-container iframe,:host(.secondary-view) .outer-container .content-container .subheading-container h1,:host(.secondary-view) .outer-container .content-container .subheading-container h2,:host(.secondary-view) .outer-container .content-container .subheading-container h3,:host(.secondary-view) .outer-container .content-container .subheading-container h4,:host(.secondary-view) .outer-container .content-container .subheading-container h5,:host(.secondary-view) .outer-container .content-container .subheading-container h6,:host(.secondary-view) .outer-container .content-container .subheading-container p,:host(.secondary-view) .outer-container .content-container .subheading-container blockquote,:host(.secondary-view) .outer-container .content-container .subheading-container pre,:host(.secondary-view) .outer-container .content-container .subheading-container a,:host(.secondary-view) .outer-container .content-container .subheading-container abbr,:host(.secondary-view) .outer-container .content-container .subheading-container acronym,:host(.secondary-view) .outer-container .content-container .subheading-container address,:host(.secondary-view) .outer-container .content-container .subheading-container big,:host(.secondary-view) .outer-container .content-container .subheading-container cite,:host(.secondary-view) .outer-container .content-container .subheading-container code,:host(.secondary-view) .outer-container .content-container .subheading-container del,:host(.secondary-view) .outer-container .content-container .subheading-container dfn,:host(.secondary-view) .outer-container .content-container .subheading-container em,:host(.secondary-view) .outer-container .content-container .subheading-container font,:host(.secondary-view) .outer-container .content-container .subheading-container ins,:host(.secondary-view) .outer-container .content-container .subheading-container kbd,:host(.secondary-view) .outer-container .content-container .subheading-container q,:host(.secondary-view) .outer-container .content-container .subheading-container s,:host(.secondary-view) .outer-container .content-container .subheading-container samp,:host(.secondary-view) .outer-container .content-container .subheading-container small,:host(.secondary-view) .outer-container .content-container .subheading-container strike,:host(.secondary-view) .outer-container .content-container .subheading-container strong,:host(.secondary-view) .outer-container .content-container .subheading-container sub,:host(.secondary-view) .outer-container .content-container .subheading-container sup,:host(.secondary-view) .outer-container .content-container .subheading-container tt,:host(.secondary-view) .outer-container .content-container .subheading-container var,:host(.secondary-view) .outer-container .content-container .subheading-container dl,:host(.secondary-view) .outer-container .content-container .subheading-container dt,:host(.secondary-view) .outer-container .content-container .subheading-container dd,:host(.secondary-view) .outer-container .content-container .subheading-container ol,:host(.secondary-view) .outer-container .content-container .subheading-container ul,:host(.secondary-view) .outer-container .content-container .subheading-container li,:host(.secondary-view) .outer-container .content-container .subheading-container fieldset,:host(.secondary-view) .outer-container .content-container .subheading-container form,:host(.secondary-view) .outer-container .content-container .subheading-container label,:host(.secondary-view) .outer-container .content-container .subheading-container legend,:host(.secondary-view) .outer-container .content-container .subheading-container table,:host(.secondary-view) .outer-container .content-container .subheading-container caption,:host(.secondary-view) .outer-container .content-container .subheading-container tbody,:host(.secondary-view) .outer-container .content-container .subheading-container tfoot,:host(.secondary-view) .outer-container .content-container .subheading-container thead,:host(.secondary-view) .outer-container .content-container .subheading-container tr,:host(.secondary-view) .outer-container .content-container .subheading-container th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host(.secondary-view) .outer-container .content-container .subheading-container blockquote{padding-left:1rem;border-left:var(--border-width-04, 0.25rem) solid var(--stable, #adadad)}:host(.secondary-view) .outer-container .content-container .subheading-container blockquote:last-of-type blockquote p:last-of-type,:host(.secondary-view) .outer-container .content-container .subheading-container p:last-of-type{padding-top:0;padding-bottom:0}:host(.secondary-view) .outer-container .content-container .subheading-container ol,:host(.secondary-view) .outer-container .content-container .subheading-container ul{margin:revert;padding:revert}:host(.secondary-view) .outer-container .content-container .subheading-container h1{display:block;margin-top:0.67em;margin-right:0;margin-bottom:0.67em;margin-left:0;font-weight:bold;font-size:2em}:host(.secondary-view) .outer-container .content-container .subheading-container h2{display:block;margin-top:0.83em;margin-right:0;margin-bottom:0.83em;margin-left:0;font-weight:bold;font-size:1.5em}:host(.secondary-view) .outer-container .content-container .subheading-container h3{display:block;margin-top:1em;margin-right:0;margin-bottom:1em;margin-left:0;font-weight:bold;font-size:1.17em}:host(.secondary-view) .outer-container .content-container .subheading-container h4{display:block;margin-top:1.33em;margin-right:0;margin-bottom:1.33em;margin-left:0;font-weight:bold}:host(.secondary-view) .outer-container .content-container .subheading-container h5{display:block;margin-top:1.67em;margin-right:0;margin-bottom:1.67em;margin-left:0;font-weight:bold;font-size:0.83em}:host(.secondary-view) .outer-container .content-container .subheading-container h6{display:block;margin-top:2.33em;margin-right:0;margin-bottom:2.33em;margin-left:0;font-weight:bold;font-size:0.67em}:host(.secondary-view) .outer-container .content-container .subheading-container strong{font-weight:bold}:host(.secondary-view) .outer-container .content-container .subheading-container em{font-style:italic}:host(.secondary-view) .outer-container .content-container .subheading-container.comment-image{--border-radius:var(--border-radius-16, 1rem);margin-top:9px;overflow:hidden}:host(.secondary-view) .outer-container .content-container .subheading-container span.with-markdown{white-space:normal}:host(.secondary-view) .outer-container .content-container .subheading-container span.with-markdown img{width:100%;max-width:initial !important}:host(.secondary-view) .outer-container .content-container .top-container{padding:var(--spacing-08, 0.5rem);background:var(--stable-light-60, rgba(241, 241, 241, 0.6));border-radius:var(--border-radius-04, 0.25rem)}:host(.secondary-view) .outer-container .content-container .top-container .card-heading{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;width:100%;padding-right:var(--spacing-08, 0.5rem)}:host(.secondary-view) .outer-container .content-container .top-container .card-heading .card-heading-text{font-weight:var(--font-weight-700, 700)}:host(.secondary-view) .outer-container .content-container .top-container .heading-container .heading-title{display:block}:host(.secondary-view) .outer-container .content-container .top-container .heading-container .heading-title span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.secondary-view) .outer-container .content-container .top-container span{display:block;font-size:var(--font-size-16, 1rem)}:host(.secondary-view) .outer-container .content-container .slot-container yoo-img{margin-right:auto}:host(.secondary-view) .tags-container{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center;margin-top:-0.85rem;margin-left:1.875rem;font-size:var(--font-size-14, 0.875rem)}:host(.secondary-view) .tags-container .card-icon.right{margin-left:auto}:host(.secondary-view) .tags-container .card-icon.right yoo-icon{margin:0}:host(.secondary-view) .tags-container .row-action{width:100%;margin-top:-0.875rem;margin-left:1.25rem}:host(.secondary-view) .tags-container .row-action span{color:var(--dark, #000000)}:host(.secondary-view) .tags-container .bottom-action{margin-right:1.25rem;color:var(--text-color, #807f83)}:host(.questionsAnswers) .tags-container{margin-left:2.8125rem}:host(.questionsAnswers) .tags-container .card-icon:not(.heart-icon){margin:var(--spacing-16, 1rem) var(--spacing-16, 1rem) 0 0}:host(.questionsAnswers) .tags-container .row-action{margin-top:var(--spacing-08, 0.5rem);margin-left:0}:host(.entitycomments) .tags-container,:host(.feedsComments) .tags-container{margin-left:1.75rem}:host(.userranks) .outer-container,:host(.userhighscores) .outer-container{-ms-flex-align:center;align-items:center;padding:var(--spacing-08, 0.5rem) 0 !important;background-color:transparent;border-bottom:0}:host(.userranks) .heading-container,:host(.userhighscores) .heading-container{word-wrap:break-word}:host(.active) .outer-container{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host(.hoverable):hover .outer-container{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host(.filesFolders) .outer-container .content-container .subheading-container,:host(.files) .outer-container .content-container .subheading-container{margin:0;font-size:var(--font-size-12, 0.75rem)}:host(.filesFolders) .outer-container .content-container .subheading-container em,:host(.files) .outer-container .content-container .subheading-container em{color:var(--dark, #000000);font-weight:bold;background:#FDFB2F}:host(.locations.external) .outer-container .content-container .subheading-container{white-space:normal}:host(.products) .outer-container .content-container{border-bottom:none}:host(.outofstock),:host(.hidden){opacity:0.5}:host(.productweightpair) .outer-container .content-container .heading-container .date-card-text{color:var(--dark, #000000)}:host(.catalog-display.history) .outer-container .content-container{text-align:left}:host(.catalog-display.history) .outer-container .content-container .top-container .price{font-size:var(--font-size-12, 0.75rem)}:host(.catalog-display.history) .outer-container .content-container .top-container .tags-container{padding-bottom:var(--spacing-04, 0.25rem)}:host(.catalog-display){width:100%}:host(.catalog-display) .outer-container{-ms-flex-align:start;align-items:flex-start;font-size:var(--font-size-14, 0.875rem);border:none !important}:host(.catalog-display) .outer-container .content-container{-ms-flex-pack:center;justify-content:center;margin-left:1rem;padding:0;border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host(.catalog-display) .outer-container .content-container .top-container .card-heading{font-size:var(--font-size-14, 0.875rem)}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container{min-height:1rem;max-height:0.8rem;color:var(--dark, #000000);font-size:var(--font-size-12, 0.75rem);line-height:1rem}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container .subheading-grey{color:var(--stable, #adadad)}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container .subheading-price{color:var(--dark, #000000)}:host(.catalog-display) .outer-container .content-container .top-container .price{color:var(--text-color, #807f83)}:host(.catalog-display) .outer-container .content-container .top-container .tags-container{overflow:initial;line-height:normal}:host(.catalog-display.no-border) .outer-container .content-container{border-bottom:none}:host(.productbatch.archived) .outer-container .content-container{opacity:0.5}:host(.offline:not(.missions)) .outer-container{opacity:0.7}:host(.offline:not(.missions))::before,:host(.offline:not(.missions))::after{position:absolute;top:0;right:0;border-color:transparent;border-style:solid;content:\"\"}:host(.offline:not(.missions))::after{border-width:0.5em;border-top-color:var(--energized, #ffc043);border-right-color:var(--energized, #ffc043)}:host(.notifications) .outer-container{padding-top:var(--spacing-04, 0.25rem)}:host(.notes) .outer-container .content-container .heading-container .card-heading .heading-title{display:-webkit-box;max-height:calc((var(--font-size-18, 1.125rem) + 0.125rem) * 1);overflow:hidden;line-height:calc(var(--font-size-18, 1.125rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:1;}:host(.no-text-break) .outer-container .content-container .top-container .heading-container .card-heading{white-space:normal}:host(.lessons.web) .outer-container{height:var(--height-lessons-outer-container);min-height:0;margin:var(--spacing-04, 0.25rem) 0;padding-left:var(--spacing-08, 0.5rem);border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:var(--card-shadow-2, 0 0.3125rem 0.9375rem 0 rgba(40, 47, 54, 0.08));box-shadow:var(--card-shadow-2, 0 0.3125rem 0.9375rem 0 rgba(40, 47, 54, 0.08))}:host(.lessons.web) .outer-container .content-container{border-bottom:none}:host(.lessons.web) .outer-container .content-container .top-container{display:-ms-flexbox;display:flex}:host(.lessons.web) .outer-container .content-container .heading-container{-ms-flex:1;flex:1;width:75%;padding-right:var(--spacing-08, 0.5rem);font-size:var(--heading-font-size)}:host(.lessons.web) .outer-container .content-container .heading-container .card-heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding-top:0}:host(.lessons.web.finished) .outer-container{background-color:var(--app-color, #5a30f4)}:host(.lessons.web.finished) .outer-container .card-heading,:host(.lessons.web.finished) .outer-container .icon-container{color:var(--light-10, rgba(255, 255, 255, 0.1))}:host(.lessons.web.locked) .outer-container{background-color:var(--stable-alt, #d0d0d0)}:host(.lessons.web.locked) .outer-container .card-heading{color:var(--text-color, #807f83)}:host(.lessons.web.locked) .outer-container .top-container yoo-avatar{margin:0 0.75rem}:host(.missions.finished:not(.grid-cell)) .outer-container{padding-bottom:var(--spacing-16, 1rem)}:host(.courseselection) .outer-container .content-container{-ms-flex-pack:center;justify-content:center;margin-left:0}:host(.courseselection) .outer-container .content-container .top-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host(.courseselection) .outer-container .content-container .top-container .heading-container{-ms-flex-order:2;order:2;font-size:var(--font-size-16, 1rem)}:host(.courseselection) .outer-container .content-container .top-container .subheading-container{-ms-flex-order:1;order:1;color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem)}:host(.courseselection) .outer-container .content-container .top-container .subheading-container .todo{font-size:var(--font-size-14, 0.875rem)}:host(.courseselection) .outer-container .content-container .top-container .tags-container{padding-bottom:0}:host(.questions) .outer-container{padding-bottom:0;border-bottom:0}:host(.questions) .outer-container .content-container .top-container .heading-container{max-height:1.25rem;margin-bottom:0}:host(.questions) .outer-container .content-container .top-container .heading-container .card-heading .heading-title{color:var(--dark, #000000);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:var(--spacing-04, 0.25rem)}:host(.questions) .question-container.no-img{padding-top:var(--spacing-04, 0.25rem)}:host(.questions) .question-container.no-img .question-content{height:auto}:host(.questions) .question-container .question-content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:98px;margin-left:var(--spacing-08, 0.5rem);padding-bottom:var(--spacing-16, 1rem);border-bottom:var(--border-bottom-outer-container)}:host(.questions) .question-container .question-content .question-title{margin-bottom:var(--spacing-08, 0.5rem);font-weight:var(--font-weight-700, 700);font-size:var(--font-size-18, 1.125rem);word-break:break-word}:host(.questions) .question-container .question-content .question-icons{display:-ms-flexbox;display:flex;color:var(--stable-alt, #d0d0d0);font-size:var(--icon-size-01, 1rem)}:host(.questions) .question-container .question-content .question-icons .inner-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000);font-size:var(--font-size-18, 1.125rem)}:host(.questions) .question-container .question-content .question-icons .inner-container yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host(.questions) .question-container .question-content .subheadings{display:-ms-flexbox;display:flex;color:var(--text-color, #807f83)}:host(.questions) .question-container .question-content .subheadings .subheading-container{padding-right:var(--spacing-08, 0.5rem);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .question-content .subheadings .date-card-text{margin-right:var(--spacing-08, 0.5rem);color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .question-content .tags-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;overflow:hidden}:host(.questions) .question-container .question-content .tags-container .hashtag{margin-right:0.4375rem;color:var(--app-color, #5a30f4);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .image-video-preview{min-width:7.5rem;height:98px;padding:var(--spacing-08, 0.5rem);pointer-events:none}:host(.questions) .question-container .image-video-preview yoo-img{--border-radius:var(--border-radius-08, 0.5rem)}:host(.questions) .question-container .image-video-preview yoo-videoplayer-core{overflow:hidden;border-radius:var(--border-radius-08, 0.5rem)}:host(.card-feed) .outer-container{display:none}:host(.card-feed) .question-container{-ms-flex-pack:initial !important;justify-content:initial !important;background:var(--light-10, rgba(255, 255, 255, 0.1));border-bottom:none !important;-webkit-box-shadow:var(--grid-frame-shadow, 0 0.3125rem 0.9375rem 0.1875rem rgba(40, 47, 54, 0.15));box-shadow:var(--grid-frame-shadow, 0 0.3125rem 0.9375rem 0.1875rem rgba(40, 47, 54, 0.15))}:host(.card-feed) .question-container .image-video-preview{-ms-flex-negative:0;flex-shrink:0;-ms-flex-order:1;order:1;width:130px;height:89px;padding-right:var(--spacing-16, 1rem)}:host(.card-feed) .question-container .image-video-preview yoo-videoplayer-core{overflow:hidden;border-radius:5px}:host(.card-feed) .question-container .question-content{-ms-flex-pack:initial !important;justify-content:initial !important;-ms-flex-order:2;order:2;margin-left:0;padding:var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) 0}:host(.selected-content) .question-container{padding:0}:host(.selected-content) .question-container .image-video-preview{min-width:2rem;height:1.5rem;padding-left:0}:host(.selected-content) .question-container .question-content{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;height:auto;margin:0;padding-bottom:0;border-bottom:none}:host(.selected-content) .question-container .question-content .question-title{margin:0;font-weight:var(--font-weight-400, 400);font-size:var(--font-size-16, 1rem)}:host(.selected-content) .outer-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.selected-content) .outer-container .content-container .heading-container{margin-bottom:var(--spacing-02, 0.125rem)}:host(.selected-content) .outer-container .content-container .heading-container .card-heading .heading-title span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.selected-content) .outer-container .content-container .uifield-container{display:none}:host(.web.grid-cell){overflow:hidden}:host(.web.grid-cell) .outer-container{padding-top:var(--spacing-08, 0.5rem);padding-bottom:var(--spacing-08, 0.5rem)}:host(.web.grid-cell) .outer-container .content-container .tags-container{-ms-flex-wrap:initial;flex-wrap:initial}:host(.mobile.autocomplete-selection-mode) .question-container .question-title{font-size:var(--font-size-16, 1rem)}:host(.mobile.autocomplete-selection-mode) .subheading-container{margin-right:var(--spacing-32, 2rem)}:host(.no-border-bottom.mobile) .outer-container{border-bottom:none}:host(.no-border-bottom.mobile) .question-container .question-content{border-bottom:none}:host(.item-disabled){cursor:default}:host(.kanban) .outer-container{padding-top:0;padding-bottom:0}:host(.web.videocallusers) .outer-container{padding-top:0;padding-bottom:0}:host(.web.firefox) .outer-container{height:auto}:host(.violetproducts) .outer-container,:host(.violetbasketitems) .outer-container{-ms-flex-align:center;align-items:center}:host(.violetproducts) .outer-container yoo-icon.arrow,:host(.violetbasketitems) .outer-container yoo-icon.arrow{margin-top:var(--spacing-04, 0.25rem);margin-right:var(--spacing-04, 0.25rem);margin-bottom:auto}:host(.violetproducts) .content-container,:host(.violetbasketitems) .content-container{border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host(.form-permission) .outer-container{height:auto}:host(.pages) .outer-container{-ms-flex-align:center;align-items:center}:host(.missions.feed) .outer-container{border-bottom:none !important}:host(.calendarEvents) .outer-container .content-container .heading-container{margin-bottom:unset}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container .dot-event,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container .dot-event{margin-right:var(--spacing-04, 0.25rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container .icon-event,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container .icon-event{margin-right:var(--spacing-08, 0.5rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .title{font-weight:bold;font-size:var(--font-size-16, 1rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .time{color:var(--app-color, #5a30f4)}:host(.course-info) .outer-container,:host(.learning-manager) .outer-container{padding-top:var(--spacing-16, 1rem)}";
10
+ const cardListCss = "svg:not(:root){overflow:hidden}.bg-accent{background-color:var(--accent, #276ef1) !important}.accent{color:var(--accent, #276ef1);fill:var(--accent, #276ef1)}.bg-app-color{background-color:var(--app-color, #5a30f4) !important}.app-color{color:var(--app-color, #5a30f4);fill:var(--app-color, #5a30f4)}.bg-danger{background-color:var(--danger, #d44333) !important}.danger{color:var(--danger, #d44333);fill:var(--danger, #d44333)}.bg-dark{background-color:var(--dark, #000000) !important}.dark{color:var(--dark, #000000);fill:var(--dark, #000000)}.bg-energized{background-color:var(--energized, #ffc043) !important}.energized{color:var(--energized, #ffc043);fill:var(--energized, #ffc043)}.bg-info{background-color:var(--info, #d84c96) !important}.info{color:var(--info, #d84c96);fill:var(--info, #d84c96)}.bg-light{background-color:var(--light, #ffffff) !important}.light{color:var(--light, #ffffff);fill:var(--light, #ffffff)}.bg-stable{background-color:var(--stable, #adadad) !important}.stable{color:var(--stable, #adadad);fill:var(--stable, #adadad)}.bg-stable-alt{background-color:var(--stable-alt, #d0d0d0) !important}.stable-alt{color:var(--stable-alt, #d0d0d0);fill:var(--stable-alt, #d0d0d0)}.bg-stable-light{background-color:var(--stable-light, #f1f1f1) !important}.stable-light{color:var(--stable-light, #f1f1f1);fill:var(--stable-light, #f1f1f1)}.bg-stable-ultralight{background-color:var(--stable-ultralight, #fafafa) !important}.stable-ultralight{color:var(--stable-ultralight, #fafafa);fill:var(--stable-ultralight, #fafafa)}.bg-success{background-color:var(--success, #3aa76d) !important}.success{color:var(--success, #3aa76d);fill:var(--success, #3aa76d)}.bg-text-color{background-color:var(--text-color, #807f83) !important}.text-color{color:var(--text-color, #807f83);fill:var(--text-color, #807f83)}.bg-warning{background-color:var(--warning, #ed6e33) !important}.warning{color:var(--warning, #ed6e33);fill:var(--warning, #ed6e33)}.bg-wood{background-color:var(--wood, #99644c) !important}.wood{color:var(--wood, #99644c);fill:var(--wood, #99644c)}:host{display:block;height:100%;background:var(--card-list-background);cursor:pointer}:host yoo-tag.distance{--padding:0;margin-left:var(--spacing-08, 0.5rem)}:host .outer-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding-bottom:0.25rem;border-bottom:var(--border-bottom-outer-container);-webkit-transition:background-color 0.3s ease, padding 0.3s ease;transition:background-color 0.3s ease, padding 0.3s ease}:host .outer-container .content-container{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:var(--justify-content-content-container);justify-content:var(--justify-content-content-container);-ms-flex-pack:center;justify-content:center;width:100%;margin-right:var(--margin-content-container-right);margin-left:var(--margin-content-container-left);overflow:hidden}:host .outer-container .content-container.has-image{margin-left:0}:host .outer-container .content-container .heading-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:start;align-items:flex-start;-ms-flex-align:center;align-items:center;margin-bottom:var(--spacing-02, 0.125rem);font-size:var(--font-size-16, 1rem);line-height:1.5}:host .outer-container .content-container .heading-container .margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .content-container .heading-container yoo-avatars{margin-right:0.125rem}:host .outer-container .content-container .heading-container .card-heading{-ms-flex:1;flex:1;min-width:0;color:var(--dark, #000000)}:host .outer-container .content-container .heading-container .card-heading .heading-title{display:-webkit-box;max-height:calc((var(--font-size-16, 1rem) + 0.125rem) * 2);overflow:hidden;line-height:calc(var(--font-size-16, 1rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}:host .outer-container .content-container .heading-container .card-heading .heading-title span{display:block;overflow:hidden;text-overflow:ellipsis}:host .outer-container .content-container .heading-container .card-heading .heading-circle{display:inline-block;width:0.5rem;height:0.5rem;margin-right:0.2rem;border-radius:50%}:host .outer-container .content-container .heading-container .card-heading *{-webkit-margin-before:0;margin-block-start:0;-webkit-margin-after:0;margin-block-end:0}:host .outer-container .content-container .heading-container .card-heading .ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .subheading-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-bottom:var(--spacing-02, 0.125rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem)}:host .outer-container .content-container .subheading-container html,:host .outer-container .content-container .subheading-container body,:host .outer-container .content-container .subheading-container div:not([class^=fr-]),:host .outer-container .content-container .subheading-container span:not([class^=fr-]),:host .outer-container .content-container .subheading-container img:not([class^=fr-]),:host .outer-container .content-container .subheading-container applet,:host .outer-container .content-container .subheading-container object,:host .outer-container .content-container .subheading-container iframe,:host .outer-container .content-container .subheading-container h1,:host .outer-container .content-container .subheading-container h2,:host .outer-container .content-container .subheading-container h3,:host .outer-container .content-container .subheading-container h4,:host .outer-container .content-container .subheading-container h5,:host .outer-container .content-container .subheading-container h6,:host .outer-container .content-container .subheading-container p,:host .outer-container .content-container .subheading-container blockquote,:host .outer-container .content-container .subheading-container pre,:host .outer-container .content-container .subheading-container a,:host .outer-container .content-container .subheading-container abbr,:host .outer-container .content-container .subheading-container acronym,:host .outer-container .content-container .subheading-container address,:host .outer-container .content-container .subheading-container big,:host .outer-container .content-container .subheading-container cite,:host .outer-container .content-container .subheading-container code,:host .outer-container .content-container .subheading-container del,:host .outer-container .content-container .subheading-container dfn,:host .outer-container .content-container .subheading-container em,:host .outer-container .content-container .subheading-container font,:host .outer-container .content-container .subheading-container ins,:host .outer-container .content-container .subheading-container kbd,:host .outer-container .content-container .subheading-container q,:host .outer-container .content-container .subheading-container s,:host .outer-container .content-container .subheading-container samp,:host .outer-container .content-container .subheading-container small,:host .outer-container .content-container .subheading-container strike,:host .outer-container .content-container .subheading-container strong,:host .outer-container .content-container .subheading-container sub,:host .outer-container .content-container .subheading-container sup,:host .outer-container .content-container .subheading-container tt,:host .outer-container .content-container .subheading-container var,:host .outer-container .content-container .subheading-container dl,:host .outer-container .content-container .subheading-container dt,:host .outer-container .content-container .subheading-container dd,:host .outer-container .content-container .subheading-container ol,:host .outer-container .content-container .subheading-container ul,:host .outer-container .content-container .subheading-container li,:host .outer-container .content-container .subheading-container fieldset,:host .outer-container .content-container .subheading-container form,:host .outer-container .content-container .subheading-container label,:host .outer-container .content-container .subheading-container legend,:host .outer-container .content-container .subheading-container table,:host .outer-container .content-container .subheading-container caption,:host .outer-container .content-container .subheading-container tbody,:host .outer-container .content-container .subheading-container tfoot,:host .outer-container .content-container .subheading-container thead,:host .outer-container .content-container .subheading-container tr,:host .outer-container .content-container .subheading-container th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host .outer-container .content-container .subheading-container .text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .avatar-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end;margin-top:0.5rem;padding-right:0.3rem}:host .outer-container .content-container .avatar-container yoo-avatar{margin-right:0.75rem;margin-left:0.15rem}:host .outer-container .content-container .action-button-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end}:host .outer-container .content-container .slot-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between;color:var(--text-color, #807f83);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .slot-container .inner-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}:host(.firefox) .content-container{margin-bottom:0}:host(.web):not(.framed) .outer-container{padding-top:1rem;padding-bottom:1rem;background-color:transparent}:host(.web) .outer-container .card-list-image-container.large{min-width:3.875rem}:host(.web) .outer-container .card-list-image-container.medium{min-width:2.875rem}:host(.web) .outer-container .card-list-image-container.small{min-width:2.375rem}:host(.web) .outer-container .content-container .top-container .badges-container.show-more{position:relative;overflow:visible}:host(.web) .outer-container .content-container .top-container .badges-container.show-more .more-button{position:absolute;top:0;right:0;bottom:auto;left:auto;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;width:2rem;height:1.125rem;font-size:var(--font-size-18, 1.125rem)}:host(.web) .outer-container .content-container .top-container .badges-container.show-more .more-button yoo-icon{padding-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000)}:host(.locations) .outer-container .content-container .top-container .heading-container .date-card-text{padding-right:var(--spacing-16, 1rem)}:host(.locations.map) .outer-container{-ms-flex-align:center;align-items:center;background:var(--light, #ffffff)}:host(.collapsible) .outer-container,:host(.locations.no-kpi:not(.framed)) .outer-container{-ms-flex-align:start;align-items:flex-start;width:auto;border-bottom:none;border-radius:0.5rem}:host(.collapsible) .outer-container .content-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container{margin:0.5rem 0 0;border:none}:host(.collapsible) .outer-container .content-container .top-container .heading-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container .top-container .heading-container{-ms-flex-pack:justify;justify-content:space-between;padding-top:0 !important;padding-right:var(--spacing-08, 0.5rem)}:host(.collapsible) .outer-container .content-container .top-container .subheading-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container .top-container .subheading-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.collapsible) .outer-container .content-container{margin-top:0}:host(.locations.no-kpi.map) .outer-container{-ms-flex-align:start;align-items:flex-start;max-width:18.75rem}:host(.locations.no-kpi:not(.framed)) yoo-tag.distance{margin-right:0.75rem}:host(.web.framed) .outer-container .content-container .top-container .heading-container{font-size:var(--font-size-16, 1rem)}:host(.android) .outer-container .content-container .top-container .heading-container .heading-title{display:-webkit-box;max-height:calc((var(--font-size-18, 1.125rem) + 0.25rem) * 2);overflow:hidden;line-height:calc(var(--font-size-18, 1.125rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}:host{--margin-content-container-left:0;--margin-content-container-right:0;--padding-content-container:var(--spacing-04, 0.25rem) 0 var(--spacing-08, 0.5rem) 0;--border-bottom-outer-container:var(--border-width-01, 0.0625rem) solid var(--stable-alt-40, rgba(208, 208, 208, 0.4));--overflow-card-heading-text:hidden;--text-overflow-card-heading-text:ellipsis;--white-space-card-heading-text:normal;--padding-right-card-heading:unset;--max-height-heading:48px;--card-list-background:none;--justify-content-content-container:flex-start;--max-card-heading-height:26px;--height-lessons-outer-container:2.5rem;--heading-font-size:var(--font-size-14, 0.875rem)}:host yoo-truncate{--max-lines:2}:host .heart-icon{width:var(--icon-size-05, 4rem)}:host .heart-icon yoo-lottie{width:var(--icon-size-02, 1.5rem);height:var(--icon-size-05, 4rem);margin:auto}:host .heart-icon yoo-lottie yoo-icon{top:1.3rem}:host .outer-container{padding-top:var(--spacing-04, 0.25rem)}:host .outer-container.tapped{background-color:var(--stable-light, #f1f1f1);-webkit-transition:background-color 0.3s ease;transition:background-color 0.3s ease}:host .outer-container .video-container{width:100%;max-height:350px;padding-top:var(--spacing-08, 0.5rem)}:host .outer-container .rank-container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;min-width:1.5rem;color:var(--stable, #adadad);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .heading-container yoo-tag.margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .content-container .heading-container .progress-box{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;color:var(--dark, #000000)}:host .outer-container .content-container .heading-container .progress-box .icon-text{font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .tags-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;padding-bottom:var(--spacing-04, 0.25rem);overflow:hidden;line-height:15px}:host .outer-container .content-container .tags-container yoo-tag,:host .outer-container .content-container .tags-container .card-icon{margin:var(--spacing-04, 0.25rem) var(--spacing-08, 0.5rem) var(--spacing-02, 0.125rem) var(--spacing-02, 0.125rem)}:host .outer-container .content-container .tags-container .hashtag{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:0.4375rem;color:var(--text-color, #807f83);font-size:var(--font-size-12, 0.75rem);-webkit-transform:translateY(0.125rem);transform:translateY(0.125rem)}:host .outer-container .content-container .tags-container .card-icon{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}:host .outer-container .content-container .tags-container .card-icon yoo-icon{margin-right:0.4375rem}:host .outer-container .content-container .tags-container .row-action{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;line-height:1rem}:host .outer-container .content-container .top-container .video-container{display:-ms-inline-flexbox;display:inline-flex;height:230px}:host .outer-container .content-container .top-container .heading-container .date-card-text{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-left:auto;padding:0 var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem);text-align:right}:host .outer-container .content-container .top-container .heading-container .points-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding-right:var(--spacing-08, 0.5rem);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .top-container .heading-container .points-container .points{padding:0 0.35rem}:host .outer-container .content-container .top-container .flex{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .outer-container.active{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host .outer-container .image-video-preview{width:12.5rem;height:6.25rem;padding:var(--spacing-08, 0.5rem);pointer-events:none}:host .outer-container .image-video-preview yoo-img{--border-radius:var(--border-radius-08, 0.5rem);height:100%}:host(.mobile.rtl) .outer-container .content-container{margin-right:var(--margin-content-container-left);margin-left:var(--margin-content-container-right)}:host(.mobile.rtl) .outer-container .content-container.has-image{margin-right:0}:host(.mobile.rtl) .outer-container .content-container .tags-container yoo-tag,:host(.mobile.rtl) .outer-container .content-container .tags-container .card-icon{margin:var(--spacing-04, 0.25rem) var(--spacing-02, 0.125rem) var(--spacing-02, 0.125rem) var(--spacing-08, 0.5rem)}:host(.mobile.rtl) .outer-container .content-container .top-container .subheading-container{margin-right:0;margin-left:var(--spacing-32, 2rem)}:host(.current) .outer-container .rank-container{color:var(--app-color, #5a30f4)}:host(.current) .outer-container .content-container .leaderboard .heading-container .card-heading{color:var(--app-color, #5a30f4)}:host(.current.leaderboard){background-color:var(--app-color, #5a30f4) !important}:host(.current.leaderboard) .outer-container .rank-container{color:var(--light, #ffffff)}:host(.current.leaderboard) .outer-container .content-container .leaderboard .heading-container .card-heading{color:var(--light, #ffffff)}:host(.current.leaderboard) .outer-container .points-container{color:var(--light, #ffffff)}:host(.leaderboard.userranks){height:var(--spacing-40, 2.5rem)}:host(.leaderboard.userranks) .outer-container{height:100%;padding:0 !important}:host(.leaderboard.userranks) .icon-container{color:var(--app-color, #5a30f4) !important}:host(.leaderboard){padding-left:var(--spacing-16, 1rem);color:var(--dark, #000000);background-color:var(--light, #ffffff);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));opacity:1}:host(.secondary-view){--border-bottom-outer-container:0px;background:transparent}:host(.secondary-view) .outer-container{padding-top:var(--spacing-08, 0.5rem)}:host(.secondary-view) .outer-container .question-content{border-bottom:var(--border-bottom-outer-container)}:host(.secondary-view) .outer-container .content-container .heading-container{font-size:var(--font-size-16, 1rem)}:host(.secondary-view) .outer-container .content-container .heading-container .date-card-text{display:block;padding:0;line-height:normal;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.secondary-view) .outer-container .content-container .translate-container{position:relative;margin-bottom:var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-weight:normal;font-size:var(--font-size-16, 1rem);font-style:normal;font-stretch:normal;line-height:1;letter-spacing:normal}:host(.secondary-view) .outer-container .content-container .translate-container.active{margin-left:var(--spacing-04, 0.25rem);padding-left:var(--spacing-08, 0.5rem);border-left:var(--border-width-02, 0.125rem) solid var(--stable-alt, #d0d0d0)}:host(.secondary-view) .outer-container .content-container .translate-container .text{margin-bottom:var(--spacing-04, 0.25rem);color:var(--dark, #000000)}:host(.secondary-view) .outer-container .content-container .translate-container .text html,:host(.secondary-view) .outer-container .content-container .translate-container .text body,:host(.secondary-view) .outer-container .content-container .translate-container .text div:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text span:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text img:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text applet,:host(.secondary-view) .outer-container .content-container .translate-container .text object,:host(.secondary-view) .outer-container .content-container .translate-container .text iframe,:host(.secondary-view) .outer-container .content-container .translate-container .text h1,:host(.secondary-view) .outer-container .content-container .translate-container .text h2,:host(.secondary-view) .outer-container .content-container .translate-container .text h3,:host(.secondary-view) .outer-container .content-container .translate-container .text h4,:host(.secondary-view) .outer-container .content-container .translate-container .text h5,:host(.secondary-view) .outer-container .content-container .translate-container .text h6,:host(.secondary-view) .outer-container .content-container .translate-container .text p,:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote,:host(.secondary-view) .outer-container .content-container .translate-container .text pre,:host(.secondary-view) .outer-container .content-container .translate-container .text a,:host(.secondary-view) .outer-container .content-container .translate-container .text abbr,:host(.secondary-view) .outer-container .content-container .translate-container .text acronym,:host(.secondary-view) .outer-container .content-container .translate-container .text address,:host(.secondary-view) .outer-container .content-container .translate-container .text big,:host(.secondary-view) .outer-container .content-container .translate-container .text cite,:host(.secondary-view) .outer-container .content-container .translate-container .text code,:host(.secondary-view) .outer-container .content-container .translate-container .text del,:host(.secondary-view) .outer-container .content-container .translate-container .text dfn,:host(.secondary-view) .outer-container .content-container .translate-container .text em,:host(.secondary-view) .outer-container .content-container .translate-container .text font,:host(.secondary-view) .outer-container .content-container .translate-container .text ins,:host(.secondary-view) .outer-container .content-container .translate-container .text kbd,:host(.secondary-view) .outer-container .content-container .translate-container .text q,:host(.secondary-view) .outer-container .content-container .translate-container .text s,:host(.secondary-view) .outer-container .content-container .translate-container .text samp,:host(.secondary-view) .outer-container .content-container .translate-container .text small,:host(.secondary-view) .outer-container .content-container .translate-container .text strike,:host(.secondary-view) .outer-container .content-container .translate-container .text strong,:host(.secondary-view) .outer-container .content-container .translate-container .text sub,:host(.secondary-view) .outer-container .content-container .translate-container .text sup,:host(.secondary-view) .outer-container .content-container .translate-container .text tt,:host(.secondary-view) .outer-container .content-container .translate-container .text var,:host(.secondary-view) .outer-container .content-container .translate-container .text dl,:host(.secondary-view) .outer-container .content-container .translate-container .text dt,:host(.secondary-view) .outer-container .content-container .translate-container .text dd,:host(.secondary-view) .outer-container .content-container .translate-container .text ol,:host(.secondary-view) .outer-container .content-container .translate-container .text ul,:host(.secondary-view) .outer-container .content-container .translate-container .text li,:host(.secondary-view) .outer-container .content-container .translate-container .text fieldset,:host(.secondary-view) .outer-container .content-container .translate-container .text form,:host(.secondary-view) .outer-container .content-container .translate-container .text label,:host(.secondary-view) .outer-container .content-container .translate-container .text legend,:host(.secondary-view) .outer-container .content-container .translate-container .text table,:host(.secondary-view) .outer-container .content-container .translate-container .text caption,:host(.secondary-view) .outer-container .content-container .translate-container .text tbody,:host(.secondary-view) .outer-container .content-container .translate-container .text tfoot,:host(.secondary-view) .outer-container .content-container .translate-container .text thead,:host(.secondary-view) .outer-container .content-container .translate-container .text tr,:host(.secondary-view) .outer-container .content-container .translate-container .text th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote{padding-left:1rem;border-left:var(--border-width-04, 0.25rem) solid var(--stable, #adadad)}:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote:last-of-type blockquote p:last-of-type,:host(.secondary-view) .outer-container .content-container .translate-container .text p:last-of-type{padding-top:0;padding-bottom:0}:host(.secondary-view) .outer-container .content-container .translate-container .text ol,:host(.secondary-view) .outer-container .content-container .translate-container .text ul{margin:revert;padding:revert}:host(.secondary-view) .outer-container .content-container .translate-container .text h1{display:block;margin-top:0.67em;margin-right:0;margin-bottom:0.67em;margin-left:0;font-weight:bold;font-size:2em}:host(.secondary-view) .outer-container .content-container .translate-container .text h2{display:block;margin-top:0.83em;margin-right:0;margin-bottom:0.83em;margin-left:0;font-weight:bold;font-size:1.5em}:host(.secondary-view) .outer-container .content-container .translate-container .text h3{display:block;margin-top:1em;margin-right:0;margin-bottom:1em;margin-left:0;font-weight:bold;font-size:1.17em}:host(.secondary-view) .outer-container .content-container .translate-container .text h4{display:block;margin-top:1.33em;margin-right:0;margin-bottom:1.33em;margin-left:0;font-weight:bold}:host(.secondary-view) .outer-container .content-container .translate-container .text h5{display:block;margin-top:1.67em;margin-right:0;margin-bottom:1.67em;margin-left:0;font-weight:bold;font-size:0.83em}:host(.secondary-view) .outer-container .content-container .translate-container .text h6{display:block;margin-top:2.33em;margin-right:0;margin-bottom:2.33em;margin-left:0;font-weight:bold;font-size:0.67em}:host(.secondary-view) .outer-container .content-container .translate-container .text strong{font-weight:bold}:host(.secondary-view) .outer-container .content-container .translate-container .text em{font-style:italic}:host(.secondary-view) .outer-container .content-container .subheading-container{display:block;max-height:initial;overflow:visible;color:var(--dark, #000000);font-size:var(--font-size-16, 1rem);line-height:20px;white-space:pre-wrap;word-wrap:break-word}:host(.secondary-view) .outer-container .content-container .subheading-container html,:host(.secondary-view) .outer-container .content-container .subheading-container body,:host(.secondary-view) .outer-container .content-container .subheading-container div:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container span:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container img:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container applet,:host(.secondary-view) .outer-container .content-container .subheading-container object,:host(.secondary-view) .outer-container .content-container .subheading-container iframe,:host(.secondary-view) .outer-container .content-container .subheading-container h1,:host(.secondary-view) .outer-container .content-container .subheading-container h2,:host(.secondary-view) .outer-container .content-container .subheading-container h3,:host(.secondary-view) .outer-container .content-container .subheading-container h4,:host(.secondary-view) .outer-container .content-container .subheading-container h5,:host(.secondary-view) .outer-container .content-container .subheading-container h6,:host(.secondary-view) .outer-container .content-container .subheading-container p,:host(.secondary-view) .outer-container .content-container .subheading-container blockquote,:host(.secondary-view) .outer-container .content-container .subheading-container pre,:host(.secondary-view) .outer-container .content-container .subheading-container a,:host(.secondary-view) .outer-container .content-container .subheading-container abbr,:host(.secondary-view) .outer-container .content-container .subheading-container acronym,:host(.secondary-view) .outer-container .content-container .subheading-container address,:host(.secondary-view) .outer-container .content-container .subheading-container big,:host(.secondary-view) .outer-container .content-container .subheading-container cite,:host(.secondary-view) .outer-container .content-container .subheading-container code,:host(.secondary-view) .outer-container .content-container .subheading-container del,:host(.secondary-view) .outer-container .content-container .subheading-container dfn,:host(.secondary-view) .outer-container .content-container .subheading-container em,:host(.secondary-view) .outer-container .content-container .subheading-container font,:host(.secondary-view) .outer-container .content-container .subheading-container ins,:host(.secondary-view) .outer-container .content-container .subheading-container kbd,:host(.secondary-view) .outer-container .content-container .subheading-container q,:host(.secondary-view) .outer-container .content-container .subheading-container s,:host(.secondary-view) .outer-container .content-container .subheading-container samp,:host(.secondary-view) .outer-container .content-container .subheading-container small,:host(.secondary-view) .outer-container .content-container .subheading-container strike,:host(.secondary-view) .outer-container .content-container .subheading-container strong,:host(.secondary-view) .outer-container .content-container .subheading-container sub,:host(.secondary-view) .outer-container .content-container .subheading-container sup,:host(.secondary-view) .outer-container .content-container .subheading-container tt,:host(.secondary-view) .outer-container .content-container .subheading-container var,:host(.secondary-view) .outer-container .content-container .subheading-container dl,:host(.secondary-view) .outer-container .content-container .subheading-container dt,:host(.secondary-view) .outer-container .content-container .subheading-container dd,:host(.secondary-view) .outer-container .content-container .subheading-container ol,:host(.secondary-view) .outer-container .content-container .subheading-container ul,:host(.secondary-view) .outer-container .content-container .subheading-container li,:host(.secondary-view) .outer-container .content-container .subheading-container fieldset,:host(.secondary-view) .outer-container .content-container .subheading-container form,:host(.secondary-view) .outer-container .content-container .subheading-container label,:host(.secondary-view) .outer-container .content-container .subheading-container legend,:host(.secondary-view) .outer-container .content-container .subheading-container table,:host(.secondary-view) .outer-container .content-container .subheading-container caption,:host(.secondary-view) .outer-container .content-container .subheading-container tbody,:host(.secondary-view) .outer-container .content-container .subheading-container tfoot,:host(.secondary-view) .outer-container .content-container .subheading-container thead,:host(.secondary-view) .outer-container .content-container .subheading-container tr,:host(.secondary-view) .outer-container .content-container .subheading-container th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host(.secondary-view) .outer-container .content-container .subheading-container blockquote{padding-left:1rem;border-left:var(--border-width-04, 0.25rem) solid var(--stable, #adadad)}:host(.secondary-view) .outer-container .content-container .subheading-container blockquote:last-of-type blockquote p:last-of-type,:host(.secondary-view) .outer-container .content-container .subheading-container p:last-of-type{padding-top:0;padding-bottom:0}:host(.secondary-view) .outer-container .content-container .subheading-container ol,:host(.secondary-view) .outer-container .content-container .subheading-container ul{margin:revert;padding:revert}:host(.secondary-view) .outer-container .content-container .subheading-container h1{display:block;margin-top:0.67em;margin-right:0;margin-bottom:0.67em;margin-left:0;font-weight:bold;font-size:2em}:host(.secondary-view) .outer-container .content-container .subheading-container h2{display:block;margin-top:0.83em;margin-right:0;margin-bottom:0.83em;margin-left:0;font-weight:bold;font-size:1.5em}:host(.secondary-view) .outer-container .content-container .subheading-container h3{display:block;margin-top:1em;margin-right:0;margin-bottom:1em;margin-left:0;font-weight:bold;font-size:1.17em}:host(.secondary-view) .outer-container .content-container .subheading-container h4{display:block;margin-top:1.33em;margin-right:0;margin-bottom:1.33em;margin-left:0;font-weight:bold}:host(.secondary-view) .outer-container .content-container .subheading-container h5{display:block;margin-top:1.67em;margin-right:0;margin-bottom:1.67em;margin-left:0;font-weight:bold;font-size:0.83em}:host(.secondary-view) .outer-container .content-container .subheading-container h6{display:block;margin-top:2.33em;margin-right:0;margin-bottom:2.33em;margin-left:0;font-weight:bold;font-size:0.67em}:host(.secondary-view) .outer-container .content-container .subheading-container strong{font-weight:bold}:host(.secondary-view) .outer-container .content-container .subheading-container em{font-style:italic}:host(.secondary-view) .outer-container .content-container .subheading-container.comment-image{--border-radius:var(--border-radius-16, 1rem);margin-top:9px;overflow:hidden}:host(.secondary-view) .outer-container .content-container .subheading-container span.with-markdown{white-space:normal}:host(.secondary-view) .outer-container .content-container .subheading-container span.with-markdown img{width:100%;max-width:initial !important}:host(.secondary-view) .outer-container .content-container .top-container{padding:var(--spacing-08, 0.5rem);background:var(--stable-light-60, rgba(241, 241, 241, 0.6));border-radius:var(--border-radius-04, 0.25rem)}:host(.secondary-view) .outer-container .content-container .top-container .card-heading{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;width:100%;padding-right:var(--spacing-08, 0.5rem)}:host(.secondary-view) .outer-container .content-container .top-container .card-heading .card-heading-text{font-weight:var(--font-weight-700, 700)}:host(.secondary-view) .outer-container .content-container .top-container .heading-container .heading-title{display:block}:host(.secondary-view) .outer-container .content-container .top-container .heading-container .heading-title span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.secondary-view) .outer-container .content-container .top-container span{display:block;font-size:var(--font-size-16, 1rem)}:host(.secondary-view) .outer-container .content-container .slot-container yoo-img{margin-right:auto}:host(.secondary-view) .tags-container{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center;margin-top:-0.85rem;margin-left:1.875rem;font-size:var(--font-size-14, 0.875rem)}:host(.secondary-view) .tags-container .card-icon.right{margin-left:auto}:host(.secondary-view) .tags-container .card-icon.right yoo-icon{margin:0}:host(.secondary-view) .tags-container .row-action{width:100%;margin-top:-0.875rem;margin-left:1.25rem}:host(.secondary-view) .tags-container .row-action span{color:var(--dark, #000000)}:host(.secondary-view) .tags-container .bottom-action{margin-right:1.25rem;color:var(--text-color, #807f83)}:host(.questionsAnswers) .tags-container{margin-left:2.8125rem}:host(.questionsAnswers) .tags-container .card-icon:not(.heart-icon){margin:var(--spacing-16, 1rem) var(--spacing-16, 1rem) 0 0}:host(.questionsAnswers) .tags-container .row-action{margin-top:var(--spacing-08, 0.5rem);margin-left:0}:host(.entitycomments) .tags-container,:host(.feedsComments) .tags-container{margin-left:1.75rem}:host(.userranks) .outer-container,:host(.userhighscores) .outer-container{-ms-flex-align:center;align-items:center;padding:var(--spacing-08, 0.5rem) 0 !important;background-color:transparent;border-bottom:0}:host(.userranks) .heading-container,:host(.userhighscores) .heading-container{word-wrap:break-word}:host(.active) .outer-container{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host(.hoverable):hover .outer-container{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host(.filesFolders) .outer-container .content-container .subheading-container,:host(.files) .outer-container .content-container .subheading-container{margin:0;font-size:var(--font-size-12, 0.75rem)}:host(.filesFolders) .outer-container .content-container .subheading-container em,:host(.files) .outer-container .content-container .subheading-container em{color:var(--dark, #000000);font-weight:bold;background:#FDFB2F}:host(.locations.external) .outer-container .content-container .subheading-container{white-space:normal}:host(.products) .outer-container .content-container{border-bottom:none}:host(.outofstock),:host(.hidden){opacity:0.5}:host(.productweightpair) .outer-container .content-container .heading-container .date-card-text{color:var(--dark, #000000)}:host(.catalog-display.history) .outer-container .content-container{text-align:left}:host(.catalog-display.history) .outer-container .content-container .top-container .price{font-size:var(--font-size-12, 0.75rem)}:host(.catalog-display.history) .outer-container .content-container .top-container .tags-container{padding-bottom:var(--spacing-04, 0.25rem)}:host(.catalog-display){width:100%}:host(.catalog-display) .outer-container{-ms-flex-align:start;align-items:flex-start;font-size:var(--font-size-14, 0.875rem);border:none !important}:host(.catalog-display) .outer-container .content-container{-ms-flex-pack:center;justify-content:center;margin-left:1rem;padding:0;border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host(.catalog-display) .outer-container .content-container .top-container .card-heading{font-size:var(--font-size-14, 0.875rem)}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container{min-height:1rem;max-height:0.8rem;color:var(--dark, #000000);font-size:var(--font-size-12, 0.75rem);line-height:1rem}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container .subheading-grey{color:var(--stable, #adadad)}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container .subheading-price{color:var(--dark, #000000)}:host(.catalog-display) .outer-container .content-container .top-container .price{color:var(--text-color, #807f83)}:host(.catalog-display) .outer-container .content-container .top-container .tags-container{overflow:initial;line-height:normal}:host(.catalog-display.no-border) .outer-container .content-container{border-bottom:none}:host(.productbatch.archived) .outer-container .content-container{opacity:0.5}:host(.offline:not(.missions)) .outer-container{opacity:0.7}:host(.offline:not(.missions))::before,:host(.offline:not(.missions))::after{position:absolute;top:0;right:0;border-color:transparent;border-style:solid;content:\"\"}:host(.offline:not(.missions))::after{border-width:0.5em;border-top-color:var(--energized, #ffc043);border-right-color:var(--energized, #ffc043)}:host(.notifications) .outer-container{padding-top:var(--spacing-04, 0.25rem)}:host(.notes) .outer-container .content-container .heading-container .card-heading .heading-title{display:-webkit-box;max-height:calc((var(--font-size-18, 1.125rem) + 0.125rem) * 1);overflow:hidden;line-height:calc(var(--font-size-18, 1.125rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:1;}:host(.no-text-break) .outer-container .content-container .top-container .heading-container .card-heading{white-space:normal}:host(.lessons.web) .outer-container{height:var(--height-lessons-outer-container);min-height:0;margin:var(--spacing-04, 0.25rem) 0;padding-left:var(--spacing-08, 0.5rem);border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:var(--card-shadow-2, 0 0.3125rem 0.9375rem 0 rgba(40, 47, 54, 0.08));box-shadow:var(--card-shadow-2, 0 0.3125rem 0.9375rem 0 rgba(40, 47, 54, 0.08))}:host(.lessons.web) .outer-container .content-container{border-bottom:none}:host(.lessons.web) .outer-container .content-container .top-container{display:-ms-flexbox;display:flex}:host(.lessons.web) .outer-container .content-container .heading-container{-ms-flex:1;flex:1;width:75%;padding-right:var(--spacing-08, 0.5rem);font-size:var(--heading-font-size)}:host(.lessons.web) .outer-container .content-container .heading-container .card-heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding-top:0}:host(.lessons.web.finished) .outer-container{background-color:var(--app-color, #5a30f4)}:host(.lessons.web.finished) .outer-container .card-heading,:host(.lessons.web.finished) .outer-container .icon-container{color:var(--light-10, rgba(255, 255, 255, 0.1))}:host(.lessons.web.locked) .outer-container{background-color:var(--stable-alt, #d0d0d0)}:host(.lessons.web.locked) .outer-container .card-heading{color:var(--text-color, #807f83)}:host(.lessons.web.locked) .outer-container .top-container yoo-avatar{margin:0 0.75rem}:host(.missions.finished:not(.grid-cell)) .outer-container{padding-bottom:var(--spacing-16, 1rem)}:host(.courseselection) .outer-container .content-container{-ms-flex-pack:center;justify-content:center;margin-left:0}:host(.courseselection) .outer-container .content-container .top-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host(.courseselection) .outer-container .content-container .top-container .heading-container{-ms-flex-order:2;order:2;font-size:var(--font-size-16, 1rem)}:host(.courseselection) .outer-container .content-container .top-container .subheading-container{-ms-flex-order:1;order:1;color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem)}:host(.courseselection) .outer-container .content-container .top-container .subheading-container .todo{font-size:var(--font-size-14, 0.875rem)}:host(.courseselection) .outer-container .content-container .top-container .tags-container{padding-bottom:0}:host(.questions) .outer-container{padding-bottom:0;border-bottom:0}:host(.questions) .outer-container .content-container .top-container .heading-container{max-height:1.25rem;margin-bottom:0}:host(.questions) .outer-container .content-container .top-container .heading-container .card-heading .heading-title{color:var(--dark, #000000);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:var(--spacing-04, 0.25rem)}:host(.questions) .question-container.no-img{padding-top:var(--spacing-04, 0.25rem)}:host(.questions) .question-container.no-img .question-content{height:auto}:host(.questions) .question-container .question-content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:98px;margin-left:var(--spacing-08, 0.5rem);padding-bottom:var(--spacing-16, 1rem);border-bottom:var(--border-bottom-outer-container)}:host(.questions) .question-container .question-content .question-title{margin-bottom:var(--spacing-08, 0.5rem);font-weight:var(--font-weight-700, 700);font-size:var(--font-size-18, 1.125rem);word-break:break-word}:host(.questions) .question-container .question-content .question-icons{display:-ms-flexbox;display:flex;color:var(--stable-alt, #d0d0d0);font-size:var(--icon-size-01, 1rem)}:host(.questions) .question-container .question-content .question-icons .inner-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000);font-size:var(--font-size-18, 1.125rem)}:host(.questions) .question-container .question-content .question-icons .inner-container yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host(.questions) .question-container .question-content .subheadings{display:-ms-flexbox;display:flex;color:var(--text-color, #807f83)}:host(.questions) .question-container .question-content .subheadings .subheading-container{padding-right:var(--spacing-08, 0.5rem);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .question-content .subheadings .date-card-text{margin-right:var(--spacing-08, 0.5rem);color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .question-content .tags-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;overflow:hidden}:host(.questions) .question-container .question-content .tags-container .hashtag{margin-right:0.4375rem;color:var(--app-color, #5a30f4);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .image-video-preview{min-width:7.5rem;height:98px;padding:var(--spacing-08, 0.5rem);pointer-events:none}:host(.questions) .question-container .image-video-preview yoo-img{--border-radius:var(--border-radius-08, 0.5rem)}:host(.questions) .question-container .image-video-preview yoo-videoplayer-core{overflow:hidden;border-radius:var(--border-radius-08, 0.5rem)}:host(.card-feed) .outer-container{display:none}:host(.card-feed) .question-container{-ms-flex-pack:initial !important;justify-content:initial !important;background:var(--light-10, rgba(255, 255, 255, 0.1));border-bottom:none !important;-webkit-box-shadow:var(--grid-frame-shadow, 0 0.3125rem 0.9375rem 0.1875rem rgba(40, 47, 54, 0.15));box-shadow:var(--grid-frame-shadow, 0 0.3125rem 0.9375rem 0.1875rem rgba(40, 47, 54, 0.15))}:host(.card-feed) .question-container .image-video-preview{-ms-flex-negative:0;flex-shrink:0;-ms-flex-order:1;order:1;width:130px;height:89px;padding-right:var(--spacing-16, 1rem)}:host(.card-feed) .question-container .image-video-preview yoo-videoplayer-core{overflow:hidden;border-radius:5px}:host(.card-feed) .question-container .question-content{-ms-flex-pack:initial !important;justify-content:initial !important;-ms-flex-order:2;order:2;margin-left:0;padding:var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) 0}:host(.selected-content) .question-container{padding:0}:host(.selected-content) .question-container .image-video-preview{min-width:2rem;height:1.5rem;padding-left:0}:host(.selected-content) .question-container .question-content{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;height:auto;margin:0;padding-bottom:0;border-bottom:none}:host(.selected-content) .question-container .question-content .question-title{margin:0;font-weight:var(--font-weight-400, 400);font-size:var(--font-size-16, 1rem)}:host(.selected-content) .outer-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.selected-content) .outer-container .content-container .heading-container{margin-bottom:var(--spacing-02, 0.125rem)}:host(.selected-content) .outer-container .content-container .heading-container .card-heading .heading-title span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.selected-content) .outer-container .content-container .uifield-container{display:none}:host(.web.grid-cell){overflow:hidden}:host(.web.grid-cell) .outer-container{padding-top:var(--spacing-08, 0.5rem);padding-bottom:var(--spacing-08, 0.5rem)}:host(.web.grid-cell) .outer-container .content-container .tags-container{-ms-flex-wrap:initial;flex-wrap:initial}:host(.mobile.autocomplete-selection-mode) .question-container .question-title{font-size:var(--font-size-16, 1rem)}:host(.mobile.autocomplete-selection-mode) .subheading-container{margin-right:var(--spacing-32, 2rem)}:host(.no-border-bottom.mobile) .outer-container{border-bottom:none}:host(.no-border-bottom.mobile) .question-container .question-content{border-bottom:none}:host(.item-disabled){cursor:default}:host(.kanban) .outer-container{padding-top:0;padding-bottom:0}:host(.web.videocallusers) .outer-container{padding-top:0;padding-bottom:0}:host(.web.firefox) .outer-container{height:auto}:host(.violetproducts) .outer-container,:host(.violetbasketitems) .outer-container{-ms-flex-align:center;align-items:center}:host(.violetproducts) .outer-container yoo-icon.arrow,:host(.violetbasketitems) .outer-container yoo-icon.arrow{margin-top:var(--spacing-04, 0.25rem);margin-right:var(--spacing-04, 0.25rem);margin-bottom:auto}:host(.violetproducts) .content-container,:host(.violetbasketitems) .content-container{border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host(.form-permission) .outer-container{height:auto}:host(.pages) .outer-container{-ms-flex-align:center;align-items:center}:host(.missions.feed) .outer-container{border-bottom:none !important}:host(.calendarEvents) .outer-container .content-container .heading-container{margin-bottom:unset}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container .dot-event,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container .dot-event{margin-right:var(--spacing-04, 0.25rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container .icon-event,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container .icon-event{margin-right:var(--spacing-08, 0.5rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .title{font-weight:bold;font-size:var(--font-size-16, 1rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .time{color:var(--app-color, #5a30f4)}:host(.course-info) .outer-container,:host(.learning-manager) .outer-container{padding-top:var(--spacing-16, 1rem)}:host(.table) .top-container{display:-ms-flexbox;display:flex}:host(.table) .top-container .heading-container{-ms-flex:1;flex:1}";
11
11
 
12
12
  const MAX_AVATAR_DISPLAY = 3;
13
13
  const YooCardListComponent = class {
14
14
  constructor(hostRef) {
15
15
  registerInstance(this, hostRef);
16
16
  this.uiFieldsChanged = createEvent(this, "uiFieldsChanged", 7);
17
+ this.fieldFetchData = createEvent(this, "fieldFetchData", 7);
17
18
  this.avatarImgs = [];
18
19
  this.isMap = false;
19
20
  this.onTouchStart = () => toggleElementTapped(this.outerDiv, this.host);
@@ -272,10 +273,15 @@ const YooCardListComponent = class {
272
273
  this.entry.uiFields.fields.some((f) => isFieldWithNoValue(f) || !isNullOrUndefined(this.entry.uiFields.data[f.name])) &&
273
274
  !((_e = (_d = this.host) === null || _d === void 0 ? void 0 : _d.classList) === null || _e === void 0 ? void 0 : _e.contains('map')) &&
274
275
  !((_g = (_f = this.host) === null || _f === void 0 ? void 0 : _f.classList) === null || _g === void 0 ? void 0 : _g.contains('grid-cell'))) {
275
- return (h("div", { class: "uifield-container" }, h("yoo-form-dynamic", { class: "inline in-card secondary transparent", scrollable: false, forceReadonly: !((_j = (_h = this.host) === null || _h === void 0 ? void 0 : _h.classList) === null || _j === void 0 ? void 0 : _j.contains('form')), slides: [{ title: '', items: this.entry.uiFields.fields }], data: this.entry.uiFields.data, suffix: this.entry.uiFieldsSuffix, showTabs: false, formInputSize: "medium", showRecap: false, isPdf: this.entry.isPdf, onDataChanged: (ev) => {
276
+ return (h("div", { class: "uifield-container" }, h("yoo-form-dynamic", { class: "inline in-card secondary transparent", scrollable: false, ref: (el) => (this.uiFeldsformRef = el), forceReadonly: !((_j = (_h = this.host) === null || _h === void 0 ? void 0 : _h.classList) === null || _j === void 0 ? void 0 : _j.contains('form')), slides: [{ title: '', items: this.entry.uiFields.fields }], data: { ...this.entry.uiFields.data }, suffix: this.entry.uiFieldsSuffix, showTabs: false, formInputSize: "medium", showRecap: false, isPdf: this.entry.isPdf, onFieldFetchData: (ev) => {
277
+ ev.stopPropagation();
278
+ ev.detail.form = this.uiFeldsformRef;
279
+ this.fieldFetchData.emit(ev.detail);
280
+ }, onExtraDataChanged: (ev) => ev.stopPropagation(), onDataChanged: (ev) => {
276
281
  var _a, _b;
277
282
  ev.stopPropagation();
278
283
  if (!isEqual((_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.uiFields) === null || _b === void 0 ? void 0 : _b.data, ev === null || ev === void 0 ? void 0 : ev.detail)) {
284
+ this.entry.uiFields.data = { ...ev.detail };
279
285
  this.uiFieldsChanged.emit({ newdata: ev.detail });
280
286
  }
281
287
  } })));
package/dist/design-system/yoo-entity.entry.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { h, r as registerInstance, i as createEvent, f as forceUpdate, e as Host, g as getElement } from './index-a6a92b3d.js';
2
2
  import { c as FormFieldType, b as FeedPostType } from './index-4bbbf966.js';
3
3
  import './index-f1a9c615.js';
4
- import { k as keys, a as isNumber, n as compact, i as isArray, N as size, H as isNil, p as isString, ae as partition, C as get, b as isFunction } from './lodash-777f91de.js';
4
+ import { i as isArray, k as keys, a as isNumber, n as compact, N as size, H as isNil, p as isString, ae as partition, C as get, b as isFunction } from './lodash-777f91de.js';
5
5
  import { e as getIncentiveStatusBadgeSettings } from './incentive-helpers-3ea52d33.js';
6
6
  import { d as getCampaignStateTags, e as getCampaignTemplateTags, f as getMissionDataStateTags, h as getWaitlistVisitTags, g as getProductBatchDateTag, i as getProductBatchProgressColor } from './operation-helpers-aa9121fc.js';
7
7
  import { i as getMissionStateTags, d as getMissionUniqueKey, g as getMissionAddress, m as mapMissionToCardInboxEntry } from './missions-helpers-6b276054.js';
@@ -93,9 +93,18 @@ const YooEntityComponent = class {
93
93
  this.closed.emit(true);
94
94
  }
95
95
  getCustomModelValue(key, data, fields) {
96
+ var _a;
96
97
  const field = fields.find((f) => f.name === key);
97
98
  if ((field === null || field === void 0 ? void 0 : field.type) === FormFieldType.user && data[key]) {
98
- return getUserDisplayName(data[key]);
99
+ if (isArray(data[key]) && ((_a = data[key]) === null || _a === void 0 ? void 0 : _a.length) <= 0) {
100
+ return '';
101
+ }
102
+ else if (isArray(data[key]) && data[key].length >= 1) {
103
+ return data[key].map((u) => getUserDisplayName(u)).join(', ');
104
+ }
105
+ else {
106
+ return getUserDisplayName(data[key]);
107
+ }
99
108
  }
100
109
  else if (key === '_ect' || (field && (field.type === FormFieldType.date || field.type === FormFieldType.datetime))) {
101
110
  return pipes.dateFormat.transform(data[key], ...[!field || field.type === FormFieldType.date ? 'L' : 'L LT']);
package/dist/design-system/yoo-form-dynamic.entry.js CHANGED
@@ -972,7 +972,7 @@ const YooFormDynamicComponent = class {
972
972
  }
973
973
  encodeFieldName(name) {
974
974
  // eslint-disable-next-line no-useless-escape
975
- return 'f-' + (name === null || name === void 0 ? void 0 : name.replace(/\./g, '-').replace(/_/g, '-').replace(/%/g, '-').replace(/\"/g, ''));
975
+ return 'f-' + (name === null || name === void 0 ? void 0 : name.replace(/\./g, '-').replace(/_/g, '-').replace(/%/g, '-').replace(/&/g, '-').replace(/\"/g, ''));
976
976
  }
977
977
  getFieldByCode(name, host) {
978
978
  const code = this.encodeFieldName(name);
package/dist/design-system/yoo-form-table.entry.js CHANGED
@@ -154,9 +154,15 @@ const YooFormTableComponent = class {
154
154
  finalValues = finalValues.concat(this.tmpValues.filter((v) => finalValues.findIndex((f) => f._id === v._id) < 0));
155
155
  }
156
156
  if (finalValues.length > 0) {
157
- return (h("yoo-grid", { class: { table: true, form: !this.readonly }, ref: (el) => (this.gridEl = el), displayType: this.displayType, collectionName: this.collectionName, entityType: this.entityType, showSearch: true, items: finalValues, model: this.model, hideAdvancedFilters: true, customModel: this.customModel, secondaryActions: this.secondaryActions, isLocal: this.isLocal, isPdf: this.isPdf, initialQuery: this.initialQuery, preventSearchReset: true, onSelected: (ev) => {
157
+ return (h("yoo-grid", { class: { table: true, form: !this.readonly }, ref: (el) => (this.gridEl = el), displayType: this.displayType, collectionName: this.collectionName, entityType: this.entityType, showSearch: true, items: finalValues, model: this.model, hideAdvancedFilters: true, customModel: this.customModel, secondaryActions: this.secondaryActions, secondaryActionsDropdown: isWeb(this.host), isLocal: this.isLocal, isPdf: this.isPdf, initialQuery: this.initialQuery, preventSearchReset: true, onSelected: (ev) => {
158
+ var _a, _b, _c;
158
159
  ev.stopPropagation();
159
- this.onSelectItem(ev.detail);
160
+ if (((_c = (_b = (_a = this.customModel) === null || _a === void 0 ? void 0 : _a.appearance) === null || _b === void 0 ? void 0 : _b.get('uifields')) === null || _c === void 0 ? void 0 : _c.length) > 0) {
161
+ //do nothing because the user can interract with the form
162
+ }
163
+ else {
164
+ this.onSelectItem(ev.detail);
165
+ }
160
166
  }, onInputChanged: (ev) => ev === null || ev === void 0 ? void 0 : ev.stopPropagation() }));
161
167
  }
162
168
  return null;
package/dist/esm/yoo-card-list.entry.js CHANGED
@@ -7,13 +7,14 @@ import { am as isImage, ak as isVideo, an as downloadFile, t as translate, H as
7
7
  import './index-4bbbf966.js';
8
8
  import './_commonjsHelpers-f4d11124.js';
9
9
 
10
- const cardListCss = "svg:not(:root){overflow:hidden}.bg-accent{background-color:var(--accent, #276ef1) !important}.accent{color:var(--accent, #276ef1);fill:var(--accent, #276ef1)}.bg-app-color{background-color:var(--app-color, #5a30f4) !important}.app-color{color:var(--app-color, #5a30f4);fill:var(--app-color, #5a30f4)}.bg-danger{background-color:var(--danger, #d44333) !important}.danger{color:var(--danger, #d44333);fill:var(--danger, #d44333)}.bg-dark{background-color:var(--dark, #000000) !important}.dark{color:var(--dark, #000000);fill:var(--dark, #000000)}.bg-energized{background-color:var(--energized, #ffc043) !important}.energized{color:var(--energized, #ffc043);fill:var(--energized, #ffc043)}.bg-info{background-color:var(--info, #d84c96) !important}.info{color:var(--info, #d84c96);fill:var(--info, #d84c96)}.bg-light{background-color:var(--light, #ffffff) !important}.light{color:var(--light, #ffffff);fill:var(--light, #ffffff)}.bg-stable{background-color:var(--stable, #adadad) !important}.stable{color:var(--stable, #adadad);fill:var(--stable, #adadad)}.bg-stable-alt{background-color:var(--stable-alt, #d0d0d0) !important}.stable-alt{color:var(--stable-alt, #d0d0d0);fill:var(--stable-alt, #d0d0d0)}.bg-stable-light{background-color:var(--stable-light, #f1f1f1) !important}.stable-light{color:var(--stable-light, #f1f1f1);fill:var(--stable-light, #f1f1f1)}.bg-stable-ultralight{background-color:var(--stable-ultralight, #fafafa) !important}.stable-ultralight{color:var(--stable-ultralight, #fafafa);fill:var(--stable-ultralight, #fafafa)}.bg-success{background-color:var(--success, #3aa76d) !important}.success{color:var(--success, #3aa76d);fill:var(--success, #3aa76d)}.bg-text-color{background-color:var(--text-color, #807f83) !important}.text-color{color:var(--text-color, #807f83);fill:var(--text-color, #807f83)}.bg-warning{background-color:var(--warning, #ed6e33) !important}.warning{color:var(--warning, #ed6e33);fill:var(--warning, #ed6e33)}.bg-wood{background-color:var(--wood, #99644c) !important}.wood{color:var(--wood, #99644c);fill:var(--wood, #99644c)}:host{display:block;height:100%;background:var(--card-list-background);cursor:pointer}:host yoo-tag.distance{--padding:0;margin-left:var(--spacing-08, 0.5rem)}:host .outer-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding-bottom:0.25rem;border-bottom:var(--border-bottom-outer-container);-webkit-transition:background-color 0.3s ease, padding 0.3s ease;transition:background-color 0.3s ease, padding 0.3s ease}:host .outer-container .content-container{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:var(--justify-content-content-container);justify-content:var(--justify-content-content-container);-ms-flex-pack:center;justify-content:center;width:100%;margin-right:var(--margin-content-container-right);margin-left:var(--margin-content-container-left);overflow:hidden}:host .outer-container .content-container.has-image{margin-left:0}:host .outer-container .content-container .heading-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:start;align-items:flex-start;-ms-flex-align:center;align-items:center;margin-bottom:var(--spacing-02, 0.125rem);font-size:var(--font-size-16, 1rem);line-height:1.5}:host .outer-container .content-container .heading-container .margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .content-container .heading-container yoo-avatars{margin-right:0.125rem}:host .outer-container .content-container .heading-container .card-heading{-ms-flex:1;flex:1;min-width:0;color:var(--dark, #000000)}:host .outer-container .content-container .heading-container .card-heading .heading-title{display:-webkit-box;max-height:calc((var(--font-size-16, 1rem) + 0.125rem) * 2);overflow:hidden;line-height:calc(var(--font-size-16, 1rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}:host .outer-container .content-container .heading-container .card-heading .heading-title span{display:block;overflow:hidden;text-overflow:ellipsis}:host .outer-container .content-container .heading-container .card-heading .heading-circle{display:inline-block;width:0.5rem;height:0.5rem;margin-right:0.2rem;border-radius:50%}:host .outer-container .content-container .heading-container .card-heading *{-webkit-margin-before:0;margin-block-start:0;-webkit-margin-after:0;margin-block-end:0}:host .outer-container .content-container .heading-container .card-heading .ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .subheading-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-bottom:var(--spacing-02, 0.125rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem)}:host .outer-container .content-container .subheading-container html,:host .outer-container .content-container .subheading-container body,:host .outer-container .content-container .subheading-container div:not([class^=fr-]),:host .outer-container .content-container .subheading-container span:not([class^=fr-]),:host .outer-container .content-container .subheading-container img:not([class^=fr-]),:host .outer-container .content-container .subheading-container applet,:host .outer-container .content-container .subheading-container object,:host .outer-container .content-container .subheading-container iframe,:host .outer-container .content-container .subheading-container h1,:host .outer-container .content-container .subheading-container h2,:host .outer-container .content-container .subheading-container h3,:host .outer-container .content-container .subheading-container h4,:host .outer-container .content-container .subheading-container h5,:host .outer-container .content-container .subheading-container h6,:host .outer-container .content-container .subheading-container p,:host .outer-container .content-container .subheading-container blockquote,:host .outer-container .content-container .subheading-container pre,:host .outer-container .content-container .subheading-container a,:host .outer-container .content-container .subheading-container abbr,:host .outer-container .content-container .subheading-container acronym,:host .outer-container .content-container .subheading-container address,:host .outer-container .content-container .subheading-container big,:host .outer-container .content-container .subheading-container cite,:host .outer-container .content-container .subheading-container code,:host .outer-container .content-container .subheading-container del,:host .outer-container .content-container .subheading-container dfn,:host .outer-container .content-container .subheading-container em,:host .outer-container .content-container .subheading-container font,:host .outer-container .content-container .subheading-container ins,:host .outer-container .content-container .subheading-container kbd,:host .outer-container .content-container .subheading-container q,:host .outer-container .content-container .subheading-container s,:host .outer-container .content-container .subheading-container samp,:host .outer-container .content-container .subheading-container small,:host .outer-container .content-container .subheading-container strike,:host .outer-container .content-container .subheading-container strong,:host .outer-container .content-container .subheading-container sub,:host .outer-container .content-container .subheading-container sup,:host .outer-container .content-container .subheading-container tt,:host .outer-container .content-container .subheading-container var,:host .outer-container .content-container .subheading-container dl,:host .outer-container .content-container .subheading-container dt,:host .outer-container .content-container .subheading-container dd,:host .outer-container .content-container .subheading-container ol,:host .outer-container .content-container .subheading-container ul,:host .outer-container .content-container .subheading-container li,:host .outer-container .content-container .subheading-container fieldset,:host .outer-container .content-container .subheading-container form,:host .outer-container .content-container .subheading-container label,:host .outer-container .content-container .subheading-container legend,:host .outer-container .content-container .subheading-container table,:host .outer-container .content-container .subheading-container caption,:host .outer-container .content-container .subheading-container tbody,:host .outer-container .content-container .subheading-container tfoot,:host .outer-container .content-container .subheading-container thead,:host .outer-container .content-container .subheading-container tr,:host .outer-container .content-container .subheading-container th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host .outer-container .content-container .subheading-container .text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .avatar-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end;margin-top:0.5rem;padding-right:0.3rem}:host .outer-container .content-container .avatar-container yoo-avatar{margin-right:0.75rem;margin-left:0.15rem}:host .outer-container .content-container .action-button-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end}:host .outer-container .content-container .slot-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between;color:var(--text-color, #807f83);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .slot-container .inner-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}:host(.firefox) .content-container{margin-bottom:0}:host(.web):not(.framed) .outer-container{padding-top:1rem;padding-bottom:1rem;background-color:transparent}:host(.web) .outer-container .card-list-image-container.large{min-width:3.875rem}:host(.web) .outer-container .card-list-image-container.medium{min-width:2.875rem}:host(.web) .outer-container .card-list-image-container.small{min-width:2.375rem}:host(.web) .outer-container .content-container .top-container .badges-container.show-more{position:relative;overflow:visible}:host(.web) .outer-container .content-container .top-container .badges-container.show-more .more-button{position:absolute;top:0;right:0;bottom:auto;left:auto;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;width:2rem;height:1.125rem;font-size:var(--font-size-18, 1.125rem)}:host(.web) .outer-container .content-container .top-container .badges-container.show-more .more-button yoo-icon{padding-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000)}:host(.locations) .outer-container .content-container .top-container .heading-container .date-card-text{padding-right:var(--spacing-16, 1rem)}:host(.locations.map) .outer-container{-ms-flex-align:center;align-items:center;background:var(--light, #ffffff)}:host(.collapsible) .outer-container,:host(.locations.no-kpi:not(.framed)) .outer-container{-ms-flex-align:start;align-items:flex-start;width:auto;border-bottom:none;border-radius:0.5rem}:host(.collapsible) .outer-container .content-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container{margin:0.5rem 0 0;border:none}:host(.collapsible) .outer-container .content-container .top-container .heading-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container .top-container .heading-container{-ms-flex-pack:justify;justify-content:space-between;padding-top:0 !important;padding-right:var(--spacing-08, 0.5rem)}:host(.collapsible) .outer-container .content-container .top-container .subheading-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container .top-container .subheading-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.collapsible) .outer-container .content-container{margin-top:0}:host(.locations.no-kpi.map) .outer-container{-ms-flex-align:start;align-items:flex-start;max-width:18.75rem}:host(.locations.no-kpi:not(.framed)) yoo-tag.distance{margin-right:0.75rem}:host(.web.framed) .outer-container .content-container .top-container .heading-container{font-size:var(--font-size-16, 1rem)}:host(.android) .outer-container .content-container .top-container .heading-container .heading-title{display:-webkit-box;max-height:calc((var(--font-size-18, 1.125rem) + 0.25rem) * 2);overflow:hidden;line-height:calc(var(--font-size-18, 1.125rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}:host{--margin-content-container-left:0;--margin-content-container-right:0;--padding-content-container:var(--spacing-04, 0.25rem) 0 var(--spacing-08, 0.5rem) 0;--border-bottom-outer-container:var(--border-width-01, 0.0625rem) solid var(--stable-alt-40, rgba(208, 208, 208, 0.4));--overflow-card-heading-text:hidden;--text-overflow-card-heading-text:ellipsis;--white-space-card-heading-text:normal;--padding-right-card-heading:unset;--max-height-heading:48px;--card-list-background:none;--justify-content-content-container:flex-start;--max-card-heading-height:26px;--height-lessons-outer-container:2.5rem;--heading-font-size:var(--font-size-14, 0.875rem)}:host yoo-truncate{--max-lines:2}:host .heart-icon{width:var(--icon-size-05, 4rem)}:host .heart-icon yoo-lottie{width:var(--icon-size-02, 1.5rem);height:var(--icon-size-05, 4rem);margin:auto}:host .heart-icon yoo-lottie yoo-icon{top:1.3rem}:host .outer-container{padding-top:var(--spacing-04, 0.25rem)}:host .outer-container.tapped{background-color:var(--stable-light, #f1f1f1);-webkit-transition:background-color 0.3s ease;transition:background-color 0.3s ease}:host .outer-container .video-container{width:100%;max-height:350px;padding-top:var(--spacing-08, 0.5rem)}:host .outer-container .rank-container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;min-width:1.5rem;color:var(--stable, #adadad);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .heading-container yoo-tag.margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .content-container .heading-container .progress-box{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;color:var(--dark, #000000)}:host .outer-container .content-container .heading-container .progress-box .icon-text{font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .tags-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;padding-bottom:var(--spacing-04, 0.25rem);overflow:hidden;line-height:15px}:host .outer-container .content-container .tags-container yoo-tag,:host .outer-container .content-container .tags-container .card-icon{margin:var(--spacing-04, 0.25rem) var(--spacing-08, 0.5rem) var(--spacing-02, 0.125rem) var(--spacing-02, 0.125rem)}:host .outer-container .content-container .tags-container .hashtag{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:0.4375rem;color:var(--text-color, #807f83);font-size:var(--font-size-12, 0.75rem);-webkit-transform:translateY(0.125rem);transform:translateY(0.125rem)}:host .outer-container .content-container .tags-container .card-icon{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}:host .outer-container .content-container .tags-container .card-icon yoo-icon{margin-right:0.4375rem}:host .outer-container .content-container .tags-container .row-action{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;line-height:1rem}:host .outer-container .content-container .top-container .video-container{display:-ms-inline-flexbox;display:inline-flex;height:230px}:host .outer-container .content-container .top-container .heading-container .date-card-text{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-left:auto;padding:0 var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem);text-align:right}:host .outer-container .content-container .top-container .heading-container .points-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding-right:var(--spacing-08, 0.5rem);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .top-container .heading-container .points-container .points{padding:0 0.35rem}:host .outer-container .content-container .top-container .flex{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .outer-container.active{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host .outer-container .image-video-preview{width:12.5rem;height:6.25rem;padding:var(--spacing-08, 0.5rem);pointer-events:none}:host .outer-container .image-video-preview yoo-img{--border-radius:var(--border-radius-08, 0.5rem);height:100%}:host(.mobile.rtl) .outer-container .content-container{margin-right:var(--margin-content-container-left);margin-left:var(--margin-content-container-right)}:host(.mobile.rtl) .outer-container .content-container.has-image{margin-right:0}:host(.mobile.rtl) .outer-container .content-container .tags-container yoo-tag,:host(.mobile.rtl) .outer-container .content-container .tags-container .card-icon{margin:var(--spacing-04, 0.25rem) var(--spacing-02, 0.125rem) var(--spacing-02, 0.125rem) var(--spacing-08, 0.5rem)}:host(.mobile.rtl) .outer-container .content-container .top-container .subheading-container{margin-right:0;margin-left:var(--spacing-32, 2rem)}:host(.current) .outer-container .rank-container{color:var(--app-color, #5a30f4)}:host(.current) .outer-container .content-container .leaderboard .heading-container .card-heading{color:var(--app-color, #5a30f4)}:host(.current.leaderboard){background-color:var(--app-color, #5a30f4) !important}:host(.current.leaderboard) .outer-container .rank-container{color:var(--light, #ffffff)}:host(.current.leaderboard) .outer-container .content-container .leaderboard .heading-container .card-heading{color:var(--light, #ffffff)}:host(.current.leaderboard) .outer-container .points-container{color:var(--light, #ffffff)}:host(.leaderboard.userranks){height:var(--spacing-40, 2.5rem)}:host(.leaderboard.userranks) .outer-container{height:100%;padding:0 !important}:host(.leaderboard.userranks) .icon-container{color:var(--app-color, #5a30f4) !important}:host(.leaderboard){padding-left:var(--spacing-16, 1rem);color:var(--dark, #000000);background-color:var(--light, #ffffff);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));opacity:1}:host(.secondary-view){--border-bottom-outer-container:0px;background:transparent}:host(.secondary-view) .outer-container{padding-top:var(--spacing-08, 0.5rem)}:host(.secondary-view) .outer-container .question-content{border-bottom:var(--border-bottom-outer-container)}:host(.secondary-view) .outer-container .content-container .heading-container{font-size:var(--font-size-16, 1rem)}:host(.secondary-view) .outer-container .content-container .heading-container .date-card-text{display:block;padding:0;line-height:normal;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.secondary-view) .outer-container .content-container .translate-container{position:relative;margin-bottom:var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-weight:normal;font-size:var(--font-size-16, 1rem);font-style:normal;font-stretch:normal;line-height:1;letter-spacing:normal}:host(.secondary-view) .outer-container .content-container .translate-container.active{margin-left:var(--spacing-04, 0.25rem);padding-left:var(--spacing-08, 0.5rem);border-left:var(--border-width-02, 0.125rem) solid var(--stable-alt, #d0d0d0)}:host(.secondary-view) .outer-container .content-container .translate-container .text{margin-bottom:var(--spacing-04, 0.25rem);color:var(--dark, #000000)}:host(.secondary-view) .outer-container .content-container .translate-container .text html,:host(.secondary-view) .outer-container .content-container .translate-container .text body,:host(.secondary-view) .outer-container .content-container .translate-container .text div:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text span:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text img:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text applet,:host(.secondary-view) .outer-container .content-container .translate-container .text object,:host(.secondary-view) .outer-container .content-container .translate-container .text iframe,:host(.secondary-view) .outer-container .content-container .translate-container .text h1,:host(.secondary-view) .outer-container .content-container .translate-container .text h2,:host(.secondary-view) .outer-container .content-container .translate-container .text h3,:host(.secondary-view) .outer-container .content-container .translate-container .text h4,:host(.secondary-view) .outer-container .content-container .translate-container .text h5,:host(.secondary-view) .outer-container .content-container .translate-container .text h6,:host(.secondary-view) .outer-container .content-container .translate-container .text p,:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote,:host(.secondary-view) .outer-container .content-container .translate-container .text pre,:host(.secondary-view) .outer-container .content-container .translate-container .text a,:host(.secondary-view) .outer-container .content-container .translate-container .text abbr,:host(.secondary-view) .outer-container .content-container .translate-container .text acronym,:host(.secondary-view) .outer-container .content-container .translate-container .text address,:host(.secondary-view) .outer-container .content-container .translate-container .text big,:host(.secondary-view) .outer-container .content-container .translate-container .text cite,:host(.secondary-view) .outer-container .content-container .translate-container .text code,:host(.secondary-view) .outer-container .content-container .translate-container .text del,:host(.secondary-view) .outer-container .content-container .translate-container .text dfn,:host(.secondary-view) .outer-container .content-container .translate-container .text em,:host(.secondary-view) .outer-container .content-container .translate-container .text font,:host(.secondary-view) .outer-container .content-container .translate-container .text ins,:host(.secondary-view) .outer-container .content-container .translate-container .text kbd,:host(.secondary-view) .outer-container .content-container .translate-container .text q,:host(.secondary-view) .outer-container .content-container .translate-container .text s,:host(.secondary-view) .outer-container .content-container .translate-container .text samp,:host(.secondary-view) .outer-container .content-container .translate-container .text small,:host(.secondary-view) .outer-container .content-container .translate-container .text strike,:host(.secondary-view) .outer-container .content-container .translate-container .text strong,:host(.secondary-view) .outer-container .content-container .translate-container .text sub,:host(.secondary-view) .outer-container .content-container .translate-container .text sup,:host(.secondary-view) .outer-container .content-container .translate-container .text tt,:host(.secondary-view) .outer-container .content-container .translate-container .text var,:host(.secondary-view) .outer-container .content-container .translate-container .text dl,:host(.secondary-view) .outer-container .content-container .translate-container .text dt,:host(.secondary-view) .outer-container .content-container .translate-container .text dd,:host(.secondary-view) .outer-container .content-container .translate-container .text ol,:host(.secondary-view) .outer-container .content-container .translate-container .text ul,:host(.secondary-view) .outer-container .content-container .translate-container .text li,:host(.secondary-view) .outer-container .content-container .translate-container .text fieldset,:host(.secondary-view) .outer-container .content-container .translate-container .text form,:host(.secondary-view) .outer-container .content-container .translate-container .text label,:host(.secondary-view) .outer-container .content-container .translate-container .text legend,:host(.secondary-view) .outer-container .content-container .translate-container .text table,:host(.secondary-view) .outer-container .content-container .translate-container .text caption,:host(.secondary-view) .outer-container .content-container .translate-container .text tbody,:host(.secondary-view) .outer-container .content-container .translate-container .text tfoot,:host(.secondary-view) .outer-container .content-container .translate-container .text thead,:host(.secondary-view) .outer-container .content-container .translate-container .text tr,:host(.secondary-view) .outer-container .content-container .translate-container .text th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote{padding-left:1rem;border-left:var(--border-width-04, 0.25rem) solid var(--stable, #adadad)}:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote:last-of-type blockquote p:last-of-type,:host(.secondary-view) .outer-container .content-container .translate-container .text p:last-of-type{padding-top:0;padding-bottom:0}:host(.secondary-view) .outer-container .content-container .translate-container .text ol,:host(.secondary-view) .outer-container .content-container .translate-container .text ul{margin:revert;padding:revert}:host(.secondary-view) .outer-container .content-container .translate-container .text h1{display:block;margin-top:0.67em;margin-right:0;margin-bottom:0.67em;margin-left:0;font-weight:bold;font-size:2em}:host(.secondary-view) .outer-container .content-container .translate-container .text h2{display:block;margin-top:0.83em;margin-right:0;margin-bottom:0.83em;margin-left:0;font-weight:bold;font-size:1.5em}:host(.secondary-view) .outer-container .content-container .translate-container .text h3{display:block;margin-top:1em;margin-right:0;margin-bottom:1em;margin-left:0;font-weight:bold;font-size:1.17em}:host(.secondary-view) .outer-container .content-container .translate-container .text h4{display:block;margin-top:1.33em;margin-right:0;margin-bottom:1.33em;margin-left:0;font-weight:bold}:host(.secondary-view) .outer-container .content-container .translate-container .text h5{display:block;margin-top:1.67em;margin-right:0;margin-bottom:1.67em;margin-left:0;font-weight:bold;font-size:0.83em}:host(.secondary-view) .outer-container .content-container .translate-container .text h6{display:block;margin-top:2.33em;margin-right:0;margin-bottom:2.33em;margin-left:0;font-weight:bold;font-size:0.67em}:host(.secondary-view) .outer-container .content-container .translate-container .text strong{font-weight:bold}:host(.secondary-view) .outer-container .content-container .translate-container .text em{font-style:italic}:host(.secondary-view) .outer-container .content-container .subheading-container{display:block;max-height:initial;overflow:visible;color:var(--dark, #000000);font-size:var(--font-size-16, 1rem);line-height:20px;white-space:pre-wrap;word-wrap:break-word}:host(.secondary-view) .outer-container .content-container .subheading-container html,:host(.secondary-view) .outer-container .content-container .subheading-container body,:host(.secondary-view) .outer-container .content-container .subheading-container div:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container span:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container img:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container applet,:host(.secondary-view) .outer-container .content-container .subheading-container object,:host(.secondary-view) .outer-container .content-container .subheading-container iframe,:host(.secondary-view) .outer-container .content-container .subheading-container h1,:host(.secondary-view) .outer-container .content-container .subheading-container h2,:host(.secondary-view) .outer-container .content-container .subheading-container h3,:host(.secondary-view) .outer-container .content-container .subheading-container h4,:host(.secondary-view) .outer-container .content-container .subheading-container h5,:host(.secondary-view) .outer-container .content-container .subheading-container h6,:host(.secondary-view) .outer-container .content-container .subheading-container p,:host(.secondary-view) .outer-container .content-container .subheading-container blockquote,:host(.secondary-view) .outer-container .content-container .subheading-container pre,:host(.secondary-view) .outer-container .content-container .subheading-container a,:host(.secondary-view) .outer-container .content-container .subheading-container abbr,:host(.secondary-view) .outer-container .content-container .subheading-container acronym,:host(.secondary-view) .outer-container .content-container .subheading-container address,:host(.secondary-view) .outer-container .content-container .subheading-container big,:host(.secondary-view) .outer-container .content-container .subheading-container cite,:host(.secondary-view) .outer-container .content-container .subheading-container code,:host(.secondary-view) .outer-container .content-container .subheading-container del,:host(.secondary-view) .outer-container .content-container .subheading-container dfn,:host(.secondary-view) .outer-container .content-container .subheading-container em,:host(.secondary-view) .outer-container .content-container .subheading-container font,:host(.secondary-view) .outer-container .content-container .subheading-container ins,:host(.secondary-view) .outer-container .content-container .subheading-container kbd,:host(.secondary-view) .outer-container .content-container .subheading-container q,:host(.secondary-view) .outer-container .content-container .subheading-container s,:host(.secondary-view) .outer-container .content-container .subheading-container samp,:host(.secondary-view) .outer-container .content-container .subheading-container small,:host(.secondary-view) .outer-container .content-container .subheading-container strike,:host(.secondary-view) .outer-container .content-container .subheading-container strong,:host(.secondary-view) .outer-container .content-container .subheading-container sub,:host(.secondary-view) .outer-container .content-container .subheading-container sup,:host(.secondary-view) .outer-container .content-container .subheading-container tt,:host(.secondary-view) .outer-container .content-container .subheading-container var,:host(.secondary-view) .outer-container .content-container .subheading-container dl,:host(.secondary-view) .outer-container .content-container .subheading-container dt,:host(.secondary-view) .outer-container .content-container .subheading-container dd,:host(.secondary-view) .outer-container .content-container .subheading-container ol,:host(.secondary-view) .outer-container .content-container .subheading-container ul,:host(.secondary-view) .outer-container .content-container .subheading-container li,:host(.secondary-view) .outer-container .content-container .subheading-container fieldset,:host(.secondary-view) .outer-container .content-container .subheading-container form,:host(.secondary-view) .outer-container .content-container .subheading-container label,:host(.secondary-view) .outer-container .content-container .subheading-container legend,:host(.secondary-view) .outer-container .content-container .subheading-container table,:host(.secondary-view) .outer-container .content-container .subheading-container caption,:host(.secondary-view) .outer-container .content-container .subheading-container tbody,:host(.secondary-view) .outer-container .content-container .subheading-container tfoot,:host(.secondary-view) .outer-container .content-container .subheading-container thead,:host(.secondary-view) .outer-container .content-container .subheading-container tr,:host(.secondary-view) .outer-container .content-container .subheading-container th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host(.secondary-view) .outer-container .content-container .subheading-container blockquote{padding-left:1rem;border-left:var(--border-width-04, 0.25rem) solid var(--stable, #adadad)}:host(.secondary-view) .outer-container .content-container .subheading-container blockquote:last-of-type blockquote p:last-of-type,:host(.secondary-view) .outer-container .content-container .subheading-container p:last-of-type{padding-top:0;padding-bottom:0}:host(.secondary-view) .outer-container .content-container .subheading-container ol,:host(.secondary-view) .outer-container .content-container .subheading-container ul{margin:revert;padding:revert}:host(.secondary-view) .outer-container .content-container .subheading-container h1{display:block;margin-top:0.67em;margin-right:0;margin-bottom:0.67em;margin-left:0;font-weight:bold;font-size:2em}:host(.secondary-view) .outer-container .content-container .subheading-container h2{display:block;margin-top:0.83em;margin-right:0;margin-bottom:0.83em;margin-left:0;font-weight:bold;font-size:1.5em}:host(.secondary-view) .outer-container .content-container .subheading-container h3{display:block;margin-top:1em;margin-right:0;margin-bottom:1em;margin-left:0;font-weight:bold;font-size:1.17em}:host(.secondary-view) .outer-container .content-container .subheading-container h4{display:block;margin-top:1.33em;margin-right:0;margin-bottom:1.33em;margin-left:0;font-weight:bold}:host(.secondary-view) .outer-container .content-container .subheading-container h5{display:block;margin-top:1.67em;margin-right:0;margin-bottom:1.67em;margin-left:0;font-weight:bold;font-size:0.83em}:host(.secondary-view) .outer-container .content-container .subheading-container h6{display:block;margin-top:2.33em;margin-right:0;margin-bottom:2.33em;margin-left:0;font-weight:bold;font-size:0.67em}:host(.secondary-view) .outer-container .content-container .subheading-container strong{font-weight:bold}:host(.secondary-view) .outer-container .content-container .subheading-container em{font-style:italic}:host(.secondary-view) .outer-container .content-container .subheading-container.comment-image{--border-radius:var(--border-radius-16, 1rem);margin-top:9px;overflow:hidden}:host(.secondary-view) .outer-container .content-container .subheading-container span.with-markdown{white-space:normal}:host(.secondary-view) .outer-container .content-container .subheading-container span.with-markdown img{width:100%;max-width:initial !important}:host(.secondary-view) .outer-container .content-container .top-container{padding:var(--spacing-08, 0.5rem);background:var(--stable-light-60, rgba(241, 241, 241, 0.6));border-radius:var(--border-radius-04, 0.25rem)}:host(.secondary-view) .outer-container .content-container .top-container .card-heading{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;width:100%;padding-right:var(--spacing-08, 0.5rem)}:host(.secondary-view) .outer-container .content-container .top-container .card-heading .card-heading-text{font-weight:var(--font-weight-700, 700)}:host(.secondary-view) .outer-container .content-container .top-container .heading-container .heading-title{display:block}:host(.secondary-view) .outer-container .content-container .top-container .heading-container .heading-title span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.secondary-view) .outer-container .content-container .top-container span{display:block;font-size:var(--font-size-16, 1rem)}:host(.secondary-view) .outer-container .content-container .slot-container yoo-img{margin-right:auto}:host(.secondary-view) .tags-container{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center;margin-top:-0.85rem;margin-left:1.875rem;font-size:var(--font-size-14, 0.875rem)}:host(.secondary-view) .tags-container .card-icon.right{margin-left:auto}:host(.secondary-view) .tags-container .card-icon.right yoo-icon{margin:0}:host(.secondary-view) .tags-container .row-action{width:100%;margin-top:-0.875rem;margin-left:1.25rem}:host(.secondary-view) .tags-container .row-action span{color:var(--dark, #000000)}:host(.secondary-view) .tags-container .bottom-action{margin-right:1.25rem;color:var(--text-color, #807f83)}:host(.questionsAnswers) .tags-container{margin-left:2.8125rem}:host(.questionsAnswers) .tags-container .card-icon:not(.heart-icon){margin:var(--spacing-16, 1rem) var(--spacing-16, 1rem) 0 0}:host(.questionsAnswers) .tags-container .row-action{margin-top:var(--spacing-08, 0.5rem);margin-left:0}:host(.entitycomments) .tags-container,:host(.feedsComments) .tags-container{margin-left:1.75rem}:host(.userranks) .outer-container,:host(.userhighscores) .outer-container{-ms-flex-align:center;align-items:center;padding:var(--spacing-08, 0.5rem) 0 !important;background-color:transparent;border-bottom:0}:host(.userranks) .heading-container,:host(.userhighscores) .heading-container{word-wrap:break-word}:host(.active) .outer-container{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host(.hoverable):hover .outer-container{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host(.filesFolders) .outer-container .content-container .subheading-container,:host(.files) .outer-container .content-container .subheading-container{margin:0;font-size:var(--font-size-12, 0.75rem)}:host(.filesFolders) .outer-container .content-container .subheading-container em,:host(.files) .outer-container .content-container .subheading-container em{color:var(--dark, #000000);font-weight:bold;background:#FDFB2F}:host(.locations.external) .outer-container .content-container .subheading-container{white-space:normal}:host(.products) .outer-container .content-container{border-bottom:none}:host(.outofstock),:host(.hidden){opacity:0.5}:host(.productweightpair) .outer-container .content-container .heading-container .date-card-text{color:var(--dark, #000000)}:host(.catalog-display.history) .outer-container .content-container{text-align:left}:host(.catalog-display.history) .outer-container .content-container .top-container .price{font-size:var(--font-size-12, 0.75rem)}:host(.catalog-display.history) .outer-container .content-container .top-container .tags-container{padding-bottom:var(--spacing-04, 0.25rem)}:host(.catalog-display){width:100%}:host(.catalog-display) .outer-container{-ms-flex-align:start;align-items:flex-start;font-size:var(--font-size-14, 0.875rem);border:none !important}:host(.catalog-display) .outer-container .content-container{-ms-flex-pack:center;justify-content:center;margin-left:1rem;padding:0;border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host(.catalog-display) .outer-container .content-container .top-container .card-heading{font-size:var(--font-size-14, 0.875rem)}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container{min-height:1rem;max-height:0.8rem;color:var(--dark, #000000);font-size:var(--font-size-12, 0.75rem);line-height:1rem}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container .subheading-grey{color:var(--stable, #adadad)}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container .subheading-price{color:var(--dark, #000000)}:host(.catalog-display) .outer-container .content-container .top-container .price{color:var(--text-color, #807f83)}:host(.catalog-display) .outer-container .content-container .top-container .tags-container{overflow:initial;line-height:normal}:host(.catalog-display.no-border) .outer-container .content-container{border-bottom:none}:host(.productbatch.archived) .outer-container .content-container{opacity:0.5}:host(.offline:not(.missions)) .outer-container{opacity:0.7}:host(.offline:not(.missions))::before,:host(.offline:not(.missions))::after{position:absolute;top:0;right:0;border-color:transparent;border-style:solid;content:\"\"}:host(.offline:not(.missions))::after{border-width:0.5em;border-top-color:var(--energized, #ffc043);border-right-color:var(--energized, #ffc043)}:host(.notifications) .outer-container{padding-top:var(--spacing-04, 0.25rem)}:host(.notes) .outer-container .content-container .heading-container .card-heading .heading-title{display:-webkit-box;max-height:calc((var(--font-size-18, 1.125rem) + 0.125rem) * 1);overflow:hidden;line-height:calc(var(--font-size-18, 1.125rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:1;}:host(.no-text-break) .outer-container .content-container .top-container .heading-container .card-heading{white-space:normal}:host(.lessons.web) .outer-container{height:var(--height-lessons-outer-container);min-height:0;margin:var(--spacing-04, 0.25rem) 0;padding-left:var(--spacing-08, 0.5rem);border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:var(--card-shadow-2, 0 0.3125rem 0.9375rem 0 rgba(40, 47, 54, 0.08));box-shadow:var(--card-shadow-2, 0 0.3125rem 0.9375rem 0 rgba(40, 47, 54, 0.08))}:host(.lessons.web) .outer-container .content-container{border-bottom:none}:host(.lessons.web) .outer-container .content-container .top-container{display:-ms-flexbox;display:flex}:host(.lessons.web) .outer-container .content-container .heading-container{-ms-flex:1;flex:1;width:75%;padding-right:var(--spacing-08, 0.5rem);font-size:var(--heading-font-size)}:host(.lessons.web) .outer-container .content-container .heading-container .card-heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding-top:0}:host(.lessons.web.finished) .outer-container{background-color:var(--app-color, #5a30f4)}:host(.lessons.web.finished) .outer-container .card-heading,:host(.lessons.web.finished) .outer-container .icon-container{color:var(--light-10, rgba(255, 255, 255, 0.1))}:host(.lessons.web.locked) .outer-container{background-color:var(--stable-alt, #d0d0d0)}:host(.lessons.web.locked) .outer-container .card-heading{color:var(--text-color, #807f83)}:host(.lessons.web.locked) .outer-container .top-container yoo-avatar{margin:0 0.75rem}:host(.missions.finished:not(.grid-cell)) .outer-container{padding-bottom:var(--spacing-16, 1rem)}:host(.courseselection) .outer-container .content-container{-ms-flex-pack:center;justify-content:center;margin-left:0}:host(.courseselection) .outer-container .content-container .top-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host(.courseselection) .outer-container .content-container .top-container .heading-container{-ms-flex-order:2;order:2;font-size:var(--font-size-16, 1rem)}:host(.courseselection) .outer-container .content-container .top-container .subheading-container{-ms-flex-order:1;order:1;color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem)}:host(.courseselection) .outer-container .content-container .top-container .subheading-container .todo{font-size:var(--font-size-14, 0.875rem)}:host(.courseselection) .outer-container .content-container .top-container .tags-container{padding-bottom:0}:host(.questions) .outer-container{padding-bottom:0;border-bottom:0}:host(.questions) .outer-container .content-container .top-container .heading-container{max-height:1.25rem;margin-bottom:0}:host(.questions) .outer-container .content-container .top-container .heading-container .card-heading .heading-title{color:var(--dark, #000000);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:var(--spacing-04, 0.25rem)}:host(.questions) .question-container.no-img{padding-top:var(--spacing-04, 0.25rem)}:host(.questions) .question-container.no-img .question-content{height:auto}:host(.questions) .question-container .question-content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:98px;margin-left:var(--spacing-08, 0.5rem);padding-bottom:var(--spacing-16, 1rem);border-bottom:var(--border-bottom-outer-container)}:host(.questions) .question-container .question-content .question-title{margin-bottom:var(--spacing-08, 0.5rem);font-weight:var(--font-weight-700, 700);font-size:var(--font-size-18, 1.125rem);word-break:break-word}:host(.questions) .question-container .question-content .question-icons{display:-ms-flexbox;display:flex;color:var(--stable-alt, #d0d0d0);font-size:var(--icon-size-01, 1rem)}:host(.questions) .question-container .question-content .question-icons .inner-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000);font-size:var(--font-size-18, 1.125rem)}:host(.questions) .question-container .question-content .question-icons .inner-container yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host(.questions) .question-container .question-content .subheadings{display:-ms-flexbox;display:flex;color:var(--text-color, #807f83)}:host(.questions) .question-container .question-content .subheadings .subheading-container{padding-right:var(--spacing-08, 0.5rem);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .question-content .subheadings .date-card-text{margin-right:var(--spacing-08, 0.5rem);color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .question-content .tags-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;overflow:hidden}:host(.questions) .question-container .question-content .tags-container .hashtag{margin-right:0.4375rem;color:var(--app-color, #5a30f4);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .image-video-preview{min-width:7.5rem;height:98px;padding:var(--spacing-08, 0.5rem);pointer-events:none}:host(.questions) .question-container .image-video-preview yoo-img{--border-radius:var(--border-radius-08, 0.5rem)}:host(.questions) .question-container .image-video-preview yoo-videoplayer-core{overflow:hidden;border-radius:var(--border-radius-08, 0.5rem)}:host(.card-feed) .outer-container{display:none}:host(.card-feed) .question-container{-ms-flex-pack:initial !important;justify-content:initial !important;background:var(--light-10, rgba(255, 255, 255, 0.1));border-bottom:none !important;-webkit-box-shadow:var(--grid-frame-shadow, 0 0.3125rem 0.9375rem 0.1875rem rgba(40, 47, 54, 0.15));box-shadow:var(--grid-frame-shadow, 0 0.3125rem 0.9375rem 0.1875rem rgba(40, 47, 54, 0.15))}:host(.card-feed) .question-container .image-video-preview{-ms-flex-negative:0;flex-shrink:0;-ms-flex-order:1;order:1;width:130px;height:89px;padding-right:var(--spacing-16, 1rem)}:host(.card-feed) .question-container .image-video-preview yoo-videoplayer-core{overflow:hidden;border-radius:5px}:host(.card-feed) .question-container .question-content{-ms-flex-pack:initial !important;justify-content:initial !important;-ms-flex-order:2;order:2;margin-left:0;padding:var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) 0}:host(.selected-content) .question-container{padding:0}:host(.selected-content) .question-container .image-video-preview{min-width:2rem;height:1.5rem;padding-left:0}:host(.selected-content) .question-container .question-content{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;height:auto;margin:0;padding-bottom:0;border-bottom:none}:host(.selected-content) .question-container .question-content .question-title{margin:0;font-weight:var(--font-weight-400, 400);font-size:var(--font-size-16, 1rem)}:host(.selected-content) .outer-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.selected-content) .outer-container .content-container .heading-container{margin-bottom:var(--spacing-02, 0.125rem)}:host(.selected-content) .outer-container .content-container .heading-container .card-heading .heading-title span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.selected-content) .outer-container .content-container .uifield-container{display:none}:host(.web.grid-cell){overflow:hidden}:host(.web.grid-cell) .outer-container{padding-top:var(--spacing-08, 0.5rem);padding-bottom:var(--spacing-08, 0.5rem)}:host(.web.grid-cell) .outer-container .content-container .tags-container{-ms-flex-wrap:initial;flex-wrap:initial}:host(.mobile.autocomplete-selection-mode) .question-container .question-title{font-size:var(--font-size-16, 1rem)}:host(.mobile.autocomplete-selection-mode) .subheading-container{margin-right:var(--spacing-32, 2rem)}:host(.no-border-bottom.mobile) .outer-container{border-bottom:none}:host(.no-border-bottom.mobile) .question-container .question-content{border-bottom:none}:host(.item-disabled){cursor:default}:host(.kanban) .outer-container{padding-top:0;padding-bottom:0}:host(.web.videocallusers) .outer-container{padding-top:0;padding-bottom:0}:host(.web.firefox) .outer-container{height:auto}:host(.violetproducts) .outer-container,:host(.violetbasketitems) .outer-container{-ms-flex-align:center;align-items:center}:host(.violetproducts) .outer-container yoo-icon.arrow,:host(.violetbasketitems) .outer-container yoo-icon.arrow{margin-top:var(--spacing-04, 0.25rem);margin-right:var(--spacing-04, 0.25rem);margin-bottom:auto}:host(.violetproducts) .content-container,:host(.violetbasketitems) .content-container{border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host(.form-permission) .outer-container{height:auto}:host(.pages) .outer-container{-ms-flex-align:center;align-items:center}:host(.missions.feed) .outer-container{border-bottom:none !important}:host(.calendarEvents) .outer-container .content-container .heading-container{margin-bottom:unset}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container .dot-event,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container .dot-event{margin-right:var(--spacing-04, 0.25rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container .icon-event,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container .icon-event{margin-right:var(--spacing-08, 0.5rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .title{font-weight:bold;font-size:var(--font-size-16, 1rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .time{color:var(--app-color, #5a30f4)}:host(.course-info) .outer-container,:host(.learning-manager) .outer-container{padding-top:var(--spacing-16, 1rem)}";
10
+ const cardListCss = "svg:not(:root){overflow:hidden}.bg-accent{background-color:var(--accent, #276ef1) !important}.accent{color:var(--accent, #276ef1);fill:var(--accent, #276ef1)}.bg-app-color{background-color:var(--app-color, #5a30f4) !important}.app-color{color:var(--app-color, #5a30f4);fill:var(--app-color, #5a30f4)}.bg-danger{background-color:var(--danger, #d44333) !important}.danger{color:var(--danger, #d44333);fill:var(--danger, #d44333)}.bg-dark{background-color:var(--dark, #000000) !important}.dark{color:var(--dark, #000000);fill:var(--dark, #000000)}.bg-energized{background-color:var(--energized, #ffc043) !important}.energized{color:var(--energized, #ffc043);fill:var(--energized, #ffc043)}.bg-info{background-color:var(--info, #d84c96) !important}.info{color:var(--info, #d84c96);fill:var(--info, #d84c96)}.bg-light{background-color:var(--light, #ffffff) !important}.light{color:var(--light, #ffffff);fill:var(--light, #ffffff)}.bg-stable{background-color:var(--stable, #adadad) !important}.stable{color:var(--stable, #adadad);fill:var(--stable, #adadad)}.bg-stable-alt{background-color:var(--stable-alt, #d0d0d0) !important}.stable-alt{color:var(--stable-alt, #d0d0d0);fill:var(--stable-alt, #d0d0d0)}.bg-stable-light{background-color:var(--stable-light, #f1f1f1) !important}.stable-light{color:var(--stable-light, #f1f1f1);fill:var(--stable-light, #f1f1f1)}.bg-stable-ultralight{background-color:var(--stable-ultralight, #fafafa) !important}.stable-ultralight{color:var(--stable-ultralight, #fafafa);fill:var(--stable-ultralight, #fafafa)}.bg-success{background-color:var(--success, #3aa76d) !important}.success{color:var(--success, #3aa76d);fill:var(--success, #3aa76d)}.bg-text-color{background-color:var(--text-color, #807f83) !important}.text-color{color:var(--text-color, #807f83);fill:var(--text-color, #807f83)}.bg-warning{background-color:var(--warning, #ed6e33) !important}.warning{color:var(--warning, #ed6e33);fill:var(--warning, #ed6e33)}.bg-wood{background-color:var(--wood, #99644c) !important}.wood{color:var(--wood, #99644c);fill:var(--wood, #99644c)}:host{display:block;height:100%;background:var(--card-list-background);cursor:pointer}:host yoo-tag.distance{--padding:0;margin-left:var(--spacing-08, 0.5rem)}:host .outer-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding-bottom:0.25rem;border-bottom:var(--border-bottom-outer-container);-webkit-transition:background-color 0.3s ease, padding 0.3s ease;transition:background-color 0.3s ease, padding 0.3s ease}:host .outer-container .content-container{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:var(--justify-content-content-container);justify-content:var(--justify-content-content-container);-ms-flex-pack:center;justify-content:center;width:100%;margin-right:var(--margin-content-container-right);margin-left:var(--margin-content-container-left);overflow:hidden}:host .outer-container .content-container.has-image{margin-left:0}:host .outer-container .content-container .heading-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:start;align-items:flex-start;-ms-flex-align:center;align-items:center;margin-bottom:var(--spacing-02, 0.125rem);font-size:var(--font-size-16, 1rem);line-height:1.5}:host .outer-container .content-container .heading-container .margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .content-container .heading-container yoo-avatars{margin-right:0.125rem}:host .outer-container .content-container .heading-container .card-heading{-ms-flex:1;flex:1;min-width:0;color:var(--dark, #000000)}:host .outer-container .content-container .heading-container .card-heading .heading-title{display:-webkit-box;max-height:calc((var(--font-size-16, 1rem) + 0.125rem) * 2);overflow:hidden;line-height:calc(var(--font-size-16, 1rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}:host .outer-container .content-container .heading-container .card-heading .heading-title span{display:block;overflow:hidden;text-overflow:ellipsis}:host .outer-container .content-container .heading-container .card-heading .heading-circle{display:inline-block;width:0.5rem;height:0.5rem;margin-right:0.2rem;border-radius:50%}:host .outer-container .content-container .heading-container .card-heading *{-webkit-margin-before:0;margin-block-start:0;-webkit-margin-after:0;margin-block-end:0}:host .outer-container .content-container .heading-container .card-heading .ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .subheading-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-bottom:var(--spacing-02, 0.125rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem)}:host .outer-container .content-container .subheading-container html,:host .outer-container .content-container .subheading-container body,:host .outer-container .content-container .subheading-container div:not([class^=fr-]),:host .outer-container .content-container .subheading-container span:not([class^=fr-]),:host .outer-container .content-container .subheading-container img:not([class^=fr-]),:host .outer-container .content-container .subheading-container applet,:host .outer-container .content-container .subheading-container object,:host .outer-container .content-container .subheading-container iframe,:host .outer-container .content-container .subheading-container h1,:host .outer-container .content-container .subheading-container h2,:host .outer-container .content-container .subheading-container h3,:host .outer-container .content-container .subheading-container h4,:host .outer-container .content-container .subheading-container h5,:host .outer-container .content-container .subheading-container h6,:host .outer-container .content-container .subheading-container p,:host .outer-container .content-container .subheading-container blockquote,:host .outer-container .content-container .subheading-container pre,:host .outer-container .content-container .subheading-container a,:host .outer-container .content-container .subheading-container abbr,:host .outer-container .content-container .subheading-container acronym,:host .outer-container .content-container .subheading-container address,:host .outer-container .content-container .subheading-container big,:host .outer-container .content-container .subheading-container cite,:host .outer-container .content-container .subheading-container code,:host .outer-container .content-container .subheading-container del,:host .outer-container .content-container .subheading-container dfn,:host .outer-container .content-container .subheading-container em,:host .outer-container .content-container .subheading-container font,:host .outer-container .content-container .subheading-container ins,:host .outer-container .content-container .subheading-container kbd,:host .outer-container .content-container .subheading-container q,:host .outer-container .content-container .subheading-container s,:host .outer-container .content-container .subheading-container samp,:host .outer-container .content-container .subheading-container small,:host .outer-container .content-container .subheading-container strike,:host .outer-container .content-container .subheading-container strong,:host .outer-container .content-container .subheading-container sub,:host .outer-container .content-container .subheading-container sup,:host .outer-container .content-container .subheading-container tt,:host .outer-container .content-container .subheading-container var,:host .outer-container .content-container .subheading-container dl,:host .outer-container .content-container .subheading-container dt,:host .outer-container .content-container .subheading-container dd,:host .outer-container .content-container .subheading-container ol,:host .outer-container .content-container .subheading-container ul,:host .outer-container .content-container .subheading-container li,:host .outer-container .content-container .subheading-container fieldset,:host .outer-container .content-container .subheading-container form,:host .outer-container .content-container .subheading-container label,:host .outer-container .content-container .subheading-container legend,:host .outer-container .content-container .subheading-container table,:host .outer-container .content-container .subheading-container caption,:host .outer-container .content-container .subheading-container tbody,:host .outer-container .content-container .subheading-container tfoot,:host .outer-container .content-container .subheading-container thead,:host .outer-container .content-container .subheading-container tr,:host .outer-container .content-container .subheading-container th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host .outer-container .content-container .subheading-container .text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .avatar-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end;margin-top:0.5rem;padding-right:0.3rem}:host .outer-container .content-container .avatar-container yoo-avatar{margin-right:0.75rem;margin-left:0.15rem}:host .outer-container .content-container .action-button-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end}:host .outer-container .content-container .slot-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between;color:var(--text-color, #807f83);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .slot-container .inner-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}:host(.firefox) .content-container{margin-bottom:0}:host(.web):not(.framed) .outer-container{padding-top:1rem;padding-bottom:1rem;background-color:transparent}:host(.web) .outer-container .card-list-image-container.large{min-width:3.875rem}:host(.web) .outer-container .card-list-image-container.medium{min-width:2.875rem}:host(.web) .outer-container .card-list-image-container.small{min-width:2.375rem}:host(.web) .outer-container .content-container .top-container .badges-container.show-more{position:relative;overflow:visible}:host(.web) .outer-container .content-container .top-container .badges-container.show-more .more-button{position:absolute;top:0;right:0;bottom:auto;left:auto;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;width:2rem;height:1.125rem;font-size:var(--font-size-18, 1.125rem)}:host(.web) .outer-container .content-container .top-container .badges-container.show-more .more-button yoo-icon{padding-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000)}:host(.locations) .outer-container .content-container .top-container .heading-container .date-card-text{padding-right:var(--spacing-16, 1rem)}:host(.locations.map) .outer-container{-ms-flex-align:center;align-items:center;background:var(--light, #ffffff)}:host(.collapsible) .outer-container,:host(.locations.no-kpi:not(.framed)) .outer-container{-ms-flex-align:start;align-items:flex-start;width:auto;border-bottom:none;border-radius:0.5rem}:host(.collapsible) .outer-container .content-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container{margin:0.5rem 0 0;border:none}:host(.collapsible) .outer-container .content-container .top-container .heading-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container .top-container .heading-container{-ms-flex-pack:justify;justify-content:space-between;padding-top:0 !important;padding-right:var(--spacing-08, 0.5rem)}:host(.collapsible) .outer-container .content-container .top-container .subheading-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container .top-container .subheading-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.collapsible) .outer-container .content-container{margin-top:0}:host(.locations.no-kpi.map) .outer-container{-ms-flex-align:start;align-items:flex-start;max-width:18.75rem}:host(.locations.no-kpi:not(.framed)) yoo-tag.distance{margin-right:0.75rem}:host(.web.framed) .outer-container .content-container .top-container .heading-container{font-size:var(--font-size-16, 1rem)}:host(.android) .outer-container .content-container .top-container .heading-container .heading-title{display:-webkit-box;max-height:calc((var(--font-size-18, 1.125rem) + 0.25rem) * 2);overflow:hidden;line-height:calc(var(--font-size-18, 1.125rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}:host{--margin-content-container-left:0;--margin-content-container-right:0;--padding-content-container:var(--spacing-04, 0.25rem) 0 var(--spacing-08, 0.5rem) 0;--border-bottom-outer-container:var(--border-width-01, 0.0625rem) solid var(--stable-alt-40, rgba(208, 208, 208, 0.4));--overflow-card-heading-text:hidden;--text-overflow-card-heading-text:ellipsis;--white-space-card-heading-text:normal;--padding-right-card-heading:unset;--max-height-heading:48px;--card-list-background:none;--justify-content-content-container:flex-start;--max-card-heading-height:26px;--height-lessons-outer-container:2.5rem;--heading-font-size:var(--font-size-14, 0.875rem)}:host yoo-truncate{--max-lines:2}:host .heart-icon{width:var(--icon-size-05, 4rem)}:host .heart-icon yoo-lottie{width:var(--icon-size-02, 1.5rem);height:var(--icon-size-05, 4rem);margin:auto}:host .heart-icon yoo-lottie yoo-icon{top:1.3rem}:host .outer-container{padding-top:var(--spacing-04, 0.25rem)}:host .outer-container.tapped{background-color:var(--stable-light, #f1f1f1);-webkit-transition:background-color 0.3s ease;transition:background-color 0.3s ease}:host .outer-container .video-container{width:100%;max-height:350px;padding-top:var(--spacing-08, 0.5rem)}:host .outer-container .rank-container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;min-width:1.5rem;color:var(--stable, #adadad);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .heading-container yoo-tag.margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .content-container .heading-container .progress-box{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;color:var(--dark, #000000)}:host .outer-container .content-container .heading-container .progress-box .icon-text{font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .tags-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;padding-bottom:var(--spacing-04, 0.25rem);overflow:hidden;line-height:15px}:host .outer-container .content-container .tags-container yoo-tag,:host .outer-container .content-container .tags-container .card-icon{margin:var(--spacing-04, 0.25rem) var(--spacing-08, 0.5rem) var(--spacing-02, 0.125rem) var(--spacing-02, 0.125rem)}:host .outer-container .content-container .tags-container .hashtag{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:0.4375rem;color:var(--text-color, #807f83);font-size:var(--font-size-12, 0.75rem);-webkit-transform:translateY(0.125rem);transform:translateY(0.125rem)}:host .outer-container .content-container .tags-container .card-icon{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}:host .outer-container .content-container .tags-container .card-icon yoo-icon{margin-right:0.4375rem}:host .outer-container .content-container .tags-container .row-action{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;line-height:1rem}:host .outer-container .content-container .top-container .video-container{display:-ms-inline-flexbox;display:inline-flex;height:230px}:host .outer-container .content-container .top-container .heading-container .date-card-text{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-left:auto;padding:0 var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem);text-align:right}:host .outer-container .content-container .top-container .heading-container .points-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding-right:var(--spacing-08, 0.5rem);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .top-container .heading-container .points-container .points{padding:0 0.35rem}:host .outer-container .content-container .top-container .flex{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .outer-container.active{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host .outer-container .image-video-preview{width:12.5rem;height:6.25rem;padding:var(--spacing-08, 0.5rem);pointer-events:none}:host .outer-container .image-video-preview yoo-img{--border-radius:var(--border-radius-08, 0.5rem);height:100%}:host(.mobile.rtl) .outer-container .content-container{margin-right:var(--margin-content-container-left);margin-left:var(--margin-content-container-right)}:host(.mobile.rtl) .outer-container .content-container.has-image{margin-right:0}:host(.mobile.rtl) .outer-container .content-container .tags-container yoo-tag,:host(.mobile.rtl) .outer-container .content-container .tags-container .card-icon{margin:var(--spacing-04, 0.25rem) var(--spacing-02, 0.125rem) var(--spacing-02, 0.125rem) var(--spacing-08, 0.5rem)}:host(.mobile.rtl) .outer-container .content-container .top-container .subheading-container{margin-right:0;margin-left:var(--spacing-32, 2rem)}:host(.current) .outer-container .rank-container{color:var(--app-color, #5a30f4)}:host(.current) .outer-container .content-container .leaderboard .heading-container .card-heading{color:var(--app-color, #5a30f4)}:host(.current.leaderboard){background-color:var(--app-color, #5a30f4) !important}:host(.current.leaderboard) .outer-container .rank-container{color:var(--light, #ffffff)}:host(.current.leaderboard) .outer-container .content-container .leaderboard .heading-container .card-heading{color:var(--light, #ffffff)}:host(.current.leaderboard) .outer-container .points-container{color:var(--light, #ffffff)}:host(.leaderboard.userranks){height:var(--spacing-40, 2.5rem)}:host(.leaderboard.userranks) .outer-container{height:100%;padding:0 !important}:host(.leaderboard.userranks) .icon-container{color:var(--app-color, #5a30f4) !important}:host(.leaderboard){padding-left:var(--spacing-16, 1rem);color:var(--dark, #000000);background-color:var(--light, #ffffff);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));opacity:1}:host(.secondary-view){--border-bottom-outer-container:0px;background:transparent}:host(.secondary-view) .outer-container{padding-top:var(--spacing-08, 0.5rem)}:host(.secondary-view) .outer-container .question-content{border-bottom:var(--border-bottom-outer-container)}:host(.secondary-view) .outer-container .content-container .heading-container{font-size:var(--font-size-16, 1rem)}:host(.secondary-view) .outer-container .content-container .heading-container .date-card-text{display:block;padding:0;line-height:normal;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.secondary-view) .outer-container .content-container .translate-container{position:relative;margin-bottom:var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-weight:normal;font-size:var(--font-size-16, 1rem);font-style:normal;font-stretch:normal;line-height:1;letter-spacing:normal}:host(.secondary-view) .outer-container .content-container .translate-container.active{margin-left:var(--spacing-04, 0.25rem);padding-left:var(--spacing-08, 0.5rem);border-left:var(--border-width-02, 0.125rem) solid var(--stable-alt, #d0d0d0)}:host(.secondary-view) .outer-container .content-container .translate-container .text{margin-bottom:var(--spacing-04, 0.25rem);color:var(--dark, #000000)}:host(.secondary-view) .outer-container .content-container .translate-container .text html,:host(.secondary-view) .outer-container .content-container .translate-container .text body,:host(.secondary-view) .outer-container .content-container .translate-container .text div:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text span:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text img:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .translate-container .text applet,:host(.secondary-view) .outer-container .content-container .translate-container .text object,:host(.secondary-view) .outer-container .content-container .translate-container .text iframe,:host(.secondary-view) .outer-container .content-container .translate-container .text h1,:host(.secondary-view) .outer-container .content-container .translate-container .text h2,:host(.secondary-view) .outer-container .content-container .translate-container .text h3,:host(.secondary-view) .outer-container .content-container .translate-container .text h4,:host(.secondary-view) .outer-container .content-container .translate-container .text h5,:host(.secondary-view) .outer-container .content-container .translate-container .text h6,:host(.secondary-view) .outer-container .content-container .translate-container .text p,:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote,:host(.secondary-view) .outer-container .content-container .translate-container .text pre,:host(.secondary-view) .outer-container .content-container .translate-container .text a,:host(.secondary-view) .outer-container .content-container .translate-container .text abbr,:host(.secondary-view) .outer-container .content-container .translate-container .text acronym,:host(.secondary-view) .outer-container .content-container .translate-container .text address,:host(.secondary-view) .outer-container .content-container .translate-container .text big,:host(.secondary-view) .outer-container .content-container .translate-container .text cite,:host(.secondary-view) .outer-container .content-container .translate-container .text code,:host(.secondary-view) .outer-container .content-container .translate-container .text del,:host(.secondary-view) .outer-container .content-container .translate-container .text dfn,:host(.secondary-view) .outer-container .content-container .translate-container .text em,:host(.secondary-view) .outer-container .content-container .translate-container .text font,:host(.secondary-view) .outer-container .content-container .translate-container .text ins,:host(.secondary-view) .outer-container .content-container .translate-container .text kbd,:host(.secondary-view) .outer-container .content-container .translate-container .text q,:host(.secondary-view) .outer-container .content-container .translate-container .text s,:host(.secondary-view) .outer-container .content-container .translate-container .text samp,:host(.secondary-view) .outer-container .content-container .translate-container .text small,:host(.secondary-view) .outer-container .content-container .translate-container .text strike,:host(.secondary-view) .outer-container .content-container .translate-container .text strong,:host(.secondary-view) .outer-container .content-container .translate-container .text sub,:host(.secondary-view) .outer-container .content-container .translate-container .text sup,:host(.secondary-view) .outer-container .content-container .translate-container .text tt,:host(.secondary-view) .outer-container .content-container .translate-container .text var,:host(.secondary-view) .outer-container .content-container .translate-container .text dl,:host(.secondary-view) .outer-container .content-container .translate-container .text dt,:host(.secondary-view) .outer-container .content-container .translate-container .text dd,:host(.secondary-view) .outer-container .content-container .translate-container .text ol,:host(.secondary-view) .outer-container .content-container .translate-container .text ul,:host(.secondary-view) .outer-container .content-container .translate-container .text li,:host(.secondary-view) .outer-container .content-container .translate-container .text fieldset,:host(.secondary-view) .outer-container .content-container .translate-container .text form,:host(.secondary-view) .outer-container .content-container .translate-container .text label,:host(.secondary-view) .outer-container .content-container .translate-container .text legend,:host(.secondary-view) .outer-container .content-container .translate-container .text table,:host(.secondary-view) .outer-container .content-container .translate-container .text caption,:host(.secondary-view) .outer-container .content-container .translate-container .text tbody,:host(.secondary-view) .outer-container .content-container .translate-container .text tfoot,:host(.secondary-view) .outer-container .content-container .translate-container .text thead,:host(.secondary-view) .outer-container .content-container .translate-container .text tr,:host(.secondary-view) .outer-container .content-container .translate-container .text th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote{padding-left:1rem;border-left:var(--border-width-04, 0.25rem) solid var(--stable, #adadad)}:host(.secondary-view) .outer-container .content-container .translate-container .text blockquote:last-of-type blockquote p:last-of-type,:host(.secondary-view) .outer-container .content-container .translate-container .text p:last-of-type{padding-top:0;padding-bottom:0}:host(.secondary-view) .outer-container .content-container .translate-container .text ol,:host(.secondary-view) .outer-container .content-container .translate-container .text ul{margin:revert;padding:revert}:host(.secondary-view) .outer-container .content-container .translate-container .text h1{display:block;margin-top:0.67em;margin-right:0;margin-bottom:0.67em;margin-left:0;font-weight:bold;font-size:2em}:host(.secondary-view) .outer-container .content-container .translate-container .text h2{display:block;margin-top:0.83em;margin-right:0;margin-bottom:0.83em;margin-left:0;font-weight:bold;font-size:1.5em}:host(.secondary-view) .outer-container .content-container .translate-container .text h3{display:block;margin-top:1em;margin-right:0;margin-bottom:1em;margin-left:0;font-weight:bold;font-size:1.17em}:host(.secondary-view) .outer-container .content-container .translate-container .text h4{display:block;margin-top:1.33em;margin-right:0;margin-bottom:1.33em;margin-left:0;font-weight:bold}:host(.secondary-view) .outer-container .content-container .translate-container .text h5{display:block;margin-top:1.67em;margin-right:0;margin-bottom:1.67em;margin-left:0;font-weight:bold;font-size:0.83em}:host(.secondary-view) .outer-container .content-container .translate-container .text h6{display:block;margin-top:2.33em;margin-right:0;margin-bottom:2.33em;margin-left:0;font-weight:bold;font-size:0.67em}:host(.secondary-view) .outer-container .content-container .translate-container .text strong{font-weight:bold}:host(.secondary-view) .outer-container .content-container .translate-container .text em{font-style:italic}:host(.secondary-view) .outer-container .content-container .subheading-container{display:block;max-height:initial;overflow:visible;color:var(--dark, #000000);font-size:var(--font-size-16, 1rem);line-height:20px;white-space:pre-wrap;word-wrap:break-word}:host(.secondary-view) .outer-container .content-container .subheading-container html,:host(.secondary-view) .outer-container .content-container .subheading-container body,:host(.secondary-view) .outer-container .content-container .subheading-container div:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container span:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container img:not([class^=fr-]),:host(.secondary-view) .outer-container .content-container .subheading-container applet,:host(.secondary-view) .outer-container .content-container .subheading-container object,:host(.secondary-view) .outer-container .content-container .subheading-container iframe,:host(.secondary-view) .outer-container .content-container .subheading-container h1,:host(.secondary-view) .outer-container .content-container .subheading-container h2,:host(.secondary-view) .outer-container .content-container .subheading-container h3,:host(.secondary-view) .outer-container .content-container .subheading-container h4,:host(.secondary-view) .outer-container .content-container .subheading-container h5,:host(.secondary-view) .outer-container .content-container .subheading-container h6,:host(.secondary-view) .outer-container .content-container .subheading-container p,:host(.secondary-view) .outer-container .content-container .subheading-container blockquote,:host(.secondary-view) .outer-container .content-container .subheading-container pre,:host(.secondary-view) .outer-container .content-container .subheading-container a,:host(.secondary-view) .outer-container .content-container .subheading-container abbr,:host(.secondary-view) .outer-container .content-container .subheading-container acronym,:host(.secondary-view) .outer-container .content-container .subheading-container address,:host(.secondary-view) .outer-container .content-container .subheading-container big,:host(.secondary-view) .outer-container .content-container .subheading-container cite,:host(.secondary-view) .outer-container .content-container .subheading-container code,:host(.secondary-view) .outer-container .content-container .subheading-container del,:host(.secondary-view) .outer-container .content-container .subheading-container dfn,:host(.secondary-view) .outer-container .content-container .subheading-container em,:host(.secondary-view) .outer-container .content-container .subheading-container font,:host(.secondary-view) .outer-container .content-container .subheading-container ins,:host(.secondary-view) .outer-container .content-container .subheading-container kbd,:host(.secondary-view) .outer-container .content-container .subheading-container q,:host(.secondary-view) .outer-container .content-container .subheading-container s,:host(.secondary-view) .outer-container .content-container .subheading-container samp,:host(.secondary-view) .outer-container .content-container .subheading-container small,:host(.secondary-view) .outer-container .content-container .subheading-container strike,:host(.secondary-view) .outer-container .content-container .subheading-container strong,:host(.secondary-view) .outer-container .content-container .subheading-container sub,:host(.secondary-view) .outer-container .content-container .subheading-container sup,:host(.secondary-view) .outer-container .content-container .subheading-container tt,:host(.secondary-view) .outer-container .content-container .subheading-container var,:host(.secondary-view) .outer-container .content-container .subheading-container dl,:host(.secondary-view) .outer-container .content-container .subheading-container dt,:host(.secondary-view) .outer-container .content-container .subheading-container dd,:host(.secondary-view) .outer-container .content-container .subheading-container ol,:host(.secondary-view) .outer-container .content-container .subheading-container ul,:host(.secondary-view) .outer-container .content-container .subheading-container li,:host(.secondary-view) .outer-container .content-container .subheading-container fieldset,:host(.secondary-view) .outer-container .content-container .subheading-container form,:host(.secondary-view) .outer-container .content-container .subheading-container label,:host(.secondary-view) .outer-container .content-container .subheading-container legend,:host(.secondary-view) .outer-container .content-container .subheading-container table,:host(.secondary-view) .outer-container .content-container .subheading-container caption,:host(.secondary-view) .outer-container .content-container .subheading-container tbody,:host(.secondary-view) .outer-container .content-container .subheading-container tfoot,:host(.secondary-view) .outer-container .content-container .subheading-container thead,:host(.secondary-view) .outer-container .content-container .subheading-container tr,:host(.secondary-view) .outer-container .content-container .subheading-container th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host(.secondary-view) .outer-container .content-container .subheading-container blockquote{padding-left:1rem;border-left:var(--border-width-04, 0.25rem) solid var(--stable, #adadad)}:host(.secondary-view) .outer-container .content-container .subheading-container blockquote:last-of-type blockquote p:last-of-type,:host(.secondary-view) .outer-container .content-container .subheading-container p:last-of-type{padding-top:0;padding-bottom:0}:host(.secondary-view) .outer-container .content-container .subheading-container ol,:host(.secondary-view) .outer-container .content-container .subheading-container ul{margin:revert;padding:revert}:host(.secondary-view) .outer-container .content-container .subheading-container h1{display:block;margin-top:0.67em;margin-right:0;margin-bottom:0.67em;margin-left:0;font-weight:bold;font-size:2em}:host(.secondary-view) .outer-container .content-container .subheading-container h2{display:block;margin-top:0.83em;margin-right:0;margin-bottom:0.83em;margin-left:0;font-weight:bold;font-size:1.5em}:host(.secondary-view) .outer-container .content-container .subheading-container h3{display:block;margin-top:1em;margin-right:0;margin-bottom:1em;margin-left:0;font-weight:bold;font-size:1.17em}:host(.secondary-view) .outer-container .content-container .subheading-container h4{display:block;margin-top:1.33em;margin-right:0;margin-bottom:1.33em;margin-left:0;font-weight:bold}:host(.secondary-view) .outer-container .content-container .subheading-container h5{display:block;margin-top:1.67em;margin-right:0;margin-bottom:1.67em;margin-left:0;font-weight:bold;font-size:0.83em}:host(.secondary-view) .outer-container .content-container .subheading-container h6{display:block;margin-top:2.33em;margin-right:0;margin-bottom:2.33em;margin-left:0;font-weight:bold;font-size:0.67em}:host(.secondary-view) .outer-container .content-container .subheading-container strong{font-weight:bold}:host(.secondary-view) .outer-container .content-container .subheading-container em{font-style:italic}:host(.secondary-view) .outer-container .content-container .subheading-container.comment-image{--border-radius:var(--border-radius-16, 1rem);margin-top:9px;overflow:hidden}:host(.secondary-view) .outer-container .content-container .subheading-container span.with-markdown{white-space:normal}:host(.secondary-view) .outer-container .content-container .subheading-container span.with-markdown img{width:100%;max-width:initial !important}:host(.secondary-view) .outer-container .content-container .top-container{padding:var(--spacing-08, 0.5rem);background:var(--stable-light-60, rgba(241, 241, 241, 0.6));border-radius:var(--border-radius-04, 0.25rem)}:host(.secondary-view) .outer-container .content-container .top-container .card-heading{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;width:100%;padding-right:var(--spacing-08, 0.5rem)}:host(.secondary-view) .outer-container .content-container .top-container .card-heading .card-heading-text{font-weight:var(--font-weight-700, 700)}:host(.secondary-view) .outer-container .content-container .top-container .heading-container .heading-title{display:block}:host(.secondary-view) .outer-container .content-container .top-container .heading-container .heading-title span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.secondary-view) .outer-container .content-container .top-container span{display:block;font-size:var(--font-size-16, 1rem)}:host(.secondary-view) .outer-container .content-container .slot-container yoo-img{margin-right:auto}:host(.secondary-view) .tags-container{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center;margin-top:-0.85rem;margin-left:1.875rem;font-size:var(--font-size-14, 0.875rem)}:host(.secondary-view) .tags-container .card-icon.right{margin-left:auto}:host(.secondary-view) .tags-container .card-icon.right yoo-icon{margin:0}:host(.secondary-view) .tags-container .row-action{width:100%;margin-top:-0.875rem;margin-left:1.25rem}:host(.secondary-view) .tags-container .row-action span{color:var(--dark, #000000)}:host(.secondary-view) .tags-container .bottom-action{margin-right:1.25rem;color:var(--text-color, #807f83)}:host(.questionsAnswers) .tags-container{margin-left:2.8125rem}:host(.questionsAnswers) .tags-container .card-icon:not(.heart-icon){margin:var(--spacing-16, 1rem) var(--spacing-16, 1rem) 0 0}:host(.questionsAnswers) .tags-container .row-action{margin-top:var(--spacing-08, 0.5rem);margin-left:0}:host(.entitycomments) .tags-container,:host(.feedsComments) .tags-container{margin-left:1.75rem}:host(.userranks) .outer-container,:host(.userhighscores) .outer-container{-ms-flex-align:center;align-items:center;padding:var(--spacing-08, 0.5rem) 0 !important;background-color:transparent;border-bottom:0}:host(.userranks) .heading-container,:host(.userhighscores) .heading-container{word-wrap:break-word}:host(.active) .outer-container{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host(.hoverable):hover .outer-container{border:var(--border-width-01, 0.0625rem) solid var(--accent, #276ef1);-webkit-box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1);box-shadow:var(--card-active-shadow, 0px 0px 3px 0.0625rem #276ef1)}:host(.filesFolders) .outer-container .content-container .subheading-container,:host(.files) .outer-container .content-container .subheading-container{margin:0;font-size:var(--font-size-12, 0.75rem)}:host(.filesFolders) .outer-container .content-container .subheading-container em,:host(.files) .outer-container .content-container .subheading-container em{color:var(--dark, #000000);font-weight:bold;background:#FDFB2F}:host(.locations.external) .outer-container .content-container .subheading-container{white-space:normal}:host(.products) .outer-container .content-container{border-bottom:none}:host(.outofstock),:host(.hidden){opacity:0.5}:host(.productweightpair) .outer-container .content-container .heading-container .date-card-text{color:var(--dark, #000000)}:host(.catalog-display.history) .outer-container .content-container{text-align:left}:host(.catalog-display.history) .outer-container .content-container .top-container .price{font-size:var(--font-size-12, 0.75rem)}:host(.catalog-display.history) .outer-container .content-container .top-container .tags-container{padding-bottom:var(--spacing-04, 0.25rem)}:host(.catalog-display){width:100%}:host(.catalog-display) .outer-container{-ms-flex-align:start;align-items:flex-start;font-size:var(--font-size-14, 0.875rem);border:none !important}:host(.catalog-display) .outer-container .content-container{-ms-flex-pack:center;justify-content:center;margin-left:1rem;padding:0;border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host(.catalog-display) .outer-container .content-container .top-container .card-heading{font-size:var(--font-size-14, 0.875rem)}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container{min-height:1rem;max-height:0.8rem;color:var(--dark, #000000);font-size:var(--font-size-12, 0.75rem);line-height:1rem}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container .subheading-grey{color:var(--stable, #adadad)}:host(.catalog-display) .outer-container .content-container .top-container .subheading-container .subheading-price{color:var(--dark, #000000)}:host(.catalog-display) .outer-container .content-container .top-container .price{color:var(--text-color, #807f83)}:host(.catalog-display) .outer-container .content-container .top-container .tags-container{overflow:initial;line-height:normal}:host(.catalog-display.no-border) .outer-container .content-container{border-bottom:none}:host(.productbatch.archived) .outer-container .content-container{opacity:0.5}:host(.offline:not(.missions)) .outer-container{opacity:0.7}:host(.offline:not(.missions))::before,:host(.offline:not(.missions))::after{position:absolute;top:0;right:0;border-color:transparent;border-style:solid;content:\"\"}:host(.offline:not(.missions))::after{border-width:0.5em;border-top-color:var(--energized, #ffc043);border-right-color:var(--energized, #ffc043)}:host(.notifications) .outer-container{padding-top:var(--spacing-04, 0.25rem)}:host(.notes) .outer-container .content-container .heading-container .card-heading .heading-title{display:-webkit-box;max-height:calc((var(--font-size-18, 1.125rem) + 0.125rem) * 1);overflow:hidden;line-height:calc(var(--font-size-18, 1.125rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:1;}:host(.no-text-break) .outer-container .content-container .top-container .heading-container .card-heading{white-space:normal}:host(.lessons.web) .outer-container{height:var(--height-lessons-outer-container);min-height:0;margin:var(--spacing-04, 0.25rem) 0;padding-left:var(--spacing-08, 0.5rem);border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:var(--card-shadow-2, 0 0.3125rem 0.9375rem 0 rgba(40, 47, 54, 0.08));box-shadow:var(--card-shadow-2, 0 0.3125rem 0.9375rem 0 rgba(40, 47, 54, 0.08))}:host(.lessons.web) .outer-container .content-container{border-bottom:none}:host(.lessons.web) .outer-container .content-container .top-container{display:-ms-flexbox;display:flex}:host(.lessons.web) .outer-container .content-container .heading-container{-ms-flex:1;flex:1;width:75%;padding-right:var(--spacing-08, 0.5rem);font-size:var(--heading-font-size)}:host(.lessons.web) .outer-container .content-container .heading-container .card-heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding-top:0}:host(.lessons.web.finished) .outer-container{background-color:var(--app-color, #5a30f4)}:host(.lessons.web.finished) .outer-container .card-heading,:host(.lessons.web.finished) .outer-container .icon-container{color:var(--light-10, rgba(255, 255, 255, 0.1))}:host(.lessons.web.locked) .outer-container{background-color:var(--stable-alt, #d0d0d0)}:host(.lessons.web.locked) .outer-container .card-heading{color:var(--text-color, #807f83)}:host(.lessons.web.locked) .outer-container .top-container yoo-avatar{margin:0 0.75rem}:host(.missions.finished:not(.grid-cell)) .outer-container{padding-bottom:var(--spacing-16, 1rem)}:host(.courseselection) .outer-container .content-container{-ms-flex-pack:center;justify-content:center;margin-left:0}:host(.courseselection) .outer-container .content-container .top-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host(.courseselection) .outer-container .content-container .top-container .heading-container{-ms-flex-order:2;order:2;font-size:var(--font-size-16, 1rem)}:host(.courseselection) .outer-container .content-container .top-container .subheading-container{-ms-flex-order:1;order:1;color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem)}:host(.courseselection) .outer-container .content-container .top-container .subheading-container .todo{font-size:var(--font-size-14, 0.875rem)}:host(.courseselection) .outer-container .content-container .top-container .tags-container{padding-bottom:0}:host(.questions) .outer-container{padding-bottom:0;border-bottom:0}:host(.questions) .outer-container .content-container .top-container .heading-container{max-height:1.25rem;margin-bottom:0}:host(.questions) .outer-container .content-container .top-container .heading-container .card-heading .heading-title{color:var(--dark, #000000);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:var(--spacing-04, 0.25rem)}:host(.questions) .question-container.no-img{padding-top:var(--spacing-04, 0.25rem)}:host(.questions) .question-container.no-img .question-content{height:auto}:host(.questions) .question-container .question-content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:98px;margin-left:var(--spacing-08, 0.5rem);padding-bottom:var(--spacing-16, 1rem);border-bottom:var(--border-bottom-outer-container)}:host(.questions) .question-container .question-content .question-title{margin-bottom:var(--spacing-08, 0.5rem);font-weight:var(--font-weight-700, 700);font-size:var(--font-size-18, 1.125rem);word-break:break-word}:host(.questions) .question-container .question-content .question-icons{display:-ms-flexbox;display:flex;color:var(--stable-alt, #d0d0d0);font-size:var(--icon-size-01, 1rem)}:host(.questions) .question-container .question-content .question-icons .inner-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000);font-size:var(--font-size-18, 1.125rem)}:host(.questions) .question-container .question-content .question-icons .inner-container yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host(.questions) .question-container .question-content .subheadings{display:-ms-flexbox;display:flex;color:var(--text-color, #807f83)}:host(.questions) .question-container .question-content .subheadings .subheading-container{padding-right:var(--spacing-08, 0.5rem);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .question-content .subheadings .date-card-text{margin-right:var(--spacing-08, 0.5rem);color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .question-content .tags-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;overflow:hidden}:host(.questions) .question-container .question-content .tags-container .hashtag{margin-right:0.4375rem;color:var(--app-color, #5a30f4);font-size:var(--font-size-14, 0.875rem)}:host(.questions) .question-container .image-video-preview{min-width:7.5rem;height:98px;padding:var(--spacing-08, 0.5rem);pointer-events:none}:host(.questions) .question-container .image-video-preview yoo-img{--border-radius:var(--border-radius-08, 0.5rem)}:host(.questions) .question-container .image-video-preview yoo-videoplayer-core{overflow:hidden;border-radius:var(--border-radius-08, 0.5rem)}:host(.card-feed) .outer-container{display:none}:host(.card-feed) .question-container{-ms-flex-pack:initial !important;justify-content:initial !important;background:var(--light-10, rgba(255, 255, 255, 0.1));border-bottom:none !important;-webkit-box-shadow:var(--grid-frame-shadow, 0 0.3125rem 0.9375rem 0.1875rem rgba(40, 47, 54, 0.15));box-shadow:var(--grid-frame-shadow, 0 0.3125rem 0.9375rem 0.1875rem rgba(40, 47, 54, 0.15))}:host(.card-feed) .question-container .image-video-preview{-ms-flex-negative:0;flex-shrink:0;-ms-flex-order:1;order:1;width:130px;height:89px;padding-right:var(--spacing-16, 1rem)}:host(.card-feed) .question-container .image-video-preview yoo-videoplayer-core{overflow:hidden;border-radius:5px}:host(.card-feed) .question-container .question-content{-ms-flex-pack:initial !important;justify-content:initial !important;-ms-flex-order:2;order:2;margin-left:0;padding:var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) 0}:host(.selected-content) .question-container{padding:0}:host(.selected-content) .question-container .image-video-preview{min-width:2rem;height:1.5rem;padding-left:0}:host(.selected-content) .question-container .question-content{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;height:auto;margin:0;padding-bottom:0;border-bottom:none}:host(.selected-content) .question-container .question-content .question-title{margin:0;font-weight:var(--font-weight-400, 400);font-size:var(--font-size-16, 1rem)}:host(.selected-content) .outer-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.selected-content) .outer-container .content-container .heading-container{margin-bottom:var(--spacing-02, 0.125rem)}:host(.selected-content) .outer-container .content-container .heading-container .card-heading .heading-title span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.selected-content) .outer-container .content-container .uifield-container{display:none}:host(.web.grid-cell){overflow:hidden}:host(.web.grid-cell) .outer-container{padding-top:var(--spacing-08, 0.5rem);padding-bottom:var(--spacing-08, 0.5rem)}:host(.web.grid-cell) .outer-container .content-container .tags-container{-ms-flex-wrap:initial;flex-wrap:initial}:host(.mobile.autocomplete-selection-mode) .question-container .question-title{font-size:var(--font-size-16, 1rem)}:host(.mobile.autocomplete-selection-mode) .subheading-container{margin-right:var(--spacing-32, 2rem)}:host(.no-border-bottom.mobile) .outer-container{border-bottom:none}:host(.no-border-bottom.mobile) .question-container .question-content{border-bottom:none}:host(.item-disabled){cursor:default}:host(.kanban) .outer-container{padding-top:0;padding-bottom:0}:host(.web.videocallusers) .outer-container{padding-top:0;padding-bottom:0}:host(.web.firefox) .outer-container{height:auto}:host(.violetproducts) .outer-container,:host(.violetbasketitems) .outer-container{-ms-flex-align:center;align-items:center}:host(.violetproducts) .outer-container yoo-icon.arrow,:host(.violetbasketitems) .outer-container yoo-icon.arrow{margin-top:var(--spacing-04, 0.25rem);margin-right:var(--spacing-04, 0.25rem);margin-bottom:auto}:host(.violetproducts) .content-container,:host(.violetbasketitems) .content-container{border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host(.form-permission) .outer-container{height:auto}:host(.pages) .outer-container{-ms-flex-align:center;align-items:center}:host(.missions.feed) .outer-container{border-bottom:none !important}:host(.calendarEvents) .outer-container .content-container .heading-container{margin-bottom:unset}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container .dot-event,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container .dot-event{margin-right:var(--spacing-04, 0.25rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .event-status-container .icon-event,:host(.calendarEvents) .outer-container .content-container .subheading-container .event-type-container .icon-event{margin-right:var(--spacing-08, 0.5rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .title{font-weight:bold;font-size:var(--font-size-16, 1rem)}:host(.calendarEvents) .outer-container .content-container .subheading-container .time{color:var(--app-color, #5a30f4)}:host(.course-info) .outer-container,:host(.learning-manager) .outer-container{padding-top:var(--spacing-16, 1rem)}:host(.table) .top-container{display:-ms-flexbox;display:flex}:host(.table) .top-container .heading-container{-ms-flex:1;flex:1}";
11
11
 
12
12
  const MAX_AVATAR_DISPLAY = 3;
13
13
  const YooCardListComponent = class {
14
14
  constructor(hostRef) {
15
15
  registerInstance(this, hostRef);
16
16
  this.uiFieldsChanged = createEvent(this, "uiFieldsChanged", 7);
17
+ this.fieldFetchData = createEvent(this, "fieldFetchData", 7);
17
18
  this.avatarImgs = [];
18
19
  this.isMap = false;
19
20
  this.onTouchStart = () => toggleElementTapped(this.outerDiv, this.host);
@@ -272,10 +273,15 @@ const YooCardListComponent = class {
272
273
  this.entry.uiFields.fields.some((f) => isFieldWithNoValue(f) || !isNullOrUndefined(this.entry.uiFields.data[f.name])) &&
273
274
  !((_e = (_d = this.host) === null || _d === void 0 ? void 0 : _d.classList) === null || _e === void 0 ? void 0 : _e.contains('map')) &&
274
275
  !((_g = (_f = this.host) === null || _f === void 0 ? void 0 : _f.classList) === null || _g === void 0 ? void 0 : _g.contains('grid-cell'))) {
275
- return (h("div", { class: "uifield-container" }, h("yoo-form-dynamic", { class: "inline in-card secondary transparent", scrollable: false, forceReadonly: !((_j = (_h = this.host) === null || _h === void 0 ? void 0 : _h.classList) === null || _j === void 0 ? void 0 : _j.contains('form')), slides: [{ title: '', items: this.entry.uiFields.fields }], data: this.entry.uiFields.data, suffix: this.entry.uiFieldsSuffix, showTabs: false, formInputSize: "medium", showRecap: false, isPdf: this.entry.isPdf, onDataChanged: (ev) => {
276
+ return (h("div", { class: "uifield-container" }, h("yoo-form-dynamic", { class: "inline in-card secondary transparent", scrollable: false, ref: (el) => (this.uiFeldsformRef = el), forceReadonly: !((_j = (_h = this.host) === null || _h === void 0 ? void 0 : _h.classList) === null || _j === void 0 ? void 0 : _j.contains('form')), slides: [{ title: '', items: this.entry.uiFields.fields }], data: { ...this.entry.uiFields.data }, suffix: this.entry.uiFieldsSuffix, showTabs: false, formInputSize: "medium", showRecap: false, isPdf: this.entry.isPdf, onFieldFetchData: (ev) => {
277
+ ev.stopPropagation();
278
+ ev.detail.form = this.uiFeldsformRef;
279
+ this.fieldFetchData.emit(ev.detail);
280
+ }, onExtraDataChanged: (ev) => ev.stopPropagation(), onDataChanged: (ev) => {
276
281
  var _a, _b;
277
282
  ev.stopPropagation();
278
283
  if (!isEqual((_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.uiFields) === null || _b === void 0 ? void 0 : _b.data, ev === null || ev === void 0 ? void 0 : ev.detail)) {
284
+ this.entry.uiFields.data = { ...ev.detail };
279
285
  this.uiFieldsChanged.emit({ newdata: ev.detail });
280
286
  }
281
287
  } })));
package/dist/esm/yoo-entity.entry.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { h, r as registerInstance, i as createEvent, f as forceUpdate, e as Host, g as getElement } from './index-a6a92b3d.js';
2
2
  import { c as FormFieldType, b as FeedPostType } from './index-4bbbf966.js';
3
3
  import './index-f1a9c615.js';
4
- import { k as keys, a as isNumber, n as compact, i as isArray, N as size, H as isNil, p as isString, ae as partition, C as get, b as isFunction } from './lodash-777f91de.js';
4
+ import { i as isArray, k as keys, a as isNumber, n as compact, N as size, H as isNil, p as isString, ae as partition, C as get, b as isFunction } from './lodash-777f91de.js';
5
5
  import { e as getIncentiveStatusBadgeSettings } from './incentive-helpers-3ea52d33.js';
6
6
  import { d as getCampaignStateTags, e as getCampaignTemplateTags, f as getMissionDataStateTags, h as getWaitlistVisitTags, g as getProductBatchDateTag, i as getProductBatchProgressColor } from './operation-helpers-aa9121fc.js';
7
7
  import { i as getMissionStateTags, d as getMissionUniqueKey, g as getMissionAddress, m as mapMissionToCardInboxEntry } from './missions-helpers-6b276054.js';
@@ -93,9 +93,18 @@ const YooEntityComponent = class {
93
93
  this.closed.emit(true);
94
94
  }
95
95
  getCustomModelValue(key, data, fields) {
96
+ var _a;
96
97
  const field = fields.find((f) => f.name === key);
97
98
  if ((field === null || field === void 0 ? void 0 : field.type) === FormFieldType.user && data[key]) {
98
- return getUserDisplayName(data[key]);
99
+ if (isArray(data[key]) && ((_a = data[key]) === null || _a === void 0 ? void 0 : _a.length) <= 0) {
100
+ return '';
101
+ }
102
+ else if (isArray(data[key]) && data[key].length >= 1) {
103
+ return data[key].map((u) => getUserDisplayName(u)).join(', ');
104
+ }
105
+ else {
106
+ return getUserDisplayName(data[key]);
107
+ }
99
108
  }
100
109
  else if (key === '_ect' || (field && (field.type === FormFieldType.date || field.type === FormFieldType.datetime))) {
101
110
  return pipes.dateFormat.transform(data[key], ...[!field || field.type === FormFieldType.date ? 'L' : 'L LT']);
package/dist/esm/yoo-form-dynamic.entry.js CHANGED
@@ -972,7 +972,7 @@ const YooFormDynamicComponent = class {
972
972
  }
973
973
  encodeFieldName(name) {
974
974
  // eslint-disable-next-line no-useless-escape
975
- return 'f-' + (name === null || name === void 0 ? void 0 : name.replace(/\./g, '-').replace(/_/g, '-').replace(/%/g, '-').replace(/\"/g, ''));
975
+ return 'f-' + (name === null || name === void 0 ? void 0 : name.replace(/\./g, '-').replace(/_/g, '-').replace(/%/g, '-').replace(/&/g, '-').replace(/\"/g, ''));
976
976
  }
977
977
  getFieldByCode(name, host) {
978
978
  const code = this.encodeFieldName(name);
package/dist/esm/yoo-form-table.entry.js CHANGED
@@ -154,9 +154,15 @@ const YooFormTableComponent = class {
154
154
  finalValues = finalValues.concat(this.tmpValues.filter((v) => finalValues.findIndex((f) => f._id === v._id) < 0));
155
155
  }
156
156
  if (finalValues.length > 0) {
157
- return (h("yoo-grid", { class: { table: true, form: !this.readonly }, ref: (el) => (this.gridEl = el), displayType: this.displayType, collectionName: this.collectionName, entityType: this.entityType, showSearch: true, items: finalValues, model: this.model, hideAdvancedFilters: true, customModel: this.customModel, secondaryActions: this.secondaryActions, isLocal: this.isLocal, isPdf: this.isPdf, initialQuery: this.initialQuery, preventSearchReset: true, onSelected: (ev) => {
157
+ return (h("yoo-grid", { class: { table: true, form: !this.readonly }, ref: (el) => (this.gridEl = el), displayType: this.displayType, collectionName: this.collectionName, entityType: this.entityType, showSearch: true, items: finalValues, model: this.model, hideAdvancedFilters: true, customModel: this.customModel, secondaryActions: this.secondaryActions, secondaryActionsDropdown: isWeb(this.host), isLocal: this.isLocal, isPdf: this.isPdf, initialQuery: this.initialQuery, preventSearchReset: true, onSelected: (ev) => {
158
+ var _a, _b, _c;
158
159
  ev.stopPropagation();
159
- this.onSelectItem(ev.detail);
160
+ if (((_c = (_b = (_a = this.customModel) === null || _a === void 0 ? void 0 : _a.appearance) === null || _b === void 0 ? void 0 : _b.get('uifields')) === null || _c === void 0 ? void 0 : _c.length) > 0) {
161
+ //do nothing because the user can interract with the form
162
+ }
163
+ else {
164
+ this.onSelectItem(ev.detail);
165
+ }
160
166
  }, onInputChanged: (ev) => ev === null || ev === void 0 ? void 0 : ev.stopPropagation() }));
161
167
  }
162
168
  return null;
package/dist/types/components/entities/card-list/default/card-list.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { IButton, ICardListEntry, ITagElement } from '@shared/interfaces';
1
+ import { IButton, ICardListEntry, IFormSearch, ITagElement } from '@shared/interfaces';
2
2
  import { ComponentInterface, EventEmitter } from '../../../../stencil-public-runtime';
3
3
  export declare class YooCardListComponent implements ComponentInterface {
4
4
  entry: ICardListEntry;
@@ -6,6 +6,7 @@ export declare class YooCardListComponent implements ComponentInterface {
6
6
  uiFieldsChanged: EventEmitter<{
7
7
  newdata: Record<string, any>;
8
8
  }>;
9
+ fieldFetchData: EventEmitter<IFormSearch>;
9
10
  translatedText: string;
10
11
  isTranslating: boolean;
11
12
  showTranslatedText: boolean;
@@ -15,6 +16,7 @@ export declare class YooCardListComponent implements ComponentInterface {
15
16
  private imgRef;
16
17
  private onTouchStart;
17
18
  private onTouchEnd;
19
+ private uiFeldsformRef;
18
20
  get isRenderBadgeOutside(): boolean;
19
21
  get isUsersView(): boolean;
20
22
  get isChartType(): boolean;
package/dist/types/components.d.ts CHANGED
@@ -11704,6 +11704,7 @@ declare namespace LocalJSX {
11704
11704
  interface YooCardList {
11705
11705
  "avatarImgs"?: string[];
11706
11706
  "entry"?: ICardListEntry;
11707
+ "onFieldFetchData"?: (event: YooCardListCustomEvent<IFormSearch>) => void;
11707
11708
  "onUiFieldsChanged"?: (event: YooCardListCustomEvent<{ newdata: Record<string, any> }>) => void;
11708
11709
  }
11709
11710
  interface YooCardListCollapsible {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yoobic/yobi",
3
- "version": "8.5.15",
3
+ "version": "8.5.17",
4
4
  "description": "Yobi - Yoobic Design System",
5
5
  "module": "dist/index.js",
6
6
  "main": "dist/index.cjs.js",