@layer snippets{
  #search[popover] [ui-slot=sheet-body]{
    display:flex;
    flex-direction:column;
    gap:var(--spacing-24);
    padding-bottom:calc(var(--spacing-16) + var(--spacing-4));
  }
  #search[popover] [ui-slot=sheet-body] .terms{
    display:flex;
    flex-direction:column;
    gap:var(--spacing-8);
  }
  #search[popover] [ui-slot=sheet-body] .terms .label{
    font:var(--font-body-lg);
  }
  #search[popover] [ui-slot=sheet-body] .terms .options{
    display:flex;
    flex-wrap:wrap;
    gap:var(--spacing-8);
  }
  #search[popover] [ui-slot=sheet-body] .products{
    display:flex;
    flex-direction:column;
    gap:var(--spacing-8);
  }
  #search[popover] [ui-slot=sheet-body] .products .label{
    font:var(--font-body-lg);
  }
  #search[popover] [ui-slot=sheet-body] .products .items{
    display:grid;
    grid-gap:var(--spacing-16);
    gap:var(--spacing-16);
  }
  #search[popover] [ui-slot=sheet-body] .products .items .item{
    display:flex;
    gap:var(--spacing-16);
    align-items:center;
  }
  #search[popover] [ui-slot=sheet-body] .products .items .item .media{
    flex-shrink:0;
    width:100px;
    height:100px;
    overflow:hidden;
    border-radius:var(--radius-12);
  }
  #search[popover] [ui-slot=sheet-body] .products .items .item .media > img{
    -o-object-fit:cover;
       object-fit:cover;
  }
  #search[popover] [ui-slot=sheet-body] .products .items .item .content{
    display:flex;
    flex-direction:column;
    gap:var(--spacing-8);
  }
  #search[popover] [ui-slot=sheet-body] .products .items .item .content .title{
    justify-content:flex-start;
    overflow:hidden;
    font:var(--font-body-lg);
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  #search[popover] [ui-slot=sheet-body] .products .items .item .content .price{
    font:var(--font-title-md);
  }
}
