/*!*************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!./app/globals.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************/
:root {
  --ink: #1c2b24;
  --muted: #5c6f66;
  --green: #2f6d4f;
  --green-light: #eaf3ee;
  --border: #d8e2dc;
  --background: #f7faf8;
  --alarm: #a3352b;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--background);
  color: var(--ink);
  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  line-height: 1.55;
}

.shell { max-width: 46rem; margin: 0 auto; padding: 2rem 1.25rem 4rem; }

header.site-header {
  border-bottom: 1px solid var(--border);
  background: #fff;
}
header.site-header .inner {
  max-width: 46rem; margin: 0 auto; padding: 1rem 1.25rem;
  display: flex; align-items: baseline; justify-content: space-between; gap: 1rem;
}
header.site-header strong { font-size: 1.05rem; letter-spacing: -0.01em; }
header.site-header .tools { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; justify-content: flex-end; }

/* The language switch: two codes, the active one filled. Same look as the
   public site's bar. */
.languages { display: inline-flex; gap: .15rem; align-items: center; }
.languages button {
  font-size: .78rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  background: none; border: none; color: var(--muted); padding: .3rem .45rem; border-radius: 5px;
}
.languages button:hover { color: var(--green); }
.languages button[aria-current="true"] { color: var(--ink); background: var(--green-light); }

h1 { font-size: 1.6rem; letter-spacing: -0.02em; margin: 0 0 .35rem; }
h2 { font-size: 1.15rem; margin: 2rem 0 .75rem; }
p.lead { color: var(--muted); margin: 0 0 1.75rem; }

.card {
  background: #fff; border: 1px solid var(--border);
  border-radius: 10px; padding: 1.25rem; margin-bottom: 1rem;
}

label { display: block; font-size: .85rem; color: var(--muted); margin-bottom: .3rem; }
input, select, textarea {
  width: 100%; padding: .55rem .7rem; font: inherit;
  border: 1px solid var(--border); border-radius: 7px; background: #fff; color: inherit;
}
input:focus, select:focus, textarea:focus { outline: 2px solid var(--green); outline-offset: 1px; }
.field { margin-bottom: .9rem; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); grid-gap: .9rem; gap: .9rem; }

