/* Quantity modal specific styling */
#global-modal[data-modal="quantity"]{
  --pos-modal-card-width:min(700px, calc(100vw - 24px));
  --pos-modal-margin-x:clamp(12px, 3vw, 28px);
  --pos-modal-margin-y:clamp(12px, 3vh, 28px);
}

#global-modal[data-modal="quantity"] .pos-modal__card{
  height:auto;
  min-height:0;
  max-height:calc((var(--vh, 1vh) * 100) - 2 * var(--pos-modal-margin-y));
}

#global-modal[data-modal="quantity"] .pos-modal__body{
  padding:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:0;
  overflow:visible;
  gap:0;
}

#qtyProdName{ margin-bottom:8px; }

#qtyBack{
  z-index:960;
  padding:0 !important;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}

#qtyBack .qty-modal{
  --modal-base-width:640px;
  --modal-base-height:760px;
  display:flex;
  flex-direction:column;
  gap:12px;
  width:min(640px, calc(100vw - 48px));
  max-width:min(640px, calc(100vw - 48px));
  max-height:calc((var(--vh, 1vh) * 100) - var(--cart-safe, 0px) - 32px);
  padding:clamp(14px, 2vw, 22px);
  border-radius:20px;
  margin:0 auto;
  box-sizing:border-box;
  transition:filter .2s ease;
}

.qty-title{
  justify-content:space-between;
  align-items:center;
}

.qty-modal .qty-body{
  min-height:0;
  overflow:hidden;
  padding-right:0;
}

.qty-modal .qty-close-btn{
  display:none;
  align-items:center;
  justify-content:center;
  background:transparent;
  border:1px solid rgba(255,255,255,.2);
  color:#fff;
  border-radius:12px;
  width:36px;
  height:36px;
  padding:0;
  font-size:18px;
}

.qty-modal .qty-close-btn:hover{ background:rgba(255,255,255,.1); }

/* Touch-optimized layout */
#qtyBack.qty-touch{
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

#qtyBack.qty-touch .qty-modal{
  width:min(640px, calc(100vw - 48px));
  max-width:min(640px, calc(100vw - 48px));
  height:auto;
  max-height:calc((var(--vh, 1vh) * 100) - var(--cart-safe, 0px) - 32px);
  gap:16px;
  overflow:hidden;
  padding:clamp(12px, 2vw, 18px);
}

@supports (height: 100dvh){
  #qtyBack.qty-touch .qty-modal{
    max-height:calc(100dvh - var(--cart-safe, 0px) - 32px);
  }
}

#qtyBack.qty-touch .qty-modal.qty-scaled{ overflow-y:auto; }
#qtyBack.qty-touch .qty-body{ gap:16px; min-height:0; }
#qtyBack.qty-touch .qty-price-row{ margin-top:4px; }
#qtyBack.qty-touch .qty-actions{ display:none; }
#qtyBack.qty-touch #qtyCancel{ display:none; }
#qtyBack.qty-touch .qty-close-btn{ display:flex; }
#qtyBack.qty-touch #qtyOkMobile{
  display:flex;
  grid-column:3;
  align-items:center;
  justify-content:center;
  font-size:18px;
  padding:14px 10px;
}

#qtyBack.qty-touch .numpad button{ min-height:64px; font-size:28px; }
#qtyBack.qty-touch .qty-wrap{ gap:14px; }
#qtyBack.qty-touch .qty-wrap button{ min-width:70px; font-size:26px; }
#qtyBack.qty-touch .qty-wrap input{ font-size:26px; padding:12px 14px; }

#qtyBack .qty-actions{ display:none !important; }

#qtyBack.qty-mobile .numpad{ height:100%; grid-auto-rows:minmax(0, 1fr); }
#qtyBack.qty-mobile .numpad button{ width:100%; height:100%; min-width:0; min-height:0; }
#qtyBack.qty-mobile .numpad .wide{ grid-column:span 2; }

#qtyBack .numpad-sizer{ position:relative; width:100%; }
#qtyBack .numpad-sizer .numpad{ transform-origin: top center; }

/* Inner scale helpers */
.modal-innerscale{
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  box-sizing:border-box;
  padding:clamp(1.5vh, 2vw, 2.5vh);
}

.modal-innerscale .qty-body{
  flex:1;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:clamp(1vh, 1.5vw, 1.5vh);
}

.modal-innerscale .numpad-sizer{
  flex:1;
  display:flex;
  min-height:0;
  overflow:hidden;
}

.modal-innerscale .numpad{
  display:grid !important;
  margin:0 !important;
  width:100%;
  flex:1;
  box-sizing:border-box;
  grid-template-columns:repeat(3, 1fr) !important;
  grid-auto-rows:1fr !important;
  align-content:stretch;
  gap:max(6px, clamp(0.8vh, 1.1vw, 1.4vh)) !important;
}

.modal-innerscale .qty-wrap{
  flex:0 0 auto;
}

.modal-innerscale .qty-actions{ display:none !important; }

.qty-modal .modal-innerscale input,
.qty-modal .modal-innerscale button,
.qty-modal .modal-innerscale select,
.qty-modal .modal-innerscale textarea{
  font-size:clamp(14px, 2vh, 18px);
}

.qty-wrap{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:center;
}

#qtyInput{ width:160px; text-align:center; font-size:22px; padding:12px 14px; border-radius:12px; }
#qtyPrice{ font-size:18px; border-radius:12px; }
#qtyMinus,#qtyPlus{ min-width:56px; font-size:24px; padding:12px 0; border-radius:12px; }

#qtyBack:not(.qty-touch) .numpad{
  gap:18px;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  grid-auto-rows:minmax(64px, auto);
  align-content:flex-start;
  margin-top:18px;
  padding:0 6px;
}

#qtyBack:not(.qty-touch) .numpad button{
  min-width:0;
  width:100%;
  min-height:64px;
  max-height:72px;
  padding:14px 12px;
  font-size:28px;
  border-radius:12px;
  line-height:1;
}
