/* ============================================================
   mojedania 2026 — lista zakupowa (M9/M10, trasa B: localStorage)
   Mobile-first. Odhaczalny CAŁY wiersz (>=48px), przekreslenie + zmiana tla.
   ============================================================ */

/* --- kontrolki na karcie przepisu --- */
.md-recipe-actions {
  display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center;
  margin: 0.75rem 0 0.25rem;
}
.md-btn {
  min-height: 48px; padding: 0.6rem 1rem; border: none; border-radius: 0.6rem;
  background: var(--wp--preset--color--primary, #C0492C); color: #fff;
  font-size: 1rem; font-weight: 600; cursor: pointer; display: inline-flex;
  align-items: center; gap: 0.4rem;
}
.md-btn.md-btn-secondary { background: var(--wp--preset--color--tertiary, #6B7F5B); }
.md-btn:focus-visible { outline: 3px solid var(--wp--preset--color--secondary, #E8A33D); outline-offset: 2px; }

.md-servings-scaler { display: inline-flex; align-items: center; gap: 0.4rem; }
.md-servings-scaler button {
  min-width: 44px; min-height: 44px; border-radius: 0.5rem; border: 1px solid #ccc;
  background: #fff; font-size: 1.25rem; line-height: 1; cursor: pointer;
}
.md-servings-scaler .md-servings-value { min-width: 2ch; text-align: center; font-weight: 700; }

/* --- checkbox przy skladniku na karcie (caly wiersz klikalny) --- */
.wprm-recipe-ingredient.md-selectable {
  cursor: pointer; padding-left: 2.2rem !important; position: relative;
  min-height: 48px; display: flex; align-items: center; flex-wrap: wrap;
}
.wprm-recipe-ingredient.md-selectable::before {
  content: ""; position: absolute; left: 0.4rem; top: 50%; transform: translateY(-50%);
  width: 1.35rem; height: 1.35rem; border: 2px solid var(--wp--preset--color--primary, #C0492C);
  border-radius: 0.35rem; background: #fff;
}
.wprm-recipe-ingredient.md-selected::before {
  background: var(--wp--preset--color--primary, #C0492C);
}
.wprm-recipe-ingredient.md-selected::after {
  content: "✓"; position: absolute; left: 0.62rem; top: 50%; transform: translateY(-50%);
  color: #fff; font-weight: 700; font-size: 0.95rem;
}

/* --- QR --- */
.md-qr { margin-top: 0.5rem; }
.md-qr img, .md-qr canvas { width: 160px; height: 160px; image-rendering: pixelated; }
.md-qr figcaption { font-size: 0.9rem; color: var(--wp--preset--color--contrast, #2E2019); }

/* ============================================================
   Strona /lista-zakupowa/
   ============================================================ */
#md-lista-container { margin: 1rem 0; }
.md-lista-recipe-group { margin-bottom: 1.5rem; }
.md-lista-recipe-group h3 { margin-bottom: 0.5rem; }
.md-lista-item {
  display: flex; align-items: center; gap: 0.75rem;
  min-height: 48px; width: 100%; padding: 0.5rem 0.6rem; margin-bottom: 8px;
  border-radius: 0.5rem; background: var(--wp--preset--color--card, #fff);
  box-shadow: 0 1px 4px rgba(46,32,25,0.08); cursor: pointer; text-align: left;
  border: none; font-size: 1.0625rem; color: var(--wp--preset--color--contrast, #2E2019);
}
.md-lista-item .md-check {
  flex: 0 0 auto; width: 1.5rem; height: 1.5rem; border-radius: 0.35rem;
  border: 2px solid var(--wp--preset--color--primary, #C0492C); display: inline-flex;
  align-items: center; justify-content: center; background: #fff;
}
.md-lista-item.md-done { background: var(--wp--preset--color--accent-soft, #F3E7D6); }
.md-lista-item.md-done .md-label { text-decoration: line-through; color: #6b5d52; }
.md-lista-item.md-done .md-check { background: var(--wp--preset--color--primary, #C0492C); color: #fff; }
.md-lista-actions { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 1rem 0; }
.md-lista-note {
  font-size: 0.95rem; background: var(--wp--preset--color--accent-soft, #F3E7D6);
  padding: 0.75rem 1rem; border-radius: 0.6rem; margin-top: 1rem;
}
.md-lista-empty { color: #6b5d52; font-style: italic; }