/* ==========================================================================
   share.css: the share block (copy link, LinkedIn, X, WhatsApp) of essays, books,
   field guides and terms. Token-agnostic: the site tokens (--t1, --b2 ...), the books'
   tokens (--text-1, --border-strong ...) and plain fallbacks, so one sheet serves every page.
   ========================================================================== */
.share {
  --sh-fg: var(--t1, var(--text-1, #1d1d1f));
  --sh-mute: var(--t3, var(--text-3, #6e6e73));
  --sh-line: var(--b1, var(--border, rgba(0, 0, 0, .10)));
  --sh-line2: var(--b2, var(--border-strong, rgba(0, 0, 0, .20)));
  --sh-acc: var(--acc, var(--accent-text, #167332));
  --sh-acc-line: var(--acc-line, var(--accent-border, rgba(26, 127, 55, .40)));
  --sh-hover: var(--s2, #f2f2f5);
  margin-block-start: 48px;
  padding-block-start: 32px;
  border-block-start: 1px solid var(--sh-line);
  clear: both;
}
.share-title { margin: 0; font-size: .8125rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--sh-mute); }
:lang(ar) .share-title { letter-spacing: 0; text-transform: none; font-size: .9375rem; }
.share-list { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 0 !important; padding: 0 !important; list-style: none; }
.share-list li { margin: 0 !important; padding: 0 !important; }
.share-list li::before { content: none !important; }
.no-js .share-copy { display: none; }
.share-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--sh-line2);
  background: transparent;
  color: var(--sh-fg);
  font: inherit;
  font-size: .9375rem;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  transition: border-color 150ms, background-color 150ms;
}
.share-btn:hover { border-color: var(--sh-acc-line); background: var(--sh-hover); text-decoration: none; }
.share-btn:focus-visible { outline: 2px solid var(--sh-acc); outline-offset: 2px; }
.share-btn .i { width: 18px; height: 18px; flex: none; }
.share-btn.is-done { border-color: var(--sh-acc); color: var(--sh-acc); }
.share-status { min-height: 1.5em; margin: 8px 0 0 !important; font-size: .875rem; color: var(--sh-acc); }
/* the new-tab hint: read by screen readers, never drawn */
.share .vh { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
@media print { .share { display: none !important; } }