/* ============================================================
   ====================  BARRA SUPERIOR  ======================
   ============================================================ */

.barra-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #f1efe4;
  padding: 0.5rem 2rem;
  font-family: 'Poppins', sans-serif;
  font-size: 0.85rem;
  color: #1c2d65;
}

.barra-top .izquierda span,
.barra-top .izquierda a {
  margin-right: 1.5rem;
  color: #1c2d65;
  text-decoration: none;
}

.barra-top .derecha {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.barra-top input[type="text"] {
  border: none;
  border-bottom: 1px solid #1c2d65;
  padding: 0.3rem 0.5rem;
  outline: none;
  font-size: 0.85rem;
  background: transparent;
  color: #1c2d65;
}

/* ============================================================
   ====================  HEADER PRINCIPAL  ====================
   ============================================================ */

.header-principal {
  background-color: #96d3c8;
  text-align: center;
  padding: 1rem 2rem;
  border-bottom: 1px solid #ddd;
}

/* LOGO + SLOGAN */
.logo-centro {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: -3.125rem;
  z-index: 10;
  margin-bottom: 1rem;
}

.logo-centro img {
  height: auto !important;
  width: auto !important;
  max-height: 80px;
  display: block;
}

.logo-centro .slogan {
  margin-top: 0.9rem;
  font-size: 0.9rem;
  color: #1c2d65;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
}

@media (max-width: 768px) {
  .logo-centro .slogan {
    display: none;
  }
}

/* ============================================================
   =====================   MENÚ DESKTOP    =====================
   ============================================================ */

.menu-links {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  flex-wrap: wrap;
  position: relative;
}

.menu-links ul {
  display: flex;
  list-style: none;
  gap: 1.5rem;
  margin: 0;
  padding: 0;
}

.menu-links li a {
  text-decoration: none;
  font-family: 'Poppins', sans-serif;
  color: #1c2d65;
  font-size: 0.95rem;
  font-weight: 500;
  transition: color 0.3s ease;
}

.menu-links li a:hover {
  color: #000000;
}

/* Botón tiendas */
.btn-tiendas {
  background-color: #1c2d65;
  color: white;
  padding: 0.5rem 1.2rem;
  border-radius: 62.4375rem;
  font-family: 'Poppins', sans-serif;
  font-size: 0.9rem;
  text-decoration: none;
  font-weight: 500;
  transition: background-color 0.3s ease;
}

.btn-tiendas:hover {
  background-color: #32407b;
  color: white;
}

/* Mega menú */
.has-submenu{
  position: static;
}

/* puente invisible que cubre el hueco entre link y mega-menu */
.has-submenu::after{
  content: "";
  position: absolute;
  left: -40px;
  right: -40px;
  top: 100%;
  height: 20px;
}

.mega-menu {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 1000px;
  max-width: 95vw;
  background-color: white;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  padding: 2rem;
  display: none;
  gap: 2rem;
  justify-content: space-between;
  z-index: 999;
  margin-top: 0;
}

.has-submenu:hover .mega-menu {
  display: flex;
}

.submenu-col {
  display: flex;
  flex-direction: column;
  min-width: 11.25rem;
}

.submenu-col h4 {
  font-size: 0.9rem;
  font-weight: bold;
  margin-bottom: 0.8rem;
  color: #1c2d65;
}

.submenu-col a {
  text-decoration: none;
  color: #333;
  font-size: 0.85rem;
  margin-bottom: 0.4rem;
  transition: color 0.2s ease;
}

.submenu-col a:hover {
  color: #7dd2c3;
}


/* ============================================================
   ==================== ICONOS HEADER DESKTOP ==================
   ============================================================ */

.derecha img {
  width: 30px;
  height: 30px;
  display: block;
  transform: translateY(2px);
}

.derecha {
  gap: 18px;
}

.derecha img:hover {
  opacity: 0.7;
  transition: 0.2s ease;
}

.nh-cart-icon {
  position: relative;
  display: flex;
  align-items: center;
}

.nh-cart-img {
  width: 30px;
  height: 30px;
}

.nh-cart-count {
  position: absolute;
  top: -6px;
  right: -10px;
  background: #0A1C48;
  color: #ffffff;
  font-size: 11px;
  padding: 1px 5px;
  border-radius: 50%;
  min-width: 18px;
  font-weight: 600;
}

/* ============================================================
   =============== NEOHOGAR MINI-CART (PREMIUM) ===============
   ============================================================ */

/* Overlay */
#nh-cart-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0,0,0,0.45);
  opacity: 0;
  visibility: hidden;
  transition: .3s;
  z-index: 998;
}

