/* Bobine di filamento (D10bis): scheda stampante FDM e pagina materiale. */
.filamenti {
  margin: var(--space-8, 2rem) 0;
  padding: var(--space-6, 1.5rem);
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-bg-subtle);
  scroll-margin-top: 5rem;
}
.filamenti__titolo { margin: 0 0 var(--space-2, 0.5rem); }
.filamenti__intro { margin: 0 0 var(--space-4, 1rem); color: var(--color-text-secondary); }

.filamenti__filtri {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
  margin-bottom: var(--space-4, 1rem);
}
.filamenti__filtro { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.85rem; }
.filamenti__filtro select {
  min-width: 9rem;
  padding: 0.35rem 0.5rem;
  border: 1px solid var(--color-border-strong);
  border-radius: 6px;
  background: var(--color-bg);
  font: inherit;
}

.filamenti__lista { list-style: none; margin: 0; padding: 0; }
.filamenti__riga {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.25rem var(--space-4, 1rem);
  padding: var(--space-3, 0.75rem) 0;
  border-top: 1px solid var(--color-border);
}
.filamenti__riga[hidden] { display: none; }
.filamenti__nome { font-weight: 600; }
.filamenti__dati {
  grid-column: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.75rem;
  font-size: 0.85rem;
  color: var(--color-text-tertiary);
}
.filamenti__link {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  color: var(--color-buy);
  font-weight: 600;
  white-space: nowrap;
}
.filamenti__link:hover { color: var(--color-buy-hover); }
.filamenti__altre { margin-top: var(--space-3, 0.75rem); }
.filamenti__vuoto, .filamenti__nota { font-size: 0.85rem; color: var(--color-text-tertiary); }

.filamenti-ancora { display: inline-block; margin-top: var(--space-2, 0.5rem); font-weight: 600; }

@media (max-width: 600px) {
  .filamenti { padding: var(--space-4, 1rem); }
  .filamenti__riga { grid-template-columns: 1fr; }
  .filamenti__link { grid-column: 1; grid-row: auto; }
}

/* Variante compatta dei confronti (D10ter): poche righe, niente filtri. */
.filamenti--compatto { padding: var(--space-4, 1rem) var(--space-6, 1.5rem); }
.filamenti__tutti { margin: var(--space-3, 0.75rem) 0 0; font-weight: 600; }

/* Pagina «Filamenti» (D10ter). L'icona ha il fondo bianco pieno: sta sul bianco della pagina. */
.filamenti-pagina__testata {
  display: flex;
  align-items: flex-start;
  gap: var(--space-4, 1rem);
  margin: var(--space-6, 1.5rem) 0 var(--space-2, 0.5rem);
}
.filamenti-pagina__icona { flex: none; width: 72px; height: 72px; }
.filamenti-pagina__titolo { margin: 0 0 var(--space-2, 0.5rem); }
.filamenti-pagina__intro { margin: 0; color: var(--color-text-secondary); max-width: 46rem; }
.filamenti-pagina__vuoto { color: var(--color-text-tertiary); }
