/* v27 Meal Plan fixes (owner 18 Oct 2026: "please fix everything on the meal plan"). See MEAL-PLAN-PREMORTEM.md items 1-10. */
/* 1. body boxes open a short list */
.mpx .cl-field.tap .cl-val::after{content:"";display:inline-block;width:6px;height:6px;border-right:1.5px solid var(--mu);border-bottom:1.5px solid var(--mu);transform:rotate(45deg);margin:0 0 3px 8px}
.mpx .cl-menu{position:fixed;z-index:1000;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.12);padding:4px;min-width:200px;display:grid}
.mpx .cl-menu[hidden]{display:none}
.mpx .cl-opt{display:flex;align-items:center;gap:8px;text-align:left;border:0;background:none;border-radius:8px;padding:8px 12px;font-size:14px;color:var(--tx);cursor:pointer}
.mpx .cl-opt:hover,.mpx .cl-opt:focus-visible{background:var(--pks);outline:none}
.mpx .cl-opt.on{color:var(--pkd)}
.mpx .cl-tick{width:14px;color:var(--pk)}
/* 8. "Saved on this device" is a note, not a button */
.mpx .cl-saved-txt{font-size:12px;color:var(--mu);white-space:nowrap}
/* 5. targets bar wraps instead of running off the edge */
.mpx .calc-line-2{flex-wrap:wrap;height:auto;overflow:visible;row-gap:0}
.mpx .calc-line-2 .nc2{height:36px}
.mpx .cl2-nutrients{flex-wrap:wrap;flex-shrink:1}
/* 3. phone: the calculator folds into one line */
.mpx .calc-sum{display:none}
@media (max-width:640px){
  .mpx .calc-sum{display:flex;width:100%;align-items:center;justify-content:space-between;gap:8px;border:0;border-bottom:1px solid var(--line);background:#fff;padding:12px 16px;font-size:14px;color:var(--tx);cursor:pointer;text-align:left}
  .mpx .calc-sum-e{color:var(--pkd);text-decoration:underline;flex-shrink:0}
  .mpx .calc-wrap:not(.open) .calc-body{display:none}
}
/* 2 + 10. one filter panel: the left column on a laptop, one "Filters" sheet on a phone */
.mpx .sb-fhead{display:flex;align-items:center;gap:12px;padding:12px 12px 4px}
.mpx .sb-ftitle{font-size:14px;color:var(--tx);flex:1}
.mpx .sb-fclose{display:none;border:0;background:none;font-size:18px;cursor:pointer;color:var(--tx)}
.mpx .sb-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mpx .sb-two .pf-cks,.mpx .pf-cks{display:grid;gap:6px}
.mpx .pf-cks.two{grid-template-columns:1fr 1fr}
.mpx .sb-filters .pf-drops{grid-template-columns:1fr 1fr;margin:0}
.mpx .sb-filters .pf-note{display:none}
.mpx .sb-go{position:sticky;bottom:0;background:#fff;border-top:1px solid var(--line);padding:12px;display:flex;gap:8px;justify-content:space-between;z-index:2}
.mpx .sb-go .pf-btn-cal{border-color:var(--line);color:var(--tx)}
.mpx .sb-go .pf-btn-cal:hover{background:var(--pks);color:var(--pkd);border-color:var(--pkb)}
.mpx .sb-go .pf-btn-gen{flex:1}
.mpx .mp-steps{display:flex;align-items:center;gap:12px;margin:0 0 12px;flex-wrap:wrap}
.mpx .mp-steps .pf-hint{font-size:12px;color:var(--mu);flex:1}
.mpx .mp-steps .rc-count{font-size:12px;color:var(--mu)}
.mpx .mp-fbtn{display:none;padding:4px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:14px;color:var(--tx);cursor:pointer}
.mpx .mp-rg-heading{margin:0 0 12px}
@media (max-width:899px){
  .mpx .mp-fbtn{display:inline-flex}
  .mpx .mp-sidebar .sb-filters{display:none}
  .mpx .mp-sidebar.open .sb-filters{display:block;position:fixed;inset:0;z-index:999;background:#fff;overflow-y:auto;padding-bottom:0}
  .mpx .mp-sidebar.open .sb-filters .sb-section{display:block!important;padding:12px 16px;border-bottom:1px solid var(--line)}
  .mpx .mp-sidebar.open .sb-filters .sb-two{display:grid!important}
  .mpx .mp-sidebar.open .sb-deep,.mpx .mp-sidebar.open .sb-family-tab{display:none!important}
  .mpx .sb-fhead{padding:16px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:2}
  .mpx .sb-fclose{display:block}
  .mpx .sb-go{padding:12px 16px}
  body.mp-noscroll{overflow:hidden}
}
/* chips: one "on" style everywhere (her pink), no black chips */
.mpx .qf,.mpx .sbc{font-size:12px}
.mpx .qf.on,.mpx .sbc.on{background:var(--pks);border-color:var(--pk);color:var(--pkd)}
/* quiz bar sits under the first row of recipes */
.mpx .hq-bar.in-grid,.mpx .hq-panel.in-grid{grid-column:1/-1;margin:0}
/* 4. note after "+ Plan" */
.mpx .mp-added{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:998;background:#fff;border:1px solid var(--pkb);border-radius:999px;box-shadow:0 6px 20px rgba(0,0,0,.12);padding:8px 16px;display:flex;align-items:center;gap:12px;font-size:14px;max-width:calc(100vw - 32px)}
.mpx .mp-added[hidden]{display:none}
.mpx .mp-added span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mpx .mp-added .mp-link{flex-shrink:0}
/* 6. each day adds up */
.mpx .mp-day-tot{margin:0;padding:6px 8px;font-size:12px;color:var(--mu);text-align:center;border-top:1px solid var(--line)}
@media (max-width:640px){.mpx .mp-added{bottom:96px;left:16px;right:16px;transform:none;max-width:none;border-radius:16px}}
