/* ===================================================================== ePrilux · Panel de opciones para productos variables en las rejillas 1 oct 2026. Va con 2026-10-01_panel-opciones.js. AMBITO: toda la tienda desde el 2 oct 2026 (tarjetas .e-loop-item.product). ===================================================================== */ /* --- La tarjeta del producto variable: «Elegir opciones», sin cantidad --- */ .e-loop-item.product.product-type-variable .pc-qty{display:none!important} .e-loop-item.product.product-type-variable .pc-add{flex:1 1 100%;width:100%} .e-loop-item.product.product-type-variable .pc-add>span:first-child{visibility:hidden;position:relative;display:inline-block} .e-loop-item.product.product-type-variable .pc-add>span:first-child::after{content:"Elegir opciones";visibility:visible;position:absolute;left:50%;top:0;transform:translateX(-50%);white-space:nowrap} .e-loop-item.product.product-type-variable .pc-add .pc-icon{display:none!important} /* hasta que carga el codigo, el boton no añade la variacion por defecto */ html:not(.epx-vp-listo) .e-loop-item.product.product-type-variable .pc-add{pointer-events:none} /* --- El panel --- */ html.epx-vp-abierto{overflow:hidden} html.epx-vp-abierto #ea11y-root,html.epx-vp-abierto .joinchat{display:none!important} .epx-vp{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;font-family:'Montserrat',sans-serif;font-size:14px;line-height:1.6;color:#06163d} .epx-vp[hidden]{display:none} .epx-vp *{box-sizing:border-box} .epx-vp__velo{position:absolute;inset:0;background:rgba(6,22,61,.55)} .epx-vp__panel{position:relative;display:flex;flex-direction:column;width:min(880px,calc(100vw - 48px));max-height:min(720px,calc(100vh - 48px));background:#fff;border:1px solid #e4e6e9;border-radius:2px;outline:0;box-shadow:0 24px 60px rgba(6,22,61,.28)} .epx-vp__cab{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:22px 28px 14px} .epx-vp__titulo{margin:0;font-family:inherit;font-size:20px;line-height:1.3;font-weight:400;color:#06163d} .epx-vp__cerrar{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:36px;height:36px;margin:-6px -8px 0 0;padding:0;background:none;border:1px solid transparent;border-radius:2px;color:#06163d;cursor:pointer} .epx-vp__cerrar:hover,.epx-vp__cerrar:focus-visible{border-color:#06163d;background:none;color:#06163d} .epx-vp__cuerpo{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:32px;padding:6px 28px 24px;overflow-y:auto;overscroll-behavior:contain} .epx-vp__carga{grid-column:1/-1;margin:28px 0;color:#5b6270} .epx-vp__foto{background:#fff;border:1px solid #e4e6e9;border-radius:2px;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden} .epx-vp__foto img{display:block;width:100%;height:100%;object-fit:contain} .epx-vp__precio{margin-top:16px} .epx-vp__precio p{margin:0} .epx-vp__antes{font-size:13px;color:#5b6270} .epx-vp__dto{display:inline-block;margin-left:6px;padding:1px 7px;background:#1f7a4d;color:#fff;font-size:12px;font-weight:700;border-radius:2px} .epx-vp__ahora{font-size:30px;line-height:1.2;font-weight:700;color:#06163d} .epx-vp__ahora small{font-size:12px;font-weight:400;color:#5b6270} .epx-vp__stock{margin-top:6px!important;font-size:13px;color:#5b6270} .epx-vp__stock--si{color:#1f7a4d;font-weight:600} .epx-vp__stock--no{color:#b3261e;font-weight:600} .epx-vp__detalles{display:inline-block;margin-top:14px;font-size:13px;font-weight:600;color:#06163d;text-decoration:underline;text-underline-offset:3px} .epx-vp__detalles:hover{color:#23a7d6} .epx-vp__grupo{margin:0 0 20px;padding:0;border:0;min-width:0} .epx-vp__grupo:last-child{margin-bottom:0} .epx-vp__grupo legend{padding:0;margin:0 0 10px;font-size:14px;color:#06163d} .epx-vp__grupo legend b{font-weight:700} .epx-vp__grupo legend span{margin-left:6px;color:#5b6270} .epx-vp__botones{display:flex;flex-wrap:wrap;gap:8px} .epx-vp__boton{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;background:#fff;border:1px solid #e4e6e9;border-radius:2px;font:inherit;font-size:14px;color:#06163d;cursor:pointer;text-transform:none;letter-spacing:0} .epx-vp__boton:hover,.epx-vp__boton:focus-visible{background:#fff;color:#06163d;border-color:#06163d} .epx-vp__boton.es-activo{background:#06163d;border-color:#06163d;color:#fff;font-weight:600} .epx-vp__boton.es-agotado,.epx-vp__fila.es-agotado{color:#8a909e;border-style:dashed;cursor:not-allowed} .epx-vp__boton.es-otra{color:#8a909e;border-style:dashed;text-decoration:line-through} .epx-vp__boton.es-otra .epx-vp__punto{opacity:.45} .epx-vp__cambio{margin:0 0 16px;padding:10px 14px;background:#fff8e6;border:1px solid #FDCF63;border-left:3px solid #06163d;border-radius:2px;font-size:13px;line-height:1.5;color:#06163d} .epx-vp__nota{margin:14px 0 0;font-size:12px;line-height:1.5;color:#5b6270} .epx-vp__punto{flex:0 0 auto;display:inline-block;width:14px;height:14px;border:1px solid #c9cdd3;border-radius:2px} .epx-vp__filas{display:flex;flex-direction:column;gap:8px} .epx-vp__fila{display:flex;align-items:center;gap:14px;width:100%;min-height:60px;padding:10px 16px;background:#fff;border:1px solid #e4e6e9;border-radius:2px;font:inherit;font-size:14px;color:#06163d;text-align:left;cursor:pointer;text-transform:none;letter-spacing:0} .epx-vp__fila:hover,.epx-vp__fila:focus-visible{background:#fff;color:#06163d;border-color:#06163d} .epx-vp__fila.es-activo{border-color:#06163d;box-shadow:inset 0 0 0 1px #06163d} .epx-vp__marca{flex:0 0 auto;width:18px;height:18px;border:1px solid #8a909e;border-radius:2px;background:#fff} .epx-vp__fila.es-activo .epx-vp__marca{border-color:#06163d;background:#06163d;box-shadow:inset 0 0 0 3px #fff} .epx-vp__fila-txt{flex:1 1 auto;display:flex;flex-direction:column;min-width:0} .epx-vp__fila-nom{display:flex;align-items:center;gap:8px;font-weight:600} .epx-vp__fila-st{font-size:12px;color:#1f7a4d} .epx-vp__fila.es-agotado .epx-vp__fila-st{color:#8a909e} .epx-vp__fila-pr{flex:0 0 auto;font-weight:700;white-space:nowrap} .epx-vp__pie{display:flex;flex-wrap:wrap;align-items:stretch;gap:12px;padding:16px 28px 22px;border-top:1px solid #e4e6e9;background:#fff} .epx-vp__pie:empty{display:none} .epx-vp__aviso{flex:1 1 100%;margin:0;padding:10px 14px;background:#fdf1f0;border:1px solid #b3261e;border-radius:2px;font-size:13px;color:#8c1d18} .epx-vp__aviso[hidden]{display:none} .epx-vp__cant{flex:0 0 auto;display:flex;align-items:stretch;border:1px solid #e4e6e9;border-radius:2px} .epx-vp__cant button{width:48px;min-height:52px;padding:0;background:#fff;border:0;border-radius:0;font:inherit;font-size:20px;color:#06163d;cursor:pointer} .epx-vp__cant button:hover:not(:disabled),.epx-vp__cant button:focus-visible{background:#f7f7f5;color:#06163d} .epx-vp__cant button:disabled{color:#c9cdd3;cursor:default} .epx-vp__cant output{display:flex;align-items:center;justify-content:center;min-width:52px;font-size:16px;font-weight:700;border-left:1px solid #e4e6e9;border-right:1px solid #e4e6e9} .epx-vp__add{flex:1 1 220px;min-height:52px;padding:0 24px;background:#FDCF63;border:1px solid #FDCF63;border-radius:2px;font:inherit;font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#06163d;cursor:pointer} .epx-vp__add:hover:not(:disabled),.epx-vp__add:focus-visible{background:#06163d;border-color:#06163d;color:#fff} .epx-vp__add:disabled{background:#f7f7f5;border-color:#e4e6e9;color:#8a909e;cursor:not-allowed} .epx-vp__add.es-cargando{opacity:.7;cursor:progress} .epx-vp__add.es-hecho{background:#1f7a4d;border-color:#1f7a4d;color:#fff} .epx-vp button:focus-visible,.epx-vp a:focus-visible{outline:2px solid #23a7d6;outline-offset:2px} /* --- Movil: sube desde abajo --- */ @media (max-width:767px){ .epx-vp{align-items:flex-end} .epx-vp__panel{width:100%;max-height:92vh;max-height:92dvh;border-width:1px 0 0;box-shadow:0 -12px 40px rgba(6,22,61,.28)} .epx-vp__cab{padding:16px 18px 10px} .epx-vp__titulo{font-size:17px} .epx-vp__cuerpo{grid-template-columns:1fr;gap:18px;padding:4px 18px 18px} .epx-vp__ficha{display:grid;grid-template-columns:104px minmax(0,1fr);column-gap:14px;align-items:start} .epx-vp__foto{grid-row:1/3} .epx-vp__precio{margin-top:0} .epx-vp__ahora{font-size:24px} .epx-vp__detalles{margin-top:6px} .epx-vp__pie{padding:12px 18px calc(14px + env(safe-area-inset-bottom))} .epx-vp__add{flex:1 1 0;padding:0 12px} } /* ===================================================================== Tarjeta ligera en movil (1 oct 2026, misma categoria de prueba). Un solo boton por tarjeta y sin selector de cantidad: producto simple «Añadir»; variable «Elegir opciones», que abre el panel. El resto de la tarjeta lleva a la ficha. ===================================================================== */ @media (max-width:767px){ .e-loop-item.product{position:relative} /* fuera el selector de cantidad; el boton, a todo el ancho y por encima del enlace de la tarjeta */ .e-loop-item.product .pc-qty{display:none!important} .e-loop-item.product .pc-cart{position:relative;z-index:3} .e-loop-item.product .pc-add{flex:1 1 100%;width:100%;min-height:44px} /* letra legible; «Elegir opciones» en hueco (lleva a elegir) y «Añadir» macizo (compra directa) */ .e-loop-item.product .pc-add>span:first-child{font-size:11px!important;letter-spacing:.04em!important} .e-loop-item.product.product-type-variable .pc-add{background:#fff!important;color:#06163d!important;border:1px solid #06163d!important} .e-loop-item.product.product-type-variable .pc-add:active{background:#06163d!important;color:#fff!important} .e-loop-item.product .e-con:has(.pc-cart):not(:has(h6)){order:6} /* toda la tarjeta es el enlace del titulo */ .e-loop-item.product .e-heading-link-base::after{content:"";position:absolute;inset:0;z-index:2} /* titulo a tres lineas y algo mas pequeño, para que se lea entero y todas midan lo mismo */ .e-loop-item.product h6.h6{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;font-size:13px!important;line-height:1.3!important;min-height:calc(3 * 1.3em)!important} .e-loop-item.product h6.h6 a{font-size:inherit!important;line-height:inherit!important} /* el stock, debajo del precio */ .e-loop-item.product .elementor-widget-shortcode:has(.stock-chip){display:block!important;order:5} .e-loop-item.product .stock-chip{font-size:11px} } /* ===================================================================== Carrito lateral en movil (1 oct 2026, toda la tienda). El plugin Modern Cart esconde la foto por debajo de 768 px y el nombre caia en la columna de 52 px reservada para ella («Apliqu e solar LED…»). ===================================================================== */ @media (max-width:767px){ #moderncart-slide-out-modal #moderncart-slide-out .moderncart-cart-item-image{display:block!important} } #moderncart-slide-out-modal #moderncart-slide-out .moderncart-cart-item-onsale{background:#1f7a4d!important;color:#fff!important;border-radius:2px!important;font-size:10px!important;line-height:1.4!important;padding:1px 5px!important} /* El aviso «Añadido al carrito» del boton flotante salia sin estilo y fijo en pantalla: no hay ninguna regla cargada para el. Sobra, porque al añadir ya se abre el carrito lateral. */ #moderncart-floating-cart .moderncart-add-to-cart-notification,.moderncart-floating-cart-button-notification{display:none!important} /* Home: el texto de la primera diapositiva salia vacio hasta que cargaba el carrusel. El CSS de la home (5750) lo esconde hasta que Swiper marca la diapositiva activa, y ese codigo va retrasado hasta el primer gesto. Mientras el carrusel no arranca, la primera se ve. */ .epx-h-carrusel .swiper:not(.swiper-initialized) .swiper-slide:first-child .epx-h-slide-in>*{opacity:1!important;transform:none!important} /* ===================================================================== Buscador en movil (2 oct 2026). Lupa entre el logo y la cuenta, y buscador a pantalla. Va con el bloque «Buscador en movil» del JS. ===================================================================== */ .epx-bm-btn{display:flex!important;align-items:center;justify-content:center;flex:0 0 30px;width:30px;height:38px;min-width:0;padding:0!important;margin:0;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;color:#46505f!important;cursor:pointer} .epx-bm-btn svg{display:block;width:30px;height:30px} .epx-bm-btn:focus-visible{outline:2px solid #23a7d6;outline-offset:2px} html.epx-bm-abierto{overflow:hidden} html.epx-bm-abierto #ea11y-root,html.epx-bm-abierto .joinchat{display:none!important} .epx-bm{position:fixed;inset:0;z-index:2147483000;font-family:'Montserrat',sans-serif;color:#06163d} .epx-bm[hidden]{display:none} .epx-bm *{box-sizing:border-box} .epx-bm__velo{position:absolute;inset:0;background:rgba(6,22,61,.5)} .epx-bm__panel{position:absolute;left:0;right:0;top:0;padding:14px 16px 18px;background:#fff;border-bottom:1px solid #e4e6e9;box-shadow:0 12px 40px rgba(6,22,61,.25)} .epx-bm__form{display:flex;align-items:stretch;gap:8px;margin:0} .epx-bm__input{flex:1 1 auto;min-width:0;height:48px;padding:0 14px!important;background:#fff!important;border:1px solid #06163d!important;border-radius:2px!important;font-family:inherit;font-size:16px!important;line-height:1.2;color:#06163d!important;box-shadow:none!important;-webkit-appearance:none;appearance:none} .epx-bm__input::placeholder{color:#8a909e} .epx-bm__input:focus{outline:2px solid #23a7d6;outline-offset:1px} .epx-bm__ir,.epx-bm__cerrar{flex:0 0 auto;display:flex;align-items:center;justify-content:center;height:48px;padding:0!important;border-radius:2px!important;box-shadow:none!important;cursor:pointer} .epx-bm__ir{width:48px;background:#06163d!important;border:1px solid #06163d!important;color:#fff!important} .epx-bm__cerrar{width:40px;background:none!important;border:1px solid transparent!important;color:#06163d!important} .epx-bm__ir svg,.epx-bm__cerrar svg{display:block;width:24px;height:24px} .epx-bm__frec{margin-top:14px} .epx-bm__frec p{margin:0 0 8px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#5b6270} .epx-bm__frec button{display:inline-block;margin:0 6px 6px 0;padding:7px 11px;background:#fff!important;border:1px solid #e4e6e9!important;border-radius:2px!important;box-shadow:none!important;font-family:inherit;font-size:13px;font-weight:400;line-height:1.3;letter-spacing:0;text-transform:none;color:#06163d!important;cursor:pointer} .epx-bm__frec button:active{border-color:#06163d!important} /* ===================================================================== Botones de la tarjeta en toda la tienda (2 oct 2026), en movil y en escritorio: «Añadir» macizo y sin el icono del carrito; «Elegir opciones» en hueco. ===================================================================== */ .e-loop-item.product .pc-add .pc-icon{display:none!important} /* Los dos botones en contorno navy (decidido el 2 oct 2026): mas sobrio, mandan la foto y el precio. */ .e-loop-item.product .pc-add{background:#fff!important;color:#06163d!important;border:1px solid #06163d!important} .e-loop-item.product .pc-add:hover,.e-loop-item.product .pc-add:focus-visible{background:#06163d!important;color:#fff!important} /* Letra del boton: salia a 9 px en tableta y en escritorio estrecho. 11 px en movil (regla de arriba), 12 px desde tableta. */ @media (min-width:768px){ .e-loop-item.product .pc-add{min-height:40px} .e-loop-item.product .pc-add>span:first-child{font-size:12px!important;letter-spacing:.04em!important} } /* ===================================================================== Iconos de los bloques «cual elegir» en las categorias principales (2 oct 2026). Esos iconos solo estaban definidos dentro de .epx-cat (subcategorias); en las categorias de primer nivel el bloque va fuera y salian en blanco. Las variables --px-... las define la hoja de iconos (9204). ===================================================================== */ .ti.ti-adjustments::before,.ti.ti-adjustments-horizontal::before,.ti.ti-angle::before,.ti.ti-armchair::before,.ti.ti-arrow-guide::before,.ti.ti-arrow-up::before,.ti.ti-arrows-horizontal::before,.ti.ti-arrows-maximize::before,.ti.ti-arrows-move::before,.ti.ti-arrows-vertical::before,.ti.ti-ball-football::before,.ti.ti-battery-charging::before,.ti.ti-bolt::before,.ti.ti-book::before,.ti.ti-books::before,.ti.ti-box::before,.ti.ti-box-align-top::before,.ti.ti-briefcase::before,.ti.ti-building::before,.ti.ti-building-arch::before,.ti.ti-building-warehouse::before,.ti.ti-car::before,.ti.ti-car-garage::before,.ti.ti-certificate::before,.ti.ti-christmas-tree::before,.ti.ti-circle-dashed::before,.ti.ti-circle-dot::before,.ti.ti-clock::before,.ti.ti-color-swatch::before,.ti.ti-compass::before,.ti.ti-confetti::before,.ti.ti-crop::before,.ti.ti-desk::before,.ti.ti-device-desktop::before,.ti.ti-device-tv::before,.ti.ti-door::before,.ti.ti-door-enter::before,.ti.ti-droplet::before,.ti.ti-eye::before,.ti.ti-fence::before,.ti.ti-flame::before,.ti.ti-flare::before,.ti.ti-focus-2::before,.ti.ti-gift::before,.ti.ti-git-merge::before,.ti.ti-hammer::before,.ti.ti-hand-finger::before,.ti.ti-home-edit::before,.ti.ti-lamp-2::before,.ti.ti-layout-align-center::before,.ti.ti-layout-distribute-horizontal::before,.ti.ti-layout-grid::before,.ti.ti-layout-rows::before,.ti.ti-leaf::before,.ti.ti-link::before,.ti.ti-magnet::before,.ti.ti-moon::before,.ti.ti-palette::before,.ti.ti-parking::before,.ti.ti-photo::before,.ti.ti-plant::before,.ti.ti-plant-2::before,.ti.ti-plug::before,.ti.ti-pool::before,.ti.ti-radar::before,.ti.ti-refresh::before,.ti.ti-replace::before,.ti.ti-rotate::before,.ti.ti-rotate-360::before,.ti.ti-ruler-2::before,.ti.ti-ruler-measure::before,.ti.ti-school::before,.ti.ti-settings::before,.ti.ti-shape::before,.ti.ti-shield::before,.ti.ti-signature::before,.ti.ti-snowflake::before,.ti.ti-sparkles::before,.ti.ti-square::before,.ti.ti-square-rounded::before,.ti.ti-stack-2::before,.ti.ti-stairs::before,.ti.ti-star::before,.ti.ti-sun::before,.ti.ti-temperature::before,.ti.ti-tools::before,.ti.ti-tree::before,.ti.ti-trees::before,.ti.ti-umbrella::before,.ti.ti-wall::before,.ti.ti-wind::before,.ti.ti-windmill::before,.ti.ti-window::before{content:""!important;display:inline-block;width:1em;height:1em;background:currentColor!important;-webkit-mask:var(--px) center/contain no-repeat;mask:var(--px) center/contain no-repeat} .ti-adjustments{--px:var(--px-p149)} .ti-adjustments-horizontal{--px:var(--px-p149)} .ti-angle{--px:var(--px-p194)} .ti-armchair{--px:var(--px-p097)} .ti-arrow-guide{--px:var(--px-p125)} .ti-arrow-up{--px:var(--px-p112)} .ti-arrows-horizontal{--px:var(--px-p188)} .ti-arrows-maximize{--px:var(--px-p187)} .ti-arrows-move{--px:var(--px-p187)} .ti-arrows-vertical{--px:var(--px-n-techo-alto)} .ti-ball-football{--px:var(--px-p090)} .ti-battery-charging{--px:var(--px-p169)} .ti-bolt{--px:var(--px-p183)} .ti-book{--px:var(--px-p057)} .ti-books{--px:var(--px-n-estanteria)} .ti-box{--px:var(--px-p152)} .ti-box-align-top{--px:var(--px-n-montaje)} .ti-briefcase{--px:var(--px-p147)} .ti-building{--px:var(--px-p092)} .ti-building-arch{--px:var(--px-n-techo-alto)} .ti-building-warehouse{--px:var(--px-n-nave)} .ti-car{--px:var(--px-n-garaje)} .ti-car-garage{--px:var(--px-n-garaje)} .ti-certificate{--px:var(--px-p032)} .ti-christmas-tree{--px:var(--px-p094)} .ti-circle-dashed{--px:var(--px-x-circulo)} .ti-circle-dot{--px:var(--px-p041)} .ti-clock{--px:var(--px-p054)} .ti-color-swatch{--px:var(--px-p182)} .ti-compass{--px:var(--px-p041)} .ti-confetti{--px:var(--px-n-fiesta)} .ti-crop{--px:var(--px-p184)} .ti-desk{--px:var(--px-n-escritorio)} .ti-device-desktop{--px:var(--px-p049)} .ti-device-tv{--px:var(--px-p049)} .ti-door{--px:var(--px-n-puerta)} .ti-door-enter{--px:var(--px-p113)} .ti-droplet{--px:var(--px-p166)} .ti-eye{--px:var(--px-p042)} .ti-fence{--px:var(--px-n-valla)} .ti-flame{--px:var(--px-p178)} .ti-flare{--px:var(--px-p013)} .ti-focus-2{--px:var(--px-p194)} .ti-gift{--px:var(--px-p077)} .ti-git-merge{--px:var(--px-p006)} .ti-hammer{--px:var(--px-p140)} .ti-hand-finger{--px:var(--px-p209)} .ti-home-edit{--px:var(--px-n-sin-obra)} .ti-lamp-2{--px:var(--px-n-lampara-colgante)} .ti-layout-align-center{--px:var(--px-n-en-hilera)} .ti-layout-distribute-horizontal{--px:var(--px-n-en-hilera)} .ti-layout-grid{--px:var(--px-p235)} .ti-layout-rows{--px:var(--px-p236)} .ti-leaf{--px:var(--px-n-hoja)} .ti-link{--px:var(--px-p070)} .ti-magnet{--px:var(--px-n-iman)} .ti-moon{--px:var(--px-p089)} .ti-palette{--px:var(--px-p182)} .ti-parking{--px:var(--px-n-garaje)} .ti-photo{--px:var(--px-n-cuadro)} .ti-plant{--px:var(--px-p186)} .ti-plant-2{--px:var(--px-p186)} .ti-plug{--px:var(--px-n-enchufe)} .ti-pool{--px:var(--px-n-piscina)} .ti-radar{--px:var(--px-p096)} .ti-refresh{--px:var(--px-p131)} .ti-replace{--px:var(--px-p216)} .ti-rotate{--px:var(--px-p131)} .ti-rotate-360{--px:var(--px-p131)} .ti-ruler-2{--px:var(--px-p188)} .ti-ruler-measure{--px:var(--px-p176)} .ti-school{--px:var(--px-p060)} .ti-settings{--px:var(--px-p138)} .ti-shape{--px:var(--px-p052)} .ti-shield{--px:var(--px-p206)} .ti-signature{--px:var(--px-p046)} .ti-snowflake{--px:var(--px-p179)} .ti-sparkles{--px:var(--px-p013)} .ti-square{--px:var(--px-p238)} .ti-square-rounded{--px:var(--px-p238)} .ti-stack-2{--px:var(--px-n-poco-fondo)} .ti-stairs{--px:var(--px-n-escalera)} .ti-star{--px:var(--px-p221)} .ti-sun{--px:var(--px-p015)} .ti-temperature{--px:var(--px-p177)} .ti-tools{--px:var(--px-p140)} .ti-tree{--px:var(--px-p094)} .ti-trees{--px:var(--px-p165)} .ti-umbrella{--px:var(--px-n-intemperie)} .ti-wall{--px:var(--px-n-pared)} .ti-wind{--px:var(--px-p163)} .ti-windmill{--px:var(--px-p163)} .ti-window{--px:var(--px-p058)} /* ===================================================================== Capas flotantes (4 oct 2026). El banner de cookies se configura en Cookiebot desde el 30/10/2026 (aqui ya no se fuerza). WhatsApp y accesibilidad: en movil y tableta se esconden mientras se baja por la pagina y vuelven al subir, para no tapar los botones de los productos. ===================================================================== */ /* mientras el banner de cookies esta abierto, los flotantes no se montan encima de sus botones */ body:has(#CybotCookiebotDialog.CybotCookiebotDialogActive) .joinchat,body:has(#CybotCookiebotDialog.CybotCookiebotDialogActive) #ea11y-root{display:none!important} .joinchat,#ea11y-root{transition:opacity .25s ease} @media (max-width:1024px){ /* 3/11/2026 (Karen): en móvil y tableta, WhatsApp y accesibilidad se apartan mientras se baja y vuelven en cuanto se para el desplazamiento (9206 quita epx-flot-fuera a los 0,6 s quieto). En todas las páginas, también la ficha. */ html.epx-flot-fuera .joinchat:not(.joinchat--chatbox),html.epx-flot-fuera #ea11y-root{opacity:0!important;pointer-events:none!important} } @media (max-width:767px){ .joinchat{--s:48px!important} } /* en la pantalla de pago el boton de WhatsApp tapaba campos del formulario */ body.woocommerce-checkout .joinchat{display:none!important} /* ===================================================================== Mini-carrito lateral (4 oct 2026). Va con el bloque «Mini-carrito» del JS. Cerrar con aspa a la derecha, «Eliminar» en palabra, totales que no parecen una suma (el IVA va debajo del total, en pequeño) y botones en navy. La barra «Progreso de tu pedido» no se toca. ===================================================================== */ #moderncart-slide-out .moderncart-slide-out-header-heading{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important} #moderncart-slide-out .moderncart-slide-out-header-title{order:1;flex:1 1 auto;text-align:left!important} #moderncart-slide-out .moderncart-slide-out-header-quantity{order:2} #moderncart-slide-out-modal #moderncart-slide-out .moderncart-slide-out-header-close{order:3;flex:0 0 44px!important;display:flex!important;align-items:center;justify-content:center;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;margin:0 -10px 0 0!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important;cursor:pointer} #moderncart-slide-out .moderncart-slide-out-header-close svg{display:none!important} #moderncart-slide-out .moderncart-slide-out-header-close::before{content:"";display:block;width:24px;height:24px;background:#06163d;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.2' stroke-linecap='round'%3E%3Cpath d='M5.2 5.2 18.8 18.8M18.8 5.2 5.2 18.8'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.2' stroke-linecap='round'%3E%3Cpath d='M5.2 5.2 18.8 18.8M18.8 5.2 5.2 18.8'/%3E%3C/svg%3E") center/contain no-repeat} #moderncart-slide-out .moderncart-cart-item-actions-remove{width:auto!important;height:auto!important;min-height:32px;padding:6px 0!important;background:none!important;border:0!important;box-shadow:none!important;cursor:pointer} #moderncart-slide-out .moderncart-cart-item-actions-remove svg{display:none!important} #moderncart-slide-out .moderncart-cart-item-actions-remove::after{content:"Eliminar";font-family:'Montserrat',sans-serif;font-size:12px;font-weight:400;line-height:1.2;color:#5b6270;text-decoration:underline;text-underline-offset:3px;text-transform:none;letter-spacing:0} #moderncart-slide-out .moderncart-cart-line-items{display:flex!important;flex-direction:column!important} #moderncart-slide-out .moderncart-cart-line-items__total{order:5} #moderncart-slide-out .moderncart-cart-line-items__tax{order:6;border:0!important;padding-top:2px!important;padding-bottom:10px!important;min-height:0!important} #moderncart-slide-out .moderncart-cart-line-items__tax .moderncart-cart-line-items-label,#moderncart-slide-out .moderncart-cart-line-items__tax .moderncart-cart-line-items-value,#moderncart-slide-out .moderncart-cart-line-items__tax .amount{font-size:12px!important;font-weight:400!important;color:#5b6270!important} #moderncart-slide-out .moderncart-cart-line-items__total-value small.includes_tax{display:none!important} /* «Pasar al pago» manda; «Ver carrito» debajo, en un recuadro pequeño azul claro (Karen, 28/10: el botón grande le quitaba protagonismo). */ #moderncart-slide-out .wc-proceed-to-checkout:has(> .eprilux-view-cart-button){display:flex!important;flex-direction:column!important} #moderncart-slide-out .wc-proceed-to-checkout > .checkout-button{order:1} #moderncart-slide-out .wc-proceed-to-checkout > .checkout-button:not([disabled]){background:#FDCF63!important;border-color:#FDCF63!important;color:#06163d!important;text-transform:uppercase!important;font-size:13px!important;font-weight:700!important;letter-spacing:.07em!important} #moderncart-slide-out .wc-proceed-to-checkout > .checkout-button:not([disabled]):hover,#moderncart-slide-out .wc-proceed-to-checkout > .checkout-button:not([disabled]):focus-visible{background:#E8A920!important;border-color:#E8A920!important;color:#06163d!important} #moderncart-slide-out .wc-proceed-to-checkout > .eprilux-view-cart-button{order:2;align-self:center;width:auto!important;margin:12px 0 0!important;padding:6px 16px!important;border:1px solid #23a7d6!important;border-radius:2px!important;background:#fff!important;color:#23a7d6!important;font-size:13px!important;font-weight:600!important;letter-spacing:0!important;text-transform:none!important;text-decoration:none!important} #moderncart-slide-out .wc-proceed-to-checkout > .eprilux-view-cart-button:hover,#moderncart-slide-out .wc-proceed-to-checkout > .eprilux-view-cart-button:focus-visible{background:#23a7d6!important;color:#fff!important} /* La barra «Progreso de tu pedido», debajo de los botones (Karen, 28/10). */ #moderncart-slide-out .moderncart-cart-total > .wc-proceed-to-checkout{order:1} #moderncart-slide-out .moderncart-cart-total > .eprilux-mc-thresholds{order:2;margin-top:16px} #moderncart-slide-out .moderncart-cart-total > .eprilux-mc-complete{order:3} #moderncart-slide-out .moderncart-slide-out-coupon-form-button{background:#06163d!important;border-color:#06163d!important;color:#fff!important} #moderncart-slide-out .moderncart-cart-line-items-label{white-space:nowrap} #moderncart-slide-out .moderncart-price small{white-space:nowrap} /* ===================================================================== Mini-carrito lateral, segunda tanda (4 oct 2026). 1. En movil ya no ocupa toda la pantalla: deja ver la pagina a la izquierda, oscurecida, y tocando ahi se cierra. 2. «Eliminar» pasa a ser la papelera de Prilux (picto 073), con zona de toque de 44 px. 3. Fila provisional «Añadiendo…» mientras el servidor contesta (va con el JS). ===================================================================== */ #moderncart-slide-out-modal.moderncart-show{background:rgba(6,22,61,.5)!important} @media (max-width:767px){ #moderncart-slide-out-modal #moderncart-slide-out{left:auto!important;right:0!important;width:88vw!important;max-width:88vw!important} } #moderncart-slide-out .moderncart-cart-item-actions-remove{display:inline-flex!important;align-items:center;justify-content:flex-end;min-width:44px!important;min-height:40px!important;padding:0!important} #moderncart-slide-out .moderncart-cart-item-actions-remove::after{content:""!important;display:block;width:22px;height:22px;background:#5b6270;-webkit-mask:var(--px-p073) center/contain no-repeat;mask:var(--px-p073) center/contain no-repeat;text-decoration:none!important} #moderncart-slide-out .moderncart-cart-item-actions-remove:hover::after{background:#06163d} .epx-mc-espera{display:flex;align-items:center;gap:12px;padding:12px 20px 14px;margin:0 0 4px;border-bottom:1px solid #e4e6e9;position:relative;font-family:'Montserrat',sans-serif} .epx-mc-espera img{flex:0 0 56px;width:56px;height:56px;object-fit:contain;background:#fff;border:1px solid #e4e6e9} .epx-mc-espera__txt{flex:1 1 auto;min-width:0;font-size:13px;line-height:1.4;color:#06163d} .epx-mc-espera__txt small{display:block;font-size:12px;color:#5b6270} .epx-mc-espera::after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:35%;background:#23a7d6;animation:epx-mc-corre 1.1s linear infinite} @keyframes epx-mc-corre{0%{left:0;width:10%}50%{left:35%;width:40%}100%{left:100%;width:0}} #moderncart-slide-out .moderncart-price small{font-size:11px!important;white-space:nowrap!important} /* mientras se añade, el tema dejaba el carrito en blanco con «Actualizando tu carrito…». Si hay fila provisional se enseña la lista (atenuada) con la fila arriba; los totales siguen ocultos hasta que llegan los de verdad, para no enseñar un importe viejo. */ #moderncart-slide-out-modal.eprilux-mc-updating.epx-mc-con-fila .moderncart-panel > .moderncart-slide-out-cart{visibility:visible!important} #moderncart-slide-out-modal.eprilux-mc-updating.epx-mc-con-fila .moderncart-panel::after{content:none!important} #moderncart-slide-out-modal.epx-mc-con-fila .moderncart-empty-cart{display:none!important} #moderncart-slide-out-modal.eprilux-mc-updating.epx-mc-con-fila .moderncart-cart-item{opacity:.5} /* mientras se añade: nada de «Tu carrito está vacío» ni botones del pie sueltos; cabecera neutra y aviso del total */ #moderncart-slide-out-modal.epx-mc-con-fila .moderncart-slide-out-header-title span{font-size:0!important} #moderncart-slide-out-modal.epx-mc-con-fila .moderncart-slide-out-header-title::after{content:"Tu carrito";font-size:18px;font-weight:600;color:#06163d;line-height:1.3} #moderncart-slide-out-modal.epx-mc-con-fila .moderncart-slide-out-header-quantity{visibility:hidden} #moderncart-slide-out-modal.eprilux-mc-updating .moderncart-slide-out-footer *{visibility:hidden!important;transition:none!important} #moderncart-slide-out-modal.eprilux-mc-updating.epx-mc-con-fila .moderncart-panel::after{content:"Calculando el total\2026"!important;position:absolute;inset:auto 16px 20px!important;padding:16px!important;text-align:center;font-size:13px!important;color:#5b6270!important;border-top:1px solid #e4e6e9!important} /* ===================================================================== Tarjeta de producto (4 oct 2026). Va con el bloque «Tarjeta de producto» del JS. Foto más grande, nombre en dos líneas, línea de datos, precio sin «Desde», stock con plazo, línea de opciones y el mismo botón «Añadir» en todas. Decidido por Karen: botón en contorno navy, «Añadir» también en las variables, sin las tres rayitas (se parecían a EfectoLED) y sin «Desde». ===================================================================== */ html .e-loop-item.product a.e-image-link-base{display:block;overflow:hidden} html .e-loop-item.product img.img-product{scale:1.18} html .e-loop-item.product .elementor-element-754a35a{padding-left:10px!important;padding-right:10px!important} html .e-loop-item.product h6.h6{-webkit-line-clamp:2!important;min-height:2.6em!important;max-height:2.6em} .epx-t-datos{min-height:15px;margin:5px 0 0;font:400 10.5px/1.4 'Montserrat',sans-serif;letter-spacing:-.01em;color:#5b6270;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .epx-t-envio{font:400 11px/1.2 'Montserrat',sans-serif;color:#5b6270;white-space:nowrap} html .e-loop-item.product .stock-chip{white-space:nowrap} .epx-t-opc{display:flex;align-items:center;gap:5px;min-height:15px;margin:0 0 6px;font:500 11px/1.3 'Montserrat',sans-serif;color:#06163d;white-space:nowrap;overflow:hidden} .epx-t-opc:not(:empty)::before{content:"";flex:0 0 13px;height:13px;background:#23a7d6;-webkit-mask:var(--px-p182) center/contain no-repeat;mask:var(--px-p182) center/contain no-repeat} html .e-loop-item.product.product-type-variable .pc-add>span:first-child::after{content:"Añadir"!important} html .e-loop-item.product .eprilux-card-from-price{font-size:0!important} html .e-loop-item.product .eprilux-card-from-price .woocommerce-Price-amount{font-size:16px!important} html .e-loop-item.product p.bold .woocommerce-Price-amount{font-weight:600} @media (min-width:768px){ .epx-t-datos{font-size:12px;min-height:17px} .epx-t-envio,.epx-t-opc{font-size:12px} html .e-loop-item.product .elementor-element-754a35a{padding-left:16px!important;padding-right:16px!important} } /* ===================================================================== Opciones en la propia tarjeta (4 oct 2026). Va con «opciones en la propia tarjeta» del JS. Puntos de color para tono de luz y acabado; botones pequeños para potencia, largo o tamaño. Con uno o dos selectores no hace falta el panel: «Añadir» mete lo que esté marcado. ===================================================================== */ html .e-loop-item.product-type-variable .epx-t-opc{min-height:22px} html .e-loop-item.epx-t-inline .epx-t-opc{display:none!important} .epx-t-sel{display:flex;flex-direction:column;gap:6px;margin:0 0 8px;position:relative;z-index:3} .epx-t-fila{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:22px} html .e-loop-item .epx-t-sel button{-webkit-appearance:none;appearance:none;margin:0;min-height:0!important;box-shadow:none!important;cursor:pointer;font-family:'Montserrat',sans-serif!important;text-transform:none!important;letter-spacing:0!important} html .e-loop-item .epx-t-sel .epx-t-pto{flex:0 0 24px;width:24px;height:24px;padding:0!important;border-radius:50%!important;border:1px solid #c9ced6!important;background:var(--c)!important;box-shadow:inset 0 0 0 2px #fff!important} html .e-loop-item .epx-t-sel .epx-t-pto[aria-pressed="true"]{border:2px solid #06163d!important} /* Alto automático: con nombres largos («16 bolas blancas y grises (2,25 m)») el texto pasaba a dos líneas y se salía del recuadro de 24 px (Karen, 27/10). Ahora crece con el texto y nunca es más ancho que la tarjeta. */ html .e-loop-item .epx-t-sel .epx-t-txt{height:auto;min-height:24px;max-width:100%;padding:5px 8px!important;border:1px solid #c9ced6!important;border-radius:2px!important;background:#fff!important;color:#06163d!important;font-size:10.5px!important;font-weight:500!important;line-height:1.3!important;white-space:normal;text-align:left;overflow-wrap:anywhere} html .e-loop-item .epx-t-sel .epx-t-txt[aria-pressed="true"]{border-color:#06163d!important;background:#06163d!important;color:#fff!important} html .e-loop-item .epx-t-sel .es-otra{opacity:.45;border-style:dashed!important} .epx-t-eleg{margin-left:auto;font:400 10.5px/1 'Montserrat',sans-serif;color:#5b6270;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60px} @media (min-width:768px){.epx-t-eleg{font-size:12px;max-width:110px}html .e-loop-item .epx-t-sel .epx-t-txt{font-size:12px!important}} /* epx-t-arreglo-titulo: en ordenador el nombre de tres lineas se montaba sobre la linea de datos */ html .e-loop-item.product h6.h6{display:-webkit-box!important;-webkit-box-orient:vertical!important;overflow:hidden!important;height:auto!important} /* carrito lateral: los productos en el orden en que se añadieron, el primero arriba (4 oct 2026). El plugin los pinta al revés. */ #moderncart-slide-out .moderncart-slide-out-cart-inner:not(.moderncart-slide-out-cart-empty){display:flex!important;flex-direction:column!important;justify-content:flex-start!important} /* con las opciones en la tarjeta, el contador de unidades vuelve a verse en ordenador, como en los productos sin variantes */ @media (min-width:768px){html .e-loop-item.product.product-type-variable.epx-t-inline .pc-qty{display:inline-flex!important}} /* epx-t-hover-sin-zoom: al pasar el raton sale la segunda imagen (a veces una tarjeta con texto): sin ampliar, para que no se corte */ @media (hover:hover){html .e-loop-item.product:hover img.img-product{scale:1}} /* epx-t-boton-junto: con contador, el boton va a su lado y no debajo, igual que en los productos sin variantes */ @media (min-width:768px){html .e-loop-item.product.product-type-variable.epx-t-inline .pc-add{flex:1 1 0%!important;width:auto!important}} /* epx-t-botones-alineados: el contador y el boton van siempre al pie de la tarjeta, para que en una fila queden todos a la misma altura tengan o no opciones */ html .e-loop-item.product>.e-con{height:100%} html .e-loop-item.product .elementor-element-754a35a{flex:1 1 auto!important} html .e-loop-item.product .elementor-element-fe5e31d{margin-top:auto!important} /* epx-t-titulo-movil: en movil el nombre vuelve a tres lineas, para que quepa la coletilla que lo explica («como una de 100 W») */ @media (max-width:767px){html .e-loop-item.product h6.h6{-webkit-line-clamp:3!important;min-height:3.9em!important;max-height:3.9em!important}} /* ===================================================================== Tarjeta, remate del 4 oct 2026 (noche). - Precio mas grande e igual en todas (el de los productos con variantes salia mas pequeño). - Flecha de clase energetica en la esquina de la foto: obligatoria junto a la oferta de una fuente de luz. No va junto al precio porque Karen lo quiere libre. - En bombillas, al pasar el raton no se cambia de foto: la misma, con un zoom suave. ===================================================================== */ html .e-loop-item.product p.bold .woocommerce-Price-amount, html .e-loop-item.product .eprilux-card-from-price .woocommerce-Price-amount{font-size:22px!important;font-weight:700!important;line-height:1.15!important;color:#06163d} html .e-loop-item.product p.bold del .woocommerce-Price-amount{font-size:12px!important;font-weight:400!important;color:#9aa0aa!important} @media (max-width:767px){ html .e-loop-item.product p.bold .woocommerce-Price-amount, html .e-loop-item.product .eprilux-card-from-price .woocommerce-Price-amount{font-size:19px!important} html .e-loop-item.product p.bold del .woocommerce-Price-amount{font-size:11px!important} .epx-t-opc{font-size:10.5px} } html .e-loop-item.product .elementor-element-cfd47cb{position:relative} .epx-t-clase{position:absolute;left:8px;bottom:8px;z-index:2;display:inline-flex;align-items:stretch;height:22px;pointer-events:none} .epx-t-clase i{display:flex;flex-direction:column;justify-content:center;align-items:center;width:12px;border:1px solid #06163d;border-right:0;background:#fff;font:700 6px/1 'Montserrat',sans-serif;font-style:normal;color:#06163d} .epx-t-clase i span{font-size:6px;line-height:1} .epx-t-clase b{display:flex;align-items:center;justify-content:center;width:32px;padding-right:7px;background:var(--k);color:#fff;font:700 14px/1 'Montserrat',sans-serif;clip-path:polygon(0 0,72% 0,100% 50%,72% 100%,0 100%)} html .e-loop-item.product img.img-product{transition:scale .45s ease!important} @media (hover:hover){html .e-loop-item.product.product_cat-bombillas-led:hover img.img-product{scale:1.27}} /* 4 oct 2026, noche. Los titulares no se cortan: la letra baja un punto y el nombre sale entero. Se reserva alto para tres lineas (cuatro en movil) para que las tarjetas de una fila sigan alineadas. */ html body .e-loop-item.product h6.h6{display:block!important;-webkit-line-clamp:unset!important;line-clamp:unset!important;overflow:visible!important;max-height:none!important;font-size:14px!important;line-height:1.3!important;min-height:3.9em!important} @media (max-width:767px){html body .e-loop-item.product h6.h6{font-size:12.5px!important;min-height:5.2em!important;max-height:none!important}} /* 4 oct 2026. Fotos que ya llenan el cuadro (sin margen blanco): no se amplian, para que no salgan recortadas. */ html body .e-loop-item.product.post-9331 img.img-product,html body .e-loop-item.product.post-9332 img.img-product{scale:1!important} /* 4 oct 2026. Pagina del carrito: fuera las bandas de arriba; barra de dos hitos encima del boton. */ body.woocommerce-cart .eprilux-minimum-order-notice,body.woocommerce-cart .cart-page .free-ship{display:none!important} body.woocommerce-cart .epx-hitos{margin:16px 0 14px;padding:14px 14px 12px;border:1px solid #e4e6e9;border-radius:2px;background:#f7f7f5} body.woocommerce-cart .epx-hitos-msg{margin:0 0 12px;font-size:13px;line-height:1.4;color:#06163d} body.woocommerce-cart .epx-hitos-msg strong{font-weight:700} body.woocommerce-cart .epx-hitos-via{position:relative;height:6px;background:#e4e6e9;border-radius:2px} body.woocommerce-cart .epx-hitos-llena{position:absolute;left:0;top:0;bottom:0;display:block;background:#FDCF63;border-radius:2px;transition:width .3s} body.woocommerce-cart .epx-hitos.es-min .epx-hitos-llena{background:#23a7d6} body.woocommerce-cart .epx-hitos.es-gratis .epx-hitos-llena{background:#1f8a4c} body.woocommerce-cart .epx-hitos-marca{position:absolute;top:-4px;width:2px;height:14px;margin-left:-1px;background:#06163d} body.woocommerce-cart .epx-hitos-pie{position:relative;height:30px;margin-top:8px;font-size:11px;line-height:1.25;color:#8a909e} body.woocommerce-cart .epx-hitos-min{position:absolute;top:0;transform:translateX(-50%);width:96px;text-align:center} body.woocommerce-cart .epx-hitos-gra{position:absolute;top:0;right:0;width:84px;text-align:right} body.woocommerce-cart .epx-hitos.es-min .epx-hitos-min,body.woocommerce-cart .epx-hitos.es-gratis .epx-hitos-gra{color:#06163d;font-weight:600} body.woocommerce-cart .checkout-button.eprilux-checkout-disabled{white-space:normal;line-height:1.3;height:auto;padding-top:14px;padding-bottom:14px} /* 4 oct 2026. Checkout: franja con el total arriba (solo movil y tableta) y aviso junto al campo que falta. */ .epx-co-resumen{display:none} @media (max-width:1024px){ body.woocommerce-checkout .epx-co-resumen{display:flex;align-items:center;gap:8px;width:100%;margin:0 0 14px;padding:13px 14px;border:1px solid #e4e6e9;border-radius:2px;background:#fff;color:#06163d;font:500 14px/1.3 Montserrat,sans-serif;text-align:left;cursor:pointer;text-transform:none;letter-spacing:0} body.woocommerce-checkout .epx-co-resumen span{flex:1 1 auto} body.woocommerce-checkout .epx-co-resumen b{font-weight:700;font-size:16px} body.woocommerce-checkout .epx-co-resumen i{width:8px;height:8px;border-right:2px solid #06163d;border-bottom:2px solid #06163d;transform:rotate(45deg);margin:0 4px 4px 2px} } body.woocommerce-checkout form.checkout .form-row.woocommerce-invalid-required-field::after{content:"Rellena este campo para poder pagar";display:block;margin-top:4px;font-size:12px;line-height:1.3;color:#b3261e} /* 4 oct 2026. El carrito lateral llega con