/* Righe filtri delle SmartTable (parametro UseFilterRow, spento di default).
   Si appoggia a smart-table-bar.css e smart-table-filters.css (la sezione porta anche .smart-table-bar-layout e
   .smart-table-filter-bar) e aggiunge solo cio' che cambia: tutte le regole sono sotto .smart-table-filter-row, classe
   che SmartTable aggiunge alla sezione solo con il flag acceso. Senza il flag nessuna tabella cambia.
   Per tornare indietro basta togliere UseFilterRow dalla pagina (o rimuovere questo file).

   Disposizione: riga 1 = ricerca, a destra Aggiorna e il menu "Altro" (Vista, Raggruppa, Colonne, Esporta);
   riga 2 = filtri come controlli sempre in vista (Periodo con date, Stato, filtri fissati con la stella), "Altri filtri" e
   "Azzera filtri" (spazio sempre riservato). Niente chip: il filtro attivo si legge nel controllo e nel contatore.
   Telefono (< 768px): riga 1 + pulsante Filtri (foglio dal basso). Token solo da site.css. */

.smart-table-filter-row {
  --nhf-field-border: var(--muted); /* bordo dei controlli della barra: contrasto >= 3:1 su bianco (era #94a3b8, circa 2,6:1) */
  --nhr-h: 34px;                    /* altezza dei controlli: quella dei campi dei form (forms-v2.css) */
}

/* -- Struttura: due righe nella stessa scheda, altezza fissa (niente chip che compaiono, niente salti) -- */
.smart-table-filter-row .stb { gap: 10px; }
.smart-table-filter-row .nhr-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; min-width: 0; }
.smart-table-filter-row .nhr-top { flex-wrap: nowrap; gap: 8px; }
/* Riga 2: i filtri vanno a capo dentro .nhr-fields, la coda resta agganciata a destra della prima linea (mai su una riga sola) */
.smart-table-filter-row .nhr-filters { flex-wrap: nowrap; align-items: flex-start; gap: 8px 16px; min-height: var(--nhr-h); }
.smart-table-filter-row .nhr-fields { display: flex; flex: 1 1 0; flex-wrap: wrap; align-items: center; gap: 8px 16px; min-width: 0; }

/* -- Riga 1: ricerca a larghezza fissa (non si restringe quando i pulsanti cambiano), azioni a destra -- */
.smart-table-filter-row .stb-search.nhr-search { flex: 0 1 380px; min-width: 160px; max-width: none; }
.smart-table-filter-row .nhr-search .dxbl-text-edit { height: var(--nhr-h); min-height: var(--nhr-h); border-color: var(--nhf-field-border); }
.smart-table-filter-row .nhr-search .dxbl-text-edit input { height: 32px; }
.smart-table-filter-row .nhr-search .dxbl-text-edit:hover:not(.dxbl-disabled) { border-color: var(--nhf-ink); }
.smart-table-filter-row .nhr-search .dxbl-text-edit:focus-within { border-color: var(--primary); }
.smart-table-filter-row .stb-search + .stb-item { margin-left: auto; padding-left: 0; }
.smart-table-filter-row .stb-search + .stb-item::before { display: none; }
.smart-table-filter-row .nhr-actions { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; }
.smart-table-filter-row .nhr-actions:empty { display: none; }
.smart-table-filter-row .nhr-top > .nhr-more { margin-left: auto; }
.smart-table-filter-row .nhr-actions + .nhr-more { margin-left: 0; }

/* -- Pulsanti: bordo --muted (>= 3:1), stesso aspetto a riposo per tutti, stato attivo leggibile anche senza colore (etichetta + contatore) -- */
.smart-table-filter-row .stb-btn {
  height: var(--nhr-h);
  min-height: var(--nhr-h);
  border-color: var(--nhf-field-border);
  background: var(--surface);
  color: var(--text);
}
.smart-table-filter-row .stb-btn:hover:not(:disabled) { background: var(--surface-soft); border-color: var(--nhf-ink); }
.smart-table-filter-row .stb-btn.active,
.smart-table-filter-row .stb-btn.open,
.smart-table-filter-row .stb-btn.active:hover:not(:disabled),
.smart-table-filter-row .stb-btn.open:hover:not(:disabled) {
  background: var(--primary-soft);
  border-color: var(--primary);
  color: var(--primary-strong);
}
.smart-table-filter-row .stb-btn.active .stb-btn-label { color: inherit; }
.smart-table-filter-row :is(.stb-menu-item, .nhr-reset, .nhf-mbtn):focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.smart-table-filter-row .stb-menu-item:focus-visible { outline-offset: -2px; }

