/* Net Yadak v5.6.3 — installment purchase card matched to supplied design */
.nyp-figma-product .nyp-installment-box{
  padding:22px 16px 18px!important;
  border:1.5px solid #d5d9de!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:none!important;
}
.nyp-figma-product .nyp-installment-box h3{
  margin:0 8px 30px!important;
  color:#111!important;
  text-align:right!important;
  font-size:21px!important;
  line-height:1.25!important;
  font-weight:900!important;
}
.nyp-figma-product .nyp-installment-grid{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:18px!important;
  margin:0!important;
  direction:ltr!important;
}
.nyp-figma-product .nyp-installment-option{
  display:flex!important;
  flex-direction:column!important;
  gap:11px!important;
  min-width:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.nyp-figma-product .nyp-installment-option>span{
  display:block!important;
  margin:0!important;
  color:#17191d!important;
  text-align:center!important;
  font-size:13px!important;
  line-height:1.5!important;
  font-weight:500!important;
  white-space:nowrap!important;
}
.nyp-figma-product .nyp-mini-stepper{
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr) 42px!important;
  align-items:stretch!important;
  width:100%!important;
  height:58px!important;
  min-height:58px!important;
  border:1.5px solid #d2d5d8!important;
  border-radius:13px!important;
  background:#fff!important;
  overflow:hidden!important;
  direction:ltr!important;
  box-shadow:none!important;
}
.nyp-figma-product .nyp-mini-stepper>button{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:42px!important;
  min-width:42px!important;
  height:56px!important;
  min-height:56px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:#fff!important;
  color:#1e2024!important;
  font-size:28px!important;
  line-height:1!important;
  font-weight:400!important;
  box-shadow:none!important;
}
.nyp-figma-product .nyp-mini-stepper>button:hover,
.nyp-figma-product .nyp-mini-stepper>button:focus-visible{
  background:#f8f8f8!important;
  color:#111!important;
}
.nyp-figma-product .nyp-mini-stepper .nyp-stepper-value{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  min-width:0!important;
  height:56px!important;
  border-right:1px solid #e0e2e4!important;
  border-left:1px solid #e0e2e4!important;
  background:#fff!important;
  color:#111!important;
}
.nyp-figma-product .nyp-mini-stepper input{
  width:26px!important;
  min-width:26px!important;
  height:54px!important;
  min-height:54px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;
  color:#111!important;
  text-align:center!important;
  font-size:18px!important;
  line-height:54px!important;
  font-weight:600!important;
  appearance:textfield!important;
  -moz-appearance:textfield!important;
}
.nyp-figma-product .nyp-mini-stepper input::-webkit-outer-spin-button,
.nyp-figma-product .nyp-mini-stepper input::-webkit-inner-spin-button{
  -webkit-appearance:none!important;
  margin:0!important;
}
.nyp-figma-product .nyp-mini-stepper em{
  color:#111!important;
  font-size:14px!important;
  line-height:1!important;
  font-style:normal!important;
  font-weight:500!important;
}
.nyp-figma-product .nyp-installment-amount{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  direction:rtl!important;
  width:100%!important;
  min-height:52px!important;
  height:52px!important;
  margin:24px 0 0!important;
  padding:0 16px!important;
  border:0!important;
  border-radius:12px!important;
  background:#d9f4c2!important;
  color:#111!important;
}
.nyp-figma-product .nyp-installment-amount span{
  margin:0!important;
  color:#111!important;
  font-size:14px!important;
  line-height:1!important;
  font-weight:500!important;
}
.nyp-figma-product .nyp-installment-amount b{
  margin:0!important;
  color:#111!important;
  font-size:15px!important;
  line-height:1!important;
  font-weight:600!important;
  white-space:nowrap!important;
}
.nyp-figma-product .nyp-outline-btn{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  width:100%!important;
  min-height:58px!important;
  height:58px!important;
  margin:24px 0 0!important;
  padding:0 16px!important;
  border:2px solid #eca900!important;
  border-radius:13px!important;
  background:#fff!important;
  color:#17191d!important;
  font-size:18px!important;
  line-height:1!important;
  font-weight:600!important;
  box-shadow:none!important;
}
.nyp-figma-product .nyp-outline-btn .nyp-icon{
  width:27px!important;
  height:27px!important;
}
.nyp-figma-product .nyp-outline-btn:hover,
.nyp-figma-product .nyp-outline-btn:focus-visible{
  border-color:#dc9d00!important;
  background:#fffdf7!important;
  color:#111!important;
  box-shadow:none!important;
}
.nyp-figma-product .nyp-installment-amount.is-updating b{
  opacity:.45;
}

