/* ============================================================
   Product List — Box View (claude template 2025)
   Most styles live in afs.css. This file adds overrides.
   ============================================================ */

/* Ensure grid layout is applied */
.artikelbox  { display: grid; }
.artikelbox2 { display: grid; }

/* Card must fill grid cell */
.artikelliste {
  height: auto !important;
  width:  auto !important;
  float:  none !important;
  margin: 0 !important;
}

/* Image container */
.artikelliste_bild {
  width: 100%;
  height: 150px;
  margin-left: auto;
  margin-right: auto;
}
.artikelliste_bild img {
  max-height: 140px;
  max-width: 100%;
  margin: 0;
  border: none;
}

/* Text */
.artikelliste_bezeichnung { margin-top: 0; }
.artikelliste_text { max-height: none; width: 100%; }
.artikelliste_text .preis { font-size: 17px; }

/* Tooltips */
.artikelliste .tooltip {
  background-color: var(--surface, #fff);
  border: 1px solid var(--border, #e2e8f0);
  padding: 12px;
  width: 300px;
}

/* Sorting controls */
.artikelbox .sorting { grid-column: 1 / -1; }

/* Pagination */
.artikel_begrenzung { grid-column: 1 / -1; clear: both; }

/* Responsive */
@media only screen and (max-width: 700px) {
  .artikelbox, .artikelbox2 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 479px) {
  .artikelbox, .artikelbox2 {
    grid-template-columns: 1fr;
  }
}