/* -- Pannelli: "Altro" e "Altri filtri" si aprono allineati al bordo destro, "Periodo rapido" a sinistra -- */
.smart-table-filter-row .nhr-more > .stb-popover,
.smart-table-filter-row .nhr-other > .stb-popover { left: auto; right: 0; }
.smart-table-filter-row .stb-popover.nhf-pop-presets { width: 320px; }

/* -- Menu "Altro" -- */
.smart-table-filter-row .stb-popover.nhr-menu { width: 280px; padding: 6px; gap: 2px; }
.smart-table-filter-row .stb-menu-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 40px;
  padding: 0 10px;
  border: 0;
  border-radius: var(--radius);
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.2;
  text-align: left;
  cursor: pointer;
}
.smart-table-filter-row .stb-menu-item > svg { flex: none; color: var(--muted); }
.smart-table-filter-row .stb-menu-item:hover:not(:disabled) { background: var(--surface-soft); }
.smart-table-filter-row .stb-menu-item:disabled { opacity: 0.5; cursor: default; }
.smart-table-filter-row .stb-menu-text { flex: 1 1 auto; min-width: 0; }
.smart-table-filter-row .stb-menu-value { flex: none; max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-weight: 400; }
.smart-table-filter-row .nhr-menu-actions { margin-top: 4px; padding-top: 4px; border-top: 1px solid var(--border); }

