/* =========================================================
   GX SMART SEARCH – DROPDOWN UNIFICADO (NAVBAR V4)
   ========================================================= */

/* CONTENEDOR */

.navbar-v4 .gx-search-results {

    position:absolute;
    top:calc(100% + 8px);
    left:0;
    width:100%;
    min-width:680px;

    background:#fff;

    border-radius:14px;

    box-shadow:0 15px 40px rgba(0,0,0,0.18);

    z-index:1000; /* menor que sidebar */

    overflow:hidden;

    opacity:0;
    visibility:hidden;

    transform:translateY(-8px);

    transition:all .2s ease;

    display:flex;
    flex-direction:row;

    align-items:stretch;

    }
    
    
    /* visible */
    
    .navbar-v4 .gx-search-results.is-visible{
    
    opacity:1;
    visibility:visible;
    
    transform:translateY(0);
    
    }
    
    
    .navbar-v4 .gx-search-results:empty{
    
    display:none!important;
    
    }
    
    
    /* =========================================================
       COLUMNAS
       ========================================================= */
    
    .navbar-v4 .gx-search-results .gx-search-group{
    
    flex:1;
    
    display:flex;
    
    flex-direction:column;
    
    padding:12px 0;
    
    border-right:1px solid #f1f1f1;
    
    min-width:200px;
    
    }
    
    .navbar-v4 .gx-search-results .gx-search-group:last-child{
    
    border-right:none;
    
    }
    
    
    /* PRODUCTOS */

    .navbar-v4 .gx-search-results .gx-products{

    flex:2.5;
    display:flex;
    flex-direction:column;

    background:#fafafa;

    max-height:420px;

    overflow-y:auto;

    }
    
    
    /* =========================================================
       TITULOS
       ========================================================= */
    
    .navbar-v4 .gx-search-results .gx-search-title{
    
    font-size:11px;
    
    text-transform:uppercase;
    
    color:#8a8a8a;
    
    font-weight:700;
    
    padding:10px 16px;
    
    letter-spacing:.6px;
    
    }
    
    
    /* =========================================================
       ITEMS
       ========================================================= */
    
    .navbar-v4 .gx-search-results .gx-search-item{
    
    display:flex;
    
    align-items:center;
    
    gap:12px;
    
    padding:10px 16px;
    
    text-decoration:none;
    
    color:#333;
    
    transition:background .15s ease;
    
    width:100%;
    
    }
    
    .navbar-v4 .gx-search-results .gx-search-item:hover{
    
    background:#f3f6fa;
    
    }
    
    
    /* IMAGEN */
    
    .navbar-v4 .gx-search-results .gx-search-item img{
    
    width:44px;
    height:44px;
    
    object-fit:cover;
    
    border-radius:8px;
    
    flex-shrink:0;
    
    border:1px solid #eee;
    
    }
    
    
    /* INFO PRODUCTO */
    
    .navbar-v4 .gx-search-results .gx-search-product-info{
    
    display:flex;
    
    flex-direction:column;
    
    }
    
    .navbar-v4 .gx-search-results .gx-search-product-title{
    
    font-size:14px;
    
    font-weight:600;
    
    line-height:1.3;
    
    }
    
    .navbar-v4 .gx-search-results .gx-search-product-cat{
    
    font-size:12px;
    
    color:#8a8a8a;
    
    }
    
    .navbar-v4 .gx-search-results .gx-search-product-price{
    
    font-size:13px;
    
    color:#2271b1;
    
    font-weight:700;
    
    }
    
    
    /* CATEGORIAS */
    
    .navbar-v4 .gx-search-results .gx-search-item.cat{
    
    font-weight:600;
    
    font-size:14px;
    
    }
    
    
    /* =========================================================
       SCROLL PRODUCTOS
       ========================================================= */
    
    .navbar-v4 .gx-search-results .gx-products::-webkit-scrollbar{
    
    width:6px;
    
    }
    
    .navbar-v4 .gx-search-results .gx-products::-webkit-scrollbar-thumb{
    
    background:#d0d0d0;
    
    border-radius:6px;
    
    }
    
    
    /* =========================================================
       PANEL POPULAR
       ========================================================= */
    
    .navbar-v4 .gx-search-popular{
    
    position:absolute;
    
    top:calc(100% + 6px);
    
    left:0;
    
    width:100%;
    
    background:#fff;
    
    border-radius:14px;
    
    box-shadow:0 15px 40px rgba(0,0,0,0.18);
    
    padding:20px;
    
    display:none;
    
    z-index:1000;
    
    }
    
    .navbar-v4 .gx-search-popular-grid{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:10px;
    
    margin-top:10px;
    
    }
    
    .navbar-v4 .gx-search-popular-grid a{
    
    background:#f6f7f9;
    
    padding:10px 12px;
    
    border-radius:8px;
    
    text-decoration:none;
    
    color:#333;
    
    font-weight:600;
    
    font-size:14px;
    
    text-align:center;
    
    transition:.15s;
    
    }
    
    .navbar-v4 .gx-search-popular-grid a:hover{
    
    background:#2271b1;
    
    color:#fff;
    
    }
    
    
    /* =========================================================
       MOBILE
       ========================================================= */
    
    @media (max-width:768px){

        .navbar-v4__search-container.mobile-only {
            z-index: 1;
        }
    .navbar-v4 .gx-search-results{
    min-width:0;
    
    flex-direction:column;
    
    max-height:70vh;
    
    overflow-y:auto;
    
    border-radius:0 0 14px 14px;
    
    }
    
    .navbar-v4 .gx-search-results .gx-search-group{
    
    border-right:none;
    
    border-bottom:1px solid #eee;
    
    }
    
    .navbar-v4 .gx-search-results .gx-products{
    
    max-height:none;
    
    }
    
    .navbar-v4 .gx-search-popular-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    }

    /* =========================================================
   AJUSTES TIPOGRAFÍA
   ========================================================= */

