/* Compu Header Sticky — barra compacta fija site-wide.
   Solo desktop (>=1025px). En móvil mandan el header móvil + toolbar de Woodmart. */

/* 1) Ocultar el clon sticky nativo de Woodmart SOLO en desktop: nuestra barra lo reemplaza.
   (El header real sigue scrolleando normal; con esto no hay barra duplicada.)
   En móvil dejamos intacto el sticky nativo de Woodmart. */
@media (min-width: 1025px) {
  .whb-clone { display: none !important; }
}

/* 2) La barra compacta */
#compu-headbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 450;                 /* sobre el header; bajo los side-drawers de Woodmart */
  background: #fff;
  border-bottom: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 4px 18px rgba(0,0,0,.07);
  transform: translateY(-100%);
  transition: transform .28s cubic-bezier(.22,.61,.36,1);
  will-change: transform;
}
#compu-headbar.is-on { transform: translateY(0); }

/* Deja sitio a la admin bar de WP para usuarios logueados */
body.admin-bar #compu-headbar { top: 32px; }
@media (max-width: 782px) { body.admin-bar #compu-headbar { top: 46px; } }

#compu-headbar .compu-headbar__inner {
  display: flex;
  align-items: center;
  gap: 22px;
  max-width: 1390px;            /* ~ ancho de contenido del tema */
  margin: 0 auto;
  padding: 8px 24px;
  min-height: 72px;
}

/* Logo (clon): contenido) — escala al alto de la barra */
#compu-headbar .compu-headbar__logo {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
}
#compu-headbar .compu-headbar__logo img,
#compu-headbar .compu-headbar__logo svg {
  max-height: 54px !important;
  height: auto !important;
  width: auto !important;
  max-width: 230px;
}
#compu-headbar .compu-headbar__logo a { display: inline-flex; align-items: center; }

/* Buscador (nodo movido): ocupa el espacio que dejaba el menú */
#compu-headbar .compu-headbar__search {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 720px;
}
#compu-headbar .compu-headbar__search .wd-header-search,
#compu-headbar .compu-headbar__search .wd-search-form,
#compu-headbar .compu-headbar__search form { width: 100%; }

/* Herramientas (cuenta + carrito, nodos movidos) */
#compu-headbar .compu-headbar__tools {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 18px;
  margin-left: auto;
}
#compu-headbar .compu-headbar__tools .wd-tools-element { margin: 0 !important; }

/* En la barra compacta los iconos van en tono oscuro (header puede ser claro/oscuro) */
#compu-headbar .wd-tools-icon,
#compu-headbar .wd-tools-element > a { color: inherit; }

/* Solo desktop: en móvil ocultamos la barra por completo */
@media (max-width: 1024px) {
  #compu-headbar { display: none !important; }
}