#nh-cart-overlay.active {
  opacity: 1;
  visibility: visible;
}

/* Drawer */
#nh-mini-cart {
  position: fixed;
  top: 0;
  right: -420px;
  width: 380px;
  max-width: 90vw;
  height: 100vh;
  background: #ffffff;
  border-left: 4px solid #96D3C8;
  box-shadow: -4px 0 12px rgba(0,0,0,0.15);
  z-index: 999;
  display: flex;
  flex-direction: column;
  transition: right .35s ease;
}

#nh-mini-cart.open {
  right: 0;
}

/* Header */
.nh-mini-cart-header {
  background: #96D3C8;
  padding: 18px 20px;
  border-bottom: 1px solid #d4e9e6;
  position: relative;              /* <-- AÑADIDO IMPORTANTE */
}

.nh-mini-cart-header h2 {
  margin: 0;
  font-size: 1.2rem;
  font-weight: 600;
  color: #0A1C48;
}

/* Cerrar */
.nh-cart-close {
  position: absolute;
  right: 18px;
  top: 50%;                        /* centramos vertical */
  transform: translateY(-50%);     /* centramos respecto al alto del header */
  background: none;
  border: none;
  color: #0A1C48;
  font-size: 26px;
  cursor: pointer;
  line-height: 1;
  z-index: 10;
}

/* Contenido */
.nh-mini-cart-content {
  padding: 20px;
  overflow-y: auto;
  flex: 1;
}

/* Scroll bonito */
.nh-mini-cart-content::-webkit-scrollbar {
  width: 7px;
}

.nh-mini-cart-content::-webkit-scrollbar-thumb {
  background: #96D3C8;
  border-radius: 10px;
}

/* PRODUCTO */
.nh-cart-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.nh-item {
  background: #ffffff;
  padding: 14px;
  display: flex;
  gap: 12px;
  position: relative;
  border-bottom: 1px solid #ececec;
}

/* Imagen */
.nh-thumb img {
  width: 75px;
  height: 75px;
  border-radius: 8px;
  object-fit: cover;
}

/* Título */
.nh-title {
  font-size: 0.9rem;
  font-weight: 600;
  color: #0A1C48;
  margin-bottom: 6px;
  display: block;
}

/* Reserva hueco para la X */
.nh-item-info {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding-right: 40px; /* deja hueco para la X */
}

/* Cantidad + – */
.nh-qty-wrapper {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 6px 0;
}

.nh-qty-btn {
  width: 26px;
  height: 26px;
  border-radius: 4px;
  border: none;
  background: #96D3C8;
  color: #0A1C48;
  font-size: 18px;
  cursor: pointer;
  font-weight: bold;
}

.nh-price {
  font-size: 1rem;
  font-weight: 700;
  color: #0A1C48;
}

/* Botón eliminar */
.nh-remove-item {
  position: absolute;
  right: 10px;
  top: 6px;
  background: none;
  border: none;
  font-size: 18px;
  color: #D9534F;
  cursor: pointer;
}

/* Subtotal */
.nh-subtotal {
  display: flex;
  justify-content: space-between;
  padding: 18px 0 10px;
  font-size: 1rem;
  font-weight: 600;
  color: #0A1C48;
}

/* Footer */
.nh-mini-cart-footer {
  padding: 20px;
  border-top: 1px solid #dde5e3;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.nh-btn {
  padding: 12px;
  text-align: center;
  font-family: 'Poppins', sans-serif;
  border-radius: 6px;
  font-weight: 600;
  text-decoration: none;
}

.nh-btn-main {
  background: #0A1C48;
  color: #ffffff !important;
}

.nh-btn-main:hover {
  background: #122f66;
}

.nh-btn-sec {
  background: #96D3C8;
  color: #0A1C48 !important;
}

