.root {
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-rows: auto auto auto auto auto 1fr;
  column-gap: 1rem;
  font-size: 14px;
  opacity: 1;
  transition-delay: 64ms;
  transition-duration: 384ms;
  transition-property: opacity;
  transition-timing-function: var(--venia-global-anim-standard);
  border-bottom: 1px dashed var(--primary-border-color);
  padding-bottom: 10px;
}
.root:last-child {
  border-bottom: unset;
}
.root_disabled {
  composes: root;
  opacity: 0.5;
}

.thumbnailContainer {
  grid-column: 1 / span 1;
  grid-row: 1 / span 6;
}

.thumbnail {
  border: 1px solid var(--primary-border-color);
}

.name,
.name:hover {
  grid-column: 2 / span 1;
  grid-row: 1 / span 1;
  margin-bottom: 0.5rem;
  color: var(--primary-dark-color);
  font-size: 14px;
  font-family: 'Karla-regular' !important;
}

.options {
  display: grid;
  grid-column: 2 / span 2;
  grid-row: 2 / span 2;
  margin-bottom: 0;
}

.quantity {
  grid-column: 2 / span 1;
  grid-row: 4 / span 1;
}

.price {
  grid-column: 2 / span 1;
  grid-row: 5 / span 1;
}

.stockStatus {
  color: rgb(var(--venia-global-color-error));
  font-weight: var(--venia-global-fontWeight-semibold);
  grid-column: 2;
  grid-row: 6;
}

.deleteButton {
  grid-column: 3 / span 1;
  grid-row: 1 / span 1;
}
.deleteButton svg {
  stroke: var(--primary-dark-color);
}