.row-subtitle { display: block; margin-top: 3px; }
.recipe-editor { display: grid; gap: 16px; }
.recipe-basics { display: grid; gap: 16px; }
.input-suffix { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.input-suffix input { border-radius: 4px 0 0 4px; }
.input-suffix span { display: grid; height: 40px; padding: 0 10px; place-items: center; border: 1px solid var(--border-strong); border-left: 0; border-radius: 0 4px 4px 0; background: var(--surface-muted); color: var(--text-muted); }
.ingredient-section { padding: 0; }
.ingredient-section > .section-heading { padding: 16px; }
.ingredient-rows { display: grid; }
.ingredient-row { position: relative; display: grid; grid-template-columns: minmax(210px, 2fr) minmax(90px, .6fr) minmax(105px, .7fr) minmax(180px, 1.2fr) minmax(150px, 1fr) 36px; gap: 10px; align-items: end; padding: 14px 16px; border-bottom: 1px solid var(--border); }
.ingredient-remove { margin-bottom: 2px; color: var(--danger); }
.recipe-add-actions { display: flex; gap: 8px; padding: 14px 16px; }
.sticky-actions { position: sticky; bottom: 12px; z-index: 5; padding: 12px; background: color-mix(in srgb, var(--background) 92%, transparent); border: 1px solid var(--border); border-radius: 4px; backdrop-filter: blur(12px); }
.recipe-detail-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .7fr); gap: 16px; }
.recipe-detail-grid > div, .recipe-detail-grid > aside { display: grid; align-content: start; gap: 16px; }
.ingredient-display-list { display: grid; }
.ingredient-display-list > div { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.ingredient-display-list > div:last-child { border-bottom: 0; }
.ingredient-display-list span:first-child { display: grid; }
.ingredient-display-list small { color: var(--text-muted); }
.inline-form { display: flex; align-items: center; gap: 8px; }
.inline-form label { color: var(--text-muted); font-size: 12px; }
.inline-form input { width: 88px; min-height: 34px; padding: 5px 8px; border: 1px solid var(--border-strong); border-radius: 4px; background: var(--surface-raised); color: var(--text); }
.prose-section p { white-space: pre-wrap; }
.danger-zone { margin-top: 16px; }
.date-nav { display: flex; align-items: center; gap: 8px; }
.date-nav input { min-height: 36px; padding: 6px 8px; border: 1px solid var(--border-strong); border-radius: 4px; background: var(--surface-raised); color: var(--text); }
.meal-quick-add { padding: 0; margin-bottom: 12px; }
.meal-quick-add > .section-heading { padding: 16px; }
.quick-add-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.quick-add-grid > form { padding: 16px; }
.quick-add-grid > form + form { border-left: 1px solid var(--border); }
.quick-add-grid h3 { margin: 0; font-size: 14px; }
.compact-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.compact-form-grid .wide-field { grid-column: 1 / -1; }
.repeat-days { display: flex; flex-wrap: wrap; gap: 6px 10px; padding: 0; border: 0; }
.repeat-days legend { width: 100%; margin-bottom: 4px; color: var(--text-muted); font-size: 11px; }
.repeat-days label { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; }
.week-toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.week-grid { display: grid; grid-template-columns: repeat(7, minmax(150px, 1fr)); gap: 8px; overflow-x: auto; padding-bottom: 6px; }
.plan-day { min-width: 150px; padding: 12px; }
.plan-day > header { display: grid; gap: 8px; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
.plan-day > header > div { display: grid; }
.weekday { color: var(--text-muted); font-size: 11px; text-transform: uppercase; }
.plan-day > header > span { color: var(--primary); font-size: 12px; }
.plan-items { display: grid; gap: 8px; min-height: 100px; padding: 10px 0; }
.plan-item { position: relative; display: grid; gap: 3px; padding: 8px; border: 1px solid var(--border); border-radius: 3px; background: var(--surface-raised); }
.plan-item .badge { margin-bottom: 2px; }
.plan-item small { color: var(--text-muted); }
.plan-delete-form { position: absolute; top: 3px; right: 3px; }
.plan-amount-form { display: flex; gap: 3px; margin-top: 4px; }
.plan-amount-form input { width: 66px; min-width: 0; padding: 4px 5px; border: 1px solid var(--border); border-radius: 3px; background: var(--surface); color: var(--text); }
.planned-diary { margin-bottom: 16px; }
.planned-list { display: grid; }
.planned-list > div { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--border); }
.planned-list > div:last-child { border-bottom: 0; }
.planned-list > div > span { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 3px 8px; }
.planned-list small { grid-column: 2; color: var(--text-muted); }
.diary-layout { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(290px, .6fr); gap: 16px; }
.diary-entry { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.diary-entry:last-child { border-bottom: 0; }
.diary-entry-copy { display: grid; }
.diary-entry-copy small { color: var(--text-muted); }
.diary-entry .inline-form input { width: 80px; }
.diary-quick-forms { display: grid; gap: 14px; margin-top: 14px; }
.diary-quick-forms hr { width: 100%; margin: 0; border: 0; border-top: 1px solid var(--border); }
.shopping-items { padding: 0; overflow: hidden; }
.shopping-row { display: grid; grid-template-columns: 38px minmax(180px, 2fr) repeat(4, minmax(100px, 1fr)); align-items: center; gap: 10px; min-height: 52px; padding: 8px 14px; border-bottom: 1px solid var(--border); }
.shopping-row:last-child { border-bottom: 0; }
.shopping-header { min-height: 38px; background: var(--surface-muted); color: var(--text-muted); font-size: 11px; font-weight: 600; text-transform: uppercase; }
.shopping-row > span:nth-child(2) { display: grid; }
.shopping-row small { color: var(--text-muted); }
.shopping-row.checked { color: var(--text-muted); background: color-mix(in srgb, var(--surface-muted) 60%, transparent); }
.shopping-row.checked strong { text-decoration: line-through; }
.check-button { display: grid; width: 28px; height: 28px; padding: 0; place-items: center; border: 1px solid var(--border-strong); border-radius: 3px; background: var(--surface-raised); color: var(--primary); cursor: pointer; }
.shopping-explanation { grid-column: 2 / -1; color: var(--text-muted); font-size: 12px; }
.shopping-explanation summary { color: var(--primary); cursor: pointer; }
.shopping-explanation p { margin-top: 8px; }
.manual-shopping { margin-top: 16px; }
.manual-shopping .inline-form { margin-top: 12px; }
.manual-shopping .inline-form input { width: min(100%, 420px); }

@media (max-width: 1050px) {
  .ingredient-row { grid-template-columns: minmax(220px, 2fr) repeat(3, minmax(100px, 1fr)) 36px; }
  .ingredient-note { grid-column: 1 / -2; }
  .week-grid { grid-template-columns: repeat(7, minmax(180px, 1fr)); }
}

@media (max-width: 767px) {
  .recipe-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ingredient-section > .section-heading > button { display: none; }
  .ingredient-row { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 14px; }
  .ingredient-food, .ingredient-note { grid-column: 1 / -1; }
  .ingredient-remove { position: absolute; top: 8px; right: 8px; }
  .recipe-add-actions { flex-direction: column; }
  .recipe-add-actions .button { min-height: 44px; }
  .recipe-detail-grid { grid-template-columns: 1fr; }
  .section-heading:has(.inline-form) { display: grid; }
  .inline-form { margin-top: 10px; }
  .inline-form input { min-height: 44px; }
  .date-nav { width: 100%; }
  .page-header.split .date-nav .button { width: auto; flex: 0 0 52px; }
  .date-nav input { min-height: 44px; flex: 1; min-width: 0; }
  .quick-add-grid { grid-template-columns: 1fr; }
  .quick-add-grid > form + form { border-top: 1px solid var(--border); border-left: 0; }
  .week-toolbar, .week-toolbar .inline-form { display: grid; }
  .week-toolbar input { width: 100%; }
  .week-grid { display: grid; grid-template-columns: 1fr; overflow: visible; }
  .plan-day { min-width: 0; }
  .plan-items { min-height: 0; }
  .planned-list > div { align-items: stretch; flex-direction: column; }
  .planned-list form, .planned-list button { width: 100%; }
  .diary-layout { grid-template-columns: 1fr; }
  .diary-entry { grid-template-columns: auto minmax(0, 1fr) auto; }
  .diary-entry .inline-form { grid-column: 2 / -1; }
  .shopping-header { display: none; }
  .shopping-row { grid-template-columns: 36px minmax(0, 1fr); gap: 8px; padding: 12px; }
  .shopping-row > span:nth-of-type(n+2) { grid-column: 2; }
  .shopping-row > span:nth-of-type(2)::before { content: "Benötigt: "; color: var(--text-muted); }
  .shopping-row > span:nth-of-type(3)::before { content: "Packungen: "; color: var(--text-muted); }
  .shopping-row > span:nth-of-type(4)::before { content: "Rest: "; color: var(--text-muted); }
  .shopping-row > span:nth-of-type(5)::before { content: "Einkaufswert: "; color: var(--text-muted); }
  .shopping-explanation { grid-column: 2; }
  .manual-shopping .inline-form { display: grid; }
  .manual-shopping .inline-form input { width: 100%; }
}