
      /* ============ DEPARTAMENTOS EN MOSAICO DE COLOR ============ */
      .er_deps { display:grid; grid-template-columns:repeat(4,1fr); gap:1.1rem; }

      .er_deps .er_dep_t {
        display:flex; flex-direction:column; align-items:center;
        aspect-ratio:1/1.06; padding:7% 7% 6%;
        background:#f3f0fa; border:0; border-radius:20px;
        text-decoration:none; overflow:hidden; position:relative;
        transition:transform .18s ease, box-shadow .18s ease; }
      .er_deps .er_dep_t:hover {
        transform:translateY(-4px); box-shadow:0 14px 30px rgba(30,10,70,.18); }

      /* el circulo de color detras del producto */
      .er_deps .er_dep_img {
        width:74%; height:auto; aspect-ratio:1/1; flex:0 0 auto;
        border-radius:50%; overflow:visible; position:relative;
        display:block; margin:0 0 auto;
        transition:transform .18s ease; }
      .er_deps .er_dep_t:hover .er_dep_img { transform:scale(1.05); }

      /* el producto sobresale del circulo, como en la referencia */
      /* el producto se apoya en el borde bajo del circulo y sobresale por arriba */
      .er_deps .er_dep_img img {
        position:absolute; left:-13%; bottom:-4%; top:auto;
        width:126%; height:126%; padding:0;
        object-fit:contain; object-position:center bottom;
        filter:drop-shadow(0 10px 16px rgba(20,6,50,.26)); }

      .er_deps .er_dep_tx {
        display:flex; flex-direction:column; align-items:center;
        text-align:center; width:100%; margin-top:6%; }
      .er_deps .er_dep_tx b {
        font-size:.82rem; font-weight:800; line-height:1.15;
        letter-spacing:.005em; text-transform:uppercase; margin:0; }
      .er_deps .er_dep_tx i {
        font-style:normal; font-size:.68rem; font-weight:600; opacity:.62;
        margin-top:.22rem; font-variant-numeric:tabular-nums; }

      .er_deps .er_dep_t:nth-child(1) .er_dep_img {
        background:#12A8A22E !important; }
      .er_deps .er_dep_t:nth-child(1) .er_dep_tx b,
      .er_deps .er_dep_t:nth-child(1) .er_dep_tx i { color:#04595A; }
      .er_deps .er_dep_t:nth-child(2) .er_dep_img {
        background:#6D4AEA2E !important; }
      .er_deps .er_dep_t:nth-child(2) .er_dep_tx b,
      .er_deps .er_dep_t:nth-child(2) .er_dep_tx i { color:#371A94; }
      .er_deps .er_dep_t:nth-child(3) .er_dep_img {
        background:#1FA9E02E !important; }
      .er_deps .er_dep_t:nth-child(3) .er_dep_tx b,
      .er_deps .er_dep_t:nth-child(3) .er_dep_tx i { color:#0C5B7A; }
      .er_deps .er_dep_t:nth-child(4) .er_dep_img {
        background:#FF7A522E !important; }
      .er_deps .er_dep_t:nth-child(4) .er_dep_tx b,
      .er_deps .er_dep_t:nth-child(4) .er_dep_tx i { color:#A33A1E; }
      .er_deps .er_dep_t:nth-child(5) .er_dep_img {
        background:#E8467C2E !important; }
      .er_deps .er_dep_t:nth-child(5) .er_dep_tx b,
      .er_deps .er_dep_t:nth-child(5) .er_dep_tx i { color:#971B43; }
      .er_deps .er_dep_t:nth-child(6) .er_dep_img {
        background:#2FB4632E !important; }
      .er_deps .er_dep_t:nth-child(6) .er_dep_tx b,
      .er_deps .er_dep_t:nth-child(6) .er_dep_tx i { color:#146B36; }
      .er_deps .er_dep_t:nth-child(7) .er_dep_img {
        background:#A45CF52E !important; }
      .er_deps .er_dep_t:nth-child(7) .er_dep_tx b,
      .er_deps .er_dep_t:nth-child(7) .er_dep_tx i { color:#6A1FAE; }
      .er_deps .er_dep_t:nth-child(8) .er_dep_img {
        background:#5B7CF02E !important; }
      .er_deps .er_dep_t:nth-child(8) .er_dep_tx b,
      .er_deps .er_dep_t:nth-child(8) .er_dep_tx i { color:#2A3E9C; }

      @media (max-width: 1199.98px) {
        .er_deps { grid-template-columns:repeat(3,1fr); gap:.9rem; }
      }
      @media (max-width: 767.98px) {
        .er_deps { grid-template-columns:1fr 1fr; gap:.7rem; }
        .er_deps .er_dep_t { border-radius:16px; padding:7% 6% 6%; }
        .er_deps .er_dep_tx b { font-size:.72rem; }
        .er_deps .er_dep_tx i { font-size:.62rem; }
      }
      @media (prefers-reduced-motion: reduce) {
        .er_deps .er_dep_t, .er_deps .er_dep_img { transition:none; }
      }
    

      /* ===== PRODUCTO BAJO COTIZACION: precio visible, venta bloqueada ===== */
      /* Declarativo a proposito: Odoo re-renderiza estos bloques y un
         style.display se pierde; una regla CSS no. */
      body.er-cot #add_to_cart,
      body.er-cot .o_we_buy_now,
      body.er-cot .css_quantity,
      body.er-cot .er_mayoreo,
      body.er-cot #product_option_block .js_add_cart_json { display:none !important; }

      /* 🚨 EN MOVIL NO BASTA CON LO DE ARRIBA. La barra fija de compra la pinta
         otra vista con `#product_detail #add_to_cart { display:flex !important }`
         -- DOS ids. Entre dos !important gana la MAS ESPECIFICA, y
         `body.er-cot #add_to_cart` (1 id + 1 clase) PIERDE: en el telefono
         seguia saliendo "Agregar al carrito" en productos bajo cotizacion, que
         es justo lo que habia que impedir. Con `body.er-cot #product_detail ...`
         se suben a 2 ids + 1 clase y ahora si gana.
         Es la tercera vez que muerde esta misma trampa: ya paso con los botones
         (vista 6949) y con las pastillas de variante. */
      body.er-cot #product_detail #add_to_cart,
      body.er-cot #product_detail .o_we_buy_now,
      body.er-cot #product_detail .css_quantity,
      body.er-cot #product_detail_main #add_to_cart,
      body.er-cot #product_detail_main .o_we_buy_now { display:none !important; }

      .er_cot_caja {
        width:100%; margin-top:.85rem; padding:14px 16px;
        border:1px solid #E4D9F5; border-left:4px solid #6B3FA0;
        border-radius:10px; background:#FBF9FE; }
      .er_cot_tit {
        font-size:.82rem; font-weight:700; letter-spacing:.02em;
        color:#6B3FA0; margin:0 0 .4rem; }
      .er_cot_txt { font-size:.86rem; line-height:1.5; color:#4A4458; margin:0; }
      .er_cot_txt b { color:#2E2A38; }
      .er_cot_precio {
        display:block; margin-top:.5rem; font-size:1.02rem;
        font-weight:750; color:#2E2A38; }
      .er_cot_precio small { font-weight:500; opacity:.7; font-size:.78rem; }

      /* ⚠️ MISMAS MEDIDAS QUE EL RESTO DE BOTONES DEL SITIO.
         Medido en movil, este era el unico que se salia del patron:
             Cotizar por WhatsApp   47px de alto · 15.0px · peso 700
             Agregar al carrito     44px de alto · 13.0px · peso 650
             Precio de mayoreo                    13.1px · peso 650
         Se queda el verde solido porque aqui es la accion PRINCIPAL de la
         ficha (sustituye a "Agregar al carrito"), pero con la tipografia y el
         alto del resto: destaca por color, no por ser mas grande. */
      .er_cot_wa {
        display:flex !important; align-items:center; justify-content:center; gap:.45rem;
        width:100%; margin-top:.6rem; padding:.7rem 1.1rem;
        border:0; border-radius:10px; background:#25D366; color:#fff !important;
        font-size:.82rem; font-weight:650; letter-spacing:.01em;
        line-height:1.4; text-decoration:none !important;
        aspect-ratio:auto !important;   /* Odoo impone 1/1 a los CTA de compra */
        transition:filter .15s ease, box-shadow .15s ease; }
      .er_cot_wa:hover { filter:brightness(.94); box-shadow:0 4px 16px rgba(46,6,104,.18); }

      /* 🚨 EL BOTON "COTIZAR" DE LA CUADRICULA SALIA COMO UN CUADRADO GIGANTE.
         Medido en movil: 96x96 px, frente a los 95x30 del "Agregar al carrito"
         de al lado. La culpa es de un `aspect-ratio: 1/1` que el sitio impone a
         los .btn de la tarjeta -- pensado para los iconos redondos de lista de
         deseos y comparar. Con width auto, ese aspect-ratio estira el alto
         hasta igualar el ancho.
         Se anula el aspect-ratio y se copian las medidas exactas del boton real
         (padding 6.72/12.8 px, letra 11px), que es lo que Miguel pedia: que se
         vea como todo lo demas. */
      #products_grid .oe_product .er_cot_btn_grid,
      .oe_product .er_cot_btn_grid {
        aspect-ratio:auto !important;
        width:auto !important; height:auto !important;
        min-height:0 !important;
        padding:.42rem .8rem !important;
        font-size:.6875rem !important;
        font-weight:650 !important;
        line-height:1.35 !important;
        border-radius:10px !important;
        white-space:nowrap; }
      /* ⚠️ Y HAY QUE MATAR EL ::after. La clase del sitio
         `o_wsale_product_btn_primary` no solo da el estilo: inyecta el texto
         con `::after { content: "Agregar" }`. Al copiarla para heredar las
         medidas se heredo tambien la palabra, y el boton decia
         "Cotizar Agregar" -- las dos cosas a la vez, que es justo lo contrario
         de lo que hace falta en un producto que NO se puede agregar. */
      .er_cot_btn_grid::after,
      .er_cot_btn_grid::before { content:none !important; display:none !important; }

      .er_cot_badge {
        position:absolute; top:8px; left:8px; z-index:5;
        padding:3px 9px; border-radius:999px;
        background:#6B3FA0; color:#fff;
        font-size:.66rem; font-weight:700; letter-spacing:.04em;
        text-transform:uppercase; pointer-events:none; }
      body .er_cot_sin_boton .o_wsale_product_btn,
      body .er_cot_sin_boton [name="website_sale_cart_button"] { display:none !important; }

      @media (max-width: 575.98px) {
        .er_cot_caja { padding:12px 13px; }
        .er_cot_txt { font-size:.82rem; }
      }
      @media (prefers-reduced-motion: reduce) { .er_cot_wa { transition:none; } }
    

      .er-min-msg { color: #B44B00; line-height: 1.25; display: inline-block; }
      .er-min-no [name="o_delivery_method_name"] { opacity: .55; }


/* Banda de entrega -- paleta de marca, superficies planas, sin degradados */
.er-cob-banda{background:#2E0668;color:#fff;font:500 13.5px/1 Inter,system-ui,sans-serif;
  position:relative;z-index:1001}
.er-cob-in{max-width:1265px;margin:0 auto;padding:9px 15px;display:flex;align-items:center;
  gap:12px;flex-wrap:wrap}
.er-cob-abre{display:inline-flex;align-items:center;gap:8px;background:0;border:0;color:#fff;
  font:500 13.5px/1 Inter,system-ui,sans-serif;cursor:pointer;padding:2px 0}
.er-cob-abre:hover{color:#FFD426}
.er-cob-chev{transition:transform .15s}
.er-cob-abre[aria-expanded="true"] .er-cob-chev{transform:rotate(180deg)}
.er-cob-sep{width:1px;height:16px;background:rgba(255,255,255,.28)}
.er-cob-lugar{display:inline-flex;align-items:center;gap:6px;color:#fff;cursor:pointer}
.er-cob-cp b{font-weight:700}
.er-cob-fac{display:inline-flex;align-items:center;gap:6px;color:#fff;
  text-decoration:none;font:500 13.5px/1 Inter,system-ui,sans-serif}
.er-cob-fac:hover{color:#FFD426;text-decoration:none}
.er-cob-dato{color:#FFD426;font-weight:700}
.er-cob-banda svg{flex:none}
/* Panel */
.er-cob-panel{position:absolute;top:calc(100% + 8px);left:15px;z-index:10001;width:380px;
  max-width:calc(100vw - 30px);background:#fff;border-radius:16px;
  box-shadow:0 4px 16px rgba(46,6,104,.18);padding:20px;color:#141018;
  font:400 15px/1.45 Inter,system-ui,sans-serif;text-align:left}
.er-cob-panel[hidden]{display:none}
.er-cob-tit{font:400 17px/1.15 "Archivo Black",Impact,sans-serif;text-transform:uppercase;
  color:#490AA0;margin:0 0 4px}
.er-cob-sub{margin:0 0 14px;font-size:13px;color:#5b5566}
.er-cob-fila{display:flex;gap:8px}
.er-cob-fila input{flex:1;min-width:0;border:1.5px solid #e7e4f0;border-radius:10px;
  padding:11px 12px;font:500 16px/1 Inter,system-ui,sans-serif;color:#141018;background:#fff}
.er-cob-fila input:focus{outline:0;border-color:#490AA0}
.er-cob-fila button{border:0;border-radius:10px;background:#490AA0;color:#fff;padding:0 16px;
  font:600 14px/1 Inter,system-ui,sans-serif;cursor:pointer}
.er-cob-fila button:hover{background:#2E0668}
.er-cob-err{color:#B44B00;font-size:13px;margin:8px 0 0}
.er-cob-otro{display:inline-block;margin-top:10px;background:0;border:0;padding:0;color:#490AA0;
  font:600 12.5px/1 Inter,system-ui,sans-serif;text-decoration:underline;cursor:pointer}
.er-cob-dir{margin-top:10px;display:grid;gap:8px}
.er-cob-dir[hidden]{display:none}
.er-cob-dir textarea{width:100%;box-sizing:border-box;border:1.5px solid #e7e4f0;border-radius:10px;
  padding:10px 12px;font:400 14px/1.35 Inter,system-ui,sans-serif;color:#141018;resize:vertical}
.er-cob-dir textarea:focus{outline:0;border-color:#490AA0}
.er-cob-dir-btn{border:0;border-radius:10px;background:#490AA0;color:#fff;padding:10px 14px;
  font:600 13px/1 Inter,system-ui,sans-serif;cursor:pointer}
.er-cob-dir-btn:hover{background:#2E0668}
.er-cob-dir-btn[disabled]{opacity:.6;cursor:default}
.er-cob-ref{margin:12px 0 0;font-size:12px;color:#5b5566;line-height:1.35}
/* Opciones de entrega -- una por metodo publicado en Odoo */
.er-cob-ops{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.er-cob-op{display:flex;gap:10px;align-items:flex-start;border:1.5px solid #e7e4f0;
  border-radius:12px;padding:11px 12px}
.er-cob-op-ico{color:#490AA0;margin-top:1px}
.er-cob-op-cuerpo{flex:1;min-width:0}
.er-cob-op-tit{display:flex;justify-content:space-between;gap:10px;align-items:baseline;
  font:600 14px/1.2 Inter,system-ui,sans-serif;color:#141018}
.er-cob-op-precio{font-weight:700;color:#490AA0;white-space:nowrap}
.er-cob-op-precio.er-cob-gratis{color:#1B7F3B}
.er-cob-op-det{margin:3px 0 0;font-size:12.5px;color:#5b5566;line-height:1.35}
.er-cob-op-met{margin:3px 0 0;font-size:11.5px;color:#8a8395}
.er-cob-op-si{border-color:#490AA0;background:#f7f4fd}
.er-cob-cta{display:block;margin-top:12px;background:#490AA0;color:#fff;border-radius:10px;
  padding:11px 14px;font:600 14px/1 Inter,system-ui,sans-serif;text-decoration:none;
  text-align:center}
.er-cob-cta:hover{background:#2E0668;color:#fff}
.er-cob-wa{background:#FFD426;color:#490AA0}
.er-cob-wa:hover{background:#FDB913;color:#490AA0}
.er-cob-pie{margin:12px 0 0;font-size:11.5px;color:#8a8395;line-height:1.35}
/* Bloque en la ficha de producto -- mismo dato, en el momento de decidir la compra */
.er-cob-ficha{border:1.5px solid #e7e4f0;border-radius:12px;padding:12px 14px;margin:14px 0;
  font:400 13.5px/1.4 Inter,system-ui,sans-serif;color:#141018;background:#fff}
.er-cob-ficha-enc{display:flex;align-items:center;gap:8px;font-weight:700;color:#490AA0;
  font-size:14px}
.er-cob-ficha-li{display:flex;gap:8px;align-items:baseline;margin-top:7px}
.er-cob-ficha-li b{font-weight:700}
.er-cob-ficha-pt{color:#490AA0;font-weight:700;line-height:1}
.er-cob-ficha-gratis{color:#1B7F3B;font-weight:700}
.er-cob-ficha-cambiar{display:inline-block;margin-top:9px;background:0;border:0;padding:0;
  color:#490AA0;font:600 12.5px/1 Inter,system-ui,sans-serif;text-decoration:underline;
  cursor:pointer}
.er-cob-ficha-cta{display:inline-flex;align-items:center;gap:7px;margin-top:8px;background:#FFD426;
  color:#490AA0;border:0;border-radius:10px;padding:9px 13px;
  font:600 13px/1 Inter,system-ui,sans-serif;cursor:pointer}
.er-cob-ficha-cta:hover{background:#FDB913}
@media(max-width:575px){
  .er-cob-in{padding:8px 12px;gap:8px;font-size:12.5px}
  .er-cob-abre{font-size:12.5px}
  .er-cob-panel{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;max-width:none;
    border-radius:16px 16px 0 0;max-height:85vh;overflow:auto}
}
/* El embudo de pago se queda limpio -- por clase de body, NO por lista de rutas */
body.o_website_sale_checkout .er-cob-banda,
body[class*="o_website_sale_checkout"] .er-cob-banda{display:none!important}


      /* ---------- SUAVIDAD GENERAL ---------- */
      html { scroll-behavior: smooth; }
      body { overflow-x: hidden; }

      .oe_product_image_link { display:block; aspect-ratio: 1 / 1; overflow:hidden; }
      .oe_product_image_img_wrapper { height:100%; }
      .oe_product_image_img { object-fit: contain; opacity:0; animation: elreyFade .35s ease-out forwards; }
      @keyframes elreyFade { to { opacity:1; } }

      #products_grid .oe_product { content-visibility:auto; contain-intrinsic-size: 420px;
        transition: transform .18s ease, box-shadow .18s ease; }
      #products_grid .oe_product:hover { transform: translateY(-3px); box-shadow: 0 6px 18px rgba(0,0,0,.10); }

      /* ---------- TITULO: 2 LINEAS EXACTAS, SIN CORTES A MEDIAS ---------- */
      #products_grid .o_wsale_products_item_title {
        display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
        overflow:hidden; text-overflow:ellipsis;
        line-height:1.3; height:2.6em;      /* altura EXACTA de 2 lineas */
        margin:0 0 .4rem 0; }
      #products_grid .o_wsale_products_item_title a { display:inline; }
      #products_grid .o_wsale_products_item_title span { display:inline; }

      /* La descripcion corta tampoco debe desbordar */
      #products_grid .oe_subdescription {
        display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
        overflow:hidden; line-height:1.25; }

      #products_grid .o_wsale_product_information { display:flex; flex-direction:column; }
      #products_grid .o_wsale_product_information .o_wsale_products_item_actions { margin-top:auto; }

      /* ---------- MOVIL ---------- */
      @media (max-width: 991.98px) {
        body, #wrap { -webkit-overflow-scrolling: touch; }
        input, select, textarea { font-size:16px !important; }
        #products_grid .oe_product a.btn,
        #products_grid .oe_product button,
        .o_wsale_products_main_row .btn { min-height:44px; display:inline-flex;
          align-items:center; justify-content:center; }
        #products_grid .oe_product { contain-intrinsic-size: 300px; }
        #products_grid .oe_product_cart { padding-bottom:.35rem; }
        #products_grid .o_wsale_products_item_title { font-size:.9rem; }
        #wsale_products_attributes_collapse .form-check { padding:.15rem 0; }
      }

      @media (prefers-reduced-motion: reduce) {
        html { scroll-behavior:auto; }
        .oe_product_image_img { animation:none; opacity:1; }
        #products_grid .oe_product { transition:none; }
        #products_grid .oe_product:hover { transform:none; }
      }
    

      /* ================= TARJETA DE PRODUCTO - EL REY ================= */
      /* Paleta de marca: morado #490AA0 / amarillo #FDB913 / tinta #141018 */
      #products_grid {
        --er-morado:#490AA0; --er-morado-osc:#2E0668; --er-amarillo:#FDB913;
        --er-tinta:#141018; --er-texto:#56516b; --er-borde:#e7e4f0; }

      /* --- la tarjeta: sin marco, el producto "flota" sobre el fondo --- */
      #products_grid .oe_product { contain-intrinsic-size: 500px; }
      #products_grid .o_wsale_product_grid_wrapper {
        background:transparent; border:none; border-radius:0;
        padding:0; box-shadow:none !important; }
      #products_grid .oe_product_cart { background:transparent; }

      /* --- imagen --- */
      #products_grid .oe_product_image { padding:0; }
      #products_grid .oe_product_image_link { border-radius:8px; }
      #products_grid .oe_product:hover .oe_product_image_link {
        opacity:.94; transition:opacity .15s ease; }

      /* --- etiqueta (Envio Nacional, Rebaja...) arriba a la izquierda --- */
      #products_grid .o_wsale_badge {
        top:.45rem !important; left:.45rem !important; right:auto !important;
        border-radius:999px !important; padding:.22rem .6rem !important;
        font-size:.67rem !important; font-weight:700 !important;
        letter-spacing:.02em; line-height:1.35; box-shadow:0 1px 4px rgba(0,0,0,.12); }

      /* --- corazon: circulo flotante arriba a la derecha --- */
      #products_grid .o_add_wishlist {
        position:absolute; top:.45rem; right:.45rem; z-index:5;
        width:34px !important; height:34px !important;
        min-width:34px !important; min-height:34px !important;
        max-width:34px !important; max-height:34px !important;
        padding:0 !important; border-radius:50%;
        background:#fff; border:1px solid var(--er-borde);
        color:var(--er-texto); box-shadow:0 1px 5px rgba(29,23,43,.12);
        display:flex; align-items:center; justify-content:center;
        transition:color .15s ease, border-color .15s ease, transform .15s ease; }
      #products_grid .o_add_wishlist:hover {
        color:var(--er-morado); border-color:var(--er-morado); transform:scale(1.08); }
      #products_grid .o_add_wishlist .o_label { display:none !important; }
      #products_grid .o_add_wishlist .fa { margin:0 !important; font-size:.95rem; }

      /* --- comparar: fuera, satura la tarjeta --- */
      #products_grid .o_add_compare { display:none !important; }

      /* --- reordenar: boton sobre la imagen, luego precio, luego nombre --- */
      /* static: el corazon debe anclarse a la tarjeta completa, no a este bloque */
      #products_grid .o_wsale_product_information {
        display:flex; flex-direction:column; padding-top:0;
        position:static !important; }
      #products_grid .o_wsale_product_sub {
        order:-1; display:flex !important; flex-direction:column !important;
        align-items:flex-start !important; justify-content:flex-start !important;
        gap:0 !important; }
      /* static: asi el corazon se ancla a la tarjeta, no al bloque de botones */
      #products_grid .o_wsale_product_btn {
        order:-1; margin-bottom:.5rem; position:static !important;
        display:block !important; }
      /* el boton NUNCA se monta sobre la imagen: algunos productos muestran ahi
         puntos de galeria (mas fotos) y un traslape los tapaba */
      #products_grid .o_wsale_product_btn:has(.o_wsale_product_btn_primary) {
        margin-top:.5rem; }
      #products_grid .o_wsale_product_action_row {
        display:flex !important; justify-content:flex-start !important; }

      /* --- boton Agregar --- */
      #products_grid .o_wsale_product_btn_primary {
        aspect-ratio:auto !important; width:auto !important; height:auto !important;
        min-width:0 !important; min-height:0 !important; flex:0 0 auto !important;
        position:relative; z-index:4;
        background:var(--er-morado); border-color:var(--er-morado); color:#fff;
        border-radius:999px; padding:.42rem 1.1rem !important;
        font-weight:500; font-size:.82rem !important; line-height:1.2;
        text-transform:none !important; letter-spacing:.03em !important;
        box-shadow:0 3px 10px rgba(55,26,148,.30);
        transition:background .15s ease, box-shadow .15s ease, transform .15s ease; }
      #products_grid .o_wsale_product_btn_primary:hover {
        background:var(--er-morado-osc); border-color:var(--er-morado-osc);
        box-shadow:0 5px 14px rgba(55,26,148,.38); transform:translateY(-1px); }
      /* el icono de carrito pasa a ser un + , mas directo */
      #products_grid .o_wsale_product_btn_primary .fa-shopping-cart:before { content:"\f067"; }
      #products_grid .o_wsale_product_btn_primary .o_label { display:none !important; }
      #products_grid .o_wsale_product_btn_primary:after {
        content:"Agregar"; margin-left:.3rem; }

      /* --- precio protagonista --- */
      #products_grid .product_price { order:0; margin:0 0 .2rem 0; }
      #products_grid .product_price .fw-bold,
      #products_grid .product_price .oe_currency_value {
        font-size:1.28rem; font-weight:800; color:var(--er-tinta);
        letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
      #products_grid .product_price del,
      #products_grid .product_price .text-decoration-line-through {
        font-size:.82rem; font-weight:500; color:#9a95a8; margin-left:.35rem;
        letter-spacing:0; }

      /* --- marca, arriba del nombre --- */
      #products_grid .o_wsale_item_brand {
        font-size:.74rem; font-weight:700; color:var(--er-tinta);
        letter-spacing:.03em; text-transform:uppercase;
        line-height:1.25; margin:0 0 .12rem 0;
        white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

      /* --- nombre --- */
      #products_grid .o_wsale_products_item_title {
        font-size:.88rem !important; font-weight:500; color:var(--er-texto);
        line-height:1.32; height:2.64em; margin:0 0 .35rem 0; }
      #products_grid .o_wsale_products_item_title a { color:inherit; }
      #products_grid .oe_product:hover .o_wsale_products_item_title a { color:var(--er-morado); }

      /* --- estrellas discretas --- */
      #products_grid .o_wsale_product_rating_wrapper { font-size:.75rem; margin-top:.1rem; }

      /* --- movil: 2 por fila, todo mas compacto --- */
      @media (max-width: 991.98px) {
        #products_grid .oe_product { contain-intrinsic-size: 360px; }
        #products_grid .product_price .fw-bold,
        #products_grid .product_price .oe_currency_value { font-size:1.1rem; }
        #products_grid .o_wsale_products_item_title { font-size:.82rem !important; }
        #products_grid .o_wsale_product_btn_primary {
          padding:.36rem .85rem; font-size:.76rem; font-weight:500;
          letter-spacing:.025em; min-height:34px; }
        #products_grid .o_add_wishlist {
          width:30px !important; height:30px !important;
          min-width:30px !important; min-height:30px !important;
          max-width:30px !important; max-height:30px !important; }
        #products_grid .o_wsale_product_btn { margin-top:.4rem; }
      }

      @media (prefers-reduced-motion: reduce) {
        #products_grid .o_add_wishlist,
        #products_grid .o_wsale_product_btn_primary { transition:none; }
        #products_grid .o_add_wishlist:hover,
        #products_grid .o_wsale_product_btn_primary:hover { transform:none; }
      }
    

      /* ================= PAGINA DE PRODUCTO - EL REY ================= */
      #product_detail {
        --er-morado:#490AA0; --er-morado-osc:#2E0668; --er-amarillo:#FDB913;
        --er-tinta:#141018; --er-texto:#56516b; --er-borde:#e7e4f0; }

      /* --- fondo suave detras de la foto, para separarla de la pagina --- */
      #product_detail .o_carousel_product_outer {
        background:#faf9fc; border-radius:14px; }
      #product_detail .product_detail_img { padding:1.25rem; }

      /* --- miniaturas a la izquierda: solo en escritorio.
             en movil Odoo las cambia por puntos de posicion (sin foto),
             ahi no se debe forzar tamaño/fondo o se ve un cuadro vacio --- */
      @media (min-width: 992px) {
        #product_detail .o_carousel_product_indicators .carousel-indicators { gap:.5rem; }
        #product_detail .carousel-indicators li {
          width:60px; height:60px; opacity:1; border-radius:10px;
          border:1.5px solid var(--er-borde); overflow:hidden;
          background:#faf9fc; transition:border-color .15s ease, transform .15s ease; }
        #product_detail .carousel-indicators li:hover { transform:translateY(-1px); }
        #product_detail .carousel-indicators li.active { border-color:var(--er-morado); }
        #product_detail .carousel-indicators li img { object-fit:contain; padding:4px; }
      }

      /* --- insignia sobre la imagen: mas discreta, arriba a la izquierda --- */
      #product_detail .o_ribbons.o_wsale_badge {
        border-radius:999px !important; padding:.28rem .7rem !important;
        font-size:.72rem !important; font-weight:700 !important;
        box-shadow:0 1px 4px rgba(0,0,0,.12); }

      /* --- marca, arriba del titulo --- */
      #product_detail .o_wsale_item_brand_pdp {
        display:block; font-size:.95rem; font-weight:600; color:var(--er-morado);
        margin:0 0 .3rem 0; }

      /* --- titulo --- */
      #product_detail h1.h3 {
        font-weight:700; color:var(--er-tinta); text-wrap:balance;
        font-size:1.5rem; line-height:1.3; text-transform:none !important; }

      /* --- estrellas con el amarillo de marca --- */
      #product_detail .o_website_rating_static .fa-star,
      #product_detail .o_website_rating_static .fa-star-half-o { color:var(--er-amarillo); }
      #product_detail .o_website_rating_static .fa-star-o { color:#d8d4e4; }

      /* --- ya se ve la insignia sobre la foto: no repetirla como texto suelto --- */
      #o_wsale_product_details_content .o_product_tags { display:none !important; }

      /* --- precio protagonista --- */
      #product_detail .oe_price {
        font-size:1.9rem !important; font-weight:800; color:var(--er-tinta);
        letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
      #product_detail span[name="product_list_price"] { font-size:1rem !important; }

      /* --- boton principal: mismo lenguaje visual que la tienda --- */
      #product_detail #add_to_cart {
        background:var(--er-morado); border-color:var(--er-morado); color:#fff;
        border-radius:999px; font-weight:600; letter-spacing:.02em;
        text-transform:none !important;
        padding:.7rem 1.5rem; box-shadow:0 4px 14px rgba(55,26,148,.28);
        transition:background .15s ease, box-shadow .15s ease, transform .15s ease; }
      #product_detail #add_to_cart:hover {
        background:var(--er-morado-osc); border-color:var(--er-morado-osc);
        box-shadow:0 6px 18px rgba(55,26,148,.36); transform:translateY(-1px); color:#fff; }

      /* --- boton secundario "Comprar ahora" --- */
      #product_detail .o_we_buy_now {
        border-radius:999px; border-color:var(--er-morado); color:var(--er-morado);
        font-weight:600; letter-spacing:.02em; }
      #product_detail .o_we_buy_now:hover {
        background:var(--er-morado); border-color:var(--er-morado); color:#fff; }

      /* --- selector de cantidad --- */
      #product_detail .css_quantity {
        border-radius:999px !important; border-color:var(--er-borde) !important;
        overflow:hidden; }
      #product_detail .css_quantity .oi { color:var(--er-morado); }

      /* --- recoger en sucursal / entrega: mas compacto y estilizado --- */
      #product_detail owl-component[name*="ClickAndCollect"] .border.rounded {
        padding:.65rem .85rem !important; border-color:var(--er-borde) !important;
        border-radius:10px !important; }
      #product_detail owl-component[name*="ClickAndCollect"] h6 {
        font-size:.82rem; font-weight:600; color:var(--er-tinta);
        margin-bottom:.2rem; display:flex; align-items:center; gap:.35rem; }
      #product_detail owl-component[name*="ClickAndCollect"] .fa {
        font-size:.72rem; width:auto; }
      #product_detail owl-component[name*="ClickAndCollect"] .fa-circle.text-success {
        color:#2fa84f !important; }
      #product_detail owl-component[name*="ClickAndCollect"] .text-muted {
        font-size:.78rem; }
      #product_detail owl-component[name*="ClickAndCollect"] hr {
        margin:.5rem 0; opacity:.5; }

      /* el icono de Entrega queda estatico, solo con el color de marca */
      #product_detail owl-component[name*="ClickAndCollect"] .fa-truck {
        color:var(--er-morado) !important; }

      /* --- comparar / lista de deseos: iconos discretos --- */
      #product_detail .o_add_compare_dyn, #product_detail .o_product_add_to_wishlist_dyn {
        border-radius:999px; border-color:var(--er-borde); color:var(--er-texto); }
      #product_detail .o_add_compare_dyn:hover, #product_detail .o_product_add_to_wishlist_dyn:hover {
        border-color:var(--er-morado); color:var(--er-morado); }

      /* --- pastillas de embalaje (uom) --- */
      #product_detail .o_variant_pills {
        border-radius:999px !important; border-color:var(--er-borde) !important; }
      #product_detail .o_variant_pills.active {
        background-color:var(--er-morado) !important; border-color:var(--er-morado) !important;
        color:#fff !important; }

      /* --- la ficha de compra: caja con borde, como Sam's Club --- */
      #o_wsale_product_details_content {
        border:1px solid var(--er-borde); border-radius:14px;
        padding:1.25rem 1.4rem; background:#fff;
        box-shadow:0 2px 10px rgba(29,23,43,.05); }

      /* --- complementos para tu compra --- */
      .o_wsale_er_accessories h5 { font-weight:700; color:var(--er-tinta); }
      .o_wsale_er_acc_card {
        width:150px; border:1px solid var(--er-borde); border-radius:12px;
        padding:.75rem; background:#fff; transition:box-shadow .15s ease; }
      .o_wsale_er_acc_card:hover { box-shadow:0 4px 14px rgba(29,23,43,.08); }
      .o_wsale_er_acc_img {
        aspect-ratio:1/1; display:flex; align-items:center; justify-content:center;
        background:#faf9fc; border-radius:8px; overflow:hidden; }
      .o_wsale_er_acc_img img { object-fit:contain; width:100%; height:100%; }
      .o_wsale_er_acc_name {
        display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
        overflow:hidden; min-height:2.2em; line-height:1.1; }
      .o_wsale_er_accessories .js_add_suggested_products {
        background:var(--er-morado); border-color:var(--er-morado);
        border-radius:999px; font-weight:500; }

      /* el embalaje junto al precio solo sirve en la barra fija de movil;
         en escritorio el selector de Embalaje ya esta a la vista */
      .o_er_uom_label { display:none; }

      /* --- reseñas --- */
      #o_product_page_reviews .o_product_page_reviews_title h2 {
        font-weight:700; color:var(--er-tinta); }

      /* --- descripcion completa, ahora a todo el ancho debajo --- */
      .o_wsale_er_description {
        border-top:1px solid var(--er-borde); padding-top:1.75rem; }
      .o_wsale_er_description h3 {
        font-size:1.15rem; font-weight:700; color:var(--er-tinta);
        margin:1.3rem 0 .6rem 0; padding-bottom:.35rem;
        border-bottom:2px solid var(--er-amarillo); display:inline-block; }
      .o_wsale_er_description ul { columns:2; column-gap:2.5rem; }
      .o_wsale_er_description li { break-inside:avoid; }

      @media (max-width: 991.98px) {
        #o_wsale_product_details_content {
          border:none; border-radius:0; padding:0; box-shadow:none; }
        .o_wsale_er_description ul { columns:1; }
      }

      @media (max-width: 991.98px) {
        #product_detail h1.h3 { font-size:1.2rem; }
        #product_detail .oe_price { font-size:1.5rem !important; }

        /* puntos pequeños y discretos, no circulos gigantes */
        #product_detail .carousel-indicators { gap:.4rem; align-items:center; }
        #product_detail .carousel-indicators li {
          width:8px !important; height:8px !important;
          min-width:0 !important; min-height:0 !important;
          border-radius:50% !important; background:#d8d4e4 !important;
          border:none !important; padding:0 !important; margin:0 !important;
          opacity:1 !important; transition:width .15s ease, background .15s ease; }
        #product_detail .carousel-indicators li.active {
          width:22px !important; border-radius:999px !important;
          background:var(--er-morado) !important; }

        /* precio + boton "Agregar al carrito" siempre visibles, en una sola
           barra fija abajo. Se reposiciona el MISMO elemento (no se duplica)
           para que nunca se desactualice si cambia el embalaje o la cantidad.
           Ambas mitades comparten alto y linea base para que se vean como
           una sola barra continua, no como dos piezas encimadas. */
        /* la barra es una sola pieza blanca; el boton va como pastilla
           dentro de ella, a la derecha (mas limpio que partirla en dos) */
        /* #product_details trae z-index:0, lo que encierra a la barra fija en
           su propio contexto de apilamiento y deja que el contenido de abajo
           se pinte encima (se veia "transparente"). Se libera en movil. */
        #product_details { z-index:auto !important; }

        /* z-index alto: el boton de WhatsApp del sitio usa 9999 */
        #product_detail [name="product_price_container"] {
          position:fixed; left:0; right:0; width:100%; bottom:0; z-index:10000;
          margin:0; background:#fff; opacity:1;
          height:calc(64px + env(safe-area-inset-bottom));
          padding:0 1rem env(safe-area-inset-bottom) 1rem;
          display:flex !important; flex-direction:column !important;
          align-items:flex-start !important; justify-content:center !important;
          flex-wrap:nowrap !important; gap:0 !important;
          border-top:1px solid var(--er-borde);
          box-shadow:0 -3px 14px rgba(29,23,43,.10); }
        #product_detail [name="product_price_container"] .fs-6.text-muted { display:none; }
        #product_detail .oe_price {
          font-size:1.3rem !important; line-height:1.2 !important; }
        /* embalaje seleccionado, debajo del precio */
        #product_detail [name="product_price_container"] .o_er_uom_label {
          display:block; font-size:.72rem; font-weight:500; color:var(--er-texto);
          line-height:1.2; margin-top:1px; max-width:52vw;
          white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
        #product_detail #add_to_cart {
          position:fixed; left:auto; right:.85rem; width:auto; z-index:10001;
          bottom:calc(10px + env(safe-area-inset-bottom)); margin:0;
          height:44px; padding:0 1.4rem !important;
          display:flex !important; align-items:center !important;
          border-radius:999px;
          box-shadow:0 3px 12px rgba(55,26,148,.32); }

        /* el bloque del precio ya vive en la barra fija: se colapsa su hueco
           para que "Embalaje" quede pegado al nombre del producto */
        #product_detail .o_wsale_product_details_content_section_price {
          margin-bottom:0 !important; line-height:0 !important; }
        #product_detail .o_wsale_product_details_content_section_price .product_price {
          line-height:0 !important; }
        /* y el titulo no necesita tanto aire debajo */
        #product_detail .o_wsale_product_details_content_section_title {
          margin-bottom:.75rem !important; }

        /* espacio al final de la pagina para que la barra fija no tape nada */
        #wrap:has(#product_detail) { padding-bottom:84px; }
        /* el boton de WhatsApp flotante no debe quedar tapado por la barra */
        body:has(#product_detail) #wa-float { bottom:80px !important; }
      }
    

      /* ===== escena animada del pie: ciudad + camioneta El Rey ===== */
      .er_escena {
        position:relative; width:100%; height:150px; overflow:hidden;
        pointer-events:none; user-select:none;
        background:linear-gradient(180deg,#1d0f4d 0%,#25136a 60%,#2E0668 100%); }
      .er_escena .er_ciudad {
        position:absolute; left:0; bottom:26px; width:100%; height:124px; display:block; }
      .er_escena .er_calle {
        position:absolute; left:0; bottom:0; width:100%; height:26px;
        background:#15093a; border-top:2px solid #FDB913; }
      .er_escena .er_linea {
        position:absolute; left:0; top:12px; width:100%; height:2px;
        background:repeating-linear-gradient(90deg,
          rgba(255,255,255,.45) 0 22px, transparent 22px 48px); }

      .er_escena .er_camion {
        position:absolute; bottom:10px; left:0; width:250px;
        animation:erCruzaPie 17s linear infinite; will-change:transform; }
      .er_escena .er_camion img {
        width:100%; height:auto; display:block;
        filter:drop-shadow(0 5px 10px rgba(0,0,0,.45)); }

      @keyframes erCruzaPie {
        0%   { transform:translateX(-220px); }
        100% { transform:translateX(calc(100vw + 60px)); } }

      @media (max-width: 767.98px) {
        .er_escena { height:110px; }
        .er_escena .er_ciudad { height:90px; bottom:20px; }
        .er_escena .er_calle { height:20px; }
        .er_escena .er_camion { width:165px; bottom:7px;
          animation-duration:13s; } }

      @media (prefers-reduced-motion: reduce) {
        .er_escena .er_camion { animation:none; left:6%; } }
    

      /* ============ HERO: ESTALLIDO DE PRODUCTO ============ */
      .elrey-page .hero { background:#2e0668; position:relative; overflow:hidden; }

      /* el texto se eleva por sus hijos: .hero-l trae fondo opaco */
      .elrey-page .hero-l > .hero-eyebrow,
      .elrey-page .hero-l > .hero-h1,
      .elrey-page .hero-l > .hero-sub,
      .elrey-page .hero-l > .hero-btns { position:relative; z-index:5; }

      /* --- la llave visual --- */
      .er_vit { position:absolute; inset:0; z-index:1; pointer-events:none; overflow:hidden; }
      .er_vit picture { display:block; position:absolute; inset:0; }
      .er_vit img {
        position:absolute; inset:0; width:100%; height:100%;
        object-fit:cover; object-position:center center;
        animation:erEntraFondo 1.1s ease-out backwards,
                  erZoom 30s ease-in-out 1.1s infinite alternate;
        will-change:transform, opacity; }
      @keyframes erEntraFondo {
        from { opacity:0; transform:scale(1.08); }
        to   { opacity:1; transform:scale(1); } }
      @keyframes erZoom {
        from { transform:scale(1)     translateX(0); }
        to   { transform:scale(1.075) translateX(-1.2%); } }

      /* destellos que laten sobre el estallido dorado del centro */
      .er_chispa {
        position:absolute; inset:0; z-index:2; pointer-events:none;
        background:radial-gradient(38% 62% at 50% 46%,
          rgba(255,214,92,.28) 0%, rgba(255,190,60,.10) 42%, rgba(255,190,60,0) 70%);
        animation:erLate 4.2s ease-in-out infinite; }
      @keyframes erLate {
        0%,100% { opacity:.45; transform:scale(1); }
        50%     { opacity:.95; transform:scale(1.06); } }

      /* velo que hace legible el titular sobre el centro dorado */
      .er_velo {
        position:absolute; inset:0; z-index:3; pointer-events:none;
        background:
          radial-gradient(42% 58% at 50% 46%,
            rgba(38,4,86,.86) 0%, rgba(38,4,86,.62) 55%, rgba(38,4,86,0) 82%),
          linear-gradient(180deg, rgba(38,4,86,.35) 0%, rgba(38,4,86,0) 28%,
            rgba(38,4,86,0) 62%, rgba(38,4,86,.5) 100%); }

      @media (min-width: 992px) {
        .elrey-page .hero-l { padding-bottom:3.5rem !important; }
      }
      @media (max-width: 991.98px) {
        .elrey-page .hero-l { padding-bottom:2.5rem !important; }
        /* en vertical la imagen recorta al centro: se refuerza el velo */
        .er_vit img { object-position:center center; animation:erEntraFondo 1.1s ease-out backwards; }
        /* el texto ocupa casi todo el alto: se oscurece la franja central
           y se dejan limpios los extremos, donde estan los productos */
        .er_velo { background:
          linear-gradient(180deg,
            rgba(38,4,86,.30) 0%,   rgba(38,4,86,.80) 13%,
            rgba(38,4,86,.88) 30%,  rgba(38,4,86,.88) 72%,
            rgba(38,4,86,.72) 86%,  rgba(38,4,86,.45) 100%); }
        .er_chispa { animation:none; opacity:.5; }
      }

      @media (prefers-reduced-motion: reduce) {
        .er_vit img { animation:none !important; }
        .er_chispa { animation:none; opacity:.6; }
      }
    

      /* ================= FASE 1: BARRA DE NAVEGACION ================= */
      .er_barra {
        position:relative; z-index:1035; background:#fff;
        border-bottom:1px solid #e7e4f0; box-shadow:0 1px 6px rgba(29,23,43,.06); }
      .er_barra_in {
        max-width:1320px; margin:0 auto; padding:.6rem 1rem;
        display:flex; align-items:center; gap:.85rem; }

      /* --- boton Departamentos --- */
      .er_dep_btn {
        display:inline-flex; align-items:center; gap:.55rem; flex:0 0 auto;
        background:#490AA0; color:#fff; border:none; border-radius:999px;
        padding:.62rem 1.15rem; font-weight:600; font-size:.9rem;
        cursor:pointer; transition:background .15s ease; }
      .er_dep_btn:hover { background:#2E0668; color:#fff; }
      .er_dep_btn .er_ham { display:inline-block; width:15px; }
      .er_dep_btn .er_ham i {
        display:block; height:2px; background:#FDB913; border-radius:2px;
        margin:3px 0; }
      .er_dep_btn .er_flecha { font-size:.65rem; transition:transform .18s ease; }
      .er_barra.abierto .er_dep_btn .er_flecha { transform:rotate(180deg); }

      /* --- buscador protagonista --- */
      .er_buscar { flex:1 1 auto; display:flex; position:relative; min-width:0; }
      .er_buscar input {
        width:100%; border:2px solid #e7e4f0; border-radius:999px;
        padding:.62rem 3rem .62rem 1.1rem; font-size:.92rem; color:#141018;
        background:#faf9fc; transition:border-color .15s ease, background .15s ease; }
      .er_buscar input:focus {
        outline:none; border-color:#490AA0; background:#fff; }
      .er_buscar input::placeholder { color:#8d88a0; }
      .er_buscar button {
        position:absolute; right:4px; top:4px; bottom:4px; width:42px;
        border:none; border-radius:50%; background:#FDB913; color:#141018;
        cursor:pointer; display:flex; align-items:center; justify-content:center;
        transition:background .15s ease; }
      .er_buscar button:hover { background:#d4b506; }

      /* --- señales de confianza --- */
      .er_confia { display:flex; gap:1.1rem; flex:0 0 auto; }
      .er_confia span {
        display:inline-flex; align-items:center; gap:.4rem;
        font-size:.78rem; color:#56516b; white-space:nowrap; }
      .er_confia b { color:#141018; font-weight:600; }
      .er_confia .er_pt { width:7px; height:7px; border-radius:50%; background:#2fa84f; }

      /* --- panel del mega menu --- */
      .er_panel {
        display:none; position:absolute; left:0; right:0; top:100%;
        background:#fff; border-top:1px solid #e7e4f0;
        box-shadow:0 14px 30px rgba(29,23,43,.16); }
      .er_barra.abierto .er_panel { display:block; }
      .er_panel_in {
        max-width:1320px; margin:0 auto; padding:1.4rem 1rem 1.6rem;
        display:grid; grid-template-columns:repeat(4, 1fr); gap:1.1rem 1.6rem; }
      .er_col { min-width:0; }
      .er_dep {
        display:flex; align-items:center; gap:.4rem; text-decoration:none;
        font-weight:700; font-size:.9rem; color:#141018;
        padding-bottom:.35rem; margin-bottom:.45rem;
        border-bottom:2px solid #FDB913; }
      .er_dep:hover { color:#490AA0; }
      .er_sub {
        display:flex; align-items:center; gap:.4rem; text-decoration:none;
        font-size:.82rem; color:#56516b; padding:.16rem 0; }
      .er_sub:hover { color:#490AA0; }
      .er_n {
        margin-left:auto; font-size:.68rem; color:#9a95a8;
        font-variant-numeric:tabular-nums; }
      .er_panel_pie {
        max-width:1320px; margin:0 auto; padding:0 1rem 1.2rem; }
      .er_panel_pie a {
        display:inline-flex; align-items:center; gap:.4rem;
        font-size:.85rem; font-weight:600; color:#490AA0; text-decoration:none; }

      /* --- chips de departamentos (movil) --- */
      .er_chips { display:none; }

      @media (max-width: 1199.98px) { .er_confia { display:none; } }
      @media (max-width: 991.98px) {
        .er_barra_in { flex-wrap:wrap; gap:.55rem; padding:.55rem .8rem; }
        .er_dep_btn { order:1; }
        .er_buscar { order:3; flex-basis:100%; }
        .er_buscar input { font-size:16px; }   /* evita el zoom de iOS */
        .er_panel_in { grid-template-columns:1fr 1fr; gap:.9rem 1rem; padding:1rem .8rem; }
        .er_sub { padding:.22rem 0; }
        .er_chips {
          order:2; display:flex; gap:.4rem; overflow-x:auto; flex:1 1 100%;
          -webkit-overflow-scrolling:touch; scrollbar-width:none; }
        .er_chips::-webkit-scrollbar { display:none; }
        .er_chips a {
          flex:0 0 auto; font-size:.76rem; font-weight:500; color:#490AA0;
          background:#f1eefb; border-radius:999px; padding:.3rem .7rem;
          text-decoration:none; white-space:nowrap; }
      }
      @media (max-width: 575.98px) {
        .er_panel_in { grid-template-columns:1fr; }
      }
    

      /* ================= FASE 2: HOME QUE VENDE ================= */
      .er_sec { padding:2.6rem 1rem 2.2rem; }
      .er_sec_in { max-width:1320px; margin:0 auto; }
      .er_sec_tit {
        display:flex; align-items:baseline; justify-content:space-between;
        gap:1rem; margin-bottom:1.3rem; }
      .er_sec_tit h2 {
        font-size:1.6rem; font-weight:800; color:#141018; margin:0;
        letter-spacing:-.02em; }
      .er_sec_tit h2 em { font-style:normal; color:#490AA0; }
      .er_sec_tit a {
        font-size:.85rem; font-weight:600; color:#490AA0;
        text-decoration:none; white-space:nowrap; }
      .er_sec_tit a:hover { text-decoration:underline; }

      /* --- rejilla de departamentos --- */
      .er_deps { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
      .er_dep_t {
        display:flex; align-items:center; gap:.85rem; text-decoration:none;
        background:#fff; border:1px solid #e7e4f0; border-radius:14px;
        padding:.8rem .95rem;
        transition:border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
      .er_dep_t:hover {
        border-color:#490AA0; box-shadow:0 8px 20px rgba(55,26,148,.13);
        transform:translateY(-2px); }
      .er_dep_img {
        flex:0 0 auto; width:62px; height:62px; border-radius:11px;
        background:#faf9fc; display:flex; align-items:center; justify-content:center;
        overflow:hidden; }
      .er_dep_img img { width:100%; height:100%; object-fit:contain; padding:5px; }
      .er_dep_tx { display:flex; flex-direction:column; min-width:0; }
      .er_dep_tx b {
        font-size:.9rem; font-weight:700; color:#141018; line-height:1.25;
        margin-bottom:.15rem; }
      .er_dep_tx i {
        font-style:normal; font-size:.75rem; color:#56516b;
        font-variant-numeric:tabular-nums; }

      /* --- carrusel de mas vendidos --- */
      .er_tops {
        display:flex; gap:1rem; overflow-x:auto; padding-bottom:.6rem;
        scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
        scrollbar-width:thin; }
      .er_tops::-webkit-scrollbar { height:6px; }
      .er_tops::-webkit-scrollbar-thumb { background:#d8d4e4; border-radius:3px; }
      .er_top_c {
        flex:0 0 176px; scroll-snap-align:start; text-decoration:none;
        display:flex; flex-direction:column; }
      .er_top_img {
        display:block; aspect-ratio:1/1; background:#faf9fc; border-radius:12px;
        overflow:hidden; border:1px solid #eeecf5;
        transition:border-color .16s ease; }
      .er_top_img img { width:100%; height:100%; object-fit:contain; padding:8px; }
      .er_top_c:hover .er_top_img { border-color:#490AA0; }
      .er_top_n {
        display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
        overflow:hidden; font-size:.8rem; color:#56516b; line-height:1.3;
        height:2.6em; margin:.5rem 0 .2rem; }
      .er_top_p {
        font-size:1.05rem; font-weight:800; color:#141018;
        font-variant-numeric:tabular-nums; }

      /* el mosaico viejo mostraba categorias que ya no existen con ese nombre */
      .er_oculto { display:none !important; }

      @media (max-width: 1199.98px) { .er_deps { grid-template-columns:repeat(3,1fr); } }
      @media (max-width: 767.98px) {
        .er_sec { padding:1.9rem .85rem 1.6rem; }
        .er_sec_tit h2 { font-size:1.25rem; }
        .er_deps { grid-template-columns:1fr 1fr; gap:.65rem; }
        .er_dep_t { padding:.6rem .65rem; gap:.6rem; border-radius:12px; }
        .er_dep_img { width:48px; height:48px; }
        .er_dep_tx b { font-size:.8rem; }
        .er_dep_tx i { font-size:.68rem; }
        .er_top_c { flex-basis:144px; }
      }
    

      /* ================= FASE 3: FILTROS DE LA TIENDA ================= */

      /* --- chips de filtros activos --- */
      .er_chipsact {
        display:flex; flex-wrap:wrap; align-items:center; gap:.45rem;
        margin:0 0 1rem 0; }
      .er_chipsact .er_lbl {
        font-size:.8rem; font-weight:600; color:#56516b; margin-right:.15rem; }
      .er_chipsact a.er_chip {
        display:inline-flex; align-items:center; gap:.4rem;
        background:#f1eefb; color:#490AA0; border:1px solid #ddd5f5;
        border-radius:999px; padding:.28rem .7rem;
        font-size:.78rem; font-weight:500; text-decoration:none;
        transition:background .14s ease, border-color .14s ease; }
      .er_chipsact a.er_chip:hover { background:#e5deff; border-color:#490AA0; }
      .er_chipsact a.er_chip b { font-weight:700; }
      .er_chipsact a.er_chip .er_x {
        font-size:1rem; line-height:1; color:#7a6fa8; margin-top:-1px; }
      .er_chipsact a.er_limpiar {
        font-size:.78rem; font-weight:600; color:#c0392b; text-decoration:none;
        margin-left:.2rem; }
      .er_chipsact a.er_limpiar:hover { text-decoration:underline; }

      /* --- buscador dentro del filtro de marca --- */
      .er_fbuscar { position:relative; margin:0 0 .5rem 0; }
      .er_fbuscar input {
        width:100%; border:1.5px solid #e7e4f0; border-radius:999px;
        padding:.36rem .8rem .36rem 2rem; font-size:.8rem; color:#141018;
        background:#faf9fc; }
      .er_fbuscar input:focus { outline:none; border-color:#490AA0; background:#fff; }
      .er_fbuscar svg {
        position:absolute; left:.65rem; top:50%; transform:translateY(-50%);
        color:#8d88a0; pointer-events:none; }
      .er_sinres {
        display:none; font-size:.76rem; color:#8d88a0; padding:.3rem 0; }

      /* --- arbol de categorias plegable --- */
      .er_cat_pad { display:flex; align-items:center; gap:.3rem; }
      .er_cat_tog {
        flex:0 0 auto; width:20px; height:20px; border:none; background:none;
        cursor:pointer; color:#8d88a0; font-size:.62rem; line-height:1;
        display:flex; align-items:center; justify-content:center;
        transition:transform .16s ease, color .14s ease; }
      .er_cat_tog:hover { color:#490AA0; }
      .er_cat_tog.abierto { transform:rotate(90deg); color:#490AA0; }
      .er_cat_hijos { display:none; }
      .er_cat_hijos.abierto { display:block; }

      @media (max-width: 991.98px) {
        .er_chipsact { margin-bottom:.7rem; }
      }
    

      /* ============ CASHBACK / PUNTOS EL REY ============ */
      .er_cash {
        display:flex; align-items:center; gap:.7rem;
        background:linear-gradient(135deg,#fff8dc 0%,#fdf3c4 100%);
        border:1.5px solid #FDB913; border-radius:12px;
        padding:.6rem .8rem; margin:.15rem 0 1rem; }
      .er_cash_ic {
        flex:0 0 auto; width:34px; height:34px; border-radius:50%;
        background:#FDB913; display:flex; align-items:center; justify-content:center;
        box-shadow:0 2px 6px rgba(233,199,7,.5); }
      .er_cash_tx { display:flex; flex-direction:column; line-height:1.25; min-width:0; }
      .er_cash_tx b {
        font-size:.95rem; font-weight:800; color:#141018; letter-spacing:-.01em; }
      .er_cash_tx b em {
        font-style:normal; color:#490AA0; }
      .er_cash_tx span { font-size:.74rem; color:#6b6455; }

      /* version compacta para la barra fija de movil */
      @media (max-width: 991.98px) {
        .er_cash { padding:.5rem .65rem; gap:.55rem; margin-bottom:.8rem; }
        .er_cash_ic { width:29px; height:29px; }
        .er_cash_tx b { font-size:.86rem; }
        .er_cash_tx span { font-size:.7rem; }
      }
    

      /* ========= SELECTOR DE ENTREGA (checkout) ========= */
      .er_ent_tit {
        font-size:1.1rem; font-weight:800; color:#141018; margin:0 0 .9rem; }

      #o_delivery_methods_list.er_cards, ul.list-group.er_cards {
        display:grid; grid-template-columns:repeat(3, 1fr); gap:.7rem;
        border:none; background:none; padding:0; }
      ul.list-group.er_cards > .list-group-item {
        display:flex !important; flex-direction:column; align-items:center;
        text-align:center; gap:.5rem;
        border:2px solid #e7e4f0 !important; border-radius:14px !important;
        background:#fff !important; padding:1rem .7rem !important;
        cursor:pointer; position:relative;
        transition:border-color .16s ease, box-shadow .16s ease,
                   transform .16s ease, background .16s ease; }
      ul.list-group.er_cards > .list-group-item:hover {
        border-color:#b9a9ee !important; transform:translateY(-2px);
        box-shadow:0 6px 16px rgba(55,26,148,.10); }
      ul.list-group.er_cards > .list-group-item.er_sel {
        border-color:#490AA0 !important; background:#faf8ff !important;
        box-shadow:0 6px 18px rgba(55,26,148,.16); }
      /* el radio real sigue ahi, solo se esconde a la vista */
      ul.list-group.er_cards input[name="o_delivery_radio"] {
        position:absolute !important; opacity:0; width:1px; height:1px;
        pointer-events:none; }
      /* lo que Odoo pinta sigue en el DOM (lo actualiza al cotizar), oculto */
      ul.list-group.er_cards .er_oculto_odoo {
        position:absolute !important; width:1px; height:1px;
        overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

      .er_ent_ic {
        width:56px; height:56px; border-radius:50%; background:#f1eefb;
        display:flex; align-items:center; justify-content:center;
        transition:background .16s ease; }
      .list-group-item.er_sel .er_ent_ic { background:#FDB913; }
      .er_ent_txt {
        display:flex; flex-direction:column; align-items:center; gap:.12rem; }
      .er_ent_nom {
        font-size:.86rem; font-weight:700; color:#141018; line-height:1.25; }
      .er_ent_pre {
        font-size:.82rem; font-weight:700; color:#490AA0;
        font-variant-numeric:tabular-nums; }
      .er_ent_pre.er_gratis { color:#2fa84f; }
      .er_ent_sub { font-size:.7rem; color:#8d88a0; line-height:1.2; }

      /* aviso de pedido solo-local */
      .er_ent_aviso {
        display:flex; align-items:flex-start; gap:.6rem;
        background:#fff8dc; border:1.5px solid #FDB913; border-radius:12px;
        padding:.7rem .85rem; margin:0 0 1rem; }
      .er_ent_aviso b { display:block; font-size:.86rem; color:#141018; }
      .er_ent_aviso span { font-size:.78rem; color:#6b6455; }

      @media (max-width: 767.98px) {
        ul.list-group.er_cards { grid-template-columns:1fr; }
        ul.list-group.er_cards > .list-group-item {
          flex-direction:row !important; text-align:left; gap:.75rem;
          padding:.7rem .8rem !important; }
        .er_ent_ic { width:44px; height:44px; flex:0 0 auto; }
        .er_ent_txt { align-items:flex-start; flex:1 1 auto; }
      }
    

      /* la colonia es obligatoria para que la paqueteria pueda cotizar */
      .er_req_col label:after { content:" *"; color:#c0392b; font-weight:700; }
      .er_col_ayuda {
        display:block; font-size:.75rem; color:#8d88a0; margin-top:.2rem; }
    

      /* ====== BUSCADOR EN EL MISMO RENGLON QUE EL LOGO (estilo Sam's) ====== */
      @media (min-width: 992px) {
        header#top .er_cabecera {
          display:grid !important;
          grid-template-columns:auto auto minmax(0,1fr) auto !important;
          align-items:center; gap:1rem;
          padding-bottom:.7rem !important; }
        /* Odoo la esconde al bajar; aqui debe quedarse siempre */
        header#top .er_cabecera.hidden { display:grid !important; }
        header#top .er_cabecera .navbar-brand { margin:0 !important; }
        header#top .er_cabecera .er_oculto { display:none !important; }

        header#top .er_cabecera .er_buscar {
          width:100%; max-width:760px; justify-self:center; }
        header#top .er_cabecera .er_buscar input {
          border:2px solid transparent; background:#fff; color:#141018;
          padding:.72rem 3.4rem .72rem 1.25rem; font-size:.95rem; }
        header#top .er_cabecera .er_buscar input::placeholder { color:#8d88a0; }
        header#top .er_cabecera .er_buscar input:focus {
          border-color:#FDB913; background:#fff;
          box-shadow:0 0 0 4px rgba(233,199,7,.28); }
        header#top .er_cabecera .er_buscar button {
          right:5px; top:5px; bottom:5px; width:46px; }

        header#top .er_cabecera .er_dep_btn { flex:0 0 auto; white-space:nowrap; }

        /* --- lado derecho al estilo Sam's: favoritos, cuenta, carrito --- */
        header#top .er_cabecera .er_ico_user {
          width:20px; height:20px; margin-right:.4rem; flex:0 0 auto;
          stroke:currentColor; fill:none; stroke-width:1.7;
          stroke-linecap:round; stroke-linejoin:round; }
        header#top .er_cabecera a[href*="/web/login"] {
          display:inline-flex !important; align-items:center; }
      }

      /* La franja blanca desaparece: Departamentos vive en la barra morada. */
      .er_barra { display:none !important; }

      /* el mega menu pasa a colgar de la cabecera */
      header#top { position:relative; }
      header#top .er_panel {
        position:absolute; top:100%; left:0; right:0; display:none;
        background:#fff; border-top:1px solid #e7e4f0;
        box-shadow:0 14px 30px rgba(29,23,43,.16); z-index:1040; }
      header#top .er_panel.er_abierto { display:block; }
      header#top .er_dep_btn .er_flecha { transition:transform .18s ease; }
      header#top .er_dep_btn[aria-expanded="true"] .er_flecha { transform:rotate(180deg); }

      /* ---- movil: logo | buscador | carrito | menu, todo en la franja ---- */
      @media (max-width: 991.98px) {
        header#top .o_header_mobile .o_main_nav { flex-wrap:nowrap !important; gap:.5rem; }
        header#top .o_header_mobile .er_cab_movil {
          display:flex; align-items:center; gap:.5rem; min-width:0; flex:1 1 auto; }
        header#top .o_header_mobile .er_cab_movil .navbar-brand {
          flex:0 0 auto; margin:0 !important; }
        header#top .o_header_mobile .er_cab_movil .navbar-brand img {
          width:44px !important; height:auto !important; }
        header#top .o_header_mobile .o_header_mobile_buttons_wrap {
          flex:0 0 auto; margin-left:0 !important; gap:.15rem !important; }
        header#top .o_header_mobile .o_header_mobile_buttons_wrap .btn { padding:.3rem !important; }
        /* el corazon roba ancho al buscador y sigue estando en el menu */
        header#top .o_header_mobile .o_header_mobile_buttons_wrap li:has(a[href="/shop/wishlist"]) {
          display:none !important; }

        /* la regla vieja de .er_barra le pone order:3 y flex-basis:100%,
           y eso lo mandaba despues del carrito */
        header#top .o_header_mobile .er_buscar {
          order:0 !important; flex:1 1 auto !important;
          flex-basis:auto !important; min-width:0; }
        header#top .o_header_mobile .er_buscar input {
          border:none; background:#fff; color:#141018;
          padding:.5rem 2.4rem .5rem .8rem; font-size:16px; }
        header#top .o_header_mobile .er_buscar input::placeholder {
          font-size:.86rem; }
        header#top .o_header_mobile .er_buscar button {
          right:3px; top:3px; bottom:3px; width:34px; }

        /* en movil Departamentos vive en el menu hamburguesa */
        header#top .er_dep_btn, header#top .er_panel { display:none !important; }
      }
    

      /* ================= MENU MOVIL (referencia: Sam's Club) ================= */
      #top_menu_collapse_mobile {
        --er-p:#490AA0; --er-tx:#141018; --er-mut:#6e667a;
        /* el offcanvas de Odoo viene oscuro; aqui va blanco tipo Sam's */
        background:#fff !important; color:var(--er-tx) !important;
        width:min(86vw, 380px) !important;
        /* .er_barra tiene z-index 1035 y se le encimaba */
        z-index:1060 !important; }
      .offcanvas-backdrop { z-index:1055 !important; }
      /* .er_barra estaba en 1035 y tapaba el panel; sigue por encima
         del contenido pero por debajo del menu */
      .er_barra { z-index:1000 !important; }
      #top_menu_collapse_mobile .btn-close {
        filter:none !important; opacity:.55; }
      #top_menu_collapse_mobile .offcanvas-header { padding:.9rem 1rem .2rem; }
      #top_menu_collapse_mobile .offcanvas-body { padding:0 !important; }
      /* se esconde el menu de serie, no se borra */
      #top_menu_collapse_mobile .offcanvas-body > *:not(.er_menu) { display:none !important; }

      .er_menu { padding:.4rem 0 2rem; font-size:1rem; }

      .er_menu_sesion {
        display:block; margin:.2rem 1.15rem 1.4rem; padding:.85rem 1rem;
        background:var(--er-p); color:#fff !important; border-radius:999px;
        text-align:center; font-weight:600; font-size:.98rem;
        text-decoration:none !important; }
      .er_menu_sesion:hover { background:#2E0668; }

      .er_menu_grupo { padding:.2rem 0; }
      .er_menu_sep { height:1px; background:#ececf2; margin:.75rem 1.15rem; }

      .er_it {
        display:flex; align-items:center; gap:1rem; width:100%;
        padding:.82rem 1.15rem; background:none; border:0; text-align:left;
        color:var(--er-tx) !important; text-decoration:none !important;
        font-size:1.02rem; line-height:1.2; opacity:1 !important; }
      .er_it:active { background:#f5f3fb; }
      .er_it svg { flex:0 0 22px; width:22px; height:22px; stroke:var(--er-p);
        fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
      .er_it .er_it_tx { flex:1 1 auto; min-width:0; }
      .er_it .er_chev { flex:0 0 auto; width:16px; height:16px; stroke:var(--er-mut);
        transition:transform .22s ease; }
      .er_it[aria-expanded="true"] .er_chev { transform:rotate(90deg); }

      .er_sub_lista {
        display:grid; grid-template-rows:0fr;
        transition:grid-template-rows .28s ease; }
      .er_sub_lista > div { overflow:hidden; }
      .er_it[aria-expanded="true"] + .er_sub_lista { grid-template-rows:1fr; }
      .er_sub_lista a {
        display:block; padding:.6rem 1.15rem .6rem 3.15rem;
        color:var(--er-mut) !important; text-decoration:none !important;
        font-size:.94rem; }
      .er_sub_lista a:active { background:#f5f3fb; }

      .er_dep_fila { display:flex; align-items:center; }
      .er_dep_enc {
        flex:1 1 auto; display:block; padding:.6rem 1.15rem .6rem 3.15rem;
        color:var(--er-tx) !important; text-decoration:none !important;
        font-size:.95rem; font-weight:600; }
      .er_dep_mas {
        flex:0 0 auto; width:38px; height:38px; margin-right:.6rem;
        border:1px solid #e4e0f2; border-radius:10px; background:#fff;
        color:var(--er-p); font-size:1.15rem; line-height:1; cursor:pointer; }
      .er_subs { display:none; padding:.1rem 0 .5rem; background:#faf9fd; }
      .er_subs.er_abierta { display:block; }
      .er_subs a {
        display:block; padding:.5rem 1.15rem .5rem 4.1rem;
        color:var(--er-mut) !important; text-decoration:none !important;
        font-size:.9rem; }
      .er_subs a:active { background:#f1eefb; }

      .er_it_wa { color:#128c4a !important; }
      .er_it_wa svg { stroke:#128c4a; }
    

/* ===================== QUIENES SOMOS (2026-09-18, marca plana) ===================== */
.er-qs{font-family:Inter,system-ui,sans-serif;color:#141018;}
.er-qs-in{max-width:1180px;margin:0 auto;padding:0 24px;}
.er-qs-sec{padding:56px 0;} .er-qs-sec--tight{padding:24px 0 40px;} .er-qs-sec--lila{background:#F5F2FA;}
.er-qs-k{font:600 12px/1 Inter,system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#FFD426;margin:0 0 14px;}
.er-qs-k--m{color:#490AA0;}
.er-qs h1,.er-qs h2{font-family:'Archivo Black',Impact,sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:-.01em;line-height:1.02;margin:0;}
.er-qs-hero{background:#490AA0;color:#fff;padding:64px 0 60px;text-align:center;}
.er-qs-hero h1{font-size:clamp(32px,5vw,62px);max-width:920px;margin:0 auto;color:#fff;}
.er-qs-hero h1 span,.er-qs h2 span{color:#FFD426;}
.er-qs h2{font-size:clamp(24px,3vw,40px);color:#141018;} .er-qs h2 span{color:#490AA0;}
.er-qs-lead{font:400 clamp(15px,1.5vw,18px)/1.55 Inter,system-ui,sans-serif;color:rgba(255,255,255,.85);max-width:680px;margin:18px auto 0;}
.er-qs-ctas{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:26px;}
.er-qs-texto .er-qs-ctas{justify-content:flex-start;}
.er-qs-btn,.er-qs-btn:link,.er-qs-btn:visited{display:inline-flex;align-items:center;justify-content:center;font:650 15px/1 Inter,system-ui,sans-serif;padding:15px 24px;border-radius:10px;text-decoration:none !important;background:#490AA0;color:#fff !important;transition:background .15s,transform .15s;}
.er-qs-btn:hover{transform:translateY(-2px);}
.er-qs-btn.er-am,.er-qs-btn.er-am:link,.er-qs-btn.er-am:visited{background:#FFD426;color:#490AA0 !important;} .er-qs-btn.er-am:hover{background:#FDB913;}
.er-qs-btn.er-bl,.er-qs-btn.er-bl:link,.er-qs-btn.er-bl:visited{background:transparent;color:#fff !important;border:1.5px solid rgba(255,255,255,.7);} .er-qs-btn.er-bl:hover{background:rgba(255,255,255,.1);}
.er-qs-btn.er-mo,.er-qs-btn.er-mo:link,.er-qs-btn.er-mo:visited{background:#490AA0;color:#fff !important;margin-top:8px;} .er-qs-btn.er-mo:hover{background:#2E0668;}
.er-qs-chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding:0;margin:26px 0 0;}
.er-qs-chips li{font:600 13px/1 Inter,system-ui,sans-serif;color:#fff;border:1.5px solid rgba(255,255,255,.35);border-radius:999px;padding:10px 14px;}
.er-qs-split{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center;}
.er-qs-split--inv{grid-template-columns:1fr 1.05fr;}
.er-qs-foto{position:relative;margin:0;border-radius:20px;overflow:hidden;box-shadow:0 12px 32px rgba(46,6,104,.14);}
.er-qs-foto img{width:100%;height:auto;display:block;aspect-ratio:1100/740;object-fit:cover;}
.er-qs-foto figcaption{position:absolute;left:16px;bottom:16px;background:#FFD426;color:#490AA0;font:700 12px/1 Inter,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;padding:10px 14px;border-radius:999px;}
.er-qs-texto p{font:400 16px/1.6 Inter,system-ui,sans-serif;color:#3E3A48;margin:16px 0 0;}
.er-qs-texto h2 + p{margin-top:18px;}
.er-qs-cifras{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.er-qs-cifras li{background:#fff;border:1px solid #ECEAF1;border-radius:16px;padding:24px 18px 20px;text-align:center;position:relative;overflow:hidden;}
.er-qs-cifras li::after{content:'';position:absolute;left:18px;right:18px;bottom:0;height:4px;background:#FFD426;border-radius:4px 4px 0 0;}
.er-qs-cifras b{display:block;font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:clamp(28px,3vw,40px);line-height:1;color:#490AA0;}
.er-qs-cifras span{display:block;margin-top:8px;font:600 12px/1.3 Inter,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#6B6578;}
.er-qs-nota{font:400 12.5px/1.4 Inter,system-ui,sans-serif;color:#9A93A8;margin:12px 0 0;text-align:center;}
.er-qs-head{text-align:center;max-width:720px;margin:0 auto 28px;}
.er-qs-head .er-qs-k{margin-bottom:12px;}
.er-qs-enfoque{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.er-qs-enfoque article{background:#fff;border:1px solid #ECEAF1;border-radius:16px;padding:26px 24px 22px;display:flex;flex-direction:column;gap:10px;transition:transform .2s,box-shadow .2s;}
.er-qs-enfoque article:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(46,6,104,.12);}
.er-qs-enfoque h3{font:700 18px/1.25 Inter,system-ui,sans-serif;color:#141018;margin:0;}
.er-qs-enfoque p{font:400 14.5px/1.55 Inter,system-ui,sans-serif;color:#6B6578;margin:0;flex:1;}
.er-qs-enfoque a,.er-qs-enfoque a:link,.er-qs-enfoque a:visited{font:650 14px/1 Inter,system-ui,sans-serif;color:#490AA0 !important;text-decoration:none !important;}
.er-qs-lista{list-style:none;padding:0;margin:18px 0 0;}
.er-qs-lista li{position:relative;padding:10px 0 10px 32px;font:400 15.5px/1.5 Inter,system-ui,sans-serif;color:#3E3A48;border-bottom:1px solid #F1EEF5;}
.er-qs-lista li b{color:#141018;}
.er-qs-lista li::before{content:'';position:absolute;left:0;top:15px;width:18px;height:18px;border-radius:50%;background:#FFD426;box-shadow:inset 0 0 0 5px #fff,inset 0 0 0 7px #490AA0;}
.er-qs-galeria{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.er-qs-galeria img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:16px;display:block;}
.er-qs-galeria img:first-child{grid-column:1/-1;aspect-ratio:2/1;}
.er-qs-suc{grid-column:1/-1;background:#490AA0;color:#fff;border-radius:16px;padding:18px 20px;display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;font:400 13.5px/1.4 Inter,system-ui,sans-serif;}
.er-qs-suc b{font:700 14px/1.2 Inter,system-ui,sans-serif;color:#FFD426;}
.er-qs-suc a,.er-qs-suc a:link,.er-qs-suc a:visited{margin-left:auto;font:650 13.5px/1 Inter,system-ui,sans-serif;color:#FFD426 !important;text-decoration:none !important;}
.er-qs-marcas{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;}
.er-qs-marcas span{display:flex;align-items:center;justify-content:center;width:150px;height:70px;background:#fff;border:1px solid #ECEAF1;border-radius:14px;padding:12px 16px;}
.er-qs-marcas img{max-height:40px;max-width:112px;width:auto;height:auto;object-fit:contain;}
.er-qs-cta{background:#490AA0;color:#fff;border-radius:20px;padding:48px 32px;text-align:center;}
.er-qs-cta h2{color:#fff;} .er-qs-cta h2 span{color:#FFD426;}
.er-qs-cta > p:not(.er-qs-k){font:400 16px/1.55 Inter,system-ui,sans-serif;color:rgba(255,255,255,.85);max-width:600px;margin:16px auto 0;}
@media (max-width:991.98px){
  .er-qs-split,.er-qs-split--inv{grid-template-columns:1fr;gap:28px;}
  .er-qs-split--inv .er-qs-texto{order:-1;}
  .er-qs-cifras{grid-template-columns:1fr 1fr;} .er-qs-enfoque{grid-template-columns:1fr;}
}
@media (max-width:575.98px){
  .er-qs-in{padding:0 16px;} .er-qs-sec{padding:40px 0;} .er-qs-hero{padding:44px 0 44px;}
  .er-qs-ctas .er-qs-btn{flex:1 1 100%;}
  .er-qs-marcas span{width:calc(50% - 6px);}
  .er-qs-suc a{margin-left:0;}
  .er-qs-cta{padding:34px 20px;}
}


      /* ====== CABECERA FIJA: se quita la ventanilla blanca al bajar ====== */
      /* Odoo la desvanece pero conserva el hueco reservado; se queda visible */
      header#top.o_header_affixed {
        opacity:1 !important; visibility:visible !important;
        transform:none !important;
        box-shadow:0 6px 18px rgba(29,23,43,.18); }
      header#top.o_header_fade_out { transition:none !important; }

      /* ⚠️ Odoo le pone a <main> un padding-top del alto de la cabecera para
         compensar una cabecera superpuesta. La nuestra va en el flujo, asi que
         ese padding quedaba como una banda blanca sobre el hero. */
      #wrapwrap > main { padding-top:0 !important; }

      /* el renglon de menus sale de la barra morada: ahora vive en el pie */
      header#top nav.navbar .o_main_nav > div.justify-content-center { display:none !important; }

      /* ================== PIE DE PAGINA (amarillo) ==================
         El llamado a la accion (.cta) y las columnas van en UNA sola
         seccion amarilla. .cta se mueve dentro de .er_pie por JS. */
      .er_pie { background:#ffd426; color:#2e0668; padding:0 0 2rem; }
      .er_pie .cta { background:transparent !important; }
      .er_pie_in {
        max-width:1240px; margin:0 auto; padding:0 1.3rem;
        display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:2.2rem; }
      .er_pie_in { padding-top:.5rem; }
      .er_pie h4 {
        font-size:.82rem; font-weight:800; letter-spacing:.12em;
        text-transform:uppercase; color:#2e0668; margin:0 0 1rem; }
      .er_pie a {
        display:block; color:rgba(46,6,104,.82) !important;
        text-decoration:none !important; font-size:.92rem; padding:.32rem 0; }
      .er_pie a:hover { color:#2e0668 !important; text-decoration:underline !important; }
      .er_pie_marca img { width:120px; height:auto; margin-bottom:1rem; }
      /* el logo de marca es amarillo y sobre amarillo no se ve: se tiñe */
      .er_pie_marca img {
        filter:brightness(0) saturate(100%) invert(9%) sepia(92%)
               saturate(3800%) hue-rotate(265deg) brightness(85%) contrast(105%); }
      .er_pie_marca p {
        color:rgba(46,6,104,.75); font-size:.9rem; line-height:1.7; margin:0 0 1rem; }
      .er_pie_dir {
        color:rgba(46,6,104,.82); font-size:.9rem; line-height:1.8; }
      .er_pie_wa {
        display:inline-flex !important; align-items:center; gap:.5rem;
        background:#25d366; color:#fff !important; font-weight:700;
        padding:.6rem 1.1rem; border-radius:999px; margin-top:.8rem;
        font-size:.88rem; }
      .er_pie_wa:hover { color:#fff !important; text-decoration:none !important; }
      .er_pie_base {
        max-width:1240px; margin:2.4rem auto 0; padding:1.2rem 1.3rem 0;
        border-top:1px solid rgba(46,6,104,.22);
        color:rgba(46,6,104,.65); font-size:.82rem; }
      /* ⚠️ El pie es AMARILLO, asi que los enlaces van MORADOS: es la regla del
         sistema de marca -- blanco sobre amarillo no se lee. */
      .er_pie_base .er_pie_legal {
        color:#490AA0 !important; font-weight:600; text-decoration:none; }
      .er_pie_base .er_pie_legal:hover { text-decoration:underline; }

      /* Las COLUMNAS son solo de escritorio (en movil el menu hamburguesa ya
         lleva navegacion, departamentos y contacto). El llamado a la accion
         se queda en los dos. */
      @media (max-width: 991.98px) {
        .er_pie_in, .er_pie_base { display:none !important; }
        .er_pie { padding-bottom:0; }
      }
    

      /* ============ VENTAJAS EN FILA DE ICONOS (referencia Sam's) ============ */
      .why-grid {
        display:grid !important; grid-template-columns:repeat(6, 1fr) !important;
        gap:1.4rem 1rem; max-width:1180px;
        margin-left:auto !important; margin-right:auto !important; }

      .why-card {
        display:flex !important; flex-direction:column; align-items:center;
        text-align:center !important;
        background:transparent !important; border:0 !important;
        box-shadow:none !important; padding:.4rem .2rem !important;
        transform:none !important; cursor:default; }
      .why-card:hover { transform:translateY(-4px) !important; box-shadow:none !important; }

      /* El rombo.
         ⚠️ Girar la caja 45° hace que su diagonal (136px para 96px de lado)
         se salga del hueco y las puntas se cortaban. Aqui la caja mide lo que
         mide la diagonal y el rombo es un pseudo-elemento dentro. */
      .why-icon {
        position:relative; overflow:visible !important;
        width:120px !important; height:120px !important;
        display:flex !important; align-items:center; justify-content:center;
        background:transparent !important; border:none !important;
        border-radius:0 !important; box-shadow:none !important;
        transform:none !important; margin:0 0 1.4rem !important; }
      .why-icon::before {
        content:""; position:absolute; inset:18px;
        background:#f1eefb; border-radius:16px;
        transform:rotate(45deg); transition:background .2s ease; }
      .why-card:hover .why-icon::before { background:#e5dffa; }
      .why-icon svg {
        position:relative; z-index:1;
        transform:none !important; width:38px !important; height:38px !important; }

      /* que nada de la tarjeta recorte las puntas */
      .why-card, .why-grid { overflow:visible !important; }

      .why-title {
        grid-column:auto; margin:0 0 .3rem !important;
        font-size:.88rem !important; font-weight:700; line-height:1.3;
        color:#1d172b; }
      .why-desc {
        grid-column:auto; margin:0 !important;
        font-size:.78rem !important; line-height:1.5; color:#6e667a; }
      /* el detalle largo hacia la seccion se iba de alto: fuera */
      .why-extra, .why-expand-hint { display:none !important; }

      @media (max-width: 1100px) { .why-grid { grid-template-columns:repeat(3,1fr) !important; } }
      @media (max-width: 620px) {
        .why-grid { grid-template-columns:repeat(2,1fr) !important; gap:1.6rem .8rem; }
        .why-icon { width:98px !important; height:98px !important; margin-bottom:1.1rem !important; }
        .why-icon::before { inset:15px; }
        .why-icon svg { width:30px !important; height:30px !important; }
      }

      /* ============ PREGUNTAS FRECUENTES ============ */
      .faq-grid { align-items:start; }
    

      /* ============ LOS MAS VENDIDOS: TARJETAS MAS GRANDES ============ */
      .er_tops { gap:1.5rem !important; padding-bottom:.4rem; }

      .er_tops .er_top_c {
        flex:0 0 250px !important; width:250px !important;
        border-radius:16px; padding:.9rem .9rem 1.1rem;
        transition:transform .18s ease, box-shadow .18s ease; }
      .er_tops .er_top_c:hover {
        transform:translateY(-4px);
        box-shadow:0 14px 30px rgba(29,23,43,.12); }

      .er_tops .er_top_img {
        display:block !important;
        width:100% !important; height:230px !important;
        border-radius:12px; overflow:hidden; }
      .er_tops .er_top_img img {
        width:100% !important; height:100% !important;
        object-fit:contain !important; }

      .er_tops .er_top_n {
        font-size:.95rem !important; line-height:1.4; margin-top:.7rem; }
      .er_tops .er_top_p {
        font-size:1.1rem !important; font-weight:800; margin-top:.35rem; }

      @media (max-width: 991.98px) {
        .er_tops .er_top_c { flex:0 0 205px !important; width:205px !important; }
        .er_tops .er_top_img { height:190px !important; }
      }
      @media (max-width: 560px) {
        .er_tops { gap:1rem !important; }
        .er_tops .er_top_c { flex:0 0 168px !important; width:168px !important; }
        .er_tops .er_top_img { height:158px !important; }
        .er_tops .er_top_n { font-size:.86rem !important; }
        .er_tops .er_top_p { font-size:1rem !important; }
      }
    

      .er_sec:has(.er_tops) { display:none !important; }
    

      /* ============ BOTONES MAS REFINADOS (ref. Ambar Jewelry) ============
         Se toca solo FORMA y TIPOGRAFIA. Colores de marca intactos. */
      .btn-y, .btn-wa, .btn-primary:not(.rounded-circle), .btn-outline-primary:not(.rounded-circle), .qs_btn, .er_pie_wa, .o_wsale_product_btn_primary {
        border-radius: 10px !important;
        font-weight: 650 !important;
        letter-spacing: .15px !important;
        padding: 10px 22px !important;
        transition: transform .15s ease, filter .15s ease, box-shadow .15s ease; }

      .btn-y, .btn-wa, .btn-primary:not(.rounded-circle), .btn-outline-primary:not(.rounded-circle), .qs_btn, .er_pie_wa, .o_wsale_product_btn_primary:hover {
        transform: translateY(-1px);
        filter: brightness(1.04);
        box-shadow: 0 6px 16px rgba(29,23,43,.14); }

      /* refuerzo con ID: gana a la vista 6929 (3 clases + !important) en la rejilla */
      #products_grid .o_wsale_product_btn_primary.btn-primary, #products_grid a.btn-primary, #products_grid button.btn-primary {
        border-radius: 10px !important;
        font-weight: 650 !important;
        letter-spacing: .15px !important;
        padding: 10px 22px !important; }

      /* refuerzo 2 IDs: "Agregar al carrito" de la ficha, para que quede igual de
         cuadrado que "lista de deseos" y "Comprar ahora" que tiene al lado */
      #add_to_cart.btn, #product_detail #add_to_cart.btn, .js_main_product #add_to_cart.btn {
        border-radius: 10px !important;
        font-weight: 650 !important;
        letter-spacing: .15px !important; }

      /* los botones de icono siguen circulares, sin tocar */
    

      /* ============ CUADRICULA Y ETIQUETAS REFINADAS ============
         Continua la linea de la vista 6949 (botones premium). */

      #products_grid .oe_product {
        --er-morado:#490AA0; --er-tinta:#141018;
        --er-suave:#8b86a0; --er-linea:#ece9f3; }

      /* --- contenedor real: agrupa la tarjeta, antes todo flotaba suelto --- */
      #products_grid .oe_product .o_wsale_product_grid_wrapper {
        background:#fff !important;
        border:1px solid var(--er-linea) !important;
        border-radius:14px !important;
        padding:10px !important;
        box-shadow:0 1px 2px rgba(29,23,43,.04) !important;
        height:100%;
        transition:box-shadow .18s ease, border-color .18s ease, transform .18s ease; }
      #products_grid .oe_product:hover .o_wsale_product_grid_wrapper {
        border-color:#d9d3e8 !important;
        box-shadow:0 8px 22px rgba(29,23,43,.09) !important;
        transform:translateY(-2px); }

      /* --- imagen: sin fondo ni marco propio.
         Antes tenia un tinte gris que, ya con el borde de la tarjeta, creaba un
         "marco dentro de marco". Con contenedor blanco, la foto va sin caja. --- */
      #products_grid .oe_product .oe_product_image_link {
        border-radius:10px !important;
        background:transparent !important; border:none !important;
        overflow:hidden; }
      #products_grid .oe_product .oe_product_image {
        background:transparent !important; border:none !important; }

      /* --- ORDEN DE LECTURA: imagen -> marca -> nombre -> precio -> boton ---
         ⚠️ .o_wsale_product_info_attributes_wrapper (el bloque de marca+nombre)
         es display:contents, o sea NO genera caja: su propio "order" se ignora
         por completo. El que de verdad ordena es su hijo
         .o_wsale_product_information_text, que Odoo deja en order:4. Poner el
         order en el wrapper no hace absolutamente nada -- hay que ponerlo en
         el hijo. */
      #products_grid .oe_product .o_wsale_product_information_text {
        order:0 !important; }
      #products_grid .oe_product .o_wsale_product_sub { order:1 !important; }
      #products_grid .oe_product .product_price {
        order:0 !important; margin:.3rem 0 0 0 !important; }
      #products_grid .oe_product .o_wsale_product_btn {
        order:1 !important; margin:.6rem 0 0 0 !important; }

      /* --- marca: discreta, ya no compite con el nombre --- */
      #products_grid .oe_product .o_wsale_item_brand {
        font-size:.67rem !important; font-weight:600 !important;
        color:var(--er-suave) !important; letter-spacing:.07em !important;
        margin:0 0 .15rem 0 !important; }

      /* --- nombre: protagonista tipografico, tinta oscura --- */
      #products_grid .oe_product .o_wsale_products_item_title {
        font-size:.85rem !important; font-weight:500 !important;
        color:var(--er-tinta) !important; line-height:1.35 !important;
        height:2.7em !important; margin:0 !important; }

      /* --- precio: LA voz fuerte de la tarjeta, pero 700 en vez de 900 --- */
      #products_grid .oe_product .product_price .oe_currency_value,
      #products_grid .oe_product .product_price .fw-bold {
        font-size:1.08rem !important; font-weight:700 !important;
        color:var(--er-morado) !important; letter-spacing:-.01em !important; }

      /* --- boton: compacto otra vez (la 6949 lo habia inflado a 10px 22px) --- */
      #products_grid .oe_product .o_wsale_product_btn_primary {
        padding:.45rem 1rem !important;
        font-size:.78rem !important; font-weight:600 !important;
        letter-spacing:.02em !important; border-radius:10px !important;
        box-shadow:none !important; }
      #products_grid .oe_product:hover .o_wsale_product_btn_primary {
        box-shadow:0 4px 12px rgba(55,26,148,.22) !important; }

      /* --- corazon: alineado con la etiqueta ahora que hay padding --- */
      #products_grid .oe_product .o_add_wishlist {
        top:18px !important; right:18px !important;
        box-shadow:0 1px 4px rgba(29,23,43,.10) !important; }

      /* ============ ETIQUETA (chip esmerilado) ============
         El span trae el color en su atributo style= -> hace falta !important.
         (ojo: no escribir etiquetas HTML entre signos de menor/mayor ni siquiera
          en un comentario CSS -- el parser XML las lee como etiquetas de verdad) */
      #products_grid .oe_product .o_wsale_badge,
      #o_wsale_product_details_content .o_wsale_badge,
      .o_wsale_product_page .o_wsale_badge,
      #product_detail .o_wsale_badge {
        top:10px !important; left:10px !important; right:auto !important;
        border-radius:6px !important;
        padding:.26rem .5rem !important;
        font-size:.62rem !important;
        font-weight:700 !important;
        letter-spacing:.08em !important;
        text-transform:uppercase !important;
        line-height:1.25 !important;
        background:rgba(255,255,255,.94) !important;
        color:var(--er-morado, #490AA0) !important;
        border:1px solid rgba(55,26,148,.16) !important;
        box-shadow:0 1px 3px rgba(29,23,43,.07) !important;
        -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }

      /* --- movil: mas compacto --- */
      @media (max-width: 991.98px) {
        #products_grid .oe_product .o_wsale_product_grid_wrapper {
          border-radius:12px !important; padding:8px !important; }
        #products_grid .oe_product .product_price .oe_currency_value,
        #products_grid .oe_product .product_price .fw-bold {
          font-size:1rem !important; }
        #products_grid .oe_product .o_wsale_products_item_title {
          font-size:.8rem !important; }
        #products_grid .oe_product .o_wsale_product_btn_primary {
          padding:.42rem .8rem !important; font-size:.74rem !important; }
        #products_grid .oe_product .o_add_wishlist {
          top:14px !important; right:14px !important; }
        #products_grid .oe_product .o_wsale_badge {
          top:8px !important; left:8px !important;
          font-size:.58rem !important; padding:.22rem .42rem !important; }
      }

      @media (prefers-reduced-motion: reduce) {
        #products_grid .oe_product .o_wsale_product_grid_wrapper { transition:none; }
        #products_grid .oe_product:hover .o_wsale_product_grid_wrapper {
          transform:none; }
      }
    

      /* ============ FRANJA DE POLITICAS EN LA FICHA ============ */
      .er_pol { margin-top:1.1rem; }
      .er_pol_fila {
        padding:.7rem 0;
        border-top:1px solid #ece9f3; }
      .er_pol_fila:first-child { border-top:1px solid #ece9f3; }
      .er_pol_t {
        display:block;
        font-size:.63rem; font-weight:700;
        letter-spacing:.11em; text-transform:uppercase;
        color:#371a94; margin:0 0 .18rem 0; line-height:1.3; }
      .er_pol_d {
        display:block;
        font-size:.83rem; font-weight:400;
        color:#56516b; line-height:1.45; }
      .er_pol_terms {
        display:inline-block; margin-top:.85rem;
        font-size:.78rem; color:#8b86a0;
        text-decoration:underline; text-underline-offset:2px; }
      .er_pol_terms:hover { color:#371a94; }
      /* el bloque viejo de Odoo se va: se reemplaza por esta franja */
      .o_wsale_product_details_content_section_cta small.text-muted.er_pol_off {
        display:none !important; }
      /* ⚠️ 2026-08-13: NO basta con la clase que pone el JS. Si Odoo vuelve a
         pintar ese "small" DESPUES de que la franja ya existe, `pinta()` sale
         por el guard `if (cta.querySelector('.er_pol')) return;` y el bloque
         nuevo se queda SIN la clase -> reaparecian "Terminos y condiciones"
         duplicado, "Grantia de devolucion de 30 dias" (con la errata) y
         "Envio: 2-3 dias habiles". Se oculta por estructura, que no depende
         del orden de render: es hijo DIRECTO del bloque de compra y todo su
         contenido ya lo dice la franja de arriba. */
      .o_wsale_product_details_content_section_cta > small.text-muted {
        display:none !important; }
    

      /* ============ PIE MAS ORDENADO (se mantiene el amarillo) ============ */

      /* --- titulos de columna: etiquetas, no protagonistas --- */
      .er_pie_in h4 {
        font-size:.68rem !important;
        font-weight:700 !important;
        letter-spacing:.14em !important;
        text-transform:uppercase !important;
        color:rgba(46,6,104,.55) !important;
        margin:0 0 .85rem 0 !important;
        line-height:1.3 !important; }

      /* --- enlaces: ritmo vertical constante ---
         ⚠️ display:block, NO inline-block: los enlaces del pie no viven en una
         lista, son hermanos sueltos dentro del div de la columna. Con
         inline-block fluyen en linea y "Inicio Tienda Quienes somos" salen todos
         pegados en el mismo renglon. width:fit-content deja el area de hover del
         ancho del texto y no de toda la columna. */
      .er_pie_in a {
        display:block;
        width:fit-content;
        font-size:.85rem !important;
        font-weight:500 !important;
        color:rgba(46,6,104,.82) !important;
        line-height:1.35 !important;
        padding:.24rem 0 !important;
        text-decoration:none !important;
        transition:color .15s ease, transform .15s ease; }
      .er_pie_in a:hover {
        color:#2E0668 !important;
        transform:translateX(2px); }

      /* --- bloque de marca: texto mas legible y contenido --- */
      .er_pie_marca p {
        font-size:.85rem !important;
        line-height:1.55 !important;
        color:rgba(46,6,104,.78) !important;
        max-width:34ch; }
      .er_pie_marca img { margin-bottom:.9rem !important; }

      /* --- direccion y telefono --- */
      .er_pie_dir, .er_pie_dir div {
        font-size:.85rem !important;
        line-height:1.55 !important;
        color:rgba(46,6,104,.78) !important; }
      .er_pie_tel {
        display:inline-block !important;
        margin-top:.6rem !important;
        font-weight:600 !important;
        font-size:.85rem !important;
        color:rgba(46,6,104,.9) !important;
        text-decoration:none !important; }
      .er_pie_tel:hover { color:#2E0668 !important; }

      /* --- separador antes del bloque legal --- */
      .er_pie_base {
        border-top:1px solid rgba(46,6,104,.16) !important;
        margin-top:1.6rem !important;
        padding-top:1.1rem !important;
        font-size:.76rem !important;
        letter-spacing:.02em !important;
        color:rgba(46,6,104,.62) !important; }

      /* --- fuera el credito de Odoo, se conserva el (c) de El Rey --- */
      .o_footer_copyright .o_not_editable,
      .o_footer_copyright div:has(> a[href*="odoo.com"]),
      .o_footer_copyright a[href*="odoo.com"] { display:none !important; }

      @media (max-width: 767.98px) {
        .er_pie_in h4 { margin-bottom:.6rem !important; }
        .er_pie_in a { padding:.3rem 0 !important; }
      }

      @media (prefers-reduced-motion: reduce) {
        .er_pie_in a { transition:none; }
        .er_pie_in a:hover { transform:none; }
      }
    

      /* ============ BOTON DE MAYOREO POR WHATSAPP (ficha) ============ */
      .er_mayoreo {
        display:flex !important; align-items:center; justify-content:center;
        gap:.5rem;
        width:100%; margin-top:.75rem;
        padding:10px 22px;
        border:1px solid #25D366;
        border-radius:10px;
        background:transparent;
        color:#128C4A !important;
        font-size:.88rem; font-weight:650; letter-spacing:.15px;
        text-decoration:none !important;
        transition:background .15s ease, color .15s ease, box-shadow .15s ease; }
      .er_mayoreo:hover {
        background:#25D366;
        color:#fff !important;
        box-shadow:0 6px 16px rgba(37,211,102,.28); }
      .er_mayoreo svg { flex:0 0 auto; }
      .er_mayoreo .er_may_sub {
        font-weight:500; opacity:.75; }

      @media (max-width: 575.98px) {
        .er_mayoreo { font-size:.82rem; padding:10px 14px; }
        .er_mayoreo .er_may_sub { display:none; }
      }

      /* ⚠️ NO poner padding-bottom en .o_wsale_product_details_content_section_cta
         para "despejar" la barra fija de compra. Se probo con 5.5rem y quedo un
         HUECO enorme entre "Terminos y condiciones" y "Caracteristicas": esa
         seccion NO es la ultima de la ficha, tiene descripcion y especificaciones
         debajo, asi que el relleno se ve como un vacio a media pagina.
         Ademas no arreglaba nada: la barra es fixed y tapa lo que quede debajo
         sin importar el relleno. Se midio con elementFromPoint que NINGUN boton
         queda atrapado -- todos se pueden desplazar por encima y todos reciben
         el clic. El traslape al desplazarse es el comportamiento normal de una
         barra fija, y la barra tiene fondo solido, borde y sombra, asi que el
         contenido pasa DETRAS y no se ve roto. */

      @media (prefers-reduced-motion: reduce) {
        .er_mayoreo { transition:none; }
      }
    

      /* ============ SUGERENCIAS DEL BUSCADOR (cabecera) ============ */
      .er_buscar { position:relative; }

      .er_sug {
        position:absolute; z-index:3000;
        top:calc(100% + 8px); left:0; right:0;
        background:#fff;
        border:1px solid #e7e4f0;
        border-radius:12px;
        box-shadow:0 12px 34px rgba(29,23,43,.16);
        overflow:hidden;
        max-height:min(70vh, 460px); overflow-y:auto; }

      .er_sug_it {
        display:flex; align-items:center; gap:.7rem;
        padding:.55rem .8rem;
        text-decoration:none !important;
        border-bottom:1px solid #f4f2f8;
        transition:background .12s ease; }
      .er_sug_it:last-child { border-bottom:none; }
      .er_sug_it:hover, .er_sug_it.er_on { background:#f7f5fc; }

      .er_sug_img {
        flex:0 0 auto; width:40px; height:40px;
        object-fit:contain; border-radius:8px; background:#faf9fc; }

      .er_sug_tx { flex:1 1 auto; min-width:0; }
      .er_sug_nm {
        display:block; font-size:.84rem; font-weight:500; color:#141018;
        line-height:1.3;
        overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
      .er_sug_nm .text-primary-emphasis {
        color:#490AA0 !important; font-weight:700; }
      .er_sug_ref {
        display:block; font-size:.68rem; color:#8b86a0;
        letter-spacing:.04em; margin-top:.05rem; }

      .er_sug_pr {
        flex:0 0 auto; font-size:.86rem; font-weight:700; color:#490AA0;
        white-space:nowrap; }

      .er_sug_todos {
        display:block; padding:.6rem .8rem;
        background:#faf9fc; border-top:1px solid #ece9f3;
        font-size:.78rem; font-weight:600; color:#490AA0;
        text-align:center; text-decoration:none !important; }
      .er_sug_todos:hover { background:#f2eefb; }

      .er_sug_vacio {
        padding:.9rem .8rem; font-size:.83rem; color:#8b86a0; text-align:center; }

      @media (max-width: 767.98px) {
        .er_sug { max-height:60vh; }
        .er_sug_img { width:34px; height:34px; }
        .er_sug_nm { font-size:.8rem; }
      }
    

      /* ============ FILTROS DE TIENDA REFINADOS ============ */

      /* --- chips de categoria: de pildora de 56px a ficha de 10px --- */
      .o_wsale_filmstrip_item {
        border-radius:10px !important;
        border:1px solid #e7e4f0 !important;
        background:#fff !important;
        padding:.5rem 1rem !important;
        min-height:0 !important;
        font-size:.84rem !important;
        font-weight:600 !important;
        letter-spacing:.01em !important;
        color:#141018 !important;
        /* ⚠️ nowrap: la tira es .o_wsale_filmstrip con align-items:stretch, asi
           que TODOS los chips crecen hasta el mas alto. Como "Salsas, Aderezos y
           Sazonadores" partia en dos lineas, la fila entera quedaba en 58px
           aunque el resto fuera de una linea. Con nowrap ninguno parte y la fila
           baja a ~34px. La tira ya desplaza en horizontal, no se pierde nada. */
        white-space:nowrap !important;
        transition:border-color .15s ease, color .15s ease, box-shadow .15s ease; }
      /* ⚠️ El span de dentro viene display:flex con height:40px CLAVADO, o sea
         dos renglones de 20.16px reservados aunque el texto ocupe uno. Ese era
         el verdadero motivo de los 58px de alto, no el ajuste de linea: poner
         nowrap en el chip no servia de nada mientras el hijo midiera 40px. */
      .o_wsale_filmstrip_item > span {
        display:block !important;
        height:auto !important;
        min-height:0 !important;
        line-height:1.35 !important; }
      /* el div de imagen del chip va vacio (las categorias no tienen foto aqui) */
      .o_wsale_filmstrip_item .o_wsale_filmstrip_image:empty { display:none !important; }

      .o_wsale_filmstrip_link { text-decoration:none !important; }
      .o_wsale_filmstrip_link:hover .o_wsale_filmstrip_item {
        border-color:#490AA0 !important;
        color:#490AA0 !important;
        box-shadow:0 3px 10px rgba(29,23,43,.07) !important; }
      .o_wsale_filmstrip { gap:.5rem !important; }

      /* --- titulos de la barra lateral: etiquetas, no protagonistas --- */
      #products_grid_before .o_categories_collapse_title,
      #products_grid_before .accordion-button,
      #products_grid_before h5, #products_grid_before h6 {
        font-size:.72rem !important;
        font-weight:700 !important;
        text-transform:uppercase !important;
        letter-spacing:.09em !important;
        color:#8b86a0 !important; }

      /* --- enlaces de categoria --- */
      #products_grid_before a {
        font-size:.84rem !important;
        color:#56516b !important;
        text-decoration:none !important;
        transition:color .15s ease; }
      #products_grid_before a:hover { color:#490AA0 !important; }

      /* --- etiquetas de marca --- */
      #products_grid_before .form-check-label {
        font-size:.82rem !important;
        color:#56516b !important; }
      #products_grid_before .form-check-input:checked {
        background-color:#490AA0 !important;
        border-color:#490AA0 !important; }

      /* --- campos: el mismo radio que todo lo demas --- */
      #products_grid_before input.form-control,
      #products_grid_before .o_wsale_attribute_search_bar,
      .products_header input.form-control,
      .products_header .o_searchbar_form input {
        border-radius:10px !important;
        border-color:#e7e4f0 !important;
        font-size:.84rem !important; }

      /* --- Ordenar por --- */
      .products_header .dropdown-toggle,
      .o_sortby_dropdown .dropdown-toggle {
        border-radius:10px !important;
        font-size:.84rem !important; }
      .products_header .dropdown-menu,
      .o_sortby_dropdown .dropdown-menu {
        border-radius:10px !important;
        border:1px solid #e7e4f0 !important;
        box-shadow:0 12px 30px rgba(29,23,43,.13) !important;
        font-size:.84rem !important; }

      @media (max-width: 991.98px) {
        .o_wsale_filmstrip_item {
          padding:.42rem .8rem !important;
          font-size:.78rem !important; }
      }

      @media (prefers-reduced-motion: reduce) {
        .o_wsale_filmstrip_item, #products_grid_before a { transition:none; }
      }
    

      /* ============ NOTA DE PRECIO UNITARIO EN LA FICHA ============ */
      .er_pxq {
        display:inline-block; margin-left:.45rem;
        font-size:.72rem; font-weight:600; color:#8b86a0;
        white-space:nowrap; vertical-align:middle; }
      .er_pxq.er_pxq_baja { color:#128C4A; }

      /* ⚠️ En movil el bloque del precio ES la barra fija de compra (vista 6920),
         y ahi solo caben el importe y el boton. La nota se salia por debajo y se
         EMPALMABA con el boton "Agregar al carrito" y con la linea propia de Odoo
         ("2 x Paquete con 50 Unidades"). Se oculta en la barra: esa linea de Odoo
         ya dice la cantidad y la unidad, asi que la nota no aporta nada ahi.
         En escritorio, donde el precio va en su sitio normal, se conserva. */
      @media (max-width: 991.98px) {
        .er_pxq { display:none !important; }
      }
    

      /* ============ CANTIDAD DISPONIBLE EN SUCURSAL ============ */
      .er_exist {
        font-weight:600; color:#128C4A; white-space:nowrap; }
      .er_exist_sep { color:#b9b4c7; margin:0 .3rem; }
      .er_exist_bajo { color:#B45309; }
    

      /* ============ AHORRO EN EL CARRITO / CHECKOUT ============ */
      .er_ahorro {
        display:flex; align-items:center; gap:.5rem;
        width:100%; box-sizing:border-box; min-width:0;
        margin:.6rem 0 0 0; padding:.6rem .75rem;
        background:#e8f7ee; border:1px solid #b9e6cb; border-radius:10px; }
      .er_ahorro_ico { flex:0 0 auto; font-size:1rem; line-height:1; }
      .er_ahorro_tx { flex:1 1 auto; font-size:.8rem; color:#0f5132; line-height:1.35; }
      .er_ahorro_tx strong { font-weight:700; }
      .er_ahorro_mo { flex:0 0 auto; font-size:.95rem; font-weight:700; color:#128C4A;
                      white-space:nowrap; }
      .er_ahorro_linea {
        display:block; margin-top:.15rem;
        font-size:.72rem; font-weight:600; color:#128C4A; }

      /* renglon aparte para los puntos: NO es dinero ahorrado hoy */
      .er_puntos {
        display:flex; align-items:center; gap:.5rem;
        width:100%; box-sizing:border-box; min-width:0;
        margin:.4rem 0 0 0; padding:.5rem .75rem;
        background:#fffbea; border:1px solid #f5e3a3; border-radius:10px; }
      .er_puntos_tx { flex:1 1 auto; font-size:.78rem; color:#6b5a12; line-height:1.35; }
      .er_puntos_mo { flex:0 0 auto; font-size:.9rem; font-weight:700; color:#8a6d0b;
                      white-space:nowrap; }

      /* gancho para invitados: el cashback como razon para crear cuenta */
      .er_registro { display:block; width:100%; box-sizing:border-box;
        margin:.4rem 0 0 0; padding:.6rem .75rem;
        background:#f4f0ff; border:1px solid #d9d0f5; border-radius:10px;
        text-decoration:none !important; transition:border-color .15s ease; }
      .er_registro:hover { border-color:#490AA0; }
      .er_registro_t { display:block; font-size:.8rem; font-weight:700; color:#2E0668;
        line-height:1.35; }
      .er_registro_s { display:block; margin-top:.1rem; font-size:.72rem; color:#6b5a8f; }
    

      /* ============ EASTER EGG: EL REY APUNTA AL BOTON DE PAGO ============
         Miguel pidio moverlo "del otro lado" y que "salga de un costado de la
         pantalla". Ahora entra DESLIZANDOSE desde el borde DERECHO, se queda
         debajo del boton y apunta hacia arriba, hacia "Finalizar compra".
         Se usa la pose de brazo levantado en las dos medidas: es la unica que
         senala el boton desde abajo. */
      /* ⚠️ EN FLUJO, NO ABSOLUTO. La version absoluta (top:100% del padre del
         boton) se veia bien en pruebas pero a Miguel NO le aparecia en su
         telefono: cualquier ancestro con overflow o un contenedor de altura
         fija lo recorta sin dejar rastro. Como bloque normal despues del boton
         no hay nada que lo pueda ocultar: ocupa su propio espacio. */
      .er_huevo_rey {
        display:block; width:100%;
        margin:.35rem 0 0 0;
        text-align:right;
        pointer-events:none;            /* decorativo: nunca estorba el clic */
        overflow:hidden; }
      .er_huevo_rey img {
        display:inline-block; width:96px; height:auto;
        margin-right:-4px;
        /* ⚠️ SIN drop-shadow. El recorte deja pixeles de alfa muy baja en el
           borde y la sombra se proyecta desde CADA UNO, lo que se percibia como
           un recuadro gris tenue alrededor del personaje. Sin sombra queda
           limpio; el personaje ya destaca por si solo sobre el fondo blanco. */
        animation:er_rey_entra_lado .8s cubic-bezier(.2,1.35,.45,1) both,
                  er_rey_insiste 3.2s ease-in-out 1.3s infinite; }

      /* entra desde FUERA de la pantalla, por la derecha */
      @keyframes er_rey_entra_lado {
        from { opacity:0; transform:translateX(120px); }
        to   { opacity:1; transform:translateX(0); } }
      @keyframes er_rey_insiste {
        0%,86%,100% { transform:translateY(0) rotate(0deg); }
        91%         { transform:translateY(-4px) rotate(-2deg); }
        96%         { transform:translateY(0) rotate(0deg); } }

      @media (max-width: 1199.98px) { .er_huevo_rey img { width:78px; } }
      @media (max-width: 380px)     { .er_huevo_rey img { width:66px; } }

      /* ============ EL BOTON DE PAGO RESPONDE AL GESTO ============ */
      .er_pago_vivo {
        position:relative; overflow:hidden;
        animation:er_pago_late 3.2s ease-in-out 1.8s infinite; }
      .er_pago_vivo::after {
        content:''; position:absolute; top:0; left:-55%;
        width:40%; height:100%;
        background:linear-gradient(100deg, transparent,
                   rgba(255,255,255,.38), transparent);
        transform:skewX(-18deg);
        pointer-events:none;         /* el destello NUNCA se come el clic */
        animation:er_pago_brillo 3.2s ease-in-out 1.8s infinite; }
      @keyframes er_pago_late {
        0%,82%,100% { transform:scale(1);
                      box-shadow:0 4px 14px rgba(55,26,148,.22); }
        88%         { transform:scale(1.028);
                      box-shadow:0 9px 24px rgba(55,26,148,.40); }
        94%         { transform:scale(1.008); } }
      @keyframes er_pago_brillo {
        0%,70%   { left:-55%; }
        95%,100% { left:120%; } }
      .er_pago_vivo:hover { animation:none; transform:translateY(-1px); }
      .er_pago_vivo:hover::after { animation:none; opacity:0; }

      /* ============ CARRITO: PILDORA DE EMBALAJE Y CANTIDAD ============
         La pildora venia radio 999px, morado solido y amarillo peso 900 -- la
         version chillona que ya se habia calmado en la tarjeta de producto.
         Se alinea con el chip refinado: blanco, tinta morada, radio 6px. */
      .o_cart_product .badge {
        border-radius:6px !important;
        background:#f4f2fa !important;
        color:#490AA0 !important;
        border:1px solid #e2dcf3 !important;
        font-size:.62rem !important;
        font-weight:700 !important;
        letter-spacing:.08em !important;
        text-transform:uppercase !important;
        padding:.26rem .5rem !important; }

      /* el selector de cantidad: mismo lenguaje de 10px del resto */
      .o_cart_product .css_quantity {
        border:1px solid #e7e4f0 !important;
        border-radius:10px !important;
        overflow:hidden; background:#fff; }
      .o_cart_product .css_quantity .btn,
      .o_cart_product .css_quantity a {
        border:0 !important; border-radius:0 !important;
        color:#490AA0 !important; background:transparent !important; }
      .o_cart_product .css_quantity .btn:hover,
      .o_cart_product .css_quantity a:hover { background:#f4f2fa !important; }
      .o_cart_product .css_quantity input {
        border:0 !important; box-shadow:none !important;
        font-weight:700 !important; color:#141018 !important;
        font-size:.88rem !important;
        max-width:52px !important; text-align:center !important;
        padding:0 !important; }
      /* mas compacto: la pastilla era enorme para tres caracteres */
      .o_cart_product .css_quantity {
        width:fit-content !important; max-width:150px; }
      .o_cart_product .css_quantity .btn,
      .o_cart_product .css_quantity a {
        width:34px !important; min-width:34px !important;
        padding:.28rem 0 !important; font-size:.95rem !important; }

      @media (prefers-reduced-motion: reduce) {
        .er_huevo_rey, .er_huevo_rey img,
        .er_pago_vivo, .er_pago_vivo::after { animation:none; }
      }
    

      /* ============ EASTER EGG: EL CAMION ACELERA ============ */
      .er_escena { cursor:default; }

      /* ⚠️ solo la DURACION: reasignar la animacion reiniciaria el recorrido
         y el camion saltaria al inicio de golpe. */
      .er_camion {
        transition:animation-duration .25s linear, transform .25s ease; }

      .er_escena:hover .er_camion {
        animation-duration:4s !important; }
      .er_escena:hover .er_camion img {
        transform:rotate(-3deg) translateY(-2px);
        transition:transform .25s cubic-bezier(.2,1.3,.5,1); }

      /* estela de velocidad, solo mientras acelera */
      .er_camion::before,
      .er_camion::after {
        content:''; position:absolute; right:100%;
        height:3px; border-radius:3px;
        background:linear-gradient(90deg, transparent, rgba(255,212,38,.85));
        opacity:0; pointer-events:none;
        transition:opacity .2s ease, width .25s ease;
        width:0; }
      .er_camion::before { top:38%; }
      .er_camion::after  { top:58%; }
      .er_escena:hover .er_camion::before { opacity:1; width:64px; }
      .er_escena:hover .er_camion::after  { opacity:.7; width:42px;
                                            transition-delay:.06s; }

      /* ⚠️ sin raton no se dispara: el pie es zona de enlaces y un toque ahi
         es para navegar, no para jugar */
      @media (hover: none) {
        .er_escena:hover .er_camion { animation-duration:17s !important; }
        .er_escena:hover .er_camion img { transform:none; }
        .er_escena:hover .er_camion::before,
        .er_escena:hover .er_camion::after { opacity:0; width:0; }
      }

      @media (prefers-reduced-motion: reduce) {
        .er_escena:hover .er_camion { animation-duration:17s !important; }
        .er_escena:hover .er_camion img { transform:none; }
        .er_camion::before, .er_camion::after { display:none; }
      }
    

      /* ============ AREA SEGURA (NOTCH) EN HORIZONTAL ============ */
      /* el contenido respeta la muesca... */
      #wrapwrap > main,
      #wrapwrap > header,
      #wrapwrap > footer,
      .er_pie_in, .o_footer_copyright {
        padding-left:env(safe-area-inset-left, 0px);
        padding-right:env(safe-area-inset-right, 0px); }

      /* ...pero los FONDOS llegan de borde a borde */
      #wrapwrap > header, #wrapwrap > footer,
      .er_pie, .er_escena { width:100%; }

      /* la barra fija de compra tambien */
      div[name="product_price_container"] {
        padding-left:calc(16px + env(safe-area-inset-left, 0px)) !important;
        padding-right:calc(16px + env(safe-area-inset-right, 0px)) !important; }

      /* el flotante de WhatsApp no debe quedar bajo la muesca */
      #wa-float {
        margin-right:env(safe-area-inset-right, 0px);
        margin-bottom:env(safe-area-inset-bottom, 0px); }
    

      /* ============ UNIDAD JUNTO AL PRECIO ============ */
      .er_um_precio {
        display:inline-block; margin-left:.08rem;
        font-family:'Inter',sans-serif; font-size:.68rem; font-weight:600;
        letter-spacing:-.005em; color:#787574;
        vertical-align:baseline; white-space:nowrap; }
      @media (max-width:575.98px) { .er_um_precio { font-size:.64rem; } }
    

      /* ============ TOP VENTAS ============
         ⚠️ Sobre amarillo el texto va MORADO: blanco sobre amarillo no se lee.
         Es la regla del sistema de marca y aqui aplica literal. */
      .er_top_chip {
        display:inline-flex; align-items:center; gap:.22rem;
        margin:.3rem 0 .1rem; padding:.16rem .5rem;
        background:#FFD426; color:#490AA0;
        border-radius:9999px;
        font-family:'Inter',sans-serif; font-size:.62rem; font-weight:700;
        letter-spacing:.02em; text-transform:uppercase; line-height:1.5;
        white-space:nowrap; }
      .er_top_chip_ficha { font-size:.68rem; margin-bottom:.5rem; }
      @media (max-width:575.98px) { .er_top_chip { font-size:.58rem; } }
    

      /* ====== VENDIDAS ESTE MES — pastilla de la tarjeta ======
         La linea reserva su altura aunque el producto no tenga dato: si no,
         las tarjetas de una misma fila quedan de alturas distintas. */
      /* ⚠️ `min-width:0` TAMBIEN AQUI. `.o_wsale_product_information` es un flex
         en columna, y un item flex no encoge por debajo de su contenido
         (`min-width:auto`). Sin esto el contenedor se quedaba clavado en 149px
         aunque la tarjeta bajara a 130px, y la pastilla se salia por la
         derecha -- que es justo lo que se veia en el movil. */
      /* ⚠️ `align-self:stretch` PORQUE EL PADRE ES `align-items:flex-start`.
         `.o_wsale_product_sub` es un flex en COLUMNA y no estira a sus hijos,
         asi que la pastilla se quedaba en 105px dentro de una tarjeta cuyo
         precio y boton miden 115px, y se veia pequena y descolgada a la
         izquierda. Con stretch ocupa el mismo ancho que el boton. */
      #products_grid .oe_product .er_vendidas {
        min-height:2.7rem; margin:.3rem 0 0 0;
        min-width:0; max-width:100%; align-self:stretch; }
      /* ⚠️ `inline-block`, NO `inline-flex`. Con flex la flecha era hermana de
         los dos renglones y les robaba su ancho A LOS DOS: el segundo,
         "vendidas este mes" (17 caracteres SIEMPRE, es el renglon largo del
         catalogo entero), se quedaba 6px sin sitio. Metida dentro del primer
         renglon, el segundo dispone de la pastilla completa. */
      #products_grid .oe_product .er_v_pill {
        display:block; max-width:100%; text-align:center;
        font-family:'Inter',sans-serif; font-size:.68rem; font-weight:600;
        letter-spacing:-.01em; line-height:1.28;
        color:#490AA0; background:#F2ECFC;
        border:1px solid #E3D8F7; border-radius:9999px;
        padding:.28rem .55rem; }
      #products_grid .oe_product .er_v_pill svg {
        width:12px; height:12px; vertical-align:-.16em; margin-right:.26rem; }
      #products_grid .oe_product .er_v_pill b { font-weight:800; }
      /* ⚠️ NO SE RECORTA CON "...": se PARTE EN DOS RENGLONES.
         El primer intento uso `text-overflow:ellipsis` y en el movil dejaba
         "1,665 unidad..." -- se salvaba el desborde pero se perdia la frase.
         Con dos renglones se lee entera y sigue sin salirse. La altura se
         reserva SIEMPRE (min-height), porque en una misma fila conviven
         "444 kg vendidos este mes" (un renglon) y "19,192 unidades vendidas
         este mes" (dos): sin reserva los botones quedan desalineados. */
      /* ⚠️ EL CORTE ES FORZADO, NO LIBRE. Dejar que el texto fluyera solo
         partia "1,665 unidades vendidas este mes" en TRES renglones en una
         tarjeta de 165px, y como cada producto rompia por un sitio distinto
         las pastillas quedaban de alturas distintas. Aqui la cifra y la
         unidad van arriba, y "vendidas este mes" abajo: SIEMPRE dos
         renglones, misma altura en toda la fila. */
      /* ⚠️ DOS RENGLONES SIEMPRE, EN TODOS LOS ANCHOS. Al principio esto solo
         se aplicaba por debajo de 1400px. Resultado en escritorio: 16 pastillas
         de 24px y 32 de 36px en la misma rejilla, segun si el texto cabia de
         un renglon -- y con eso los botones "Agregar" de una misma fila
         quedaban a distinta altura. Cortando siempre igual, todas miden lo
         mismo y la fila queda a plomo. */
      #products_grid .oe_product .er_v_p1,
      #products_grid .oe_product .er_v_p2 { display:block; }
      /* el renglon 2 es de largo FIJO ("vendidas este mes", 17 caracteres en
         todo el catalogo) y cabe siempre -> nunca se parte */
      #products_grid .oe_product .er_v_p2 { white-space:nowrap; }
      /* el 1 sí puede crecer (cifra + unidad). Hoy el peor caso real es
         "51 dispensadores" y le sobran 20px, pero si algun dia no cupiera
         preferimos que baje de renglon a que se salga de la tarjeta. */
      #products_grid .oe_product .er_v_p1 { overflow-wrap:anywhere; }
      @media (max-width:1399.98px) {
        #products_grid .oe_product .er_v_pill { border-radius:12px; }
      }
      @media (max-width:991.98px) {
        #products_grid .oe_product .er_vendidas { min-height:2.4rem; }
        #products_grid .oe_product .er_v_pill {
          font-size:.62rem; padding:.24rem .48rem; gap:.24rem; }
        #products_grid .oe_product .er_v_pill svg { width:11px; height:11px; margin-right:.22rem; }
      }
      /* ⚠️ POR DEBAJO DE 375px NO CABE "vendidas este mes" (17 caracteres, el
         renglon largo del catalogo). Medido: a 360px la tarjeta baja a 157px
         y una pastilla se iba a TRES renglones; a 320px se desbordaban 11px
         en 34 de 48. Aqui se encoge la letra y, como ultimo recurso, el
         segundo renglon puede partirse: preferimos un renglon de mas a que
         el texto se salga. 375px NO entra en esta regla -- ahi ya cabe. */
      @media (max-width:374.98px) {
        #products_grid .oe_product .er_vendidas { min-height:2.3rem; }
        #products_grid .oe_product .er_v_pill {
          font-size:.58rem; padding:.22rem .36rem; }
        #products_grid .oe_product .er_v_pill svg {
          width:10px; height:10px; margin-right:.18rem; }
        #products_grid .oe_product .er_v_p2 { white-space:normal; }
      }
    

      /* ====== REFERENCIA EN LA TARJETA DE /shop ======
         La altura se reserva SIEMPRE (min-height): 56 productos publicados no
         tienen referencia y sin reserva sus tarjetas quedarian mas cortas que
         las vecinas de la misma fila. */
      #products_grid .oe_product .er_ref_t {
        min-height:1.05rem; margin:.05rem 0 .1rem;
        font-family:'Inter',sans-serif; font-size:.66rem; font-weight:600;
        letter-spacing:.02em; line-height:1.3; color:#8B8598;
        font-variant-numeric:tabular-nums;
        /* ⚠️ que baje de renglon antes que salirse; NUNCA recortar con "..." */
        overflow-wrap:anywhere; }
      #products_grid .oe_product .er_ref_t b {
        font-weight:700; font-size:.88em; letter-spacing:.08em;
        text-transform:uppercase; color:#B3AEBE; }
      /* ⚠️ EN MOVIL SE CAE LA ETIQUETA "Ref.", NO EL CODIGO. Medido a 390px:
         el bloque da 122px, el codigo mas largo del catalogo ocupa 118px
         (cabe), pero con "Ref." delante se va a 140px (no cabe) y el navegador
         partia POR EL GUION -> "AZUCEST-" / "ZULK900". Un codigo partido se
         copia mal contra una factura: es peor que no poner la etiqueta.
         En escritorio el bloque mide ~197px y la etiqueta cabe de sobra. */
      @media (max-width:991.98px) {
        #products_grid .oe_product .er_ref_t { font-size:.62rem; min-height:1rem; }
        #products_grid .oe_product .er_ref_t b { display:none; }
      }
      @media (max-width:374.98px) {
        #products_grid .oe_product .er_ref_t { font-size:.58rem; }
      }
    

      /* ====== El color de la barra del sistema (iOS 26+) ======
         Safari ya no mira `theme-color`: mira el `background-color` del BODY.
         Con el body blanco, la franja del reloj sale BLANCA encima de una
         cabecera morada, y se lee como una separacion.

         ⚠️ VA GLOBAL, NO SOLO EN STANDALONE. Primero se puso dentro de
            `@media (display-mode: standalone)` pensando que era cosa de la app
            instalada. Miguel lo vio en Safari normal tambien ("hay una
            separacion considerable"): es el MISMO mecanismo, el navegador
            tambien pinta esa franja con el color del body.

         ✅ EL BODY NO ASOMA EN NINGUN SITIO. Verificado recorriendo los hijos
            de #wrapwrap en `/` y en `/shop`: cabecera, banda de entrega, main
            (#F2F4F5) y pie cubren el documento entero sin un solo hueco. Lo
            unico que cambia es lo que muestrea el sistema y el rebote al
            arrastrar -- que ademas casa: la cabecera y el pie son los dos
            #2E0668. */
      html, body { background-color:#2E0668; }

      /* ⚠️ menos en el editor del sitio: ahi Miguel edita sobre el lienzo y un
         fondo morado detras confunde. */
      body.editor_enable, body.editor_has_snippets { background-color:#fff; }
    

      /* ============ IDENTIDAD DE MARCA ============
         Tokens oficiales. Unica fuente de verdad del sitio. */
      :root {
        --rey-purple:#490AA0; --rey-purple-deep:#2E0668;
        --rey-yellow:#FFD426; --rey-yellow-warm:#FDB913;
        --rey-white:#FFFFFF;  --rey-ink:#141018;
        --rey-sombra:0 4px 16px rgba(46,6,104,.18);
      }

      /* ---- TIPOGRAFIA ----
         Inter para cuerpo e interfaz. Ya estaba cargada: no anade descargas. */
      body, .o_wsale_products_page, p, li, td, th, input, select, textarea,
      .btn, button, a, label, span, div {
        font-family:'Inter', system-ui, -apple-system, sans-serif; }

      /* Archivo Black para todo lo que sea titular de seccion.
         ⚠️ Solo la FUENTE. Nada de text-transform: los h1 son nombres de
         producto y en mayusculas quedan ilegibles. */
      h1, h2, h3, h4, h5, h6,
      .h1, .h2, .h3, .h4, .h5, .h6 {
        font-family:'Archivo Black', 'Inter', sans-serif !important;
        font-weight:400 !important;
        letter-spacing:-.01em; }

      /* el precio manda: display, como en la señaletica de la tienda */
      .product_price, .oe_currency_value, .o_wsale_product_price_value {
        font-family:'Archivo Black', sans-serif !important; }

      /* ---- COLOR: lo que pinta el TEMA y no pasa por las vistas de El Rey ---- */
      .btn-primary, .btn-primary:not(:disabled) {
        background-color:var(--rey-purple) !important;
        border-color:var(--rey-purple) !important;
        color:var(--rey-white) !important; }
      .btn-primary:hover, .btn-primary:focus {
        background-color:var(--rey-purple-deep) !important;
        border-color:var(--rey-purple-deep) !important; }
      .btn-outline-primary {
        color:var(--rey-purple) !important;
        border-color:var(--rey-purple) !important; }
      .btn-outline-primary:hover {
        background-color:var(--rey-purple) !important;
        color:var(--rey-white) !important; }
      .text-primary, a.text-primary { color:var(--rey-purple) !important; }
      .bg-primary { background-color:var(--rey-purple) !important; }

      /* el amarillo del tema (#FAD60A) al amarillo oficial */
      .bg-warning, .btn-warning, .badge.bg-warning {
        background-color:var(--rey-yellow) !important;
        border-color:var(--rey-yellow) !important; }
      /* ⚠️ Sobre amarillo el texto va MORADO. Blanco sobre amarillo no se lee. */
      .bg-warning, .btn-warning { color:var(--rey-purple) !important; }

      /* ---- SUPERFICIES PLANAS ----
         La marca es plana: sin degradados ni glassmorphism. Se neutraliza
         cualquier degradado que meta el tema en cabecera, pie o botones. */
      header .navbar, #wrapwrap > header, .o_footer, footer,
      .btn-primary, .btn-warning { background-image:none !important; }

      /* sombra unica del sistema, en vez de las cuatro que traia el tema */
      .card, .o_wsale_product_grid_wrapper, .oe_product,
      .o_wsale_er_acc_card { box-shadow:var(--rey-sombra); }

      /* ---- RADIOS ----
         tarjetas 16px · botones 10px (decision de Miguel, 2026-08-14) */
      .card, .oe_product, .o_wsale_er_acc_card { border-radius:16px; }

      /* ---- CONSECUENCIA DEL CAMBIO DE TIPOGRAFIA: la etiqueta se comia el corazon ----
         Inter es mas ancha que la Source Sans Pro que habia. Medido en la tarjeta:
             etiqueta "Envio Nacional"  649 -> 755 px
             corazon de lista de deseos 739 -> 769 px
         Se solapaban 16px, y como el corazon lleva fondo blanco y va encima,
         tapaba el final del texto: se leia "ENVIO NACIONA". No era que el texto
         no cupiera en su caja (cabia): era que la caja invadia el corazon.
         ⚠️ NADA DE `text-overflow: ellipsis`. El primer intento recortaba a
         "ENVIO NACI..." — quitaba el solape pero dejaba la etiqueta sin
         significado, que es peor que el defecto original. Tiene que caber
         ENTERA: se aprieta la letra hasta que entra en el hueco libre.
         ⚠️ Y el hueco se mide, no se estima: el corazon empieza a 99px del
         borde del contenedor. */
      /* ⚠️ ESPECIFICIDAD: el primer intento uso `#products_grid .o_ribbons`
         (1 id + 1 clase) y NO aplicaba, aunque llevaba !important y estaba en
         el HTML. Gana la regla del sitio
         `#products_grid .oe_product .o_wsale_badge` (1 id + 2 clases): entre
         dos !important manda la MAS ESPECIFICA, no la ultima. Misma trampa que
         ya mordio con los botones (6949) y con las pastillas de variante. */
      #products_grid .oe_product .o_ribbons.o_wsale_badge,
      #products_grid .oe_product .o_wsale_badge {
        font-size:.52rem !important;
        font-weight:700 !important;
        letter-spacing:.02em !important;
        padding:.2rem .42rem !important;
        white-space:nowrap !important; }

      /* ⚠️ "Bajo cotizacion" NO es un o_wsale_badge: es `.er_cot_badge`, de
         nuestra propia vista, y se quedaba fuera del ajuste de arriba. Medido:
         123px de ancho invadiendo 33px la zona del corazon. Es la etiqueta con
         el texto mas largo del catalogo, asi que marca el limite. */
      #products_grid .oe_product .er_cot_badge {
        font-size:.52rem !important;
        font-weight:700 !important;
        letter-spacing:0 !important;
        padding:.2rem .34rem !important;
        white-space:nowrap !important; }
    

      /* ============ LENGUAJE SHOP ============ */
      :root {
        --shop-canvas:#F2F4F5; --shop-surface:#FFFFFF;
        --shop-hairline:#EBEBEB; --shop-ink:#141018; --shop-muted:#787574;
        --shop-r-card:28px; --shop-r-pill:9999px;
        --shop-shadow:0 4px 6px -1px rgba(0,0,0,.10), 0 2px 4px -2px rgba(0,0,0,.08);
        --shop-shadow-alta:0 10px 18px -4px rgba(0,0,0,.12), 0 4px 8px -4px rgba(0,0,0,.08);
      }

      /* ---- TARJETAS: 28px, sin borde, separadas por SOMBRA ---- */
      #products_grid .oe_product,
      .o_wsale_er_acc_card,
      .oe_product_cart {
        border-radius:var(--shop-r-card) !important;
        border:0 !important;
        background:var(--shop-surface);
        box-shadow:var(--shop-shadow);
        transition:box-shadow .18s ease, transform .18s ease; }
      #products_grid .oe_product:hover,
      .o_wsale_er_acc_card:hover {
        box-shadow:var(--shop-shadow-alta); transform:translateY(-2px); }

      /* la imagen dentro de la tarjeta acompana el radio */
      #products_grid .oe_product_image,
      #products_grid .oe_product_image_link { border-radius:20px !important; overflow:hidden; }

      /* ---- CONTROLES EN LINEA: pildora ---- */
      /* ⚠️ Solo lo que va EN LINEA con texto. Los botones de accion se quedan
         en 10px por decision de Miguel. */
      .o_wsale_filmstrip_item,
      .o_wsale_products_main_row .nav-pills .nav-link,
      #wsale_products_attributes_collapse .list-group-item,
      .o_searchbar_form input,
      .o_searchbar_form .btn,
      .er_dep_chip, .o_wsale_apply_layout .btn {
        border-radius:var(--shop-r-pill) !important; }

      /* ---- TIPOGRAFIA: tracking negativo, la firma de Shop ---- */
      h1, h2, h3, .er_hero_h, .o_wsale_products_item_title,
      #products_grid .oe_product h6 { letter-spacing:-.03em; }
      body, p, .o_wsale_products_item_title { letter-spacing:-.011em; }

      /* ---- AIRE: 64-80px entre bloques ---- */
      .oe_website_sale .o_wsale_products_main_row { padding-top:2.5rem; }
      #products_grid .row { row-gap:1.5rem; }

      /* ---- LIENZO ---- */
      .oe_website_sale, #wrapwrap main { background:var(--shop-canvas); }
      #products_grid .oe_product { background:var(--shop-surface); }

      /* ---- LA IMAGEN MANDA ----
         Shop: "los productos flotan en tarjetas de imagen GRANDES, no en
         miniaturas encajadas en rejilla". La tarjeta tenia la foto pequena y
         un hueco muerto debajo; se le da altura y aire real. */
      /* ⚠️ LAS ETIQUETAS TAPABAN EL PRODUCTO. Van en `position:absolute`
         sobre la imagen, asi que al agrandar la foto a un cuadrado completo se
         le echaban encima. Se reserva arriba el alto de la etiqueta (y del
         segundo piso, cuando hay dos) para que el producto empiece POR DEBAJO
         en vez de discutirle el sitio. */
      /* ⚠️ EL PADDING NO SIRVE PARA HACERLE SITIO A LAS ETIQUETAS: su `top`
         se calcula DESPUES del relleno, asi que al empujar el padding se
         empujaba tambien la etiqueta (medido: acabo en top:120px, justo encima
         del producto). Hay que separar las dos cosas -- la etiqueta se ancla
         arriba del todo y lo que baja es la IMAGEN, con un margen propio. */
      /* ⚠️ NO SE LE RESERVA ESPACIO A LAS ETIQUETAS, y es a proposito.
         Se intento de cuatro formas (padding en el contenedor, margen en el
         envoltorio, margen + height:calc, padding + anclaje a la tarjeta) y
         todas acabaron peor: o la etiqueta se iba encima del producto, o la
         foto se recortaba, o quedaba diminuta. Shop, Amazon y cualquier tienda
         resuelven esto igual: la etiqueta va SUPERPUESTA en la esquina y ya.
         Las fotos de catalogo traen margen de sobra en las esquinas, asi que
         en la practica no tapan nada -- y la foto se ve entera y grande, que
         es lo que de verdad vende. */
      #products_grid .oe_product_image {
        aspect-ratio:1/1 !important; min-height:0 !important;
        padding:14px !important; background:#fff; position:relative; }
      /* ⚠️ LAS ETIQUETAS SE ANCLAN A LA TARJETA, NO A LA IMAGEN.
         Historia de tres intentos fallidos, para no repetirlos:
           1. padding-top en el contenedor -> la etiqueta es `absolute` DENTRO
              de el, asi que el relleno la empujaba a ella tambien (acabo en
              top:120px, sobre el producto).
           2. margin-top en el envoltorio -> la imagen se salia por abajo y
              `overflow:hidden` la RECORTABA ("se ven como imagen cortada").
           3. margin + height:calc() -> chocaba con un `height:100% !important`
              anterior sobre el mismo elemento y no aplicaba.
         La salida es sacar la etiqueta del contenedor de la imagen: anclada a
         `.oe_product` ya no le afecta ningun relleno de dentro, y entonces el
         padding-top hace su trabajo sin efectos colaterales. */
      #products_grid .oe_product { position:relative; }
      #products_grid .oe_product > .o_wsale_badge,
      #products_grid .oe_product .o_wsale_badge,
      #products_grid .oe_product .o_ribbons,
      #products_grid .oe_product .er_cot_badge {
        position:absolute !important; z-index:6; }
      /* ⚠️ UN SOLO SITIO PARA POSICIONAR LAS ETIQUETAS.
         Llego a haber TRES reglas repetidas en esta misma hoja con valores
         distintos (8px, 14px, 44px), mas las de las vistas 6918 y 6950. Con
         tanta regla peleandose era imposible saber cual ganaba, y la etiqueta
         acababa centrada sobre el producto. Aqui queda una sola, y se fuerzan
         `right:auto` y `width:auto` porque el tema le pone ancho completo y
         centra el texto. */
      #products_grid .oe_product .er_cot_badge,
      #products_grid .oe_product .o_wsale_badge,
      #products_grid .oe_product .o_ribbons {
        top:14px !important; left:14px !important;
        right:auto !important; bottom:auto !important;
        width:auto !important; max-width:calc(100% - 62px) !important;
        transform:none !important; text-align:left !important; }
      /* cuando conviven, la de cotizacion manda arriba y la otra baja un piso */
      #products_grid .oe_product:has(.er_cot_badge) .o_wsale_badge,
      #products_grid .oe_product:has(.er_cot_badge) .o_ribbons {
        top:44px !important; }
      #products_grid .oe_product_image_link { height:100% !important; }
      #products_grid .oe_product_image_img {
        width:100% !important; height:100% !important;
        object-fit:contain !important; }

      /* ---- TEXTO DE LOS BOTONES: BLANCO, NO AMARILLO ----
         Miguel, 2026-08-18: "no me gusta que el texto de agregar y cotizar
         este en amarillo, cambialo a blanco, al igual en la ficha".
         ⚠️ Hace falta cubrir TODOS los estados y tambien los hijos (el icono
         del carrito y el "+" son elementos aparte y heredaban el amarillo por
         su cuenta), y con selectores especificos porque las reglas del tema y
         de la vista de identidad (6981) llevan !important. */
      #products_grid .oe_product .o_wsale_product_btn_primary,
      #products_grid .oe_product .o_wsale_product_btn_primary *,
      #products_grid .oe_product .er_cot_btn_grid,
      #products_grid .oe_product .er_cot_btn_grid *,
      #add_to_cart, #add_to_cart *,
      .o_we_buy_now, .o_we_buy_now *,
      #product_detail_main .btn-primary, #product_detail_main .btn-primary *,
      .btn-primary, .btn-primary * {
        color:#FFFFFF !important; }
      /* el icono hereda color por `fill`/`stroke` en algunos casos */
      #products_grid .oe_product .o_wsale_product_btn_primary svg,
      #add_to_cart svg, .btn-primary svg { fill:currentColor !important; }

      /* ---- AIRE DENTRO DE LA TARJETA ----
         ⚠️ El texto salia pegado al borde: al quitar el borde y subir el radio
         a 28px, la esquina redondeada se come el espacio y el nombre del
         producto quedaba tocando el filo. Shop es compacto, pero el contenido
         nunca toca el borde: 16px de respiro. */
      /* ⚠️ SOLO AL CONTENEDOR EXTERIOR. El primer intento puso 16px a
         `.o_wsale_product_information` Y a `.o_wsale_product_information_text`,
         que van ANIDADOS: el relleno se sumaba (64px en total) y el nombre del
         producto se quedaba con 83px de los 165 de la tarjeta -- se truncaba a
         "Vaso Térmico 32Oz...". El hijo se pone a cero explicitamente. */
      #products_grid .oe_product .o_wsale_product_information {
        padding-left:16px !important; padding-right:16px !important;
        padding-bottom:16px !important; }
      #products_grid .oe_product .o_wsale_product_information_text,
      #products_grid .oe_product .o_wsale_product_sub {
        padding-left:0 !important; padding-right:0 !important; }
      /* ⚠️ TRES lineas para el nombre, no dos. Los nombres del catalogo llevan
         medida, clave y presentacion ("Vaso Térmico 32Oz (32J32) Dart C/15u"):
         con dos lineas se cortaba justo en la parte que distingue un producto
         de otro. Tres lineas caben sin descuadrar la tarjeta. */
      /* ⚠️ `-webkit-line-clamp` NO HACE NADA sin `display:-webkit-box` y
         `-webkit-box-orient:vertical`. Estaba puesto el clamp a 3 y el nombre
         seguia cortandose en 2 lineas porque el display era `flow-root`: la
         propiedad se ignora en silencio, que es lo peor que puede pasar. */
      #products_grid .oe_product .o_wsale_products_item_title {
        width:100% !important;
        display:-webkit-box !important;
        -webkit-box-orient:vertical !important;
        -webkit-line-clamp:3 !important;
        overflow:hidden !important;
        max-height:none !important; }
      #products_grid .oe_product .o_add_wishlist,
      #products_grid .oe_product .o_add_wishlist_dyn { top:14px !important; right:14px !important; }

      /* ---- BUSCADOR EN MOVIL ----
         ⚠️ Al pasar el input a pildora se quedo sin ancho (0px): el
         `input-group` de Bootstrap lo encoge cuando el boton de lupa va aparte.
         Se le devuelve el ancho para que el placeholder se lea entero. */
      .o_searchbar_form .input-group { flex-wrap:nowrap; gap:.5rem; }
      .o_searchbar_form input { flex:1 1 auto !important; min-width:0 !important;
        width:auto !important; }
      @media (max-width: 575.98px) {
        .o_searchbar_form { width:100%; }
        .o_searchbar_form input { min-width:120px !important; }
      }

      /* ---- ETIQUETAS EN PILDORA ----
         Van EN LINEA sobre la tarjeta, asi que por la regla de Shop les toca
         pildora. Antes eran rectangulos de esquina viva. */
      #products_grid .oe_product .o_wsale_badge,
      #products_grid .oe_product .o_ribbons,
      #products_grid .oe_product .er_cot_badge {
        border-radius:9999px !important; }


      /* ---- MENOS RUIDO DENTRO DE LA TARJETA ----
         Shop separa por sombra y espacio, no por lineas ni cajas. */
      #products_grid .oe_product .o_wsale_product_information,
      #products_grid .oe_product .o_wsale_product_sub {
        border:0 !important; background:transparent !important; }

      /* ---- FICHA DE PRODUCTO ---- */
      #product_detail_main .o_wsale_product_images,
      #o-carousel-product .carousel-item,
      #product_detail_main .o_wsale_product_details_content_section {
        border-radius:var(--shop-r-card); }
      #product_detail_main .er_vol,
      #product_detail_main .er_social,
      #product_detail_main .o_product_availability_info,
      .er_cot_caja {
        border-radius:20px !important; border:0 !important;
        box-shadow:var(--shop-shadow); }
      /* las pastillas de embalaje: en linea con texto -> pildora */
      #product_detail li.o_variant_pills, li.o_variant_pills {
        border-radius:9999px !important; }

      /* ============ EL BOTON DE WHATSAPP, FUERA DEL PAGO ============
         Miguel, 2026-08-19: "si, ocultalo cuando sea necesario".

         POR QUE: `#wa-float` va fijo abajo a la derecha con z-index 9999 y en
         el carrito cae justo encima del renglon del TOTAL -- el unico dato que
         el cliente busca antes de pagar quedaba tapado por una burbuja verde.
         Y ademas, en el unico punto del sitio donde la persona ya decidio
         comprar, un boton que la saca a otra aplicacion es una salida, no una
         ayuda: cada vez que se lo lleva a WhatsApp, la venta que ya estaba en
         marcha se convierte en una conversacion que alguien tiene que atender.

         DONDE SI SE QUEDA: en TODO lo demas -- portada, tienda, categorias y
         ficha de producto. Ahi el cliente esta eligiendo y preguntar por
         WhatsApp es exactamente lo que queremos que haga.

         ⚠️ Se oculta por la clase que Odoo pone en el BODY, no por la URL: las
            rutas del pago cambian (/shop/cart, /shop/checkout, /shop/payment,
            /shop/confirmation) y una lista de rutas se queda vieja sola.
            `.o_website_sale_checkout` cubre todo el embudo de pago. */
      .o_website_sale_checkout #wa-float,
      body[class*="o_website_sale_checkout"] #wa-float { display:none !important; }

      /* ---- CARRITO ----
         Miguel, 2026-08-19: "arregla como se visualizan los productos en el
         checkout, en pc y movil".

         ⚠️ EL DEFECTO ERA UNA TARJETA SIN TARJETA. Esta regla le ponia a cada
            linea del carrito radio de 28px y SOMBRA... pero no le daba FONDO.
            Una sombra sin caja que la proyecte no dibuja una tarjeta: dibuja
            un halo gris flotando bajo el producto, que es el escalon sucio que
            se veia debajo de cada articulo. O se da fondo, o se quita la
            sombra; lo que no puede quedarse es la sombra sola.

         ⚠️ LA FOTO ERA DE 64px. En una fila de 510px de ancho y 150 de alto, el
            producto -- lo unico por lo que el cliente reconoce lo que esta a
            punto de pagar -- ocupaba un 1.6% de la superficie. Sube a 92px en
            escritorio y 76 en movil, con fondo propio para que el envase no se
            confunda con la tarjeta. */
      .o_cart_product, #cart_products .card, .o_total_card,
      #wrap .oe_cart .card {
        border-radius:var(--shop-r-card) !important; border:0 !important;
        background:var(--shop-surface) !important;
        box-shadow:var(--shop-shadow); }

      /* cada linea es una tarjeta de verdad: fondo, relleno y aire entre ellas */
      #cart_products .o_cart_product {
        padding:16px !important; margin-bottom:14px !important; }
      #cart_products .o_cart_product:last-child { margin-bottom:0 !important; }

      /* la foto, con su propio marco claro
         ⚠️ NO BASTA CON `width`. Odoo limita la miniatura con
            `.o_cart_product_image img { max-width:64px }`, y un `max-width`
            gana siempre a un `width`, lleve !important o no: primero se calcula
            el ancho y despues se recorta al maximo. Se veia en la medicion --
            la imagen salia 64x92, deformada, porque la altura si obedecia y el
            ancho no.
            El tamano lo gobiernan de verdad estas dos variables suyas, asi que
            se cambian ellas y se levanta el tope. */
      #cart_products, .o_website_sale_checkout #cart_products {
        --cart-product-img-size-lg:92px;
        --cart-product-img-size-sm:92px; }
      /* ⚠️ EL MARCO VA EN EL CONTENEDOR, LA FOTO VA LIMPIA.
         Poniendo fondo+relleno+radio en los DOS salia un marco dentro de otro
         marco: se veia en movil como un recuadro con un segundo recuadro
         dentro y el producto diminuto al fondo. Ademas Odoo le cuelga a la
         propia imagen las clases `border rounded`, que anaden un tercer
         filete.
         ⚠️ Ojo al redactar estos comentarios: van dentro de un arch XML, asi
         que NO se escriben etiquetas entre angulos ni siquiera comentadas --
         ElementTree las lee como etiquetas de verdad y la validacion cae con
         "mismatched tag". Ya paso con `small` y acaba de pasar otra vez. */
      /* ⚠️ RELLENO MINIMO (4px, no 8). Las fotos del catalogo YA traen aire
         propio en las esquinas -- por eso las etiquetas de la cuadricula no
         tapan nada. Sumarle 8px por lado a un marco de 76px en movil dejaba al
         envase en unos 40px reales: se distinguia el recuadro, no el producto.
         Con 4px el marco sigue leyendose y la foto gana 8px de lado. */
      #cart_products .o_cart_product .o_cart_product_image {
        max-width:92px !important; width:92px !important; height:92px !important;
        padding:4px; background:#FAFAFB; border-radius:14px;
        display:flex; align-items:center; justify-content:center;
        flex:0 0 auto; overflow:hidden; }
      #cart_products .o_cart_product .o_cart_product_image img,
      #cart_products .o_cart_product img {
        max-width:100% !important; width:100% !important; height:100% !important;
        object-fit:contain !important;
        padding:0 !important; background:transparent !important;
        border:0 !important; border-radius:0 !important; }

      @media (max-width: 767.98px) {
        #cart_products, .o_website_sale_checkout #cart_products {
          --cart-product-img-size-lg:76px;
          --cart-product-img-size-sm:76px; }
        #cart_products .o_cart_product { padding:12px !important; }
        #cart_products .o_cart_product .o_cart_product_image {
          max-width:76px !important; width:76px !important; height:76px !important; }
      }

      /* ============ EL HOME ============
         Shop: "no uses fondos de color en contenedores de interfaz -- la
         fotografia de producto aporta todo el color" y "nada de formas
         decorativas". El home tenia cada departamento en una tarjeta pastel
         distinta con un CIRCULO saturado detras del producto: dos capas de
         color compitiendo con la foto. */
      .er_dep_t {
        background:var(--shop-surface) !important;
        border-radius:var(--shop-r-card) !important; border:0 !important;
        box-shadow:var(--shop-shadow);
        transition:box-shadow .18s ease, transform .18s ease; }
      .er_dep_t:hover { box-shadow:var(--shop-shadow-alta); transform:translateY(-2px); }
      /* ⚠️ La tarjeta traia alto FIJO. Con los nombres de dos lineas ("Salsas,
         Aderezos y Sazonadores") el contador de productos se salia por abajo y
         se cortaba. Se deja crecer y se igualan por rejilla, no por altura
         impuesta. */
      /* ⚠️ Con `.er_dep_t` a secas NO bastaba: la regla del home gana. Se sube
         la especificidad con el contenedor de la seccion. Misma trampa de
         siempre -- si una regla "no aplica", casi nunca es el !important: es
         que otra es mas especifica. */
      /* ⚠️ LA CULPA ERA DE `aspect-ratio: 1/1.06`, no del height. Un
         aspect-ratio FIJA la altura a partir del ancho y gana sobre cualquier
         `height:auto`: por eso la tarjeta se quedaba clavada en 179px y el
         contador de productos se salia 6px por abajo. Hay que anularlo. */
      .er_sec_deps .er_deps .er_dep_t,
      .er_sec_deps .er_dep_t {
        aspect-ratio:auto !important;
        height:auto !important; min-height:0 !important; max-height:none !important;
        display:flex !important; flex-direction:column;
        padding-bottom:1.1rem !important; overflow:visible !important; }
      .er_sec_deps .er_deps { align-items:stretch !important; }
      /* ⚠️ EL HALO DE COLOR VUELVE. Aqui ponia `background:transparent
         !important` con el comentario "fuera el circulo de color: el producto
         se sostiene solo" -- venia de la regla de Shop que prohibe fondos de
         color en contenedores de interfaz. Miguel lo pidio de vuelta al ver la
         maqueta (2026-08-19: "solo aplica los colores de sombra"), y este
         `!important` era lo unico que lo impedia: los colores por departamento
         SI estaban definidos en la vista del mosaico y quedaban anulados.
         La tarjeta se queda BLANCA -- lo que lleva color es solo el halo de
         detras del producto, que es lo que se pidio. El tono con transparencia
         lo pone deps_mosaico.py, uno por departamento. */

      /* las bandas grises del home, al mismo lienzo que la tienda */
      .sec--gray { background:var(--shop-canvas) !important; }
      /* ⚠️ NO se toca el fondo de `.sec` a secas. Se hizo, y dejo la seccion de
         preguntas frecuentes ILEGIBLE: su titulo y su texto son BLANCOS porque
         venia con fondo oscuro, asi que al blanquear el fondo quedo blanco
         sobre blanco. Antes de cambiar el fondo de un bloque hay que mirar de
         que color es su texto. */

      /* tarjetas del resto del home: mas vendidos, testimonios, marcas.
         ⚠️ La FAQ se queda FUERA: sus tarjetas van sobre fondo oscuro y con
         texto claro; darles superficie blanca las borra. */
      .brand-tick, .testi-card, .stat-card, .vent-card,
      .s_dynamic_snippet_products .oe_product {
        border-radius:var(--shop-r-card) !important; border:0 !important;
        box-shadow:var(--shop-shadow); }
      /* ⚠️ EL CARRUSEL USA OTRA CLASE. Sus tarjetas no son
         `.s_dynamic_snippet_products .oe_product` sino
         `.oe_product_cart.o_carousel_product_card`: por eso el relleno que se
         le puso antes no llegaba y el titulo seguia a 0px del borde y el precio
         a 15px. Medido, no supuesto. */
      .o_carousel_product_card {
        padding:0 0 14px !important; overflow:hidden; }
      .o_carousel_product_card > *,
      .o_carousel_product_card .o_wsale_product_information,
      .o_carousel_product_card .product_price,
      .o_carousel_product_card .o_wsale_products_item_title,
      .o_carousel_product_card a.text-decoration-none {
        padding-left:16px !important; padding-right:16px !important; }
      /* la imagen no lleva relleno lateral: va a sangre dentro de la tarjeta */
      .o_carousel_product_card .oe_product_image,
      .o_carousel_product_card .oe_product_image_link,
      .o_carousel_product_card img {
        padding-left:0 !important; padding-right:0 !important; }
      .brand-tick { border-radius:20px !important; }

      /* titulares del home: mismo tracking que el resto */
      .sec-h, .er_sec_h { letter-spacing:-.03em; }

      /* ⚠️ La franja de estadisticas iba en morado a sangre. Shop no admite
         fondos de color en la interfaz, pero quitarlo del todo dejaria el home
         sin un solo punto de marca: se conserva como UNICO bloque de color,
         que ademas es lo que Shop llama "momento de marca". */
      .stats-strip { border-radius:var(--shop-r-card); overflow:hidden;
        margin-left:auto; margin-right:auto; max-width:1200px; }

      /* ⚠️ CONTENIDO PRIMERO, ANIMACION DESPUES.
         La seccion de preguntas frecuentes tiene 12 items, pero solo 6 llevan
         la clase `visible` que les da opacidad: los otros 6 SIGUEN OCUPANDO SU
         SITIO en la rejilla y no se ven -- de ahi el enorme hueco morado que
         Miguel reporto como "una separacion muy grande". La clase la pone un
         observador de scroll que, con la seccion tan abajo, no llega a
         dispararse.
         Aqui va la red de seguridad: pasados unos segundos, lo que siga oculto
         se muestra. Si el observador funciona, la animacion se ve igual; si
         falla, el cliente lee las preguntas de todas formas. Un efecto de
         entrada nunca puede dejar contenido invisible. */
      .faq-item { transition:opacity .5s ease, transform .5s ease; }
      .er_faq_rescate .faq-item { opacity:1 !important; transform:none !important; }

      /* ⚠️ EL CARRIL DE MARCAS QUEDABA DESCENTRADO: pegado al borde izquierdo
         y con hueco a la derecha. El carril usa `width:max-content` para poder
         desplazarse, asi que cuando las marcas no llenan la pantalla se apoya
         a la izquierda en vez de repartirse. Se centra el envoltorio y se le
         da un minimo, para que el bucle siga siendo continuo. */
      /* ⚠️ NO se toca el ANCHO del carril. Lleva `width:max-content` porque la
         animacion se desplaza un -50% exacto: si se estira a `min-width:100%`,
         ese 50% deja de coincidir con la mitad del contenido y el bucle da un
         salto visible. Se centra solo el envoltorio. */
      .brands-ticker-wrap { display:flex; justify-content:center; }

      /* ============ FICHA: EL AIRE ENTRE BLOQUES ============
         Miguel: "revisa los elementos de la ficha del producto porque aparecen
         un tanto apartados" (2026-08-18, sobre una captura de movil).

         DE DONDE SALE. Odoo 19 separa cada bloque de la ficha con
         `.o_wsale_product_details_content_section { margin-bottom:30px }`, y
         encima nuestros anadidos traen el suyo (.er_cash 12.8, .er_vol 16+17.6).
         Medido en un movil de 375 px: titulo, precio, cashback, variantes,
         escalones y disponibilidad quedaban a ~30 px unos de otros y la
         columna se leia como piezas sueltas en vez de una ficha.

         ⚠️ SE BAJA EL AIRE, NO SE QUITA. A cero los bloques se pegan y deja de
            distinguirse donde acaba uno y empieza el siguiente -- que es el
            problema contrario y peor, porque "Medida" y "Embalaje" son dos
            decisiones distintas del cliente y tienen que leerse separadas.
            16 px en movil y 22 en escritorio mantienen la jerarquia ocupando
            la mitad.

         ⚠️ LOS MARGENES VERTICALES COLAPSAN: entre dos bloques manda el mayor,
            no la suma. Por eso no basta con tocar el de abajo del primero --
            hay que bajar tambien el de arriba del segundo, o el hueco se queda
            en el mas grande de los dos. */
      /* la marca el JS de abajo cuando el contador de resenas es 0 */
      .er_sin_resenas { display:none !important; }

      #product_details .o_wsale_product_details_content_section {
        margin-bottom:22px !important; }
      #product_details .er_vol { margin-top:14px !important;
        margin-bottom:14px !important; }
      #product_details .er_cash { margin-bottom:10px !important; }
      #product_details .er_pol { margin-top:14px !important; }
      /* las dos listas de variantes ("Medida" y "Embalaje") dentro del mismo
         bloque: se separan entre si, pero menos */
      #product_details .variant_attribute { margin-bottom:14px !important; }
      #product_details .variant_attribute:last-child { margin-bottom:0 !important; }

      /* ============ LOS DOS BOTONES DE LA FICHA ============
         Miguel, 2026-08-19: "sigues sin arreglar todo esto que esta empalmado".
         Al medir esa pantalla salieron ademas dos defectos de color:

         1. "COMPRAR AHORA" ERA UN BOTON FANTASMA. Es un boton de contorno
            (`btn-outline-primary`): fondo transparente y borde morado. Tenia el
            texto en BLANCO, y como debajo hay tarjeta blanca, el resultado era
            blanco sobre blanco -- un recuadro con borde y nada dentro. Paso al
            aplicar "el texto de agregar y cotizar en blanco": la regla alcanzo
            tambien a este, que es el unico de los tres SIN fondo de color. En
            un boton de contorno el texto va del color del borde.

         2. "AGREGAR AL CARRITO" SEGUIA EN AMARILLO pese a haberlo pedido en
            blanco. Amarillo sobre morado ademas se lee peor.

         ⚠️ Van con id/doble clase a proposito: el tema pinta estos botones con
            !important, y entre dos !important gana el MAS ESPECIFICO. */
      #product_details a#add_to_cart,
      #product_details a#add_to_cart:hover,
      #product_details a#add_to_cart:focus,
      #product_details a#add_to_cart i {
        color:#fff !important; }
      #product_details .btn-outline-primary.o_we_buy_now,
      #product_details .btn-outline-primary.o_we_buy_now i {
        color:#490AA0 !important; background:transparent !important; }
      /* al pasar el raton si se invierte: ahi el fondo ya es morado */
      #product_details .btn-outline-primary.o_we_buy_now:hover,
      #product_details .btn-outline-primary.o_we_buy_now:hover i {
        color:#fff !important; background:#490AA0 !important; }

      /* ⚠️ LA FICHA IBA PEGADA AL CANTO. Miguel, 2026-08-19, sobre una captura
         de ~630 px: "sigues sin arreglar todo esto que esta empalmado".
         Y tenia razon aunque el bloque estuviera CENTRADO: Odoo deja 15 px de
         margen lateral, que en escritorio no se notan porque la ficha ocupa
         media pantalla, pero en cuanto baja a UNA sola columna el titulo, el
         precio y la tabla de escalones arrancan a 15 px del borde de la
         pantalla -- un 2% del ancho. Se lee pegado porque esta pegado.
         El corte se pone en 991.98 px, que es donde Odoo apila la ficha en una
         columna: por encima manda el reparto en dos y esto no aplica. */
      /* ⚠️ EL RELLENO VA DENTRO DE LA TARJETA BLANCA, NO FUERA.
         Primer intento (fallido): subir el padding de `#product_details` de 15
         a 22 px. Eso separa del borde de la PANTALLA... pero el fondo blanco lo
         pinta `.js_main_product`, que empieza justo donde acaba ese relleno y
         lleva `padding:0`. Resultado: la tarjeta se movia entera y el texto
         seguia tocando su canto -- Miguel, con una captura de iPhone: "en movil
         sigue estando empalmado". Tenia razon: medido, el titulo arrancaba a
         1 px del borde del bloque blanco.
         Ahora se reparte: 14 px separan la tarjeta del borde de la pantalla y
         18 px separan el texto del borde de la tarjeta. Del canto de la
         pantalla al texto hay 32 px.
         Y se le da radio, que es lo que la hace leerse como tarjeta y no como
         una banda blanca a lo ancho. */
      @media (max-width: 991.98px) {
        #product_details { padding-left:14px !important; padding-right:14px !important; }
        #product_details .js_main_product {
          padding:18px 18px 22px !important;
          border-radius:20px; }
      }

      @media (max-width: 767.98px) {
        #products_grid .oe_product, .o_wsale_er_acc_card { border-radius:20px !important; }

        #product_details .o_wsale_product_details_content_section {
          margin-bottom:16px !important; }
        #product_details .er_vol { margin-top:10px !important;
          margin-bottom:10px !important; }
        #product_details .er_cash { margin-bottom:8px !important; }
        #product_details .er_pol { margin-top:10px !important; }
        #product_details .variant_attribute { margin-bottom:10px !important; }
      }
    

      /* ============ TARJETA DEL CARRUSEL DEL HOME ============
         Iguala la tarjeta del snippet dinamico a la de /shop. Los tokens son
         los del lenguaje Shop (vista 6985) y los tamanos, los de la tarjeta
         refinada (vista 6950). */
      .o_carousel_product_card {
        --er-morado:#490AA0; --er-morado-osc:#2E0668;
        --er-tinta:#141018;  --er-suave:#8b86a0; }

      /* ---- UN SOLO RELLENO LATERAL ----
         Se reinicia el de la 6985, que se sumaba en tres niveles anidados y
         dejaba el nombre 16px mas adentro que el precio. */
      .o_carousel_product_card > *,
      .o_carousel_product_card .o_wsale_product_information,
      .o_carousel_product_card .o_wsale_product_info_attributes_wrapper,
      .o_carousel_product_card .o_wsale_product_information_text,
      .o_carousel_product_card .o_wsale_products_item_title,
      .o_carousel_product_card .o_wsale_products_item_title a,
      .o_carousel_product_card .o_wsale_item_brand,
      .o_carousel_product_card .product_price {
        padding-left:0 !important; padding-right:0 !important; }
      /* y se pone UNA vez, en el bloque de texto (va despues a proposito) */
      .o_carousel_product_card .o_wsale_product_information {
        padding:14px 18px 6px !important; }

      /* ---- MARCA: discreta, no compite con el nombre ---- */
      .o_carousel_product_card .o_wsale_item_brand {
        font-family:'Inter',sans-serif !important;
        font-size:.67rem !important; font-weight:600 !important;
        letter-spacing:.07em !important; text-transform:uppercase;
        color:var(--er-suave) !important;
        line-height:1.3 !important; min-height:1.3em;
        margin:0 0 .15rem 0 !important;
        white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

      /* ---- NOMBRE: protagonista, tinta, SIEMPRE 2 lineas ----
         El alto fijo es lo que alinea los precios de toda la fila. */
      .o_carousel_product_card .o_wsale_products_item_title {
        margin:0 !important; }
      .o_carousel_product_card .o_wsale_products_item_title a {
        font-family:'Inter',sans-serif !important;
        font-size:.9rem !important; font-weight:500 !important;
        line-height:1.35 !important; letter-spacing:-.011em !important;
        color:var(--er-tinta) !important;
        display:-webkit-box !important; -webkit-box-orient:vertical;
        -webkit-line-clamp:2; overflow:hidden;
        height:2.7em; }
      .o_carousel_product_card:hover .o_wsale_products_item_title a {
        color:var(--er-morado) !important; }

      /* ---- PRECIO: la voz fuerte, en morado como en /shop ---- */
      .o_carousel_product_card .product_price {
        margin:.5rem 0 0 0 !important; line-height:1.35 !important; }
      .o_carousel_product_card .product_price .fw-bold,
      .o_carousel_product_card .product_price .oe_currency_value {
        font-size:1.15rem !important; font-weight:700 !important;
        letter-spacing:-.016em !important;
        color:var(--er-morado) !important; }
      /* precio tachado, cuando lo hay */
      .o_carousel_product_card .product_price del,
      .o_carousel_product_card .product_price .text-decoration-line-through {
        font-size:.82rem !important; font-weight:500 !important;
        color:#9a95a8 !important; letter-spacing:0 !important; }

      /* La unidad (/paquete, /kg, /unidad) NO lleva estilo aqui: usa
         `.er_um_precio` de la vista 6987, que ya es global. Una sola
         definicion para la tienda entera. */

      /* ---- IMAGEN: sin tinte propio, la tarjeta ya es blanca ---- */
      .o_carousel_product_card .oe_product_image {
        background:#fff !important; }

      /* ---- BOTON DEL HOVER: morado de marca, no gris transparente ---- */
      .o_carousel_product_card .o_wsale_product_btn_primary {
        background-color:var(--er-morado) !important;
        border-color:var(--er-morado) !important;
        color:#fff !important;
        box-shadow:0 4px 12px rgba(55,26,148,.22) !important; }
      .o_carousel_product_card .o_wsale_product_btn_primary:hover,
      .o_carousel_product_card .o_wsale_product_btn_primary:focus {
        background-color:var(--er-morado-osc) !important;
        border-color:var(--er-morado-osc) !important;
        color:#fff !important; }

      /* ---- MOVIL: 2 por fila, todo un punto mas compacto ---- */
      @media (max-width:991.98px) {
        .o_carousel_product_card .o_wsale_product_information {
          padding:12px 14px 6px !important; }
        .o_carousel_product_card .o_wsale_item_brand {
          font-size:.63rem !important; }
        .o_carousel_product_card .o_wsale_products_item_title a {
          font-size:.84rem !important; }
        .o_carousel_product_card .product_price .fw-bold,
        .o_carousel_product_card .product_price .oe_currency_value {
          font-size:1.02rem !important; }
      }

      @media (prefers-reduced-motion: reduce) {
        .o_carousel_product_card .o_wsale_products_item_title a {
          transition:none; }
      }
    

      /* ============ MI CUENTA — LENGUAJE EL REY ============
         Portal del cliente (/my). Tokens del lenguaje Shop (vista 6985) y del
         design system (vista 6981). Solo estilo: el texto va aparte. */

      /* --- la tarjeta: blanca sobre el lienzo, separada por SOMBRA --- */
      .o_portal_my_home .o_portal_index_card { --er-mor:#490AA0; }
      .o_portal_my_home .o_portal_index_card > a {
        background:#fff !important;
        border-radius:20px !important;
        box-shadow:var(--shop-shadow, 0 4px 6px -1px rgba(0,0,0,.10), 0 2px 4px -2px rgba(0,0,0,.08));
        padding:1rem 1.15rem !important;
        gap:.9rem !important;
        align-items:center !important;
        transition:box-shadow .18s ease, transform .18s ease; }
      .o_portal_my_home .o_portal_index_card > a:hover {
        box-shadow:var(--shop-shadow-alta, 0 10px 18px -4px rgba(0,0,0,.12), 0 4px 8px -4px rgba(0,0,0,.08));
        transform:translateY(-2px); }

      /* --- icono: mosaico morado con glifo blanco, en un pseudo-elemento ---
         La ilustracion pastel de Odoo se retira entera. */
      .o_portal_my_home .o_portal_index_card .o_portal_icon { display:none !important; }
      .o_portal_my_home .o_portal_index_card > a::before {
        content:''; flex:0 0 46px; width:46px; height:46px;
        border-radius:13px; background-color:var(--er-mor);
        background-repeat:no-repeat; background-position:center;
        background-size:23px 23px; }

      .o_portal_my_home .o_portal_index_card a[href^="/my/orders"]::before { background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23ffffff%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M6%202%203%206v14a2%202%200%200%200%202%202h14a2%202%200%200%200%202-2V6l-3-4z%27/%3E%3Cpath%20d%3D%27M3%206h18%27/%3E%3Cpath%20d%3D%27M16%2010a4%204%200%200%201-8%200%27/%3E%3C/svg%3E"); }
      .o_portal_my_home .o_portal_index_card a[href^="/my/invoices"]::before { background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23ffffff%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%27/%3E%3Cpath%20d%3D%27M14%202v6h6%27/%3E%3Cpath%20d%3D%27M8%2013h8%27/%3E%3Cpath%20d%3D%27M8%2017h5%27/%3E%3C/svg%3E"); }
      .o_portal_my_home .o_portal_index_card a[href^="/my/payment_method"]::before { background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23ffffff%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%272%27%20y%3D%275%27%20width%3D%2720%27%20height%3D%2714%27%20rx%3D%272%27/%3E%3Cpath%20d%3D%27M2%2010h20%27/%3E%3Cpath%20d%3D%27M6%2015h4%27/%3E%3C/svg%3E"); }
      .o_portal_my_home .o_portal_index_card a[href^="/my/addresses"]::before { background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23ffffff%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M20%2010c0%206-8%2012-8%2012s-8-6-8-12a8%208%200%200%201%2016%200z%27/%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2710%27%20r%3D%273%27/%3E%3C/svg%3E"); }
      .o_portal_my_home .o_portal_index_card a[href^="/my/security"]::before { background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23ffffff%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%273%27%20y%3D%2711%27%20width%3D%2718%27%20height%3D%2711%27%20rx%3D%272%27/%3E%3Cpath%20d%3D%27M7%2011V7a5%205%200%200%201%2010%200v4%27/%3E%3C/svg%3E"); }
      .o_portal_my_home .o_portal_index_card a[href^="/my/quotes"]::before { background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23ffffff%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M9%2011l3%203L22%204%27/%3E%3Cpath%20d%3D%27M21%2012v7a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2V5a2%202%200%200%201%202-2h11%27/%3E%3C/svg%3E"); }
      .o_portal_my_home .o_portal_index_card a[href^="/my/account"]::before { background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23ffffff%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%278%27%20r%3D%274%27/%3E%3Cpath%20d%3D%27M4%2021v-1a7%207%200%200%201%2016%200v1%27/%3E%3C/svg%3E"); }

      /* --- tipografia: el titulo manda, el subtitulo es gris de sistema --- */
      .o_portal_my_home .o_portal_index_card .fs-5 {
        font-size:1rem !important; font-weight:600 !important;
        color:#141018 !important; letter-spacing:-.011em;
        line-height:1.3 !important; margin-bottom:.16rem !important; }
      .o_portal_my_home .o_portal_index_card .opacity-75 {
        opacity:1 !important; font-size:.84rem; line-height:1.35;
        color:#787574 !important; }

      /* --- PUNTOS EL REY: la unica tarjeta amarilla, y la primera de su grupo ---
         `order` en vez de mover el HTML: ver la cabecera del script. */
      /* Puntos primero de su grupo, "Mis datos" justo detras: quien eres antes
         que donde vives y como entras. Direcciones y Seguridad quedan al final. */
      .o_portal_my_home .o_portal_index_card:has(a[href^="/mis-puntos"]),
      .o_portal_my_home .o_portal_index_card:has(a[href^="/my/account"]) {
        order:-1 !important; }
      .o_portal_my_home .o_portal_index_card > a[href^="/mis-puntos"] {
        background:#FFD426 !important; }
      .o_portal_my_home .o_portal_index_card > a[href^="/mis-puntos"] .fs-5,
      .o_portal_my_home .o_portal_index_card > a[href^="/mis-puntos"] .opacity-75 {
        color:var(--er-mor) !important; }
      /* glifo AMARILLO sobre mosaico morado: blanco sobre amarillo no se lee,
         y el mosaico es lo unico que separa el icono del fondo de la tarjeta */
      .o_portal_my_home .o_portal_index_card > a[href^="/mis-puntos"]::before {
        background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%23FFD426%27%20stroke-width%3D%271.9%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27m12%202%203.09%206.26L22%209.27l-5%204.87%201.18%206.88L12%2017.77l-6.18%203.25L7%2014.14%202%209.27l6.91-1.01z%27/%3E%3C/svg%3E"); }

      /* --- la tarjeta de aviso (cotizaciones por revisar) --- */
      .o_portal_my_home .o_portal_index_card > a.alert-primary {
        background:#f2ecfc !important; border:0 !important;
        box-shadow:inset 0 0 0 1px rgba(73,10,160,.16) !important; }
      .o_portal_my_home .o_portal_index_card > a.alert-primary .fs-5,
      .o_portal_my_home .o_portal_index_card > a.alert-primary .alert-link {
        color:var(--er-mor) !important; }

      /* --- cabecera --- */
      .o_portal_wrap .wrapper h3 {
        margin:.35rem 0 1.15rem !important; letter-spacing:-.03em; }

      /* --- FUERA EL PANEL LATERAL (Miguel, 2026-08-24: "siento que esta de mas")
         Repetia los puntos (ya son tarjeta propia, y mejor: lleva a /mis-puntos)
         y la direccion (ya hay tarjeta "Direcciones"). Lo unico que NO estaba en
         ningun otro sitio era "Editar informacion" -> ahora es la tarjeta
         "Mis datos", asi que no se pierde nada y la pagina queda como UNA lista.
         ⚠️ En movil es un offcanvas y en escritorio es la columna derecha
            (`col-lg-4`): son la MISMA plantilla `portal.side_content`, hay que
            ocultar las dos y devolverle el ancho completo al contenido. */
      .o_portal_wrap button[data-bs-target="#accountOffCanvas"],
      .o_portal_wrap #accountOffCanvas,
      .o_portal_wrap .row.justify-content-between > .col-lg-4:has(.o_portal_my_details) {
        display:none !important; }
      .o_portal_wrap .o_portal_content {
        width:100% !important; max-width:100% !important; flex:0 0 100% !important; }

      /* --- SEPARACION ENTRE TARJETAS (Miguel, 2026-08-24: "se ven muy separadas")
         Medido en la maqueta fiel, con las clases `row g-2` de Bootstrap:
             margen de la tarjeta   8.0px  (--bs-gutter-y de `g-2`)
           + row-gap propio        10.4px  (el `.65rem` que puse al principio)
           = 18px entre tarjetas del mismo grupo
         Se quita el row-gap y manda solo el margen: 8px. */
      .o_portal_my_home .o_portal_category {
        row-gap:0 !important; margin-top:1rem !important; }
      .o_portal_my_home .o_portal_category > .o_portal_index_card {
        margin-top:.5rem !important; }
      .o_portal_my_home .o_portal_docs { gap:0; }

      /* ⚠️ EL HUECO GRANDE NO ERA MARGEN: ERAN CATEGORIAS VACIAS.
         La plantilla renderiza `#portal_alert_category`, `#portal_service_category`
         y `#portal_vendor_category` SIEMPRE que su modulo las habilite -- y
         account/sale las habilitan. Sus tarjetas ("Nuestras facturas",
         "Cotizaciones por revisar") salen con `d-none` cuando el cliente no
         tiene ninguna, pero el DIV de la categoria sigue ahi ocupando su
         `mt-3`. De ahi los ~70px entre "Metodos de pago" y "Puntos El Rey":
         no es un margen mal puesto, son dos grupos invisibles en medio.
         📌 Con `:has()` el navegador lo reevalua solo: cuando el JS de Odoo
            quita el `d-none` al llegar los contadores, la categoria reaparece
            sin que haya que tocar nada. */
      .o_portal_my_home .o_portal_category:not(:has(.o_portal_index_card:not(.d-none))) {
        display:none !important; }

      @media (max-width:767.98px) {
        .o_portal_my_home .o_portal_index_card > a {
          padding:.85rem .95rem !important; border-radius:18px !important; }
        .o_portal_my_home .o_portal_index_card > a::before {
          flex:0 0 40px; width:40px; height:40px;
          border-radius:11px; background-size:20px 20px; }
        .o_portal_my_home .o_portal_index_card .fs-5 { font-size:.95rem !important; }
        .o_portal_my_home .o_portal_index_card .opacity-75 { font-size:.8rem; }
      }

      @media (prefers-reduced-motion: reduce) {
        .o_portal_my_home .o_portal_index_card > a,
        .o_portal_my_home .o_portal_index_card > a:hover {
          transition:none; transform:none; }
      }
    

      /* ====== REFERENCIA EN LA TARJETA DEL CARRUSEL (home) ======
         Altura reservada SIEMPRE: si una tarjeta del carrusel se queda mas
         corta que sus vecinas, los botones quedan a distinta altura -- el
         mismo defecto que ya hubo que arreglar aqui con la marca. */
      .o_carousel_product_card .er_ref_c {
        min-height:1.05rem; margin:.05rem 0 .1rem;
        font-family:'Inter',sans-serif; font-size:.66rem; font-weight:600;
        letter-spacing:.02em; line-height:1.3; color:#8B8598;
        font-variant-numeric:tabular-nums;
        /* que baje de renglon antes que salirse; NUNCA recortar con "..." */
        overflow-wrap:anywhere; }
      .o_carousel_product_card .er_ref_c b {
        font-weight:700; font-size:.88em; letter-spacing:.08em;
        text-transform:uppercase; color:#B3AEBE; }
      @media (max-width:991.98px) {
        .o_carousel_product_card .er_ref_c { font-size:.62rem; min-height:1rem; }
        .o_carousel_product_card .er_ref_c b { display:none; }
      }
      @media (max-width:374.98px) {
        .o_carousel_product_card .er_ref_c { font-size:.58rem; }
      }
    

/* ===== PREMIUM · CABECERA (ref. MAHA, paleta El Rey) — 2026-09-17 ===== */
:root{--er-gris:#F3F2F7;--er-gris2:#ECEAF1;--er-linea:#ECEAF1;--er-ink:#141018;--er-gris-tx:#6B6578;}

/* 1. La banda de entrega sube ARRIBA de la cabecera: es la barra superior. */
#wrapwrap > .er-cob-banda{order:-1;background:#490AA0 !important;z-index:1041;}
.er-cob-in{max-width:1288px !important;padding:0 24px !important;min-height:36px;gap:14px !important;flex-wrap:nowrap !important;}
.er-cob-abre,.er-cob-fac,.er-cob-lugar,.er-cob-banda{font-size:13px !important;}
.er-cob-sep{background:rgba(255,255,255,.25) !important;}
.er-prem-tag{margin-left:auto;color:#fff;font-weight:500;font-size:13px;white-space:nowrap;}
.er-prem-soc{display:flex;gap:4px;margin-left:12px;}
.er-prem-soc a{display:inline-flex;width:28px;height:28px;align-items:center;justify-content:center;color:#fff !important;border-radius:50%;text-decoration:none !important;}
.er-prem-soc a:hover{background:rgba(255,255,255,.14);color:#FFD426 !important;}
.er-prem-soc svg{width:15px;height:15px;fill:currentColor;}
.er-prem-soc .fa{font-size:15px;}

/* 2. Cabecera blanca, plana, con una linea abajo. */
header#top nav.navbar{background:#fff !important;box-shadow:none !important;border-bottom:1px solid var(--er-linea);}
header#top nav.navbar-expand-lg{padding:12px 0 0 !important;}
header#top .er_cabecera{padding-bottom:12px !important;gap:14px !important;}
header#top.o_header_affixed{box-shadow:0 6px 18px rgba(46,6,104,.08) !important;}
header#top nav.navbar-expand-lg .o_main_nav{max-width:1288px;margin:0 auto;padding:0 24px !important;}
header#top .navbar-brand img{width:auto !important;height:50px !important;max-height:none !important;}
header#top .er_cabecera .navbar-brand{margin-right:6px !important;}

/* Boton "Departamentos" FUERA de la cabecera de escritorio (Miguel 2026-09-17:
   "elimina el acceso a departamentos, ya tenemos muchos"): el renglon con
   desplegable y los circulos del home ya cubren esa funcion. En movil sigue
   en el menu hamburguesa (vista 6937). El mega menu viejo (.er_panel) tambien
   se apaga en escritorio: sin boton no hay quien lo abra. */
@media (min-width:992px){ header#top .er_dep_btn, header#top .er_panel{display:none !important;}
  /* sin el boton, la rejilla de la 6936 (auto auto 1fr auto) dejaba el buscador
     en una columna auto y quedaba de 200px: tres columnas, el buscador crece */
  header#top .er_cabecera{grid-template-columns:auto minmax(0,1fr) auto !important;}
  header#top .er_cabecera .er_buscar{max-width:820px !important;} }
/* Departamentos: pastilla gris, texto tinta (por si se reactiva). */
header#top .er_dep_btn{background:var(--er-gris) !important;color:var(--er-ink) !important;border-radius:999px !important;padding:0 18px 0 16px !important;height:46px;font-size:15px !important;font-weight:600 !important;}
header#top .er_dep_btn:hover,header#top .er_dep_btn[aria-expanded="true"]{background:var(--er-gris2) !important;color:#490AA0 !important;}
header#top .er_dep_btn .er_ham i{background:currentColor !important;}
header#top .er_dep_btn .er_flecha{color:#490AA0;}

/* Buscador: pildora gris sin borde; al enfocar, blanco con aro morado. */
header#top .er_buscar input{background:var(--er-gris) !important;border:2px solid transparent !important;border-radius:999px !important;height:46px;padding:0 56px 0 22px !important;font-size:15px !important;color:var(--er-ink) !important;}
header#top .er_buscar input:focus{background:#fff !important;border-color:#490AA0 !important;box-shadow:none !important;}
header#top .er_buscar input::placeholder{color:#8B8598 !important;}
header#top .er_buscar button{background:#490AA0 !important;color:#fff !important;width:38px !important;height:38px !important;top:4px !important;bottom:auto !important;right:4px !important;border-radius:50% !important;}
header#top .er_buscar button:hover{background:#2E0668 !important;}

/* Lado derecho: pastillas outline, sesion llena, iconos en circulo gris. */
header#top .er_cabecera ul.navbar-nav{gap:8px !important;}
header#top .er-prem-pill{display:inline-flex !important;align-items:center;height:42px;padding:0 16px;border:1.5px solid #490AA0;border-radius:999px;color:#490AA0 !important;font-size:14px;font-weight:600;text-decoration:none !important;white-space:nowrap;background:#fff;}
header#top .er-prem-pill:hover{background:#F7F4FD;}
header#top nav a[href*="/web/login"],header#top .er_cabecera a[href*="/web/login"]{background:#490AA0 !important;color:#fff !important;border-radius:999px !important;height:42px;padding:0 18px !important;font-size:14px !important;font-weight:600 !important;display:inline-flex !important;align-items:center;border:0 !important;}
header#top nav a[href*="/web/login"]:hover,header#top .er_cabecera a[href*="/web/login"]:hover{background:#2E0668 !important;color:#fff !important;}
header#top a[href*="/web/login"] .er_ico_user{stroke:#fff !important;}
/* Con sesion iniciada Odoo pinta un menu de usuario (portal.user_dropdown) que
   heredaba el amarillo del tema viejo: pasa a pastilla gris "Mi cuenta". */
header#top .er_cabecera a.dropdown-toggle[data-bs-toggle="dropdown"]{background:var(--er-gris) !important;color:var(--er-ink) !important;border-radius:999px !important;height:42px;padding:0 14px 0 14px !important;display:inline-flex !important;align-items:center;gap:7px;font-size:14px !important;font-weight:600 !important;border:0 !important;text-decoration:none !important;}
header#top .er_cabecera a.dropdown-toggle[data-bs-toggle="dropdown"]:hover,header#top .er_cabecera a.dropdown-toggle[data-bs-toggle="dropdown"][aria-expanded="true"]{background:var(--er-gris2) !important;color:#490AA0 !important;}
header#top .er_cabecera a.dropdown-toggle[data-bs-toggle="dropdown"] .fa{color:#490AA0;font-size:15px;line-height:1;}
header#top .er_cabecera a.dropdown-toggle[data-bs-toggle="dropdown"] > div{display:inline-flex;}
header#top .er_cabecera a.dropdown-toggle[data-bs-toggle="dropdown"]::after{color:#490AA0;margin-left:2px;}
header#top .er_cabecera .dropdown-menu.js_usermenu{border:1px solid var(--er-linea);border-radius:12px;box-shadow:0 10px 28px rgba(46,6,104,.12);padding:6px;min-width:200px;}
header#top .er_cabecera .dropdown-menu.js_usermenu .dropdown-item{border-radius:8px;font-size:14px;color:var(--er-ink);padding:8px 12px !important;}
header#top .er_cabecera .dropdown-menu.js_usermenu .dropdown-item:hover{background:var(--er-gris);color:#490AA0;}
/* Orden fijo del lado derecho, pase lo que pase con el DOM (la vista 6936 lo
   reordena varias veces): Factura · Mis pedidos · sesion/cuenta · favoritos · carrito */
header#top .er_cabecera ul.navbar-nav .er-prem-li{order:1;}
header#top .er_cabecera ul.navbar-nav li:has(> a[href*="/web/login"]),header#top .er_cabecera ul.navbar-nav li:has(> .js_usermenu){order:2;}
header#top .er_cabecera ul.navbar-nav li.o_wsale_my_wish{order:3;}
header#top .er_cabecera ul.navbar-nav li.o_wsale_my_cart{order:4;}
header#top .o_wsale_my_cart a,header#top .o_wsale_my_wish a{width:44px;height:44px;background:var(--er-gris) !important;color:var(--er-ink) !important;display:inline-flex !important;align-items:center;justify-content:center;border-radius:50% !important;padding:0 !important;}
header#top .o_wsale_my_cart a:hover,header#top .o_wsale_my_wish a:hover{background:var(--er-gris2) !important;color:#490AA0 !important;}
header#top .o_wsale_my_cart .fa,header#top .o_wsale_my_wish .fa{font-size:17px;line-height:1;}
/* fa-stack reserva una caja de 2em con line-height 2em y el icono quedaba
   descentrado dentro del circulo: se anula y se centra con flex */
header#top .o_wsale_my_cart a > div,header#top .o_wsale_my_wish a > div{display:flex;align-items:center;justify-content:center;width:100%;height:100%;}
header#top .o_wsale_my_cart .fa-stack,header#top .o_wsale_my_wish .fa-stack{width:auto !important;height:auto !important;line-height:1 !important;vertical-align:middle;}
header#top .my_cart_quantity,header#top .my_wish_quantity{background-color:#FFD426 !important;color:#490AA0 !important;font-weight:700;border:2px solid #fff;}

/* 3. Renglon de departamentos (solo escritorio) con desplegable al pasar el
   raton, como MAHA: subcategorias a la izquierda, vista previa a la derecha. */
.er-prem-nav{background:#fff;border-bottom:1px solid var(--er-linea);position:relative;}
.er-prem-nav-in{max-width:1288px;margin:0 auto;padding:0 24px;display:flex;gap:24px;height:44px;align-items:center;overflow-x:auto;scrollbar-width:none;}
.er-prem-nav-in::-webkit-scrollbar{display:none;}
.er-prem-nav-in a{display:inline-flex;align-items:center;gap:5px;height:44px;color:var(--er-ink) !important;font-size:14px;font-weight:600;white-space:nowrap;text-decoration:none !important;border-bottom:2px solid transparent;}
.er-prem-nav-in a svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:.7;transition:transform .15s;}
.er-prem-nav-in a:hover,.er-prem-nav-in a.er-on{color:#490AA0 !important;}
.er-prem-nav-in a.er-on{border-bottom-color:#490AA0;}
.er-prem-nav-in a.er-on svg{transform:rotate(180deg);}
.er-prem-mega{position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--er-linea);box-shadow:0 18px 40px rgba(46,6,104,.14);z-index:1045;}
.er-prem-mega[hidden]{display:none;}
.er-prem-mega-in{max-width:1288px;margin:0 auto;padding:22px 24px 26px;display:flex;gap:26px;align-items:flex-start;}
.er-prem-mega-lista{list-style:none;margin:0;padding:0;width:300px;flex:0 0 300px;display:grid;grid-template-columns:1fr;gap:2px;}
.er-prem-mega-lista.er-prem-dos{width:540px;flex-basis:540px;grid-template-columns:1fr 1fr;column-gap:10px;}
.er-prem-mega-lista li a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px;border-radius:10px;color:var(--er-ink) !important;font-size:15px;font-weight:600;line-height:1.25;text-decoration:none !important;}
.er-prem-mega-lista li a:hover,.er-prem-mega-lista li a.er-on{background:var(--er-gris);color:#490AA0 !important;}
.er-prem-mega-lista li a svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;flex:none;opacity:.7;}
.er-prem-mega-l2{border-left:1px solid var(--er-linea);padding-left:14px;width:270px;flex-basis:270px;}
.er-prem-mega-l2[hidden]{display:none;}
.er-prem-mega-prev{margin-left:auto;width:300px;flex:0 0 300px;display:flex;flex-direction:column;gap:10px;text-decoration:none !important;color:var(--er-ink) !important;}
.er-prem-mega-img{display:flex;align-items:center;justify-content:center;width:300px;height:300px;border-radius:16px;background:#F5F4F8;overflow:hidden;}
.er-prem-mega-img img{max-width:82%;max-height:82%;object-fit:contain;mix-blend-mode:multiply;}
.er-prem-mega-nom{font-size:16px;font-weight:600;line-height:1.25;}
.er-prem-mega-cta{font-size:14px;font-weight:700;color:#490AA0;}
.er-prem-mega-prev:hover .er-prem-mega-cta{text-decoration:underline;}

/* 4. Circulos de departamentos (home), estilo MAHA. */
.er-prem-circ{background:#fff;padding:22px 0 4px;}
.er-prem-circ-in{max-width:1288px;margin:0 auto;padding:0 24px;display:flex;justify-content:space-between;gap:12px;overflow-x:auto;scrollbar-width:none;}
.er-prem-circ-in::-webkit-scrollbar{display:none;}
.er-prem-circ a{flex:0 0 auto;width:124px;display:flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none !important;color:var(--er-ink) !important;}
.er-prem-circ-img{width:92px;height:92px;border-radius:50%;background:var(--er-gris);display:flex;align-items:center;justify-content:center;transition:background .15s,transform .15s;}
.er-prem-circ a:hover .er-prem-circ-img{background:var(--er-gris2);transform:translateY(-2px);}
.er-prem-circ-img img{width:76%;height:76%;object-fit:contain;}
/* con foto editorial: la foto llena el circulo */
.er-prem-circ-img.er-prem-foto img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
/* con SELLO (ref. KEX): sin circulo gris, el recorte real sobre la estrella de marca */
.er-prem-circ.er-prem-sellos{padding:26px 0 8px;}
.er-prem-circ.er-prem-sellos .er-prem-circ-img{background:transparent !important;width:150px;height:150px;border-radius:0;}
.er-prem-circ.er-prem-sellos .er-prem-circ-img img{width:100%;height:100%;object-fit:contain;border-radius:0;transition:transform .18s;}
.er-prem-circ.er-prem-sellos a:hover .er-prem-circ-img{transform:none;background:transparent !important;}
.er-prem-circ.er-prem-sellos a:hover .er-prem-circ-img img{transform:translateY(-4px) scale(1.04);}
.er-prem-circ.er-prem-sellos a{width:154px;gap:4px;}
.er-prem-circ.er-prem-sellos .er-prem-circ-tx{font-weight:600;}
/* MOVIMIENTO (Miguel 2026-09-17: "se ven bien pero necesito que tengan movimiento"):
   la fila es una CINTA que avanza sola (JS con requestAnimationFrame sobre
   scrollLeft, los 8 sellos duplicados para que nunca se acabe), se detiene al
   pasar el raton o tocar, tiene flechas como KEX, y cada sello FLOTA con un
   vaiven suave desfasado. Todo se apaga con prefers-reduced-motion. */
.er-prem-circ.er-prem-sellos{position:relative;}
.er-prem-circ.er-prem-sellos .er-prem-circ-in{justify-content:flex-start;gap:18px;padding:0 64px;scroll-behavior:auto;}
.er-prem-circ.er-prem-sellos .er-prem-circ-in > a{animation:er-flota 4.2s ease-in-out infinite;}
.er-prem-circ.er-prem-sellos .er-prem-circ-in > a:nth-child(8n+2){animation-delay:-.6s;}
.er-prem-circ.er-prem-sellos .er-prem-circ-in > a:nth-child(8n+3){animation-delay:-1.3s;}
.er-prem-circ.er-prem-sellos .er-prem-circ-in > a:nth-child(8n+4){animation-delay:-2.1s;}
.er-prem-circ.er-prem-sellos .er-prem-circ-in > a:nth-child(8n+5){animation-delay:-2.8s;}
.er-prem-circ.er-prem-sellos .er-prem-circ-in > a:nth-child(8n+6){animation-delay:-3.4s;}
.er-prem-circ.er-prem-sellos .er-prem-circ-in > a:nth-child(8n+7){animation-delay:-1.7s;}
.er-prem-circ.er-prem-sellos .er-prem-circ-in > a:nth-child(8n){animation-delay:-3.9s;}
.er-prem-circ.er-prem-sellos .er-prem-circ-in > a:hover{animation-play-state:paused;}
@keyframes er-flota{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.er-prem-circ.er-prem-sellos .er-prem-fl{position:absolute;top:calc(50% - 32px);width:44px;height:44px;border-radius:50%;border:1px solid #ECEAF1;background:#fff;color:#141018;box-shadow:0 4px 16px rgba(46,6,104,.12);cursor:pointer;z-index:2;display:flex;align-items:center;justify-content:center;padding:0;}
.er-prem-circ.er-prem-sellos .er-prem-fl:hover{color:#490AA0;border-color:#490AA0;}
.er-prem-circ.er-prem-sellos .er-prem-fl svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}
.er-prem-circ.er-prem-sellos .er-prem-fl-prev{left:12px;}.er-prem-circ.er-prem-sellos .er-prem-fl-next{right:12px;}
@media (max-width:991.98px){ .er-prem-circ.er-prem-sellos .er-prem-circ-img{width:104px;height:104px;} .er-prem-circ.er-prem-sellos a{width:112px;} .er-prem-circ.er-prem-sellos .er-prem-circ-in{padding:0 12px;gap:8px;} .er-prem-circ.er-prem-sellos .er-prem-fl{display:none;} }
@media (prefers-reduced-motion: reduce){ .er-prem-circ.er-prem-sellos .er-prem-circ-in > a{animation:none;} }
.er-prem-circ-tx{font-size:13.5px;font-weight:500;text-align:center;line-height:1.25;color:var(--er-ink);}

/* 5. Movil: misma cabecera blanca, compacta. */
@media (max-width:991.98px){
  .er-prem-tag,.er-prem-soc,.er-prem-nav{display:none !important;}
  /* En movil la barra superior va en DOS lineas limpias: arriba la entrega,
     abajo la ubicacion + envio gratis (con C.P. puesto el texto es largo y en
     una linea se partia en tres, Miguel 2026-09-17). Facturacion, Puntos y los
     separadores sobran: ya viven en el menu hamburguesa. */
  .er-cob-in{padding:7px 16px 8px !important;min-height:0;gap:0 !important;flex-wrap:wrap !important;overflow:visible;}
  .er-cob-in .er-cob-sep,.er-cob-in .er-cob-fac{display:none !important;}
  .er-cob-in .er-cob-abre{flex:0 0 100%;justify-content:flex-start;padding:2px 0 !important;font-size:13px !important;white-space:nowrap;}
  .er-cob-in .er-cob-lugar{flex:0 0 100%;display:flex;align-items:center;gap:6px;font-size:12.5px !important;padding:2px 0 0;min-width:0;}
  .er-cob-in .er-cob-cp{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .er-cob-in .er-cob-cp *{white-space:nowrap;}
  header#top nav.o_header_mobile{padding:8px 0 !important;}
  header#top .o_header_mobile .er_cab_movil .navbar-brand img{width:auto !important;height:38px !important;}
  header#top .o_header_mobile .er_buscar input{height:40px;padding:0 44px 0 16px !important;font-size:16px !important;}
  header#top .o_header_mobile .er_buscar button{width:32px !important;height:32px !important;top:4px !important;right:4px !important;}
  header#top .o_header_mobile .o_header_mobile_buttons_wrap .btn{width:40px;height:40px;}
  /* en movil el carrito va como icono limpio (sin circulo gris), del mismo
     tamano y peso que el menu hamburguesa; el area de toque sigue en 40px */
  header#top .o_header_mobile .o_wsale_my_cart a{background:transparent !important;width:40px;height:40px;margin-right:-4px;}
  header#top .o_header_mobile .o_wsale_my_cart a:hover{background:transparent !important;}
  header#top .o_header_mobile .o_wsale_my_cart .fa{font-size:23px;color:var(--er-ink);}
  header#top .o_header_mobile .my_cart_quantity{top:2px !important;right:0 !important;margin:0 !important;min-width:18px;height:18px;line-height:14px;font-size:11px;padding:0 4px;}
  header#top .o_header_mobile .navbar-toggler-icon{filter:none !important;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23141018' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.4' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;}
  .er-prem-circ{padding:18px 0 2px;}
  .er-prem-circ-in{justify-content:flex-start;gap:4px;padding:0 10px;}
  .er-prem-circ a{width:94px;gap:7px;}
  .er-prem-circ-img{width:72px;height:72px;}
  .er-prem-circ-tx{font-size:12px;}
}


/* ===== PREMIUM · HOME, TARJETAS Y SECCIONES (ref. MAHA) — 2026-09-17 ===== */
/* Lienzo blanco de arriba a abajo, como MAHA. */
#wrapwrap > main{background:#fff;}
/* Barra de desplazamiento fina y discreta (Miguel 2026-09-17: "no me gusta la
   barra del lado derecho"). Safari con mouse o con "mostrar barras siempre"
   pinta la clasica, ancha y gris. Solo propiedades ESTANDAR (scrollbar-width /
   scrollbar-color): con ::-webkit-scrollbar la barra se vuelve fija para todos,
   tambien para quien usa trackpad, y eso se ve peor. */
html{scrollbar-width:thin;scrollbar-color:#C9C3D6 #FFFFFF;}
html:hover{scrollbar-color:#B5ADC9 #FFFFFF;}
.er_hero{background:#fff !important;}
.s_dynamic_snippet_products{background:#fff !important;padding-top:8px !important;}
.er_sec_in{max-width:1240px !important;}

/* Titulos de seccion: grandes, a la izquierda, "Ver todos" a la derecha. */
.er_sec_tit{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:18px;}
.er_sec_tit h2{font-size:30px !important;letter-spacing:-.02em !important;margin:0 !important;color:#141018 !important;}
.er_sec_tit h2 em{color:#490AA0 !important;font-style:normal;}
.er_sec_tit a{font-size:14px !important;font-weight:700 !important;color:#141018 !important;text-decoration:none !important;}
.er_sec_tit a:hover{color:#490AA0 !important;}
.s_dynamic_snippet_title h2{font-size:30px !important;letter-spacing:-.02em !important;margin-bottom:2px !important;color:#141018 !important;}
.s_dynamic_snippet_title p.lead{font-size:15px !important;color:#6B6578 !important;margin:0 !important;}
.s_dynamic_snippet_title a{font-size:14px !important;font-weight:700 !important;color:#141018 !important;text-decoration:none !important;}
.s_dynamic_snippet_title a:hover{color:#490AA0 !important;}

/* Rejilla de departamentos: neutra (gris claro), sin colores por departamento. */
.er_deps .er_dep_t,.er_deps .er_dep_t:nth-child(n){background:#fff !important;border:1px solid #ECEAF1 !important;border-radius:16px !important;box-shadow:none !important;}
.er_deps .er_dep_t:hover,.er_deps .er_dep_t:nth-child(n):hover{box-shadow:0 10px 26px rgba(46,6,104,.10) !important;border-color:#D9D3E6 !important;}
.er_deps .er_dep_t:nth-child(n) .er_dep_img,.er_deps .er_dep_t:nth-child(n):hover .er_dep_img{background:#F3F2F7 !important;}
.er_deps .er_dep_t:nth-child(n) .er_dep_tx b{color:#141018 !important;text-transform:none !important;font-size:15px !important;font-weight:600 !important;letter-spacing:0 !important;line-height:1.25;}
.er_deps .er_dep_t:nth-child(n) .er_dep_tx i{color:#6B6578 !important;font-size:12.5px !important;}

/* Tienda a TODO el ancho (Miguel 2026-09-17: "aqui que abarquen todo el ancho"):
   el contenedor de Odoo deja de limitarse a 1320px; el lateral de filtros crece
   un poco y la rejilla (4 por fila) gana tarjetas grandes, como MAHA. */
@media (min-width:1200px){
  #wrap .o_wsale_products_page .o_wsale_page_contained.container,#wrap .o_wsale_products_page .container{max-width:none !important;width:100% !important;padding-left:32px !important;padding-right:32px !important;}
  #products_grid_before{max-width:280px !important;flex:0 0 280px !important;}
  .o_wsale_products_main_row{padding-top:24px !important;}
}
/* Sellos del mosaico con MOVIMIENTO (vaiven suave desfasado; pausa al pasar el
   raton; nada con prefers-reduced-motion). */
.er_deps .er_dep_t:nth-child(n) .er_dep_img{animation:er-flota-m 4.4s ease-in-out infinite;}
.er_deps .er_dep_t:nth-child(2) .er_dep_img{animation-delay:-.7s;}
.er_deps .er_dep_t:nth-child(3) .er_dep_img{animation-delay:-1.5s;}
.er_deps .er_dep_t:nth-child(4) .er_dep_img{animation-delay:-2.2s;}
.er_deps .er_dep_t:nth-child(5) .er_dep_img{animation-delay:-3.1s;}
.er_deps .er_dep_t:nth-child(6) .er_dep_img{animation-delay:-1.1s;}
.er_deps .er_dep_t:nth-child(7) .er_dep_img{animation-delay:-2.7s;}
.er_deps .er_dep_t:nth-child(8) .er_dep_img{animation-delay:-3.7s;}
.er_deps .er_dep_t:hover .er_dep_img{animation-play-state:paused;transform:translateY(-6px) scale(1.03);transition:transform .2s;}
@keyframes er-flota-m{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media (prefers-reduced-motion: reduce){ .er_deps .er_dep_t:nth-child(n) .er_dep_img{animation:none;} }
/* Tarjeta de producto en la tienda (#products_grid): foto sobre gris claro,
   nombre tinta, precio grande, CTA morado a todo el ancho (ref. MAHA). */
#products_grid .oe_product .o_wsale_product_grid_wrapper{background:#fff !important;border:1px solid #ECEAF1 !important;border-radius:16px !important;box-shadow:none !important;transition:box-shadow .15s,border-color .15s;}
#products_grid .oe_product:hover .o_wsale_product_grid_wrapper{box-shadow:0 12px 28px rgba(46,6,104,.10) !important;border-color:#D9D3E6 !important;}
#products_grid .oe_product .oe_product_image,#products_grid .oe_product .oe_product_image_link{background:#F5F4F8 !important;border-radius:12px !important;overflow:hidden;}
#products_grid .oe_product .oe_product_image img{mix-blend-mode:multiply;}
#products_grid .oe_product .o_wsale_products_item_title a{color:#141018 !important;font-weight:600 !important;font-size:14.5px !important;line-height:1.3 !important;}
#products_grid .oe_product .o_wsale_item_brand{color:#6B6578 !important;}
#products_grid .oe_product .product_price{margin-top:10px !important;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;}
#products_grid .oe_product .product_price .fw-bold,#products_grid .oe_product .product_price .oe_currency_value{color:#141018 !important;font-size:24px !important;line-height:1.1;}
#products_grid .oe_product .product_price .er_um_precio{font-size:13px !important;color:#6B6578 !important;font-weight:500 !important;}
/* Renglones informativos estilo MAHA en vez de pastillas: IVA incluido (lo
   inserta el JS de abajo), top ventas y vendidas este mes como texto con icono */
#products_grid .oe_product .er-prem-iva{display:flex;align-items:center;gap:6px;font-size:13px;color:#3E3A48;margin:6px 0 0;}
#products_grid .oe_product .er-prem-iva svg{width:15px;height:15px;stroke:#1B7F3B;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;flex:none;}
/* 2026-09-19: "Impuestos incluidos" (antes "IVA incluido": hay IVA 0% e IEPS) es mas largo; a 375 px partia en dos renglones */
/* 2026-09-19 (Miguel: la etiqueta de envio "se interpone con otros elementos de la imagen"): la cinta
   nativa de Odoo (product.ribbon 5 Envio Nacional / 6 Envio Local, las unicas o_right) ya no se pinta
   sobre la foto; el JS la convierte en un renglon con camion bajo "Impuestos incluidos". */
#products_grid .o_ribbons.o_right,#product_detail .o_ribbons.o_right{display:none !important;}
#products_grid .oe_product .er-prem-envio{display:flex;align-items:center;gap:6px;font-size:13px;color:#3E3A48;margin:5px 0 0;}
#products_grid .oe_product .er-prem-envio svg{width:15px;height:15px;stroke:#490AA0;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;}
/* Renglones a 12 px SIEMPRE y sin recortar: medido el 2026-09-19, la tarjeta deja 111 px utiles a 900 px de
   pantalla y 142 px a 1366 (con la barra lateral); "Impuestos incluidos" pide 128. nowrap lo cortaba contra el
   borde; ahora cabe en una linea porque la tarjeta angosta cede relleno, y si aun asi no cabe, parte (nunca se corta). */
#products_grid .oe_product .er-prem-iva,#products_grid .oe_product .er-prem-envio{font-size:12px;gap:4px;line-height:1.3;align-items:flex-start;}
#products_grid .oe_product .er-prem-iva svg,#products_grid .oe_product .er-prem-envio svg{width:13px;height:13px;margin-top:1px;}
/* telefono (2 columnas, 115 px utiles) y tablet (4 columnas, 111 px): la tarjeta cede relleno -> 131 y 129 px */
@media (max-width:1199.98px){
  #products_grid .oe_product .o_wsale_product_grid_wrapper{padding-left:6px !important;padding-right:6px !important;}
  #products_grid .oe_product .o_wsale_product_information{padding-left:9px !important;padding-right:9px !important;}
  #products_grid .oe_product .er-prem-iva svg,#products_grid .oe_product .er-prem-envio svg{width:12px;height:12px;}
}
/* el boton se recortaba ("regar al carri") en tarjetas de 161-196 px: ocupa todo el ancho y cede relleno */
@media (min-width:576px) and (max-width:1499.98px){
  #products_grid .oe_product form.oe_product_cart .o_wsale_product_action_row .o_wsale_product_btn_primary{width:100% !important;max-width:none !important;padding-left:8px !important;padding-right:8px !important;font-size:13.5px !important;}
}
#products_grid .oe_product .er_top_chip{font-size:11px !important;padding:3px 9px !important;margin:8px 0 0 !important;}
#products_grid .oe_product .er_vendidas{margin:6px 0 0 !important;min-height:0 !important;}
#products_grid .oe_product .er_vendidas .er_v_pill{background:transparent !important;border:0 !important;padding:0 !important;color:#3E3A48 !important;font-size:13px !important;font-weight:500 !important;justify-content:flex-start !important;text-align:left !important;box-shadow:none !important;}
#products_grid .oe_product .er_vendidas .er_v_pill b{color:#141018 !important;}
#products_grid .oe_product .er_vendidas .er_v_pill svg{stroke:#490AA0 !important;color:#490AA0 !important;}
/* el boton dice "Agregar al carrito" con su etiqueta real, sin icono */
#products_grid .oe_product .o_wsale_product_btn_primary .o_label{display:inline !important;font-size:14px !important;margin:0 !important;}
#products_grid .oe_product .o_wsale_product_btn_primary:after{content:none !important;}
#products_grid .oe_product .o_wsale_product_btn_primary .fa{display:none !important;}
#products_grid .oe_product .o_wsale_product_btn{margin-top:14px !important;}
/* .o_wsale_product_sub es una COLUMNA flex (vista 6918): el boton va al final,
   estirado a todo el ancho. ⚠️ flex-basis aqui es ALTO, no ancho: no usar flex:1. */
#products_grid .oe_product .o_wsale_product_sub{display:flex !important;flex-direction:column !important;align-items:stretch !important;gap:0 !important;}
#products_grid .oe_product .o_wsale_product_btn{order:9 !important;width:100% !important;flex:0 0 auto !important;margin:10px 0 0 !important;position:static !important;display:block !important;}
#products_grid .oe_product .o_wsale_product_action_row{display:flex !important;width:100% !important;justify-content:stretch !important;}
#products_grid .oe_product .o_wsale_product_grid_wrapper .o_wsale_product_btn_primary{flex:1 1 auto !important;width:100% !important;display:inline-flex !important;justify-content:center;align-items:center;height:42px !important;min-height:42px !important;border-radius:10px !important;font-size:14px !important;font-weight:650 !important;background:#490AA0 !important;border-color:#490AA0 !important;color:#fff !important;padding:0 14px !important;transform:none !important;}
#products_grid .oe_product .o_wsale_product_grid_wrapper .o_wsale_product_btn_primary:hover{background:#2E0668 !important;border-color:#2E0668 !important;}
/* movil (2026-09-17): a 375px la tarjeta mide 165px y "Agregar al carrito" (124px)
   no cabia en 95px de boton: el texto se cortaba en las orillas. Boton de 44px,
   menos relleno y JS_B acorta el rotulo a "Agregar". */
@media (max-width:575.98px){
  #products_grid .oe_product .o_wsale_product_grid_wrapper .o_wsale_product_btn_primary{height:44px !important;min-height:44px !important;padding:0 10px !important;font-size:14px !important;overflow:hidden;}
}
/* Android (foto de Miguel 2026-09-17): en /shop la fila de Odoo buscador + "Ordenar
   por" + "Filtros" es flex-nowrap y mide 501 px en un telefono de 375: la pagina se
   podia arrastrar a la izquierda y asomaba el fondo morado del html. La fila se parte
   en dos renglones y, como red de seguridad, el html no admite desplazamiento
   horizontal en movil (en body solo no basta en Chrome Android / Safari). */
@media (max-width:991.98px){
  html,body{overflow-x:hidden !important;max-width:100vw;}
  html{overflow-x:clip !important;}
  #wrap .products_header.btn-toolbar{flex-wrap:wrap !important;max-width:100% !important;row-gap:8px;}
  #wrap .products_header > form.o_wsale_products_searchbar_form{flex:1 1 100% !important;margin-right:0 !important;}
  #wrap .products_header .o_sortby_dropdown{flex:1 1 auto !important;}
  #wrap .products_header .o_sortby_dropdown .dropdown-toggle{width:100%;}
  #wrap .products_header > .btn.d-lg-none{flex:0 0 auto !important;}
}
/* esqueleto de "Recien llegados" (snippet dinamico) en lila, no gris roto */
.s_dynamic_snippet_holder .placeholder{background:#EDE9F5 !important;opacity:.9 !important;}

/* La misma tarjeta en los carruseles del home. */
.o_carousel_product_card{background:#fff !important;border:1px solid #ECEAF1 !important;border-radius:16px !important;box-shadow:none !important;}
.o_carousel_product_card:hover{box-shadow:0 12px 28px rgba(46,6,104,.10) !important;border-color:#D9D3E6 !important;}
.o_carousel_product_card .oe_product_image{background:#F5F4F8 !important;border-radius:12px !important;overflow:hidden;}
.o_carousel_product_card .oe_product_image img,.o_carousel_product_card .oe_product_image_img{mix-blend-mode:multiply;}
.o_carousel_product_card .o_wsale_products_item_title a{color:#141018 !important;font-weight:600 !important;}
.o_carousel_product_card .product_price .fw-bold,.o_carousel_product_card .product_price .oe_currency_value{color:#141018 !important;}
.o_carousel_product_card .o_wsale_product_btn_primary{border-radius:10px !important;background:#490AA0 !important;color:#fff !important;}

/* Marcas del home OCULTAS (Miguel 2026-09-17: "la seccion de marcas que esta en
   medio del home quitala, ya tenemos la de abajo" -> la marquesina del pie).
   Viven en la misma seccion que los testimonios: se esconde solo el bloque
   .sec que contiene .brands-ticker-wrap, no la seccion entera. */
.elrey-page .sec:has(.brands-ticker-wrap){display:none !important;}
/* Banda de cifras: de morado saturado a tarjeta blanca con numeros morados. */
.elrey-page .stats-strip{background:#fff !important;border:1px solid #ECEAF1 !important;border-radius:16px !important;box-shadow:none !important;overflow:hidden;}
.elrey-page .stat,.elrey-page .stat:nth-child(n){background:#fff !important;border-color:#ECEAF1 !important;}
.elrey-page .stat + .stat{border-left:1px solid #ECEAF1 !important;}
.elrey-page .stat-n,.elrey-page .stat.visible .stat-n{color:#490AA0 !important;}
.elrey-page .stat-l,.elrey-page .stat:hover .stat-l{color:#6B6578 !important;}
.elrey-page .stat:hover{background:#F8F7FB !important;}
.elrey-page .stat-bar{background:#ECEAF1 !important;}
.elrey-page .stat-bar-fill{background:#FFD426 !important;}

/* Preguntas frecuentes: de bloque morado a seccion clara con tarjetas blancas. */
.elrey-page .sec--dark{background:#F6F5F9 !important;color:#141018 !important;}
.elrey-page .sec--dark .sec-tag{color:#490AA0 !important;}
.elrey-page .sec--dark .sec-h{color:#141018 !important;}
.elrey-page .sec--dark .sec-h span{color:#490AA0 !important;}
.elrey-page .faq-item,.elrey-page .faq-item.open{background:#fff !important;border:1px solid #ECEAF1 !important;border-radius:14px !important;}
.elrey-page .faq-item.open{border-color:#D9D3E6 !important;}
.elrey-page .faq-q{color:#141018 !important;}
.elrey-page .faq-a{color:#3E3A48 !important;}
.elrey-page .faq-icon{background:#F3F2F7 !important;color:#490AA0 !important;}
.elrey-page .faq-item.open .faq-icon{background:#490AA0 !important;color:#fff !important;}

/* Fotos editoriales por departamento en el mosaico (generado al desplegar) */
.er_deps .er_dep_t:nth-child(n) .er_dep_img{animation:none !important;position:relative;}.er_deps .er_dep_t:nth-child(n) .er_dep_img::after{content:"";position:absolute;inset:0;background-position:center;background-size:cover;animation:er-kb 16s ease-in-out infinite alternate;will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden;}.er_deps .er_dep_t:nth-child(2n) .er_dep_img::after{animation-delay:-8s;}.er_deps .er_dep_t:nth-child(3n) .er_dep_img::after{animation-duration:19s;}.er_deps .er_dep_t:hover .er_dep_img::after{animation-play-state:paused;transform:scale(1.08);transition:transform .5s;}.er_deps .er_dep_t:hover .er_dep_img{transform:none !important;}@keyframes er-kb{from{transform:scale(1) translate(0,0)}to{transform:scale(1.1) translate(-2%,-2%)}}@media (max-width:767.98px){.er_deps .er_dep_t:nth-child(n) .er_dep_img::after{animation-name:er-kb-m;animation-duration:24s;}}@keyframes er-kb-m{from{transform:scale(1.02) translate(0,0)}to{transform:scale(1.08) translate(-1%,-1%)}}@media (prefers-reduced-motion: reduce){.er_deps .er_dep_t:nth-child(n) .er_dep_img::after{animation:none;}}
.er_deps .er_dep_t.er-vis[href$="-178"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65716?unique=21049e42");}
@media (max-width:767.98px){.er_deps .er_dep_t.er-vis[href$="-178"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65715?unique=f7b1ee58");}}
.er_deps .er_dep_t[href$="-178"]:nth-child(n){padding:10px 10px 16px !important;aspect-ratio:auto !important;}.er_deps .er_dep_t[href$="-178"]:nth-child(n) .er_dep_img{width:100% !important;height:auto !important;aspect-ratio:1/1;border-radius:12px !important;background:#F5F4F8 !important;overflow:hidden;margin:0 0 12px !important;padding:0 !important;display:block;}.er_deps .er_dep_t[href$="-178"]:nth-child(n) .er_dep_img img{opacity:0 !important;width:100% !important;height:100% !important;display:block;}
.er_deps .er_dep_t.er-vis[href$="-159"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65718?unique=1409c29a");}
@media (max-width:767.98px){.er_deps .er_dep_t.er-vis[href$="-159"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65717?unique=ab0c8208");}}
.er_deps .er_dep_t[href$="-159"]:nth-child(n){padding:10px 10px 16px !important;aspect-ratio:auto !important;}.er_deps .er_dep_t[href$="-159"]:nth-child(n) .er_dep_img{width:100% !important;height:auto !important;aspect-ratio:1/1;border-radius:12px !important;background:#F5F4F8 !important;overflow:hidden;margin:0 0 12px !important;padding:0 !important;display:block;}.er_deps .er_dep_t[href$="-159"]:nth-child(n) .er_dep_img img{opacity:0 !important;width:100% !important;height:100% !important;display:block;}
.er_deps .er_dep_t.er-vis[href$="-102"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65720?unique=a1359872");}
@media (max-width:767.98px){.er_deps .er_dep_t.er-vis[href$="-102"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65719?unique=e4a21e31");}}
.er_deps .er_dep_t[href$="-102"]:nth-child(n){padding:10px 10px 16px !important;aspect-ratio:auto !important;}.er_deps .er_dep_t[href$="-102"]:nth-child(n) .er_dep_img{width:100% !important;height:auto !important;aspect-ratio:1/1;border-radius:12px !important;background:#F5F4F8 !important;overflow:hidden;margin:0 0 12px !important;padding:0 !important;display:block;}.er_deps .er_dep_t[href$="-102"]:nth-child(n) .er_dep_img img{opacity:0 !important;width:100% !important;height:100% !important;display:block;}
.er_deps .er_dep_t.er-vis[href$="-162"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65722?unique=5b600e8b");}
@media (max-width:767.98px){.er_deps .er_dep_t.er-vis[href$="-162"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65721?unique=647dbaf6");}}
.er_deps .er_dep_t[href$="-162"]:nth-child(n){padding:10px 10px 16px !important;aspect-ratio:auto !important;}.er_deps .er_dep_t[href$="-162"]:nth-child(n) .er_dep_img{width:100% !important;height:auto !important;aspect-ratio:1/1;border-radius:12px !important;background:#F5F4F8 !important;overflow:hidden;margin:0 0 12px !important;padding:0 !important;display:block;}.er_deps .er_dep_t[href$="-162"]:nth-child(n) .er_dep_img img{opacity:0 !important;width:100% !important;height:100% !important;display:block;}
.er_deps .er_dep_t.er-vis[href$="-163"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65724?unique=5145d514");}
@media (max-width:767.98px){.er_deps .er_dep_t.er-vis[href$="-163"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65723?unique=0757b2bc");}}
.er_deps .er_dep_t[href$="-163"]:nth-child(n){padding:10px 10px 16px !important;aspect-ratio:auto !important;}.er_deps .er_dep_t[href$="-163"]:nth-child(n) .er_dep_img{width:100% !important;height:auto !important;aspect-ratio:1/1;border-radius:12px !important;background:#F5F4F8 !important;overflow:hidden;margin:0 0 12px !important;padding:0 !important;display:block;}.er_deps .er_dep_t[href$="-163"]:nth-child(n) .er_dep_img img{opacity:0 !important;width:100% !important;height:100% !important;display:block;}
.er_deps .er_dep_t.er-vis[href$="-155"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65726?unique=87668e2e");}
@media (max-width:767.98px){.er_deps .er_dep_t.er-vis[href$="-155"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65725?unique=c021e5d7");}}
.er_deps .er_dep_t[href$="-155"]:nth-child(n){padding:10px 10px 16px !important;aspect-ratio:auto !important;}.er_deps .er_dep_t[href$="-155"]:nth-child(n) .er_dep_img{width:100% !important;height:auto !important;aspect-ratio:1/1;border-radius:12px !important;background:#F5F4F8 !important;overflow:hidden;margin:0 0 12px !important;padding:0 !important;display:block;}.er_deps .er_dep_t[href$="-155"]:nth-child(n) .er_dep_img img{opacity:0 !important;width:100% !important;height:100% !important;display:block;}
.er_deps .er_dep_t.er-vis[href$="-160"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65728?unique=e242b13f");}
@media (max-width:767.98px){.er_deps .er_dep_t.er-vis[href$="-160"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65727?unique=170ede4d");}}
.er_deps .er_dep_t[href$="-160"]:nth-child(n){padding:10px 10px 16px !important;aspect-ratio:auto !important;}.er_deps .er_dep_t[href$="-160"]:nth-child(n) .er_dep_img{width:100% !important;height:auto !important;aspect-ratio:1/1;border-radius:12px !important;background:#F5F4F8 !important;overflow:hidden;margin:0 0 12px !important;padding:0 !important;display:block;}.er_deps .er_dep_t[href$="-160"]:nth-child(n) .er_dep_img img{opacity:0 !important;width:100% !important;height:100% !important;display:block;}
.er_deps .er_dep_t.er-vis[href$="-161"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65730?unique=17d543de");}
@media (max-width:767.98px){.er_deps .er_dep_t.er-vis[href$="-161"]:nth-child(n) .er_dep_img::after{background-image:url("/web/image/65729?unique=f977a80a");}}
.er_deps .er_dep_t[href$="-161"]:nth-child(n){padding:10px 10px 16px !important;aspect-ratio:auto !important;}.er_deps .er_dep_t[href$="-161"]:nth-child(n) .er_dep_img{width:100% !important;height:auto !important;aspect-ratio:1/1;border-radius:12px !important;background:#F5F4F8 !important;overflow:hidden;margin:0 0 12px !important;padding:0 !important;display:block;}.er_deps .er_dep_t[href$="-161"]:nth-child(n) .er_dep_img img{opacity:0 !important;width:100% !important;height:100% !important;display:block;}


/* ===== PREMIUM · FICHA DE PRODUCTO (ref. MAHA) — 2026-09-17 ===== */
#product_detail{background:#fff;}
/* --- galeria: foto grande sobre gris claro, redondeada --- */
#product_detail #o-carousel-product .carousel-item,#product_detail #o-carousel-product .carousel-inner{background:#F5F4F8 !important;border-radius:16px;}
#product_detail #o-carousel-product .carousel-inner{padding:18px;}
#product_detail #o-carousel-product img{mix-blend-mode:multiply;}
/* ⚠️ Con multiply el blanco de la foto se vuelve transparente y DESTAPA el
   liston que Odoo repite dentro de cada carousel-item (antes lo tapaba la
   foto opaca): se oculta el interno, queda el del contenedor. */
#product_detail #o-carousel-product .carousel-item .o_ribbons{display:none !important;}
#product_detail .o_carousel_product_indicators li,#product_detail .o_carousel_product_indicators .carousel-indicator,#product_detail #o-carousel-product .carousel-indicators li{border:1.5px solid #ECEAF1 !important;border-radius:10px !important;background:#F5F4F8;overflow:hidden;}
#product_detail #o-carousel-product .carousel-indicators .active{border-color:#490AA0 !important;}
/* --- titulo --- */
#product_details .o_wsale_item_brand_pdp{font-size:12px !important;letter-spacing:.08em;text-transform:uppercase;color:#6B6578 !important;font-weight:600;}
#product_details h1{font-family:'Archivo Black',Impact,sans-serif !important;font-size:28px !important;line-height:1.1 !important;letter-spacing:-.01em;color:#141018 !important;margin:6px 0 8px !important;}
#product_details .er_ref{font-size:13px;color:#6B6578;}
#product_details .er_social{background:transparent !important;border:0 !important;padding:6px 0 0 !important;margin:6px 0 0 !important;box-shadow:none !important;color:#3E3A48;}
#product_details .er_social_ico{color:#490AA0;}
/* --- tarjeta de precio --- */
#product_details .o_wsale_product_details_content_section_price{background:#fff;border:1px solid #ECEAF1;border-radius:14px;padding:18px 18px 16px !important;margin-top:14px;}
#product_details .product_price .h5,#product_details .product_price .oe_price,#product_details .product_price .oe_currency_value{font-family:'Archivo Black',Impact,sans-serif !important;font-size:34px !important;color:#141018 !important;line-height:1.05;}
#product_details .product_price .oe_price ~ *,#product_details .product_price small,#product_details .product_price .text-muted{font-size:13px !important;color:#6B6578 !important;font-family:Inter,system-ui,sans-serif !important;font-weight:500;}
#product_details .product_price{margin-bottom:4px !important;}
/* "IVA incluido" con palomita (lo inserta el JS) */
/* ⚠️ line-height explicito: este renglon cuelga del bloque del precio, al que le
   ponemos line-height:0 para colapsar su hueco (la barra fija ya trae el precio).
   Sin esto, en cuanto el texto ocupa dos renglones se encabalgan uno sobre otro. */
#product_details .er-prem-iva{display:flex;align-items:flex-start;gap:7px;font-size:13.5px;line-height:1.35;color:#3E3A48;margin:8px 0 12px;}
/* 2026-09-19: la cinta de envio ya no va sobre la foto; pasa a renglon con camion bajo el precio */
#product_detail .o_ribbons.o_right{display:none !important;}
#product_details .er-prem-envio{display:flex;align-items:flex-start;gap:7px;font-size:13.5px;line-height:1.35;color:#3E3A48;margin:-6px 0 12px;}
#product_details .er-prem-envio svg{width:16px;height:16px;margin-top:1px;stroke:#490AA0;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;}
#product_details .er-prem-iva::before{content:'';width:16px;height:16px;flex:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23490AA0' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12.5l2.6 2.5L16 9.5'/%3E%3C/svg%3E") center/contain no-repeat;}
/* --- tarjeta oscura de envio (¿Entregamos en tu zona?) --- */
#product_details .er-cob-ficha{background:#2E0668 !important;border:0 !important;color:#fff !important;border-radius:14px !important;padding:16px 18px !important;margin:12px 0 0 !important;}
#product_details .er-cob-ficha *{color:#fff;}
/* iOS (captura de Miguel 2026-09-17): el "precio por unidad base" nativo de Odoo
   ("$ 373.33 / Bolsa", small.o_base_unit_price_wrapper) quedaba debajo de la tarjeta
   de entrega y se encimaba con ella. En escritorio se separa; en telefono se oculta,
   porque la barra fija de compra ya dice precio y presentacion. */
#product_details .o_base_unit_price_wrapper{display:block !important;margin:12px 0 0 !important;clear:both;}
@media (max-width:991.98px){#product_details .o_base_unit_price_wrapper{display:none !important;}}
#product_details .er-cob-ficha .er-cob-ficha-enc{color:#fff !important;font-size:15px;}
#product_details .er-cob-ficha .er-cob-ficha-pt,#product_details .er-cob-ficha .er-cob-ficha-gratis{color:#FFD426 !important;}
#product_details .er-cob-ficha .er-cob-ficha-cta{background:#FFD426 !important;color:#490AA0 !important;border-radius:10px !important;font-weight:650 !important;}
#product_details .er-cob-ficha .er-cob-ficha-cta:hover{background:#FDB913 !important;}
#product_details .er-cob-ficha .er-cob-ficha-cambiar{color:#FFD426 !important;}
/* --- cashback --- */
#product_details .er_cash{border-radius:12px !important;margin:12px 0 0 !important;}
/* --- CAJA DE COMPRA: embalaje + escalones + cantidad + CTA en UNA tarjeta BLANCA
   con borde (Miguel 2026-09-17: "el fondo teñido en morado no me gusta, hazlo blanco") --- */
#product_details .o_wsale_product_details_content_section_attributes{background:#fff;border:1px solid #ECEAF1;border-bottom:0;border-radius:14px 14px 0 0;padding:16px 18px 6px !important;margin:14px 0 0 !important;}
#product_details .o_wsale_product_details_content_section_attributes .variant_attribute > strong,#product_details .o_wsale_product_details_content_section_attributes .attribute_name{font-size:12px !important;letter-spacing:.06em;text-transform:uppercase;color:#6B6578 !important;font-weight:700 !important;}
#product_details .er_vol{background:#fff !important;border:0 !important;border-left:1px solid #ECEAF1 !important;border-right:1px solid #ECEAF1 !important;border-radius:0 !important;padding:8px 18px 6px !important;margin:0 !important;box-shadow:none !important;}
#product_details .er_vol .er_vol_t{color:#6B6578 !important;}
#product_details .er_vol .er_vol_f{background:#F5F4F8;border-radius:10px;margin:4px 0;}
#product_details .er_vol .er_vol_f.er_on{background:#fff;box-shadow:inset 0 0 0 1.5px #490AA0;}
#product_details .o_wsale_product_details_content_section_cta{background:#fff;border:1px solid #ECEAF1;border-top:0;border-radius:0 0 14px 14px;padding:10px 18px 18px !important;margin:0 !important;}
#product_details #add_to_cart_wrap{gap:10px !important;}
#product_details #add_to_cart_wrap .css_quantity{background:#fff;border:1.5px solid #E7E2EF;border-radius:10px;overflow:hidden;}
#product_details #add_to_cart_wrap .css_quantity .btn,#product_details #add_to_cart_wrap .css_quantity input{border:0 !important;background:#fff !important;color:#141018 !important;}
#product_details #add_to_cart{height:48px !important;font-size:15px !important;border-radius:10px !important;}
#product_details #buy_now{width:100% !important;height:46px;border-radius:10px !important;background:#fff !important;color:#490AA0 !important;border:1.5px solid #490AA0 !important;font-weight:650 !important;margin-top:4px;}
#product_details #product_option_block .btn{border-radius:10px !important;background:#fff !important;border:1.5px solid #E7E2EF !important;}
#product_details .er_pol{box-shadow:none !important;}
#product_details .er_mayoreo{border-radius:10px !important;background:#fff !important;}
/* --- politicas: tarjeta ligera --- */
#product_details .er_pol{background:#fff;border:1px solid #ECEAF1;border-radius:14px;padding:14px 18px !important;margin:14px 0 0 !important;}
#product_details .er_pol .er_pol_fila{border-bottom:1px solid #F0EEF4;}
#product_details .er_pol .er_pol_fila:last-of-type{border-bottom:0;}
#product_details #product_attributes_simple{margin-top:12px;}
#product_details #product_attributes_simple table{font-size:13px;}
/* --- descripcion a todo el ancho como "Atributos destacados" con palomitas --- */
#product_detail .o_wsale_er_description{max-width:none !important;padding:0 24px !important;}
#product_detail .o_wsale_er_description .oe_structure{background:#F6F5F9;border-radius:16px;padding:24px 28px;margin-top:8px;}
#product_detail .o_wsale_er_description .oe_structure > p:first-child{font-size:15.5px;color:#3E3A48;margin-bottom:14px;}
#product_detail .o_wsale_er_description .oe_structure > p.er-nota-extra{font-size:14.5px;color:#3E3A48;margin:14px 0 0;padding:12px 14px;background:#fff;border:1px solid #ECEAF1;border-radius:10px;}
#product_detail .o_wsale_er_description .oe_structure > h3{font-family:Inter,system-ui,sans-serif !important;font-size:16px !important;font-weight:700 !important;color:#141018 !important;margin:16px 0 8px !important;border:0 !important;padding:0 !important;text-transform:none !important;letter-spacing:0 !important;}
#product_detail .o_wsale_er_description .oe_structure > h3::after{display:none !important;}
#product_detail .o_wsale_er_description .oe_structure > ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:6px 24px;}
#product_detail .o_wsale_er_description .oe_structure > ul li{position:relative;padding:8px 12px 8px 40px;background:#fff;border:1px solid #ECEAF1;border-radius:10px;font-size:14px;color:#141018;}
#product_detail .o_wsale_er_description .oe_structure > ul li::before{content:'';position:absolute;left:12px;top:9px;width:18px;height:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23490AA0' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12.5l2.6 2.5L16 9.5'/%3E%3C/svg%3E") center/contain no-repeat;}
/* --- bloque de confianza (lo inserta el JS) --- */
.er-prem-confia{max-width:1288px;margin:22px auto 8px;padding:0 24px;}
.er-prem-confia-in{background:#fff;border:1px solid #ECEAF1;border-radius:16px;padding:24px 28px;}
.er-prem-confia h3{font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:20px;color:#141018;margin:0 0 16px;letter-spacing:-.01em;}
.er-prem-confia-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
.er-prem-confia-tile{display:flex;gap:12px;align-items:flex-start;background:#F6F5F9;border-radius:12px;padding:14px;}
.er-prem-confia-tile svg{width:22px;height:22px;stroke:#490AA0;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;margin-top:1px;}
.er-prem-confia-tile b{display:block;font-size:14px;color:#141018;margin-bottom:2px;}
.er-prem-confia-tile span{font-size:13px;color:#6B6578;line-height:1.35;}
@media (max-width:991.98px){
  #product_detail .o_wsale_er_description .oe_structure > ul{grid-template-columns:1fr;}
  .er-prem-confia-grid{grid-template-columns:1fr 1fr;}
  #product_details h1{font-size:24px !important;}
  #product_details .product_price .h5,#product_details .product_price .oe_price,#product_details .product_price .oe_currency_value{font-size:30px !important;}
}
@media (max-width:575.98px){ .er-prem-confia-grid{grid-template-columns:1fr;} .er-prem-confia{padding:0 12px;} }

/* ===== FICHA · elementos robados de KEX (2026-09-17) ===== */
/* datos rapidos bajo el titulo */
.er-fx{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 2px;}
.er-fx span{display:inline-flex;align-items:center;gap:6px;background:#F5F4F8;border:1px solid #ECEAF1;border-radius:999px;padding:6px 11px;font:500 12.5px/1 Inter,system-ui,sans-serif;color:#3E3A48;}
.er-fx span b{font-weight:700;color:#141018;}
/* descripcion en acordeon (movil) */
@media (max-width:767.98px){
  #product_detail .o_wsale_er_description .oe_structure > h3{cursor:pointer;display:flex !important;justify-content:space-between;align-items:center;padding:12px 0 !important;margin:0 !important;border-top:1px solid #ECEAF1 !important;}
  #product_detail .o_wsale_er_description .oe_structure > h3::after{content:'+';display:inline-flex;width:26px;height:26px;border-radius:50%;background:#fff;border:1px solid #ECEAF1;align-items:center;justify-content:center;color:#490AA0;font-weight:700;}
  #product_detail .o_wsale_er_description .oe_structure > h3.er-abierto::after{content:'–';}
  #product_detail .o_wsale_er_description .oe_structure > ul.er-acc-cerrado{display:none !important;}
  #product_detail .o_wsale_er_description .oe_structure > ul{margin-bottom:12px !important;}
}
/* "tambien llevan" (compra conjunta real) + accesorios en el mismo estilo */
.er-tl{max-width:1288px;margin:26px auto 6px;padding:0 24px;}
.er-tl-k{font:600 12px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#490AA0;margin:0 0 8px;}
.er-tl h2{font-family:'Archivo Black',Impact,sans-serif !important;font-weight:400 !important;font-size:24px !important;text-transform:uppercase;letter-spacing:-.01em;color:#141018 !important;margin:0 0 6px !important;}
.er-tl-p{font:400 14.5px/1.5 Inter,system-ui,sans-serif;color:#6B6578;margin:0 0 16px;}
.er-tl-pista{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.er-tl-c,.er-tl-c:link,.er-tl-c:visited{display:flex;flex-direction:column;background:#fff;border:1px solid #ECEAF1;border-radius:14px;overflow:hidden;text-decoration:none !important;color:#141018 !important;transition:transform .15s,box-shadow .15s;}
.er-tl-c:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(46,6,104,.12);}
.er-tl-img{aspect-ratio:1/1;background:#F5F4F8;display:flex;align-items:center;justify-content:center;padding:14px;}
.er-tl-img img{max-width:100%;max-height:100%;object-fit:contain;mix-blend-mode:multiply;}
.er-tl-b{padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px;flex:1;}
.er-tl-b b{font:600 14px/1.3 Inter,system-ui,sans-serif;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.er-tl-b .er-tl-precio{font-family:'Archivo Black',Impact,sans-serif;font-size:17px;color:#141018;margin-top:auto;}
.er-tl-b .er-tl-precio small{font:500 11.5px/1 Inter,system-ui,sans-serif;color:#6B6578;margin-left:4px;}
.er-tl-b .er-tl-ver{font:650 13px/1 Inter,system-ui,sans-serif;color:#490AA0;}
@media (max-width:991.98px){.er-tl-pista{grid-template-columns:repeat(2,1fr);}}
@media (max-width:767.98px){.er-tl{padding:0 16px;margin-top:18px;} .er-tl-pista{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;padding:2px 0 8px;scrollbar-width:none;} .er-tl-c{flex:0 0 46vw;scroll-snap-align:start;}}
/* FAQ de compra + pregunta por WhatsApp */
.er-fq{max-width:1288px;margin:30px auto 10px;padding:0 24px;display:grid;grid-template-columns:1.4fr 1fr;gap:28px;align-items:start;}
.er-fq-l{display:flex;flex-direction:column;gap:8px;}
.er-fq-i{background:#fff;border:1px solid #ECEAF1;border-radius:12px;}
.er-fq-i button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;background:none;border:0;padding:14px 16px;font:600 15px/1.35 Inter,system-ui,sans-serif;color:#141018;text-align:left;cursor:pointer;}
.er-fq-i button::after{content:'+';flex:none;width:26px;height:26px;border-radius:50%;background:#F3F2F7;color:#490AA0;display:inline-flex;align-items:center;justify-content:center;font-weight:700;}
.er-fq-i.er-abierto button::after{content:'–';background:#490AA0;color:#fff;}
.er-fq-i p{display:none;margin:0;padding:0 16px 14px;font:400 14px/1.5 Inter,system-ui,sans-serif;color:#3E3A48;}
.er-fq-i.er-abierto p{display:block;}
.er-fq-cta{background:#490AA0;border-radius:16px;padding:24px;color:#fff;}
.er-fq-cta b{display:block;font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:20px;line-height:1.1;text-transform:uppercase;margin-bottom:8px;}
.er-fq-cta p{font:400 14px/1.5 Inter,system-ui,sans-serif;color:rgba(255,255,255,.85);margin:0 0 16px;}
.er-fq-cta a,.er-fq-cta a:link,.er-fq-cta a:visited{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#FFD426;color:#490AA0 !important;font:650 14px/1 Inter,system-ui,sans-serif;padding:14px 20px;border-radius:10px;text-decoration:none !important;margin:0 8px 8px 0;}
.er-fq-cta a.er-fq-suc{background:transparent;color:#fff !important;border:1.5px solid rgba(255,255,255,.7);}
@media (max-width:991.98px){.er-fq{grid-template-columns:1fr;}}
@media (max-width:767.98px){.er-fq{padding:0 16px;margin-top:22px;} .er-fq-cta a{width:100%;margin-right:0;}}
/* barra de compra fija en escritorio */
.er-sb{position:fixed;left:0;right:0;bottom:0;z-index:1030;background:#fff;border-top:1px solid #ECEAF1;box-shadow:0 -8px 24px rgba(46,6,104,.10);transform:translateY(110%);transition:transform .25s ease;}
.er-sb.er-on{transform:none;}
.er-sb-in{max-width:1288px;margin:0 auto;padding:10px 24px;display:flex;align-items:center;gap:16px;}
.er-sb img{width:52px;height:52px;object-fit:contain;background:#F5F4F8;border-radius:10px;padding:4px;mix-blend-mode:multiply;}
.er-sb-n{font:600 15px/1.25 Inter,system-ui,sans-serif;color:#141018;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.er-sb-p{font-family:'Archivo Black',Impact,sans-serif;font-size:20px;color:#141018;white-space:nowrap;}
.er-sb-p small{font:500 12px/1 Inter,system-ui,sans-serif;color:#6B6578;margin-left:4px;}
.er-sb button{background:#490AA0;color:#fff;border:0;border-radius:10px;font:650 15px/1 Inter,system-ui,sans-serif;padding:15px 24px;cursor:pointer;white-space:nowrap;}
.er-sb button:hover{background:#2E0668;}
@media (max-width:991.98px){.er-sb{display:none !important;}}

/* "Complementos para tu compra" (accesorios de Odoo, vista vieja): mismo formato
   que las tarjetas de compra conjunta. Miguel 2026-09-17: "esta muy pequeno". */
#product_detail .o_wsale_er_accessories,#product_detail .o_wsale_er_alternatives{max-width:1288px !important;margin:26px auto 6px !important;padding:0 24px !important;}
#product_detail .o_wsale_er_accessories > h5,#product_detail .o_wsale_er_alternatives > h5{font-family:'Archivo Black',Impact,sans-serif !important;font-weight:400 !important;font-size:24px !important;text-transform:uppercase;letter-spacing:-.01em;color:#141018 !important;margin:0 0 16px !important;}
#product_detail .o_wsale_er_accessories > .d-flex,#product_detail .o_wsale_er_alternatives > .d-flex{display:grid !important;grid-template-columns:repeat(4,1fr);gap:14px;overflow:visible !important;padding:0 !important;}
#product_detail .o_wsale_er_acc_card{flex:none !important;width:auto !important;display:flex;flex-direction:column;background:#fff;border:1px solid #ECEAF1;border-radius:14px;overflow:hidden;padding:0 !important;box-shadow:none !important;transition:transform .15s,box-shadow .15s;}
#product_detail .o_wsale_er_acc_card:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(46,6,104,.12);}
#product_detail .o_wsale_er_acc_card > a > div:first-child{aspect-ratio:1/1;background:#F5F4F8;display:flex;align-items:center;justify-content:center;padding:14px;}
#product_detail .o_wsale_er_acc_card img.o_wsale_er_acc_img{width:auto !important;height:auto !important;max-width:100% !important;max-height:100% !important;object-fit:contain;mix-blend-mode:multiply;border-radius:0 !important;}
#product_detail .o_wsale_er_acc_card .o_wsale_er_acc_name{font:600 14px/1.3 Inter,system-ui,sans-serif !important;color:#141018 !important;padding:12px 14px 0;margin:0 !important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
#product_detail .o_wsale_er_acc_card > .fw-bold{font-family:'Archivo Black',Impact,sans-serif !important;font-size:17px !important;color:#141018;padding:8px 14px 0;margin:auto 0 0 !important;}
#product_detail .o_wsale_er_acc_card > .fw-bold::after{content:'Impuestos incluidos';font:500 11.5px/1 Inter,system-ui,sans-serif;color:#6B6578;margin-left:6px;}
#product_detail .o_wsale_er_acc_card .o_wsale_er_add_accessory,#product_detail .o_wsale_er_acc_card > a.btn{margin:12px 14px 14px !important;width:calc(100% - 28px) !important;height:42px;border-radius:10px !important;font:650 14px/1 Inter,system-ui,sans-serif !important;background:#490AA0 !important;border-color:#490AA0 !important;}
#product_detail .o_wsale_er_acc_card .o_wsale_er_add_accessory:hover,#product_detail .o_wsale_er_acc_card > a.btn:hover{background:#2E0668 !important;border-color:#2E0668 !important;}
#product_detail .o_wsale_er_alternatives .o_wsale_er_alt_sub{display:none !important;}
@media (max-width:991.98px){#product_detail .o_wsale_er_accessories > .d-flex,#product_detail .o_wsale_er_alternatives > .d-flex{grid-template-columns:repeat(2,1fr);}}
@media (max-width:767.98px){#product_detail .o_wsale_er_accessories,#product_detail .o_wsale_er_alternatives{padding:0 16px !important;margin-top:18px !important;} #product_detail .o_wsale_er_accessories > .d-flex,#product_detail .o_wsale_er_alternatives > .d-flex{display:flex !important;overflow-x:auto !important;scroll-snap-type:x mandatory;gap:10px;padding:2px 0 8px !important;scrollbar-width:none;} #product_detail .o_wsale_er_acc_card{flex:0 0 46vw !important;scroll-snap-align:start;}}


/* ===== PREMIUM · CARRITO, CHECKOUT Y ACCESO — 2026-09-17 ===== */
.o_website_sale_checkout_container{max-width:1288px !important;padding-left:24px !important;padding-right:24px !important;}
/* --- pasos del checkout: stepper con numero --- */
.o_wizard{gap:6px 0 !important;margin:14px 0 22px !important;font-size:14px !important;counter-reset:er-paso;}
.o_wizard > span{align-items:center;}
.o_wizard [name="step_name"]{align-items:center;font-weight:600 !important;color:#141018 !important;}
.o_wizard [name="step_name"] > p{display:flex;align-items:center;gap:8px;}
.o_wizard [name="step_name"] > p::before{counter-increment:er-paso;content:counter(er-paso);width:24px;height:24px;border-radius:50%;background:#490AA0;color:#fff;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex:none;}
.o_wizard .o_disabled [name="step_name"]{color:#8B8598 !important;font-weight:500 !important;}
.o_wizard .o_disabled [name="step_name"] > p::before{background:#ECEAF1;color:#6B6578;}
.o_wizard .fa-angle-right{color:#C9C3D6 !important;margin:0 14px !important;}
/* --- titulo --- */
#shop_cart h4,#shop_checkout h4,.o_customer_address_fill h4,#address_on_payment h4,#wrap .o_wsale_shorter_cart_summary h4{font-family:'Archivo Black',Impact,sans-serif !important;font-size:24px !important;letter-spacing:-.01em;color:#141018 !important;}
#quick_reorder_button[disabled]{display:none !important;}
#shop_cart > .d-flex > .border-start:has(#quick_reorder_button[disabled]){display:none !important;}
/* --- linea del carrito --- */
#cart_products{gap:12px;margin-bottom:24px !important;}
#cart_products .o_cart_product{background:#fff;border:1px solid #ECEAF1;border-radius:16px;padding:16px !important;box-shadow:none !important;gap:16px !important;}
#cart_products .o_cart_product_image img{width:96px !important;height:96px !important;object-fit:contain;background:#F5F4F8;border:0 !important;border-radius:12px !important;padding:8px;mix-blend-mode:multiply;}
#cart_products .o_cart_product h6{font-family:Inter,system-ui,sans-serif !important;font-size:15.5px !important;font-weight:600 !important;color:#141018 !important;line-height:1.3;}
#cart_products .o_cart_product .badge{background:#F3F2F7 !important;color:#6B6578 !important;font-weight:600;font-size:11px;letter-spacing:.04em;border-radius:6px;padding:4px 8px;}
#cart_products .o_cart_product [name="website_sale_cart_line_price"]{font-family:'Archivo Black',Impact,sans-serif !important;font-size:20px !important;color:#141018 !important;}
#cart_products .o_cart_product .js_delete_product{color:#6B6578 !important;font-size:13px !important;text-decoration:none !important;}
#cart_products .o_cart_product .js_delete_product:hover{color:#B42318 !important;}
#cart_products .o_cart_product .text-300{color:#D9D3E6 !important;}
#cart_products .o_cart_product .css_quantity{border:1.5px solid #E7E2EF !important;border-radius:10px !important;overflow:hidden;background:#fff;width:124px;height:40px !important;}
#cart_products .o_cart_product .css_quantity .btn{border:0 !important;background:#fff !important;color:#490AA0 !important;width:36px;padding:0 !important;display:inline-flex;align-items:center;justify-content:center;}
#cart_products .o_cart_product .css_quantity .btn:hover{background:#F3F2F7 !important;}
#cart_products .o_cart_product .css_quantity input{border:0 !important;text-align:center;font-weight:700;color:#141018;padding:0 !important;}
/* --- tarjeta de totales --- */
.o_total_card{background:#fff !important;border:1px solid #ECEAF1 !important;border-radius:16px !important;box-shadow:none !important;overflow:visible !important;}
.o_total_card .card-body{padding:20px !important;}
.o_total_card .o_cart_total td{font-size:14px;color:#3E3A48 !important;padding-top:6px !important;padding-bottom:6px !important;}
.o_total_card .o_cart_total td.text-muted,.o_total_card .o_cart_total tr:not([name="o_order_total"]) td:first-child{color:#6B6578 !important;}
.o_total_card .o_cart_total tr[name="o_order_total"]{border-top:1px solid #ECEAF1 !important;}
.o_total_card .o_cart_total tr[name="o_order_total"] td{padding-top:12px !important;}
.o_total_card .o_cart_total tr[name="o_order_total"] strong{font-family:'Archivo Black',Impact,sans-serif;font-size:22px;color:#141018;font-weight:400;}
.o_total_card .o_cart_total tr[name="o_order_total"] td:first-child::after{content:'Impuestos incluidos';display:block;font:500 12px/1.2 Inter,system-ui,sans-serif;color:#1B7F3B;margin-top:2px;}
.o_total_card .coupon_form .form-control{height:42px;border:1.5px solid #E7E2EF !important;border-radius:10px 0 0 10px !important;font-size:13.5px;}
.o_total_card .coupon_form .btn{height:42px;border:1.5px solid #E7E2EF !important;border-left:0 !important;border-radius:0 10px 10px 0 !important;background:#F3F2F7 !important;color:#490AA0 !important;font-weight:600;}
.o_total_card [name="website_sale_main_button"],.o_total_card a[href="/shop/checkout"],#o_payment_form_pay,.o_total_card .btn-primary{height:50px !important;display:inline-flex !important;align-items:center;justify-content:center;font-size:16px !important;font-weight:650 !important;border-radius:10px !important;}
.o_total_card a[href="/shop"],.o_total_card a[href="/shop/cart"]{color:#490AA0 !important;font-weight:600;font-size:14px;}
.o_total_card .er_registro{border-radius:10px !important;}
/* fila de confianza bajo el boton (la inserta el JS) */
.er-prem-conf{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:14px;}
.er-prem-conf span{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font:500 11.5px/1.25 Inter,system-ui,sans-serif;color:#3E3A48;background:#F6F5F9;border-radius:10px;padding:10px 6px;}
.er-prem-conf svg{width:20px;height:20px;stroke:#490AA0;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
/* carrito vacio */
#wrap .js_cart_lines h5{font-family:'Archivo Black',Impact,sans-serif !important;font-size:22px !important;color:#141018 !important;}
/* --- formularios del checkout y del acceso --- */
.o_website_sale_checkout_container .form-control,.o_website_sale_checkout_container .form-select,.oe_login_form .form-control,.oe_signup_form .form-control,.oe_reset_password_form .form-control{height:46px;border:1.5px solid #E7E2EF !important;border-radius:10px !important;font-size:15px !important;color:#141018 !important;box-shadow:none !important;}
.o_website_sale_checkout_container .form-control:focus,.oe_login_form .form-control:focus,.oe_signup_form .form-control:focus{border-color:#490AA0 !important;box-shadow:0 0 0 4px rgba(73,10,160,.10) !important;}
.o_website_sale_checkout_container label,.oe_login_form label,.oe_signup_form label{font-size:13px;font-weight:600;color:#3E3A48;}
.o_website_sale_checkout_container .card:not(.o_total_card){border:1px solid #ECEAF1 !important;border-radius:14px !important;box-shadow:none !important;}
.o_website_sale_checkout_container .card.border-primary,.o_website_sale_checkout_container .card.o_selected,#payment_method .card.border-primary{border:2px solid #490AA0 !important;}
.o_website_sale_checkout_container .btn-primary:not(.o_total_card .btn-primary){border-radius:10px !important;font-weight:650 !important;height:46px;display:inline-flex;align-items:center;justify-content:center;}
.o_website_sale_checkout_container .btn-secondary,.o_website_sale_checkout_container .btn-light{border-radius:10px !important;border:1.5px solid #E7E2EF !important;background:#fff !important;color:#490AA0 !important;font-weight:600;}
#payment_method .card,#payment_method .o_payment_option_card{border-radius:12px !important;padding:12px 16px !important;}
#payment_method .form-check-input:checked{background-color:#490AA0;border-color:#490AA0;}
/* iconos de marcas de tarjeta que Odoo lista para Mercado Pago/Stripe pero no
   aplican en Mexico (Argencard, Codensa, Cordobesa, Naranja, Nativa, Oca, Elo,
   Hipercard, Lider, Magna, Presto, Shopping): se ocultan solo visualmente */
#payment_method span:has(> img[alt="Argencard"]),#payment_method span:has(> img[alt="Codensa"]),#payment_method span:has(> img[alt="Cordobesa"]),#payment_method span:has(> img[alt="Naranja"]),#payment_method span:has(> img[alt="Nativa"]),#payment_method span:has(> img[alt="Oca"]),#payment_method span:has(> img[alt="Elo"]),#payment_method span:has(> img[alt="Hipercard"]),#payment_method span:has(> img[alt="Lider"]),#payment_method span:has(> img[alt="Magna"]),#payment_method span:has(> img[alt="Presto"]),#payment_method span:has(> img[alt="Shopping Card"]){display:none !important;}
#payment_method .list-group-item{border:1.5px solid #ECEAF1 !important;border-radius:14px !important;padding:14px 16px !important;}
#payment_method .o_payment_option_label{font-weight:600;color:#141018;}
/* --- login / registro: tarjeta centrada --- */
.oe_login_form,.oe_signup_form,.oe_reset_password_form{max-width:440px;margin:28px auto 40px;background:#fff;border:1px solid #ECEAF1;border-radius:16px;padding:28px 28px 24px;}
.oe_login_form .btn-primary,.oe_signup_form .btn-primary,.oe_reset_password_form .btn-primary{width:100%;height:48px !important;border-radius:10px !important;font-weight:650 !important;font-size:15px !important;}
.oe_login_form .btn-secondary,.oe_login_form .btn-link,.oe_signup_form .btn-link{color:#490AA0 !important;font-weight:600;text-decoration:none;}
.oe_login_form .alert,.oe_signup_form .alert{border-radius:10px;}
.o_website_sale_checkout_container .o_address_signin .btn{border-radius:999px !important;font-weight:600 !important;}
.er-prem-login-h{max-width:440px;margin:26px auto -18px;text-align:center;}
.er-prem-login-h b{display:block;font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:24px;color:#141018;letter-spacing:-.01em;}
.er-prem-login-h span{display:block;font-size:14px;color:#6B6578;margin-top:4px;}
/* alertas del checkout (p. ej. "selecciona la tienda"): tarjeta suave de marca */
.o_website_sale_checkout_container .alert{border:0 !important;border-radius:14px !important;padding:16px 18px !important;}
.o_website_sale_checkout_container .alert-danger{background:#FBEDEA !important;color:#7A2418 !important;}
.o_website_sale_checkout_container .alert-danger h4{font-family:'Archivo Black',Impact,sans-serif !important;font-size:17px !important;color:#7A2418 !important;margin-bottom:6px !important;}
.o_website_sale_checkout_container .alert-warning{background:#FFF6D6 !important;color:#5A4200 !important;}
.o_website_sale_checkout_container .alert-info{background:#F3F2F7 !important;color:#3E3A48 !important;}
@media (max-width:767.98px){
  .o_website_sale_checkout_container{padding-left:12px !important;padding-right:12px !important;}
  /* tarjetas de entrega (vista 6933) en movil: todo el texto a la izquierda y a
     todo el ancho; el "Selecciona para calcular la tarifa" salia centrado en una
     columna angosta */
  ul.list-group.er_cards > .list-group-item{align-items:center !important;}
  ul.list-group.er_cards > .list-group-item .er_ent_txt{align-items:flex-start !important;text-align:left !important;width:100%;min-width:0;}
  ul.list-group.er_cards > .list-group-item .er_ent_txt *,ul.list-group.er_cards > .list-group-item .o_wsale_delivery_price_badge,ul.list-group.er_cards > .list-group-item .er_ent_sub{text-align:left !important;display:block;width:100%;margin:0 !important;}
  ul.list-group.er_cards > .list-group-item .er_ent_nom{font-size:15px !important;}
  ul.list-group.er_cards > .list-group-item .er_ent_sub{font-size:12.5px !important;}
  ul.list-group.er_cards > .list-group-item .er_ent_pre{font-size:14px !important;}
  .o_wizard{font-size:12.5px !important;}
  .o_wizard .fa-angle-right{margin:0 8px !important;}
  .o_wizard [name="step_name"] > p::before{width:20px;height:20px;font-size:11px;}
  #cart_products .o_cart_product{padding:12px !important;}
  #cart_products .o_cart_product_image img{width:76px !important;height:76px !important;}
  .o_total_card .card-body{padding:16px !important;}
  .er-prem-conf span{font-size:11px;}
}


/* ===== PREMIUM · PIE DE PAGINA v2 (estructura KEX) — 2026-09-17 ===== */
footer#bottom{background:#2E0668 !important;color:#fff;}
footer#bottom .er_pie{background:#2E0668 !important;color:#fff !important;padding:0 !important;}
footer#bottom .er_pie_in,footer#bottom .er_pie_base{display:none !important;}
/* CTA amarillo del home (se conserva) */
footer#bottom .er_pie .cta{max-width:none;margin:0;padding:36px 40px 0 !important;background:transparent !important;}
footer#bottom .er_pie .cta-inner{background:#FFD426;border-radius:18px;padding:34px 36px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}
footer#bottom .er_pie .cta-title{font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:30px;line-height:1.05;letter-spacing:-.01em;color:#490AA0 !important;text-transform:uppercase;}
footer#bottom .er_pie .cta-sub{font:500 15px/1.4 Inter,system-ui,sans-serif;color:#2E0668 !important;margin-top:6px;}
footer#bottom .er_pie .cta-inner > a{display:inline-flex;align-items:center;gap:10px;background:#490AA0 !important;color:#fff !important;font:650 15px/1 Inter,system-ui,sans-serif;padding:15px 22px;border-radius:10px;text-decoration:none !important;white-space:nowrap;}
footer#bottom .er_pie .cta-inner > a:hover{background:#3A0880 !important;}
footer#bottom .er_pie .cta-inner > a svg{width:20px;height:20px;}
/* contenedor */
.er-ft{max-width:none;margin:0;padding:40px 40px 0;font-family:Inter,system-ui,sans-serif;color:#fff;}
/* ⚠️ la 6942 pinta `.er_pie a` morado con !important: aqui tambien !important */
footer#bottom .er_pie .er-ft a{color:#fff !important;text-decoration:none !important;display:inline;width:auto;padding:0;}
footer#bottom .er_pie .er-ft a:hover{color:#FFD426 !important;transform:none !important;}
/* fila 1 */
.er-ft-top{display:grid;grid-template-columns:1.5fr .9fr 1.1fr .8fr 1.4fr;gap:40px;}
.er-ft-marca img{width:118px;height:auto;display:block;margin-bottom:16px;}
.er-ft-marca p{font-size:14.5px;line-height:1.6;color:rgba(255,255,255,.82);margin:0 0 14px;max-width:38ch;}
.er-ft-dir{font-size:13.5px;line-height:1.55;color:rgba(255,255,255,.72);margin-bottom:16px;}
.er-ft-dir b{color:#FFD426;font-weight:700;display:block;margin-top:4px;}
footer#bottom .er_pie .er-ft-dir a{color:#FFD426 !important;}
.er-ft-soc{display:flex;gap:8px;flex-wrap:wrap;}
footer#bottom .er_pie .er-ft-soc a{width:42px;height:42px;border-radius:50%;background:#fff;color:#2E0668 !important;display:inline-flex !important;align-items:center;justify-content:center;}
.er-ft-soc a:hover{background:#FFD426;color:#490AA0 !important;}
.er-ft-soc svg{width:18px;height:18px;fill:currentColor;}
.er-ft-soc .fa{font-size:18px;}
.er-ft-col h4{font:800 12.5px/1.2 Inter,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#FFD426;margin:6px 0 14px;}
footer#bottom .er_pie .er-ft-col a{display:block;font-size:14.5px;line-height:1.35;padding:5px 0;width:fit-content;}
/* boletin */
.er-ft-news{background:#490AA0;border-radius:16px;padding:22px 22px 20px;position:relative;overflow:hidden;}
.er-ft-news h4{font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:19px;line-height:1.1;letter-spacing:-.01em;margin:0 0 8px;padding-right:96px;}
.er-ft-news p{font-size:13.5px;line-height:1.5;color:rgba(255,255,255,.82);margin:0 0 14px;padding-right:96px;}
.er-ft-news img{position:absolute;right:14px;top:14px;width:82px;height:auto;}
.er-ft-news form{display:flex;background:#fff;border-radius:12px;padding:4px;gap:4px;position:relative;z-index:1;}
.er-ft-news input{flex:1;min-width:0;border:0;background:transparent;padding:10px 12px;font:500 14.5px/1 Inter,system-ui,sans-serif;color:#141018;outline:none;}
.er-ft-news input::placeholder{color:#8B8598;}
.er-ft-news button{width:46px;height:42px;border:0;border-radius:9px;background:#FFD426;color:#490AA0;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:none;}
.er-ft-news button:hover{background:#FDB913;}
.er-ft-news button svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}
.er-ft-news .er-ft-ok{margin:10px 0 0;font-size:13px;color:#FFD426;font-weight:600;}
/* fila 2: confianza dividida */
.er-ft-conf{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid rgba(255,255,255,.16);border-radius:16px;margin-top:36px;overflow:hidden;}
footer#bottom .er_pie .er-ft-conf a{display:flex !important;align-items:center;gap:14px;padding:22px 20px !important;border-right:1px solid rgba(255,255,255,.16);color:#fff !important;width:auto;}
.er-ft-conf a:last-child{border-right:0;}
.er-ft-conf a:hover{background:#490AA0;}
.er-ft-conf .er-ft-ico{width:44px;height:44px;border-radius:50%;background:#FFD426;display:flex;align-items:center;justify-content:center;flex:none;}
.er-ft-conf .er-ft-ico svg{width:22px;height:22px;stroke:#490AA0;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.er-ft-conf b{display:block;font-size:15px;line-height:1.2;}
.er-ft-conf small{display:block;font-size:12.5px;color:rgba(255,255,255,.72);margin-top:3px;}
.er-ft-conf .er-ft-arr{margin-left:auto;width:18px;height:18px;stroke:rgba(255,255,255,.6);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;}
/* fila 3: para tu negocio */
.er-ft-seo{display:grid;grid-template-columns:2.2fr 1fr;gap:30px;margin-top:40px;}
.er-ft-seo h4{font:800 16px/1.2 Inter,system-ui,sans-serif;color:#fff;margin:0 0 12px;}
.er-ft-seo p{margin:0;display:flex;flex-wrap:wrap;gap:6px 18px;}
footer#bottom .er_pie .er-ft-seo p a{font-size:14px;color:rgba(255,255,255,.86) !important;text-decoration:underline !important;text-decoration-color:rgba(255,255,255,.35);text-underline-offset:4px;}
footer#bottom .er_pie .er-ft-seo p a:hover{color:#FFD426 !important;text-decoration-color:#FFD426;}
/* fila 4: marcas en blanco */
.er-ft-marcas{margin-top:40px;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);}
.er-ft-marcas-track{display:flex;gap:14px;align-items:center;width:max-content;animation:er-ft-marq 44s linear infinite;}
.er-ft-marcas:hover .er-ft-marcas-track{animation-play-state:paused;}
/* fichas blancas con el logo EN SU COLOR: invertirlos a blanco convertia los
   logos con relleno (Custom Culinary, Primo) en bloques y encogia a Evena */
.er-ft-marcas span{display:flex;align-items:center;justify-content:center;width:168px;height:72px;background:#fff;border-radius:14px;padding:12px 18px;flex:none;}
.er-ft-marcas img{max-height:44px;max-width:128px;width:auto;height:auto;object-fit:contain;filter:none;opacity:1;}
@keyframes er-ft-marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){.er-ft-marcas-track{animation:none;}}
/* fila 5: legal + pagos */
.er-ft-base{display:flex;align-items:center;gap:22px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.16);margin-top:30px;padding:22px 0 26px;font-size:13px;color:rgba(255,255,255,.72);}
footer#bottom .er_pie .er-ft-base a{color:rgba(255,255,255,.86) !important;font-weight:500;}
.er-ft-base .er-ft-copy b{color:#fff;}
.er-ft-pagos{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap;align-items:center;}
.er-ft-pagos span{background:#fff;color:#2E0668;font:700 11px/1 Inter,system-ui,sans-serif;padding:7px 9px;border-radius:6px;white-space:nowrap;}
.er-ft-pagos span.er-ft-pl{display:inline-flex;align-items:center;justify-content:center;height:30px;min-width:48px;padding:0 6px;border-radius:7px;}
.er-ft-pagos span.er-ft-pl img{height:20px;width:auto;display:block;}
.er-ft-arriba{width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:none;}
.er-ft-arriba:hover{background:#490AA0;}
.er-ft-arriba svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
/* camion y copyright nativo */
footer#bottom .er_escena{background:#2E0668 !important;}
footer#bottom .o_footer_copyright{display:none !important;}
@media (max-width:1199.98px){ .er-ft-top{grid-template-columns:1.2fr 1fr 1fr 1fr;} .er-ft-news{grid-column:1 / -1;} }
@media (max-width:991.98px){
  .er-ft{padding:28px 16px 0;}
  footer#bottom .er_pie .cta{padding:24px 12px 0 !important;}
  footer#bottom .er_pie .cta-inner{padding:24px 22px;border-radius:16px;}
  footer#bottom .er_pie .cta-title{font-size:24px;}
  footer#bottom .er_pie .cta-inner > a{width:100%;justify-content:center;}
  .er-ft-top{grid-template-columns:1fr 1fr;gap:22px;}
  .er-ft-marca{grid-column:1 / -1;}
  .er-ft-conf{grid-template-columns:1fr 1fr;margin-top:26px;}
  .er-ft-conf a{border-bottom:1px solid rgba(255,255,255,.16);}
  .er-ft-conf a:nth-child(2n){border-right:0;}
  .er-ft-conf a:nth-last-child(-n+2){border-bottom:0;}
  .er-ft-seo{grid-template-columns:1fr;gap:22px;margin-top:28px;}
  .er-ft-base{gap:12px 18px;}
  .er-ft-pagos{margin-left:0;width:100%;}
}
@media (max-width:575.98px){ .er-ft-conf{grid-template-columns:1fr;} .er-ft-conf a{border-right:0;} .er-ft-conf a:nth-last-child(-n+2){border-bottom:1px solid rgba(255,255,255,.16);} .er-ft-conf a:last-child{border-bottom:0;} }


/* ===== PREMIUM · TRANSICIONES DE PAGINA (ref. KEX) — 2026-09-17 ===== */
@media (prefers-reduced-motion: no-preference) and (min-width: 992px){
  body::before{content:'';position:fixed;inset:0;z-index:99990;background:#490AA0;opacity:1;pointer-events:none;
    transition:opacity .32s ease;animation:er-velo-seguro .01s linear 1s forwards;}
  body::after{content:'';position:fixed;left:50%;top:50%;width:150px;height:150px;margin:-75px 0 0 -75px;z-index:99991;pointer-events:none;
    background:url("/web/image/75401?unique=a3d7c6b3") center/contain no-repeat;opacity:1;transition:opacity .25s ease;
    animation:er-respira .7s ease-in-out infinite alternate, er-velo-seguro .01s linear 1s forwards;}
  html.er-listo body::before,html.er-listo body::after{opacity:0;animation:none;}
  html.er-listo.er-saliendo body::before{opacity:1;transition-duration:.2s;}
  html.er-listo.er-saliendo body::after{opacity:1;transition-duration:.18s;animation:er-respira .62s ease-in-out infinite alternate;}
  @keyframes er-respira{from{transform:scale(.94)}to{transform:scale(1.06)}}
  @keyframes er-velo-seguro{to{opacity:0;visibility:hidden}}
  /* la pagina entra en un fundido corto */
  html.er-listo #wrapwrap{animation:er-entra .38s ease-out both;}
  @keyframes er-entra{from{opacity:.001}to{opacity:1}}
}


/* ===== PREMIUM · VIDEOS EN EL HOME (ref. KEX) — 2026-09-17 ===== */
.er-vid{max-width:1288px;margin:8px auto 0;padding:26px 24px 10px;position:relative;}
.er-vid-h{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:18px;}
.er-vid-h p{font:700 12px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#490AA0;margin:0 0 8px;}
.er-vid-h h2{font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:30px;line-height:1.05;letter-spacing:-.02em;color:#141018;margin:0;text-transform:uppercase;}
.er-vid-h h2 em{font-style:normal;color:#490AA0;}
.er-vid-h span{font:400 15px/1.4 Inter,system-ui,sans-serif;color:#6B6578;max-width:46ch;}
.er-vid-pista{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px 0 8px;}
.er-vid-pista::-webkit-scrollbar{display:none;}
.er-vid-c{flex:0 0 300px;aspect-ratio:4/5;border-radius:22px;overflow:hidden;position:relative;background:#141018;scroll-snap-align:start;box-shadow:0 10px 30px rgba(46,6,104,.14);}
.er-vid-c img,.er-vid-c video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
.er-vid-c video{opacity:0;transition:opacity .4s;}
.er-vid-c.er-on video{opacity:1;}
.er-vid-som{position:absolute;inset:auto 0 0 0;height:58%;background:rgba(20,16,24,.55);pointer-events:none;
  -webkit-mask-image:linear-gradient(to top,#000 40%,transparent);mask-image:linear-gradient(to top,#000 40%,transparent);}
.er-vid-tx{position:absolute;left:18px;right:18px;bottom:18px;color:#fff;z-index:2;}
.er-vid-tx small{display:block;font:700 11px/1 Inter,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#FFD426;margin-bottom:8px;}
.er-vid-tx h3{font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:19px;line-height:1.1;margin:0 0 6px;color:#fff;text-transform:uppercase;}
.er-vid-tx p{font:400 13.5px/1.4 Inter,system-ui,sans-serif;color:rgba(255,255,255,.88);margin:0 0 12px;}
.er-vid-tx a{display:inline-flex;align-items:center;gap:8px;background:#FFD426;color:#490AA0 !important;font:650 14px/1 Inter,system-ui,sans-serif;padding:13px 20px;min-height:44px;border-radius:10px;text-decoration:none !important;}
.er-vid-tx a:hover{background:#FDB913;}
.er-vid-tx a svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}
.er-vid-play{position:absolute;top:14px;left:14px;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:#141018;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3;padding:0;}
.er-vid-play svg{width:16px;height:16px;fill:currentColor;}
.er-vid-play .er-vid-pausa{display:none;}
.er-vid-c.er-on .er-vid-play .er-vid-pausa{display:block;}
.er-vid-c.er-on .er-vid-play .er-vid-ir{display:none;}
.er-vid-fl{position:absolute;top:calc(50% + 10px);width:44px;height:44px;border-radius:50%;border:1px solid #ECEAF1;background:#fff;color:#141018;box-shadow:0 4px 16px rgba(46,6,104,.14);cursor:pointer;z-index:3;display:flex;align-items:center;justify-content:center;padding:0;}
.er-vid-fl:hover{color:#490AA0;border-color:#490AA0;}
.er-vid-fl svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}
.er-vid-prev{left:2px;}.er-vid-next{right:2px;}
@media (max-width:991.98px){
  .er-vid{padding:20px 12px 6px;}
  .er-vid-h{flex-direction:column;align-items:flex-start;gap:6px;}
  .er-vid-h h2{font-size:24px;}
  .er-vid-c{flex-basis:78vw;max-width:320px;}
  .er-vid-fl{display:none;}
}


/* ===== PREMIUM · METODOS DE PAGO (logos originales de Odoo) — 2026-09-17 ===== */
.er-pagos{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#F5F4F8;border:1px solid #ECEAF1;border-radius:14px;padding:12px 14px;margin:14px 0 0;width:100%;}
.er-pagos-t{display:flex;align-items:center;gap:9px;font:600 13px/1.2 Inter,system-ui,sans-serif;color:#141018;}
.er-pagos-t svg{width:22px;height:22px;stroke:#490AA0;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;}
.er-pagos-t small{display:block;font-weight:500;color:#6B6578;font-size:12px;margin-top:2px;}
.er-pagos-l{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-left:auto;}
.er-pagos-l span{display:inline-flex;align-items:center;justify-content:center;height:30px;min-width:46px;padding:0 6px;background:#fff;border:1px solid #E7E2EF;border-radius:7px;}
.er-pagos-l span img{height:20px;width:auto;display:block;}
.er-pagos-l span.er-pagos-tx{font:600 11.5px/1 Inter,system-ui,sans-serif;color:#2E0668;padding:0 9px;white-space:nowrap;}
#product_details .er-pagos{margin-top:14px;}
.o_total_card .er-pagos{margin:14px 0 0;}
@media (max-width:767.98px){.er-pagos{gap:10px;padding:12px;}.er-pagos-l{margin-left:0;}}


/* ===== PREMIUM · ACADEMIA EL REY (ref. KEX) — 2026-09-17 ===== */
.er-rec-sec{max-width:1336px;margin:0 auto;padding:44px 24px 52px;position:relative;}
/* 2026-09-18 Miguel: "muy pegado" — aire entre la pista, la franja de cifras y ¿Por qué comprar? */
#wrap .stats-strip{margin-bottom:48px !important;}
.er-rec-h{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:22px;}
.er-rec-k{font:600 12px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#490AA0;margin:0 0 10px;}
.er-rec-t{font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:clamp(26px,3vw,40px);line-height:1.05;letter-spacing:-.01em;text-transform:uppercase;color:#141018;margin:0;}
.er-rec-t span{color:#490AA0;}
.er-rec-p{font:400 15.5px/1.5 Inter,system-ui,sans-serif;color:#6B6578;margin:10px 0 0;max-width:640px;}
.er-rec-todas,.er-rec-todas:link,.er-rec-todas:visited{display:inline-flex;align-items:center;gap:8px;background:#490AA0;color:#fff !important;font:650 14px/1 Inter,system-ui,sans-serif;padding:15px 22px;border-radius:10px;text-decoration:none !important;white-space:nowrap;}
.er-rec-todas:hover{background:#2E0668;}
.er-rec-pista{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px 0 10px;}
.er-rec-pista::-webkit-scrollbar{display:none;}
.er-rec-c,.er-rec-c:link,.er-rec-c:visited{flex:0 0 306px;scroll-snap-align:start;display:flex;flex-direction:column;background:#fff;border:1px solid #ECEAF1;border-radius:16px;overflow:hidden;text-decoration:none !important;color:#141018 !important;transition:transform .2s,box-shadow .2s;}
.er-rec-c:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(46,6,104,.14);}
.er-rec-img{aspect-ratio:4/5;background:#F5F4F8 center/cover no-repeat;}
.er-rec-b{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1;}
.er-rec-e{font:600 11.5px/1.3 Inter,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#490AA0;margin:0 0 8px;}
.er-rec-b h3{font:700 17px/1.25 Inter,system-ui,sans-serif;margin:0 0 6px;color:#141018;}
.er-rec-b p{font:400 14px/1.45 Inter,system-ui,sans-serif;color:#6B6578;margin:0 0 14px;}
.er-rec-l{font:650 14px/1 Inter,system-ui,sans-serif;color:#490AA0;margin-top:auto;}
.er-rec-m{float:right;font:500 12px/1 Inter,system-ui,sans-serif;color:#9A93A8;}
.er-rec-fl{position:absolute;top:calc(50% + 30px);width:44px;height:44px;border-radius:50%;border:1px solid #ECEAF1;background:#fff;color:#141018;box-shadow:0 4px 16px rgba(46,6,104,.14);cursor:pointer;z-index:3;display:flex;align-items:center;justify-content:center;padding:0;}
.er-rec-fl:hover{color:#490AA0;border-color:#490AA0;}
.er-rec-fl svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}
.er-rec-fl.er-izq{left:2px;} .er-rec-fl.er-der{right:2px;}
@media (max-width:767.98px){
  .er-rec-sec{padding:34px 16px 36px;}
  #wrap .stats-strip{margin-bottom:32px !important;}
  .er-rec-h{flex-direction:column;align-items:flex-start;gap:14px;}
  .er-rec-todas{padding:14px 22px;}
  .er-rec-c{flex-basis:76vw;}
  .er-rec-fl{display:none;}
}
/* ---- entradas del blog (contenido de receta) ---- */
#o_wblog_post_content .er-rec,#wrap .er-rec{max-width:820px;margin:0 auto;font-family:Inter,system-ui,sans-serif;color:#141018;}
.er-rec h2{font-family:'Archivo Black',Impact,sans-serif !important;font-weight:400 !important;font-size:24px !important;text-transform:uppercase;letter-spacing:-.01em;color:#141018;margin:34px 0 14px !important;}
.er-rec-intro{font-size:18px;line-height:1.55;color:#3E3A48;margin:0 0 18px;}
.er-rec-datos{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 8px;}
.er-rec-datos span{background:#F5F4F8;border:1px solid #ECEAF1;border-radius:999px;padding:9px 14px;font-size:13.5px;color:#3E3A48;}
.er-rec-datos b{color:#490AA0;font-weight:700;margin-right:4px;}
ul.er-rec-ing{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;}
ul.er-rec-ing li{position:relative;padding:10px 12px 10px 40px;background:#fff;border:1px solid #ECEAF1;border-radius:10px;font-size:14.5px;line-height:1.35;}
ul.er-rec-ing li::before{content:'';position:absolute;left:12px;top:12px;width:18px;height:18px;border-radius:50%;background:#FFD426;box-shadow:inset 0 0 0 5px #fff,inset 0 0 0 7px #490AA0;}
ul.er-rec-ing li b{color:#490AA0;font-weight:700;}
ul.er-rec-ing li a{color:#490AA0;font-weight:600;text-decoration:underline;text-underline-offset:2px;}
ol.er-rec-pasos{counter-reset:er;list-style:none;padding:0;margin:0;}
ol.er-rec-pasos li{counter-increment:er;position:relative;padding:12px 0 12px 56px;border-bottom:1px solid #ECEAF1;font-size:16px;line-height:1.5;}
ol.er-rec-pasos li::before{content:counter(er);position:absolute;left:0;top:10px;width:38px;height:38px;border-radius:50%;background:#490AA0;color:#FFD426;font:700 16px/38px 'Archivo Black',Impact,sans-serif;text-align:center;}
.er-rec-tip{background:#FFD426;border-radius:14px;padding:18px 20px;margin:26px 0 0;color:#490AA0;}
.er-rec-tip b{display:block;font:700 12px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px;}
.er-rec-tip p{margin:0;font-size:16px;line-height:1.5;color:#2E0668;font-weight:500;}
.er-rec-prods{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;}
.er-rec-prod,.er-rec-prod:link,.er-rec-prod:visited{display:flex;flex-direction:column;align-items:center;gap:8px;background:#fff;border:1px solid #ECEAF1;border-radius:14px;padding:12px;text-decoration:none !important;color:#141018 !important;text-align:center;font-size:13px;line-height:1.3;transition:border-color .15s,transform .15s;}
.er-rec-prod:hover{border-color:#490AA0;transform:translateY(-2px);}
.er-rec-prod img{width:96px;height:96px;object-fit:contain;mix-blend-mode:multiply;}
.er-rec-cta{display:flex;flex-wrap:wrap;gap:10px;margin:30px 0 10px !important;}
.er-rec-btn,.er-rec-btn:link,.er-rec-btn:visited{display:inline-flex;align-items:center;justify-content:center;background:#490AA0;color:#fff !important;font:650 15px/1 Inter,system-ui,sans-serif;padding:15px 24px;border-radius:10px;text-decoration:none !important;}
.er-rec-btn:hover{background:#2E0668;}
.er-rec-btn2,.er-rec-btn2:link,.er-rec-btn2:visited{background:#fff;color:#490AA0 !important;border:1.5px solid #490AA0;}
.er-rec-btn2:hover{background:#F5F4F8;}
@media (max-width:575.98px){ul.er-rec-ing{grid-template-columns:1fr;} .er-rec-btn{width:100%;}}


/* ===== PREMIUM · FAQ + SUCURSAL en un bloque — 2026-09-17 ===== */
.elrey-page .er-fs{background:#F6F5F9;padding:64px 24px;}
.er-fs-in{max-width:1288px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start;}
.er-fs-col{min-width:0;}
.er-fs-col .sec-tag{text-align:left !important;margin-bottom:8px !important;}
.er-fs-col .sec-h{text-align:left !important;font-size:30px !important;line-height:1.05 !important;margin:0 0 20px !important;padding:0 !important;}
.er-fs .faq-grid{display:flex !important;flex-direction:column !important;align-items:stretch !important;gap:8px !important;max-width:none !important;}
.er-fs .faq-item{opacity:1 !important;transform:none !important;animation:none !important;padding:0 !important;margin:0 !important;width:100% !important;}
.er-fs .faq-item.er-fs-oculta{display:none !important;}
.er-fs .faq-q{font:600 15px/1.35 Inter,system-ui,sans-serif !important;text-transform:none !important;letter-spacing:0 !important;padding:14px 16px !important;align-items:center !important;gap:12px;color:#141018 !important;}
.er-fs .faq-a{font:400 14px/1.5 Inter,system-ui,sans-serif !important;padding:0 16px !important;color:#3E3A48 !important;}
.er-fs .faq-item.open .faq-a{padding:0 16px 14px !important;max-height:300px !important;}
.er-fs-mas{margin-top:12px;display:inline-flex;align-items:center;gap:8px;background:#fff;border:1.5px solid #490AA0;color:#490AA0;font:650 14px/1 Inter,system-ui,sans-serif;padding:13px 20px;border-radius:10px;cursor:pointer;}
.er-fs-mas:hover{background:#490AA0;color:#fff;}
.er-fs-mas[hidden]{display:none !important;}
.er-fs .suc-grid{display:flex !important;flex-direction:column !important;gap:0 !important;border-radius:16px !important;overflow:hidden !important;box-shadow:0 4px 16px rgba(46,6,104,.08);height:auto !important;max-width:none !important;}
.er-fs .suc-card{opacity:1 !important;animation:none !important;padding:26px 24px !important;text-align:left !important;}
.er-fs .suc-name{font-size:20px !important;}
.er-fs .suc-addr{margin:6px 0 16px !important;}
.er-fs .suc-pill{border-radius:10px !important;font-size:12px !important;padding:12px 18px !important;color:#490AA0 !important;}
.er-fs .map-wrap{opacity:1 !important;animation:none !important;height:360px !important;min-height:0 !important;border-radius:0 !important;}
.er-fs .map-wrap iframe{height:100% !important;min-height:0 !important;}
@media (max-width:991.98px){
  .er-fs-in{grid-template-columns:1fr;gap:36px;}
  .er-fs .map-wrap{height:280px !important;}
}
@media (max-width:575.98px){
  .elrey-page .er-fs{padding:36px 16px;}
  .er-fs-col .sec-h{font-size:24px !important;margin-bottom:14px !important;}
  .er-fs .faq-q{font-size:14.5px !important;padding:13px 14px !important;}
  .er-fs .faq-a{padding:0 14px !important;}
  .er-fs .faq-item.open .faq-a{padding:0 14px 13px !important;}
  .er-fs-mas{width:100%;justify-content:center;padding:14px 20px;}
  .er-fs .map-wrap{height:240px !important;}
  .er-fs .suc-card{padding:22px 18px !important;}
}


/* ===== PREMIUM · BUSCADOR MAESTRO (ref. KEX) — 2026-09-17 ===== */
header#top .o_searchbar_form,header#top form.er_buscar{position:relative;}
header#top form.er_buscar input,header#top form.er_buscar button,.er-bq-ov input,.er-bq-ov button,.er-bq a,.er-bq button{touch-action:manipulation;}
header#top .o_searchbar_form .dropdown-menu,header#top .o_searchbar_form .o_search_result_item{display:none !important;}
header#top form.er_buscar .er_sug{display:none !important;}
header#top .o_searchbar_form input[name="search"],header#top form.er_buscar input[name="search"]{padding-right:96px !important;}
.er-bq-mic{position:absolute;right:56px;top:20px;transform:translateY(-50%);width:34px;height:34px;border-radius:50%;border:0;background:transparent;color:#490AA0;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3;padding:0;}
.er-bq-mic svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
/* la cabecera estiliza TODO button de form.er_buscar como el circulo morado de
   buscar (absoluto, right:4px): el mic y los chips del panel necesitan sus reglas */
header#top form.er_buscar button.er-bq-mic{position:absolute !important;left:auto !important;right:var(--er-mic-right,56px) !important;top:var(--er-mic-top,50%) !important;bottom:auto !important;transform:translateY(-50%) !important;width:34px !important;height:34px !important;min-width:0 !important;border-radius:50% !important;background:transparent !important;color:#490AA0 !important;border:0 !important;box-shadow:none !important;padding:0 !important;margin:0 !important;}
header#top form.er_buscar button.er-bq-mic.er-on{background:#490AA0 !important;color:#fff !important;}
header#top form.er_buscar .er-bq button{position:static !important;width:auto !important;height:auto !important;min-width:0 !important;top:auto !important;right:auto !important;left:auto !important;transform:none !important;display:inline-flex !important;align-items:center;gap:6px;background:#F5F4F8 !important;border:1px solid #ECEAF1 !important;border-radius:999px !important;padding:8px 13px !important;font:600 13px/1 Inter,system-ui,sans-serif !important;color:#141018 !important;box-shadow:none !important;margin:0 !important;}
header#top form.er_buscar .er-bq button:hover{border-color:#490AA0 !important;color:#490AA0 !important;}
.er-bq-mic.er-on{color:#fff;background:#490AA0;animation:er-bq-pulsa 1s ease-in-out infinite;}
@keyframes er-bq-pulsa{0%,100%{box-shadow:0 0 0 0 rgba(73,10,160,.35)}50%{box-shadow:0 0 0 8px rgba(73,10,160,0)}}
.er-bq{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:1060;background:#fff;border:1px solid #ECEAF1;border-radius:16px;box-shadow:0 18px 48px rgba(46,6,104,.18);max-height:min(72vh,720px);overflow:auto;display:none;text-align:left;font-family:Inter,system-ui,sans-serif;color:#141018;}
.er-bq.er-abierto{display:block;}
.er-bq-sec{padding:12px 8px 6px;}
.er-bq-sec + .er-bq-sec{border-top:1px solid #F1EFF5;}
.er-bq-k{font:600 11px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#490AA0;margin:0 0 6px 10px;display:flex;justify-content:space-between;align-items:center;}
.er-bq-k a{color:#6B6578 !important;font-weight:600;letter-spacing:0;text-transform:none;font-size:12px;margin-right:6px;text-decoration:none !important;}
.er-bq-it,.er-bq-it:link,.er-bq-it:visited{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:10px;text-decoration:none !important;color:#141018 !important;}
.er-bq-it:hover,.er-bq-it.er-act{background:#F5F4F8;}
.er-bq-im{width:46px;height:46px;flex:none;border-radius:10px;background:#F5F4F8;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.er-bq-im img{max-width:100%;max-height:100%;object-fit:contain;mix-blend-mode:multiply;}
.er-bq-im.er-rec img{width:100%;height:100%;object-fit:cover;mix-blend-mode:normal;}
.er-bq-im svg{width:20px;height:20px;stroke:#490AA0;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.er-bq-tx{flex:1;min-width:0;}
.er-bq-n{font:500 14px/1.3 Inter,system-ui,sans-serif;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.er-bq-n .text-primary-emphasis{color:#490AA0 !important;font-weight:700;}
.er-bq-s{font:400 12px/1.3 Inter,system-ui,sans-serif;color:#6B6578;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.er-bq-p{font-family:'Archivo Black',Impact,sans-serif;font-size:14px;white-space:nowrap;color:#141018;}
.er-bq-p .oe_currency_value{font:inherit;}
.er-bq-chips{display:flex;flex-wrap:wrap;gap:6px;padding:2px 10px 8px;}
.er-bq-chips a,.er-bq-chips a:link,.er-bq-chips a:visited,.er-bq-chips button{display:inline-flex;align-items:center;gap:6px;background:#F5F4F8;border:1px solid #ECEAF1;border-radius:999px;padding:8px 13px;font:600 13px/1 Inter,system-ui,sans-serif;color:#141018 !important;text-decoration:none !important;cursor:pointer;}
.er-bq-chips a:hover,.er-bq-chips button:hover{border-color:#490AA0;color:#490AA0 !important;}
.er-bq-chips button svg{width:16px;height:16px;stroke:#490AA0;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.er-bq-nota{margin:0 10px 6px;padding:8px 12px;background:#FFF7D6;border-radius:8px;font:500 12.5px/1.4 Inter,system-ui,sans-serif;color:#2E0668;}
.er-bq-vacio{padding:18px 16px;font:400 14px/1.5 Inter,system-ui,sans-serif;color:#6B6578;}
.er-bq-pie{position:sticky;bottom:0;background:#fff;border-top:1px solid #F1EFF5;padding:10px;}
.er-bq-todo,.er-bq-todo:link,.er-bq-todo:visited{display:flex;align-items:center;justify-content:center;gap:8px;background:#490AA0;color:#fff !important;border-radius:10px;padding:13px 16px;font:650 14px/1 Inter,system-ui,sans-serif;text-decoration:none !important;}
.er-bq-todo:hover,.er-bq-todo.er-act{background:#2E0668;}
.er-bq-todo svg{width:18px;height:18px;flex:none;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.er-bq svg{max-width:24px;max-height:24px;}
@media (max-width:575.98px){.er-bq-mic{display:none !important;}}
/* ---- asesor de compra (IA) ---- */
.er-as{display:flex;flex-direction:column;min-height:320px;}
.er-as-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px 10px;border-bottom:1px solid #F1EFF5;}
.er-as-top b{font:700 14px/1.2 Inter,system-ui,sans-serif;color:#141018;display:flex;align-items:center;gap:8px;}
.er-as-top b span{display:inline-flex;align-items:center;background:#FFD426;color:#490AA0;font:700 10px/1 Inter,system-ui,sans-serif;letter-spacing:.08em;padding:4px 7px;border-radius:999px;}
.er-as-top button{background:none;border:0;color:#490AA0;font:600 13px/1 Inter,system-ui,sans-serif;cursor:pointer;padding:6px 8px;}
.er-as-chat{padding:12px 14px;display:flex;flex-direction:column;gap:10px;flex:1;}
.er-as-b{max-width:88%;padding:10px 13px;border-radius:14px;font:400 14px/1.45 Inter,system-ui,sans-serif;white-space:pre-wrap;}
.er-as-b.er-u{align-self:flex-end;background:#490AA0;color:#fff;border-bottom-right-radius:4px;}
.er-as-b.er-a{align-self:flex-start;background:#F5F4F8;color:#141018;border-bottom-left-radius:4px;}
.er-as-b.er-a.er-carg{color:#6B6578;font-style:italic;}
.er-as-prods{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.er-as-p,.er-as-p:link,.er-as-p:visited{display:flex;gap:10px;align-items:flex-start;background:#fff;border:1px solid #ECEAF1;border-radius:12px;padding:8px;text-decoration:none !important;color:#141018 !important;}
.er-as-p:hover{border-color:#490AA0;}
.er-as-p img{width:54px;height:54px;object-fit:contain;flex:none;background:#F5F4F8;border-radius:8px;mix-blend-mode:multiply;}
.er-as-p b{display:block;font:600 13px/1.25 Inter,system-ui,sans-serif;}
.er-as-p .er-as-pr{font-family:'Archivo Black',Impact,sans-serif;font-size:14px;margin-top:3px;}
.er-as-p .er-as-pr small{font:500 11px/1 Inter,system-ui,sans-serif;color:#6B6578;margin-left:4px;}
.er-as-p em{display:block;font:400 12px/1.35 Inter,system-ui,sans-serif;color:#6B6578;font-style:normal;margin-top:3px;}
.er-as-sug{display:flex;flex-wrap:wrap;gap:6px;}
.er-as-sug button{background:#fff;border:1px solid #490AA0;color:#490AA0;border-radius:999px;padding:7px 12px;font:600 12.5px/1 Inter,system-ui,sans-serif;cursor:pointer;}
.er-as-form{display:flex;gap:8px;padding:10px 14px 12px;border-top:1px solid #F1EFF5;position:sticky;bottom:0;background:#fff;}
.er-as-form input{flex:1;min-width:0;height:44px;border:1.5px solid #ECEAF1;border-radius:12px;padding:0 14px;font:500 15px/1 Inter,system-ui,sans-serif;color:#141018;outline:none;}
.er-as-form input:focus{border-color:#490AA0;}
.er-as-form button{height:44px;padding:0 16px;border:0;border-radius:12px;background:#490AA0;color:#fff;font:650 14px/1 Inter,system-ui,sans-serif;cursor:pointer;}
.er-as-form button[disabled]{opacity:.5;cursor:default;}
.er-as-nota{padding:0 14px 10px;font:400 11px/1.4 Inter,system-ui,sans-serif;color:#9A93A8;}
.er-bq-ia,.er-bq-ia:link,.er-bq-ia:visited{display:flex;align-items:center;gap:10px;margin:6px 10px 10px;padding:11px 14px;background:#2E0668;color:#fff !important;border-radius:12px;text-decoration:none !important;cursor:pointer;border:0;width:calc(100% - 20px);text-align:left;font:600 13.5px/1.3 Inter,system-ui,sans-serif;}
.er-bq-ia span{display:inline-flex;align-items:center;background:#FFD426;color:#490AA0;font:700 10px/1 Inter,system-ui,sans-serif;letter-spacing:.08em;padding:4px 7px;border-radius:999px;flex:none;}
.er-bq-ia small{display:block;font:400 12px/1.3 Inter,system-ui,sans-serif;color:rgba(255,255,255,.75);}
@media (max-width:575.98px){.er-as-prods{grid-template-columns:1fr;}}
@media (max-width:991.98px){
  /* iPhone: la cabecera se esconde al desplazar y el teclado cambia el viewport, asi
     que un panel "fixed" bajo el input quedaba flotando a media pantalla (captura
     de Miguel). En telefono el buscador es una capa completa con su propio campo. */
  .er-bq-ov{position:fixed;inset:0;z-index:1090;background:#fff;display:none;flex-direction:column;}
  .er-bq-ov.er-abierto{display:flex;}
  .er-bq-ov-top{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid #ECEAF1;background:#fff;flex:none;padding-top:max(10px,env(safe-area-inset-top));}
  .er-bq-ov-top input{flex:1;min-width:0;height:46px;border:1.5px solid #490AA0;border-radius:12px;padding:0 14px;font:500 16px/1 Inter,system-ui,sans-serif;color:#141018;background:#fff;outline:none;-webkit-appearance:none;}
  .er-bq-ov-top button{flex:none;width:46px;height:46px;border:0;background:#F5F4F8;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#490AA0;cursor:pointer;padding:0;}
  .er-bq-ov-top button svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
  .er-bq-ov-top button.er-on{background:#490AA0;color:#fff;}
  .er-bq-ov .er-bq{position:static !important;display:block;flex:1;overflow:auto;max-height:none;border:0;border-radius:0;box-shadow:none;-webkit-overflow-scrolling:touch;padding-bottom:env(safe-area-inset-bottom);}
  body.er-bq-lock{overflow:hidden !important;}
  .er-bq-ov-top form{display:flex;flex:1;min-width:0;margin:0;}
  .er-bq-ov-top form input{width:100%;}
  .er-bq-mic{right:48px;}
}
@media (prefers-reduced-motion: reduce){.er-bq-mic.er-on{animation:none;}}


/* ===== PREMIUM · ACADEMIA EL REY (listado + entradas) — 2026-09-18 ===== */
#o_wblog_blog_top .o_wblog_post_name{font-family:'Archivo Black',Impact,sans-serif !important;font-weight:400 !important;text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(30px,4.6vw,56px) !important;line-height:1.02;}
#o_wblog_blog_top .o_wblog_post_subtitle{font:400 clamp(15px,1.6vw,19px)/1.5 Inter,system-ui,sans-serif;max-width:640px;}
#o_wblog_blog_top .o_record_cover_container.o_half_screen_height{min-height:38vh !important;}
/* pestanas */
.er-ac-tabs{max-width:1336px;margin:0 auto;padding:18px 24px 0;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.er-ac-tabs::-webkit-scrollbar{display:none;}
.er-ac-tabs a,.er-ac-tabs a:link,.er-ac-tabs a:visited{flex:0 0 auto;font:600 13.5px/1 Inter,system-ui,sans-serif;color:#490AA0 !important;background:#fff;border:1.5px solid #E7E2EF;border-radius:999px;padding:11px 16px;text-decoration:none !important;white-space:nowrap;transition:background .15s,border-color .15s;}
.er-ac-tabs a:hover{border-color:#490AA0;}
.er-ac-tabs a.er-on{background:#490AA0;color:#fff !important;border-color:#490AA0;}
/* buscador del blog: la barra de Odoo hereda el morado del tema; va blanca */
#wrap nav.navbar.navbar-expand-lg{background:#fff !important;border-bottom:1px solid #ECEAF1;padding-top:12px !important;padding-bottom:12px !important;}
#wrap nav.navbar form.o_searchbar_form .search-query{background:#F5F4F8 !important;}
#wrap nav.navbar form.o_searchbar_form .search-query{border-radius:10px 0 0 10px !important;font-family:Inter,system-ui,sans-serif;}
#wrap nav.navbar form.o_searchbar_form .oe_search_button{border-radius:0 10px 10px 0 !important;background:#490AA0 !important;color:#fff !important;}
/* destacado */
.er-ac-dest,.er-ac-dest:link,.er-ac-dest:visited{max-width:1288px;margin:22px auto 6px;display:grid;grid-template-columns:1.25fr 1fr;background:#490AA0;border-radius:18px;overflow:hidden;text-decoration:none !important;color:#fff !important;box-shadow:0 12px 32px rgba(46,6,104,.16);}
.er-ac-dest-i{aspect-ratio:16/9;min-width:0;background:#2E0668 center/cover no-repeat;}
.er-ac-dest-b{padding:34px 36px;display:flex;flex-direction:column;justify-content:center;gap:12px;}
.er-ac-dest-k{font:600 11.5px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#FFD426;margin:0;}
.er-ac-dest-b h2{font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:clamp(22px,2.4vw,34px);line-height:1.05;text-transform:uppercase;color:#fff;margin:0;}
.er-ac-dest-b p{font:400 15px/1.5 Inter,system-ui,sans-serif;color:rgba(255,255,255,.85);margin:0;}
.er-ac-dest-b .er-ac-dest-x{font:500 clamp(17px,1.6vw,21px)/1.45 Inter,system-ui,sans-serif;color:#fff;}
.er-ac-dest-l{display:inline-flex;align-self:flex-start;background:#FFD426;color:#490AA0;font:700 14px/1 Inter,system-ui,sans-serif;padding:14px 20px;border-radius:10px;margin-top:6px;}
/* tarjetas del listado (revisten el article de Odoo) */
#o_wblog_posts_loop .o_wblog_post_list_author{display:none !important;}
#o_wblog_posts_loop article.o_wblog_post{background:#fff;border:1px solid #ECEAF1;border-radius:16px;overflow:hidden;height:100%;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s;}
#o_wblog_posts_loop article.o_wblog_post:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(46,6,104,.14);}
#o_wblog_posts_loop article.o_wblog_post > a{margin:0 !important;}
#o_wblog_posts_loop .o_record_cover_container.o_list_cover{border-radius:0 !important;box-shadow:none !important;margin:0 !important;aspect-ratio:4/5;min-height:0 !important;height:auto !important;}
#o_wblog_posts_loop .o_record_cover_container.o_list_cover .o_record_cover_filter{display:none;}
#o_wblog_posts_loop article.o_wblog_post > div{padding:14px 18px 0;}
#o_wblog_posts_loop article.o_wblog_post > div:last-child{padding:0 18px 16px;margin-top:auto;}
#o_wblog_posts_loop .er-ac-e{font:600 11.5px/1.3 Inter,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#490AA0;margin:0 0 8px;}
#o_wblog_posts_loop .o_blog_post_title{font:700 17px/1.25 Inter,system-ui,sans-serif !important;color:#141018 !important;}
#o_wblog_posts_loop .o_wblog_normalize_font{font:400 14px/1.45 Inter,system-ui,sans-serif;color:#6B6578;}
#o_wblog_posts_loop .o_wblog_post_short_tag_section{display:none !important;}
#o_wblog_posts_loop time{display:none !important;}
#o_wblog_posts_loop .er-ac-pie{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:12px;}
#o_wblog_posts_loop .er-ac-l{font:650 14px/1 Inter,system-ui,sans-serif;color:#490AA0;}
#o_wblog_posts_loop .er-ac-m{font:500 12px/1 Inter,system-ui,sans-serif;color:#9A93A8;}
#o_wblog_posts_loop .pb-4{padding-bottom:22px !important;}
#o_wblog_index_content .pagination .page-link{color:#490AA0;border-radius:10px;margin:0 3px;font-family:Inter,system-ui,sans-serif;}
#o_wblog_index_content .pagination .active .page-link{background:#490AA0;border-color:#490AA0;color:#fff;}
/* entrada */
#o_wblog_post_info{display:none !important;}
.er-ac-info{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;font:600 12px/1 Inter,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#490AA0;margin:0 0 18px;}
.er-ac-info span+span::before{content:'·';margin-right:14px;color:#C9C2D6;}
#o_wblog_post_content .breadcrumb a{color:#490AA0;font-family:Inter,system-ui,sans-serif;}
#o_wblog_post_top .o_wblog_post_name{font-family:'Archivo Black',Impact,sans-serif !important;font-weight:400 !important;text-transform:uppercase;letter-spacing:-.01em;line-height:1.05;}
#o_wblog_post_top .o_wblog_post_subtitle{font-family:Inter,system-ui,sans-serif;}
.er-art ul.er-art-ul{padding:0 0 0 22px;margin:0 0 6px;}
.er-art ul.er-art-ul li{margin:0 0 9px;font-size:16px;line-height:1.5;}
.er-art ul.er-art-ul li::marker{color:#490AA0;}
.er-art p{font-size:16px;line-height:1.55;}
.er-art a{color:#490AA0;font-weight:600;text-decoration:underline;text-underline-offset:2px;}
.er-art-tw{overflow-x:auto;margin:0 0 8px;border:1px solid #ECEAF1;border-radius:12px;}
table.er-art-tabla{width:100%;border-collapse:collapse;font:400 14.5px/1.4 Inter,system-ui,sans-serif;min-width:420px;}
table.er-art-tabla th{background:#490AA0;color:#FFD426;text-align:left;padding:11px 14px;font:700 12px/1.2 Inter,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;}
table.er-art-tabla td{padding:10px 14px;border-top:1px solid #ECEAF1;vertical-align:top;color:#141018;}
table.er-art-tabla tr:nth-child(even) td{background:#FAF9FC;}
#o_wblog_post_footer .o_wblog_post_name{font-family:'Archivo Black',Impact,sans-serif !important;text-transform:uppercase;}
@media (max-width:767.98px){
  .er-ac-dest,.er-ac-dest:link,.er-ac-dest:visited{grid-template-columns:1fr !important;margin:16px 16px 4px;}
  .er-ac-dest-b{padding:20px 20px 22px;}
  .er-ac-tabs{padding:14px 16px 0;}
  #o_wblog_posts_loop > .row > div{flex:0 0 50%;max-width:50%;padding-left:6px;padding-right:6px;}
  #o_wblog_posts_loop article.o_wblog_post > div{padding:10px 12px 0;}
  #o_wblog_posts_loop article.o_wblog_post > div:last-child{padding:0 12px 12px;}
  #o_wblog_posts_loop .o_blog_post_title{font-size:14px !important;}
  #o_wblog_posts_loop .o_wblog_normalize_font{font-size:12.5px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
  #o_wblog_posts_loop .er-ac-e{font-size:10px;}
  #o_wblog_posts_loop .er-ac-l{font-size:13px;} #o_wblog_posts_loop .er-ac-m{display:none;}
  #o_wblog_index_content > .container{padding-left:10px;padding-right:10px;}
}


/* ===== PREMIUM · CONTACTO Y UBICACION (ref. KEX) — 2026-09-18 ===== */
body.er-ct #wrap > section.s_title{display:none !important;}
body.er-ct #wrap{font-family:Inter,system-ui,sans-serif;}
.er-ct-hero{background:#490AA0;color:#fff;padding:56px 24px 60px;text-align:center;}
.er-ct-k{font:600 12px/1 Inter,system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#FFD426;margin:0 0 14px;}
.er-ct-hero h1{font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:clamp(32px,5vw,60px);line-height:1;letter-spacing:-.01em;text-transform:uppercase;margin:0 auto;max-width:900px;color:#fff;}
.er-ct-hero h1 span{color:#FFD426;}
.er-ct-hero p{font:400 clamp(15px,1.5vw,18px)/1.5 Inter,system-ui,sans-serif;color:rgba(255,255,255,.85);max-width:640px;margin:16px auto 0;}
.er-ct-wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
/* tarjeta de sucursal */
.er-ct-loc{display:grid;grid-template-columns:1.05fr 1fr;background:#fff;border:1px solid #ECEAF1;border-radius:20px;overflow:hidden;box-shadow:0 12px 32px rgba(46,6,104,.10);margin:-36px auto 0;position:relative;}
.er-ct-media{position:relative;min-height:320px;background:#2E0668 center/cover no-repeat;}
.er-ct-badge{position:absolute;left:18px;top:18px;background:#FFD426;color:#490AA0;font:700 12px/1 Inter,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;padding:10px 14px;border-radius:999px;}
.er-ct-body{padding:30px 32px 28px;display:flex;flex-direction:column;gap:14px;}
.er-ct-body h2{font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:clamp(22px,2.2vw,30px);line-height:1.05;text-transform:uppercase;color:#141018;margin:0;}
.er-ct-estado{display:inline-flex;align-items:center;gap:8px;font:600 13.5px/1 Inter,system-ui,sans-serif;color:#141018;}
.er-ct-estado i{width:10px;height:10px;border-radius:50%;background:#1DB954;display:inline-block;}
.er-ct-estado.er-cerrado i{background:#C9C2D6;}
.er-ct-chips{display:flex;gap:8px;}
.er-ct-chips button{font:600 13px/1 Inter,system-ui,sans-serif;color:#490AA0;background:#fff;border:1.5px solid #E7E2EF;border-radius:999px;padding:10px 16px;cursor:pointer;}
.er-ct-chips button.er-on{background:#490AA0;color:#fff;border-color:#490AA0;}
.er-ct-pane{display:none;} .er-ct-pane.er-on{display:block;}
.er-ct-dir{font:400 16px/1.55 Inter,system-ui,sans-serif;color:#3E3A48;margin:0;}
.er-ct-dir b{color:#141018;display:block;font-weight:700;}
.er-ct-h{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:6px 18px;}
.er-ct-h li{display:flex;justify-content:space-between;font:400 14.5px/1.4 Inter,system-ui,sans-serif;color:#3E3A48;border-bottom:1px solid #F1EEF5;padding:6px 0;}
.er-ct-h li b{font-weight:600;color:#141018;} .er-ct-h li.er-hoy b,.er-ct-h li.er-hoy span{color:#490AA0;font-weight:700;}
.er-ct-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:6px;}
.er-ct-btn,.er-ct-btn:link,.er-ct-btn:visited{display:inline-flex;align-items:center;gap:8px;background:#490AA0;color:#fff !important;font:650 14px/1 Inter,system-ui,sans-serif;padding:14px 20px;border-radius:10px;text-decoration:none !important;}
.er-ct-btn:hover{background:#2E0668;}
.er-ct-btn.er-am,.er-ct-btn.er-am:link,.er-ct-btn.er-am:visited{background:#FFD426;color:#490AA0 !important;}
.er-ct-btn.er-am:hover{background:#FDB913;}
.er-ct-btn.er-bl,.er-ct-btn.er-bl:link,.er-ct-btn.er-bl:visited{background:#fff;color:#490AA0 !important;border:1.5px solid #490AA0;}
.er-ct-btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
.er-ct-map{grid-column:1/-1;height:300px;border-top:1px solid #ECEAF1;background:#F5F4F8;}
.er-ct-map iframe{width:100%;height:100%;border:0;display:block;}
/* canales */
.er-ct-canales{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:28px auto 0;}
.er-ct-can,.er-ct-can:link,.er-ct-can:visited{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid #ECEAF1;border-radius:16px;padding:20px;text-decoration:none !important;color:#141018 !important;transition:transform .2s,box-shadow .2s;}
.er-ct-can:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(46,6,104,.12);}
.er-ct-ico{flex:0 0 46px;width:46px;height:46px;border-radius:12px;background:#F5F2FA;display:flex;align-items:center;justify-content:center;color:#490AA0;}
.er-ct-ico svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.er-ct-can b{display:block;font:700 15px/1.2 Inter,system-ui,sans-serif;margin:0 0 4px;}
.er-ct-can strong{display:block;font:700 17px/1.2 Inter,system-ui,sans-serif;color:#490AA0;margin:0 0 6px;}
.er-ct-can p{margin:0;font:400 13.5px/1.45 Inter,system-ui,sans-serif;color:#6B6578;}
/* formulario (el de Odoo, revestido) */
body.er-ct #wrap section.s_text_block{padding:48px 0 !important;}
body.er-ct #wrap section.s_text_block > .container{max-width:1180px;}
body.er-ct #wrap section.s_text_block .row{align-items:flex-start;}
.er-ct-ft{font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:clamp(24px,2.6vw,34px);line-height:1.05;text-transform:uppercase;color:#141018;margin:0 0 10px;}
.er-ct-ft span{color:#490AA0;}
body.er-ct #wrap section.s_text_block p.lead{font:400 16px/1.55 Inter,system-ui,sans-serif;color:#6B6578;margin:0 0 22px;}
body.er-ct #contactus_form .s_website_form_label{width:auto !important;font:600 13px/1.2 Inter,system-ui,sans-serif;color:#141018;margin-bottom:6px;}
body.er-ct #contactus_form .form-control{border:1.5px solid #E7E2EF;border-radius:10px;padding:12px 14px;font:400 15px/1.4 Inter,system-ui,sans-serif;background:#fff;box-shadow:none;}
body.er-ct #contactus_form .form-control:focus{border-color:#490AA0;box-shadow:0 0 0 3px rgba(73,10,160,.12);}
body.er-ct #contactus_form textarea.form-control{min-height:150px;}
body.er-ct #contactus_form .s_website_form_submit{text-align:left !important;}
body.er-ct #contactus_form .s_website_form_send{background:#490AA0 !important;border:0 !important;color:#fff !important;font:650 15px/1 Inter,system-ui,sans-serif;padding:15px 26px;border-radius:10px;}
body.er-ct #contactus_form .s_website_form_send:hover{background:#2E0668 !important;}
.er-ct-side{background:#F5F2FA;border-radius:18px;padding:26px 26px 24px;}
.er-ct-side h3{font:700 16px/1.25 Inter,system-ui,sans-serif;color:#141018;margin:0 0 12px;}
.er-ct-side ul{list-style:none;padding:0;margin:0 0 18px;}
.er-ct-side li{position:relative;padding:6px 0 6px 26px;font:400 14.5px/1.45 Inter,system-ui,sans-serif;color:#3E3A48;}
.er-ct-side li::before{content:'';position:absolute;left:0;top:11px;width:14px;height:14px;border-radius:50%;background:#FFD426;box-shadow:inset 0 0 0 4px #F5F2FA,inset 0 0 0 6px #490AA0;}
.er-ct-side p{font:400 13.5px/1.5 Inter,system-ui,sans-serif;color:#6B6578;margin:0 0 14px;}
.er-ct-redes{display:flex;gap:10px;}
.er-ct-redes a{width:40px;height:40px;border-radius:50%;background:#fff;border:1px solid #E7E2EF;display:flex;align-items:center;justify-content:center;color:#490AA0;}
.er-ct-redes a svg{width:18px;height:18px;fill:currentColor;}
/* panel CTA (ref. KEX "Mas que un punto de venta") */
.er-ct-cta{max-width:1180px;margin:8px auto 0;padding:0 24px 56px;}
.er-ct-panel{display:grid;grid-template-columns:1fr 1fr;background:#490AA0;border-radius:20px;overflow:hidden;color:#fff;}
.er-ct-pt{padding:44px 40px;display:flex;flex-direction:column;justify-content:center;gap:14px;}
.er-ct-pt h2{font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:clamp(26px,3vw,40px);line-height:1.02;text-transform:uppercase;color:#fff;margin:0;}
.er-ct-pt h2 span{color:#FFD426;}
.er-ct-pt p{font:400 16px/1.5 Inter,system-ui,sans-serif;color:rgba(255,255,255,.85);margin:0;max-width:460px;}
.er-ct-pi{min-height:340px;background:#2E0668 center/cover no-repeat;}
.er-ct-ben{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px;}
.er-ct-ben article{background:#fff;border:1px solid #ECEAF1;border-radius:16px;padding:22px 20px;display:flex;gap:14px;align-items:flex-start;}
.er-ct-ben b{display:block;font:700 15px/1.25 Inter,system-ui,sans-serif;color:#141018;margin-bottom:5px;}
.er-ct-ben p{margin:0;font:400 13.5px/1.45 Inter,system-ui,sans-serif;color:#6B6578;}
/* gracias */
body.er-ct-ok #wrap h1{font-family:'Archivo Black',Impact,sans-serif !important;text-transform:uppercase;}
body.er-ct-ok #wrap section.s_text_block .col-lg-4{display:none !important;}
body.er-ct-ok #wrap section.s_text_block .col-lg-6{flex:0 0 100% !important;max-width:100% !important;margin:0 !important;}
body.er-ct-ok #wrap section.s_text_block p.lead{font-family:Inter,system-ui,sans-serif;color:#3E3A48;}
body.er-ct-ok #wrap section.s_text_block .fa-paper-plane{background:#490AA0 !important;color:#FFD426 !important;}
.er-ct-gracias{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:18px 0 40px;}
@media (max-width:991.98px){
  .er-ct-loc{grid-template-columns:1fr;margin-top:-28px;}
  .er-ct-media{min-height:220px;aspect-ratio:16/10;}
  .er-ct-canales{grid-template-columns:1fr;}
  .er-ct-panel{grid-template-columns:1fr;} .er-ct-pi{min-height:240px;order:-1;}
  .er-ct-ben{grid-template-columns:1fr;}
  .er-ct-side{margin-top:24px;}
}
@media (max-width:575.98px){
  .er-ct-hero{padding:40px 16px 48px;} .er-ct-wrap,.er-ct-cta{padding-left:12px;padding-right:12px;}
  .er-ct-body{padding:22px 18px 20px;} .er-ct-h{grid-template-columns:1fr;}
  .er-ct-btns .er-ct-btn{flex:1 1 auto;justify-content:center;}
  .er-ct-pt{padding:28px 20px;} .er-ct-map{height:240px;}
}


/* ===== FICHA · APRENDE A USARLO (academia + modo de empleo) — 2026-09-19 ===== */
.er-ap{max-width:1180px;margin:40px auto 8px;padding:0 24px;font-family:Inter,system-ui,sans-serif;}
.er-ap-k{font:600 12px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#490AA0;margin:0 0 10px;}
.er-ap h2{font-family:'Archivo Black',Impact,sans-serif;font-weight:400;font-size:clamp(22px,2.6vw,32px);line-height:1.05;text-transform:uppercase;color:#141018;margin:0 0 20px;}
.er-ap h2 span{color:#490AA0;}
.er-ap-grid{display:grid;grid-template-columns:minmax(260px,1fr) 2fr;gap:20px;align-items:start;}
.er-ap-grid.er-solo{grid-template-columns:1fr;}
.er-ap-uso{background:#F5F2FA;border-radius:18px;padding:22px 22px 20px;}
.er-ap-uso h3{font:700 16px/1.25 Inter,system-ui,sans-serif;color:#141018;margin:0 0 12px;}
.er-ap-uso ul{list-style:none;padding:0;margin:0;}
.er-ap-uso li{position:relative;padding:7px 0 7px 26px;font:400 14.5px/1.5 Inter,system-ui,sans-serif;color:#3E3A48;}
.er-ap-uso li::before{content:'';position:absolute;left:0;top:12px;width:14px;height:14px;border-radius:50%;background:#FFD426;box-shadow:inset 0 0 0 4px #F5F2FA,inset 0 0 0 6px #490AA0;}
.er-ap-uso p{font:400 12.5px/1.45 Inter,system-ui,sans-serif;color:#9A93A8;margin:12px 0 0;}
.er-ap-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.er-ap-c,.er-ap-c:link,.er-ap-c:visited{display:flex;flex-direction:column;background:#fff;border:1px solid #ECEAF1;border-radius:16px;overflow:hidden;text-decoration:none !important;color:#141018 !important;transition:transform .2s,box-shadow .2s;}
.er-ap-c:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(46,6,104,.12);}
.er-ap-img{aspect-ratio:4/5;background:#F5F4F8 center/cover no-repeat;}
.er-ap-b{padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px;flex:1;}
.er-ap-e{font:600 11px/1.2 Inter,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#490AA0;}
.er-ap-b b{font:700 15px/1.25 Inter,system-ui,sans-serif;}
.er-ap-l{margin-top:auto;font:650 13.5px/1 Inter,system-ui,sans-serif;color:#490AA0;}
.er-ap-todo,.er-ap-todo:link,.er-ap-todo:visited{display:inline-block;margin-top:14px;font:650 14px/1 Inter,system-ui,sans-serif;color:#490AA0 !important;text-decoration:none !important;}
@media (max-width:991.98px){.er-ap-grid{grid-template-columns:1fr;}}
@media (max-width:575.98px){
  .er-ap{padding:0 16px;margin-top:28px;}
  .er-ap-cards{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:72%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px;}
  .er-ap-cards::-webkit-scrollbar{display:none;}
  .er-ap-c{scroll-snap-align:start;}
}