.nh-btn-sec:hover {
  background: #7fc9bd;
}


.nh-search-container {
    position: relative;
    width: 100%;
    max-width: 400px;
}

.nh-search-input {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 15px;
}

.nh-search-results {
    display: none;
    position: absolute;
    top: 110%;
    left: 0;
    width: 100%;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.12);
    z-index: 50;
    max-height: 350px;
    overflow-y: auto;
}

.nh-search-results.active {
    display: block;
}

.nh-search-item {
    display: flex;
    padding: 10px;
    gap: 12px;
    border-bottom: 1px solid #eee;
    text-decoration: none;
    color: #333;
}

.nh-search-item:hover {
    background: #f5f5f5;
}

.nh-item-thumb img {
    width: 55px;
    height: 55px;
    object-fit: cover;
    border-radius: 6px;
}

.nh-item-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.nh-item-name {
    font-weight: 600;
    font-size: 14px;
}

.nh-item-price {
    color: var(--color-primary, #04AFA6);
    font-size: 14px;
    margin-top: 3px;
}

.nh-no-results {
    padding: 12px;
    color: #777;
}


/* ===========================
   SEARCH RESULTS — ESTILOS
   =========================== */
.nh-search-results {
    position: absolute;
    width: 100%;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(0,0,0,0.12);
    padding: 6px 0;
    max-height: 420px;
    overflow-y: auto;
    display: none;
    z-index: 99999;
}

.nh-search-results.active {
    display: block;
}

.nh-search-item {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 10px 14px;
    text-decoration: none;
    color: #1c2d65;
    transition: background .15s ease;
}

.nh-search-item:hover {
    background: #f7f5ee;
}

.nh-search-item + .nh-search-item {
    border-top: 1px solid #f0ede4;
}

.nh-search-thumb {
    flex: 0 0 56px;
    width: 56px;
    height: 56px;
    border-radius: 10px;
    overflow: hidden;
    background: #f8f6ef;
}

.nh-search-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.nh-search-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.nh-search-name {
    font-family: 'Poppins', sans-serif;
    font-size: .9rem;
    font-weight: 500;
    line-height: 1.3;
    color: #1c2d65;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nh-search-name strong {
    color: #7dd2c3;
    font-weight: 700;
}

.nh-search-cat {
    font-size: .78rem;
    color: #8b93a6;
    line-height: 1.2;
}

.nh-search-price {
    font-family: 'Poppins', sans-serif;
    font-size: .88rem;
    font-weight: 700;
    color: #1c2d65;
}

.nh-search-price del {
    font-weight: 400;
    opacity: .5;
    margin-right: 6px;
}

.nh-search-price ins {
    text-decoration: none;
}

.nh-search-more {
    display: block;
    padding: 12px 14px;
    text-align: center;
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: .88rem;
    border-top: 1px solid #f0ede4;
    color: #1c2d65;
    text-decoration: none;
    transition: background .15s ease;
}

.nh-search-more:hover {
    background: #f7f5ee;
}

.nh-search-empty {
    padding: 20px 14px;
    text-align: center;
    color: #8b93a6;
    font-size: .9rem;
}

.nh-loading {
    padding: 20px 14px;
    text-align: center;
    color: #8b93a6;
    font-size: .9rem;
}
/* =====================================================
   NEOHOGAR – HEADER MÓVIL DEFINITIVO (AISLADO)
   SVG ICONS – SIN SPANS – SIN CONFLICTOS
   ALTURA UNIFICADA (HEADER / BODY / MENÚ)
   ===================================================== */

@media (max-width: 768px) {

  /* ==================================================
     OCULTAR COMPLETAMENTE EL HEADER DESKTOP
     ================================================== */
  .barra-top,
  .header-principal,
  .menu-links {
    display: none !important;
  }

  /* ==================================================
     HEADER MÓVIL (FIJO)
     ================================================== */
  .nh-header-mobile {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120px;                 /* 🔑 ALTURA REAL DEL HEADER */
    background: #96d3c8;
    z-index: 10000;
  }

  .nh-mobile-inner {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 22px;
  }

  /* ==================================================
     EMPUJAR CONTENIDO (MISMA ALTURA QUE EL HEADER)
     ================================================== */
  body {
    padding-top: 120px;            /* 🔑 SIEMPRE igual al header */
  }

  /* ==================================================
     ZONAS DEL HEADER
     ================================================== */
  .nh-mobile-left,
  .nh-mobile-right {
    display: flex;
    align-items: center;
    gap: 0;                        /* control fino tipo Beds */
  }

  .nh-mobile-center {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* ==================================================
     LOGO MÓVIL
     ================================================== */
  .nh-mobile-logo {
    height: 40px;                  /* controla SOLO la altura */
    width: auto;                   /* mantiene proporción */
    max-width: 140px;              /* evita desbordes */
    display: block;
  }

  /* ==================================================
     ICONOS SVG (HAMBURGUESA, LUPA, CARRITO, MAPA)
     ================================================== */
  .nh-hamburger svg,
  .nh-mobile-icon svg {
    width: 22px;
    height: 22px;
    display: block;
    stroke: #1c2d65;
  }

  .nh-hamburger,
  .nh-mobile-icon {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: 0;
    padding: 0;
  }

  /* ==================================================
     HAMBURGUESA (AISLADA AL 100%)
     ================================================== */
  .nh-hamburger {
    all: unset;                    /* 🔒 borra estilos heredados */
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }

  /* Seguridad total */
  .nh-hamburger span,
  .nh-hamburger::before,
  .nh-hamburger::after {
    display: none !important;
    content: none !important;
  }

  /* ==================================================
     MENÚ LATERAL
     ================================================== */
  .nh-mobile-menu {
    position: fixed;
    top: 120px;                    /* 🔑 justo debajo del header */
    left: -100%;
    width: 85%;
    height: calc(100vh - 120px);
    background: #f1efe4;
    padding: 20px;
    box-sizing: border-box;
    overflow-y: auto;
    transition: left 0.25s ease;
    z-index: 9999;
  }

  .nh-mobile-menu.open {
    left: 0;
  }

  /* ==================================================
     OVERLAY
     ================================================== */
  .nh-mobile-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
    z-index: 9998;
  }

  .nh-mobile-overlay.active {
    opacity: 1;
    pointer-events: auto;
  }

  /* Bloquear scroll cuando menú abierto */
  body.nh-lock {
    overflow: hidden;
  }
}

/* =====================================================
   🔒 DESACTIVAR TODO LO MÓVIL EN DESKTOP
   ===================================================== */
@media (min-width: 769px) {

  .nh-header-mobile,
  .nh-mobile-menu,
  .nh-mobile-overlay {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body {
    padding-top: 0 !important;
  }
}

/* LISTA */
.nh-mobile-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* ITEM */
.nh-mobile-list li a {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 8px;
  text-decoration: none;
  color: #1c2d65;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 16px;
}

/* ICONO */
.nh-menu-icon {
  width: 22px;
  height: 22px;
  stroke: #1c2d65;
  flex-shrink: 0;
}

/* TEXTO */
.nh-mobile-list span {
  flex: 1;
}

/* FLECHA */
.nh-arrow {
  font-size: 20px;
  color: #1c2d65;
}

/* CTA TIPO BEDS */
.nh-mobile-cta {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #0A1C48;
  color: white;
  padding: 16px;
  margin-top: 20px;
  text-decoration: none;
  font-weight: 600;
}

/* =========================================================
   FIX DEFINITIVO FLATSOME
   Header móvil fijo → empujar contenido real
   ========================================================= */


@media (max-width: 768px){
  #wrapper{ padding-top: 120px !important; }
  body{ padding-top: 0 !important; }
}


:root{
  --nh-font: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

/* ===== Desktop menu ===== */
.header-principal .menu-links a,
.header-principal .menu-links span{
  font-family: var(--nh-font) !important;
}

/* ===== Mobile menu (tu menú custom) ===== */
#mobileMenu,
#mobileMenu a,
#mobileMenu span{
  font-family: var(--nh-font) !important;
}

/* Menú desktop: más fino */
.header-principal .menu-links a{
  font-weight: 400 !important; /* prueba 300 si lo quieres aún más fino */
  letter-spacing: .2px;
}

/* Menú móvil: más fino */
#mobileMenu a{
  font-weight: 400 !important; /* prueba 300 */
  letter-spacing: .2px;
}


/* Contenedor */
#mobileMenu { font-family: var(--nh-font) !important; }

/* Lista principal */
.nh-mobile-list { margin: 0; padding: 18px 0; }
.nh-mobile-list li { list-style: none; }

/* Link/botón principal */
#mobileMenu .nh-link{
  width: 100%;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 22px;
  text-decoration: none;
  color: inherit;
  background: transparent;
  border: 0;
  cursor: pointer;
}

