#menus #menuEditorSummary {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
#menus .pricing-estimates,#menus .pricing-estimate-form {border:1px solid var(--border,#d8ddd8);border-radius:10px;padding:12px;margin:12px 0;}
#menus .pricing-estimates summary,#menus .menu-pricing-row-review summary {cursor:pointer;font-weight:600;}
#menus .pricing-estimate-form .form-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
#menus .menu-pricing-row-review {font-size:12px;min-width:180px;}
#menus .menu-pricing-row-review input[type=checkbox],#menus #menuPricingCompositionReviewed,#menus .pricing-estimates input[type=checkbox] {width:16px;height:16px;min-height:0;padding:0;margin:0 6px 0 0;}
#menus #menuPricingWhatIf {max-width:180px;}
#menus #menuPriceInput {background:var(--surface-muted,#f1f4f1);}
#menus .menu-card {min-height:90px;}
@media(max-width:1000px){#menus .pricing-estimate-form .form-grid{grid-template-columns:1fr;}#menus #menuEditorSummary{grid-template-columns:1fr;}#menus .table-wrap{overflow-x:auto;}#menus .menu-form-grid{min-width:0;}}

.pricing-quantity-estimate { margin-top: .4rem; font-size: .85rem; }
.pricing-quantity-estimate label { display:block; margin-top:.35rem; }
.pricing-quantity-estimate small, .prep-source-results { display:block; margin-top:.35rem; }

/* Keep the same ingredient fields together without sideways scrolling on phones. */
@media(max-width:1000px) {
  #menus .table-wrap:has(#menuIngredientRows), #recipeEditorPanel .table-wrap:has(#recipeIngredientRows) {overflow:visible;}
  #menus table:has(#menuIngredientRows), #recipeEditorPanel table:has(#recipeIngredientRows) {display:block;width:100%;min-width:0;}
  table:has(#menuIngredientRows) thead, table:has(#recipeIngredientRows) thead {display:none;}
  #menuIngredientRows, #recipeIngredientRows {display:block;width:100%;}
  #menuIngredientRows tr, #recipeIngredientRows tr {display:grid;grid-template-columns:minmax(0,1fr);gap:.65rem;padding:.75rem;margin-bottom:.75rem;border:1px solid var(--border,#cfd8cf);border-radius:8px;}
  #menuIngredientRows td, #recipeIngredientRows td {display:block;min-width:0;width:100%;padding:0;border:0;}
  #menuIngredientRows td::before, #recipeIngredientRows td::before {content:attr(data-label);display:block;font-size:.8rem;font-weight:600;margin-bottom:.25rem;}
  #menuIngredientRows input:not([type=checkbox]), #menuIngredientRows select, #recipeIngredientRows input:not([type=checkbox]), #recipeIngredientRows select {width:100%;max-width:100%;min-width:0;min-height:44px;}
  #menus .menu-pricing-row-review {min-width:0;}
  #menus button, #recipeEditorPanel button {min-height:44px !important;}
  #menus table:has(#menuIngredientRows) tfoot, #menus table:has(#menuIngredientRows) tfoot tr, #menus table:has(#menuIngredientRows) tfoot td {display:block;width:100%;}
  .prep-linked-source, .prep-source-results, .pricing-quantity-state {overflow-wrap:anywhere;}
}

#menus input, #menus select, #menus button, #menus summary, #recipeEditorPanel input, #recipeEditorPanel select {scroll-margin-bottom:calc(var(--invoice-review-dock-height,160px) + 80px);}

#menus .prep-linked-source {border-left:3px solid var(--accent,#326351);padding:.35rem .5rem;background:var(--surface-muted,#f1f4f1);}
#menus .ingredient-cost-connection {font-weight:600;}
#menus #menuEditorSummary .costing-summary-card:nth-child(2) {border-left:3px solid var(--accent,#326351);}
#menus .pricing-quantity-state:not(:empty) {border-left:3px solid var(--accent,#326351);padding:.35rem .5rem;}

/* Equivalent controls share a baseline; field widths follow their purpose. */
#menus .menu-card {min-height:90px !important;align-items:center;padding:10px;}
#menus .menu-card-body, #menus .menu-card-body strong, #menus .menu-card-body small {min-width:0;overflow-wrap:anywhere;}
#menus input:not([type=checkbox]):not([type=file]), #menus select, #recipeIngredientRows input:not([type=checkbox]), #recipeIngredientRows select {box-sizing:border-box;height:40px;min-height:40px;}
#menus .menu-ingredient-add-actions button, #menus [data-view-priced-component], #menuIngredientRows .icon-button {height:40px;min-height:40px;padding:8px 12px;}
#menuIngredientRows .icon-button {width:40px;padding:0;}
#menus table:has(#menuIngredientRows) {table-layout:fixed;width:100%;min-width:0;}
body #menus #menuIngredientRows td, body #recipeEditorPanel #recipeIngredientRows td {vertical-align:top !important;}
#menuIngredientRows input:not([type=checkbox]), #menuIngredientRows select {width:100%;min-width:0;}
#menuIngredientRows .recipe-source-cell {min-width:0;gap:8px;}
#menus table:has(#menuIngredientRows) th:nth-child(1) {width:20%;}
#menus table:has(#menuIngredientRows) th:nth-child(2) {width:9%;}
#menus table:has(#menuIngredientRows) th:nth-child(3) {width:11%;}
#menus table:has(#menuIngredientRows) th:nth-child(4) {width:10%;}
#menus table:has(#menuIngredientRows) th:nth-child(5) {width:28%;}
#menus table:has(#menuIngredientRows) th:nth-child(6) {width:16%;}
#menus table:has(#menuIngredientRows) th:nth-child(7) {width:52px;}
#menus .form-grid:has(#menuPricingCompositionNote) {grid-template-columns:minmax(0,2fr) minmax(0,1fr);align-items:end;gap:10px;}
#menus .form-grid:has(#menuPricingCompositionNote) label:has(input[type=checkbox]) {display:flex;align-items:center;gap:8px;min-height:40px;}
#menus #menuEditorSummary .costing-summary-card {padding:12px;min-width:0;}
#menus .case-price-grid {grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;}
#menus .case-price-grid [data-field=caseUnit] {grid-column:1/-1;}
.pricing-quantity-fields {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;align-items:end;}
.pricing-quantity-fields label:nth-of-type(3), .pricing-quantity-fields small {grid-column:1/-1;}
.pricing-quantity-estimate label {min-width:0;}
.pricing-quantity-estimate[hidden], .prep-source-results[hidden], .prep-linked-source[hidden] {display:none !important;}
@media(max-width:1000px) {
  #menuIngredientRows tr, #recipeIngredientRows tr {grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;}
  #menuIngredientRows td, #recipeIngredientRows td {grid-column:1/-1;}
  #menuIngredientRows td[data-label="Confirmed quantity"], #recipeIngredientRows td[data-label="Confirmed quantity"] {grid-column:1;}
  #menuIngredientRows td[data-label="Confirmed unit"], #recipeIngredientRows td[data-label="Confirmed unit"] {grid-column:2;}
  #menus input:not([type=checkbox]):not([type=file]), #menus select, #recipeIngredientRows input:not([type=checkbox]), #recipeIngredientRows select {height:44px;min-height:44px;}
  #menuIngredientRows .icon-button {width:44px;height:44px;min-height:44px;}
  #menus .form-grid:has(#menuPricingCompositionNote) {grid-template-columns:1fr;}
}

#menus .panel-header button, #menus #addCustomMenuStation {height:40px;min-height:40px;}
#menus .panel-header details > summary {min-height:40px;display:flex;align-items:center;}
#menus .recipe-category > summary {min-height:44px;align-items:center;gap:10px;}
#menus .recipe-category > summary > span {min-width:0;overflow-wrap:anywhere;}
#recipeEditorPanel input:not([type=checkbox]):not([type=file]), #recipeEditorPanel select {height:40px;min-height:40px;box-sizing:border-box;}
body:has(#menus.is-visible) #floatingPageActions button {height:40px;min-height:40px;}
@media(max-width:1000px) {
  #menus .panel-header button, #menus #addCustomMenuStation, #recipeEditorPanel input:not([type=checkbox]):not([type=file]), #recipeEditorPanel select, body:has(#menus.is-visible) #floatingPageActions button {height:44px;min-height:44px;}
  #menus .panel-header details > summary {min-height:44px;}
}


#menus .menu-price-serving-row {display:grid;grid-template-columns:180px minmax(0,1fr);gap:10px;align-items:end;min-width:0;}
@media(max-width:700px) {#menus .menu-price-serving-row {grid-template-columns:130px minmax(0,1fr);}}

.prep-recipe-results {display:block;margin-top:.35rem;overflow-wrap:anywhere;}
.prep-recipe-results[hidden], .prep-recipe-search[hidden] {display:none !important;}
