/* Final product modal layout override. Loaded after product-modal.css. */
html.is-modal-open,
html.is-modal-open body{
  overflow:hidden !important;
}

#productModal.pmodal{
  z-index:70000 !important;
  padding:0 !important;
  background:rgba(246,239,233,.5) !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}

#productModal .pmodal__overlay,
#productModal .pmodal__overlay::before,
#productModal .pmodal__overlay::after{
  background:transparent !important;
  filter:none !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}

#productModal .pmodal__dialog{
  box-sizing:border-box !important;
  background:#fff !important;
  transform:none !important;
}

#productModal .pmodal__photoFrame,
#productModal .pmodal__slider{
  overflow:hidden !important;
}

#productModal .pmodal__img,
#productModal .pmodal__slider .pmodal__img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-position:center center !important;
}

#productModal .pmodal__nav{
  font-size:0 !important;
  line-height:0 !important;
  color:#93645f !important;
}

#productModal .pmodal__nav::before{
  content:"" !important;
  display:block !important;
  width:10px !important;
  height:10px !important;
  border:solid currentColor !important;
  border-width:0 1.8px 1.8px 0 !important;
  transform:rotate(-45deg) !important;
}

#productModal .pmodal__nav--prev::before{
  transform:rotate(135deg) !important;
}

#productModal .pmodal__nav::after{
  content:none !important;
  display:none !important;
}

#productModal .pmodal__pager .pmodal__nav[hidden]{
  display:none !important;
}

@media (min-width:921px){
  #productModal.pmodal{
    align-items:stretch !important;
    justify-content:flex-start !important;
  }

  #productModal .pmodal__dialog{
    width:min(1060px,100vw) !important;
    max-width:100vw !important;
    height:100dvh !important;
    max-height:100dvh !important;
    min-height:100dvh !important;
    margin:0 !important;
    border-radius:14px !important;
    overflow:hidden !important;
  }

  #productModal .pmodal__grid{
    display:grid !important;
    grid-template-columns:minmax(0,60%) minmax(320px,40%) !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
  }

  #productModal .pmodal__media{
    height:100% !important;
    padding:24px 18px 24px 18px !important;
    border-right:1px solid rgba(137,107,101,.16) !important;
    overflow:hidden !important;
  }

  #productModal .pmodal__mediaInner{
    display:grid !important;
    grid-template-columns:84px minmax(0,1fr) !important;
    grid-template-rows:auto auto 1fr !important;
    grid-template-areas:
      "thumbs slider"
      "pager badges"
      ". ." !important;
    column-gap:16px !important;
    row-gap:10px !important;
    align-content:start !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
  }

  #productModal .pmodal__slider{
    grid-area:slider !important;
    position:relative !important;
    align-self:start !important;
    justify-self:center !important;
    width:min(100%,520px) !important;
    height:auto !important;
    max-height:min(570px,calc(100dvh - 178px)) !important;
    min-height:0 !important;
    aspect-ratio:.92 / 1 !important;
    margin-top:64px !important;
    border-radius:14px !important;
    background:#fff !important;
  }

  #productModal .pmodal__photoFrame{
    width:100% !important;
    height:100% !important;
    border-radius:14px !important;
  }

  #productModal .pmodal__img,
  #productModal .pmodal__slider .pmodal__img{
    object-fit:cover !important;
  }

  #productModal .pmodal__zoom{
    top:14px !important;
    right:14px !important;
    width:42px !important;
    height:42px !important;
    z-index:3 !important;
  }

  #productModal .pmodal__thumbs{
    align-self:start !important;
    display:flex !important;
    flex-direction:column !important;
    width:84px !important;
    height:auto !important;
    max-height:calc(100dvh - 116px) !important;
    gap:14px !important;
    padding:2px !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    scrollbar-width:none !important;
  }

  #productModal .pmodal__thumbs::-webkit-scrollbar{
    display:none !important;
  }

  #productModal .pmodal__thumbRail{
    grid-area:thumbs !important;
    align-self:start !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    width:84px !important;
    gap:10px !important;
    max-height:calc(100dvh - 44px) !important;
    overflow:visible !important;
  }

  #productModal .pmodal__thumb{
    width:78px !important;
    height:98px !important;
    flex:0 0 98px !important;
    padding:3px !important;
    border-radius:9px !important;
    box-sizing:border-box !important;
    object-fit:cover !important;
  }

  #productModal .pmodal__pager{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:84px !important;
    height:42px !important;
    align-self:start !important;
    transform:none !important;
  }

  #productModal .pmodal__nav{
    position:static !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:38px !important;
    height:38px !important;
    border-radius:50% !important;
    transform:none !important;
  }

  #productModal .pmodal__pager .pmodal__nav{
    display:none !important;
  }

  #productModal.has-many-images .pmodal__pager .pmodal__nav--next{
    display:flex !important;
  }

  #productModal .pmodal__pager .pmodal__nav--next::before{
    transform:rotate(45deg) !important;
  }

  #productModal .pmodal__badges--media{
    grid-area:badges !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:12px !important;
    justify-self:center !important;
    width:min(100%,520px) !important;
    margin:0 !important;
  }

  #productModal .pmodal__badges--content{
    display:none !important;
  }

  #productModal .pmodal__badge{
    min-width:126px !important;
    min-height:34px !important;
    padding:0 13px !important;
    border-radius:999px !important;
    font-size:12px !important;
  }

  #productModal .pmodal__content{
    height:100% !important;
    padding:44px 40px 28px !important;
    gap:14px !important;
    overflow-y:auto !important;
  }

  #productModal .pmodal__close{
    top:28px !important;
    right:28px !important;
    width:44px !important;
    height:44px !important;
  }

  #productModal .pmodal__title{
    font-size:31px !important;
    line-height:1.08 !important;
  }

  #productModal .pmodal__price{
    font-size:24px !important;
    line-height:1.1 !important;
    gap:10px !important;
  }

  #productModal .pmodal__desc,
  #productModal .pmodal__text{
    font-size:15px !important;
    line-height:1.42 !important;
  }

  #productModal .pmodal__label{
    font-size:15px !important;
  }

  #productModal .pmodal__sizeList{
    gap:12px !important;
  }

  #productModal .pmodal__size{
    width:70px !important;
    min-width:70px !important;
    height:66px !important;
  }

  #productModal .pmodal__sizeCode{
    font-size:16px !important;
  }

  #productModal .pmodal__sizeLabel{
    font-size:11px !important;
  }

  #productModal .pmodal__qty{
    width:122px !important;
    height:38px !important;
    grid-template-columns:38px 46px 38px !important;
  }

  #productModal .pmodal__qtybtn,
  #productModal .pmodal__qtyinput{
    width:auto !important;
    height:36px !important;
    font-size:15px !important;
  }

  #productModal .pmodal__actions .card__btnrow{
    grid-template-columns:minmax(0,190px) 46px !important;
    gap:14px !important;
  }

  #productModal .pmodal__actions .btn--buy{
    min-width:0 !important;
    width:190px !important;
    height:46px !important;
    font-size:15px !important;
  }

  #productModal .pmodal__actions .btn--cart{
    width:46px !important;
    min-width:46px !important;
    height:46px !important;
  }

  #productModal .pmodal__panelHead{
    min-height:48px !important;
    font-size:15px !important;
  }
}