button {
  font: inherit; font-weight: 500; cursor: pointer;
  padding: .6rem 1.1rem; border-radius: 7px;
  border: 1px solid var(--green); background: var(--green); color: #fff;
}
button:disabled { opacity: .55; cursor: progress; }
button.secondary { background: #fff; color: var(--green); }
button.link-button { background: none; border: none; color: var(--green); padding: 0; text-decoration: underline; }

.error-box {
  background: #fdf1f0; border: 1px solid #f0cfcb; color: var(--alarm);
  border-radius: 7px; padding: .7rem .9rem; margin-bottom: 1rem; font-size: .9rem;
}
.error-box ul { margin: .4rem 0 0; padding-left: 1.1rem; }

.nutritionist {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 1rem; width: 100%; text-align: left;
  background: #fff; border: 1px solid var(--border); color: inherit;
  font-weight: 400; margin-bottom: .75rem; padding: 1rem 1.15rem;
}
.nutritionist:hover { border-color: var(--green); background: var(--green-light); }
.name { font-weight: 600; display: block; }
.approach {
  display: inline-block; font-size: .72rem; text-transform: uppercase;
  letter-spacing: .04em; color: var(--green); background: var(--green-light);
  border-radius: 20px; padding: .1rem .6rem; margin: .35rem 0;
}
.bio { color: var(--muted); font-size: .9rem; margin: .3rem 0 0; }

.ai-notice {
  font-size: .82rem; color: var(--muted);
  border-left: 3px solid var(--border); padding-left: .8rem; margin-top: 1.25rem;
}

.day { margin-bottom: 1.5rem; }
.day > h3 { font-size: 1rem; margin: 0 0 .6rem; padding-bottom: .35rem; border-bottom: 1px solid var(--border); }
.meal { margin-bottom: .9rem; }
.meal .meal-type {
  font-size: .72rem; text-transform: uppercase; letter-spacing: .05em;
  color: var(--muted); margin-bottom: .2rem;
}
.meal ul { margin: 0; padding-left: 1.15rem; }
.meal li::marker { color: var(--green); }
.quantity { color: var(--muted); font-size: .9rem; }
.empty { color: var(--muted); }

.heading-row {
  display: flex; gap: 1rem; align-items: flex-start;
  justify-content: space-between; flex-wrap: wrap; margin-bottom: 1.75rem;
}
.heading-row > div { flex: 1 1 18rem; }
.heading-row button { flex: 0 0 auto; white-space: nowrap; }

.waiting { margin-top: 1.5rem; }
.waiting .progress {
  height: 6px; border-radius: 3px; background: var(--border);
  overflow: hidden; margin-bottom: .9rem;
}
.waiting .progress span {
  display: block; height: 100%; background: var(--green);
  border-radius: 3px; transition: width 1s linear;
}
.waiting .phase { margin: 0 0 .35rem; font-weight: 500; }
.waiting .hint { margin: 0; color: var(--muted); font-size: .88rem; }
.waiting .hint + .hint { margin-top: .5rem; }

.navigation { display: flex; gap: .35rem; flex-wrap: wrap; }
.navigation .item {
  background: none; border: none; color: var(--muted);
  padding: .3rem .6rem; border-radius: 6px; font-size: .9rem;
}
.navigation .item:hover { background: var(--green-light); color: var(--green); }
.navigation .item.active { color: var(--green); font-weight: 600; }
.navigation .item.sign-out { color: var(--muted); }

.list { list-style: none; margin: 0; padding: 0; }
.list li {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem;
  padding: .8rem 0; border-bottom: 1px solid var(--border);
}
.list li:last-child { border-bottom: none; }
.list .hint { margin: .2rem 0 0; }

/* Small grey text under a row: counts, dates, explanations. */
.hint { color: var(--muted); font-size: .88rem; }

.status {
  display: inline-block; margin-left: .5rem; font-size: .72rem;
  text-transform: uppercase; letter-spacing: .04em;
  color: var(--muted); background: var(--background);
  border: 1px solid var(--border); border-radius: 20px; padding: .05rem .55rem;
}
.status.active { color: var(--green); background: var(--green-light); border-color: transparent; }

.danger { color: var(--alarm) !important; }
.outcome { color: var(--green); font-size: .9rem; margin-left: .6rem; }
.nutritionist.current { border-color: var(--green); background: var(--green-light); cursor: default; opacity: 1; }
.nutritionist:disabled { opacity: 1; }

.confirm {
  background: #fdf1f0; border: 1px solid #f0cfcb; border-radius: 7px;
  padding: .5rem .7rem; margin-top: .5rem !important;
}

/* The plan's ingredient accordion.
   Native <details>: opens and closes with no state to keep, and whoever
   arrives with a keyboard or a screen reader finds it already announced for
   what it is. */
.ingredients {
  background: #fff; border: 1px solid var(--border); border-radius: 9px;
  padding: .9rem 1.1rem; margin-bottom: 1.4rem;
}
.ingredients > summary {
  cursor: pointer; font-weight: 600; list-style-position: outside;
}
.ingredients > summary::marker { color: var(--muted); }
.ingredients > summary:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }
.ingredients > .lead { margin: .7rem 0 .2rem; }
.ingredients li.group-heading {
  display: block; padding: .9rem 0 .1rem; border-bottom: none;
  font-size: .72rem; text-transform: uppercase;
  letter-spacing: .06em; color: var(--muted);
}
.ingredients li.group-heading:first-child { padding-top: .3rem; }
.ingredients .food-name { font-weight: 600; }
.ingredients .hint { margin: .1rem 0 0; font-size: .85rem; color: var(--muted); }
/* Rejected: the name is struck through, not the whole row - the note and the
   substitutes must be read, and struck-through text is not. */
.ingredients li.rejected .food-name { text-decoration: line-through; color: var(--muted); }
.ingredients .confirm label { display: block; font-size: .82rem; margin-bottom: .25rem; }
.ingredients .confirm input { margin-bottom: .4rem; }
.ingredients .confirm button { margin-right: .4rem; }
.ingredients .list li > button { flex: 0 0 auto; white-space: nowrap; }

/* Limits per type: the number box sits on the right, narrow, and the row
   stays as readable as the others in the list. */