#mobileMenu .nh-icon{
  width: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 34px;
}

#mobileMenu .nh-icon svg{
  width: 26px;
  height: 26px;
  display: block;
}

#mobileMenu .nh-text{
  flex: 1;
  text-transform: uppercase;
  font-weight: 600;         /* estilo Beds */
  letter-spacing: .04em;
  font-size: 15px;
}

/* Flechas */
#mobileMenu .nh-arrow{ margin-left: auto; font-size: 22px; opacity: .6; }
#mobileMenu .nh-chevron{ margin-left: auto; opacity: .6; transition: transform .2s ease; }

/* Submenu bloque */
#mobileMenu .nh-sub{ padding: 0 0 10px 0; }
#mobileMenu .nh-sub-list{ margin: 0; padding: 0 0 10px 0; }
#mobileMenu .nh-sub-item{ padding: 0 22px 0 70px; } /* sangría como Beds */

/* Fila de subcategoría (Materiales / Tamaño...) */
#mobileMenu .nh-sub-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 0;
  text-decoration: none;
  color: inherit;
  opacity: .8;
}

#mobileMenu .nh-sub-title{
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 500;
  font-size: 14px;
}

/* Sub-submenu (items dentro de Tipo) */
#mobileMenu .nh-sub-toggle{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 0;
  background: transparent;
  border: 0;
  cursor: pointer;
  color: inherit;
  opacity: .8;
}

