/* ============================================================
   V82.31 — Barra inferior móvil compacta: Cupones | Ofertazo | Más
   Iconos vectoriales + textos HTML editables.
   ============================================================ */

.barra-navegacion-inferior,
.menu-mas-panel-inferior {
  display: none;
}

@media (max-width: 700px) {
  :root {
    --barra-inferior-alto: 56px;
  }

  body {
    padding-bottom: calc(var(--barra-inferior-alto) + env(safe-area-inset-bottom) + 6px) !important;
  }

  .barra-navegacion-inferior {
    position: fixed;
    z-index: 24980;
    left: 0;
    right: 0;
    bottom: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    width: 100%;
    min-height: var(--barra-inferior-alto);
    padding: 1px max(8px, env(safe-area-inset-right)) env(safe-area-inset-bottom) max(8px, env(safe-area-inset-left));
    background: rgba(255, 255, 255, .98);
    border-top: 1px solid #e7e7e7;
    box-shadow: 0 -2px 9px rgba(0, 0, 0, .06);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }

  .barra-inferior-item {
    appearance: none;
    -webkit-appearance: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    min-width: 0;
    min-height: 52px;
    padding: 1px 6px 2px;
    margin: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #313131;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }

  .barra-inferior-icono {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 39px;
    height: 34px;
    flex: 0 0 34px;
    pointer-events: none;
  }

  .barra-inferior-icono svg {
    display: block;
    width: 39px;
    height: 34px;
    overflow: visible;
  }

  .barra-inferior-icono-mas {
    width: 32px;
    color: #454545;
  }

  .barra-inferior-icono-mas svg {
    width: 30px;
    height: 30px;
    filter: drop-shadow(0 1px 1px rgba(0,0,0,.18));
  }

  .barra-inferior-texto {
    display: block;
    max-width: 100%;
    margin: -1px 0 0;
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: 400;
    line-height: 12px;
    letter-spacing: 0;
    white-space: nowrap;
    color: #252525;
    pointer-events: none;
  }

  .barra-inferior-item.activo,
  .barra-inferior-item[aria-expanded="true"] {
    background: #fafafa;
  }

  .barra-inferior-item:active {
    background: #f3f3f3;
  }

  .barra-inferior-item:focus-visible {
    outline: 2px solid #3483fa;
    outline-offset: -3px;
  }

  /* Menú contextual de la nueva opción Más. */
  .menu-mas-panel-inferior {
    position: fixed;
    z-index: 24990;
    right: 10px;
    bottom: calc(var(--barra-inferior-alto) + env(safe-area-inset-bottom) + 8px);
    display: grid;
    width: min(315px, calc(100vw - 20px));
    padding: 5px;
    background: rgba(255, 255, 255, .985);
    border: 1px solid #dedede;
    border-radius: 15px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
    overflow: visible;
  }

  .menu-mas-panel-inferior[hidden] {
    display: none !important;
  }

  .menu-mas-panel-inferior::after {
    content: "";
    position: absolute;
    right: calc(16.666vw - 7px);
    bottom: -7px;
    width: 13px;
    height: 13px;
    background: #fff;
    border-right: 1px solid #dedede;
    border-bottom: 1px solid #dedede;
    transform: rotate(45deg);
  }

  .menu-mas-opcion-inferior {
    appearance: none;
    -webkit-appearance: none;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 58px;
    padding: 8px 10px;
    border: 0;
    border-radius: 11px;
    background: transparent;
    color: #222;
    text-align: left;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }

  .menu-mas-opcion-inferior + .menu-mas-opcion-inferior {
    border-top: 1px solid #ececec;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }

  .menu-mas-opcion-inferior:active {
    background: #f6f6f6;
  }

  .menu-mas-opcion-inferior.activo {
    background: #fffbea;
  }

  .menu-mas-icono-inferior {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
  }

  .menu-mas-icono-inferior svg {
    display: block;
    width: 34px;
    height: 34px;
  }

  .menu-mas-contenido-inferior {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
  }

  .menu-mas-contenido-inferior strong {
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 17px;
    color: #181818;
  }

  .menu-mas-contenido-inferior small {
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    font-size: 11.5px;
    font-weight: 400;
    line-height: 15px;
    color: #666;
  }

  /* El acceso flotante WhatsApp permanece por encima de la nueva barra. */
  .whatsapp-flotante {
    bottom: calc(var(--barra-inferior-alto) + 10px + env(safe-area-inset-bottom)) !important;
  }

  /* El botón Más flotante anterior deja de existir visualmente aunque quede CSS legado. */
  .menu-mas-flotante,
  .boton-mas-flotante {
    display: none !important;
  }
}

@media (max-width: 380px) {
  :root {
    --barra-inferior-alto: 53px;
  }

  .barra-inferior-item {
    min-height: 49px;
    padding-top: 0;
  }

  .barra-inferior-icono {
    width: 36px;
    height: 31px;
    flex-basis: 31px;
  }

  .barra-inferior-icono svg {
    width: 36px;
    height: 31px;
  }

  .barra-inferior-icono-mas svg {
    width: 27px;
    height: 27px;
  }

  .barra-inferior-texto {
    font-size: 10.5px;
    line-height: 11px;
  }

  .menu-mas-panel-inferior {
    right: 7px;
    width: min(294px, calc(100vw - 14px));
  }

  .menu-mas-opcion-inferior {
    min-height: 54px;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 8px;
    padding: 7px 8px;
  }

  .menu-mas-icono-inferior,
  .menu-mas-icono-inferior svg {
    width: 31px;
    height: 31px;
  }

  .menu-mas-contenido-inferior strong {
    font-size: 13px;
    line-height: 16px;
  }

  .menu-mas-contenido-inferior small {
    font-size: 11px;
    line-height: 14px;
  }
}

/* ============================================================
   V82.33 — La barra inferior también está disponible en WEB.
   En escritorio conserva un ancho compacto y centrado.
   ============================================================ */
@media (min-width: 701px) {
  :root {
    --barra-inferior-alto-web: 58px;
    --barra-inferior-ancho-web: 420px;
  }

  body {
    padding-bottom: 78px !important;
  }

  .barra-navegacion-inferior {
    position: fixed;
    z-index: 24980;
    left: 50%;
    right: auto;
    bottom: 12px;
    transform: translateX(-50%);
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    width: min(var(--barra-inferior-ancho-web), calc(100vw - 32px));
    min-height: var(--barra-inferior-alto-web);
    padding: 2px 10px;
    background: rgba(255, 255, 255, .985);
    border: 1px solid #e1e1e1;
    border-radius: 17px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, .12);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }

  .barra-inferior-item {
    appearance: none;
    -webkit-appearance: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    min-width: 0;
    min-height: 52px;
    padding: 1px 8px 2px;
    margin: 0;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #313131;
    cursor: pointer;
  }

  .barra-inferior-icono {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 39px;
    height: 34px;
    flex: 0 0 34px;
    pointer-events: none;
  }

  .barra-inferior-icono svg {
    display: block;
    width: 39px;
    height: 34px;
    overflow: visible;
  }

  .barra-inferior-icono-mas,
  .barra-inferior-icono-mas svg {
    width: 30px;
    height: 30px;
  }

  .barra-inferior-texto {
    display: block;
    margin-top: -1px;
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-weight: 400;
    line-height: 12px;
    white-space: nowrap;
    color: #252525;
    pointer-events: none;
  }

  .barra-inferior-item:hover,
  .barra-inferior-item.activo,
  .barra-inferior-item[aria-expanded="true"] {
    background: #f7f7f7;
  }

  .barra-inferior-item:focus-visible {
    outline: 2px solid #3483fa;
    outline-offset: -3px;
  }

  .menu-mas-panel-inferior {
    position: fixed;
    z-index: 24990;
    right: calc(50% - (var(--barra-inferior-ancho-web) / 2));
    bottom: 78px;
    display: grid;
    width: 315px;
    padding: 5px;
    background: rgba(255, 255, 255, .99);
    border: 1px solid #dedede;
    border-radius: 15px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
  }

  .menu-mas-panel-inferior[hidden] {
    display: none !important;
  }

  .menu-mas-opcion-inferior {
    appearance: none;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 58px;
    padding: 8px 10px;
    border: 0;
    border-radius: 11px;
    background: transparent;
    color: #222;
    text-align: left;
    cursor: pointer;
  }

  .menu-mas-opcion-inferior + .menu-mas-opcion-inferior {
    border-top: 1px solid #ececec;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }

  .menu-mas-opcion-inferior:hover {
    background: #f6f6f6;
  }

  .menu-mas-icono-inferior {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
  }

  .menu-mas-icono-inferior svg {
    display: block;
    width: 34px;
    height: 34px;
  }

  .menu-mas-contenido-inferior {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
  }

  .menu-mas-contenido-inferior strong {
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 17px;
    color: #181818;
  }

  .menu-mas-contenido-inferior small {
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    font-size: 11.5px;
    line-height: 15px;
    color: #666;
  }

  .whatsapp-flotante {
    bottom: 18px !important;
  }

  .menu-mas-flotante,
  .boton-mas-flotante {
    display: none !important;
  }
}



/* ============================================================
   V82.43 — Estado activo inferior igual al selector superior
   ============================================================ */
.barra-navegacion-inferior .barra-inferior-item.activo,
.barra-navegacion-inferior .barra-inferior-item[aria-expanded="true"] {
  background: #fafafa !important;
  box-shadow: none !important;
}
.barra-navegacion-inferior .barra-inferior-item.activo .barra-inferior-texto,
.barra-navegacion-inferior .barra-inferior-item[aria-expanded="true"] .barra-inferior-texto {
  color: inherit !important;
  font-weight: inherit !important;
}
.barra-navegacion-inferior .barra-inferior-item.activo .barra-inferior-icono,
.barra-navegacion-inferior .barra-inferior-item[aria-expanded="true"] .barra-inferior-icono {
  transform: none !important;
  filter: none !important;
}

/* ============================================================
   V82.84 — Contador llamativo de productos en Ofertazo
   ============================================================ */
@media (max-width: 700px) {
  #barra-inferior-ofertazo {
    position: relative;
    overflow: visible;
  }

  .barra-inferior-notificacion-ofertazo {
    position: absolute;
    top: 1px;
    left: calc(50% + 14px);
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border: 2px solid #fff;
    border-radius: 999px;
    background: #e53935;
    color: #fff;
    box-shadow: 0 2px 7px rgba(229, 57, 53, .36);
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    pointer-events: none;
    transform-origin: center;
    animation: ofertazo-notificacion-parpadeo 1.15s ease-in-out infinite;
  }

  .barra-inferior-notificacion-ofertazo[hidden] {
    display: none !important;
  }

  @keyframes ofertazo-notificacion-parpadeo {
    0%, 100% {
      opacity: 1;
      transform: scale(1);
      box-shadow: 0 2px 7px rgba(229, 57, 53, .36), 0 0 0 0 rgba(229, 57, 53, .28);
    }
    48% {
      opacity: .52;
      transform: scale(.90);
      box-shadow: 0 2px 7px rgba(229, 57, 53, .18), 0 0 0 6px rgba(229, 57, 53, 0);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .barra-inferior-notificacion-ofertazo {
      animation: none;
    }
  }
}


/* ============================================================
   V82.85 — Notificación Ofertazo también en WEB
   Conserva el mismo badge rojo parpadeante usado en móvil.
   ============================================================ */
@media (min-width: 701px) {
  #barra-inferior-ofertazo {
    position: relative;
    overflow: visible;
  }

  .barra-inferior-notificacion-ofertazo {
    position: absolute;
    top: 1px;
    left: calc(50% + 14px);
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border: 2px solid #fff;
    border-radius: 999px;
    background: #e53935;
    color: #fff;
    box-shadow: 0 2px 7px rgba(229, 57, 53, .36);
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    pointer-events: none;
    transform-origin: center;
    animation: ofertazo-notificacion-parpadeo-web 1.15s ease-in-out infinite;
  }

  .barra-inferior-notificacion-ofertazo[hidden] {
    display: none !important;
  }

  @keyframes ofertazo-notificacion-parpadeo-web {
    0%, 100% {
      opacity: 1;
      transform: scale(1);
      box-shadow: 0 2px 7px rgba(229, 57, 53, .36), 0 0 0 0 rgba(229, 57, 53, .28);
    }
    48% {
      opacity: .52;
      transform: scale(.90);
      box-shadow: 0 2px 7px rgba(229, 57, 53, .18), 0 0 0 6px rgba(229, 57, 53, 0);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .barra-inferior-notificacion-ofertazo {
      animation: none;
    }
  }
}

/* ============================================================
   V82.86 — Acceso destacado a Anirona dentro de “Más”
   ============================================================ */
@media (max-width: 700px) {
  .menu-mas-panel-inferior {
    right: 10px;
    width: min(360px, calc(100vw - 20px));
    padding: 8px;
  }

  .menu-mas-cabecera-inferior {
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding: 2px 8px 8px;
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    font-size: 15px;
    color: #181818;
  }

  .menu-mas-arrastre-inferior {
    align-self: center;
    width: 34px;
    height: 4px;
    border-radius: 999px;
    background: #d0d0d0;
  }

  .menu-mas-anirona-inferior {
    appearance: none;
    -webkit-appearance: none;
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 112px;
    margin: 0 0 5px;
    padding: 10px 12px;
    overflow: hidden;
    border: 1px solid #42b91f;
    border-radius: 14px;
    /* V82.88 — Zona blanca para el logo y transición hacia negro en el contenido */
    background: linear-gradient(90deg, #ffffff 0%, #ffffff 27%, #ededed 34%, #777777 43%, #171717 52%, #080808 100%);
    color: #fff;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(0,0,0,.12);
    -webkit-tap-highlight-color: transparent;
  }

  .menu-mas-anirona-inferior:active { transform: scale(.99); }

  .menu-mas-anirona-inferior img {
    display: block;
    width: 108px;
    max-height: 90px;
    object-fit: contain;
  }

  .menu-mas-anirona-contenido {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    min-width: 0;
  }

  .menu-mas-anirona-contenido strong {
    font: 700 15px/18px 'Inter', Arial, Helvetica, sans-serif;
    color: #72db36;
  }

  .menu-mas-anirona-contenido small {
    font: 400 11.5px/15px 'Inter', Arial, Helvetica, sans-serif;
    color: #f2f2f2;
  }

  .menu-mas-anirona-accion {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    margin-top: 5px;
    padding: 6px 12px;
    border-radius: 999px;
    background: #2dcc4f;
    color: #fff;
    font: 700 11.5px/14px 'Inter', Arial, Helvetica, sans-serif;
  }
}

@media (max-width: 380px) {
  .menu-mas-anirona-inferior {
    grid-template-columns: 92px minmax(0, 1fr);
    min-height: 102px;
  }
  .menu-mas-anirona-inferior img { width: 90px; }
}

/* ============================================================
   V82.89 / Paquete 3.8 — Logo Anirona transparente + ajuste WEB
   ============================================================ */
@media (min-width: 701px) {
  .menu-mas-panel-inferior {
    box-sizing: border-box;
    width: min(380px, calc(100vw - 32px));
    max-width: calc(100vw - 32px);
    overflow: hidden;
  }

  .menu-mas-anirona-inferior {
    appearance: none;
    -webkit-appearance: none;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: 118px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: 112px;
    margin: 0 0 5px;
    padding: 10px 12px;
    overflow: hidden;
    border: 1px solid #42b91f;
    border-radius: 14px;
    background: linear-gradient(90deg, #fff 0%, #fff 31%, #e9e9e9 36%, #656565 44%, #151515 52%, #080808 100%);
    color: #fff;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(0,0,0,.12);
  }

  .menu-mas-anirona-inferior img {
    display: block;
    width: 112px;
    max-width: 100%;
    height: auto;
    max-height: 82px;
    object-fit: contain;
  }

  .menu-mas-anirona-contenido {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .menu-mas-anirona-contenido strong {
    font: 700 15px/18px 'Inter', Arial, Helvetica, sans-serif;
    color: #72db36;
  }

  .menu-mas-anirona-contenido small {
    font: 400 11.5px/15px 'Inter', Arial, Helvetica, sans-serif;
    color: #f2f2f2;
  }

  .menu-mas-anirona-accion {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    margin-top: 5px;
    padding: 6px 12px;
    border-radius: 999px;
    background: #2dcc4f;
    color: #fff;
    font: 700 11.5px/14px 'Inter', Arial, Helvetica, sans-serif;
    white-space: nowrap;
  }
}

@media (max-width: 700px) {
  .menu-mas-anirona-inferior img {
    height: auto;
    filter: none;
  }
}

/* ============================================================
   V82.90 / Paquete 3.9 — Menú Más organizado + Anirona negro
   ============================================================ */
.menu-mas-anirona-inferior {
  background: #080808 !important;
  border-color: #42b91f !important;
}

.menu-mas-anirona-inferior img {
  background: transparent !important;
}

.menu-mas-anirona-contenido strong {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.menu-mas-cocodrilo {
  display: inline-block;
  font-size: 1.05em;
  line-height: 1;
  transform: translateY(-1px);
}

.menu-mas-guia-cupones {
  box-sizing: border-box;
  width: 100%;
  margin: 5px 0;
  padding: 11px 12px 12px;
  border: 1px solid #e6e6e6;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 2px 9px rgba(0,0,0,.05);
  color: #202020;
}

.menu-mas-guia-encabezado {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  font-family: 'Inter', Arial, Helvetica, sans-serif;
}

.menu-mas-guia-encabezado > strong {
  font-size: 14px;
  line-height: 18px;
  font-weight: 700;
}

.menu-mas-guia-icono {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  border-radius: 50%;
  background: #ffd21a;
  color: #222;
  font: 800 14px/1 'Inter', Arial, Helvetica, sans-serif;
}

.menu-mas-guia-pasos {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.menu-mas-guia-pasos li {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: start;
  gap: 7px;
}

.menu-mas-guia-pasos li > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin-top: 1px;
  border-radius: 50%;
  background: #39a915;
  color: #fff;
  font: 700 10px/1 'Inter', Arial, Helvetica, sans-serif;
}

.menu-mas-guia-pasos p {
  margin: 0;
  color: #353535;
  font: 400 11px/15px 'Inter', Arial, Helvetica, sans-serif;
}

.menu-mas-guia-pasos p strong { font-weight: 700; }

.menu-mas-tutorial-completo {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  min-height: 36px;
  margin-top: 10px;
  padding: 8px 12px;
  border: 0;
  border-radius: 9px;
  background: #ffe000;
  color: #171717;
  font: 700 11.5px/15px 'Inter', Arial, Helvetica, sans-serif;
  cursor: pointer;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.08);
}

.menu-mas-tutorial-completo:active { transform: scale(.99); }

.menu-mas-avisos-destacado {
  margin-top: 1px;
  border: 1px solid #ececec !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 2px 9px rgba(0,0,0,.05);
}

.menu-mas-avisos-destacado.activo { background: #fffbea !important; }

.whatsapp-flotante {
  transition: bottom .24s ease, transform .24s ease, width .2s ease, border-radius .2s ease !important;
}

/* Botón de regreso de Anirona con el lenguaje visual de Todos/Tienda/Bancario. */
.selector-regreso-cupones {
  display: flex;
  justify-content: flex-start;
  width: 100%;
  margin: 0 0 12px;
  padding: 0;
  border: 0;
  border-bottom: 1px solid #e7e9eb;
  background: transparent;
}

.tab-regreso-cupones-anirona {
  appearance: none;
  -webkit-appearance: none;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 128px;
  min-height: 44px;
  margin: 0;
  padding: 1px 8px 4px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #222;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.tab-regreso-cupones-anirona::after {
  content: "";
  position: absolute;
  left: 25%;
  right: 25%;
  bottom: -1px;
  height: 3px;
  border-radius: 999px;
  background: #0aa84f;
}

.tab-regreso-icono {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: #08aa4b;
}

.tab-regreso-icono svg {
  width: 22px;
  height: 22px;
}

.tab-regreso-texto {
  margin-top: 1px;
  font: 400 10px/1 Arial, Helvetica, sans-serif;
  white-space: nowrap;
}

.tab-regreso-cupones-anirona:hover,
.tab-regreso-cupones-anirona:focus-visible {
  background: #fafafa;
  outline: none;
}

@media (max-width: 700px) {
  .menu-mas-panel-inferior {
    max-height: calc(100dvh - var(--barra-inferior-alto) - 28px);
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .menu-mas-anirona-inferior {
    grid-template-columns: 104px minmax(0, 1fr);
    min-height: 104px;
  }

  .menu-mas-anirona-inferior img {
    width: 100px;
    max-height: 82px;
  }

  .menu-mas-anirona-accion {
    background: #2dcc4f;
  }
}

@media (max-width: 380px) {
  .menu-mas-guia-cupones { padding: 9px 10px 10px; }
  .menu-mas-guia-pasos { gap: 5px; }
  .menu-mas-guia-pasos p { font-size: 10.3px; line-height: 14px; }
  .menu-mas-anirona-inferior { grid-template-columns: 86px minmax(0, 1fr); }
  .menu-mas-anirona-inferior img { width: 84px; }
}

@media (min-width: 701px) {
  .menu-mas-panel-inferior {
    width: min(390px, calc(100vw - 32px));
    max-height: calc(100vh - 108px);
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .menu-mas-anirona-inferior {
    grid-template-columns: 112px minmax(0, 1fr);
  }

  .menu-mas-guia-pasos p {
    font-size: 11.2px;
    line-height: 15px;
  }
}