@onlive.ai/common-121 0.2.70 → 0.2.163

package/components/asset/index.js

@@ -0,0 +1,3536 @@
+/*! @onlive.ai/common-121 v0.2.163 | © 2026 Onlive.ai */
+var U=Object.defineProperty;var L=Object.getOwnPropertyDescriptor;var c=(n,e,t,o)=>{for(var s=o>1?void 0:o?L(e,t):e,l=n.length-1,a;l>=0;l--)(a=n[l])&&(s=(o?a(e,t,s):a(s))||s);return o&&s&&U(e,t,s),s};import{html as z,LitElement as ee}from"lit";import{property as T,state as h}from"lit/decorators.js";import{classMap as te}from"lit/directives/class-map.js";var D=(n,e)=>(customElements.get(n)?console.debug(`Custom element <${n}> is already defined, skipping definition of ${e.name}.`):window.customElements.define(n,e),e),V=(n,e)=>{let{kind:t,elements:o}=e;return{kind:t,elements:o,finisher(s){customElements.get(n)||window.customElements.define(n,s)}}},_=n=>e=>typeof e=="function"?D(n,e):V(n,e);var A=class n{constructor(e){this.config=e}static initialize(e){return new n(e)}getBaseUrl(){return`${this.config.baseUrl}`}getHeaders(){return{"Content-Type":"application/json"}}async makeRequest(e,t={}){let o=`${this.getBaseUrl()}${e}`,s=await fetch(o,{...t,headers:{...this.getHeaders(),...t.headers}});if(!s.ok)throw new Error(`FAQs API error: ${s.status} ${s.statusText}`);return s.json()}async getSettingsByOrganization(e,t){try{let o=new URLSearchParams;t&&o.append("userGroupId",t);let s=o.toString(),l=`${this.getBaseUrl()}/settings/organization/${e}${s?`?${s}`:""}`,a=await fetch(l,{method:"GET",headers:this.getHeaders(),credentials:"include"});if(a.status===404)return null;if(!a.ok)throw new Error(`Failed to fetch settings: ${a.statusText}`);return await a.json()}catch(o){return console.error("Error fetching settings:",o),null}}async getFaqs(e={}){let t=new URLSearchParams;if(e.search&&t.append("search",e.search),e.organizationId&&t.append("organizationId",e.organizationId),e.groupId&&t.append("groupId",e.groupId),e.isActive!==void 0&&t.append("isActive",e.isActive.toString()),e.page&&t.append("page",e.page.toString()),e.limit&&t.append("limit",e.limit.toString()),e.sortBy&&t.append("sortBy",e.sortBy),e.sortOrder&&t.append("sortOrder",e.sortOrder),e.extraFilters){for(let[l,a]of Object.entries(e.extraFilters))if(a&&(Array.isArray(a)?a.length>0:a.toString().trim()!=="")){let d=Array.isArray(a)?a.join(","):a.toString();t.append(`extra_${l}`,d)}}let o=t.toString(),s=`/faqs${o?`?${o}`:""}`;return this.makeRequest(s)}async getFaqById(e){return this.makeRequest(`/faqs/${e}`,{})}};var j=async(n,e)=>{let t=await fetch(n,e);if(!t.ok){let o=await t.json().catch(()=>({}));throw new Error(JSON.stringify({status:t.status,statusText:t.statusText,...o}))}return t&&t.json()};var k=class n{constructor(e){this.config=e,this.enableUpload=e.enableUpload||!1}static getInstance(e){if(!n.instance&&e&&(n.instance=new n(e)),!n.instance)throw new Error("FileService must be initialized with config first");return n.instance}static initialize(e){return n.instance=new n(e),n.instance}async uploadFile(e,t={}){try{let o=await this.requestSignedUrl({filename:e.name,description:t.description,loadDirection:"up",bucketType:t.bucketType||"conversations",path:t.path||".temp",mimeType:e.type});return await this.uploadToSignedUrl(o.data.signedUrlData.signedUrl,e),{success:!0,id:o.data.file.id,name:o.data.file.name,url:o.data.file.url,type:o.data.file.type}}catch(o){return console.error("Error uploading file:",o),{success:!1,error:o instanceof Error?o.message:"Unknown error"}}}async requestSignedUrl(e){let t=`${this.config.baseUrl}/files/upload-url`;return this.makeRequest(t,{method:"POST",body:JSON.stringify(e)})}async uploadToSignedUrl(e,t){let o=await fetch(e,{method:"PUT",body:t,headers:{"Content-Type":t.type}});if(!o.ok){let s=await o.text().catch(()=>"No response");throw new Error(`Upload failed with status: ${o.status}. Response: ${s}`)}}async uploadFileWithRetry(e,t={}){let o=t.maxRetries||3,s=null;for(let l=1;l<=o;l++)try{let a=await this.uploadFile(e,t);if(a.success)return a;throw new Error(a.error||"Upload failed")}catch(a){if(s=a instanceof Error?a:new Error("Unknown error"),l===o)break;let d=2**l*1e3;await new Promise(r=>setTimeout(r,d))}return{success:!1,error:s?.message||"Upload failed after retries"}}async getFileById(e){let t=`${this.config.baseUrl}/files/${e}`,o=await this.makeRequest(t);if(!o.success)throw new Error("Failed to get file");return o.data}async makeRequest(e,t){let o={"Content-Type":"application/json"};return this.config.organizationId&&(o["X-Onlive-Organization-Id"]=this.config.organizationId),t?.headers&&Object.assign(o,t.headers),j(e,{...t,headers:o})}updateConfig(e){this.config={...this.config,...e}}getConfig(){return{...this.config}}};var S=class n{constructor(e){this.config=e}static getInstance(e){if(!n.instance&&e&&(n.instance=new n(e)),!n.instance)throw new Error("MultimediaService must be initialized with config first");return n.instance}static initialize(e){return n.instance=new n(e),n.instance}async getImages(e={}){let t=new URLSearchParams({type:"image",page:(e.page||1).toString(),limit:(e.limit||12).toString(),...e.search&&{search:e.search},...e.labels&&{labels:e.labels.join(",")},...e.includeSecureToken&&{includeSecureToken:e.includeSecureToken.toString()}});this.appendExtraFilters(t,e.extraFilters);let o=`${this.config.baseUrl}/multimedia?${t}`;return this.makeRequest(o)}async getVideos(e={}){let t=new URLSearchParams({type:"video",page:(e.page||1).toString(),limit:(e.limit||12).toString(),...e.search&&{search:e.search},...e.labels&&{labels:e.labels.join(",")},...e.includeSecureToken&&{includeSecureToken:e.includeSecureToken.toString()}});this.appendExtraFilters(t,e.extraFilters);let o=`${this.config.baseUrl}/multimedia?${t}`;return this.makeRequest(o)}async getPresentations(e={}){let t=new URLSearchParams({type:"presentation",page:(e.page||1).toString(),limit:(e.limit||12).toString(),...e.search&&{search:e.search},...e.labels&&{labels:e.labels.join(",")},...e.includeSecureToken&&{includeSecureToken:e.includeSecureToken.toString()}});this.appendExtraFilters(t,e.extraFilters);let o=`${this.config.baseUrl}/multimedia?${t}`;return this.makeRequest(o)}async getAllMultimedia(e={}){let[t,o,s]=await Promise.all([this.getImages(e),this.getVideos(e),this.getPresentations(e)]);return{images:t,videos:o,presentations:s}}async getMultimediaByToken(e){let t=`${this.config.baseUrl}/multimedia/secure-token/${e}`;return this.makeRequest(t,!1)}async searchMultimedia(e,t){let o={search:e,page:1,limit:50,includeSecureToken:!0};if(t)return this.getMultimediaByType(t,o);let[s,l,a]=await Promise.all([this.getImages(o),this.getVideos(o),this.getPresentations(o)]),d=[...s.items,...l.items,...a.items];return{items:d,total:d.length,count:d.length,currentPage:1,totalPages:1}}async getMultimediaByType(e,t){switch(e){case"image":return this.getImages(t);case"video":return this.getVideos(t);case"presentation":return this.getPresentations(t);default:throw new Error(`Invalid multimedia type: ${e}`)}}appendExtraFilters(e,t){if(t){for(let[o,s]of Object.entries(t))if(s&&(Array.isArray(s)?s.length>0:s.toString().trim()!=="")){let l=Array.isArray(s)?s.join(","):s.toString();e.append(`extra_${o}`,l)}}}async makeRequest(e,t=!0){let o={"Content-Type":"application/json","X-Onlive-Organization-Id":this.config.organizationId};return j(e,{method:"GET",headers:o,credentials:t?"include":void 0})}updateConfig(e){this.config={...this.config,...e}}getConfig(){return{...this.config}}};var g=class n{constructor(e){this.config=e}static getInstance(e){if(!n.instance&&e&&(n.instance=new n(e)),!n.instance)throw new Error("ProductService must be initialized with config first");return n.instance}static initialize(e){return n.instance=new n(e),n.instance}async getProducts(e={}){let t=new URLSearchParams({...e.title&&{title:e.title},...e.search&&{search:e.search},...e.category&&{category:e.category},...e.tags&&{tags:e.tags.join(",")},...e.sortBy&&{sortBy:e.sortBy},...e.sortOrder&&{sortOrder:e.sortOrder},...e.minPrice&&{minPrice:e.minPrice.toString()},...e.maxPrice&&{maxPrice:e.maxPrice.toString()},...e.inStock!==void 0&&{inStock:e.inStock.toString()},...e.offset&&{offset:e.offset.toString()},...e.includeSecureToken&&{includeSecureToken:e.includeSecureToken.toString()}});e.extraFields&&Object.keys(e.extraFields).length>0&&t.append("extraFields",JSON.stringify(e.extraFields));let o=`${this.config.baseUrl}/products?${t}`;return this.makeRequest(o,!0)}async getProductByToken(e){let t=`${this.config.baseUrl}/products/secure-token/${e}`;return this.makeRequest(t)}async searchProducts(e,t={}){return this.getProducts({...t,search:e})}async makeRequest(e,t=!1){let o={"Content-Type":"application/json","X-Onlive-Organization-Id":this.config.organizationId};return j(e,{method:"GET",headers:o,credentials:t?"include":"same-origin"})}updateConfig(e){this.config={...this.config,...e}}getConfig(){return{...this.config}}};var b=class{constructor(e){e?.multimediaService&&(this.multimediaService=S.initialize(e.multimediaService)),e?.faqsService&&(this.faqsService=A.initialize(e.faqsService)),e?.productService&&(this.productService=g.initialize(e.productService)),e?.fileService&&(this.fileService=k.initialize(e.fileService))}async loadAsset(e,t){switch(e){case"multimedia":return this.loadMultimediaAsset(t);case"product":return this.loadProductAsset(t);case"faq":return this.loadFaqAsset(t);case"file":return this.loadFileAsset(t);default:throw new Error(`Unsupported asset type: ${e}`)}}async loadMultimediaAsset(e){if(!this.multimediaService)throw new Error("MultimediaService not configured");let t=await this.multimediaService.getMultimediaByToken(e);if(!t)throw new Error("Multimedia not found");return{id:t.id,name:t.name,description:t.description||"",url:t.url,thumbnail:t.animatedCoverUrl||t.url,type:"multimedia",externalId:t.id,format:t.format,size:t.size||void 0,duration:t.duration||void 0,vodUrl:t.vodUrl||void 0,slides:t.slides||[],labels:t.labels,animatedCoverUrl:t.animatedCoverUrl||void 0,metadata:{organizationId:t.organizationId,status:t.status,createdAt:t.createdAt,updatedAt:t.updatedAt}}}async loadProductAsset(e){if(!this.productService)throw new Error("MultimediaService not configured");let t=await this.productService.getProductByToken(e);if(!t)throw new Error("Product not found");return{id:t.id,name:t.name,description:t.description,url:t.url,thumbnail:t.images?.[0],type:"product",externalId:t.externalId,price:t.price,currency:t.currency,category:t.category,tags:t.tags,images:t.images,variants:t.variants?.map(o=>({id:o.id,externalId:o.externalId,price:o.price,currency:o.currency,images:o.images})),options:t.options,metadata:{providerType:t.providerType,providerId:t.providerId,discountType:t.discountType,discount:t.discount,stock:t.stock,broken:t.broken}}}async loadFaqAsset(e){if(!this.faqsService)throw new Error("FaqsService not configured");let t=await this.faqsService.getFaqById(e);return{id:t.id,name:t.question,description:t.answer,url:`#faq-${t.id}`,type:"faq",externalId:t.id,question:t.question,answer:t.answer,priority:t.priority,isActive:t.isActive,metadata:{organizationId:t.organizationId,createdAt:t.createdAt,updatedAt:t.updatedAt}}}async loadFileAsset(e){if(!this.fileService)throw new Error("FileService not configured");let t=await this.fileService.getFileById(e),o=t.type||"",s=o.startsWith("video/"),l=o.startsWith("image/");return{id:t.id,name:t.name,description:t.description||"",url:t.url,thumbnail:l?t.url:void 0,type:"file",externalId:t.id,format:o,size:t.metadata?.size,duration:void 0,vodUrl:s?t.url:void 0,labels:[],animatedCoverUrl:s?t.url:void 0,metadata:{path:t.metadata?.path,bucketType:t.metadata?.bucketType,loadDirection:t.metadata?.loadDirection,createdAt:t.createdAt,updatedAt:t.updatedAt}}}};import{html as i}from"lit";import{classMap as W}from"lit/directives/class-map.js";import{ifDefined as y}from"lit/directives/if-defined.js";import{when as m}from"lit/directives/when.js";import{unsafeHTML as Y}from"lit/directives/unsafe-html.js";import F from"dompurify";var B={ALLOWED_TAGS:["p","br","span","b","strong","i","em","u","s","del","ul","ol","li","code","pre","a","h1","h2","h3","h4","table","thead","tbody","tr","th","td"],ALLOWED_ATTR:["href","target","rel","title","aria-label","role","colspan","rowspan"],FORCE_HTTPS:!0,ALLOW_DATA_ATTR:!1};F.addHook("afterSanitizeAttributes",n=>{"target"in n&&n.target==="_blank"&&n.setAttribute("rel","noopener noreferrer")});var q=(n,e=B)=>F.sanitize(n,e);function C(n=""){return Y(q(n,{ADD_ATTR:["target","rel"],ADD_TAGS:["ol-"],CUSTOM_ELEMENT_HANDLING:{tagNameCheck:/^ol-/,attributeNameCheck:null,allowCustomizedBuiltInElements:!0}}))}import"@onlive.ai/ui/dist/components/button/button.js";import"@onlive.ai/ui/dist/components/icon/icon.js";import{html as E,LitElement as N}from"lit";import{property as G,query as Q}from"lit/decorators.js";import{repeat as K}from"lit/directives/repeat.js";import X from"video.js";import{css as H,unsafeCSS as J}from"lit";import O from"video.js/dist/video-js.min.css?inline";var R=H`
+  ${J(O)}
+  .och__player {
+    width: 100%;
+    height: auto;
+    aspect-ratio: 16 / 9;
+  }
+  .video-js .vjs-big-play-button,
+  .video-js:hover .vjs-big-play-button {
+    font-size: 45px;
+    border: none;
+    background: transparent;
+    transition: all 0.2s ease;
+  }
+`;var f=class extends N{constructor(){super(...arguments);this.sources=[];this.player=null}connectedCallback(){super.connectedCallback();let t="videojs-font-face";if(!document.head.querySelector(`#${t}`)){let o=document.createElement("style");o.id=t,o.innerHTML=`
+        @font-face {
+          font-family: VideoJS;
+          src:
+            url(https://cdn.onlive.site/fonts/video-js/font/VideoJS.woff) format("woff"),
+            url(https://cdn.onlive.site/fonts/video-js/font/VideoJS.ttf) format("truetype");
+        }`,document.head.appendChild(o)}}firstUpdated(){this.$player&&(this.player=X(this.$player,{controls:!0,controlBar:{children:["playToggle","progressControl","volumePanel","fullscreenToggle"]}}))}play(){this.player?.play()}pause(){this.player?.pause()}render(){return E`
+      <video
+        id="player"
+        class="och__player video-js video-js vjs-16-9 vjs-controls-enabled vjs-workinghover vjs-v8 vjs-theme-sea vjs_video_2321-dimensions vjs-has-started vjs-paused vjs-user-inactive"
+      >
+        ${K(this.sources,t=>t.src,t=>E`<source src=${t.src} type=${t.type}></source>`)}
+        <p class="vjs-no-js">
+          To view this video please enable JavaScript, and consider upgrading to a web browser that
+          <a href="https://videojs.com/html5-video-support/" target="_blank"> supports HTML5 video </a>
+        </p>
+      </video>
+      <style>
+        .vjs-svg-icon {
+    display: inline-block;
+    background-repeat: no-repeat;
+    background-position: center;
+    fill: currentColor;
+    height: 1.8em;
+    width: 1.8em
+}
+
+.vjs-svg-icon:before {
+    content: none !important
+}
+
+.vjs-control:focus .vjs-svg-icon, .vjs-svg-icon:hover {
+    filter: drop-shadow(0 0 .25em #fff)
+}
+
+.video-js .vjs-big-play-button .vjs-icon-placeholder:before, .video-js .vjs-modal-dialog, .vjs-button>.vjs-icon-placeholder:before, .vjs-modal-dialog .vjs-modal-dialog-content {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%
+}
+
+.video-js .vjs-big-play-button .vjs-icon-placeholder:before, .vjs-button>.vjs-icon-placeholder:before {
+    text-align: center
+}
+
+@font-face {
+    font-family: VideoJS;
+    src: url(data:application/font-woff;charset=utf-8;base64,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) format("woff");
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-big-play-button .vjs-icon-placeholder:before, .video-js .vjs-play-control .vjs-icon-placeholder, .vjs-icon-play {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-big-play-button .vjs-icon-placeholder:before, .video-js .vjs-play-control .vjs-icon-placeholder:before, .vjs-icon-play:before {
+    content: "\f101"
+}
+
+.vjs-icon-play-circle {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-play-circle:before {
+    content: "\f102"
+}
+
+.video-js .vjs-play-control.vjs-playing .vjs-icon-placeholder, .vjs-icon-pause {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-play-control.vjs-playing .vjs-icon-placeholder:before, .vjs-icon-pause:before {
+    content: "\f103"
+}
+
+.video-js .vjs-mute-control.vjs-vol-0 .vjs-icon-placeholder, .vjs-icon-volume-mute {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-mute-control.vjs-vol-0 .vjs-icon-placeholder:before, .vjs-icon-volume-mute:before {
+    content: "\f104"
+}
+
+.video-js .vjs-mute-control.vjs-vol-1 .vjs-icon-placeholder, .vjs-icon-volume-low {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-mute-control.vjs-vol-1 .vjs-icon-placeholder:before, .vjs-icon-volume-low:before {
+    content: "\f105"
+}
+
+.video-js .vjs-mute-control.vjs-vol-2 .vjs-icon-placeholder, .vjs-icon-volume-mid {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-mute-control.vjs-vol-2 .vjs-icon-placeholder:before, .vjs-icon-volume-mid:before {
+    content: "\f106"
+}
+
+.video-js .vjs-mute-control .vjs-icon-placeholder, .vjs-icon-volume-high {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-mute-control .vjs-icon-placeholder:before, .vjs-icon-volume-high:before {
+    content: "\f107"
+}
+
+.video-js .vjs-fullscreen-control .vjs-icon-placeholder, .vjs-icon-fullscreen-enter {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-fullscreen-control .vjs-icon-placeholder:before, .vjs-icon-fullscreen-enter:before {
+    content: "\f108"
+}
+
+.video-js.vjs-fullscreen .vjs-fullscreen-control .vjs-icon-placeholder, .vjs-icon-fullscreen-exit {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js.vjs-fullscreen .vjs-fullscreen-control .vjs-icon-placeholder:before, .vjs-icon-fullscreen-exit:before {
+    content: "\f109"
+}
+
+.vjs-icon-spinner {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-spinner:before {
+    content: "\f10a"
+}
+
+.video-js .vjs-subs-caps-button .vjs-icon-placeholder, .video-js .vjs-subtitles-button .vjs-icon-placeholder, .video-js.video-js:lang(en-AU) .vjs-subs-caps-button .vjs-icon-placeholder, .video-js.video-js:lang(en-GB) .vjs-subs-caps-button .vjs-icon-placeholder, .video-js.video-js:lang(en-IE) .vjs-subs-caps-button .vjs-icon-placeholder, .video-js.video-js:lang(en-NZ) .vjs-subs-caps-button .vjs-icon-placeholder, .vjs-icon-subtitles {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-subs-caps-button .vjs-icon-placeholder:before, .video-js .vjs-subtitles-button .vjs-icon-placeholder:before, .video-js.video-js:lang(en-AU) .vjs-subs-caps-button .vjs-icon-placeholder:before, .video-js.video-js:lang(en-GB) .vjs-subs-caps-button .vjs-icon-placeholder:before, .video-js.video-js:lang(en-IE) .vjs-subs-caps-button .vjs-icon-placeholder:before, .video-js.video-js:lang(en-NZ) .vjs-subs-caps-button .vjs-icon-placeholder:before, .vjs-icon-subtitles:before {
+    content: "\f10b"
+}
+
+.video-js .vjs-captions-button .vjs-icon-placeholder, .video-js:lang(en) .vjs-subs-caps-button .vjs-icon-placeholder, .video-js:lang(fr-CA) .vjs-subs-caps-button .vjs-icon-placeholder, .vjs-icon-captions {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-captions-button .vjs-icon-placeholder:before, .video-js:lang(en) .vjs-subs-caps-button .vjs-icon-placeholder:before, .video-js:lang(fr-CA) .vjs-subs-caps-button .vjs-icon-placeholder:before, .vjs-icon-captions:before {
+    content: "\f10c"
+}
+
+.vjs-icon-hd {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-hd:before {
+    content: "\f10d"
+}
+
+.video-js .vjs-chapters-button .vjs-icon-placeholder, .vjs-icon-chapters {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-chapters-button .vjs-icon-placeholder:before, .vjs-icon-chapters:before {
+    content: "\f10e"
+}
+
+.vjs-icon-downloading {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-downloading:before {
+    content: "\f10f"
+}
+
+.vjs-icon-file-download {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-file-download:before {
+    content: "\f110"
+}
+
+.vjs-icon-file-download-done {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-file-download-done:before {
+    content: "\f111"
+}
+
+.vjs-icon-file-download-off {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-file-download-off:before {
+    content: "\f112"
+}
+
+.vjs-icon-share {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-share:before {
+    content: "\f113"
+}
+
+.vjs-icon-cog {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-cog:before {
+    content: "\f114"
+}
+
+.vjs-icon-square {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-square:before {
+    content: "\f115"
+}
+
+.video-js .vjs-play-progress, .video-js .vjs-volume-level, .vjs-icon-circle, .vjs-seek-to-live-control .vjs-icon-placeholder {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-play-progress:before, .video-js .vjs-volume-level:before, .vjs-icon-circle:before, .vjs-seek-to-live-control .vjs-icon-placeholder:before {
+    content: "\f116"
+}
+
+.vjs-icon-circle-outline {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-circle-outline:before {
+    content: "\f117"
+}
+
+.vjs-icon-circle-inner-circle {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-circle-inner-circle:before {
+    content: "\f118"
+}
+
+.video-js .vjs-control.vjs-close-button .vjs-icon-placeholder, .vjs-icon-cancel {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-control.vjs-close-button .vjs-icon-placeholder:before, .vjs-icon-cancel:before {
+    content: "\f119"
+}
+
+.vjs-icon-repeat {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-repeat:before {
+    content: "\f11a"
+}
+
+.video-js .vjs-play-control.vjs-ended .vjs-icon-placeholder, .vjs-icon-replay {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-play-control.vjs-ended .vjs-icon-placeholder:before, .vjs-icon-replay:before {
+    content: "\f11b"
+}
+
+.video-js .vjs-skip-backward-5 .vjs-icon-placeholder, .vjs-icon-replay-5 {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-skip-backward-5 .vjs-icon-placeholder:before, .vjs-icon-replay-5:before {
+    content: "\f11c"
+}
+
+.video-js .vjs-skip-backward-10 .vjs-icon-placeholder, .vjs-icon-replay-10 {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-skip-backward-10 .vjs-icon-placeholder:before, .vjs-icon-replay-10:before {
+    content: "\f11d"
+}
+
+.video-js .vjs-skip-backward-30 .vjs-icon-placeholder, .vjs-icon-replay-30 {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-skip-backward-30 .vjs-icon-placeholder:before, .vjs-icon-replay-30:before {
+    content: "\f11e"
+}
+
+.video-js .vjs-skip-forward-5 .vjs-icon-placeholder, .vjs-icon-forward-5 {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-skip-forward-5 .vjs-icon-placeholder:before, .vjs-icon-forward-5:before {
+    content: "\f11f"
+}
+
+.video-js .vjs-skip-forward-10 .vjs-icon-placeholder, .vjs-icon-forward-10 {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-skip-forward-10 .vjs-icon-placeholder:before, .vjs-icon-forward-10:before {
+    content: "\f120"
+}
+
+.video-js .vjs-skip-forward-30 .vjs-icon-placeholder, .vjs-icon-forward-30 {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-skip-forward-30 .vjs-icon-placeholder:before, .vjs-icon-forward-30:before {
+    content: "\f121"
+}
+
+.video-js .vjs-audio-button .vjs-icon-placeholder, .vjs-icon-audio {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-audio-button .vjs-icon-placeholder:before, .vjs-icon-audio:before {
+    content: "\f122"
+}
+
+.vjs-icon-next-item {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-next-item:before {
+    content: "\f123"
+}
+
+.vjs-icon-previous-item {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-previous-item:before {
+    content: "\f124"
+}
+
+.vjs-icon-shuffle {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-shuffle:before {
+    content: "\f125"
+}
+
+.vjs-icon-cast {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-cast:before {
+    content: "\f126"
+}
+
+.video-js .vjs-picture-in-picture-control .vjs-icon-placeholder, .vjs-icon-picture-in-picture-enter {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-picture-in-picture-control .vjs-icon-placeholder:before, .vjs-icon-picture-in-picture-enter:before {
+    content: "\f127"
+}
+
+.video-js.vjs-picture-in-picture .vjs-picture-in-picture-control .vjs-icon-placeholder, .vjs-icon-picture-in-picture-exit {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js.vjs-picture-in-picture .vjs-picture-in-picture-control .vjs-icon-placeholder:before, .vjs-icon-picture-in-picture-exit:before {
+    content: "\f128"
+}
+
+.vjs-icon-facebook {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-facebook:before {
+    content: "\f129"
+}
+
+.vjs-icon-linkedin {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-linkedin:before {
+    content: "\f12a"
+}
+
+.vjs-icon-twitter {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-twitter:before {
+    content: "\f12b"
+}
+
+.vjs-icon-tumblr {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-tumblr:before {
+    content: "\f12c"
+}
+
+.vjs-icon-pinterest {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.vjs-icon-pinterest:before {
+    content: "\f12d"
+}
+
+.video-js .vjs-descriptions-button .vjs-icon-placeholder, .vjs-icon-audio-description {
+    font-family: VideoJS;
+    font-weight: 400;
+    font-style: normal
+}
+
+.video-js .vjs-descriptions-button .vjs-icon-placeholder:before, .vjs-icon-audio-description:before {
+    content: "\f12e"
+}
+
+.video-js {
+    display: inline-block;
+    vertical-align: top;
+    box-sizing: border-box;
+    color: #fff;
+    background-color: #000;
+    position: relative;
+    padding: 0;
+    font-size: 10px;
+    line-height: 1;
+    font-weight: 400;
+    font-style: normal;
+    font-family: Arial, Helvetica, sans-serif;
+    word-break: initial
+}
+
+.video-js:-moz-full-screen {
+    position: absolute
+}
+
+.video-js:-webkit-full-screen {
+    width: 100% !important;
+    height: 100% !important
+}
+
+.video-js[tabindex="-1"] {
+    outline: 0
+}
+
+.video-js *, .video-js :after, .video-js :before {
+    box-sizing: inherit
+}
+
+.video-js ul {
+    font-family: inherit;
+    font-size: inherit;
+    line-height: inherit;
+    list-style-position: outside;
+    margin-left: 0;
+    margin-right: 0;
+    margin-top: 0;
+    margin-bottom: 0
+}
+
+.video-js.vjs-1-1, .video-js.vjs-16-9, .video-js.vjs-4-3, .video-js.vjs-9-16, .video-js.vjs-fluid {
+    width: 100%;
+    max-width: 100%
+}
+
+.video-js.vjs-1-1:not(.vjs-audio-only-mode), .video-js.vjs-16-9:not(.vjs-audio-only-mode), .video-js.vjs-4-3:not(.vjs-audio-only-mode), .video-js.vjs-9-16:not(.vjs-audio-only-mode), .video-js.vjs-fluid:not(.vjs-audio-only-mode) {
+    height: 0
+}
+
+.video-js.vjs-16-9:not(.vjs-audio-only-mode) {
+    padding-top: 56.25%
+}
+
+.video-js.vjs-4-3:not(.vjs-audio-only-mode) {
+    padding-top: 75%
+}
+
+.video-js.vjs-9-16:not(.vjs-audio-only-mode) {
+    padding-top: 177.7777777778%
+}
+
+.video-js.vjs-1-1:not(.vjs-audio-only-mode) {
+    padding-top: 100%
+}
+
+.video-js.vjs-fill:not(.vjs-audio-only-mode) {
+    width: 100%;
+    height: 100%
+}
+
+.video-js .vjs-tech {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%
+}
+
+.video-js.vjs-audio-only-mode .vjs-tech {
+    display: none
+}
+
+body.vjs-full-window, body.vjs-pip-window {
+    padding: 0;
+    margin: 0;
+    height: 100%
+}
+
+.vjs-full-window .video-js.vjs-fullscreen, body.vjs-pip-window .video-js {
+    position: fixed;
+    overflow: hidden;
+    z-index: 1000;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    right: 0
+}
+
+.video-js.vjs-fullscreen:not(.vjs-ios-native-fs), body.vjs-pip-window .video-js {
+    width: 100% !important;
+    height: 100% !important;
+    padding-top: 0 !important;
+    display: block
+}
+
+.video-js.vjs-fullscreen.vjs-user-inactive {
+    cursor: none
+}
+
+.vjs-pip-container .vjs-pip-text {
+    position: absolute;
+    bottom: 10%;
+    font-size: 2em;
+    background-color: rgba(0, 0, 0, .7);
+    padding: .5em;
+    text-align: center;
+    width: 100%
+}
+
+.vjs-layout-small.vjs-pip-container .vjs-pip-text, .vjs-layout-tiny.vjs-pip-container .vjs-pip-text, .vjs-layout-x-small.vjs-pip-container .vjs-pip-text {
+    bottom: 0;
+    font-size: 1.4em
+}
+
+.vjs-hidden {
+    display: none !important
+}
+
+.vjs-disabled {
+    opacity: .5;
+    cursor: default
+}
+
+.video-js .vjs-offscreen {
+    height: 1px;
+    left: -9999px;
+    position: absolute;
+    top: 0;
+    width: 1px
+}
+
+.vjs-lock-showing {
+    display: block !important;
+    opacity: 1 !important;
+    visibility: visible !important
+}
+
+.vjs-no-js {
+    padding: 20px;
+    color: #fff;
+    background-color: #000;
+    font-size: 18px;
+    font-family: Arial, Helvetica, sans-serif;
+    text-align: center;
+    width: 300px;
+    height: 150px;
+    margin: 0 auto
+}
+
+.vjs-no-js a, .vjs-no-js a:visited {
+    color: #66a8cc
+}
+
+.video-js .vjs-big-play-button {
+    font-size: 3em;
+    line-height: 1.5em;
+    height: 1.63332em;
+    width: 3em;
+    display: block;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    padding: 0;
+    margin-top: -.81666em;
+    margin-left: -1.5em;
+    cursor: pointer;
+    opacity: 1;
+    border: .06666em solid #fff;
+    background-color: #2b333f;
+    background-color: rgba(43, 51, 63, .7);
+    border-radius: .3em;
+    transition: all .4s
+}
+
+.vjs-big-play-button .vjs-svg-icon {
+    width: 1em;
+    height: 1em;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    line-height: 1;
+    transform: translate(-50%, -50%)
+}
+
+.video-js .vjs-big-play-button:focus, .video-js:hover .vjs-big-play-button {
+    border-color: #fff;
+    background-color: rgb(114.9141509434, 132.7028301887, 159.3858490566);
+    background-color: rgba(114.9141509434, 132.7028301887, 159.3858490566, .5);
+    transition: all 0s
+}
+
+.vjs-controls-disabled .vjs-big-play-button, .vjs-error .vjs-big-play-button, .vjs-has-started .vjs-big-play-button, .vjs-using-native-controls .vjs-big-play-button {
+    display: none
+}
+
+.vjs-has-started.vjs-paused.vjs-show-big-play-button-on-pause:not(.vjs-seeking, .vjs-scrubbing, .vjs-error) .vjs-big-play-button {
+    display: block
+}
+
+.video-js button {
+    background: 0 0;
+    border: none;
+    color: inherit;
+    display: inline-block;
+    font-size: inherit;
+    line-height: inherit;
+    text-transform: none;
+    text-decoration: none;
+    transition: none;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    appearance: none
+}
+
+.video-js.vjs-spatial-navigation-enabled .vjs-button:focus {
+    outline: .0625em solid #fff;
+    box-shadow: none
+}
+
+.vjs-control .vjs-button {
+    width: 100%;
+    height: 100%
+}
+
+.video-js .vjs-control.vjs-close-button {
+    cursor: pointer;
+    height: 3em;
+    position: absolute;
+    right: 0;
+    top: .5em;
+    z-index: 2
+}
+
+.video-js .vjs-modal-dialog {
+    background: rgba(0, 0, 0, .8);
+    background: linear-gradient(180deg, rgba(0, 0, 0, .8), rgba(255, 255, 255, 0));
+    overflow: auto
+}
+
+.video-js .vjs-modal-dialog>* {
+    box-sizing: border-box
+}
+
+.vjs-modal-dialog .vjs-modal-dialog-content {
+    font-size: 1.2em;
+    line-height: 1.5;
+    padding: 20px 24px;
+    z-index: 1
+}
+
+.vjs-menu-button {
+    cursor: pointer
+}
+
+.vjs-menu-button.vjs-disabled {
+    cursor: default
+}
+
+.vjs-workinghover .vjs-menu-button.vjs-disabled:hover .vjs-menu {
+    display: none
+}
+
+.vjs-menu .vjs-menu-content {
+    display: block;
+    padding: 0;
+    margin: 0;
+    font-family: Arial, Helvetica, sans-serif;
+    overflow: auto
+}
+
+.vjs-menu .vjs-menu-content>* {
+    box-sizing: border-box
+}
+
+.vjs-scrubbing .vjs-control.vjs-menu-button:hover .vjs-menu {
+    display: none
+}
+
+.vjs-menu li {
+    display: flex;
+    justify-content: center;
+    list-style: none;
+    margin: 0;
+    padding: .2em 0;
+    line-height: 1.4em;
+    font-size: 1.2em;
+    text-align: center;
+    text-transform: lowercase
+}
+
+.js-focus-visible .vjs-menu li.vjs-menu-item:hover, .vjs-menu li.vjs-menu-item:focus, .vjs-menu li.vjs-menu-item:hover {
+    background-color: rgb(114.9141509434, 132.7028301887, 159.3858490566);
+    background-color: rgba(114.9141509434, 132.7028301887, 159.3858490566, .5)
+}
+
+.js-focus-visible .vjs-menu li.vjs-selected:hover, .vjs-menu li.vjs-selected, .vjs-menu li.vjs-selected:focus, .vjs-menu li.vjs-selected:hover {
+    background-color: #fff;
+    color: #2b333f
+}
+
+.js-focus-visible .vjs-menu li.vjs-selected:hover .vjs-svg-icon, .vjs-menu li.vjs-selected .vjs-svg-icon, .vjs-menu li.vjs-selected:focus .vjs-svg-icon, .vjs-menu li.vjs-selected:hover .vjs-svg-icon {
+    fill: #000
+}
+
+.js-focus-visible .vjs-menu :not(.vjs-selected):focus:not(.focus-visible), .video-js .vjs-menu :not(.vjs-selected):focus:not(:focus-visible) {
+    background: 0 0
+}
+
+.vjs-menu li.vjs-menu-title {
+    text-align: center;
+    text-transform: uppercase;
+    font-size: 1em;
+    line-height: 2em;
+    padding: 0;
+    margin: 0 0 .3em 0;
+    font-weight: 700;
+    cursor: default
+}
+
+.vjs-menu-button-popup .vjs-menu {
+    display: none;
+    position: absolute;
+    bottom: 0;
+    width: 10em;
+    left: -3em;
+    height: 0;
+    margin-bottom: 1.5em;
+    border-top-color: rgba(43, 51, 63, .7)
+}
+
+.vjs-pip-window .vjs-menu-button-popup .vjs-menu {
+    left: unset;
+    right: 1em
+}
+
+.vjs-menu-button-popup .vjs-menu .vjs-menu-content {
+    background-color: #2b333f;
+    background-color: rgba(43, 51, 63, .7);
+    position: absolute;
+    width: 100%;
+    bottom: 1.5em;
+    max-height: 15em
+}
+
+.vjs-layout-tiny .vjs-menu-button-popup .vjs-menu .vjs-menu-content, .vjs-layout-x-small .vjs-menu-button-popup .vjs-menu .vjs-menu-content {
+    max-height: 5em
+}
+
+.vjs-layout-small .vjs-menu-button-popup .vjs-menu .vjs-menu-content {
+    max-height: 10em
+}
+
+.vjs-layout-medium .vjs-menu-button-popup .vjs-menu .vjs-menu-content {
+    max-height: 14em
+}
+
+.vjs-layout-huge .vjs-menu-button-popup .vjs-menu .vjs-menu-content, .vjs-layout-large .vjs-menu-button-popup .vjs-menu .vjs-menu-content, .vjs-layout-x-large .vjs-menu-button-popup .vjs-menu .vjs-menu-content {
+    max-height: 25em
+}
+
+.vjs-menu-button-popup .vjs-menu.vjs-lock-showing, .vjs-workinghover .vjs-menu-button-popup.vjs-hover .vjs-menu {
+    display: block
+}
+
+.video-js .vjs-menu-button-inline {
+    transition: all .4s;
+    overflow: hidden
+}
+
+.video-js .vjs-menu-button-inline:before {
+    width: 2.222222222em
+}
+
+.video-js .vjs-menu-button-inline.vjs-slider-active, .video-js .vjs-menu-button-inline:focus, .video-js .vjs-menu-button-inline:hover {
+    width: 12em
+}
+
+.vjs-menu-button-inline .vjs-menu {
+    opacity: 0;
+    height: 100%;
+    width: auto;
+    position: absolute;
+    left: 4em;
+    top: 0;
+    padding: 0;
+    margin: 0;
+    transition: all .4s
+}
+
+.vjs-menu-button-inline.vjs-slider-active .vjs-menu, .vjs-menu-button-inline:focus .vjs-menu, .vjs-menu-button-inline:hover .vjs-menu {
+    display: block;
+    opacity: 1
+}
+
+.vjs-menu-button-inline .vjs-menu-content {
+    width: auto;
+    height: 100%;
+    margin: 0;
+    overflow: hidden
+}
+
+.video-js .vjs-control-bar {
+    display: none;
+    width: 100%;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    height: 3em;
+    background-color: #2b333f;
+    background-color: rgba(43, 51, 63, .7)
+}
+
+.video-js.vjs-spatial-navigation-enabled .vjs-control-bar {
+    gap: 1px
+}
+
+.video-js:not(.vjs-controls-disabled, .vjs-using-native-controls, .vjs-error) .vjs-control-bar.vjs-lock-showing {
+    display: flex !important
+}
+
+.vjs-audio-only-mode .vjs-control-bar, .vjs-has-started .vjs-control-bar {
+    display: flex;
+    visibility: visible;
+    opacity: 1;
+    transition: visibility .1s, opacity .1s
+}
+
+.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
+    visibility: visible;
+    opacity: 0;
+    pointer-events: none;
+    transition: visibility 1s, opacity 1s
+}
+
+.vjs-controls-disabled .vjs-control-bar, .vjs-error .vjs-control-bar, .vjs-using-native-controls .vjs-control-bar {
+    display: none !important
+}
+
+.vjs-audio-only-mode.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar, .vjs-audio.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
+    opacity: 1;
+    visibility: visible;
+    pointer-events: auto
+}
+
+.video-js .vjs-control {
+    position: relative;
+    text-align: center;
+    margin: 0;
+    padding: 0;
+    height: 100%;
+    width: 4em;
+    flex: none
+}
+
+.video-js .vjs-control.vjs-visible-text {
+    width: auto;
+    padding-left: 1em;
+    padding-right: 1em
+}
+
+.vjs-button>.vjs-icon-placeholder:before {
+    font-size: 1.8em;
+    line-height: 1.67
+}
+
+.vjs-button>.vjs-icon-placeholder {
+    display: block
+}
+
+.vjs-button>.vjs-svg-icon {
+    display: inline-block
+}
+
+.video-js .vjs-control:focus, .video-js .vjs-control:focus:before, .video-js .vjs-control:hover:before {
+    text-shadow: 0 0 1em #fff
+}
+
+.video-js :not(.vjs-visible-text)>.vjs-control-text {
+    border: 0;
+    clip: rect(0 0 0 0);
+    height: 1px;
+    overflow: hidden;
+    padding: 0;
+    position: absolute;
+    width: 1px
+}
+
+.video-js .vjs-custom-control-spacer {
+    display: none
+}
+
+.video-js .vjs-progress-control {
+    cursor: pointer;
+    flex: auto;
+    display: flex;
+    align-items: center;
+    min-width: 4em;
+    touch-action: none
+}
+
+.video-js .vjs-progress-control.disabled {
+    cursor: default
+}
+
+.vjs-live .vjs-progress-control {
+    display: none
+}
+
+.vjs-liveui .vjs-progress-control {
+    display: flex;
+    align-items: center
+}
+
+.video-js .vjs-progress-holder {
+    flex: auto;
+    transition: all .2s;
+    height: .3em
+}
+
+.video-js .vjs-progress-control .vjs-progress-holder {
+    margin: 0 10px
+}
+
+.video-js .vjs-progress-control:hover .vjs-progress-holder, .video-js.vjs-scrubbing.vjs-touch-enabled .vjs-progress-control .vjs-progress-holder {
+    font-size: 1.6666666667em
+}
+
+.video-js .vjs-progress-control:hover .vjs-progress-holder.disabled {
+    font-size: 1em
+}
+
+.video-js .vjs-progress-holder .vjs-load-progress, .video-js .vjs-progress-holder .vjs-load-progress div, .video-js .vjs-progress-holder .vjs-play-progress {
+    position: absolute;
+    display: block;
+    height: 100%;
+    margin: 0;
+    padding: 0;
+    width: 0
+}
+
+.video-js .vjs-play-progress {
+    background-color: #fff
+}
+
+.video-js .vjs-play-progress:before {
+    font-size: .9em;
+    position: absolute;
+    right: -.5em;
+    line-height: .35em;
+    z-index: 1
+}
+
+.vjs-svg-icons-enabled .vjs-play-progress:before {
+    content: none !important
+}
+
+.vjs-play-progress .vjs-svg-icon {
+    position: absolute;
+    top: -.35em;
+    right: -.4em;
+    width: .9em;
+    height: .9em;
+    pointer-events: none;
+    line-height: .15em;
+    z-index: 1
+}
+
+.video-js .vjs-load-progress {
+    background: rgba(114.9141509434, 132.7028301887, 159.3858490566, .5)
+}
+
+.video-js .vjs-load-progress div {
+    background: rgba(114.9141509434, 132.7028301887, 159.3858490566, .75)
+}
+
+.video-js .vjs-time-tooltip {
+    background-color: #fff;
+    background-color: rgba(255, 255, 255, .8);
+    border-radius: .3em;
+    color: #000;
+    float: right;
+    font-family: Arial, Helvetica, sans-serif;
+    font-size: 1em;
+    padding: 6px 8px 8px 8px;
+    pointer-events: none;
+    position: absolute;
+    top: -3.4em;
+    visibility: hidden;
+    z-index: 1
+}
+
+.video-js .vjs-progress-holder:focus .vjs-time-tooltip {
+    display: none
+}
+
+.video-js .vjs-progress-control:hover .vjs-progress-holder:focus .vjs-time-tooltip, .video-js .vjs-progress-control:hover .vjs-time-tooltip, .video-js.vjs-scrubbing.vjs-touch-enabled .vjs-progress-control .vjs-time-tooltip {
+    display: block;
+    font-size: .6em;
+    visibility: visible
+}
+
+.video-js .vjs-progress-control.disabled:hover .vjs-time-tooltip {
+    font-size: 1em
+}
+
+.video-js .vjs-progress-control .vjs-mouse-display {
+    display: none;
+    position: absolute;
+    width: 1px;
+    height: 100%;
+    background-color: #000;
+    z-index: 1
+}
+
+.video-js .vjs-progress-control:hover .vjs-mouse-display {
+    display: block
+}
+
+.video-js.vjs-scrubbing.vjs-touch-enabled .vjs-progress-control .vjs-mouse-display {
+    display: block
+}
+
+.video-js.vjs-touch-enabled:not(.vjs-scrubbing) .vjs-progress-control .vjs-mouse-display, .video-js.vjs-user-inactive .vjs-progress-control .vjs-mouse-display {
+    visibility: hidden;
+    opacity: 0;
+    transition: visibility 1s, opacity 1s
+}
+
+.vjs-mouse-display .vjs-time-tooltip {
+    color: #fff;
+    background-color: #000;
+    background-color: rgba(0, 0, 0, .8)
+}
+
+.video-js .vjs-slider {
+    position: relative;
+    cursor: pointer;
+    padding: 0;
+    margin: 0 .45em 0 .45em;
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    user-select: none;
+    background-color: rgb(114.9141509434, 132.7028301887, 159.3858490566);
+    background-color: rgba(114.9141509434, 132.7028301887, 159.3858490566, .5)
+}
+
+.video-js .vjs-slider.disabled {
+    cursor: default
+}
+
+.video-js .vjs-slider:focus {
+    text-shadow: 0 0 1em #fff;
+    box-shadow: 0 0 1em #fff
+}
+
+.video-js.vjs-spatial-navigation-enabled .vjs-slider:focus {
+    outline: .0625em solid #fff
+}
+
+.video-js .vjs-mute-control {
+    cursor: pointer;
+    flex: none
+}
+
+.video-js .vjs-volume-control {
+    cursor: pointer;
+    margin-right: 1em;
+    display: flex
+}
+
+.video-js .vjs-volume-control.vjs-volume-horizontal {
+    width: 5em
+}
+
+.video-js .vjs-volume-panel .vjs-volume-control {
+    visibility: visible;
+    opacity: 0;
+    width: 1px;
+    height: 1px;
+    margin-left: -1px
+}
+
+.video-js .vjs-volume-panel {
+    transition: width 1s
+}
+
+.video-js .vjs-volume-panel .vjs-volume-control.vjs-slider-active, .video-js .vjs-volume-panel .vjs-volume-control:active, .video-js .vjs-volume-panel.vjs-hover .vjs-mute-control~.vjs-volume-control, .video-js .vjs-volume-panel.vjs-hover .vjs-volume-control, .video-js .vjs-volume-panel:active .vjs-volume-control, .video-js .vjs-volume-panel:focus .vjs-volume-control {
+    visibility: visible;
+    opacity: 1;
+    position: relative;
+    transition: visibility .1s, opacity .1s, height .1s, width .1s, left 0s, top 0s
+}
+
+.video-js .vjs-volume-panel .vjs-volume-control.vjs-slider-active.vjs-volume-horizontal, .video-js .vjs-volume-panel .vjs-volume-control:active.vjs-volume-horizontal, .video-js .vjs-volume-panel.vjs-hover .vjs-mute-control~.vjs-volume-control.vjs-volume-horizontal, .video-js .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal, .video-js .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal, .video-js .vjs-volume-panel:focus .vjs-volume-control.vjs-volume-horizontal {
+    width: 5em;
+    height: 3em;
+    margin-right: 0
+}
+
+.video-js .vjs-volume-panel .vjs-volume-control.vjs-slider-active.vjs-volume-vertical, .video-js .vjs-volume-panel .vjs-volume-control:active.vjs-volume-vertical, .video-js .vjs-volume-panel.vjs-hover .vjs-mute-control~.vjs-volume-control.vjs-volume-vertical, .video-js .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-vertical, .video-js .vjs-volume-panel:active .vjs-volume-control.vjs-volume-vertical, .video-js .vjs-volume-panel:focus .vjs-volume-control.vjs-volume-vertical {
+    left: -3.5em;
+    transition: left 0s
+}
+
+.video-js .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-hover, .video-js .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-slider-active, .video-js .vjs-volume-panel.vjs-volume-panel-horizontal:active {
+    width: 10em;
+    transition: width .1s
+}
+
+.video-js .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-mute-toggle-only {
+    width: 4em
+}
+
+.video-js .vjs-volume-panel .vjs-volume-control.vjs-volume-vertical {
+    height: 8em;
+    width: 3em;
+    left: -3000em;
+    transition: visibility 1s, opacity 1s, height 1s 1s, width 1s 1s, left 1s 1s, top 1s 1s
+}
+
+.video-js .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
+    transition: visibility 1s, opacity 1s, height 1s 1s, width 1s, left 1s 1s, top 1s 1s
+}
+
+.video-js .vjs-volume-panel {
+    display: flex
+}
+
+.video-js .vjs-volume-bar {
+    margin: 1.35em .45em
+}
+
+.vjs-volume-bar.vjs-slider-horizontal {
+    width: 5em;
+    height: .3em
+}
+
+.vjs-volume-bar.vjs-slider-vertical {
+    width: .3em;
+    height: 5em;
+    margin: 1.35em auto
+}
+
+.video-js .vjs-volume-level {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    background-color: #fff
+}
+
+.video-js .vjs-volume-level:before {
+    position: absolute;
+    font-size: .9em;
+    z-index: 1
+}
+
+.vjs-slider-vertical .vjs-volume-level {
+    width: .3em
+}
+
+.vjs-slider-vertical .vjs-volume-level:before {
+    top: -.5em;
+    left: -.3em;
+    z-index: 1
+}
+
+.vjs-svg-icons-enabled .vjs-volume-level:before {
+    content: none
+}
+
+.vjs-volume-level .vjs-svg-icon {
+    position: absolute;
+    width: .9em;
+    height: .9em;
+    pointer-events: none;
+    z-index: 1
+}
+
+.vjs-slider-horizontal .vjs-volume-level {
+    height: .3em
+}
+
+.vjs-slider-horizontal .vjs-volume-level:before {
+    line-height: .35em;
+    right: -.5em
+}
+
+.vjs-slider-horizontal .vjs-volume-level .vjs-svg-icon {
+    right: -.3em;
+    transform: translateY(-50%)
+}
+
+.vjs-slider-vertical .vjs-volume-level .vjs-svg-icon {
+    top: -.55em;
+    transform: translateX(-50%)
+}
+
+.video-js .vjs-volume-panel.vjs-volume-panel-vertical {
+    width: 4em
+}
+
+.vjs-volume-bar.vjs-slider-vertical .vjs-volume-level {
+    height: 100%
+}
+
+.vjs-volume-bar.vjs-slider-horizontal .vjs-volume-level {
+    width: 100%
+}
+
+.video-js .vjs-volume-vertical {
+    width: 3em;
+    height: 8em;
+    bottom: 8em;
+    background-color: #2b333f;
+    background-color: rgba(43, 51, 63, .7)
+}
+
+.video-js .vjs-volume-horizontal .vjs-menu {
+    left: -2em
+}
+
+.video-js .vjs-volume-tooltip {
+    background-color: #fff;
+    background-color: rgba(255, 255, 255, .8);
+    border-radius: .3em;
+    color: #000;
+    float: right;
+    font-family: Arial, Helvetica, sans-serif;
+    font-size: 1em;
+    padding: 6px 8px 8px 8px;
+    pointer-events: none;
+    position: absolute;
+    top: -3.4em;
+    visibility: hidden;
+    z-index: 1
+}
+
+.video-js .vjs-volume-control:hover .vjs-progress-holder:focus .vjs-volume-tooltip, .video-js .vjs-volume-control:hover .vjs-volume-tooltip {
+    display: block;
+    font-size: 1em;
+    visibility: visible
+}
+
+.video-js .vjs-volume-vertical:hover .vjs-progress-holder:focus .vjs-volume-tooltip, .video-js .vjs-volume-vertical:hover .vjs-volume-tooltip {
+    left: 1em;
+    top: -12px
+}
+
+.video-js .vjs-volume-control.disabled:hover .vjs-volume-tooltip {
+    font-size: 1em
+}
+
+.video-js .vjs-volume-control .vjs-mouse-display {
+    display: none;
+    position: absolute;
+    width: 100%;
+    height: 1px;
+    background-color: #000;
+    z-index: 1
+}
+
+.video-js .vjs-volume-horizontal .vjs-mouse-display {
+    width: 1px;
+    height: 100%
+}
+
+.video-js .vjs-volume-control:hover .vjs-mouse-display {
+    display: block
+}
+
+.video-js.vjs-user-inactive .vjs-volume-control .vjs-mouse-display {
+    visibility: hidden;
+    opacity: 0;
+    transition: visibility 1s, opacity 1s
+}
+
+.vjs-mouse-display .vjs-volume-tooltip {
+    color: #fff;
+    background-color: #000;
+    background-color: rgba(0, 0, 0, .8)
+}
+
+.vjs-poster {
+    display: inline-block;
+    vertical-align: middle;
+    cursor: pointer;
+    margin: 0;
+    padding: 0;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    height: 100%
+}
+
+.vjs-has-started .vjs-poster, .vjs-using-native-controls .vjs-poster {
+    display: none
+}
+
+.vjs-audio.vjs-has-started .vjs-poster, .vjs-has-started.vjs-audio-poster-mode .vjs-poster, .vjs-pip-container.vjs-has-started .vjs-poster {
+    display: block
+}
+
+.vjs-poster img {
+    width: 100%;
+    height: 100%;
+    object-fit: contain
+}
+
+.video-js .vjs-live-control {
+    display: flex;
+    align-items: flex-start;
+    flex: auto;
+    font-size: 1em;
+    line-height: 3em
+}
+
+.video-js.vjs-liveui .vjs-live-control, .video-js:not(.vjs-live) .vjs-live-control {
+    display: none
+}
+
+.video-js .vjs-seek-to-live-control {
+    align-items: center;
+    cursor: pointer;
+    flex: none;
+    display: inline-flex;
+    height: 100%;
+    padding-left: .5em;
+    padding-right: .5em;
+    font-size: 1em;
+    line-height: 3em;
+    width: auto;
+    min-width: 4em
+}
+
+.video-js.vjs-live:not(.vjs-liveui) .vjs-seek-to-live-control, .video-js:not(.vjs-live) .vjs-seek-to-live-control {
+    display: none
+}
+
+.vjs-seek-to-live-control.vjs-control.vjs-at-live-edge {
+    cursor: auto
+}
+
+.vjs-seek-to-live-control .vjs-icon-placeholder {
+    margin-right: .5em;
+    color: #888
+}
+
+.vjs-svg-icons-enabled .vjs-seek-to-live-control {
+    line-height: 0
+}
+
+.vjs-seek-to-live-control .vjs-svg-icon {
+    width: 1em;
+    height: 1em;
+    pointer-events: none;
+    fill: #888
+}
+
+.vjs-seek-to-live-control.vjs-control.vjs-at-live-edge .vjs-icon-placeholder {
+    color: red
+}
+
+.vjs-seek-to-live-control.vjs-control.vjs-at-live-edge .vjs-svg-icon {
+    fill: red
+}
+
+.video-js .vjs-time-control {
+    flex: none;
+    font-size: 1em;
+    line-height: 3em;
+    min-width: 2em;
+    width: auto;
+    padding-left: 1em;
+    padding-right: 1em
+}
+
+.video-js .vjs-current-time, .video-js .vjs-duration, .vjs-live .vjs-time-control, .vjs-live .vjs-time-divider {
+    display: none
+}
+
+.vjs-time-divider {
+    display: none;
+    line-height: 3em
+}
+
+.vjs-normalise-time-controls:not(.vjs-live) .vjs-time-control {
+    display: flex
+}
+
+.video-js .vjs-play-control {
+    cursor: pointer
+}
+
+.video-js .vjs-play-control .vjs-icon-placeholder {
+    flex: none
+}
+
+.vjs-text-track-display {
+    position: absolute;
+    bottom: 3em;
+    left: 0;
+    right: 0;
+    top: 0;
+    pointer-events: none
+}
+
+.vjs-error .vjs-text-track-display {
+    display: none
+}
+
+.video-js.vjs-controls-disabled .vjs-text-track-display, .video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display {
+    bottom: 1em
+}
+
+.video-js .vjs-text-track {
+    font-size: 1.4em;
+    text-align: center;
+    margin-bottom: .1em
+}
+
+.vjs-subtitles {
+    color: #fff
+}
+
+.vjs-captions {
+    color: #fc6
+}
+
+.vjs-tt-cue {
+    display: block
+}
+
+video::-webkit-media-text-track-display {
+    transform: translateY(-3em)
+}
+
+.video-js.vjs-controls-disabled video::-webkit-media-text-track-display, .video-js.vjs-user-inactive.vjs-playing video::-webkit-media-text-track-display {
+    transform: translateY(-1.5em)
+}
+
+.video-js.vjs-force-center-align-cues .vjs-text-track-cue {
+    text-align: center !important;
+    width: 80% !important
+}
+
+@supports not (inset:10px) {
+    .video-js .vjs-text-track-display>div {
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0
+    }
+}
+
+.video-js .vjs-picture-in-picture-control {
+    cursor: pointer;
+    flex: none
+}
+
+.video-js.vjs-audio-only-mode .vjs-picture-in-picture-control, .vjs-pip-window .vjs-picture-in-picture-control {
+    display: none
+}
+
+.video-js .vjs-fullscreen-control {
+    cursor: pointer;
+    flex: none
+}
+
+.video-js.vjs-audio-only-mode .vjs-fullscreen-control, .vjs-pip-window .vjs-fullscreen-control {
+    display: none
+}
+
+.vjs-playback-rate .vjs-playback-rate-value, .vjs-playback-rate>.vjs-menu-button {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%
+}
+
+.vjs-playback-rate .vjs-playback-rate-value {
+    pointer-events: none;
+    font-size: 1.5em;
+    line-height: 2;
+    text-align: center
+}
+
+.vjs-playback-rate .vjs-menu {
+    width: 4em;
+    left: 0
+}
+
+.vjs-error .vjs-error-display .vjs-modal-dialog-content {
+    font-size: 1.4em;
+    text-align: center
+}
+
+.vjs-loading-spinner {
+    display: none;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    opacity: .85;
+    text-align: left;
+    border: .6em solid rgba(43, 51, 63, .7);
+    box-sizing: border-box;
+    background-clip: padding-box;
+    width: 5em;
+    height: 5em;
+    border-radius: 50%;
+    visibility: hidden
+}
+
+.vjs-seeking .vjs-loading-spinner, .vjs-waiting .vjs-loading-spinner {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    animation: vjs-spinner-show 0s linear .3s forwards
+}
+
+.vjs-error .vjs-loading-spinner {
+    display: none
+}
+
+.vjs-loading-spinner:after, .vjs-loading-spinner:before {
+    content: "";
+    position: absolute;
+    box-sizing: inherit;
+    width: inherit;
+    height: inherit;
+    border-radius: inherit;
+    opacity: 1;
+    border: inherit;
+    border-color: transparent;
+    border-top-color: #fff
+}
+
+.vjs-seeking .vjs-loading-spinner:after, .vjs-seeking .vjs-loading-spinner:before, .vjs-waiting .vjs-loading-spinner:after, .vjs-waiting .vjs-loading-spinner:before {
+    animation: vjs-spinner-spin 1.1s cubic-bezier(.6, .2, 0, .8) infinite, vjs-spinner-fade 1.1s linear infinite
+}
+
+.vjs-seeking .vjs-loading-spinner:before, .vjs-waiting .vjs-loading-spinner:before {
+    border-top-color: #fff
+}
+
+.vjs-seeking .vjs-loading-spinner:after, .vjs-waiting .vjs-loading-spinner:after {
+    border-top-color: #fff;
+    animation-delay: .44s
+}
+
+@keyframes vjs-spinner-show {
+    to {
+        visibility: visible
+    }
+}
+
+@keyframes vjs-spinner-spin {
+    100% {
+        transform: rotate(360deg)
+    }
+}
+
+@keyframes vjs-spinner-fade {
+    0% {
+        border-top-color: rgb(114.9141509434, 132.7028301887, 159.3858490566)
+    }
+
+    20% {
+        border-top-color: rgb(114.9141509434, 132.7028301887, 159.3858490566)
+    }
+
+    35% {
+        border-top-color: #fff
+    }
+
+    60% {
+        border-top-color: rgb(114.9141509434, 132.7028301887, 159.3858490566)
+    }
+
+    100% {
+        border-top-color: rgb(114.9141509434, 132.7028301887, 159.3858490566)
+    }
+}
+
+.video-js.vjs-audio-only-mode .vjs-captions-button {
+    display: none
+}
+
+.vjs-chapters-button .vjs-menu ul {
+    width: 24em
+}
+
+.video-js.vjs-audio-only-mode .vjs-descriptions-button {
+    display: none
+}
+
+.vjs-subs-caps-button+.vjs-menu .vjs-captions-menu-item .vjs-svg-icon {
+    width: 1.5em;
+    height: 1.5em
+}
+
+.video-js .vjs-subs-caps-button+.vjs-menu .vjs-captions-menu-item .vjs-menu-item-text .vjs-icon-placeholder {
+    vertical-align: middle;
+    display: inline-block;
+    margin-bottom: -.1em
+}
+
+.video-js .vjs-subs-caps-button+.vjs-menu .vjs-captions-menu-item .vjs-menu-item-text .vjs-icon-placeholder:before {
+    font-family: VideoJS;
+    content: "\f10c";
+    font-size: 1.5em;
+    line-height: inherit
+}
+
+.video-js.vjs-audio-only-mode .vjs-subs-caps-button {
+    display: none
+}
+
+.video-js .vjs-audio-button+.vjs-menu .vjs-descriptions-menu-item .vjs-menu-item-text .vjs-icon-placeholder, .video-js .vjs-audio-button+.vjs-menu .vjs-main-desc-menu-item .vjs-menu-item-text .vjs-icon-placeholder {
+    vertical-align: middle;
+    display: inline-block;
+    margin-bottom: -.1em
+}
+
+.video-js .vjs-audio-button+.vjs-menu .vjs-descriptions-menu-item .vjs-menu-item-text .vjs-icon-placeholder:before, .video-js .vjs-audio-button+.vjs-menu .vjs-main-desc-menu-item .vjs-menu-item-text .vjs-icon-placeholder:before {
+    font-family: VideoJS;
+    content: " \f12e";
+    font-size: 1.5em;
+    line-height: inherit
+}
+
+.video-js.vjs-layout-small .vjs-current-time, .video-js.vjs-layout-small .vjs-duration, .video-js.vjs-layout-small .vjs-playback-rate, .video-js.vjs-layout-small .vjs-remaining-time, .video-js.vjs-layout-small .vjs-time-divider, .video-js.vjs-layout-small .vjs-volume-control, .video-js.vjs-layout-tiny .vjs-current-time, .video-js.vjs-layout-tiny .vjs-duration, .video-js.vjs-layout-tiny .vjs-playback-rate, .video-js.vjs-layout-tiny .vjs-remaining-time, .video-js.vjs-layout-tiny .vjs-time-divider, .video-js.vjs-layout-tiny .vjs-volume-control, .video-js.vjs-layout-x-small .vjs-current-time, .video-js.vjs-layout-x-small .vjs-duration, .video-js.vjs-layout-x-small .vjs-playback-rate, .video-js.vjs-layout-x-small .vjs-remaining-time, .video-js.vjs-layout-x-small .vjs-time-divider, .video-js.vjs-layout-x-small .vjs-volume-control {
+    display: none
+}
+
+.video-js.vjs-layout-small .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-hover, .video-js.vjs-layout-small .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-slider-active, .video-js.vjs-layout-small .vjs-volume-panel.vjs-volume-panel-horizontal:active, .video-js.vjs-layout-small .vjs-volume-panel.vjs-volume-panel-horizontal:hover, .video-js.vjs-layout-tiny .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-hover, .video-js.vjs-layout-tiny .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-slider-active, .video-js.vjs-layout-tiny .vjs-volume-panel.vjs-volume-panel-horizontal:active, .video-js.vjs-layout-tiny .vjs-volume-panel.vjs-volume-panel-horizontal:hover, .video-js.vjs-layout-x-small .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-hover, .video-js.vjs-layout-x-small .vjs-volume-panel.vjs-volume-panel-horizontal.vjs-slider-active, .video-js.vjs-layout-x-small .vjs-volume-panel.vjs-volume-panel-horizontal:active, .video-js.vjs-layout-x-small .vjs-volume-panel.vjs-volume-panel-horizontal:hover {
+    width: auto;
+    width: initial
+}
+
+.video-js.vjs-layout-tiny .vjs-progress-control, .video-js.vjs-layout-x-small .vjs-progress-control {
+    display: none
+}
+
+.video-js.vjs-layout-x-small .vjs-custom-control-spacer {
+    flex: auto;
+    display: block
+}
+
+.vjs-modal-dialog.vjs-text-track-settings {
+    background-color: #2b333f;
+    background-color: rgba(43, 51, 63, .75);
+    color: #fff;
+    height: 70%
+}
+
+.vjs-spatial-navigation-enabled .vjs-modal-dialog.vjs-text-track-settings {
+    height: 80%
+}
+
+.vjs-error .vjs-text-track-settings {
+    display: none
+}
+
+.vjs-text-track-settings .vjs-modal-dialog-content {
+    display: table
+}
+
+.vjs-text-track-settings .vjs-track-settings-colors, .vjs-text-track-settings .vjs-track-settings-controls, .vjs-text-track-settings .vjs-track-settings-font {
+    display: table-cell
+}
+
+.vjs-text-track-settings .vjs-track-settings-controls {
+    text-align: right;
+    vertical-align: bottom
+}
+
+@supports (display:grid) {
+    .vjs-text-track-settings .vjs-modal-dialog-content {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        grid-template-rows: 1fr;
+        padding: 20px 24px 0 24px
+    }
+
+    .vjs-track-settings-controls .vjs-default-button {
+        margin-bottom: 20px
+    }
+
+    .vjs-text-track-settings .vjs-track-settings-controls {
+        grid-column: 1/-1
+    }
+
+    .vjs-layout-small .vjs-text-track-settings .vjs-modal-dialog-content, .vjs-layout-tiny .vjs-text-track-settings .vjs-modal-dialog-content, .vjs-layout-x-small .vjs-text-track-settings .vjs-modal-dialog-content {
+        grid-template-columns: 1fr
+    }
+}
+
+.vjs-text-track-settings select {
+    font-size: inherit
+}
+
+.vjs-track-setting>select {
+    margin-right: 1em;
+    margin-bottom: .5em
+}
+
+.vjs-text-track-settings fieldset {
+    margin: 10px;
+    border: none
+}
+
+.vjs-text-track-settings fieldset span {
+    display: inline-block;
+    padding: 0 .6em .8em
+}
+
+.vjs-text-track-settings fieldset span>select {
+    max-width: 7.3em
+}
+
+.vjs-text-track-settings legend {
+    color: #fff;
+    font-weight: 700;
+    font-size: 1.2em
+}
+
+.vjs-text-track-settings .vjs-label {
+    margin: 0 .5em .5em 0
+}
+
+.vjs-track-settings-controls button:active, .vjs-track-settings-controls button:focus {
+    outline-style: solid;
+    outline-width: medium;
+    background-image: linear-gradient(0deg, #fff 88%, rgb(114.9141509434, 132.7028301887, 159.3858490566) 100%)
+}
+
+.vjs-track-settings-controls button:hover {
+    color: rgba(43, 51, 63, .75)
+}
+
+.vjs-track-settings-controls button {
+    background-color: #fff;
+    background-image: linear-gradient(-180deg, #fff 88%, rgb(114.9141509434, 132.7028301887, 159.3858490566) 100%);
+    color: #2b333f;
+    cursor: pointer;
+    border-radius: 2px
+}
+
+.vjs-track-settings-controls .vjs-default-button {
+    margin-right: 1em
+}
+
+.vjs-title-bar {
+    background: rgba(0, 0, 0, .9);
+    background: linear-gradient(180deg, rgba(0, 0, 0, .9) 0, rgba(0, 0, 0, .7) 60%, rgba(0, 0, 0, 0) 100%);
+    font-size: 1.2em;
+    line-height: 1.5;
+    transition: opacity .1s;
+    padding: .666em 1.333em 4em;
+    pointer-events: none;
+    position: absolute;
+    top: 0;
+    width: 100%
+}
+
+.vjs-error .vjs-title-bar {
+    display: none
+}
+
+.vjs-title-bar-description, .vjs-title-bar-title {
+    margin: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap
+}
+
+.vjs-title-bar-title {
+    font-weight: 700;
+    margin-bottom: .333em
+}
+
+.vjs-playing.vjs-user-inactive .vjs-title-bar {
+    opacity: 0;
+    transition: opacity 1s
+}
+
+.video-js .vjs-skip-forward-5 {
+    cursor: pointer
+}
+
+.video-js .vjs-skip-forward-10 {
+    cursor: pointer
+}
+
+.video-js .vjs-skip-forward-30 {
+    cursor: pointer
+}
+
+.video-js .vjs-skip-backward-5 {
+    cursor: pointer
+}
+
+.video-js .vjs-skip-backward-10 {
+    cursor: pointer
+}
+
+.video-js .vjs-skip-backward-30 {
+    cursor: pointer
+}
+
+.video-js .vjs-transient-button {
+    position: absolute;
+    height: 3em;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-color: rgba(50, 50, 50, .5);
+    cursor: pointer;
+    opacity: 1;
+    transition: opacity 1s
+}
+
+.video-js:not(.vjs-has-started) .vjs-transient-button {
+    display: none
+}
+
+.video-js.not-hover .vjs-transient-button:not(.force-display), .video-js.vjs-user-inactive .vjs-transient-button:not(.force-display) {
+    opacity: 0
+}
+
+.video-js .vjs-transient-button span {
+    padding: 0 .5em
+}
+
+.video-js .vjs-transient-button.vjs-left {
+    left: 1em
+}
+
+.video-js .vjs-transient-button.vjs-right {
+    right: 1em
+}
+
+.video-js .vjs-transient-button.vjs-top {
+    top: 1em
+}
+
+.video-js .vjs-transient-button.vjs-near-top {
+    top: 4em
+}
+
+.video-js .vjs-transient-button.vjs-bottom {
+    bottom: 4em
+}
+
+.video-js .vjs-transient-button:hover {
+    background-color: rgba(50, 50, 50, .9)
+}
+
+@media print {
+    .video-js>:not(.vjs-tech):not(.vjs-poster) {
+        visibility: hidden
+    }
+}
+
+.vjs-resize-manager {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    border: none;
+    z-index: -1000
+}
+
+.js-focus-visible .video-js :focus:not(.focus-visible) {
+    outline: 0
+}
+
+.video-js :focus:not(:focus-visible) {
+    outline: 0
+}
+.och__player {
+    width: 100%;
+    height: auto;
+    aspect-ratio: 16 / 9;
+  }
+  .video-js .vjs-big-play-button,
+  .video-js:hover .vjs-big-play-button {
+    font-size: 45px;
+    border: none;
+    background: transparent;
+    transition: all 0.2s ease;
+  }
+      </style>
+    `}};f.styles=[R],c([G({type:Array})],f.prototype,"sources",2),c([Q("#player")],f.prototype,"$player",2),f=c([_("och-player")],f);var w=class{formatFileSize(e){let t=["B","KB","MB","GB"];if(e===0)return"0 B";let o=Math.floor(Math.log(e)/Math.log(1024));return Math.round(e/1024**o*100)/100+" "+t[o]}formatDuration(e){let t=Math.floor(e/60),o=Math.floor(e%60);return`${t}:${o.toString().padStart(2,"0")}`}getMultimediaSubtype(e){let t=e.format||"";return t.startsWith("video/")?"video":t.startsWith("image/")?"image":t.includes("presentation")||t.includes("pdf")||t.includes("powerpoint")||t.includes("slides")||t.includes("application/vnd.ms-powerpoint")||t.includes("application/vnd.openxmlformats-officedocument.presentationml")||e.slides&&e.slides.length>0?"presentation":e.duration||e.vodUrl?"video":"image"}renderThumbnail(e,t,o,s,l){return!t.showThumbnail||e.type==="faq"?i``:i`
+      <div class="ol-asset__thumbnail">
+        ${this.renderThumbnailContent(e)}
+        ${this.renderMetadata(e,t)}
+        ${this.renderThumbnailOverlay(e)}
+        ${this.renderHoverOverlay(e,o,l,s)}
+      </div>
+    `}renderThumbnailContent(e){switch(e.type){case"multimedia":{let t=e;switch(this.getMultimediaSubtype(t)){case"video":return this.renderVideoThumbnail(t);case"presentation":return this.renderPresentationThumbnail(t);case"image":default:return i`
+              <img
+                src="${y(t.thumbnail||t.url)}"
+                alt="${t.name}"
+                class="ol-asset__image"
+              />
+            `}}case"file":{let t=e;switch(this.getMultimediaSubtype(t)){case"video":return this.renderVideoThumbnail(t);case"presentation":return this.renderPresentationThumbnail(t);case"image":default:return i`
+              <img
+                src="${y(t.thumbnail||t.url)}"
+                alt="${t.name}"
+                class="ol-asset__image"
+              />
+            `}}default:return i`
+          <img
+            src="${y(e.thumbnail||e.url)}"
+            alt="${e.name}"
+            class="ol-asset__image"
+          />
+        `}}renderVideoThumbnail(e){return i`
+      <och-player
+        class="ol-asset__video-player"
+        .sources=${[{src:e.url||"",type:e.format||"video/mp4"}]}
+      ></och-player>
+    `}renderPresentationThumbnail(e){return i`
+      <div class="ol-asset__presentation-preview">
+        ${m(e.slides&&e.slides.length>0,()=>i`
+            <img
+              src="${e.slides[0]}"
+              alt="Presentation preview"
+              class="ol-asset__presentation-image"
+            />
+          `,()=>i`
+            <div class="ol-asset__presentation-fallback">
+              <div class="ol-asset__presentation-icon">
+                <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
+                  <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path>
+                  <polyline points="14 2 14 8 20 8"></polyline>
+                  <line x1="16" y1="13" x2="8" y2="13"></line>
+                  <line x1="16" y1="17" x2="8" y2="17"></line>
+                  <polyline points="10 9 9 9 8 9"></polyline>
+                </svg>
+              </div>
+              <div class="ol-asset__presentation-name">${e.name}</div>
+            </div>
+          `)}
+      </div>
+    `}renderThumbnailOverlay(e){let t=[];if(e.type==="multimedia"||e.type==="file"){let o=e;this.getMultimediaSubtype(o)==="video"&&o.duration&&t.push(i`
+          <div class="ol-asset__duration">${this.formatDuration(o.duration)}</div>
+        `)}return i`${t}`}renderContent(e,t){let o=(e.type==="multimedia"||e.type==="file")&&!t.showName&&!t.showDescription&&!t.showTags;return i`
+      <div class=${W({"ol-asset__content":!0,"ol-asset__content--assets":!!o})}>
+        ${this.renderName(e,t)}
+        ${this.renderDescription(e,t)}
+        ${this.renderPrice(e)}
+        ${this.renderTags(e,t)}
+      </div>
+    `}renderName(e,t){return e.type==="faq"?i``:e.type==="product"?i`
+        <div class="ol-asset__name">${e.name}</div>
+      `:(e.type==="multimedia"||e.type==="file")&&this.getMultimediaSubtype(e)==="presentation"&&(!e.slides||e.slides.length===0)?i`
+        <div class="ol-asset__name">${e.name}</div>
+      `:t.showName?i`
+      <div class="ol-asset__name">${e.name}</div>
+    `:i``}renderDescription(e,t){if(e.type==="faq"){let s=e;return s.answer?i`
+        <div class="ol-asset__description ol-asset__answer">${s.answer}</div>
+      `:i``}return e.description?e.type==="product"?i`
+        <div class="ol-asset__description">${C(e.description)}</div>
+      `:t.showDescription?i`
+      <div class="ol-asset__description">${e.description}</div>
+    `:i``:i``}renderPrice(e){if(e.type!=="product")return i``;let t=e;return t.price?i`
+      <div class="ol-asset__price">
+        ${t.currency} ${t.price}
+      </div>
+    `:i``}renderMetadata(e,t){if(!t.showMetadata)return i``;let o=[];if(t.showSize&&e.type!=="faq"&&"size"in e&&e.size&&typeof e.size=="number"&&o.push(i`
+        <div class="ol-asset__meta-item">
+          <span>${this.formatFileSize(e.size)}</span>
+        </div>
+      `),t.showDuration&&(e.type==="multimedia"||e.type==="file")){let s=e;this.getMultimediaSubtype(s)==="video"&&s.duration&&o.push(i`
+          <div class="ol-asset__meta-item">
+            <span>⏱️</span>
+            <span>${this.formatDuration(s.duration)}</span>
+          </div>
+        `)}return o.length===0?i``:i`
+      <div class="ol-asset__metadata">
+        ${o}
+      </div>
+    `}renderTags(e,t){if(!t.showTags)return i``;let o=[];switch(e.type){case"product":o=e.tags||[];break;case"multimedia":case"file":o=e.labels||[];break}return o.length===0?i``:i`
+      <div class="ol-asset__tags">
+        ${o.slice(0,3).map(s=>i`
+            <span class="ol-asset__tag">${s}</span>
+          `)}
+      </div>
+    `}renderLoading(){return i`
+      <div class="ol-asset__loading">
+        <div class="ol-asset__spinner"></div>
+        <span>Loading...</span>
+      </div>
+    `}renderError(e){return i`
+      <div class="ol-asset__error">
+        <span class="ol-asset__error-icon">⚠️</span>
+        <span>${e}</span>
+      </div>
+    `}renderModal(e,t,o){return t?i`
+      <div class="ol-asset__modal-overlay" @click=${o}>
+        <div class="ol-asset__modal" @click=${s=>s.stopPropagation()}>
+          <ol-button class="ol-asset__modal-close" @click=${o}>
+            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+              <line x1="18" y1="6" x2="6" y2="18"></line>
+              <line x1="6" y1="6" x2="18" y2="18"></line>
+            </svg>
+          </ol-button>
+          <div class="ol-asset__modal-content">
+            ${this.renderModalContent(e)}
+          </div>
+        </div>
+      </div>
+    `:i``}renderModalContent(e){switch(e.type){case"multimedia":{let t=e,o=this.getMultimediaSubtype(t);return o==="image"?i`
+            <img
+              src="${y(t.url)}"
+              alt="${t.name}"
+              class="ol-asset__modal-image"
+            />
+            <div class="ol-asset__modal-info">
+              <h3 class="ol-asset__modal-title">${t.name}</h3>
+              ${t.description?i`<p class="ol-asset__modal-description">${t.description}</p>`:i``}
+            </div>
+          `:i`
+          <div class="ol-asset__modal-info">
+            <h3 class="ol-asset__modal-title">${t.name}</h3>
+            ${t.description?i`<p class="ol-asset__modal-description">${t.description}</p>`:i``}
+            <p class="ol-asset__modal-type">Type: ${o}</p>
+          </div>
+        `}case"file":{let t=e,o=this.getMultimediaSubtype(t);return o==="image"?i`
+            <img
+              src="${y(t.url)}"
+              alt="${t.name}"
+              class="ol-asset__modal-image"
+            />
+            <div class="ol-asset__modal-info">
+              <h3 class="ol-asset__modal-title">${t.name}</h3>
+              ${t.description?i`<p class="ol-asset__modal-description">${t.description}</p>`:i``}
+            </div>
+          `:i`
+          <div class="ol-asset__modal-info">
+            <h3 class="ol-asset__modal-title">${t.name}</h3>
+            ${t.description?i`<p class="ol-asset__modal-description">${t.description}</p>`:i``}
+            <p class="ol-asset__modal-type">Type: ${o}</p>
+          </div>
+        `}case"faq":return i`
+          <div class="ol-asset__modal-faq">
+            <div class="ol-asset__modal-answer">${e.answer||e.description}</div>
+          </div>
+        `;default:return i`
+          <div class="ol-asset__modal-info">
+            <h3 class="ol-asset__modal-title">${e.name}</h3>
+            ${e.description?i`<p class="ol-asset__modal-description">${e.description}</p>`:i``}
+          </div>
+        `}}renderHoverOverlay(e,t,o,s){let l=e.type==="multimedia"&&this.getMultimediaSubtype(e)==="video",a=(e.type==="multimedia"||e.type==="file")&&this.getMultimediaSubtype(e)==="presentation"&&(!e.slides||e.slides.length===0);return l?i`
+        <div class="ol-asset__video-controls">
+          ${m(o,()=>i`
+              <ol-button
+                class="ol-asset__video-btn ol-asset__video-btn--maximize"
+                @click=${d=>{d.stopPropagation(),o(e)}}
+                title="Maximize ${e.name}"
+              >
+                <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                  <path d="M8 3H5a2 2 0 0 0-2 2v3m18 0V5a2 2 0 0 0-2-2h-3m0 18h3a2 2 0 0 0 2-2v-3M3 16v3a2 2 0 0 0 2 2h3"></path>
+                </svg>
+              </ol-button>
+            `)}
+          ${m(t,()=>i`
+              <ol-button
+                class="ol-asset__video-btn ol-asset__video-btn--download ${s?"ol-asset__video-btn--downloading":""}"
+                @click=${d=>{d.stopPropagation(),t(e)}}
+                title="Download ${e.name}"
+                ?disabled=${s}
+              >
+                ${m(s,()=>i`
+                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="ol-asset__download-spinner">
+                      <circle cx="12" cy="12" r="10"></circle>
+                      <path d="M12 2a10 10 0 0 1 10 10"></path>
+                    </svg>
+                  `,()=>i`
+                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                      <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
+                      <polyline points="7,10 12,15 17,10"></polyline>
+                      <line x1="12" y1="15" x2="12" y2="3"></line>
+                    </svg>
+                  `)}
+              </ol-button>
+            `)}
+        </div>
+      `:i`
+      <div class="ol-asset__hover-overlay">
+        <div class="ol-asset__hover-buttons">
+          ${m(e.type==="product",()=>i`
+              <ol-button
+                class="ol-asset__hover-btn ol-asset__hover-btn--external"
+                @click=${d=>{d.stopPropagation(),this.openProductInNewWindow(e)}}
+                title="Open ${e.name} in new window"
+              >
+                <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                  <path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path>
+                  <polyline points="15,3 21,3 21,9"></polyline>
+                  <line x1="10" y1="14" x2="21" y2="3"></line>
+                </svg>
+              </ol-button>
+            `,()=>i`
+              ${m(o&&!a,()=>i`
+                  <ol-button
+                    class="ol-asset__hover-btn ol-asset__hover-btn--maximize"
+                    @click=${d=>{d.stopPropagation(),o(e)}}
+                    title="Maximize ${e.name}"
+                  >
+                    <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                      <path d="M8 3H5a2 2 0 0 0-2 2v3m18 0V5a2 2 0 0 0-2-2h-3m0 18h3a2 2 0 0 0 2-2v-3M3 16v3a2 2 0 0 0 2 2h3"></path>
+                    </svg>
+                  </ol-button>
+                `)}
+              ${m(t&&["multimedia","file"].includes(e.type),()=>i`
+                  <ol-button
+                    class="ol-asset__hover-btn ol-asset__hover-btn--download ${s?"ol-asset__hover-btn--downloading":""}"
+                    @click=${d=>{d.stopPropagation(),t(e)}}
+                    title="Download ${e.name}"
+                    ?disabled=${s}
+                  >
+                    ${m(s,()=>i`
+                        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" class="ol-asset__download-spinner">
+                          <circle cx="12" cy="12" r="10"></circle>
+                          <path d="M12 2a10 10 0 0 1 10 10"></path>
+                        </svg>
+                      `,()=>i`
+                        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                          <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
+                          <polyline points="7,10 12,15 17,10"></polyline>
+                          <line x1="12" y1="15" x2="12" y2="3"></line>
+                        </svg>
+                      `)}
+                  </ol-button>
+                `)}
+            `)}
+        </div>
+      </div>
+    `}openProductInNewWindow(e){e.url&&window.open(e.url,"_blank","noopener,noreferrer")}};import{css as Z}from"lit";var I=Z`
+  :host {
+    display: block;
+    --asset-border-radius: 8px;
+    --asset-padding: 12px;
+    --asset-gap: 8px;
+    --asset-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+    --asset-shadow-hover: 0 4px 16px rgba(0, 0, 0, 0.15);
+    --asset-transition: all 0.2s ease-in-out;
+  }
+
+  .ol-asset {
+    display: flex;
+    flex-direction: column;
+    border-radius: var(--asset-border-radius);
+    background: var(--ol-color-surface, #ffffff);
+    transition: var(--asset-transition);
+    overflow: hidden;
+    position: relative;
+    cursor: default;
+  }
+
+  
+
+  .ol-asset--loading {
+    opacity: 0.7;
+    pointer-events: none;
+  }
+
+  .ol-asset--error {
+    border-color: var(--ol-color-error, #ef4444);
+    background: var(--ol-color-error-surface, #fef2f2);
+  }
+
+  .ol-asset--compact {
+    flex-direction: row;
+    align-items: center;
+  }
+
+  .ol-asset--minimal {
+    padding: var(--asset-padding);
+    border: none;
+    box-shadow: none;
+    background: transparent;
+  }
+
+  .ol-asset--minimal:hover {
+    transform: none;
+    box-shadow: none;
+  }
+
+  /* Sizes */
+  .ol-asset--small {
+    --asset-padding: 8px;
+    --asset-gap: 6px;
+  }
+
+  .ol-asset--medium {
+    --asset-padding: 12px;
+    --asset-gap: 8px;
+  }
+
+  .ol-asset--large {
+    --asset-padding: 16px;
+    --asset-gap: 12px;
+  }
+
+  /* Thumbnail */
+  .ol-asset__thumbnail {
+    position: relative;
+    width: 100%;
+    aspect-ratio: 16/9;
+    overflow: hidden;
+    background: var(--ol-color-surface-secondary, #f9fafb);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .ol-asset--compact .ol-asset__thumbnail {
+    width: 60px;
+    height: 60px;
+    aspect-ratio: 1;
+    flex-shrink: 0;
+  }
+
+  .ol-asset--minimal .ol-asset__thumbnail {
+    display: none;
+  }
+
+  .ol-asset__image {
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+    transition: var(--asset-transition);
+  }
+
+  .ol-asset__video-player {
+    width: 100%;
+    height: 100%;
+    min-height: 120px;
+    aspect-ratio: 16/9;
+  }
+
+  .ol-asset__duration {
+    position: absolute;
+    bottom: 8px;
+    right: 8px;
+    background: rgba(0, 0, 0, 0.8);
+    color: white;
+    padding: 2px 6px;
+    border-radius: 4px;
+    font-size: 12px;
+    font-weight: 500;
+  }
+
+  .ol-asset__format-badge {
+    position: absolute;
+    top: 8px;
+    left: 8px;
+    background: rgba(0, 0, 0, 0.8);
+    color: white;
+    padding: 2px 6px;
+    border-radius: 4px;
+    font-size: 10px;
+    font-weight: 500;
+    text-transform: uppercase;
+  }
+
+
+
+  /* Content */
+  .ol-asset__content {
+    padding: var(--asset-padding);
+    display: flex;
+    flex-direction: column;
+    gap: var(--asset-gap);
+    flex: 1;
+  }
+
+  .ol-asset__content--assets {
+    display: none;
+  }
+
+  .ol-asset--compact .ol-asset__content {
+    padding-left: var(--asset-padding);
+  }
+
+  .ol-asset--minimal .ol-asset__content {
+    padding: 0;
+  }
+
+  .ol-asset__name {
+    font-size: 14px;
+    font-weight: 600;
+    color: var(--ol-color-text-primary, #111827);
+    line-height: 1.4;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+  }
+
+  .ol-asset--large .ol-asset__name {
+    font-size: 16px;
+  }
+
+  .ol-asset--small .ol-asset__name {
+    font-size: 12px;
+  }
+
+  .ol-asset__description {
+    font-size: 12px;
+    color: var(--ol-color-text-secondary, #6b7280);
+    line-height: 1.4;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+  }
+
+  .ol-asset--large .ol-asset__description {
+    font-size: 14px;
+  }
+
+  .ol-asset--small .ol-asset__description {
+    font-size: 11px;
+  }
+
+  .ol-asset__price {
+    font-size: 14px;
+    font-weight: 600;
+    color: var(--ol-color-primary, #3b82f6);
+  }
+
+  .ol-asset--large .ol-asset__price {
+    font-size: 16px;
+  }
+
+  .ol-asset--small .ol-asset__price {
+    font-size: 12px;
+  }
+
+  /* Metadata */
+  .ol-asset__metadata {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+    font-size: 11px;
+    color: var(--ol-color-text-tertiary, #9ca3af);
+    position: absolute;
+    bottom: 8px;
+    left: 8px;
+  }
+
+  .ol-asset--large .ol-asset__metadata {
+    font-size: 12px;
+  }
+
+  .ol-asset--small .ol-asset__metadata {
+    font-size: 10px;
+  }
+
+  .ol-asset__meta-item {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    color: #fff;
+    border-radius:99px;
+    padding: 0 var(--ol-spacing-x-small);
+    background-color: var(--ol-color-surface-secondary, rgba(0, 0, 0, 0.8));
+  }
+
+  /* Tags */
+  .ol-asset__tags {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 4px;
+  }
+
+  .ol-asset__tag {
+    background: var(--ol-color-surface-secondary, #f3f4f6);
+    color: var(--ol-color-text-secondary, #6b7280);
+    padding: 2px 6px;
+    border-radius: 4px;
+    font-size: 10px;
+    font-weight: 500;
+  }
+
+  .ol-asset--large .ol-asset__tag {
+    font-size: 11px;
+    padding: 3px 8px;
+  }
+
+  .ol-asset--small .ol-asset__tag {
+    font-size: 9px;
+    padding: 1px 4px;
+  }
+
+  /* FAQ specific styles */
+  .ol-asset--faq {
+    background: transparent;
+    border: none;
+    box-shadow: none;
+    padding: 0;
+    margin: 0;
+    cursor: pointer;
+  }
+
+  .ol-asset--faq:hover {
+    transform: none;
+    box-shadow: none;
+  }
+
+  .ol-asset--faq .ol-asset__thumbnail {
+    display: none;
+  }
+
+  .ol-asset--faq .ol-asset__content {
+    gap: 0;
+    border-radius: 18px 18px 4px 18px;
+    position: relative;
+    margin-left: auto;
+  }
+
+  .ol-asset--faq .ol-asset__content::before {
+    content: "";
+    position: absolute;
+    bottom: 0;
+    right: -8px;
+    width: 0;
+    height: 0;
+    border-left: 8px solid var(--ol-color-primary, #3b82f6);
+    border-top: 8px solid transparent;
+    border-bottom: 8px solid transparent;
+  }
+
+  .ol-asset--faq .ol-asset__name {
+    display: none;
+  }
+
+  .ol-asset--faq .ol-asset__description,
+  .ol-asset--faq .ol-asset__answer {
+    font-size: 14px;
+    line-height: 1.5;
+    padding: var(--ol-spacing-small);
+    display: block;
+    margin: 0;
+    -webkit-line-clamp: none;
+    -webkit-box-orient: initial;
+    overflow: visible;
+    white-space: pre-wrap;
+    word-wrap: break-word;
+  }
+
+  .ol-asset--large .ol-asset--faq .ol-asset__description,
+  .ol-asset--large .ol-asset--faq .ol-asset__answer {
+    font-size: 15px;
+  }
+
+  .ol-asset--small .ol-asset--faq .ol-asset__description,
+  .ol-asset--small .ol-asset--faq .ol-asset__answer {
+    font-size: 13px;
+  }
+
+  .ol-asset--faq .ol-asset__metadata {
+    display: none;
+  }
+
+  .ol-asset--faq .ol-asset__meta-item {
+    display: none;
+  }
+
+  /* Presentation specific styles */
+  .ol-asset__presentation-preview {
+    position: relative;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .ol-asset__presentation-image {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+
+  .ol-asset__presentation-fallback {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    width: calc(100% - calc(2 * var(--ol-spacing-medium, 16px)));
+    padding: var(--ol-spacing-medium, 16px);
+    height: calc(100% - calc(2 * var(--ol-spacing-medium, 16px) + 4px));
+    gap: var(--ol-spacing-medium, 16px);
+    background: linear-gradient(135deg, var(--ol-color-neutral-50, #f9fafb) 0%, var(--ol-color-neutral-100, #f3f4f6) 100%);
+    border: 2px dashed var(--ol-color-neutral-300, #d1d5db);
+    border-radius: var(--asset-border-radius, 8px);
+    transition: all 0.2s ease;
+  }
+
+  .ol-asset:hover .ol-asset__presentation-fallback {
+    background: linear-gradient(135deg, var(--ol-color-neutral-100, #f3f4f6) 0%, var(--ol-color-neutral-200, #e5e7eb) 100%);
+    border-color: var(--ol-color-neutral-400, #9ca3af);
+  }
+
+  .ol-asset__presentation-icon {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 48px;
+    height: 48px;
+    color: var(--ol-color-text-secondary, #6b7280);
+    opacity: 0.7;
+    transition: all 0.2s ease;
+    flex-shrink: 0;
+  }
+
+  .ol-asset:hover .ol-asset__presentation-icon {
+    opacity: 1;
+    transform: scale(1.05);
+    color: var(--ol-color-text-primary, #111827);
+  }
+
+  .ol-asset__presentation-icon svg {
+    width: 100%;
+    height: 100%;
+  }
+
+  .ol-asset__presentation-name {
+    font-size: var(--ol-font-size-small, 0.875rem);
+    font-weight: 500;
+    color: var(--ol-color-text-secondary, #6b7280);
+    text-align: center;
+    line-height: 1.4;
+    max-width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    word-break: break-word;
+    transition: color 0.2s ease;
+  }
+
+  .ol-asset:hover .ol-asset__presentation-name {
+    color: var(--ol-color-text-primary, #111827);
+  }
+
+  .ol-asset--small .ol-asset__presentation-icon {
+    width: 40px;
+    height: 40px;
+  }
+
+  .ol-asset--small .ol-asset__presentation-name {
+    font-size: var(--ol-font-size-x-small, 0.75rem);
+  }
+
+  .ol-asset--large .ol-asset__presentation-icon {
+    width: 80px;
+    height: 80px;
+  }
+
+  .ol-asset--large .ol-asset__presentation-name {
+    font-size: var(--ol-font-size-medium, 1rem);
+  }
+
+  /* Loading state */
+  .ol-asset__loading {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 20px;
+    color: var(--ol-color-text-secondary, #6b7280);
+  }
+
+  .ol-asset__spinner {
+    width: 20px;
+    height: 20px;
+    border: 2px solid var(--ol-color-border, #e5e7eb);
+    border-top: 2px solid var(--ol-color-primary, #3b82f6);
+    border-radius: 50%;
+    animation: spin 1s linear infinite;
+    margin-right: 8px;
+  }
+
+  @keyframes spin {
+    0% { transform: rotate(0deg); }
+    100% { transform: rotate(360deg); }
+  }
+
+  /* Error state */
+  .ol-asset__error {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 20px;
+    color: var(--ol-color-error, #ef4444);
+    text-align: center;
+  }
+
+  .ol-asset__error-icon {
+    margin-right: 8px;
+    font-size: 16px;
+  }
+
+  /* Responsive */
+  @media (max-width: 768px) {
+    .ol-asset--compact {
+      flex-direction: column;
+    }
+
+    .ol-asset--compact .ol-asset__thumbnail {
+      width: 100%;
+      height: auto;
+      aspect-ratio: 16/9;
+    }
+
+    .ol-asset--compact .ol-asset__content {
+      padding-left: var(--asset-padding);
+    }
+  }
+
+  /* Download button */
+  .ol-asset__download-btn {
+    position: absolute;
+    top: 8px;
+    right: 8px;
+    width: 32px;
+    height: 32px;
+    border: none;
+    border-radius: 50%;
+    background: rgba(0, 0, 0, 0.7);
+    color: white;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    transition: all 0.2s ease;
+    z-index: 2;
+  }
+
+  .ol-asset__download-btn:hover {
+    background: rgba(0, 0, 0, 0.9);
+    transform: scale(1.1);
+  }
+
+  .ol-asset__download-btn svg {
+    width: 16px;
+    height: 16px;
+  }
+
+  .ol-asset__download-btn--downloading {
+    opacity: 0.7;
+    cursor: not-allowed;
+  }
+
+  .ol-asset__download-spinner {
+    animation: spin 1s linear infinite;
+  }
+
+  @keyframes spin {
+    from {
+      transform: rotate(0deg);
+    }
+    to {
+      transform: rotate(360deg);
+    }
+  }
+
+  /* Hover overlay */
+  .ol-asset__hover-overlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.3);
+    backdrop-filter: blur(4px);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    opacity: 0;
+    visibility: hidden;
+    transition: all 0.3s ease;
+    border-radius: var(--asset-border-radius);
+    z-index: 10;
+  }
+
+  .ol-asset:hover .ol-asset__hover-overlay {
+    opacity: 1;
+    visibility: visible;
+  }
+
+  .ol-asset__hover-buttons {
+    display: flex;
+    gap: 12px;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .ol-asset__hover-btn {
+    width: 48px;
+    height: 48px;
+    border: none;
+    border-radius: 50%;
+    background: rgba(255, 255, 255, 0.9);
+    color: var(--ol-color-neutral-700, #374151);
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    transition: all 0.2s ease;
+    backdrop-filter: blur(8px);
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+  }
+
+  .ol-asset__hover-btn:hover {
+    background: rgba(255, 255, 255, 1);
+    transform: scale(1.1);
+    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
+  }
+
+  .ol-asset__hover-btn:active {
+    transform: scale(0.95);
+  }
+
+  .ol-asset__hover-btn--maximize,
+  .ol-asset__hover-btn--download,
+  .ol-asset__hover-btn--external {
+    background: rgba(255, 255, 255, 0.9);
+    color: var(--ol-color-neutral-700, #374151);
+  }
+
+  .ol-asset__hover-btn--maximize:hover,
+  .ol-asset__hover-btn--download:hover,
+  .ol-asset__hover-btn--external:hover {
+    background: rgba(255, 255, 255, 1);
+  }
+
+  .ol-asset__hover-btn--downloading {
+    opacity: 0.7;
+    cursor: not-allowed;
+    transform: none !important;
+  }
+
+  .ol-asset__hover-btn--downloading:hover {
+    transform: none;
+    background: rgba(34, 197, 94, 0.9);
+  }
+
+  .ol-asset__hover-btn svg {
+    width: 20px;
+    height: 20px;
+  }
+
+  /* Video controls (always visible in top-right corner) */
+  .ol-asset__video-controls {
+    position: absolute;
+    top: 8px;
+    right: 8px;
+    display: flex;
+    gap: 6px;
+    align-items: center;
+    z-index: 20;
+  }
+
+  .ol-asset__video-btn {
+    width: 32px;
+    height: 32px;
+    border: none;
+    border-radius: 6px;
+    background: rgba(0, 0, 0, 0.6);
+    color: white;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    transition: all 0.2s ease;
+    backdrop-filter: blur(8px);
+  }
+
+  .ol-asset__video-btn:hover {
+    background: rgba(0, 0, 0, 0.8);
+    transform: scale(1.05);
+  }
+
+  .ol-asset__video-btn:active {
+    transform: scale(0.95);
+  }
+
+  .ol-asset__video-btn--downloading {
+    opacity: 0.7;
+    cursor: not-allowed;
+  }
+
+  .ol-asset__video-btn--downloading:hover {
+    transform: none;
+  }
+
+  .ol-asset__video-btn svg {
+    width: 16px;
+    height: 16px;
+  }
+
+  /* Mobile: Video controls always visible */
+  @media (max-width: 768px) {
+    .ol-asset__video-controls {
+      opacity: 1;
+      visibility: visible;
+    }
+  }
+
+  /* Hide existing download button when hover overlay is visible */
+  .ol-asset:hover .ol-asset__download-btn {
+    opacity: 0;
+    visibility: hidden;
+  }
+`;var x=class{constructor(e,t){this.asset=e,this.onClose=t}getMultimediaSubtype(e){let t=e.format||"";return t.startsWith("video/")?"video":t.startsWith("image/")?"image":t.includes("presentation")||t.includes("pdf")||t.includes("powerpoint")||t.includes("slides")||t.includes("application/vnd.ms-powerpoint")||t.includes("application/vnd.openxmlformats-officedocument.presentationml")||e.slides&&e.slides.length>0?"presentation":e.duration||e.vodUrl?"video":"image"}formatDuration(e){let t=Math.floor(e/60),o=Math.floor(e%60);return`${t}:${o.toString().padStart(2,"0")}`}async open(){await import("@onlive.ai/ui/dist/components/dialog/dialog.js"),await import("@onlive.ai/ui/dist/components/icon-button/icon-button.js"),await import("@onlive.ai/ui/dist/components/button/button.js"),await import("@onlive.ai/ui/dist/components/icon/icon.js");let e=this.asset;this.getMultimediaSubtype(e)==="presentation"&&(e.slides?.length??0)>0&&await Promise.all([import("@onlive.ai/ui/dist/components/carousel/carousel.js"),import("@onlive.ai/ui/dist/components/carousel-item/carousel-item.js")]),this.injectStyles(),this.createDialog(),this.dialog?.show()}close(){this.dialog?.hide(),setTimeout(()=>{this.removeDialog()},300)}createDialog(){if(this.dialog||!this.asset)return;let e=this.createDialogHTML(),t=document.createElement("div");t.innerHTML=e,this.dialog=t.firstElementChild,this.dialog&&(document.body.appendChild(this.dialog),this.attachEventListeners())}removeDialog(){this.dialog&&(this.dialog.parentNode&&this.dialog.parentNode.removeChild(this.dialog),this.dialog=void 0)}injectStyles(){if(document.getElementById("asset-modal-styles"))return;let e=document.createElement("style");e.id="asset-modal-styles",e.textContent=this.getModalStyles(),document.head.appendChild(e)}getModalStyles(){return`
+
+      ol-dialog::part(base){
+      z-index: 1000000;
+      }
+      ol-dialog.ol-asset__dialog {
+        --width: 90vw;
+        --max-width: 1400px;
+      }
+
+      ol-dialog.ol-asset__dialog[data-fullscreen="true"] {
+        --width: 100vw;
+        --max-width: 100vw;
+      }
+
+      .ol-asset__dialog-content {
+        display: flex;
+        flex-direction: column;
+        max-height: 85vh;
+        overflow: hidden;
+      }
+
+      .ol-asset__dialog-body {
+        flex: 1;
+        overflow-y: auto;
+        padding: 0;
+        display: flex;
+        flex-direction: column;
+      }
+
+      .ol-asset__modal-media-container {
+        position: relative;
+        width: 100%;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: var(--ol-color-neutral-50, #f9fafb);
+        min-height: 300px;
+        max-height: 75vh;
+        overflow: hidden;
+      }
+
+      .ol-asset__modal-media-container[data-type="presentation"] {
+        max-height: 85vh;
+        min-height: 400px;
+      }
+
+      .ol-asset__modal-image-container {
+        width: 100%;
+        height: 100%;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: var(--ol-spacing-medium);
+      }
+
+      .ol-asset__modal-image {
+        max-width: 100%;
+        max-height: 75vh;
+        width: auto;
+        height: auto;
+        object-fit: contain;
+        display: block;
+        image-rendering: -webkit-optimize-contrast;
+        image-rendering: crisp-edges;
+        image-rendering: high-quality;
+      }
+
+      @media (min-width: 768px) {
+        .ol-asset__modal-image {
+          max-height: 80vh;
+        }
+      }
+
+      @media (min-width: 1024px) {
+        .ol-asset__modal-image {
+          max-height: 85vh;
+        }
+      }
+
+      .ol-asset__modal-info {
+        padding: var(--ol-spacing-large);
+        background: var(--ol-color-surface, #ffffff);
+        border-top: 1px solid var(--ol-color-neutral-200, #e5e7eb);
+      }
+
+      .ol-asset__modal-title {
+        margin: 0 0 var(--ol-spacing-small) 0;
+        font-size: var(--ol-font-size-x-large, 1.5rem);
+        font-weight: 600;
+        color: var(--ol-color-text, #1f2937);
+        line-height: 1.3;
+      }
+
+      .ol-asset__modal-description {
+        margin: 0 0 var(--ol-spacing-medium) 0;
+        font-size: var(--ol-font-size-medium, 1rem);
+        line-height: 1.6;
+        color: var(--ol-color-text-secondary, #6b7280);
+      }
+
+      .ol-asset__modal-metadata {
+        display: flex;
+        flex-wrap: wrap;
+        gap: var(--ol-spacing-medium);
+        margin-top: var(--ol-spacing-small);
+      }
+
+      .ol-asset__modal-metadata-item {
+        display: flex;
+        align-items: center;
+        gap: var(--ol-spacing-2x-small);
+        font-size: var(--ol-font-size-small, 0.875rem);
+        color: var(--ol-color-text-secondary, #6b7280);
+      }
+
+      .ol-asset__modal-metadata-item ol-icon {
+        font-size: 1rem;
+        color: var(--ol-color-neutral-400, #9ca3af);
+      }
+
+      .ol-asset__modal-faq {
+        padding: var(--ol-spacing-large);
+        max-width: 800px;
+        margin: 0 auto;
+      }
+
+      .ol-asset__modal-question {
+        margin: 0 0 var(--ol-spacing-large) 0;
+        font-size: var(--ol-font-size-2x-large, 2rem);
+        font-weight: 600;
+        color: var(--ol-color-primary, #3b82f6);
+        line-height: 1.2;
+      }
+
+      .ol-asset__modal-answer {
+        font-size: var(--ol-font-size-medium, 1rem);
+        line-height: 1.8;
+        color: var(--ol-color-text, #1f2937);
+      }
+
+      .ol-asset__modal-video-container {
+        width: 100%;
+        max-height: 75vh;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        background: #000;
+        position: relative;
+      }
+
+      .ol-asset__modal-video-player {
+        width: 100%;
+        max-width: 100%;
+        height: auto;
+        max-height: 75vh;
+        object-fit: contain;
+        display: block;
+      }
+
+      .ol-asset__modal-presentation {
+        width: 100%;
+        height: 100%;
+        min-height: 400px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        background: var(--ol-color-neutral-50, #f9fafb);
+      }
+
+      .ol-asset__modal-carousel {
+        width: 100%;
+        height: 100%;
+        min-height: 400px;
+        --aspect-ratio: auto;
+      }
+
+      .ol-asset__modal-carousel::part(base) {
+        height: 100%;
+        min-height: 400px;
+      }
+
+      .ol-asset__modal-carousel::part(scroll-container) {
+        height: 100%;
+        min-height: 400px;
+      }
+
+      .ol-asset__modal-carousel ol-carousel-item {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: var(--ol-spacing-medium);
+        height: 100%;
+        min-height: 400px;
+      }
+
+      .ol-asset__modal-slide-image {
+        max-width: 100%;
+        max-height: 100%;
+        width: auto;
+        height: auto;
+        object-fit: contain;
+        display: block;
+        image-rendering: -webkit-optimize-contrast;
+        image-rendering: crisp-edges;
+        image-rendering: high-quality;
+      }
+
+      .ol-asset__modal-presentation-fallback {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        padding: 40px;
+        color: var(--ol-color-text-secondary, #6b7280);
+      }
+
+      .ol-asset__modal-presentation-icon {
+        font-size: 48px;
+        margin-bottom: 16px;
+      }
+
+      .ol-asset__modal-type {
+        margin: 0;
+        font-size: var(--ol-font-size-small, 0.875rem);
+        color: var(--ol-color-text-secondary, #6b7280);
+        font-weight: 500;
+        text-transform: uppercase;
+        letter-spacing: 0.05em;
+      }
+
+      .ol-asset__modal-duration,
+      .ol-asset__modal-slides {
+        margin: 0;
+        font-size: var(--ol-font-size-small, 0.875rem);
+        color: var(--ol-color-text-secondary, #6b7280);
+      }
+
+      @media (max-width: 768px) {
+        ol-dialog.ol-asset__dialog {
+          --width: 95vw;
+        }
+
+        .ol-asset__modal-info,
+        .ol-asset__modal-faq {
+          padding: var(--ol-spacing-medium);
+        }
+
+        .ol-asset__modal-title {
+          font-size: var(--ol-font-size-large, 1.25rem);
+        }
+
+        .ol-asset__modal-question {
+          font-size: var(--ol-font-size-x-large, 1.5rem);
+        }
+
+        .ol-asset__modal-description,
+        .ol-asset__modal-answer {
+          font-size: var(--ol-font-size-small, 0.875rem);
+        }
+
+        .ol-asset__modal-image {
+          max-height: 60vh;
+        }
+
+        .ol-asset__modal-video-player {
+          max-height: 60vh;
+        }
+
+        .ol-asset__modal-slide-image {
+          max-height: 60vh;
+        }
+      }
+
+      @media (min-width: 1024px) {
+        .ol-asset__modal-media-container {
+          max-height: 80vh;
+        }
+
+        .ol-asset__modal-media-container[data-type="presentation"] {
+          max-height: 85vh;
+          min-height: 500px;
+        }
+
+        .ol-asset__modal-image {
+          max-height: 80vh;
+        }
+
+        .ol-asset__modal-video-player {
+          max-height: 80vh;
+        }
+
+        .ol-asset__modal-presentation {
+          min-height: 500px;
+        }
+
+        .ol-asset__modal-carousel {
+          min-height: 500px;
+        }
+
+        .ol-asset__modal-carousel::part(base),
+        .ol-asset__modal-carousel::part(scroll-container) {
+          min-height: 500px;
+        }
+
+        .ol-asset__modal-carousel ol-carousel-item {
+          min-height: 500px;
+        }
+
+        .ol-asset__modal-slide-image {
+          max-height: 85vh;
+        }
+      }
+
+      @media (min-width: 1400px) {
+        .ol-asset__modal-media-container[data-type="presentation"] {
+          max-height: 90vh;
+          min-height: 600px;
+        }
+
+        .ol-asset__modal-presentation {
+          min-height: 600px;
+        }
+
+        .ol-asset__modal-carousel {
+          min-height: 600px;
+        }
+
+        .ol-asset__modal-carousel::part(base),
+        .ol-asset__modal-carousel::part(scroll-container) {
+          min-height: 600px;
+        }
+
+        .ol-asset__modal-carousel ol-carousel-item {
+          min-height: 600px;
+        }
+
+        .ol-asset__modal-slide-image {
+          max-height: 90vh;
+        }
+      }
+    `}createDialogHTML(){if(!this.asset)return"";let{name:e,description:t,url:o,type:s}=this.asset,l="";if(s==="multimedia"){let r=this.asset,u=this.getMultimediaSubtype(r);if(u==="image")l=`
+          <div class="ol-asset__modal-media-container">
+            <div class="ol-asset__modal-image-container">
+              <img
+                src="${o||""}"
+                alt="${e}"
+                class="ol-asset__modal-image"
+                loading="eager"
+              />
+            </div>
+          </div>
+          <div class="ol-asset__modal-info">
+            <h3 class="ol-asset__modal-title">${e}</h3>
+            ${t?`<p class="ol-asset__modal-description">${t}</p>`:""}
+            <div class="ol-asset__modal-metadata">
+              <div class="ol-asset__modal-metadata-item">
+                <ol-icon name="photo"></ol-icon>
+                <span class="ol-asset__modal-type">Image</span>
+              </div>
+            </div>
+          </div>
+        `;else if(u==="video")l=`
+          <div class="ol-asset__modal-media-container">
+            <div class="ol-asset__modal-video-container">
+              <video
+                src="${o||r.vodUrl||""}"
+                controls
+                class="ol-asset__modal-video-player"
+                preload="metadata"
+              >
+                Your browser does not support the video tag.
+              </video>
+            </div>
+          </div>
+          <div class="ol-asset__modal-info">
+            <h3 class="ol-asset__modal-title">${e}</h3>
+            ${t?`<p class="ol-asset__modal-description">${t}</p>`:""}
+            <div class="ol-asset__modal-metadata">
+              <div class="ol-asset__modal-metadata-item">
+                <ol-icon name="video"></ol-icon>
+                <span class="ol-asset__modal-type">Video</span>
+              </div>
+              ${r.duration?`
+                <div class="ol-asset__modal-metadata-item">
+                  <ol-icon name="clock"></ol-icon>
+                  <span class="ol-asset__modal-duration">${this.formatDuration(r.duration)}</span>
+                </div>
+              `:""}
+            </div>
+          </div>
+        `;else if(u==="presentation")if(r.slides&&r.slides.length>0){let p=r.slides;l=`
+            <div class="ol-asset__modal-media-container" data-type="presentation">
+              <div class="ol-asset__modal-presentation">
+                <ol-carousel pagination navigation loop class="ol-asset__modal-carousel">
+                  ${p.map((P,M)=>`
+              <ol-carousel-item>
+                <img
+                  src="${P}"
+                  alt="Slide ${M+1} of ${p.length}"
+                  class="ol-asset__modal-slide-image"
+                />
+              </ol-carousel-item>
+            `).join("")}
+                </ol-carousel>
+              </div>
+            </div>
+            <div class="ol-asset__modal-info">
+              <h3 class="ol-asset__modal-title">${e}</h3>
+              ${t?`<p class="ol-asset__modal-description">${t}</p>`:""}
+              <div class="ol-asset__modal-metadata">
+                <div class="ol-asset__modal-metadata-item">
+                  <ol-icon name="file-presentation"></ol-icon>
+                  <span class="ol-asset__modal-type">Presentation</span>
+                </div>
+                <div class="ol-asset__modal-metadata-item">
+                  <ol-icon name="layers"></ol-icon>
+                  <span class="ol-asset__modal-slides">${p.length} ${p.length===1?"slide":"slides"}</span>
+                </div>
+              </div>
+            </div>
+          `}else l=`
+            <div class="ol-asset__modal-presentation">
+              <div class="ol-asset__modal-presentation-fallback">
+                <div class="ol-asset__modal-presentation-icon">\u{1F4C4}</div>
+                <p>Presentation Preview</p>
+              </div>
+            </div>
+            <div class="ol-asset__modal-info">
+              <h3 class="ol-asset__modal-title">${e}</h3>
+              ${t?`<p class="ol-asset__modal-description">${t}</p>`:""}
+              <p class="ol-asset__modal-type">Type: Presentation</p>
+            </div>
+          `}else if(s==="file"){let r=this.asset,u=this.getMultimediaSubtype(r);if(u==="image")l=`
+          <div class="ol-asset__modal-media-container">
+            <div class="ol-asset__modal-image-container">
+              <img
+                src="${o||""}"
+                alt="${e}"
+                class="ol-asset__modal-image"
+                loading="eager"
+              />
+            </div>
+          </div>
+          <div class="ol-asset__modal-info">
+            <h3 class="ol-asset__modal-title">${e}</h3>
+            ${t?`<p class="ol-asset__modal-description">${t}</p>`:""}
+            <div class="ol-asset__modal-metadata">
+              <div class="ol-asset__modal-metadata-item">
+                <ol-icon name="photo"></ol-icon>
+                <span class="ol-asset__modal-type">Image File</span>
+              </div>
+            </div>
+          </div>
+        `;else if(u==="video")l=`
+          <div class="ol-asset__modal-media-container">
+            <div class="ol-asset__modal-video-container">
+              <video
+                src="${o||r.vodUrl||""}"
+                controls
+                class="ol-asset__modal-video-player"
+                preload="metadata"
+              >
+                Your browser does not support the video tag.
+              </video>
+            </div>
+          </div>
+          <div class="ol-asset__modal-info">
+            <h3 class="ol-asset__modal-title">${e}</h3>
+            ${t?`<p class="ol-asset__modal-description">${t}</p>`:""}
+            <div class="ol-asset__modal-metadata">
+              <div class="ol-asset__modal-metadata-item">
+                <ol-icon name="video"></ol-icon>
+                <span class="ol-asset__modal-type">Video File</span>
+              </div>
+              ${r.duration?`
+                <div class="ol-asset__modal-metadata-item">
+                  <ol-icon name="clock"></ol-icon>
+                  <span class="ol-asset__modal-duration">${this.formatDuration(r.duration)}</span>
+                </div>
+              `:""}
+            </div>
+          </div>
+        `;else if(u==="presentation")if(r.slides&&r.slides.length>0){let p=r.slides;l=`
+            <div class="ol-asset__modal-media-container" data-type="presentation">
+              <div class="ol-asset__modal-presentation">
+                <ol-carousel pagination navigation loop class="ol-asset__modal-carousel">
+                  ${p.map((P,M)=>`
+              <ol-carousel-item>
+                <img
+                  src="${P}"
+                  alt="Slide ${M+1} of ${p.length}"
+                  class="ol-asset__modal-slide-image"
+                />
+              </ol-carousel-item>
+            `).join("")}
+                </ol-carousel>
+              </div>
+            </div>
+            <div class="ol-asset__modal-info">
+              <h3 class="ol-asset__modal-title">${e}</h3>
+              ${t?`<p class="ol-asset__modal-description">${t}</p>`:""}
+              <div class="ol-asset__modal-metadata">
+                <div class="ol-asset__modal-metadata-item">
+                  <ol-icon name="file-presentation"></ol-icon>
+                  <span class="ol-asset__modal-type">Presentation File</span>
+                </div>
+                <div class="ol-asset__modal-metadata-item">
+                  <ol-icon name="layers"></ol-icon>
+                  <span class="ol-asset__modal-slides">${p.length} ${p.length===1?"slide":"slides"}</span>
+                </div>
+              </div>
+            </div>
+          `}else l=`
+            <div class="ol-asset__modal-presentation">
+              <div class="ol-asset__modal-presentation-fallback">
+                <div class="ol-asset__modal-presentation-icon">\u{1F4C4}</div>
+                <p>Presentation Preview</p>
+              </div>
+            </div>
+            <div class="ol-asset__modal-info">
+              <h3 class="ol-asset__modal-title">${e}</h3>
+              ${t?`<p class="ol-asset__modal-description">${t}</p>`:""}
+              <p class="ol-asset__modal-type">Type: Presentation File</p>
+            </div>
+          `}else if(s==="faq"){let r=this.asset;l=`
+        <div class="ol-asset__modal-faq">
+          <h3 class="ol-asset__modal-question">${r.question||e}</h3>
+          <div class="ol-asset__modal-answer">${r.answer||t}</div>
+        </div>
+      `}else l=`
+        <div class="ol-asset__modal-info">
+          <h3 class="ol-asset__modal-title">${e}</h3>
+          ${t?`<p class="ol-asset__modal-description">${t}</p>`:""}
+        </div>
+      `;let a=s==="multimedia"||s==="file",d=s==="faq"&&this.asset.question||e;return`
+      <ol-dialog 
+        label="${this.escapeHtml(d)}"
+        class="ol-asset__dialog"
+        data-fullscreen="${a}"
+        ${a?'style="--width: 95vw; --max-width: 1600px;"':""}
+      >
+        <div class="ol-asset__dialog-content">
+          <div class="ol-asset__dialog-body">
+            ${l}
+          </div>
+        </div>
+      </ol-dialog>
+    `}attachEventListeners(){this.dialog&&(this.dialog.addEventListener("ol-after-hide",()=>{this.onClose?.()}),this.dialog.addEventListener("ol-request-close",e=>{e.detail?.source==="overlay"&&e.preventDefault()}))}escapeHtml(e){let t=document.createElement("div");return t.textContent=e,t.innerHTML}};var v=class extends ee{constructor(){super(...arguments);this.loadingState="idle";this.assetRenderer=new w;this.isDownloading=!1;this.defaultDisplayOptions={showThumbnail:!0,showName:!1,showDescription:!1,showMetadata:!0,showPrice:!0,showDuration:!1,showSize:!1,showTags:!1,layout:"card",size:"medium"}}connectedCallback(){super.connectedCallback(),this.initializeServices(),this.loadAsset()}disconnectedCallback(){super.disconnectedCallback(),this.closeModal()}initializeServices(){this.assetLoader=new b(this.config)}async loadAsset(){if(!this.type||!this.externalId){this.error="Type and externalId are required",this.loadingState="error";return}this.loadingState="loading",this.error=void 0;try{let t=await this.assetLoader.loadAsset(this.type,this.externalId);this.asset=t,this.loadingState="loaded",this.dispatchEvent(new CustomEvent("asset-load",{detail:t})),console.debug("Asset loaded:",t)}catch(t){console.error(`Error loading ${this.type} asset:`,t),this.error=t instanceof Error?t.message:"Failed to load asset",this.loadingState="error",this.dispatchEvent(new CustomEvent("asset-error",{detail:{error:this.error,asset:this.asset}}))}}async onDownload(t){if(!(!t.url||this.isDownloading)){this.isDownloading=!0;try{let o=await fetch(t.url,{method:"GET",mode:"cors",cache:"no-cache"});if(o.ok){let s=await o.blob(),l=window.URL.createObjectURL(s),a=document.createElement("a");a.href=l,a.download=this.getDownloadFilename(t),a.style.display="none",document.body.appendChild(a),a.click(),document.body.removeChild(a),setTimeout(()=>window.URL.revokeObjectURL(l),100),this.dispatchEvent(new CustomEvent("asset-download",{detail:t})),this.isDownloading=!1;return}}catch(o){console.warn("Fetch strategy failed:",o)}try{let o=await fetch(t.url,{headers:{Accept:"*/*"},mode:"no-cors"});if(o.type==="opaque")throw new Error("No-cors response, cannot access blob");let s=await o.blob(),l=window.URL.createObjectURL(s),a=document.createElement("a");a.href=l,a.download=this.getDownloadFilename(t),a.style.display="none",document.body.appendChild(a),a.click(),document.body.removeChild(a),setTimeout(()=>window.URL.revokeObjectURL(l),100),this.dispatchEvent(new CustomEvent("asset-download",{detail:t})),this.isDownloading=!1;return}catch(o){console.warn("No-cors strategy failed:",o)}try{let o=document.createElement("a");o.href=t.url,o.download=this.getDownloadFilename(t),o.target="_blank",o.rel="noopener noreferrer",o.style.position="absolute",o.style.left="-9999px",document.body.appendChild(o),o.click(),setTimeout(()=>{document.body.removeChild(o)},100),this.dispatchEvent(new CustomEvent("asset-download",{detail:t}))}catch(o){console.error("All download strategies failed:",o),window.open(t.url,"_blank")}this.isDownloading=!1}}getDownloadFilename(t){let o=Date.now(),s=this.getFileExtension(t);return`${t.name||`asset-${t.type}-${o}`}${s}`}getFileExtension(t){if(t.url){let l=new URL(t.url).pathname,a=l.lastIndexOf(".");if(a>0)return l.substring(a)}return{multimedia:".jpg",file:".bin",product:".jpg",faq:".txt"}[t.type]||""}async openModal(){this.asset&&(this.modalPortal=new x(this.asset,this.closeModal.bind(this)),await this.modalPortal.open())}onMaximize(){if(this.asset){if(this.asset.type==="multimedia"||this.asset.type==="file"){let t=this.asset,o=t.slides&&t.slides.length>0,s=t.format||"";if((s.includes("presentation")||s.includes("pdf")||s.includes("powerpoint")||s.includes("slides")||s.includes("application/vnd.ms-powerpoint")||s.includes("application/vnd.openxmlformats-officedocument.presentationml")||o&&t.slides.length>0)&&!o)return}this.asset.type==="multimedia"||this.asset.type==="file"||this.asset.type==="faq"?this.openModal():this.dispatchEvent(new CustomEvent("asset-click",{detail:this.asset}))}}closeModal(){this.modalPortal&&(this.modalPortal.close(),this.modalPortal=void 0)}render(){let t={...this.defaultDisplayOptions,...this.config?.assetDisplayOptions||{}};return this.loadingState==="loading"?z`
+        <div class="ol-asset ol-asset--loading">
+          ${this.assetRenderer.renderLoading()}
+        </div>
+      `:this.loadingState==="error"?z`
+        <div class="ol-asset ol-asset--error">
+          ${this.assetRenderer.renderError(this.error)}
+        </div>
+      `:this.asset?z`
+      <div
+        class="ol-asset ${te({"ol-asset--compact":t.layout==="compact","ol-asset--minimal":t.layout==="minimal","ol-asset--small":t.size==="small","ol-asset--medium":t.size==="medium","ol-asset--large":t.size==="large","ol-asset--faq":this.asset.type==="faq"})}"
+      >
+        ${this.assetRenderer.renderThumbnail(this.asset,t,this.onDownload.bind(this),this.isDownloading,this.onMaximize.bind(this))}
+        ${this.assetRenderer.renderContent(this.asset,t)}
+      </div>
+    `:z``}};v.styles=[I],c([T({type:String})],v.prototype,"type",2),c([T({type:String})],v.prototype,"externalId",2),c([T({type:Object})],v.prototype,"config",2),c([h()],v.prototype,"asset",2),c([h()],v.prototype,"loadingState",2),c([h()],v.prototype,"error",2),c([h()],v.prototype,"assetLoader",2),c([h()],v.prototype,"assetRenderer",2),c([h()],v.prototype,"isDownloading",2),v=c([_("osb-asset")],v);export{b as AssetLoaders,x as AssetModalPortal,w as AssetRenderer,v as OSBAsset};