.navbar-v4 .gx-search-results{

    font-family:inherit;
    font-size:14px;
    
    }
    
    .navbar-v4 .gx-search-product-title{
    
    font-size:14px;
    font-weight:600;
    line-height:1.4;
    
    }
    
    .navbar-v4 .gx-search-product-title strong{
    
    color:#2271b1;
    font-weight:700;
    
    }
    
    .navbar-v4 .gx-search-item.cat{
    
    font-weight:600;
    
    }
    
    .navbar-v4 .gx-search-product-cat{
    
    font-size:12px;
    color:#8a8a8a;
    
    }

    .navbar-v4 .gx-search-item{

        line-height:1.4;

        }

    /* =========================================================
       FILTER BADGE — aparece cuando la búsqueda está categorizada
       ========================================================= */

    .navbar-v4 .gx-filter-badge {
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 7px 16px;
        background: #eef4fb;
        color: #1a5a9e;
        font-size: 12px;
        font-weight: 500;
        border-bottom: 1px solid #d2e5f6;
    }

    .navbar-v4 .gx-filter-badge strong {
        font-weight: 700;
    }

    .navbar-v4 .gx-filter-badge svg {
        flex-shrink: 0;
        opacity: 0.7;
    }

    /* VER TODOS — link al pie de la columna de productos */

    .navbar-v4 .gx-search-see-all {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        padding: 11px 16px;
        margin-top: auto;
        background: #f4f8fd;
        color: #2271b1;
        font-size: 13px;
        font-weight: 600;
        text-decoration: none;
        border-top: 1px solid #d2e5f6;
        transition: background .15s, color .15s;
    }

    .navbar-v4 .gx-search-see-all:hover {
        background: #2271b1;
        color: #fff;
    }

    .navbar-v4 .gx-search-see-all svg {
        flex-shrink: 0;
        transition: transform .15s;
    }

    .navbar-v4 .gx-search-see-all:hover svg {
        transform: translateX(3px);
    }

    /* =========================================================
       SIN RESULTADOS
       ========================================================= */

    .navbar-v4 .gx-no-results {
        padding: 28px 20px;
        text-align: center;
        display: flex;
        flex-direction: column;
        gap: 8px;
        min-width: 280px;
    }

    .navbar-v4 .gx-no-results__main {
        font-size: 14px;
        color: #444;
        line-height: 1.5;
    }

    .navbar-v4 .gx-no-results__main strong {
        color: #111;
    }

    .navbar-v4 .gx-no-results__hint {
        font-size: 12px;
        color: #8a8a8a;
    }