/* BAAZAAR — Catalog page specifics
   Build: step02-2026-02-01-01
*/
.catalog-head { padding: 18px 0 8px; }
.catalog-controls { display: grid; grid-template-columns: 1fr 180px; gap: 12px; align-items: center; }
@media (max-width: 640px) { .catalog-controls { grid-template-columns: 1fr; } }

.catalog-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  padding: 14px 0 26px;
}
@media (max-width: 1100px) { .catalog-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 820px) { .catalog-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .catalog-grid { grid-template-columns: 1fr; } }

/* Card is an <a>, so we must neutralize default link styles */
.card {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
}

/* Catalog JS uses .card-img; keep backwards-compat with .card-media */
.card-img,
.card-media {
  display: block;
  background: #fff;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}
/* Show the whole product image (no crop). */
.card-img img,
.card-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.card-body {
  padding: 10px 12px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.card-title {
  font-weight: 800;
  font-size: 14px;
  line-height: 1.2;
  color: #0b1f1e;
}

.card-meta {
  font-size: 12px;
}

.card-price {
  font-weight: 900;
  font-size: 14px;
}

.card-seller { font-weight: 800; font-size: 12px; color: rgba(0,0,0,.65); }

.empty { padding: 22px; border: 1px dashed rgba(0,0,0,.15); border-radius: 16px; background: #fff; }
.empty-title { font-weight: 900; margin-bottom: 6px; }

.card-specs {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 48px;
}
.card-spec-line {
  font-size: 12px;
  line-height: 1.25;
  color: rgba(0,0,0,.72);
}