/**
Theme Name: Astra Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/

:root {
  --ink: #202122;
  --text: #3a3f45;
  --muted: #6b7178;
  --link: #2f5f8c;
  --link-hover: #1d4466;
  --brand: #3d6e9c;
  --warn: #a8291c;
  --warn-line: #e2b4ac;
  --warn-bg: #fdf7f6;
  --good: #2c6e49;
  --line: #d7dbe0;
  --line-strong: #a9b0b8;
  --panel: #f7f8f9;
  --font-ui: -apple-system, BlinkMacSystemFont, "PingFang TC", "Microsoft JhengHei", "Noto Sans TC", "Segoe UI", sans-serif;
  --wrap: 1140px;
  --wrap-narrow: 820px;
  --pad: 20px;
}

/* Layout ------------------------------------------------------------------ */

.o-wrap {
  max-width: calc(var(--wrap) + var(--pad) * 2);
  margin: 0 auto;
  padding: 0 var(--pad);
}
.o-wrap--narrow { max-width: calc(var(--wrap-narrow) + var(--pad) * 2); }

.u-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.c-home,
.c-entry,
.c-area-head,
.c-profile,
.c-section { font-family: var(--font-ui); color: var(--text); }

.c-home a,
.c-entry a,
.c-area-head a,
.c-profile a,
.c-section a { color: var(--link); text-decoration: none; }
.c-home a:hover,
.c-entry a:hover,
.c-area-head a:hover,
.c-profile a:hover,
.c-section a:hover { color: var(--link-hover); text-decoration: underline; }

.c-section { padding: 36px 0; }
.c-section + .c-section { padding-top: 8px; }
.c-section__title {
  margin: 0 0 16px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--line);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--ink);
}
.c-section__more { margin: 14px 0 0; font-size: 14px; }

.c-crumbs { margin-bottom: 14px; font-size: 13px; color: var(--muted); }
.c-crumbs a { color: var(--muted); }

.c-photo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border-radius: 50%;
  object-fit: cover;
  background: #e4e7eb;
  color: var(--muted);
  font-weight: 700;
}
.c-photo--xs { width: 22px; height: 22px; font-size: 11px; }
.c-photo--sm { width: 28px; height: 28px; font-size: 12px; }
.c-photo--md { width: 56px; height: 56px; font-size: 20px; }
.c-photo--lg { width: 120px; height: 120px; font-size: 42px; }

/* Search */
.c-search { display: flex; max-width: 560px; }
.c-search .c-search__input {
  flex: 1;
  min-width: 0;
  height: 44px;
  margin: 0;
  padding: 0 12px;
  border: 1px solid var(--line-strong);
  border-right: 0;
  border-radius: 2px 0 0 2px;
  background: #fff;
  font-size: 16px;
  color: var(--ink);
  box-shadow: none;
}
.c-search .c-search__input:focus { outline: 2px solid var(--brand); outline-offset: -1px; }
.c-search .c-search__button {
  height: 44px;
  margin: 0;
  padding: 0 22px;
  border: 1px solid var(--brand);
  border-radius: 0 2px 2px 0;
  background: var(--brand);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
}
.c-search .c-search__button:hover { background: var(--link-hover); border-color: var(--link-hover); }

/* Entry lists -------------------------------------------------------------- */

.c-list { list-style: none; margin: 0; padding: 0; }
.c-list--2col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; }
.c-item { margin: 0; padding: 14px 0; border-bottom: 1px solid var(--line); }
.c-item__title { margin: 0; font-size: 17px; font-weight: 700; line-height: 1.5; }
.c-item__text { margin: 4px 0 0; font-size: 15px; line-height: 1.7; }
.c-item__meta { margin: 4px 0 0; font-size: 13px; color: var(--muted); }

.c-empty { margin: 0 0 14px; color: var(--muted); }

.c-inline-links { margin: 12px 0 0; font-size: 15px; line-height: 1.9; }
.c-inline-links span { color: var(--muted); }

.c-pages { margin-top: 24px; }
.c-pages .nav-links { display: flex; flex-wrap: wrap; gap: 4px; }
.c-pages .page-numbers {
  min-width: 36px;
  height: 36px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: 2px;
  color: var(--link);
  text-decoration: none;
}
.c-pages .page-numbers.current { border-color: var(--ink); color: var(--ink); font-weight: 700; }

