/* ---- Menú por Líneas (estilos base) ---- */
.whb-header-bottom .wd-header-html .menu-linea-auto{
  display:flex; align-items:center; justify-content:flex-start;
  min-height:54px; margin:0; margin-left:14px; padding:0; position:relative; top:-1px;
}
.whb-header-bottom .wd-header-html .menu-linea-auto > ul.menu-linea-root{
  display:flex; align-items:center; gap:32px; margin:0; padding:0; list-style:none;
}
.whb-header-bottom .wd-header-html .menu-linea-auto > ul.menu-linea-root > li{
  position:relative; line-height:1; margin:0; padding:0;
}
.whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-title{
  color:#fff; font-weight:700; font-size:15px; text-transform:uppercase; text-decoration:none; line-height:1; padding:0 6px; transition:color .2s;
}

/* Hover general (desktop) */
@media (min-width:769px){
  .whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-title:hover,
  .whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item:hover > .menu-linea-title{
    color:#4da3ff;
  }
}

/* ===== Submenú mega (desktop) ===== */
.whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-sub{
  --wcl-submenu-col: 5;
  --wcl-col-gap: 22px;
  --wcl-row-gap: 6px;

  position:absolute; 
  left:0; 
  top:calc(100% + 8px);
  display:none; 
  visibility:hidden;
  opacity:0;
  transform:translateY(8px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s ease;

  width:calc(var(--wcl-submenu-col) * 240px);
  max-width:80vw;
  margin:0; padding:14px 16px; list-style:none;
  background:#fff; border:1px solid rgba(0,0,0,.08);
  border-radius:10px; 
  box-shadow:0 14px 28px rgba(0,0,0,.16);
  z-index:30100;

  display:grid;
  grid-template-columns:repeat(var(--wcl-submenu-col), minmax(180px,1fr));
  column-gap:var(--wcl-col-gap);
  row-gap:var(--wcl-row-gap);
}

/* Mostrar dropdown solo en desktop */
@media (min-width:769px){
  .whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item:hover > .menu-linea-sub{
    display:grid !important;
    visibility:visible;
    opacity:1;
    transform:translateY(0);
    pointer-events:auto;
  }
}

/* Items del submenú (base) */
.whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-sub > li > a{
  display:block; padding:8px 10px; color:#333; font-size:14px; text-transform:none; text-decoration:none; border-radius:6px;
}
.whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-sub > li > a:hover{
  color:#1e73be; background:rgba(0,0,0,.045);
}

/* Puente hover */
.whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item > .menu-linea-title{ position:relative; }
.whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item > .menu-linea-title::after{
  content:""; position:absolute; left:-6px; right:-6px; bottom:-10px; height:10px;
}

/* Ofertas (si no tiene color propio) */
.whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-ofertas:not(.has-custom-color) > .menu-linea-title{ 
  color:#ffcc00; font-weight:800; 
}

/* Z-index general del header */
.whb-header-bottom{ position:relative; z-index:60; }

/* ===== MOBILE (<=768px): acordeón con overrides para Woodmart) ===== */
@media (max-width:768px){

  .whb-header-bottom .wd-header-html .menu-linea-auto{
    margin-left:0; top:0; justify-content:flex-start;
    position: relative; z-index: 60;
  }

  /* raíz vertical */
  .whb-header-bottom .wd-header-html .menu-linea-auto > ul.menu-linea-root{
    display:block !important; gap:0 !important;
  }
  .whb-header-bottom .wd-header-html .menu-linea-auto > ul.menu-linea-root > li{
    border-bottom: 1px solid rgba(0,0,0,.06);
    padding: 10px 0;
  }

  /* título con flecha */
  .whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-title{
    display:flex; align-items:center; justify-content:space-between;
    width:100%; padding: 8px 0;
  }
  .whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item.menu-linea-has-sub > .menu-linea-title::after{
    content:"▾"; font-size:12px; margin-left:10px; opacity:.7; transition:transform .2s;
  }
  .whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item.menu-linea-has-sub.is-open > .menu-linea-title::after{
    transform: rotate(180deg);
  }

  /* Submenú como acordeón: CERRADO por defecto */
  .whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-sub{
    position: static !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 0 6px 0 !important;
    grid-template-columns: 1fr !important;

    max-height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: none !important;
    transition: max-height .25s ease, opacity .2s ease, visibility .2s ease !important;
  }

  /* ABIERTO solo con .is-open en el <li> */
  .whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item.is-open > .menu-linea-sub{
    max-height: 1000px !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* Evita que hover del tema interfiera */
  .whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item:hover > .menu-linea-sub{
    display: block !important;
    max-height: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
  }

  /* Links del submenú */
  .whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-sub > li > a{
    padding:10px 0 !important; display:block !important; color:#333;
  }

  /* Anula el “puente hover” */
  .whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item > .menu-linea-title::after{
    height:0;
  }
}

/* ===== Ítems extra con color personalizado ===== */
.whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item.has-custom-color > .menu-linea-title,
.whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item.has-custom-color > .menu-linea-title:hover,
.whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item.has-custom-color > .menu-linea-title:focus,
.whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item.has-custom-color > .menu-linea-title:active,
.whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item.has-custom-color > .menu-linea-title:visited {
  color: var(--wcl-item-color) !important;
}

/* No aplicar hover azul a los que tienen color propio */
@media (min-width:769px){
  .whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-item.has-custom-color:hover > .menu-linea-title {
    color: var(--wcl-item-color) !important;
  }
}

/* Color personalizado + clase ofertas: prioriza color */
.whb-header-bottom .wd-header-html .menu-linea-auto .menu-linea-ofertas.has-custom-color > .menu-linea-title {
  color: var(--wcl-item-color) !important;
}