@media(max-width:1100px) and (min-width:821px){
  .nyp-figma-product .nyp-installment-box{padding:18px 13px 15px!important}
  .nyp-figma-product .nyp-installment-box h3{font-size:18px!important;margin-bottom:22px!important}
  .nyp-figma-product .nyp-installment-grid{gap:12px!important}
  .nyp-figma-product .nyp-installment-option>span{font-size:11px!important}
  .nyp-figma-product .nyp-mini-stepper{grid-template-columns:34px minmax(0,1fr) 34px!important;height:50px!important;min-height:50px!important}
  .nyp-figma-product .nyp-mini-stepper>button{width:34px!important;min-width:34px!important;height:48px!important;min-height:48px!important;font-size:23px!important}
  .nyp-figma-product .nyp-mini-stepper .nyp-stepper-value{height:48px!important}
  .nyp-figma-product .nyp-mini-stepper input{height:46px!important;line-height:46px!important;font-size:15px!important}
  .nyp-figma-product .nyp-mini-stepper em{font-size:12px!important}
  .nyp-figma-product .nyp-installment-amount{height:46px!important;min-height:46px!important;margin-top:18px!important}
  .nyp-figma-product .nyp-installment-amount span{font-size:12px!important}
  .nyp-figma-product .nyp-installment-amount b{font-size:13px!important}
  .nyp-figma-product .nyp-outline-btn{height:50px!important;min-height:50px!important;margin-top:18px!important;font-size:15px!important}
  .nyp-figma-product .nyp-outline-btn .nyp-icon{width:23px!important;height:23px!important}
}

@media(max-width:820px){
  .nyp-figma-product .nyp-installment-box{padding:18px 14px 16px!important;border-radius:14px!important}
  .nyp-figma-product .nyp-installment-box h3{margin:0 4px 22px!important;text-align:right!important;font-size:19px!important}
  .nyp-figma-product .nyp-installment-grid{grid-template-columns:1fr 1fr!important;gap:10px!important}
  .nyp-figma-product .nyp-installment-option>span{font-size:11px!important}
  .nyp-figma-product .nyp-mini-stepper{grid-template-columns:32px minmax(0,1fr) 32px!important;height:48px!important;min-height:48px!important;border-radius:11px!important}
  .nyp-figma-product .nyp-mini-stepper>button{width:32px!important;min-width:32px!important;height:46px!important;min-height:46px!important;font-size:22px!important}
  .nyp-figma-product .nyp-mini-stepper .nyp-stepper-value{height:46px!important;gap:3px!important}
  .nyp-figma-product .nyp-mini-stepper input{width:22px!important;min-width:22px!important;height:44px!important;line-height:44px!important;font-size:14px!important}
  .nyp-figma-product .nyp-mini-stepper em{font-size:11px!important}
  .nyp-figma-product .nyp-installment-amount{height:48px!important;min-height:48px!important;margin-top:18px!important;padding:0 12px!important;border-radius:11px!important}
  .nyp-figma-product .nyp-installment-amount span{font-size:12px!important}
  .nyp-figma-product .nyp-installment-amount b{font-size:13px!important}
  .nyp-figma-product .nyp-outline-btn{height:52px!important;min-height:52px!important;margin-top:18px!important;border-radius:11px!important;font-size:15px!important}
  .nyp-figma-product .nyp-outline-btn .nyp-icon{width:24px!important;height:24px!important}
}

@media(max-width:430px){
  .nyp-figma-product .nyp-installment-grid{grid-template-columns:1fr!important;gap:16px!important}
  .nyp-figma-product .nyp-installment-option>span{text-align:right!important}
}


/* v5.6.8 stepper hover/active theme fix */
.nyp-figma-product .nyp-mini-stepper>button,
.nyp-figma-product .nyp-buy-spin-buttons button,
.nyp-figma-product .nyp-buy-qty button,
.nyp-figma-product .nyp-qty button{
  -webkit-tap-highlight-color: transparent!important;
  transition:background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease!important;
}
.nyp-figma-product .nyp-mini-stepper>button:hover,
.nyp-figma-product .nyp-mini-stepper>button:focus,
.nyp-figma-product .nyp-mini-stepper>button:focus-visible,
.nyp-figma-product .nyp-mini-stepper>button:active,
.nyp-figma-product .nyp-buy-spin-buttons button:hover,
.nyp-figma-product .nyp-buy-spin-buttons button:focus,
.nyp-figma-product .nyp-buy-spin-buttons button:focus-visible,
.nyp-figma-product .nyp-buy-spin-buttons button:active,
.nyp-figma-product .nyp-buy-qty button:hover,
.nyp-figma-product .nyp-buy-qty button:focus,
.nyp-figma-product .nyp-buy-qty button:focus-visible,
.nyp-figma-product .nyp-buy-qty button:active,
.nyp-figma-product .nyp-qty button:hover,
.nyp-figma-product .nyp-qty button:focus,
.nyp-figma-product .nyp-qty button:focus-visible,
.nyp-figma-product .nyp-qty button:active{
  background:#eaf1f8!important;
  color:#0a3567!important;
  border-color:#cfd7e2!important;
  box-shadow:none!important;
  outline:none!important;
}
.nyp-figma-product .nyp-mini-stepper>button[data-stepper-plus],
.nyp-figma-product .nyp-buy-spin-buttons button[data-plus],
.nyp-figma-product .nyp-buy-qty button[data-plus],
.nyp-figma-product .nyp-qty button[data-plus]{
  color:#0a3567!important;
}
.nyp-figma-product .nyp-mini-stepper>button[data-stepper-minus],
.nyp-figma-product .nyp-buy-spin-buttons button[data-minus],
.nyp-figma-product .nyp-buy-qty button[data-minus],
.nyp-figma-product .nyp-qty button[data-minus]{
  color:#0a3567!important;
}
.nyp-figma-product .nyp-mini-stepper>button:active,
.nyp-figma-product .nyp-buy-spin-buttons button:active,
.nyp-figma-product .nyp-buy-qty button:active,
.nyp-figma-product .nyp-qty button:active{
  transform:none!important;
  filter:none!important;
}
