.nutrition-products { min-width: 0; }
.nutrition-products-workspace { display: grid; grid-template-columns: minmax(17rem, 23rem) minmax(0, 1fr); min-height: calc(100vh - 8rem); margin: calc(var(--space-6) * -1); background: var(--color-bg); }
.nutrition-product-list { border-right: 1px solid var(--color-border); background: var(--color-bg-elevated); }
.nutrition-product-list > header, .nutrition-product-inspector > header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-5); border-bottom: 1px solid var(--color-border); }
.nutrition-product-list h1, .nutrition-product-inspector h2 { margin: .15rem 0 0; font-size: var(--font-size-lg); }
.nutrition-product-list header span, .nutrition-product-inspector header span { color: var(--color-text-subtle); font-size: .68rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.nutrition-product-list > .field { width: calc(100% - 2 * var(--space-4)); margin: var(--space-4); }
.nutrition-product-filters { display: flex; align-items: center; gap: var(--space-3); padding: 0 var(--space-4) var(--space-4); font-size: var(--font-size-xs); }
.nutrition-product-filters .field { flex: 1; }
.nutrition-product-items { overflow: auto; max-height: calc(100vh - 18rem); border-top: 1px solid var(--color-border); }
.nutrition-product-items > button { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-4); border: 0; border-bottom: 1px solid var(--color-border); background: transparent; color: inherit; text-align: left; }
.nutrition-product-items > button:hover, .nutrition-product-items > button.is-active { background: var(--color-surface-hover); }
.nutrition-product-items span { display: grid; gap: .2rem; min-width: 0; }
.nutrition-product-items strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nutrition-product-items small, .nutrition-product-items i { color: var(--color-text-subtle); font-size: .68rem; font-style: normal; }
.nutrition-product-inspector { min-width: 0; }
.nutrition-product-inspector > header { position: sticky; z-index: 2; top: 0; background: color-mix(in srgb, var(--color-bg) 92%, transparent); backdrop-filter: blur(12px); }
.nutrition-product-inspector > header > div:last-child { display: flex; gap: var(--space-2); }
.nutrition-product-inspector > section { margin: var(--space-5); padding: var(--space-5); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-bg-elevated); }
.nutrition-product-inspector h3 { margin: 0 0 var(--space-4); font-size: var(--font-size-sm); }
.nutrition-product-inspector h3 small { color: var(--color-text-subtle); font-weight: 500; }
.nutrition-form-grid, .nutrition-macro-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.nutrition-macro-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.nutrition-product-inspector > footer { display: flex; align-items: center; gap: var(--space-3); padding: 0 var(--space-5) var(--space-6); }
.nutrition-product-inspector > footer span { margin-left: auto; color: var(--color-text-subtle); font-size: var(--font-size-xs); }
.nutrition-serving, .nutrition-banner { margin: var(--space-4) 0 0; padding: var(--space-3); border-radius: var(--radius-md); background: var(--color-surface); color: var(--color-text-muted); font-size: var(--font-size-xs); }
.nutrition-banner { margin: var(--space-4) var(--space-5) 0; border: 1px solid color-mix(in srgb, var(--color-warning) 40%, var(--color-border)); }
.nutrition-banner.is-error, .nutrition-field-error { color: var(--color-danger); }
.nutrition-empty, .nutrition-loading, .nutrition-no-selection { display: grid; place-content: center; gap: var(--space-3); min-height: 20rem; padding: var(--space-6); color: var(--color-text-muted); text-align: center; }
@media (max-width: 60rem) { .nutrition-products-workspace { grid-template-columns: 15rem minmax(0, 1fr); } .nutrition-macro-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 44rem) { .nutrition-products-workspace { display: block; margin: calc(var(--space-4) * -1); } .nutrition-product-list { border-right: 0; } .nutrition-product-items { max-height: 18rem; } .nutrition-form-grid { grid-template-columns: 1fr; } .nutrition-product-inspector > header { position: static; align-items: flex-start; flex-direction: column; } }
.nutrition-recipes-workspace { display:grid; grid-template-columns:minmax(14rem,19rem) minmax(25rem,1fr) minmax(19rem,23rem); min-height:calc(100vh - 8rem); margin:calc(var(--space-6) * -1); background:var(--color-bg); }
.nutrition-recipe-list,.nutrition-recipe-composition { border-right:1px solid var(--color-border); }
.nutrition-recipe-list,.nutrition-recipe-inspector { background:var(--color-bg-elevated); }
.nutrition-recipe-list header,.nutrition-recipe-composition>header,.nutrition-recipe-inspector>header { display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); padding:var(--space-4); border-bottom:1px solid var(--color-border); }
.nutrition-recipe-list h1,.nutrition-recipe-composition h2,.nutrition-recipe-inspector h2 { margin:.15rem 0 0; font-size:var(--font-size-lg); }
.nutrition-recipe-list header span,.nutrition-recipe-composition header span,.nutrition-recipe-inspector header span { color:var(--color-text-subtle); font-size:.68rem; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }
.nutrition-recipe-list>.field { width:calc(100% - 2 * var(--space-4)); margin:var(--space-4); }
.nutrition-check { display:block; padding:0 var(--space-4) var(--space-3); font-size:var(--font-size-xs); }
.nutrition-recipe-items { max-height:calc(100vh - 17rem); overflow:auto; border-top:1px solid var(--color-border); }
.nutrition-recipe-items>button,.nutrition-ingredient-picker>div>button { display:grid; width:100%; gap:.2rem; padding:var(--space-3) var(--space-4); border:0; border-bottom:1px solid var(--color-border); background:transparent; color:inherit; text-align:left; }
.nutrition-recipe-items>button:hover,.nutrition-recipe-items>button.is-active,.nutrition-ingredient-picker>div>button:hover { background:var(--color-surface-hover); }
.nutrition-recipe-items small,.nutrition-recipe-items i,.nutrition-ingredient-picker small { color:var(--color-text-subtle); font-size:.68rem; font-style:normal; }
.nutrition-recipe-composition { min-width:0; overflow:auto; }
.nutrition-recipe-composition>section,.nutrition-recipe-inspector>section,.nutrition-ingredient-picker { margin:var(--space-4); padding:var(--space-4); border:1px solid var(--color-border); border-radius:var(--radius-lg); background:var(--color-bg-elevated); }
.nutrition-component-list,.nutrition-step-list { display:grid; gap:var(--space-2); }
.nutrition-component-list article { display:grid; grid-template-columns:minmax(9rem,1fr) 5.5rem 7rem auto; align-items:center; gap:var(--space-2); padding:var(--space-3); border:1px solid var(--color-border); border-radius:var(--radius-md); }
.nutrition-component-list article>div:first-child { display:grid; min-width:0; }
.nutrition-component-list small { color:var(--color-text-subtle); }
.nutrition-step-list article { display:grid; grid-template-columns:2rem minmax(8rem,.5fr) minmax(12rem,1fr) auto; align-items:start; gap:var(--space-2); }
.nutrition-step-list textarea { min-height:4.5rem; resize:vertical; }
.nutrition-row-actions { display:flex; gap:.2rem; }
.nutrition-row-actions button { width:1.8rem; height:1.8rem; border:1px solid var(--color-border); border-radius:var(--radius-sm); background:transparent; color:inherit; }
.nutrition-section-title { display:flex; align-items:center; justify-content:space-between; }
.nutrition-recipe-inspector { min-width:0; overflow:auto; }
.nutrition-recipe-inspector>header { align-items:flex-start; }
.nutrition-recipe-inspector>header>div:last-child { display:flex; gap:var(--space-2); }
.nutrition-recipe-inspector section { display:grid; gap:var(--space-3); }
.nutrition-recipe-inspector h3,.nutrition-recipe-composition h3 { margin:0 0 var(--space-3); font-size:var(--font-size-sm); }
.nutrition-recipe-summary { display:grid; grid-template-columns:1fr; gap:var(--space-2); }
.nutrition-recipe-summary article { display:grid; gap:.1rem; padding:var(--space-3); border-radius:var(--radius-md); background:var(--color-surface); }
.nutrition-recipe-summary span,.nutrition-recipe-summary small { color:var(--color-text-subtle); font-size:.68rem; }
.nutrition-ingredient-picker>.field { width:100%; margin-bottom:var(--space-3); }
.nutrition-ingredient-picker>div { max-height:17rem; overflow:auto; border:1px solid var(--color-border); border-radius:var(--radius-md); }
.nutrition-ingredient-picker>div>button { grid-template-columns:1fr auto; }
.nutrition-ingredient-picker>div>button span { display:grid; }
.nutrition-recipe-inspector>footer { display:flex; align-items:center; gap:var(--space-2); padding:0 var(--space-4) var(--space-5); }
.nutrition-recipe-inspector>footer span { margin-left:auto; color:var(--color-text-subtle); font-size:var(--font-size-xs); }
@media(max-width:72rem){.nutrition-recipes-workspace{grid-template-columns:15rem minmax(23rem,1fr) 19rem}.nutrition-component-list article{grid-template-columns:1fr 5rem 6rem}.nutrition-component-list .nutrition-row-actions{grid-column:1/-1}.nutrition-step-list article{grid-template-columns:2rem 1fr}.nutrition-step-list textarea{grid-column:2}.nutrition-step-list .nutrition-row-actions{grid-column:2}}
@media(max-width:54rem){.nutrition-recipes-workspace{display:block;margin:calc(var(--space-4) * -1)}.nutrition-recipe-items{max-height:17rem}.nutrition-recipe-list,.nutrition-recipe-composition{border-right:0;border-bottom:1px solid var(--color-border)}.nutrition-recipe-inspector>header{position:static}}
.nutrition-plans-workspace{display:grid;grid-template-columns:minmax(14rem,19rem) minmax(28rem,1fr) minmax(19rem,23rem);min-height:calc(100vh - 8rem);margin:calc(var(--space-6) * -1);background:var(--color-bg)}
.nutrition-plan-list,.nutrition-plan-builder{border-right:1px solid var(--color-border)}.nutrition-plan-list,.nutrition-plan-inspector{background:var(--color-bg-elevated)}
.nutrition-plan-list header,.nutrition-plan-builder>header,.nutrition-plan-inspector>header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-4);border-bottom:1px solid var(--color-border)}
.nutrition-plan-list h1,.nutrition-plan-builder h2,.nutrition-plan-inspector h2{margin:.15rem 0 0;font-size:var(--font-size-lg)}.nutrition-plan-list header span,.nutrition-plan-builder header span,.nutrition-plan-inspector header span{color:var(--color-text-subtle);font-size:.68rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase}
.nutrition-plan-list>.field{width:calc(100% - 2 * var(--space-4));margin:var(--space-4)}.nutrition-plan-list>div{max-height:calc(100vh - 15rem);overflow:auto;border-top:1px solid var(--color-border)}
.nutrition-plan-list>div>button,.nutrition-plan-picker>div>button{display:grid;width:100%;gap:.2rem;padding:var(--space-3) var(--space-4);border:0;border-bottom:1px solid var(--color-border);background:transparent;color:inherit;text-align:left}.nutrition-plan-list>div>button:hover,.nutrition-plan-list>div>button.is-active,.nutrition-plan-picker>div>button:hover{background:var(--color-surface-hover)}.nutrition-plan-list small,.nutrition-plan-list i{color:var(--color-text-subtle);font-size:.68rem;font-style:normal}
.nutrition-plan-builder{min-width:0;overflow:auto}.nutrition-day-tabs,.nutrition-meal-tabs{display:flex;gap:var(--space-2);padding:var(--space-3) var(--space-4);overflow:auto;border-bottom:1px solid var(--color-border)}.nutrition-day-tabs button,.nutrition-meal-tabs button{display:grid;flex:0 0 auto;gap:.12rem;padding:.55rem .8rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:transparent;color:inherit}.nutrition-day-tabs button small,.nutrition-meal-tabs button small{color:var(--color-text-subtle);font-size:.62rem}.nutrition-day-tabs button.is-active,.nutrition-meal-tabs button.is-active{border-color:var(--color-accent);color:var(--color-accent)}
.nutrition-plan-day-actions{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);flex-wrap:wrap}.nutrition-plan-day-actions>span{margin-left:auto;color:var(--color-text-subtle);font-size:var(--font-size-xs)}.nutrition-plan-builder>section,.nutrition-plan-inspector>section,.nutrition-plan-picker{margin:var(--space-4);padding:var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-bg-elevated)}
.nutrition-plan-meal-actions{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-3);flex-wrap:wrap}.nutrition-plan-meal-actions>span{margin-right:auto;color:var(--color-text-subtle);font-size:var(--font-size-xs)}
.nutrition-plan-items{display:grid;gap:var(--space-2);margin-top:var(--space-3)}.nutrition-plan-items article{display:grid;grid-template-columns:minmax(10rem,1fr) 5.5rem 7rem auto;align-items:center;gap:var(--space-2);padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-md)}.nutrition-plan-items article>div:first-child{display:grid}.nutrition-plan-items article span{color:var(--color-text-subtle);font-size:.68rem}
.nutrition-plan-items article[draggable="true"],.nutrition-day-tabs button[draggable="true"]{cursor:grab}.nutrition-plan-items article[draggable="true"]:active,.nutrition-day-tabs button[draggable="true"]:active{cursor:grabbing}
.nutrition-plan-inspector{min-width:0;overflow:auto}.nutrition-plan-inspector>header{align-items:flex-start}.nutrition-plan-inspector>header>div:last-child{display:flex;gap:var(--space-2)}.nutrition-plan-inspector section{display:grid;gap:var(--space-3)}.nutrition-plan-inspector textarea{min-height:5rem;resize:vertical}.nutrition-plan-total{display:grid;gap:.2rem;padding:var(--space-3);border-radius:var(--radius-md);background:var(--color-surface)}
.nutrition-plan-picker>.field{width:100%;margin-bottom:var(--space-2)}.nutrition-plan-picker>div{max-height:17rem;overflow:auto;border:1px solid var(--color-border);border-radius:var(--radius-md)}.nutrition-plan-picker>div>button{grid-template-columns:1fr auto}.nutrition-plan-picker>div>button span{display:grid}.nutrition-plan-picker small{color:var(--color-text-subtle)}
.nutrition-plan-inspector>footer{display:flex;align-items:center;gap:var(--space-2);padding:0 var(--space-4) var(--space-5)}.nutrition-plan-inspector>footer span{margin-left:auto;color:var(--color-text-subtle);font-size:var(--font-size-xs)}
@media(max-width:72rem){.nutrition-plans-workspace{grid-template-columns:15rem minmax(24rem,1fr) 19rem}.nutrition-plan-items article{grid-template-columns:1fr 5rem 6rem}.nutrition-plan-items article>button{grid-column:3}}
@media(max-width:54rem){.nutrition-plans-workspace{display:block;margin:calc(var(--space-4) * -1)}.nutrition-plan-list>div{max-height:17rem}.nutrition-plan-list,.nutrition-plan-builder{border-right:0;border-bottom:1px solid var(--color-border)}}
