/* SpaMaster 360 v47.72 - POS Nueva venta / Venta libre polish */

/* 1) Checkbox de pago dividido: neutraliza estilos globales de inputs dentro del modal */
html body.sc-view-pos #posSaleModal #sm360SplitPayBox,
html body #posSaleModal #sm360SplitPayBox{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  margin:10px 0 12px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
html body.sc-view-pos #posSaleModal #sm360SplitPayBox .sm360-split-pay-toggle,
html body #posSaleModal #sm360SplitPayBox .sm360-split-pay-toggle,
html body.sc-view-pos #posSaleModal #sm360SplitPayBox .sm360-split-pay-toggle-v4772,
html body #posSaleModal #sm360SplitPayBox .sm360-split-pay-toggle-v4772{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex-direction:row!important;
  gap:8px!important;
  width:auto!important;
  min-width:0!important;
  max-width:max-content!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  white-space:nowrap!important;
  cursor:pointer!important;
  color:#344054!important;
  font-size:11px!important;
  line-height:1.05!important;
  font-weight:950!important;
  letter-spacing:.075em!important;
  text-transform:uppercase!important;
}
html body.sc-view-pos #posSaleModal #sm360SplitPayToggle,
html body #posSaleModal #sm360SplitPayToggle,
html body.sc-view-pos #posSaleModal input#sm360SplitPayToggle.sm360-lg2-input,
html body #posSaleModal input#sm360SplitPayToggle.sm360-lg2-input,
html body.sc-view-pos #posSaleModal input#sm360SplitPayToggle.sm360-split-pay-checkbox-v4772,
html body #posSaleModal input#sm360SplitPayToggle.sm360-split-pay-checkbox-v4772{
  appearance:none!important;
  -webkit-appearance:none!important;
  display:inline-grid!important;
  place-items:center!important;
  flex:0 0 16px!important;
  width:16px!important;
  height:16px!important;
  min-width:16px!important;
  min-height:16px!important;
  max-width:16px!important;
  max-height:16px!important;
  margin:0!important;
  padding:0!important;
  border-radius:6px!important;
  border:1.5px solid rgba(111,78,246,.42)!important;
  background:linear-gradient(135deg,#ffffff,#f4f0ff)!important;
  box-shadow:0 6px 16px rgba(111,78,246,.12)!important;
  outline:none!important;
  vertical-align:middle!important;
  transform:none!important;
}
html body.sc-view-pos #posSaleModal #sm360SplitPayToggle:checked,
html body #posSaleModal #sm360SplitPayToggle:checked{
  border-color:#6f4ef6!important;
  background:linear-gradient(135deg,#8b5cf6,#6f4ef6)!important;
}
html body.sc-view-pos #posSaleModal #sm360SplitPayToggle:checked::after,
html body #posSaleModal #sm360SplitPayToggle:checked::after{
  content:'✓'!important;
  color:#fff!important;
  font-size:10px!important;
  font-weight:950!important;
  line-height:1!important;
  transform:translateY(-.5px)!important;
}
html body.sc-view-pos #posSaleModal #sm360SplitPayBox .sm360-split-pay-label,
html body #posSaleModal #sm360SplitPayBox .sm360-split-pay-label,
html body.sc-view-pos #posSaleModal #sm360SplitPayBox .sm360-split-pay-label-v4772,
html body #posSaleModal #sm360SplitPayBox .sm360-split-pay-label-v4772{
  display:inline-flex!important;
  align-items:center!important;
  margin:0!important;
  padding:0!important;
  color:#344054!important;
  white-space:nowrap!important;
}
html body.sc-view-pos #posSaleModal #sm360SplitPayBox:not(.sm360-split-pay-open-v4772) .sm360-split-pay-panel,
html body #posSaleModal #sm360SplitPayBox:not(.sm360-split-pay-open-v4772) .sm360-split-pay-panel,
html body.sc-view-pos #posSaleModal #sm360SplitPayBox.sm360-split-pay-closed-v4772 .sm360-split-pay-panel,
html body #posSaleModal #sm360SplitPayBox.sm360-split-pay-closed-v4772 .sm360-split-pay-panel{
  display:none!important;
  visibility:hidden!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
html body.sc-view-pos #posSaleModal #sm360SplitPayBox.sm360-split-pay-open-v4772 .sm360-split-pay-panel,
html body #posSaleModal #sm360SplitPayBox.sm360-split-pay-open-v4772 .sm360-split-pay-panel{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:8px!important;
  visibility:visible!important;
  height:auto!important;
  max-height:none!important;
  margin-top:12px!important;
  padding:12px!important;
  border:1px solid rgba(111,78,246,.14)!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.82)!important;
  box-shadow:0 14px 34px rgba(16,24,40,.05)!important;
  opacity:1!important;
  pointer-events:auto!important;
}

