.ncl-widget[hidden],.ncl-panel[hidden]{display:none!important}
html.ncl-modal-open,body.ncl-modal-open{overflow:hidden!important}
.ncl-widget,.ncl-widget *{box-sizing:border-box}
.ncl-widget:not(.ncl-floating){width:100%;margin:1.25rem 0;padding:1.5rem;background:#fff;border:1px solid #d7d7d7;border-radius:4px}
.ncl-widget h3{margin:0;color:#1a1a2e;font-size:1.25rem;font-weight:700;line-height:1.2}
.ncl-intro{margin:0 0 1.25rem;color:#444;line-height:1.45}
/* 2026-09-17: resumen del carrito editable dentro del modal -- pedido
   explicito ("donde configura cantidad el cliente?"), mismo espiritu
   visual que la referencia de norvus3 (imagen+nombre+precio, controles
   -/cantidad/+, quitar, total por partida y total general). */
.ncl-header-text{min-width:0}
.ncl-header-subtitle{margin:.25rem 0 0;color:#767676;font-size:.8125rem}
.ncl-cart-summary{display:flex;flex-direction:column;gap:.75rem}
/* 2026-09-17: pesos/tamaños afinados contra la referencia de norvus3
   (resources/css/storefront-overlays.css) -- nombre de producto a 14px/600
   (no 700, se veia mas pesado de lo necesario), total de partida a 15px/600
   (antes .82rem, se veia perdido), sombra sutil en la card en vez de solo
   borde, boton quitar con borde propio (antes solo fondo). */
.ncl-cart-item{position:relative;display:grid;grid-template-columns:72px 1fr 40px;grid-template-areas:"image info remove" "image price price" "image qty qty" "image total total";column-gap:.875rem;row-gap:.5rem;align-items:start;padding:.875rem;border:1px solid #e5e7eb;border-radius:8px;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.ncl-cart-item-image{grid-area:image;width:72px;height:72px;object-fit:cover;border:1px solid #ececec;border-radius:8px;background:#f4f3f0}
.ncl-cart-item-image-empty{display:block}
.ncl-cart-item-info{grid-area:info;min-width:0;align-self:start}
.ncl-cart-item-name{margin:0;color:#1a1a2e;font-weight:600;font-size:.875rem;line-height:1.28}
.ncl-cart-item-ref{margin:.2rem 0 0;color:#888;font-size:.75rem}
.ncl-cart-item-remove{grid-area:remove;width:40px;height:40px;flex:0 0 auto;align-self:start;border:1px solid #e4e2dd;border-radius:8px;background:#f9f8f6;color:#767676;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .16s ease,border-color .16s ease,color .16s ease}
.ncl-cart-item-remove:hover{border-color:#f3c6c6;color:#b42318;background:#fff1f1}
.ncl-cart-item-price-row{grid-area:price}
.ncl-cart-item-price{display:flex;align-items:center;gap:.5rem;margin:0 0 .1rem}
.ncl-price-before{color:#9a9a9a;font-size:.8rem;text-decoration:line-through}
.ncl-price-badge{padding:.15rem .5rem;border-radius:5px;background:#16733a;color:#fff;font-weight:700;font-size:.7rem;letter-spacing:.02em}
.ncl-cart-item-price-now{margin:0;color:#1a1a2e;font-weight:700;font-size:1.05rem;line-height:1.2}
.ncl-cart-item-qty{grid-area:qty;display:inline-flex;align-items:center;gap:0;margin-top:.1rem;border:1.5px solid #e4e2dd;border-radius:8px;background:#f9f8f6;width:fit-content}
.ncl-qty-btn{width:32px;height:32px;flex:0 0 auto;border:0;background:transparent;color:#1a1a2e;font-size:1.05rem;line-height:1;cursor:pointer}
.ncl-qty-btn:disabled{opacity:.4;cursor:default}
.ncl-qty-input{width:42px;height:32px;text-align:center;border:0;border-left:1.5px solid #e4e2dd;border-right:1.5px solid #e4e2dd;background:transparent;font-weight:600;font-size:.9rem}
.ncl-cart-item-total{grid-area:total;margin:0;padding-top:.5rem;border-top:1px solid #edf1f6;color:#767676;font-size:.75rem;font-weight:600;text-align:right}
.ncl-cart-item-total span{color:#1a1a2e;font-weight:600;font-size:.9375rem}
.ncl-cart-item.ncl-is-busy{opacity:.55;pointer-events:none}
/* 2026-09-17: footer FUERA de .ncl-body (que hace scroll) -- Total, nota de
   envio y acciones siempre visibles, igual que la referencia de norvus3
   (barra sticky abajo del modal en vez de scrollear hasta el fondo). */
.ncl-cart-footer{flex:0 0 auto;padding:.875rem 1.25rem 1rem;border-top:1px solid #ececec;background:#fff;box-shadow:0 -10px 24px rgba(15,23,42,.06)}
.ncl-cart-footer[hidden]{display:none}
.ncl-cart-total{display:flex;align-items:baseline;justify-content:space-between;font-weight:700;font-size:1rem}
.ncl-cart-total strong{color:#0875ad;font-size:1.25rem}
.ncl-shipping-note{margin:.25rem 0 .75rem;color:#888;font-size:.71875rem;line-height:1.3}
/* 2026-09-17: z-index subido de 900 a 10000 -- confirmado en produccion
   (captura real del usuario) que el header (modulo fixedheader, clase
   #header.header_omg_im_scrolled agregada al hacer scroll) usa
   z-index:9999, tapando por completo tanto el boton flotante como el
   modal de cotizacion cuando la pagina esta scrolleada. 10000 gana sobre
   ese valor sin quedar innecesariamente alto por encima de todo lo demas
   del sitio. */
.ncl-floating{position:fixed;right:1.25rem;bottom:9.5rem;z-index:10000}
.ncl-trigger{border:0;border-radius:24px;padding:.75rem 1.15rem;background:#0875ad;color:#fff;font-weight:600;box-shadow:0 2px 10px rgba(0,0,0,.2)}
/* 2026-09-04: modal real -- .ncl-panel es el overlay de pantalla completa
   (fondo oscuro + centrado con flexbox), .ncl-panel-inner es la tarjeta
   blanca con su propio scroll. Reemplaza al popover que se posicionaba
   pegado al boton flotante y se salia de la pantalla cuando el formulario
   era mas alto que el espacio libre arriba del boton. */
/* 2026-09-17: z-index subido de 1031 a 10001 -- mismo motivo que
   .ncl-floating arriba (el header con scroll usa z-index:9999); el
   panel/modal necesita ganarle tambien al propio boton flotante (10000)
   para quedar realmente por encima de todo cuando esta abierto. */
.ncl-floating .ncl-panel{position:fixed;inset:0;z-index:10001;display:flex;align-items:center;justify-content:center;padding:1.5rem;background:rgba(20,20,20,.55)}
.ncl-floating .ncl-panel-inner{position:relative;width:min(92vw,620px);max-height:min(85vh,calc(100vh - 3rem));background:#fff;border-radius:10px;box-shadow:0 12px 40px rgba(0,0,0,.3);display:flex;flex-direction:column;overflow:hidden}
/* 2026-09-04: encabezado con franja y borde propio (acordado con maqueta) --
   antes el titulo y la "X" eran dos elementos sueltos, uno se montaba sobre
   el otro. El cuerpo (.ncl-body) hace scroll si hiciera falta; el encabezado
   se queda fijo arriba. */
.ncl-header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;padding:1.1rem 1.25rem .9rem;border-bottom:1px solid #ececec;flex:0 0 auto}
.ncl-header h3{margin:0}
.ncl-body{padding:1rem 1.25rem 1.25rem;overflow:auto}
.ncl-close{flex:0 0 auto;width:28px;height:28px;border-radius:50%;border:0;background:#f4f3f0;color:#5b5b6b;font-size:1.2rem;line-height:1;display:flex;align-items:center;justify-content:center}
.ncl-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1rem}
.ncl-grid>label{grid-column:span 3}.ncl-grid>.ncl-span-all{grid-column:1/-1}
.ncl-grid label,.ncl-address-row label{display:block!important;margin:0!important;color:#222!important;font-weight:600;font-size:.85rem!important;line-height:1.35!important;text-align:left!important}
.ncl-label-text{display:block}.ncl-label-text strong{color:#c00}
.ncl-grid input,.ncl-grid select,.ncl-address-row input,.ncl-address-row select{display:block;width:100%!important;height:42px!important;min-height:42px;margin:.35rem 0 0!important;padding:.55rem .7rem!important;border:1.5px solid #e4e2dd!important;border-radius:6px;background:#fff;color:#222;text-align:left!important;transition:border-color .15s}
.ncl-grid input:focus,.ncl-grid select:focus,.ncl-address-row input:focus,.ncl-address-row select:focus{border-color:#e0bb00!important;outline:none}
/* Codigo postal, Ciudad y Estado: 3 campos cortos en su propia fila. El CP
   solo lleva 5 digitos, por eso su columna es mas angosta que las otras 2. */
.ncl-address-row{display:grid;grid-template-columns:.7fr 1.15fr 1.15fr;gap:1rem;margin-top:1rem}
.ncl-cp-input{text-align:center;letter-spacing:.05em}
.ncl-contact-help{margin:.85rem 0 .75rem;color:#666;font-size:.82rem;line-height:1.4;text-align:left}
.ncl-consent{display:flex!important;align-items:flex-start!important;gap:.6rem;margin:.75rem 0 1.1rem!important;padding:.65rem .75rem;background:#f6f5f2;border-radius:6px;color:#222!important;font-size:.85rem!important;line-height:1.45!important;text-align:left!important}
.ncl-consent input{flex:0 0 auto;width:18px!important;height:18px!important;margin:.1rem 0 0!important;accent-color:#e0bb00}.ncl-consent span{display:block;flex:1}
.ncl-consent a{color:#222;font-weight:600}
.ncl-captcha{margin:.75rem 0}.ncl-captcha:empty{display:none}
.ncl-message{min-height:1.4rem;margin:.5rem 0;text-align:left}.ncl-success{color:#16733a}.ncl-error{color:#b42318}
.ncl-actions{display:flex;justify-content:flex-start}
.ncl-actions-split{justify-content:space-between;gap:.75rem}
.ncl-submit{min-height:44px;padding:.7rem 1.15rem;background:#1a1a2e!important;color:#ffd400!important;border:0;border-radius:8px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;font-size:.9rem}
.ncl-back{min-height:44px;padding:.7rem 1.1rem;background:transparent!important;color:#1a1a2e!important;border:1px solid #d8d8d8;border-radius:8px;font-weight:600;font-size:.9rem}
.ncl-back:hover{background:#f5f5f5!important}
/* 2026-09-17: acciones del footer del CARRITO (Vaciar + Solicitar) llevan
   su propia jerarquia visual, distinta de Regresar/Solicitar del paso de
   contacto -- afinado contra la referencia de norvus3: proporcion 1fr/2fr
   (Vaciar angosto, Solicitar ancho, no dos botones del mismo peso) y
   "Vaciar" realmente discreto (sin mayusculas, sin negrita fuerte) para no
   competir con la accion principal. */
.ncl-cart-footer .ncl-actions-split{display:grid;grid-template-columns:1fr 2fr;justify-content:normal}
.ncl-cart-footer .ncl-back{min-height:46px;padding:.65rem .85rem;color:#767676!important;font-weight:500;font-size:.8125rem;text-transform:none}
.ncl-cart-footer .ncl-submit{min-height:46px;padding:.8rem 1rem;background:#f59e0b!important;color:#101828!important;text-transform:none;letter-spacing:0;font-size:.9375rem;box-shadow:0 4px 12px rgba(245,158,11,.25)}
.ncl-step[hidden]{display:none}
.ncl-hp{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important}
/* 2026-09-04: pantalla de exito visible al enviar -- reemplaza el texto
   verde chico que nadie notaba junto al boton. */
.ncl-success-screen{display:flex;flex-direction:column;align-items:center;text-align:center;padding:1.5rem .5rem;gap:.9rem}
.ncl-success-icon{width:64px;height:64px;flex:0 0 auto}
.ncl-success-icon circle{stroke:#16733a;stroke-width:2.5;stroke-dasharray:166;stroke-dashoffset:166;animation:ncl-circle .5s ease-out forwards}
.ncl-success-icon path{stroke:#16733a;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:48;stroke-dashoffset:48;animation:ncl-check .3s .45s ease-out forwards}
.ncl-success-screen p{margin:0;color:#222;font-size:1.05rem;font-weight:600;line-height:1.4}
@keyframes ncl-circle{to{stroke-dashoffset:0}}
@keyframes ncl-check{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.ncl-success-icon circle,.ncl-success-icon path{animation:none;stroke-dashoffset:0}}
@media(min-width:768px){
  .ncl-floating .ncl-panel{align-items:stretch;justify-content:flex-end;padding:0;background:rgba(15,23,42,.42)}
  .ncl-floating .ncl-panel-inner{width:min(100vw,560px);max-height:none;height:100vh;border-radius:0;box-shadow:-18px 0 42px rgba(15,23,42,.22)}
  .ncl-header{padding:1.2rem 1.65rem 1.05rem;background:#fff}
  .ncl-widget h3{font-size:1.35rem;font-weight:700;letter-spacing:-.02em}
  .ncl-header-subtitle{margin-top:.35rem;color:#667085;font-size:1rem}
  .ncl-close{width:48px;height:48px;border:1px solid #dbe5f1;border-radius:9px;background:#f8fbff;color:#5f6f86;font-size:1.65rem;transition:background-color .16s ease,border-color .16s ease,color .16s ease}
  .ncl-close:hover{border-color:#c7d7ea;background:#eef6ff;color:#1a1a2e}
  .ncl-body{padding:1rem 1.5rem;background:#f8fafc}
  .ncl-cart-summary{gap:.85rem}
  .ncl-cart-item{grid-template-columns:78px 1fr 44px;grid-template-areas:"image info remove" "price qty qty" "total total total";column-gap:.9rem;row-gap:.7rem;padding:.9rem 1rem;border-color:#dbe4ef;border-radius:9px;box-shadow:0 2px 8px rgba(15,23,42,.045)}
  .ncl-cart-item-image{width:78px;height:78px;border-color:#e5edf7;border-radius:8px}
  .ncl-cart-item-name{font-size:.9375rem;font-weight:650;line-height:1.22;letter-spacing:-.01em}
  .ncl-cart-item-ref{margin-top:.35rem;color:#667085;font-size:.875rem}
  .ncl-cart-item-remove{width:44px;height:44px;border-color:#dbe4ef;border-radius:9px;background:#f8fbff;color:#667085}
  .ncl-cart-item-price-row{align-self:end}
  .ncl-cart-item-price{margin:0;gap:.35rem;flex-wrap:wrap}
  .ncl-price-before{font-size:.9rem;color:#667085}
  .ncl-price-badge{padding:.15rem .42rem;border-radius:3px;font-size:.82rem;line-height:1.1}
  .ncl-cart-item-price-now{font-size:1.2rem;font-weight:700;letter-spacing:-.015em}
  .ncl-cart-item-qty{justify-self:end;align-self:end;margin:0;border-color:#dbe4ef;border-radius:8px;background:#f8fafc}
  .ncl-qty-btn{width:40px;height:40px;font-size:1.05rem}
  .ncl-qty-input{width:68px;height:40px;font-size:.92rem;font-weight:700;border-color:#dbe4ef}
  .ncl-cart-item-total{display:flex;align-items:center;justify-content:space-between;margin:.05rem 0 0;padding-top:.8rem;border-color:#edf1f6;text-align:left;color:#667085;font-size:.875rem;font-weight:650}
  .ncl-cart-item-total span{font-size:1rem;font-weight:700}
  .ncl-cart-footer{padding:1rem 1.5rem 1.15rem;background:#fff}
  .ncl-cart-total{font-size:1.05rem;font-weight:700}
  .ncl-cart-total strong{color:#e87500;font-size:1.12rem;font-weight:700}
  .ncl-shipping-note{margin:.35rem 0 .8rem;color:#667085;font-size:.85rem}
  .ncl-cart-footer .ncl-actions-split{gap:.75rem;grid-template-columns:1fr 2.1fr}
  .ncl-cart-footer .ncl-back{min-height:50px;border-color:#dbe4ef;border-radius:8px;color:#667085!important;font-size:.95rem;font-weight:600}
  .ncl-cart-footer .ncl-submit{min-height:50px;border-radius:8px;font-size:1rem;font-weight:700;box-shadow:0 8px 18px rgba(245,158,11,.2)}
}
@media(max-width:575px){
  /* 2026-09-04: el objetivo es que TODO el formulario quepa en una sola
     pantalla, sin scroll -- el usuario nunca percibia que habia mas campos
     abajo y se iba antes de llegar al boton. Se comprime cada espacio
     vertical al minimo comodo para el dedo, sin ocultar ni un campo. */
  /* 2026-09-04: align-items:stretch obligaba a .ncl-panel-inner a llenar
     todo el alto disponible aunque su contenido fuera mas corto, dejando
     un hueco en blanco debajo del boton. center + max-height como limite
     (no como alto fijo) hace que la tarjeta mida lo que su contenido pide,
     y solo recurra a scroll si de verdad no cupiera en la pantalla. */
  .ncl-widget:not(.ncl-floating){padding:.75rem}
  /* 2026-09-17: pedido explicito -- en movil el modal debe usar TODO el
     alto disponible de la pantalla, no una tarjeta recortada con hueco
     alrededor. inset:0 sin padding + border-radius:0 lo vuelve pantalla
     completa real (mismo patron que apps moviles nativas para modales
     largos); .ncl-panel-inner ya no tiene limite de max-height propio, usa
     el 100% que le da el overlay. */
  .ncl-floating .ncl-panel{top:0;right:0;bottom:64px;bottom:calc(64px + env(safe-area-inset-bottom,0px));left:0;inset:0 0 64px 0;inset:0 0 calc(64px + env(safe-area-inset-bottom,0px)) 0;width:100vw;height:calc(100vh - 64px);height:calc(100dvh - 64px - env(safe-area-inset-bottom,0px));min-height:calc(100vh - 64px);padding:0;align-items:stretch;justify-content:stretch;overflow:hidden}
  .ncl-floating .ncl-panel-inner{width:100%;max-width:none;max-height:none;height:calc(100vh - 64px);height:calc(100dvh - 64px - env(safe-area-inset-bottom,0px));min-height:calc(100vh - 64px);border-radius:0;box-shadow:none}
  .ncl-header{padding:.7rem .9rem .55rem}
  .ncl-body{flex:1 1 auto;min-height:0;padding:.55rem .9rem .85rem;overflow:auto}
  .ncl-widget h3{font-size:1.0625rem;margin-bottom:.2rem;line-height:1.2}
  .ncl-header-subtitle{font-size:.75rem}
  .ncl-intro{margin-bottom:.4rem;font-size:.75rem;line-height:1.25}
  .ncl-cart-summary{gap:.6rem}
  .ncl-cart-item{grid-template-columns:56px minmax(0,1fr) auto;grid-template-areas:"image info remove" "price price qty" "total total total";column-gap:.65rem;row-gap:.5rem;padding:.72rem;border-radius:9px}
  .ncl-cart-item-image{width:56px;height:56px;border-radius:7px}
  .ncl-cart-item-name{font-size:.875rem;font-weight:650;line-height:1.2}
  .ncl-cart-item-ref{font-size:.75rem;color:#5f6f86}
  .ncl-cart-item-remove{width:40px;height:40px;border-radius:8px;background:#f8fbff;color:#667085}
  .ncl-cart-item-price-row{align-self:end;min-width:0}
  .ncl-cart-item-price{gap:.35rem;margin:0}
  .ncl-cart-item-price-now{font-size:1rem;font-weight:700;color:#1a1a2e}
  .ncl-price-before{font-size:.7rem}
  .ncl-price-badge{font-size:.66rem;padding:.1rem .4rem}
  .ncl-cart-item-qty{justify-self:end;align-self:end;margin:0;border-color:#dbe4ef;border-radius:8px;background:#f8fafc}
  .ncl-cart-item-total{display:flex;justify-content:space-between;align-items:center;margin:.15rem -.72rem -.72rem;padding:.65rem .72rem;border-top:1px solid #eef2f7;font-size:.78rem;text-align:left}
  .ncl-cart-item-total span{font-size:.95rem;font-weight:700}
  .ncl-qty-btn{width:36px;height:38px}
  .ncl-qty-input{width:46px;height:38px;font-weight:700}
  .ncl-cart-footer{padding:.65rem .9rem .8rem}
  .ncl-cart-total{font-size:.9rem}
  .ncl-cart-total strong{font-size:1.05rem;color:#f28c00}
  .ncl-shipping-note{font-size:.7rem;margin-bottom:.6rem}
  .ncl-close{width:24px;height:24px;font-size:1.15rem}
  /* Codigo postal, Ciudad y Estado son 3 campos cortos: van en una fila de
     3 columnas propia para que queden parejos, no descuadrados como cuando
     comparten grid con Nombre/WhatsApp/Correo que ocupan el ancho completo.
     El CP mantiene columna mas angosta (solo 5 digitos) igual que en escritorio. */
  .ncl-grid{grid-template-columns:1fr;gap:.4rem}
  .ncl-grid>label{grid-column:1}
  .ncl-grid>.ncl-span-all{grid-column:1}
  .ncl-address-row{grid-template-columns:.7fr 1.15fr 1.15fr;gap:.35rem;margin-top:.4rem;margin-bottom:.4rem}
  .ncl-address-row label{display:block!important;margin:0!important;color:#222!important;font-size:.68rem!important;line-height:1.2!important;text-align:left!important}
  .ncl-address-row input,.ncl-address-row select{height:34px!important;min-height:34px;margin-top:.1rem!important;padding:.3rem .4rem!important;font-size:.8rem}
  .ncl-grid label{font-size:.75rem!important}
  .ncl-grid input,.ncl-grid select{height:34px!important;min-height:34px;margin-top:.1rem!important;padding:.3rem .5rem!important;font-size:.85rem}
  .ncl-contact-help{margin:.3rem 0!important;font-size:.68rem;line-height:1.2}
  .ncl-consent{margin:.35rem 0 .4rem!important;font-size:.72rem!important;line-height:1.25!important}
  .ncl-consent input{width:14px!important;height:14px!important}
  .ncl-captcha{margin:.3rem 0}
  .ncl-message{margin:.25rem 0;min-height:1.1rem;font-size:.8rem}
  .ncl-floating{right:.75rem;bottom:8.5rem}
  .ncl-actions,.ncl-submit{width:100%}
  .ncl-submit{display:block;min-height:38px;padding:.45rem 1rem;font-size:.9rem}
  .ncl-actions-split{width:100%}
  .ncl-actions-split .ncl-back,.ncl-actions-split .ncl-submit{flex:1;width:auto;min-height:38px;padding:.45rem .6rem;font-size:.85rem}
}
/* Pantallas muy bajas (celulares chicos en horizontal, o navegador con
   barras visibles): un paso mas de compresion antes de resignarse al scroll. */
@media(max-width:575px) and (max-height:700px){
  .ncl-widget h3{font-size:.88rem}
  .ncl-grid{gap:.3rem}
  .ncl-grid input,.ncl-grid select{height:32px!important;min-height:32px}
  .ncl-consent{margin:.25rem 0 .3rem!important}
  .ncl-submit{min-height:36px}
}