#mobileMenu .nh-sub-links{
  margin: 0;
  padding: 6px 0 10px 0;
}

#mobileMenu .nh-sub-link{
  display: block;
  padding: 10px 0;
  text-decoration: none;
  color: inherit;
  opacity: .75;
  font-weight: 400;
  text-transform: none; /* como Beds */
}

/* Rotación flecha cuando está abierto */
#mobileMenu [aria-expanded="true"] > .nh-chevron{
  transform: rotate(180deg);
}

/* ==============================
   FIX: el submenú NO a la derecha
   ============================== */

/* Asegura layout en columna (stack) */
#mobileMenu .nh-mobile-list > li,
#mobileMenu .nh-item--has-sub{
  display: block !important;
}

/* El botón ocupa toda la línea */
#mobileMenu .nh-item--has-sub > .nh-link{
  display: flex !important;
  width: 100% !important;
}

/* El contenedor del submenú SIEMPRE debajo */
#mobileMenu .nh-item--has-sub > .nh-sub{
  position: static !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  margin: 0 !important;
}

/* Quita posibles estilos raros del tema en ULs */
#mobileMenu .nh-sub-list,
#mobileMenu .nh-sub-links{
  display: block !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

#mobileMenu .nh-sub-item{
  width: 100% !important;
}

/* ==============================
   FIX: tipografía como antes
   ============================== */

#mobileMenu .nh-text{
  text-transform: none !important;   /* fuera uppercase */
  letter-spacing: 0 !important;      /* fuera tracking */
  font-weight: 400 !important;       /* más fino */
  font-size: 20px;                   /* ajusta si quieres */
}

#mobileMenu .nh-sub-title{
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-weight: 400 !important;
  font-size: 16px;
}

#mobileMenu .nh-sub-link{
  font-weight: 400 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

/* Flecha del acordeón */
#mobileMenu .nh-chevron{
  margin-left: auto;
  transition: transform .2s ease;
}

#mobileMenu [aria-expanded="true"] > .nh-chevron{
  transform: rotate(180deg);
}

/* =========================================
   NORMALIZAR TIPOGRAFÍA Y ESTILO (A + BUTTON)
   Pegar al FINAL del CSS
   ========================================= */

