/* --------------------------------------------------------------------------
   Health Captain — WordPress-only styles.

   assets/css/main.css is the shared design system and is copied verbatim from
   the static site. Everything here exists purely because WordPress emits it:
   alignment classes, captions, galleries, block-editor utilities, comments.
   Values reference main.css's custom properties so the two never drift.
   -------------------------------------------------------------------------- */

/* ------------------------------------------------------------ accessibility */
.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%);
  white-space: nowrap; border: 0;
}
.screen-reader-text:focus {
  position: fixed !important;
  top: 12px; left: 12px;
  width: auto; height: auto;
  padding: 12px 20px; margin: 0;
  clip: auto; clip-path: none;
  background: var(--white); color: var(--navy);
  border-radius: var(--r-sm); box-shadow: var(--shadow-lg);
  z-index: 200; font-weight: 700;
}

/* -------------------------------------------------------------- alignment */
.alignleft {
  float: left;
  margin: 0 var(--sp-5) var(--sp-4) 0;
  max-width: 50%;
}
.alignright {
  float: right;
  margin: 0 0 var(--sp-4) var(--sp-5);
  max-width: 50%;
}
.aligncenter {
  display: block;
  margin-inline: auto;
  margin-block: var(--sp-5);
}
.alignnone { margin-block: var(--sp-5); }

.article-body .alignwide {
  max-width: min(1100px, 92vw);
  margin-inline: calc(50% - min(550px, 46vw));
}
.article-body .alignfull {
  max-width: 100vw;
  margin-inline: calc(50% - 50vw);
  border-radius: 0;
}

@media (max-width: 640px) {
  .alignleft, .alignright { float: none; margin-inline: 0; max-width: 100%; }
  .article-body .alignwide, .article-body .alignfull { max-width: 100%; margin-inline: 0; }
}

/* ---------------------------------------------------------------- captions */
.wp-caption {
  max-width: 100%;
  margin-bottom: var(--sp-5);
}
.wp-caption img,
.wp-caption .wp-caption-text { max-width: 100%; }
.wp-caption img { border-radius: var(--r-md); display: block; }
.wp-caption-text,
.wp-element-caption,
figcaption {
  font-size: var(--fs-sm);
  color: var(--ink-muted);
  margin-top: var(--sp-2);
  line-height: 1.5;
}

/* ----------------------------------------------------------------- sticky */
.sticky .card,
.card.sticky { border-color: var(--gold); }
.sticky .card__title::before,
.hc-article.sticky h1::before {
  content: "★";
  color: var(--gold);
  margin-right: 8px;
}

/* ------------------------------------------------------------------ blocks */
.wp-block-image { margin-block: var(--sp-6); }
.wp-block-image img { max-width: 100%; height: auto; border-radius: var(--r-md); }
.wp-block-image.is-style-rounded img { border-radius: 50%; }

.wp-block-quote,
blockquote.wp-block-quote {
  border: 0;
  border-left: 5px solid var(--gold);
  background: linear-gradient(100deg, rgba(244, 185, 66, 0.1), transparent);
  padding: var(--sp-5) var(--sp-6);
  border-radius: 0 var(--r-md) var(--r-md) 0;
  font-size: var(--fs-lg);
  font-weight: 600;
  color: var(--navy);
  line-height: 1.45;
  margin-block: var(--sp-6);
}
.wp-block-quote cite,
.wp-block-pullquote cite {
  display: block;
  margin-top: var(--sp-3);
  font-size: var(--fs-sm);
  font-weight: 600;
  font-style: normal;
  color: var(--ink-muted);
}
.wp-block-pullquote {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: var(--sp-6) 0;
  text-align: center;
}

.wp-block-code,
.wp-block-preformatted,
pre {
  background: var(--slate-100);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: var(--sp-4) var(--sp-5);
  overflow-x: auto;
  font-size: var(--fs-sm);
  line-height: 1.6;
}
code, kbd, samp { font-size: 0.94em; }
:not(pre) > code {
  background: var(--slate-100);
  border-radius: 5px;
  padding: 2px 6px;
}

.wp-block-table { overflow-x: auto; }
.wp-block-table table { width: 100%; border-collapse: collapse; }
.wp-block-table figcaption { text-align: left; }

.wp-block-separator {
  border: 0;
  border-top: 1px solid var(--line);
  margin-block: var(--sp-7);
}
.wp-block-separator.is-style-wide { width: 100%; }
.wp-block-separator.is-style-dots { border: 0; text-align: center; }

.wp-block-button__link,
.wp-element-button {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 8px; min-height: 44px; padding: 12px 22px;
  border-radius: var(--r-pill); border: 0;
  background: var(--blue); color: #fff;
  font-weight: 700; text-decoration: none; cursor: pointer;
}
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  border: 1px solid var(--line-strong);
  color: var(--navy);
}

.wp-block-embed { margin-block: var(--sp-6); }
.wp-block-embed__wrapper { position: relative; }
.wp-block-embed iframe { max-width: 100%; border-radius: var(--r-md); }

