/* ===========================
   Explorer Publicaciones (CT) - LIMPIO (FINAL)
   - Desktop: 1 línea (Combo + Vendedor + Buscar)
   - Mobile: 1) Combo + Vendedor en línea  2) Buscar debajo
   - Sin íconos en filtros
   =========================== */

.ct-explorer {
    max-width: 1200px;
    margin: 1rem auto 1.1rem;
    padding: 1rem 1rem;
    /* ✅ CAMBIO: Fondo "Blanco Humo" SIEMPRE (Desktop y Mobile) */
    /* Esto evita que se mezcle con el contenido al hacer scroll */
    /* ✅ 1. FONDO CON MÁS CUERPO */
    /* Un gris azulado claro que no se mezcla con el blanco puro */
    background-color: #f1f5f9 !important;
    /* ✅ 2. BORDE MÁS DEFINIDO */
    /* Aumentamos la opacidad del color del borde */
    border: 2px solid rgba(15, 23, 42, 0.15) !important;
    border-radius: 18px;
    /* ✅ 3. SOMBRA DE ELEVACIÓN (Depth) */
    /* Esta combinación crea la ilusión de que la barra está "levantada" del piso */
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
    /* ✅ NUEVO: Efecto pegajoso */
    position: -webkit-sticky; /* Para Safari/iOS */
    position: sticky; /* Estándar */
    z-index: 900; /* Z-index alto para que pase por encima de las fotos */
    transition: top 0.3s; /* Suaviza si cambia la altura */
}

/* Head */
.ct-explorer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .7rem;
}

.ct-explorer-title {
    display: flex;
    align-items: center;
    gap: .65rem;
}

    .ct-explorer-title h2 {
        margin: 0;
        font-size: 1.75rem;
        letter-spacing: -0.02em;
        color: #0f172a;
    }

.ct-badge {
    display: inline-flex;
    align-items: center;
    padding: .26rem .62rem;
    border-radius: 999px;
    font-weight: 900;
    font-size: .72rem;
    letter-spacing: .10em;
    text-transform: uppercase;
    color: #0f766e;
    background: rgba(15,118,110,.10);
    border: 1px solid rgba(15,118,110,.22);
}

/* Controls */
.ct-explorer-row .ct-control {
    height: 44px;
    border-radius: 14px;
    border: 1px solid rgba(15,23,42,.10);
    padding: .65rem .9rem;
    transition: box-shadow .18s ease, border-color .18s ease, background .18s ease;
}

    .ct-explorer-row .ct-control:focus {
        outline: none;
        border-color: rgba(15,118,110,.55);
        box-shadow: 0 0 0 .25rem rgba(15,118,110,.12), 0 12px 22px rgba(15,23,42,.08);
        background: #fff;
    }

/* Botón vendedor premium */
#btnBuscarVendedorHome.ct-btn-vendor {
    height: 44px;
    border-radius: 999px;
    padding: .6rem 1rem;
    font-weight: 900;
    border: 1px solid rgba(15,118,110,.35);
    background: linear-gradient(135deg,#ecfeff,#f0fdfa);
    color: #0f766e;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    box-shadow: 0 8px 18px rgba(15,23,42,.08);
    transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
    white-space: nowrap;
}

    #btnBuscarVendedorHome.ct-btn-vendor:hover {
        transform: translateY(-1px);
        box-shadow: 0 14px 26px rgba(15,23,42,.12);
        background: linear-gradient(135deg,#ccfbf1,#ecfeff);
    }

    #btnBuscarVendedorHome.ct-btn-vendor:active {
        transform: translateY(0);
    }

/* ===== Desktop: 1 línea, con aire y sin encimes ===== */
@media (min-width: 992px) {
    .ct-explorer-row {
        --bs-gutter-x: 1rem; /* aire entre columnas */
    }

    /* dejamos un mínimo para que no se achique raro */
    .ct-col-type {
        min-width: 240px;
    }

    .ct-col-search {
        min-width: 340px;
    }

    /* el botón que no se pegue al combo */
    .ct-col-vendor {
        display: flex;
        justify-content: flex-end;
    }

    #btnBuscarVendedorHome {
        min-width: 200px;
    }
}

