@layer snippets{
  ui-express-checkout{
    display:grid;
    grid-gap:var(--spacing-12);
    gap:var(--spacing-12);
  }
  ui-express-checkout ui-linked-fields{
    display:contents;
    gap:var(--spacing-12);
  }
  ui-express-checkout [ui-express-checkout=field]{
    display:grid;
    grid-gap:var(--spacing-8);
    gap:var(--spacing-8);
  }
  ui-express-checkout [ui-express-checkout=field]::after{
    content:attr(error-message);
    color:var(--color-error);
  }
  @media (min-width: 769.02px){
    ui-express-checkout{
      grid-template-columns:repeat(2, 1fr);
    }
    ui-express-checkout > *:last-child{
      grid-column:1/3;
    }
  }
  .express-checkout-default{
    display:flex;
    flex-direction:column;
    gap:var(--spacing-24);
  }
  .express-checkout-default .actions{
    display:grid;
    grid-gap:var(--spacing-12);
    gap:var(--spacing-12);
    grid-template-columns:min-content auto;
  }
  .express-checkout-default .actions:has(> ui-shop-button:nth-of-type(2)) > ui-shop-button:last-of-type{
    grid-column:1/3;
  }
  .express-checkout-drawer [ui-slot=sheet-body]{
    display:flex;
    flex-direction:column;
    gap:calc(var(--spacing-16) + var(--spacing-4));
  }
  .express-checkout-drawer [ui-slot=sheet-body] .order-box{
    display:grid;
    grid-gap:var(--spacing-8);
    gap:var(--spacing-8);
  }
  .express-checkout-drawer [ui-slot=sheet-body] .order-box .order{
    display:flex;
    gap:var(--spacing-16);
  }
  .express-checkout-drawer [ui-slot=sheet-body] .order-box .order .image{
    width:100px;
    height:100px;
    overflow:hidden;
    border-radius:var(--radius-12);
  }
  .express-checkout-drawer [ui-slot=sheet-body] .order-box .order .image > img{
    -o-object-fit:cover;
       object-fit:cover;
  }
  .express-checkout-drawer [ui-slot=sheet-body] .order-box .order .detail{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    padding-top:var(--spacing-4);
    padding-bottom:var(--spacing-4);
  }
  .express-checkout-drawer [ui-slot=sheet-body] .order-box .order .detail .info{
    display:grid;
    grid-gap:var(--spacing-4);
    gap:var(--spacing-4);
  }
  .express-checkout-drawer [ui-slot=sheet-body] .order-box .order .detail .info .price{
    color:var(--color-primary);
    font:var(--font-body-lg);
  }
  .express-checkout-drawer [ui-slot=sheet-footer] ui-quantity{
    display:none;
  }
}