/* Meal Schedule owns its layout; meal editing dialogs retain their existing styles. */
#panel-daily-meal-schedule .admin-daily-ms {
  --mp-border: #e3e8e4;
  --mp-muted: #718078;
  padding: 0;
  min-height: 0;
  overflow: hidden;
  border-radius: 16px;
}
#panel-daily-meal-schedule .mp-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.3rem 1.5rem;
  border-bottom: 1px solid var(--mp-border);
}
#panel-daily-meal-schedule .mp-header h2 {
  margin: 0;
}
#panel-daily-meal-schedule .mp-header p {
  margin: 0.35rem 0 0;
  color: var(--mp-muted);
  font-size: 0.82rem;
}
#panel-daily-meal-schedule .mp-scope {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
#panel-daily-meal-schedule .mp-field {
  display: grid;
  gap: 0.35rem;
  font-size: 0.7rem;
  color: #617168;
  font-weight: 650;
}
#panel-daily-meal-schedule .mp-field :where(select, input) {
  width: 100%;
  min-width: 9.5rem;
  height: 2.4rem;
  margin: 0;
  padding: 0.4rem 0.7rem;
  border: 1px solid #dce3dd;
  border-radius: 8px;
  background-color: white;
  color: #243b2f;
  font: inherit;
  font-size: 0.8rem;
}
#panel-daily-meal-schedule .mp-layout {
  display: grid;
  grid-template-columns: 18rem minmax(0, 1fr);
  height: clamp(
    34rem,
    calc(100dvh - var(--admin-daily-chrome-height, 3.35rem) - 14rem),
    70rem
  );
  min-width: 0;
}
#panel-daily-meal-schedule .mp-library {
  min-height: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--mp-border);
  background: #fff;
}
#panel-daily-meal-schedule .mp-library-head {
  padding: 1rem;
  border-bottom: 1px solid var(--mp-border);
}
#panel-daily-meal-schedule .mp-library-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.9rem;
}
#panel-daily-meal-schedule .mp-library-title h3 {
  font-size: 0.95rem;
  margin: 0;
  color: #243b2f;
}
#panel-daily-meal-schedule .mp-search {
  margin-bottom: 0.75rem;
}
#panel-daily-meal-schedule .ms-filters {
  margin: 0;
  gap: 0.3rem;
}
#panel-daily-meal-schedule .ms-chip {
  padding: 0.38rem 0.8rem;
  font-size: 0.73rem;
}
#panel-daily-meal-schedule .mp-library-list {
  overflow-y: auto;
  min-height: 0;
  padding: 0.8rem;
  overscroll-behavior: contain;
}
#panel-daily-meal-schedule .ms-board {
  gap: 1rem;
}
#panel-daily-meal-schedule .ms-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.5rem;
}
#panel-daily-meal-schedule .ms-sec {
  gap: 0.3rem;
}
#panel-daily-meal-schedule .ms-sec__label {
  margin: 0.2rem 0.25rem;
  font-size: 0.64rem;
}
#panel-daily-meal-schedule .ms-card {
  display: grid;
  grid-template-columns: 3.6rem minmax(0, 1fr) 1rem;
  align-items: center;
  gap: 0.7rem;
  padding: 0.5rem;
  width: 100%;
  min-width: 0;
  aspect-ratio: auto;
  border-radius: 10px;
  border: 1px solid var(--mp-border);
  background: #fff;
  color: #263e30;
  font: inherit;
  transition:
    border-color 0.15s,
    background 0.15s;
}
#panel-daily-meal-schedule .ms-card:hover {
  background: #f4f8f4;
  border-color: #9ab7a4;
}
#panel-daily-meal-schedule .ms-card :where(img, .ms-card__blank) {
  width: 3.6rem;
  height: 3.6rem;
  border-radius: 7px;
  object-fit: cover;
}
#panel-daily-meal-schedule .mp-food-copy {
  min-width: 0;
  display: grid;
  gap: 0.3rem;
  text-align: left;
}
#panel-daily-meal-schedule .mp-food-copy strong {
  font-size: 0.78rem;
  font-weight: 650;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
