/* nv-carrito.css — mini carrito de La Novedad y las piezas que comparte con /cart/ y el checkout (T8): barra de envío,
   cantidad, variantes y precio. Replica el lenguaje de la tienda Nitro de lanovedad.com (bee-mini-cart,
   bee-shipping-bar) con los valores de la especificación §2.19; nunca su CSS. Consume los tokens de nv-base.css; los
   únicos colores propios son los cuatro tramos de la barra de envío (tokens.md §1.6). Carga en todas las páginas (el
   cajón se abre desde cualquiera). Lo que solo sirve a /cart/, al checkout, a la banda y al carrito vacío vive en
   nv-carrito-pagina.css, que solo se encola allí: en la hoja única eran 13.096 B de 28.707 que viajaban a cada página. */

/* ── Barra de envío gratis: cajón 33 px con el texto encima (la de /cart/, de 8 px, en nv-carrito-pagina.css) ──
   2026-09-22, el dueño: «no tiene efecto de cargar dorado y elegante; letras negras, algo que se vea lindo, como si
   cargara el envío gratis». Antes copiaba la de Nitro: cuatro colores por tramo (rosa, rojo, óxido y tinta), rayas,
   pista negra y letras blancas. Ahora: pista crema, relleno con el oro de la barra de anuncios (--nv-oro-barra) y letras
   en tinta —sobre el oro más oscuro del degradado (#a87d2c) el negro da 5,8:1; sobre la crema, 17:1—. Dos movimientos:
   el relleno CRECE desde cero cada vez que se abre el cajón (is-abierto se pone en cada apertura, así que se repite) y
   al pintarse en /cart/; y una luz lo cruza de izquierda a derecha, como la del logo. data-tramo se sigue imprimiendo
   pero ya no cambia el color: el avance lo dice el ancho. */
