/* Hemma 0.3 – Matplaneraren */
#mealsPage [hidden]{display:none!important}.meal-eyebrow{font-size:.72rem;font-weight:800;letter-spacing:.12em;color:#bd7254}.hemma-meal-intro{background:linear-gradient(135deg,#fff8f1,#fce9dc)}.hemma-meal-intro h2{font-size:clamp(1.5rem,3vw,2.3rem);margin:.6rem 0}.hemma-meal-intro>p{color:#785d53;max-width:620px}.meal-entry-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:22px 0}.meal-entry-card{border:1px solid #edd5c5;background:#fff;border-radius:20px;padding:24px;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:10px;min-height:205px;color:#3d302d;transition:transform .15s,box-shadow .15s}.meal-entry-card:hover{transform:translateY(-3px);box-shadow:0 8px 28px #5b3a241a}.meal-entry-icon{font-size:2rem}.meal-entry-card strong{font-size:1.25rem}.meal-entry-card small{color:#806a61;font-size:.88rem;line-height:1.5}.meal-entry-link{color:#bb654b;font-weight:700;margin-top:auto}.meal-existing{margin-top:6px}.meal-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:22px}.meal-form label{display:flex;flex-direction:column;gap:8px;font-weight:600;font-size:.9rem}.meal-form input:not([type=checkbox]),.meal-form select{width:100%;border:1px solid #e5d7ce;border-radius:12px;padding:12px;background:#fff;color:#332b28;font:inherit}.meal-form .meal-check{grid-column:1/-1;display:flex;flex-direction:row;align-items:center;font-weight:500}.meal-form button{grid-column:1/-1;justify-self:start}.meal-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(225px,1fr));gap:14px;margin:18px 0}.meal-recipe{border:1px solid #f0dfd2;border-radius:16px;background:#fffaf6;padding:17px;display:flex;flex-direction:column;gap:12px}.meal-recipe h3{margin:0;font-size:1.08rem}.meal-recipe p{color:#78655c;margin:0;font-size:.85rem}.meal-recipe-top{display:flex;justify-content:space-between;gap:10px}.meal-day{color:#bd7254;font-weight:800;font-size:.8rem}.meal-recipe-tag{font-size:.8rem;color:#74665f}.meal-recipe details{font-size:.85rem}.meal-recipe summary{cursor:pointer;font-weight:600}.meal-recipe ul{padding-left:20px;line-height:1.7}.meal-recipe button{margin-top:auto}.meal-actions{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0}@media(max-width:650px){.meal-entry-options,.meal-form{grid-template-columns:1fr}.meal-entry-card{min-height:170px}.meal-form button{width:100%}}

/* 0.3.1: Receptkortens text måste vara läsbar i både ljust och mörkt tema. */
#mealsPage .meal-recipe{color:#302722!important;color-scheme:light}
#mealsPage .meal-recipe h3{color:#302722!important;opacity:1!important}
#mealsPage .meal-recipe details,#mealsPage .meal-recipe summary,#mealsPage .meal-recipe li{color:#43332c!important;opacity:1!important}
#mealsPage .meal-recipe .meal-recipe-tag{color:#625148!important}
#mealsPage .meal-recipe p{color:#655249!important}
/* Knappfärger definieras separat så sekundärknappen aldrig får vit text på vitt. */
#mealsPage .meal-recipe .hemma-secondary{
  background:#fffaf6!important;
  color:#3d302d!important;
  border:1px solid #e9cfc0!important;
  font-weight:700;
}
#mealsPage .meal-recipe .hemma-secondary:hover{
  background:#f7e7db!important;
  color:#302722!important;
}
#mealsPage .meal-recipe .hemma-secondary:focus-visible{
  outline:3px solid #b9694e;
  outline-offset:2px;
}
/* Behåll statusinformation för fel, men dölj den störande lyckad-synkningen. */
.hemma-sync-status:not([data-error="true"]){display:none!important}

#mealsPage .meal-photo{width:100%;height:150px;object-fit:cover;border-radius:12px}#mealsPage .meal-instructions{white-space:pre-line;line-height:1.5;margin-top:12px;color:#43332c!important}#mealsPage .meal-recipe details{max-height:340px;overflow:auto}#mealsPage .meal-recipe{min-width:0}

