/* Shared styles for the listing-card pages (plants, farm, herbal, journal)
   and the owner-page previews. Moved from plants.html so every page renders
   cards the same way. Uses only ds-bundle tokens/classes — no new colors. */

.plant-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 24px;
  margin-top: 40px;
}
.plant-card .card-body { padding: 24px 24px 26px; }
.plant-photo { display: block; width: 100%; height: 190px; object-fit: cover; }
.plant-mark {
  width: 42px; height: 42px; border-radius: 50%;
  background: var(--sage-soft); color: var(--leaf-dark);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.15rem; margin-bottom: 14px;
}
/* When something is on sale, the old price sits inside the price tag with a
   little rust slash through it, and the new price follows in the usual green. */
.price-tag s {
  text-decoration: none;
  color: var(--ink-soft);
  font-weight: 600;
  padding: 0 2px;
  margin-right: 6px;
  background: linear-gradient(to top right,
    transparent 44%, var(--rust) 44%, var(--rust) 58%, transparent 58%);
}
.empty-note {
  max-width: 560px; margin: 48px auto 0; text-align: center;
  background: var(--cream-2); border: 1px solid var(--line);
  border-radius: var(--radius-l); padding: 40px 32px;
}