/*

Please add any custom CSS code in here, it will be easier to transfer if updating themes.

We highly recommend labelling changes, or App installs, so these can also be updated or removed as needed.

*/
/* HC - Various adjustments - 16 May '22 */
.template-product .breadcrumb{
  visibility: hidden;
}
.fresh-badge.sale-badge, .fresh-badge.sold-out-badge, 
.fresh-badge.coming-soon-badge, .fresh-badge.last-units-badge, 
.fresh-badge.new-badge, .fresh-badge.best-seller-badge{
  width: 75px;
  height: 75px;
  display: flex;
  align-items: center;
  padding: 0;
  justify-content: center;
  border-radius: 50%;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  line-height: 18px;
}
.swatch-element.soldout {
  /*opacity: 0.5;*/
  text-decoration: line-through;
}
.collection_swatches .swatch {
  display: inline-block;
  margin: 0 2px;
}
.collection_swatches .swatch span {
  width: 15px;
  min-width: 15px;
  height: 15px;
  float: none;
  display: block;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  border-radius:50%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}
.indiv-product .hp-title {
  margin-bottom: 0;
  padding-bottom: 0;
}
.collection_swatches {
  display: flex;
  align-items: center;
}
.hc-available {
  margin-right: 10px;
}
.hc-slider .slick-dots {
  position: initial;
}
.slick-list.draggable {
  margin-bottom: 0;
}
.slick-dots li button {
  background: #C3C3C3 !important;
  border-radius: 50%;
  width: 12px !important;
  height: 12px !important;
}
.slick-dots li.slick-active button{
  background: #000 !important;
  border-radius: 50%;
  width: 12px !important;
  height: 12px !important;
}
.hc-slider{
  text-align: center;
}
.hc-slider img{
  margin: 0 auto;
}
.row.text-advert-section {
  justify-content: center;
}
@media screen and (max-width: 480px){
  .site-header__logo-image img {
    width: 95px;
  }
  /*.fresh-badge.sale-badge, .fresh-badge.sold-out-badge, 
  .fresh-badge.coming-soon-badge, .fresh-badge.last-units-badge, 
  .fresh-badge.new-badge, .fresh-badge.best-seller-badge {
    width: 45px;
    height: 45px;
    font-size: 11px;
    line-height: 13px;
  }*/
  .collection_swatches {
    display: block;
  }

  .collection_swatches .swatch {
    margin: 0px;
  }

  .collection_swatches .swatch span {
    width: 12px;
    min-width: 12px;
    height: 12px;
  }

  .hc-available {
    display: block;
    margin-bottom: 10px;
  }
  .product-description-wrapper.mt-3 iframe {
    width: 100%;
  }
  .hc-desktop {
    display: none;
  }
  .product-single__thumbnail__wrapper {
    padding-top: 0 !important;
  }
  #product-box .sale-badge {
    margin-top: 15px;
  }
  .product-single__media__emblem {
    position: absolute;
    right: 5px;
    top: 5px;
    min-width: 20px;
    min-height: 20px;
    width: 25%;
    padding-bottom: 25%;
    background-color: var(--page-background);
      color: var(--color-primary);
        border: 1px solid rgba(var(--color-primary),.05);
          }

  /* HC - Show AR button in mobile - 10 Jun '22 */
  .hc-mobile-slider .button-wrap {
  	margin-top: 15px;
  }
  .product-medias.col-md-6 {
    padding: 0;
  }
  /* HC - Fix to align dots with AR button in mobile - 10 Jun '22 */
  .hc-swiper-pagination.swiper-pagination-bullets {
    display: flex; 
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    justify-content: center;
    align-items: center;
    padding: 0 10px;
    text-align: center;
    position: absolute;
    z-index: 999;
    bottom: 3%;
    left: 50%;
    transform: translate(-50%, 0);
}
  }
  .hc-swiper-pagination .swiper-pagination-bullet{
    width: 8px;
    height: 8px;
  }
  .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: grey;
    width: 12px;
    height: 12px;
  }
  .template-product .breadcrumb {
    display: none;
  }
}
.swatch { 
  margin:1em 0; 
}
/* Label */
.swatch .header {
  margin: 0.5em 0;
}
/* Hide radio buttons.*/
.swatch input { 
  display:none;
}
.swatch label {
  /* Rounded corners */
  -webkit-border-radius:2px;
  -moz-border-radius:2px;
  border-radius:2px;
  /* To give width and height */
  float:left;
  /* Color swatches contain no text so they need to have a width. */
  min-width: 41px ; 
  height: 41px;
  /* No extra spacing between them */
  margin:0;
  /* Background color */
  background-color:#ddd;
  /* Styling text */
  font-size:13px;
  text-align:center;
  line-height: 35px;
  white-space:nowrap;
  padding-left: 30px;
}
.swatch-element label { padding:0 10px; }
.color.swatch-element label { 
  padding:0; 
  border-radius: 50%;
  cursor: pointer;
}
/* Styling selected swatch */
/* Slightly raised */
.swatch .color input:checked + label {
  border-color:transparent;
} 
.swatch .swatch-element {
  float:left;
  -webkit-transform:translateZ(0); /* webkit flicker fix */
  -webkit-font-smoothing:antialiased; /* webkit text rendering fix */
  /* Spacing between buttons */
  margin:0px 10px 10px 0;
  /* To position the sold out graphic and tooltip */
  position:relative;
}
/* Image with the cross in it */
.crossed-out { position:absolute; width:100%; height:100%; left:0; top:0; }
.swatch .swatch-element .crossed-out { display:none; }
.swatch .swatch-element.soldout .crossed-out { display:block; }
/*
.swatch .swatch-element.soldout label {
  filter: alpha(opacity=20); internet explorer
  -khtml-opacity: 0.2;      khtml, old safari
  -moz-opacity: 0.2;       mozilla, netscape 
  opacity: 0.2;           fx, safari, opera 
}*/
/* Tooltips */
.swatch .tooltip {
  text-align:center;
  background:gray;
  color:#fff;
  bottom:100%;
  padding: 10px;
  display:block;
  position:absolute;
  width:100px;
  left:{{ '50px' | remove: 'px' | to_number | divided_by: 2 | minus: 50 | plus: 2 }}px;
  margin-bottom:15px;
  /* Make it invisible by default */
  filter:alpha(opacity=0);
  -khtml-opacity: 0;
  -moz-opacity: 0;
  opacity:0;
  visibility:hidden;
  /* Animations */
  -webkit-transform: translateY(10px);
  -moz-transform: translateY(10px);
  -ms-transform: translateY(10px);
  -o-transform: translateY(10px);
  transform: translateY(10px);
  -webkit-transition: all .25s ease-out;
  -moz-transition: all .25s ease-out;
  -ms-transition: all .25s ease-out;
  -o-transition: all .25s ease-out;
  transition: all .25s ease-out;
  -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
  -moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
  -ms-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
  -o-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
  box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
  z-index: 10000;
  -moz-box-sizing:border-box; 
  -webkit-box-sizing:border-box; 
  box-sizing:border-box;
}
.swatch .tooltip:before {
  bottom:-20px;
  content:" ";
  display:block;
  height:20px;
  left:0;
  position:absolute;
  width:100%;
}
/* CSS triangle */
.swatch .tooltip:after {
  border-left:solid transparent 10px;
  border-right:solid transparent 10px;
  border-top:solid gray 10px;
  bottom:-10px;
  content:" ";
  height:0;
  left:50%;
  margin-left:-13px;
  position:absolute;
  width:0;
}
.swatch .swatch-element:hover .tooltip {
  filter:alpha(opacity=100);
  -khtml-opacity:1;
  -moz-opacity:1;
  opacity:1;
  visibility:visible;
  -webkit-transform:translateY(0px);
  -moz-transform:translateY(0px);
  -ms-transform:translateY(0px);
  -o-transform:translateY(0px);
  transform:translateY(0px);
}
.swatch.error {
  background-color:#E8D2D2!important;
  color:#333!important;
  padding:1em;
  border-radius:5px;
}
.swatch.error p {
  margin:0.7em 0;
}
.swatch.error p:first-child {
  margin-top:0;
}
.swatch.error p:last-child {
  margin-bottom:0;
}
.swatch.error code {
  font-family:monospace;
}
.input-field.product-option-select {
  display: none;
}
.swatch .swatch-element.soldout .crossed-out {
  height: 100%;
}
.swatch-element:not(.color), .swatch-element:not(.color) label {
  display: block;
  float: unset;
  width: 100%;
  background: transparent;
  text-align: left;
  cursor: pointer;
  border: 1px solid #ddd;
  height: 40px;
}
.swatch .color{
  position: relative;
}
.swatch .color input:checked + label:after {
  content: '';
  width: 50px;
  height: 50px;
  border: 2px solid #000;
  display: block;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.swatch :not('.color') input:checked + label {
  border: 2px solid;
}
.swatch-element:not(.color) input:checked + label {
  border: 2px solid;
}
.swatch-element:not(.color) input:checked+label .hc-value {
  font-weight: 800;
}
.checkboxContainer {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.checkboxContainer input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.checkboxMarked {
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
  height: 15px;
  width: 15px;
  background-color: #fff;
  border: 2px solid #ddd;
  border-radius: 50%;
}
.checkboxContainer input:checked ~ .checkboxMarked {
  background-color: #80d6d6;
}
.checkboxMarked:after {
  content: "";
  position: absolute;
  display: none;
}
.checkboxContainer input:checked ~ .checkboxMarked:after {
  display: block;
}
.checkboxContainer .checkboxMarked:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.hc-value{
  padding-left: 30px;
}
.swatch-element:not(.color) input:checked+label .checkboxMarked {
  background: #000;
}
.discount-wrapper {
  position: absolute;
  right: 10px;
  top: 0;
  bottom: 0;
  margin: auto;
  height: 60%;
  width: 25%;
  border-radius: 10px;
  background-color: red;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--header-font-stack);
}
.product-single__thumbnail__wrapper {
  opacity: 0;
}
.hc-mobile{
  display: none;
}
.collection-template .compare-at-price {
  display: none;
}
.hc-value {
  padding-left: 30px;
  font-size: 17px;
}
section.hc-rich-text.homepage-sections-wrapper {
  padding-top: 0;
}
@media only screen and (max-width: 480px){
  .hc-mobile{
    display: block;
    height: auto;
  }
  .hc-desktop{
    display: none;
  }
  .shopify-section .homepage-sections-wrapper {
    padding: 30px 0 !important;
  }
  .shopify-section.homepage-section--video-wrapper .homepage-sections-wrapper {
    padding-bottom: 0;
  }
  section.hc-rich-text.homepage-sections-wrapper {
    padding-top: 0 !important;
  }
  .row.image-bar.hc-slider.slick-initialized.slick-slider.slick-dotted {
    margin-bottom: 0;
  }
  .discount-wrapper {
    width: 35%;
  }
}

/* HC - Product options styles, pages text max-width and stamped app - 06 Jun '22 */
.swatch .swatch-element:not(.color), .swatch .swatch-element:not(.color) label {
	height: 64px;
}

.swatch .hc-related-check .hc-value {
	line-height: 64px;
    padding-left: 45px;
}

.checkboxMarked {
	border: none;
    height: 12px;
    width: 12px;
  	left: 25px;
}

.checkboxMarked:before {
	content: '';
  	background-color: transparent;
  	border: 1px solid black;
  	position: absolute;
    width: 24px;
    height: 24px;
    left: -50%;
    top: -50%;
  	border-radius: 100%;
    z-index: 0;
}

button#purchase {
	padding: 20px 30px;
}

