/* ============================================================
   Runfit: buscador de /evento/ (plugin Runfit Buscador de Eventos)
   Se carga detrás de rf-eventos.css del tema y solo cambia lo necesario:
   formulario sin JavaScript, panel plegable en móvil, zonas de toque de 44 px,
   listas semánticas y estado vacío con sugerencias.
   ============================================================ */

.rf-sr-only {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0);
    white-space: nowrap; border: 0;
}

/* --- Búsqueda --- */
.rf-buscador .rf-search-wrap { margin-bottom: 16px; }
.rf-buscador .rf-search-label {
    display: block;
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 700;
    color: var(--rf-ink);
}
.rf-buscador .rf-search-field { position: relative; }
.rf-buscador .rf-search {
    width: 100%;
    min-height: 44px;
    padding: 10px 44px 10px 36px;
    font-size: 16px; /* evita el zoom de iOS al enfocar */
    box-sizing: border-box;
}
.rf-buscador .rf-search-icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); }
/* Centrada en la caja: rf-eventos.css del tema ya pone top:50% y translateY(-50%); con top:0 el botón subía 22 px. */
.rf-buscador .rf-search-clear {
    position: absolute; right: 0; top: 50%; transform: translateY(-50%);
    width: 44px; height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
    background: none; border: 0; cursor: pointer; color: var(--rf-muted);
}
.rf-buscador .rf-search-clear[hidden] { display: none; }
.rf-buscador .rf-search-clear:focus-visible { outline: none; box-shadow: var(--rf-focus-ring); border-radius: 4px; }

/* --- Panel de filtros: <details> que funciona sin JavaScript --- */
.rf-buscador .rf-filters { display: block; }
.rf-buscador .rf-filters__summary {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    min-height: 44px;
    padding: 0 12px;
    margin: 0 0 12px;
    background: #fff;
    border: 1px solid var(--rf-line);
    border-radius: 4px;
    font-weight: 700; color: var(--rf-ink);
    cursor: pointer;
    list-style: none;
}
.rf-buscador .rf-filters__summary::-webkit-details-marker { display: none; }
.rf-buscador .rf-filters__summary::after { content: '▾'; color: var(--rf-muted); }
.rf-buscador .rf-filters__details[open] > .rf-filters__summary::after { content: '▴'; }
.rf-buscador .rf-filters__summary:focus-visible { outline: none; box-shadow: var(--rf-focus-ring); }
.rf-buscador .rf-filters__summary .rf-filter-title { margin: 0; }
.rf-buscador .rf-filters__active { margin-left: auto; color: var(--rf-blue); }

.rf-buscador .rf-filter-group { border: 0; padding: 0; margin: 0 0 20px; min-width: 0; }
.rf-buscador .rf-filter-group__label { padding: 0; margin: 0 0 6px; }

.rf-buscador .rf-checkbox { min-height: 44px; padding: 0; gap: 10px; }
.rf-buscador .rf-check-input { width: 20px; height: 20px; margin: 0; flex: 0 0 auto; }
.rf-buscador .rf-checkbox__label { flex: 1 1 auto; }
.rf-buscador .rf-checkbox__count { font-size: 12px; color: var(--rf-muted); font-variant-numeric: tabular-nums; }
.rf-buscador .is-empty { opacity: 0.55; }