#mobileMenu{
  font-family: var(--nh-font) !important;
  color: #1c2d65;
}

/* Mismo “row” para enlaces y botones del primer nivel */
#mobileMenu .nh-mobile-list > li > a,
#mobileMenu .nh-mobile-list > li > button{
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;

  width: 100% !important;
  padding: 14px 8px !important;

  background: transparent !important;
  border: 0 !important;
  cursor: pointer;

  text-decoration: none !important;
  color: #1c2d65 !important;

  font-family: var(--nh-font) !important;
  font-weight: 400 !important;   /* <- fino (igual que te gustaba) */
  font-size: 16px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Evita que un span “estire” cosas raras en submenús */
#mobileMenu .nh-mobile-list > li > a > span,
#mobileMenu .nh-mobile-list > li > button > span{
  flex: initial !important;
}

/* La flecha a la derecha siempre al final */
#mobileMenu .nh-arrow,
#mobileMenu .nh-chevron{
  margin-left: auto !important;
  opacity: .65;
}

/* Submenú: filas (Materiales/Tamaño/Cómo elegir/Top) */
#mobileMenu .nh-sub-row{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  text-decoration: none !important;
  color: #1c2d65 !important;

  font-family: var(--nh-font) !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Botón “Tipo” (sub-toggle) igual que sub-row */
#mobileMenu .nh-sub-toggle{
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;

  background: transparent !important;
  border: 0 !important;
  cursor: pointer !important;

  font-family: var(--nh-font) !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: #1c2d65 !important;
}

/* Links internos (Firmeza media, etc.) */
#mobileMenu .nh-sub-link{
  font-family: var(--nh-font) !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: #1c2d65 !important;
  opacity: .75;
}

/* =========================================
   FIX: Colchones sin tarjeta blanca
   + mismo tamaño tipografía que el resto
   (Pegar AL FINAL del CSS)
   ========================================= */

/* Fuerza fondo del menú lateral */
#mobileMenu{
  background: #f1efe4 !important;
}

/* 1) Primer nivel: todos iguales (a y button) */
#mobileMenu .nh-mobile-list > li > a,
#mobileMenu .nh-mobile-list > li > button{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;

  padding: 14px 8px !important;
  font-size: 16px !important;   /* <- igual que tus items */
  line-height: 1.2 !important;
}

/* 2) Si el LI de Colchones tiene fondo/borde heredado, lo anulamos */
#mobileMenu .nh-item--has-sub{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* 3) Por si hay una regla que pinta SOLO ese botón */
#mobileMenu .nh-item--has-sub > .nh-link{
  background: transparent !important;
  border: 0 !important;
  outline: none !important;
}

/* 4) Submenú también integrado (sin cajas blancas) */
#mobileMenu .nh-sub{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 8px 0 0 0 !important;
}

/* Igualar tamaño Colchones (button) al resto (a) */
#mobileMenu .nh-mobile-list > li > button {
  font-size: 16px !important;
}


/* FIX: Colchones no más grande (porque usa .nh-text) */
#mobileMenu .nh-text{
  font-size: inherit !important;
  font-weight: inherit !important;
  letter-spacing: inherit !important;
  text-transform: none !important;
}

/* CONTENEDOR DEL ICONO (tu span) */
.nh-icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;     /* mismo tamaño que el chevron */
  height: 22px;
  flex: 0 0 22px;
  color: #1e2a5a;  /* o mejor: heredar del botón (ver abajo) */
}

/* El SVG que metes con file_get_contents */
.nh-icon svg{
  width: 100%;
  height: 100%;
  display: block;
}

/* “Forzar estilo de icono lineal”: líneas nítidas y consistentes */
.nh-icon svg *{
  fill: none !important;            /* evita rellenos raros del SVG */
  stroke: currentColor !important;  /* hereda el color del texto */
  stroke-width: 0.25 !important;     /* ajusta: 1.4–1.8 suele ir fino */
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  vector-effect: non-scaling-stroke; /* que no se engorde al escalar */
}

/* Si tu SVG trae paths que usan fill en vez de stroke, esto ayuda */
.nh-icon svg [fill]:not([fill="none"]){
  fill: currentColor !important;
  stroke: none !important;
}


