/*
 * Final caregiver Diet layout containment.
 * Loaded after caregiver-ui.css and guide-content.css so clinician-authored
 * nutrition content cannot size implicit CSS grid tracks beyond the viewport.
 */

.nutrition-page,
.nutrition-authored-content,
.nutrition-consistency-card,
.nutrition-guidance-card,
.nutrition-hydration-card,
.nutrition-lists {
  grid-template-columns: minmax(0, 1fr);
}

.nutrition-page,
.nutrition-authored-content,
.nutrition-summary,
.nutrition-lists,
.nutrition-list,
.nutrition-consistency-card,
.nutrition-guidance-card,
.nutrition-hydration-card {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.nutrition-authored-content > *,
.nutrition-consistency-card > *,
.nutrition-guidance-card > *,
.nutrition-hydration-card > *,
.nutrition-list > * {
  min-width: 0;
  max-width: 100%;
}

.nutrition-phase-intro,
.nutrition-consistency-card strong,
.nutrition-guidance-card p,
.nutrition-hydration-card p,
.nutrition-list li {
  width: auto;
  max-width: 100%;
  min-width: 0;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
}

@media (max-width: 539px) {
  .nutrition-page,
  .nutrition-authored-content {
    width: 100%;
    max-width: calc(100vw - 28px);
    overflow-x: visible;
  }

  .nutrition-page {
    gap: 16px;
  }

  .nutrition-authored-content {
    gap: 8px;
  }

  .nutrition-phase-intro {
    margin: 0;
    font-size: 0.84rem;
    line-height: 1.52;
  }

  .nutrition-consistency-card,
  .nutrition-guidance-card,
  .nutrition-hydration-card,
  .nutrition-list {
    width: 100%;
    padding: 11px 12px;
    overflow: hidden;
    border-radius: 10px;
  }

  .nutrition-consistency-card,
  .nutrition-guidance-card,
  .nutrition-hydration-card {
    gap: 5px;
  }

  .nutrition-consistency-card > span,
  .nutrition-guidance-card > span,
  .nutrition-hydration-card > span {
    font-size: 0.59rem;
    line-height: 1.3;
  }

  .nutrition-consistency-card strong {
    font-size: 0.94rem;
    line-height: 1.34;
    letter-spacing: -0.01em;
  }

  .nutrition-guidance-card p,
  .nutrition-hydration-card p,
  .nutrition-list ul {
    font-size: 0.8rem;
    line-height: 1.48;
  }

  .nutrition-lists {
    gap: 8px;
  }

  .nutrition-list h3 {
    font-size: 0.82rem;
  }

  .nutrition-list ul {
    gap: 4px;
    margin-top: 7px;
    padding-left: 1rem;
  }
}


/* Prescribed daily menus retain the existing caregiver diet surface. */
.relational-caregiver { min-width: 0; margin: 20px 0; overflow-wrap: anywhere; }
.relational-caregiver .relational-menu article { padding: 16px 0; border-top: 1px solid var(--n-color-border, #ddd); }
.relational-caregiver .relational-menu article > span { font-size: .8rem; }
.relational-caregiver .relational-menu h3 { margin: 6px 0; }
.relational-caregiver .relational-alternative { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--n-color-border, #ddd); }
.relational-caregiver .relational-alternative-label { margin: 0 0 6px; font-size: .8rem; }
.relational-caregiver .relational-allergens p { margin: 8px 0; }
.relational-caregiver details { margin-top: 12px; }
.relational-caregiver summary { min-height: 44px; padding: 10px 0; cursor: pointer; }
.relational-caregiver form { display: grid; gap: 12px; }
.relational-caregiver label { display: grid; gap: 6px; }
.relational-caregiver input, .relational-caregiver select { width: 100%; min-width: 0; max-width: 100%; min-height: 44px; }
.relational-caregiver .relational-check { display: flex; align-items: center; gap: 10px; min-height: 44px; }
.relational-caregiver .relational-check input { flex: 0 0 20px; width: 20px; min-height: 20px; }
.relational-caregiver button { min-height: 44px; }

.relational-caregiver-proposals { padding: 18px; }
.relational-caregiver-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 10px; }
.relational-caregiver-head span { color: var(--n-color-text-secondary); font-size: .64rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.relational-caregiver-head h2 { margin: 3px 0 0; font-size: 1.12rem; }

.caregiver-menu { display: grid; gap: 12px; }
.caregiver-menu-date { margin: 0; color: var(--n-color-text-secondary); font-size: .7rem; font-weight: 750; }
.caregiver-menu-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.caregiver-menu-card { min-width: 0; padding: 14px; border: 1px solid var(--n-color-border); border-radius: 13px; background: #fff; }
.relational-caregiver .caregiver-menu-card { border-top: 1px solid var(--n-color-border); }
.caregiver-menu-card > span { color: var(--n-color-brand-strong); font-size: .64rem; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.caregiver-menu-card h3 { margin: 5px 0; font-size: .88rem; }
.caregiver-menu-card > p, .caregiver-menu-card .relational-allergens { font-size: .7rem; line-height: 1.4; }
.caregiver-menu-portion { width: fit-content; padding: 4px 7px; border-radius: 999px; background: var(--n-color-brand-subtle); color: var(--n-color-brand-strong); font-weight: 750; }
.caregiver-menu-details, .caregiver-menu-alternatives { margin-top: 10px !important; border-top: 1px solid var(--n-color-border); }
.caregiver-menu-details > summary, .caregiver-menu-alternatives > summary { min-height: 36px !important; padding: 8px 0 0 !important; color: var(--n-color-brand-strong); font-size: .68rem; font-weight: 800; list-style: none; }
.caregiver-menu-details > summary::-webkit-details-marker, .caregiver-menu-alternatives > summary::-webkit-details-marker { display: none; }
.caregiver-menu-details > div, .caregiver-menu-alternatives > div { padding-top: 9px; }
.caregiver-menu-details h4 { margin: 8px 0 4px; font-size: .72rem; }
.caregiver-menu-details ul { margin: 0; padding-left: 17px; }
.caregiver-menu-details li, .caregiver-menu-details p { margin: 3px 0; color: var(--n-color-text-secondary); font-size: .68rem; line-height: 1.4; }
.caregiver-menu-alternatives section { padding: 9px 0; border-top: 1px solid var(--n-color-border); }
.caregiver-menu-alternatives section > span { color: var(--n-color-text-secondary); font-size: .62rem; font-weight: 750; text-transform: uppercase; }

@media (max-width: 640px), (hover: none) and (pointer: coarse) {
  .relational-caregiver-proposals { padding: 15px; }
  .caregiver-menu-grid { grid-template-columns: 1fr; }
}