/* 2) Tarjetas de paquetes: mejor respiración entre precio y título */
html body.sc-view-pos #posSaleModal .pos-product-card,
html body.sc-view-pos #posSaleModal .pos-product,
html body.sc-view-pos #posSaleModal .product-card,
html body.sc-view-pos #posSaleModal [data-product-id]{
  padding-bottom:14px!important;
}
html body.sc-view-pos #posSaleModal .pos-product-card .pos-product-price,
html body.sc-view-pos #posSaleModal .pos-product-card .product-price,
html body.sc-view-pos #posSaleModal .pos-product .pos-product-price,
html body.sc-view-pos #posSaleModal [data-product-id] .pos-product-price,
html body.sc-view-pos #posSaleModal [data-product-id] .product-price{
  margin-top:8px!important;
  margin-bottom:8px!important;
  line-height:1.05!important;
}
html body.sc-view-pos #posSaleModal .pos-product-card .pos-product-title,
html body.sc-view-pos #posSaleModal .pos-product-card .product-title,
html body.sc-view-pos #posSaleModal .pos-product-card .pos-product-name,
html body.sc-view-pos #posSaleModal .pos-product .pos-product-title,
html body.sc-view-pos #posSaleModal .pos-product .product-title,
html body.sc-view-pos #posSaleModal .pos-product .pos-product-name,
html body.sc-view-pos #posSaleModal [data-product-id] .pos-product-title,
html body.sc-view-pos #posSaleModal [data-product-id] .product-title,
html body.sc-view-pos #posSaleModal [data-product-id] .pos-product-name{
  display:block!important;
  margin-top:6px!important;
  margin-bottom:10px!important;
  padding-bottom:2px!important;
  line-height:1.25!important;
}
html body.sc-view-pos #posSaleModal .pos-product-card b,
html body.sc-view-pos #posSaleModal .pos-product b,
html body.sc-view-pos #posSaleModal [data-product-id] b{
  margin-bottom:7px!important;
}

/* 3) Venta libre: padding y botones de pago iguales a Nueva venta */
html body.sc-view-pos #posFreeSaleModal.pos-modal.open,
html body #posFreeSaleModal.pos-modal.open{
  padding:14px!important;
  align-items:center!important;
  justify-content:center!important;
}
html body.sc-view-pos #posFreeSaleModal .pos-modal-card,
html body #posFreeSaleModal .pos-modal-card,
html body.sc-view-pos #posFreeSaleModal .pos-sale-pro-card,
html body #posFreeSaleModal .pos-sale-pro-card{
  width:min(1180px,calc(100vw - 28px))!important;
  max-height:calc(100vh - 28px)!important;
  overflow:auto!important;
  padding:0!important;
  border-radius:28px!important;
}
html body.sc-view-pos #posFreeSaleModal .pos-modal-head,
html body #posFreeSaleModal .pos-modal-head{
  padding:24px 26px 18px!important;
}
html body.sc-view-pos #posFreeSaleModal .pos-modal-card > .muted,
html body #posFreeSaleModal .pos-modal-card > .muted,
html body.sc-view-pos #posFreeSaleModal .pos-field-block,
html body #posFreeSaleModal .pos-field-block,
html body.sc-view-pos #posFreeSaleModal .pos-state-tabs,
html body #posFreeSaleModal .pos-state-tabs{
  margin-left:26px!important;
  margin-right:26px!important;
}
html body.sc-view-pos #posFreeSaleModal .pos-field-block,
html body #posFreeSaleModal .pos-field-block{
  margin-top:16px!important;
}
html body.sc-view-pos #posFreeSaleModal #posFreeMethodGrid,
html body #posFreeSaleModal #posFreeMethodGrid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px!important;
}
html body.sc-view-pos #posFreeSaleModal button.pos-pay-method-btn,
html body #posFreeSaleModal button.pos-pay-method-btn{
  min-height:92px!important;
  height:92px!important;
  border-radius:22px!important;
  border:1px solid rgba(226,232,240,.92)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(248,250,252,.92))!important;
  box-shadow:0 18px 38px rgba(15,23,42,.07)!important;
  color:#111827!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  font-weight:950!important;
}
html body.sc-view-pos #posFreeSaleModal button.pos-pay-method-btn .sm360-pay-icon,
html body #posFreeSaleModal button.pos-pay-method-btn .sm360-pay-icon,
html body.sc-view-pos #posFreeSaleModal button.pos-pay-method-btn span:first-child,
html body #posFreeSaleModal button.pos-pay-method-btn span:first-child{
  width:42px!important;
  height:42px!important;
  border-radius:16px!important;
  background:rgba(111,78,246,.12)!important;
  color:#6f4ef6!important;
  display:inline-grid!important;
  place-items:center!important;
}
html body.sc-view-pos #posFreeSaleModal button.pos-pay-method-btn.active,
html body.sc-view-pos #posFreeSaleModal button.pos-pay-method-btn.is-selected,
html body #posFreeSaleModal button.pos-pay-method-btn.active,
html body #posFreeSaleModal button.pos-pay-method-btn.is-selected{
  border-color:#16a05d!important;
  background:linear-gradient(145deg,rgba(236,253,245,.98),rgba(255,255,255,.92))!important;
  box-shadow:0 20px 44px rgba(16,185,129,.13)!important;
}
html body.sc-view-pos #posFreeSaleModal #posSaveFreeSale,
html body #posFreeSaleModal #posSaveFreeSale{
  margin:26px!important;
  width:calc(100% - 52px)!important;
  min-height:52px!important;
  border-radius:18px!important;
}

@media(max-width:760px){
  html body.sc-view-pos #posFreeSaleModal #posFreeMethodGrid,
  html body #posFreeSaleModal #posFreeMethodGrid{grid-template-columns:1fr!important;}
}
