/*
 * Layout modulo JFilters "Ricerche-PI"
 * (templates/pi_template/html/mod_jfilters_filters/Ricerche-PI.php)
 *
 * - filtri a tendina: griglia di 4 colonne (2 su tablet, 1 su smartphone);
 * - filtri a caselle/link/pulsanti (es. "Parole chiavi"): occupano tutta la
 *   riga e le voci si dispongono una dopo l'altra, andando a capo.
 *
 * Nota: il template imposta la dimensione base a 10px, quindi qui si usano
 * valori in px (i rem risulterebbero troppo piccoli).
 *
 * Riutilizzabile su qualsiasi modulo JFilters: basta scegliere il layout
 * "Ricerche-PI" nella scheda Avanzate del modulo.
 */

/* ---- Griglia dei filtri ------------------------------------------------- */
.ricerche-pi .jfilters-filters-container {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px 24px;
    align-items: start;
    margin-bottom: 24px;
}

@media (max-width: 991.98px) {
    .ricerche-pi .jfilters-filters-container {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .ricerche-pi .jfilters-filters-container {
        grid-template-columns: minmax(0, 1fr);
    }
}

.ricerche-pi .jfilters-filter-container {
    border-bottom: 0;
    margin: 0;
    padding: 0;
    min-width: 0;
}

/* Filtri che non sono tendine: tutta la larghezza */
.ricerche-pi .jfilters-filter-container--checkboxes,
.ricerche-pi .jfilters-filter-container--radios,
.ricerche-pi .jfilters-filter-container--links,
.ricerche-pi .jfilters-filter-container--buttons_multi,
.ricerche-pi .jfilters-filter-container--buttons_single,
.ricerche-pi .jfilters-filter-container--calendar,
.ricerche-pi .jfilters-filter-container--range_inputs,
.ricerche-pi .jfilters-filter-container--range_sliders,
.ricerche-pi .jfilters-filter-container--range_inputs_sliders {
    grid-column: 1 / -1;
    order: 1; /* dopo tutte le tendine */
}

/* ---- Intestazione di ogni filtro --------------------------------------- */
.ricerche-pi .jfilters-filter-header {
    margin: 0 0 6px;
    font-size: 15px;
    line-height: 1.3;
}

.ricerche-pi .jfilters-filter-header__toggle {
    padding: 0;
    border: 0;
    background: none;
    font-size: 15px;
    font-weight: 600;
    color: #1e1e1e;
    text-align: left;
}

/* Etichetta del filtro (non cliccabile: i filtri restano sempre aperti) */
.ricerche-pi .jfilters-filter-header__label {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: #1e1e1e;
}

/* ---- Tendine ------------------------------------------------------------ */
.ricerche-pi .jfilters-filter-dropdown {
    width: 100%;
}

.ricerche-pi .jfilters-filter-dropdown-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    min-height: 40px;
    padding: 6px 12px;
    border: 1px solid #ccd6da;
    border-radius: 4px;
    background: #fff;
    font-size: 15px;
    cursor: pointer;
}

.ricerche-pi .jfilters-filter-dropdown-toggle:hover,
.ricerche-pi .jfilters-filter-dropdown-toggle:focus {
    border-color: #15c0f3;
    outline: none;
}

.ricerche-pi .jfilters-filter-dropdown-toggle__text,
.ricerche-pi .jfilters-filter-header__toggle {
    font-size: 15px;
}

.ricerche-pi .jfilters-filter-dropdown-toggle__label {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.ricerche-pi .jfilters-filter-dropdown-container.dropdown-menu {
    width: 100%;
    max-height: 350px;
    font-size: 15px;
    overflow-y: auto;
}

/* ---- Caselle di spunta / link: voci affiancate che vanno a capo --------- */
.ricerche-pi .jfilters-filter-list--checkboxes,
.ricerche-pi .jfilters-filter-list--radios,
.ricerche-pi .jfilters-filter-list--links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px 24px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ricerche-pi .jfilters-filter-list--checkboxes .jfilters-filter-list__item,
.ricerche-pi .jfilters-filter-list--radios .jfilters-filter-list__item,
.ricerche-pi .jfilters-filter-list--links .jfilters-filter-list__item {
    flex: 0 0 auto;
    width: auto;
    margin: 0;
    padding: 0;
    border: 0;
}

/* ---- Niente freccia "›" del template -------------------------------------
 * template.css aggiunge un'icona FontAwesome (\f105) a tutti i link negli
 * elenchi dei moduli (.sp-module ul > li > a::before): qui la annulliamo.
 */
.ricerche-pi .jfilters-filter-dropdown-container .dropdown-item {
    padding: 6px 12px;
    white-space: normal;
}

.ricerche-pi .jfilters-filter-dropdown-container .dropdown-item::before {
    content: none;
    display: none;
}

/* Nelle caselle il ::before e' il quadratino: resta, ma vuoto */
.ricerche-pi .jfilters-item-link--checkbox::before,
.ricerche-pi .jfilters-item-link--radio::before {
    content: "";
}