/* ============ 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; }
      }