/* ==== Enduro Recambios · diseño v2 (fases 2-5) ====
   Solo estilos del tema. Reversible: quitar el <link> ENDURO-RESKIN de head.tpl.
   v5: ancho completo global + listado de categoría y ficha de producto a diseño. */
/* 16/09: quitado el @import de Google Fonts. Las fuentes se cargan una vez en head.tpl
   (el @import obligaba a bajar este CSS entero antes de empezar a pedir las fuentes). */

:root{
  --e-paper:#F5F3EB; --e-white:#fff; --e-band:#ECE9DD; --e-line:#DDD9C9;
  --e-deep:#2C6E0F; --e-green:#4B9E1C; --e-ink:#1A1910; --e-olive:#7C7868; --e-rally:#D42B12; --e-lime:#E8E22E;
  --e-cond:'Saira Condensed',sans-serif; --e-sans:'IBM Plex Sans',sans-serif; --e-mono:'IBM Plex Mono',monospace;
}

body,.page-content,.form-control,p,li,td,.product-description{font-family:var(--e-sans)}
a{color:var(--e-green)} a:hover{color:var(--e-deep)}

/* ================= ANCHO COMPLETO =================
   AngarTheme encierra TODO <main> en una caja de 1200px
   (@media(min-width:1199px){main{max-width:1200px}} + .container{max-width:1200px}). */
html body main{max-width:none!important;width:100%!important;margin:0!important;box-shadow:none!important}
html body #wrapper>.container,html body #notifications>.container,html body #wrapper>.container.hook_box{
  max-width:none!important;width:100%!important;padding-left:0!important;padding-right:0!important}
html body #wrapper{padding-top:0!important}
html body #wrapper>.container>.row{margin-left:0!important;margin-right:0!important}
html body#index #content-wrapper,html body#category #content-wrapper,html body#product #content-wrapper,
html body#search #content-wrapper,html body#prices-drop #content-wrapper,html body#manufacturer #content-wrapper,
html body#new-products #content-wrapper,html body#best-sales #content-wrapper,html body #content-wrapper.col-md-12{
  padding-left:0!important;padding-right:0!important;width:100%!important;max-width:100%!important;flex:0 0 100%!important}
html,body{overflow-x:hidden}

/* ================= PÁGINAS CON DISEÑO PROPIO =================
   En listado y ficha el diseño trae su propia estructura: se apagan restos del tema. */
.erv-list .grid_switcher,.erv-list .breadcrumb,.erv-pd .breadcrumb,
.erv-list #js-product-list-top.products-selection,.erv-list .back_to_top{display:none!important}
.erv-wrap{max-width:100%;margin:0 auto;padding:26px 40px 50px}
@media (max-width:640px){.erv-wrap{padding:18px 16px 34px}}

/* ---- cabecera de listado ---- */
.erv-kick{font-family:var(--e-mono);color:var(--e-olive);font-size:12px;letter-spacing:.14em;text-transform:uppercase;display:block;margin-bottom:6px}
.erv-kick a{color:var(--e-olive)} .erv-kick a:hover{color:var(--e-green)}
.erv-h1{font-family:var(--e-cond);font-weight:800;font-style:italic;font-size:clamp(30px,4.2vw,52px);text-transform:uppercase;
  margin:0 0 14px;line-height:.92;color:var(--e-deep)}
/* ---- banda de cabecera de categoria: la foto de fondo y el titulo encima ---- */
.erv-chead{position:relative;margin:0 0 18px;overflow:hidden;background:var(--e-band)}
.erv-chead.has-img{min-height:190px;display:flex;align-items:flex-end}
.erv-chead .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.erv-chead .veil{position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(245,243,235,.97) 0%,rgba(245,243,235,.88) 45%,rgba(245,243,235,.25) 100%)}
.erv-chead .in{position:relative;width:100%}
.erv-chead.has-img .in{padding:26px 26px 20px}
.erv-chead .erv-h1{margin:0}
/* texto SEO plegado: sigue estando, pero no se come la pantalla */
.erv-catdesc{border:1px solid var(--e-line);background:var(--e-white);margin:0 0 20px}
.erv-catdesc>summary{cursor:pointer;list-style:none;padding:12px 16px;font-family:var(--e-cond);font-weight:700;
  font-size:15px;text-transform:uppercase;letter-spacing:.03em;color:var(--e-deep);display:flex;
  align-items:center;justify-content:space-between}
.erv-catdesc>summary::-webkit-details-marker{display:none}
.erv-catdesc>summary::after{content:'+';color:var(--e-green);font-size:18px;font-family:var(--e-mono)}
.erv-catdesc[open]>summary::after{content:'–'}
.erv-catdesc>summary:hover{background:var(--e-band)}
.erv-catdesc .body{padding:4px 16px 16px;font-size:14.5px;line-height:1.65;color:#4a4738;border-top:1px solid var(--e-line)}
.erv-catdesc .body p{margin:0 0 8px}
.erv-catdesc .body img{max-width:100%;height:auto}
.erv-catdesc .body span{background:none!important;color:inherit!important;font-family:inherit!important;font-size:inherit!important}

/* ================= CARRITO Y PAGO ================= */
body#cart #content-wrapper,body#checkout #content-wrapper,body#order-confirmation #content-wrapper{
  padding:26px 40px 50px!important}
body#cart #wrapper>.container,body#checkout #wrapper>.container{max-width:1360px!important;margin:0 auto!important}
body#cart .material-icons,body#checkout .material-icons{display:none!important}
body#cart .cart-grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:22px;align-items:start;margin:0}
body#cart .cart-grid-body,body#cart .cart-grid-right{padding:0;width:auto;max-width:none;flex:none}
body#cart .card,body#checkout .card,body#cart .cart-container,body#checkout .cart-summary{
  border:1px solid var(--e-line)!important;border-radius:0!important;box-shadow:none!important;background:var(--e-white)}
body#cart .card-block,body#checkout .card-block{padding:18px}
body#cart h1,body#checkout h1,body#cart .cart-title,body#cart .h1{
  font-family:var(--e-cond)!important;font-weight:800!important;font-style:italic;text-transform:uppercase;
  color:var(--e-deep)!important;font-size:clamp(26px,3vw,40px)!important;margin:0 0 16px}
body#cart .cart-summary-line,body#checkout .cart-summary-line{
  display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--e-line);font-size:14px}
body#cart .cart-summary-line .value,body#checkout .cart-summary-line .value{font-family:var(--e-mono);color:var(--e-ink)}
body#cart .cart-total,body#checkout .cart-total{border-bottom:none;font-weight:700}
body#cart .cart-total .value,body#checkout .cart-total .value{color:var(--e-green);font-size:20px;font-weight:600}
body#cart .product-line-grid,body#checkout .product-line-grid{border-bottom:1px solid var(--e-line);padding:14px 0}
body#cart .product-line-info .label,body#cart .product-line-info a{
  font-family:var(--e-sans);font-size:14.5px;color:var(--e-ink);text-transform:none}
body#cart .product-price,body#checkout .product-price{font-family:var(--e-mono);color:var(--e-green)!important;font-weight:600}
body#cart .btn-primary,body#checkout .btn-primary,body#cart .cart-detailed-actions .btn,
body#checkout #payment-confirmation .btn{
  background:var(--e-green)!important;border-color:var(--e-green)!important;color:#fff!important;
  font-family:var(--e-cond)!important;font-weight:800!important;font-style:italic;text-transform:uppercase;
  letter-spacing:.06em;border-radius:0!important;padding:14px 24px!important;font-size:16px!important;
  width:100%;opacity:1!important}
body#cart .btn-primary:hover,body#checkout .btn-primary:hover{background:var(--e-deep)!important;border-color:var(--e-deep)!important}
body#cart .label,body#checkout .step-title,body#checkout .h3{
  font-family:var(--e-cond)!important;font-weight:700!important;text-transform:uppercase;color:var(--e-deep)!important}
body#checkout .checkout-step{border:1px solid var(--e-line)!important;border-radius:0!important;margin-bottom:14px;background:var(--e-white)}
body#checkout .checkout-step .step-title{padding:14px 18px;font-size:19px!important;font-style:italic}
body#checkout .checkout-step.-current .step-title{border-bottom:1px solid var(--e-line)}
body#checkout .form-control,body#cart .form-control,body#checkout select,body#checkout input[type=text],
body#checkout input[type=email],body#checkout input[type=password]{
  border:1px solid var(--e-line)!important;border-radius:0!important;box-shadow:none!important;
  padding:11px 13px!important;height:auto!important;font-size:14px}
body#checkout .form-control:focus{border-color:var(--e-green)!important}
body#cart .cart-grid-right .card{position:sticky;top:12px}
body#cart .label,body#cart .cart-summary-subtotals-container{font-size:14px}
body#cart a.label,body#cart .continue,body#cart .cart-detailed-actions a{color:var(--e-green)}
@media (max-width:900px){
  body#cart .cart-grid{grid-template-columns:1fr}
  body#cart #content-wrapper,body#checkout #content-wrapper{padding:18px 16px 40px!important}
}

