/* NexoPlay V24 — rendimiento móvil + editor Proveedor ampliado. */

/* Planes de proveedor: nombre/precio/stock arriba, descripción real abajo. */
.nx20-plan-row{display:block!important;padding:9px!important}
.nx20-plan-main{display:grid;grid-template-columns:minmax(0,1.35fr) .72fr .58fr auto;gap:7px;align-items:center}
.nx20-plan-row .nx20-pdesc{width:100%;box-sizing:border-box;min-height:58px;margin-top:7px;border:1px solid rgba(128,157,220,.18);border-radius:9px;padding:8px 9px;background:rgba(127,148,190,.06);color:inherit;font:inherit;font-size:9px;line-height:1.4;resize:vertical}
.nx20-field>small{font-size:8px;line-height:1.4;opacity:.62}

/* Mejor respuesta táctil. */
button,.nx20-btn,.nx20-provider-tabs button,.category-chip,.product{touch-action:manipulation}
.nx20-provider-tabs{overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none}
.nx20-provider-tabs::-webkit-scrollbar{display:none}
.nx20-provider-tabs button{flex:0 0 auto}

/* Aísla tarjetas/listas largas para que el navegador no repinte toda la página. */
#grid .product,.nx22-provider-order,.purchase-card,.nx20-provider-item,.nx21-sale-row,.nx21-withdraw-row{
  contain:layout paint style;
  content-visibility:auto;
}
#grid .product{contain-intrinsic-size:240px 255px}
.nx22-provider-order,.purchase-card{contain-intrinsic-size:320px 340px}

/* El modal del proveedor se muestra inmediatamente; el contenido puede cargar después. */
.nx20-provider-bg.open{will-change:opacity}
.nx20-provider-body{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}

@media(max-width:760px){
  .nx20-plan-main{grid-template-columns:minmax(0,1fr) 76px 66px auto}
  .nx20-plan-row .nx20-pdesc{font-size:10px;min-height:64px}

  /* Blur de pantalla completa es costoso en GPUs móviles. Conservamos profundidad con fondo sólido/translúcido. */
  .nx20-provider-bg,.nx19-overlay,.nx7-overlay{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .nx20-provider-bg{background:rgba(3,8,18,.88)!important}
  .nx-experience-inner{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}

  /* En dispositivos táctiles evitamos hover/transforms innecesarios. */
  .product:hover{transform:none!important}
  #grid .product{contain-intrinsic-size:185px 235px}
}

@media(max-width:430px){
  .nx20-plan-main{grid-template-columns:minmax(0,1fr) 70px 58px auto;gap:5px}
  .nx20-plan-main input{padding:8px 6px!important;font-size:8.5px!important}
  .nx20-plan-main button{width:29px!important;height:29px!important}
}