/* -- Riga 2: etichetta + controllo; filtro attivo = valore evidenziato (primary-soft / primary-strong), etichetta in grassetto -- */
/* flex-wrap: se il campo e' piu' largo dello spazio che gli resta (Periodo con preset attivo, 768-900px) il contenuto va a capo dentro il campo invece di uscirne e coprire la coda */
.smart-table-filter-row .nhr-field { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
.smart-table-filter-row .nhr-label { flex: none; color: var(--muted); font-size: 13px; font-weight: 500; line-height: 1.2; white-space: nowrap; }
.smart-table-filter-row .nhr-field.active .nhr-label { color: var(--primary-strong); font-weight: 600; }
.smart-table-filter-row .nhr-control { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; max-width: 100%; }
.smart-table-filter-row .nhr-presets > .stb-btn { min-width: 150px; justify-content: space-between; } /* larghezza quasi costante con/senza preset attivo: il punto di a capo non cambia */
.smart-table-filter-row .nhr-field.active .dxbl-text-edit { background: var(--primary-soft); border-color: var(--primary); }

/* Date Dal/Al in linea */
.smart-table-filter-row .nhr-control .nhf-row2 { display: flex; flex-wrap: wrap; gap: 8px; }
.smart-table-filter-row .nhr-control .nhf-row2 > label.field { flex: none; flex-direction: row; align-items: center; gap: 6px; }
.smart-table-filter-row .nhr-control .nhf-row2 > label.field > span:first-child { flex: none; }
.smart-table-filter-row .nhr-control .nhf-row2 dxbl-date-edit { width: 172px; }
.smart-table-filter-row .nhr-control .nhf-row2 dxbl-spin-edit { width: 120px; }

/* Altri controlli (testo, elenco, data singola) */
.smart-table-filter-row .nhr-control > :is(dxbl-combo-box, dxbl-text-box, dxbl-date-edit, dxbl-input-editor) { width: 200px; min-width: 0; }
.smart-table-filter-row .nhr-control .dxbl-text-edit { height: var(--nhr-h); min-height: var(--nhr-h); }
.smart-table-filter-row .nhr-control .dxbl-text-edit input { height: 32px; }

/* Segmentato (Stato, Si/No): "Tutti" e' lo stato di riposo e resta neutro, le altre scelte attive prendono il colore */
.smart-table-filter-row .nhr-control .nhf-seg { flex-wrap: nowrap; }
.smart-table-filter-row .nhr-control .nhf-seg button { height: var(--nhr-h); border-color: var(--nhf-field-border); }
.smart-table-filter-row .nhr-control .nhf-seg button:not(.on):hover { background: var(--surface-soft); }
.smart-table-filter-row .nhr-control .nhf-seg button:first-child.on { background: var(--bg-soft); border-color: var(--nhf-field-border); color: var(--text); font-weight: 500; }
.smart-table-filter-row .nhr-control .nhf-seg button.on:not(:first-child) { font-weight: 600; }

/* Coda della riga 2: "Azzera filtri" (spazio sempre riservato) e "Altri filtri" a destra */
.smart-table-filter-row .nhr-tail { flex: none; margin-left: auto; height: var(--nhr-h); display: flex; align-items: center; gap: 8px; }
.smart-table-filter-row .nhr-reset { height: var(--nhr-h); padding: 0 8px; font-size: 13px; font-weight: 500; white-space: nowrap; }
.smart-table-filter-row .nhr-reset.is-idle { visibility: hidden; }

/* -- Tablet: stesse due righe, la seconda va a capo se non basta lo spazio -- */
@media (max-width: 1023.98px) {
  .smart-table-filter-row .nhr-row,
  .smart-table-filter-row .nhr-fields { column-gap: 14px; }
}

/* -- Telefono: riga 1 (ricerca, Filtri, Aggiorna, Altro) e foglio dal basso; aree di tocco >= 44px -- */
@media (max-width: 767.98px) {
  .smart-table-filter-row .stb { gap: 12px; }
  .smart-table-filter-row .nhr-filters { display: none; }

  .smart-table-filter-row .stb-search.nhr-search { flex: 1 1 auto; min-width: 0; }
  .smart-table-filter-row .nhr-search .dxbl-text-edit { height: 44px; min-height: 44px; border-radius: 10px; }
  .smart-table-filter-row .nhr-search .dxbl-text-edit input { height: 42px; font-size: 15px; padding-left: 38px !important; }
  .smart-table-filter-row .nhr-search::before { left: 12px; width: 16px; height: 16px; }
  .smart-table-filter-row .stb-search-clear { width: 44px; height: 44px; right: 0; font-size: 20px; }

  .smart-table-filter-row .nhr-top { gap: 8px; }
  .smart-table-filter-row .nhr-top .stb-btn { box-sizing: border-box; height: 44px; min-height: 44px; min-width: 44px; padding: 0; justify-content: center; border-radius: 10px; }
  .smart-table-filter-row .nhr-top .stb-btn > .stb-icon:last-child:not(:first-child) { display: none; }
  .smart-table-filter-row .nhr-more-text { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .smart-table-filter-row .nhr-actions { margin-left: 0; }
  .smart-table-filter-row .nhr-top > .nhr-more { margin-left: 0; }

  .smart-table-filter-row .nhf-mbtn {
    position: relative; display: inline-flex; align-items: center; justify-content: center; flex: none;
    width: 44px; height: 44px; border-radius: 10px; border: 1px solid var(--nhf-field-border); background: var(--surface); color: var(--text); padding: 0; cursor: pointer;
  }
  .smart-table-filter-row .nhf-mbtn.active { background: var(--primary-soft); border-color: var(--primary); color: var(--primary-strong); }
  .smart-table-filter-row .nhf-mbtn .stb-count { position: absolute; top: -6px; right: -6px; }

  /* I pannelli di "Altro" si ancorano alla barra e restano nel viewport */
  .smart-table-filter-row .nhr-top .stb-item { position: static; }
  .smart-table-filter-row .nhr-top .stb-popover { left: 0; right: 0; width: auto; max-width: none; }
  .smart-table-filter-row .stb-menu-item { min-height: 44px; }

  /* Foglio dei filtri (stesso del layout filtri ibridi, ma fino a 767px) */
  /* Sopra la barra laterale (1040) e sotto i popup DevExpress delle date (1050) */
  .smart-table-filter-row .nhf-scrim { display: block; position: fixed; inset: 0; z-index: 1046; background: rgba(15, 23, 42, .42); }
  .smart-table-filter-row .nhf-sheet {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 1047; height: min(640px, 100dvh - 24px);
    display: flex; flex-direction: column; background: var(--surface); border-radius: 18px 18px 0 0;
    box-shadow: 0 -10px 30px rgba(15, 23, 42, .22); animation: nhf-sheet-in .22s cubic-bezier(.16, 1, .3, 1);
  }
  .smart-table-filter-row .nhf-handle { display: flex; justify-content: center; padding-top: 8px; }
  .smart-table-filter-row .nhf-handle::before { content: ""; width: 38px; height: 4px; border-radius: 2px; background: var(--border-strong); }
  .smart-table-filter-row .nhf-sheet-head { display: flex; align-items: center; justify-content: space-between; padding: 10px 16px 6px; }
  .smart-table-filter-row .nhf-sheet-head h2 { margin: 0; font-size: 18px; font-weight: 700; }
  .smart-table-filter-row .nhf-sheet-head .stb-link { height: 44px; padding: 0 4px; font-size: 14px; font-weight: 600; }
  .smart-table-filter-row .nhf-sheet-body { flex: 1; overflow-y: auto; padding: 4px 16px; display: flex; flex-direction: column; gap: 20px; }
  .smart-table-filter-row .nhf-sheet-body .nhf-title { margin-bottom: 8px; font-size: 13px; }
  .smart-table-filter-row .nhf-sheet-body .nhf-seg button { flex: 1; height: 44px; font-size: 14px; padding: 0 4px; }
  .smart-table-filter-row .nhf-sheet-body .nhf-seg button:first-child { border-radius: 10px 0 0 10px; }
  .smart-table-filter-row .nhf-sheet-body .nhf-seg button:last-child { border-radius: 0 10px 10px 0; }
  .smart-table-filter-row .nhf-sheet-body .nhf-pre { height: 44px; border-radius: 22px; padding: 0 16px; font-size: 14px; }
  .smart-table-filter-row .nhf-sheet-body .dxbl-text-edit { height: 44px; min-height: 44px; border-radius: 10px; }
  .smart-table-filter-row .nhf-sheet-body .dxbl-text-edit input { height: 42px; font-size: 15px; padding: 0 12px; }
  .smart-table-filter-row .nhf-sheet-body .dxbl-text-edit :is(.dxbl-edit-btn-dropdown, .dxbl-edit-btn-clear) { min-width: 44px; }
  /* Date Dal/Al affiancate: la X toglierebbe 44px al testo e dd/MM/yyyy verrebbe troncato. Il calendario resta a 44px;
     per svuotare restano "Azzera tutto" e i periodi rapidi. Padding destro ridotto: lo spazio va al testo. */
  .smart-table-filter-row .nhf-sheet-body .nhf-row2 .dxbl-text-edit .dxbl-edit-btn-clear { display: none; }
  .smart-table-filter-row .nhf-sheet-body .nhf-row2 .dxbl-text-edit input { padding: 0 4px 0 12px; }
  .smart-table-filter-row .nhf-sheet-foot { display: flex; gap: 10px; padding: 12px 16px 18px; border-top: 1px solid var(--nhf-soft-line); }
  .smart-table-filter-row .nhf-sheet-foot button {
    box-sizing: border-box; height: 48px; border-radius: 10px; border: 1px solid var(--border-strong); background: var(--surface);
    color: var(--text); font: inherit; font-size: 15px; font-weight: 600; cursor: pointer;
  }
  .smart-table-filter-row .nhf-sheet-foot .nhf-apply { flex: 1; background: var(--primary); border-color: var(--primary); color: #fff; }

  /* Intestazioni cliccabili e menu di colonna: bersaglio di 44px (l'intestazione sale da 40 a 44px solo su telefono) */
  body .smart-table-filter-row .data-table.data-table.data-table.data-table.data-table thead th { height: 44px; }
  .smart-table-filter-row th > .smart-table-sort-button { max-width: calc(100% - 48px); min-height: 44px; }
  .smart-table-filter-row .stb-colmenu-toggle { width: 44px; height: 44px; }
  .smart-table-filter-row .stb-colmenu-item { min-height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  .smart-table-filter-row .nhf-sheet { animation: none; }
}