/* Hemma 0.3.4 */
.meal-price-estimate{margin:18px 0;padding:18px;}
.meal-price-estimate p{margin:8px 0;}
.meal-price-estimate li{margin:5px 0;}
.meal-clear-btn{border-color:#c06c60!important;color:#b24b40!important;}

/* 0.3.6: accessible full-recipe dialog */
#mealsPage .meal-open-recipe{background:#b9694e;color:white!important;border:0;border-radius:12px;padding:12px;cursor:pointer;font:inherit;font-weight:700}
.meal-recipe-dialog{width:min(860px,calc(100vw - 24px));max-height:90vh;overflow:auto;border:1px solid #e8d3c3;border-radius:22px;background:#fffaf6;color:#352821;padding:clamp(16px,3vw,30px);box-shadow:0 24px 90px #24130d55;color-scheme:light}
.meal-recipe-dialog::backdrop{background:#211914a8}
.meal-recipe-dialog h2,.meal-recipe-dialog h3{color:#352821}
.meal-dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}
.meal-dialog-image{width:100%;height:min(280px,35vh);object-fit:cover;border-radius:15px}
.meal-dialog-columns{display:grid;grid-template-columns:minmax(200px,1fr) minmax(0,1.6fr);gap:30px;margin:18px 0}
.meal-dialog-ingredients{list-style:none;margin:0;padding:0}
.meal-dialog-ingredients li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #ebd9cb;color:#47362f}
.meal-dialog-ingredients strong{white-space:normal;text-align:right}
.meal-dialog-steps{white-space:pre-line;line-height:1.7;color:#47362f}
.meal-dialog-steps p{margin:0 0 14px}
.meal-saved-open{margin-left:auto;white-space:nowrap}
@media(max-width:620px){.meal-dialog-columns{grid-template-columns:1fr;gap:12px}.meal-recipe-dialog{max-height:94vh}.meal-saved-open{font-size:.8rem;padding:7px}}

/* 0.3.7: explicit contrast on the light meal-planner welcome panel in dark mode. */
#mealsPage .hemma-meal-intro h2,
#mealsPage .hemma-meal-intro h3 { color:#352821 !important; }
#mealsPage .hemma-meal-intro p { color:#755345 !important; }
#mealsPage .hemma-meal-intro .meal-entry-card strong { color:#352821 !important; }
#mealsPage .hemma-meal-intro .meal-entry-card small { color:#735448 !important; }
#mealsPage .hemma-meal-intro .meal-entry-link { color:#A94E32 !important; }
#mealsPage .meal-translation-status { color:#765244 !important; font-size:.85rem; margin:8px 0; }

/* Hemma 0.3.8 */
.meal-filter-note { grid-column: 1 / -1; margin: 0; font-size: .85rem; color: var(--text-muted, #766458); }

/* Hemma 0.3.9 – fördelning av middagar */
#mealsPage .meal-distribution{grid-column:1/-1;border:1px solid #ddc7b9;border-radius:16px;padding:18px;background:var(--surface,rgba(128,128,128,.06));}
#mealsPage .meal-distribution .meal-check{margin:0;display:flex;flex-direction:row;align-items:center;gap:10px;cursor:pointer;}
#mealsPage .meal-distribution-help{font-size:.88rem;line-height:1.5;margin:15px 0;color:var(--text-muted,#a69a92);}
#mealsPage .meal-quota-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;}
#mealsPage .meal-quota-grid label{min-width:0;}
#mealsPage #mealDistributionStatus{font-weight:700;margin:14px 0 0;color:#389477;}
#mealsPage #mealDistributionStatus.meal-quota-error{color:#d57b59;}
#mealsPage #mealDistributionFields[hidden]{display:none!important;}

/* 0.3.14: verified store choice and live ingredient-price rows */
.meal-store-choice{border:1px solid var(--border);border-radius:14px;padding:15px;margin:12px 0}
.meal-store-choice label{display:flex;flex-direction:column;gap:8px;font-weight:700}
.meal-store-choice select{max-width:100%;padding:11px;border:1px solid var(--border);border-radius:10px;background:var(--card);color:var(--text-primary)}
.meal-price-rows{list-style:none;margin:12px 0;padding:0}
.meal-price-rows li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--border)}
.meal-price-rows small{display:block;font-size:12px;color:var(--text-secondary);margin-top:3px}
.meal-price-rows b{white-space:nowrap}

/* 0.3.15: compact, multi-store price comparison */
.meal-price-store-options{display:flex;flex-wrap:wrap;gap:9px;margin:12px 0}
.meal-store-option{display:flex;align-items:center;gap:8px;padding:9px 12px;border:1px solid var(--border);border-radius:12px;cursor:pointer;font-size:13px}
.meal-store-option input{accent-color:#b96145}
.meal-store-option small{display:block;color:var(--text-secondary);font-size:11px}
.meal-price-summary{padding:13px 15px;border:1px solid var(--border);border-radius:13px;margin:12px 0}
.meal-price-summary strong{display:block;font-size:24px}
.meal-price-summary span{display:block;font-size:12px;font-weight:700;margin:3px 0}
.meal-price-summary p{margin:7px 0 0}
.meal-price-details{margin-top:10px}
.meal-price-details summary{cursor:pointer;font-weight:700;padding:11px;border:1px solid var(--border);border-radius:10px}
.meal-price-table-wrap{overflow-x:auto;margin-top:8px}
.meal-price-table{width:100%;border-collapse:collapse;font-size:12px}
.meal-price-table th,.meal-price-table td{padding:9px 7px;text-align:left;border-bottom:1px solid var(--border);vertical-align:top}
.meal-price-table td small{display:block;color:var(--text-secondary);margin-top:3px}
.meal-price-amount{white-space:nowrap;text-align:right!important}

/* 0.3.17: store selection precedes meal planning */
#mealsPage .meal-store-first{background:#fffdfb;border:1px solid #ead9cc;border-radius:17px;padding:18px;margin:22px 0;color:#47362f}
#mealsPage .meal-store-heading h3{margin:6px 0;font-size:1.15rem;color:#47362f}
#mealsPage .meal-store-heading p{margin:0 0 15px;font-size:.9rem;color:#78655c}
#mealsPage .meal-store-choice{margin:0}
#mealsPage .meal-store-choice>strong{display:block;margin-bottom:8px}
#mealsPage .meal-find-stores{margin-top:12px}
#mealsPage .meal-find-stores>summary{cursor:pointer;font-weight:700;color:#a75d45;padding:10px 0}
#mealsPage .meal-find-stores .price-compare{margin-top:8px;padding:12px;background:#fff;border:1px solid #ecdace;border-radius:12px}
#mealsPage .meal-store-hint{margin:12px 0 0;font-size:.8rem}
#mealsPage .meal-next-step{margin:20px 0 8px}
#mealsPage .meal-store-option{background:#fff;border-color:#e9d7ca}
#mealsPage .meal-store-option:has(input:checked){background:#fff0e6;border-color:#c98767}
@media(max-width:650px){#mealsPage .meal-store-first{padding:13px}#mealsPage .meal-find-stores .price-fields{display:block}}

/* 0.3.18: collapsible store selection and optional product lookup */
#mealsPage .meal-store-selection{border:1px solid #ead9cc;border-radius:12px;padding:12px;margin-top:12px}
#mealsPage .meal-store-selection>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer}
#mealsPage .meal-store-selection>summary span{font-size:12px;color:#a75d45}
#mealsPage .meal-store-selection #mealConfirmStores{margin-top:8px}
#mealsPage .meal-product-lookup{margin-top:14px;border:1px solid #ead9cc;border-radius:10px;padding:10px}
#mealsPage .meal-product-lookup>summary{cursor:pointer;font-weight:700;color:#a75d45}
#mealsPage .meal-product-lookup .price-fields{margin-top:12px}

/* Beta 6: price selection and pantry exclusions */
.meal-pantry-toggle{display:flex;gap:6px;align-items:center;font-size:12px;margin-top:8px;cursor:pointer}
.meal-product-button{margin-top:7px;padding:5px 9px;border:1px solid var(--border);border-radius:8px;background:transparent;color:inherit;cursor:pointer;font-size:12px}
.meal-product-choices{max-height:230px;overflow:auto;padding:6px;margin-top:5px;border:1px solid var(--border);border-radius:9px}
.meal-product-choices button{display:block;width:100%;text-align:left;padding:8px;border:0;border-bottom:1px solid var(--border);background:transparent;color:inherit;cursor:pointer;font-size:12px}
.meal-product-choices button:hover{background:var(--surface-hover,rgba(120,120,120,.12))}