/* Optional food shelf. Shared site surfaces, typography and controls. */
.food-balance { margin: 0 0 10px; font-weight: 600; }
.food-rules { max-width: 78ch; font-size: 13px; line-height: 1.65; }
.food-status { margin: 14px 0; line-height: 1.55; }
.food-status:empty { display: none; }
.food-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px; margin-top: 22px; }
.food-card { grid-column: span 2; min-width: 0; }
.food-card-bundle, .food-card-hunger { grid-column: span 3; }
.food-art { display: grid; place-items: center; min-height: 0; padding: 18px 22px 0; background: var(--surface-2); }
.food-art img { display: block; width: 100%; height: 220px; object-fit: contain; }
.food-card-bundle .food-art img, .food-card-hunger .food-art img { height: 250px; }
.food-card-body { flex: 1; padding: 20px; gap: 12px; }
.food-card-body h3 { margin: 0; font-size: var(--tm-h-item); }
.food-description { margin: 0; font-size: 14px; line-height: 1.55; }
.food-price-line { display: flex; align-items: center; gap: 10px; margin-top: auto; min-height: 36px; }
.food-price-edit { display: inline-grid; place-items: center; width: 36px; height: 36px; font-size: 24px; flex-shrink: 0; }
.food-quota { margin: 0; font-size: 12px; line-height: 1.6; font-variant-numeric: tabular-nums; }
.food-buy { width: 100%; text-align: center; white-space: normal; min-height: 42px; }
.food-dialog { max-width: min(480px, calc(100vw - 32px)); }
.food-dialog-description { line-height: 1.6; }
.food-price-label { display: block; margin-bottom: 8px; }
.food-price-input { width: 100%; font-size: 16px; }
.food-dialog .buy-actions { flex-wrap: wrap; }
@media (max-width: 760px) {
  .food-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .food-card, .food-card-bundle, .food-card-hunger { grid-column: span 1; }
  .food-art { padding: 14px 14px 0; }
  .food-art img, .food-card-bundle .food-art img, .food-card-hunger .food-art img { height: 180px; }
  .food-card-body { padding: 16px; }
}
@media (max-width: 440px) {
  .food-grid { grid-template-columns: minmax(0, 1fr); }
  .food-art img, .food-card-bundle .food-art img, .food-card-hunger .food-art img { height: 220px; }
}