/*
Theme Name: RR Audiocar Child
Template: minimog
Version: 1.0
*/

/* =========================================================
   FIX GLOBAL: NO SCROLL A LA DERECHA
   ========================================================= */
html, body{
  max-width: 100%;
  overflow-x: hidden !important;
}
body{ position: relative; }

img, svg, video, iframe{
  max-width: 100%;
  height: auto;
}

/* =========================================================
   VARIABLES
   ========================================================= */
:root{
  --ml-max: 1280px;
  --ml-border: #e5e7eb;
  --ml-text: rgba(75,85,99,.95);
  --ml-muted: rgba(107,114,128,.95);
  --ml-hover: #f5f5f5;

  --ml-logo-col: 240px;
  --ml-promo-col: 360px;

  /* RR colors */
  --rr-red-1: #d00000;
  --rr-red-2: #8f0000;
  --rr-red-3: rgba(143,0,0,0);
  --rr-blue: #3483fa; /* botones del drawer */
}

/* =========================================================
   HEADER BASE (Tailwind-like)
   ========================================================= */
.ml-header,
.ml-header *{
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.ml-header{
  background: #fff;
  border-bottom: 1px solid #f3f4f6;
  position: relative;
  z-index: 999999;
  overflow-x: clip;
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}

.ml-header .ml-container{
  max-width: var(--ml-max);
  margin: 0 auto;
  padding: 0 16px;
}

/* =========================================================
   TOP ROW (Desktop)
   ========================================================= */
.ml-top{
  background: #fff;
  border-bottom: 1px solid #f3f4f6;
  padding: 20px 0;
}

.ml-top-grid{
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 24px;
}

.ml-logo{
  display:flex;
  align-items:center;
}
.ml-logo a{
  display:flex;
  align-items:center;
  gap: 10px;
  text-decoration:none;
}
.ml-logo img{
  height: 42px;
  width:auto;
  display:block;
}

/* Search (Woo form) */
.ml-search{
  min-width: 420px;
}
.ml-search form{
  width: 100%;
  position: relative;
  margin: 0;
}
.ml-search input[type="search"],
.ml-search input[type="text"]{
  width: 100%;
  height: 44px;
  border-radius: 999px;
  border: 1px solid #e5e7eb;
  padding: 0 52px 0 16px;
  font-size: 14px;
  color: rgba(17,24,39,.95);
  background: #f9fafb;
  box-shadow: none !important;
  outline: none !important;
  transition: all .15s ease;
}
.ml-search input[type="search"]::placeholder,
.ml-search input[type="text"]::placeholder{
  color: rgba(156,163,175,.95);
}
.ml-search input[type="search"]:focus,
.ml-search input[type="text"]:focus{
  background: #fff;
  border-color: #E63946;
  box-shadow: 0 0 0 3px rgba(230,57,70,.18) !important;
}

.ml-search button[type="submit"],
.ml-search button,
.ml-search input[type="submit"]{
  position: absolute;
  right: 6px;
  top: 6px;
  bottom: 6px;
  width: 32px;
  border: 0 !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: rgba(107,114,128,.95) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
  padding: 0 !important;
}
.ml-search button[type="submit"]:hover,
.ml-search button:hover,
.ml-search input[type="submit"]:hover{
  background: #f3f4f6 !important;
}
.ml-search form:focus-within button[type="submit"],
.ml-search form:focus-within button{
  color: #E63946 !important;
}

/* Si el botón viene con texto, lo escondemos y lo reemplazamos por lupa */
.ml-search button[type="submit"],
.ml-search button{
  font-size: 0 !important;
}
.ml-search button[type="submit"]::before,
.ml-search button::before{
  content: "";
  width: 18px;
  height: 18px;
  background: url("assets/img/search-alt-1-svgrepo-com.svg") center/contain no-repeat;
  transform: translateY(-2px);
  opacity: .7;
}
.ml-search form:focus-within button[type="submit"]::before,
.ml-search form:focus-within button::before{
  opacity: 1;
  filter: none;
}

/* Actions */
.ml-actions{
  display:flex;
  align-items:center;
  gap: 8px;
  white-space: nowrap;
}

.ml-action-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 36px;
  padding: 0 12px;
  border-radius: 999px;
  color: rgba(75,85,99,.95) !important;
  font-size: 14px;
  font-weight: 600 !important;
  text-decoration: none;
  background: transparent !important;
  transition: background .15s ease, color .15s ease;
}
.ml-action-link:hover{
  color: #E63946 !important;
  background: rgba(230,57,70,.08) !important;
}

.ml-cart{
  position: relative;
  width: 40px;
  height: 40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius: 999px;
  color: rgba(75,85,99,.95) !important;
  text-decoration:none;
  background: transparent !important;
  transition: background .15s ease, color .15s ease;
}
.ml-cart:hover{
  color: #E63946 !important;
  background: rgba(230,57,70,.08) !important;
}
.ml-cart-ico{
  width: 22px;
  height: 22px;
  display:block;
}
.ml-cart-count{
  position: absolute;
  top: 4px;
  right: 4px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  background: #E63946;
  color:#fff !important;
  font-size: 11px;
  font-weight: 800 !important;
  border: 2px solid #fff;
}

/* =========================================================
   BOTTOM ROW (Desktop nav)
   ========================================================= */
.ml-bottom{
  background: #fff;
  border-bottom: 1px solid #f3f4f6;
}

.ml-bottom-grid{
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.ml-bottom-menus{
  height: 48px;
  display:flex;
  align-items:center;
  gap: 18px;
  min-width: 0;
}

.ml-links{ min-width: 0; }
.ml-links-menu{
  height: 48px;
  display:flex;
  align-items:center;
  gap: 18px;
  list-style:none;
  margin:0;
  padding:0;
  white-space: nowrap;
}

.ml-links-menu a{
  height: 48px !important;
  line-height: 48px !important;
  display:flex !important;
  align-items:center !important;
  font-size: 14px;
  font-weight: 600 !important;
  text-decoration: none;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  color: rgba(75,85,99,.95) !important;
  transition: color .15s ease;
}
.ml-links-menu a:hover{ color: #E63946 !important; }

.ml-links-menu a.is-offers{
  color: #E63946 !important;
  font-weight: 800 !important;
}

.ml-sep{
  width: 1px;
  height: 16px;
  background: #e5e7eb;
  display:inline-block;
}

.ml-ship{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800 !important;
  color: #10B981;
  background: rgba(16,185,129,.10);
  padding: 6px 10px;
  border-radius: 999px;
  white-space: nowrap;
}
.ml-ship-ico{ width: 14px; height: 14px; display:block; }

/* Anti hover negro theme */
.ml-header a:hover,
.ml-header a:focus,
.ml-header a:active,
.ml-header button:hover,
.ml-header button:focus,
.ml-header button:active{
  background-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

/* =========================================================
   CATEGORÍAS DESKTOP
   ========================================================= */
.ml-categories{
  height: 48px;
  display:flex;
  align-items:center;
}
.ml-categories-wrap{
  position: relative;
  height: 48px;
  display:flex;
  align-items:center;
  z-index: 1000000;
}
.ml-categories-btn{
  height: 48px !important;
  line-height: 48px !important;
  display:flex !important;
  align-items:center !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ml-text) !important;
  font-size: 14px !important;
  cursor: pointer;
}
.ml-categories-btn:hover{ text-decoration: underline; }
.ml-caret{ font-size: 12px; color: var(--ml-muted); }

.ml-categories-wrap:hover .ml-categories-dropdown,
.ml-categories-wrap.is-open .ml-categories-dropdown{
  display:block !important;
}

.ml-categories-wrap::before{
  content:"";
  position:absolute;
  left: -18px;
  top: 100%;
  width: 420px;
  height: 28px;
  background: transparent;
}

.ml-categories-dropdown{
  position:absolute;
  top: 100%;
  left: -18px;
  margin-top: 10px;
  width: 360px;
  background:#fff !important;
  border: 1px solid #e6e6e6;
  border-radius: 10px;
  box-shadow: 0 18px 46px rgba(0,0,0,.14);
  padding: 10px;
  display:none;
  z-index: 1000001;
}
.ml-cat-root,
.ml-cat-sub{
  list-style:none;
  margin:0 !important;
  padding:0 !important;
}
.ml-cat-root > li{ position: relative; }

.ml-cat-root > li > a,
.ml-cat-sub a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 10px 10px;
  border-radius: 8px;
  text-decoration:none;
  color: var(--ml-text) !important;
  font-size: 14px;
  line-height: 1.2;
}
.ml-cat-root > li > a:hover,
.ml-cat-sub a:hover{
  background: var(--ml-hover) !important;
}
.ml-cat-root > li.has-children > a::after{
  content: "›";
  font-size: 18px;
  opacity: .7;
}
.ml-cat-sub{
  position:absolute;
  top: -10px;
  left: 100%;
  margin-left: 10px;
  width: 360px;
  background:#fff !important;
  border: 1px solid #e6e6e6;
  border-radius: 10px;
  box-shadow: 0 18px 46px rgba(0,0,0,.14);
  padding: 10px;
  display:none;
  z-index: 1000002;
}
.ml-cat-root > li.has-children:hover > .ml-cat-sub{ display:block !important; }

.ml-cat-empty{
  display:block;
  padding: 10px;
  color: rgba(0,0,0,.55);
  font-size: 14px;
}

/* =========================================================
   ✅ FIX CRÍTICO: ELEMENTOS MOBILE OCULTOS EN DESKTOP
   (esto arregla tu captura)
   ========================================================= */
.ml-mobile,
.rr-mob-overlay,
.rr-mob-drawer{
  display: none !important;
}

/* =========================================================
   MOBILE (<= 980px) - RR estilo ML
   ========================================================= */
@media (max-width: 980px){

  /* ocultamos desktop */
  .ml-top,
  .ml-bottom{ display:none !important; }

  .ml-header{
    height: auto;
    border-bottom: 0;
  }

  .ml-top-grid,
  .ml-bottom-grid{
    left: 0;
  }

  /* activamos mobile */
  .ml-mobile{ display:block !important; }
  .rr-mob-overlay{ display:block !important; }
  .rr-mob-drawer{ display:block !important; }

  /* Barra superior ROJA con degradado hacia abajo */
  .ml-mobile-bar{
    height: 56px;
    display:flex;
    align-items:center;
    gap: 10px;
    padding: 10px 12px;

    background: linear-gradient(180deg, var(--rr-red-1) 0%, var(--rr-red-2) 70%, var(--rr-red-3) 100%);
    border-bottom: 1px solid rgba(0,0,0,.10);
  }

  .ml-mobile-logo img{
    height: 26px;
    width:auto;
    display:block;
    filter: none;
  }

  .ml-mobile-search{
    flex: 1 1 auto;
    min-width: 0;
  }

  /* input mobile: menos radius (y que el theme no lo cambie) */
  .ml-mobile-search-form{
    position: relative;
    margin: 0;
  }
  .ml-mobile-search-input{
    width: 100%;
    height: 36px;
    border-radius: 2px !important;     /* 👈 menos radius */
    border: 1px solid rgba(0,0,0,.12) !important;
    padding: 0 38px 0 12px;
    font-size: 14px;
    background: #fff !important;
    outline: none !important;
    box-shadow: none !important;
  }
  .ml-mobile-search-form::before{
    content:url("assets/img/search-alt-1-svgrepo-com.svg");
    position:absolute;
    right: 1px;
    top: 50%;
    transform: translateY(-46%);
    opacity: .6;
    pointer-events:none;
  }

  .ml-mobile-btn{
    width: 40px;
    height: 40px;
    border: 0 !important;
    background: transparent !important;
    font-size: 22px;
    line-height: 1;
    color: #111 !important;
  }

  .ml-mobile-cart{
    width: 44px;
    height: 40px;
    display:flex;
    align-items:center;
    justify-content:center;
    position: relative;
    text-decoration:none;
    color: #111 !important;
  }
  .ml-mob-cart-count{
    position:absolute;
    top: 2px;
    right: 4px;
    min-width: 16px;
    height: 16px;
    padding: 0 5px;
    border-radius: 999px;
    background:#ef4444;
    color:#fff;
    font-size: 11px;
    font-weight: 700;
    display:flex;
    align-items:center;
    justify-content:center;
  }

  /* lock scroll cuando abre el drawer */
  .rr-lock{ overflow:hidden; }

  /* overlay */
  .rr-mob-overlay{
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
    z-index: 999998;
  }
  .rr-mob-overlay.is-open{
    opacity: 1;
    pointer-events: auto;
  }

  /* drawer */
  .rr-mob-drawer{
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 86%;
    max-width: 360px;
    background: #fff;
    transform: translateX(-102%);
    transition: transform .22s ease;
    z-index: 999999;
    overflow-y: auto;
  }
  .rr-mob-drawer.is-open{ transform: translateX(0); }

  .rr-mob-drawer-top{
    padding: 14px;
    border-bottom: 1px solid var(--ml-border);
    background: #fff; /* el drawer en ML es blanco, no rojo */
  }

  .rr-mob-userbox{
    display:flex;
    gap: 10px;
    align-items:flex-start;
    margin-bottom: 12px;
  }
  .rr-mob-avatar{
    width: 44px;
    height: 44px;
    border-radius: 999px;
    background: #f3f4f6;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .rr-mob-title{
    font-size: 18px;
    font-weight: 700 !important;
    color: var(--ml-text);
    margin-bottom: 2px;
  }
  .rr-mob-sub{
    font-size: 13px;
    color: rgba(0,0,0,.65);
    line-height: 1.25;
  }

  .rr-mob-actions{
    display:flex;
    gap: 10px;
  }
  .rr-mob-btn{
    flex: 1 1 50%;
    height: 42px;
    border-radius: 8px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    font-size: 14px;
    font-weight: 600 !important;
  }
  .rr-mob-btn-primary{
    background: var(--rr-blue);
    color: #fff !important;
  }
  .rr-mob-btn-outline{
    border: 2px solid var(--rr-blue);
    color: var(--rr-blue) !important;
    background: #fff;
  }

  .rr-mob-nav{ padding: 8px 0; }

  .rr-mob-menu{
    list-style:none;
    margin:0;
    padding:0;
  }
  .rr-mob-menu li a{
    display:block;
    padding: 14px 14px;
    text-decoration:none;
    color: var(--ml-text);
    font-size: 15px;
    border-bottom: 1px solid #f1f1f1;
    background:#fff;
  }

  /* acordeón categorías */
  .rr-mob-section{
    border-bottom: 1px solid #f1f1f1;
    background:#fff;
  }
  .rr-mob-accordion{
    width: 100%;
    border: 0;
    background: #fff;
    padding: 14px 14px;
    font-size: 15px;
    display:flex;
    align-items:center;
    justify-content:space-between;
  }
  .rr-mob-acc-title{
    font-weight: 600 !important;
    color: var(--ml-text);
  }
  .rr-mob-acc-panel{
    display:none;
    padding: 6px 0 10px;
  }
  .rr-mob-acc-panel.is-open{ display:block; }

  .rr-mob-cat{ padding: 0 14px 10px; }
  .rr-mob-cat-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap: 10px;
  }
  .rr-mob-cat-next{
    width: 34px;
    height: 34px;
    border-radius: 999px;
    border: 1px solid #e5e7eb;
    background: #fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size: 18px;
    line-height: 1;
    color: rgba(17,24,39,.8);
  }
  .rr-mob-cat-next[aria-expanded="true"]{
    transform: rotate(90deg);
  }
  .rr-mob-cat-parent{
    display:block;
    padding: 10px 0;
    font-weight: 700 !important;
    text-decoration:none;
    color: var(--ml-text);
  }
  .rr-mob-cat-children{ padding-left: 10px; }
  .rr-mob-cat-child{
    display:block;
    padding: 8px 0;
    text-decoration:none;
    color: rgba(0,0,0,.75);
    border-left: 2px solid #f1f1f1;
    padding-left: 10px;
  }

  .rr-mob-empty{
    padding: 0 14px 14px;
    color: rgba(0,0,0,.6);
  }
}
/* =========================================================
   RR + Elementor: degradado que “se funde” con el slider
   (mobile)
   ========================================================= */

/* 1) Header mobile rojo + degradado (ya lo tenés, pero lo refuerzo) */
@media (max-width: 980px){
  .ml-mobile-bar{
    background: linear-gradient(
      180deg,
      #d00000 0%,
      #b00000 55%,
      rgba(176,0,0,0) 100%
    ) !important;
  }
}

/* 2) Overlay arriba del PRIMER SECTION (donde suele estar el slider) */
@media (max-width: 980px){

  /* cubre la mayoría de estructuras de Elementor */
  body .elementor-location-single .elementor-top-section:first-child,
  body .elementor-location-page .elementor-top-section:first-child,
  body .elementor .elementor-top-section:first-child,
  body .elementor-section-wrap > .elementor-top-section:first-child{
    position: relative;
    z-index: 0;
  }

  body .elementor-location-single .elementor-top-section:first-child::before,
  body .elementor-location-page .elementor-top-section:first-child::before,
  body .elementor .elementor-top-section:first-child::before,
  body .elementor-section-wrap > .elementor-top-section:first-child::before{
    content:"";
    position:absolute;
    left:0; right:0; top:0;
    height: 140px;              /* “bajada” del rojo (ajustable) */
    background: linear-gradient(
      180deg,
      rgba(208,0,0,.92) 0%,
      rgba(176,0,0,.55) 45%,
      rgba(176,0,0,0) 100%
    );
    pointer-events:none;
    z-index: 3;                 /* arriba del slider */
  }

  /* asegura que el slider quede “debajo” del overlay */
  body .elementor .swiper,
  body .elementor .elementor-swiper,
  body .elementor .swiper-wrapper,
  body .elementor .swiper-slide{
    position: relative;
    z-index: 1;
  }

  /* 3) Buscador mobile con menos redondeo (como pediste) */
  .ml-mobile-search-input{
    border-radius: 2px !important;
  }
}
/* =========================================================
   MOBILE LOOK PRO (RR + ML vibe) — limpia colores y aprovecha espacio
   ========================================================= */
@media (max-width: 980px){

  /* 1) Barra mobile más prolija */
  .ml-mobile-bar{
    height: 60px !important;
    padding: 10px 12px !important;
    gap: 10px !important;
    background-color: rgba(163,0,0,0) !important;

    

    border-color: transparent !important;
  }

  /* Logo más prolijo, sin “cuadradito” raro */
  .ml-mobile-logo img{
    height: 28px !important;
    width: auto !important;
    display: block !important;
    border-radius: 0 !important;
  }
  .ml-mobile-logo,
  .ml-mobile-logo a{
    display:flex !important;
    align-items:center !important;
  }

  /* 2) Buscador como ML (alto 38-40, radius leve, sombra sutil) */
  .ml-mobile-search-input{
    height: 38px !important;
    border-radius: 3px !important;
    border: 1px solid rgba(0,0,0,.10) !important;
    background: rgba(255,255,255,.96) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.10) !important;
    padding-left: 18px !important;
    padding-right: 25px !important;
    font-size: 14px !important;
  }
  .ml-mobile-search-form::before{
    right: 1px !important;
    opacity: .55 !important;
  }

  /* 3) Iconos (menu + carrito) alineados y con hit area */
  .ml-mobile-btn{
    width: 60px !important;
    height: 60px !important;
    border-radius: 10px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    color: rgba(0,0,0,.85) !important;
  
  }

  .ml-mobile-cart{
    width: 46px !important;
    height: 42px !important;
  }
  .ml-mob-cart-count{
    top: 4px !important;
    right: 6px !important;
  }

  /* 4) Degradado que baja al slider: más suave y real */
  /* Si usás rr-hero, esto es mejor que el :first-child */
  .rr-hero{ position: relative; }
  .rr-hero::before{
    content:"";
    position:absolute;
    left:0; right:0; top:0;

    /* bajada más elegante */
    height: 300px !important;

    /* suave, sin “banda” fea */
    background: linear-gradient(
      180deg,
      #c80000 0%,
      #c80000 45%,
      rgba(163,0,0,0) 100%
    )!important;

    pointer-events:none;
    z-index: 3;
  }

  /* 5) Le doy un “espacio” arriba al slider para que no quede pegado */
  .rr-hero .elementor-container,
  .rr-hero .elementor-widget-wrap{
    position: relative;
    z-index: 2;
  }

  /* 6) Fondo del body en mobile: blanco real (evita rarezas del theme) */
  body{
    background: #fff !important;
  }
}
/* =========================================================
   MOBILE FINAL OVERRIDE (ML-like): spacing + icons modernos + compactos
   Pegar AL FINAL del style.css
   ========================================================= */
@media (max-width: 980px){

  /* Barra roja con degradado (dejamos SOLO este look) */
  .ml-mobile-bar{
    height: 56px !important;
    padding: 10px 12px !important;
    gap: 12px !important; /* espacio general tipo ML */
    background-color: #c80000 !important;
    border-bottom: 0 !important;
    border-color: transparent !important;
  }

  /* Logo: más aire con el buscador */
  .ml-mobile-logo{
    margin-right: 6px !important; /* aire extra */
    flex: 0 0 auto !important;
  }
  .ml-mobile-logo img{
    height: 28px !important;
    width: auto !important;
    display:block !important;
  }

  /* Buscador: ocupa el espacio y queda bien ML */
  .ml-mobile-search{
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
  .ml-mobile-search-input{
    height: 32px !important;
        min-height: 20px !important;
        border-radius: 1px !important;
        border: none !important;
        background: rgba(255, 255, 255, .96) !important;
        box-shadow: none !important;
        padding: 0 40px 0 12px !important;
        font-size: 14px !important;
        width: 100% !important;
  }
  .ml-mobile-search-form::after{
    right: 1px !important;
    opacity: .55 !important;
  }

  /* ===== ICONOS (MENÚ + CARRITO) COMPACTOS Y VISIBLES ===== */

  /* Reducimos el “espacio inútil” que te quedó por width/height 60 */
  .ml-mobile-btn{
    width: 40px !important;
    height: 40px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    color: #fff !important; /* icono blanco sobre rojo */
    position: relative !important;
    padding: 0 !important;
  }

  /* HAMBURGER moderno (3 líneas) — pisa el ícono viejo */
  .ml-mobile-btn::before,
  .ml-mobile-btn::after{
    content:"";
    position:absolute;
    left: 11px;
    right: 11px;
    height: 2px;
    background: #fff;
    border-radius: 2px;
    opacity: .95;
  }
  .ml-mobile-btn::before{ top: 14px; }
  .ml-mobile-btn::after{ top: 26px; }

  /* línea del medio */
  .ml-mobile-btn span{
    position:absolute !important;
    left: 11px !important;
    right: 11px !important;
    top: 20px !important;
    height: 2px !important;
    background: #fff !important;
    border-radius: 2px !important;
    opacity: .95 !important;
    display:block !important;
    font-size: 0 !important;
    line-height: 0 !important;
  }

  /* Si tu botón no tiene <span>, igual lo dibujamos: */
  .ml-mobile-btn:not(:has(span)){
    color: transparent !important; /* escondemos el caracter ☰ si aparece */
  }

  /* Carrito: más visible y ML-like */
  .ml-mobile-cart{
    width: 42px !important;
    height: 40px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    color: #111 !important;
  }

  /* Badge más prolijo */
  .ml-mob-cart-count{
    top: 2px !important;
    right: 3px !important;
    min-width: 16px !important;
    height: 16px !important;
    font-size: 11px !important;
    padding: 0 5px !important;
  }

  /* Evita que el header “estire” a la derecha por algún ancho raro */
  .ml-mobile,
  .ml-mobile-bar{
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
}
/* =========================================================
   ICONOS MOBILE (usa tus SVGs) - NO toca colores ni tamaños
   Pegar al FINAL
   ========================================================= */
@media (max-width: 980px){

  /* 1) SEARCH: reemplaza tu emoji 🔎 por SVG */
  .ml-mobile-search-form::after{
    content: "" !important; /* pisa cualquier emoji anterior */
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
    opacity: .65;
    pointer-events: none;
    background: url("assets/img/search-alt-1-svgrepo-com.svg") no-repeat center / contain;
  }

  /* 2) BOTÓN MENÚ: que no dibuje “las 3 líneas” si las tenías */
  .ml-mobile-btn::before,
  .ml-mobile-btn::after{
    content: none !important;
  }
  .ml-mobile-btn span{
    display: none !important;
  }

  /* 3) SVGs dentro de botón y carrito */
  .ml-mobile-ico{
    width: 22px;
    height: 22px;
    display: block;
  }

  /* 4) Burger: un toque más grande para que se vea mejor */
  .ml-mobile-ico--burger{
    width: 24px;
    height: 24px;
  }

  /* 5) Cart: visible sobre rojo (si el svg viene negro, le aplico filtro leve) */
  .ml-mobile-ico--cart{
    width: 22px;
    height: 22px;
    filter: brightness(0) invert(1); /* queda blanco sobre tu top bar roja */
  }

  /* Por las dudas, el botón menú también blanco */
  .ml-mobile-ico--burger{
    filter: brightness(0) invert(1);
  }
}
@media (max-width: 980px){

  /* apagamos cualquier icono previo */
  .ml-mobile-search-form::before{ content: none !important; }
  .ml-mobile-search-form::after{ content: "" !important; }

  /* icono search prolijo */
  .ml-mobile-search-form{
    position: relative;
  }
  .ml-mobile-search-form::after{
    content: "" !important;
    position: absolute !important;
    right: 10px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 18px !important;
    height: 18px !important;
    opacity: .65 !important;
    pointer-events: none !important;
    background: url("assets/img/search-alt-1-svgrepo-com.svg") no-repeat center / contain !important;
  }

  /* por si tu input tiene width 105% y se mete debajo del icono */
  .ml-mobile-search-input{
    padding-right: 36px !important;
  }
}
@media (max-width: 980px){
  .ml-mobile-btn{
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
  }
  .ml-mobile-ico{
    display:block;
  }
}
@media (max-width: 980px){

  /* Apagamos tus implementaciones anteriores (content:url / after viejo) */
  .ml-mobile-search-form::before{ content: none !important; }
  .ml-mobile-search-form::after{
    content: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  /* Icono search limpio (sin caja) */
  .ml-mobile-search-form{
    position: relative !important;
  }
  .ml-mobile-search-form .rr-search-ico{ display:none; } /* por si existiera algo viejo */

  .ml-mobile-search-form::marker{ content: "" !important; } /* safe */

  .ml-mobile-search-form::after{
    content: "" !important;
    position: absolute !important;
    right: 10px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;

    width: 18px !important;
    height: 18px !important;

    background-color: transparent !important;
    background-image: url("assets/img/search-alt-1-svgrepo-com.svg") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;

    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;

    opacity: .75 !important;
    pointer-events: none !important;
    display: block !important;
  }

  /* Asegura que el input no se meta debajo del icono */
  .ml-mobile-search-input{
    padding-right: 36px !important;
  }
}
@media (max-width: 980px){
  .ml-mobile-search-form::after{
    background-image: none !important;
    -webkit-mask: url("assets/img/search-alt-1-svgrepo-com.svg") no-repeat center / contain !important;
    mask: url("assets/img/search-alt-1-svgrepo-com.svg") no-repeat center / contain !important;
    background-color: rgba(0,0,0,.65) !important; /* color del icono */
  }
}

@media (max-width: 980px){

  /* Menos espacio entre burger y carrito */
  .ml-mobile-bar{
    gap: 8px !important;              /* gap general (antes 12px) */
  }

  /* Los dos botones de la derecha bien pegados */
  .ml-mobile-btn{
    margin-left: 2px !important;      /* casi nada */
    margin-right: -4px !important;    /* los acerca más */
    width: 36px !important;           /* un poquito más compacto */
  }

  .ml-mobile-cart{
    margin-left: -6px !important;     /* lo “pega” al burger */
    width: 38px !important;           /* compacto */
  }

  /* Badge no se sale */
  .ml-mob-cart-count{
    right: 1px !important;
  }
}
@media (max-width: 980px){

  /* 1) Que el buscador NO se “coma” el click del burger */
  .ml-mobile-search{
    overflow: hidden !important;     /* clave: el overflow deja de capturar taps afuera */
    position: relative !important;
    z-index: 1 !important;
  }

  /* 2) Botones arriba del buscador (para que siempre reciban el tap) */
  .ml-mobile-btn,
  .ml-mobile-cart{
    position: relative !important;
    z-index: 5 !important;
  }

  /* 3) El iconito del search no debe bloquear taps */
  .ml-mobile-search-form::after,
  .ml-mobile-search-form::before{
    pointer-events: none !important;
  }
}
@media (max-width: 980px){
  /* menos espacio entre burger y carrito */
  .ml-mobile-btn{ margin-right: -6px !important; }
  .ml-mobile-cart{ margin-left: -6px !important; }
}
/* =========================================================
   FIX: EN DESKTOP NO DEBE EXISTIR NADA MOBILE
   (evita que se vea el header mobile por "debajo")
   Pegar AL FINAL
   ========================================================= */
@media (min-width: 981px){

  /* apaga TODO el sistema mobile */
  .ml-mobile,
  .ml-mobile-bar,
  .ml-mobile-logo,
  .ml-mobile-search,
  .ml-mobile-btn,
  .ml-mobile-cart,
  .rr-mob-overlay,
  .rr-mob-drawer{
    display: none !important;
  }

  /* por si quedó el input mobile con width raro */
  .ml-mobile-search-input{
    width: auto !important;
    padding-right: initial !important;
  }
}
/* =========================================================
   FIX: quitar línea entre header y hero + degradado más largo
   Pegar AL FINAL
   ========================================================= */
@media (max-width: 980px){

  /* 1) mata cualquier borde/sombra que haga esa “marca” */
  .ml-header,
  .ml-mobile-bar{
    border-bottom: 0 !important;
    box-shadow: none !important;
  }

  /* 2) elimina posibles líneas del primer section */
  body .elementor-top-section:first-child{
    border-top: 0 !important;
    margin-top: -1px !important; /* tapa el pixel que se ve como línea */
  }

  /* 3) degradado del hero más largo hacia abajo */
  .rr-hero::before,
  body .elementor-location-single .elementor-top-section:first-child::before,
  body .elementor-location-page .elementor-top-section:first-child::before,
  body .elementor .elementor-top-section:first-child::before,
  body .elementor-section-wrap > .elementor-top-section:first-child::before{
    top: -1px !important;        /* tapa el corte */
    height: 380px !important;    /* <-- MÁS LARGO (antes 300) */
  }
}
.ml-mobile-bar{
    height: 60px !important;
    padding: 10px 12px !important;
    gap: 10px !important;
    background-color: rgba(200,0,0,0.89) !important;

    box-shadow: none !important;

    border-bottom-color: transparent !important;
  }
  /* =========================================================
   HERO tipo MERCADO LIBRE + tarjetas superpuestas (DESKTOP + MOBILE)
   Usar clase en Elementor: rr-ml-hero
   y para contenedor tarjetas: rr-ml-cards
   ========================================================= */

/* Sección HERO */
.rr-ml-hero{
  position: relative;
  overflow: visible;
}

/* Difuminado inferior del banner (como ML) */
.rr-ml-hero::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height: 140px;
  pointer-events:none;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.65) 55%,
    rgba(255,255,255,1) 100%
  );
  z-index: 2;
}

