/* Task-focused product components. Existing data/event/state selectors remain intact. */
.ms-app { min-height:100vh; }
.ms-app :is(.page-title,.empty-state h2,.plan-header h2,.recipe-header h2) { font-family:var(--ms-font-display); font-weight:400; font-size:2.25rem; line-height:1.2; }
.ms-app :is(.day-label,.recipe-section-title) { font-family:var(--ms-font-body); font-weight:600; }
.ms-app :is(.child-card,.meal-card,.snack-card,.plan-header,.food-form-card,.fav-card,.export-card,.nutrient-card,.stat-card) { border:1px solid var(--ms-line); border-radius:12px; box-shadow:none; background:var(--ms-white); }
.ms-app :is(.child-card,.meal-card,.snack-card):hover { box-shadow:var(--ms-shadow-card); }
.ms-app :is(.child-card-header,.child-meta,.plan-stats,.meal-card-header,.recipe-top-actions) { flex-wrap:wrap; gap:12px; }
.ms-app :is(.child-card h3,.meal-card h4,.snack-card h4,.fav-card-name) { font-family:var(--ms-font-body); font-size:1.125rem; font-weight:600; line-height:1.4; overflow-wrap:anywhere; }
.ms-app :is(.tag,.meal-type-tag,.meal-time-chip,.day-total-time,.stat-badge,.child-meta,.meal-desc,.recipe-meta-chip) { font-size:.875rem; }
.ms-app :is(.tag-sage,.tag-peach,.meal-time-chip,.day-total-time,.recipe-meta-chip) { color:var(--ms-ink); background:var(--ms-sage); }
.ms-app .tag { text-transform:none; letter-spacing:0; border-radius:6px; }
.ms-app .back-link { min-height:44px; text-underline-offset:4px; }
.ms-app .form-group :is(input:not([type=checkbox]):not([type=radio]),select,textarea) { min-height:48px; font-size:1rem; color:var(--ms-ink); border:1px solid var(--ms-muted); border-radius:6px; background:var(--ms-cream); }
.ms-app .form-group label { font-size:.875rem; }
.ms-app .form-group :is(input,select,textarea):focus-visible { outline:3px solid var(--ms-focus); outline-offset:4px; }
.ms-app :is(.btn-primary,.btn-secondary,.btn-coral,.btn-food,.btn-grocery,.btn-batch,.btn-nutrition,.btn-generate-plan,.btn-view-plan,.btn-recipe-print) { min-height:44px; border-radius:7px; font-size:.875rem; font-weight:600; padding:12px 16px; }
.ms-app :is(.btn-primary,.btn-coral,.btn-generate-plan) { background:var(--ms-green); color:white; }
.ms-app :is(.btn-primary,.btn-coral,.btn-generate-plan):hover { background:var(--ms-green-hover); }
.ms-app :is(.btn-secondary,.btn-food,.btn-grocery,.btn-batch,.btn-nutrition,.btn-view-plan,.btn-recipe-print) { color:var(--ms-green); background:transparent; border:1px solid var(--ms-muted); }
.ms-app :is(.btn-secondary,.btn-food,.btn-grocery,.btn-batch,.btn-nutrition,.btn-view-plan,.btn-recipe-print):hover { color:var(--ms-ink); background:var(--ms-sage); }
.ms-app :is(.filter-chip,.sort-chip,.fav-filter-btn,.age-toggle-btn,.allergy-chip,.diet-chip,.btn-tiny) { min-height:44px; border-radius:7px; font-size:.875rem; border-color:var(--ms-muted); color:var(--ms-ink); }
.ms-app :is(.filter-chip,.sort-chip,.fav-filter-btn,.age-toggle-btn,.allergy-chip,.diet-chip):is(.active,.selected,[aria-pressed=true]) { background:var(--ms-sage); border-color:var(--ms-green); color:var(--ms-ink); }
.ms-app .texture-option { border-radius:10px; border-color:var(--ms-muted); padding:16px; }
.ms-app .texture-option.selected { color:var(--ms-ink); background:var(--ms-sage); border-color:var(--ms-green); }
.ms-app .texture-description { font-size:.875rem; color:var(--ms-ink); }
.ms-app .error-msg { color:var(--ms-color-error); background:var(--ms-color-error-surface); border:1px solid var(--ms-color-error); font-size:.875rem; }
.ms-app :is(.btn-heart,.swap-btn,.btn-icon) { min-width:44px; min-height:44px; }
.ms-app .feedback-btn { min-height:44px; font-size:.875rem; border-radius:7px; }
.ms-app .recipe-detail { max-width:760px; }
.ms-app .recipe-header { border-bottom:1px solid var(--ms-line); padding-bottom:24px; }
.ms-app .recipe-section { margin-top:28px; }
.ms-app .recipe-section-title { font-size:1.125rem; color:var(--ms-ink); margin-bottom:14px; }
.ms-app :is(.recipe-ingredients,.recipe-steps) { font-size:1rem; line-height:1.75; }
.ms-app :is(.recipe-texture-note,.recipe-portion-note) { background:var(--ms-sage); color:var(--ms-ink); border-color:var(--ms-line); border-radius:10px; font-size:1rem; }
.ms-app .texture-timeline-section { background:var(--ms-cream); border:1px solid var(--ms-line); border-radius:12px; }
.ms-app .texture-stage-label { font-size:.875rem; }
.ms-app .texture-stage-date { font-size:.875rem; }
.ms-app .texture-timeline-title { font-family:var(--ms-font-body); font-weight:600; }
.ms-app :is(.allergen-new-badge-btn,.allergen-warn-badge-btn) { min-height:44px; font-size:.875rem; border-radius:7px; }
.ms-app :is(.allergen-new-badge-btn,.allergen-warn-badge-btn):focus-visible { outline:3px solid var(--ms-focus); outline-offset:4px; }
@media(max-width:650px) {
 .ms-app .app-content { padding-inline:20px; }
 .ms-app :is(.page-title,.plan-header h2,.recipe-header h2) { font-size:2rem; }
 .ms-app :is(.plan-header,.child-card,.meal-card) { padding:20px; }
 .ms-app .texture-options { grid-template-columns:minmax(0,1fr); }
 .ms-app .texture-stages-row { overflow-x:auto; padding-bottom:8px; }
}
.ms-app .profile-form { border:1px solid var(--ms-line); border-radius:12px; box-shadow:none; }
.ms-app .profile-form h2 { font-family:var(--ms-font-display); font-size:2rem; font-weight:400; }
.ms-app :is(.ms-danger,#deleteChildBtn) { background:var(--ms-color-error); border-color:var(--ms-color-error); color:white; }
.ms-app :is(.ms-danger,#deleteChildBtn):hover { background:#7b302a; color:white; }
.ms-app .allergen-tracker-section { background:var(--ms-cream); border:1px solid var(--ms-line); border-radius:12px; }
.ms-app .allergen-tracker-sub { font-size:.875rem; color:var(--ms-ink); }
.ms-app .allergen-tracker-select { font:inherit; font-size:.875rem; min-height:44px; border:1px solid var(--ms-muted); border-radius:6px; color:var(--ms-ink); background:white; }
.ms-app .feedback-btn.loved { color:var(--ms-green); }
.ms-app .feedback-btn.ate_some { color:var(--ms-color-warning); }
.ms-app .feedback-btn.rejected { color:var(--ms-color-error); }
.ms-app .feedback-btn.loved.active { background:var(--ms-green); color:white; }
.ms-app .feedback-btn.ate_some.active { background:var(--ms-color-warning); color:white; }
.ms-app .feedback-btn.rejected.active { background:var(--ms-color-error); color:white; }
.ms-app .page-header h1 { font-family:var(--ms-font-display); font-weight:400; font-size:2.25rem; line-height:1.2; }
.ms-app #todayWidget { margin-bottom:24px; }

/* Shopping, preparation, recipe summaries and food records. */
.ms-app :is(.grocery-header,.batch-header,.nutrition-header,.batch-session,.nutrition-no-data,.food-intro-item) { background:var(--ms-white); border:1px solid var(--ms-line); border-radius:12px; box-shadow:none; }
.ms-app :is(.grocery-header h2,.batch-header h2,.nutrition-header h2,.food-form-card h2,.export-card h2,.product-tools-title) { font-family:var(--ms-font-display); font-size:2rem; font-weight:400; line-height:1.2; color:var(--ms-ink); }
.ms-app .product-tools-title { margin:0; }
.ms-app :is(.grocery-actions,.batch-session-header,.food-intro-header) { flex-wrap:wrap; gap:12px; }
.ms-app :is(.grocery-progress-text,.grocery-item-qty,.grocery-cat-count,.grocery-meal-tag,.batch-step-meta,.batch-step-time,.batch-feeds-label,.batch-feeds-tag,.batch-session-time,.batch-total-time,.nutrient-reason,.nutrient-meals-count,.nutrition-header p,.nutrition-tip,.food-intro-date,.food-intro-notes,.reaction-badge,.category-badge,.auto-badge,.fav-card-meta) { font-size:.875rem; line-height:1.5; }
.ms-app :is(.grocery-item,.export-text) { border:1px solid var(--ms-line); border-radius:10px; box-shadow:none; }
.ms-app .grocery-check-control { min-height:44px; min-width:0; }
.ms-app .grocery-checkbox { border-color:var(--ms-muted); }
.ms-app .grocery-check-control input:focus-visible + .grocery-checkbox { outline-color:var(--ms-focus); }
.ms-app :is(.grocery-expand-btn,.grocery-category-label,.fav-card-remove,.reaction-option,.filter-pill) { min-height:44px; }
.ms-app .fav-card-remove { min-width:44px; color:var(--ms-color-error); }
.ms-app :is(.grocery-item-name,.batch-step-content,.food-intro-name,.fav-card-meta) { min-width:0; overflow-wrap:anywhere; }
.ms-app :is(.batch-total-time,.batch-session-time,.batch-step-time,.batch-feeds-tag,.grocery-meal-tag,.ft-count-badge,.category-badge,.auto-badge) { color:var(--ms-ink); background:var(--ms-sage); border-color:var(--ms-line); border-radius:6px; }
.ms-app .batch-session-label { font:600 1.125rem/1.4 var(--ms-font-body); }
.ms-app .batch-step-action { font-size:1rem; }
.ms-app .batch-feeds-label { text-transform:none; letter-spacing:0; }
.ms-app .batch-step-num { background:var(--ms-peach); color:var(--ms-ink); font-size:.875rem; }
.ms-app .nutrition-tip { background:var(--ms-sage); color:var(--ms-ink); border-color:var(--ms-line); }
.ms-app .nutrition-summary-note { padding:16px 0; font-size:.875rem; color:var(--ms-muted); text-align:center; line-height:1.6; }
/* These percentages count recipe-note mentions, not nutritional adequacy. */
.ms-app .nutrient-pct { color:var(--ms-ink); }
.ms-app .nutrient-bar-fill { background:var(--ms-green); }
.ms-app :is(.filter-pill,.reaction-option,.btn-icon) { border:1px solid var(--ms-muted); border-radius:7px; color:var(--ms-ink); font-size:.875rem; }
.ms-app .filter-pill.active { background:var(--ms-green); color:white; border-color:var(--ms-green); }
.ms-app :is(.reaction-loved,.reaction-option.selected-loved) { background:var(--ms-sage); color:var(--ms-ink); border-color:var(--ms-green); }
.ms-app :is(.reaction-ate_some,.reaction-option.selected-ate_some) { background:var(--ms-butter); color:var(--ms-color-warning); border-color:var(--ms-color-warning); }
.ms-app :is(.reaction-rejected,.reaction-allergic_reaction,.reaction-option.selected-rejected,.reaction-option.selected-allergic_reaction,.allergen-warning) { background:var(--ms-color-error-surface); color:var(--ms-color-error); border-color:var(--ms-color-error); }
.ms-app .food-intro-item.allergen-flagged { border-color:var(--ms-color-error); }
.ms-app .allergen-warning { font-size:.875rem; line-height:1.6; }
.ms-app .btn-tiny.del { color:var(--ms-color-error); border-color:var(--ms-color-error); }
.ms-app .export-text { font-size:.875rem; line-height:1.7; background:var(--ms-cream); color:var(--ms-ink); overflow-wrap:anywhere; }
@media(max-width:650px) {
 .ms-app :is(.grocery-header,.batch-header,.nutrition-header,.batch-session,.food-form-card,.export-card) { padding:20px; }
 .ms-app .nutrient-row { flex-wrap:wrap; }
 .ms-app .nutrient-info { flex-basis:calc(100% - 48px); }
 .ms-app .nutrient-pct { text-align:left; }
 .ms-app .food-intro-actions { flex-wrap:wrap; }
}
@media(prefers-reduced-motion:reduce) {
 .ms-app :is(.nutrient-bar-fill,.grocery-progress-fill) { transition:none; }
}

.ms-app .toast { max-width:min(440px,calc(100vw - 40px)); overflow-wrap:anywhere; line-height:1.5; z-index:11000; pointer-events:none; }
@media(max-width:650px) { .ms-app .toast { right:20px; bottom:20px; padding:16px; } }

/* Small recipe copy on tinted surfaces needs the normal-text ink contrast. */
.ms-app .recipe-header { --text-light:var(--ms-ink); }
.ms-app .sub-reason { color:var(--ms-ink); }

/* Keep checkout confirmation and recovery aligned with account cards. */
.ms-app .checkout-confirmation { padding:24px; border:1px solid var(--ms-line); border-radius:12px; background:var(--ms-white,#fff); color:var(--ms-ink); line-height:1.7; max-width:680px; margin:0 auto; }
.ms-app .checkout-confirmation button { display:block; margin-top:16px; }
.ms-app .checkout-confirmation a { display:inline-block; color:var(--ms-green); text-decoration:underline; text-underline-offset:3px; padding:10px 0; }

.ms-app .grocery-header .portion-notes { color:var(--ms-ink); background:var(--ms-sage); font-size:.875rem; line-height:1.6; }

/* Keep compact planner and grocery controls comfortably tappable. */
.ms-app :is(.meal-name-link,.toggle-details,.grocery-expand-btn) { min-width:44px; min-height:44px; }
