@layer snippets{
  [ui-block=collection]{
    display:flex;
    flex-direction:column;
  }
  [ui-block=collection] .media{
    height:auto;
    overflow:hidden;
    border-radius:var(--radius-collection);
  }
  [ui-block=collection] .media[data-image-ratio=square]{
    aspect-ratio:1/1;
  }
  [ui-block=collection] .media[data-image-ratio=portrait]{
    aspect-ratio:3/4;
  }
  [ui-block=collection] .media[data-image-ratio=landscape]{
    aspect-ratio:4/3;
  }
  [ui-block=collection] .media > img{
    -o-object-fit:cover;
       object-fit:cover;
  }
  [ui-block=collection] .content{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding-top:var(--spacing-24);
    gap:var(--spacing-14);
  }
  [ui-block=collection] .content .title{
    font:var(--font-title-md) !important;
  }
  [dir="rtl"] [ui-block=collection] .content [ui-slot=button][data-flip-icon-in-rtl] > i{
    rotate:-90deg;
  }
}