/* ================= PANEL DE TALLER / MI CUENTA ================= */
/* la cabecera y las migas por defecto sobran: el panel trae su propio título */
body#my-account .breadcrumb,body#my-account #main>.page-header{display:none!important}
body#my-account #wrapper>.container{max-width:1360px!important;margin:0 auto!important}
body#my-account #content-wrapper{padding:26px 40px 40px!important}
@media (max-width:900px){ body#my-account #content-wrapper{padding:18px 16px 30px!important} }
.erv-pro,.erv-acc{max-width:1360px;margin:0 auto;padding:6px 0 30px}
.erv-pro .top{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.erv-pro .kick{font-family:var(--e-mono);color:var(--e-green);font-size:12px;letter-spacing:.16em;text-transform:uppercase}
.erv-pro .who{font-family:var(--e-mono);color:var(--e-olive);font-size:12px}
.erv-pro .erv-h1{margin:6px 0 22px}
.erv-pro .grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:20px;align-items:start}
.erv-pro .box{border:1px solid var(--e-line);background:var(--e-white)}
.erv-pro .box.acc{border-color:var(--e-green);margin-top:20px}
.erv-pro .bh{display:flex;align-items:center;justify-content:space-between;gap:10px;
  border-bottom:1px solid var(--e-ink);padding:14px 16px}
.erv-pro .box.acc .bh{border-bottom:1px solid var(--e-line);justify-content:flex-start}
.erv-pro .bh .t{font-family:var(--e-cond);font-weight:700;font-size:18px;text-transform:uppercase;color:var(--e-deep)}
.erv-pro .bh .m{font-family:var(--e-mono);font-size:11px;color:var(--e-olive);letter-spacing:.06em}
.erv-pro .bh .m:hover{color:var(--e-green)}
.erv-pro .bh .ic{width:26px;height:26px;border:1px solid var(--e-green);color:var(--e-green);
  display:flex;align-items:center;justify-content:center;font-family:var(--e-mono);font-size:13px;margin-right:10px}
.erv-pro .lin{display:grid;grid-template-columns:1.1fr 1fr .7fr 1fr auto;gap:12px;align-items:center;
  padding:13px 16px;border-bottom:1px solid var(--e-line);font-family:var(--e-mono);font-size:12.5px}
.erv-pro .lin .id{color:var(--e-ink);font-size:13px}
.erv-pro .lin .id:hover{color:var(--e-green);text-decoration:underline}
.erv-pro .lin .d,.erv-pro .lin .s{color:var(--e-olive)}
.erv-pro .lin .tt{color:var(--e-green);font-weight:600;text-align:right;font-size:14px}
.erv-pro .lin .btn{background:var(--e-green);color:#fff;padding:7px 12px;font-family:var(--e-cond);
  font-weight:700;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.erv-pro .lin .btn:hover{background:var(--e-deep)}
.erv-pro .lin .btn.alt{background:none;border:1px solid var(--e-line);color:var(--e-ink)}
.erv-pro .lin .btn.alt:hover{border-color:var(--e-green);color:var(--e-deep);background:var(--e-band)}
.erv-pro .vacio,.erv-acc .vacio,.gar .vacio{padding:16px;color:var(--e-olive);font-size:14px}
.erv-pro .bd{padding:16px}
.erv-pro .bd p{color:var(--e-olive);font-size:13.5px;margin:0 0 12px}
.erv-pro textarea{width:100%;background:var(--e-paper);border:1px solid var(--e-line);color:var(--e-ink);
  padding:13px 14px;font-family:var(--e-mono);font-size:13.5px;line-height:1.7;outline:none;resize:vertical}
.erv-pro textarea:focus{border-color:var(--e-green)}
.erv-pro .acts{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;flex-wrap:wrap}
.erv-pro .acts .mono{font-family:var(--e-mono);font-size:12px;color:var(--e-olive)}
.erv-pro .go{background:var(--e-green);border:none;color:#fff;padding:12px 22px;font-family:var(--e-cond);
  font-weight:800;font-style:italic;font-size:14px;letter-spacing:.06em;text-transform:uppercase;
  transform:skewX(-6deg);cursor:pointer}
.erv-pro .go:hover{background:var(--e-deep)}
.erv-pro .go:disabled{opacity:.5;cursor:default}
.erv-pro .res{margin-top:10px;font-family:var(--e-mono);font-size:12px}
.erv-pro .res .ok{color:var(--e-green)}
.erv-pro .res .ko{color:var(--e-rally);margin-top:4px}
.erv-pro .side{display:flex;flex-direction:column;gap:20px}
.erv-pro .box.p{padding:18px}
.erv-pro .lbl,.erv-acc .lbl,.erv-sel .garaje .lbl{font-family:var(--e-mono);font-size:11px;color:var(--e-olive);
  letter-spacing:.14em;text-transform:uppercase;margin-bottom:12px;display:block}
/* presupuestos y pendientes: filas finas separadas por la propia línea de fondo */
.erv-pro .pend{display:flex;flex-direction:column;gap:1px;background:var(--e-line);border:1px solid var(--e-line)}
.erv-pro .pend .it{display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:var(--e-white);padding:11px 13px}
.erv-pro .pend .a{font-family:var(--e-mono);font-size:12.5px;color:var(--e-ink)}
.erv-pro .pend .b{font-family:var(--e-mono);font-size:13px;color:var(--e-green);font-weight:600}
.erv-pro .pend .vacio{padding:12px 13px;background:var(--e-white);font-size:13px}
/* tira de enlaces de cuenta bajo las dos columnas */
.erv-pro .tira{display:flex;flex-wrap:wrap;gap:0 26px;margin-top:22px;padding-top:14px;
  border-top:1px solid var(--e-line);font-family:var(--e-mono);font-size:12px;letter-spacing:.04em}
.erv-pro .tira a{color:var(--e-olive);padding:4px 0}
.erv-pro .tira a:hover{color:var(--e-green)}
.erv-pro .lk{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.erv-pro .lk a{font-size:14px;color:var(--e-ink)}
.erv-pro .lk a:hover{color:var(--e-green)}
.erv-pro .comercial{background:var(--e-deep);color:var(--e-paper);padding:18px 20px}
.erv-pro .comercial b{font-family:var(--e-cond);font-weight:700;font-size:16px;text-transform:uppercase;display:block}
.erv-pro .comercial small{font-size:13px;opacity:.85;display:block;margin-top:2px}
.erv-pro .comercial .bts{display:flex;gap:9px;margin-top:14px;flex-wrap:wrap}
.erv-pro .comercial .bts a{display:inline-flex;align-items:center;gap:8px;font-family:var(--e-cond);
  font-weight:700;font-size:14px;letter-spacing:.05em;text-transform:uppercase;padding:11px 15px;white-space:nowrap}
.erv-pro .comercial .wa{background:#25D366;color:#0B1403}
.erv-pro .comercial .wa:hover{background:#fff;color:var(--e-deep)}
.erv-pro .comercial .tel{border:1px solid rgba(245,243,235,.45);color:var(--e-paper)}
.erv-pro .comercial .tel:hover{border-color:#fff;background:rgba(255,255,255,.1);color:#fff}
/* cabecera de "pedidos anteriores": dos enlaces a la derecha */
.erv-pro .bh .ms{display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:flex-end}
.erv-pro .bh .m.wa{color:#1F8F45}
.erv-pro .bh .m.wa:hover{color:#25D366}
/* el "corte": la última fila duplicaba la línea con el borde de la caja */
.erv-pro .box .lin:last-child{border-bottom:none}
.erv-pro .box{overflow:hidden}

/* garaje (lista de motos guardadas en el navegador) */
.gar{display:flex;flex-direction:column;gap:8px}
.gar .it{display:flex;align-items:center;justify-content:space-between;gap:10px;
  border:1px solid var(--e-line);padding:10px 12px}
.gar .it a{font-size:13.5px;color:var(--e-ink)}
.gar .it a:hover{color:var(--e-green)}
.gar .it button{background:none;border:none;color:var(--e-olive);cursor:pointer;font-size:16px;line-height:1;padding:0 2px}
.gar .it button:hover{color:var(--e-rally)}
.erv-pro .add,.erv-acc .add{display:inline-block;margin-top:12px;font-family:var(--e-mono);font-size:12px;
  color:var(--e-green);letter-spacing:.04em}
.erv-pro .add:hover,.erv-acc .add:hover{text-decoration:underline}

.erv-acc .lk{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1px;
  background:var(--e-line);border:1px solid var(--e-line)}
.erv-acc .lk a{background:var(--e-white);padding:18px 18px;display:block}
.erv-acc .lk a:hover{background:var(--e-band)}
.erv-acc .lk b{font-family:var(--e-cond);font-weight:700;font-size:17px;text-transform:uppercase;
  color:var(--e-deep);display:block}
.erv-acc .lk small{color:var(--e-olive);font-size:13px}
.erv-acc .garaje{margin-top:22px;border:1px solid var(--e-line);background:var(--e-white);padding:18px;max-width:520px}
.erv-acc .salir{margin-top:22px}
.erv-acc .salir a{display:inline-block;background:var(--e-green);color:#fff;padding:12px 22px;
  font-family:var(--e-cond);font-weight:800;font-style:italic;text-transform:uppercase;letter-spacing:.06em}
.erv-acc .salir a:hover{background:var(--e-deep)}

@media (max-width:900px){
  .erv-pro .grid{grid-template-columns:1fr}
  .erv-pro .lin{grid-template-columns:1fr 1fr;gap:6px}
  .erv-pro .lin .tt{text-align:left}
}

/* selector: guardar en el garaje */
.erv-sel .guardar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:22px;
  border:1px solid var(--e-green);background:var(--e-white);padding:14px 16px}
.erv-sel .guardar .q{font-size:14px;color:var(--e-olive)}
.erv-sel .guardar .q b{color:var(--e-ink)}
.erv-sel .guardar button{background:var(--e-green);border:none;color:#fff;padding:11px 20px;
  font-family:var(--e-cond);font-weight:800;font-style:italic;font-size:14px;letter-spacing:.06em;
  text-transform:uppercase;transform:skewX(-6deg);cursor:pointer}
.erv-sel .guardar button:hover{background:var(--e-deep)}
.erv-sel .guardar .okmsg{font-family:var(--e-mono);font-size:12px;color:var(--e-green)}
.erv-sel .guardar .ver{background:var(--e-deep);color:#fff;padding:11px 18px;font-family:var(--e-cond);
  font-weight:800;font-style:italic;font-size:14px;letter-spacing:.06em;text-transform:uppercase;
  transform:skewX(-6deg);display:inline-block}
.erv-sel .guardar .ver:hover{background:var(--e-green)}
/* la categoría de despiece/recambio original va primera y marcada: es donde están los modelos */
.erv-sel .op.oem{display:flex;align-items:center;justify-content:space-between;gap:10px}
.erv-sel .op.oem i{font-family:var(--e-mono);font-style:normal;font-size:9.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--e-green);border:1px solid var(--e-green);padding:2px 6px;flex:none}
.erv-sel .op.oem.sel i{color:#fff;border-color:rgba(255,255,255,.6)}
.erv-sel .op.todo{font-weight:700}
.erv-sel .garaje{margin-top:16px;border:1px solid var(--e-line);background:var(--e-white);padding:16px;max-width:520px}
.erv-sel .garaje .vacio{padding:0;font-size:13.5px}
.erv-sel .garaje .ayuda{margin:12px 0 0;font-family:var(--e-mono);font-size:11.5px;color:var(--e-olive);line-height:1.6}

/* ================= SELECTOR DE MOTO ================= */
.erv-sel{background:var(--e-paper);padding:0 0 60px}
.erv-sel .wrap{max-width:1360px;margin:0 auto;padding:34px 40px 0}
.erv-sel .hd{text-align:center;max-width:640px;margin:0 auto 26px}
.erv-sel .hd .kick{font-family:var(--e-mono);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--e-green)}
.erv-sel .hd .erv-h1{margin:10px 0 12px}
.erv-sel .hd p{color:var(--e-olive);font-size:15px;line-height:1.6;margin:0}
.erv-sel .steps{display:flex;justify-content:center;gap:180px;margin:0 0 14px}
.erv-sel .st{font-family:var(--e-mono);font-size:12px;color:var(--e-olive);border:1px solid var(--e-line);
  background:var(--e-white);padding:6px 10px}
.erv-sel .st.on{border-color:var(--e-green);color:var(--e-deep)}
.erv-sel .cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:start}
.erv-sel .col{background:var(--e-white);border:1px solid var(--e-line);padding:18px}
.erv-sel .ct{display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  border-bottom:1px solid var(--e-line);padding-bottom:10px;margin-bottom:12px}
.erv-sel .ct span{font-family:var(--e-cond);font-weight:800;font-style:italic;font-size:19px;
  text-transform:uppercase;color:var(--e-deep)}
.erv-sel .ct i{font-family:var(--e-mono);font-style:normal;font-size:11px;color:var(--e-olive)}
.erv-sel .ph{font-family:var(--e-mono);font-size:12.5px;color:var(--e-olive);padding:8px 0}
.erv-sel .list{display:flex;flex-direction:column;gap:1px;max-height:520px;overflow-y:auto}
.erv-sel .list.g{display:none}
.erv-sel .list.g.on{display:flex}
.erv-sel .op{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
  background:var(--e-white);border:1px solid var(--e-line);text-align:left;cursor:pointer;
  font-family:var(--e-cond);font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.02em;
  color:var(--e-ink);padding:13px 14px;min-height:48px;text-decoration:none}
.erv-sel .op:hover{border-color:var(--e-green);color:var(--e-deep);background:var(--e-band)}
.erv-sel .op.sel{background:var(--e-deep);border-color:var(--e-deep);color:#fff}
.erv-sel .op span{color:var(--e-green)}
.erv-sel .op.sel span{color:#fff}
.erv-sel .op.all{border-color:var(--e-green);color:var(--e-deep)}
.erv-sel .nota{margin:26px 0 0;font-size:14px;color:var(--e-olive);text-align:center}
.erv-sel .nota a{color:var(--e-green);text-decoration:underline}
@media (max-width:900px){
  .erv-sel .cols{grid-template-columns:1fr}
  .erv-sel .steps{gap:60px}
  .erv-sel .wrap{padding:24px 16px 0}
}

/* ---- rejilla listado ---- */
.erv-cols{display:grid;grid-template-columns:250px minmax(0,1fr);gap:26px;align-items:start}
.erv-side{position:sticky;top:12px;display:flex;flex-direction:column;gap:24px}
.erv-side .lbl{font-family:var(--e-mono);font-size:12px;color:var(--e-olive);letter-spacing:.16em;text-transform:uppercase;margin-bottom:10px;display:block}
.erv-side .catlist{display:flex;flex-direction:column;border-top:1px solid var(--e-line)}
.erv-side .catlist a{display:block;padding:10px 12px;font-family:var(--e-cond);font-weight:600;font-size:16px;text-transform:uppercase;
  letter-spacing:.02em;border-bottom:1px solid var(--e-line);color:var(--e-ink)}
.erv-side .catlist a:hover{color:var(--e-deep);background:var(--e-band)}
.erv-side .catlist a.on{color:var(--e-green);border-left:3px solid var(--e-green);padding-left:9px}
.erv-side .pills{display:flex;flex-wrap:wrap;gap:7px}
.erv-side .pills a{font-family:var(--e-mono);font-size:12.5px;padding:8px 12px;border:1px solid var(--e-line);background:var(--e-white);color:var(--e-ink)}
.erv-side .pills a:hover{border-color:var(--e-green);color:var(--e-deep)}
.erv-side .offer{display:flex;align-items:center;gap:10px;padding:11px 13px;font-size:14px;border:1px solid var(--e-line);
  background:var(--e-white);color:var(--e-ink)}
.erv-side .offer:hover{border-color:var(--e-rally);color:var(--e-ink)}
.erv-side .offer i{width:9px;height:9px;background:var(--e-rally);display:block}

/* filtros del módulo (facetas) dentro de nuestro sidebar */
.erv-side #search_filters{border:none!important;padding:0;background:none}
.erv-side #search_filters .facet{border-bottom:1px solid var(--e-line);padding-bottom:10px;margin-bottom:12px}
.erv-side #search_filters .facet-title,.erv-side #search_filters h4{font-family:var(--e-mono)!important;font-size:12px!important;
  color:var(--e-olive)!important;letter-spacing:.16em;text-transform:uppercase;font-weight:400!important}
.erv-side #search_filters ul{list-style:none;padding:0;margin:0}
.erv-side #search_filters li a{font-size:13.5px;color:var(--e-ink)}
.erv-side #search_filters li a:hover{color:var(--e-green)}

/* ---- barra de resultados + orden ---- */
.erv-bar{display:flex;align-items:center;justify-content:space-between;border-bottom:3px solid var(--e-ink);
  padding-bottom:12px;margin-bottom:18px;gap:14px;flex-wrap:wrap}
.erv-bar .cnt{display:flex;align-items:baseline;gap:9px}
.erv-bar .cnt b{font-family:var(--e-mono);color:var(--e-green);font-size:15px;font-weight:600}
.erv-bar .cnt span{color:var(--e-olive);font-size:14px}
.erv-sort{display:flex;align-items:center;gap:2px;border:1px solid var(--e-line);padding:3px;background:var(--e-white);flex-wrap:wrap}
.erv-sort a{font-family:var(--e-mono);font-size:12.5px;padding:7px 12px;color:var(--e-ink);display:block}
.erv-sort a:hover{color:var(--e-deep);background:var(--e-band)}
.erv-sort a.on{background:var(--e-green);color:#fff}

/* ---- tarjetas de producto ---- */
#js-product-list .products,.erv-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:14px;margin:0!important}
.erv-card{background:var(--e-white);border:1px solid var(--e-line)!important;display:flex;flex-direction:column;
  transition:border-color .12s ease,transform .12s ease;width:auto!important;float:none!important;padding:0!important;margin:0!important}
.erv-card:hover{border-color:var(--e-green)!important;transform:translateY(-2px)}
.erv-card .ph{position:relative;aspect-ratio:4/3;background:var(--e-paper);border-bottom:1px solid var(--e-line);
  display:flex;align-items:center;justify-content:center;overflow:hidden}
.erv-card .ph img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;mix-blend-mode:multiply}
.erv-card .flag{position:absolute;top:10px;left:10px;background:var(--e-rally);color:#fff;padding:3px 8px;font-size:11px;
  font-family:var(--e-mono);letter-spacing:.06em}
.erv-card .flag.oos{background:var(--e-olive)}
/* la referencia va debajo de la foto y siempre visible (antes se superponia solo al pasar el raton) */
.erv-card .bd{padding:15px;display:flex;flex-direction:column;gap:7px;flex:1}
.erv-card .oem{font-family:var(--e-mono);font-size:11px;color:var(--e-green);letter-spacing:.06em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.erv-card .meta{font-family:var(--e-mono);font-size:11px;color:var(--e-olive);letter-spacing:.04em;text-transform:uppercase;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.erv-card .nm{font-size:14.5px;line-height:1.35;min-height:40px;margin:0;font-family:var(--e-sans);font-weight:400;text-transform:none;font-style:normal}
.erv-card .nm a{color:var(--e-ink)} .erv-card .nm a:hover{color:var(--e-green)}
.erv-card .pr{display:flex;align-items:baseline;justify-content:center;gap:9px;margin-top:auto}
.erv-card .pr .now{font-family:var(--e-mono);color:var(--e-green);font-size:22px;font-weight:600}
.erv-card .pr .old{font-family:var(--e-mono);color:var(--e-olive);font-size:13px;text-decoration:line-through}
/* vehiculos Can-Am (no comprables online): precio "Desde X" en vez del precio exacto */
.erv-card .pr .desde-tag{font-family:var(--e-sans);font-size:12px;color:var(--e-olive);text-transform:uppercase;letter-spacing:.04em}
.erv-card .add{background:var(--e-green);border:none;color:#fff;padding:12px;font-family:var(--e-cond);font-weight:700;font-size:14px;
  letter-spacing:.07em;text-transform:uppercase;width:100%;display:block;text-align:center;cursor:pointer}
.erv-card .add:hover{background:var(--e-deep);color:#fff}
.erv-card .add.alt{background:var(--e-white);color:var(--e-deep);border:1px solid var(--e-line)}
.erv-card .add.alt:hover{border-color:var(--e-green);background:var(--e-band);color:var(--e-deep)}

/* ---- paginación ---- */
.erv-pag{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:28px;
  border-top:1px solid var(--e-line);padding-top:16px}
.erv-pag .info{font-family:var(--e-mono);font-size:12px;color:var(--e-olive);letter-spacing:.06em}
.erv-pag ul{display:flex;gap:4px;list-style:none;padding:0;margin:0;flex-wrap:wrap}
.erv-pag li a,.erv-pag li span{display:block;font-family:var(--e-mono);font-size:13px;padding:8px 12px;border:1px solid var(--e-line);
  background:var(--e-white);color:var(--e-ink)}
.erv-pag li a:hover{border-color:var(--e-green);color:var(--e-deep)}
.erv-pag li.current a{background:var(--e-green);border-color:var(--e-green);color:#fff}
.erv-pag li a.disabled{opacity:.4;pointer-events:none}

/* ---- subcategorías en cabecera de listado ---- */
.erv-subs{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1px;background:var(--e-line);
  border:1px solid var(--e-line);margin:0 0 22px}
.erv-subs a{background:var(--e-white);padding:14px 16px;display:flex;align-items:center;gap:12px;color:var(--e-ink);
  font-family:var(--e-cond);font-weight:600;font-size:15px;text-transform:uppercase;letter-spacing:.02em;min-height:64px}
.erv-subs a:hover{background:var(--e-band);color:var(--e-deep)}
.erv-subs img{width:44px;height:44px;object-fit:contain;flex:none;mix-blend-mode:multiply}

/* estado vacio del listado / busqueda sin resultados */
.erv-empty{border:1px solid var(--e-line);background:var(--e-white);padding:34px 30px 30px;max-width:640px}
.erv-empty .lbl{font-family:var(--e-mono);font-size:11px;color:var(--e-olive);letter-spacing:.16em;text-transform:uppercase}
.erv-empty h3{font-family:var(--e-cond);font-weight:800;font-style:italic;text-transform:uppercase;
  font-size:26px;color:var(--e-deep);margin:6px 0 10px}
.erv-empty p{color:var(--e-olive);font-size:14px;margin:0 0 18px;line-height:1.6}
.erv-empty .ff{display:flex;gap:0;border:1px solid var(--e-line)}
.erv-empty .ff input{flex:1;border:none;outline:none;padding:11px 14px;font-size:14px;background:#fff;color:var(--e-ink)}
.erv-empty .ff button{border:none;background:var(--e-green);color:#fff;font-family:var(--e-cond);font-weight:800;
  font-style:italic;text-transform:uppercase;letter-spacing:.06em;padding:11px 22px;cursor:pointer}
.erv-empty .ff button:hover{background:var(--e-deep)}
.erv-empty.wide{max-width:none}
.erv-empty .secs{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1px;background:var(--e-line);
  border:1px solid var(--e-line)}
.erv-empty .secs a{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--e-white);
  padding:15px 16px;font-family:var(--e-cond);font-weight:700;font-size:16px;text-transform:uppercase;
  color:var(--e-ink);letter-spacing:.02em;min-height:56px}
.erv-empty .secs a:hover{background:var(--e-band);color:var(--e-deep)}
.erv-empty .secs a span{color:var(--e-green)}

/* ================= FICHA DE PRODUCTO ================= */
.erv-pd .erv-cols2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start}
.erv-pd .gal{position:sticky;top:12px}
.erv-pd .gal .big{border:1px solid var(--e-line);background:var(--e-white);aspect-ratio:4/3;max-height:600px;overflow:hidden;display:flex;align-items:center;
  justify-content:center;overflow:hidden;
  background-image:linear-gradient(rgba(213,215,203,.35) 1px,transparent 1px),linear-gradient(90deg,rgba(213,215,203,.35) 1px,transparent 1px);
  background-size:28px 28px}
.erv-pd .gal .big img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transition:transform .2s}  /* 21/09: antes era max-width/max-height y la foto salía diminuta; además casi todas las fotos
     traen margen blanco dentro del propio fichero, y por eso se le da ese pellizco de zoom */
.erv-pd .gal .thumbs{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.erv-pd .gal .thumbs img{width:74px;height:74px;object-fit:contain;border:1px solid var(--e-line);background:var(--e-white);cursor:pointer}
.erv-pd .gal .thumbs img:hover{border-color:var(--e-green)}
/* MagicZoomPlus: si el modulo vuelve a inyectar su galeria, no debe duplicar la foto */
.erv-pd .MagicToolboxContainer,.erv-pd .magic-slide,.erv-pd #MagicZoomPlusImageMainImage{display:none!important}
/* el icono material del boton no forma parte del diseno y ademas queda como cuadro vacio */
.erv-pd .product-quantity .add .btn.add-to-cart i,.erv-card .add i{display:none!important}
.erv-pd .oem{font-family:var(--e-mono);font-size:13px;color:var(--e-green);letter-spacing:.06em;margin-top:9px}
.erv-pd h1.erv-h1{font-size:clamp(28px,3.4vw,42px);margin:0}
.erv-pd .price{display:flex;align-items:baseline;gap:14px;margin-top:16px;flex-wrap:wrap}
.erv-pd .price .now{font-family:var(--e-mono);color:var(--e-green);font-size:34px;font-weight:600}
.erv-pd .price .old{font-family:var(--e-mono);color:var(--e-olive);font-size:16px;text-decoration:line-through}
.erv-pd .price .disc{font-family:var(--e-mono);background:var(--e-rally);color:#fff;font-size:12px;padding:3px 8px}
.erv-pd .stock{font-family:var(--e-mono);font-size:12px;margin-top:8px;letter-spacing:.04em}
.erv-pd .stock.ok{color:var(--e-green)} .erv-pd .stock.no{color:var(--e-rally)}
.erv-pd .short{font-size:14.5px;line-height:1.65;color:#4a4738;margin-top:14px}
.erv-pd .buy{display:flex;gap:12px;margin-top:20px;flex-wrap:wrap;align-items:stretch}
.erv-pd .buy .qty input{width:74px;height:100%;min-height:52px;border:1px solid var(--e-line);background:var(--e-white);
  font-family:var(--e-mono);font-size:16px;text-align:center;color:var(--e-ink)}
.erv-pd .buy .cta{flex:1;min-width:220px;background:var(--e-green);border:none;color:#fff;padding:15px 24px;font-family:var(--e-cond);
  font-weight:800;font-style:italic;font-size:16px;letter-spacing:.07em;text-transform:uppercase;cursor:pointer}
.erv-pd .buy .cta:hover{background:var(--e-deep);color:#fff}
.erv-pd .spec{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--e-line);border:1px solid var(--e-line);margin-top:24px}
.erv-pd .spec div{background:var(--e-white);padding:16px}
.erv-pd .spec .k{font-family:var(--e-mono);font-size:11px;color:var(--e-olive);letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px}
.erv-pd .spec .v{font-size:14px;color:var(--e-ink)}
.erv-pd .taller{margin-top:24px;width:100%;background:var(--e-deep);border:none;color:var(--e-paper);padding:18px 20px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;text-align:left}
.erv-pd .taller:hover{background:var(--e-green);color:#fff}
.erv-pd .taller b{font-family:var(--e-cond);font-weight:700;font-size:18px;text-transform:uppercase;display:block;font-style:italic}
.erv-pd .taller small{font-size:13px;opacity:.85}
.erv-pd .sect{margin-top:44px}
.erv-pd .sect h2{font-family:var(--e-cond);font-weight:700;font-style:italic;font-size:24px;text-transform:uppercase;color:var(--e-deep);
  border-bottom:3px solid var(--e-ink);padding-bottom:12px;margin:0 0 16px}
.erv-pd .desc{font-size:14.5px;line-height:1.7;color:#3b3930;max-width:1000px}
.erv-pd .desc img{max-width:100%;height:auto}
.erv-pd table.data-sheet{width:100%;border-collapse:collapse;max-width:900px}
.erv-pd table.data-sheet td{border:1px solid var(--e-line);padding:10px 14px;font-size:14px;background:var(--e-white)}
.erv-pd table.data-sheet td.name,.erv-pd table.data-sheet td:first-child{background:var(--e-band);font-family:var(--e-mono);font-size:12px;
  color:var(--e-olive);text-transform:uppercase;letter-spacing:.08em;width:240px}
/* ---- ficha: partials reutilizados de PrestaShop ---- */
.erv-pd .brand{font-family:var(--e-mono);font-size:12px;color:var(--e-olive);letter-spacing:.08em;text-transform:uppercase;margin-top:8px}
.erv-pd .brand a{color:var(--e-olive)} .erv-pd .brand a:hover{color:var(--e-green)}
/* las etiquetas (-20%, novedad, agotado) van encima de la foto, no sueltas debajo */
.erv-pd .erv-flags{list-style:none;padding:0;margin:0;display:flex;gap:8px;flex-wrap:wrap;
  position:absolute!important;top:12px;left:12px;width:auto!important;z-index:2}
.erv-pd .erv-flags li{font-family:var(--e-mono);font-size:11px;padding:4px 9px;color:#fff;background:var(--e-deep);float:none!important;margin:0!important}
.erv-pd .erv-flags li.discount,.erv-pd .erv-flags li.on-sale,.erv-pd .erv-flags li.discount-percentage{background:var(--e-rally)}
.erv-pd .product-prices{margin-top:16px;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.erv-pd .product-prices .product-discount{order:1;margin:0}
.erv-pd .product-prices .tax-shipping-delivery-label{order:9;flex:0 0 100%;margin:0}
.erv-pd .product-prices .regular-price{font-family:var(--e-mono);color:var(--e-olive)!important;font-size:17px;text-decoration:line-through}
.erv-pd .product-prices .product-price{margin:0;padding:0}
.erv-pd .product-prices .current-price{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.erv-pd .product-prices .current-price .price{font-family:var(--e-mono);color:var(--e-green)!important;font-size:34px;font-weight:600;line-height:1}
.erv-pd .product-prices .discount{font-family:var(--e-mono);background:var(--e-rally)!important;color:#fff!important;font-size:12px;padding:3px 8px}
.erv-pd .tax-shipping-delivery-label,.erv-pd .product-without-taxes{width:100%;font-family:var(--e-mono);font-size:12px;color:var(--e-olive);margin:4px 0 0}
.erv-pd .delivery-information{color:var(--e-green)}
.erv-pd .product-add-to-cart{margin-top:20px}
.erv-pd .product-quantity{display:flex;align-items:stretch;gap:12px;flex-wrap:wrap}
.erv-pd .product-quantity .control-label{display:none}
.erv-pd #quantity_wanted{width:80px;min-height:54px;border:1px solid var(--e-line);background:var(--e-white);
  font-family:var(--e-mono);font-size:16px;text-align:center;color:var(--e-ink)}
.erv-pd .product-quantity .add{flex:1;min-width:220px;display:flex}
.erv-pd .product-quantity .add .btn.add-to-cart{width:100%;padding:16px 24px;font-family:var(--e-cond)!important;font-weight:800!important;
  font-style:italic;font-size:17px;letter-spacing:.07em;justify-content:center;display:flex;align-items:center;gap:8px}
.erv-pd #product-availability{display:inline-block;margin-top:10px;font-family:var(--e-mono);font-size:12px;letter-spacing:.04em}
.erv-pd .product-minimal-quantity{font-family:var(--e-mono);font-size:12px;color:var(--e-olive)}
.erv-pd .product-variants{margin-top:16px}
.erv-pd .product-variants .control-label{font-family:var(--e-mono);font-size:11px;color:var(--e-olive);letter-spacing:.14em;text-transform:uppercase}
.erv-pd #product-details.tab-pane{opacity:1!important;display:block!important}
.erv-pd #product-details .index_title,.erv-pd #product-details .h5{display:none}
.erv-pd .product-reference,.erv-pd .product-manufacturer,.erv-pd .product-quantities,.erv-pd .product-condition{
  display:inline-block;margin:0 26px 12px 0;font-size:14px}
.erv-pd .product-reference .label,.erv-pd .product-manufacturer .label,.erv-pd .product-quantities .label,.erv-pd .product-condition .label{
  display:block;font-family:var(--e-mono);font-size:11px;color:var(--e-olive);letter-spacing:.14em;text-transform:uppercase;margin-bottom:2px}
.erv-pd .product-features h3{font-family:var(--e-cond);font-size:16px;color:var(--e-deep);text-transform:uppercase;margin:16px 0 10px}
.erv-pd dl.data-sheet{display:grid;grid-template-columns:260px minmax(0,1fr);gap:1px;background:var(--e-line);
  border:1px solid var(--e-line);margin:0;max-width:900px}
.erv-pd dl.data-sheet dt,.erv-pd dl.data-sheet dd{background:var(--e-white);padding:10px 14px;margin:0;font-size:14px;color:var(--e-ink)}
.erv-pd dl.data-sheet dt{background:var(--e-band);font-family:var(--e-mono);font-size:11.5px;color:var(--e-olive);
  text-transform:uppercase;letter-spacing:.08em;font-weight:400}
.erv-pd .attachment h6{font-family:var(--e-cond);font-size:16px;margin:0 0 4px}

/* filas de contacto/envio: solo en movil (diseno "Movil · Ficha") */
.erv-rows{display:none;margin:18px 0 0;border-top:1px solid var(--e-line)}
.erv-rows .r{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;
  border-bottom:1px solid var(--e-line);min-height:52px;color:var(--e-ink);text-decoration:none}
.erv-rows .r b{font-family:var(--e-cond);font-weight:700;font-size:17px;text-transform:uppercase;font-style:normal}
.erv-rows .r small{display:block;font-family:var(--e-mono);font-size:11px;color:var(--e-olive);
  margin-top:3px;text-transform:none;letter-spacing:0;font-weight:400}
.erv-rows .r>span{color:var(--e-green);font-size:19px;flex:none}

@media (max-width:900px){
  .erv-cols{grid-template-columns:1fr}
  .erv-side{position:static}
  .erv-pd .erv-cols2{grid-template-columns:1fr}
  .erv-pd .gal{position:relative}
  .erv-pd .spec{grid-template-columns:1fr}
}

/* ============ MOVIL · diseno "Enduro Recambios Movil" ============ */
@media (max-width:768px){
  .erv-wrap{padding:18px 16px 30px}

  /* listado: dos columnas de tarjeta, como el patron de rejilla del movil */
  #js-product-list .products,.erv-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:1px}
  .erv-card .nm{font-size:13.5px}
  .erv-card .meta{font-size:10px}
  .erv-bar{flex-wrap:wrap;gap:10px}

  /* ficha: foto a sangre y cuadrada, como en la maqueta */
  .erv-pd .erv-wrap{padding-bottom:100px}
  .erv-pd .gal .big{margin:0 -16px;border-left:none;border-right:none;aspect-ratio:1/1;max-height:none}
  .erv-pd .erv-flags{top:14px;left:14px}
  .erv-pd h1.erv-h1{font-size:30px;line-height:.94}
  .erv-pd .product-prices .current-price .price{font-size:32px}
  .erv-rows{display:block}

  /* barra de compra fija abajo (cantidad + anadir), reutilizando el formulario real */
  .erv-pd .product-quantity{position:fixed;left:0;right:0;bottom:0;z-index:60;margin:0;
    background:var(--e-white);border-top:1px solid var(--e-line);padding:11px 16px 18px;
    display:flex;gap:10px;align-items:center;box-shadow:0 -6px 18px rgba(26,25,16,.12)}
  .erv-pd .product-quantity .control-label{display:none}
  .erv-pd .product-quantity .qty{flex:none;margin:0}
  .erv-pd .product-quantity .qty #quantity_wanted{width:76px;height:50px;text-align:center;margin:0}
  .erv-pd .product-quantity .add{flex:1;margin:0}
  .erv-pd .product-quantity .add .btn.add-to-cart{width:100%;min-height:52px;font-size:17px}
}

/* ================= RESTO DE LA TIENDA (reskin suave) ================= */
h1,h2,h3,.h1,.h2,.h3,.page-header h1,.title_block,.products-section-title{
  font-family:var(--e-cond)!important;font-weight:800!important;font-style:italic;text-transform:uppercase;letter-spacing:.01em;color:var(--e-deep)}
.btn-primary,.btn-secondary,.button.button-medium,.add-to-cart,button.add-to-cart,
#add_to_cart button,.cart-content-btn .btn-primary,.product-add-to-cart .btn,.btn.btn-primary{
  background:var(--e-green)!important;border-color:var(--e-green)!important;color:#fff!important;
  font-family:var(--e-cond)!important;font-weight:700!important;text-transform:uppercase;letter-spacing:.05em;border-radius:0!important}
.btn-primary:hover,.add-to-cart:hover,button.add-to-cart:hover,.product-add-to-cart .btn:hover,.btn.btn-primary:hover{
  background:var(--e-deep)!important;border-color:var(--e-deep)!important;color:#fff!important}
.product-price,.price,.current-price span,.has-discount .price,.product-prices .current-price,.current-price-value{
  color:var(--e-green)!important;font-family:var(--e-mono);font-weight:600}
.regular-price{color:var(--e-olive)!important}
.product-flag.discount,.product-flag.on-sale,.on-sale,.product-flag.discount-percentage{background:var(--e-rally)!important;color:#fff!important;border-radius:0}
.product-flag.new{background:var(--e-deep)!important;border-radius:0;color:#fff!important}
.form-control:focus{border-color:var(--e-green);box-shadow:none}
#search_filters{border:1px solid var(--e-line);border-radius:0;background:var(--e-white)}
.pagination .current a,.page-list .current a{background:var(--e-green)!important;border-color:var(--e-green)!important;color:#fff!important}
.pagination a{color:var(--e-deep)}
.tabs .nav-tabs .nav-link.active{border-bottom:3px solid var(--e-green);color:var(--e-deep);font-family:var(--e-cond);text-transform:uppercase}
.tabs .nav-tabs .nav-link{color:var(--e-olive);font-family:var(--e-cond);text-transform:uppercase}
.product-features .name,.data-sheet .name{background:var(--e-band)}

/* ================= FONDO DE LA WEB Y FICHAS EN BLANCO =================
   Pedido por Christian (2026-09-10): las fichas de artículo en blanco y el fondo de la web
   un tono más bajo, para que los artículos resalten. El blanco puro se reserva para las
   tarjetas y las cajas; el fondo es el papel un punto más oscuro. */
:root{--e-ground:#EAE6D8}

html body#index,html body#category,html body#search,html body#manufacturer,html body#supplier,
html body#prices-drop,html body#new-products,html body#best-sales,html body#product,
html body#my-account,html body#identity,html body#addresses,html body#history,
html body#order-detail,html body#cart,html body#checkout,html body#cms,html body#contact{
  background:var(--e-ground)!important}
html body#index #wrapper,html body#category #wrapper,html body#search #wrapper,
html body#product #wrapper,html body#my-account #wrapper,html body#cart #wrapper,
html body#checkout #wrapper,html body#manufacturer #wrapper,html body#prices-drop #wrapper,
html body#new-products #wrapper,html body#best-sales #wrapper,html body#cms #wrapper,
html body#contact #wrapper,html body#history #wrapper,html body#order-detail #wrapper,
html body#identity #wrapper,html body#addresses #wrapper{background:transparent!important}

/* la ficha del artículo, entera en blanco (antes la foto iba sobre papel beige) */
.erv-card{background:var(--e-white)!important}
.erv-card .ph{background:var(--e-white)}
/* el selector comparte fondo con el resto de la web */
.erv-sel{background:var(--e-ground)}

/* ================= BOTÓN FLOTANTE DE WHATSAPP =================
   Abajo a la derecha, en todas las páginas. Se despliega al pasar por encima. */
.erv-wa{position:fixed;right:20px;bottom:20px;z-index:9990;display:inline-flex;align-items:center;gap:0;
  background:#25D366;color:#0B1403;border-radius:34px;padding:14px;text-decoration:none;
  box-shadow:0 8px 22px rgba(0,0,0,.24);transition:gap .18s,padding .18s,background .18s}
.erv-wa svg{flex:none;display:block}
.erv-wa span{font-family:var(--e-cond);font-weight:800;font-style:italic;font-size:16px;
  letter-spacing:.05em;text-transform:uppercase;max-width:0;overflow:hidden;white-space:nowrap;
  transition:max-width .18s}
.erv-wa:hover,.erv-wa:focus-visible{background:#1FBA5A;color:#0B1403;gap:9px;padding:14px 20px 14px 16px}
.erv-wa:hover span,.erv-wa:focus-visible span{max-width:130px}
/* el aviso del carrito se sube para no quedar debajo del botón */
.erv-toast{bottom:92px!important}
@media (max-width:768px){
  .erv-wa{right:14px;bottom:14px;padding:12px}
  .erv-wa span{display:none}
  /* en la ficha hay una barra fija de compra abajo: el botón sube por encima */
  body#product .erv-wa{bottom:84px}
  .erv-toast{bottom:150px!important}
}
@media print{.erv-wa{display:none}}

/* ---- menú lateral: hermanas de la categoría actual ---- */
.erv-side .catlist a.on{color:var(--e-deep);font-weight:600;background:var(--e-band)}
.erv-side .up{display:inline-block;margin-top:10px;font-family:var(--e-mono);font-size:11.5px;
  letter-spacing:.04em;color:var(--e-green)}
.erv-side .up:hover{text-decoration:underline}

/* ================= NAVEGACIÓN DE SECCIONES ARRIBA =================
   Dentro de una moto: enlace para subir un nivel y las secciones en fila, con la actual
   marcada. Así no hace falta bajar al menú de la izquierda para moverse o volver. */
.erv-secnav{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 18px;padding:10px 12px;
  background:var(--e-white);border:1px solid var(--e-line)}
.erv-secnav .up{font-family:var(--e-mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--e-green);white-space:nowrap;padding:6px 10px;border:1px solid var(--e-line);flex:none}
.erv-secnav .up:hover{border-color:var(--e-green);background:var(--e-band)}
.erv-secnav .chips{display:flex;gap:6px;flex-wrap:wrap;min-width:0}
.erv-secnav .chips a{font-family:var(--e-cond);font-weight:700;font-size:13.5px;letter-spacing:.03em;
  text-transform:uppercase;color:var(--e-ink);padding:7px 11px;border:1px solid var(--e-line);
  background:var(--e-white);white-space:nowrap}
.erv-secnav .chips a:hover{border-color:var(--e-green);color:var(--e-deep);background:var(--e-band)}
.erv-secnav .chips a.on{background:var(--e-deep);border-color:var(--e-deep);color:#fff}
@media (max-width:640px){
  .erv-secnav{gap:10px;padding:9px 10px}
  .erv-secnav .chips{gap:5px}
  .erv-secnav .chips a{font-size:12.5px;padding:6px 9px}
}

/* ================= REJILLA DE SECCIONES CON FOTO =================
   Como en la web de producción: cada sección con su imagen de categoría. */
.erv-subgrid{margin:0 0 22px}
.erv-subgrid .lbl{font-family:var(--e-mono);font-size:11px;color:var(--e-olive);letter-spacing:.14em;
  text-transform:uppercase;display:block;margin-bottom:10px}
.erv-subgrid .gr{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.erv-subgrid .gr a{background:var(--e-white);border:1px solid var(--e-line);display:flex;flex-direction:column;
  transition:border-color .14s,transform .14s}
.erv-subgrid .gr a:hover{border-color:var(--e-green);transform:translateY(-2px)}
.erv-subgrid .ph{aspect-ratio:4/3;background:var(--e-white);border-bottom:1px solid var(--e-line);
  display:flex;align-items:center;justify-content:center;overflow:hidden}
.erv-subgrid .ph img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;mix-blend-mode:multiply}
.erv-subgrid .nm{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 14px;
  font-family:var(--e-cond);font-weight:700;font-size:15px;letter-spacing:.02em;text-transform:uppercase;
  color:var(--e-ink);line-height:1.15}
.erv-subgrid .gr a:hover .nm{color:var(--e-deep)}
.erv-subgrid .nm i{font-style:normal;color:var(--e-green);flex:none}
@media (max-width:640px){
  .erv-subgrid .gr{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
  .erv-subgrid .nm{font-size:13.5px;padding:11px 12px}
}

/* ================= BANDA DE CATEGORÍA CON VÍDEO DE MARCA =================
   Los mismos vídeos que las páginas de marca de Sáhara Motor. La miniatura de YouTube se ve
   al instante y el vídeo aparece encima cuando arranca. */
.erv-chead.has-vid{min-height:clamp(240px,34vh,400px);display:flex;align-items:flex-end;background:#12140B}
.erv-chead.has-vid .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.erv-chead.has-vid .in{padding:26px 26px 22px}
/* ya es un <video> nuestro, no un iframe: llena la banda recortando por el centro */
.erv-chead .vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;
  pointer-events:none;opacity:0;transition:opacity .5s}
.erv-chead .vid.on{opacity:1}
/* Velo NEGRO y suave (Christian, 2026-09-10: «quítale el difuminado blanco por uno negro
   pero que no tape tanto»). Al oscurecerse el fondo, el título y las migas pasan a claro. */
.erv-chead.has-vid .veil{position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(10,11,7,.66) 0%,rgba(10,11,7,.40) 45%,rgba(10,11,7,.08) 100%)}
.erv-chead.has-vid .erv-h1{color:#F5F3EB;text-shadow:0 2px 18px rgba(0,0,0,.45)}
.erv-chead.has-vid .erv-kick,.erv-chead.has-vid .erv-kick a{color:#CFCBBA;text-shadow:0 1px 10px rgba(0,0,0,.5)}
.erv-chead.has-vid .erv-kick a:hover{color:#5FBE2B}
@media (max-width:768px){
  .erv-chead.has-vid{min-height:200px}
  .erv-chead .vid{display:none}
}


/* ============ v17 (2026-09-10) · la cantidad "1" y sus flechas ============
   Christian: "arreglame ese 1 que se fue a abajo". TouchSpin envuelve el input
   en un .bootstrap-touchspin y anade .input-group-btn-vertical con las dos
   flechas; con display por defecto se colocaban en la linea de abajo. */
/* La causa real: el envoltorio lleva la clase .input-group de Bootstrap
   (display:flex; flex-wrap:wrap; width:100%) y las flechas saltaban de linea. */
.erv-pd .product-quantity .qty{display:flex;align-items:stretch;flex:none}
.erv-pd .qty .bootstrap-touchspin{display:flex!important;flex-wrap:nowrap!important;align-items:stretch;
  width:auto!important;float:none;margin:0;position:relative}
.erv-pd .qty .bootstrap-touchspin .input-group-addon:empty{display:none!important}
.erv-pd .qty .bootstrap-touchspin #quantity_wanted{width:62px;flex:none;height:auto;min-height:0;margin:0;
  border-right:0;align-self:stretch}
.erv-pd .qty .input-group-btn-vertical{display:flex!important;flex-direction:column;width:34px;flex:none;
  position:static!important;white-space:normal;vertical-align:top}
.erv-pd .qty .input-group-btn-vertical>.btn{flex:1 1 50%;width:34px;min-width:34px;height:auto;min-height:0;
  padding:0;margin:0;display:flex;align-items:center;justify-content:center;position:static!important;float:none;
  border:1px solid var(--e-line)!important;background:var(--e-white)!important;color:var(--e-ink)!important;
  border-radius:0!important;box-shadow:none}
.erv-pd .qty .input-group-btn-vertical>.btn:first-child{border-bottom:0!important}
.erv-pd .qty .input-group-btn-vertical>.btn>i{position:static!important;top:auto;left:auto;font-size:15px;line-height:1}
.erv-pd .qty .input-group-btn-vertical>.btn:hover{background:var(--e-band)!important;color:var(--e-green)!important}
/* el alto lo marca la caja entera (input + flechas), no el input suelto */
.erv-pd .product-quantity .qty,.erv-pd .qty .bootstrap-touchspin{min-height:54px}
@media (max-width:768px){
  .erv-pd .product-quantity .qty,.erv-pd .qty .bootstrap-touchspin{min-height:50px}
  .erv-pd .qty .bootstrap-touchspin #quantity_wanted{width:56px;height:auto}
  .erv-pd .qty .input-group-btn-vertical,.erv-pd .qty .input-group-btn-vertical>.btn{width:32px;min-width:32px}
}


/* ============ v18 (2026-09-10) · barra de orden de los listados ============
   Christian: "el filtro este esta mal lo de las letras". Los enlaces no tenian
   fijado el color en todos sus estados y en algunos navegadores salian con los
   colores por defecto (azul sin visitar / morado visitado). Se fija a mano. */
.erv-sort a,.erv-sort a:link,.erv-sort a:visited,.erv-sort a:active{
  color:var(--e-ink)!important;text-decoration:none!important}
.erv-sort a:hover{color:var(--e-deep)!important;background:var(--e-band)}
.erv-sort a.on,.erv-sort a.on:link,.erv-sort a.on:visited{color:#fff!important;background:var(--e-green)}

/* ---- Version de la moto en la tarjeta del listado (Emprasanar, 11/09/2026) ----
   "No veo que tenemos dos nº 1 (una por la normal y otra por la Racing). Eso se tiene que
   ver facilmente ANTES de entrar al articulo." La version va en el nombre, pero ahi se lee
   poco: esta etiqueta la pone delante de los ojos. */
.erv-card .erv-ver{display:inline-block;margin:0 0 6px;font-family:var(--e-mono,'IBM Plex Mono',monospace);
  font-size:10px;font-weight:600;letter-spacing:.1em;padding:2px 7px;border:1px solid;line-height:1.5}
.erv-card .erv-ver.race{color:#B4460E;border-color:#B4460E;background:rgba(180,70,14,.06)}
.erv-card .erv-ver.xpro{color:#2C6E0F;border-color:#2C6E0F;background:rgba(44,110,15,.06)}
/* 29/09 · cartel "Solo X-Pro / Solo 250…" de las posiciones con varias versiones: rojo lleno, que se vea sin buscarlo */
.erv-card .erv-ver.solo{color:#fff;border-color:#C8102E;background:#C8102E;font-size:11px;font-weight:700;text-transform:uppercase}
/* 30/09 · un color por versión, para distinguirlas de un vistazo */
.erv-card .erv-ver.solo.m-xpro{background:#2C6E0F;border-color:#2C6E0F}
.erv-card .erv-ver.solo.m-race{background:#C8102E;border-color:#C8102E}
.erv-card .erv-ver.solo.m-racing{background:#E06A00;border-color:#E06A00}
.erv-card .erv-ver.solo.m-factory{background:#1A1A1A;border-color:#1A1A1A}
.erv-card .erv-ver.solo.m-motard{background:#6A1B9A;border-color:#6A1B9A}
.erv-card .erv-ver.solo.m-xtrainer{background:#0B5CAD;border-color:#0B5CAD}
.erv-card .erv-ver.solo.m-cc{background:#00796B;border-color:#00796B}
/* 29/09 · el Nº del despiece sale del título y va a la descripción corta */
.erv-pos{margin:0 0 6px;font-weight:700}
.erv-antes{margin:0 0 8px;font-size:12px;color:#6b6b6b}
.erv-solo{display:inline-block;margin:0 0 10px;padding:4px 10px;background:#C8102E;color:#fff;font-family:var(--e-mono,'IBM Plex Mono',monospace);
  font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;line-height:1.5}


/* ================= MIGAS DE PAN =================
   Emprasanar 11/09: "que sean migas en vez de así". Sustituyen a la botonera .erv-secnav,
   que decia a donde puedes ir pero no donde estas. El salto entre secciones no se pierde:
   va plegado en "cambiar de seccion", a la derecha de la ruta. */
.erv-migas{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  margin:0 0 18px;padding:9px 12px;background:var(--e-white);border:1px solid var(--e-line)}
.erv-migas ol{display:flex;align-items:center;flex-wrap:wrap;gap:5px 0;list-style:none;margin:0;padding:0;min-width:0}
.erv-migas li{display:flex;align-items:center;min-width:0}
.erv-migas li+li:before{content:"›";margin:0 6px;color:var(--e-olive);opacity:.55;font-size:14px;line-height:1}
/* Christian 11/09: "las migas que parezcan más botones". Cada escalón es una tecla, como lo
   era la botonera de antes; la diferencia es que ahora, en vez de las secciones hermanas
   sueltas, las teclas forman la ruta de dónde estás. */
.erv-migas a,.erv-migas .hoy span{display:block;font-family:var(--e-cond);font-weight:700;
  font-size:13px;letter-spacing:.03em;text-transform:uppercase;padding:6px 11px;
  border:1px solid var(--e-line);background:var(--e-white);color:var(--e-ink);
  white-space:nowrap;max-width:min(40ch,100%);overflow:hidden;text-overflow:ellipsis}
.erv-migas a:hover{border-color:var(--e-green);background:var(--e-band);color:var(--e-deep);text-decoration:none}
/* el ultimo escalon es donde estas: la tecla pulsada */
.erv-migas .hoy span{background:var(--e-deep);border-color:var(--e-deep);color:#fff}
/* en la ficha el ultimo escalon es el nombre del articulo, que es largo de verdad
   ("Nº 2 - PISTON D88-1 - 027021518001"): se le deja mas sitio antes de recortarlo */
.erv-migas.es-ficha .hoy span{max-width:min(52ch,100%)}
.erv-migas .saltar{position:relative;flex:none}
.erv-migas .saltar summary{list-style:none;cursor:pointer;font-family:var(--e-mono);font-size:11px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--e-green);padding:5px 10px;
  border:1px solid var(--e-line);white-space:nowrap;user-select:none}
.erv-migas .saltar summary::-webkit-details-marker{display:none}
.erv-migas .saltar summary:after{content:" ▾"}
.erv-migas .saltar[open] summary{background:var(--e-band);border-color:var(--e-green)}
.erv-migas .saltar[open] summary:after{content:" ▴"}
.erv-migas .saltar .lst{position:absolute;right:0;top:calc(100% + 5px);z-index:60;display:flex;
  flex-direction:column;min-width:250px;max-width:min(420px,86vw);max-height:58vh;overflow:auto;
  background:var(--e-white);border:1px solid var(--e-line);box-shadow:0 12px 30px rgba(20,23,15,.14)}
.erv-migas .saltar .lst a{font-family:var(--e-cond);font-weight:700;font-size:13.5px;letter-spacing:.03em;
  text-transform:uppercase;color:var(--e-ink);padding:9px 13px;border-bottom:1px solid var(--e-line)}
.erv-migas .saltar .lst a:last-child{border-bottom:none}
.erv-migas .saltar .lst a:hover{background:var(--e-band);color:var(--e-deep);text-decoration:none}
.erv-migas .saltar .lst a.on{background:var(--e-deep);color:#fff}
@media (max-width:640px){
  .erv-migas{padding:8px 10px;gap:9px}
  .erv-migas a,.erv-migas .hoy span{font-size:12px;padding:5px 9px;max-width:min(24ch,100%)}
  /* el nombre del articulo, con mas sitio en el ordenador, aqui tambien se recorta */
  .erv-migas.es-ficha .hoy span{max-width:min(28ch,100%)}
  .erv-migas li+li:before{margin:0 4px}
  /* en el movil la ruta larga se lee peor que se usa: se dejan los dos ultimos escalones */
  .erv-migas li:not(.hoy):not(:nth-last-child(2)){display:none}
  /* ...y el separador del primero que queda a la vista, que si no cuelga un "›" suelto */
  .erv-migas li:nth-last-child(2):before{display:none}
  .erv-migas .saltar .lst{left:0;right:auto}
}

/* ================= DE QUE DESPIECE ES CADA RESULTADO =================
   Solo aparece fuera de una categoria (buscador, ofertas, marca): dentro de un despiece
   todos los articulos son de la misma seccion y repetirlo seria ruido. */
.erv-card .erv-donde{display:block;font-family:var(--e-mono);font-size:10.5px;line-height:1.45;
  letter-spacing:.03em;color:var(--e-olive);background:var(--e-paper);border-left:2px solid var(--e-green);
  padding:5px 8px;margin:-1px 0 1px}
.erv-card .erv-donde:hover{color:var(--e-deep);background:var(--e-band);text-decoration:none}

/* en el movil la ruta entera se comia media tarjeta: se deja en tres lineas. Lo que se
   corta es el final (la seccion); el ano y el despiece, que es lo que distingue, van
   delante y se siguen viendo. */
@media (max-width:640px){
  .erv-card .erv-donde{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;
    overflow:hidden;font-size:10px;padding:4px 7px}
}

/* el cartel de "foto no disponible" ya trae su propio fondo blanco: sin multiply, que
   le comia el logo de la marca contra el papel de la tarjeta */
.erv-card .ph img.erv-sinfoto{mix-blend-mode:normal}

/* ================= 16/09 (tarde) · pedidos de Christian con el diseño ya en producción =================
   1) Móvil: las secciones de una categoría en CARRUSEL (se desliza con el dedo) en vez de rejilla de 2.
   2) PC: la foto de la banda de categoría es la imagen de la categoría (200x200) y se estiraba a todo el
      ancho: salía borrosa. Ahora va a su tamaño, a la derecha, sin estirar. En el móvil se deja como estaba. */
@media (max-width:820px){
  .erv-main,.erv-subgrid{min-width:0;max-width:100%}
  /* 18/09: el carrusel de secciones se quitó (no gusta lo que desliza): vuelve la rejilla de 2 de siempre */
  .erv-subgrid .gr a:hover{transform:none}
}
@media (min-width:821px){
  .erv-chead.has-img .bg{inset:auto;top:50%;right:40px;left:auto;transform:translateY(-50%);
    width:auto;height:auto;max-width:240px;max-height:160px;object-fit:contain;mix-blend-mode:multiply}
  .erv-chead.has-img .veil{display:none}
}
/* sugerencias del buscador (ps_searchbar) con el aspecto de la tienda */
.ui-autocomplete.ui-menu{background:var(--e-white,#fff);border:1px solid var(--e-line,#DDD9C9);box-shadow:0 10px 24px rgba(26,25,16,.12);
  max-height:70vh;overflow-y:auto;padding:0;z-index:9990}
.ui-autocomplete .ui-menu-item a{display:flex;align-items:center;gap:12px;padding:8px 12px;border-bottom:1px solid var(--e-line,#DDD9C9);cursor:pointer}
.ui-autocomplete .ui-menu-item a.ui-state-focus,.ui-autocomplete .ui-menu-item a:hover{background:var(--e-band,#EEEBDD)}
.ui-autocomplete .search_left{flex:0 0 48px;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:#fff}
.ui-autocomplete .search_left img{max-width:48px;max-height:48px;width:auto;height:auto;object-fit:contain}
.ui-autocomplete .search_right{display:flex;flex-direction:column;min-width:0}
.ui-autocomplete .search_brand{font-size:11px;color:var(--e-olive,#7C7868);text-transform:uppercase;letter-spacing:.06em}
.ui-autocomplete .search_name{font-size:13px;font-weight:600;color:var(--e-ink,#1A1910);line-height:1.25}
.ui-autocomplete .search_price{font-size:13px;color:var(--e-green,#4B9E1C);font-weight:700}
.ui-autocomplete .clearfix{display:none}

/* 16/09 · Christian: la banda de categoría con el fondo de cuadrícula de la portada, difuminado (más limpio). */
@media (min-width:821px){
  .erv-chead.has-img{background:var(--e-white,#fff);border:1px solid var(--e-line,#DDD9C9)}
  .erv-chead.has-img::before{content:'';position:absolute;inset:0;pointer-events:none;
    background-image:linear-gradient(rgba(213,215,203,.55) 1px,transparent 1px),linear-gradient(90deg,rgba(213,215,203,.55) 1px,transparent 1px);
    background-size:26px 26px;
    -webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.45) 45%,#000 100%);
    mask-image:linear-gradient(90deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.45) 45%,#000 100%)}
}
/* ================= 17/09 · DESPIECE: la hoja a la izquierda, fija, y las piezas a la derecha =================
   Christian: "tiene que salir el despiece como banner, no una foto, porque así ven el número de su pieza y
   pueden ir a buscarla... ponerla a la izquierda fija y las piezas en modo lista a la derecha, y que pueda
   alternar en lista o filas". */
@media (min-width:1001px){
  .erv-cols.es-despiece{grid-template-columns:minmax(0,44%) minmax(0,1fr);gap:22px}
  .erv-cols.es-despiece .erv-side{position:static;gap:16px;align-self:stretch}
  .erv-cols.es-despiece .erv-lamina{position:sticky;top:12px}
}
@media (max-width:1000px){
  .erv-cols.es-despiece .erv-lamina img{max-height:60vh}
}

/* botón lista / cuadrícula */
.erv-bar .erv-vista{display:flex;gap:0;border:1px solid var(--e-line);background:var(--e-white);margin-left:auto}
.erv-bar .erv-vista button{border:none;background:none;cursor:pointer;padding:7px 12px;
  font-family:var(--e-mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--e-olive)}
.erv-bar .erv-vista button+button{border-left:1px solid var(--e-line)}
.erv-bar .erv-vista button.on{background:var(--e-deep);color:#fff}
.erv-bar .erv-vista button:hover:not(.on){background:var(--e-band);color:var(--e-ink)}

/* ---- vista LISTA: una pieza por fila ---- */
#js-product-list.vista-lista .products,#js-product-list.vista-lista .erv-grid{display:block!important}
#js-product-list.vista-lista .erv-card{display:grid;grid-template-columns:76px minmax(0,1fr) auto;
  align-items:center;gap:14px;padding:8px 12px;margin:0 0 -1px;transform:none!important}
#js-product-list.vista-lista .erv-card .ph{aspect-ratio:auto;width:76px;height:64px;border-bottom:none;
  border-right:1px solid var(--e-line);padding-right:10px}
#js-product-list.vista-lista .erv-card .bd{padding:0;display:grid;grid-template-columns:minmax(0,1fr) auto;
  align-items:center;gap:4px 16px;flex:1}
#js-product-list.vista-lista .erv-card .oem{grid-column:1;margin:0}
#js-product-list.vista-lista .erv-card .nm{grid-column:1;grid-row:2;min-height:0;font-size:14px}
#js-product-list.vista-lista .erv-card .meta,
#js-product-list.vista-lista .erv-card .erv-donde{display:none}
#js-product-list.vista-lista .erv-card .erv-ver{grid-column:1;grid-row:3;justify-self:start}
#js-product-list.vista-lista .erv-card .pr{grid-column:2;grid-row:1/3;justify-content:flex-end;margin:0}
#js-product-list.vista-lista .erv-card .pr .now{font-size:18px}
#js-product-list.vista-lista .erv-card form,
#js-product-list.vista-lista .erv-card .add.alt{grid-column:3;grid-row:1;align-self:center}
#js-product-list.vista-lista .erv-card .add{padding:9px 14px;font-size:13px;white-space:nowrap}
@media (max-width:640px){
  #js-product-list.vista-lista .erv-card{grid-template-columns:60px minmax(0,1fr);gap:10px;padding:8px}
  #js-product-list.vista-lista .erv-card .ph{width:60px;height:56px}
  #js-product-list.vista-lista .erv-card .bd{grid-template-columns:minmax(0,1fr)}
  #js-product-list.vista-lista .erv-card .pr{grid-column:1;grid-row:auto;justify-content:flex-start}
  #js-product-list.vista-lista .erv-card form,
  #js-product-list.vista-lista .erv-card .add.alt{grid-column:1;grid-row:auto}
}

/* el número del plano en la vista de lista (17/09) */
.erv-card .erv-num{display:none}
#js-product-list.vista-lista .erv-card .ph{position:relative}
#js-product-list.vista-lista .erv-card .erv-num{display:flex;align-items:center;justify-content:center;
  position:absolute;inset:0;margin:auto;width:40px;height:40px;border:2px solid var(--e-deep);border-radius:50%;
  background:var(--e-white);color:var(--e-deep);font-family:var(--e-cond);font-weight:800;font-size:19px;
  font-style:italic}
#js-product-list.vista-lista .erv-card .ph img.erv-sinfoto{opacity:0}

/* ============ 17/09 (tarde) · tres cosas que pidió Christian viéndolo ============
   1) "el formato este que hemos puesto es solo para los despieces": el botón Lista/Cuadrícula
      solo aparece dentro de un despiece. En el resto de secciones ni se ve ni se aplica.
   2) "dentro del número veo la imagen y no se ve la foto del artículo": si la pieza lleva
      número, en la lista manda el número y la foto no se pinta detrás del círculo.
   3) "en móvil hay que arreglarlo": la fila era altísima y el texto salía centrado.
   4) "el fondo del banner pon la cuadrícula": la banda de un despiece no tiene foto y quedaba
      lisa; ahora lleva la misma rejilla difuminada de la portada.                            */

/* 1) el botón de vista, solo en los despieces */
.erv-bar .erv-vista{display:none}
.erv-cols.es-despiece .erv-bar .erv-vista{display:flex}

/* 2) el número y la foto, UNO AL LADO DEL OTRO (Christian 17/09: "¿por qué en lista no sale
   imagen? me gustaría que sí, ponla al lado del número"). Antes el círculo se pintaba ENCIMA de
   la foto y se veía la imagen por dentro del número. */
#js-product-list.vista-lista .erv-card .ph.con-num{background:none;display:flex;align-items:center;
  gap:10px;width:auto;height:auto;justify-content:flex-start}
#js-product-list.vista-lista .erv-card .ph.con-num .erv-num{position:static;inset:auto;margin:0;flex:0 0 auto}
#js-product-list.vista-lista .erv-card .ph.con-num img{display:block;width:84px;height:84px;
  object-fit:contain;flex:0 0 auto;mix-blend-mode:normal;background:#fff}
/* 17/09: aquí había un zoom al pasar el ratón, pero la tarjeta lo recortaba ("se amplía mal").
   Quitado: la foto se ve a 84 px y, para verla entera, se entra en la ficha. */
/* las fichas sin foto propia llevan el cartel con el logo de la marca: a 56 px es un sello
   ilegible y en un despiece los lleva casi todo. En la lista se deja el hueco vacío y solo se
   ven las fotos de verdad. */
#js-product-list.vista-lista .erv-card .ph.con-num img.erv-sinfoto{display:none}

/* con la foto al lado del número, la primera columna necesita más sitio */
#js-product-list.vista-lista .erv-card{grid-template-columns:146px minmax(0,1fr) auto}
#js-product-list.vista-lista .erv-card .ph{height:auto;min-height:60px}

/* en la lista, el texto a la izquierda (salía centrado) y el nombre sin repetir la referencia,
   que ya sale ella sola en la línea de arriba */
#js-product-list.vista-lista .erv-card .oem,
#js-product-list.vista-lista .erv-card .nm,
#js-product-list.vista-lista .erv-card .nm a{text-align:left}
.erv-nm-corta{display:none}
#js-product-list.vista-lista .erv-card .erv-nm-larga{display:none}
#js-product-list.vista-lista .erv-card .erv-nm-corta{display:inline}

/* 3) móvil: una fila compacta — número | referencia + nombre, y debajo precio y botón */
@media (max-width:640px){
  #js-product-list.vista-lista .erv-card{grid-template-columns:104px minmax(0,1fr);gap:9px;
    padding:9px 10px;align-items:center;text-align:left}
  #js-product-list.vista-lista .erv-card .ph{width:104px;height:auto;min-height:46px;padding-right:0;border-right:none}
  #js-product-list.vista-lista .erv-card .ph.con-num{gap:7px}
  #js-product-list.vista-lista .erv-card .ph.con-num img{width:60px;height:60px}
  #js-product-list.vista-lista .erv-card .erv-num{width:34px;height:34px;font-size:16px;border-width:2px}
  #js-product-list.vista-lista .erv-card .bd{grid-template-columns:minmax(0,1fr) auto;
    align-items:center;gap:2px 10px;text-align:left}
  #js-product-list.vista-lista .erv-card .oem{grid-column:1;grid-row:1;font-size:10px;text-align:left}
  #js-product-list.vista-lista .erv-card .nm{grid-column:1;grid-row:2;font-size:13px;line-height:1.25;text-align:left}
  #js-product-list.vista-lista .erv-card .nm a{text-align:left}
  #js-product-list.vista-lista .erv-card .erv-ver{grid-column:1;grid-row:3}
  #js-product-list.vista-lista .erv-card .pr{grid-column:1;grid-row:4;justify-content:flex-start;margin:2px 0 0}
  #js-product-list.vista-lista .erv-card .pr .now{font-size:16px}
  #js-product-list.vista-lista .erv-card form,
  #js-product-list.vista-lista .erv-card .add.alt{grid-column:2;grid-row:4;justify-self:end;align-self:center}
  #js-product-list.vista-lista .erv-card .add{padding:8px 12px;font-size:11px;letter-spacing:.04em}
  /* la barra de arriba, en dos líneas ordenadas en vez de apretada */
  .erv-cols.es-despiece .erv-bar .erv-vista{margin-left:0}
}

/* 5) Christian: "eso que se desplaza por detrás de la imagen hay que arreglarlo". La hoja se
   quedaba fija ella sola y los bloques de debajo (Ofertas, Zonas, filtros) le subían por detrás.
   Ahora se queda fija la COLUMNA ENTERA: no hay nada que pueda pasar por detrás. Si el conjunto
   no cabe en la pantalla, la columna se desplaza por dentro, sin moverse de sitio. */
@media (min-width:1001px){
  .erv-cols.es-despiece .erv-side{position:sticky;top:12px;align-self:start;
    max-height:calc(100vh - 24px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
  .erv-cols.es-despiece .erv-lamina{position:static}
  .erv-cols.es-despiece .erv-lamina img{max-height:calc(100vh - 230px)}
}

/* 4) la banda de categoría sin foto ni vídeo (todos los despieces), con la rejilla difuminada */
.erv-chead:not(.has-vid):not(.has-img){background:var(--e-white,#fff);border:1px solid var(--e-line,#DDD9C9)}
/* las de despiece (.is-lam) ya traen su propio relleno; las demás sin foto, se lo damos */
.erv-chead:not(.has-vid):not(.has-img):not(.is-lam) .in{padding:22px 24px 18px}
.erv-chead:not(.has-vid):not(.has-img)::before{content:'';position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(213,215,203,.55) 1px,transparent 1px),linear-gradient(90deg,rgba(213,215,203,.55) 1px,transparent 1px);
  background-size:26px 26px;
  -webkit-mask-image:linear-gradient(100deg,rgba(0,0,0,.10) 0%,rgba(0,0,0,.45) 50%,#000 100%);
  mask-image:linear-gradient(100deg,rgba(0,0,0,.10) 0%,rgba(0,0,0,.45) 50%,#000 100%)}

/* ============ 17/09 (14:30) · dos cosas más de Christian viendo un despiece en lista ============
   1) "los carteles de nuestra marca con la otra no se ven en la lista": más arriba se escondía el
      cartel «sin foto» en la lista para dejar el hueco vacío. Christian lo quiere ver.
   2) "el descuento tapa el número": el -20% se pintaba en la esquina de la foto, justo encima del
      círculo del número. En la lista pasa a ir DETRÁS de la foto, como una etiqueta más de la fila. */
/* (más arriba hay otra regla que lo deja con opacity:0: también hay que quitarle eso) */
#js-product-list.vista-lista .erv-card .ph.con-num img.erv-sinfoto{display:block;opacity:1}
#js-product-list.vista-lista .erv-card .ph .flag{position:static;top:auto;left:auto;flex:0 0 auto;
  align-self:center;margin-left:2px;padding:3px 6px;font-size:10.5px;white-space:nowrap}
/* hace falta más sitio en la primera columna: número + foto + etiqueta */
#js-product-list.vista-lista .erv-card{grid-template-columns:196px minmax(0,1fr) auto}
@media (max-width:640px){
  /* en móvil no cabe al lado: la etiqueta va pequeña sobre la esquina de la foto, lejos del número */
  #js-product-list.vista-lista .erv-card .ph .flag{position:absolute;top:0;right:0;left:auto;margin:0;
    padding:2px 5px;font-size:9.5px}
  #js-product-list.vista-lista .erv-card{grid-template-columns:104px minmax(0,1fr)}
}

/* 17/09 (14:35) · Christian: "haz las categorías de arriba del todo más grandes". Las tarjetas de
   «Secciones de …» pasan de 210 a 280 px de ancho mínimo, con el nombre más grande. Solo en pantalla
   ancha: en móvil siguen deslizándose en fila (regla de más arriba). */
/* 17/09 (15:30) · Christian: "a los artículos tengo que darle en ciertas zonas para entrar, cuando
   debería ser todo el recuadro". El enlace del nombre se estira por toda la tarjeta (::after) y lo que
   tiene que seguir siendo pulsable por su cuenta (Añadir al carrito, Ver producto) va por encima. */
.erv-card{position:relative}
.erv-card .nm a::after{content:'';position:absolute;inset:0;z-index:1}
.erv-card form,.erv-card .add,.erv-card .add.alt,.erv-card .ph{position:relative;z-index:2}
.erv-card .ph{z-index:0}

@media (min-width:821px){
  .erv-subgrid .gr{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
  .erv-subgrid .nm{font-size:16px;padding:15px 16px}
}

/* 18/09 · Resumen del pedido: foto · nombre / − n + · papelera · precio. La misma rejilla en ordenador y en móvil. */
#cart-summary-product-list .media-list{margin:0;padding:0;list-style:none}
#cart-summary-product-list li.media{display:block;margin:0;padding:12px 0;border-bottom:1px solid #e6e2d6}
.erv-rl{display:grid;grid-template-columns:56px minmax(0,1fr);grid-template-areas:"img nom" "img ctl";column-gap:12px;row-gap:8px;align-items:start}
.erv-rl.ocupado{opacity:.45;pointer-events:none}
.erv-rl-img{grid-area:img;display:block;width:56px;height:56px;border:1px solid #e6e2d6;background:#fff}
.erv-rl-img img{width:100%;height:100%;object-fit:contain;display:block}
.erv-rl-nom{grid-area:nom;font-size:13px;line-height:1.35;color:#16140f;text-decoration:none;overflow-wrap:anywhere}
.erv-rl-ctl{grid-area:ctl;display:flex;align-items:center;gap:10px}
.erv-qty{display:inline-flex;align-items:stretch;border:1px solid #16140f;height:32px}
.erv-qty button{width:32px;border:0;background:#fff;color:#16140f;font-size:18px;line-height:1;cursor:pointer;padding:0}
.erv-qty button:hover{background:#4a9d1c;color:#fff}
.erv-qty button:disabled{color:#c9c5b8;cursor:default;background:#fff}
.erv-qty-n{min-width:34px;display:flex;align-items:center;justify-content:center;font:600 14px 'IBM Plex Mono',monospace;border-left:1px solid #16140f;border-right:1px solid #16140f}
.erv-rl-del{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #e6e2d6;background:#fff;color:#b3261e;cursor:pointer;padding:0}
.erv-rl-del:hover{background:#b3261e;border-color:#b3261e;color:#fff}
.erv-rl-precio{margin-left:auto;font:600 15px 'IBM Plex Mono',monospace;color:#4a9d1c;white-space:nowrap}

/* 18/09 · Casillas y redondeles: el visto era un icono de Material Icons que no se pinta → marca dibujada con CSS. */
.form-group .custom-checkbox,#conditions-to-approve .custom-checkbox{position:relative;display:block}
.form-group .custom-checkbox input[type=checkbox],#conditions-to-approve .custom-checkbox input[type=checkbox]{position:absolute;left:0;top:1px;width:20px;height:20px;margin:0;opacity:0;cursor:pointer;z-index:2}
.form-group .custom-checkbox input[type=checkbox] + span,#conditions-to-approve .custom-checkbox input[type=checkbox] + span{position:relative;display:inline-block;vertical-align:top;width:20px;height:20px;margin:1px 10px 0 0;border:2px solid #16140f;background:#fff;box-sizing:border-box}
.form-group .custom-checkbox input[type=checkbox] + span i,#conditions-to-approve .custom-checkbox input[type=checkbox] + span i{display:none !important}
.form-group .custom-checkbox input[type=checkbox]:checked + span,#conditions-to-approve .custom-checkbox input[type=checkbox]:checked + span{background:#4a9d1c;border-color:#4a9d1c}
.form-group .custom-checkbox input[type=checkbox]:checked + span::after,#conditions-to-approve .custom-checkbox input[type=checkbox]:checked + span::after{content:'';position:absolute;left:5px;top:1px;width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.form-group .custom-checkbox input[type=checkbox]:focus-visible + span,#conditions-to-approve .custom-checkbox input[type=checkbox]:focus-visible + span{outline:2px solid #4a9d1c;outline-offset:2px}
.form-group .custom-checkbox label,#conditions-to-approve .custom-checkbox label{display:inline-block;width:calc(100% - 36px);vertical-align:top;cursor:pointer;margin:0;text-align:left}
.form-group .custom-radio,#conditions-to-approve .custom-radio{position:relative;display:inline-block;width:20px;height:20px;vertical-align:middle;margin-right:6px;border:2px solid #16140f;border-radius:50%;background:#fff;box-sizing:border-box}
.form-group .custom-radio input[type=radio],#conditions-to-approve .custom-radio input[type=radio]{position:absolute;left:-2px;top:-2px;width:20px;height:20px;margin:0;opacity:0;cursor:pointer;z-index:2}
.form-group .custom-radio input[type=radio] + span,#conditions-to-approve .custom-radio input[type=radio] + span{display:none}
.form-group .custom-radio input[type=radio]:checked + span,#conditions-to-approve .custom-radio input[type=radio]:checked + span{display:block;position:absolute;left:3px;top:3px;width:10px;height:10px;border-radius:50%;background:#4a9d1c}

/* 18/09 b · Pedido por pasos bonito: envío y pago en tarjetas (misma rejilla en móvil y ordenador), dirección elegida en verde,
   redondeles y casillas finos. Todo dentro de body#checkout salvo las casillas de formularios (ya acotadas arriba). */
body#checkout .custom-radio{position:relative;display:inline-block;flex:0 0 auto;width:22px;height:22px;margin:0;float:none;
  border:2px solid #8f8a7e;border-radius:50%;background:#fff;box-sizing:border-box;vertical-align:middle}
body#checkout .custom-radio input[type=radio]{position:absolute;inset:-2px;width:22px;height:22px;margin:0;opacity:0;cursor:pointer;z-index:2}
body#checkout .custom-radio input[type=radio] + span{display:none}
body#checkout .custom-radio input[type=radio]:checked + span{display:block;position:absolute;left:3px;top:3px;width:12px;height:12px;border-radius:50%;background:#4a9d1c;margin:0}
body#checkout .custom-radio:has(input:checked){border-color:#4a9d1c}

/* envío */
body#checkout .delivery-options{display:block}
body#checkout .delivery-option{display:grid;grid-template-columns:22px minmax(0,1fr);column-gap:14px;align-items:center;margin:0 0 10px;
  padding:14px 16px;border:1px solid #e6e2d6;background:#fff;cursor:pointer;transition:border-color .15s,background .15s}
body#checkout .delivery-option:hover{border-color:#8f8a7e}
body#checkout .delivery-option:has(input:checked){border:2px solid #4a9d1c;background:#f4f9ef;padding:13px 15px}
body#checkout .delivery-option > [class*=col-]{width:auto;max-width:none;flex:none;float:none;padding:0}
body#checkout .delivery-option label.delivery-option-2{margin:0;cursor:pointer;text-align:left}
body#checkout .delivery-option label > .row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"n p" "d p";gap:2px 14px;align-items:center;margin:0}
body#checkout .delivery-option label > .row > [class*=col-]{width:auto;max-width:none;flex:none;float:none;padding:0;min-width:0}
body#checkout .delivery-option label > .row > :nth-child(1){grid-area:n}
body#checkout .delivery-option label > .row > :nth-child(2){grid-area:d}
body#checkout .delivery-option label > .row > :nth-child(3){grid-area:p;text-align:right}
body#checkout .delivery-option label > .row > :nth-child(1) > .row{display:flex;align-items:center;gap:12px;margin:0}
body#checkout .delivery-option label > .row > :nth-child(1) > .row > [class*=col-]{width:auto;max-width:none;flex:none;float:none;padding:0;min-width:0}
body#checkout .delivery-option .carrier_logo{width:56px !important;flex:0 0 56px !important;height:40px;display:flex;align-items:center;justify-content:center;background:#fff}
body#checkout .delivery-option .carrier_logo img{max-width:56px;max-height:40px;width:auto;height:auto;object-fit:contain}
body#checkout .delivery-option .carrier_name{flex:1 1 auto !important;min-width:0}
body#checkout .delivery-option .carrier-name{display:block;margin:0;font:600 15px/1.25 'IBM Plex Sans',sans-serif;color:#16140f;word-break:normal;overflow-wrap:normal;hyphens:none}
body#checkout .delivery-option .carrier-delay{display:block;font-size:13px;color:#6b665c;padding-left:68px}
body#checkout .delivery-option .carrier-price{font:600 15px 'IBM Plex Mono',monospace;color:#4a9d1c;white-space:nowrap}

/* pago */
body#checkout .payment-options > div{margin:0 0 10px}
body#checkout .payment-option{display:flex !important;align-items:center;gap:14px;margin:0;padding:14px 16px;border:1px solid #e6e2d6;background:#fff;cursor:pointer;transition:border-color .15s,background .15s}
body#checkout .payment-option:hover{border-color:#8f8a7e}
body#checkout .payment-option:has(input:checked){border:2px solid #4a9d1c;background:#f4f9ef;padding:13px 15px}
body#checkout .payment-option label{flex:1 1 auto;display:flex;align-items:center;gap:12px;margin:0;cursor:pointer;text-align:left;font:600 15px/1.3 'IBM Plex Sans',sans-serif;color:#16140f}
body#checkout .payment-option label img{margin-left:auto;max-height:26px;width:auto}
body#checkout .payment-option form.ps-hidden-by-js{display:none}
body#checkout .js-additional-information, body#checkout [id$=-additional-information]{margin:-4px 0 12px;padding:12px 16px;border:1px solid #e6e2d6;border-top:0;background:#fbfaf6;font-size:14px}

/* direcciones */
body#checkout .address-item{border:1px solid #e6e2d6 !important;background:#fff !important;transition:border-color .15s}
body#checkout .address-item.selected{border:2px solid #4a9d1c !important;background:#f4f9ef !important}
body#checkout .address-item header{display:flex;align-items:flex-start;gap:12px}
body#checkout .address-item .address-alias{font:600 15px 'IBM Plex Sans',sans-serif;color:#16140f}
body#checkout .address-item .address{font-size:14px;line-height:1.5;color:#3d3a33}
body#checkout .address-item .address-footer, body#checkout .address-item footer{display:flex;justify-content:flex-end;gap:18px;border-top:1px solid #e6e2d6}
body#checkout .address-item .edit-address, body#checkout .address-item [data-link-action=edit-address]{color:#4a9d1c !important;font-weight:600}
body#checkout .address-item .delete-address, body#checkout .address-item [data-link-action=delete-address]{color:#b3261e !important}
body#checkout .add-address a, body#checkout a[data-link-action=different-invoice-address]{color:#4a9d1c;font-weight:600}

/* casillas más finas (sustituye el borde negro grueso) */
.form-group .custom-checkbox input[type=checkbox] + span,#conditions-to-approve .custom-checkbox input[type=checkbox] + span{border:1.5px solid #8f8a7e;border-radius:3px}
.form-group .custom-checkbox input[type=checkbox]:hover + span,#conditions-to-approve .custom-checkbox input[type=checkbox]:hover + span{border-color:#4a9d1c}
.form-group .custom-checkbox input[type=checkbox]:checked + span,#conditions-to-approve .custom-checkbox input[type=checkbox]:checked + span{border-color:#4a9d1c}
#conditions-to-approve li{list-style:none;margin:6px 0}

/* resumen del carrito: foto de respaldo sin borde feo, separación y precio alineado */
.erv-rl-img img[data-sinfoto]{padding:2px}
#js-checkout-summary .cart-summary-products > p:first-child{margin:0 0 4px;color:#6b665c;font-size:13px}
@media (max-width:640px){
  body#checkout .delivery-option, body#checkout .payment-option{padding:12px}
  body#checkout .delivery-option:has(input:checked), body#checkout .payment-option:has(input:checked){padding:11px}
  body#checkout .delivery-option .carrier_logo{width:44px !important;flex-basis:44px !important}
  body#checkout .delivery-option .carrier_logo img{max-width:44px}
  body#checkout .delivery-option .carrier-delay{padding-left:56px}
  body#checkout .payment-option label img{max-height:20px}
}

/* 18/09 c · Envío en móvil: el clearfix de Bootstrap (::before/::after de .row) ocupaba la 1.ª celda de la rejilla y el tema
   limitaba las columnas al 20 % → el nombre salía letra a letra. */
body#checkout .delivery-option::before, body#checkout .delivery-option::after,
body#checkout .delivery-option .row::before, body#checkout .delivery-option .row::after{content:none !important;display:none !important}
body#checkout .delivery-option [class*=col-]{width:auto !important;max-width:none !important;min-width:0 !important;flex:none !important;float:none !important;padding:0 !important}
body#checkout .delivery-option > .col-sm-1{grid-column:1;grid-row:1;display:flex;align-items:center}
body#checkout .delivery-option > label{grid-column:2;grid-row:1}
body#checkout .delivery-option .carrier_logo{width:56px !important;flex:0 0 56px !important}
body#checkout .delivery-option .carrier_name{flex:1 1 auto !important}
@media (max-width:640px){
  body#checkout .delivery-option .carrier_logo{width:44px !important;flex:0 0 44px !important}
}

/* ================= PÁGINAS DE LA CUENTA (18/09): historial, detalle del pedido, datos, direcciones, vales… =================
   Antes iban pegadas al borde, sin márgenes y con el título pequeño. Mismo ancho y márgenes que «Mi cuenta». */
body#history #wrapper>.container,body#order-detail #wrapper>.container,body#identity #wrapper>.container,
body#addresses #wrapper>.container,body#address #wrapper>.container,body#discount #wrapper>.container,
body#order-follow #wrapper>.container,body#order-slip #wrapper>.container,body#order-return #wrapper>.container{
  max-width:1360px!important;margin:0 auto!important;padding:0 40px!important}
body#history #content-wrapper,body#order-detail #content-wrapper,body#identity #content-wrapper,body#addresses #content-wrapper,
body#address #content-wrapper,body#discount #content-wrapper,body#order-follow #content-wrapper,body#order-slip #content-wrapper,
body#order-return #content-wrapper{padding:4px 0 44px!important}
body#history .breadcrumb,body#order-detail .breadcrumb,body#identity .breadcrumb,body#addresses .breadcrumb,body#address .breadcrumb,
body#discount .breadcrumb,body#order-follow .breadcrumb,body#order-slip .breadcrumb{padding:18px 0 4px!important;background:transparent!important}
/* título como el del resto de la web */
body#history .page-header h1,body#order-detail .page-header h1,body#identity .page-header h1,body#addresses .page-header h1,
body#address .page-header h1,body#discount .page-header h1,body#order-follow .page-header h1,body#order-slip .page-header h1{
  font-family:var(--e-cond)!important;font-weight:800!important;font-style:italic!important;text-transform:uppercase!important;
  font-size:clamp(28px,3.6vw,44px)!important;line-height:.95!important;color:var(--e-deep)!important;margin:14px 0 18px!important;
  padding:0!important;border:0!important;background:none!important}
body#history .page-header,body#order-detail .page-header,body#identity .page-header,body#addresses .page-header{border:0!important;
  background:none!important;padding:0!important;margin:0!important}
/* el contenido, en tarjeta blanca */
body#history #content,body#order-detail #content,body#identity #content,body#address #content,body#discount #content,
body#order-follow #content,body#order-slip #content{background:var(--e-white)!important;border:1px solid var(--e-line)!important;
  border-radius:0!important;box-shadow:none!important;padding:22px 24px!important}
body#history #content h6,body#discount #content h6,body#order-follow #content h6,body#order-slip #content h6{
  font-family:var(--e-sans);font-weight:400;font-size:14px;color:var(--e-olive);margin:0 0 16px}
/* tabla de pedidos */
body#history .table,body#order-detail .table{border:0!important;margin:0!important;font-family:var(--e-sans);font-size:14px}
body#history .table thead th,body#order-detail .table thead th{background:var(--e-band)!important;border:0!important;
  border-bottom:2px solid var(--e-ink)!important;font-family:var(--e-mono);font-weight:500;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--e-olive);padding:11px 12px!important;white-space:nowrap}
body#history .table td,body#history .table tbody th,body#order-detail .table td,body#order-detail .table tbody th{
  border:0!important;border-bottom:1px solid var(--e-line)!important;padding:14px 12px!important;vertical-align:middle!important;
  background:var(--e-white)!important}
body#history .table tbody tr:hover td,body#history .table tbody tr:hover th{background:var(--e-paper)!important}
body#history .table tbody th{font-family:var(--e-mono);font-weight:600;letter-spacing:.04em}
body#history .label-pill,body#order-detail .label-pill{border-radius:0!important;font-family:var(--e-mono);font-size:11px;
  letter-spacing:.05em;padding:5px 9px!important;text-transform:uppercase}
body#history .order-actions a,body#history .table a,body#order-detail #content a{color:var(--e-green)!important;font-weight:600}
body#history .order-actions a{font-family:var(--e-mono);font-size:12px;text-transform:uppercase;letter-spacing:.06em;margin-left:10px}
body#history a[href*="facturas-web"] i,body#order-detail a[href*="facturas-web"] i{font-size:26px;vertical-align:middle}
/* móvil: la lista de pedidos en tarjetas */
body#history .orders .order{background:var(--e-white);border:1px solid var(--e-line);padding:14px 16px;margin-bottom:10px}
body#history .orders .order h3{font-family:var(--e-mono);font-style:normal;font-size:16px;color:var(--e-ink);margin:0 0 4px}
body#history .orders .order .total{font-weight:700}
body#history .orders .order a{color:var(--e-green)!important}
/* detalle del pedido: cajas */
body#order-detail #content .box,body#order-detail #order-infos .box{background:var(--e-white)!important;border:1px solid var(--e-line)!important;
  box-shadow:none!important;padding:16px 18px!important;margin-bottom:14px!important}
body#order-detail #content h3,body#order-detail #content h4{font-family:var(--e-cond);font-style:italic;font-weight:800;
  text-transform:uppercase;color:var(--e-deep);font-size:20px}
body#order-detail #content{background:transparent!important;border:0!important;padding:0!important}
/* pie: «volver a su cuenta · inicio» */
body#history .page-footer,body#order-detail .page-footer,body#identity .page-footer,body#addresses .page-footer,
body#discount .page-footer,body#order-follow .page-footer,body#order-slip .page-footer{margin-top:16px!important}
body#history .page-footer a,body#order-detail .page-footer a,body#identity .page-footer a,body#addresses .page-footer a,
body#discount .page-footer a,body#order-follow .page-footer a,body#order-slip .page-footer a{font-family:var(--e-mono);
  font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--e-green)!important;margin-right:18px}
/* aviso «factura todavía no disponible» (lo enseña la plantilla si ver.php devuelve al historial) */
.erv-aviso-fac{display:flex;gap:14px;align-items:flex-start;background:var(--e-white);border:1px solid var(--e-line);
  border-left:4px solid var(--e-lime);padding:14px 18px;margin:0 0 16px;font-family:var(--e-sans);font-size:14px;color:var(--e-ink)}
.erv-aviso-fac b.t{display:block;font-family:var(--e-cond);font-style:italic;font-weight:800;text-transform:uppercase;font-size:20px;
  color:var(--e-deep);margin-bottom:2px}
.erv-aviso-fac a{color:var(--e-green)!important;font-weight:600}
.erv-aviso-fac .x{margin-left:auto;cursor:pointer;color:var(--e-olive);font-size:20px;line-height:1;background:none;border:0}
/* «¿No te sale la factura? WhatsApp» */
.erv-ayuda-fac{font-family:var(--e-sans);font-size:13px;color:var(--e-olive);margin:14px 0 0}
body#order-detail .erv-ayuda-fac{display:block;margin:4px 0 0 32px}
.erv-ayuda-fac a{color:#128C4B!important;font-weight:600}
@media (max-width:900px){
  body#history #wrapper>.container,body#order-detail #wrapper>.container,body#identity #wrapper>.container,
  body#addresses #wrapper>.container,body#address #wrapper>.container,body#discount #wrapper>.container,
  body#order-follow #wrapper>.container,body#order-slip #wrapper>.container,body#order-return #wrapper>.container{padding:0 16px!important}
  body#history #content,body#identity #content,body#address #content{padding:16px!important}
}

/* ================= GARAJE OCULTO (18/09) y NADA QUE DESLICE EN EL MÓVIL =================
   Christian: «quitemos la sección de mi garaje de momento» y «no le gustan las cosas que deslizan».
   El garaje solo se esconde (no se borra nada: las motos guardadas siguen en el navegador y en la cuenta).
   Para volver a enseñarlo basta con quitar el primer bloque. */
.erv-hd a.lnk[href*="#garaje"],.erv-hd .garage,#erv-garage,
#erv-save,#erv-okmsg,#erv-gar-box,
body#my-account .garaje,body#my-account .side .box.p:has(#erv-garaje-lista){display:none!important}
/* zonas de marca de la portada del móvil: rejilla de 2 en vez de carrusel */
@media (max-width:820px){
  body .erv2 .erv-mob .car{display:grid;grid-template-columns:1fr 1fr;gap:10px;overflow:visible;scroll-snap-type:none;
    margin:0;padding:0}
  body .erv2 .erv-mob .car a{flex:none;min-width:0}
  body .erv2 .erv-mob .car a:last-child:nth-child(odd){grid-column:1/-1}
  body .erv2 .erv-mob .zt span{display:none}
}

/* ================= NO COPIAR LAS FOTOS + CIERRE DEL LISTADO (21/09) =================
   Christian: «la imagen se puede copiar, hay una opción que no deja copiar imágenes» y «¿se puede rellenar ese
   espacio? Da la sensación de que no hay más páginas». */
.erv-pd .gal img,.erv-card .ph img,.erv-lamina img,.erv-subgrid img{
  -webkit-user-select:none;user-select:none;-webkit-user-drag:none;-webkit-touch-callout:none}
/* el hueco de la última fila se rellena con artículos de la SIGUIENTE sección (si la hay) */
.erv-card.erv-otra{position:relative}
.erv-card.erv-otra::before{content:attr(data-seccion);position:absolute;z-index:2;top:0;left:0;right:0;
  background:var(--e-band);border-bottom:1px solid var(--e-line);color:var(--e-olive);font-family:var(--e-mono);
  font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding:5px 8px;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.erv-card.erv-otra>*:first-child{margin-top:24px}
/* banda que cierra el listado */
.erv-finlista{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin:18px 0 0;
  padding:16px 20px;background:var(--e-white);border:1px solid var(--e-line);border-top:3px solid var(--e-green)}
.erv-finlista b{font-family:var(--e-cond);font-style:italic;font-weight:800;text-transform:uppercase;font-size:19px;
  color:var(--e-deep)}
.erv-finlista span{font-family:var(--e-mono);font-size:12px;color:var(--e-olive);letter-spacing:.04em}
.erv-finlista a{margin-left:auto;font-family:var(--e-mono);font-size:12px;color:#128C4B!important;font-weight:600;
  letter-spacing:.04em}
@media (max-width:820px){.erv-finlista a{margin-left:0}}

/* ================= EL HUECO, DE RAÍZ (21/09, sexta vuelta) =================
   Christian: «rellena con las de la página siguiente y réstalas de la siguiente, así no se repiten… ¿por qué es tan
   complicado?». Lo era porque la web enseña 28 artículos por página y la rejilla se hacía sola (salían 5 columnas):
   28 entre 5 no cuadra NUNCA, así que siempre sobraba un trozo de fila y cualquier apaño acababa repitiendo cosas.
   Solución de verdad: que el número de columnas sea SIEMPRE divisor de los artículos por página (ahora 40).
   40 = 5×8 = 4×10 = 2×20. Así no sobra ni falta nada y no hay que traer artículos de ningún otro sitio.
   El único hueco que puede quedar es el de la ÚLTIMA página de una sección, donde ya no hay más artículos. */
#js-product-list .products,.erv-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important}
@media (max-width:1499px){
  #js-product-list .products,.erv-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}
@media (max-width:1100px){                       /* el panel de la izquierda se pliega antes: si no, 4 columnas
                                                    se quedarían demasiado estrechas */
  .erv-cols{grid-template-columns:1fr}
  .erv-side{position:static}
}
@media (max-width:1000px){
  #js-product-list .products,.erv-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
/* al cambiar de página se sube aquí; este margen es para que no lo tape la cabecera fija */
.erv-bar,#js-product-list{scroll-margin-top:110px}

/* 21/09 · Christian: «agrega lo de las páginas arriba también, por si quieren cambiar por ahí».
   Los números de página salen ahora también ENCIMA del listado. Es una copia de los de abajo, hecha
   por JavaScript, así que siempre dicen lo mismo (la página en la que estás incluida). */
.erv-pagtop{display:flex;justify-content:flex-end;margin:0 0 14px}
.erv-pagtop .erv-pag{margin:0!important;padding:0!important;border:0!important;background:none!important}
@media (max-width:1000px){.erv-pagtop{justify-content:center}}

/* 21/09 · el botón «Cuadrícula / Lista» estuvo un rato en todos los listados y Christian prefirió dejarlo como
   estaba: solo dentro de los despieces. Por eso aquí no se toca nada; manda la regla del 17/09. */

/* 23/09 · Páginas CMS (aviso de garantía legal de la UE) y aviso en ficha y carrito */
body#cms #main > .page-header{max-width:1000px;margin:0 auto;padding:8px 16px 0}
body#cms .breadcrumb{max-width:1000px;margin:0 auto!important;padding-left:16px!important;padding-right:16px!important}
body#cms #main > .page-header h1{font-family:var(--e-cond)!important;font-weight:800!important;font-style:italic!important;
  text-transform:uppercase!important;font-size:clamp(28px,3.6vw,44px)!important;line-height:.95!important;
  color:var(--e-deep)!important;margin:10px 0 6px!important;padding:0!important;border:0!important;background:none!important}
body#cms .page-cms img{max-width:min(100%,820px)!important;width:auto;height:auto!important;display:block}
body#cms .page-cms{overflow-x:hidden}
.erv-garantia{display:block;margin:14px 0 0;padding:10px 12px;border:1px solid #DDD9C9;background:#fff;
  text-decoration:none;color:#1f3d2b;font-size:14px;line-height:1.35}
.erv-garantia b{display:block;font-weight:700}
.erv-garantia span{display:block;color:#6b6f5d;font-size:12.5px;margin-top:2px}
.erv-garantia:hover{border-color:#128C4B;color:#128C4B}

/* ============ 28/09/2026 · VISTA LISTA: las filas SIN número de plano, iguales que las de AJP ============
   Christian: el modelo es la fila CON número (AJP, «Rueda trasera AJP PR7»): círculo | foto 84×84 | cartel al lado.
   Las filas sin número (.ph SIN la clase con-num) salían en una casilla de 76 px con la foto en una rendija y el
   cartel cortado. Aquí copian EXACTAMENTE las reglas de .ph.con-num (17/09) y dejan vacío el sitio del círculo
   (40 px + 10 de separación; en móvil 34 + 7). Todas las reglas llevan :not(.con-num): las filas con número NO
   cambian ni un píxel. Para quitarlo: borrar este bloque (es el último del fichero). */
#js-product-list.vista-lista .erv-card .ph:not(.con-num){background:none;display:flex;align-items:center;
  gap:10px;width:auto;height:auto;justify-content:flex-start;padding-left:50px}
#js-product-list.vista-lista .erv-card .ph:not(.con-num) img{display:block;width:84px;height:84px;
  object-fit:contain;flex:0 0 auto;mix-blend-mode:normal;background:#fff}
#js-product-list.vista-lista .erv-card .ph:not(.con-num) img.erv-sinfoto{display:block;opacity:1}
@media (max-width:640px){
  #js-product-list.vista-lista .erv-card .ph:not(.con-num){gap:7px;padding-left:41px}
  #js-product-list.vista-lista .erv-card .ph:not(.con-num) img{width:60px;height:60px}
}

/* ================= 28/09 desplegable secciones =================
   Christian (captura en el móvil): «arréglame eso». La lista de «Cambiar de sección» salía con cada
   opción a 20 px de alto y el texto cortado por la mitad. Causa: las opciones heredaban la regla de
   las migas (.erv-migas a: nowrap, overflow:hidden, máx. 24ch en móvil) y, al ser la lista un flex en
   columna con alto máximo, el navegador ENCOGÍA cada opción para que cupieran todas sin scroll.
   Aquí cada opción recupera su alto (no encoge, mín. 44 px), parte en dos líneas si es larga, la
   activa se marca sin montarse sobre las demás y la lista hace scroll por dentro.
   En el móvil la lista ocupa todo el ancho de la caja de las migas. */
.erv-migas .saltar summary{padding:7px 12px}
.erv-migas .saltar .lst{min-width:280px;width:max-content;max-width:min(460px,92vw);max-height:min(62vh,540px);
  overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:0}
.erv-migas .saltar .lst a{display:flex;align-items:center;flex:0 0 auto;box-sizing:border-box;min-height:44px;
  width:auto;max-width:none;margin:0;padding:11px 16px;overflow:visible;white-space:normal;text-overflow:clip;
  overflow-wrap:break-word;line-height:1.25;font-size:14px;border:0;border-bottom:1px solid var(--e-line);
  background:var(--e-white);color:var(--e-ink);position:relative}
.erv-migas .saltar .lst a:last-child{border-bottom:0}
.erv-migas .saltar .lst a:hover{background:var(--e-band);color:var(--e-deep);border-color:var(--e-line)}
.erv-migas .saltar .lst a.on,.erv-migas .saltar .lst a.on:hover{background:var(--e-deep);color:#fff;
  box-shadow:inset 5px 0 0 #5FBE2B;padding-left:20px;cursor:default}
@media (max-width:640px){
  .erv-migas{position:relative}
  .erv-migas .saltar{position:static}
  .erv-migas .saltar .lst{left:-1px;right:-1px;top:calc(100% + 4px);width:auto;min-width:0;max-width:none;max-height:60vh}
  .erv-migas .saltar .lst a{font-size:14.5px;min-height:46px;padding:12px 16px}
  .erv-migas .saltar .lst a.on{padding-left:20px}
}
/* ================= fin 28/09 desplegable secciones ================= */

/* ================= 28/09 recaptcha oculto =================
   Christian: el recuadro flotante «protección de reCAPTCHA» (abajo a la derecha) se montaba con el
   botón de WhatsApp. Lo pone el módulo de reCAPTCHA v3 (ets_recaptcha_free: contacto, registro,
   login y el registro de /pedido). Se oculta como PERMITE Google (FAQ «I'd like to hide the reCAPTCHA
   badge»): visibility:hidden, NUNCA display:none (rompe el reCAPTCHA), y a cambio se enseña el
   texto obligatorio en el formulario (.erv-recaptcha-aviso: override del tema
   modules/ets_recaptcha_free/views/templates/hook/captcha.tpl y, en /pedido, enduro-checkout.js).
   La protección sigue igual. Para quitarlo: borrar este bloque (es el último del fichero). */
.grecaptcha-badge{visibility:hidden !important}
.erv-recaptcha-aviso{display:block;margin:6px 0 0;font-size:11.5px;line-height:1.45;color:#6b6b6b;
  font-weight:400;text-align:left;letter-spacing:0;text-transform:none}
.erv-recaptcha-aviso a{color:inherit;text-decoration:underline}
.erv-recaptcha-aviso a:hover{color:#2C6E0F}
#ec-recaptcha.erv-recaptcha-aviso{margin:10px 0 0;text-align:center;clear:both}
/* en /pedido el aviso va una sola vez, bajo el botón de comprar: el del formulario de registro sobra
   (es un <span> nuestro, del override; no es un elemento del módulo) */
#onepagecheckoutps .pa-captcha-inf .erv-recaptcha-aviso{display:none}
/* ================= fin 28/09 recaptcha oculto ================= */

/* 29/09/2026 logo Leatt: su guia de marca pide minimo 161 px de ancho en web (antes 120 px, estirado) */
#product .product-manufacturer img.manufacturer-logo[alt="Leatt"]{height:auto!important;width:200px!important;max-width:100%!important}

/* 29/09/2026 detalles del producto: referencia + logo de marca */
.erv-pd #product-details.tab-pane{display:flex!important;flex-wrap:wrap;align-items:stretch;column-gap:48px;row-gap:16px}
.erv-pd #product-details .product-reference,.erv-pd #product-details .product-manufacturer{display:flex!important;flex-direction:column;margin:0}
.erv-pd #product-details .product-reference span[itemprop="sku"]{flex:1;display:flex;align-items:center;font-size:17px;font-weight:600;letter-spacing:.02em}
.erv-pd #product-details .product-manufacturer a{flex:1;display:flex;align-items:center}
.erv-pd #product-details .product-manufacturer img.manufacturer-logo{width:auto!important;height:auto!important;max-width:200px!important;max-height:90px!important}
#product .product-manufacturer img.manufacturer-logo[alt="Leatt"]{max-height:none!important}
/* 30/09 referencias especificas (data-sheet limpio) */
.erv-pd .product-features>dl.data-sheet{display:grid;grid-template-columns:minmax(120px,260px) minmax(0,1fr);gap:0;
  background:none;border:1px solid var(--e-line);border-bottom:0;margin:0;max-width:900px}
.erv-pd .product-features>dl.data-sheet dt.name,.erv-pd .product-features>dl.data-sheet dd.value{margin:0;min-height:0;
  padding:10px 14px;border-bottom:1px solid var(--e-line);word-break:break-word}
.erv-pd .product-features>dl.data-sheet dt.name,.erv-pd .product-features>dl.data-sheet dt.name:nth-of-type(2n){
  background:var(--e-band);font-family:var(--e-mono);font-size:11.5px;color:var(--e-olive);text-transform:uppercase;
  letter-spacing:.08em;font-weight:400;border-right:1px solid var(--e-line)}
.erv-pd .product-features>dl.data-sheet dd.value,.erv-pd .product-features>dl.data-sheet dd.value:nth-of-type(2n){
  background:var(--e-white);font-size:14px;color:var(--e-ink);width:auto!important;max-width:none!important;
  flex:none!important;float:none!important;text-align:left!important;white-space:nowrap;word-break:normal}
.erv-pd .product-features>dl.data-sheet dt.name{width:auto!important;max-width:none!important;flex:none!important;float:none!important}
/* fin 30/09 referencias especificas */

/* ================= 02/10 · subida de AJP (ajp-fichas-20260930\subida-pro-20261002\p12_tema_pro.py) ================= */
/* 30/09 · cartel «Vale para» de las piezas AJP que salen en varios despieces */
.erv-compat{margin:4px 0 12px;padding:8px 12px;border-left:4px solid #2f6b1f;background:#eef4e8;color:#1f3d14;font-weight:600;font-size:14px;line-height:1.5}

/* 01/10 · Beta igual que AJP (Christian: «así mejor»): cartel de versión en blanco, borde y texto del color de la versión, sombra suave */
.erv-card .erv-ver.solo{background:#fff;color:#C8102E;border:1.5px solid #C8102E;box-shadow:0 1px 6px rgba(200,16,46,.35)}
.erv-card .erv-ver.solo.m-xpro{background:#fff;color:#2C6E0F;border:1.5px solid #2C6E0F;box-shadow:0 1px 6px rgba(44,110,15,.35)}
.erv-card .erv-ver.solo.m-race{background:#fff;color:#C8102E;border:1.5px solid #C8102E;box-shadow:0 1px 6px rgba(200,16,46,.35)}
.erv-card .erv-ver.solo.m-racing{background:#fff;color:#E06A00;border:1.5px solid #E06A00;box-shadow:0 1px 6px rgba(224,106,0,.35)}
.erv-card .erv-ver.solo.m-factory{background:#fff;color:#1A1A1A;border:1.5px solid #1A1A1A;box-shadow:0 1px 6px rgba(26,26,26,.35)}
.erv-card .erv-ver.solo.m-motard{background:#fff;color:#6A1B9A;border:1.5px solid #6A1B9A;box-shadow:0 1px 6px rgba(106,27,154,.35)}
.erv-card .erv-ver.solo.m-xtrainer{background:#fff;color:#0B5CAD;border:1.5px solid #0B5CAD;box-shadow:0 1px 6px rgba(11,92,173,.35)}
.erv-card .erv-ver.solo.m-cc{background:#fff;color:#00796B;border:1.5px solid #00796B;box-shadow:0 1px 6px rgba(0,121,107,.35)}

/* 01/10 · AJP: un color por cilindrada en los carteles de versión (125/250 azul, 150/280 morado, 200/310 naranja, 240/510 rojo, varias gris) */
.erv-card .erv-ver.solo.m-ajp-a{background:#fff;color:#0B5CAD;border:1.5px solid #0B5CAD;box-shadow:0 1px 6px rgba(11,92,173,.35)}
.erv-card .erv-ver.solo.m-ajp-b{background:#fff;color:#6A1B9A;border:1.5px solid #6A1B9A;box-shadow:0 1px 6px rgba(106,27,154,.35)}
.erv-card .erv-ver.solo.m-ajp-c{background:#fff;color:#E06A00;border:1.5px solid #E06A00;box-shadow:0 1px 6px rgba(224,106,0,.35)}
.erv-card .erv-ver.solo.m-ajp-d{background:#fff;color:#C8102E;border:1.5px solid #C8102E;box-shadow:0 1px 6px rgba(200,16,46,.35)}
.erv-card .erv-ver.solo.m-ajp-varias{background:#fff;color:#455A64;border:1.5px solid #455A64;box-shadow:0 1px 6px rgba(69,90,100,.35)}

/* 01/10 · dentro de la ficha no sale el cartel de versión cuando ya sale el «Vale para» (Christian: «si entras ya sale para las que valen»).
   En producción solo lo llevan las de AJP; las de Beta, sin «Vale para», siguen enseñando el cartel. */
.erv-solo:has(~ .erv-compat){display:none}
/* ================= fin 02/10 · subida de AJP ================= */

/* 13/10 · carteles por año (adhesivos AJP PR7): 2020 azul, 2021-2022 morado, 2023 naranja, 2024 rojo, 35 años verde, Gold Edition dorado, varios años gris */
.erv-card .erv-ver.solo.m-ano-a{background:#fff;color:#0B5CAD;border:1.5px solid #0B5CAD;box-shadow:0 1px 6px rgba(11,92,173,.35)}
.erv-card .erv-ver.solo.m-ano-b{background:#fff;color:#6A1B9A;border:1.5px solid #6A1B9A;box-shadow:0 1px 6px rgba(106,27,154,.35)}
.erv-card .erv-ver.solo.m-ano-c{background:#fff;color:#E06A00;border:1.5px solid #E06A00;box-shadow:0 1px 6px rgba(224,106,0,.35)}
.erv-card .erv-ver.solo.m-ano-d{background:#fff;color:#C8102E;border:1.5px solid #C8102E;box-shadow:0 1px 6px rgba(200,16,46,.35)}
.erv-card .erv-ver.solo.m-ano-35{background:#fff;color:#2C6E0F;border:1.5px solid #2C6E0F;box-shadow:0 1px 6px rgba(44,110,15,.35)}
.erv-card .erv-ver.solo.m-ano-gold{background:#fff;color:#9A7400;border:1.5px solid #B8860B;box-shadow:0 1px 6px rgba(184,134,11,.45)}
.erv-card .erv-ver.solo.m-ano-varios{background:#fff;color:#455A64;border:1.5px solid #455A64;box-shadow:0 1px 6px rgba(69,90,100,.35)}

/* 20/10/2026 · Descripciones con tablas mal hechas o pegadas de otras webs (BS Battery, Mitas, KMC...).
   Christian: "en descripcion hay tablas que estan mal hechas". Se arregla aquí para todas a la vez,
   sin tocar el texto de las fichas: nada de alturas fijas ni cajas a altura 0 (la tabla se salía y se
   pintaba encima de "Detalles del producto"), nada más ancho que la columna, y fuera los buscadores y
   botones que venían pegados de la web de origen y aquí no hacen nada. */
.erv-pd .desc{overflow-wrap:break-word}
.erv-pd .desc *{max-width:100%!important;box-sizing:border-box}
.erv-pd .desc div,.erv-pd .desc p,.erv-pd .desc section,.erv-pd .desc table,.erv-pd .desc tr,.erv-pd .desc td,.erv-pd .desc th{height:auto!important;max-height:none!important;min-height:0!important}
.erv-pd .desc [style*="position"]{position:static!important}
.erv-pd .desc table{width:auto!important;border-collapse:collapse!important;margin:12px 0 18px!important;font-size:13px;line-height:1.4;border:1px solid #ddd8c8!important;background:#fff}
.erv-pd .desc td,.erv-pd .desc th{width:auto!important;padding:7px 10px!important;border:1px solid #e7e3d6!important;vertical-align:top;text-align:left}
.erv-pd .desc th,.erv-pd .desc thead td{background:#f3f1ea!important;font-weight:600;color:#2b2a24}
.erv-pd .desc tr:nth-child(even) td{background:#faf9f5}
.erv-pd .desc td h1,.erv-pd .desc td h2,.erv-pd .desc td h3,.erv-pd .desc td h4{margin:0;font-size:14px}
.erv-pd .desc input,.erv-pd .desc button,.erv-pd .desc select,.erv-pd .desc textarea,.erv-pd .desc .pagination,.erv-pd .desc .search-wrapper,.erv-pd .desc #placeholder{display:none!important}
@media (max-width:767px){
  .erv-pd .desc table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;font-size:12px}
  .erv-pd .desc td,.erv-pd .desc th{padding:6px 8px!important}
}