/* 看圖美化：eat（_build/polish.py） */
body .c-demo-banner {
  justify-content: flex-start;
  gap: var(--sp-3);
  margin-bottom: var(--sp-5);
  padding: var(--sp-3) var(--sp-4);
  border: 1px solid var(--border);
  border-radius: var(--r-input);
  line-height: var(--lh-footnote);
}
body .c-demo-banner > svg,
body .c-demo-banner > .c-icon { flex: none; }
body .c-demo-banner .c-btn {
  flex: none;
  margin-left: auto;
  padding: 0 var(--sp-4);
  font-size: var(--fs-callout);
  white-space: nowrap;
}

body .s-eat { display: block; }
body .s-eat > .l-side {
  display: flex;
  flex-direction: column;
  gap: var(--sp-5);
  min-width: 0;
}

body .s-eat__head {
  flex-direction: column;
  align-items: flex-start;
  gap: var(--sp-3);
  margin-bottom: var(--sp-5);
}
body .s-eat__title {
  font-size: var(--fs-title1);
  letter-spacing: var(--ls-title);
}

body .s-eat .c-edu-tag {
  align-self: flex-start;
  max-width: 100%;
  padding: 5px var(--sp-3);
  border-radius: var(--r-sm);
  background: var(--surface-2);
  border: 1px solid var(--divider);
  color: var(--text-2);
  font-size: var(--fs-caption);
  line-height: var(--lh-footnote);
  text-align: left;
  font-variant-numeric: tabular-nums;
}
body .s-eat__foot {
  margin-top: var(--sp-8);
  padding-top: var(--sp-4);
}
body .s-eat__foot .c-edu-tag {
  padding-inline: 0;
  background: transparent;
  border-color: transparent;
  color: var(--text-3);
}

/* 手機：晶片列滑到螢幕邊緣，首個晶片與標題對齊 */
body .s-eat__nav {
  gap: var(--sp-2);
  margin: 0 calc(var(--page-x) * -1);
  padding: 5px var(--page-x);
  scroll-padding-inline: var(--page-x);
}
body .s-eat__nav > .c-scene-chip {
  min-height: 40px;
  padding-inline: var(--sp-4);
  font-size: var(--fs-callout);
  font-weight: 500;
  white-space: nowrap;
}
body .s-eat__nav > .c-scene-chip.is-active,
body .s-eat__nav > .c-scene-chip[aria-pressed="true"] {
  font-weight: 600;
}

body .s-eat__main { gap: var(--sp-6); }

/* 空狀態：更像邀請，而不是一塊灰框 */
body .s-eat__main > .c-card--flat:first-child:last-child {
  padding: var(--sp-6);
  background: var(--primary-tint);
  border: 1px dashed var(--border);
}
body .s-eat__main > .c-card--flat:first-child:last-child .s-eat__h {
  margin-bottom: var(--sp-2);
  color: var(--primary-strong);
}
body .s-eat__main > .c-card--flat:first-child:last-child .s-eat__text {
  max-width: 44ch;
}

/* 餐別選擇 */
body .s-eat__main .c-seg { display: grid; width: 100%; }

/* 組合卡：動作列貼底，卡片等高 */
body .s-eat__combo { display: flex; flex-direction: column; }
body .s-eat__combo .s-eat__actions { margin-top: auto; }
body .s-eat__combo .s-eat__h3 { font-size: var(--fs-title3); line-height: var(--lh-title3); margin-bottom: var(--sp-3); }

/* 常吃組合 */
body .c-fav.c-card { padding: var(--sp-4); gap: var(--sp-3) var(--sp-4); }
body .c-fav--row.c-fav { padding: var(--sp-2) var(--sp-2) var(--sp-2) var(--sp-4); }

/* 平板 */
@media (min-width: 600px) {
  body .s-eat__head {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-2) var(--sp-4);
  }
  body .s-eat__nav {
    margin: 0;
    padding: 0;
    gap: var(--sp-2) var(--sp-2);
  }
  body .s-eat__main .c-seg { display: inline-grid; width: auto; min-width: 320px; max-width: 100%; }
}

/* 桌面：左側情境清單、右側內容 */
@media (min-width: 1024px) and (min-height: 501px), (min-width: 1024px) and (orientation: portrait) {
  body .s-eat > .l-side {
    display: grid;
    grid-template-columns: minmax(232px, 272px) minmax(0, 1fr);
    gap: var(--sp-8);
    align-items: start;
  }
  body .s-eat__head { margin-bottom: var(--sp-6); }
  body .s-eat__nav {
    gap: 2px;
    padding: var(--sp-3) var(--sp-2) var(--sp-2);
    margin: 0;
  }
  body .s-eat__nav::before {
    content: "用餐情境";
    padding: 0 var(--sp-4) var(--sp-2);
    font-size: var(--fs-caption);
    line-height: var(--lh-caption);
    font-weight: 600;
    letter-spacing: var(--ls-caption);
    color: var(--text-3);
  }
  body .s-eat__nav > .c-scene-chip {
    min-height: 44px;
    font-size: var(--fs-callout);
    color: var(--text-2);
    background: transparent;
  }
  body .s-eat__nav > .c-scene-chip.is-active,
  body .s-eat__nav > .c-scene-chip[aria-pressed="true"] {
    background: var(--primary-soft);
    color: var(--primary);
    box-shadow: inset 3px 0 0 var(--primary);
  }
}

/* 手機橫式：維持橫向捲動 */
@media (orientation: landscape) and (max-height: 500px) {
  body .s-eat__nav {
    flex-wrap: nowrap;
    overflow-x: auto;
    margin: 0 calc(var(--page-x) * -1);
    padding: 5px var(--page-x);
  }
}

@media (hover: hover) and (pointer: fine) {
  body .s-eat__nav > .c-scene-chip.is-active:hover,
  body .s-eat__nav > .c-scene-chip[aria-pressed="true"]:hover {
    border-color: transparent;
  }
}