/* FeedMeFood — Whole-Body Plan styles (v3.0.4) */
#fmf-bmi-plan{ --bg:#f7f5f1; --card:#fff; --ink:#1f2937; --muted:#6b7280;
  --accent:#08bb79; --accent-ink:#fff; --ring:rgba(8,187,121,.35);
  color:var(--ink); font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Inter, Arial, sans-serif;
}
#fmf-bmi-plan .fmf-card{background:var(--card); border-radius:18px; box-shadow:0 8px 24px rgba(0,0,0,.06); padding:16px; margin:16px 0;}
#fmf-bmi-plan .muted{color:var(--muted)}
#fmf-bmi-plan .row{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px}
#fmf-bmi-plan .row-compact{grid-template-columns:repeat(3,minmax(0, 1fr)); gap:10px}
#fmf-bmi-plan label{display:block; font-size:14px; margin:8px 0}
#fmf-bmi-plan input, #fmf-bmi-plan select, #fmf-bmi-plan button{font:inherit}
#fmf-bmi-plan input, #fmf-bmi-plan select{width:100%; padding:10px 12px; border:1px solid #d1d5db; border-radius:10px; outline:0; background:#fff}
#fmf-bmi-plan input:focus, #fmf-bmi-plan select:focus{box-shadow:0 0 0 3px var(--ring); border-color:transparent;}
#fmf-bmi-plan .actions{display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-top:8px; position:relative; z-index:1}
#fmf-bmi-plan button.primary{background:var(--accent); color:var(--accent-ink); border:0; padding:10px 14px; border-radius:12px; cursor:pointer}
#fmf-bmi-plan button.secondary{background:#eef2ff; color:#1e293b; border:0; padding:10px 14px; border-radius:12px; cursor:pointer}
#fmf-bmi-plan button.link{background:transparent; border:0; color:#0ea5e9; cursor:pointer; text-decoration:underline}
#fmf-bmi-plan .hr{height:1px; background:#e5e7eb; margin:16px 0}
#fmf-bmi-plan .badge{display:inline-block; padding:2px 8px; border-radius:999px; font-size:12px; margin-left:8px; background:#e5e7eb}
#fmf-bmi-plan .badge.normal{background:#dcfce7} .badge.over{background:#fde68a}
#fmf-bmi-plan .badge.ob1{background:#fca5a5} .badge.ob2{background:#f87171} .badge.ob3{background:#ef4444}
#fmf-bmi-plan .kpi{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:8px}
#fmf-bmi-plan .kpi .item{background:#fafafa; border-radius:12px; padding:12px}
#fmf-bmi-plan .mono{font-variant-numeric: tabular-nums; font-feature-settings:'tnum' 1}

/* Units pills */
#fmf-bmi-plan .fmf-units{display:flex; gap:8px; margin:8px 0 12px}
#fmf-bmi-plan .fmf-units .btn{border:1px solid #cbd5e1; padding:.5rem .75rem; border-radius:.5rem; background:#fff; cursor:pointer}
#fmf-bmi-plan .fmf-units .btn.is-selected{outline:2px solid var(--accent); outline-offset:2px}

/* Switch (prevents overlay on buttons) */
#fmf-bmi-plan .switch{display:flex; align-items:center; gap:8px; margin:8px 0 12px; position:relative; z-index:0}
#fmf-bmi-plan .switch input{width:1.1em; height:1.1em;}

/* Pillars & limits layout */
#fmf-bmi-plan fieldset{border:1px solid #e5e7eb; border-radius:12px; padding:10px 12px; margin:12px 0; background:#fff}
#fmf-bmi-plan fieldset legend{font-weight:600; font-size:14px; padding:0 6px}
#fmf-bmi-plan fieldset label{margin:6px 0; display:flex; gap:8px; align-items:center}

/* Fuel cards */
#fmf-bmi-plan .fuel-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
#fmf-bmi-plan .fuel-card{display:flex; gap:10px; background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:8px}
#fmf-bmi-plan .fuel-thumb img{width:88px; height:88px; object-fit:cover; border-radius:8px}
#fmf-bmi-plan .fuel-pill{display:inline-block; font-size:12px; padding:2px 8px; border-radius:999px; background:#eef2ff; margin-right:6px}
#fmf-bmi-plan .fuel-pill.fuel-mode-loss{background:#dcfce7}
#fmf-bmi-plan .fuel-pill.fuel-mode-gain{background:#fde68a}

/* a11y helpers */
#fmf-bmi-plan .visually-hidden{position:absolute!important; width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}

/* Responsive */
@media (max-width: 800px){
  #fmf-bmi-plan .row{grid-template-columns:1fr}
  #fmf-bmi-plan .kpi, #fmf-bmi-plan .fuel-grid{grid-template-columns:1fr}
}