/* ============================================================
   list-cerca-de-mi.css
   Estilos para la vista de listado por proximidad (cerca-de-mi)
   Reemplaza los estilos del mapa Leaflet.
   ============================================================ */

/* ── Barra resumen superior ─────────────────────────────────── */
.cerca-summary-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    margin-bottom: 18px;
    background: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 10px;
    font-size: 0.92rem;
    color: var(--bs-secondary-color, #6c757d);
    /* Span full grid width when inside anuncios-lista grid */
    grid-column: 1 / -1;
}

.cerca-summary-bar .cerca-icon {
    font-size: 1.3rem;
    color: #e63946;
    flex-shrink: 0;
}

.cerca-summary-bar strong {
    color: var(--bs-body-color, #212529);
}

/* ── Separador de tramo ─────────────────────────────────────── */
.cerca-band-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 28px 0 14px;
    user-select: none;
    /* Span full grid width when inside anuncios-lista grid */
    grid-column: 1 / -1;
}

.cerca-band-header:first-of-type {
    margin-top: 4px;
}

.cerca-band-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.82rem;
    font-weight: 700;
    white-space: nowrap;
    letter-spacing: 0.01em;
    background: #e63946;
    color: #fff;
    box-shadow: 0 1px 4px rgba(230, 57, 70, 0.25);
}

.cerca-band-pill .cerca-band-icon {
    font-size: 0.9rem;
}

.cerca-band-line {
    flex: 1;
    height: 1px;
    background: var(--bs-border-color, #dee2e6);
}

.cerca-band-count {
    font-size: 0.78rem;
    color: var(--bs-secondary-color, #6c757d);
    white-space: nowrap;
}

/* ── Empty state ────────────────────────────────────────────── */
.cerca-empty {
    text-align: center;
    padding: 48px 16px;
    color: var(--bs-secondary-color, #6c757d);
    /* Span full grid width when inside anuncios-lista grid */
    grid-column: 1 / -1;
}

.cerca-empty .cerca-empty-icon {
    font-size: 3rem;
    margin-bottom: 12px;
    display: block;
    opacity: 0.4;
}

/* ── GPS Help Block (sin mapa) ──────────────────────────────── */
.cerca-gps-card {
    border-radius: 14px;
    border: 1px solid var(--bs-border-color, #dee2e6);
    overflow: hidden;
}

.cerca-gps-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    font-weight: 700;
    font-size: 1rem;
    border-radius: 10px;
    background: #e63946;
    color: #fff;
    border: none;
    cursor: pointer;
    transition: background 0.18s, transform 0.12s;
    box-shadow: 0 2px 10px rgba(230, 57, 70, 0.3);
}

.cerca-gps-btn:hover {
    background: #c1121f;
    transform: translateY(-1px);
}

.cerca-gps-btn:disabled {
    background: #adb5bd;
    transform: none;
    cursor: not-allowed;
}

.cerca-gps-error {
    display: none;
    margin-top: 10px;
    font-size: 0.85rem;
    color: #dc3545;
}