/* Home --------------------------------------------------------------------- */

.c-hero { padding: 36px 0 32px; border-bottom: 1px solid var(--line); }
.c-hero__title { margin: 0 0 18px; font-size: clamp(26px, 3.4vw, 32px); font-weight: 700; line-height: 1.4; color: var(--ink); }
.c-hero__note { margin: 10px 0 0; font-size: 13.5px; color: var(--muted); }

.c-bodymap { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 40px; align-items: start; }
.c-bodymap__figure { position: relative; width: 200px; margin: 0 auto; color: #d9e2ea; }
.c-bodymap__figure svg { display: block; width: 100%; height: auto; }
.c-home .c-bodymap__pin {
  position: absolute;
  transform: translate(-50%, -50%);
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--brand);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 22px;
  text-align: center;
  text-decoration: none;
}
.c-home .c-bodymap__pin:hover,
.c-home .c-bodymap__pin:focus-visible { background: var(--warn); color: #fff; text-decoration: none; }

.c-bodymap__list {
  margin: 0;
  padding: 0 0 0 1.6em;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 40px;
}
.c-area { padding: 10px 0; border-bottom: 1px solid var(--line); }
.c-area::marker { color: var(--muted); font-size: 14px; }
.c-area__name { font-size: 16px; font-weight: 700; }
.c-area__count { margin-left: 6px; font-size: 13px; color: var(--muted); }
.c-area__examples { margin: 2px 0 0; font-size: 13.5px; line-height: 1.6; color: var(--muted); }

.c-redflags { padding: 16px 20px; border: 1px solid var(--warn-line); background: var(--warn-bg); }
.c-redflags__title { margin: 0 0 4px; font-size: 18px; font-weight: 700; color: var(--warn); }
.c-redflags__head p { margin: 0 0 10px; font-size: 14.5px; }
.c-redflags__list { margin: 0; padding-left: 1.3em; columns: 2; column-gap: 40px; }
.c-redflags__list li { margin: 0 0 4px; color: var(--ink); break-inside: avoid; }

.c-team { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 16px 40px; }
.c-team__member { display: flex; align-items: center; gap: 12px; }
.c-team__name { display: block; font-weight: 700; }
.c-team__position { display: block; font-size: 13px; color: var(--muted); }

.c-updates { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 40px; }
.c-updates__item { display: flex; gap: 12px; padding: 7px 0; break-inside: avoid; font-size: 15px; }
.c-updates__item time { flex-shrink: 0; font-size: 13px; color: var(--muted); font-variant-numeric: tabular-nums; padding-top: 2px; }
.c-updates__area { flex-shrink: 0; font-size: 13px; color: var(--muted); padding-top: 2px; }
.c-updates__item a { flex: 1; }

/* Area, search, profile headers ------------------------------------------- */

.c-area-head { padding: 28px 0 22px; border-bottom: 1px solid var(--line); }
.c-area-head__title { margin: 0; font-size: clamp(26px, 3.2vw, 30px); font-weight: 700; line-height: 1.4; color: var(--ink); }
.c-area-head__count { margin: 2px 0 0; font-size: 14px; color: var(--muted); }
.c-area-head__text { margin-top: 12px; max-width: 46em; }
.c-area-head__text p { margin: 0; }
.c-area-head--search .c-search { margin-top: 14px; }

.c-profile { padding: 32px 0 28px; border-bottom: 1px solid var(--line); }
.c-profile__card { display: flex; gap: 28px; align-items: flex-start; }
.c-profile__name { margin: 0; font-size: 28px; font-weight: 700; color: var(--ink); }
.c-profile__position { margin: 2px 0 0; font-weight: 700; color: var(--text); }
.c-profile__license { margin: 0; font-size: 14px; color: var(--muted); }
.c-profile__bio { margin-top: 12px; }
.c-profile__bio p { margin: 0 0 .6em; }

/* Entry -------------------------------------------------------------------- */

.c-entry__head { padding: 26px 0 0; }
.c-entry__cat { font-size: 14px; }
.c-entry__title { margin: 6px 0 16px; font-size: clamp(26px, 3.4vw, 32px); font-weight: 700; line-height: 1.4; color: var(--ink); }
.c-lead { margin: 0 0 16px; font-size: 18px; line-height: 1.85; color: var(--ink); }

.c-credits {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 18px;
  padding: 10px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  font-size: 14px;
}
.c-credits__person { display: flex; align-items: center; gap: 8px; }
.c-credits__person small { margin-left: 4px; font-size: 13px; color: var(--muted); }
.c-credits__dates { margin: 0 0 0 auto; font-size: 13px; color: var(--muted); }

.c-entry__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 48px;
  padding-top: 28px;
  padding-bottom: 56px;
}
.c-entry__main { min-width: 0; max-width: var(--wrap-narrow); }
.c-entry__side > * + * { margin-top: 28px; }
.c-entry__side { position: sticky; top: 20px; align-self: start; }