#stamped-reviews-widget[data-widget-type=carousel] .stamped-carousel-scroll .stamped-reviews-message-block {
    font-style: normal !important;
}

.stamped-carousel-title{
    display: none;
}
  
.stamped-carousel-stars-wrapper{
    display: none;
    
}

.stamped-carousel-subtitle{
    float: left!important;
} 

.stamped-carousel-subtitle-count{ 
	font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
    float: left;
}  
  
#stamped-reviews-widget[data-widget-type=carousel] .stamped-carousel-buttons
{
   display:none;
}     
  
span.stamped-carousel-subtitle-count {
    display: none;
}

#stamped-reviews-widget[data-widget-type=carousel] .stamped-carousel-scroll:before {
     border-bottom:none;
}
  
[data-section-id="1644609798ae9cd04e"] h1 {
    margin-bottom: 0em;
}

@media (min-width:1025px) {
  .page p, .page blockquote,
  .page h5, .page h4, .page h3, .page h2, .page h1,
  .page .entry-content div, .page ul {
      max-width: 700px;
      margin-left: auto !important;
      margin-right: auto !important;
  }
}

@media screen and (max-width: 390px) {
  .swatch label {
    min-width: 35px;
    height: 35px;
  }

  .swatch .color input:checked+label:after {
    width: 44px;
    height: 44px;
  }
}