.elementor-2567 .elementor-element.elementor-element-6d4f26e8{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--gap:0px 10px;--row-gap:0px;--column-gap:10px;--flex-wrap:nowrap;--overflow:auto;box-shadow:5px 0px 30px 0px rgba(0, 0, 0, 0.08);--padding-top:13px;--padding-bottom:12px;--padding-left:20px;--padding-right:20px;}@media(max-width:767px){.elementor-2567 .elementor-element.elementor-element-6d4f26e8{--flex-wrap:nowrap;}}/* Start custom CSS for container, class: .elementor-element-6d4f26e8 *//* ============================================
   NAVBAR MOBILE - LIQUID GLASS / PILL SHAPE
   Para: cryptotienda.ar
   Aplicar en: Elementor > Ajustes del sitio > CSS personalizado
   O en: Apariencia > Personalizar > CSS adicional
   ============================================ */

/* --- Contenedor principal: forma píldora + efecto glass --- */
#glozin-mobile-navigation-bar {
  /* Separar de los bordes */
  left: 12px !important;
  right: 12px !important;
  bottom: 12px !important;
  width: auto !important;

  /* Forma píldora (bordes redondeados) */
  border-radius: 50px !important;

  /* Efecto Liquid Glass / Glassmorphism */
  background: rgba(255, 255, 255, 0.65) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;

  /* Sombra suave tipo neumorphism */
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.08),
    0 2px 8px rgba(0, 0, 0, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.6) !important;

  /* Borde sutil translúcido */
  border: 1px solid rgba(255, 255, 255, 0.5) !important;

  /* Z-index alto para que quede encima de todo */
  z-index: 999 !important;

  /* Overflow hidden para respetar el border-radius */
  overflow: hidden !important;
}

/* --- Contenedor Elementor interno: hereda la forma --- */
#glozin-mobile-navigation-bar .elementor-element-6d4f26e8,
#glozin-mobile-navigation-bar .elementor-element-6d4f26e8 > .e-con-inner {
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 50px !important;
}

/* --- Items de navegación: estilo activo tipo píldora --- */
#glozin-mobile-navigation-bar .glozin-navigation-bar-item {
  padding: 8px 16px;
  border-radius: 30px;
  transition: all 0.3s ease;
  position: relative;
}

/* Hover / Active: fondo sutil tipo la imagen de referencia */
#glozin-mobile-navigation-bar .glozin-navigation-bar-item:hover,
#glozin-mobile-navigation-bar .glozin-navigation-bar-item:active {
  background: rgba(0, 0, 0, 0.06);
}

/* --- Íconos: color y tamaño --- */
#glozin-mobile-navigation-bar .glozin-navigation-bar__icon {
  color: #1a1a1a !important;
}

#glozin-mobile-navigation-bar .glozin-navigation-bar__icon svg {
  width: 22px !important;
  height: 22px !important;
}

/* --- FIX: Inicio y Tienda usan stroke, no fill ---
   Sus paths no tienen fill="none" explícito, entonces
   heredan fill:currentColor del tema y se ven sólidos.
   Forzamos fill:none en los SVG que usan style="fill:none" (stroke icons)
   y mantenemos el stroke visible. */
#glozin-mobile-navigation-bar .elementor-element-44f32730 .glozin-svg-icon svg,
#glozin-mobile-navigation-bar .elementor-element-44f32730 .glozin-svg-icon svg path,
#glozin-mobile-navigation-bar .elementor-element-44f32730 .glozin-svg-icon svg g,
#glozin-mobile-navigation-bar .elementor-element-107bd3c6 .glozin-svg-icon svg,
#glozin-mobile-navigation-bar .elementor-element-107bd3c6 .glozin-svg-icon svg path,
#glozin-mobile-navigation-bar .elementor-element-107bd3c6 .glozin-svg-icon svg g {
  fill: none !important;
  stroke: #1a1a1a !important;
  stroke-width: 1.5 !important;
}

/* --- Títulos debajo de los íconos --- */
#glozin-mobile-navigation-bar .glozin-navigation-bar__title {
  color: #1a1a1a !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  margin-top: 4px !important;
}

/* --- Badges (contadores de Favoritos y Bolsa) --- */
#glozin-mobile-navigation-bar .header-counter {
  background: #e53935 !important;
  color: #fff !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  min-width: 16px !important;
  height: 16px !important;
  line-height: 16px !important;
  border-radius: 50% !important;
  text-align: center !important;
  padding: 0 4px !important;
}

/* Ocultar badge cuando está vacío (0) */
#glozin-mobile-navigation-bar .header-counter.empty-counter {
  display: none !important;
}/* End custom CSS */