/* Contenedor tarjetas: se monta arriba del banner */
.rr-ml-cards{
  position: relative;
  z-index: 5;
  max-width: 1200px;
  margin: -70px auto 0;     /* 👈 “sube” sobre el banner */
  padding: 0 16px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

/* Tarjeta */
.rr-ml-card{
  background:#fff;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 10px 22px rgba(0,0,0,.10);
  padding: 16px;
  min-height: 160px;
  display:flex;
  flex-direction: column;
  text-decoration:none;
  color: #111;
}

.rr-ml-card-title{
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px;
}

.rr-ml-card-body{
  margin-top: auto;
  display:flex;
  align-items:center;
  justify-content: center;
  gap: 10px;
}

.rr-ml-card-ico{
  width: 64px;
  height: 64px;
  border-radius: 999px;
  background: #f5f5f5;
  display:flex;
  align-items:center;
  justify-content:center;
}

.rr-ml-card-ico svg{
  width: 34px;
  height: 34px;
  opacity: .85;
}

.rr-ml-card-cta{
  margin-top: 10px;
  font-size: 13px;
  color: #3483fa;
  font-weight: 600;
}

/* Responsive */
@media (max-width: 1100px){
  .rr-ml-cards{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 680px){
  .rr-ml-cards{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: -50px;
  }
  .rr-ml-hero::after{ height: 120px; }
}
/* ===== Cards layout (ya tenías algo, esto lo ajusta tipo ML) ===== */
.rr-ml-cards--5{
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.rr-ml-card{
  background:#fff;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 8px 18px rgba(0,0,0,.10);
  padding: 16px;
  min-height: 170px;
  display:flex;
  flex-direction: column;
  gap: 10px;
  text-decoration:none !important;
  color: #111 !important;
}

.rr-ml-card-title{
  font-size: 16px;
  font-weight: 600;
  line-height: 1.2;
  margin: 0;
}

/* Icono al medio */
.rr-ml-card-body{
  flex: 1 1 auto;
  display:flex;
  align-items:center;
  justify-content:center;
}

.rr-ml-card-ico{
  width: 92px;
  height: 92px;
  border-radius: 999px;
  background: #f5f5f5;
  display:flex;
  align-items:center;
  justify-content:center;
}

.rr-ml-card-ico svg{
  width: 42px;
  height: 42px;
  opacity: .9;
}

/* ===== Botón estilo ML (pastilla celeste + texto azul) ===== */
.rr-ml-btn{
  align-self: flex-start;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 30px;
  padding: 0 12px;
  border-radius: 6px;
  background: rgba(52,131,250,.14);
  color: #3483fa !important;
  font-size: 13px;
  font-weight: 600;
  line-height: 30px;
  text-decoration:none !important;
  white-space: nowrap;
}

.rr-ml-card:hover .rr-ml-btn{
  background: rgba(52,131,250,.18);
}

/* ===== Visto recientemente (con mini ficha) ===== */
.rr-ml-card--recent{
  min-height: 170px;
}
.rr-ml-recent{
  display:flex;
  gap: 12px;
  align-items:center;
}
.rr-ml-recent-thumb{
  width: 64px;
  height: 64px;
  border-radius: 12px;
  background: #f5f5f5;
  flex: 0 0 auto;
  overflow:hidden;
}
.rr-ml-recent-thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display:block;
}
.rr-ml-recent-info{
  min-width: 0;
  display:flex;
  flex-direction: column;
  gap: 4px;
}
.rr-ml-recent-name{
  font-size: 14px;
  font-weight: 600;
  color: rgba(0,0,0,.88);
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
.rr-ml-recent-meta{
  font-size: 12px;
  color: rgba(0,0,0,.60);
  line-height: 1.2;
}

/* Responsive */
@media (max-width: 1100px){
  .rr-ml-cards--5{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 680px){
  .rr-ml-cards--5{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* ====== ML EXACT LOOK (cards + button + spacing) ====== */

.rr-ml-rail{
  max-width: 1180px;
  margin: -64px auto 0;              /* 👈 las “sube” y quedan sobre el banner */
  padding: 0 16px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
  position: relative;
  z-index: 50;
}

.rr-ml-card{
  background: #fff;
  border-radius: 6px;                 /* ML es más “recto” */
  box-shadow: 0 1px 2px rgba(0,0,0,.12);
  border: 1px solid rgba(0,0,0,.08);
  padding: 18px 18px 16px;
  min-height: 176px;
  display: flex;
  flex-direction: column;
  text-decoration: none !important;
  color: rgba(0,0,0,.9) !important;
}

.rr-ml-title{
  margin: 0 0 12px 0;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: 0;
}

/* icon “medios de pago” etc */
.rr-ml-iconWrap{
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 0 10px;
}

.rr-ml-iconCircle{
  width: 92px;
  height: 92px;
  border-radius: 999px;
  background: #f5f5f5;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rr-ml-iconCircle svg{
  width: 40px;
  height: 40px;
  color: rgba(0,0,0,.75);
}

/* CTA like ML */
.rr-ml-cta{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding: 0 14px;
  border-radius: 6px;
  background: rgba(65,137,230,.15);   /* celeste ML */
  color: #3483fa !important;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  white-space: nowrap;
  align-self: flex-start;             /* 👈 NO se centra */
  margin-top: 8px;
}
.rr-ml-card:hover .rr-ml-cta{
  background: rgba(65,137,230,.20);
}

/* ====== Visto recientemente ====== */
.rr-ml-card--recent .rr-ml-cta{ margin-top: auto; } /* deja aire y botón abajo como ML */

.rr-ml-recentRow{
  display: flex;
  gap: 12px;
  align-items: center;
  margin-top: 2px;
}

.rr-ml-thumb{
  width: 64px;
  height: 64px;
  border-radius: 6px;
  background: #f5f5f5;
  overflow: hidden;
  flex: 0 0 auto;
  border: 1px solid rgba(0,0,0,.06);
}
.rr-ml-thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.rr-ml-recentText{
  min-width: 0;
}
.rr-ml-recentName{
  font-size: 14px;
  font-weight: 600;
  margin: 0 0 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rr-ml-recentMeta{
  font-size: 13px;
  color: rgba(0,0,0,.6);
  line-height: 1.15;
}

/* ====== Responsive ====== */
@media (max-width: 1100px){
  .rr-ml-rail{ grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: -44px; }
}
@media (max-width: 680px){
  .rr-ml-rail{ grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: -34px; }
}
/* Hero ML fade */
.rr-ml-hero{
  position: relative;
  overflow: hidden;
}

.rr-ml-hero::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height: 160px;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.65) 55%,
    rgba(255,255,255,1) 100%
  );
  pointer-events:none;
  z-index: 5;
}
/* =========================================================
   RR – Cards estilo MercadoLibre (home)
   Shortcode: [rr_ml_info_cards]
   ========================================================= */
.rr-ml-cards-wrap{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 12px;
  position: relative;
  z-index: 20; /* arriba del banner */
}

/* “sobresalir” sobre el banner (ajustá si querés más/menos) */
.rr-ml-cards{
  margin-top: -92px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

.rr-ml-card{
  background: #fff;
  border-radius: 6px;
  box-shadow: 0 1px 2px #ebebeb;
  border: 1px solid #ebebeb;
  padding: 18px 18px 16px;
  display: flex;
  flex-direction: column;
  min-height: 240px;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
}

.rr-ml-card__title{
  font-size: 18px;
  font-weight: 600;
  color: rgba(0,0,0,.90);
  line-height: 1.2;
  margin-bottom: 10px;
}

.rr-ml-card__desc{
  font-size: 14px;
  color: rgba(0,0,0,.65);
  line-height: 1.35;
  margin-top: 10px;
  margin-bottom: 14px;
}

/* Icono circular ML */
.rr-ml-icon{
  position: relative;
  width: 92px;
  height: 92px;
  margin: 12px auto 6px;
}
.rr-ml-icon__circle{
  position:absolute;
  inset: 0;
  border-radius: 999px;
  background: #f5f5f5;
}
.rr-ml-icon__svg{
  position:absolute;
  inset: 0;
  display:flex;
  align-items:center;
  justify-content:center;
}
.rr-ml-icon__svg svg{
  width: 34px;
  height: 34px;
  fill: none;
  color: rgba(0,0,0,.72);
}
.rr-ml-icon__svg svg path{
  fill: rgba(0,0,0,.72);
}

/* Botón ML */
.rr-ml-btn{
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding: 0 14px;
  border-radius: 6px;
  background: rgba(65,137,230,.15);
  color: #3483fa;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none !important;
  white-space: nowrap;
}
.rr-ml-btn:hover{
  background: rgba(65,137,230,.22);
  color: #3483fa;
}

/* ===== Visto recientemente (producto estilo ML) ===== */
.rr-ml-card--last{ padding-top: 16px; }

.rr-ml-lastview{
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 12px;
  align-items: center;
  text-decoration: none !important;
  margin-top: 8px;
  margin-bottom: 14px;
}
.rr-ml-lastview__thumb{
  width: 64px;
  height: 64px;
  border-radius: 6px;
  border: 1px solid rgba(0,0,0,.08);
  overflow: hidden;
  background: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
}
.rr-ml-lastview__thumb img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display:block;
}
.rr-ml-lastview__name{
  font-size: 14px;
  font-weight: 600;
  color: rgba(0,0,0,.80);
  line-height: 1.25;

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rr-ml-lastview__price{
  margin-top: 6px;
  font-size: 20px;
  font-weight: 500;
  color: rgba(0,0,0,.90);
  line-height: 1.1;
}
.rr-ml-lastview__price del{
  font-size: 12px;
  color: rgba(0,0,0,.45);
  margin-right: 6px;
}
.rr-ml-lastview__price ins{
  text-decoration: none;
}

/* vacío */
.rr-ml-lastview-empty__title{
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 6px;
}
.rr-ml-lastview-empty__sub{
  font-size: 14px;
  color: rgba(0,0,0,.65);
  margin-bottom: 14px;
}

/* Responsive */
@media (max-width: 1200px){
  .rr-ml-cards{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 780px){
  .rr-ml-cards{ grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: -70px; }
}
@media (max-width: 480px){
  .rr-ml-cards{ grid-template-columns: 1fr; margin-top: -56px; }
}
/* ===== Visto recientemente: layout vertical (como ML) ===== */
.rr-ml-card--last .rr-ml-lastview{
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin-top: 6px !important;
  margin-bottom: 14px !important;
}

.rr-ml-card--last .rr-ml-lastview__thumb{
  width: 78px !important;
  height: 78px !important;
  border-radius: 6px !important;
}

.rr-ml-card--last .rr-ml-lastview__meta{
  width: 100% !important;
}

.rr-ml-card--last .rr-ml-lastview__name{
  font-size: 14px !important;
  font-weight: 600 !important;
  color: rgba(0,0,0,.82) !important;
  line-height: 1.25 !important;
}

.rr-ml-card--last .rr-ml-lastview__price{
  margin-top: 6px !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  color: rgba(0,0,0,.92) !important;
}
/* ===== Alinear contenido aunque el título tenga 1 o 2 líneas ===== */
.rr-ml-card__title{
  min-height: 46px !important; /* reserva espacio para 2 líneas */
  display: flex !important;
  align-items: flex-start !important;
  margin-bottom: 6px !important;
}
/* ===== Iconos: más grandes + rojo RR ===== */
.rr-ml-icon{
  width: 110px !important;
  height: 110px !important;
  margin: 10px auto 6px !important;
}

.rr-ml-icon__svg svg{
  width: 44px !important;
  height: 44px !important;
}

/* pinta el svg en rojo RR */
.rr-ml-icon__svg svg,
.rr-ml-icon__svg svg path{
  fill: rgba(200,0,0,1) !important;
  color: rgba(200,0,0,1) !important;
}
.rr-ml-card{ overflow: hidden !important; }
.rr-ml-btn{ width: 100% !important; }
/* =========================================================
   FINAL AJUSTES TARJETAS (ML-like)
   - Botón más chico (entra todo)
   - Visto recientemente: imagen más grande/centrada
   - Nombre + precio alineados a la misma altura que el texto de otras tarjetas
   ========================================================= */

/* 1) Botones abajo: tipografía y tamaño tipo ML */
.rr-ml-btn{
  font-size: 9px !important;
  line-height: 1 !important;
  padding: 10px 12px !important;
  border-radius: 6px !important;
  white-space: nowrap !important;
}

/* 2) Alinear todos los contenidos internos (misma altura) */
.rr-ml-card__body{
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

/* 3) Visto recientemente: bloque del producto alineado como el texto de otras tarjetas */
.rr-ml-card--last .rr-ml-lastview{
  /* ocupa el espacio y empuja el botón al fondo */
  flex: 1 1 auto !important;
  margin-top: 6px !important;

  /* centrado visual como ML */
  align-items: center !important;
  text-align: left !important;
}

/* Imagen más grande y centrada */
.rr-ml-card--last .rr-ml-lastview__thumb{
  width: 110px !important;
  height: 110px !important;
  border-radius: 10px !important;
  margin: 10px auto 8px !important;
  display: block !important;
  object-fit: contain !important;
}

/* Meta centrada pero con texto prolijo */
.rr-ml-card--last .rr-ml-lastview__meta{
  width: 100% !important;
}

/* Nombre y precio “bajan” para quedar a la misma altura que el texto de otras tarjetas */
.rr-ml-card--last .rr-ml-lastview__name{
  margin-top: 10px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: rgba(0,0,0,.82) !important;
  line-height: 1.25 !important;
}

.rr-ml-card--last .rr-ml-lastview__price{
  margin-top: 8px !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  color: rgba(0,0,0,.92) !important;
}
body{
  background-color: #ebebeb !Important;
}
.ml-carousel {
  padding: 30px;
  background-color: white !important;
  border-radius: 6px !Important;
}

.ml-title {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 15px;
}

.ml-swiper {
  position: relative;
}

.ml-card {
  background: #fff;
  border-radius: 6px;
  padding: 12px;
  text-decoration: none;
  color: #333;
  display: block;
  height: 100%;
  transition: box-shadow .2s ease;
}

.ml-card:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,.15);
}

.ml-img {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 180px;
}

.ml-img img {
  max-height: 100%;
  object-fit: contain;
}

.ml-info {
  margin-top: 10px;
}

.ml-name {
  font-size: 14px;
  line-height: 1.3;
  height: 38px;
  overflow: hidden;
}

.ml-price {
  font-size: 20px;
  font-weight: 700;
  margin-top: 6px;
}

.ml-arrow {
  width: 36px;
  height: 36px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 2px 6px rgba(0,0,0,.2);
}

.ml-arrow::after {
  font-size: 14px;
  color: #333;
}
.ml-carousel { margin: 30px 0; }

.ml-title{
  font-size: 20px;
  font-weight: 600;
  margin: 0 0 14px;
  color:#111;
}

.ml-card{
  background:#fff;
  border-radius: 6px;
  padding: 12px;
  text-decoration:none;
  color:#111;
  display:block;
  height:100%;
  border: 1px solid #eee;
  transition: box-shadow .2s ease, transform .2s ease;
}

.ml-card:hover{
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
  transform: translateY(-1px);
}

.ml-img{
  display:flex;
  justify-content:center;
  align-items:center;
  height: 190px;
  margin-bottom: 8px;
}

.ml-img img{
  max-height: 190px;
  width:auto;
  object-fit:contain;
}

.ml-name{
  font-size: 14px;
  line-height: 1.25;
  color:#333;
  margin: 6px 0 8px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
  min-height: 36px;
}

.ml-old-price{
  font-size: 12px;
  color:#999;
  text-decoration: line-through;
  margin-bottom: 2px;
}

.ml-price-row{
  display:flex;
  align-items: baseline;
  gap: 8px;
}

.ml-price{
  font-size: 22px;
  font-weight: 500; /* ML no es ultra bold */
  color:#111;
}

.ml-off{
  font-size: 14px;
  font-weight: 600;
  color:#00a650; /* verde ML */
}

.ml-benefit{
  margin-top: 6px;
  font-size: 13px;
  color:#00a650;
  font-weight: 600;
}

.ml-arrow{
  width: 36px;
  height: 36px;
  background:#fff;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
}

.ml-arrow::after{
  font-size: 14px;
  color:#333;
}
#ml-interes-wrap:not(:has(.ml-carousel)) {
  display: none !important;
}
.ml-card{
  background:#fff;
  border-radius: 8px;
  padding: 18px;              /* ⬅️ más aire interno */
  text-decoration:none;
  color:#111;
  display:block;
  height:100%;
  border: 1px solid #eee;
  transition: box-shadow .2s ease, transform .2s ease;
}

.ml-img{
  display:flex;
  justify-content:center;
  align-items:center;
  height: 200px;              /* ⬅️ un poco más alta */
  margin-bottom: 14px;        /* ⬅️ separa imagen del texto */
}

.ml-info{
  padding: 0 4px;             /* ⬅️ aire lateral tipo ML */
}

.ml-name{
  font-size: 14px;
  line-height: 1.25;
  color:#333;
  margin: 0 0 10px;           /* ⬅️ más separación */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
  min-height: 36px;
}

.ml-price-row{
  display:flex;
  align-items: baseline;
  gap: 10px;                  /* ⬅️ aire entre precio y OFF */
  margin-top: 2px;
}

.ml-benefit{
  margin-top: 10px;           /* ⬅️ que no quede pegado */
  font-size: 13px;
  color:#00a650;
  font-weight: 600;
}
/* BLOQUE PRINCIPAL (pedido: padding 30, white, radius 6) */
.ml-offers-block{
  background:#fff;
  border-radius:6px;
  padding:30px;
}

/* GRID 2 columnas */
.ml-offers-grid{
  display:grid;
  grid-template-columns: 360px 1fr;
  gap: 26px;
  align-items:start;
}

.ml-offer-head{
  margin-bottom: 14px;
}

.ml-offer-head-row{
  display:flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
}

.ml-h3{
  font-size: 20px;
  font-weight: 600;
  margin:0;
  color:#111;
}

.ml-offers-link{
  font-size: 14px;
  color:#3483fa; /* ML link */
  text-decoration:none;
  font-weight: 500;
}
.ml-offers-link:hover{ text-decoration: underline; }

/* Card grande (Oferta del día) */
.ml-card-big{
  padding: 20px;
}

.ml-img-big{
  height: 320px;
  margin-bottom: 16px;
}
.ml-img-big img{
  max-height: 320px;
}

.ml-name-big{
  font-size: 16px;
  min-height: auto;
  -webkit-line-clamp: 3;
}

.ml-price-big{
  font-size: 34px;
  font-weight: 500;
}

/* Responsive */
@media (max-width: 980px){
  .ml-offers-grid{
    grid-template-columns: 1fr;
  }
  .ml-img-big{
    height: 240px;
  }
  .ml-img-big img{
    max-height: 240px;
  }
}
/* ===== BLOQUE PRINCIPAL: que nada se salga ===== */
.ml-offers-block{
  background:#fff;
  border-radius:6px;
  padding:30px;
  overflow: hidden;              /* CLAVE: corta desbordes */
}

/* grid bien contenido */
.ml-offers-grid{
  display:grid;
  grid-template-columns: 360px 1fr;
  gap: 0;                         /* ML NO usa gap acá, usa separador */
  align-items:start;
}

/* ===== columna izquierda ===== */
.ml-offer-day{
  padding-right: 26px;            /* aire antes del separador */
}

/* ===== columna derecha + separador tipo ML ===== */
.ml-offers-right{
  padding-left: 26px;             /* aire después del separador */
  border-left: 1px solid #eee;    /* separador vertical tipo ML */
  min-width: 0;                   /* CLAVE: permite que Swiper no desborde */
}

/* headings */
.ml-offer-head-row{
  display:flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

/* ===== Swiper: que no empuje el contenedor ===== */
.ml-swiper-offers{
  width: 100%;
  overflow: hidden;               /* CLAVE */
}

.ml-swiper-offers .swiper-wrapper{
  align-items: stretch;
}

.ml-swiper-offers .swiper-slide{
  height: auto;
  min-width: 0;                   /* CLAVE */
}

/* flechas: que no se vayan afuera */
.ml-offers-block .ml-arrow{
  top: 45%;
}

.ml-offers-block .swiper-button-prev{
  left: 6px;
}

.ml-offers-block .swiper-button-next{
  right: 6px;
}

/* ===== Card: que respire y NO se salga ===== */
.ml-card{
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
}

/* ===== BIG card izquierda: limitar imagen para que no “rompa” ===== */
.ml-img-big{
  height: 300px;
  overflow: hidden;
}

.ml-img-big img{
  max-height: 300px;
  width: auto;
  object-fit: contain;
}

/* ===== Responsive ===== */
@media (max-width: 980px){
  .ml-offers-grid{
    grid-template-columns: 1fr;
  }

  .ml-offer-day{
    padding-right: 0;
    padding-bottom: 22px;
    border-bottom: 1px solid #eee;  /* separador horizontal en mobile */
    margin-bottom: 22px;
  }

  .ml-offers-right{
    padding-left: 0;
    border-left: 0;
  }
}
/* Precio tachado (más chico, NO negrita) */
.ml-old-price{
  font-size: 12px;
  font-weight: 400;          /* no bold */
  color: #999;
  text-decoration: line-through;
  margin-bottom: 4px;
}

/* Precio final */
.ml-price{
  font-size: 22px;
  font-weight: 500;          /* ML style */
  color: #111;
  line-height: 1.1;
  margin-bottom: 4px;
}

/* % OFF debajo del precio */
.ml-off{
  font-size: 14px;
  font-weight: 600;
  color: #00a650;            /* verde ML */
  margin-bottom: 6px;
}

/* Envío gratis */
.ml-benefit{
  font-size: 13px;
  color: #00a650;
  font-weight: 600;
  margin-top: 0;
}
.ml-card-big .ml-price{
  font-size: 34px;
}

.ml-card-big .ml-old-price{
  font-size: 13px;
}

.ml-card-big .ml-off{
  font-size: 15px;
}
/* ===== Categorías ML ===== */
.ml-cats-block{
  background:#fff;
  border-radius:6px;
  padding:30px;
}

.ml-cats-head{
  display:flex;
  align-items: baseline;
  justify-content: flex-start;
  gap: 16px;
  margin-bottom: 18px;
}

.ml-cats-link{
  font-size:14px;
  color:#3483fa;
  text-decoration:none;
  font-weight:500;
}
.ml-cats-link:hover{ text-decoration: underline; }

/* grid similar a ML */
.ml-cats-grid{
  display:grid;
  grid-template-columns: repeat(var(--ml-cats-cols, 4), minmax(0, 1fr));
  gap: 18px 18px;
}

/* tarjetita */
.ml-cat-card{
  display:flex;
  align-items:center;
  gap: 16px;
  background:#fff;
  border: 1px solid #eee;
  border-radius: 8px;
  padding: 16px 18px;
  text-decoration:none;
  color:#111;
  transition: box-shadow .2s ease, transform .2s ease;
  min-width: 0;
}

.ml-cat-card:hover{
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
  transform: translateY(-1px);
}

/* thumb izquierdo tipo ML */
.ml-cat-thumb{
  width: 70px;
  height: 70px;
  border-radius: 8px;
  background: #f6f6f6;
  display:flex;
  align-items:center;
  justify-content:center;
  flex: 0 0 70px;
}

/* placeholder: luego lo reemplazás por img */
.ml-cat-ph{
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: #e9e9e9;
  display:block;
}

.ml-cat-name{
  font-size: 16px;
  font-weight: 600;
  color:#222;
  line-height: 1.2;
  overflow:hidden;
  text-overflow: ellipsis;
}

/* responsive */
@media (max-width: 1100px){
  .ml-cats-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 820px){
  .ml-cats-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ml-cats-block{ padding: 22px; }
}
@media (max-width: 480px){
  .ml-cats-grid{ grid-template-columns: 1fr; }
}
/* grid fijo 4 x 3 como ML */
.ml-cats-grid-4x3{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: repeat(3, auto);
  gap: 18px;
}

/* evitar que Swiper estire cosas */
.ml-cats-swiper{
  overflow:hidden;
}

/* responsive */
@media (max-width: 1100px){
  .ml-cats-grid-4x3{
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: auto;
  }
}
@media (max-width: 820px){
  .ml-cats-grid-4x3{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 480px){
  .ml-cats-grid-4x3{
    grid-template-columns: 1fr;
  }
}
.ml-cat-name{
  font-size: 11px !Important;
}
.ml-offers-block .ml-old-price,
.ml-offers-block .ml-old-price *{
  font-size: 7px !important;
  color: #9e9e9e !important;
  font-weight: 400 !important;
  line-height: 1.1 !important;
}
.ml-block{
  background:#fff;
  border-radius:6px;
  padding:30px;
}

.ml-block-head{
  display:flex;
  align-items:baseline;
  gap:14px;
  margin-bottom:18px;
}

.ml-block-link{
  color:#3483fa;
  font-size:14px;
  font-weight:500;
  text-decoration:none;
}
.ml-block-link:hover{ text-decoration: underline; }

/* puntitos arriba derecha (opcional visual) */
.ml-dots{
  margin-left:auto;
  width:38px;
  height:10px;
  position:relative;
  opacity:.4;
}
/* =========================
   ML HERO
   ========================= */
.ml-hero{
  width:100%;
  min-height:420px;
  border-radius:12px;
  overflow:hidden;
  background-size:cover;
  background-position:center;
  position:relative;
}

.ml-hero__inner{
  max-width:1200px;
  margin:0 auto;
  padding:40px 24px;
  min-height:420px;
  display:flex;
  align-items:center;
}

.ml-hero__inner--right{ justify-content:flex-end; }
.ml-hero__inner--left{ justify-content:flex-start; }

.ml-hero__card{
  width:min(560px, 100%);
  background:#fff;
  border-radius:12px;
  padding:34px 34px;
  box-shadow:0 10px 30px rgba(0,0,0,.18);
}

.ml-hero__title{
  font-size:42px;
  line-height:1.05;
  margin:0 0 14px 0;
  font-weight:800;
  color:#111;
  letter-spacing:-.02em;
}

.ml-hero__text{
  margin:0 0 26px 0;
  font-size:18px;
  line-height:1.55;
  color:#5a5a5a;
  font-weight:600;
}

.ml-hero__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:14px 18px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.18);
  background:#fff;
  color:#111;
  font-weight:700;
  text-decoration:none;
  transition: transform .15s ease, box-shadow .15s ease;
}

.ml-hero__btn:hover{
  transform: translateY(-1px);
  box-shadow:0 10px 18px rgba(0,0,0,.12);
}

.ml-hero__btn-ico{
  width:28px;
  height:28px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#f5f5f5;
  color:#111;
  font-weight:900;
}

/* Responsive */
@media (max-width: 900px){
  .ml-hero{ min-height: auto; border-radius:10px; }
  .ml-hero__inner{ min-height:auto; padding:26px 16px; }
  .ml-hero__card{ padding:22px 18px; }
  .ml-hero__title{ font-size:30px; }
  .ml-hero__text{ font-size:15px; }
}
.ml-hero__btn{
  background:#3483FA;
  color:#fff;
  border-color:#3483FA;
}
.ml-hero__btn:hover{
  background:#2968c8;
}
/* =========================================================
   TIPOGRAFÍA MERCADO LIBRE (Proxima Nova) + BASE 14px
   ========================================================= */

/* 1) Proxima Nova como ML (woff2 oficiales de mlstatic) */
@font-face{
  font-family:'Proxima Nova';
  font-weight:300;
  font-display:swap;
  font-style:normal;
  src:url(https://http2.mlstatic.com/ui/webfonts/v3.0.0/proxima-nova/proximanova-light.woff2) format("woff2"),
      url(https://http2.mlstatic.com/ui/webfonts/v3.0.0/proxima-nova/proximanova-light.woff) format("woff");
}
@font-face{
  font-family:'Proxima Nova';
  font-weight:400;
  font-display:swap;
  font-style:normal;
  src:url(https://http2.mlstatic.com/ui/webfonts/v3.0.0/proxima-nova/proximanova-regular.woff2) format("woff2"),
      url(https://http2.mlstatic.com/ui/webfonts/v3.0.0/proxima-nova/proximanova-regular.woff) format("woff");
}
@font-face{
  font-family:'Proxima Nova';
  font-weight:600;
  font-display:swap;
  font-style:normal;
  src:url(https://http2.mlstatic.com/ui/webfonts/v3.0.0/proxima-nova/proximanova-semibold.woff2) format("woff2"),
      url(https://http2.mlstatic.com/ui/webfonts/v3.0.0/proxima-nova/proximanova-semibold.woff) format("woff");
}

/* 2) Stack ML */
:root{
  --ml-font: "Proxima Nova",-apple-system,"Helvetica Neue",Helvetica,"Roboto",Arial,sans-serif;
}

/* 3) Aplicación GLOBAL (sitio completo, incluido header ML que armamos) */
html, body{
  font-family: var(--ml-font) !important;
  font-size: 14px;              /* base ML (mucho texto en ML es 14px) */
  line-height: 1.2;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body, button, input, select, textarea{
  font-family: var(--ml-font) !important;
}

/* 4) Normalizo weights */
strong, b{ font-weight: 600; }
h1,h2,h3,h4,h5,h6{ font-weight: 600; }

/* 5) Tus componentes header (antes estaban forzando system font) */
.ml-header,
.ml-header *{
  font-family: var(--ml-font) !important;
}
/* =========================================================
   MOBILE FEEL MERCADO LIBRE (global)
   NO TOCA tu header rojo degradado
   ========================================================= */
@media (max-width: 980px){

  /* Fondo ML */
  body{
    background: #ebebeb !important;
  }

  /* Contenedores: padding lateral tipo ML */
  .site, #page, .page-content, .site-content,
  .elementor-section .elementor-container,
  .elementor-container,
  .container, .boxed, .content-wrap{
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* Secciones: menos aire (ML es compacto) */
  .elementor-section{
    margin-bottom: 12px !important;
  }
  .elementor-widget{
    margin-bottom: 12px !important;
  }

  /* Cards “ML”: blanco + borde + radio */
  .rr-ml-card,
  .elementor-widget-container,
  .woocommerce ul.products li.product,
  .woocommerce div.product,
  .minimog-product,
  .product,
  .tm-swiper .swiper-slide{
    border-radius: 8px !important;
  }

  /* Si el widget-container te afecta cosas que no querés, lo afinamos después.
     Por ahora lo dejo “soft” */
  .elementor-widget-container{
    background: transparent;
  }

  /* Cualquier bloque marcado como card */
  .rr-ml-card{
    background: #fff !important;
    border: 1px solid rgba(0,0,0,.08) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.06) !important;
  }

  /* Botones: look ML (azul) */
  .elementor-button,
  .woocommerce a.button,
  .woocommerce button.button,
  .woocommerce input.button{
    font-family: var(--ml-font) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
  }

  /* Texto: compactación */
  p, li, a, span, div{
    font-size: 14px;
  }

  /* Títulos: ML usa títulos no gigantes */
  h1{ font-size: 22px !important; line-height: 1.15 !important; }
  h2{ font-size: 18px !important; line-height: 1.2 !important; }
  h3{ font-size: 16px !important; line-height: 1.25 !important; }

  /* Inputs/search: ML feel */
  input[type="text"], input[type="search"], input[type="tel"], input[type="email"], select, textarea{
    font-family: var(--ml-font) !important;
    font-size: 14px !important;
    border-radius: 6px !important;
  }
}
/* =========================================================
   FIX MOBILE estilo Mercado Libre (RR)
   ========================================================= */
@media (max-width: 980px){

  /* (1) NO quiero el difuminado blanco arriba del hero en mobile */
  .rr-ml-hero::after{
    display:none !important;
  }

  /* (1) Cards debajo del banner: 3 visibles + scroll horizontal */
  .rr-ml-cards-wrap{
    margin-top: -18px !important; /* que “pise” un poco el hero como ML */
    padding: 0 12px !important;
  }

  .rr-ml-cards{
    display:flex !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    padding-bottom: 6px;
  }

  .rr-ml-cards::-webkit-scrollbar{ display:none; }

  .rr-ml-card{
    flex: 0 0 calc((100% - 24px) / 3) !important; /* 3 por pantalla */
    min-height: 150px !important;
    padding: 14px !important;
    scroll-snap-align: start;
  }

  /* (5) Burbujas (circulitos) como ML */
  .ml-bubbles{
    padding: 10px 12px 0 !important;
    margin-top: -6px !important;
  }

  .ml-bubbles .swiper{
    overflow: visible;
  }

  .ml-bubble{
    display:flex;
    flex-direction: column;
    align-items:center;
    gap: 8px;
    text-decoration:none !important;
    color:#333;
  }

  .ml-bubble__circle{
    width: 56px;
    height: 56px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid rgba(0,0,0,.08);
    box-shadow: 0 1px 2px rgba(0,0,0,.06);
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .ml-bubble__icon{
    width: 22px;
    height: 22px;
    border-radius: 6px;
    background: rgba(200,0,0,.12);
  }

  .ml-bubble__label{
    font-size: 12px;
    line-height: 1.1;
    font-weight: 400;
  }

  /* (2) Ofertas: más aire, no “apretado” */
  .ml-offers-block{
    padding: 0 12px !important;
  }

  .ml-offer-day,
  .ml-offers-right{
    padding: 0 !important;
  }

  .ml-offers-right .swiper{
    padding: 0 2px 6px;
  }

  /* (4) Inspirado / carrusel interés: menos padding y mejor aire */
  .ml-carousel{
    padding: 0 12px !important;
  }

  .ml-carousel .ml-title{
    margin-bottom: 10px !important;
  }

  .ml-carousel .swiper{
    padding: 0 2px 6px;
  }

  /* (3) Categorías: 1 columna x 3 filas por slide */
  .ml-cats-block{
    padding: 0 12px !important;
  }

  .ml-cats-grid-4x3{
    display:grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .ml-cat-card{
    display:flex !important;
    align-items:center !important;
    gap: 14px !important;
    padding: 14px !important;
    border-radius: 12px !important;
  }

  .ml-cat-thumb{
    width: 54px !important;
    height: 54px !important;
    border-radius: 12px !important;
  }

  /* Flechas: que no tapen contenido en mobile */
  .ml-arrow{
    width: 36px !important;
    height: 36px !important;
  }
}
/* ================================
   OFERTAS (FIX desktop + mobile)
   ================================ */

/* Contenedor general de ofertas */
.ml-offers-block{
  max-width: 1180px;
  margin: 0 auto 22px;
  padding: 0 14px;
}

/* Desktop: 2 columnas */
.ml-offers-grid{
  display: grid;
  grid-template-columns: 1.15fr 1.85fr;
  gap: 18px;
  align-items: start;
}

/* Mobile: apilado */
@media (max-width: 767px){
  .ml-offers-grid{
    grid-template-columns: 1fr;
    gap: 14px;
  }
}

/* Tarjeta grande "Oferta del día" (desktop) */
.ml-card.ml-card-big{
  display: grid;
  grid-template-columns: 46% 54%;
  gap: 14px;
  align-items: center;
  padding: 18px;
}

/* Ajuste de imagen en oferta del día */
.ml-img.ml-img-big{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height: 220px;
}
.ml-img.ml-img-big img{
  max-height: 260px;
  width: auto;
  object-fit: contain;
}

/* En mobile, la big card se vuelve vertical */
@media (max-width: 767px){
  .ml-card.ml-card-big{
    grid-template-columns: 1fr;
    padding: 16px;
  }
  .ml-img.ml-img-big{
    min-height: 200px;
  }
  .ml-img.ml-img-big img{
    max-height: 240px;
  }
}

/* Head de "Ofertas" no apretado */
.ml-offer-head-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 10px;
}

/* Carrusel de ofertas: aire */
.ml-swiper-offers{
  padding: 2px;
}
.ml-swiper-offers .swiper-slide{
  height: auto;
}
.ml-swiper-offers .ml-card{
  padding: 14px;
}

/* En mobile, más aire vertical */
@media (max-width: 767px){
  .ml-swiper-offers .ml-card{
    padding: 12px;
  }
}

/* Precios viejos: mantené tu regla micro (si ya la tenías) */
.ml-old-price{
  font-size: 7px;
  color: #8a8a8a;
  font-weight: 400;
}
/* Sidebar izquierda en archivos WooCommerce */
.woocommerce.archive .site-content .content-area,
.woocommerce-page.archive .site-content .content-area {
  order: 2;
}

.woocommerce.archive .site-content .widget-area,
.woocommerce-page.archive .site-content .widget-area {
  order: 1;
}

/* Layout flex si tu tema no lo aplica */
.woocommerce.archive .site-content .content-container,
.woocommerce-page.archive .site-content .content-container,
.woocommerce.archive .site-content .container,
.woocommerce-page.archive .site-content .container {
  display: flex;
  gap: 24px;
}
/* ===========================
   RR - Filter bar (mobile)
   =========================== */
.rr-ml-filterbar{
  display:none;
  width:100%;
  max-width: 1200px;
  margin: 12px auto 0;
  padding: 0 14px;
}

.rr-ml-filterbtn{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.12);
  background:#fff;
  font-weight:600;
  font-size:14px;
}

.rr-ml-filterbtn__icon{
  font-size: 16px;
  line-height: 1;
  opacity: .8;
}

@media (max-width: 768px){
  .rr-ml-filterbar{ display:block; }
}

/* ===========================
   RR - Drawer + overlay
   =========================== */
.rr-ml-filter-overlay{
  position:fixed;
  inset:0;
  background: rgba(0,0,0,.45);
  opacity:0;
  pointer-events:none;
  transition: opacity .2s ease;
  z-index: 99998;
}

.rr-ml-filter-overlay.is-open{
  opacity:1;
  pointer-events:auto;
}

.rr-ml-filter-drawer{
  position:fixed;
  top:0;
  right:0;
  width: 88vw;
  max-width: 380px;
  height: 100dvh;
  background:#fff;
  transform: translateX(100%);
  transition: transform .22s ease;
  z-index: 99999;
  display:flex;
  flex-direction:column;
  border-left: 1px solid rgba(0,0,0,.08);
}

.rr-ml-filter-drawer.is-open{
  transform: translateX(0);
}

.rr-ml-filter-drawer__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 14px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}

.rr-ml-filter-drawer__title{
  font-size: 16px;
  font-weight: 700;
}

.rr-ml-filter-drawer__close{
  background:transparent;
  border:0;
  font-size: 18px;
  padding: 6px 8px;
  cursor:pointer;
}

.rr-ml-filter-drawer__body{
  padding: 10px 14px 14px;
  overflow:auto;
  -webkit-overflow-scrolling: touch;
}

.rr-ml-filter-drawer__foot{
  padding: 12px 14px;
  border-top: 1px solid rgba(0,0,0,.08);
}

.rr-ml-filter-apply{
  width:100%;
  padding: 12px 14px;
  border-radius: 10px;
  border: 0;
  background: #3483fa;
  color:#fff;
  font-weight: 700;
  font-size: 14px;
}

/* lock scroll */
.rr-ml-lock{
  overflow:hidden !important;
}

/* ===========================
   RR - Contenido de filtros (widgets)
   =========================== */
.rr-ml-filters__block{
  margin-bottom: 14px;
}

.rr-ml-filters__title{
  font-weight: 800;
  font-size: 14px;
  margin-bottom: 8px;
}

.rr-ml-filters .widget{
  margin: 0;
  padding: 12px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  background: #fff;
}

.rr-ml-filters .widget-title{
  font-size: 13px;
  font-weight: 700;
  margin: 0 0 10px;
}

.rr-ml-filters__hint{
  font-size: 12px;
  opacity: .7;
  margin-top: 10px;
}
/* =========================================================
   RR - Layout Shop/Categorías: sidebar izquierda + productos
   ========================================================= */
.rr-archive-layout{
  max-width: 1200px;
  margin: 0 auto;
  padding: 16px 12px;
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 16px;
}

.rr-archive-filters{
  position: sticky;
  top: 110px; /* ajustá si tu header sticky tapa */
  align-self: start;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 12px;
}

/* widgets de Woo dentro del panel */
.rr-ml-filters__title{
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 10px;
}
.rr-ml-filters .widget{
  margin: 0 0 14px;
}
.rr-ml-filters .widget-title{
  font-size: 13px;
  font-weight: 700;
  margin: 0 0 8px;
}

/* =========================================================
   RR - Grid productos más estético tipo ML
   (aplica en shop y categorías)
   ========================================================= */
.rr-archive-products ul.products{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px !important;
}

.rr-archive-products ul.products li.product{
  margin: 0 !important;
}

.rr-archive-products ul.products li.product .woocommerce-loop-product__link{
  display: block;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 10px;
  overflow: hidden;
  transition: transform .15s ease, box-shadow .15s ease;
}

.rr-archive-products ul.products li.product .woocommerce-loop-product__link:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
}

.rr-archive-products ul.products li.product img{
  width: 100%;
  height: 190px;
  object-fit: contain;
  background: #fff;
  padding: 10px;
}

.rr-archive-products ul.products li.product .woocommerce-loop-product__title{
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  margin: 10px 10px 6px !important;
  min-height: 34px;
}

.rr-archive-products ul.products li.product .price{
  margin: 0 10px 12px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
}

/* si querés old price chiquito (tu pedido anterior) */
.rr-archive-products ul.products li.product .price del{
  font-size: 11px !important;
  color: #9a9a9a !important;
  font-weight: 400 !important;
}

/* =========================================================
   Mobile: sin sidebar, 2 columnas + drawer
   ========================================================= */
.rr-only-desktop{ display: block; }
.rr-only-mobile{ display: none; }

@media (max-width: 991px){
  .rr-archive-layout{
    grid-template-columns: 1fr;
  }
  .rr-only-desktop{ display: none; }
  .rr-only-mobile{ display: block; }

  .rr-archive-products ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px !important;
  }
  .rr-archive-products ul.products li.product img{
    height: 160px;
  }
}

/* =========================================================
   Drawer Filtros mobile (ML)
   ========================================================= */
.rr-ml-filterbar{
  margin: 0 0 10px;
  display: flex;
  justify-content: flex-start;
}

.rr-ml-filterbtn{
  border: 1px solid #e5e5e5;
  background: #fff;
  border-radius: 10px;
  padding: 10px 12px;
  font-weight: 700;
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.rr-ml-filter-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
  z-index: 9998;
}
.rr-ml-filter-overlay.is-open{
  opacity: 1;
  pointer-events: auto;
}

.rr-ml-filter-drawer{
  position: fixed;
  right: 0;
  top: 0;
  height: 100%;
  width: min(420px, 92vw);
  background: #fff;
  transform: translateX(105%);
  transition: transform .22s ease;
  z-index: 9999;
  display: flex;
  flex-direction: column;
}

.rr-ml-filter-drawer.is-open{
  transform: translateX(0);
}

.rr-ml-filter-drawer__head{
  padding: 14px 14px;
  border-bottom: 1px solid #eee;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.rr-ml-filter-drawer__title{
  font-size: 14px;
  font-weight: 800;
}

.rr-ml-filter-drawer__close{
  border: 0;
  background: transparent;
  font-size: 18px;
  cursor: pointer;
}

.rr-ml-filter-drawer__body{
  padding: 12px 14px;
  overflow: auto;
  flex: 1;
}

.rr-ml-filter-drawer__foot{
  padding: 12px 14px;
  border-top: 1px solid #eee;
}

.rr-ml-filter-apply{
  width: 100%;
  border: 0;
  background: rgba(200,0,0,1);
  color: #fff;
  border-radius: 10px;
  padding: 12px;
  font-weight: 800;
  cursor: pointer;
}

.rr-ml-lock{
  overflow: hidden !important;
}
/* =========================================================
   RR / Shop & Category (ML look)
   - contenedor NO full width
   - sidebar izquierda
   - cards productos estilo ML (como tus carruseles)
   ========================================================= */

/* 1) Contenedor centrado (mata el full width) */
.rr-archive-wrap{
  max-width: 1200px;     /* ML aprox */
  margin: 0 auto;
  padding: 18px 12px;
}

/* 2) Layout 2 columnas */
.rr-archive-layout{
  display: grid;
  grid-template-columns: 290px 1fr;
  gap: 16px;
}

/* Sidebar filtros */
.rr-archive-filters{
  position: sticky;
  top: 110px;
  align-self: start;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 12px;
  padding: 12px;
}

/* Titulares de widgets */
.rr-ml-filters__title{
  font-size: 14px;
  font-weight: 800;
  margin: 0 0 10px;
}
.rr-ml-filters .widget{
  margin: 0 0 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid #f0f0f0;
}
.rr-ml-filters .widget:last-child{
  border-bottom: 0;
  padding-bottom: 0;
}
.rr-ml-filters .widget-title{
  font-size: 13px;
  font-weight: 800;
  margin: 0 0 8px;
}

/* =========================================================
   3) GRID productos estilo ML (NO full width, 3 columnas)
   ========================================================= */
.rr-archive-products ul.products{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px !important;
  margin: 0 !important;
}

/* Cada item sin márgenes raros del theme */
.rr-archive-products ul.products li.product{
  margin: 0 !important;
  width: auto !important;
}

/* Card */
.rr-archive-products ul.products li.product .woocommerce-loop-product__link{
  display: block;
  background: #fff;
  border: 1px solid #e9e9e9;
  border-radius: 12px;
  overflow: hidden;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.rr-archive-products ul.products li.product .woocommerce-loop-product__link:hover{
  transform: translateY(-2px);
  border-color: #e2e2e2;
  box-shadow: 0 10px 22px rgba(0,0,0,.08);
}

/* Imagen tipo ML (centrada, contenida, no gigante) */
.rr-archive-products ul.products li.product img{
  width: 100%;
  height: 210px;
  object-fit: contain;
  background: #fff;
  padding: 12px;
}

/* Contenido */
.rr-archive-products ul.products li.product .woocommerce-loop-product__title{
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  margin: 10px 12px 8px !important;
  min-height: 36px; /* evita saltos por títulos */
  color: #222;
}

/* Precio principal */
.rr-archive-products ul.products li.product .price{
  margin: 0 12px 10px !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #111 !important;
}

/* Old price (chiquito gris, sin bold) */
.rr-archive-products ul.products li.product .price del{
  font-size: 11px !important;
  color: #9a9a9a !important;
  font-weight: 400 !important;
  opacity: 1 !important;
}
.rr-archive-products ul.products li.product .price ins{
  text-decoration: none !important;
}

/* Botón add to cart si aparece */
.rr-archive-products ul.products li.product a.button{
  margin: 0 12px 12px !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
}

/* =========================================================
   4) Mobile
   ========================================================= */
@media (max-width: 991px){
  .rr-archive-layout{
    grid-template-columns: 1fr;
  }
  .rr-archive-products ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px !important;
  }
  .rr-archive-products ul.products li.product img{
    height: 170px;
  }
}
/* =========================================================
   RR - CATEGORY/SHOP = Mercado Libre style (Desktop + Mobile)
   IGUALITO a la referencia: sidebar izquierda + grilla centrada
   ========================================================= */

/* Fondo general tipo ML */
.woocommerce.archive .site-content,
.woocommerce.archive .page-content,
.woocommerce.archive .content-area{
  background: #f5f5f5 !important;
}

/* Wrapper centrado (mata full width del theme) */
.rr-archive-wrap{
  max-width: 1220px;
  margin: 0 auto;
  padding: 18px 12px 30px;
}

/* Layout: filtros + productos */
.rr-archive-layout{
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 18px;
  align-items: start;
}

/* Sidebar filtros ML */
.rr-archive-filters{
  background: #fff;
  border: 1px solid #eaeaea;
  border-radius: 10px;
  padding: 14px;
  position: sticky;
  top: 110px;
}

/* Título filtros */
.rr-ml-filters__title{
  font-size: 18px;
  font-weight: 800;
  margin: 0 0 12px;
  color: #333;
}

.rr-ml-filters__block{
  padding: 10px 0;
  border-top: 1px solid #f0f0f0;
}
.rr-ml-filters__block:first-of-type{
  border-top: 0;
  padding-top: 0;
}

.rr-ml-filters .widget-title{
  font-size: 13px;
  font-weight: 800;
  margin: 0 0 8px;
  color: #333;
}

.rr-ml-filters ul{
  margin: 0;
  padding: 0;
  list-style: none;
}

.rr-ml-filters li{
  margin: 0 0 8px;
}

.rr-ml-filters a{
  color: #3483fa;
  text-decoration: none;
}
.rr-ml-filters a:hover{
  text-decoration: underline;
}

.rr-ml-filters__hint{
  margin-top: 10px;
  font-size: 12px;
  color: #888;
}

/* =========================================================
   GRID de productos (3 columnas como ML)
   ========================================================= */
.rr-archive-products ul.products{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Quita widths/margenes del theme */
.rr-archive-products ul.products li.product{
  width: auto !important;
  margin: 0 !important;
}

/* Card estilo ML */
.rr-archive-products ul.products li.product .woocommerce-loop-product__link{
  display: block;
  background: #fff;
  border: 1px solid #eaeaea;
  border-radius: 8px;
  overflow: hidden;
  transition: transform .15s ease, box-shadow .15s ease;
}
.rr-archive-products ul.products li.product .woocommerce-loop-product__link:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(0,0,0,.10);
}

/* Imagen grande arriba, tipo ML */
.rr-archive-products ul.products li.product img{
  width: 100% !important;
  height: 250px !important;
  object-fit: contain !important;
  padding: 16px !important;
  background: #fff !important;
}

/* Texto/título como ML */
.rr-archive-products ul.products li.product .woocommerce-loop-product__title{
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #333 !important;
  line-height: 1.25 !important;
  margin: 6px 14px 8px !important;
  min-height: 38px;
}

/* Precio */
.rr-archive-products ul.products li.product .price{
  margin: 0 14px 12px !important;
  font-size: 28px !important;
  font-weight: 800 !important;
  color: #111 !important;
}

/* Old price gris chico (NO toca la línea tachada, sólo el número) */
.rr-archive-products ul.products li.product .price del{
  display: block;
  font-size: 12px !important;
  color: #999 !important;
  font-weight: 400 !important;
  margin-bottom: 4px;
}
.rr-archive-products ul.products li.product .price ins{
  text-decoration: none !important;
}

/* Badge descuento verde estilo ML si aparece */
.rr-archive-products ul.products li.product .onsale{
  background: #00a650 !important;
  color: #fff !important;
  border-radius: 6px !important;
  padding: 4px 8px !important;
  font-weight: 800 !important;
  font-size: 12px !important;
  top: 12px !important;
  left: 12px !important;
}

/* Botón */
.rr-archive-products ul.products li.product a.button{
  margin: 0 14px 14px !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
}

/* =========================================================
   Mobile: 2 columnas y filtros arriba (si querés luego drawer)
   ========================================================= */
@media (max-width: 991px){
  .rr-archive-layout{
    grid-template-columns: 1fr;
  }

  .rr-archive-filters{
    position: relative;
    top: auto;
    order: 1;
  }

  .rr-archive-products{
    order: 2;
  }

  .rr-archive-products ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px !important;
  }

  .rr-archive-products ul.products li.product img{
    height: 180px !important;
    padding: 12px !important;
  }

  .rr-archive-products ul.products li.product .price{
    font-size: 22px !important;
  }
}
/* =========================================================
   RR - ARCHIVE (Shop/Categorías) estilo Mercado Libre
   - achica full width
   - sidebar izquierda
   - cards de producto tipo ML
   ========================================================= */

/* Wrapper general (lo abre functions.php en archives) */
.rr-ml-archive{
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px 16px;
  display: grid;
  grid-template-columns: 270px minmax(0, 1fr);
  gap: 22px;
}

/* Sidebar */
.rr-ml-sidebar{
  background: #fff;
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 14px 14px;
}

.rr-ml-sidebar__title{
  font-weight: 600;
  font-size: 16px;
  margin: 2px 0 10px;
}

.rr-ml-sidebar__sep{
  height: 1px;
  background: #eee;
  margin: 12px 0;
}

/* Widgets Woo (listas) */
.rr-ml-sidebar .widget,
.rr-ml-filter-drawer .widget{
  margin: 0;
}

.rr-ml-sidebar ul{
  list-style: none;
  padding: 0;
  margin: 0;
}

.rr-ml-sidebar ul li{
  padding: 7px 0;
  border-bottom: 1px solid #f2f2f2;
  font-size: 14px;
}

.rr-ml-sidebar ul li:last-child{
  border-bottom: 0;
}

.rr-ml-sidebar a{
  text-decoration: none;
}

.rr-ml-sidebar a:hover{
  text-decoration: underline;
}

/* Resultados */
.rr-ml-results{
  min-width: 0;
}

/* ====== GRID de productos (Minimog usa variables) ====== */
.rr-ml-results .products,
.rr-ml-results ul.products{
  --grid-columns-desktop: 3;
  --grid-columns-tablet: 3;
  --grid-columns-mobile: 2;

  --grid-gutter-desktop: 18px;
  --grid-gutter-tablet: 16px;
  --grid-gutter-mobile: 14px;
}

/* Si el tema ignora variables, igual forzamos un gap lindo */
.rr-ml-results ul.products{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px !important;
}

/* Cards tipo ML */
.rr-ml-results li.product{
  background: #fff !important;
  border: 1px solid #eee !important;
  border-radius: 10px !important;
  overflow: hidden;
  transition: transform .12s ease, box-shadow .12s ease;
}

.rr-ml-results li.product:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(0,0,0,.08);
}

/* Imagen */
.rr-ml-results li.product .woocommerce-LoopProduct-link,
.rr-ml-results li.product a{
  display: block;
}

.rr-ml-results li.product img{
  width: 100% !important;
  height: 240px !important;
  object-fit: contain !important;
  background: #fff;
  padding: 14px !important;
}

/* Info */
.rr-ml-results li.product .price,
.rr-ml-results li.product .woocommerce-loop-product__title,
.rr-ml-results li.product h2,
.rr-ml-results li.product h3{
  padding-left: 14px;
  padding-right: 14px;
}

.rr-ml-results li.product .woocommerce-loop-product__title,
.rr-ml-results li.product h2,
.rr-ml-results li.product h3{
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  margin: 8px 0 4px !important;
  min-height: 36px;
}

/* Precio */
.rr-ml-results li.product .price{
  font-size: 20px !important;
  font-weight: 600 !important;
  margin: 0 0 10px !important;
  padding-bottom: 12px;
}

/* Old price chiquito como pediste (7px, grey) */
.rr-ml-results li.product .price del,
.rr-ml-results li.product del .amount{
  font-size: 7px !important;
  color: #9aa0a6 !important;
  font-weight: 400 !important;
}

/* Sale price */
.rr-ml-results li.product ins,
.rr-ml-results li.product ins .amount{
  text-decoration: none !important;
}

/* ====== Barra Filtrar (mobile) ====== */
.rr-ml-filterbar{
  display: none;
  margin: 10px 0 14px;
}

.rr-ml-filterbtn{
  width: 100%;
  border: 1px solid #e5e5e5;
  background: #fff;
  border-radius: 10px;
  padding: 12px 14px;
  font-weight: 600;
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
}

.rr-ml-filterbtn__icon{
  font-size: 18px;
  line-height: 1;
}

/* ====== Drawer Mobile ====== */
.rr-ml-filter-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  opacity: 0;
  pointer-events: none;
  transition: opacity .15s ease;
  z-index: 9998;
}

.rr-ml-filter-drawer{
  position: fixed;
  top: 0;
  right: 0;
  width: 88%;
  max-width: 380px;
  height: 100vh;
  background: #fff;
  transform: translateX(100%);
  transition: transform .18s ease;
  z-index: 9999;
  display: flex;
  flex-direction: column;
}

.rr-ml-filter-drawer__head{
  padding: 14px 14px;
  border-bottom: 1px solid #eee;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.rr-ml-filter-drawer__title{
  font-weight: 700;
  font-size: 16px;
}

.rr-ml-filter-drawer__close{
  border: 0;
  background: transparent;
  font-size: 18px;
}

.rr-ml-filter-drawer__body{
  padding: 14px 14px;
  overflow: auto;
}

.rr-ml-filter-drawer__foot{
  padding: 12px 14px;
  border-top: 1px solid #eee;
}

.rr-ml-filter-apply{
  width: 100%;
  border: 0;
  border-radius: 10px;
  padding: 12px 14px;
  font-weight: 700;
  background: #3483fa;
  color: #fff;
}

.rr-ml-filter-overlay.is-open{ opacity: 1; pointer-events: auto; }
.rr-ml-filter-drawer.is-open{ transform: translateX(0); }

.rr-ml-lock{ overflow: hidden !important; }

/* ====== Responsive ====== */
@media (max-width: 991px){
  .rr-ml-archive{
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .rr-ml-sidebar{
    display: none; /* en mobile usamos drawer */
  }
  .rr-ml-filterbar{
    display: block;
  }

  .rr-ml-results ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }

  .rr-ml-results li.product img{
    height: 190px !important;
    padding: 10px !important;
  }
}
/* ==============================
   RR ML SHOP LAYOUT
============================== */

/* TOP FULL WIDTH */
.rr-ml-topbar{
  width: 100%;
  background: #fff;
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.rr-ml-topbar__inner{
  max-width: 1180px;
  margin: 0 auto;
  padding: 14px 16px;
}
.rr-ml-topbar__ph{
  height: 110px;
  border-radius: 12px;
  background: rgba(0,0,0,.03);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 13px;
  color: rgba(0,0,0,.55);
}

/* WRAP: sidebar + grid */
.rr-ml-shopwrap{
  max-width: 1180px;
  margin: 0 auto;
  padding: 16px;
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 16px;
  align-items: start;
}

/* Sidebar */
.rr-ml-sidebar{
  position: sticky;
  top: 12px;
}
.rr-ml-filters{
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius: 12px;
  padding: 14px;
}
.rr-ml-filters__title{
  font-weight: 700;
  font-size: 15px;
  margin-bottom: 10px;
}
.rr-ml-filters__block{
  margin: 12px 0;
}
.rr-ml-filters__hint{
  font-size: 12px;
  color: rgba(0,0,0,.6);
  margin-top: 10px;
}

/* Contenido */
.rr-ml-content{ min-width: 0; }

/* Bar "Filtrar" (solo mobile) */
.rr-ml-filterbar{ display:none; }

/* ==============================
   PRODUCT GRID + CARDS (ML STYLE)
============================== */

/* Reduce full width de Woo */
.woocommerce.archive .site-content,
.woocommerce.archive .content,
.woocommerce.archive .container{
  max-width: 100% !important;
}

/* Grid del loop (Woo default) */
.woocommerce ul.products{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
  margin: 0 !important;
}

/* Card estilo ML */
.woocommerce ul.products li.product{
  background:#fff !important;
  border:1px solid rgba(0,0,0,.06) !important;
  border-radius: 12px !important;
  overflow:hidden !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.04) !important;
  padding: 0 !important;
  margin: 0 !important;
}
.woocommerce ul.products li.product:hover{
  box-shadow: 0 10px 24px rgba(0,0,0,.10) !important;
  transform: translateY(-2px);
  transition: .18s ease;
}

/* Imagen centrada y sin “gigante” */
.woocommerce ul.products li.product a img{
  width: 100% !important;
  height: 240px !important;
  object-fit: contain !important;
  padding: 18px !important;
  background: #fff !important;
  margin: 0 !important;
}

/* Info */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size: 14px !important;
  line-height: 1.25 !important;
  padding: 0 14px !important;
  margin: 0 0 8px 0 !important;
  font-weight: 400 !important;
  color: rgba(0,0,0,.85) !important;
  min-height: 36px;
}

/* Precio */
.woocommerce ul.products li.product .price{
  padding: 0 14px 14px 14px !important;
  margin: 0 !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: rgba(0,0,0,.9) !important;
}

/* Old price (chico, gris, sin bold) */
.woocommerce ul.products li.product .price del,
.woocommerce ul.products li.product .price del .amount{
  font-size: 11px !important;
  color: rgba(0,0,0,.45) !important;
  font-weight: 400 !important;
}

/* Ocultar botón add-to-cart en cards si molesta */
.woocommerce ul.products li.product a.button{
  display:none !important;
}

/* ==============================
   RESPONSIVE
============================== */
@media (max-width: 1024px){
  .rr-ml-shopwrap{
    grid-template-columns: 240px 1fr;
  }
  .woocommerce ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 768px){
  .rr-ml-shopwrap{
    grid-template-columns: 1fr;
  }
  .rr-ml-sidebar{
    display:none;
  }
  .rr-ml-filterbar{
    display:flex;
    justify-content:flex-end;
    margin: 10px 0 12px;
  }

  .woocommerce ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
  .woocommerce ul.products li.product a img{
    height: 180px !important;
    padding: 12px !important;
  }
}

/* ==============================
   DRAWER MOBILE
============================== */
.rr-ml-filterbtn{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  border:1px solid rgba(0,0,0,.15);
  background:#fff;
  padding: 10px 12px;
  border-radius: 10px;
  font-weight: 700;
}
.rr-ml-filter-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  opacity: 0;
  pointer-events: none;
  transition: .18s ease;
  z-index: 9998;
}
.rr-ml-filter-drawer{
  position: fixed;
  top: 0;
  right: 0;
  width: min(92vw, 360px);
  height: 100vh;
  background:#fff;
  transform: translateX(110%);
  transition: .22s ease;
  z-index: 9999;
  display:flex;
  flex-direction: column;
}
.rr-ml-filter-drawer.is-open{ transform: translateX(0); }
.rr-ml-filter-overlay.is-open{
  opacity: 1;
  pointer-events: auto;
}
.rr-ml-filter-drawer__head{
  display:flex;
  align-items:center;
  justify-content: space-between;
  padding: 14px 14px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}
.rr-ml-filter-drawer__body{
  padding: 14px;
  overflow:auto;
  flex: 1;
}
.rr-ml-filter-drawer__foot{
  padding: 12px 14px;
  border-top: 1px solid rgba(0,0,0,.08);
}
.rr-ml-filter-apply{
  width: 100%;
  border: none;
  background: #3483fa;
  color:#fff;
  font-weight: 800;
  padding: 12px 14px;
  border-radius: 10px;
}
.rr-ml-lock{
  overflow:hidden !important;
}
/* =========================================================
   RR / ML - ARCHIVE LAYOUT (TOP + 2 COLS)
   ========================================================= */

.rr-ml-archive {
  width: 100%;
  background: #f5f5f5;
  padding: 16px 0 24px;
}

.rr-ml-archive-top {
  width: 100%;
  padding: 0 16px 14px;
}

.rr-ml-archive-top__inner {
  max-width: 1200px;
  margin: 0 auto;
  background: #fff;
  border-radius: 14px;
  padding: 14px;
  box-shadow: 0 1px 0 rgba(0,0,0,.04);
}

.rr-ml-archive-top__placeholder {
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: #fafafa;
  border: 1px solid #eee;
  color: #6b7280;
  font-size: 13px;
}

/* subcategorías (top) */
.rr-ml-subcats {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.rr-ml-subcat {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 999px;
  background: #f7f7f7;
  border: 1px solid #eee;
  text-decoration: none;
  color: #111;
  font-size: 13px;
}
.rr-ml-subcat:hover { background: #f1f1f1; }
.rr-ml-subcat__dot {
  width: 10px; height: 10px;
  border-radius: 999px;
  background: rgba(200,0,0,.9);
}

/* 2 columnas */
.rr-ml-archive__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 16px;
  padding: 0 16px;
}

.rr-ml-archive__sidebar {
  background: #fff;
  border-radius: 14px;
  padding: 14px;
  box-shadow: 0 1px 0 rgba(0,0,0,.04);
}

.rr-ml-archive__main {
  min-width: 0;
}

.rr-ml-archive__toolbar {
  background: #fff;
  border-radius: 14px;
  padding: 10px 12px;
  margin-bottom: 12px;
  box-shadow: 0 1px 0 rgba(0,0,0,.04);
}

/* =========================================================
   PRODUCT GRID + CARDS (ML STYLE)
   Apunta al loop real de Woo: ul.products li.product
   ========================================================= */

.rr-ml-archive__main ul.products {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px !important;
  margin: 0 !important;
}

@media (max-width: 1100px) {
  .rr-ml-archive__main ul.products { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 900px) {
  .rr-ml-archive__inner { grid-template-columns: 1fr; }
  .rr-ml-archive__sidebar { order: 2; }
  .rr-ml-archive__main { order: 1; }
  .rr-ml-archive__main ul.products { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 520px) {
  .rr-ml-archive__main ul.products { grid-template-columns: 1fr; }
}

/* Card base */
.rr-ml-archive__main ul.products li.product {
  background: #fff !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.06) !important;
  border: 1px solid #f0f0f0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.rr-ml-archive__main ul.products li.product a.woocommerce-LoopProduct-link {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* Imagen (compacta, ML vibe) */
.rr-ml-archive__main ul.products li.product a img {
  width: 100% !important;
  height: 210px !important;
  object-fit: contain !important;
  padding: 14px !important;
  background: #fff !important;
  margin: 0 !important;
}

/* Nombre */
.rr-ml-archive__main ul.products li.product .woocommerce-loop-product__title {
  font-size: 13px !important;
  line-height: 1.25 !important;
  font-weight: 400 !important;
  padding: 0 12px !important;
  margin: 0 0 8px !important;
  color: #111 !important;
  min-height: 34px;
}

/* Precio wrapper */
.rr-ml-archive__main ul.products li.product .price {
  display: block !important;
  padding: 0 12px 12px !important;
  margin: 0 !important;
}

/* Old price (7px, gris, sin bold) */
.rr-ml-archive__main ul.products li.product .price del,
.rr-ml-archive__main ul.products li.product .price del .amount {
  font-size: 7px !important;
  color: #9aa0a6 !important;
  font-weight: 400 !important;
  opacity: 1 !important;
}

/* Precio principal */
.rr-ml-archive__main ul.products li.product .price ins,
.rr-ml-archive__main ul.products li.product .price ins .amount,
.rr-ml-archive__main ul.products li.product .price > .amount {
  font-size: 22px !important;
  font-weight: 400 !important;
  color: #111 !important;
  text-decoration: none !important;
}

/* Ocultar botón add-to-cart en cards (ML no lo muestra en grid) */
.rr-ml-archive__main ul.products li.product a.button,
.rr-ml-archive__main ul.products li.product .add_to_cart_button {
  display: none !important;
}
/* ================================
   GLOBAL ML TYPOGRAPHY
   ================================ */
:root{
  --ml-font: "Proxima Nova",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}

html, body, button, input, select, textarea{
  font-family: var(--ml-font) !important;
}
/* =========================================
   FIX alineación items del menú principal
   ========================================= */

header nav ul,
header nav ul li,
header nav ul li a {
  display: flex;
  align-items: center;
}

header nav ul {
  gap: 18px; /* opcional, ordena el spacing */
}

header nav ul li {
  height: 100%;
}

header nav ul li a {
  height: 100%;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: normal !important;
}
/* =========================================
   MEGA MENU - MARCAS (estilo ML)
   ========================================= */

.rr-menu-brands{
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
  padding: 14px 16px;
  min-width: 720px;
  max-width: 920px;
}

.rr-brand-item{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  text-decoration: none;
  transition: all .15s ease;
}

.rr-brand-item:hover{
  box-shadow: 0 8px 22px rgba(0,0,0,.10);
  transform: translateY(-1px);
}

.rr-brand-thumb{
  width: 54px;
  height: 54px;
  border-radius: 10px;
  background: #f3f3f3;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}

.rr-brand-thumb img{
  max-width: 80%;
  max-height: 80%;
  object-fit: contain;
}

.rr-brand-ph{
  width: 28px;
  height: 28px;
  border-radius: 6px;
  background: #e5e5e5;
}

.rr-brand-name{
  font-size: 13px;
  font-weight: 700;
  color: #111;
  line-height: 1.2;
}

/* Mobile: que caiga en columnas */
@media (max-width: 900px){
  .rr-menu-brands{
    grid-template-columns: repeat(2, 1fr);
    min-width: auto;
  }
}
/* FIX alineación items menú header */
header nav ul,
header nav ul li,
header nav ul li a{
  display:flex;
  align-items:center;
}

header nav ul li a{
  line-height:normal !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
}
/* ===============================
   MEGA MENU MARCAS
   =============================== */

header nav li { position: relative; }

header nav li .sub-menu{
  min-width: 760px;
  padding: 12px;
}

header nav li .rr-mega-marcas-li > a{
  padding: 0 !important;
  pointer-events: none;
}

header nav li .rr-mega-marcas-li > a::after{
  content: "";
  display: block;
  width: 100%;
}

/* Evita estilos raros del theme */
header nav li .rr-mega-marcas-li{
  background: transparent !important;
}
/* =========================================
   Mega submenu Marcas (panel ancho)
   ========================================= */

.rr-submenu-marcas{
  width: auto;
  min-width: 820px;
  padding: 10px 10px;
}

.rr-submenu-marcas .rr-mega-marcas{
  padding: 0 !important;
}

.rr-submenu-marcas .rr-mega-marcas > a{
  display:none !important; /* por si el theme mete un <a> */
}

/* Si el theme limita el submenu, forzamos visible */
.rr-submenu-marcas{
  overflow: visible;
}
/* =========================================
   Dropdown básico menú principal (Desktop)
   ========================================= */

.ml-links-menu { list-style:none; margin:0; padding:0; }
.ml-links-menu > li { position: relative; }

.ml-links-menu > li > .sub-menu{
  display: none;
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  z-index: 9999;
  background: #fff;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(0,0,0,.12);
  padding: 10px;
}

/* Mostrar al hover */
.ml-links-menu > li:hover > .sub-menu{
  display: block;
}

/* Mega submenu marcas (panel ancho) */
.rr-submenu-marcas{
  min-width: 820px;
  padding: 10px 10px;
}

/* El li que contiene la grilla no debe parecer item normal */
.rr-submenu-marcas .rr-mega-marcas{
  padding: 0 !important;
  margin: 0 !important;
}
/* ===========================
   Marcas dropdown (desktop)
   =========================== */
.rr-brands{ position: relative; }
.rr-brands-btn{
  background: transparent;
  border: 0;
  cursor: pointer;
  font: inherit;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0;
}

.rr-brands-dropdown{
  display:none;
  position:absolute;
  top: calc(100% + 10px);
  left: 0;
  z-index: 9999;
  background: #fff;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(0,0,0,.12);
  padding: 10px;
}

.rr-brands.is-open .rr-brands-dropdown{ display:block; }
/* ===========================
   Marcas dropdown (desktop) FIX
   =========================== */
.rr-brands{ position: relative; }

.rr-brands-btn{
  appearance: none;
  background: transparent !important;
  border: 0 !important;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 !important;
  margin: 0 !important;

  /* 🔥 evita que el theme lo deje invisible */
  font-size: 13px !important;
  line-height: 1 !important;
  color: #111 !important;
  font-weight: 500 !important;
}

.rr-brands-label{
  display: inline-block !important;
  font-size: 13px !important;
  line-height: 1 !important;
  color: #111 !important;
  font-weight: 500 !important;
}

.rr-brands-dropdown{
  display:none;
  position:absolute;
  top: calc(100% + 10px);
  left: 0;
  z-index: 9999;

  background: #fff;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(0,0,0,.12);
  padding: 10px;
}

/* abrir */
.rr-brands.is-open .rr-brands-dropdown{ display:block; }
/* =========================
   RR FOOTER (OnCity style)
   ========================= */
:root{
  --rr-blue: #0b49d1;      /* azul fuerte */
  --rr-blue2: #0a3fb8;     /* variante */
  --rr-red: rgba(200,0,0,1);
  --rr-white: #ffffff;
  --rr-soft: rgba(255,255,255,.85);
  --rr-line: rgba(255,255,255,.22);
}

.rr-footer{
  background: var(--rr-blue);
  color: var(--rr-white);
  padding: 46px 0 18px;
}

.rr-footer__wrap{
  width: min(1240px, calc(100% - 48px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 34px;
  align-items: start;
}

.rr-footer__col--brand{
  min-width: 280px;
}

.rr-footer__logo{
  font-weight: 800;
  letter-spacing: .6px;
  font-size: 30px;
  line-height: 1;
}

.rr-footer__newsletter{
  margin-top: 18px;
}

.rr-footer__news-title{
  font-size: 14px;
  color: var(--rr-soft);
  margin-bottom: 10px;
}

.rr-footer__news-form{
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.18);
  padding: 10px;
  border-radius: 999px;
}

.rr-footer__news-input{
  flex: 1;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--rr-white);
  font-size: 14px;
  padding: 10px 10px;
}

.rr-footer__news-input::placeholder{
  color: rgba(255,255,255,.65);
}

.rr-footer__news-btn{
  border: 0;
  outline: none;
  cursor: pointer;
  padding: 10px 14px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 12px;
  letter-spacing: .3px;
  background: var(--rr-red);
  color: var(--rr-white);
  transition: transform .15s ease, filter .15s ease;
}

.rr-footer__news-btn:hover{
  transform: translateY(-1px);
  filter: brightness(1.05);
}

.rr-footer__social{
  margin-top: 14px;
  display: flex;
  gap: 10px;
  align-items: center;
}

.rr-footer__social-ico{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: var(--rr-white);
  border: 1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.08);
  transition: transform .15s ease, background .15s ease;
  font-weight: 700;
}

.rr-footer__social-ico:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.14);
}

.rr-footer__title{
  font-weight: 800;
  font-size: 14px;
  margin-bottom: 14px;
}

.rr-footer__link{
  display: block;
  text-decoration: none;
  color: rgba(255,255,255,.88);
  font-size: 14px;
  margin: 10px 0;
  transition: color .15s ease;
}

.rr-footer__link:hover{
  color: var(--rr-white);
  text-decoration: underline;
}

.rr-footer__mini{
  margin: 10px 0 12px;
  font-size: 14px;
  color: rgba(255,255,255,.88);
}

.rr-footer__mini-label{
  font-weight: 700;
  margin-bottom: 4px;
}

.rr-footer__link--inline{
  margin: 0;
  display: inline-block;
}

.rr-footer__cta{
  display: inline-block;
  margin-top: 10px;
  text-decoration: none;
  background: #1ee6c7;
  color: #0b1b2a;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .3px;
  padding: 12px 14px;
  border-radius: 10px;
  transition: transform .15s ease, filter .15s ease;
}

.rr-footer__cta:hover{
  transform: translateY(-1px);
  filter: brightness(1.03);
}

.rr-footer__line{
  width: min(1240px, calc(100% - 48px));
  margin: 26px auto 14px;
  height: 1px;
  background: var(--rr-line);
}

.rr-footer__bottom{
  width: min(1240px, calc(100% - 48px));
  margin: 0 auto;
  display: flex;
  justify-content: center;
  padding-bottom: 10px;
}

.rr-footer__dev{
  text-decoration: none;
  color: rgba(255,255,255,.90);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
}

.rr-footer__dev:hover{
  color: var(--rr-white);
}

.rr-footer__dev-badge{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,.20);
  border: 1px solid rgba(255,255,255,.18);
  font-weight: 900;
  letter-spacing: .4px;
}

/* Responsive */
@media (max-width: 980px){
  .rr-footer__wrap{
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px){
  .rr-footer__wrap{
    grid-template-columns: 1fr;
    gap: 22px;
  }
  .rr-footer{
    padding: 36px 0 14px;
  }
}
:root{
  --rr-red: rgba(200,0,0,1);
  --rr-red2: rgba(170,0,0,1);
  --rr-white: #ffffff;
  --rr-soft: rgba(255,255,255,.86);
  --rr-line: rgba(255,255,255,.22);
}

.rr-footer{
  background: var(--rr-red);
  color: var(--rr-white);
  padding: 46px 0 18px;
}

/* Más prolijo tipo OnCity: centrado y con ancho consistente */
.rr-footer__wrap{
  width: min(1240px, calc(100% - 48px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 420px 1fr 1fr 1fr; /* fija columna izquierda para que NO desbalancee */
  gap: 34px;
  align-items: start;
}

.rr-footer__brand{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.rr-footer__logo-img{
  height: 34px;
  width: auto;
  display: block;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,.25));
}

/* Newsletter alineado, que no “flote” */
.rr-footer__newsletter{
  margin-top: 14px;
  max-width: 380px; /* evita que quede gigante y descentrado */
}

.rr-footer__news-title{
  font-size: 14px;
  color: var(--rr-soft);
  margin-bottom: 10px;
}

.rr-footer__news-form{
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.22);
  padding: 10px;
  border-radius: 999px;
  max-width: 380px;
}

.rr-footer__news-input{
  flex: 1;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--rr-white);
  font-size: 14px;
  padding: 10px 10px;
}

.rr-footer__news-input::placeholder{
  color: rgba(255,255,255,.72);
}

/* Botón ahora se ve “RR” pero prolijo */
.rr-footer__news-btn{
  border: 0;
  outline: none;
  cursor: pointer;
  padding: 10px 14px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .3px;
  background: rgba(255,255,255,.18);
  color: var(--rr-white);
  transition: transform .15s ease, background .15s ease;
  white-space: nowrap;
}

.rr-footer__news-btn:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.25);
}

/* Redes un toque más prolijas sobre rojo */
.rr-footer__social-ico{
  border: 1px solid rgba(255,255,255,.28);
  background: rgba(0,0,0,.10);
}

/* Línea + bottom */
.rr-footer__line{
  width: min(1240px, calc(100% - 48px));
  margin: 26px auto 14px;
  height: 1px;
  background: var(--rr-line);
}

/* Responsive */
@media (max-width: 980px){
  .rr-footer__wrap{
    grid-template-columns: 1fr 1fr;
  }
  .rr-footer__newsletter,
  .rr-footer__news-form{
    max-width: 100%;
  }
}

@media (max-width: 640px){
  .rr-footer__wrap{
    grid-template-columns: 1fr;
    gap: 22px;
  }
}
/* Old price (tachado) estilo ML: chico, gris, sin bold y tachado centrado */
.ml-old-price{
  font-size: 11px;
  line-height: 1.1;
  font-weight: 400;
  color: rgba(255,255,255,.55); /* si está sobre fondos oscuros */
  /* si está sobre blanco, usá esto en lugar del de arriba:
  color: rgba(0,0,0,.45);
  */
  text-decoration: line-through;
  text-decoration-thickness: 1px;
  text-decoration-color: currentColor;
  text-decoration-skip-ink: none;
  opacity: .85; /* “que desaparezca” un poco */
}

/* Si Woo mete <del> adentro (a veces pasa), lo normalizamos */
.ml-old-price del,
.ml-old-price del *{
  color: inherit !important;
  font-weight: 400 !important;
  text-decoration: line-through !important;
  text-decoration-color: currentColor !important;
}
/* =========================================================
   FIX: Swiper mostrando 1 producto por slide (pisado por tema)
   Forzamos comportamiento de Swiper en nuestros carruseles ML
   ========================================================= */

.ml-carousel .swiper,
.ml-offers-block .swiper,
.ml-cat-carousel .swiper,
.ml-bubbles .swiper,
.ml-cats-block .swiper {
  overflow: hidden;
}

.ml-carousel .swiper-wrapper,
.ml-offers-block .swiper-wrapper,
.ml-cat-carousel .swiper-wrapper,
.ml-bubbles .swiper-wrapper,
.ml-cats-block .swiper-wrapper {
  display: flex !important;
}

.ml-carousel .swiper-slide,
.ml-offers-block .swiper-slide,
.ml-cat-carousel .swiper-slide,
.ml-bubbles .swiper-slide,
.ml-cats-block .swiper-slide {
  width: auto !important;      /* <- clave: evita el 100% del tema */
  flex-shrink: 0 !important;
}

/* Asegura que la card no fuerce ancho raro */
.ml-carousel .ml-card,
.ml-offers-block .ml-card,
.ml-cat-carousel .ml-card {
  width: 100%;
}
/* =========================================================
   Old price: gris, chiquito, sin bold, tachado prolijo
   ========================================================= */

.ml-old-price {
  font-size: 7px !important;
  color: #9aa0a6 !important;
  font-weight: 400 !important;
  line-height: 1.1 !important;
  margin-bottom: 2px;
  text-decoration-line: line-through !important;
  text-decoration-thickness: 1px !important;
  text-decoration-color: currentColor !important;
}

.ml-old-price * {
  color: #9aa0a6 !important;
  font-weight: 400 !important;
  text-decoration: none !important; /* evita doble tachado si Woo mete <del> */
}
/* =========================================================
   FIX DEFINITIVO: carruseles mostrando 1 slide
   Fuerza el ancho de slides por CSS (ignora pisadas del tema)
   ========================================================= */

/* wrappers */
.ml-carousel .swiper-wrapper,
.ml-offers-block .swiper-wrapper,
.ml-cat-carousel .swiper-wrapper,
.ml-bubbles .swiper-wrapper,
.ml-cats-block .swiper-wrapper{
  display:flex !important;
}

/* BASE: 2 por vista en mobile */
body .ml-carousel .swiper-slide,
body .ml-offers-block .ml-swiper-offers .swiper-slide,
body .ml-cat-carousel .swiper-slide{
  flex: 0 0 calc((100% - 12px) / 2) !important;
  width: calc((100% - 12px) / 2) !important;
  max-width: calc((100% - 12px) / 2) !important;
}

/* Desktop: 4 por vista */
@media (min-width: 768px){
  body .ml-carousel .swiper-slide,
  body .ml-offers-block .ml-swiper-offers .swiper-slide{
    flex: 0 0 calc((100% - 60px) / 4) !important;
    width: calc((100% - 60px) / 4) !important;
    max-width: calc((100% - 60px) / 4) !important;
  }

  /* Carrusel por categoría: 6 por vista */
  body .ml-cat-carousel .swiper-slide{
    flex: 0 0 calc((100% - 100px) / 6) !important;
    width: calc((100% - 100px) / 6) !important;
    max-width: calc((100% - 100px) / 6) !important;
  }
}

/* Asegura que no haya overflow raro */
.ml-carousel .swiper,
.ml-offers-block .swiper,
.ml-cat-carousel .swiper{
  overflow:hidden;
}
/* Asegura que cada slide no se estire y la card quede normal */
.swiper-slide { height: auto; }
.ml-card { display:block; height:100%; }
.ml-img img { display:block; max-width:100%; height:auto; }
/* ==========================
   FIX Swiper RR - sin media card + flechas clickeables
   ========================== */

/* Recorta todo lo que se sale del carrusel */
.ml-carousel .swiper,
.ml-offers-right .swiper,
.ml-cat-carousel .swiper,
.ml-cats-block .swiper {
  overflow: hidden !important;
}

/* Reseteo de wrapper/slide por si el tema metió cosas raras */
.ml-carousel .swiper-wrapper,
.ml-offers-right .swiper-wrapper,
.ml-cat-carousel .swiper-wrapper,
.ml-cats-block .swiper-wrapper {
  display: flex !important;
  align-items: stretch !important;
}

/* MUY importante: que Swiper controle el ancho, NO el CSS del tema */
.ml-carousel .swiper-slide,
.ml-offers-right .swiper-slide,
.ml-cat-carousel .swiper-slide,
.ml-cats-block .swiper-slide {
  flex: 0 0 auto !important;
  width: auto !important;
  height: auto !important;
}

/* Flechas arriba de todo y clickeables */
.ml-arrow,
.ml-carousel .swiper-button-next,
.ml-carousel .swiper-button-prev,
.ml-offers-right .swiper-button-next,
.ml-offers-right .swiper-button-prev,
.ml-cat-carousel .swiper-button-next,
.ml-cat-carousel .swiper-button-prev,
.ml-cats-block .swiper-button-next,
.ml-cats-block .swiper-button-prev {
  z-index: 50 !important;
  pointer-events: auto !important;
}

/* Si algún contenedor encima está “tapando” el click */
.ml-carousel,
.ml-offers-right,
.ml-cat-carousel,
.ml-cats-block {
  position: relative;
}
/* ===== SWIPER FIX: evitar media tarjeta y flechas clickeables ===== */
.ml-swiper,
.ml-swiper-offers,
.ml-cats-swiper,
.ml-swiper-cat,
.ml-bubbles-swiper {
  overflow: hidden; /* clave: evita el “corte” raro */
}

.swiper-button-next,
.swiper-button-prev {
  z-index: 50;
  pointer-events: auto;
}

/* Por si algún contenedor está “tapando” las flechas */
.ml-carousel,
.ml-offers-block,
.ml-cat-carousel,
.ml-cats-block {
  position: relative;
}

/* Swiper necesita esto para layout correcto */
.swiper-wrapper {
  box-sizing: border-box;
}
.swiper-slide {
  box-sizing: border-box;
}
/* Old price (tachado) estilo ML: más chico, gris y línea al medio */
.ml-old-price {
  color: #9aa0a6;
  font-size: 7px;
  font-weight: 400;
  line-height: 1;
  text-decoration: line-through;
  text-decoration-thickness: 1px;
  text-decoration-color: #9aa0a6;
  text-decoration-skip-ink: none;
  margin-top: 2px;
}

/* =========================================================
   PATCH v2: asegurar menú mobile vertical (evitar herencia del theme padre)
   ========================================================= */
@media (max-width: 991px){
  .rr-mob-menu{ display:block !important; }
  .rr-mob-menu > li{ display:block !important; }
  .rr-mob-menu > li > a{ display:block !important; }
}
/*
Theme Name: RR Audiocar Child
Template: minimog
Version: 1.0
*/

/* =========================================================
   FIX GLOBAL: NO SCROLL A LA DERECHA
   ========================================================= */
html, body{
  max-width: 100%;
  overflow-x: hidden !important;
}
body{ position: relative; }

img, svg, video, iframe{
  max-width: 100%;
  height: auto;
}

/* =========================================================
   VARIABLES
   ========================================================= */
:root{
  --ml-max: 1280px;
  --ml-border: #e5e7eb;
  --ml-text: rgba(75,85,99,.95);
  --ml-muted: rgba(107,114,128,.95);
  --ml-hover: #f5f5f5;

  --ml-logo-col: 240px;
  --ml-promo-col: 360px;

  /* RR colors */
  --rr-red-1: #d00000;
  --rr-red-2: #8f0000;
  --rr-red-3: rgba(143,0,0,0);
  --rr-blue: #3483fa; /* botones del drawer */
}

/* =========================================================
   HEADER BASE (Tailwind-like)
   ========================================================= */
.ml-header,
.ml-header *{
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.ml-header{
  background: #fff;
  border-bottom: 1px solid #f3f4f6;
  position: relative;
  z-index: 999999;
  overflow-x: clip;
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}

.ml-header .ml-container{
  max-width: var(--ml-max);
  margin: 0 auto;
  padding: 0 16px;
}

/* =========================================================
   TOP ROW (Desktop)
   ========================================================= */
.ml-top{
  background: #fff;
  border-bottom: 1px solid #f3f4f6;
  padding: 20px 0;
}

.ml-top-grid{
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 24px;
}

.ml-logo{
  display:flex;
  align-items:center;
}
.ml-logo a{
  display:flex;
  align-items:center;
  gap: 10px;
  text-decoration:none;
}
.ml-logo img{
  height: 42px;
  width:auto;
  display:block;
}

/* Search (Woo form) */
.ml-search{
  min-width: 420px;
}
.ml-search form{
  width: 100%;
  position: relative;
  margin: 0;
}
.ml-search input[type="search"],
.ml-search input[type="text"]{
  width: 100%;
  height: 44px;
  border-radius: 999px;
  border: 1px solid #e5e7eb;
  padding: 0 52px 0 16px;
  font-size: 14px;
  color: rgba(17,24,39,.95);
  background: #f9fafb;
  box-shadow: none !important;
  outline: none !important;
  transition: all .15s ease;
}
.ml-search input[type="search"]::placeholder,
.ml-search input[type="text"]::placeholder{
  color: rgba(156,163,175,.95);
}
.ml-search input[type="search"]:focus,
.ml-search input[type="text"]:focus{
  background: #fff;
  border-color: #E63946;
  box-shadow: 0 0 0 3px rgba(230,57,70,.18) !important;
}

.ml-search button[type="submit"],
.ml-search button,
.ml-search input[type="submit"]{
  position: absolute;
  right: 6px;
  top: 6px;
  bottom: 6px;
  width: 32px;
  border: 0 !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: rgba(107,114,128,.95) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
  padding: 0 !important;
}
.ml-search button[type="submit"]:hover,
.ml-search button:hover,
.ml-search input[type="submit"]:hover{
  background: #f3f4f6 !important;
}
.ml-search form:focus-within button[type="submit"],
.ml-search form:focus-within button{
  color: #E63946 !important;
}

/* Si el botón viene con texto, lo escondemos y lo reemplazamos por lupa */
.ml-search button[type="submit"],
.ml-search button{
  font-size: 0 !important;
}
.ml-search button[type="submit"]::before,
.ml-search button::before{
  content: "";
  width: 18px;
  height: 18px;
  background: url("assets/img/search-alt-1-svgrepo-com.svg") center/contain no-repeat;
  transform: translateY(-2px);
  opacity: .7;
}
.ml-search form:focus-within button[type="submit"]::before,
.ml-search form:focus-within button::before{
  opacity: 1;
  filter: none;
}

/* Actions */
.ml-actions{
  display:flex;
  align-items:center;
  gap: 8px;
  white-space: nowrap;
}

.ml-action-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 36px;
  padding: 0 12px;
  border-radius: 999px;
  color: rgba(75,85,99,.95) !important;
  font-size: 14px;
  font-weight: 600 !important;
  text-decoration: none;
  background: transparent !important;
  transition: background .15s ease, color .15s ease;
}
.ml-action-link:hover{
  color: #E63946 !important;
  background: rgba(230,57,70,.08) !important;
}

.ml-cart{
  position: relative;
  width: 40px;
  height: 40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius: 999px;
  color: rgba(75,85,99,.95) !important;
  text-decoration:none;
  background: transparent !important;
  transition: background .15s ease, color .15s ease;
}
.ml-cart:hover{
  color: #E63946 !important;
  background: rgba(230,57,70,.08) !important;
}
.ml-cart-ico{
  width: 22px;
  height: 22px;
  display:block;
}
.ml-cart-count{
  position: absolute;
  top: 4px;
  right: 4px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  background: #E63946;
  color:#fff !important;
  font-size: 11px;
  font-weight: 800 !important;
  border: 2px solid #fff;
}

/* =========================================================
   BOTTOM ROW (Desktop nav)
   ========================================================= */
.ml-bottom{
  background: #fff;
  border-bottom: 1px solid #f3f4f6;
}

.ml-bottom-grid{
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.ml-bottom-menus{
  height: 48px;
  display:flex;
  align-items:center;
  gap: 18px;
  min-width: 0;
}

.ml-links{ min-width: 0; }
.ml-links-menu{
  height: 48px;
  display:flex;
  align-items:center;
  gap: 18px;
  list-style:none;
  margin:0;
  padding:0;
  white-space: nowrap;
}

.ml-links-menu a{
  height: 48px !important;
  line-height: 48px !important;
  display:flex !important;
  align-items:center !important;
  font-size: 14px;
  font-weight: 600 !important;
  text-decoration: none;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  color: rgba(75,85,99,.95) !important;
  transition: color .15s ease;
}
.ml-links-menu a:hover{ color: #E63946 !important; }

.ml-links-menu a.is-offers{
  color: #E63946 !important;
  font-weight: 800 !important;
}

.ml-sep{
  width: 1px;
  height: 16px;
  background: #e5e7eb;
  display:inline-block;
}

.ml-ship{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  font-size: 12px;
  font-weight: 800 !important;
  color: #10B981;
  background: rgba(16,185,129,.10);
  padding: 6px 10px;
  border-radius: 999px;
  white-space: nowrap;
}
.ml-ship-ico{ width: 14px; height: 14px; display:block; }

/* Anti hover negro theme */
.ml-header a:hover,
.ml-header a:focus,
.ml-header a:active,
.ml-header button:hover,
.ml-header button:focus,
.ml-header button:active{
  background-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

/* =========================================================
   CATEGORÍAS DESKTOP
   ========================================================= */
.ml-categories{
  height: 48px;
  display:flex;
  align-items:center;
}
.ml-categories-wrap{
  position: relative;
  height: 48px;
  display:flex;
  align-items:center;
  z-index: 1000000;
}
.ml-categories-btn{
  height: 48px !important;
  line-height: 48px !important;
  display:flex !important;
  align-items:center !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ml-text) !important;
  font-size: 14px !important;
  cursor: pointer;
}
.ml-categories-btn:hover{ text-decoration: underline; }
.ml-caret{ font-size: 12px; color: var(--ml-muted); }

.ml-categories-wrap:hover .ml-categories-dropdown,
.ml-categories-wrap.is-open .ml-categories-dropdown{
  display:block !important;
}

.ml-categories-wrap::before{
  content:"";
  position:absolute;
  left: -18px;
  top: 100%;
  width: 420px;
  height: 28px;
  background: transparent;
}

.ml-categories-dropdown{
  position:absolute;
  top: 100%;
  left: -18px;
  margin-top: 10px;
  width: 360px;
  background:#fff !important;
  border: 1px solid #e6e6e6;
  border-radius: 10px;
  box-shadow: 0 18px 46px rgba(0,0,0,.14);
  padding: 10px;
  display:none;
  z-index: 1000001;
}
.ml-cat-root,
.ml-cat-sub{
  list-style:none;
  margin:0 !important;
  padding:0 !important;
}
.ml-cat-root > li{ position: relative; }

.ml-cat-root > li > a,
.ml-cat-sub a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 10px 10px;
  border-radius: 8px;
  text-decoration:none;
  color: var(--ml-text) !important;
  font-size: 14px;
  line-height: 1.2;
}
.ml-cat-root > li > a:hover,
.ml-cat-sub a:hover{
  background: var(--ml-hover) !important;
}
.ml-cat-root > li.has-children > a::after{
  content: "›";
  font-size: 18px;
  opacity: .7;
}
.ml-cat-sub{
  position:absolute;
  top: -10px;
  left: 100%;
  margin-left: 10px;
  width: 360px;
  background:#fff !important;
  border: 1px solid #e6e6e6;
  border-radius: 10px;
  box-shadow: 0 18px 46px rgba(0,0,0,.14);
  padding: 10px;
  display:none;
  z-index: 1000002;
}
.ml-cat-root > li.has-children:hover > .ml-cat-sub{ display:block !important; }

.ml-cat-empty{
  display:block;
  padding: 10px;
  color: rgba(0,0,0,.55);
  font-size: 14px;
}

/* =========================================================
   ✅ FIX CRÍTICO: ELEMENTOS MOBILE OCULTOS EN DESKTOP
   (esto arregla tu captura)
   ========================================================= */
.ml-mobile,
.rr-mob-overlay,
.rr-mob-drawer{
  display: none !important;
}

/* =========================================================
   MOBILE (<= 980px) - RR estilo ML
   ========================================================= */
@media (max-width: 980px){

  /* ocultamos desktop */
  .ml-top,
  .ml-bottom{ display:none !important; }

  .ml-header{
    height: auto;
    border-bottom: 0;
  }

  .ml-top-grid,
  .ml-bottom-grid{
    left: 0;
  }

  /* activamos mobile */
  .ml-mobile{ display:block !important; }
  .rr-mob-overlay{ display:block !important; }
  .rr-mob-drawer{ display:block !important; }

  /* Barra superior ROJA con degradado hacia abajo */
  .ml-mobile-bar{
    height: 56px;
    display:flex;
    align-items:center;
    gap: 10px;
    padding: 10px 12px;

    background: linear-gradient(180deg, var(--rr-red-1) 0%, var(--rr-red-2) 70%, var(--rr-red-3) 100%);
    border-bottom: 1px solid rgba(0,0,0,.10);
  }

  .ml-mobile-logo img{
    height: 26px;
    width:auto;
    display:block;
    filter: none;
  }

  .ml-mobile-search{
    flex: 1 1 auto;
    min-width: 0;
  }

  /* input mobile: menos radius (y que el theme no lo cambie) */
  .ml-mobile-search-form{
    position: relative;
    margin: 0;
  }
  .ml-mobile-search-input{
    width: 100%;
    height: 36px;
    border-radius: 2px !important;     /* 👈 menos radius */
    border: 1px solid rgba(0,0,0,.12) !important;
    padding: 0 38px 0 12px;
    font-size: 14px;
    background: #fff !important;
    outline: none !important;
    box-shadow: none !important;
  }
  .ml-mobile-search-form::before{
    content:url("assets/img/search-alt-1-svgrepo-com.svg");
    position:absolute;
    right: 1px;
    top: 50%;
    transform: translateY(-46%);
    opacity: .6;
    pointer-events:none;
  }

  .ml-mobile-btn{
    width: 40px;
    height: 40px;
    border: 0 !important;
    background: transparent !important;
    font-size: 22px;
    line-height: 1;
    color: #111 !important;
  }

  .ml-mobile-cart{
    width: 44px;
    height: 40px;
    display:flex;
    align-items:center;
    justify-content:center;
    position: relative;
    text-decoration:none;
    color: #111 !important;
  }
  .ml-mob-cart-count{
    position:absolute;
    top: 2px;
    right: 4px;
    min-width: 16px;
    height: 16px;
    padding: 0 5px;
    border-radius: 999px;
    background:#ef4444;
    color:#fff;
    font-size: 11px;
    font-weight: 700;
    display:flex;
    align-items:center;
    justify-content:center;
  }

  /* lock scroll cuando abre el drawer */
  .rr-lock{ overflow:hidden; }

  /* overlay */
  .rr-mob-overlay{
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
    z-index: 999998;
  }
  .rr-mob-overlay.is-open{
    opacity: 1;
    pointer-events: auto;
  }

  /* drawer */
  .rr-mob-drawer{
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 86%;
    max-width: 360px;
    background: #fff;
    transform: translateX(-102%);
    transition: transform .22s ease;
    z-index: 999999;
    overflow-y: auto;
  }
  .rr-mob-drawer.is-open{ transform: translateX(0); }

  .rr-mob-drawer-top{
    padding: 14px;
    border-bottom: 1px solid var(--ml-border);
    background: #fff; /* el drawer en ML es blanco, no rojo */
  }

  .rr-mob-userbox{
    display:flex;
    gap: 10px;
    align-items:flex-start;
    margin-bottom: 12px;
  }
  .rr-mob-avatar{
    width: 44px;
    height: 44px;
    border-radius: 999px;
    background: #f3f4f6;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .rr-mob-title{
    font-size: 18px;
    font-weight: 700 !important;
    color: var(--ml-text);
    margin-bottom: 2px;
  }
  .rr-mob-sub{
    font-size: 13px;
    color: rgba(0,0,0,.65);
    line-height: 1.25;
  }

  .rr-mob-actions{
    display:flex;
    gap: 10px;
  }
  .rr-mob-btn{
    flex: 1 1 50%;
    height: 42px;
    border-radius: 8px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    font-size: 14px;
    font-weight: 600 !important;
  }
  .rr-mob-btn-primary{
    background: var(--rr-blue);
    color: #fff !important;
  }
  .rr-mob-btn-outline{
    border: 2px solid var(--rr-blue);
    color: var(--rr-blue) !important;
    background: #fff;
  }

  .rr-mob-nav{ padding: 8px 0; }

  .rr-mob-menu{
    list-style:none;
    margin:0;
    padding:0;
  }
  .rr-mob-menu li a{
    display:block;
    padding: 14px 14px;
    text-decoration:none;
    color: var(--ml-text);
    font-size: 15px;
    border-bottom: 1px solid #f1f1f1;
    background:#fff;
  }

  /* acordeón categorías */
  .rr-mob-section{
    border-bottom: 1px solid #f1f1f1;
    background:#fff;
  }
  .rr-mob-accordion{
    width: 100%;
    border: 0;
    background: #fff;
    padding: 14px 14px;
    font-size: 15px;
    display:flex;
    align-items:center;
    justify-content:space-between;
  }
  .rr-mob-acc-title{
    font-weight: 600 !important;
    color: var(--ml-text);
  }
  .rr-mob-acc-panel{
    display:none;
    padding: 6px 0 10px;
  }
  .rr-mob-acc-panel.is-open{ display:block; }

  .rr-mob-cat{ padding: 0 14px 10px; }
  .rr-mob-cat-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap: 10px;
  }
  .rr-mob-cat-next{
    width: 34px;
    height: 34px;
    border-radius: 999px;
    border: 1px solid #e5e7eb;
    background: #fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size: 18px;
    line-height: 1;
    color: rgba(17,24,39,.8);
  }
  .rr-mob-cat-next[aria-expanded="true"]{
    transform: rotate(90deg);
  }
  .rr-mob-cat-parent{
    display:block;
    padding: 10px 0;
    font-weight: 700 !important;
    text-decoration:none;
    color: var(--ml-text);
  }
  .rr-mob-cat-children{ padding-left: 10px; }
  .rr-mob-cat-child{
    display:block;
    padding: 8px 0;
    text-decoration:none;
    color: rgba(0,0,0,.75);
    border-left: 2px solid #f1f1f1;
    padding-left: 10px;
  }

  .rr-mob-empty{
    padding: 0 14px 14px;
    color: rgba(0,0,0,.6);
  }
}
/* =========================================================
   RR + Elementor: degradado que “se funde” con el slider
   (mobile)
   ========================================================= */

/* 1) Header mobile rojo + degradado (ya lo tenés, pero lo refuerzo) */
@media (max-width: 980px){
  .ml-mobile-bar{
    background: linear-gradient(
      180deg,
      #d00000 0%,
      #b00000 55%,
      rgba(176,0,0,0) 100%
    ) !important;
  }
}

/* 2) Overlay arriba del PRIMER SECTION (donde suele estar el slider) */
@media (max-width: 980px){

  /* cubre la mayoría de estructuras de Elementor */
  body .elementor-location-single .elementor-top-section:first-child,
  body .elementor-location-page .elementor-top-section:first-child,
  body .elementor .elementor-top-section:first-child,
  body .elementor-section-wrap > .elementor-top-section:first-child{
    position: relative;
    z-index: 0;
  }

  body .elementor-location-single .elementor-top-section:first-child::before,
  body .elementor-location-page .elementor-top-section:first-child::before,
  body .elementor .elementor-top-section:first-child::before,
  body .elementor-section-wrap > .elementor-top-section:first-child::before{
    content:"";
    position:absolute;
    left:0; right:0; top:0;
    height: 140px;              /* “bajada” del rojo (ajustable) */
    background: linear-gradient(
      180deg,
      rgba(208,0,0,.92) 0%,
      rgba(176,0,0,.55) 45%,
      rgba(176,0,0,0) 100%
    );
    pointer-events:none;
    z-index: 3;                 /* arriba del slider */
  }

  /* asegura que el slider quede “debajo” del overlay */
  body .elementor .swiper,
  body .elementor .elementor-swiper,
  body .elementor .swiper-wrapper,
  body .elementor .swiper-slide{
    position: relative;
    z-index: 1;
  }

  /* 3) Buscador mobile con menos redondeo (como pediste) */
  .ml-mobile-search-input{
    border-radius: 2px !important;
  }
}
/* =========================================================
   MOBILE LOOK PRO (RR + ML vibe) — limpia colores y aprovecha espacio
   ========================================================= */
@media (max-width: 980px){

  /* 1) Barra mobile más prolija */
  .ml-mobile-bar{
    height: 60px !important;
    padding: 10px 12px !important;
    gap: 10px !important;
    background-color: rgba(163,0,0,0) !important;

    

    border-color: transparent !important;
  }

  /* Logo más prolijo, sin “cuadradito” raro */
  .ml-mobile-logo img{
    height: 28px !important;
    width: auto !important;
    display: block !important;
    border-radius: 0 !important;
  }
  .ml-mobile-logo,
  .ml-mobile-logo a{
    display:flex !important;
    align-items:center !important;
  }

  /* 2) Buscador como ML (alto 38-40, radius leve, sombra sutil) */
  .ml-mobile-search-input{
    height: 38px !important;
    border-radius: 3px !important;
    border: 1px solid rgba(0,0,0,.10) !important;
    background: rgba(255,255,255,.96) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.10) !important;
    padding-left: 18px !important;
    padding-right: 25px !important;
    font-size: 14px !important;
  }
  .ml-mobile-search-form::before{
    right: 1px !important;
    opacity: .55 !important;
  }

  /* 3) Iconos (menu + carrito) alineados y con hit area */
  .ml-mobile-btn{
    width: 60px !important;
    height: 60px !important;
    border-radius: 10px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    color: rgba(0,0,0,.85) !important;
  
  }

  .ml-mobile-cart{
    width: 46px !important;
    height: 42px !important;
  }
  .ml-mob-cart-count{
    top: 4px !important;
    right: 6px !important;
  }

  /* 4) Degradado que baja al slider: más suave y real */
  /* Si usás rr-hero, esto es mejor que el :first-child */
  .rr-hero{ position: relative; }
  .rr-hero::before{
    content:"";
    position:absolute;
    left:0; right:0; top:0;

    /* bajada más elegante */
    height: 300px !important;

    /* suave, sin “banda” fea */
    background: linear-gradient(
      180deg,
      #c80000 0%,
      #c80000 45%,
      rgba(163,0,0,0) 100%
    )!important;

    pointer-events:none;
    z-index: 3;
  }

  /* 5) Le doy un “espacio” arriba al slider para que no quede pegado */
  .rr-hero .elementor-container,
  .rr-hero .elementor-widget-wrap{
    position: relative;
    z-index: 2;
  }

  /* 6) Fondo del body en mobile: blanco real (evita rarezas del theme) */
  body{
    background: #fff !important;
  }
}
/* =========================================================
   MOBILE FINAL OVERRIDE (ML-like): spacing + icons modernos + compactos
   Pegar AL FINAL del style.css
   ========================================================= */
@media (max-width: 980px){

  /* Barra roja con degradado (dejamos SOLO este look) */
  .ml-mobile-bar{
    height: 56px !important;
    padding: 10px 12px !important;
    gap: 12px !important; /* espacio general tipo ML */
    background-color: #c80000 !important;
    border-bottom: 0 !important;
    border-color: transparent !important;
  }

  /* Logo: más aire con el buscador */
  .ml-mobile-logo{
    margin-right: 6px !important; /* aire extra */
    flex: 0 0 auto !important;
  }
  .ml-mobile-logo img{
    height: 28px !important;
    width: auto !important;
    display:block !important;
  }

  /* Buscador: ocupa el espacio y queda bien ML */
  .ml-mobile-search{
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
  .ml-mobile-search-input{
    height: 32px !important;
        min-height: 20px !important;
        border-radius: 1px !important;
        border: none !important;
        background: rgba(255, 255, 255, .96) !important;
        box-shadow: none !important;
        padding: 0 40px 0 12px !important;
        font-size: 14px !important;
        width: 100% !important;
  }
  .ml-mobile-search-form::after{
    right: 1px !important;
    opacity: .55 !important;
  }

  /* ===== ICONOS (MENÚ + CARRITO) COMPACTOS Y VISIBLES ===== */

  /* Reducimos el “espacio inútil” que te quedó por width/height 60 */
  .ml-mobile-btn{
    width: 40px !important;
    height: 40px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    color: #fff !important; /* icono blanco sobre rojo */
    position: relative !important;
    padding: 0 !important;
  }

  /* HAMBURGER moderno (3 líneas) — pisa el ícono viejo */
  .ml-mobile-btn::before,
  .ml-mobile-btn::after{
    content:"";
    position:absolute;
    left: 11px;
    right: 11px;
    height: 2px;
    background: #fff;
    border-radius: 2px;
    opacity: .95;
  }
  .ml-mobile-btn::before{ top: 14px; }
  .ml-mobile-btn::after{ top: 26px; }

  /* línea del medio */
  .ml-mobile-btn span{
    position:absolute !important;
    left: 11px !important;
    right: 11px !important;
    top: 20px !important;
    height: 2px !important;
    background: #fff !important;
    border-radius: 2px !important;
    opacity: .95 !important;
    display:block !important;
    font-size: 0 !important;
    line-height: 0 !important;
  }

  /* Si tu botón no tiene <span>, igual lo dibujamos: */
  .ml-mobile-btn:not(:has(span)){
    color: transparent !important; /* escondemos el caracter ☰ si aparece */
  }

  /* Carrito: más visible y ML-like */
  .ml-mobile-cart{
    width: 42px !important;
    height: 40px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    color: #111 !important;
  }

  /* Badge más prolijo */
  .ml-mob-cart-count{
    top: 2px !important;
    right: 3px !important;
    min-width: 16px !important;
    height: 16px !important;
    font-size: 11px !important;
    padding: 0 5px !important;
  }

  /* Evita que el header “estire” a la derecha por algún ancho raro */
  .ml-mobile,
  .ml-mobile-bar{
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
}
/* =========================================================
   ICONOS MOBILE (usa tus SVGs) - NO toca colores ni tamaños
   Pegar al FINAL
   ========================================================= */
@media (max-width: 980px){

  /* 1) SEARCH: reemplaza tu emoji 🔎 por SVG */
  .ml-mobile-search-form::after{
    content: "" !important; /* pisa cualquier emoji anterior */
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
    opacity: .65;
    pointer-events: none;
    background: url("assets/img/search-alt-1-svgrepo-com.svg") no-repeat center / contain;
  }

  /* 2) BOTÓN MENÚ: que no dibuje “las 3 líneas” si las tenías */
  .ml-mobile-btn::before,
  .ml-mobile-btn::after{
    content: none !important;
  }
  .ml-mobile-btn span{
    display: none !important;
  }

  /* 3) SVGs dentro de botón y carrito */
  .ml-mobile-ico{
    width: 22px;
    height: 22px;
    display: block;
  }

  /* 4) Burger: un toque más grande para que se vea mejor */
  .ml-mobile-ico--burger{
    width: 24px;
    height: 24px;
  }

  /* 5) Cart: visible sobre rojo (si el svg viene negro, le aplico filtro leve) */
  .ml-mobile-ico--cart{
    width: 22px;
    height: 22px;
    filter: brightness(0) invert(1); /* queda blanco sobre tu top bar roja */
  }

  /* Por las dudas, el botón menú también blanco */
  .ml-mobile-ico--burger{
    filter: brightness(0) invert(1);
  }
}
@media (max-width: 980px){

  /* apagamos cualquier icono previo */
  .ml-mobile-search-form::before{ content: none !important; }
  .ml-mobile-search-form::after{ content: "" !important; }

  /* icono search prolijo */
  .ml-mobile-search-form{
    position: relative;
  }
  .ml-mobile-search-form::after{
    content: "" !important;
    position: absolute !important;
    right: 10px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 18px !important;
    height: 18px !important;
    opacity: .65 !important;
    pointer-events: none !important;
    background: url("assets/img/search-alt-1-svgrepo-com.svg") no-repeat center / contain !important;
  }

  /* por si tu input tiene width 105% y se mete debajo del icono */
  .ml-mobile-search-input{
    padding-right: 36px !important;
  }
}
@media (max-width: 980px){
  .ml-mobile-btn{
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
  }
  .ml-mobile-ico{
    display:block;
  }
}
@media (max-width: 980px){

  /* Apagamos tus implementaciones anteriores (content:url / after viejo) */
  .ml-mobile-search-form::before{ content: none !important; }
  .ml-mobile-search-form::after{
    content: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  /* Icono search limpio (sin caja) */
  .ml-mobile-search-form{
    position: relative !important;
  }
  .ml-mobile-search-form .rr-search-ico{ display:none; } /* por si existiera algo viejo */

  .ml-mobile-search-form::marker{ content: "" !important; } /* safe */

  .ml-mobile-search-form::after{
    content: "" !important;
    position: absolute !important;
    right: 10px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;

    width: 18px !important;
    height: 18px !important;

    background-color: transparent !important;
    background-image: url("assets/img/search-alt-1-svgrepo-com.svg") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;

    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;

    opacity: .75 !important;
    pointer-events: none !important;
    display: block !important;
  }

  /* Asegura que el input no se meta debajo del icono */
  .ml-mobile-search-input{
    padding-right: 36px !important;
  }
}
@media (max-width: 980px){
  .ml-mobile-search-form::after{
    background-image: none !important;
    -webkit-mask: url("assets/img/search-alt-1-svgrepo-com.svg") no-repeat center / contain !important;
    mask: url("assets/img/search-alt-1-svgrepo-com.svg") no-repeat center / contain !important;
    background-color: rgba(0,0,0,.65) !important; /* color del icono */
  }
}

@media (max-width: 980px){

  /* Menos espacio entre burger y carrito */
  .ml-mobile-bar{
    gap: 8px !important;              /* gap general (antes 12px) */
  }

  /* Los dos botones de la derecha bien pegados */
  .ml-mobile-btn{
    margin-left: 2px !important;      /* casi nada */
    margin-right: -4px !important;    /* los acerca más */
    width: 36px !important;           /* un poquito más compacto */
  }

  .ml-mobile-cart{
    margin-left: -6px !important;     /* lo “pega” al burger */
    width: 38px !important;           /* compacto */
  }

  /* Badge no se sale */
  .ml-mob-cart-count{
    right: 1px !important;
  }
}
@media (max-width: 980px){

  /* 1) Que el buscador NO se “coma” el click del burger */
  .ml-mobile-search{
    overflow: hidden !important;     /* clave: el overflow deja de capturar taps afuera */
    position: relative !important;
    z-index: 1 !important;
  }

  /* 2) Botones arriba del buscador (para que siempre reciban el tap) */
  .ml-mobile-btn,
  .ml-mobile-cart{
    position: relative !important;
    z-index: 5 !important;
  }

  /* 3) El iconito del search no debe bloquear taps */
  .ml-mobile-search-form::after,
  .ml-mobile-search-form::before{
    pointer-events: none !important;
  }
}
@media (max-width: 980px){
  /* menos espacio entre burger y carrito */
  .ml-mobile-btn{ margin-right: -6px !important; }
  .ml-mobile-cart{ margin-left: -6px !important; }
}
/* =========================================================
   FIX: EN DESKTOP NO DEBE EXISTIR NADA MOBILE
   (evita que se vea el header mobile por "debajo")
   Pegar AL FINAL
   ========================================================= */
@media (min-width: 981px){

  /* apaga TODO el sistema mobile */
  .ml-mobile,
  .ml-mobile-bar,
  .ml-mobile-logo,
  .ml-mobile-search,
  .ml-mobile-btn,
  .ml-mobile-cart,
  .rr-mob-overlay,
  .rr-mob-drawer{
    display: none !important;
  }

  /* por si quedó el input mobile con width raro */
  .ml-mobile-search-input{
    width: auto !important;
    padding-right: initial !important;
  }
}
/* =========================================================
   FIX: quitar línea entre header y hero + degradado más largo
   Pegar AL FINAL
   ========================================================= */
@media (max-width: 980px){

  /* 1) mata cualquier borde/sombra que haga esa “marca” */
  .ml-header,
  .ml-mobile-bar{
    border-bottom: 0 !important;
    box-shadow: none !important;
  }

  /* 2) elimina posibles líneas del primer section */
  body .elementor-top-section:first-child{
    border-top: 0 !important;
    margin-top: -1px !important; /* tapa el pixel que se ve como línea */
  }

  /* 3) degradado del hero más largo hacia abajo */
  .rr-hero::before,
  body .elementor-location-single .elementor-top-section:first-child::before,
  body .elementor-location-page .elementor-top-section:first-child::before,
  body .elementor .elementor-top-section:first-child::before,
  body .elementor-section-wrap > .elementor-top-section:first-child::before{
    top: -1px !important;        /* tapa el corte */
    height: 380px !important;    /* <-- MÁS LARGO (antes 300) */
  }
}
.ml-mobile-bar{
    height: 60px !important;
    padding: 10px 12px !important;
    gap: 10px !important;
    background-color: rgba(200,0,0,0.89) !important;

    box-shadow: none !important;

    border-bottom-color: transparent !important;
  }
  /* =========================================================
   HERO tipo MERCADO LIBRE + tarjetas superpuestas (DESKTOP + MOBILE)
   Usar clase en Elementor: rr-ml-hero
   y para contenedor tarjetas: rr-ml-cards
   ========================================================= */

/* Sección HERO */
.rr-ml-hero{
  position: relative;
  overflow: visible;
}

/* Difuminado inferior del banner (como ML) */
.rr-ml-hero::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height: 140px;
  pointer-events:none;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.65) 55%,
    rgba(255,255,255,1) 100%
  );
  z-index: 2;
}

/* Contenedor tarjetas: se monta arriba del banner */
.rr-ml-cards{
  position: relative;
  z-index: 5;
  max-width: 1200px;
  margin: -70px auto 0;     /* 👈 “sube” sobre el banner */
  padding: 0 16px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

/* Tarjeta */
.rr-ml-card{
  background:#fff;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 10px 22px rgba(0,0,0,.10);
  padding: 16px;
  min-height: 160px;
  display:flex;
  flex-direction: column;
  text-decoration:none;
  color: #111;
}

.rr-ml-card-title{
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px;
}

.rr-ml-card-body{
  margin-top: auto;
  display:flex;
  align-items:center;
  justify-content: center;
  gap: 10px;
}

.rr-ml-card-ico{
  width: 64px;
  height: 64px;
  border-radius: 999px;
  background: #f5f5f5;
  display:flex;
  align-items:center;
  justify-content:center;
}

.rr-ml-card-ico svg{
  width: 34px;
  height: 34px;
  opacity: .85;
}

.rr-ml-card-cta{
  margin-top: 10px;
  font-size: 13px;
  color: #3483fa;
  font-weight: 600;
}

/* Responsive */
@media (max-width: 1100px){
  .rr-ml-cards{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 680px){
  .rr-ml-cards{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: -50px;
  }
  .rr-ml-hero::after{ height: 120px; }
}
/* ===== Cards layout (ya tenías algo, esto lo ajusta tipo ML) ===== */
.rr-ml-cards--5{
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.rr-ml-card{
  background:#fff;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 8px 18px rgba(0,0,0,.10);
  padding: 16px;
  min-height: 170px;
  display:flex;
  flex-direction: column;
  gap: 10px;
  text-decoration:none !important;
  color: #111 !important;
}

.rr-ml-card-title{
  font-size: 16px;
  font-weight: 600;
  line-height: 1.2;
  margin: 0;
}

/* Icono al medio */
.rr-ml-card-body{
  flex: 1 1 auto;
  display:flex;
  align-items:center;
  justify-content:center;
}

.rr-ml-card-ico{
  width: 92px;
  height: 92px;
  border-radius: 999px;
  background: #f5f5f5;
  display:flex;
  align-items:center;
  justify-content:center;
}

.rr-ml-card-ico svg{
  width: 42px;
  height: 42px;
  opacity: .9;
}

/* ===== Botón estilo ML (pastilla celeste + texto azul) ===== */
.rr-ml-btn{
  align-self: flex-start;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 30px;
  padding: 0 12px;
  border-radius: 6px;
  background: rgba(52,131,250,.14);
  color: #3483fa !important;
  font-size: 13px;
  font-weight: 600;
  line-height: 30px;
  text-decoration:none !important;
  white-space: nowrap;
}

.rr-ml-card:hover .rr-ml-btn{
  background: rgba(52,131,250,.18);
}

/* ===== Visto recientemente (con mini ficha) ===== */
.rr-ml-card--recent{
  min-height: 170px;
}
.rr-ml-recent{
  display:flex;
  gap: 12px;
  align-items:center;
}
.rr-ml-recent-thumb{
  width: 64px;
  height: 64px;
  border-radius: 12px;
  background: #f5f5f5;
  flex: 0 0 auto;
  overflow:hidden;
}
.rr-ml-recent-thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display:block;
}
.rr-ml-recent-info{
  min-width: 0;
  display:flex;
  flex-direction: column;
  gap: 4px;
}
.rr-ml-recent-name{
  font-size: 14px;
  font-weight: 600;
  color: rgba(0,0,0,.88);
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
.rr-ml-recent-meta{
  font-size: 12px;
  color: rgba(0,0,0,.60);
  line-height: 1.2;
}

/* Responsive */
@media (max-width: 1100px){
  .rr-ml-cards--5{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 680px){
  .rr-ml-cards--5{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* ====== ML EXACT LOOK (cards + button + spacing) ====== */

.rr-ml-rail{
  max-width: 1180px;
  margin: -64px auto 0;              /* 👈 las “sube” y quedan sobre el banner */
  padding: 0 16px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
  position: relative;
  z-index: 50;
}

.rr-ml-card{
  background: #fff;
  border-radius: 6px;                 /* ML es más “recto” */
  box-shadow: 0 1px 2px rgba(0,0,0,.12);
  border: 1px solid rgba(0,0,0,.08);
  padding: 18px 18px 16px;
  min-height: 176px;
  display: flex;
  flex-direction: column;
  text-decoration: none !important;
  color: rgba(0,0,0,.9) !important;
}

.rr-ml-title{
  margin: 0 0 12px 0;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: 0;
}

/* icon “medios de pago” etc */
.rr-ml-iconWrap{
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 0 10px;
}

.rr-ml-iconCircle{
  width: 92px;
  height: 92px;
  border-radius: 999px;
  background: #f5f5f5;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rr-ml-iconCircle svg{
  width: 40px;
  height: 40px;
  color: rgba(0,0,0,.75);
}

/* CTA like ML */
.rr-ml-cta{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding: 0 14px;
  border-radius: 6px;
  background: rgba(65,137,230,.15);   /* celeste ML */
  color: #3483fa !important;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  white-space: nowrap;
  align-self: flex-start;             /* 👈 NO se centra */
  margin-top: 8px;
}
.rr-ml-card:hover .rr-ml-cta{
  background: rgba(65,137,230,.20);
}

/* ====== Visto recientemente ====== */
.rr-ml-card--recent .rr-ml-cta{ margin-top: auto; } /* deja aire y botón abajo como ML */

.rr-ml-recentRow{
  display: flex;
  gap: 12px;
  align-items: center;
  margin-top: 2px;
}

.rr-ml-thumb{
  width: 64px;
  height: 64px;
  border-radius: 6px;
  background: #f5f5f5;
  overflow: hidden;
  flex: 0 0 auto;
  border: 1px solid rgba(0,0,0,.06);
}
.rr-ml-thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.rr-ml-recentText{
  min-width: 0;
}
.rr-ml-recentName{
  font-size: 14px;
  font-weight: 600;
  margin: 0 0 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rr-ml-recentMeta{
  font-size: 13px;
  color: rgba(0,0,0,.6);
  line-height: 1.15;
}

/* ====== Responsive ====== */
@media (max-width: 1100px){
  .rr-ml-rail{ grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: -44px; }
}
@media (max-width: 680px){
  .rr-ml-rail{ grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: -34px; }
}
/* Hero ML fade */
.rr-ml-hero{
  position: relative;
  overflow: hidden;
}

.rr-ml-hero::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height: 160px;
  background: linear-gradient(
    180deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.65) 55%,
    rgba(255,255,255,1) 100%
  );
  pointer-events:none;
  z-index: 5;
}
/* =========================================================
   RR – Cards estilo MercadoLibre (home)
   Shortcode: [rr_ml_info_cards]
   ========================================================= */
.rr-ml-cards-wrap{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 12px;
  position: relative;
  z-index: 20; /* arriba del banner */
}

/* “sobresalir” sobre el banner (ajustá si querés más/menos) */
.rr-ml-cards{
  margin-top: -92px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

.rr-ml-card{
  background: #fff;
  border-radius: 6px;
  box-shadow: 0 1px 2px #ebebeb;
  border: 1px solid #ebebeb;
  padding: 18px 18px 16px;
  display: flex;
  flex-direction: column;
  min-height: 240px;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
}

.rr-ml-card__title{
  font-size: 18px;
  font-weight: 600;
  color: rgba(0,0,0,.90);
  line-height: 1.2;
  margin-bottom: 10px;
}

.rr-ml-card__desc{
  font-size: 14px;
  color: rgba(0,0,0,.65);
  line-height: 1.35;
  margin-top: 10px;
  margin-bottom: 14px;
}

/* Icono circular ML */
.rr-ml-icon{
  position: relative;
  width: 92px;
  height: 92px;
  margin: 12px auto 6px;
}
.rr-ml-icon__circle{
  position:absolute;
  inset: 0;
  border-radius: 999px;
  background: #f5f5f5;
}
.rr-ml-icon__svg{
  position:absolute;
  inset: 0;
  display:flex;
  align-items:center;
  justify-content:center;
}
.rr-ml-icon__svg svg{
  width: 34px;
  height: 34px;
  fill: none;
  color: rgba(0,0,0,.72);
}
.rr-ml-icon__svg svg path{
  fill: rgba(0,0,0,.72);
}

/* Botón ML */
.rr-ml-btn{
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding: 0 14px;
  border-radius: 6px;
  background: rgba(65,137,230,.15);
  color: #3483fa;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none !important;
  white-space: nowrap;
}
.rr-ml-btn:hover{
  background: rgba(65,137,230,.22);
  color: #3483fa;
}

/* ===== Visto recientemente (producto estilo ML) ===== */
.rr-ml-card--last{ padding-top: 16px; }

.rr-ml-lastview{
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 12px;
  align-items: center;
  text-decoration: none !important;
  margin-top: 8px;
  margin-bottom: 14px;
}
.rr-ml-lastview__thumb{
  width: 64px;
  height: 64px;
  border-radius: 6px;
  border: 1px solid rgba(0,0,0,.08);
  overflow: hidden;
  background: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
}
.rr-ml-lastview__thumb img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display:block;
}
.rr-ml-lastview__name{
  font-size: 14px;
  font-weight: 600;
  color: rgba(0,0,0,.80);
  line-height: 1.25;

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rr-ml-lastview__price{
  margin-top: 6px;
  font-size: 20px;
  font-weight: 500;
  color: rgba(0,0,0,.90);
  line-height: 1.1;
}
.rr-ml-lastview__price del{
  font-size: 12px;
  color: rgba(0,0,0,.45);
  margin-right: 6px;
}
.rr-ml-lastview__price ins{
  text-decoration: none;
}

/* vacío */
.rr-ml-lastview-empty__title{
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 6px;
}
.rr-ml-lastview-empty__sub{
  font-size: 14px;
  color: rgba(0,0,0,.65);
  margin-bottom: 14px;
}

/* Responsive */
@media (max-width: 1200px){
  .rr-ml-cards{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 780px){
  .rr-ml-cards{ grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: -70px; }
}
@media (max-width: 480px){
  .rr-ml-cards{ grid-template-columns: 1fr; margin-top: -56px; }
}
/* ===== Visto recientemente: layout vertical (como ML) ===== */
.rr-ml-card--last .rr-ml-lastview{
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin-top: 6px !important;
  margin-bottom: 14px !important;
}

.rr-ml-card--last .rr-ml-lastview__thumb{
  width: 78px !important;
  height: 78px !important;
  border-radius: 6px !important;
}

.rr-ml-card--last .rr-ml-lastview__meta{
  width: 100% !important;
}

.rr-ml-card--last .rr-ml-lastview__name{
  font-size: 14px !important;
  font-weight: 600 !important;
  color: rgba(0,0,0,.82) !important;
  line-height: 1.25 !important;
}

.rr-ml-card--last .rr-ml-lastview__price{
  margin-top: 6px !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  color: rgba(0,0,0,.92) !important;
}
/* ===== Alinear contenido aunque el título tenga 1 o 2 líneas ===== */
.rr-ml-card__title{
  min-height: 46px !important; /* reserva espacio para 2 líneas */
  display: flex !important;
  align-items: flex-start !important;
  margin-bottom: 6px !important;
}
/* ===== Iconos: más grandes + rojo RR ===== */
.rr-ml-icon{
  width: 110px !important;
  height: 110px !important;
  margin: 10px auto 6px !important;
}

.rr-ml-icon__svg svg{
  width: 44px !important;
  height: 44px !important;
}

/* pinta el svg en rojo RR */
.rr-ml-icon__svg svg,
.rr-ml-icon__svg svg path{
  fill: rgba(200,0,0,1) !important;
  color: rgba(200,0,0,1) !important;
}
.rr-ml-card{ overflow: hidden !important; }
.rr-ml-btn{ width: 100% !important; }
/* =========================================================
   FINAL AJUSTES TARJETAS (ML-like)
   - Botón más chico (entra todo)
   - Visto recientemente: imagen más grande/centrada
   - Nombre + precio alineados a la misma altura que el texto de otras tarjetas
   ========================================================= */

/* 1) Botones abajo: tipografía y tamaño tipo ML */
.rr-ml-btn{
  font-size: 9px !important;
  line-height: 1 !important;
  padding: 10px 12px !important;
  border-radius: 6px !important;
  white-space: nowrap !important;
}

/* 2) Alinear todos los contenidos internos (misma altura) */
.rr-ml-card__body{
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

/* 3) Visto recientemente: bloque del producto alineado como el texto de otras tarjetas */
.rr-ml-card--last .rr-ml-lastview{
  /* ocupa el espacio y empuja el botón al fondo */
  flex: 1 1 auto !important;
  margin-top: 6px !important;

  /* centrado visual como ML */
  align-items: center !important;
  text-align: left !important;
}

/* Imagen más grande y centrada */
.rr-ml-card--last .rr-ml-lastview__thumb{
  width: 110px !important;
  height: 110px !important;
  border-radius: 10px !important;
  margin: 10px auto 8px !important;
  display: block !important;
  object-fit: contain !important;
}

/* Meta centrada pero con texto prolijo */
.rr-ml-card--last .rr-ml-lastview__meta{
  width: 100% !important;
}

/* Nombre y precio “bajan” para quedar a la misma altura que el texto de otras tarjetas */
.rr-ml-card--last .rr-ml-lastview__name{
  margin-top: 10px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: rgba(0,0,0,.82) !important;
  line-height: 1.25 !important;
}

.rr-ml-card--last .rr-ml-lastview__price{
  margin-top: 8px !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  color: rgba(0,0,0,.92) !important;
}
body{
  background-color: #ebebeb !Important;
}
.ml-carousel {
  padding: 30px;
  background-color: white !important;
  border-radius: 6px !Important;
}

.ml-title {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 15px;
}

.ml-swiper {
  position: relative;
}

.ml-card {
  background: #fff;
  border-radius: 6px;
  padding: 12px;
  text-decoration: none;
  color: #333;
  display: block;
  height: 100%;
  transition: box-shadow .2s ease;
}

.ml-card:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,.15);
}

.ml-img {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 180px;
}

.ml-img img {
  max-height: 100%;
  object-fit: contain;
}

.ml-info {
  margin-top: 10px;
}

.ml-name {
  font-size: 14px;
  line-height: 1.3;
  height: 38px;
  overflow: hidden;
}

.ml-price {
  font-size: 20px;
  font-weight: 700;
  margin-top: 6px;
}

.ml-arrow {
  width: 36px;
  height: 36px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 2px 6px rgba(0,0,0,.2);
}

.ml-arrow::after {
  font-size: 14px;
  color: #333;
}
.ml-carousel { margin: 30px 0; }

.ml-title{
  font-size: 20px;
  font-weight: 600;
  margin: 0 0 14px;
  color:#111;
}

.ml-card{
  background:#fff;
  border-radius: 6px;
  padding: 12px;
  text-decoration:none;
  color:#111;
  display:block;
  height:100%;
  border: 1px solid #eee;
  transition: box-shadow .2s ease, transform .2s ease;
}

.ml-card:hover{
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
  transform: translateY(-1px);
}

.ml-img{
  display:flex;
  justify-content:center;
  align-items:center;
  height: 190px;
  margin-bottom: 8px;
}

.ml-img img{
  max-height: 190px;
  width:auto;
  object-fit:contain;
}

.ml-name{
  font-size: 14px;
  line-height: 1.25;
  color:#333;
  margin: 6px 0 8px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
  min-height: 36px;
}

.ml-old-price{
  font-size: 12px;
  color:#999;
  text-decoration: line-through;
  margin-bottom: 2px;
}

.ml-price-row{
  display:flex;
  align-items: baseline;
  gap: 8px;
}

.ml-price{
  font-size: 22px;
  font-weight: 500; /* ML no es ultra bold */
  color:#111;
}

.ml-off{
  font-size: 14px;
  font-weight: 600;
  color:#00a650; /* verde ML */
}

.ml-benefit{
  margin-top: 6px;
  font-size: 13px;
  color:#00a650;
  font-weight: 600;
}

.ml-arrow{
  width: 36px;
  height: 36px;
  background:#fff;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
}

.ml-arrow::after{
  font-size: 14px;
  color:#333;
}
#ml-interes-wrap:not(:has(.ml-carousel)) {
  display: none !important;
}
.ml-card{
  background:#fff;
  border-radius: 8px;
  padding: 18px;              /* ⬅️ más aire interno */
  text-decoration:none;
  color:#111;
  display:block;
  height:100%;
  border: 1px solid #eee;
  transition: box-shadow .2s ease, transform .2s ease;
}

.ml-img{
  display:flex;
  justify-content:center;
  align-items:center;
  height: 200px;              /* ⬅️ un poco más alta */
  margin-bottom: 14px;        /* ⬅️ separa imagen del texto */
}

.ml-info{
  padding: 0 4px;             /* ⬅️ aire lateral tipo ML */
}

.ml-name{
  font-size: 14px;
  line-height: 1.25;
  color:#333;
  margin: 0 0 10px;           /* ⬅️ más separación */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
  min-height: 36px;
}

.ml-price-row{
  display:flex;
  align-items: baseline;
  gap: 10px;                  /* ⬅️ aire entre precio y OFF */
  margin-top: 2px;
}

.ml-benefit{
  margin-top: 10px;           /* ⬅️ que no quede pegado */
  font-size: 13px;
  color:#00a650;
  font-weight: 600;
}
/* BLOQUE PRINCIPAL (pedido: padding 30, white, radius 6) */
.ml-offers-block{
  background:#fff;
  border-radius:6px;
  padding:30px;
}

/* GRID 2 columnas */
.ml-offers-grid{
  display:grid;
  grid-template-columns: 360px 1fr;
  gap: 26px;
  align-items:start;
}

.ml-offer-head{
  margin-bottom: 14px;
}

.ml-offer-head-row{
  display:flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
}

.ml-h3{
  font-size: 20px;
  font-weight: 600;
  margin:0;
  color:#111;
}

.ml-offers-link{
  font-size: 14px;
  color:#3483fa; /* ML link */
  text-decoration:none;
  font-weight: 500;
}
.ml-offers-link:hover{ text-decoration: underline; }

/* Card grande (Oferta del día) */
.ml-card-big{
  padding: 20px;
}

.ml-img-big{
  height: 320px;
  margin-bottom: 16px;
}
.ml-img-big img{
  max-height: 320px;
}

.ml-name-big{
  font-size: 16px;
  min-height: auto;
  -webkit-line-clamp: 3;
}

.ml-price-big{
  font-size: 34px;
  font-weight: 500;
}

/* Responsive */
@media (max-width: 980px){
  .ml-offers-grid{
    grid-template-columns: 1fr;
  }
  .ml-img-big{
    height: 240px;
  }
  .ml-img-big img{
    max-height: 240px;
  }
}
/* ===== BLOQUE PRINCIPAL: que nada se salga ===== */
.ml-offers-block{
  background:#fff;
  border-radius:6px;
  padding:30px;
  overflow: hidden;              /* CLAVE: corta desbordes */
}

/* grid bien contenido */
.ml-offers-grid{
  display:grid;
  grid-template-columns: 360px 1fr;
  gap: 0;                         /* ML NO usa gap acá, usa separador */
  align-items:start;
}

/* ===== columna izquierda ===== */
.ml-offer-day{
  padding-right: 26px;            /* aire antes del separador */
}

/* ===== columna derecha + separador tipo ML ===== */
.ml-offers-right{
  padding-left: 26px;             /* aire después del separador */
  border-left: 1px solid #eee;    /* separador vertical tipo ML */
  min-width: 0;                   /* CLAVE: permite que Swiper no desborde */
}

/* headings */
.ml-offer-head-row{
  display:flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

/* ===== Swiper: que no empuje el contenedor ===== */
.ml-swiper-offers{
  width: 100%;
  overflow: hidden;               /* CLAVE */
}

.ml-swiper-offers .swiper-wrapper{
  align-items: stretch;
}

.ml-swiper-offers .swiper-slide{
  height: auto;
  min-width: 0;                   /* CLAVE */
}

/* flechas: que no se vayan afuera */
.ml-offers-block .ml-arrow{
  top: 45%;
}

.ml-offers-block .swiper-button-prev{
  left: 6px;
}

.ml-offers-block .swiper-button-next{
  right: 6px;
}

/* ===== Card: que respire y NO se salga ===== */
.ml-card{
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
}

/* ===== BIG card izquierda: limitar imagen para que no “rompa” ===== */
.ml-img-big{
  height: 300px;
  overflow: hidden;
}

.ml-img-big img{
  max-height: 300px;
  width: auto;
  object-fit: contain;
}

/* ===== Responsive ===== */
@media (max-width: 980px){
  .ml-offers-grid{
    grid-template-columns: 1fr;
  }

  .ml-offer-day{
    padding-right: 0;
    padding-bottom: 22px;
    border-bottom: 1px solid #eee;  /* separador horizontal en mobile */
    margin-bottom: 22px;
  }

  .ml-offers-right{
    padding-left: 0;
    border-left: 0;
  }
}
/* Precio tachado (más chico, NO negrita) */
.ml-old-price{
  font-size: 12px;
  font-weight: 400;          /* no bold */
  color: #999;
  text-decoration: line-through;
  margin-bottom: 4px;
}

/* Precio final */
.ml-price{
  font-size: 22px;
  font-weight: 500;          /* ML style */
  color: #111;
  line-height: 1.1;
  margin-bottom: 4px;
}

/* % OFF debajo del precio */
.ml-off{
  font-size: 14px;
  font-weight: 600;
  color: #00a650;            /* verde ML */
  margin-bottom: 6px;
}

/* Envío gratis */
.ml-benefit{
  font-size: 13px;
  color: #00a650;
  font-weight: 600;
  margin-top: 0;
}
.ml-card-big .ml-price{
  font-size: 34px;
}

.ml-card-big .ml-old-price{
  font-size: 13px;
}

.ml-card-big .ml-off{
  font-size: 15px;
}
/* ===== Categorías ML ===== */
.ml-cats-block{
  background:#fff;
  border-radius:6px;
  padding:30px;
}

.ml-cats-head{
  display:flex;
  align-items: baseline;
  justify-content: flex-start;
  gap: 16px;
  margin-bottom: 18px;
}

.ml-cats-link{
  font-size:14px;
  color:#3483fa;
  text-decoration:none;
  font-weight:500;
}
.ml-cats-link:hover{ text-decoration: underline; }

/* grid similar a ML */
.ml-cats-grid{
  display:grid;
  grid-template-columns: repeat(var(--ml-cats-cols, 4), minmax(0, 1fr));
  gap: 18px 18px;
}

/* tarjetita */
.ml-cat-card{
  display:flex;
  align-items:center;
  gap: 16px;
  background:#fff;
  border: 1px solid #eee;
  border-radius: 8px;
  padding: 16px 18px;
  text-decoration:none;
  color:#111;
  transition: box-shadow .2s ease, transform .2s ease;
  min-width: 0;
}

.ml-cat-card:hover{
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
  transform: translateY(-1px);
}

/* thumb izquierdo tipo ML */
.ml-cat-thumb{
  width: 70px;
  height: 70px;
  border-radius: 8px;
  background: #f6f6f6;
  display:flex;
  align-items:center;
  justify-content:center;
  flex: 0 0 70px;
}

/* placeholder: luego lo reemplazás por img */
.ml-cat-ph{
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: #e9e9e9;
  display:block;
}

.ml-cat-name{
  font-size: 16px;
  font-weight: 600;
  color:#222;
  line-height: 1.2;
  overflow:hidden;
  text-overflow: ellipsis;
}

/* responsive */
@media (max-width: 1100px){
  .ml-cats-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 820px){
  .ml-cats-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ml-cats-block{ padding: 22px; }
}
@media (max-width: 480px){
  .ml-cats-grid{ grid-template-columns: 1fr; }
}
/* grid fijo 4 x 3 como ML */
.ml-cats-grid-4x3{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: repeat(3, auto);
  gap: 18px;
}

/* evitar que Swiper estire cosas */
.ml-cats-swiper{
  overflow:hidden;
}

/* responsive */
@media (max-width: 1100px){
  .ml-cats-grid-4x3{
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: auto;
  }
}
@media (max-width: 820px){
  .ml-cats-grid-4x3{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 480px){
  .ml-cats-grid-4x3{
    grid-template-columns: 1fr;
  }
}
.ml-cat-name{
  font-size: 11px !Important;
}
.ml-offers-block .ml-old-price,
.ml-offers-block .ml-old-price *{
  font-size: 7px !important;
  color: #9e9e9e !important;
  font-weight: 400 !important;
  line-height: 1.1 !important;
}
.ml-block{
  background:#fff;
  border-radius:6px;
  padding:30px;
}

.ml-block-head{
  display:flex;
  align-items:baseline;
  gap:14px;
  margin-bottom:18px;
}

.ml-block-link{
  color:#3483fa;
  font-size:14px;
  font-weight:500;
  text-decoration:none;
}
.ml-block-link:hover{ text-decoration: underline; }

/* puntitos arriba derecha (opcional visual) */
.ml-dots{
  margin-left:auto;
  width:38px;
  height:10px;
  position:relative;
  opacity:.4;
}
/* =========================
   ML HERO
   ========================= */
.ml-hero{
  width:100%;
  min-height:420px;
  border-radius:12px;
  overflow:hidden;
  background-size:cover;
  background-position:center;
  position:relative;
}

.ml-hero__inner{
  max-width:1200px;
  margin:0 auto;
  padding:40px 24px;
  min-height:420px;
  display:flex;
  align-items:center;
}

.ml-hero__inner--right{ justify-content:flex-end; }
.ml-hero__inner--left{ justify-content:flex-start; }

.ml-hero__card{
  width:min(560px, 100%);
  background:#fff;
  border-radius:12px;
  padding:34px 34px;
  box-shadow:0 10px 30px rgba(0,0,0,.18);
}

.ml-hero__title{
  font-size:42px;
  line-height:1.05;
  margin:0 0 14px 0;
  font-weight:800;
  color:#111;
  letter-spacing:-.02em;
}

.ml-hero__text{
  margin:0 0 26px 0;
  font-size:18px;
  line-height:1.55;
  color:#5a5a5a;
  font-weight:600;
}

.ml-hero__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:14px 18px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.18);
  background:#fff;
  color:#111;
  font-weight:700;
  text-decoration:none;
  transition: transform .15s ease, box-shadow .15s ease;
}

.ml-hero__btn:hover{
  transform: translateY(-1px);
  box-shadow:0 10px 18px rgba(0,0,0,.12);
}

.ml-hero__btn-ico{
  width:28px;
  height:28px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#f5f5f5;
  color:#111;
  font-weight:900;
}

/* Responsive */
@media (max-width: 900px){
  .ml-hero{ min-height: auto; border-radius:10px; }
  .ml-hero__inner{ min-height:auto; padding:26px 16px; }
  .ml-hero__card{ padding:22px 18px; }
  .ml-hero__title{ font-size:30px; }
  .ml-hero__text{ font-size:15px; }
}
.ml-hero__btn{
  background:#3483FA;
  color:#fff;
  border-color:#3483FA;
}
.ml-hero__btn:hover{
  background:#2968c8;
}
/* =========================================================
   TIPOGRAFÍA MERCADO LIBRE (Proxima Nova) + BASE 14px
   ========================================================= */

/* 1) Proxima Nova como ML (woff2 oficiales de mlstatic) */
@font-face{
  font-family:'Proxima Nova';
  font-weight:300;
  font-display:swap;
  font-style:normal;
  src:url(https://http2.mlstatic.com/ui/webfonts/v3.0.0/proxima-nova/proximanova-light.woff2) format("woff2"),
      url(https://http2.mlstatic.com/ui/webfonts/v3.0.0/proxima-nova/proximanova-light.woff) format("woff");
}
@font-face{
  font-family:'Proxima Nova';
  font-weight:400;
  font-display:swap;
  font-style:normal;
  src:url(https://http2.mlstatic.com/ui/webfonts/v3.0.0/proxima-nova/proximanova-regular.woff2) format("woff2"),
      url(https://http2.mlstatic.com/ui/webfonts/v3.0.0/proxima-nova/proximanova-regular.woff) format("woff");
}
@font-face{
  font-family:'Proxima Nova';
  font-weight:600;
  font-display:swap;
  font-style:normal;
  src:url(https://http2.mlstatic.com/ui/webfonts/v3.0.0/proxima-nova/proximanova-semibold.woff2) format("woff2"),
      url(https://http2.mlstatic.com/ui/webfonts/v3.0.0/proxima-nova/proximanova-semibold.woff) format("woff");
}

/* 2) Stack ML */
:root{
  --ml-font: "Proxima Nova",-apple-system,"Helvetica Neue",Helvetica,"Roboto",Arial,sans-serif;
}

/* 3) Aplicación GLOBAL (sitio completo, incluido header ML que armamos) */
html, body{
  font-family: var(--ml-font) !important;
  font-size: 14px;              /* base ML (mucho texto en ML es 14px) */
  line-height: 1.2;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body, button, input, select, textarea{
  font-family: var(--ml-font) !important;
}

/* 4) Normalizo weights */
strong, b{ font-weight: 600; }
h1,h2,h3,h4,h5,h6{ font-weight: 600; }

/* 5) Tus componentes header (antes estaban forzando system font) */
.ml-header,
.ml-header *{
  font-family: var(--ml-font) !important;
}
/* =========================================================
   MOBILE FEEL MERCADO LIBRE (global)
   NO TOCA tu header rojo degradado
   ========================================================= */
@media (max-width: 980px){

  /* Fondo ML */
  body{
    background: #ebebeb !important;
  }

  /* Contenedores: padding lateral tipo ML */
  .site, #page, .page-content, .site-content,
  .elementor-section .elementor-container,
  .elementor-container,
  .container, .boxed, .content-wrap{
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* Secciones: menos aire (ML es compacto) */
  .elementor-section{
    margin-bottom: 12px !important;
  }
  .elementor-widget{
    margin-bottom: 12px !important;
  }

  /* Cards “ML”: blanco + borde + radio */
  .rr-ml-card,
  .elementor-widget-container,
  .woocommerce ul.products li.product,
  .woocommerce div.product,
  .minimog-product,
  .product,
  .tm-swiper .swiper-slide{
    border-radius: 8px !important;
  }

  /* Si el widget-container te afecta cosas que no querés, lo afinamos después.
     Por ahora lo dejo “soft” */
  .elementor-widget-container{
    background: transparent;
  }

  /* Cualquier bloque marcado como card */
  .rr-ml-card{
    background: #fff !important;
    border: 1px solid rgba(0,0,0,.08) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.06) !important;
  }

  /* Botones: look ML (azul) */
  .elementor-button,
  .woocommerce a.button,
  .woocommerce button.button,
  .woocommerce input.button{
    font-family: var(--ml-font) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
  }

  /* Texto: compactación */
  p, li, a, span, div{
    font-size: 14px;
  }

  /* Títulos: ML usa títulos no gigantes */
  h1{ font-size: 22px !important; line-height: 1.15 !important; }
  h2{ font-size: 18px !important; line-height: 1.2 !important; }
  h3{ font-size: 16px !important; line-height: 1.25 !important; }

  /* Inputs/search: ML feel */
  input[type="text"], input[type="search"], input[type="tel"], input[type="email"], select, textarea{
    font-family: var(--ml-font) !important;
    font-size: 14px !important;
    border-radius: 6px !important;
  }
}
/* =========================================================
   FIX MOBILE estilo Mercado Libre (RR)
   ========================================================= */
@media (max-width: 980px){

  /* (1) NO quiero el difuminado blanco arriba del hero en mobile */
  .rr-ml-hero::after{
    display:none !important;
  }

  /* (1) Cards debajo del banner: 3 visibles + scroll horizontal */
  .rr-ml-cards-wrap{
    margin-top: -18px !important; /* que “pise” un poco el hero como ML */
    padding: 0 12px !important;
  }

  .rr-ml-cards{
    display:flex !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    padding-bottom: 6px;
  }

  .rr-ml-cards::-webkit-scrollbar{ display:none; }

  .rr-ml-card{
    flex: 0 0 calc((100% - 24px) / 3) !important; /* 3 por pantalla */
    min-height: 150px !important;
    padding: 14px !important;
    scroll-snap-align: start;
  }

  /* (5) Burbujas (circulitos) como ML */
  .ml-bubbles{
    padding: 10px 12px 0 !important;
    margin-top: -6px !important;
  }

  .ml-bubbles .swiper{
    overflow: visible;
  }

  .ml-bubble{
    display:flex;
    flex-direction: column;
    align-items:center;
    gap: 8px;
    text-decoration:none !important;
    color:#333;
  }

  .ml-bubble__circle{
    width: 56px;
    height: 56px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid rgba(0,0,0,.08);
    box-shadow: 0 1px 2px rgba(0,0,0,.06);
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .ml-bubble__icon{
    width: 22px;
    height: 22px;
    border-radius: 6px;
    background: rgba(200,0,0,.12);
  }

  .ml-bubble__label{
    font-size: 12px;
    line-height: 1.1;
    font-weight: 400;
  }

  /* (2) Ofertas: más aire, no “apretado” */
  .ml-offers-block{
    padding: 0 12px !important;
  }

  .ml-offer-day,
  .ml-offers-right{
    padding: 0 !important;
  }

  .ml-offers-right .swiper{
    padding: 0 2px 6px;
  }

  /* (4) Inspirado / carrusel interés: menos padding y mejor aire */
  .ml-carousel{
    padding: 0 12px !important;
  }

  .ml-carousel .ml-title{
    margin-bottom: 10px !important;
  }

  .ml-carousel .swiper{
    padding: 0 2px 6px;
  }

  /* (3) Categorías: 1 columna x 3 filas por slide */
  .ml-cats-block{
    padding: 0 12px !important;
  }

  .ml-cats-grid-4x3{
    display:grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .ml-cat-card{
    display:flex !important;
    align-items:center !important;
    gap: 14px !important;
    padding: 14px !important;
    border-radius: 12px !important;
  }

  .ml-cat-thumb{
    width: 54px !important;
    height: 54px !important;
    border-radius: 12px !important;
  }

  /* Flechas: que no tapen contenido en mobile */
  .ml-arrow{
    width: 36px !important;
    height: 36px !important;
  }
}
/* ================================
   OFERTAS (FIX desktop + mobile)
   ================================ */

/* Contenedor general de ofertas */
.ml-offers-block{
  max-width: 1180px;
  margin: 0 auto 22px;
  padding: 0 14px;
}

/* Desktop: 2 columnas */
.ml-offers-grid{
  display: grid;
  grid-template-columns: 1.15fr 1.85fr;
  gap: 18px;
  align-items: start;
}

/* Mobile: apilado */
@media (max-width: 767px){
  .ml-offers-grid{
    grid-template-columns: 1fr;
    gap: 14px;
  }
}

/* Tarjeta grande "Oferta del día" (desktop) */
.ml-card.ml-card-big{
  display: grid;
  grid-template-columns: 46% 54%;
  gap: 14px;
  align-items: center;
  padding: 18px;
}

/* Ajuste de imagen en oferta del día */
.ml-img.ml-img-big{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height: 220px;
}
.ml-img.ml-img-big img{
  max-height: 260px;
  width: auto;
  object-fit: contain;
}

/* En mobile, la big card se vuelve vertical */
@media (max-width: 767px){
  .ml-card.ml-card-big{
    grid-template-columns: 1fr;
    padding: 16px;
  }
  .ml-img.ml-img-big{
    min-height: 200px;
  }
  .ml-img.ml-img-big img{
    max-height: 240px;
  }
}

/* Head de "Ofertas" no apretado */
.ml-offer-head-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 10px;
}

/* Carrusel de ofertas: aire */
.ml-swiper-offers{
  padding: 2px;
}
.ml-swiper-offers .swiper-slide{
  height: auto;
}
.ml-swiper-offers .ml-card{
  padding: 14px;
}

/* En mobile, más aire vertical */
@media (max-width: 767px){
  .ml-swiper-offers .ml-card{
    padding: 12px;
  }
}

/* Precios viejos: mantené tu regla micro (si ya la tenías) */
.ml-old-price{
  font-size: 7px;
  color: #8a8a8a;
  font-weight: 400;
}
/* Sidebar izquierda en archivos WooCommerce */
.woocommerce.archive .site-content .content-area,
.woocommerce-page.archive .site-content .content-area {
  order: 2;
}

.woocommerce.archive .site-content .widget-area,
.woocommerce-page.archive .site-content .widget-area {
  order: 1;
}

/* Layout flex si tu tema no lo aplica */
.woocommerce.archive .site-content .content-container,
.woocommerce-page.archive .site-content .content-container,
.woocommerce.archive .site-content .container,
.woocommerce-page.archive .site-content .container {
  display: flex;
  gap: 24px;
}
/* ===========================
   RR - Filter bar (mobile)
   =========================== */
.rr-ml-filterbar{
  display:none;
  width:100%;
  max-width: 1200px;
  margin: 12px auto 0;
  padding: 0 14px;
}

.rr-ml-filterbtn{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.12);
  background:#fff;
  font-weight:600;
  font-size:14px;
}

.rr-ml-filterbtn__icon{
  font-size: 16px;
  line-height: 1;
  opacity: .8;
}

@media (max-width: 768px){
  .rr-ml-filterbar{ display:block; }
}

/* ===========================
   RR - Drawer + overlay
   =========================== */
.rr-ml-filter-overlay{
  position:fixed;
  inset:0;
  background: rgba(0,0,0,.45);
  opacity:0;
  pointer-events:none;
  transition: opacity .2s ease;
  z-index: 99998;
}

.rr-ml-filter-overlay.is-open{
  opacity:1;
  pointer-events:auto;
}

.rr-ml-filter-drawer{
  position:fixed;
  top:0;
  right:0;
  width: 88vw;
  max-width: 380px;
  height: 100dvh;
  background:#fff;
  transform: translateX(100%);
  transition: transform .22s ease;
  z-index: 99999;
  display:flex;
  flex-direction:column;
  border-left: 1px solid rgba(0,0,0,.08);
}

.rr-ml-filter-drawer.is-open{
  transform: translateX(0);
}

.rr-ml-filter-drawer__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 14px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}

.rr-ml-filter-drawer__title{
  font-size: 16px;
  font-weight: 700;
}

.rr-ml-filter-drawer__close{
  background:transparent;
  border:0;
  font-size: 18px;
  padding: 6px 8px;
  cursor:pointer;
}

.rr-ml-filter-drawer__body{
  padding: 10px 14px 14px;
  overflow:auto;
  -webkit-overflow-scrolling: touch;
}

.rr-ml-filter-drawer__foot{
  padding: 12px 14px;
  border-top: 1px solid rgba(0,0,0,.08);
}

.rr-ml-filter-apply{
  width:100%;
  padding: 12px 14px;
  border-radius: 10px;
  border: 0;
  background: #3483fa;
  color:#fff;
  font-weight: 700;
  font-size: 14px;
}

/* lock scroll */
.rr-ml-lock{
  overflow:hidden !important;
}

/* ===========================
   RR - Contenido de filtros (widgets)
   =========================== */
.rr-ml-filters__block{
  margin-bottom: 14px;
}

.rr-ml-filters__title{
  font-weight: 800;
  font-size: 14px;
  margin-bottom: 8px;
}

.rr-ml-filters .widget{
  margin: 0;
  padding: 12px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  background: #fff;
}

.rr-ml-filters .widget-title{
  font-size: 13px;
  font-weight: 700;
  margin: 0 0 10px;
}

.rr-ml-filters__hint{
  font-size: 12px;
  opacity: .7;
  margin-top: 10px;
}
/* =========================================================
   RR - Layout Shop/Categorías: sidebar izquierda + productos
   ========================================================= */
.rr-archive-layout{
  max-width: 1200px;
  margin: 0 auto;
  padding: 16px 12px;
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 16px;
}

.rr-archive-filters{
  position: sticky;
  top: 110px; /* ajustá si tu header sticky tapa */
  align-self: start;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 12px;
}

/* widgets de Woo dentro del panel */
.rr-ml-filters__title{
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 10px;
}
.rr-ml-filters .widget{
  margin: 0 0 14px;
}
.rr-ml-filters .widget-title{
  font-size: 13px;
  font-weight: 700;
  margin: 0 0 8px;
}

/* =========================================================
   RR - Grid productos más estético tipo ML
   (aplica en shop y categorías)
   ========================================================= */
.rr-archive-products ul.products{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px !important;
}

.rr-archive-products ul.products li.product{
  margin: 0 !important;
}

.rr-archive-products ul.products li.product .woocommerce-loop-product__link{
  display: block;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 10px;
  overflow: hidden;
  transition: transform .15s ease, box-shadow .15s ease;
}

.rr-archive-products ul.products li.product .woocommerce-loop-product__link:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
}

.rr-archive-products ul.products li.product img{
  width: 100%;
  height: 190px;
  object-fit: contain;
  background: #fff;
  padding: 10px;
}

.rr-archive-products ul.products li.product .woocommerce-loop-product__title{
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  margin: 10px 10px 6px !important;
  min-height: 34px;
}

.rr-archive-products ul.products li.product .price{
  margin: 0 10px 12px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
}

/* si querés old price chiquito (tu pedido anterior) */
.rr-archive-products ul.products li.product .price del{
  font-size: 11px !important;
  color: #9a9a9a !important;
  font-weight: 400 !important;
}

/* =========================================================
   Mobile: sin sidebar, 2 columnas + drawer
   ========================================================= */
.rr-only-desktop{ display: block; }
.rr-only-mobile{ display: none; }

@media (max-width: 991px){
  .rr-archive-layout{
    grid-template-columns: 1fr;
  }
  .rr-only-desktop{ display: none; }
  .rr-only-mobile{ display: block; }

  .rr-archive-products ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px !important;
  }
  .rr-archive-products ul.products li.product img{
    height: 160px;
  }
}

/* =========================================================
   Drawer Filtros mobile (ML)
   ========================================================= */
.rr-ml-filterbar{
  margin: 0 0 10px;
  display: flex;
  justify-content: flex-start;
}

.rr-ml-filterbtn{
  border: 1px solid #e5e5e5;
  background: #fff;
  border-radius: 10px;
  padding: 10px 12px;
  font-weight: 700;
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.rr-ml-filter-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
  z-index: 9998;
}
.rr-ml-filter-overlay.is-open{
  opacity: 1;
  pointer-events: auto;
}

.rr-ml-filter-drawer{
  position: fixed;
  right: 0;
  top: 0;
  height: 100%;
  width: min(420px, 92vw);
  background: #fff;
  transform: translateX(105%);
  transition: transform .22s ease;
  z-index: 9999;
  display: flex;
  flex-direction: column;
}

.rr-ml-filter-drawer.is-open{
  transform: translateX(0);
}

.rr-ml-filter-drawer__head{
  padding: 14px 14px;
  border-bottom: 1px solid #eee;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.rr-ml-filter-drawer__title{
  font-size: 14px;
  font-weight: 800;
}

.rr-ml-filter-drawer__close{
  border: 0;
  background: transparent;
  font-size: 18px;
  cursor: pointer;
}

.rr-ml-filter-drawer__body{
  padding: 12px 14px;
  overflow: auto;
  flex: 1;
}

.rr-ml-filter-drawer__foot{
  padding: 12px 14px;
  border-top: 1px solid #eee;
}

.rr-ml-filter-apply{
  width: 100%;
  border: 0;
  background: rgba(200,0,0,1);
  color: #fff;
  border-radius: 10px;
  padding: 12px;
  font-weight: 800;
  cursor: pointer;
}

.rr-ml-lock{
  overflow: hidden !important;
}
/* =========================================================
   RR / Shop & Category (ML look)
   - contenedor NO full width
   - sidebar izquierda
   - cards productos estilo ML (como tus carruseles)
   ========================================================= */

/* 1) Contenedor centrado (mata el full width) */
.rr-archive-wrap{
  max-width: 1200px;     /* ML aprox */
  margin: 0 auto;
  padding: 18px 12px;
}

/* 2) Layout 2 columnas */
.rr-archive-layout{
  display: grid;
  grid-template-columns: 290px 1fr;
  gap: 16px;
}

/* Sidebar filtros */
.rr-archive-filters{
  position: sticky;
  top: 110px;
  align-self: start;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 12px;
  padding: 12px;
}

/* Titulares de widgets */
.rr-ml-filters__title{
  font-size: 14px;
  font-weight: 800;
  margin: 0 0 10px;
}
.rr-ml-filters .widget{
  margin: 0 0 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid #f0f0f0;
}
.rr-ml-filters .widget:last-child{
  border-bottom: 0;
  padding-bottom: 0;
}
.rr-ml-filters .widget-title{
  font-size: 13px;
  font-weight: 800;
  margin: 0 0 8px;
}

/* =========================================================
   3) GRID productos estilo ML (NO full width, 3 columnas)
   ========================================================= */
.rr-archive-products ul.products{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px !important;
  margin: 0 !important;
}

/* Cada item sin márgenes raros del theme */
.rr-archive-products ul.products li.product{
  margin: 0 !important;
  width: auto !important;
}

/* Card */
.rr-archive-products ul.products li.product .woocommerce-loop-product__link{
  display: block;
  background: #fff;
  border: 1px solid #e9e9e9;
  border-radius: 12px;
  overflow: hidden;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.rr-archive-products ul.products li.product .woocommerce-loop-product__link:hover{
  transform: translateY(-2px);
  border-color: #e2e2e2;
  box-shadow: 0 10px 22px rgba(0,0,0,.08);
}

/* Imagen tipo ML (centrada, contenida, no gigante) */
.rr-archive-products ul.products li.product img{
  width: 100%;
  height: 210px;
  object-fit: contain;
  background: #fff;
  padding: 12px;
}

/* Contenido */
.rr-archive-products ul.products li.product .woocommerce-loop-product__title{
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  margin: 10px 12px 8px !important;
  min-height: 36px; /* evita saltos por títulos */
  color: #222;
}

/* Precio principal */
.rr-archive-products ul.products li.product .price{
  margin: 0 12px 10px !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #111 !important;
}

/* Old price (chiquito gris, sin bold) */
.rr-archive-products ul.products li.product .price del{
  font-size: 11px !important;
  color: #9a9a9a !important;
  font-weight: 400 !important;
  opacity: 1 !important;
}
.rr-archive-products ul.products li.product .price ins{
  text-decoration: none !important;
}

/* Botón add to cart si aparece */
.rr-archive-products ul.products li.product a.button{
  margin: 0 12px 12px !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
}

/* =========================================================
   4) Mobile
   ========================================================= */
@media (max-width: 991px){
  .rr-archive-layout{
    grid-template-columns: 1fr;
  }
  .rr-archive-products ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px !important;
  }
  .rr-archive-products ul.products li.product img{
    height: 170px;
  }
}
/* =========================================================
   RR - CATEGORY/SHOP = Mercado Libre style (Desktop + Mobile)
   IGUALITO a la referencia: sidebar izquierda + grilla centrada
   ========================================================= */

/* Fondo general tipo ML */
.woocommerce.archive .site-content,
.woocommerce.archive .page-content,
.woocommerce.archive .content-area{
  background: #f5f5f5 !important;
}

/* Wrapper centrado (mata full width del theme) */
.rr-archive-wrap{
  max-width: 1220px;
  margin: 0 auto;
  padding: 18px 12px 30px;
}

/* Layout: filtros + productos */
.rr-archive-layout{
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 18px;
  align-items: start;
}

/* Sidebar filtros ML */
.rr-archive-filters{
  background: #fff;
  border: 1px solid #eaeaea;
  border-radius: 10px;
  padding: 14px;
  position: sticky;
  top: 110px;
}

/* Título filtros */
.rr-ml-filters__title{
  font-size: 18px;
  font-weight: 800;
  margin: 0 0 12px;
  color: #333;
}

.rr-ml-filters__block{
  padding: 10px 0;
  border-top: 1px solid #f0f0f0;
}
.rr-ml-filters__block:first-of-type{
  border-top: 0;
  padding-top: 0;
}

.rr-ml-filters .widget-title{
  font-size: 13px;
  font-weight: 800;
  margin: 0 0 8px;
  color: #333;
}

.rr-ml-filters ul{
  margin: 0;
  padding: 0;
  list-style: none;
}

.rr-ml-filters li{
  margin: 0 0 8px;
}

.rr-ml-filters a{
  color: #3483fa;
  text-decoration: none;
}
.rr-ml-filters a:hover{
  text-decoration: underline;
}

.rr-ml-filters__hint{
  margin-top: 10px;
  font-size: 12px;
  color: #888;
}

/* =========================================================
   GRID de productos (3 columnas como ML)
   ========================================================= */
.rr-archive-products ul.products{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Quita widths/margenes del theme */
.rr-archive-products ul.products li.product{
  width: auto !important;
  margin: 0 !important;
}

/* Card estilo ML */
.rr-archive-products ul.products li.product .woocommerce-loop-product__link{
  display: block;
  background: #fff;
  border: 1px solid #eaeaea;
  border-radius: 8px;
  overflow: hidden;
  transition: transform .15s ease, box-shadow .15s ease;
}
.rr-archive-products ul.products li.product .woocommerce-loop-product__link:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(0,0,0,.10);
}

/* Imagen grande arriba, tipo ML */
.rr-archive-products ul.products li.product img{
  width: 100% !important;
  height: 250px !important;
  object-fit: contain !important;
  padding: 16px !important;
  background: #fff !important;
}

/* Texto/título como ML */
.rr-archive-products ul.products li.product .woocommerce-loop-product__title{
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #333 !important;
  line-height: 1.25 !important;
  margin: 6px 14px 8px !important;
  min-height: 38px;
}

/* Precio */
.rr-archive-products ul.products li.product .price{
  margin: 0 14px 12px !important;
  font-size: 28px !important;
  font-weight: 800 !important;
  color: #111 !important;
}

/* Old price gris chico (NO toca la línea tachada, sólo el número) */
.rr-archive-products ul.products li.product .price del{
  display: block;
  font-size: 12px !important;
  color: #999 !important;
  font-weight: 400 !important;
  margin-bottom: 4px;
}
.rr-archive-products ul.products li.product .price ins{
  text-decoration: none !important;
}

/* Badge descuento verde estilo ML si aparece */
.rr-archive-products ul.products li.product .onsale{
  background: #00a650 !important;
  color: #fff !important;
  border-radius: 6px !important;
  padding: 4px 8px !important;
  font-weight: 800 !important;
  font-size: 12px !important;
  top: 12px !important;
  left: 12px !important;
}

/* Botón */
.rr-archive-products ul.products li.product a.button{
  margin: 0 14px 14px !important;
  border-radius: 8px !important;
  font-weight: 800 !important;
}

/* =========================================================
   Mobile: 2 columnas y filtros arriba (si querés luego drawer)
   ========================================================= */
@media (max-width: 991px){
  .rr-archive-layout{
    grid-template-columns: 1fr;
  }

  .rr-archive-filters{
    position: relative;
    top: auto;
    order: 1;
  }

  .rr-archive-products{
    order: 2;
  }

  .rr-archive-products ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px !important;
  }

  .rr-archive-products ul.products li.product img{
    height: 180px !important;
    padding: 12px !important;
  }

  .rr-archive-products ul.products li.product .price{
    font-size: 22px !important;
  }
}
/* =========================================================
   RR - ARCHIVE (Shop/Categorías) estilo Mercado Libre
   - achica full width
   - sidebar izquierda
   - cards de producto tipo ML
   ========================================================= */

/* Wrapper general (lo abre functions.php en archives) */
.rr-ml-archive{
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px 16px;
  display: grid;
  grid-template-columns: 270px minmax(0, 1fr);
  gap: 22px;
}

/* Sidebar */
.rr-ml-sidebar{
  background: #fff;
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 14px 14px;
}

.rr-ml-sidebar__title{
  font-weight: 600;
  font-size: 16px;
  margin: 2px 0 10px;
}

.rr-ml-sidebar__sep{
  height: 1px;
  background: #eee;
  margin: 12px 0;
}

/* Widgets Woo (listas) */
.rr-ml-sidebar .widget,
.rr-ml-filter-drawer .widget{
  margin: 0;
}

.rr-ml-sidebar ul{
  list-style: none;
  padding: 0;
  margin: 0;
}

.rr-ml-sidebar ul li{
  padding: 7px 0;
  border-bottom: 1px solid #f2f2f2;
  font-size: 14px;
}

.rr-ml-sidebar ul li:last-child{
  border-bottom: 0;
}

.rr-ml-sidebar a{
  text-decoration: none;
}

.rr-ml-sidebar a:hover{
  text-decoration: underline;
}

/* Resultados */
.rr-ml-results{
  min-width: 0;
}

/* ====== GRID de productos (Minimog usa variables) ====== */
.rr-ml-results .products,
.rr-ml-results ul.products{
  --grid-columns-desktop: 3;
  --grid-columns-tablet: 3;
  --grid-columns-mobile: 2;

  --grid-gutter-desktop: 18px;
  --grid-gutter-tablet: 16px;
  --grid-gutter-mobile: 14px;
}

/* Si el tema ignora variables, igual forzamos un gap lindo */
.rr-ml-results ul.products{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px !important;
}

/* Cards tipo ML */
.rr-ml-results li.product{
  background: #fff !important;
  border: 1px solid #eee !important;
  border-radius: 10px !important;
  overflow: hidden;
  transition: transform .12s ease, box-shadow .12s ease;
}

.rr-ml-results li.product:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(0,0,0,.08);
}

/* Imagen */
.rr-ml-results li.product .woocommerce-LoopProduct-link,
.rr-ml-results li.product a{
  display: block;
}

.rr-ml-results li.product img{
  width: 100% !important;
  height: 240px !important;
  object-fit: contain !important;
  background: #fff;
  padding: 14px !important;
}

/* Info */
.rr-ml-results li.product .price,
.rr-ml-results li.product .woocommerce-loop-product__title,
.rr-ml-results li.product h2,
.rr-ml-results li.product h3{
  padding-left: 14px;
  padding-right: 14px;
}

.rr-ml-results li.product .woocommerce-loop-product__title,
.rr-ml-results li.product h2,
.rr-ml-results li.product h3{
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  margin: 8px 0 4px !important;
  min-height: 36px;
}

/* Precio */
.rr-ml-results li.product .price{
  font-size: 20px !important;
  font-weight: 600 !important;
  margin: 0 0 10px !important;
  padding-bottom: 12px;
}

/* Old price chiquito como pediste (7px, grey) */
.rr-ml-results li.product .price del,
.rr-ml-results li.product del .amount{
  font-size: 7px !important;
  color: #9aa0a6 !important;
  font-weight: 400 !important;
}

/* Sale price */
.rr-ml-results li.product ins,
.rr-ml-results li.product ins .amount{
  text-decoration: none !important;
}

/* ====== Barra Filtrar (mobile) ====== */
.rr-ml-filterbar{
  display: none;
  margin: 10px 0 14px;
}

.rr-ml-filterbtn{
  width: 100%;
  border: 1px solid #e5e5e5;
  background: #fff;
  border-radius: 10px;
  padding: 12px 14px;
  font-weight: 600;
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
}

.rr-ml-filterbtn__icon{
  font-size: 18px;
  line-height: 1;
}

/* ====== Drawer Mobile ====== */
.rr-ml-filter-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  opacity: 0;
  pointer-events: none;
  transition: opacity .15s ease;
  z-index: 9998;
}

.rr-ml-filter-drawer{
  position: fixed;
  top: 0;
  right: 0;
  width: 88%;
  max-width: 380px;
  height: 100vh;
  background: #fff;
  transform: translateX(100%);
  transition: transform .18s ease;
  z-index: 9999;
  display: flex;
  flex-direction: column;
}

.rr-ml-filter-drawer__head{
  padding: 14px 14px;
  border-bottom: 1px solid #eee;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.rr-ml-filter-drawer__title{
  font-weight: 700;
  font-size: 16px;
}

.rr-ml-filter-drawer__close{
  border: 0;
  background: transparent;
  font-size: 18px;
}

.rr-ml-filter-drawer__body{
  padding: 14px 14px;
  overflow: auto;
}

.rr-ml-filter-drawer__foot{
  padding: 12px 14px;
  border-top: 1px solid #eee;
}

.rr-ml-filter-apply{
  width: 100%;
  border: 0;
  border-radius: 10px;
  padding: 12px 14px;
  font-weight: 700;
  background: #3483fa;
  color: #fff;
}

.rr-ml-filter-overlay.is-open{ opacity: 1; pointer-events: auto; }
.rr-ml-filter-drawer.is-open{ transform: translateX(0); }

.rr-ml-lock{ overflow: hidden !important; }

/* ====== Responsive ====== */
@media (max-width: 991px){
  .rr-ml-archive{
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .rr-ml-sidebar{
    display: none; /* en mobile usamos drawer */
  }
  .rr-ml-filterbar{
    display: block;
  }

  .rr-ml-results ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }

  .rr-ml-results li.product img{
    height: 190px !important;
    padding: 10px !important;
  }
}
/* ==============================
   RR ML SHOP LAYOUT
============================== */

/* TOP FULL WIDTH */
.rr-ml-topbar{
  width: 100%;
  background: #fff;
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.rr-ml-topbar__inner{
  max-width: 1180px;
  margin: 0 auto;
  padding: 14px 16px;
}
.rr-ml-topbar__ph{
  height: 110px;
  border-radius: 12px;
  background: rgba(0,0,0,.03);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 13px;
  color: rgba(0,0,0,.55);
}

/* WRAP: sidebar + grid */
.rr-ml-shopwrap{
  max-width: 1180px;
  margin: 0 auto;
  padding: 16px;
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 16px;
  align-items: start;
}

/* Sidebar */
.rr-ml-sidebar{
  position: sticky;
  top: 12px;
}
.rr-ml-filters{
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius: 12px;
  padding: 14px;
}
.rr-ml-filters__title{
  font-weight: 700;
  font-size: 15px;
  margin-bottom: 10px;
}
.rr-ml-filters__block{
  margin: 12px 0;
}
.rr-ml-filters__hint{
  font-size: 12px;
  color: rgba(0,0,0,.6);
  margin-top: 10px;
}

/* Contenido */
.rr-ml-content{ min-width: 0; }

/* Bar "Filtrar" (solo mobile) */
.rr-ml-filterbar{ display:none; }

/* ==============================
   PRODUCT GRID + CARDS (ML STYLE)
============================== */

/* Reduce full width de Woo */
.woocommerce.archive .site-content,
.woocommerce.archive .content,
.woocommerce.archive .container{
  max-width: 100% !important;
}

/* Grid del loop (Woo default) */
.woocommerce ul.products{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
  margin: 0 !important;
}

/* Card estilo ML */
.woocommerce ul.products li.product{
  background:#fff !important;
  border:1px solid rgba(0,0,0,.06) !important;
  border-radius: 12px !important;
  overflow:hidden !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.04) !important;
  padding: 0 !important;
  margin: 0 !important;
}
.woocommerce ul.products li.product:hover{
  box-shadow: 0 10px 24px rgba(0,0,0,.10) !important;
  transform: translateY(-2px);
  transition: .18s ease;
}

/* Imagen centrada y sin “gigante” */
.woocommerce ul.products li.product a img{
  width: 100% !important;
  height: 240px !important;
  object-fit: contain !important;
  padding: 18px !important;
  background: #fff !important;
  margin: 0 !important;
}

/* Info */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size: 14px !important;
  line-height: 1.25 !important;
  padding: 0 14px !important;
  margin: 0 0 8px 0 !important;
  font-weight: 400 !important;
  color: rgba(0,0,0,.85) !important;
  min-height: 36px;
}

/* Precio */
.woocommerce ul.products li.product .price{
  padding: 0 14px 14px 14px !important;
  margin: 0 !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: rgba(0,0,0,.9) !important;
}

/* Old price (chico, gris, sin bold) */
.woocommerce ul.products li.product .price del,
.woocommerce ul.products li.product .price del .amount{
  font-size: 11px !important;
  color: rgba(0,0,0,.45) !important;
  font-weight: 400 !important;
}

/* Ocultar botón add-to-cart en cards si molesta */
.woocommerce ul.products li.product a.button{
  display:none !important;
}

/* ==============================
   RESPONSIVE
============================== */
@media (max-width: 1024px){
  .rr-ml-shopwrap{
    grid-template-columns: 240px 1fr;
  }
  .woocommerce ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 768px){
  .rr-ml-shopwrap{
    grid-template-columns: 1fr;
  }
  .rr-ml-sidebar{
    display:none;
  }
  .rr-ml-filterbar{
    display:flex;
    justify-content:flex-end;
    margin: 10px 0 12px;
  }

  .woocommerce ul.products{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
  .woocommerce ul.products li.product a img{
    height: 180px !important;
    padding: 12px !important;
  }
}

/* ==============================
   DRAWER MOBILE
============================== */
.rr-ml-filterbtn{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  border:1px solid rgba(0,0,0,.15);
  background:#fff;
  padding: 10px 12px;
  border-radius: 10px;
  font-weight: 700;
}
.rr-ml-filter-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  opacity: 0;
  pointer-events: none;
  transition: .18s ease;
  z-index: 9998;
}
.rr-ml-filter-drawer{
  position: fixed;
  top: 0;
  right: 0;
  width: min(92vw, 360px);
  height: 100vh;
  background:#fff;
  transform: translateX(110%);
  transition: .22s ease;
  z-index: 9999;
  display:flex;
  flex-direction: column;
}
.rr-ml-filter-drawer.is-open{ transform: translateX(0); }
.rr-ml-filter-overlay.is-open{
  opacity: 1;
  pointer-events: auto;
}
.rr-ml-filter-drawer__head{
  display:flex;
  align-items:center;
  justify-content: space-between;
  padding: 14px 14px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}
.rr-ml-filter-drawer__body{
  padding: 14px;
  overflow:auto;
  flex: 1;
}
.rr-ml-filter-drawer__foot{
  padding: 12px 14px;
  border-top: 1px solid rgba(0,0,0,.08);
}
.rr-ml-filter-apply{
  width: 100%;
  border: none;
  background: #3483fa;
  color:#fff;
  font-weight: 800;
  padding: 12px 14px;
  border-radius: 10px;
}
.rr-ml-lock{
  overflow:hidden !important;
}
/* =========================================================
   RR / ML - ARCHIVE LAYOUT (TOP + 2 COLS)
   ========================================================= */

.rr-ml-archive {
  width: 100%;
  background: #f5f5f5;
  padding: 16px 0 24px;
}

.rr-ml-archive-top {
  width: 100%;
  padding: 0 16px 14px;
}

.rr-ml-archive-top__inner {
  max-width: 1200px;
  margin: 0 auto;
  background: #fff;
  border-radius: 14px;
  padding: 14px;
  box-shadow: 0 1px 0 rgba(0,0,0,.04);
}

.rr-ml-archive-top__placeholder {
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: #fafafa;
  border: 1px solid #eee;
  color: #6b7280;
  font-size: 13px;
}

/* subcategorías (top) */
.rr-ml-subcats {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.rr-ml-subcat {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 999px;
  background: #f7f7f7;
  border: 1px solid #eee;
  text-decoration: none;
  color: #111;
  font-size: 13px;
}
.rr-ml-subcat:hover { background: #f1f1f1; }
.rr-ml-subcat__dot {
  width: 10px; height: 10px;
  border-radius: 999px;
  background: rgba(200,0,0,.9);
}

/* 2 columnas */
.rr-ml-archive__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 16px;
  padding: 0 16px;
}

.rr-ml-archive__sidebar {
  background: #fff;
  border-radius: 14px;
  padding: 14px;
  box-shadow: 0 1px 0 rgba(0,0,0,.04);
}

.rr-ml-archive__main {
  min-width: 0;
}

.rr-ml-archive__toolbar {
  background: #fff;
  border-radius: 14px;
  padding: 10px 12px;
  margin-bottom: 12px;
  box-shadow: 0 1px 0 rgba(0,0,0,.04);
}

/* =========================================================
   PRODUCT GRID + CARDS (ML STYLE)
   Apunta al loop real de Woo: ul.products li.product
   ========================================================= */

.rr-ml-archive__main ul.products {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px !important;
  margin: 0 !important;
}

@media (max-width: 1100px) {
  .rr-ml-archive__main ul.products { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 900px) {
  .rr-ml-archive__inner { grid-template-columns: 1fr; }
  .rr-ml-archive__sidebar { order: 2; }
  .rr-ml-archive__main { order: 1; }
  .rr-ml-archive__main ul.products { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 520px) {
  .rr-ml-archive__main ul.products { grid-template-columns: 1fr; }
}

/* Card base */
.rr-ml-archive__main ul.products li.product {
  background: #fff !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: 0 1px 0 rgba(0,0,0,.06) !important;
  border: 1px solid #f0f0f0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.rr-ml-archive__main ul.products li.product a.woocommerce-LoopProduct-link {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* Imagen (compacta, ML vibe) */
.rr-ml-archive__main ul.products li.product a img {
  width: 100% !important;
  height: 210px !important;
  object-fit: contain !important;
  padding: 14px !important;
  background: #fff !important;
  margin: 0 !important;
}

/* Nombre */
.rr-ml-archive__main ul.products li.product .woocommerce-loop-product__title {
  font-size: 13px !important;
  line-height: 1.25 !important;
  font-weight: 400 !important;
  padding: 0 12px !important;
  margin: 0 0 8px !important;
  color: #111 !important;
  min-height: 34px;
}

/* Precio wrapper */
.rr-ml-archive__main ul.products li.product .price {
  display: block !important;
  padding: 0 12px 12px !important;
  margin: 0 !important;
}

/* Old price (7px, gris, sin bold) */
.rr-ml-archive__main ul.products li.product .price del,
.rr-ml-archive__main ul.products li.product .price del .amount {
  font-size: 7px !important;
  color: #9aa0a6 !important;
  font-weight: 400 !important;
  opacity: 1 !important;
}

/* Precio principal */
.rr-ml-archive__main ul.products li.product .price ins,
.rr-ml-archive__main ul.products li.product .price ins .amount,
.rr-ml-archive__main ul.products li.product .price > .amount {
  font-size: 22px !important;
  font-weight: 400 !important;
  color: #111 !important;
  text-decoration: none !important;
}

/* Ocultar botón add-to-cart en cards (ML no lo muestra en grid) */
.rr-ml-archive__main ul.products li.product a.button,
.rr-ml-archive__main ul.products li.product .add_to_cart_button {
  display: none !important;
}
/* ================================
   GLOBAL ML TYPOGRAPHY
   ================================ */
:root{
  --ml-font: "Proxima Nova",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}

html, body, button, input, select, textarea{
  font-family: var(--ml-font) !important;
}
/* =========================================
   FIX alineación items del menú principal
   ========================================= */

header nav ul,
header nav ul li,
header nav ul li a {
  display: flex;
  align-items: center;
}

header nav ul {
  gap: 18px; /* opcional, ordena el spacing */
}

header nav ul li {
  height: 100%;
}

header nav ul li a {
  height: 100%;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: normal !important;
}
/* =========================================
   MEGA MENU - MARCAS (estilo ML)
   ========================================= */

.rr-menu-brands{
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
  padding: 14px 16px;
  min-width: 720px;
  max-width: 920px;
}

.rr-brand-item{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  text-decoration: none;
  transition: all .15s ease;
}

.rr-brand-item:hover{
  box-shadow: 0 8px 22px rgba(0,0,0,.10);
  transform: translateY(-1px);
}

.rr-brand-thumb{
  width: 54px;
  height: 54px;
  border-radius: 10px;
  background: #f3f3f3;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}

.rr-brand-thumb img{
  max-width: 80%;
  max-height: 80%;
  object-fit: contain;
}

.rr-brand-ph{
  width: 28px;
  height: 28px;
  border-radius: 6px;
  background: #e5e5e5;
}

.rr-brand-name{
  font-size: 13px;
  font-weight: 700;
  color: #111;
  line-height: 1.2;
}

/* Mobile: que caiga en columnas */
@media (max-width: 900px){
  .rr-menu-brands{
    grid-template-columns: repeat(2, 1fr);
    min-width: auto;
  }
}
/* FIX alineación items menú header */
header nav ul,
header nav ul li,
header nav ul li a{
  display:flex;
  align-items:center;
}

header nav ul li a{
  line-height:normal !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
}
/* ===============================
   MEGA MENU MARCAS
   =============================== */

header nav li { position: relative; }

header nav li .sub-menu{
  min-width: 760px;
  padding: 12px;
}

header nav li .rr-mega-marcas-li > a{
  padding: 0 !important;
  pointer-events: none;
}

header nav li .rr-mega-marcas-li > a::after{
  content: "";
  display: block;
  width: 100%;
}

/* Evita estilos raros del theme */
header nav li .rr-mega-marcas-li{
  background: transparent !important;
}
/* =========================================
   Mega submenu Marcas (panel ancho)
   ========================================= */

.rr-submenu-marcas{
  width: auto;
  min-width: 820px;
  padding: 10px 10px;
}

.rr-submenu-marcas .rr-mega-marcas{
  padding: 0 !important;
}

.rr-submenu-marcas .rr-mega-marcas > a{
  display:none !important; /* por si el theme mete un <a> */
}

/* Si el theme limita el submenu, forzamos visible */
.rr-submenu-marcas{
  overflow: visible;
}
/* =========================================
   Dropdown básico menú principal (Desktop)
   ========================================= */

.ml-links-menu { list-style:none; margin:0; padding:0; }
.ml-links-menu > li { position: relative; }

.ml-links-menu > li > .sub-menu{
  display: none;
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  z-index: 9999;
  background: #fff;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(0,0,0,.12);
  padding: 10px;
}

/* Mostrar al hover */
.ml-links-menu > li:hover > .sub-menu{
  display: block;
}

/* Mega submenu marcas (panel ancho) */
.rr-submenu-marcas{
  min-width: 820px;
  padding: 10px 10px;
}

/* El li que contiene la grilla no debe parecer item normal */
.rr-submenu-marcas .rr-mega-marcas{
  padding: 0 !important;
  margin: 0 !important;
}
/* ===========================
   Marcas dropdown (desktop)
   =========================== */
.rr-brands{ position: relative; }
.rr-brands-btn{
  background: transparent;
  border: 0;
  cursor: pointer;
  font: inherit;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0;
}

.rr-brands-dropdown{
  display:none;
  position:absolute;
  top: calc(100% + 10px);
  left: 0;
  z-index: 9999;
  background: #fff;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(0,0,0,.12);
  padding: 10px;
}

.rr-brands.is-open .rr-brands-dropdown{ display:block; }
/* ===========================
   Marcas dropdown (desktop) FIX
   =========================== */
.rr-brands{ position: relative; }

.rr-brands-btn{
  appearance: none;
  background: transparent !important;
  border: 0 !important;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 !important;
  margin: 0 !important;

  /* 🔥 evita que el theme lo deje invisible */
  font-size: 13px !important;
  line-height: 1 !important;
  color: #111 !important;
  font-weight: 500 !important;
}

.rr-brands-label{
  display: inline-block !important;
  font-size: 13px !important;
  line-height: 1 !important;
  color: #111 !important;
  font-weight: 500 !important;
}

.rr-brands-dropdown{
  display:none;
  position:absolute;
  top: calc(100% + 10px);
  left: 0;
  z-index: 9999;

  background: #fff;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(0,0,0,.12);
  padding: 10px;
}

/* abrir */
.rr-brands.is-open .rr-brands-dropdown{ display:block; }
/* =========================
   RR FOOTER (OnCity style)
   ========================= */
:root{
  --rr-blue: #0b49d1;      /* azul fuerte */
  --rr-blue2: #0a3fb8;     /* variante */
  --rr-red: rgba(200,0,0,1);
  --rr-white: #ffffff;
  --rr-soft: rgba(255,255,255,.85);
  --rr-line: rgba(255,255,255,.22);
}

.rr-footer{
  background: var(--rr-blue);
  color: var(--rr-white);
  padding: 46px 0 18px;
}

.rr-footer__wrap{
  width: min(1240px, calc(100% - 48px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 34px;
  align-items: start;
}

.rr-footer__col--brand{
  min-width: 280px;
}

.rr-footer__logo{
  font-weight: 800;
  letter-spacing: .6px;
  font-size: 30px;
  line-height: 1;
}

.rr-footer__newsletter{
  margin-top: 18px;
}

.rr-footer__news-title{
  font-size: 14px;
  color: var(--rr-soft);
  margin-bottom: 10px;
}

.rr-footer__news-form{
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.18);
  padding: 10px;
  border-radius: 999px;
}

.rr-footer__news-input{
  flex: 1;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--rr-white);
  font-size: 14px;
  padding: 10px 10px;
}

.rr-footer__news-input::placeholder{
  color: rgba(255,255,255,.65);
}

.rr-footer__news-btn{
  border: 0;
  outline: none;
  cursor: pointer;
  padding: 10px 14px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 12px;
  letter-spacing: .3px;
  background: var(--rr-red);
  color: var(--rr-white);
  transition: transform .15s ease, filter .15s ease;
}

.rr-footer__news-btn:hover{
  transform: translateY(-1px);
  filter: brightness(1.05);
}

.rr-footer__social{
  margin-top: 14px;
  display: flex;
  gap: 10px;
  align-items: center;
}

.rr-footer__social-ico{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: var(--rr-white);
  border: 1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.08);
  transition: transform .15s ease, background .15s ease;
  font-weight: 700;
}

.rr-footer__social-ico:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.14);
}

.rr-footer__title{
  font-weight: 800;
  font-size: 14px;
  margin-bottom: 14px;
}

.rr-footer__link{
  display: block;
  text-decoration: none;
  color: rgba(255,255,255,.88);
  font-size: 14px;
  margin: 10px 0;
  transition: color .15s ease;
}

.rr-footer__link:hover{
  color: var(--rr-white);
  text-decoration: underline;
}

.rr-footer__mini{
  margin: 10px 0 12px;
  font-size: 14px;
  color: rgba(255,255,255,.88);
}

.rr-footer__mini-label{
  font-weight: 700;
  margin-bottom: 4px;
}

.rr-footer__link--inline{
  margin: 0;
  display: inline-block;
}

.rr-footer__cta{
  display: inline-block;
  margin-top: 10px;
  text-decoration: none;
  background: #1ee6c7;
  color: #0b1b2a;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .3px;
  padding: 12px 14px;
  border-radius: 10px;
  transition: transform .15s ease, filter .15s ease;
}

.rr-footer__cta:hover{
  transform: translateY(-1px);
  filter: brightness(1.03);
}

.rr-footer__line{
  width: min(1240px, calc(100% - 48px));
  margin: 26px auto 14px;
  height: 1px;
  background: var(--rr-line);
}

.rr-footer__bottom{
  width: min(1240px, calc(100% - 48px));
  margin: 0 auto;
  display: flex;
  justify-content: center;
  padding-bottom: 10px;
}

.rr-footer__dev{
  text-decoration: none;
  color: rgba(255,255,255,.90);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
}

.rr-footer__dev:hover{
  color: var(--rr-white);
}

.rr-footer__dev-badge{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,.20);
  border: 1px solid rgba(255,255,255,.18);
  font-weight: 900;
  letter-spacing: .4px;
}

/* Responsive */
@media (max-width: 980px){
  .rr-footer__wrap{
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px){
  .rr-footer__wrap{
    grid-template-columns: 1fr;
    gap: 22px;
  }
  .rr-footer{
    padding: 36px 0 14px;
  }
}
:root{
  --rr-red: rgba(200,0,0,1);
  --rr-red2: rgba(170,0,0,1);
  --rr-white: #ffffff;
  --rr-soft: rgba(255,255,255,.86);
  --rr-line: rgba(255,255,255,.22);
}

.rr-footer{
  background: var(--rr-red);
  color: var(--rr-white);
  padding: 46px 0 18px;
}

/* Más prolijo tipo OnCity: centrado y con ancho consistente */
.rr-footer__wrap{
  width: min(1240px, calc(100% - 48px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 420px 1fr 1fr 1fr; /* fija columna izquierda para que NO desbalancee */
  gap: 34px;
  align-items: start;
}

.rr-footer__brand{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.rr-footer__logo-img{
  height: 34px;
  width: auto;
  display: block;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,.25));
}

/* Newsletter alineado, que no “flote” */
.rr-footer__newsletter{
  margin-top: 14px;
  max-width: 380px; /* evita que quede gigante y descentrado */
}

.rr-footer__news-title{
  font-size: 14px;
  color: var(--rr-soft);
  margin-bottom: 10px;
}

.rr-footer__news-form{
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.22);
  padding: 10px;
  border-radius: 999px;
  max-width: 380px;
}

.rr-footer__news-input{
  flex: 1;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--rr-white);
  font-size: 14px;
  padding: 10px 10px;
}

.rr-footer__news-input::placeholder{
  color: rgba(255,255,255,.72);
}

/* Botón ahora se ve “RR” pero prolijo */
.rr-footer__news-btn{
  border: 0;
  outline: none;
  cursor: pointer;
  padding: 10px 14px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .3px;
  background: rgba(255,255,255,.18);
  color: var(--rr-white);
  transition: transform .15s ease, background .15s ease;
  white-space: nowrap;
}

.rr-footer__news-btn:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.25);
}

/* Redes un toque más prolijas sobre rojo */
.rr-footer__social-ico{
  border: 1px solid rgba(255,255,255,.28);
  background: rgba(0,0,0,.10);
}

/* Línea + bottom */
.rr-footer__line{
  width: min(1240px, calc(100% - 48px));
  margin: 26px auto 14px;
  height: 1px;
  background: var(--rr-line);
}

/* Responsive */
@media (max-width: 980px){
  .rr-footer__wrap{
    grid-template-columns: 1fr 1fr;
  }
  .rr-footer__newsletter,
  .rr-footer__news-form{
    max-width: 100%;
  }
}

@media (max-width: 640px){
  .rr-footer__wrap{
    grid-template-columns: 1fr;
    gap: 22px;
  }
}
/* Old price (tachado) estilo ML: chico, gris, sin bold y tachado centrado */
.ml-old-price{
  font-size: 11px;
  line-height: 1.1;
  font-weight: 400;
  color: rgba(255,255,255,.55); /* si está sobre fondos oscuros */
  /* si está sobre blanco, usá esto en lugar del de arriba:
  color: rgba(0,0,0,.45);
  */
  text-decoration: line-through;
  text-decoration-thickness: 1px;
  text-decoration-color: currentColor;
  text-decoration-skip-ink: none;
  opacity: .85; /* “que desaparezca” un poco */
}

/* Si Woo mete <del> adentro (a veces pasa), lo normalizamos */
.ml-old-price del,
.ml-old-price del *{
  color: inherit !important;
  font-weight: 400 !important;
  text-decoration: line-through !important;
  text-decoration-color: currentColor !important;
}
/* =========================================================
   FIX: Swiper mostrando 1 producto por slide (pisado por tema)
   Forzamos comportamiento de Swiper en nuestros carruseles ML
   ========================================================= */

.ml-carousel .swiper,
.ml-offers-block .swiper,
.ml-cat-carousel .swiper,
.ml-bubbles .swiper,
.ml-cats-block .swiper {
  overflow: hidden;
}

.ml-carousel .swiper-wrapper,
.ml-offers-block .swiper-wrapper,
.ml-cat-carousel .swiper-wrapper,
.ml-bubbles .swiper-wrapper,
.ml-cats-block .swiper-wrapper {
  display: flex !important;
}

.ml-carousel .swiper-slide,
.ml-offers-block .swiper-slide,
.ml-cat-carousel .swiper-slide,
.ml-bubbles .swiper-slide,
.ml-cats-block .swiper-slide {
  width: auto !important;      /* <- clave: evita el 100% del tema */
  flex-shrink: 0 !important;
}

/* Asegura que la card no fuerce ancho raro */
.ml-carousel .ml-card,
.ml-offers-block .ml-card,
.ml-cat-carousel .ml-card {
  width: 100%;
}
/* =========================================================
   Old price: gris, chiquito, sin bold, tachado prolijo
   ========================================================= */

.ml-old-price {
  font-size: 7px !important;
  color: #9aa0a6 !important;
  font-weight: 400 !important;
  line-height: 1.1 !important;
  margin-bottom: 2px;
  text-decoration-line: line-through !important;
  text-decoration-thickness: 1px !important;
  text-decoration-color: currentColor !important;
}

.ml-old-price * {
  color: #9aa0a6 !important;
  font-weight: 400 !important;
  text-decoration: none !important; /* evita doble tachado si Woo mete <del> */
}
/* =========================================================
   FIX DEFINITIVO: carruseles mostrando 1 slide
   Fuerza el ancho de slides por CSS (ignora pisadas del tema)
   ========================================================= */

/* wrappers */
.ml-carousel .swiper-wrapper,
.ml-offers-block .swiper-wrapper,
.ml-cat-carousel .swiper-wrapper,
.ml-bubbles .swiper-wrapper,
.ml-cats-block .swiper-wrapper{
  display:flex !important;
}

/* BASE: 2 por vista en mobile */
body .ml-carousel .swiper-slide,
body .ml-offers-block .ml-swiper-offers .swiper-slide,
body .ml-cat-carousel .swiper-slide{
  flex: 0 0 calc((100% - 12px) / 2) !important;
  width: calc((100% - 12px) / 2) !important;
  max-width: calc((100% - 12px) / 2) !important;
}

/* Desktop: 4 por vista */
@media (min-width: 768px){
  body .ml-carousel .swiper-slide,
  body .ml-offers-block .ml-swiper-offers .swiper-slide{
    flex: 0 0 calc((100% - 60px) / 4) !important;
    width: calc((100% - 60px) / 4) !important;
    max-width: calc((100% - 60px) / 4) !important;
  }

  /* Carrusel por categoría: 6 por vista */
  body .ml-cat-carousel .swiper-slide{
    flex: 0 0 calc((100% - 100px) / 6) !important;
    width: calc((100% - 100px) / 6) !important;
    max-width: calc((100% - 100px) / 6) !important;
  }
}

/* Asegura que no haya overflow raro */
.ml-carousel .swiper,
.ml-offers-block .swiper,
.ml-cat-carousel .swiper{
  overflow:hidden;
}
/* Asegura que cada slide no se estire y la card quede normal */
.swiper-slide { height: auto; }
.ml-card { display:block; height:100%; }
.ml-img img { display:block; max-width:100%; height:auto; }
/* ==========================
   FIX Swiper RR - sin media card + flechas clickeables
   ========================== */

/* Recorta todo lo que se sale del carrusel */
.ml-carousel .swiper,
.ml-offers-right .swiper,
.ml-cat-carousel .swiper,
.ml-cats-block .swiper {
  overflow: hidden !important;
}

/* Reseteo de wrapper/slide por si el tema metió cosas raras */
.ml-carousel .swiper-wrapper,
.ml-offers-right .swiper-wrapper,
.ml-cat-carousel .swiper-wrapper,
.ml-cats-block .swiper-wrapper {
  display: flex !important;
  align-items: stretch !important;
}

/* MUY importante: que Swiper controle el ancho, NO el CSS del tema */
.ml-carousel .swiper-slide,
.ml-offers-right .swiper-slide,
.ml-cat-carousel .swiper-slide,
.ml-cats-block .swiper-slide {
  flex: 0 0 auto !important;
  width: auto !important;
  height: auto !important;
}

/* Flechas arriba de todo y clickeables */
.ml-arrow,
.ml-carousel .swiper-button-next,
.ml-carousel .swiper-button-prev,
.ml-offers-right .swiper-button-next,
.ml-offers-right .swiper-button-prev,
.ml-cat-carousel .swiper-button-next,
.ml-cat-carousel .swiper-button-prev,
.ml-cats-block .swiper-button-next,
.ml-cats-block .swiper-button-prev {
  z-index: 50 !important;
  pointer-events: auto !important;
}

/* Si algún contenedor encima está “tapando” el click */
.ml-carousel,
.ml-offers-right,
.ml-cat-carousel,
.ml-cats-block {
  position: relative;
}
/* ===== SWIPER FIX: evitar media tarjeta y flechas clickeables ===== */
.ml-swiper,
.ml-swiper-offers,
.ml-cats-swiper,
.ml-swiper-cat,
.ml-bubbles-swiper {
  overflow: hidden; /* clave: evita el “corte” raro */
}

.swiper-button-next,
.swiper-button-prev {
  z-index: 50;
  pointer-events: auto;
}

/* Por si algún contenedor está “tapando” las flechas */
.ml-carousel,
.ml-offers-block,
.ml-cat-carousel,
.ml-cats-block {
  position: relative;
}

/* Swiper necesita esto para layout correcto */
.swiper-wrapper {
  box-sizing: border-box;
}
.swiper-slide {
  box-sizing: border-box;
}
/* Old price (tachado) estilo ML: más chico, gris y línea al medio */
.ml-old-price {
  color: #9aa0a6;
  font-size: 7px;
  font-weight: 400;
  line-height: 1;
  text-decoration: line-through;
  text-decoration-thickness: 1px;
  text-decoration-color: #9aa0a6;
  text-decoration-skip-ink: none;
  margin-top: 2px;
}

/* =========================================================
   PATCH v2: asegurar menú mobile vertical (evitar herencia del theme padre)
   ========================================================= */
@media (max-width: 991px){
  .rr-mob-menu{ display:block !important; }
  .rr-mob-menu > li{ display:block !important; }
  .rr-mob-menu > li > a{ display:block !important; }
}
/* =========================
   v2.header - MOBILE CATS DRILLDOWN (slide)
   ========================= */
.rr-mob-section--cats{ position: relative; }

.rr-mob-drill{
  margin-top: 10px;
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.08);
  display: none;
}

.rr-mob-drill.is-open{ display: block; }

.rr-mob-drill-top{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}

.rr-mob-drill-title{
  flex: 1;
  font-weight: 700;
  font-size: 14px;
}

.rr-mob-drill-back,
.rr-mob-drill-close{
  border: 0;
  background: transparent;
  font-size: 18px;
  line-height: 1;
  padding: 6px 8px;
  cursor: pointer;
}

.rr-mob-drill-viewport{
  width: 100%;
  overflow: hidden;
}

.rr-mob-drill-track{
  display: flex;
  width: 100%;
  transition: transform .28s ease;
  transform: translateX(0);
}

.rr-mob-drill-panel{
  width: 100%;
  flex: 0 0 100%;
  padding: 8px 10px;
}

.rr-mob-drill-list{
  list-style: none;
  margin: 0;
  padding: 0;
}

.rr-mob-drill-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 10px;
}

.rr-mob-drill-link{
  display: block;
  flex: 1;
  padding: 12px 10px;
  text-decoration: none;
  color: #1f2937;
  font-size: 14px;
}

.rr-mob-drill-next{
  width: 40px;
  height: 40px;
  border: 0;
  background: transparent;
  font-size: 18px;
  cursor: pointer;
  opacity: .7;
}

.rr-mob-drill-row:hover{
  background: rgba(0,0,0,.04);
}
/* v2.header - FIX dropdown categorias DESKTOP (vertical + submenu lateral) */
.ml-categories-dropdown ul,
.ml-categories-dropdown li{
  display: block !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
}

.ml-categories-dropdown .ml-cat-root{
  display: block !important;
}

.ml-categories-dropdown .ml-cat-root > li{
  display: block !important;
  position: relative !important;
}

/* submenú lateral */
.ml-categories-dropdown .ml-cat-sub{ display:none; }
.ml-categories-dropdown .ml-cat-root > li.has-children:hover > .ml-cat-sub{
  display:block !important;
}
/* v2.header - MOBILE CATS DRILLDOWN (slide) */
.rr-mob-section--cats{ position: relative; }

.rr-mob-drill{
  margin-top: 10px;
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.08);
  display: none;
}
.rr-mob-drill.is-open{ display: block; }

.rr-mob-drill-top{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}
.rr-mob-drill-title{
  flex: 1;
  font-weight: 700;
  font-size: 14px;
}
.rr-mob-drill-back,
.rr-mob-drill-close{
  border: 0;
  background: transparent;
  font-size: 18px;
  line-height: 1;
  padding: 6px 8px;
  cursor: pointer;
}

.rr-mob-drill-viewport{ width: 100%; overflow: hidden; }
.rr-mob-drill-track{
  display: flex;
  width: 100%;
  transition: transform .28s ease;
  transform: translateX(0);
}
.rr-mob-drill-panel{
  width: 100%;
  flex: 0 0 100%;
  padding: 8px 10px;
}

.rr-mob-drill-list{ list-style: none; margin: 0; padding: 0; }

.rr-mob-drill-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 10px;
}
.rr-mob-drill-link{
  display: block;
  flex: 1;
  padding: 12px 10px;
  text-decoration: none;
  color: #1f2937;
  font-size: 14px;
}
.rr-mob-drill-next{
  width: 40px;
  height: 40px;
  border: 0;
  background: transparent;
  font-size: 18px;
  cursor: pointer;
  opacity: .7;
}
.rr-mob-drill-row:hover{ background: rgba(0,0,0,.04); }
/* v2.header - FIX: submenú 2 SOLO con hover (por si queda siempre abierto) */
.ml-categories-dropdown .ml-cat-sub{
  display: none !important;
}
.ml-categories-dropdown .ml-cat-root > li.has-children:hover > .ml-cat-sub{
  display: block !important;
}