/* ==============================================
   MASONRY LAYOUT - IMMAGINI CHE RIEMPIONO IL CONTAINER
   ============================================== */

/* UL principale: Flex container con stretch */
.node-taxonomy-container .taxonomy-terms {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important; /* Tutti i LI si estendono all'altezza del più alto */
  gap: 0.4rem !important;
}

/* LI: Diventa flex container verticale */
.taxonomy-terms > li {
  display: flex !important;
  flex-direction: column !important;
  height: auto !important; /* Lascia che stretch gestisca l'altezza */
}

/* DIV interni: Crescono per riempire tutto lo spazio verticale */
.taxonomy-terms > li > div,
.taxonomy-terms > li > div > div,
.field--name-field-media-image,
.field--name-field-media-image > div,
.field--name-field-media-oembed-video {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important; /* Crescono per riempire lo spazio */
  min-height: 0 !important;
}

/* Field-item: Cresce per riempire tutto lo spazio */
.node-taxonomy-container .field-item {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
  min-height: 0 !important;
  position: relative !important; /* Per l'iframe absolute */
}

/* Immagine: Riempie tutto lo spazio verticale disponibile */
.node-taxonomy-container img.image-field {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
}

/* ==============================================
   IFRAME YOUTUBE - OCCUPA TUTTO LO SPAZIO COME LE IMMAGINI
   ============================================== */

/* Field-item del video: Posizionamento relativo per l'iframe absolute */
.field--name-field-media-oembed-video .field-item {
  position: relative !important;
  width: 100% !important;
  height: 100% !important; /* Occupa tutto lo spazio disponibile come le immagini */
  flex: 1 !important;
}

/* Iframe: Riempie tutto lo spazio disponibile mantenendo proporzione */
.field--name-field-media-oembed-video iframe {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important; /* Mantiene proporzione, taglia se necessario */
}
