/* ============================================================
   Filtri della pipeline e provenienza nelle schede (17/10 sera).
   Solo token del tema: leggibile anche in scuro.
   ============================================================ */

/* ---------- pulsante «Filtri» e chip sotto la barra ---------- */
.pl-filtri-btn { display: inline-flex; align-items: center; gap: 6px; }
.pl-filtri-btn svg { width: 15px; height: 15px; }
.pl-filtri-btn b:empty { display: none; }
.pl-filtri-btn b {
  min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; display: inline-grid; place-items: center;
  background: var(--brand-600); color: #fff; font-size: 11px; font-weight: 700;
}
.pl-filtri-btn.attivo { border-color: var(--brand-600); color: var(--brand-700); background: var(--brand-50); }
.pl-filtri-chip { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -6px 0 12px; }
.pl-filtri-chip[hidden] { display: none; }
.pl-chip-filtro {
  display: inline-flex; align-items: center; gap: 4px; max-width: 100%;
  padding: 3px 4px 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600;
  background: var(--brand-50); color: var(--brand-700); border: 1px solid var(--brand-100);
}
.pl-chip-filtro button {
  width: 20px; height: 20px; border: 0; border-radius: 50%; cursor: pointer; line-height: 1;
  background: transparent; color: inherit; font-size: 14px;
}
.pl-chip-filtro button:hover { background: var(--brand-100); }

/* ---------- pannello ---------- */
.flt { display: grid; gap: 14px; }
.flt-griglia { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; }
.flt-col { display: grid; gap: 14px; align-content: start; min-width: 0; }
.flt-blocco { display: grid; gap: 8px; min-width: 0; }
.flt-tit { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.flt-tit span { font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--n-500); }
.flt-pillole { display: flex; flex-wrap: wrap; gap: 6px; }
.flt-pillole .pillola { font-size: 12.5px; padding: 5px 10px; }
.flt-date { display: flex; flex-wrap: wrap; gap: 10px; }
.flt-date[hidden] { display: none; }
.flt-date label { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--n-500); }
.flt-date input { width: auto; max-width: 160px; }
.flt-cerca { width: 100%; }
.flt-voci { display: grid; gap: 2px; max-height: 230px; overflow: auto; padding-right: 4px; }
.flt-voce {
  display: flex; align-items: center; gap: 8px; padding: 5px 8px; border-radius: 8px; cursor: pointer;
  font-size: 13px; color: var(--n-700); min-width: 0;
}
.flt-voce:hover { background: var(--n-50); }
.flt-voce input { margin: 0; flex: none; }
.flt-voce span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.flt-voce small { color: var(--n-500); font-variant-numeric: tabular-nums; }
.flt-voce:has(input:checked) { background: var(--brand-50); color: var(--brand-700); font-weight: 600; }
.flt-nascosta { display: none; }
.flt-altre { justify-self: start; }
.flt-salvati { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 13px; color: var(--n-500); }
.flt-salvato {
  display: inline-flex; align-items: center; gap: 2px; padding: 2px 4px 2px 10px; border-radius: 999px;
  border: 1px solid var(--n-200); background: var(--n-0);
}
.flt-x { border: 0; background: none; cursor: pointer; color: var(--n-400); font-size: 15px; padding: 0 4px; }
.flt-x:hover { color: var(--err-ink); }
.flt-nota { margin: 0; font-size: 12px; color: var(--n-500); }
.flt-azioni { position: sticky; bottom: -1px; background: var(--n-0); padding-top: 10px; border-top: 1px solid var(--n-100); }
.flt-nome { display: inline-flex; gap: 6px; align-items: center; margin-right: auto; flex: 1 1 260px; }
.flt-nome input { flex: 1; min-width: 0; }
@media (max-width: 760px) {
  .flt-griglia { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- scheda: «Da dove arriva» ---------- */
.origine-risalita { margin: 0 0 10px; font-size: 12.5px; color: var(--n-500); }
.origine-annuncio {
  display: flex; gap: 10px; align-items: flex-start; margin-bottom: 10px; padding: 8px;
  border-radius: 10px; background: var(--n-25); border: 1px solid var(--n-200);
}
.origine-annuncio img { flex: none; width: 56px; height: 56px; border-radius: 8px; object-fit: cover; background: var(--n-100); }
.origine-annuncio div { display: grid; gap: 2px; min-width: 0; font-size: 12.5px; color: var(--n-700); }
.origine-annuncio span { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.origine-filtra { margin: 8px 0 4px; }

/* ---------- scheda cliente: «Da dove arriva» ---------- */
.cli-prov-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.cli-prov { display: grid; gap: 2px; padding-left: 12px; border-left: 3px solid var(--brand-100); }
.cli-prov:first-child { border-left-color: var(--brand-600); }
.cli-prov-quando { font-size: 11px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--n-500); }
.cli-prov-cosa { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; font-size: 13px; }
.cli-prov-sig {
  display: inline-block; padding: 0 5px; border-radius: 5px; font-size: 10px; line-height: 16px;
  background: var(--brand-50); color: var(--brand-700); border: 1px solid var(--brand-100);
}
/* la casella resta piccola (lo stile generale degli input la allarga) */
.flt-voce input[type="checkbox"] { width: 16px; height: 16px; min-width: 16px; padding: 0; box-shadow: none; }