.nv-envio__barra{position:relative;width:100%;height:33px;background:#f4efe3;box-shadow:inset 0 1px 2px rgba(0,0,0,.08);overflow:hidden}
.nv-envio__relleno{position:relative;display:block;height:100%;max-width:100%;overflow:hidden;transform-origin:0 50%;
  background-color:#c39d4b;background-image:var(--nv-oro-barra);transition:width .6s cubic-bezier(.22,.61,.36,1)}
/* La luz: una banda clara que cruza el relleno y descansa. Se mueve con transform (la GPU), sin repintar la barra. */
.nv-envio__relleno::after{content:"";position:absolute;top:0;bottom:0;left:0;width:45%;pointer-events:none;
  background:linear-gradient(90deg,rgba(255,252,238,0) 0%,rgba(255,252,238,.75) 50%,rgba(255,252,238,0) 100%);
  transform:translateX(-120%);animation:nv-envio-luz 2.6s cubic-bezier(.45,0,.55,1) infinite}
@keyframes nv-envio-luz{0%{transform:translateX(-120%)}65%,100%{transform:translateX(260%)}}
@keyframes nv-envio-carga{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.nv-cajon.is-abierto .nv-envio__relleno,.nv-envio-pagina .nv-envio__relleno{animation:nv-envio-carga .9s cubic-bezier(.22,.61,.36,1) .15s both}
/* Envío gratis ya ganado: la barra entera en oro y la luz pasa más seguido. */
.nv-envio--ok .nv-envio__relleno::after{animation-duration:1.8s}
.nv-envio__monto{font-weight:600}
.nv-envio__monto .amount{color:inherit}
.nv-envio--cajon{position:relative;flex:none}
.nv-envio--cajon .nv-envio__texto{position:absolute;inset:0;z-index:1;margin:0;display:flex;align-items:center;color:#151515;font-size:15px;line-height:1.4;text-align:center;pointer-events:none}
.nv-envio--cajon .nv-envio__texto>.nv-mc__contenedor{display:block}
@media (max-width:767px){.nv-envio--cajon .nv-envio__texto{font-size:11px}}
@media (prefers-reduced-motion:reduce){
  .nv-envio__relleno,.nv-cajon.is-abierto .nv-envio__relleno,.nv-envio-pagina .nv-envio__relleno{animation:none;transition:none}
  .nv-envio__relleno::after{display:none}
}

/* ── Cantidad (cajón y /cart/): caja 120×38, borde 2px, − y + de 34 px; con 1 unidad el − es la papelera ── */
.nv-cantidad{position:relative;display:inline-flex;align-items:center;justify-content:space-between;box-sizing:border-box;width:120px;min-width:120px;height:38px;
  border:2px solid var(--nv-border);border-radius:var(--nv-radius);background:#fff;color:var(--nv-ink);transition:border-color .25s}
.nv-cantidad:hover{border-color:var(--nv-ink)}
.nv-cantidad .nv-cantidad__btn{flex:0 0 34px;width:34px;height:34px;min-height:0;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:var(--nv-ink);
  display:inline-flex;align-items:center;justify-content:center;box-shadow:none;cursor:pointer}
.nv-cantidad .nv-cantidad__btn:hover{border:0;background:transparent;color:var(--nv-accent)}
.nv-cantidad__btn .nv-i{width:10px;height:10px;stroke-width:2.2}
.nv-cantidad__btn--menos .nv-i--papelera,.nv-cantidad[data-uno] .nv-cantidad__btn--menos .nv-i--menos{display:none}
.nv-cantidad[data-uno] .nv-cantidad__btn--menos .nv-i--papelera{display:inline-block;width:14px;height:14px;stroke-width:1.8}
.nv-cantidad .nv-cantidad__num{flex:1 1 auto;width:34px;min-width:0;height:34px;min-height:0;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;
  text-align:center;font:600 15px/34px var(--nv-font);color:var(--nv-ink);-moz-appearance:textfield;appearance:textfield}
.nv-cantidad .nv-cantidad__num::-webkit-inner-spin-button,.nv-cantidad .nv-cantidad__num::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.nv-cantidad .nv-cantidad__num:focus{outline:0}
.nv-cantidad--fija{justify-content:center;font-size:15px;font-weight:600}

/* ── Variantes («Color: Negro» / «Talla del calzado: 37»): una pareja por línea, en el cajón, /cart/ y el checkout ──
   Texto corrido, no tabla: con la rejilla auto/1fr el valor se alineaba con la etiqueta más larga y salía
   «Color:     Marrón» (18 px de hueco tras «Color:» frente a 5 tras «Material:», medido en el cajón a 1440; con las
   etiquetas de T6 el hueco crecería). El espacio entre etiqueta y valor es el del propio marcado de Woo
   (cart-item-data.php) y cada dd cierra su línea con un ::after de bloque. Blocksy flota el dt (float:left): se anula. */
:is(.nv-mc,.nv-carrito,.nv-pagina-checkout) dl.variation{display:block;margin:0 0 2px;padding:0;font-size:13px;line-height:1.6;color:var(--nv-ink)}
:is(.nv-mc,.nv-carrito,.nv-pagina-checkout) dl.variation :is(dt,dd){display:inline;margin:0;padding:0;float:none;font-weight:400}
:is(.nv-mc,.nv-carrito,.nv-pagina-checkout) dl.variation dd::after{content:"";display:block}
:is(.nv-mc,.nv-carrito,.nv-pagina-checkout) dl.variation p{display:inline;margin:0}

/* ── Precio de línea: tachado #bfbec8 y luego la oferta #f52c2c, o #4c4b51 solo ──
   Blocksy envuelve el rebajado en .sale-price con del{order:2;font-size:80%;opacity:.7} (woocommerce.min.css):
   aquí el tachado va primero y a tamaño completo, como bee-cart_price de Nitro. */
.nv-mc__precio,.nv-carrito__precio,.nv-carrito__precio-movil{font-size:15px;line-height:1.4;color:var(--nv-price)}
.nv-mc__precio>.amount,.nv-carrito__precio>.amount,.nv-carrito__precio-movil>.amount{font-weight:500}
:is(.nv-mc__precio,.nv-carrito__precio,.nv-carrito__precio-movil) .sale-price del{order:0;font-size:inherit;opacity:1}
.nv-mc del,.nv-carrito del{margin-inline-end:6px;color:var(--nv-price-compare);font-weight:400}
.nv-mc ins,.nv-carrito ins{color:var(--nv-price-sale);text-decoration:none;background:none;font-weight:500}
.nv-mc :is(del,ins) .amount,.nv-carrito :is(del,ins) .amount{color:inherit}

/* ══ Mini carrito: 680 px desde 768 (calc(100% - 20px) debajo); columna interior calc(100% - 200px) ≈ 480 ══ */
.nv-mc{--nv-cajon-w:680px;font-size:14px;line-height:1.5}
.nv-mc__contenedor{width:calc(100% - 200px);margin-inline:auto;box-sizing:border-box}
@media (max-width:1024px){.nv-mc{font-size:13px}.nv-mc__contenedor{width:calc(100% - 30px)}}
@media (max-width:767px){.nv-mc{--nv-cajon-w:calc(100% - 20px)}}
.nv-mc__cabecera{flex:none;margin-top:10px}
.nv-mc__cabecera>.nv-mc__contenedor{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:70px}
.nv-mc .nv-mc__titulo{--theme-font-size:15px;--theme-font-weight:600;--theme-line-height:37px;margin:0;color:var(--nv-ink);text-transform:uppercase;letter-spacing:0}
.nv-mc .nv-mc__cerrar{display:inline-flex;align-items:center;gap:5px;min-height:0;padding:0;border:0;background:transparent;color:var(--nv-ink);font:500 15px/37px var(--nv-font);box-shadow:none;cursor:pointer}
.nv-mc .nv-mc__cerrar:hover{border:0;background:transparent;color:var(--nv-ink)}
.nv-mc__cerrar .nv-i{width:22px;height:22px;stroke-width:1.6;transition:transform .5s ease}
.nv-mc__cerrar:hover .nv-i{transform:rotate(180deg)}
.nv-mc__cuerpo,.nv-mc .widget_shopping_cart_content{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
.nv-mc__scroll{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}

/* Líneas: imagen 100 px, separación punteada con 23 px arriba y abajo; título, variantes, precio unitario, cantidad y
   eliminar (§2.19): sin total de línea, que con 1 unidad repetía el precio */
.nv-mc .nv-mc__lineas{margin:0 auto;padding:0;list-style:none}
.nv-mc .nv-mc__linea{display:flex;align-items:center;margin:0;padding:23px 0;border-bottom:1px dotted var(--nv-border);transition:opacity .2s}
.nv-mc .nv-mc__linea:last-child{border-bottom:0}
.nv-mc .nv-mc__linea.is-actualizando{opacity:.4;pointer-events:none}
.nv-mc__img{flex:0 0 100px;display:block;width:100px;max-height:120px;margin-right:20px;overflow:hidden;background:var(--nv-placeholder)}
.nv-mc__img img{display:block;width:100%;height:auto;max-height:120px;object-fit:cover}
.nv-mc__info{position:relative;flex:1 1 auto;min-width:0;padding-right:30px;display:flex;flex-direction:column;justify-content:space-between}
.nv-mc__cab{padding-right:10px}
.nv-mc .nv-mc__nombre{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:3px;font-size:15px;font-weight:500;line-height:20px;
  color:rgba(21,21,21,.8);text-decoration:none;white-space:normal}
.nv-mc .nv-mc__nombre:hover{color:var(--nv-ink)}
.nv-mc__meta{font-size:12px}
.nv-mc .nv-mc__eliminar{position:absolute;top:0;right:0;z-index:1;display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;
  background:#fff;color:var(--nv-ink);box-shadow:0 1px 4px rgba(0,0,0,.1);text-decoration:none;transition:background-color .25s,color .25s}
.nv-mc .nv-mc__eliminar:hover{background:var(--nv-dark);color:#fff}
.nv-mc__eliminar .nv-i{width:18px;height:18px}
.nv-mc__acciones{display:flex;align-items:center;margin-top:5px}
@media (max-width:767px){.nv-mc__img{margin-right:15px}.nv-mc .nv-mc__eliminar{width:28px;height:28px}.nv-mc__eliminar .nv-i{width:14px;height:14px}}
/* Tooltip de Nitro (#383838): a la izquierda del botón, así el desplazamiento del cajón no lo recorta */
@media (hover:hover){
  .nv-mc [data-nv-tip]::after{content:attr(data-nv-tip);position:absolute;top:50%;right:calc(100% + 8px);z-index:5;padding:5px 10px;border-radius:3px;white-space:nowrap;
    background:var(--nv-tooltip-bg);color:var(--nv-tooltip-fg);font:400 12px/1.4 var(--nv-font);opacity:0;visibility:hidden;transform:translate(4px,-50%);
    transition:opacity .2s,transform .2s,visibility .2s;pointer-events:none}
  .nv-mc [data-nv-tip]:is(:hover,:focus-visible)::after{opacity:1;visibility:visible;transform:translate(0,-50%)}
  .nv-mc .nv-mc__herr-btn[data-nv-tip]::after{top:auto;right:50%;bottom:calc(100% + 8px);transform:translate(50%,4px)}
  .nv-mc .nv-mc__herr-btn[data-nv-tip]:is(:hover,:focus-visible)::after{transform:translate(50%,0)}
}

/* Herramientas: franja #f2f2f2 con la barra blanca de 50 px; solo «Añadir un cupón», como Nitro */
.nv-mc__herramientas{padding:23px 0;background:#f2f2f2}
.nv-mc__herr-barra{display:flex;justify-content:center}
.nv-mc .nv-mc__herr-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:25%;height:50px;min-height:0;padding:0 20px;border:0;border-radius:0;
  background:#fff;color:var(--nv-ink);box-shadow:0 1px 4px rgba(21,21,21,.2);cursor:pointer}
.nv-mc .nv-mc__herr-btn:hover{border:0;background:#f7f7f7;color:var(--nv-ink)}
.nv-mc__herr-btn .nv-i{width:22px;height:22px}

/* También te puede gustar: 1 por vista, bucle y puntos; flechas pequeñas junto al título */
.nv-mc__recos{padding:25px 0 15px}
.nv-mc__recos-titulo{margin:0 0 15px;padding-right:70px;font-size:15px;font-weight:500;line-height:26px;color:var(--nv-ink)}
.nv-mc__recos .nv-carrusel .nv-carrusel__flecha{top:-41px;width:26px;height:26px;transform:none;box-shadow:none}
.nv-mc__recos .nv-carrusel .nv-carrusel__flecha .nv-i{width:10px;height:10px}
.nv-mc__recos .nv-carrusel__flecha--ant{left:auto;right:32px}
.nv-mc__recos .nv-carrusel__flecha--sig{right:0}
.nv-mc__recos .nv-carrusel__puntos{gap:8px;margin-top:15px}
.nv-mc__recos .nv-carrusel .nv-carrusel__punto{width:8px;height:8px}
.nv-mc__reco{display:flex;align-items:center;gap:20px;min-width:0}
.nv-mc__reco-img{flex:0 0 80px;display:block;width:80px;background:var(--nv-placeholder)}
.nv-mc__reco-img img{display:block;width:100%;height:auto}
.nv-mc__reco-info{flex:1 1 auto;min-width:0}
.nv-mc .nv-mc__reco-titulo{display:block;margin-bottom:4px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:14px;line-height:1.25;color:var(--nv-ink);text-decoration:none}
.nv-mc .nv-mc__reco-titulo:hover{color:var(--nv-accent)}
.nv-mc__reco-precio{display:block;font-size:12px;color:var(--nv-price-compare)}
.nv-mc__reco-precio>.amount,.nv-mc .nv-mc__reco-precio ins{color:var(--nv-price)}

/* Pie fijo: total parcial a 24 px en todos los anchos (§2.19 y carrito-paginas.md §3.9, sin variante móvil) y los dos
   botones en fila (apilados en <768) */
.nv-mc__pie{position:relative;z-index:2;flex:none;padding:25px 0;background:#fff;box-shadow:0 -10px 15px rgba(0,0,0,.08);font-size:13px;line-height:20px}
.nv-mc .nv-mc__cupones{margin:0 0 5px;padding:0;list-style:none;color:var(--nv-highlight);font-weight:500}
.nv-mc__cupon-aplicado{display:flex;align-items:center;gap:6px;margin:0 0 4px}
.nv-mc__cupon-aplicado>.nv-i{width:14px;height:14px}
.nv-mc__cupon-aplicado .amount{color:inherit}
.nv-mc .nv-mc__cupon-quitar{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;min-height:0;padding:0;border:0;background:transparent;color:var(--nv-ink)}
.nv-mc .nv-mc__cupon-quitar:hover{border:0;background:transparent;color:var(--nv-error)}
.nv-mc__cupon-quitar .nv-i{width:12px;height:12px}
.nv-mc__total{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px;font-size:24px;line-height:1.3;color:var(--nv-ink)}
.nv-mc__total-et{font-weight:400}
.nv-mc__total-monto{font-weight:500;text-align:right;white-space:nowrap}
.nv-mc__total-monto .amount{color:inherit}
.nv-mc__botones{display:flex;justify-content:space-between;gap:10px;margin-top:20px}
.nv-mc .nv-mc__btn{flex:0 1 calc(50% - 5px);max-width:calc(50% - 5px);box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 25px;
  border:1px solid var(--nv-dark);border-radius:var(--nv-radius);font:500 12px/1 var(--nv-font);text-align:center;text-transform:uppercase;text-decoration:none;
  transition:color .25s ease-in-out,background-color .25s ease-in-out,border-color .25s ease-in-out}
.nv-mc .nv-mc__btn--carrito{background:transparent;color:var(--nv-dark)}
.nv-mc .nv-mc__btn--carrito:hover{background:var(--nv-dark);color:#fff}
.nv-mc .nv-mc__btn--pagar{background:var(--nv-dark);color:#fff}
.nv-mc .nv-mc__btn--pagar:hover{border-color:var(--nv-oro-borde);background:var(--nv-oro);color:#151515}
@media (max-width:1024px){.nv-mc__pie{padding:15px 0}}
/* Móvil: a 390 la fila del total mide 340 px y con 24 px la etiqueta (125) más el monto (205, con nowrap) más los 10
   del hueco no caben, así que «Total parcial:» partía en dos líneas justo encima de los botones (medido el 2026-09-13
   con el cajón abierto). A 20 px la etiqueta baja a ~104 y el monto a ~171: caben en una línea. §2.19 fija los 24 px
   sin decir nada de móvil. */
@media (max-width:767px){.nv-mc__botones{flex-direction:column}.nv-mc .nv-mc__btn{flex-basis:auto;width:100%;max-width:100%}.nv-mc__total{font-size:20px}}

/* Vacío: la frase a 18 px, 70 px bajo la barra, y el botón oscuro «Volver a la tienda» */
.nv-mc__vacio{margin-top:70px;text-align:center}
.nv-mc__vacio-texto{margin:0 0 15px;font-size:18px;color:var(--nv-ink)}
.nv-mc .nv-mc__vacio-btn{min-width:160px;min-height:46px;padding:5px 25px;border-radius:var(--nv-radius);font:500 12px/1 var(--nv-font);text-transform:uppercase}

/* Panel del cupón: sube desde abajo sobre el cajón, como la herramienta de Nitro. Cerrado va con el atributo hidden
   (lo pone y lo quita nv-carrito.js al terminar la transición): solo con visibility:hidden seguía maquetado, la
   trampa de foco de nv-base.js tomaba su «Aplicar» invisible como último elemento y Tab salía del cajón. */
.nv-mc__panel{position:absolute;left:0;right:0;bottom:0;z-index:8;max-height:100%;overflow-y:auto;padding:25px 0;background:#fff;box-shadow:0 -10px 15px rgba(0,0,0,.08);
  font-size:15px;transform:translateY(104%);visibility:hidden;transition:transform .5s ease-in-out,visibility 0s linear .5s}
.nv-mc__panel[hidden]{display:none}
.nv-mc__panel.is-abierto{transform:none;visibility:visible;transition:transform .5s ease-in-out,visibility 0s}
.nv-mc__panel-titulo{margin:0 0 6px;font-size:18px;font-weight:500;line-height:1.3;color:var(--nv-ink)}
.nv-mc__panel-texto{margin:0 0 10px;font-size:13px;line-height:1.5;color:var(--nv-muted)}
.nv-mc .nv-mc__panel-campo{height:46px;font-size:15px}
.nv-mc__panel-aviso{margin:8px 0 0;font-size:13px;line-height:1.5;color:var(--nv-error)}
.nv-mc__panel-botones{display:flex;gap:10px;margin-top:15px}
.nv-mc .nv-mc__panel-btn{flex:1 1 calc(50% - 5px);min-height:46px;padding:5px 25px;border-radius:var(--nv-radius);font:400 13px/1 var(--nv-font);text-transform:uppercase}
.nv-mc .nv-mc__panel-btn--cancelar{border:1px solid var(--nv-border);background:rgba(21,21,21,.3);color:var(--nv-dark)}
.nv-mc .nv-mc__panel-btn--cancelar:hover{border-color:var(--nv-dark);background:var(--nv-dark);color:#fff}
.nv-mc__cupon.is-enviando{opacity:.6;pointer-events:none}