.nh-menu button, 
.nh-menu .nh-item{
  color: #1e2a5a; /* tu azul */
}

/* Ajusta el factor hasta que lo veas igual que colchones */
.nh-icon svg { transform-origin: center; }

.nh-icon--canapes svg { transform: scale(2); }



.nh-icon--tiendas svg{
  stroke: #fff !important;
  fill: none !important;
}

.nh-icon--tiendas svg *{
  stroke: #fff !important;
  fill: #fff !important;
}


@media (max-width: 768px){

  /* que el drawer empiece debajo del header móvil */
  #nh-mini-cart{
    top: 120px;                          /* igual que .nh-header-mobile */
    height: calc(100dvh - 120px);        /* viewport real móvil */
    right: -100vw;                        /* opcional: más robusto que -420px */
    width: min(420px, 92vw);
    z-index: 10003;                       /* por encima del menú y overlay */
  }

  #nh-mini-cart.open{
    right: 0;
  }

  #nh-cart-overlay{
    z-index: 10002;                       /* por encima del overlay del menú */
  }
}

@media (max-width: 768px){
  .nh-mobile-icon.nh-cart-toggle{ position: relative; }

  .nh-mobile-icon.nh-cart-toggle .nh-cart-count{
    position: absolute;
    top: -6px;
    right: -8px;
    background: #0A1C48;
    color: #fff;
    font-size: 11px;
    padding: 1px 5px;
    border-radius: 999px;
    min-width: 18px;
    font-weight: 600;
    line-height: 1.2;
  }
}

@media (max-width:768px){
  .nh-mobile-search{
    position: fixed;
    top: 120px;                 /* debajo del header */
    left: 0;
    width: 100%;
    background: #f1efe4;
    padding: 14px 18px;
    z-index: 10001;             /* por encima del menú */
    border-bottom: 1px solid rgba(0,0,0,.08);
  }

  .nh-mobile-search-inner{
    position: relative;
    max-width: 520px;
    margin: 0 auto;
  }

  /* La caja de resultados en móvil: fija y cómoda */
  .nh-search-results--mobile{
    position: absolute;
    top: 110%;
    left: 0;
    width: 100%;
    max-height: 55vh;
    z-index: 10002;
  }
}

/* ===========================
   SEARCH DESKTOP - FIX FINAL
   =========================== */

.barra-top .nh-search-container{
  position: relative;
  overflow: visible; /* clave: que no recorte el desplegable */
}

.barra-top .nh-search-results--desktop{
  position: absolute;
  top: 110%;
  left: 0;
  width: 100%;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.12);
  padding: 10px 0;
  max-height: 420px;
  overflow-y: auto;
  display: none;
  z-index: 999999; /* por encima de todo */
}

.barra-top .nh-search-results--desktop.active{
  display: block;
}

/* =========================================================
   FIX: el item "Colchones" (button) con mismo alto/espaciado que los <a>
   ========================================================= */

/* 1) Reset fuerte del botón (quita estilos nativos) */
.nh-mobile-menu .nh-link.nh-toggle{
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  border: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

/* 2) Misma “fila” para <a> y para el <button> */
.nh-mobile-menu .nh-mobile-list > li > a,
.nh-mobile-menu .nh-mobile-list > li > button.nh-link{
  display: flex;
  align-items: center;
  gap: 1rem;
  width: 100%;
  padding: 1.1rem 1.35rem;   /* ← ajusta si quieres más/menos aire */
  min-height: 64px;          /* ← iguala alturas */
  line-height: 1.1;
  box-sizing: border-box;
}

/* 3) Empuja flecha/chevron a la derecha igual que los otros */
.nh-mobile-menu .nh-mobile-list .nh-chevron,
.nh-mobile-menu .nh-mobile-list .nh-arrow{
  margin-left: auto;
}

/* 4) Por si el li con submenú tiene spacing extra */
.nh-mobile-menu .nh-item--has-sub{
  margin: 0;
  padding: 0;
}

/* (opcional) focus bonito para accesibilidad */
.nh-mobile-menu .nh-link.nh-toggle:focus-visible{
  outline: 2px solid rgba(28,45,101,.35);
  outline-offset: 2px;
  border-radius: 12px;
}