/* ==========================================================================
   APHA /web — Share bar + Poster modal  (share.css)
   Version: 20261013.2  (bump on every change!)
   Zero external dependencies. Consumes --apha-* design tokens from site.css.
   Modules: ap-share (inline bar under article title) / ap-psm (poster modal:
   desktop centered card, mobile bottom sheet) — WCAG: 44px targets,
   :focus-visible rings, prefers-reduced-motion honored.
   ========================================================================== */

/* ---------- 1. inline share bar ---------- */
.ap-share{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  margin:16px 0 22px;padding:12px 0;
  border-top:1px solid var(--apha-line-soft);
  border-bottom:1px solid var(--apha-line-soft);
}
.ap-share-label{
  font-family:var(--apha-font-display);
  font-size:.78rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--apha-gold);margin-right:4px;white-space:nowrap;
}
.ap-share-btn{
  display:inline-flex;align-items:center;gap:8px;min-height:44px;
  padding:8px 18px;border:1.5px solid var(--apha-line);border-radius:999px;
  background:var(--apha-white);color:var(--apha-ink);
  font-family:var(--apha-font-body);font-size:.95rem;font-weight:600;line-height:1;
  cursor:pointer;
  transition:color .2s var(--apha-ease),border-color .2s var(--apha-ease),
             background-color .2s var(--apha-ease),box-shadow .2s var(--apha-ease);
}
.ap-share-btn svg{flex:none;color:var(--apha-muted);transition:color .2s var(--apha-ease)}
.ap-share-btn:hover,
.ap-share-btn:focus-visible{
  color:var(--apha-primary-dark);border-color:var(--apha-primary);
  background:var(--apha-bg-soft);box-shadow:var(--apha-shadow-sm);
}
.ap-share-btn:hover svg{color:var(--apha-primary)}
.ap-share-btn:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(42,122,229,.30)}
.ap-share-btn:active{background:var(--apha-bg)}

/* ---------- 2. poster modal (ap-psm) ---------- */
.ap-psm{
  position:fixed;inset:0;z-index:var(--apha-z-modal);
  display:flex;align-items:center;justify-content:center;padding:24px;
}
.ap-psm[hidden]{display:none}
.ap-psm-scrim{
  position:absolute;inset:0;border:0;padding:0;cursor:default;
  background:rgba(15,28,54,.80);
}
.ap-psm-card{
  position:relative;display:flex;flex-direction:column;
  width:min(432px,100%);max-height:min(88vh,940px);
  background:var(--apha-white);border-radius:var(--apha-radius);
  box-shadow:var(--apha-shadow-lg);overflow:hidden;
  animation:ap-psm-in .28s var(--apha-ease);
}
@keyframes ap-psm-in{
  from{opacity:0;transform:translateY(18px) scale(.98)}
  to{opacity:1;transform:none}
}
.ap-psm-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 12px 12px 18px;border-bottom:1px solid var(--apha-line-soft);
}
.ap-psm-title{
  margin:0;font-family:var(--apha-font-display);font-weight:700;
  font-size:1.02rem;color:var(--apha-ink);
}
.ap-psm-close{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;flex:none;border:0;border-radius:50%;
  background:transparent;color:var(--apha-muted);cursor:pointer;
  transition:background-color .2s var(--apha-ease),color .2s var(--apha-ease);
}
.ap-psm-close:hover,.ap-psm-close:focus-visible{background:var(--apha-bg);color:var(--apha-ink)}
.ap-psm-close:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(42,122,229,.30)}
.ap-psm-body{
  flex:1;margin:0;padding:18px;overflow:auto;
  background:var(--apha-bg);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
}
.ap-psm-img{
  max-width:100%;height:auto;display:block;
  border-radius:10px;box-shadow:var(--apha-shadow-md);
  opacity:0;transition:opacity .25s ease;
}
.ap-psm-img.is-ready{opacity:1}
.ap-psm-spin{
  width:34px;height:34px;border-radius:50%;
  border:3px solid var(--apha-line);border-top-color:var(--apha-primary);
  animation:ap-psm-rot .8s linear infinite;
}
.ap-psm[hidden] .ap-psm-spin{animation:none}
@keyframes ap-psm-rot{to{transform:rotate(360deg)}}
.ap-psm-status{margin:0;font-size:.9rem;color:var(--apha-muted);text-align:center}
.ap-psm-foot{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:14px 18px;border-top:1px solid var(--apha-line-soft);
}
.ap-psm-dl{
  display:inline-flex;align-items:center;gap:8px;min-height:44px;
  padding:10px 20px;border-radius:var(--apha-radius-sm);
  background:var(--apha-primary);color:var(--apha-white);
  font-size:.95rem;font-weight:600;line-height:1;text-decoration:none;cursor:pointer;
  transition:background-color .2s var(--apha-ease),box-shadow .2s var(--apha-ease);
}
.ap-psm-dl:hover,.ap-psm-dl:focus-visible{background:var(--apha-primary-dark);box-shadow:var(--apha-shadow-sm)}
.ap-psm-dl:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(42,122,229,.30)}
.ap-psm-hint{flex:1;min-width:0;font-size:.8rem;line-height:1.5;color:var(--apha-muted)}

/* ---------- 3. dark hero variant (deep background, e.g. doctor profile hero) ---------- */
.ap-share--hero{
  border-top-color:rgba(255,255,255,.22);
  border-bottom-color:rgba(255,255,255,.22);
}
.ap-share--hero .ap-share-btn{
  background:transparent;color:var(--apha-white);
  border-color:rgba(255,255,255,.45);
}
.ap-share--hero .ap-share-btn svg{color:rgba(255,255,255,.75)}
.ap-share--hero .ap-share-btn:hover,
.ap-share--hero .ap-share-btn:focus-visible{
  color:var(--apha-white);border-color:var(--apha-white);
  background:rgba(255,255,255,.14);box-shadow:none;
}
.ap-share--hero .ap-share-btn:hover svg{color:var(--apha-white)}
.ap-share--hero .ap-share-btn:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(255,255,255,.35)}
.ap-share--hero .ap-share-btn:active{background:rgba(255,255,255,.22)}

/* ---------- 4. mobile: bottom sheet ---------- */
@media (max-width:620px){
  .ap-psm{padding:0;align-items:flex-end}
  .ap-psm-card{
    width:100%;max-height:92vh;border-radius:var(--apha-radius) var(--apha-radius) 0 0;
    animation:ap-psm-sheet .3s var(--apha-ease);
  }
  @keyframes ap-psm-sheet{
    from{transform:translateY(100%)}
    to{transform:none}
  }
  .ap-psm-body{padding:14px}
}

/* ---------- 5. reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .ap-share-btn,.ap-share-btn svg,.ap-psm-card,.ap-psm-img,.ap-psm-close,.ap-psm-dl{transition:none;animation:none}
  .ap-psm-spin{animation-duration:1.6s}
}