#panel-daily-meal-schedule .mp-food-copy small {
  color: var(--mp-muted);
  font-size: 0.67rem;
}
#panel-daily-meal-schedule .mp-food-arrow {
  color: #899b8f;
  font-size: 1rem;
}
#panel-daily-meal-schedule .mp-planner {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #f7f9f7;
}
#panel-daily-meal-schedule .mp-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  padding: 1rem 1.15rem;
  background: white;
  border-bottom: 1px solid var(--mp-border);
}
#panel-daily-meal-schedule .mp-period h3 {
  font-size: 0.95rem;
  color: #263e30;
  margin: 0 0 0.3rem;
}
#panel-daily-meal-schedule .mp-period p {
  font-size: 0.72rem;
  margin: 0;
  color: var(--mp-muted);
}
#panel-daily-meal-schedule .mp-navigation {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem;
}
#panel-daily-meal-schedule .mp-navigation input {
  min-width: 8rem;
}
#panel-daily-meal-schedule .ms-btn {
  border-radius: 7px;
  white-space: nowrap;
  height: auto;
  min-height: 2.1rem;
  width: auto;
  line-height: 1.25;
}
#panel-daily-meal-schedule .mp-navigation .ms-btn {
  min-height: 2.4rem;
}
#panel-daily-meal-schedule .ms-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
#panel-daily-meal-schedule :where(button, input, select):focus-visible {
  outline: 2px solid #49795e;
  outline-offset: 2px;
}
#panel-daily-meal-schedule .mp-calendar {
  display: grid;
  grid-template-columns: repeat(4, minmax(15rem, 1fr));
  align-items: stretch;
  gap: 0.85rem;
  padding: 1rem;
  overflow: auto;
  min-height: 0;
  flex: 1;
  overscroll-behavior: contain;
}
#panel-daily-meal-schedule .mp-week {
  display: flex;
  flex-direction: column;
  align-self: start;
  min-height: 18rem;
  border: 1px solid var(--mp-border);
  border-radius: 11px;
  background: #eef2ee;
  overflow: hidden;
}
#panel-daily-meal-schedule .mp-week--current {
  border-top: 3px solid #2c6346;
}
#panel-daily-meal-schedule .mp-week--selected {
  box-shadow: 0 0 0 2px #80a68a;
}
#panel-daily-meal-schedule .mp-week-head {
  padding: 0.95rem 0.9rem 0.85rem;
  border-bottom: 1px solid #e0e6e1;
}
#panel-daily-meal-schedule .mp-week-kicker {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.64rem;
  color: #677b6c;
  margin-bottom: 0.55rem;
}
#panel-daily-meal-schedule .mp-week-kicker span {
  border-radius: 4px;
  padding: 0.18rem 0.35rem;
  background: #dceadd;
  color: #28523b;
  font-weight: 650;
}
#panel-daily-meal-schedule .mp-week-head h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 650;
  color: #273e30;
}
#panel-daily-meal-schedule .mp-week-head p {
  margin: 0.4rem 0 0;
  font-size: 0.65rem;
  color: #667b6d;
}
#panel-daily-meal-schedule .mp-week-body {
  padding: 0.65rem;
  display: grid;
  gap: 0.65rem;
}
#panel-daily-meal-schedule .mp-week footer {
  padding: 0.2rem 0.65rem 0.65rem;
  margin-top: auto;
}
#panel-daily-meal-schedule .mp-add-week {
  width: 100%;
  background: transparent;
  border-style: dashed;
  color: #486550;
}
#panel-daily-meal-schedule .mp-household {
  border: 1px solid #dfe6e0;
  border-radius: 8px;
  background: white;
  padding: 0.8rem;
  min-width: 0;
}
#panel-daily-meal-schedule .mp-household header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: start;
  gap: 0.45rem;
}
#panel-daily-meal-schedule .mp-household h4 {
  margin: 0;
  font-size: 0.79rem;
  line-height: 1.4;
  overflow-wrap: anywhere;
  color: #273d30;
}
#panel-daily-meal-schedule .mp-household header p {
  margin: 0.25rem 0 0;
  font-size: 0.63rem;
  color: var(--mp-muted);
}
#panel-daily-meal-schedule .mp-status {
  padding: 0.2rem 0.4rem;
  border-radius: 4px;
  background: #f6efdf;
  color: #7c622d;
  font-size: 0.58rem;
}
#panel-daily-meal-schedule .mp-status--published {
  background: #e8f0e8;
  color: #39664a;
}
#panel-daily-meal-schedule .mp-meals {
  display: grid;
  gap: 0.6rem;
  list-style: none;
  padding: 0.85rem 0;
  margin: 0.7rem 0 0;
  border-top: 1px solid #edf0ed;
}
#panel-daily-meal-schedule .mp-meals li {
  display: flex;
  gap: 0.5rem;
  font-size: 0.74rem;
  line-height: 1.35;
  color: #304837;
  overflow-wrap: anywhere;
}
#panel-daily-meal-schedule .mp-meals li > div {
  min-width: 0;
}
#panel-daily-meal-schedule .mp-meals small {
  display: block;
  margin-top: 0.15rem;
  font-size: 0.6rem;
  color: #829087;
}
#panel-daily-meal-schedule .mp-meal-dot {
  width: 0.4rem;
  height: 0.4rem;
  flex-shrink: 0;
  background: #749279;
  border-radius: 50%;
  margin-top: 0.3rem;
}
#panel-daily-meal-schedule .mp-meal-dot--side {
  background: #ccb57d;
}
#panel-daily-meal-schedule .mp-add-house {
  padding: 0.2rem 0;
  border: 0;
  min-height: 1.5rem;
  color: #607866;
  font-size: 0.67rem;
}
#panel-daily-meal-schedule .mp-week-empty {
  display: grid;
  justify-items: center;
  text-align: center;
  padding: 1.2rem 0.7rem;
  color: #788b7d;
}
#panel-daily-meal-schedule .mp-week-empty > span {
  font-size: 1.2rem;
  margin-bottom: 0.6rem;
}
#panel-daily-meal-schedule .mp-week-empty strong {
  font-size: 0.77rem;
  font-weight: 550;
}
#panel-daily-meal-schedule .mp-week-empty p {
  font-size: 0.7rem;
  line-height: 1.6;
  margin: 0.4rem 0;
}
#panel-daily-meal-schedule .mp-card-empty {
  color: var(--mp-muted);
  font-size: 0.7rem;
  margin: 1rem 0;
}
#panel-daily-meal-schedule .mp-loading {
  grid-column: 1 / -1;
  padding: 2rem;
  color: var(--mp-muted);
  text-align: center;
  font-size: 0.85rem;
}
#panel-daily-meal-schedule .mp-hint {
  margin: 0;
  padding: 0.7rem 1rem;
  background: #e7f0e8;
  color: #31593d;
  font-size: 0.78rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
