/* GP522 – Text- und Aktionsausrichtung für kompakte Produktkacheln.
 * Bewahrt Bild-/Galeriegleichheit aus 521 und alle Filterfunktionen aus 520. */

/* Drei statt nur zwei Zeilen für die sachlichen Kurzbeschreibungen.
   Der vollständige Ausgangstext bleibt im DOM und auf der Detailseite erhalten. */
.gp-product-archive .gp-product-list.is-grid-view .gp-product-loop-description {
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  min-height:0;
  max-height:4.26em;
  overflow:hidden;
  overflow-wrap:break-word;
  text-wrap:pretty;
}
/* Im Vierer-Raster starten Beschreibungen auf exakt derselben Höhe: die
   kürzeren, zweizeiligen Titel reservieren den Raum der dreizeiligen Titel.
   Auch die Metadaten-/Preis- und Aktionszeilen bleiben unten ausgerichtet. */
@container gp-products (min-width:861px) {
  .gp-product-archive .gp-product-list.is-grid-view[data-gp-columns="4"] .gp-product-loop-title {
    min-height:3.87em; /* 3 x 1.29em = drei Titellinien */
  }
  .gp-product-archive .gp-product-list.is-grid-view[data-gp-columns="4"] .gp-product-loop-description {
    min-height:4.26em; /* 3 x 1.42em = drei Beschreibungslinien */
    max-height:4.26em;
  }
}
/* Bei drei Spalten gilt derselbe saubere Textgrundriss; breite Zweier-/
   Einer-Raster erhalten keine unnötig großen Titel-Platzhalter. */
@container gp-products (min-width:701px) {
  .gp-product-archive .gp-product-list.is-grid-view[data-gp-columns="3"] .gp-product-loop-title {
    min-height:3.78em; /* 3 x 1.26em */
  }
}
/* Beide Sekundäraktionen bleiben innerhalb ihrer Felder: Icon und Label
   sind Flex-Inhalte; keine Quetschung oder verdeckten Textenden. */
.gp-product-archive .gp-product-list.is-grid-view .gp-product-loop-side-actions {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
  width:100%;
  min-width:0;
}
.gp-product-archive .gp-product-list.is-grid-view .gp-product-loop-side-actions .gp-library-button {
  display:inline-flex;
  flex-flow:row nowrap;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-width:0!important;
  max-width:100%;
  width:100%!important;
  padding:6px 3px!important;
  box-sizing:border-box;
  font-size:clamp(10px,.68vw,11px);
  letter-spacing:-.015em;
  line-height:1.25;
  text-align:center;
  white-space:nowrap;
}
.gp-product-archive .gp-product-list.is-grid-view .gp-product-loop-side-actions .gp-library-button__icon {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  flex:0 0 14px;
  width:14px;
  min-width:14px;
  height:16px;
  line-height:1;
}
.gp-product-archive .gp-product-list.is-grid-view .gp-product-loop-side-actions .gp-library-button__icon svg {
  display:block;
  width:14px;
  height:14px;
  max-width:100%;
}
.gp-product-archive .gp-product-list.is-grid-view .gp-product-loop-side-actions .gp-library-button [data-gp-label] {
  display:inline-block;
  flex:0 1 auto;
  min-width:0;
  white-space:nowrap;
}
@container gp-products (max-width:860px) {
  .gp-product-archive .gp-product-list.is-grid-view[data-gp-columns="4"] .gp-product-loop-title {min-height:0}
  .gp-product-archive .gp-product-list.is-grid-view[data-gp-columns="4"] .gp-product-loop-description {min-height:0}
}
@media (max-width:430px) {
  .gp-product-archive .gp-product-list.is-grid-view .gp-product-loop-side-actions .gp-library-button {
    font-size:11px;
    gap:6px;
  }
}