/* The reviews are written into the page instead of being fetched by the
   Trustindex loader. Its stylesheet is built for a slider driven by
   JavaScript, so these rules undo the parts that need it. The selectors carry
   the same weight as the original ones, otherwise they lose. */

/* Two cards side by side, the row moves on by itself. The wrapper is the
   window, the container inside it is the track. */
.ti-widget.ti-goog .ti-reviews-container {
  overflow: hidden;
}

.ti-widget.ti-goog .ti-reviews-container-wrapper {
  flex-wrap: nowrap;
  overflow: visible;
  will-change: transform;
}

/* The column this widget sits in reaches past the right edge of the window, so
   half a card would be cut off at 50%. At 44% both fit and the next one peeks
   out, which is what a slider should look like. */
.ti-widget.ti-goog .ti-review-item {
  flex: 0 0 44%;
  max-width: 44%;
}

.ti-widget.ti-goog .ti-review-item > .ti-inner {
  height: 100%;
}

/* The stars sit centred over the text, like the name above them. */
.ti-widget.ti-goog .ti-stars {
  display: block;
  text-align: center;
}

@media (max-width: 767px) {
  .ti-widget.ti-goog .ti-review-item {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* The slider cut every review to 116 pixels and offered a "read more" link
   that its JavaScript handled. The text now stands in full. */
.ti-widget.ti-goog .ti-review-content {
  height: auto !important;
  max-height: none !important;
  display: block !important;
  -webkit-line-clamp: none !important;
}

/* Google shows an initial where a reviewer has no picture. Doing the same
   saves copying strangers' profile photos onto our server. The size matches
   the avatar the layout expects, which is what the Google badge beside it is
   positioned against. */
.ti-widget.ti-goog .ti-review-header .ti-initiale {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 32px;
  background: #ff6f00;
  color: #fff;
  font-size: 26px;
  font-weight: 700;
  line-height: 1;
}