.list.limits li > input {
  flex: 0 0 auto; width: 4.5rem; text-align: center; margin: 0;
}

/* How many foods in that type: next to the heading, because that is where
   the limit set in the profile gets checked. */
.ingredients li.group-heading .count {
  margin-left: .4rem; font-weight: 600; color: var(--ink);
}

/* The field to ask for a food: at the bottom of the card, separated from the
   list by a rule, because it is a gesture and not an item. */
.card .add-form {
  margin-top: 1rem; padding-top: .9rem; border-top: 1px solid var(--border);
}
.card .add-form label { display: block; font-size: .82rem; margin-bottom: .3rem; }
.card .add-form .row { display: flex; gap: .5rem; align-items: stretch; }
.card .add-form .row input { margin: 0; }
.card .add-form .row button { flex: 0 0 auto; white-space: nowrap; }
.card .add-form .hint { margin: .5rem 0 0; }
/* Several statuses on the same row: "pending" and "values to be checked" can
   coexist, and glued together they cannot be read. */
.list .status + .status { margin-left: .3rem; }

/* Shopping. Boxes are big and the touch area is the whole row: it is used
   standing at the supermarket, one hand free and the trolley in the other. */
.start-shopping label { display: block; font-size: .82rem; margin-bottom: .3rem; }
.start-shopping .row { display: flex; gap: .5rem; align-items: stretch; }
.start-shopping .row select { margin: 0; flex: 0 1 12rem; }
.start-shopping .row button { flex: 0 0 auto; white-space: nowrap; }
.start-shopping .hint { margin: .6rem 0 0; }

.list.shopping li { padding: 0; }
.list.shopping li.group-heading { padding: .9rem 0 .1rem; }
.list.shopping li > label {
  display: flex; align-items: flex-start; gap: .7rem;
  width: 100%; padding: .7rem 0; margin: 0; cursor: pointer; font-size: 1rem;
}
.list.shopping input[type="checkbox"],
.list .pick input[type="checkbox"] {
  width: 1.15rem; height: 1.15rem; margin: .15rem 0 0; flex: 0 0 auto; accent-color: var(--green);
}
.list.shopping .quantity { display: block; }
.list.shopping .exact { display: block; font-size: .78rem; color: var(--muted); }
/* Bought: the name is struck through, not the quantity - that is re-read to
   check the trolley. */
.list.shopping li.bought strong { text-decoration: line-through; color: var(--muted); }

.list .pick {
  display: flex; align-items: flex-start; gap: .7rem; margin: 0; cursor: pointer;
}
.list .pick .hint { margin: .15rem 0 0; }

.history-actions { margin-top: 1rem; padding-top: .9rem; border-top: 1px solid var(--border); }
.history-actions .row {
  display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-top: .8rem;
}
.history-actions .row label { font-size: .82rem; margin: 0; }
.history-actions .row input { margin: 0; width: auto; }

/* ---------------------------------------------------------- daily panel
   Added with the daily panel: bottom bar on phones, the meal cards and the
   "now" accent, the week list, chips, the pantry check. One accent colour
   (green), one for "now" (amber), one for danger (alarm). */