#panel-daily-meal-schedule .mp-hint[hidden],
#panel-daily-meal-schedule [hidden] {
  display: none;
}
#panel-daily-meal-schedule #ms-no-households {
  padding: 0.7rem 1rem;
  color: #735c2c;
  background: #faf3e4;
  font-size: 0.78rem;
  margin: 0;
}
#panel-daily-meal-schedule #ms-msg {
  padding: 0.75rem 1.25rem;
  margin: 0;
  border-top: 1px solid var(--mp-border);
}
#ms-sheet-msg {
  margin: 0.6rem 0 0;
  font-size: 0.85rem;
}
@media (max-width: 900px) {
  #panel-daily-meal-schedule .mp-layout {
    grid-template-columns: 15rem minmax(0, 1fr);
  }
  #panel-daily-meal-schedule .mp-header {
    padding: 1rem;
  }
}
@media (max-width: 700px) {
  #panel-daily-meal-schedule .mp-layout {
    grid-template-columns: minmax(0, 1fr);
    height: auto;
  }
  #panel-daily-meal-schedule .mp-library {
    max-height: 23rem;
    border-right: 0;
    border-bottom: 1px solid var(--mp-border);
  }
  #panel-daily-meal-schedule .mp-library-list {
    max-height: 13rem;
  }
  #panel-daily-meal-schedule .mp-library-list .ms-grid {
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  }
  #panel-daily-meal-schedule .mp-planner {
    min-height: 31rem;
  }
  #panel-daily-meal-schedule .mp-calendar {
    max-height: 38rem;
    grid-template-columns: repeat(4, minmax(16rem, 80vw));
  }
  #panel-daily-meal-schedule .mp-scope {
    width: 100%;
  }
  #panel-daily-meal-schedule .mp-scope .mp-field {
    flex: 1;
  }
}
/* Keep household and week choices reachable on shorter screens. */
#ms-sheet .ms-sheet__panel {
  width: min(34rem, 100%);
}
#ms-sheet .ms-sheet__hero {
  height: clamp(6rem, 20dvh, 11rem);
  aspect-ratio: auto;
}
