/* ==========================================================================
   Catalogo con i filtri, /il-feed/ (kit catalogo-con-filtri-13-10, CEO 13/10/2026:
   «il catalogo deve essere con tutto displayed e poi uno applica i filtri»).

   La pagina: il titolo del Catalogo, i filtri di «Cerca», l'elenco intero.
   I filtri (tessere, colori, scritte, ordine dei gruppi, griglia) sono del modulo di Cerca
   (css/tbp-cerca-unica.css, non toccato): quello che il CEO approva lì vale qui, senza rifarlo.
   Qui si disegna solo quello che è di questa pagina:
     1. la testata (titolo, frase, «Cerca con Colombo», «Scarica PDF»);
     2. la fascia larga come la pagina, a filo con il titolo e con le schede; al telefono (dove scorre
        di lato) e al computer largo è una riga sola (body.tbp-cf-striscia), così l'elenco comincia più
        su e lo si vede restringersi quando si tocca una tessera;
     3. Dove, Quando, Prezzo e Categorie dentro «Altri filtri» finché non servono
        (body.tbp-cf-piega);
     4. «Mostra altri», sotto l'elenco, quando le schede sono più di una prima infornata.

   Dove serve vincere sulle regole del modulo di Cerca si scrive nello stesso livello (tbp-appearance)
   con più peso (:not(#tbp-cf-peso):not(#tbp-cf-peso-2), body.tbp-cf-pagina, #tbp-filters-panel):
   fuori dal livello un !important perderebbe.

   Temi: chiaro, scuro, ToBePolo (che è chiaro). I colori vengono dai gettoni del sito
   (--tbp-night-*), che cambiano da soli con il tema.
   ========================================================================== */

/* ---------- 1. La pagina e la testata ---------- */