.c-toc { padding: 10px 16px 12px; border: 1px solid var(--line); background: var(--panel); font-size: 14px; }
.c-toc__title { margin: 0 0 4px; font-weight: 700; color: var(--ink); }
.c-toc__list { margin: 0; padding-left: 1.4em; }
.c-toc__list li { margin: 3px 0; line-height: 1.55; }
.c-toc__list li::marker { color: var(--muted); }
.c-toc--inline { display: none; margin-bottom: 20px; }
.c-toc--inline summary { cursor: pointer; font-weight: 700; color: var(--ink); }
.c-toc--inline[open] summary { margin-bottom: 4px; }

.c-related__title { margin: 0 0 6px; padding-bottom: 4px; border-bottom: 1px solid var(--line); font-size: 15px; font-weight: 700; color: var(--ink); }
.c-related__list { margin: 0; padding-left: 1.2em; font-size: 14px; }
.c-related__list li { margin: 5px 0; line-height: 1.55; }
.c-related__all { margin: 8px 0 0; font-size: 14px; }

.c-disclaimer { margin: 36px 0 0; padding-top: 12px; border-top: 1px solid var(--line); font-size: 13.5px; color: var(--muted); }

.c-entry__people { margin-top: 28px; }
.c-entry__people-title { margin: 0 0 4px; font-size: 15px; font-weight: 700; color: var(--ink); }
.c-person { display: flex; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.c-person__role { margin: 0; font-size: 13px; color: var(--muted); }
.c-person__name { margin: 0; font-size: 16px; }
.c-person__name a { font-weight: 700; }
.c-person__name span { margin-left: 8px; font-size: 14px; color: var(--muted); }
.c-person__license { margin: 0; font-size: 13px; color: var(--muted); }
.c-person__bio { margin: 6px 0 0; font-size: 14.5px; line-height: 1.75; }

/* Entry body (Astra .entry-content) ---------------------------------------- */

.c-prose { font-size: 16.5px; line-height: 1.9; color: var(--text); }
.c-prose > :first-child { margin-top: 0; }
.c-prose h2 {
  margin: 1.9em 0 .6em;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--line);
  font-size: 23px;
  font-weight: 700;
  line-height: 1.45;
  color: var(--ink);
}
.c-prose h3 { margin: 1.5em 0 .4em; font-size: 18px; font-weight: 700; color: var(--ink); }
.c-prose p { margin: 0 0 1em; }
.c-prose ul,
.c-prose ol { margin: 0 0 1.1em 1.4em; }
.c-prose li { margin-bottom: .25em; }
.c-prose a { color: var(--link); text-decoration: underline; text-underline-offset: 2px; }
.c-prose strong { color: var(--ink); }
.c-prose img { border-radius: 0; }