/* ===== Mobile: 2 columnas arriba + buscador abajo ===== */
/* ===== MOBILE AJUSTE FINO – Explorer ===== */
/* ===== MOBILE AJUSTE FINO – Explorer (CORREGIDO) ===== */
/* ===== MOBILE FIX: FUERZA BRUTA ===== */
/* ===== MOBILE COMPACTO (FINAL) ===== */
/* ===== MOBILE: SOLUCIÓN SIN SUPERPOSICIÓN ===== */
/* ===== MOBILE FIX DEFINITIVO (minmax) ===== */
@media (max-width: 767.98px) {

    .ct-explorer-row {
        display: grid !important;
        /* "minmax(0, 1fr)" OBLIGA al combo a encogerse si no hay espacio. 
           "auto" ajusta el botón al tamaño de su texto. */
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-rows: auto auto !important;
        gap: 8px !important; /* Espacio real entre combo y botón */
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        align-items: center !important;
    }

    /* 1. EL COMBO "TODOS" */
    .ct-col-type {
        grid-column: 1;
        grid-row: 1;
        width: 100% !important;
        min-width: 0 !important; /* CRÍTICO para que respete el ancho de la grilla */
        margin: 0 !important;
        position: relative !important; /* Evita que flote raro */
    }

    /* 2. EL BOTÓN "BUSCAR VENDEDOR" */
    .ct-col-vendor {
        grid-column: 2;
        grid-row: 1;
        width: auto !important;
        margin: 0 !important;
        z-index: 10; /* Asegura que quede por encima si llegaran a tocarse */
    }

    /* 3. EL BUSCADOR (ABAJO) */
    .ct-col-search {
        grid-column: 1 / -1; /* Ocupa todo el ancho */
        grid-row: 2;
        width: 100% !important;
        margin-top: 4px !important;
    }

    /* === AJUSTE DE TAMAÑOS (MINI) === */

    /* Forzamos al Input/Select a respetar su contenedor padre */
    .ct-explorer-row .ct-control {
        width: 100% !important;
        max-width: 100% !important;
        height: 34px !important; /* Altura compacta */
        padding: 0 8px !important;
        font-size: 12px !important; /* Letra reducida */
        border-radius: 6px !important;
        box-sizing: border-box !important; /* Para que el padding no sume ancho */
    }

    /* Botón super compacto */
    #btnBuscarVendedorHome.ct-btn-vendor {
        height: 34px !important;
        padding: 0 8px !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        white-space: nowrap !important;
        border-radius: 6px !important;
        position: static !important; /* Reset total de posición */
        width: auto !important;
        display: inline-flex !important;
        align-items: center;
    }
    /* 2. TÍTULO "PUBLICACIONES" MÁS CHICO */
    .ct-explorer-title h2 {
        font-size: 1.05rem !important; /* Tamaño reducido (antes ~1.25rem) */
        font-weight: 700 !important;
        color: #1e293b !important; /* Gris oscuro elegante */
        margin-bottom: 2px !important; /* Pegadito a los controles */
    }

    /* Opcional: Ajustar el badge "EXPLORAR" para que haga juego */
    .ct-badge {
        font-size: 0.6rem !important;
        padding: 2px 6px !important;
        height: auto !important;
    }
}
/* extra tight */
@media (max-width: 480px) {
    .ct-explorer-row .ct-control,
    #btnBuscarVendedorHome {
        height: 42px;
    }
}
@media (min-width: 992px) {
    .ct-col-vendor {
        margin-left: .75rem; /* 👈 aire entre combo y botón */
    }
}
/* ===== AJUSTE DE ALTURA STICKY (Donde se pega) ===== */

/* DESKTOP (Pantallas grandes): Bajar aprox 2cm */
@media (min-width: 992px) {
    .ct-explorer {
        /* Esto deja un hueco de ~75px desde el techo del navegador */
        /* Si tu menú de arriba es más alto, aumenta este número */
        top: 65px;
    }
}

/* MOBILE (Celulares): Bajar aprox 3cm */
@media (max-width: 767.98px) {
    .ct-explorer {
        /* Esto deja un hueco de ~115px desde el techo */
        /* Ideal si tienes un menú y luego botones de categorías arriba */
        top: 115px;
    }
}
/* ===========================
   BREADCRUMBS (Provincia > Localidad)
   =========================== */

/* Contenedor flexible */
.ct-breadcrumbs-nav {
    display: flex;
    align-items: center;
    flex-wrap: wrap; /* Permite que baje de línea si es muy largo en celular */
    gap: 6px; /* Espacio entre palabras y flecha */
    line-height: 1.2;
}

/* Enlaces (Provincia) - Color Azul como la foto */
.ct-crumb-link {
    text-decoration: none;
    color: #2563eb; /* Azul intenso */
    font-weight: 500;
    font-size: 1.35rem; /* Tamaño grande en Desktop */
    transition: color 0.2s;
}

    .ct-crumb-link:hover {
        color: #1e40af; /* Azul más oscuro al pasar mouse */
        text-decoration: underline;
    }

/* Separador (>) */
.ct-crumb-sep {
    color: #94a3b8; /* Gris suave */
    display: flex;
    align-items: center;
    font-size: 0.9rem; /* Flecha un poco más chica */
}

/* Ubicación Actual (Localidad) - Color Gris Oscuro */
.ct-crumb-current {
    color: #0f172a;
    font-weight: 700; /* Negrita */
    font-size: 1.35rem; /* Igual que el link */
}

/* ===== AJUSTE MOBILE (Compacto) ===== */
@media (max-width: 767.98px) {

    .ct-explorer-title {
        /* Ajustamos el gap del título general */
        gap: 0.5rem !important;
    }

    /* Reducimos fuertemente el tamaño en celular */
    .ct-crumb-link,
    .ct-crumb-current {
        font-size: 1.05rem !important; /* Tamaño armónico con los inputs */
    }

    .ct-crumb-sep {
        font-size: 0.75rem !important; /* Flecha chiquita */
    }

    /* Ajuste del Badge para que quede alineado */
    .ct-badge {
        font-size: 0.65rem !important;
        padding: 2px 6px !important;
        align-self: center;
    }
}
/* ===== Breadcrumb GEO – mantener estilo original ===== */
.ct-breadcrumbs-nav {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.95rem; /* 👈 vuelve al tamaño anterior */
    font-weight: 600;
    line-height: 1;
}

    .ct-breadcrumbs-nav a,
    .ct-breadcrumbs-nav span {
        font-size: inherit; /* 👈 evita que JS / estilos inyectados agranden */
        font-weight: inherit;
    }

.ct-crumb-link {
    color: #2563eb; /* azul prolijo como antes */
    text-decoration: none;
}

    .ct-crumb-link:hover {
        text-decoration: underline;
    }

.ct-crumb-sep {
    opacity: .6;
    margin: 0 2px;
}

.ct-crumb-current {
    color: #0f172a;
    font-weight: 600;
}