:host {
  @apply grid grid-cols-[1fr,auto] gap-6 pt-4;

  grid-template-areas:
    'product-info action-card'
    'destination-info action-card';
}

checkout-display-order-destination-info {
  @apply ml-20 desktop-large:ml-0 desktop-large:justify-self-end;
}

:host:not(:has([data-which='action-card'][data-what='action-card'])) {
  @apply flex justify-between;

  checkout-confirmation-list-item-action-card {
    display: none;
  }

  checkout-display-order-destination-info {
    @apply ml-0;
  }
}

@screen desktop-large {
  :host,
  :host:not(:has([data-which='action-card'][data-what='action-card'])) {
    @apply grid-cols-3;
    grid-template-areas: 'product-info action-card destination-info';
  }
}

checkout-product-info {
  grid-area: product-info;
  @apply grow;
}

checkout-confirmation-list-item-action-card {
  grid-area: action-card;
  @apply w-[18rem] desktop-large:w-[24.5rem];
}

checkout-display-order-destination-info {
  grid-area: destination-info;
  @apply block w-[18rem] desktop-large:w-[24.5rem] grow-0;
}