.c-prose table { width: 100%; margin: 0; border-collapse: collapse; font-size: 15px; line-height: 1.6; }
.c-prose th,
.c-prose td { padding: 8px 12px; border: 1px solid var(--line); text-align: left; vertical-align: top; }
.c-prose thead th { background: #eef0f2; color: var(--ink); font-weight: 700; white-space: nowrap; }
.c-prose figure.wp-block-table,
.c-nutrient-table { margin: 0 0 1.3em; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.c-prose figure.wp-block-table table,
.c-nutrient-table table { min-width: 520px; }
.c-nutrient-table figcaption,
.c-prose figure.wp-block-table figcaption { margin: 6px 0 0; font-size: 13px; color: var(--muted); }

/* 何時就醫 */
.c-see-doctor { margin: 0 0 1.3em; padding: 14px 18px 6px; border: 1px solid var(--warn-line); background: var(--warn-bg); }
.c-prose .c-see-doctor__title { margin: 0 0 6px; font-size: 16px; font-weight: 700; color: var(--warn); }
.c-prose .c-see-doctor ul { margin: 0 0 .6em 1.3em; }
.c-see-doctor li { color: var(--ink); }

/* 症狀卡：兩欄表格 */
.c-symptom-card { margin: 0 0 1.3em; border: 1px solid var(--line); border-bottom: 0; }
.c-symptom-card__row { display: grid; grid-template-columns: 8.5em minmax(0, 1fr); border-bottom: 1px solid var(--line); }
.c-prose .c-symptom-card__label { margin: 0; padding: 9px 12px; background: var(--panel); border-right: 1px solid var(--line); font-size: 15px; font-weight: 700; color: var(--ink); }
.c-symptom-card__value { padding: 9px 12px; font-size: 15.5px; }
.c-prose .c-symptom-card__value p { margin: 0; }
.c-prose .c-symptom-card__value ul { margin: 0 0 0 1.2em; }
.c-prose .c-symptom-card__value li { margin: 0; }

/* 可以多吃／先少吃 */
.c-eat-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 36px; margin: 0 0 1.3em; }
.c-prose .c-eat-list__col h3 { margin: 0 0 6px; padding-bottom: 4px; border-bottom: 2px solid currentColor; font-size: 16px; }
.c-eat-list__col--yes h3 { color: var(--good); }
.c-eat-list__col--no h3 { color: var(--muted); }
.c-prose .c-eat-list ul { margin: 0 0 0 1.2em; }
.c-prose .c-eat-list li { margin: 0 0 6px; font-size: 15.5px; line-height: 1.65; }
.c-eat-list li span { color: var(--muted); }
.c-eat-list li span::before { content: "：" }

/* 小提醒：一般段落，只把開頭粗體 */
.c-prose .c-tip { margin: 0 0 1em; }

/* FAQ */
.c-faq { margin: 0 0 1.3em; border-top: 1px solid var(--line); }
.c-faq details { border-bottom: 1px solid var(--line); }
.c-faq summary { padding: 10px 0; cursor: pointer; font-weight: 700; color: var(--ink); }
.c-faq details > div { padding: 0 0 10px 1.1em; }
.c-prose .c-faq details > div p { margin: 0; }

/* Yoast FAQ block */
.c-prose .schema-faq-section { padding: 10px 0; border-bottom: 1px solid var(--line); }
.c-prose .schema-faq-question { display: block; margin-bottom: 2px; font-weight: 700; color: var(--ink); }
.c-prose .schema-faq-answer { margin: 0; }

/* Footer notice ------------------------------------------------------------- */

.c-footer-notice { padding: 16px 0; border-top: 1px solid var(--line); font-family: var(--font-ui); }
.c-footer-notice p { margin: 0; font-size: 13px; line-height: 1.75; color: var(--muted); }

/* Responsive ---------------------------------------------------------------- */

@media (max-width: 1024px) {
  .c-entry__layout { grid-template-columns: minmax(0, 1fr); gap: 0; max-width: calc(var(--wrap-narrow) + var(--pad) * 2); }
  .c-entry__side .c-toc { display: none; }
  .c-toc--inline { display: block; }
  .c-entry__side { position: static; margin-top: 28px; }
  .c-bodymap { grid-template-columns: 200px minmax(0, 1fr); gap: 28px; }
  .c-bodymap__figure { width: 180px; }
  .c-bodymap__list { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 768px) {
  :root { --pad: 16px; }
  .c-section { padding: 28px 0; }
  .c-hero { padding: 28px 0 24px; }
  .c-list--2col { grid-template-columns: minmax(0, 1fr); }
  .c-bodymap { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .c-bodymap__figure { width: 160px; }
  .c-redflags__list,
  .c-updates { columns: 1; }
  .c-credits__dates { margin-left: 0; width: 100%; }
  .c-profile__card { gap: 18px; }
  .c-photo--lg { width: 84px; height: 84px; font-size: 30px; }
  .c-profile__name { font-size: 24px; }
  .c-eat-list { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .c-symptom-card__row { grid-template-columns: minmax(0, 1fr); }
  .c-prose .c-symptom-card__label { border-right: 0; border-bottom: 1px solid var(--line); padding: 7px 12px; }
  .c-prose { font-size: 16px; }
  .c-prose h2 { font-size: 21px; }
  .c-lead { font-size: 17px; }
  .c-search .c-search__button { padding: 0 16px; }
}