.wp-block-group.has-background { padding: var(--sp-6); border-radius: var(--r-md); }

.wp-block-columns { display: flex; flex-wrap: wrap; gap: var(--sp-5); }
.wp-block-column { flex: 1 1 260px; min-width: 0; }

.wp-block-media-text {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-6);
  align-items: center;
}
@media (max-width: 640px) {
  .wp-block-media-text { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------- galleries */
.wp-block-gallery.has-nested-images,
.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--sp-4);
  margin-block: var(--sp-6);
}
.gallery-item { margin: 0; }
.gallery img { width: 100%; height: auto; border-radius: var(--r-sm); display: block; }
.gallery-caption { font-size: var(--fs-xs); color: var(--ink-muted); }
.wp-block-gallery.has-nested-images figure.wp-block-image img { border-radius: var(--r-sm); }

/* ------------------------------------- block editor colour + size utilities */
.has-text-align-left { text-align: left; }
.has-text-align-center { text-align: center; }
.has-text-align-right { text-align: right; }

.has-small-font-size { font-size: var(--fs-sm); }
.has-medium-font-size { font-size: var(--fs-md); }
.has-large-font-size { font-size: var(--fs-lg); }
.has-x-large-font-size { font-size: var(--fs-xl); }
.has-xx-large-font-size { font-size: var(--fs-2xl); }

.has-navy-color { color: var(--navy); }
.has-navy-background-color { background-color: var(--navy); }
.has-blue-color { color: var(--blue); }
.has-blue-background-color { background-color: var(--blue); }
.has-teal-color { color: var(--teal); }
.has-teal-background-color { background-color: var(--teal); }
.has-gold-color { color: var(--gold); }
.has-gold-background-color { background-color: var(--gold); }
.has-green-color { color: var(--green-600); }
.has-green-background-color { background-color: var(--green-600); }
.has-slate-color { color: var(--slate); }
.has-slate-background-color { background-color: var(--slate-100); }
.has-white-color { color: #fff; }
.has-white-background-color { background-color: #fff; }

.has-drop-cap:first-letter {
  float: left;
  font-size: 3.4em;
  line-height: 0.78;
  font-weight: 900;
  margin: 6px 10px 0 0;
  color: var(--blue-700);
}

/* ---------------------------------------------------------------- comments */
.hc-comments { max-width: 72ch; }
.comment-list { list-style: none; margin: 0; padding: 0; }
.comment-list ol.children {
  list-style: none;
  margin: var(--sp-4) 0 0;
  padding-left: var(--sp-5);
  border-left: 2px solid var(--line);
  display: grid;
  gap: var(--sp-4);
}
.comment-body {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: var(--sp-5);
}
.comment-author {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  font-weight: 700;
  color: var(--navy);
  font-size: var(--fs-sm);
}
.comment-author img,
.comment-body .avatar,
.hc-avatar { border-radius: 50%; }
.comment-metadata {
  font-size: var(--fs-xs);
  color: var(--ink-muted);
  margin-top: 4px;
}
.comment-metadata a { color: inherit; }
.comment-content { margin-top: var(--sp-3); font-size: var(--fs-sm); line-height: 1.7; }
.comment-content > * + * { margin-top: var(--sp-3); }
.comment-reply-link {
  display: inline-block;
  margin-top: var(--sp-3);
  font-weight: 700;
  font-size: var(--fs-sm);
  color: var(--blue-600);
  text-decoration: none;
}
.comment-reply-link:hover { text-decoration: underline; }
.comment-awaiting-moderation { font-size: var(--fs-xs); color: var(--ink-muted); }
.bypostauthor > .comment-body { border-color: var(--teal); }
.comment-respond { margin-top: var(--sp-7); }
.comment-reply-title small { font-size: var(--fs-sm); font-weight: 600; margin-left: var(--sp-3); }
.hc-comment-form .form-submit { margin-top: var(--sp-4); }

/* ------------------------------------------------------------- misc/WP core */
.post-password-form input[type="password"] {
  padding: 12px 14px;
  border: 1px solid var(--line-strong);
  border-radius: var(--r-sm);
  min-height: 48px;
}
.hc-hero-image { display: block; }
.hc-article .article-body > .wp-block-image:first-child { margin-top: 0; }

/* Reading progress + active TOC state, driven by assets/js/theme.js. */
.hc-progress {
  position: fixed; inset: 0 0 auto 0; height: 3px; z-index: 90;
  background: linear-gradient(90deg, var(--blue), var(--teal));
  transform-origin: 0 50%; transform: scaleX(0);
}
.toc a[aria-current="true"] { color: var(--blue-700); }
.toc a[aria-current="true"]::before { color: var(--blue-700); }

@media print {
  .utility-bar, .site-header, .mobile-nav, .search-overlay,
  .floating-play, .site-footer, .share-row, .hc-progress,
  .comment-respond { display: none !important; }
  .article-body { max-width: none; }
}
