/* Keep the grocery navigation on one compact row, including the new areas. */
@media (max-width:760px) {
  .sidebar { grid-template-columns:repeat(6,minmax(0,1fr)); gap:2px; padding:5px; }
  .sidebar .list-button { font-size:9px; overflow-wrap:anywhere; }
}
#saved-dialog { width:min(calc(100% - 24px),900px); }
#saved-dialog [hidden] { display:none!important; }
#saved-dialog h2 { margin:0; }
#saved-dialog p { color:var(--muted); font-size:13px; line-height:1.5; }
/* Status stays pinned at the top of the scrolling dialog, so messages are seen wherever the button was. */
#saved-status { position:sticky; top:-18px; z-index:6; margin:0 -18px; padding:0 18px; background:white; }
#saved-status:not(:empty) { padding:10px 18px; border-bottom:1px solid var(--line); color:var(--brand-dark); font-weight:650; box-shadow:0 6px 12px rgba(0,0,0,.06); }
.saved-loading { display:flex; align-items:center; gap:4px; color:var(--muted); }
#saved-dialog label { display:grid; gap:5px; min-width:0; color:var(--muted); font-size:12px; font-weight:650; }
#saved-dialog input:not([type=checkbox]), #saved-dialog select { width:100%; min-width:0; min-height:44px; padding:8px; border:1px solid #cbd7cf; border-radius:9px; background:white; color:var(--ink); }
#saved-dialog button, .meal-details summary { min-height:44px; padding:9px 12px; border-radius:9px; overflow-wrap:anywhere; }
.saved-create-form { display:grid; gap:10px; margin:16px 0; }
.saved-card { border:1px solid var(--line); border-radius:14px; padding:12px; margin-top:16px; background:#fbfdfb; min-width:0; }
.saved-card h3 { margin:0 0 4px; overflow-wrap:anywhere; }
.saved-card details { margin:12px 0; }
.saved-card summary { min-height:44px; padding:12px 0; cursor:pointer; color:var(--brand-dark); }
.saved-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.saved-actions button { flex:1 1 120px; }
.saved-overview-title { margin:18px 0 8px; font-size:15px; }
.saved-overview { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
#saved-dialog .saved-open { display:flex; width:100%; align-items:center; justify-content:space-between; gap:12px; padding:10px 14px; border:1px solid var(--line); border-radius:12px; background:#fbfdfb; color:var(--ink); text-align:left; cursor:pointer; }
.saved-open:hover { border-color:#b9d4c6; background:var(--brand-soft); }
.saved-open span:first-child { display:grid; gap:2px; min-width:0; overflow-wrap:anywhere; }
.saved-open small { color:var(--muted); font-size:12px; }
.saved-open span:last-child { font-size:22px; color:var(--brand-dark); }
#saved-dialog .saved-back { margin-top:8px; padding-left:0; border:0; background:none; color:var(--brand-dark); font-weight:700; cursor:pointer; }
.saved-ingredients { list-style:none; margin:10px 0 0; padding:0; }
.saved-ingredients li { display:flex; justify-content:space-between; gap:12px; padding:6px 0; border-bottom:1px solid var(--line); font-size:14px; }
.saved-ingredients span { min-width:0; overflow-wrap:anywhere; }
.saved-ingredients small { flex:none; color:var(--muted); }
.saved-import { border-top:1px solid var(--line); }
.saved-cooking { border-top:1px solid var(--line); }
.saved-cooking[open] summary { font-weight:700; }
.saved-steps { margin:4px 0 0; padding-left:28px; }
.saved-steps li { padding:2px 0; }
#saved-dialog .saved-step { display:block; width:100%; min-height:44px; padding:8px 10px; border:1px solid transparent; border-radius:9px; background:none; color:var(--ink); font-size:15px; line-height:1.45; text-align:left; cursor:pointer; }
#saved-dialog .saved-step:hover { border-color:var(--line); background:#f6faf7; }
#saved-dialog .saved-step[aria-pressed="true"] { color:#8b9690; text-decoration:line-through; background:#f3f5f3; }
.saved-cook-note { padding:8px 10px; border-radius:9px; background:var(--accent-soft); color:#5f4712!important; }
#saved-dialog .saved-cook-hint { margin:4px 0 0; font-size:12px; }
.saved-cook-form { display:grid; gap:10px; margin-top:12px; }
#saved-dialog textarea { width:100%; min-height:160px; padding:8px; border:1px solid #cbd7cf; border-radius:9px; background:white; color:var(--ink); font:inherit; font-size:16px; line-height:1.45; resize:vertical; }
.saved-import[open] summary { font-weight:700; }
.saved-entry { display:grid; grid-template-columns:44px minmax(0,1fr) auto; gap:6px; align-items:center; padding:6px 0; border-bottom:1px solid var(--line); }
.saved-entry .saved-check { display:flex!important; width:44px; height:44px; align-items:center; justify-content:center; }
.saved-select { width:24px; height:24px; accent-color:var(--brand); }
.saved-entry span { min-width:0; overflow-wrap:anywhere; font-size:14px; }
.saved-entry small { display:block; color:var(--muted); }
.saved-entry .saved-remove { width:44px; padding:8px!important; }
.saved-edit-entry { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px; padding:10px 0; border-top:1px solid var(--line); }
.saved-edit-entry label:first-child { grid-column:1/-1; }
#saved-review { background:var(--brand-soft); padding:14px; border:1px solid #b9d4c6; border-radius:12px; margin:16px 0; }
#saved-review ul { padding-left:20px; font-size:14px; overflow-wrap:anywhere; }
.meal-details { position:relative; margin:0; color:var(--brand-dark); }
.meal-details summary { display:flex; align-items:center; justify-content:center; cursor:pointer; width:44px; height:44px; min-height:44px; padding:0; list-style:none; font-size:19px; }
.meal-details summary::-webkit-details-marker { display:none; }
/* Lift the row with an open breakdown above later rows and their checkboxes. */
.item:has(.meal-details[open]) { position:relative; z-index:5; }
.meal-breakdown { position:absolute; right:0; top:44px; width:min(260px,calc(100vw - 44px)); padding:14px; border:1px solid #b9d4c6; border-radius:12px; background:white; box-shadow:var(--shadow); z-index:4; font-size:13px; white-space:normal; overflow-wrap:anywhere; }
.meal-breakdown p { margin:8px 0 0; line-height:1.5; }
.saved-share-row { display:flex; align-items:center; gap:8px; margin:8px 0; }
.saved-share-row button { min-width:90px; }
@media(min-width:761px) {
 .saved-create-form { grid-template-columns:minmax(0,2fr) minmax(0,1fr) auto; align-items:end; }
 .saved-card { margin-top:12px; padding:16px; }
}
