/*!*********************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!../node_modules/resolve-url-loader/index.js??ruleSet[1].rules[1].use[3]!../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[4]!./styles/ar/ar.scss ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************************************/
/*
 * "See it on your wall" under the add-to-cart form. The button takes the theme's
 * outline pill when it has one (tt-pill tt-pill--outline); this file only lays it out
 * and sets the captions, on the shop's tokens with fallbacks.
 */
.ttp-ar {
  margin-top: 20px;
}
.ttp-ar[hidden] {
  display: none;
}

.ttp-ar__button {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 10px;
  width: 100%;
}
.ttp-ar__button[hidden] {
  display: none;
}
.ttp-ar__button svg {
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  width: 20px;
  height: 20px;
}

.ttp-ar__hint,
.ttp-ar__note {
  margin: 10px 0 0;
  font-size: 0.8125rem;
  font-size: var(--tt-size-caption, 0.8125rem);
  line-height: 1.5;
  color: currentcolor;
  color: var(--tt-ink-3, currentcolor);
}

.ttp-ar__note[hidden] {
  display: none;
}