.root {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto 1fr;
  column-gap: 1rem;
  opacity: 1;
  visibility: visible;
  transition-delay: 64ms;
  transition-duration: 384ms;
  transition-property: opacity, visbility;
  transition-timing-function: var(--venia-global-anim-standard);
  margin-top: 1.5rem;
}

.root_hidden {
  composes: root;
  opacity: 0;
  visibility: hidden;
  height: 0;
  margin-top: 0rem;
}

.thumbnail {
  grid-column: 1 / span 1;
  grid-row: 1 / span 3;
  border: 1px solid var(--primary-border-color);
}

.name {
  font-weight: 600;
  grid-column: 2 / span 1;
  grid-row: 1 / span 1;
}

.quantity {
  grid-column: 2 / span 1;
  grid-row: 3 / span 1;
  font-size: 85%;
  margin-top: 1rem;
}

.options {
  display: grid;
  grid-column: 2 / span 1;
  grid-row: 2 / span 1;
  gap: 0.5rem;
  font-size: 85%;
  margin-top: 1rem;
}