SIN clase .total (history.tpl:52), y las tarjetas de .orders.hidden-md-up, donde el importe SI es
(history.tpl:89). Como la regla se colgaba de .total, en escritorio no salia nada y el cliente veia una cifra MENOR que la que pago, sin ninguna marca. */
/* v1.7.44 - Que la cifra es NETA esta medido en produccion, no supuesto: el pedido 260900140 da Total Productos $ 329.799, IVA $ 62.662 y Subtotal $ 329.799, y la celda del historial muestra 329.799. Las dos variantes son excluyentes (a 1512 la tabla se ve y las tarjetas van a display:none; a 393 al reves), asi que el sufijo nunca sale dos veces. */
/* v1.7.44 - TRATAMIENTO: no es texto suelto, es el CHIP DE DATO del DS (5.7): pastilla de radio --cp-r-pill, relleno 2px 9px, ~11px, fondo blanco y borde fino neutro, que es el patron que el DS reserva para METADATOS junto a una cifra. El borde va en --cp-border-strong y no en --cp-border porque las filas alternas del historial usan rgba(0,0,0,.05): con el borde claro el canto del chip no se leia sobre la fila tintada. */
/* v1.7.44 - Texto en --cp-text #666666 sobre blanco = 5,74:1, AA. El DS prohibe expresamente --cp-text-muted #7A7A7A como color de TEXTO (4,29:1). El peso 600 a 11px lo separa del importe, que va a 16px/400. */
.page-history .total::after, .page-history table td.text-xs-right::after{content:"+ IVA";display:inline-block;margin-left:6px;padding:2px 9px;border:1px solid var(--cp-border-strong);border-radius:var(--cp-r-pill);background-color:var(--cp-surface);color:var(--cp-text);font-size:11px;font-weight:600;line-height:1.45;vertical-align:middle;white-space:nowrap}
/* v1.7.45 - LA CABECERA DE UNA COLUMNA DE IMPORTES SIGUE A SUS VALORES. Medido en vivo: en el historial la cabecera "Total" iba a la izquierda y sus cifras a la derecha, con 115px entre los centros de uno y otro; en el detalle, "Precio unitario" 94px y "Precio total" 89px. Son las tres unicas columnas incoherentes de toda el area de cuenta (auditadas todas las tablas con cabecera). */
/* v1.7.45 - Se acota por POSICION porque no hay otro asidero: el
del importe no lleva clase en el historial (history.tpl). En el detalle si hay un id estable, #order-products, asi que ahi la posicion va anclada a el. La bateria incorpora el control 13, que comprueba en marcado real que cada cabecera comparte alineacion con su columna: si el core reordena, sale en rojo. */
.page-history table thead th:nth-child(3){text-align:right}
/* v1.7.45 - La revision adversarial encontro que order-detail-return.tpl emite el MISMO #order-products con clase "return" y una columna de checkbox delante: alli los importes son las columnas 5 y 6, y la 4 (Devuelto) tambien va a la derecha en sus celdas (td.text-xs-right, verificado en la plantilla del core; misma rama en PS 9.1.4). Sin el :not(), la regla habria alineado a la derecha la cabecera de Cantidad sobre celdas a la izquierda: la misma incoherencia que esta version corrige, recreada en la variante de devoluciones. */
/* v1.7.51 - PUNTO 1 del director: la CANTIDAD iba a la izquierda mientras el precio unitario y el total iban a la derecha, y son los tres numeros de la misma familia. MEDIDO en devel sobre el pedido 849: las cuatro celdas computaban [start, start, right, right] y las cuatro cabeceras [left, left, right, right], en 900, 1024, 1280 y 1512 -o sea en las DOS formas que toma la tabla: apilada en tarjetas por debajo de 992 y tabla real por encima-. La cabecera y la celda se declaran en la MISMA regla a proposito: el control 13 exige que cada cabecera comparta text-align con su columna, y separarlas es justo como se rompe eso. */
.page-order-detail #order-products:not(.return) thead th:nth-child(2), .page-order-detail #order-products:not(.return) thead th:nth-child(3), .page-order-detail #order-products:not(.return) thead th:nth-child(4), .page-order-detail #order-products:not(.return) tbody td:nth-child(2), .page-guest-tracking #order-products:not(.return) thead th:nth-child(2), .page-guest-tracking #order-products:not(.return) thead th:nth-child(3), .page-guest-tracking #order-products:not(.return) thead th:nth-child(4), .page-guest-tracking #order-products:not(.return) tbody td:nth-child(2){text-align:right}
.page-order-detail #order-products.return thead th:nth-child(4), .page-order-detail #order-products.return thead th:nth-child(5), .page-order-detail #order-products.return thead th:nth-child(6){text-align:right}
/* v1.7.48 - LAS DOS ACCIONES DEL HISTORIAL PASAN A BOTONES (variante M1-A, aprobada por el director). Motivo medido en el marcado real: en la tarjeta movil (history.tpl:99-112) las acciones son anclas con SOLO un dentro -el tema las pinta a 24px sin margen -.material-icons pelada declara font-size:24px, y el margin-right:.625rem y el font-size:1rem del tema estan ACOTADOS a .btn-primary/.btn-secondary/.btn-tertiary, no al icono suelto-, es decir muy por debajo del minimo tactil de 40x40 del DS; y en la tabla (history.tpl:69-76) son texto suelto al que el tema da .page-customer-account #content .order-actions a{padding:0 .125rem}, unos 21px de alto. */
/* v1.7.48 - EL ROTULO DEL BOTON MOVIL SALE DE attr(title) Y NO SE HARDCODEA: esas dos anclas no tienen nodo de texto, pero SI llevan title con la cadena de Traducciones ({l s='Details'} y {l s='Reorder'}), asi que content:attr(title) reutiliza EL MISMO literal que muestra la tabla de escritorio. Con eso las dos vistas no pueden divergir, cambiar el texto en BO > Traducciones cambia las dos a la vez, y si el title llegara vacio queda el icono solo: degradacion benigna. */
/* v1.7.48 - SE RETIRAN PRIMERO LAS DOS REGLAS SUPERADAS de estas acciones (el border-right separador de .view-order-details-link y el padding/font-size del td): en CSS escribir encima NO es aditivo y ese filete se habria pintado DENTRO del boton, que es exactamente la familia de defectos de la v1.7.26. */
/* v1.7.48 - CONTRASTE: los rotulos van en --cp-link-hover #006BB3 y no en --cp-link #007ACC, que sobre el fondo hundido #F8F9FA da 4,28:1 y no cumple AA a 13px/600 (no es texto grande). Calculado: #006BB3 da 5,31:1 sobre el hundido y 4,81:1 sobre el fondo pulsado #ECEEF1. Es el mismo 4,28 que ya se corrigio en las v1.7.4 y v1.7.13. */
/* v1.7.48 - El foco NO necesita regla propia: .page-history a:focus-visible (0,2,1) ya da anillo del DS y color, y como las reglas del boton son (1,3,1) en la tabla y (1,4,1)/(1,5,1) en la tarjeta, el radio del boton gana tambien en foco, asi que el anillo sigue el canto de 8px en vez del 2px generico. */
/* v1.7.48 - LA CELDA DEJA QUE LOS BOTONES ENVUELVAN, y esto NO es preferencia: con los dos botones en linea y sin poder envolver, el ancho minimo de la ultima columna sube y ARRASTRA A TODA LA TABLA. Medido con el control 14 contra la v1.7.45 de produccion, que no desborda a ningun ancho: la tabla pedia 787px donde el contenedor da 720 (768-991) y 977 donde da 960 (1024-1025). Dejandolos envolver, el minimo de la celda pasa a ser el del boton mas ancho y el reparto de la tabla decide solo: por debajo de 1200px se apilan y desde ahi vuelven a la linea (ver la regla siguiente). */
/* v1.7.48 - Se descarto display:flex en el
: Chrome calcula mal el ancho MAXIMO intrinseco de una celda flex y la tabla le daba siempre el minimo, con lo que los botones se apilaban tambien a 1440px (medido). Con el flujo en linea de siempre, font-size:0 en la celda mata el espacio en blanco entre las dos anclas y el margen de 4px por lado da los 8px que el DS exige entre objetivos tactiles, tanto en horizontal como al envolver. */
.page-history #content .text-sm-center.order-actions{padding:8px 10px;font-size:0;white-space:normal}
/* v1.7.48 - Se apunta a "a" dentro del td y no a .view-order-details-link porque las clases de esas dos anclas estan NO VERIFICADAS en el DOM de esta tienda (la auditoria estatica las dejo en NO_VERIFICADO_EN_PRODUCCION y un arnes propio las transcribio con class="label"). Con "a" el boton sale en los dos casos, y se redeclaran ademas las SIETE propiedades que .table-labeled .label del tema impone a un enlace con esa clase -color:#fff, padding, margin, font-size:inherit, font-weight, white-space y border-radius- para que el resultado no dependa de cual sea. Experimento que lo cierra: en el historial con sesion, document.querySelector(".order-actions a").className. */
.page-history #content .text-sm-center.order-actions a{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:34px;margin:4px;padding:0 12px;border:1px solid #BADCF3;border-radius:var(--cp-r-btn);background-color:#F1F7FB;color:var(--cp-link-hover);font-size:12px;font-weight:600;line-height:1.2;text-decoration:none;white-space:nowrap;transition:background-color var(--cp-t-fast), border-color var(--cp-t-fast)}
.page-history #content .text-sm-center.order-actions a:hover{background-color:var(--cp-info-bg);border-color:var(--cp-link)}
.page-history #content .text-sm-center.order-actions a:focus-visible{border-color:var(--cp-link)}
/* v1.7.48 - En tablet la misma tabla se toca con el dedo (el core la muestra desde 768px con hidden-sm-down), asi que ahi los botones suben al minimo tactil de 40px del DS y el hueco entre ambos pasa de 8 a 10px. En escritorio se quedan en 34px: el puntero fino no necesita 40 y la fila de la tabla no debe engordar. */
@media (min-width:768px) and (max-width:1024.98px){.page-history #content .text-sm-center.order-actions{padding:6px 10px}.page-history #content .text-sm-center.order-actions a{min-height:40px;margin:5px}}
/* v1.7.48 - El h3 de la referencia se reescribe aqui de todos modos, asi que se le corrige el color: el tema lo deja en #7A7A7A (4,29:1 sobre blanco), que a 16px/700 NO es texto grande para la norma -pide 18,66px en negrita- y por tanto incumple AA. Pasa a --cp-text-heading #404040, 9,74:1. */
/* v1.7.48 - DESDE 1200px LOS DOS BOTONES VUELVEN A LA LINEA, que es como el director aprobo la M1-A. Sin esta regla se apilan en TODOS los anchos -medido de 768 a 1920- y la fila de la tabla engorda de 63 a 100px. El corte no es 1025 sino 1200 porque el limite real no es el viewport sino el .container de Bootstrap: hasta 1199 mide 960px y la celda solo recibe 160 de los 239 que los dos botones necesitan (forzar la linea ahi desborda la tabla +11px, medido); desde 1200 el contenedor pasa a 1140 y caben con holgura. Por debajo se apilan, que es justo lo que evita el desborde. */
@media (min-width:1200px){.page-history #content .text-sm-center.order-actions{white-space:nowrap}}
/* v1.7.48 - LA TARJETA MOVIL, con el orden aprobado: referencia y total arriba, fecha y chip de estado abajo. Se monta con grid sobre .col-xs-10 porque el posicionamiento por grid-area no depende del orden del DOM, que es a>h3, .date, .total, .status. Hay que neutralizar de Bootstrap el float, el ancho porcentual y el canalon de 15px de las dos columnas: sin eso .col-xs-2 seguiria siendo una columna del 16,66% y los botones no cabrian. */
@media (max-width:767.98px){.page-history #content .orders .order .row{display:block;margin:0}}
@media (max-width:767.98px){.page-history #content .orders .order .col-xs-10{display:grid;grid-template-columns:1fr auto;column-gap:12px;row-gap:6px;align-items:center;float:none;width:100%;padding:0}}
/* v1.7.50 - PUNTO 1 del director: la rejilla tiene que ACOGER a los hijos que no son suyos. cporderinvoice inyecta por JS (history-column.js, injectCards) un div.cpinvoice-fo-doc como hermano siguiente de .status, o sea DENTRO de este .col-xs-10; sin area asignada quedaba en auto-colocacion y caia donde hubiera hueco: MEDIDO EN VIVO sobre el pedido 260900150 de devel, en 431-767 caia en la fila 3 columna 1 y le faltaban 127,0px exactos (los 114,98 de la columna 2 mas los 12 del canalon) en cinco anchos, y bajo 431 caia en la fila 2 columna 2 -el hueco que deja el chip al irse a su fila-, o sea A LA DERECHA DE LA FECHA, ademas de inflar la columna 2 a 194,1px y estrujar el numero de pedido a 84,5px a 360. Esta regla general da ancho completo a CUALQUIER hijo, presente o futuro, y pesa (1,4,0): pierde contra las cuatro piezas del core, que pesan (1,4,1) y (1,5,0). No nombra al modulo a proposito: si manana otro modulo inyecta algo ahi, tambien cae bien. OJO AL MANTENERLA: este selector va SIN el body pegado, contra el habito del proyecto, y tiene que seguir asi. Con `body.page-history` sube a (1,4,1), EMPATA con la regla `> a` y le roba el grid-column-end por orden: medido a 360 y 393, la referencia sale a ancho completo y el importe se pinta encima. Aqui hace falta PERDER, no ganar. */
@media (max-width:767.98px){.page-history #content .orders .order .col-xs-10 > *{grid-column:1/-1}}
@media (max-width:767.98px){.page-history #content .orders .order .col-xs-10 > a{grid-area:1/1;min-width:0}}
@media (max-width:767.98px){.page-history #content .orders .order .col-xs-10 > a > h3{margin:0;font-size:16px;line-height:1.3;color:var(--cp-text-heading)}}
@media (max-width:767.98px){.page-history #content .orders .order .col-xs-10 > .total{grid-area:1/2;justify-self:end}}
@media (max-width:767.98px){.page-history #content .orders .order .col-xs-10 > .date{grid-area:2/1}}
@media (max-width:767.98px){.page-history #content .orders .order .col-xs-10 > .status{grid-area:2/2;justify-self:end}}
@media (max-width:767.98px){.page-history #content .orders .order .col-xs-2{display:flex;gap:8px;float:none;width:100%;padding:0;margin-top:10px}}
@media (max-width:767.98px){.page-history #content .orders .order .col-xs-2 > div{flex:1 1 50%;display:flex}}
@media (max-width:767.98px){.page-history #content .orders .order .col-xs-2 a{flex:1 1 auto;display:inline-flex;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;min-width:0;min-height:40px;padding:0 10px;border:1px solid #BADCF3;border-radius:var(--cp-r-btn);background-color:#F1F7FB;color:var(--cp-link-hover);font-size:12px;font-weight:600;line-height:1.2;text-decoration:none}}
@media (max-width:767.98px){.page-history #content .orders .order .col-xs-2 a:hover{background-color:var(--cp-info-bg);border-color:var(--cp-link)}}
@media (max-width:767.98px){.page-history #content .orders .order .col-xs-2 a:focus-visible{border-color:var(--cp-link)}}
@media (max-width:767.98px){.page-history #content .orders .order .col-xs-2 a::after{content:attr(title);min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}}
@media (max-width:767.98px){.page-history #content .orders .order .col-xs-2 a .material-icons{flex:0 0 auto;margin:0;font-size:15px;line-height:1}}
/* v1.7.48 - Por debajo de 360px los dos botones lado a lado dejan menos de 80px utiles para el rotulo y "Volver a comprar" se recortaria con puntos suspensivos, asi que ahi se apilan a ancho completo. Este bloque va DESPUES del de 767.98 a proposito: los dos casan a 320px y a igual especificidad decide el orden de fuente (leccion v1.7.8). */
@media (max-width:359.98px){.page-history #content .orders .order .col-xs-2{flex-wrap:wrap}.page-history #content .orders .order .col-xs-2 > div{flex:1 1 100%}}
.page-order-detail .box table.table-striped thead tr th:nth-child(3), .page-order-detail .box table.table-striped tbody tr td:nth-child(3), .page-guest-tracking .box table.table-striped thead tr th:nth-child(3), .page-guest-tracking .box table.table-striped tbody tr td:nth-child(3){display:none}
.page-order-detail .shipping-line > ul > li:nth-child(3), .page-guest-tracking .shipping-line > ul > li:nth-child(3){display:none}
/* v1.7.47 - CHIP DE ESTADO B2-AUTOMATICO (contrato del director, 05-09-2026): el color del BO manda para texto y borde, y el FONDO se deriva de el solo. El unico dato que llega es background-color EN LINEA (4 emisiones: history.tpl:56,92 y order-detail.tpl:99,112) y de el salen DOS piezas sin mapa: el ANILLO del borde -border transparente + el background-color clipeado a border-box asoma PURO en ese 1px- y el PASTEL del interior -capa de velo blanco al 90% clipeada a padding-box-. La capa transparente extra existe para que el clip del background-color sea el de la ULTIMA capa (border-box): sin ella el color se recorta al padding-box y el anillo desaparece (verificado con sondeo de pixeles, variante de control incluida). */
/* v1.7.47 - EL TEXTO es lo unico que CSS no puede leer del style en linea: va por MAPA-IDENTIDAD (43 anclas [style*="#XXXXXX" i] que solo declaran --cp-chip-texto): para los hex RECOMENDADOS y los oscuros vigentes el texto ES el mismo hex del BO (identidad, contrato estricto); para las 19 anclas heredadas que no alcanzan 4,6 sobre su propio pastel, su par oscurecido (las claras de verdad -#CDDC39, #FBC02D, #32CD32- serian ilegibles; el resto solo roza el umbral). Respaldo para un hex futuro sin mapa: --cp-text-strong #262626 sobre el pastel del tono nuevo (>=10:1) con su anillo y pastel CORRECTOS automaticos - legible siempre, solo el texto pierde el tono hasta anadir una linea al mapa con tests/generar_chip.py. */
/* v1.7.47 - Contrastes validados por el generador: los 43 textos cumplen AA (4,5) sobre su pastel 90/10 con objetivo interno 4,6 a dos decimales (peor caso exacto 4,56 segun cuantizacion) y dan >=5,2 sobre blanco (lo que queda en @media print, donde fondos y anillo no se imprimen). En forced-colors el sistema repinta el texto y el estado lo comunica el TEXTO del propio estado. Especificidades de los 4 contextos, las de la v1.7.45/46: historial movil por victoria (1,4,0)>(1,3,0); las DOS tablas (0,2,0)=(0,2,0 del tema) y el history-lines del detalle (1,4,0)=(1,4,0) por empate+orden -custom.css carga ultimo en el bundle. */
.page-history .label-pill, .page-order-detail .label-pill, .page-history #content .orders .order .label-pill, .page-order-detail #order-history .history-lines .history-line .label-pill, .page-guest-tracking .label-pill, .page-guest-tracking #order-history .history-lines .history-line .label-pill{display:inline-block;border:1px solid transparent;border-radius:var(--cp-r-pill);padding:3px 11px;font-size:13px;font-weight:700;line-height:1.35;letter-spacing:.01em;color:var(--cp-chip-texto,var(--cp-text-strong));background-image:linear-gradient(rgba(255,255,255,.9),rgba(255,255,255,.9)),linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0));background-clip:padding-box,border-box;background-origin:padding-box,border-box}
@media (max-width:767.98px){.page-history #content .orders .order .label-pill, .page-order-detail .label-pill, .page-order-detail #order-history .history-lines .history-line .label-pill, .page-guest-tracking .label-pill, .page-guest-tracking #order-history .history-lines .history-line .label-pill{font-size:12px;padding:2px 9px}}
/* v1.7.47 - EL MAPA DE TEXTO: 24 identidades (recomendados + heredados aptos) + 19 pares oscurecidos para las anclas heredadas bajo 4,6. El flag i cubre mayusculas/minusculas (validado con #b35900 real). Regenerable con tests/generar_chip.py. */
.page-history .label-pill[style*="#5364C7" i], .page-order-detail .label-pill[style*="#5364C7" i], .page-guest-tracking .label-pill[style*="#5364C7" i]{--cp-chip-texto:#5364C7}
.page-history .label-pill[style*="#0A6CC4" i], .page-order-detail .label-pill[style*="#0A6CC4" i], .page-guest-tracking .label-pill[style*="#0A6CC4" i]{--cp-chip-texto:#0A6CC4}
.page-history .label-pill[style*="#8A24A8" i], .page-order-detail .label-pill[style*="#8A24A8" i], .page-guest-tracking .label-pill[style*="#8A24A8" i]{--cp-chip-texto:#8A24A8}
.page-history .label-pill[style*="#8E6500" i], .page-order-detail .label-pill[style*="#8E6500" i], .page-guest-tracking .label-pill[style*="#8E6500" i]{--cp-chip-texto:#8E6500}
.page-history .label-pill[style*="#A95400" i], .page-order-detail .label-pill[style*="#A95400" i], .page-guest-tracking .label-pill[style*="#A95400" i]{--cp-chip-texto:#A95400}
.page-history .label-pill[style*="#007585" i], .page-order-detail .label-pill[style*="#007585" i], .page-guest-tracking .label-pill[style*="#007585" i]{--cp-chip-texto:#007585}
.page-history .label-pill[style*="#00795B" i], .page-order-detail .label-pill[style*="#00795B" i], .page-guest-tracking .label-pill[style*="#00795B" i]{--cp-chip-texto:#00795B}
.page-history .label-pill[style*="#68720C" i], .page-order-detail .label-pill[style*="#68720C" i], .page-guest-tracking .label-pill[style*="#68720C" i]{--cp-chip-texto:#68720C}
.page-history .label-pill[style*="#007C3B" i], .page-order-detail .label-pill[style*="#007C3B" i], .page-guest-tracking .label-pill[style*="#007C3B" i]{--cp-chip-texto:#007C3B}
.page-history .label-pill[style*="#404040" i], .page-order-detail .label-pill[style*="#404040" i], .page-guest-tracking .label-pill[style*="#404040" i]{--cp-chip-texto:#404040}
.page-history .label-pill[style*="#CB2B2B" i], .page-order-detail .label-pill[style*="#CB2B2B" i], .page-guest-tracking .label-pill[style*="#CB2B2B" i]{--cp-chip-texto:#CB2B2B}
.page-history .label-pill[style*="#C73000" i], .page-order-detail .label-pill[style*="#C73000" i], .page-guest-tracking .label-pill[style*="#C73000" i]{--cp-chip-texto:#C73000}
.page-history .label-pill[style*="#2F5EED" i], .page-order-detail .label-pill[style*="#2F5EED" i], .page-guest-tracking .label-pill[style*="#2F5EED" i]{--cp-chip-texto:#2F5EED}
.page-history .label-pill[style*="#7C1EDC" i], .page-order-detail .label-pill[style*="#7C1EDC" i], .page-guest-tracking .label-pill[style*="#7C1EDC" i]{--cp-chip-texto:#7C1EDC}
.page-history .label-pill[style*="#167D16" i], .page-order-detail .label-pill[style*="#167D16" i], .page-guest-tracking .label-pill[style*="#167D16" i]{--cp-chip-texto:#167D16}
.page-history .label-pill[style*="#D3052D" i], .page-order-detail .label-pill[style*="#D3052D" i], .page-guest-tracking .label-pill[style*="#D3052D" i]{--cp-chip-texto:#D3052D}
.page-history .label-pill[style*="#067D06" i], .page-order-detail .label-pill[style*="#067D06" i], .page-guest-tracking .label-pill[style*="#067D06" i]{--cp-chip-texto:#067D06}
.page-history .label-pill[style*="#5C6BC0" i], .page-order-detail .label-pill[style*="#5C6BC0" i], .page-guest-tracking .label-pill[style*="#5C6BC0" i]{--cp-chip-texto:#5665BE}
.page-history .label-pill[style*="#166DBA" i], .page-order-detail .label-pill[style*="#166DBA" i], .page-guest-tracking .label-pill[style*="#166DBA" i]{--cp-chip-texto:#166DBA}
.page-history .label-pill[style*="#8C6503" i], .page-order-detail .label-pill[style*="#8C6503" i], .page-guest-tracking .label-pill[style*="#8C6503" i]{--cp-chip-texto:#8C6503}
.page-history .label-pill[style*="#697214" i], .page-order-detail .label-pill[style*="#697214" i], .page-guest-tracking .label-pill[style*="#697214" i]{--cp-chip-texto:#687114}
.page-history .label-pill[style*="#007D3C" i], .page-order-detail .label-pill[style*="#007D3C" i], .page-guest-tracking .label-pill[style*="#007D3C" i]{--cp-chip-texto:#007C3B}
.page-history .label-pill[style*="#262626" i], .page-order-detail .label-pill[style*="#262626" i], .page-guest-tracking .label-pill[style*="#262626" i]{--cp-chip-texto:#262626}
.page-history .label-pill[style*="#D32F2F" i], .page-order-detail .label-pill[style*="#D32F2F" i], .page-guest-tracking .label-pill[style*="#D32F2F" i]{--cp-chip-texto:#CB2B2B}
.page-history .label-pill[style*="#CA3100" i], .page-order-detail .label-pill[style*="#CA3100" i], .page-guest-tracking .label-pill[style*="#CA3100" i]{--cp-chip-texto:#C73000}
.page-history .label-pill[style*="#8E24AA" i], .page-order-detail .label-pill[style*="#8E24AA" i], .page-guest-tracking .label-pill[style*="#8E24AA" i]{--cp-chip-texto:#8E24AA}
.page-history .label-pill[style*="#007580" i], .page-order-detail .label-pill[style*="#007580" i], .page-guest-tracking .label-pill[style*="#007580" i]{--cp-chip-texto:#007580}
.page-history .label-pill[style*="#B35900" i], .page-order-detail .label-pill[style*="#B35900" i], .page-guest-tracking .label-pill[style*="#B35900" i]{--cp-chip-texto:#A95400}
.page-history .label-pill[style*="#4169E1" i], .page-order-detail .label-pill[style*="#4169E1" i], .page-guest-tracking .label-pill[style*="#4169E1" i]{--cp-chip-texto:#3761DF}
.page-history .label-pill[style*="#8A2BE2" i], .page-order-detail .label-pill[style*="#8A2BE2" i], .page-guest-tracking .label-pill[style*="#8A2BE2" i]{--cp-chip-texto:#8A2BE2}
.page-history .label-pill[style*="#1E7B1E" i], .page-order-detail .label-pill[style*="#1E7B1E" i], .page-guest-tracking .label-pill[style*="#1E7B1E" i]{--cp-chip-texto:#1E7B1E}
.page-history .label-pill[style*="#DC143C" i], .page-order-detail .label-pill[style*="#DC143C" i], .page-guest-tracking .label-pill[style*="#DC143C" i]{--cp-chip-texto:#D01339}
.page-history .label-pill[style*="#108510" i], .page-order-detail .label-pill[style*="#108510" i], .page-guest-tracking .label-pill[style*="#108510" i]{--cp-chip-texto:#0F7D0F}
.page-history .label-pill[style*="#1E88E5" i], .page-order-detail .label-pill[style*="#1E88E5" i], .page-guest-tracking .label-pill[style*="#1E88E5" i]{--cp-chip-texto:#166DBA}
.page-history .label-pill[style*="#FBC02D" i], .page-order-detail .label-pill[style*="#FBC02D" i], .page-guest-tracking .label-pill[style*="#FBC02D" i]{--cp-chip-texto:#8C6503}
.page-history .label-pill[style*="#CDDC39" i], .page-order-detail .label-pill[style*="#CDDC39" i], .page-guest-tracking .label-pill[style*="#CDDC39" i]{--cp-chip-texto:#687114}
.page-history .label-pill[style*="#00A650" i], .page-order-detail .label-pill[style*="#00A650" i], .page-guest-tracking .label-pill[style*="#00A650" i]{--cp-chip-texto:#007C3C}
.page-history .label-pill[style*="#E53935" i], .page-order-detail .label-pill[style*="#E53935" i], .page-guest-tracking .label-pill[style*="#E53935" i]{--cp-chip-texto:#CF1F1B}
.page-history .label-pill[style*="#FF5722" i], .page-order-detail .label-pill[style*="#FF5722" i], .page-guest-tracking .label-pill[style*="#FF5722" i]{--cp-chip-texto:#C93000}
.page-history .label-pill[style*="#1D9EAF" i], .page-order-detail .label-pill[style*="#1D9EAF" i], .page-guest-tracking .label-pill[style*="#1D9EAF" i]{--cp-chip-texto:#167683}
.page-history .label-pill[style*="#1E9EAE" i], .page-order-detail .label-pill[style*="#1E9EAE" i], .page-guest-tracking .label-pill[style*="#1E9EAE" i]{--cp-chip-texto:#177683}
.page-history .label-pill[style*="#009EB3" i], .page-order-detail .label-pill[style*="#009EB3" i], .page-guest-tracking .label-pill[style*="#009EB3" i]{--cp-chip-texto:#007585}
.page-history .label-pill[style*="#32CD32" i], .page-order-detail .label-pill[style*="#32CD32" i], .page-guest-tracking .label-pill[style*="#32CD32" i]{--cp-chip-texto:#1E7C1E}
.page-order-detail .definition-list dl dt, .page-order-confirmation .definition-list dl dt, .page-guest-tracking .definition-list dl dt{flex:0 0 30%;padding:5px;background-color:var(--cp-surface-section);border-radius:var(--cp-r-input)}
.page-order-detail .definition-list dl dd, .page-order-confirmation .definition-list dl dd, .page-guest-tracking .definition-list dl dd{flex:0 0 70%;padding:5px;background-color:var(--cp-surface-section);border-radius:var(--cp-r-input)}
.page-order-confirmation #order-details .card-title, .page-order-confirmation #order-items .card-title{border-bottom:1px solid var(--cp-border);font-weight:700}
.page-order-confirmation #order-items hr{border-top-color:var(--cp-border)}
.page-order-confirmation #order-items table tr.taxes td{text-align:right;font-weight:600}
.page-order-confirmation #content-hook_payment_return.definition-list dl{font-size:14px}
.page-order-confirmation #content-hook_order_confirmation, .page-order-confirmation #content-hook_payment_return{background-color:var(--cp-surface);border:1px solid var(--cp-border);border-radius:var(--cp-r-card);box-shadow:var(--cp-shadow-card);padding:20px;margin-bottom:16px;color:var(--cp-text)}
.page-order-confirmation #content-hook_order_confirmation h3, .page-order-confirmation #content-hook_order_confirmation .h3{color:var(--cp-text-heading);font-weight:700;margin:0 0 8px}
.page-order-confirmation #content-hook_order_confirmation .material-icons, .page-order-confirmation #order-confirmation .material-icons{color:var(--cp-success-text)}
.page-order-confirmation #content-hook_payment_return dl, .page-order-confirmation #content-hook_payment_return .definition-list dl{display:grid;grid-template-columns:minmax(150px, 240px) 1fr;gap:0;margin:12px 0 16px;border:1px solid var(--cp-border);border-radius:var(--cp-r-input);overflow:hidden}
.page-order-confirmation #content-hook_payment_return dl dt, .page-order-confirmation #content-hook_payment_return dl dd{display:block;flex:none;margin:0;padding:11px 14px;border-bottom:1px solid var(--cp-border);border-radius:0;font-size:14px;line-height:1.5}
.page-order-confirmation #content-hook_payment_return dl dt{background-color:var(--cp-surface-sunken);color:var(--cp-text-heading);font-weight:600;border-right:1px solid var(--cp-border)}
.page-order-confirmation #content-hook_payment_return dl dd{background-color:var(--cp-surface);color:var(--cp-text-strong)}
.page-order-confirmation #content-hook_payment_return dl dt:nth-last-of-type(1), .page-order-confirmation #content-hook_payment_return dl dd:nth-last-of-type(1){border-bottom:none}
.page-order-confirmation #content-hook-order-confirmation-footer{background-color:transparent;border:none;border-radius:0;box-shadow:none;padding:0;margin:0}
.page-order-confirmation #content-hook-order-confirmation-footer:has(*){background-color:var(--cp-surface);border:1px solid var(--cp-border);border-radius:var(--cp-r-card);box-shadow:var(--cp-shadow-card);padding:20px;margin-bottom:16px}
/* v1.7.35 - RETIRADA, gemela de la del modal. Mismo defecto y en peor sitio: la confirmacion es donde el cliente copia los datos para transferir DESPUES de comprar. `:first-child` no cuenta los nodos de texto, asi que con el campo del BO ya limpio capturaba el salto entre RUT y BANCO en vez del inicial que ya no existe. */
@media (max-width: 767.98px){
.page-order-confirmation .h1.card-title, .page-order-confirmation .h3.card-title, .page-order-detail .h1.card-title, .page-order-detail .h3.card-title, .page-guest-tracking .h1.card-title, .page-guest-tracking .h3.card-title{font-size:15px;font-weight:700}
.page-order-confirmation #content, .page-order-confirmation #content.page-content, .page-order-confirmation #content-hook_order_confirmation, .page-order-confirmation #content-hook_payment_return{background-color:var(--cp-surface);border:1px solid var(--cp-border);border-radius:var(--cp-r-btn);box-shadow:var(--cp-shadow-card);padding:15px;margin-bottom:12px}
.page-order-confirmation #content-hook_payment_return dl{grid-template-columns:1fr}
.page-order-confirmation #content-hook_payment_return dl dt{border-right:none;border-bottom:none;padding-bottom:4px}
}
/* ===== CONFIRMACION - REDISENO DE LA TABLA Y LOS TOTALES ===== */
.page-order-confirmation #order-items .card-title, .page-order-confirmation #order-details .card-title{border-bottom:1px solid var(--cp-border);color:var(--cp-text);font-weight:700;font-size:12px;letter-spacing:.04em;text-transform:uppercase;padding-bottom:10px;margin:0 0 4px}
.page-order-confirmation .order-confirmation-table .order-line{display:flex;flex-wrap:wrap;align-items:center;margin:0;padding:14px 0;border-bottom:1px solid var(--cp-border)}
.page-order-confirmation .order-confirmation-table .order-line:last-child{border-bottom:0}
.page-order-confirmation #order-items .order-line .image img{display:block;width:120px;height:120px;max-width:100%;object-fit:contain;padding:4px;background-color:var(--cp-surface);border:1px solid var(--cp-border);border-radius:var(--cp-r-btn)}
.page-order-confirmation .order-confirmation-table .details{font-weight:600;color:var(--cp-text-strong);font-size:15px;line-height:1.35}
.page-order-confirmation .order-line .details .customizations a{display:inline-block;margin-top:6px;font-size:13px;font-weight:600;color:var(--cp-link)}
.page-order-confirmation .order-line .qty > .row{display:flex;align-items:center;margin:0}
.page-order-confirmation .order-line .qty > .row > *{flex:1 1 33.333%;text-align:center;font-variant-numeric:tabular-nums;color:var(--cp-text);font-size:14px}
.page-order-confirmation .order-line .qty > .row > .bold{color:var(--cp-text-strong);font-weight:700}
.page-order-confirmation #order-items hr{border-top-color:var(--cp-border);margin:4px 0 0}
.page-order-confirmation #order-items table{width:100%;margin:6px 0 0}
.page-order-confirmation #order-items table tr td{padding:9px 12px;border:0;font-size:14px;color:var(--cp-text);line-height:1.4}
.page-order-confirmation #order-items table tr td:last-child{text-align:right;font-variant-numeric:tabular-nums;color:var(--cp-text-heading);font-weight:600}
.page-order-confirmation #order-items table tr.total-value td{background-color:var(--cp-surface-sunken);padding-top:13px;padding-bottom:13px;color:var(--cp-text-heading);font-size:15px;font-weight:700}
.page-order-confirmation #order-items table tr.total-value td:first-child{border-radius:var(--cp-r-btn) 0 0 var(--cp-r-btn)}
.page-order-confirmation #order-items table tr.total-value td:last-child{border-radius:0 var(--cp-r-btn) var(--cp-r-btn) 0;color:var(--cp-primary);font-weight:700;font-size:21px;letter-spacing:-.3px}
.page-order-confirmation #order-items table tr.sub.taxes td{padding-top:7px;text-align:right;font-size:13px;color:var(--cp-text);font-weight:400}
.page-order-confirmation #order-details ul{list-style:none;margin:0;padding:0}
.page-order-confirmation #order-details ul li{padding:9px 0;border-bottom:1px solid var(--cp-border);font-size:14px;color:var(--cp-text);line-height:1.45}
.page-order-confirmation #order-details ul li:last-child{border-bottom:0}
@media (max-width: 1024.98px){
.page-order-confirmation #order-items .order-line .image img{width:96px;height:96px}
.page-order-confirmation .order-confirmation-table .order-line{padding:12px 0}
}
@media (max-width: 767.98px){
.page-order-confirmation .order-confirmation-table .order-line > div:first-child{flex:0 0 auto;width:auto;max-width:none;padding-right:12px}
.page-order-confirmation .order-confirmation-table .order-line > div:nth-child(2){flex:1 1 0;width:auto;min-width:0;padding-left:0}
.page-order-confirmation #order-items .order-line .image img{width:72px;height:72px;max-width:none}
.page-order-confirmation .order-confirmation-table .details{font-size:14px}
.page-order-confirmation .order-line .qty > .row{margin-top:10px;padding-top:10px;border-top:1px dashed var(--cp-border)}
.page-order-confirmation #order-items table tr td{padding-left:10px;padding-right:10px}
.page-order-confirmation #order-items table tr.total-value td:last-child{font-size:18px}
.page-order-confirmation #order-items .card-title, .page-order-confirmation #order-details .card-title{font-size:11px}
}
@media (max-width: 767.98px){
.page-order-confirmation #content-hook-order-confirmation-footer:has(*){border-radius:var(--cp-r-btn);padding:15px;margin-bottom:12px}
}
/* ===== MI CUENTA ===== */
.page-my-account #content{border:none;box-shadow:none;background-color:transparent}
.page-my-account .link-item:hover{border-color:var(--cp-primary)}
.page-my-account #content .links a:hover i{color:var(--cp-link-hover)}
.page-addresses #content{background-color:var(--cp-surface);padding:15px 0}
.page-addresses .address{background-color:var(--cp-surface-sunken);border:1px solid var(--cp-border);border-radius:var(--cp-r-card)}
.page-identity .psgdprinfo17, .page-identity .p-1.m-1{border-radius:var(--cp-r-card)}
/* ===== CARRITO - FICHA DE PRODUCTO ===== */
.page-cart .cart-item .product-line-grid-left{width:16%;max-width:16%}
.page-cart .cart-item .product-line-grid-body{width:52%;max-width:52%;min-width:0}
.page-cart .cart-item .product-line-grid-right{width:32%;max-width:32%;min-width:0}
.page-cart .cart-item .product-line-grid-body > br{display:none}
.page-cart .cart-item .product-line-info > a.label{font-size:15px;font-weight:700;line-height:1.3;text-transform:none;text-decoration:none;color:var(--cp-link)}
.page-cart .cart-item .product-line-info > a.label:hover{color:var(--cp-link-hover);text-decoration:underline}
.page-cart .cart-item .product-line-info > a.label::after{content:"";display:inline-block;width:.72em;height:.72em;margin-left:.35em;vertical-align:-1px;background-color:currentColor;opacity:.7;transition:opacity var(--cp-t-fast);-webkit-mask:url("data:image/svg+xml;utf8,") center/contain no-repeat;mask:url("data:image/svg+xml;utf8,") center/contain no-repeat}
.page-cart .cart-item .product-line-info > a.label:hover::after{opacity:1}
.page-cart .cart-item .product-line-info.product-price{display:flex;flex-wrap:wrap;align-items:center;gap:5px 10px;margin:0 0 6px}
.page-cart .cart-item .product-discount{display:inline-flex;align-items:center;gap:8px;margin:0}
.page-cart .cart-item .current-price{display:inline-flex;align-items:center;margin:0}
.page-cart .cart-item .regular-price{font-size:14px;font-weight:500;color:var(--cp-text);text-decoration:line-through}
.page-cart .cart-item .current-price .price{font-size:17px;font-weight:800;color:var(--cp-success-on-bg)}
.page-cart .cart-item .current-price .price::before{content:"";display:inline-block;width:1em;height:1em;margin-right:.35em;vertical-align:-.15em;background:url("data:image/svg+xml;utf8,") center/contain no-repeat}
.page-cart .cart-item .product-line-info.color{font-size:13px}
.page-cart .cart-item .product-line-info.color .value{color:var(--cp-text-strong);font-weight:700}
.page-cart .cart-item .dp_cart{margin-top:8px;padding:9px 12px 9px 13px;background-color:var(--cp-surface-sunken);border:1px solid var(--cp-border);border-left:3px solid var(--cp-primary);border-radius:var(--cp-r-card);width:-moz-fit-content;width:fit-content;max-width:100%;overflow-x:auto}
.page-cart .cart-item .dp_cart::before{content:"Personalizaci\0000F3n";display:block;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--cp-text);margin-bottom:5px}
.page-cart .cart-item .dp_cart br{display:none}
.page-cart .cart-item .dp_cart .dp_input_div{display:flex;flex-wrap:wrap;gap:0 14px;font-size:13px}
.page-cart .cart-item .dp_cart span[class*="dp-input-field-"]{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;max-width:100%;padding:1px 0;line-height:1.3;white-space:normal;overflow-wrap:break-word;overflow-wrap:anywhere;color:var(--cp-text)}
.page-cart .cart-item .dp_cart span[class*="dp-input-field-"] strong{color:var(--cp-text-strong);font-weight:700;white-space:nowrap;margin-right:6px}
/* v1.7.6 - K1: el enlace de edicion de DynamicProduct, en fila propia. Ver seccion 22. */
.page-cart .cart-item .dp_cart .dp_input_div > div{display:block;flex:1 1 100%;margin-top:7px;padding-top:7px;border-top:1px solid var(--cp-border)}
.page-cart .cart-item .dp_cart a.dp_url{display:inline-flex;align-items:center;gap:6px;text-decoration:none;font-size:11px;font-weight:600;color:var(--cp-link-hover);transition:color var(--cp-t-fast)}
.page-cart .cart-item .dp_cart a.dp_url::before{content:"";display:block;width:1em;height:1em;flex:0 0 auto;background-color:currentColor;-webkit-mask:url("data:image/svg+xml;utf8,") center/contain no-repeat;mask:url("data:image/svg+xml;utf8,") center/contain no-repeat}
.page-cart .cart-item .dp_cart a.dp_url:hover{text-decoration:underline}
.page-cart .cart-item .dp_cart a.dp_url:focus-visible{outline:0;box-shadow:var(--cp-focus-ring);border-radius:4px}
/* v1.7.6 - el enlace del modal del CORE no destella al cargar; si el JS de DynamicProduct no corriera, reaparece a los 2s como respaldo. */
.page-cart .cart-item .product-line-grid-body > a[data-toggle="modal"]{visibility:hidden;animation:cpVerEnlaceModal 0s linear 2s forwards}
@keyframes cpVerEnlaceModal{to{visibility:visible}}
.page-cart .cart-item .dp_cart span.dp-input-field-preview{display:none}
.page-cart input.js-cart-line-product-quantity{width:108px;height:40px;padding:0 8px;text-align:center;font-size:16px;font-weight:700;color:var(--cp-text-strong);border:1px solid var(--cp-border);border-radius:var(--cp-r-btn);background-color:var(--cp-surface);-moz-appearance:textfield;appearance:textfield}
.page-cart input.js-cart-line-product-quantity::-webkit-outer-spin-button,.page-cart input.js-cart-line-product-quantity::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.page-cart .bootstrap-touchspin input.js-cart-line-product-quantity{flex:0 0 78px;width:78px;height:auto;border:0;border-radius:0;outline:0;background-color:transparent}
/* --- lista hundida, tarjeta por producto y 16px de aire --- */
.page-cart .cart-overview{background-color:var(--cp-surface-sunken);border-top:1px solid var(--cp-border);border-radius:0 0 11px 11px}
.page-cart .cart-items{display:flex;flex-direction:column;gap:16px;margin:0;padding:0}
.page-cart .cart-items > .cart-item{padding:16px;background-color:var(--cp-surface);border:1px solid var(--cp-border);border-radius:var(--cp-r-card);box-shadow:var(--cp-shadow-card);transition:border-color var(--cp-t-fast), box-shadow var(--cp-t-fast)}
.page-cart .cart-items > .cart-item:hover{border-color:var(--cp-border-strong);box-shadow:0 4px 14px rgba(0,0,0,.07)}
/* --- archivo adjunto: fila propia y tope de 2 lineas --- */
.page-cart .cart-item .dp_cart span[class*="dp-input-field-"]{flex:0 1 auto;min-width:0}
/* v1.7.14 - UNICO !important del archivo, y es una excepcion documentada: Creative Elements declara .dp-files{margin-bottom:-30px !important}, un margen negativo que cancela la altura de la lista de archivos. El campo colapsa y la lista se desborda sobre el enlace de edicion. !important solo se gana con !important. Lo limpio es retirarlo del editor de CE. Ver seccion 30. */
/* v1.7.22 - SIN !important desde que el director retiro del editor de CE el bloque que declaraba margin-bottom:-30px !important (verificado en el bundle vivo: cero rastros). La regla se conserva en llano como red: si aquel bloque reapareciera, el defecto se veria y se re-escalaria. */
.page-cart .cart-item .dp_cart .dp-files{margin-bottom:0}
.page-cart .cart-item .dp_cart span[class*="dp-input-field-importar_logo"]{display:flex;flex-wrap:wrap;-webkit-line-clamp:none;overflow:visible;flex:1 1 100%;align-items:flex-start;white-space:normal}
/* v1.7.14 - en el BO hay DOS maestros de personalizacion y no nombran igual sus campos: uno usa importar_logo y el otro adjuntar_logo. La regla de arriba, atada al nombre, nunca alcanzaba al segundo, que se quedaba con el recorte a 2 lineas y overflow:hidden del bloque generico. Se generaliza por CONTENIDO -el campo que lleva la lista de archivos- en una regla APARTE: si :has() no estuviera soportado, se descarta solo esta y el primer maestro sigue igual. */
.page-cart .cart-item .dp_cart span[class*="dp-input-field-"]:has(.dp-files){display:flex;flex-wrap:wrap;-webkit-line-clamp:none;overflow:visible;flex:1 1 100%;align-items:flex-start;white-space:normal}
.page-cart .cart-item .dp_cart .dp-files{margin:0;padding:0;list-style:none;min-width:0;max-width:100%}
.page-cart .cart-item .dp_cart .dp-files li{min-width:0;max-width:100%}
.page-cart .cart-item .dp_cart .dp-files a{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:100%;color:var(--cp-link-hover);text-decoration:none;line-height:1.35;white-space:normal;overflow-wrap:break-word;overflow-wrap:anywhere}
.page-cart .cart-item .dp_cart .dp-files a:hover{text-decoration:underline}
/* --- icono de eliminar: trazo sobre la ligadura, area de 40x40 --- */
.page-cart .cart-item .remove-from-cart{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;text-decoration:none;transition:background-color var(--cp-t-fast), color var(--cp-t-fast)}
.page-cart .cart-item .remove-from-cart:hover{background-color:var(--cp-danger-bg)}
.page-cart .cart-item .remove-from-cart:focus-visible{outline:0;box-shadow:var(--cp-focus-ring)}
.page-cart .cart-item .remove-from-cart i.material-icons{float:none;font-size:0;line-height:0;width:18px;height:18px;background-color:currentColor;-webkit-mask:url("data:image/svg+xml;utf8,") center/contain no-repeat;mask:url("data:image/svg+xml;utf8,") center/contain no-repeat}
/* --- v1.7.2 - el icono de eliminar ancla en la esquina inferior derecha --- */
.page-cart .cart-item .product-line-grid-right, .page-cart .cart-item .product-line-grid-right > .row > .text-xs-right{position:static}
.page-cart .cart-items > .cart-item{position:relative}
.page-cart .cart-item .cart-line-product-actions{position:absolute;right:16px;bottom:16px;display:flex;align-items:center;justify-content:flex-end;line-height:0;margin:0;padding:0}
.page-cart .cart-item .cart-line-product-actions .remove-from-cart{margin:0}
.page-cart .cart-item .product-line-grid-right > .row > .text-xs-right{flex:0 0 40px;width:40px;max-width:40px;margin:0 0 0 auto}
/* --- v1.7.5 - la fila de cantidad y total nunca se solapa ni se come los clics --- */
.page-cart .cart-item .product-line-grid-right > .row > .col-xs-6{padding:0;min-width:0}
.page-cart .cart-item .product-line-grid-right > .row > .col-xs-6 > .row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px 12px;width:100%;margin:0}
.page-cart .cart-item .product-line-grid-right .qty{flex:0 0 auto;width:auto;max-width:none;min-width:108px;padding:0;margin:0}
.page-cart .cart-item .product-line-grid-right .price{flex:0 0 auto;width:auto;max-width:none;padding:0;margin:0}
.page-cart .cart-item .product-line-grid-right .product-price{margin-left:0}
/* --- v1.7.5 - `comentarios` no se recorta: se limita por caracteres desde DynamicProduct --- */
.page-cart .cart-item .dp_cart span[class*="dp-input-field-comentarios"]{display:block;-webkit-line-clamp:none;overflow:visible;flex:1 1 100%;white-space:normal;overflow-wrap:break-word;overflow-wrap:anywhere}
/* --- v1.7.7 - cantidad y total: apilados con el TOTAL ARRIBA hasta 1332px --- */
@media (min-width: 1025px) and (max-width: 1332px){
.page-cart .cart-item .product-line-grid-right .price{order:1}
.page-cart .cart-item .product-line-grid-right .qty{order:2}
}
/* --- v1.7.7 - y en linea desde 1333px: hay que liberar 17px para que quepa --- */
@media (min-width: 1332.02px){
.page-cart .cart-item .product-line-grid-right{width:34%;max-width:34%}
.page-cart .cart-item .product-line-grid-body{width:50%;max-width:50%}
.page-cart .cart-item .product-line-grid-right > .row > .col-xs-6 > .row{column-gap:8px}
.page-cart .cart-item .product-line-grid-right .product-price{padding:8px 12px}
}
@media (max-width: 1024.98px){
.page-cart .cart-item .product-line-grid-left{width:20%;max-width:20%}
.page-cart .cart-item .product-line-grid-body{width:80%;max-width:80%}
.page-cart .cart-item .product-line-grid-right{width:100%;max-width:100%;margin-top:10px}
}
@media (max-width: 767.98px){
.page-cart .cart-item .product-line-grid-left{width:26%;max-width:26%;margin-right:15px}
.page-cart .cart-item .product-line-grid-body{width:auto;max-width:none;float:none}
.page-cart .cart-item .product-line-grid-right{width:100%;max-width:100%}
.page-cart .cart-item .product-line-info > a.label{font-size:14px}
.page-cart .cart-item .dp_cart{padding:8px 10px 8px 11px;clear:left;margin:8px -15px 0 0;width:auto;max-width:none}
.page-cart .cart-item .dp_cart .dp_input_div{gap:0 12px}
.page-cart .cart-item .dp_cart span[class*="dp-input-field-"]{font-size:11px;padding:0;line-height:1.3;white-space:normal;overflow-wrap:break-word;overflow-wrap:anywhere}
.page-cart .cart-item .dp_cart span[class*="dp-input-field-"] strong{white-space:nowrap;overflow-wrap:normal}
.page-cart .cart-item .cart-line-product-actions{position:static;margin:0 0 0 auto}
.page-cart .cart-overview{padding:12px}
.page-cart .cart-items > .cart-item{padding:13px}
/* --- v1.7.8 - movil: aire bajo la imagen --- */
/* v1.7.9 - los precios y el atributo vuelven justo debajo del NOMBRE: se retira el clear de la v1.7.8 y se recupera el hueco de 28px entre el tachado y la pildora. Ver seccion 25. */
/* v1.7.10 - el cuerpo arrastraba el padding-right:15px de .col-xs-8 y nadie lo reseteaba: caia sobre el borde derecho de la fila de precios. Recuperarlo devuelve 15px medidos. */
/* v1.7.35 - dos de las tres columnas del producto conservaban el padding-left:15px de Bootstrap mientras la tercera ya estaba a 0: incongruencia entre hermanas y sangria pura, porque .product-line-grid no es un .row y nadie devuelve ese relleno. Solo padding-left, y solo aqui: de 576 a 767.98px el padding-right es el unico canalon imagen/texto. */
.page-cart .cart-item .product-line-grid-left, .page-cart .cart-item .product-line-grid-body{padding-left:0}
.page-cart .cart-item .product-line-grid-body{padding-right:0}
.page-cart .cart-item .dp_cart{margin-right:0}
.page-cart .cart-item .product-line-grid-body .product-line-info.product-price{column-gap:4px;font-size:13px}
.page-cart .cart-item .product-line-grid-body .product-discount{gap:4px}
.page-cart .cart-item .product-line-grid-body .regular-price{margin-right:0}
.page-cart .cart-item .product-line-grid-body .discount.discount-percentage{margin-left:0;padding:3px 8px;font-size:10px}
.page-cart .cart-item .product-line-grid-left{margin-bottom:12px}
.page-cart .cart-item .dp_cart span[class*="dp-input-field-importar_logo"]{white-space:normal;align-items:flex-start}
.page-cart .cart-item .dp_cart span[class*="dp-input-field-"]:has(.dp-files){white-space:normal;align-items:flex-start}
.page-cart .cart-item .dp_cart .dp-files a{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:normal;overflow:hidden;text-overflow:clip}
.page-cart .cart-item .product-line-grid-right > .row{padding:0;gap:8px;flex-wrap:nowrap}
.page-cart .cart-item .product-line-grid-right > .row > .col-xs-6{min-width:0}
.page-cart .cart-item .product-line-grid-right .product-price{padding:7px 10px;margin-left:0}
.page-cart input.js-cart-line-product-quantity{width:96px}
.page-cart .cart-item .bootstrap-touchspin{width:96px;max-width:96px}
.page-cart .cart-item .product-line-grid-right .qty{min-width:96px}
.page-cart .cart-item .dp_cart a.dp_url{min-height:40px}
.page-cart .cart-item .product-line-grid-right > .row > .col-xs-6 > .row{gap:8px}
}
@media (max-width: 387.98px){
.page-cart .cart-item .product-line-grid-body .discount-percentage::after{content:""}
.page-cart .cart-item .product-line-grid-body .product-line-info.product-price{column-gap:2px}
.page-cart .cart-item .product-line-grid-body .discount.discount-percentage{padding:3px 6px}
}
@media (max-width: 353.98px){
.page-cart .cart-item .product-line-grid-body .current-price .price::before{display:none}
}
/* v1.7.13 - congruencia: "Total N unidades" es rotulo de linea en el carrito (16px/400 #666) y un
suelto en el checkout (15px/400 #7A7A7A). Se iguala al del carrito. */
/* v1.7.35 - el desplegable duplicaba el relleno: .cart-summary-products anadia 16px sobre los 16 del .card-block y las tarjetas quedaban en x=43 frente a los x=27 de las lineas de totales, que son sus vecinas. Alineado. */
@media (max-width:767.98px){body#checkout #js-checkout-summary .cart-summary-products{padding-left:0;padding-right:0}}
body#checkout #js-checkout-summary .cart-summary-products > p{font-size:1rem;font-weight:400;color:var(--cp-text);margin-bottom:10px}
/* --- v1.7.13 - punto 5: el desplegable del resumen deja de ser un enlace suelto de 183x21px y pasa a boton. El texto va en --cp-link-hover, no en --cp-link: sobre el fondo hundido #F8F9FA el azul 007ACC da 4,28 y no cumple AA a 14px (la misma trampa de la v1.7.4). El anillo negro de moviles lo pinta a:focus{outline:-webkit-focus-ring-color auto 5px} del tema: se apaga en :focus y se devuelve en :focus-visible, que en tactil no casa. --- */
body#checkout #js-checkout-summary a.js-show-details{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:8px 14px;border:1px solid var(--cp-border-strong);border-radius:var(--cp-r-btn);background-color:var(--cp-surface-sunken);color:var(--cp-link-hover);font-size:14px;font-weight:600;line-height:1.2;text-decoration:none;transition:background-color var(--cp-t-fast),border-color var(--cp-t-fast),color var(--cp-t-fast)}
body#checkout #js-checkout-summary a.js-show-details:hover{background-color:var(--cp-surface-hover);border-color:var(--cp-text-muted);text-decoration:none}
@supports selector(:focus-visible){
body#checkout #js-checkout-summary a.js-show-details:focus{outline:none}
body#checkout #js-checkout-summary a.js-show-details:focus-visible{outline:none;box-shadow:var(--cp-focus-ring);border-color:var(--cp-secondary)}
}
body#checkout #js-checkout-summary a.js-show-details .material-icons{font-size:18px;line-height:1;transition:transform var(--cp-t-fast)}
/* Estados del numero: hoy los cuatro son verdes, tambien los que no se pueden abrir. */
body#checkout section.checkout-step .step-number{transition:background-color 200ms ease,color 200ms ease,box-shadow 200ms ease,border-color 200ms ease}
/* El .step-edit del core va en #7a7a7a, que el DS prohibe como color de texto (4,29:1). SEGUNDO !important del archivo, y otra excepcion documentada: el elemento lleva ademas la clase .text-muted de Bootstrap, que declara color:#7a7a7a !important. Solo se gana con !important. */
/* v1.7.27 - P7: solo la PRIMERA letra en mayuscula, venga como venga de Traducciones. El tema ya declara text-transform:lowercase sobre .step-edit, asi que basta ::first-letter. Pero ese pseudo-elemento exige contenedor de BLOQUE -de ahi inline-block y no inline-flex- y, sobre todo, apuntaria a la "m" de la ligadura "mode_edit" del icono del core, que va ANTES del texto: al ponerla en mayuscula la ligadura se rompe y el icono sale escrito. Por eso el icono material se oculta y el lapiz pasa a ser imagen de fondo del propio enlace, con lo que el texto queda como unico contenido. */
body#checkout section.checkout-step.-reachable.-complete h1 .step-edit{color:var(--cp-link-hover) !important;font-size:14px;font-weight:600;display:inline-block;min-height:40px;line-height:40px;margin-left:auto;padding-left:22px;text-transform:lowercase;background-image:url("data:image/svg+xml;utf8,");background-position:left center;background-size:15px 15px;background-repeat:no-repeat}
body#checkout section.checkout-step.-reachable.-complete h1 .step-edit::first-letter{text-transform:uppercase}
body#checkout section.checkout-step.-reachable.-complete h1 .step-edit .edit{display:none}
body#checkout section.checkout-step.-reachable.-complete h1 .step-edit:hover{text-decoration:underline}
@media (prefers-reduced-motion: reduce){
body#checkout .cart-grid-body::before{animation:none;transition:none}
body#checkout section.checkout-step .step-number{transition:none}
}
/* ============ v1.7.16 - MODAL DE DATOS BANCARIOS (variante M2) ============ */
/* Defectos medidos en el modal de hoy: radio 4,8px y sin sombra, titulo en #666666, parrafo en #7A7A7A (4,29:1, no cumple AA), rotulo y valor con el MISMO peso, boton de cerrar de 13x24px con opacidad 0,2 -muy por debajo del minimo tactil de 40x40- y 5 muertos al final del cuerpo. */
/* v1.7.31 - EL MODAL CABE SIEMPRE. Reproducido a 390x700: el contenido media 824px, quedaba desplazado a y=-196 y el boton de cerrar caia FUERA de la pantalla, con solo el backdrop visible y sin forma de cerrar salvo recargar. El dialogo se limita al alto de la ventana, la cabecera queda fija y el cuerpo hace scroll por dentro. */
/* v1.7.33 - EL BACKDROP NO PUEDE ENCERRAR A NADIE. En el Bootstrap 4 alpha.5 que sirve PS 8.2.7 el clic fuera cierra el modal porque cae sobre .modal -el handler esta ahi, no en el backdrop-, asi que si el backdrop se pinta por encima los toques mueren y no queda forma de cerrar salvo recargar. El backdrop es decorativo: sin eventos de puntero, cualquier toque llega siempre al modal o a su fondo, y el cierre por clic fuera funciona. */
body#checkout .modal-backdrop{pointer-events:none}
/* v1.7.33 - mientras hay un modal abierto la barra deja de flotar: con .modal-open el body no scrollea, el sticky no aporta nada y es un candidato a pintarse sobre el dialogo. Ataca el punto 6: la cabecera del modal escondida tras la barra. */
body#checkout.modal-open .cart-grid-body::before{position:static;box-shadow:none}
/* v1.7.33 - el modal declara su capa por encima del backdrop de forma explicita */
body#checkout #bankwire-modal{z-index:1060}
/* v1.7.34 - EL DIALOGO RECUPERA MARGEN EN LOS CUATRO LADOS. Bootstrap da margin:10px a los cuatro lados por debajo de 576px -ahi no hay max-width- y la v1.7.32 lo cambio por `margin:10px auto`, que en un bloque de ancho automatico deja el margen lateral en CERO. El modal quedaba a sangre y ocupando el 96% del alto: solo dos franjas de 14 y 21px cerraban al tocar, el 3% de la pantalla, inacertable con el dedo. Eso es lo que el cliente vive como pantalla bloqueada. Medido en emulacion movil real. */
body#checkout #bankwire-modal .modal-dialog{display:flex;align-items:flex-start;max-height:calc(100vh - 132px);max-height:calc(100dvh - 132px);margin:16px}
/* v1.7.35 - la base de .modal-content sube DELANTE del @media de abajo. Estaba detras con la misma especificidad, asi que su max-height de movil (100dvh - 132px) le ganaba por orden al de escritorio (100dvh - 64px) y el modal quedaba 68px mas bajo de lo disenado en pantallas grandes. */
body#checkout #bankwire-modal .modal-content{display:flex;flex-direction:column;width:100%;max-height:calc(100vh - 132px);max-height:calc(100dvh - 132px);padding:0;overflow:hidden;background-color:var(--cp-surface);border:1px solid var(--cp-border);border-radius:var(--cp-r-card);box-shadow:0 8px 28px rgba(0,0,0,.12)}
/* v1.7.34 - de 576px en adelante Bootstrap si acota el ancho del dialogo, asi que el modal ya se comporta como un modal: ahi no hace falta recortar tanto la altura, y el margen lateral vuelve a `auto` para que quede centrado. Va DESPUES de las reglas base a proposito: una media query no aporta especificidad y a igualdad gana el orden. */
@media (min-width:576px){body#checkout #bankwire-modal .modal-dialog{max-height:calc(100vh - 64px);max-height:calc(100dvh - 64px);margin:32px auto}
body#checkout #bankwire-modal .modal-content{max-height:calc(100vh - 64px);max-height:calc(100dvh - 64px)}}
body#checkout #bankwire-modal .modal-header{flex:0 0 auto}
body#checkout #bankwire-modal .modal-body{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain}
body#checkout #bankwire-modal .modal-header{padding:16px 20px;border-bottom:1px solid var(--cp-border)}
body#checkout #bankwire-modal .modal-header h2{margin:0;font-size:18px;font-weight:700;color:var(--cp-text-heading)}
/* el cerrar pasa de 13x24 a 40x40, el minimo tactil del DS */
body#checkout #bankwire-modal .modal-header .close{display:flex;align-items:center;justify-content:center;width:40px;height:40px;margin:-8px -8px 0 0;border-radius:8px;opacity:1;color:var(--cp-text);font-size:26px;font-weight:400;text-shadow:none;transition:background-color var(--cp-t-fast), color var(--cp-t-fast)}
body#checkout #bankwire-modal .modal-header .close:hover{background-color:var(--cp-surface-hover);color:var(--cp-text-heading)}
@supports selector(:focus-visible){
body#checkout #bankwire-modal .modal-header .close:focus{outline:none}
body#checkout #bankwire-modal .modal-header .close:focus-visible{outline:none;box-shadow:var(--cp-focus-ring)}
}
/* v1.7.17 - la nota del modulo es un NODO DE TEXTO suelto: no se puede envolver ni pintar aparte, pero si HEREDA de .modal-body. Ahi se le da tratamiento de nota al pie. El
y el
se protegen con su propio tamano. */
/* v1.7.33 - la nota final son NODOS DE TEXTO sueltos entre : no hay elemento que envolver y solo se puede tratar por herencia desde aqui (patron de la v1.7.17). Sube de 13 a 14px, el minimo de cuerpo en movil que fija el DS, y gana interlineado. El
y el
declaran su propio tamano, asi que quedan protegidos. */
body#checkout #bankwire-modal .modal-body{padding:18px 20px 22px;font-size:14px;line-height:1.75;color:var(--cp-text)}
body#checkout #bankwire-modal .modal-body > p{margin:0 0 18px;font-size:15px;line-height:1.55;color:var(--cp-text-heading)}
/* v1.7.34 - los HIJOS DIRECTOS del cuerpo separan los parrafos sueltos. Es el unico gancho que existe: los textos no tienen elemento propio. No se tocan los del
, que son los de la tabla de datos bancarios. */
body#checkout #bankwire-modal .modal-body > br{display:block;height:9px;content:""}
/* v1.7.34 - el titulo del modal, con la tipografia de titular del DS */
body#checkout #bankwire-modal .modal-header h2, body#checkout #bankwire-modal .modal-title{margin:0;font-size:18px;font-weight:700;line-height:1.3;color:var(--cp-text-heading);letter-spacing:-.01em}
/* los 5 sueltos del final del cuerpo */
/* v1.7.17 - REGRESION DE LA v1.7.16, corregida. Estos NO eran basura: entre ellos hay nodos de TEXTO SUELTOS -la "Informacion al cliente" del modulo- y los son sus saltos de linea. Apagarlos convirtio esa nota en un muro de texto. Verificado en vivo: 16 lineas con ellos apagados contra 19 al restaurarlos. */
/* v1.7.35 - RETIRADA. Iba DESPUES de la regla de la v1.7.34 con la MISMA especificidad, asi que ganaba por orden y dejaba el en su display:inline por defecto: por eso el aire entre los parrafos sueltos nunca llego a verse. Nacio como reversion de una regresion de la v1.7.16 -que los habia apagado con display:none- y hoy solo estorba: el valor que restauraba es el del navegador. */
/* los datos, en rejilla: el rotulo es microcopy en mayusculas y el valor manda. Mismo patron que este archivo ya usa en la confirmacion de pedido. */
body#checkout #bankwire-modal .modal-body dl{display:grid;grid-template-columns:minmax(130px, 190px) 1fr;gap:1px;margin:0 0 20px;font-size:15px;background-color:var(--cp-border);border:1px solid var(--cp-border);border-radius:8px;overflow:hidden}
body#checkout #bankwire-modal .modal-body dl dt{margin:0;padding:11px 14px;background-color:var(--cp-surface);font-size:12px;font-weight:700;line-height:1.4;letter-spacing:.04em;text-transform:uppercase;color:var(--cp-text)}
body#checkout #bankwire-modal .modal-body dl dd{margin:0;padding:11px 14px;background-color:var(--cp-surface);font-size:15px;font-weight:600;line-height:1.55;color:var(--cp-text-strong)}
/* v1.7.29 - punto 5: la base del modal. La nota final son doce NODOS DE TEXTO sueltos separados por , todos despues del
-comprobado nodo a nodo en el DOM vivo-, asi que no hay nada que envolver. Se invierte la figura: el cuerpo pasa a fondo hundido y el
a tarjeta blanca, con lo que la nota queda sobre el hundido y se lee como nota al pie, y los datos que el cliente copia destacan. La cabecera pasa a blanca para no fundirse con el cuerpo. */
body#checkout #bankwire-modal .modal-header{background-color:var(--cp-surface)}
body#checkout #bankwire-modal .modal-body{background-color:var(--cp-surface-sunken)}
body#checkout #bankwire-modal .modal-body > dl{border-radius:var(--cp-r-btn);overflow:hidden;box-shadow:var(--cp-shadow-card)}
@media (min-width:768px){body#checkout #bankwire-modal .modal-body dl dt{font-size:13px}}
/* el TOTAL es la cifra que hay que transferir: equivocarla es el error mas caro de esta pantalla, asi que sube de jerarquia */
body#checkout #bankwire-modal .modal-body dl dt:first-of-type{background-color:var(--cp-success-bg);color:var(--cp-success-on-bg)}
body#checkout #bankwire-modal .modal-body dl dt:first-of-type + dd{background-color:var(--cp-success-bg);color:var(--cp-success-on-bg);font-size:21px;font-weight:700;letter-spacing:-.3px}
/* v1.7.16 - se oculta la fila de direccion de la sucursal bancaria (decision del director). OJO: va por posicion. Si algun dia se vacia ese campo en la configuracion de ps_wirepayment, este par deja de existir y ESTA REGLA HAY QUE RETIRARLA o escondera el dato equivocado. Lo limpio es vaciar el campo en el modulo y borrar estas dos lineas. */
body#checkout #bankwire-modal .modal-body dl dt:nth-of-type(4){display:none}
body#checkout #bankwire-modal .modal-body dl dd:nth-of-type(4){display:none}
@media (max-width: 767.98px){
body#checkout #bankwire-modal .modal-body dl{grid-template-columns:1fr}
body#checkout #bankwire-modal .modal-body dl dt{padding-bottom:2px}
body#checkout #bankwire-modal .modal-body dl dd{padding-top:4px}
}
/* ============ v1.7.18 - EL HOOK displayAfterCarrier SUBE A SU SITIO ============ */
/* El contenedor #hook-display-after-carrier es hermano del FORMULARIO del paso, asi que el core lo pinta DESPUES del boton Continuar. Medido: transportistas y505, comentario y585, boton y674, hook y736. El director lo quiere entre los transportistas y el comentario. */
/* No se puede mover un nodo con CSS, pero si APLANAR los contenedores con display:contents: la lista, el formulario y .form-fields dejan de generar caja y sus hijos pasan a ser items directos de .content, que se vuelve flex. Entonces `order` ya puede colocarlos. Verificado: el formulario conserva sus 3 campos, el boton sigue asociado a el y el radio del transportista tambien; y el