

/* ---- Meal Planner: shopping-list step ------------------------------------ */
#mpAddOptions .mps-step{ font-family:'Nunito',system-ui,sans-serif; }
#mpAddOptions .mps-back{
  cursor:pointer; font:inherit; font-size:.8rem; font-weight:800; margin-bottom:14px;
  background:#fff !important; border:1px solid #E4DFD2 !important; border-radius:999px;
  padding:9px 15px; min-height:40px;
  color:#3F4753 !important; -webkit-text-fill-color:#3F4753 !important;
}
#mpAddOptions .mps-back:hover{ background:#F4F6F1 !important; }
#mpAddOptions .mps-head{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
#mpAddOptions .mps-emoji{
  flex:none; width:46px; height:46px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  background:#EEF4EC; font-size:1.3rem;
}
#mpAddOptions .mps-h{ display:flex; flex-direction:column; gap:2px; }
#mpAddOptions .mps-h strong{
  font-size:1.02rem; color:#243447 !important; -webkit-text-fill-color:#243447 !important;
}
#mpAddOptions .mps-h span{
  font-size:.8rem; color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important;
}
#mpAddOptions .mps-lab{
  margin:0 0 8px; font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  color:#4E5A49 !important; -webkit-text-fill-color:#4E5A49 !important;
}
#mpAddOptions .mps-ing{ list-style:none; margin:0 0 10px; padding:0; display:grid; gap:6px; }
#mpAddOptions .mps-i label{
  display:flex; align-items:center; gap:10px; cursor:pointer;
  background:#fff; border:1px solid #E8E4DC; border-radius:12px; padding:11px 13px; min-height:46px;
}
#mpAddOptions .mps-i.is-have label{ background:#F6F8F4; border-color:#DDE7D7; }
#mpAddOptions .mps-i input{ width:20px; height:20px; flex:none; accent-color:#4E6640; cursor:pointer; }
#mpAddOptions .mps-in{
  flex:1; font-size:.9rem; font-weight:600;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important;
}
#mpAddOptions .mps-tag{
  font-size:.7rem; font-weight:800; border-radius:999px; padding:3px 9px; background:#EEF4EC;
  color:#41533C !important; -webkit-text-fill-color:#41533C !important;
}
#mpAddOptions .mps-all{ display:flex; gap:8px; margin-bottom:14px; }
#mpAddOptions .mps-mini{
  cursor:pointer; font:inherit; font-size:.76rem; font-weight:800; border-radius:999px;
  padding:8px 13px; min-height:40px;
  background:#F4F6F1 !important; border:1px solid #DCE5D6 !important;
  color:#41533C !important; -webkit-text-fill-color:#41533C !important;
}
#mpAddOptions .mps-foot{ display:flex; gap:10px; flex-wrap:wrap; }
#mpAddOptions .mps-btn{
  flex:1; min-width:170px; cursor:pointer; font:inherit; font-size:.86rem; font-weight:800;
  border-radius:999px; padding:12px 18px; min-height:48px;
  background:#fff !important; border:1px solid #DDD7C9 !important;
  color:#3D4A3A !important; -webkit-text-fill-color:#3D4A3A !important;
}
#mpAddOptions .mps-btn.is-primary{
  background:#4E6640 !important; border-color:#4E6640 !important;
  color:#fff !important; -webkit-text-fill-color:#fff !important;
}
#mpAddOptions .mps-btn.is-primary:hover{ background:#445A38 !important; }
#mpAddOptions .mps-back:focus-visible, #mpAddOptions .mps-mini:focus-visible,
#mpAddOptions .mps-btn:focus-visible, #mpAddOptions .mps-i input:focus-visible{
  outline:3px solid #CF9E3F; outline-offset:2px;
}
#mpAddOptions .mps-hint, #mpAddOptions .mps-note{
  margin:12px 0 0; font-size:.78rem; line-height:1.5;
  color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important;
}
.mps-toast{
  position:fixed; left:50%; bottom:26px; transform:translateX(-50%) translateY(12px); z-index:10001;
  background:#243447; color:#fff !important; -webkit-text-fill-color:#fff !important;
  padding:12px 20px; border-radius:999px; font-size:.85rem; font-weight:700;
  font-family:'Nunito',system-ui,sans-serif; opacity:0; pointer-events:none;
  transition:opacity .2s, transform .2s;
}
.mps-toast.on{ opacity:1; transform:translateX(-50%) translateY(0); }
@media (max-width:520px){
  #mpAddOptions .mps-btn{ min-width:0; width:100%; flex:none; }
}

