/** Shopify CDN: Minification failed

Line 286:0 Unexpected ".3d-wrap"
Line 291:0 Unexpected ".3d-wrap"
Line 298:0 Unexpected ".3d-wrap"

**/
.check.box label img {
    height: 30px !important;
    width: 30px !important;
}
/* span.img.img-multiply-bg-custom {
    height: 36px;
    width: 30px;
} */

span.img.img-multiply-bg-custom {
    height: 58px;
    width: 58px;
    background-size: cover !important;
}
/* span.img.img-multiply-bg-custom {
     left: -0.1px;
} */
li.custom-color-li label {
    padding: 0px !important;
}
#main-product-content .has-select .check.box label img {
    object-fit: cover;
    height: 58px !important;
    width: 58px !important;
}
#main-product-content .has-select .check.box label{
  padding:1px;
}

#main-product-content.amko-3d .has-select .check.box label,
#main-product-content.amko-3d .has-select .check.box label {
  padding: 1px;
}

body .l4cl .product-card ul.check.box li img {
    object-fit: cover;
    height: 26px !important;
    width: 26px !important;
}
body .l4cl .product-card ul.check.box li label {
    padding: 0px;
    min-height: 26px;
    min-width: 26px;
}

body .l4cl .product-card ul.check.box li label a{
      text-decoration: none !important;
}
body .l4cl .product-card ul.check.box li label span {
    padding: calc(var(--pd)* 0.5 - 4px) calc(var(--pd) - 4px);
      color: var(--input_fg);

}
 .l4cl .product-card ul.check.box li label:after, .l4cl .product-card ul.check.box li label:after {
    display:none;
}
label span.custom-color-var {
    font-weight: var(--main_fw_h);
}
@media only screen and (max-width: 760px) {
  span.img.img-multiply-bg-custom {
    height: 53px;
    width: 53px;
}
ul.custom-color-check {
    display: flex;
}
span.custom-color-var {
    position: relative;
    left: 0;
    top: 0;
    z-index: 2;
    margin-bottom: var(--main_mr_x025);
    color: inherit /*var(--primary_text_h)*/;
    font-weight: var(--main_fw_h);
    line-height: var(--main_lh_h);
}
      #main-product-content .has-select .check.box label img {
        height: 53px !important;
        width: 53px !important;
    }
  #main-product-content .has-select .check.box label {
    padding: 0px;
}
}

/* =========================================================
   AMKO 3d gallery (scoped + authoritative)
   Keep ALL 3d rules under .amko-gallery--3d
   ========================================================= */

/* 3D viewer sizing (model-viewer element) */
.amko-gallery--3d model-viewer{
  width:100%;
  height:100%;
  min-height:520px; /* adjust if your main image area is taller/shorter */
  display:block;
}

/* Gallery layout (main + thumbnails under) */
.amko-gallery--3d{
  display:flex;
  flex-direction:column; /* thumbs UNDER main */
  gap:12px;
}

/* Main media area (image OR 3D) */
.amko-gallery--3d .amko-main{
  width:100%;
  margin-inline:auto;
}

/* Match old PDP scale */
@media (min-width: 1000px){
  .amko-gallery--3d .amko-main{
    max-width:460px;
    margin-inline:auto;
  }

  /* Wide mode (other images) */
  .amko-gallery--3d.amko-main--wide .amko-main{
    max-width:624px;
  }
}

/* Tablet */
@media (min-width: 760px) and (max-width: 999px){
  .amko-gallery--3d .amko-main{
    max-width:420px;
    margin-inline:auto;
  }

  .amko-gallery--3d.amko-main--wide .amko-main{
    max-width:540px;
  }
}

/* Main image + 3D wrapper share the same box styling */
.amko-gallery--3d .amko-main__image,
.amko-gallery--3d .amko-main__3d{
  width:100%;
  border-radius:14px;
  overflow:hidden;
}

/* Main image */
.amko-gallery--3d .amko-main__image img{
  display:block;
  width:100%;
  height:auto;
}

/* ===== AMKO 3d thumbs layout (scoped) ===== */

.amko-gallery--3d .amko-thumbs{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;

  padding:12px 8px;
  background:transparent !important;
  box-shadow:none !important;
  border:0 !important;

  overflow:visible;
}

/* Left container: holds ONLY the 3D thumb */
.amko-gallery--3d .amko-thumbs__left{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  height:68px;
}

/* Right container: holds image thumbs, scrolls horizontally */
.amko-gallery--3d .amko-thumbs__right{
  flex:1 1 auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;

  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;

  flex-wrap:nowrap;
  min-width:0;

  padding-right:2px;
  height:68px;
}

/* Hard reset button visuals (theme is likely adding outlines/shadows) */
.amko-gallery--3d .amko-thumb{
  -webkit-appearance:none;
  appearance:none;

  border:1px solid rgba(0,0,0,.18) !important;
  background:#fff !important;
  box-shadow:none !important;
  outline:none !important;

  width:56px !important;
  height:56px !important;
  min-width:56px !important;
  max-width:56px !important;

  padding:4px !important;
  margin:0;

  border-radius:10px;
  cursor:pointer;

  display:flex;
  align-items:center;
  justify-content:center;

  line-height:0;
  overflow:hidden;
}

/* Kill focus ring / pseudo overlays some themes add */
.amko-gallery--3d .amko-thumb:hover,
.amko-gallery--3d .amko-thumb:focus,
.amko-gallery--3d .amko-thumb:focus-visible{
  outline:none !important;
  box-shadow:none !important;
}

/* Kill theme pseudo-element overlays (your black ::before culprit) */
.amko-gallery--3d .amko-thumb::before,
.amko-gallery--3d .amko-thumb::after{
  content:none !important;
  display:none !important;
}

/* Thumbnail image */
.amko-gallery--3d .amko-thumb img{
  display:block;
  width:100% !important;
  height:100% !important;
  object-fit:contain;
  background:transparent !important;
  border-radius:8px;
}

/* Mobile tweaks */
@media only screen and (max-width: 760px){
  .btn-mobile-wide .amko-gallery--3d .amko-thumb{
    width:56px !important;
    height:56px !important;
    min-width:56px !important;
    max-width:56px !important;
  }

  #main-product-content.amko-3d .has-select .check.box label img{
    object-fit:cover;
    height:auto !important;
    width:auto !important;
  }

  .amko-gallery--3d .amko-thumbs__right{
    justify-content:flex-start;
  }
}

/* Active state */
.amko-gallery--3d .amko-thumb.is-active{
  border-color:rgba(0,0,0,.55) !important;
}

/* 3d only: enforce hidden swapping */
.amko-gallery--3d [hidden]{ display:none !important; }

/* Keep model-viewer sizing stable */
.3d-wrap .3d-viewer {
  width: 100%;
}

/* If you already have a min-height elsewhere, you can omit this */
.3d-wrap .3d-viewer model-viewer {
  width: 100%;
  height: 100%;
  min-height: 520px;
  display: block;
}

.3d-wrap .amko-3d-disclaimer {
  margin-top: 6px;
  font-size: 18px;
  line-height: 1.4;
  opacity: 0.7;
  text-align: center;
}