@media (max-width:920px){
  #productModal.pmodal{
    inset:0 !important;
    align-items:stretch !important;
    justify-content:stretch !important;
    width:100vw !important;
    height:100dvh !important;
    min-height:100dvh !important;
    background:#fff !important;
  }

  #productModal .pmodal__dialog{
    width:100vw !important;
    max-width:none !important;
    min-width:100vw !important;
    height:100dvh !important;
    max-height:100dvh !important;
    min-height:100dvh !important;
    margin:0 !important;
    border-radius:0 !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    box-shadow:none !important;
  }

  #productModal .pmodal__grid{
    display:block !important;
    width:100% !important;
    min-height:0 !important;
  }

  #productModal .pmodal__media{
    padding:0 !important;
    border:0 !important;
    overflow:visible !important;
  }

  #productModal .pmodal__mediaInner{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
    grid-template-areas:
      "slider"
      "thumbRail" !important;
    gap:8px !important;
    width:100% !important;
    height:auto !important;
    padding:10px 12px 0 !important;
    box-sizing:border-box !important;
  }

  #productModal.is-image-after-first .pmodal__mediaInner{
    grid-template-areas:
      "slider"
      "thumbRail" !important;
  }

  #productModal .pmodal__slider{
    grid-area:slider !important;
    width:100% !important;
    height:auto !important;
    max-height:none !important;
    aspect-ratio:1.16 / 1 !important;
    border-radius:18px !important;
    background:#fff !important;
  }

  #productModal .pmodal__photoFrame{
    width:100% !important;
    height:100% !important;
    border-radius:18px !important;
  }

  #productModal .pmodal__img,
  #productModal .pmodal__slider .pmodal__img{
    object-fit:cover !important;
  }

  #productModal .pmodal__zoom{
    display:none !important;
  }

  #productModal .pmodal__close{
    top:18px !important;
    right:18px !important;
    width:42px !important;
    height:42px !important;
    z-index:5 !important;
  }

  #productModal .pmodal__thumbs{
    grid-area:thumbs !important;
    display:flex !important;
    width:100% !important;
    height:56px !important;
    border-radius:12px !important;
    gap:8px !important;
    padding:0 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scrollbar-width:none !important;
  }

  #productModal .pmodal__thumbRail{
    grid-area:thumbRail !important;
    display:grid !important;
    grid-template-columns:46px minmax(0,1fr) 46px !important;
    grid-template-areas:". thumbs pager" !important;
    align-items:center !important;
    gap:8px !important;
    width:100% !important;
    height:56px !important;
    min-width:0 !important;
  }

  #productModal.is-image-after-first .pmodal__thumbRail{
    grid-template-areas:"pager thumbs ." !important;
  }

  #productModal .pmodal__thumbs::-webkit-scrollbar{
    display:none !important;
  }

  #productModal .pmodal__thumb{
    width:66px !important;
    height:54px !important;
    flex:0 0 66px !important;
    padding:2px !important;
    border-radius:10px !important;
    box-sizing:border-box !important;
    object-fit:cover !important;
  }

  #productModal .pmodal__pager{
    grid-area:pager !important;
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:46px !important;
    height:56px !important;
    transition:opacity .2s ease, filter .2s ease !important;
    transform:translateX(0) !important;
  }

  #productModal.is-image-after-first .pmodal__pager{
    transform:none !important;
  }

  #productModal.is-image-first .pmodal__nav--prev,
  #productModal.is-image-after-first .pmodal__nav--next{
    display:none !important;
  }

  #productModal.is-image-first .pmodal__nav--next,
  #productModal.is-image-after-first .pmodal__nav--prev{
    display:flex !important;
  }

  #productModal .pmodal__nav{
    position:static !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:40px !important;
    height:40px !important;
    border-radius:50% !important;
    transform:none !important;
    font-size:0 !important;
    line-height:0 !important;
    color:#93645f !important;
  }

  #productModal .pmodal__nav::before{
    content:"" !important;
    display:block !important;
    width:10px !important;
    height:10px !important;
    border:solid currentColor !important;
    border-width:0 1.8px 1.8px 0 !important;
    transform:rotate(-45deg) !important;
  }

  #productModal .pmodal__nav--prev::before{
    transform:rotate(135deg) !important;
  }

  #productModal .pmodal__nav::after{
    content:none !important;
    display:none !important;
  }

  #productModal .pmodal__badges,
  #productModal .pmodal__badges--media,
  #productModal .pmodal__badges--content{
    display:none !important;
  }

  #productModal .pmodal__content{
    width:100% !important;
    padding:12px 16px 18px !important;
    gap:9px !important;
    box-sizing:border-box !important;
  }

  #productModal .pmodal__title{
    font-size:24px !important;
    line-height:1.08 !important;
  }

  #productModal .pmodal__price{
    font-size:20px !important;
    line-height:1.1 !important;
    gap:8px !important;
  }

  #productModal .pmodal__desc,
  #productModal .pmodal__text{
    font-size:14px !important;
    line-height:1.36 !important;
  }

  #productModal .pmodal__label{
    font-size:14px !important;
  }

  #productModal .pmodal__divider{
    margin:0 !important;
  }

  #productModal .pmodal__sizeList{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:10px !important;
  }

  #productModal .pmodal__size{
    width:auto !important;
    min-width:0 !important;
    height:52px !important;
  }

  #productModal .pmodal__sizeCode{
    font-size:14px !important;
  }

  #productModal .pmodal__sizeLabel{
    font-size:10px !important;
  }

  #productModal .pmodal__qty{
    width:96px !important;
    height:32px !important;
    grid-template-columns:32px 32px 32px !important;
  }

  #productModal .pmodal__qtybtn,
  #productModal .pmodal__qtyinput{
    height:30px !important;
    font-size:14px !important;
  }

  #productModal .pmodal__actions .card__btnrow{
    display:grid !important;
    grid-template-columns:minmax(0,220px) 42px !important;
    justify-content:start !important;
    gap:9px !important;
  }

  #productModal .pmodal__actions .btn--buy{
    width:220px !important;
    min-width:0 !important;
    height:40px !important;
    font-size:14px !important;
  }

  #productModal .pmodal__actions .btn--cart{
    width:42px !important;
    min-width:42px !important;
    height:40px !important;
  }

  #productModal .pmodal__panelHead{
    min-height:44px !important;
    font-size:15px !important;
  }
}