:root { --now: #b8741a; --now-light: #fff5e6; }

/* Placeholders must not look like values: lighter, italic, and they all
   start with "Es:" / "e.g." from the dictionaries. */
input::placeholder, textarea::placeholder { color: #9aa8a1; font-style: italic; opacity: 1; }

.navigation .item svg { width: 1.15rem; height: 1.15rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; display: none; }

@media (max-width: 40rem) {
  .shell { padding-bottom: 5.5rem; }
  header.site-header .tools { gap: .4rem; }
  .navigation {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 20;
    display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 0; gap: 0;
    background: #fff; border-top: 1px solid var(--border);
    padding: .35rem .25rem calc(.35rem + env(safe-area-inset-bottom));
  }
  .navigation .item {
    display: flex; flex-direction: column; align-items: center; gap: .15rem;
    font-size: .72rem; padding: .25rem 0; border-radius: 8px; white-space: nowrap;
  }
  .navigation .item svg { display: block; }
  .navigation .item.active { background: var(--green-light); }
  .navigation .item.sign-out { display: none; }
}

.back-link { display: inline-block; margin-bottom: 1.25rem; color: var(--muted); text-decoration: none; font-size: .9rem; }
.back-link:hover { color: var(--green); }

.meal-card {
  background: #fff; border: 1px solid var(--border); border-radius: 10px;
  padding: .9rem 1rem; margin-bottom: .75rem; min-width: 0;
}
.meal-card header { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; margin-bottom: .4rem; }
.meal-card .meal-type { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.meal-card.now { border-color: var(--now); background: var(--now-light); box-shadow: 0 0 0 3px rgba(184,116,26,.12); }
.meal-card.now .meal-type { color: var(--now); font-weight: 700; }
.meal-card ul { list-style: none; margin: 0; padding: 0; }
.meal-card li { padding: .35rem 0; border-bottom: 1px dashed var(--border); }
.meal-card li:last-child { border-bottom: none; }
.meal-card .food-row { display: flex; justify-content: space-between; align-items: baseline; gap: .6rem; }
.meal-card .notes { margin: .6rem 0 0; }
.meal-card.compact .quantity { display: block; font-size: .82rem; }
.meal-card.pending { opacity: .75; }
.meal-card .working { margin: .6rem 0 0; color: var(--now); font-weight: 500; }
.meal-card .working .dot {
  display: inline-block; width: .55rem; height: .55rem; border-radius: 50%; background: var(--now);
  animation: pulse 1.2s infinite ease-in-out;
}
@keyframes pulse { 0%, 100% { opacity: .3; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .meal-card .working .dot { animation: none; } }

button.link-button.small { font-size: .82rem; }
.meal-actions { margin: .5rem 0 .3rem; padding: .7rem; background: var(--background); border-radius: 8px; }
.meal-actions label { font-size: .8rem; }
.meal-actions input { margin-bottom: .5rem; }
.meal-actions .row { display: flex; gap: .4rem; flex-wrap: wrap; }
.meal-actions .row button { padding: .45rem .8rem; font-size: .88rem; }
.meal-actions .context { margin-top: .6rem; font-size: .85rem; }
.meal-actions .context summary { cursor: pointer; color: var(--muted); }
.meal-actions .context ul { margin: .3rem 0; padding-left: 1.1rem; }

.meal-row { display: grid; grid-gap: .75rem; gap: .75rem; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); margin-bottom: .5rem; }
@media (max-width: 40rem) {
  .meal-row { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: .6rem; padding-bottom: .4rem; }
  .meal-row > .meal-card { flex: 0 0 82%; scroll-snap-align: start; margin-bottom: 0; }
}

.week { list-style: none; margin: 0; padding: 0; }
.week .day-row { border: 1px solid var(--border); border-radius: 10px; background: #fff; margin-bottom: .5rem; padding: .2rem .9rem; }
.week .day-row.today { border-color: var(--green); }
.week .day-toggle { display: block; width: 100%; text-align: left; background: none; border: none; color: inherit; padding: .55rem 0; font-weight: 400; }
.week .day-name { display: block; font-size: 1rem; }
.week .day-name strong { text-transform: capitalize; }
.week .day-toggle .hint { display: block; margin-top: .15rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.week .meal-row { margin: .3rem 0 .7rem; }

.chips { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .75rem; }
.chip {
  display: inline-flex; align-items: center; gap: .35rem; cursor: pointer;
  border: 1px solid var(--border); background: #fff; color: var(--ink);
  border-radius: 20px; padding: .3rem .8rem; font-size: .88rem; font-weight: 500; margin: 0;
}
.chip input { width: auto; margin: 0; accent-color: var(--green); }
.chip.active { border-color: var(--green); background: var(--green-light); color: var(--green); }

.next-days .card { margin-top: 0; }
.pantry li { padding: .5rem 0; }
.pantry .tick-label { margin-left: .4rem; color: var(--green); }
.list.pantry li.bought strong { text-decoration: line-through; color: var(--muted); }

.day h3 .status { margin-left: .6rem; text-transform: none; letter-spacing: 0; font-size: .78rem; }
.notice { background: var(--now-light); border: 1px solid #f0d9b5; border-radius: 7px; padding: .5rem .8rem; }
.outcome-line { color: var(--green); font-weight: 500; }
.heading-row .hint { margin: .2rem 0 0; }