/************************************************
* Below is our CSS for the Stamped.io widget
* To apply this to the site, minifiy the file and
* go to https://go.stamped.io/v3/#/settings/widgets/main/
* and paste the minified CSS into the Custom CSS field
*
* I don't have a good answer for why we need to minify this,
* but their dashboard seems to crash less often with a minified file
************************************************/

#stamped-main-widget {
  /************************************************
* Start Font styling
************************************************/

  margin: 0 !important;

  /* Style each review title to font-lg */
  .stamped-review-header-title {
    font-size: 1.125rem;
  }

  .stamped-container,
  #stamped-reviews-widget,
  div.stamped-container[data-widget-style],
  div[data-widget-style] div.stamped-container {
    font-family: inherit !important;
    margin: 0 !important;
    max-width: none !important;
  }
  /************************************************
* END Font styling
************************************************/

  /************************************************
 * Pagination style for reviews page widget
************************************************/

  /* This centers the pagination (and the whole reviews tab that is already centered) */
  #stamped-reviews-tab {
    display: flex;
    justify-content: center;
    flex-direction: column;
  }

  /* Add proper border and shadow to the pagination container */
  .stamped-pagination {
    display: inline-flex;
    border-radius: 0.375rem;
    border: 1px solid var(--color-slate-200);
    background-color: #ffffff;
    box-shadow:
      0 1px 3px 0 rgba(var(--color-slate-900-rgb), 0.1),
      0 1px 2px -1px rgba(var(--color-slate-900-rgb), 0.1);
    overflow: hidden;
    margin: 1.5rem auto;
  }

  /* Fix for mobile display */
  .stamped-pagination .stamped-hide-mobile {
    display: none;
  }

  @media (min-width: 768px) {
    .stamped-pagination .stamped-hide-mobile {
      display: block;
    }
  }

  .stamped-pagination .next,
  .stamped-pagination .previous {
    margin: auto;
  }

  /* Improve borders between pagination items */
  .stamped-pagination li {
    border-right: 1px solid var(--color-slate-200);
    padding: 0;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 600;
    position: relative;
  }

  .stamped-pagination li:last-child {
    border-right: none;
  }

  /* Fix border radius on first and last items */
  .stamped-pagination li:first-child a {
    border-top-left-radius: 0.375rem;
    border-bottom-left-radius: 0.375rem;
  }

  .stamped-pagination li:last-child a {
    border-top-right-radius: 0.375rem;
    border-bottom-right-radius: 0.375rem;
  }

  .stamped-pagination .page a,
  .stamped-pagination .next a,
  .stamped-pagination .previous a,
  .stamped-pagination .first a,
  .stamped-pagination .last a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 0.5rem 1rem;
    color: var(--color-slate-900);
    text-decoration: none;
  }

  .stamped-pagination li.next a,
  .stamped-pagination li.previous a,
  .stamped-pagination li.first a,
  .stamped-pagination li.last a {
    padding: 0.5rem 0.75rem;
    color: var(--color-slate-400);
  }

  .stamped-pagination .page.active {
    text-decoration-line: none !important;
    text-decoration-thickness: 0px !important;
    background-color: var(--color-sky-600);
    color: white;
    z-index: 10;
  }

  .stamped-pagination .page.active a {
    pointer-events: none;
    cursor: auto;
    color: white;
    font-weight: 600;
  }

  .stamped-pagination .stamped-link-disabled {
    pointer-events: none;
    cursor: auto;
    color: var(--color-slate-300) !important;
  }

  .stamped-pagination a:hover {
    background-color: var(--color-slate-50);
  }

  .stamped-pagination .page.active a:hover {
    background-color: var(--color-sky-600);
  }

  /* Replace existing styles that might conflict */
  .stamped-pagination > div,
  #real-users #stamped-reviews-widget .stamped-pagination > div {
    display: inline-flex;
    border-radius: 0.375rem;
    border: 1px solid var(--color-slate-200);
    box-shadow:
      0 1px 3px 0 rgba(var(--color-slate-900-rgb), 0.1),
      0 1px 2px -1px rgba(var(--color-slate-900-rgb), 0.1);
    overflow: hidden;
  }

  #stamped-pagination-prev,
  #pages span,
  #real-users #stamped-reviews-widget #stamped-pagination-prev,
  #real-users #stamped-reviews-widget #pages span {
    border-right: 1px solid var(--color-slate-200);
  }

  span.stamped-pagination-page.is-active a,
  #stampedio
    #stamped-reviews-widget
    #stamped-pagination-prev[style*="display: none"]
    a,
  #stampedio
    #stamped-reviews-widget
    #stamped-pagination-next[style*="display: none"]
    a,
  #real-users #stamped-reviews-widget span.stamped-pagination-page.is-active a,
  #real-users
    #stamped-reviews-widget
    #stamped-pagination-prev[style*="display: none"]
    a,
  #real-users
    #stamped-reviews-widget
    #stamped-pagination-next[style*="display: none"]
    a {
    background-color: var(--color-sky-600);
    color: white !important;
  }

  .stamped-pagination a,
  #real-users #stamped-reviews-widget .stamped-pagination a {
    /* control size with padding */
    display: block;
    border-width: 0px;
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
  }

  .stamped-pagination a:hover,
  #real-users #stamped-reviews-widget .stamped-pagination a:hover {
    background-color: var(--color-sky-100);
  }

  .stamped-pagination > div,
  #real-users #stamped-reviews-widget .stamped-pagination > div {
    display: inline-flex;
    border-radius: 0.375rem;
    border: 1px solid var(--color-slate-200);
    box-shadow:
      0 1px 3px 0 rgba(var(--color-slate-900-rgb), 0.1),
      0 1px 2px -1px rgba(var(--color-slate-900-rgb), 0.1);
    overflow: hidden;
  }

  .stamped-pagination > div > span,
  #real-users #stamped-reviews-widget .stamped-pagination > div > span {
    padding: 0px;
  }

  #stamped-pagination-prev a,
  #stamped-pagination-next a,
  #real-users #stamped-reviews-widget #stamped-pagination-prev a,
  #real-users #stamped-reviews-widget #stamped-pagination-next a {
    padding-left: 0.875rem;
    padding-right: 0.875rem;
  }

  #stamped-pagination-prev,
  #pages span,
  #real-users #stamped-reviews-widget #stamped-pagination-prev,
  #real-users #stamped-reviews-widget #pages span {
    border-right: 1px solid var(--color-slate-200);
  }

  span.stamped-pagination-deco,
  #real-users #stamped-reviews-widget span.stamped-pagination-deco {
    display: inline-block;
    height: 100%;
    padding-left: 0.625rem;
    padding-right: 0.625rem;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-top: 0.375rem;
  }
  /************************************************
* END Pagination styling
************************************************/

  /************************************************
* START Color styling
************************************************/

  /** Brand orange to the colored chart bars and to the review submit button **/
  .summary-rating-bar-content,
  #stamped-button-submit {
    background: var(--color-brand) !important;
  }

  /** Brand orange to add stars **/
  .stamped-fa-star,
  .stamped-starrating a {
    color: var(--color-brand) !important;
  }

  /** text-slate-500 to the stars to the left of the chart **/
  .summary-rating-title:before {
    color: var(--color-brand) !important;
  }

  /** text-slate-600 **/
  #stamped-main-widget .stamped-container,
  .stamped-fa-thumbs-down,
  .stamped-fa-thumbs-up,
  .stamped-tabs,
  .summary-rating-title,
  div[data-widget-style="standard"] .summary-rating-count,
  #stamped-main-widget .stamped-review-variant,
  .stamped-container ul.stamped-tabs li,
  .stamped-reviews-search-text,
  #stamped-sort-select,
  #stamped-sort-select2,
  .stamped-summary-ratings,
  div[data-widget-style*="standard"] .summary-rating-count {
    color: var(--color-slate-600) !important;
  }

  /* border-slate-200 */
  #stamped-sort-select,
  #stamped-sort-select2 {
    border: 1px solid var(--color-slate-200) !important;
  }

  /* border-slate-600 */
  .stamped-container ul.stamped-tabs li.active {
    border-color: var(--color-slate-600) !important;
  }

  /* text-slate-300 */
  .stamped-review-avatar {
    color: var(--color-slate-400);
  }

  /* text-slate-100 */
  .summary-rating-bar {
    background: var(--color-slate-100);
  }

  /* text-slate-500 */
  .stamped-review-header .created,
  .stamped-review-header-byline .created {
    color: var(--color-slate-500);
  }

  /** text-slate-600 **/
  span.stamped-summary-recommend-percent {
    background: var(--color-slate-600);
  }

  /* text-slate-100 */
  a.stamped-reviews-title,
  li#tab-questions[data-count][data-new-tab]:after,
  li#tab-reviews[data-count]:after {
    background: var(--color-slate-100);
  }

  /* Apply .btn-xl to the submit button*/

  #stamped-button-submit,
  .stamped-file-uploader-btn {
    padding-left: 0.875rem !important;
    padding-right: 0.875rem !important;
    padding-top: 0.625rem !important;
    padding-bottom: 0.625rem !important;
    font-size: 0.875rem !important;
    line-height: 1.25rem !important;
    margin-top: 0;
  }

  /* Apply .btn-secondary styling to the Add photos and new review buttons. !important is to override inline styles text-slate-700 border-border*/
  .stamped-file-uploader-btn,
  .stamped-summary-actions-newreview {
    border-width: 2px !important;
    border-color: var(--color-slate-300) !important;
    border-radius: 0.375rem !important;
    color: var(--color-slate-700) !important;
    cursor: pointer;
    font-weight: 500 !important;
    font-variation-settings: "wght" 500 !important;
    box-shadow: none !important;
    max-width: 10rem !important;
  }

  .stamped-file-uploader-btn:hover,
  .stamped-summary-actions-newreview:hover {
    background-color: var(--color-slate-50) !important;
    color: var(--color-slate-950) !important;
  }

  .stamped-file-uploader-btn:active,
  .stamped-summary-actions-newreview:active {
    background-color: var(--color-slate-200) !important;
  }

  .stamped-container[data-widget-show-product-variant="true"]
    .stamped-review-product
    a {
    color: var(--color-slate-700) !important;
  }

  ul.stamped-summary-keywords-list li {
    color: var(--color-slate-500) !important;
    font-weight: 700 !important;
    font-variation-settings: "wght" 700 !important;
    padding: 0.375rem 1rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    background: var(--color-slate-100);
    border-radius: 0.25rem;
    margin: 0 0.5rem 0.5rem 0;
  }

  /************
 Icons
************/
  /* Apply green-600 to verified badge */
  .stamped-verified-badge,
  .stamped-review[data-verified="buyer"] .stamped-review-avatar:before {
    color: var(--color-green-600);
  }

  /************************************************
* END Color styling
************************************************/

  /************************************************
* START Forms styling
************************************************/
  /* Copied over our from CSS */
  #stamped-reviews-search-input {
    appearance: none;
    border-color: rgba(228, 231, 235, 1);
    border-radius: 0.375rem;
    border-width: 1px;
    overflow: hidden;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    padding-left: 1.75rem;
    padding-right: 1.25rem;
    font-size: inherit;
    height: auto;
    color: inherit;
  }

  /* Adjust form labels to text-slate-700 */
  .stamped-form-label {
    color: var(--color-slate-700) !important;
    font-size: 0.875rem !important;
    line-height: 1.25rem !important;
    font-weight: 500 !important;
    font-variation-settings: "wght" 500 !important;
  }

  /* Adjust radio button to our size */

  input[type="radio"],
  .stamped-form-review-recommend input,
  .stamped-form-review-recommend-product input {
    height: 1rem !important;
  }

  .stamped-form-actions {
    text-align: center;
    margin-top: 0.75rem;
    margin-bottom: 0.75rem;
  }

  /************************************************
* END Color styling
************************************************/

  .stamped-review-recommend[data-is-recommend="true"]:before {
    margin-right: 0.5rem;
  }

  .stamped-summary-actions-clear,
  .stamped-summary-actions-mobile-filter,
  .stamped-summary-actions-newquestion,
  .stamped-summary-actions-newreview {
    margin: 0.75rem;
  }

  .stamped-tab-container {
    color: var(--color-slate-700) !important;
    font-weight: 700 !important;
    font-variation-settings: "wght" 700 !important;
  }
}

.stamped-summary-keywords-list {
  max-height: 100% !important;
}
/* Hide the add to cart buttons on the light box when a user clicks a Instagram photo */
.stamped-ugc-modal-tags {
  display: none !important;
}

/* Hide the SHOP THE LOOK text on hovering over Instagram photos */
.stamped-instagram-media-hover-content-wrapper {
  font-size: 0 !important;
  line-height: 0 !important;
}

/* Always show Instagram logo and make it larger*/
.stamped-instagram-media-hover-content,
.stamped-instagram-media-hover-content-wrapper:before {
  content: "\f16d";
  display: flex;
  font-family: "stamped-font", "FontAwesome";
  font-size: 4rem;
  opacity: 50%;
  color: var(--color-slate-100);
}

/* The Verified by Shop badge gets massive and drops a line for some reason */
#stamped-main-widget .stamped-review-header img {
  max-width: 6rem !important;
  display: inline-block !important;
}