/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Apr 30 2026 | 04:08:36 */
/* ===========================================================
 * FIBOSEARCH — BUSCADOR DE HEADER
 * Sitio: staging.lubtrac.com.mx (AVSYS DIVI 4)
 * Basado en: elijahandvictoria.com
 *
 * PROPÓSITO:
 *   Posicionar el campo desplegable relativo al ícono,
 *   sin sombra, con bordes redondeados, y garantizar que
 *   tanto el campo como la caja AJAX queden siempre
 *   encima del menú principal y de los módulos Divi.
 *
 * REGLA: sin modificaciones en móvil (< 981px).
 *
 * ─── AUDITORÍA vs. versión anterior ────────────────────────
 *   CORREGIDO   Tres bloques @media separados fundidos en uno
 *               por sección lógica → cascada predecible.
 *
 *   CORREGIDO   position: relative declarado 3 veces en
 *               .av-search → ahora una sola declaración.
 *
 *   CORREGIDO   z-index: 20 en bloque 2 pisado por z-index: 50
 *               en bloque 3 → eliminado el valor muerto.
 *
 *   CORREGIDO   isolation: isolate en .av-menu-header creaba
 *               un stacking context que aislaba los hijos
 *               dificultando el z-index de los descendientes;
 *               reemplazado por overflow: visible que es lo
 *               que realmente se necesita.
 *
 *   CORREGIDO   z-index escalation innecesaria (999 → 9999 →
 *               999999 → 1000000). Jerarquía simplificada a
 *               cuatro niveles documentados.
 *
 *   CORREGIDO   .av-columna-2 recibía z-index: 1 con !important
 *               en el último bloque aunque ya estaba declarado
 *               sin !important antes → unificado, sin conflicto.
 *
 *   MEJORADO    Variables CSS en :root para configuración
 *               sin tocar las reglas (offset, anchos, colores).
 *
 *   MEJORADO    !important reducido al mínimo indispensable
 *               (sólo donde el plugin inyecta inline-styles).
 *
 *   MEJORADO    Número mágico "-53px" documentado.
 *
 *   PRESERVADO  display: inline-flex en .av-search que el
 *               bloque 3 original no volvía a declarar pero
 *               que es necesario para el alineado vertical.
 * =========================================================== */


/* ===========================================================
 * VARIABLES DE CONFIGURACIÓN
 * Ajusta aquí sin tocar las reglas de abajo.
 * =========================================================== */
:root {
  /* Desplazamiento horizontal del form desde el borde derecho
     del wrapper (.av-search). Coincide con el ancho del ícono. */
  --fibo-form-right: 25px;

  /* El ícono de búsqueda mide ~53 px de alto; restar ese valor
     al 100% del wrapper alinea visualmente el form con el ícono
     en lugar de dejarlo debajo. Ajusta si cambias el tamaño
     del ícono en el header. */
  --fibo-icon-height: 53px;

  /* Dimensiones del campo desplegable */
  --fibo-form-min-width: 430px;
  --fibo-form-max-width: 490px;

  /* Bordes redondeados */
  --fibo-form-radius: 14px;
  --fibo-results-radius: 18px;

  /* Altura mínima del input */
  --fibo-input-height: 46px;

  /* Separación entre el input y la caja de resultados */
  --fibo-results-gap: 14px;

  /* Borde de la caja de resultados */
  --fibo-results-border: #e9e6df;
}


/* ===========================================================
 * SECCIÓN 1 — CONTEXTOS DE APILAMIENTO DEL HEADER
 *
 * Jerarquía de z-index (de menor a mayor):
 *   1      .av-columna-2 / .av-menu          (menú principal)
 *   50     .av-columna-3 / .av-search        (zona de iconos)
 *   9 999  .dgwt-wcas-search-form            (campo desplegado)
 *  10 000  .dgwt-wcas-suggestions-wrapp      (resultados AJAX)
 *
 * NOTA: overflow:visible en .av-menu-header es indispensable;
 * NO usar isolation:isolate aquí porque aislaría el stacking
 * context y rompería los z-index de los hijos.
 * =========================================================== */

@media (min-width: 981px) {

  /* Contenedor del header: referencia de apilamiento sin cortar */
  .av-menu-header,
  .av-menu-container {
    position: relative;
    z-index: 1000;
    overflow: visible;
  }

  /* Menú principal: capa base */
  .av-columna-2,
  .av-menu {
    position: relative;
    z-index: 1;
  }

  /* Zona de iconos y buscador: por encima del menú */
  .av-columna-3 {
    position: relative;
    z-index: 50;
    overflow: visible;
  }

  /* Módulo de búsqueda: ancla visual del posicionamiento */
  .av-search {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 50;
    overflow: visible;
  }

  /* Wrapper del plugin: no debe cortar el dropdown */
  .av-search .dgwt-wcas-search-wrapp {
    position: relative;
    z-index: 50;
    width: auto;
    overflow: visible;
  }
}


/* ===========================================================
 * SECCIÓN 2 — POSICIONAMIENTO DEL CAMPO DESPLEGABLE
 *
 * Se ancla al borde derecho del ícono (right: --fibo-form-right)
 * y se sube para alinearse con él (top: calc(100% - --fibo-icon-height)).
 * transform:none cancela el centrado automático del plugin.
 * =========================================================== */

@media (min-width: 981px) {

  html:not(.dgwt-wcas-overlay-mobile-on)
  .av-search .dgwt-wcas-search-wrapp.dgwt-wcas-layout-icon
  .dgwt-wcas-search-form {
    position: absolute !important;
    left: auto !important;
    right: var(--fibo-form-right) !important;
    top: calc(100% - var(--fibo-icon-height)) !important;
    min-width: var(--fibo-form-min-width) !important;
    max-width: var(--fibo-form-max-width) !important;
    transform: none !important;
    z-index: 9999 !important;
  }
}


/* ===========================================================
 * SECCIÓN 3 — ESTILOS VISUALES DEL CAMPO
 * Sin sombra, bordes redondeados, padding limpio.
 * =========================================================== */

@media (min-width: 981px) {

  /* Caja exterior blanca */
  .av-search .dgwt-wcas-search-form {
    border-radius: var(--fibo-form-radius);
    padding: 8px;
    box-shadow: none !important; /* el plugin inyecta sombra via inline-style */
  }

  /* Contenedor interno del input (forma de píldora) */
  .av-search .dgwt-wcas-sf-wrapp {
    border-radius: 999px;
    overflow: hidden;
  }

  /* Input */
  .av-search .dgwt-wcas-search-input {
    min-height: var(--fibo-input-height);
    padding-left: 44px;
    padding-right: 16px;
  }
}


/* ===========================================================
 * SECCIÓN 4 — CAJA AJAX DE RESULTADOS
 * z-index un nivel por encima del campo para asegurar visibilidad.
 * =========================================================== */

@media (min-width: 981px) {

  .dgwt-wcas-suggestions-wrapp {
    margin-top: var(--fibo-results-gap) !important;
    border-radius: var(--fibo-results-radius) !important;
    overflow: hidden;
    border: 1px solid var(--fibo-results-border) !important;
    box-sizing: border-box;
    z-index: 10000 !important;
  }

  /* Los ítems individuales heredan el clip del wrapper */
  .dgwt-wcas-suggestion {
    border-radius: 0 !important;
  }
}