html body.tbp-cf-pagina #tbp-cf-catalogo {
  --tbp-cf-testo: var(--tbp-night-text, #084828);
  --tbp-cf-tenue: var(--tbp-night-muted, #536d60);
  --tbp-cf-riga: var(--tbp-night-line, #dbe5df);
  padding-bottom: 8px;
}

/* La testata usa le classi del Catalogo di prima (css/tbp-catalogo.css). Qui: filo a sinistra con i filtri e le
   schede, e a destra i due comandi su una riga. */
html body.tbp-cf-pagina .tbp-cf-testa {
  position: static;
  max-width: none;
  margin: 0 0 16px;
  padding: 12px 0 0;
}
html body.tbp-cf-pagina .tbp-cf-testa .tbp-catalogo-heading {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 12px 32px;
}
html body.tbp-cf-pagina .tbp-cf-azioni {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 4px 24px;
  min-width: 0;
}
/* «Cerca con Colombo»: un collegamento di testo, non un bottone. L'ultima parola e la freccia non si separano. */
html body.tbp-cf-pagina .tbp-cf-cerca {
  display: inline-block;
  padding: 12px 0;
  color: var(--tbp-cf-testo) !important;
  -webkit-text-fill-color: currentColor;
  font-family: var(--tbp-font, inherit);
  font-size: .9375rem;
  font-weight: 600;
  line-height: 1.4;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
html body.tbp-cf-pagina .tbp-cf-cerca__fine { white-space: nowrap; }
html body.tbp-cf-pagina .tbp-cf-cerca .tbp-cf-segno {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-left: 6px;
  vertical-align: -4px;
  transition: transform var(--tbp-moto-breve, 160ms) var(--tbp-moto-curva, ease);
}
html body.tbp-cf-pagina .tbp-cf-cerca:focus-visible {
  outline: 2px solid var(--tbp-cf-testo);
  outline-offset: 3px;
  border-radius: 4px;
}
@media (hover: hover) {
  html body.tbp-cf-pagina .tbp-cf-cerca:hover { text-decoration-thickness: 2px; }
  html body.tbp-cf-pagina .tbp-cf-cerca:hover .tbp-cf-segno { transform: translateX(3px); }
}
@media (prefers-reduced-motion: reduce) {
  html body.tbp-cf-pagina .tbp-cf-cerca .tbp-cf-segno { transition: none; }
}
@media (max-width: 749px) {
  html body.tbp-cf-pagina .tbp-cf-testa { margin-bottom: 12px; padding-top: 8px; }
  html body.tbp-cf-pagina .tbp-cf-testa .tbp-catalogo-heading { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  html body.tbp-cf-pagina .tbp-cf-azioni { justify-content: space-between; gap: 4px 16px; }
}

/* Il PDF del catalogo sta in cima, com'era: il secondo collegamento, quello che il modulo di Cerca mette in fondo
   alla sua pagina, qui non serve. */
html body.tbp-core-cerca.tbp-cu.tbp-cf-pagina #tbp-cf-catalogo .tbp-cu-pdf { display: none !important; }

/* Se un giorno il campo delle parole dovesse restare nella pagina (il modulo dei filtri è cambiato e il kit non l'ha
   potuto togliere), almeno non si vede: su questa pagina non c'è la barra di ricerca, che è di «Cerca». */
html body.tbp-core-cerca.tbp-cu.tbp-cf-pagina #tbp-cf-catalogo #tbp-filter-form > :is(.tbp-search-query-head, .tbp-cerca-toolbar) { display: none !important; }

/* ---------- 2. La fascia ---------- */

@layer tbp-appearance {
  /* Larga come la pagina, a filo con il titolo e con le schede. Su «Cerca» i filtri stanno in una colonna centrata
     larga come la barra di ricerca (760 px); qui la barra non c'è e i bordi sono quelli della pagina. */
  html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti {
    max-width: none !important;
    margin-right: 0 !important;
    margin-bottom: 4px !important;
    margin-left: 0 !important;
  }

  /* I cinque gruppi in una riga sola (body.tbp-cf-striscia), dove ci stanno o dove serve:
       - al telefono, sotto i 768 px (dove su «Cerca» prendono quattro righe): la riga scorre di lato, da bordo a
         bordo, e la tessera tagliata sul bordo dice che continua;
       - al computer, da 1184 px (la pagina è larga 1160): la riga sta intera da un bordo all'altro, in tutte e quattro
         le lingue. Se un giorno un nome si allunga, l'ultimo gruppo va a capo intero, a sinistra.
     Fra 768 e 1183 px resta la griglia di «Cerca», su due righe.
     Le tessere, i nomi e l'ordine sono quelli di «Cerca»; qui le tessere prendono la larghezza del loro nome invece di
     dividersi la riga in parti uguali. Così l'elenco comincia più su e lo si vede restringersi quando si tocca una
     tessera. Per tornare alla griglia di «Cerca» a ogni larghezza: file vuoto inc/catalogo-filtri/FASCIA-INTERA. */
  @media (max-width: 767px), (min-width: 1184px) {
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia .tbp-more-filters__grid {
      display: flex !important;
      align-items: flex-start !important;
      grid-template-columns: none !important;
      margin: 0 !important;
    }
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia .tbp-more-filters__grid::after { content: none !important; display: none !important; }
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia .tbp-filter-section,
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia :is(.tbp-filter-section--kind, .tbp-filter-section--mode, .tbp-filter-section--mastro, .tbp-filter-section--diff, .tbp-filter-section--risk) {
      flex: 0 0 auto !important;
      grid-column: auto !important;
      width: auto !important;
      min-width: 0 !important;
      max-width: none !important;
      margin: 0 !important;
    }
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia :is(.tbp-choice-pair, .tbp-choice-row),
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia :is(.tbp-filter-section--diff, .tbp-filter-section--risk) :is(.tbp-choice-pair, .tbp-choice-row) {
      display: flex !important;
      flex-wrap: nowrap !important;
      grid-template-columns: none !important;
      width: auto !important;
      overflow: visible !important;
    }
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia .tbp-primary-chip {
      flex: 0 0 auto !important;
      width: auto !important;
      min-width: 72px !important;
      padding-right: 8px !important;
      padding-left: 8px !important;
    }
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia .tbp-primary-chip label {
      max-width: none !important;
      overflow: visible !important;
      text-overflow: clip !important;
      white-space: nowrap !important;
    }
  }
  @media (max-width: 767px) {
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia .tbp-more-filters {
      margin-right: -12px !important;
      margin-left: -12px !important;
    }
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia .tbp-more-filters__grid {
      flex-wrap: nowrap !important;
      justify-content: flex-start !important;
      gap: 0 16px !important;
      padding: 2px 28px 6px 12px !important;
      overflow-x: auto !important;
      overflow-y: hidden !important;
      overscroll-behavior-x: contain;
      scroll-padding: 0 28px 0 12px;
      scrollbar-width: none;
      -webkit-overflow-scrolling: touch;
      -webkit-mask-image: linear-gradient(to right, transparent 0, #000 12px, #000 calc(100% - 32px), transparent 100%);
      mask-image: linear-gradient(to right, transparent 0, #000 12px, #000 calc(100% - 32px), transparent 100%);
    }
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia .tbp-more-filters__grid::-webkit-scrollbar { display: none; }
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia :is(.tbp-choice-pair, .tbp-choice-row),
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia :is(.tbp-filter-section--diff, .tbp-filter-section--risk) :is(.tbp-choice-pair, .tbp-choice-row) { gap: 6px !important; }
  }
  @media (min-width: 1184px) {
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia .tbp-more-filters__grid {
      flex-wrap: wrap !important;
      justify-content: space-between !important;
      gap: 12px !important;
    }
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia :is(.tbp-choice-pair, .tbp-choice-row),
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia :is(.tbp-filter-section--diff, .tbp-filter-section--risk) :is(.tbp-choice-pair, .tbp-choice-row) { gap: 8px !important; }
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia .tbp-primary-chip { padding-right: 10px !important; padding-left: 10px !important; }
  }
  /* Con il mouse, in una finestra stretta, la riga che scorre mostra una barra sottile da trascinare. */
  @media (max-width: 767px) and (hover: hover) and (pointer: fine) {
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia .tbp-more-filters__grid {
      padding-bottom: 10px !important;
      scrollbar-width: thin;
      scrollbar-color: var(--tbp-cf-riga) transparent;
    }
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia .tbp-more-filters__grid::-webkit-scrollbar { display: block; height: 6px; }
    html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-striscia #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti .tbp-cu-fascia .tbp-more-filters__grid::-webkit-scrollbar-thumb { border-radius: 3px; background: var(--tbp-cf-riga); }
  }

  /* ---------- 3. Dove, Quando, Prezzo e Categorie dentro «Altri filtri» ----------
     Su questa pagina l'elenco viene prima: sopra restano i cinque gruppi e la riga «Altri filtri», e l'elenco comincia
     nel primo schermo. Dove, Quando, Prezzo e Categorie si vedono quando «Altri filtri» è aperto (al loro posto, come
     su «Cerca»: Dove e Quando sopra i gruppi, Prezzo e Categorie sotto), e restano a vista da chiusi solo se sono in
     uso: un luogo o una data scritti, una categoria scelta (per esempio da un link con ?categoria=48). Un prezzo scelto
     resta scritto sopra l'elenco, fra i filtri attivi.
     Al telefono il modulo di Cerca li piega già quando le schede sono a vista (body.tbp-cu-piegati), ma li ripiega
     anche mentre «Altri filtri» è aperto, appena l'ultimo filtro viene tolto: qui, finché è aperto, restano.
     Con un browser che non conosce :has() queste regole non valgono: al computer i filtri si vedono tutti, al telefono
     resta il comportamento del modulo di Cerca.
     Per averli sempre a vista come su «Cerca»: file vuoto inc/catalogo-filtri/FILTRI-APERTI. */
  html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-piega #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti:not(:has(> .tbp-cu-altri[open])) > .tbp-cu-coppia:not(:focus-within):not(:has(input[type="text"]:not(:placeholder-shown))),
  html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-piega #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti:not(:has(> .tbp-cu-altri[open])) > .tbp-more-filters,
  html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-piega #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti:not(:has(> .tbp-cu-altri[open])) > .tbp-filter-section--cats:not(:has(input:checked)) {
    display: none !important;
  }
  html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-piega #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti:has(> .tbp-cu-altri[open]) > .tbp-cu-coppia { display: grid !important; }
  html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-piega #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti:has(> .tbp-cu-altri[open]) > .tbp-more-filters,
  html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-piega #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti:has(> .tbp-cu-altri[open]) > .tbp-filter-section--cats,
  html:not(#tbp-cu-peso):not(#tbp-cf-peso):not(#tbp-cf-peso-2) body.tbp-core-cerca.tbp-cu.tbp-cf-pagina.tbp-cf-piega #tbp-filter-form #tbp-filters-panel.tbp-cu-aperti > .tbp-filter-section--cats:has(input:checked) {
    display: block !important;
  }
}

/* ---------- 4. L'elenco: «Mostra altri» ---------- */

/* Le schede oltre la prima infornata aspettano il tocco su «Mostra altri». La classe la mette il PHP sulle schede della
   pagina e poi la tiene lo script; senza JavaScript (html senza tbp-cf-js) si vedono tutte. */
@layer tbp-appearance {
  html.tbp-cf-js:not(#tbp-cu-peso):not(#tbp-cf-peso) body.tbp-cf-pagina #tbp-cf-catalogo #tbp-results-container .tbp-exp-card.tbp-cf-dopo { display: none !important; }
}
html.tbp-cf-js body.tbp-cf-pagina #tbp-cf-catalogo #tbp-results-container .tbp-exp-card.tbp-cf-dopo { display: none !important; }

html body.tbp-cf-pagina .tbp-cf-altri {
  display: flex;
  justify-content: center;
  margin: 20px 0 8px !important;
  padding: 0;
}
html body.tbp-cf-pagina .tbp-cf-altri[hidden] { display: none; }
/* Un bottone a contorno: è un'azione secondaria (l'azione principale resta quella della barra del sito).
   Gli !important servono contro le regole generali dei bottoni del tema, che li vogliono pieni. */
html body.tbp-cf-pagina #tbp-cf-catalogo .tbp-cf-altri .tbp-cf-altri__bottone {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 220px;
  min-height: 48px !important;
  margin: 0 !important;
  padding: 0 24px !important;
  border: 1px solid var(--tbp-cf-testo) !important;
  border-radius: 14px !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: var(--tbp-cf-testo) !important;
  -webkit-text-fill-color: currentColor !important;
  font-family: var(--tbp-font, inherit) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  cursor: pointer;
  transition: background-color var(--tbp-moto-breve, 160ms) var(--tbp-moto-curva, ease);
}
@media (hover: hover) {
  html body.tbp-cf-pagina #tbp-cf-catalogo .tbp-cf-altri .tbp-cf-altri__bottone:hover { background: color-mix(in srgb, var(--tbp-cf-testo) 8%, transparent) !important; }
}
html body.tbp-cf-pagina #tbp-cf-catalogo .tbp-cf-altri .tbp-cf-altri__bottone:active { background: color-mix(in srgb, var(--tbp-cf-testo) 14%, transparent) !important; }
html body.tbp-cf-pagina #tbp-cf-catalogo .tbp-cf-altri .tbp-cf-altri__bottone:focus-visible { outline: 2px solid var(--tbp-cf-testo) !important; outline-offset: 3px; }
@media (max-width: 599px) {
  html body.tbp-cf-pagina #tbp-cf-catalogo .tbp-cf-altri .tbp-cf-altri__bottone { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  html body.tbp-cf-pagina #tbp-cf-catalogo .tbp-cf-altri .tbp-cf-altri__bottone { transition: none; }
}
/* Finché ci sono schede da mostrare, la riga «Hai visto tutti…» non è vera: sta zitta. */
html body.tbp-core-cerca.tbp-cf-pagina #tbp-cf-catalogo.tbp-cf-ha-altri #tbp-search-end { display: none !important; }

/* ---------- Temi ----------
   I colori di questa pagina sono gettoni che il sito cambia con il tema; qui solo quello che i gettoni non coprono.
   Il tema ToBePolo è chiaro e non sta mai insieme allo scuro. */
html[data-tbp-theme="dark"] body.tbp-cf-pagina #tbp-cf-catalogo {
  --tbp-cf-testo: var(--tbp-night-text, #ededed);
  --tbp-cf-tenue: var(--tbp-night-muted, #b8c4bd);
  --tbp-cf-riga: var(--tbp-night-line, #33403a);
}
html[data-tbp-theme="tobepolo"] body.tbp-cf-pagina #tbp-cf-catalogo {
  --tbp-cf-testo: var(--tbp-night-text, #084828);
  --tbp-cf-tenue: var(--tbp-night-muted, #536d60);
  --tbp-cf-riga: var(--tbp-night-line, #dbe5df);
}

/* 14/10 (CEO: «come mai nel catalogo è scomparso il mosaico, scheda e altri?»): tornano le tre viste del Catalogo.
   Le regole del modulo di Cerca vincevano su quelle di tbp-feed-viste.css: qui valgono solo nel Catalogo
   (body.tbp-cf-pagina) e solo con la vista scelta (classe sulla radice, la mette js/tbp-feed-viste.js). */

/* --- Mosaico: schede di misure diverse che si incastrano ----------------------------------------------- */
html.tbp-vista-mosaico:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati.grid-risultati.grid-risultati {
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	grid-auto-rows: clamp(200px, 24vw, 340px) !important;
	grid-auto-flow: dense !important;
	gap: 16px !important;
}
html.tbp-vista-mosaico:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card {
	height: 100% !important;
}
html.tbp-vista-mosaico:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card .tbp-exp-card__media {
	aspect-ratio: auto !important;
	height: 100% !important;
	min-height: 0 !important;
	max-height: none !important;
}
html.tbp-vista-mosaico:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card:nth-child(6n + 1) {
	grid-column: span 2 !important;
	grid-row: span 2 !important;
}
html.tbp-vista-mosaico:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card:nth-child(6n + 5) {
	grid-column: span 2 !important;
}
@media (max-width: 767px) {
	html.tbp-vista-mosaico:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati.grid-risultati.grid-risultati {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		grid-auto-rows: calc((100vw - 24px - 12px) / 2) !important;
		gap: 12px !important;
	}
	html.tbp-vista-mosaico:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card:nth-child(n) {
		grid-column: auto !important;
		grid-row: auto !important;
	}
	html.tbp-vista-mosaico:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card:nth-child(3n + 1) {
		grid-column: span 2 !important;
		grid-row: span 1 !important;
	}
}

/* --- Colonna: una per riga, larga, foto 16:9 ----------------------------------------------------------- */
html.tbp-vista-colonna:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati.grid-risultati.grid-risultati {
	grid-template-columns: minmax(0, 1fr) !important;
	grid-auto-rows: auto !important;
	max-width: 760px !important;
	margin-inline: auto !important;
	gap: 20px !important;
}
html.tbp-vista-colonna:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card {
	grid-column: auto !important;
	grid-row: auto !important;
	height: auto !important;
}
html.tbp-vista-colonna:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card .tbp-exp-card__media {
	aspect-ratio: 16 / 9 !important;
	height: auto !important;
	min-height: 0 !important;
}
@media (max-width: 767px) {
	html.tbp-vista-colonna:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card .tbp-exp-card__media {
		aspect-ratio: 4 / 3 !important;
	}
}

/* --- Griglia: tutte uguali e piccole, per confrontare in fretta ------------------------------------------ */
html.tbp-vista-griglia:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati.grid-risultati.grid-risultati {
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	grid-auto-rows: auto !important;
	gap: 14px !important;
}
html.tbp-vista-griglia:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card {
	grid-column: auto !important;
	grid-row: auto !important;
	height: auto !important;
	--tbp-discovery-portrait: 36px;
	--tbp-discovery-title-size: 1.05rem;
	--tbp-discovery-price-size: 1.05rem;
}
html.tbp-vista-griglia:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card .tbp-exp-card__media {
	aspect-ratio: 4 / 5 !important;
	height: auto !important;
	min-height: 0 !important;
}
@media (max-width: 1023px) {
	html.tbp-vista-griglia:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati.grid-risultati.grid-risultati {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}
@media (max-width: 767px) {
	html.tbp-vista-griglia:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati.grid-risultati.grid-risultati {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 10px !important;
	}
}

/* La barra delle viste nella testata del Catalogo, accanto a «Cerca con Colombo» e «Scarica PDF». */
html body.tbp-cf-pagina .tbp-cf-testa .tbp-cf-azioni .tbp-viste {
	margin: 0 !important;
}
@layer tbp-appearance {

/* (dentro il layer: vince sulle regole del modulo di Cerca e dei gettoni)
   14/10 (CEO: «nelle forme catalogo metti anche compatta e falla così, tipo come le inbox», con la foto delle
   schedine sotto la mappa della Home): una riga per scheda. Foto piccola a sinistra, titolo su due righe e
   «con Elind, Mantova» sotto; prezzo in alto a destra e «Prenota» sotto. Stessa scheda delle altre viste,
   cambia solo la disposizione (classe tbp-vista-compatta sulla radice, js/tbp-feed-viste.js). */
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati.grid-risultati.grid-risultati {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	grid-auto-rows: auto !important;
	gap: 12px !important;
	max-width: none !important;
}
@media (min-width: 1200px) {
	html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati.grid-risultati.grid-risultati {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}
@media (max-width: 767px) {
	html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati.grid-risultati.grid-risultati {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 10px !important;
	}
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card {
	grid-column: auto !important;
	grid-row: auto !important;
	height: auto !important;
	border: 1px solid #dce5e1 !important;
	border-radius: 14px !important;
	background: #fbfaf6 !important;
	box-shadow: none !important;
	overflow: hidden !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__media {
	display: grid !important;
	grid-template-columns: 64px minmax(0, 1fr) auto !important;
	grid-template-rows: auto auto !important;
	column-gap: 12px !important;
	row-gap: 6px !important;
	align-items: start !important;
	aspect-ratio: auto !important;
	height: auto !important;
	min-height: 0 !important;
	max-height: none !important;
	padding: 10px 12px !important;
	background: transparent !important;
	border-radius: 0 !important;
	overflow: visible !important;
}
/* La foto: solo la prima, un quadrato da 64 px. */
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__track {
	position: relative !important;
	inset: auto !important;
	grid-column: 1 !important;
	grid-row: 1 / span 2 !important;
	width: 64px !important;
	height: 64px !important;
	border-radius: 12px !important;
	overflow: hidden !important;
	scroll-snap-type: none !important;
	pointer-events: none !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__slide {
	flex: 0 0 64px !important;
	width: 64px !important;
	height: 64px !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__slide img {
	width: 64px !important;
	height: 64px !important;
	object-fit: cover !important;
}
/* Titolo e prezzo, persona e «Prenota»: escono dai loro contenitori e prendono una casella della griglia. */
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card :is(.tbp-exp-card__head, .tbp-exp-card__info, .tbp-exp-card__dock) {
	display: contents !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__title {
	position: static !important;
	grid-column: 2 !important;
	grid-row: 1 !important;
	margin: 0 !important;
	padding: 0 !important;
	color: #084828 !important;
	-webkit-text-fill-color: #084828 !important;
	text-shadow: none !important;
	font-size: 15px !important;
	line-height: 1.3 !important;
	font-weight: 700 !important;
	display: -webkit-box !important;
	-webkit-line-clamp: 2 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__price {
	position: static !important;
	grid-column: 3 !important;
	grid-row: 1 !important;
	justify-self: end !important;
	margin: 0 !important;
	color: #084828 !important;
	-webkit-text-fill-color: #084828 !important;
	text-shadow: none !important;
	font-size: 15px !important;
	line-height: 1.3 !important;
	font-weight: 800 !important;
	white-space: nowrap !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__person {
	position: static !important;
	grid-column: 2 !important;
	grid-row: 2 !important;
	align-self: end !important;
	display: flex !important;
	gap: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	min-width: 0 !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__maker-name {
	color: #3d5a4b !important;
	-webkit-text-fill-color: #3d5a4b !important;
	text-shadow: none !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__maker-name::before { content: "con "; }
html:lang(en).tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__maker-name::before { content: "with "; }
html:lang(fr).tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__maker-name::before { content: "avec "; }
html:lang(de).tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__maker-name::before { content: "mit "; }
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__buy {
	position: static !important;
	grid-column: 3 !important;
	grid-row: 2 !important;
	justify-self: end !important;
	align-self: end !important;
	width: auto !important;
	min-width: 0 !important;
	min-height: 38px !important;
	height: 38px !important;
	margin: 0 !important;
	padding: 0 16px !important;
	border-radius: 14px !important;
	background: #084828 !important;
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
	font-size: 15px !important;
	box-shadow: none !important;
}
/* Il resto della scheda grande qui non serve. */
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card :is(.tbp-exp-card__portrait, .tbp-exp-card__meta, .tbp-exp-card__shade, .tbp-exp-card__dots, .tbp-exp-card__wishlist) {
	display: none !important;
}
/* Tema scuro. */
html[data-tbp-theme="dark"].tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card {
	background: #161b18 !important;
	border-color: #2e3a33 !important;
}
html[data-tbp-theme="dark"].tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card :is(.tbp-exp-card__title, .tbp-exp-card__price) {
	color: #eef3f0 !important;
	-webkit-text-fill-color: #eef3f0 !important;
}
html[data-tbp-theme="dark"].tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__maker-name {
	color: #b7c6be !important;
	-webkit-text-fill-color: #b7c6be !important;
}
html[data-tbp-theme="dark"].tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__buy {
	background: #1f6b45 !important;
}

html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card.tbp-exp-card,
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card .tbp-exp-card__media,
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card :is(.tbp-exp-card__info, .tbp-exp-card__dock, .tbp-exp-card__head) {
	background-image: none !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card :is(video, [class*="progress"], [class*="barra"], [class*="anteprima-video"]) {
	display: none !important;
}
}

/* 14/10 (CEO: «troppo confuso, non puoi fare un design più ordinato?»): la testata torna com'era (titolo, «Cerca con
   Colombo», «Scarica PDF»); le viste sono una barra a icone sulla riga del conto, a destra (lo script le sposta lì).
   Il nome di ogni vista resta per i lettori di schermo e compare passandoci sopra. */
@layer tbp-appearance {
html:not(#tbp-cv-a) body.tbp-cf-pagina #tbp-search-summary.tbp-con-viste {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	column-gap: 16px !important;
	row-gap: 8px !important;
}
html:not(#tbp-cv-a) body.tbp-cf-pagina #tbp-search-summary.tbp-con-viste .tbp-search-summary__count { order: 1; margin: 0 !important; }
html:not(#tbp-cv-a) body.tbp-cf-pagina #tbp-search-summary.tbp-con-viste .tbp-viste { order: 2; margin: 0 0 0 auto !important; }
html:not(#tbp-cv-a) body.tbp-cf-pagina #tbp-search-summary.tbp-con-viste > :not(.tbp-search-summary__count):not(.tbp-viste) { order: 3; }
html:not(#tbp-cv-a) body.tbp-cf-pagina #tbp-search-summary.tbp-con-viste .tbp-search-summary__chips:not(:empty) { flex-basis: 100%; }
html:not(#tbp-cv-a) body.tbp-cf-pagina .tbp-viste {
	display: inline-flex !important;
	gap: 2px !important;
	padding: 3px !important;
	border: 1px solid rgba(8, 72, 40, .18) !important;
	border-radius: 14px !important;
	background: #fff !important;
	flex-wrap: nowrap !important;
}
html:not(#tbp-cv-a) body.tbp-cf-pagina .tbp-viste button.tbp-viste__btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 38px !important;
	min-width: 38px !important;
	height: 34px !important;
	min-height: 34px !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 11px !important;
	background: transparent !important;
	color: #4d6158 !important;
	box-shadow: none !important;
}
html:not(#tbp-cv-a) body.tbp-cf-pagina .tbp-viste button.tbp-viste__btn:hover { background: rgba(8, 72, 40, .07) !important; }
html:not(#tbp-cv-a) body.tbp-cf-pagina .tbp-viste button.tbp-viste__btn[aria-pressed="true"] { background: #084828 !important; color: #fff !important; }
html:not(#tbp-cv-a) body.tbp-cf-pagina .tbp-viste button.tbp-viste__btn .tbp-viste__glifo { width: 18px !important; height: 18px !important; fill: currentColor !important; color: inherit !important; }
html:not(#tbp-cv-a) body.tbp-cf-pagina .tbp-viste .tbp-viste__nome {
	position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important;
	clip: rect(0 0 0 0) !important; white-space: nowrap !important; margin: -1px !important; padding: 0 !important; border: 0 !important;
}
html[data-tbp-theme="dark"]:not(#tbp-cv-a) body.tbp-cf-pagina .tbp-viste { background: #161b18 !important; border-color: rgba(255, 255, 255, .2) !important; }
html[data-tbp-theme="dark"]:not(#tbp-cv-a) body.tbp-cf-pagina .tbp-viste button.tbp-viste__btn { color: #b7c6be !important; }
html[data-tbp-theme="dark"]:not(#tbp-cv-a) body.tbp-cf-pagina .tbp-viste button.tbp-viste__btn[aria-pressed="true"] { background: #1f6b45 !important; color: #fff !important; }
}
/* 14/10, ritocco: la barra delle viste larga quanto le sue icone; nella vista compatta via le sfumature dei
   contenitori aperti (i loro ::before e ::after restano visibili anche con display: contents). */
@layer tbp-appearance {
html:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-search-summary .tbp-viste {
	width: auto !important;
	max-width: none !important;
	flex: 0 0 auto !important;
	justify-content: flex-start !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card :is(.tbp-exp-card__media, .tbp-exp-card__head, .tbp-exp-card__info, .tbp-exp-card__dock, .tbp-exp-card__person)::before,
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card :is(.tbp-exp-card__media, .tbp-exp-card__head, .tbp-exp-card__info, .tbp-exp-card__dock, .tbp-exp-card__person)::after,
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card.tbp-exp-card::before,
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card.tbp-exp-card::after {
	display: none !important;
	content: none !important;
}
}
@layer tbp-appearance {
html:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-search-summary.tbp-con-viste .tbp-search-summary__count {
	flex: 0 1 auto !important;
	width: auto !important;
	max-width: 100% !important;
}
}
/* 14/10 (CEO: «c'è spazio ma comunque lasci dei … metti tutto il titolo»): nella vista compatta il titolo è intero. */
@layer tbp-appearance {
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card.tbp-exp-card .tbp-exp-card__title {
	display: block !important;
	-webkit-line-clamp: unset !important;
	line-clamp: none !important;
	overflow: visible !important;
	text-overflow: clip !important;
	white-space: normal !important;
	max-height: none !important;
}
}

/* 14/10 notte (CEO, foto dall'iPhone: «sono tutti rotti da mobile», poi «prima si vede la persona»). In Mosaico e Griglia,
   sotto i 1024 px, la scheda e' un riquadro stretto: foto e nome di chi insegna (uno sopra l'altro), due righe di
   etichette e «Prenota» non ci stavano e salivano sopra titolo e prezzo. Qui chi insegna resta, su una riga sola
   (foto piccola con la spunta, nome accanto); le etichette sono al massimo due; tutto sta in basso, sotto il prezzo.
   Al telefono le righe del Mosaico sono alte come le schede della Griglia (4:5). */
@media (max-width: 1023px) {
	html:is(.tbp-vista-mosaico, .tbp-vista-griglia):not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card {
		--tbp-discovery-portrait: 28px;
	}
	html:is(.tbp-vista-mosaico, .tbp-vista-griglia):not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card .tbp-exp-card__info {
		justify-content: flex-end !important;
	}
	html:is(.tbp-vista-mosaico, .tbp-vista-griglia):not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card .tbp-exp-card__person {
		flex-direction: row !important;
		align-items: center !important;
		gap: 7px !important;
		grid-column: 1 / -1 !important;
		justify-self: start !important;
		width: auto !important;
		max-width: 100% !important;
		min-width: 0 !important;
	}
	html:is(.tbp-vista-mosaico, .tbp-vista-griglia):not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card .tbp-exp-card__portrait,
	html:is(.tbp-vista-mosaico, .tbp-vista-griglia):not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card .tbp-exp-card__portrait-frame,
	html:is(.tbp-vista-mosaico, .tbp-vista-griglia):not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card .tbp-exp-card__maker-photo {
		width: 28px !important;
		height: 28px !important;
		flex: 0 0 28px !important;
	}
	html:is(.tbp-vista-mosaico, .tbp-vista-griglia):not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card .tbp-exp-card__verified {
		width: 13px !important;
		height: 13px !important;
		inset: auto -4px -4px auto !important;
	}
	html:is(.tbp-vista-mosaico, .tbp-vista-griglia):not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card .tbp-exp-card__verified svg {
		width: 9px !important;
		height: 9px !important;
	}
	html:is(.tbp-vista-mosaico, .tbp-vista-griglia):not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card .tbp-exp-card__maker-name {
		width: auto !important;
		min-width: 0 !important;
		max-width: none !important;
		flex: 0 1 auto !important;
		white-space: nowrap !important;
		overflow: hidden !important;
		text-overflow: ellipsis !important;
	}
	html:is(.tbp-vista-mosaico, .tbp-vista-griglia):not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati .tbp-exp-card.tbp-exp-card .tbp-exp-card__meta .tbp-exp-card__tag:nth-child(n + 3) {
		display: none !important;
	}
}
@media (max-width: 767px) {
	html.tbp-vista-mosaico:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati.grid-risultati.grid-risultati {
		grid-auto-rows: calc((100vw - 24px - 12px) / 2 * 1.25) !important;
	}
}
@media (min-width: 768px) and (max-width: 1023px) {
	html.tbp-vista-mosaico:not(#tbp-cv-a):not(#tbp-cv-b) body.tbp-cf-pagina #tbp-results-container .grid-risultati.grid-risultati.grid-risultati {
		grid-auto-rows: clamp(250px, 31vw, 340px) !important;
	}
}

/* 15/10 sera (CEO, foto della compatta: «migliora la UI, ci sono degli spazi vuoti che non capisco»). Il titolo usciva
   a 26 px su tre righe, il prezzo solo in alto a destra e «con Elind» e «Prenota» in fondo: in mezzo un vuoto alto.
   Ora: foto 76 px a sinistra; a destra titolo, «con Elind» e, sulla stessa riga in basso, prezzo e «Prenota». */
@layer tbp-appearance {
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b):not(#tbp-cv-c) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card.tbp-exp-card .tbp-exp-card__media {
	grid-template-columns: 76px minmax(0, 1fr) auto !important;
	grid-template-rows: auto auto 1fr !important;
	column-gap: 12px !important;
	row-gap: 4px !important;
	padding: 12px !important;
	min-height: 100px !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b):not(#tbp-cv-c) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card.tbp-exp-card .tbp-exp-card__track {
	grid-row: 1 / span 3 !important;
	width: 76px !important;
	height: 76px !important;
	align-self: start !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b):not(#tbp-cv-c) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card.tbp-exp-card :is(.tbp-exp-card__slide, .tbp-exp-card__slide img) {
	flex-basis: 76px !important;
	width: 76px !important;
	height: 76px !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b):not(#tbp-cv-c) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card.tbp-exp-card .tbp-exp-card__title {
	grid-column: 2 / -1 !important;
	grid-row: 1 !important;
	font-size: 16px !important;
	line-height: 1.25 !important;
	font-weight: 700 !important;
	letter-spacing: 0 !important;
	text-wrap: pretty;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b):not(#tbp-cv-c) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card.tbp-exp-card .tbp-exp-card__person {
	grid-column: 2 / -1 !important;
	grid-row: 2 !important;
	align-self: start !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b):not(#tbp-cv-c) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card.tbp-exp-card .tbp-exp-card__price {
	grid-column: 2 !important;
	grid-row: 3 !important;
	justify-self: start !important;
	align-self: end !important;
	font-size: 16px !important;
	line-height: 38px !important;
}
html.tbp-vista-compatta:not(#tbp-cv-a):not(#tbp-cv-b):not(#tbp-cv-c) body.tbp-cf-pagina #tbp-results-container .tbp-exp-card.tbp-exp-card .tbp-exp-card__buy {
	grid-column: 3 !important;
	grid-row: 3 !important;
	align-self: end !important;
	margin-top: 6px !important;
}
}