/* Share control (views/partials/share.php, assets/js/share.js). Built on the
   theme tokens so it reads in both themes; every target is at least 44px. */
.share{ position:relative; display:inline-flex; vertical-align:middle; }
.share-details > summary{ list-style:none; }
.share-details > summary::-webkit-details-marker{ display:none; }

.share-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.45rem;
  min-height:44px; padding:0 1.1rem 0 .95rem; border-radius:var(--radius-pill);
  border:1px solid var(--line-2); background:transparent; color:var(--ink-soft);
  font-family:var(--sans); font-size:.9rem; font-weight:500; line-height:1; cursor:pointer;
  transition:color 120ms var(--ease), border-color 120ms var(--ease), background-color 120ms var(--ease), transform 100ms var(--ease);
}
.share-btn:hover{ color:var(--ink); border-color:var(--ink-soft); }
.share-btn:active{ transform:scale(.97); }
.share-btn[aria-expanded="true"], .share-details[open] > .share-btn{ color:var(--ink); border-color:var(--ink-soft); background:var(--surface-2); }
.share-icon{ flex:none; }
.share-btn--icon{ width:44px; padding:0; }
.share-btn--icon .share-icon{ stroke-width:1.8; }

/* Without JavaScript the list opens in the flow of the page. */
.share-details{ display:block; }
.share-details .share-pop{ margin-top:.5rem; }

/* With JavaScript it floats under the button, opening toward the side that
   has room (share--flip is set by share.js when the first choice would
   leave the screen). */
.share > .share-pop{
  position:absolute; top:calc(100% + .5rem); z-index:40;
  inset-inline-end:0;
  transform-origin:top right;
  animation:share-in 140ms var(--ease);
}
.share--start > .share-pop, .share--end.share--flip > .share-pop{ inset-inline-start:0; inset-inline-end:auto; transform-origin:top left; }
.share--start.share--flip > .share-pop{ inset-inline-start:auto; inset-inline-end:0; transform-origin:top right; }
.share-pop[hidden]{ display:none; }

.share-pop{
  width:max-content; min-width:13rem; max-width:min(18rem, calc(100vw - 32px));
  padding:.5rem; border-radius:var(--radius); background:var(--surface);
  border:1px solid var(--line-2); box-shadow:var(--shadow-sm);
}
.share-pop-title{ margin:0; padding:.45rem .75rem .35rem; font-family:var(--sans); font-size:.8rem; font-weight:600; color:var(--ink-mute); }
.share-list{ list-style:none; margin:0; padding:0; }
.share-list li{ margin:0; }
.share-item{
  display:flex; align-items:center; width:100%; min-height:44px; padding:0 .75rem;
  border:0; border-radius:var(--radius-sm); background:none; color:var(--ink);
  font-family:var(--sans); font-size:.95rem; text-align:start; text-decoration:none; cursor:pointer;
}
.share-item:hover, .share-item:focus-visible{ background:var(--surface-2); color:var(--ink); }
/* Inside article and About prose, the prose link and paragraph styles must
   not reach the menu. */
.prose .share a.share-item{ color:var(--ink); border-bottom:0; }
.prose .share p{ margin-bottom:0; }
.prose .share p.share-pop-title{ color:var(--ink-mute); }
.share-status{ margin:0; padding:0 .75rem; font-size:.85rem; color:var(--ink-soft); overflow-wrap:anywhere; }
.share-status:not(:empty){ padding-block:.4rem .3rem; }

@keyframes share-in{
  from{ opacity:0; transform:scale(.96) translateY(-4px); }
  to{ opacity:1; transform:none; }
}
@media (prefers-reduced-motion:reduce){
  .share > .share-pop{ animation:none; }
  .share-btn{ transition:none; }
  .share-btn:active{ transform:none; }
}
@media (prefers-contrast:more){
  .share-btn, .share-pop{ border-color:var(--ink-mute); }
}

/* Placement on the pages that carry it. */
.share-head-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:.6rem 1rem; }
.article-share{ display:flex; align-items:center; gap:1rem; margin-top:1rem; }
.article-share-end{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; }
.prose .article-share-end > p{ margin:0; }
.about-share{ margin-top:var(--sp-3, 1.5rem); }