/* Meses: casillas con aspecto de botón (sin JavaScript también funcionan). */
.rf-buscador .rf-months-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.rf-buscador .rf-month { position: relative; display: block; cursor: pointer; }
.rf-buscador .rf-month__input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.rf-buscador .rf-month__text {
    display: flex; align-items: center; justify-content: center;
    min-height: 44px;
    border: 1px solid var(--rf-line); border-radius: 4px;
    background: #fff; font-size: 13px; color: var(--rf-body);
}
.rf-buscador .rf-month__input:checked + .rf-month__text { background: var(--rf-blue); border-color: var(--rf-blue); color: #fff; }
.rf-buscador .rf-month__input:focus-visible + .rf-month__text { box-shadow: var(--rf-focus-ring); }

.rf-buscador .rf-more-countries > summary {
    display: flex; align-items: center; min-height: 44px;
    cursor: pointer; font-size: 14px; color: var(--rf-blue);
}
.rf-buscador .rf-more-countries > summary:focus-visible { outline: none; box-shadow: var(--rf-focus-ring); }

.rf-buscador .rf-filters__actions { display: flex; flex-direction: column; gap: 8px; }
.rf-buscador .rf-apply {
    min-height: 44px; width: 100%;
    background: var(--rf-blue); color: #fff;
    border: 0; border-radius: 4px; font-weight: 700; font-size: 15px; cursor: pointer;
}
.rf-buscador .rf-apply:focus-visible { outline: none; box-shadow: var(--rf-focus-ring); }
.rf-buscador .rf-clear-btn {
    display: flex; align-items: center; justify-content: center;
    min-height: 44px; width: 100%; box-sizing: border-box; text-decoration: none;
}

/* --- Resultados --- */
.rf-buscador .rf-sort { min-height: 44px; font-size: 14px; }
.rf-buscador .rf-chips { list-style: none; padding: 0; }
.rf-buscador .rf-chips:empty { display: none; }
.rf-buscador .rf-chips li { margin: 0; }
.rf-buscador .rf-chip, .rf-buscador .rf-chips-clear {
    min-height: 44px; box-sizing: border-box; text-decoration: none;
    display: inline-flex; align-items: center;
}
.rf-buscador .rf-note { margin: 0 0 12px; font-size: 14px; color: var(--rf-muted); }
.rf-buscador .rf-note[hidden] { display: none; }

.rf-buscador .rf-grid { list-style: none; margin: 0; padding: 0; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); }
.rf-buscador .rf-result { display: flex; margin: 0; min-width: 0; }
.rf-buscador .rf-result > .rf-card { flex: 1 1 auto; width: 100%; min-width: 0; }
.rf-buscador .rf-card__note { margin: 4px 0 0; font-size: 13px; color: var(--rf-muted); }

.rf-buscador .rf-empty { padding: 24px; border: 1px dashed var(--rf-line); border-radius: 4px; background: var(--rf-surface-2); }
.rf-buscador .rf-empty[hidden] { display: none; }
.rf-buscador .rf-empty__title { margin: 0 0 8px; font-weight: 700; color: var(--rf-ink); }
.rf-buscador .rf-empty__intro { margin: 0 0 4px; }
.rf-buscador .rf-empty__list { margin: 0; padding: 0; list-style: none; }
.rf-buscador .rf-empty__list a { display: inline-flex; align-items: center; min-height: 44px; }
.rf-buscador .rf-empty__count { color: var(--rf-muted); }

.rf-buscador .rf-pagination[hidden] { display: none; }
.rf-buscador .rf-pag-btn { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
.rf-buscador .rf-pag-btn.is-disabled { opacity: 0.4; cursor: default; }

.rf-buscador .rf-calendar-link { margin: 16px 0 0; font-size: 14px; }
.rf-buscador .rf-calendar-link[hidden] { display: none; }

.rf-buscador .rf-quick-link { min-height: 44px; display: inline-flex; align-items: center; box-sizing: border-box; }

.rf-buscador .rf-calendars { margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--rf-line); }
.rf-buscador .rf-calendars__title { font-size: 18px; margin: 0 0 8px; color: var(--rf-ink); }
.rf-buscador .rf-calendars ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 0 24px; }
.rf-buscador .rf-calendars a { display: flex; align-items: center; min-height: 44px; }

/* --- Escritorio: panel siempre abierto, sin cabecera plegable ni botón de aplicar (con JavaScript) ---
   El <details> llega cerrado (ronda 5): desde 861 px se enseña su contenido con ::details-content, antes de que corra
   ningún JavaScript, así que no hay salto (CLS) al arrancar. Donde no existe ::details-content (Safari anterior a 18.4,
   Firefox antiguos) la cabecera sigue a la vista hasta que el JS abre el panel, y sin JS se abre tocándola. */
@media (min-width: 861px) {
    @supports selector(::details-content) {
        .rf-buscador .rf-filters__details::details-content { content-visibility: visible; display: block; }
        .rf-buscador .rf-filters__summary { display: none; }
    }
    html.rf-js .rf-buscador .rf-filters__summary { display: none; }
    html.rf-js .rf-buscador .rf-apply { display: none; }
}

/* --- Móvil: el panel va encima de los resultados y se pliega --- */
@media (max-width: 860px) {
    /* minmax(0, 1fr): sin esto la columna crece hasta el contenido más ancho (la paginación) y la página desborda. */
    .rf-buscador .rf-layout { grid-template-columns: minmax(0, 1fr); }
    .rf-buscador .rf-filters, .rf-buscador .rf-results { min-width: 0; }
    .rf-buscador .rf-filters { position: static; display: block; }
    .rf-buscador .rf-results-bar { flex-wrap: wrap; gap: 8px; }
    .rf-buscador .rf-pagination { flex-wrap: wrap; gap: 8px 12px; }
    .rf-buscador .rf-pag-info { flex-basis: 100%; order: -1; }
}

@media (max-width: 600px) {
    .rf-buscador .rf-grid { grid-template-columns: minmax(0, 1fr); }
}
