@layer components.image{:host{--ec-image-skeleton-base:#e2e2e2;--ec-image-skeleton-highlight:#f2f2f2;--ec-image-skeleton-duration:1.4s;display:block;position:relative}:host([hidden]){display:none}[part=skeleton]{display:none}:host([data-skeleton]:not([data-loaded])) [part=skeleton]{z-index:1;background-color:var(--ec-image-skeleton-base);background-image:linear-gradient(90deg, var(--ec-image-skeleton-base) 0%, var(--ec-image-skeleton-highlight) 50%, var(--ec-image-skeleton-base) 100%);animation:ec-image-shimmer var(--ec-image-skeleton-duration) ease-in-out infinite;background-size:200% 100%;display:block;position:absolute;inset:0}@keyframes ec-image-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}[part=error]{display:none}:host([data-error]) [part=error]{z-index:2;color:var(--ec-image-error-color,#888);background-color:var(--ec-image-error-background,#f4f4f4);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}figcaption[part=caption]{display:none}:host([data-has-caption]) figcaption[part=caption]{margin-top:var(--ec-image-caption-gap,.5rem);color:var(--ec-image-caption-color,#666);font-size:var(--ec-image-caption-size,.875rem);line-height:1.4;display:block}::slotted(picture){display:block}::slotted(img){opacity:0;max-width:100%;height:auto;transition:opacity var(--ec-image-fade-duration,.4s) ease;background-image:var(--ec-image-lqip,none);background-position:50%;background-size:cover;display:block}:host([data-loaded]) ::slotted(img){opacity:1}:host([data-focus=left]) ::slotted(img){object-position:left center}:host([data-focus=right]) ::slotted(img){object-position:right center}:host([data-focus=center]) ::slotted(img){object-position:center}:host([data-lightbox]) ::slotted(img){cursor:zoom-in}[part=lightbox]{background:0 0;border:none;max-width:100vw;max-height:100vh;padding:0;overflow:hidden}[part=lightbox]::backdrop{background-color:var(--ec-image-lightbox-backdrop,rgba(0,0,0,.85))}[part=lightbox-image]{object-fit:contain;cursor:zoom-out;width:auto;max-width:90vw;height:auto;max-height:90vh;display:block}@media (prefers-reduced-motion:reduce){::slotted(img){transition:none}:host([data-skeleton]:not([data-loaded])) [part=skeleton]{background-image:none;animation:none}}}