.x-action-icon{align-items:center;cursor:pointer;display:flex;justify-content:center;position:absolute;transition:all .3s ease;z-index:2}.x-action-icon.position-top-right{right:0;top:0}.x-action-icon.position-top-left{left:0;top:0}.x-action-icon.position-bottom-right{bottom:0;right:0}.x-action-icon.position-bottom-left{bottom:0;left:0}.x-action-icon.variant-overlay{opacity:0;padding:5px;transition:opacity 1s ease}.x-action-icon.variant-overlay .icon{border-radius:50%;height:24px;transition:background-color .3s ease;width:24px}.x-action-icon.variant-overlay svg{stroke:#fff}.x-action-icon.variant-overlay.always-visible{opacity:1}.x-action-icon.variant-card{opacity:0;padding:5px;transition:opacity 1s ease}.x-action-icon.variant-card .icon{background-color:var(--primary-color);border-radius:50%;height:24px;transition:background-color .3s ease;width:24px}.x-action-icon.variant-card svg{stroke:#fff}.x-action-icon.variant-card.always-visible{opacity:1}.x-action-icon.variant-dialog{opacity:1;padding:0}.x-action-icon.variant-dialog .icon{background:#0009;border-radius:0;height:24px;width:24px}.x-action-icon.variant-dialog .icon svg{stroke:#fff;scale:.8}.x-action-icon.variant-button{background:var(--surface-card);border:1px solid var(--surface-border);border-radius:6px;box-shadow:0 2px 4px #0000001a;padding:8px}.x-action-icon.variant-button:hover{background:var(--surface-hover)}.x-image{height:auto;overflow:hidden;position:relative}.x-image img{transition:filter .5s ease}.x-image.darken img{filter:brightness(50%)}.x-image.darker img{filter:brightness(30%)}.x-image.grayscale img{filter:grayscale(70%)}.x-image.hover-darken img{filter:brightness(60%);transition:filter .3s ease}.x-image picture{display:block;height:100%;position:relative;width:100%}.x-image picture>img{display:block;-o-object-fit:cover;object-fit:cover;width:100%}.x-image .overlay{bottom:0;color:#fff;left:0;position:absolute;right:0;top:0;z-index:1}.x-image:focus-within .x-action-icon,.x-image:hover .x-action-icon{opacity:1}