/*
 * sf-share.css — blocul „Distribuie” (include/sf_share.php + js/sf-share.js).
 * Folosește tokenurile și butoanele din sf-theme.css (.sf-btn .sf-btn--outline .sf-btn--icon = cerc 44px, focus vizibil).
 * Variante: .sf-share--card (card în coloana laterală a paginii de centru) · .sf-share--inline (rând sub introducerea listelor).
 */

/* .sf-btn {display:inline-flex} ar câștiga în fața [hidden] din Bootstrap */
.sf-share [hidden] { display: none !important; }

.sf-share__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sf-space-2);
  margin: 0;
  padding: 0;
  list-style: none;
}
.sf-share__item { margin: 0; padding: 0; }
.sf-share a.sf-btn,
.sf-share a.sf-btn:hover,
.sf-share a.sf-btn:focus { text-decoration: none; color: var(--sf-navy); }

/* Butoane-icon: cerc conturat navy, iconuri monocrome */
.sf-share__btn.sf-btn--icon { background: transparent; }
.sf-share__btn.sf-btn--icon:hover,
.sf-share__btn.sf-btn--icon:focus-visible { background: var(--sf-navy-50); }
.sf-share__btn .sf-share__ico { width: 20px; height: 20px; }
.sf-share__btn--facebook .sf-share__ico { width: 21px; height: 21px; }
.sf-share__btn--x .sf-share__ico { width: 17px; height: 17px; }
.sf-share__btn--linkedin .sf-share__ico { width: 19px; height: 19px; }

/* Copiază linkul: icon „link” → „check” cât timp e afișat mesajul */
.sf-share__btn--copy .sf-share__ico--check { display: none; }
.sf-share__btn--copy.is-done .sf-share__ico--link { display: none; }
.sf-share__btn--copy.is-done .sf-share__ico--check { display: inline-block; }
.sf-share__btn--copy.is-done,
.sf-share__btn--copy.is-done:hover,
.sf-share__btn--copy.is-done:focus-visible {
  background: var(--sf-success-bg);
  border-color: var(--sf-success);
  color: var(--sf-success);
}

/* „Distribuie…” (Web Share API) — buton pill, pe rând propriu */
.sf-share__item--native { flex: 1 1 100%; }
.sf-share__native { width: 100%; }
.sf-share__native .sf-share__ico { width: 18px; height: 18px; }

/* ---------- Varianta card (pagina de centru) ---------- */
.sf-share--card .sf-share__title { margin-bottom: var(--sf-space-4); }

/* ---------- Varianta inline (paginile de listă) ---------- */
.sf-share--inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sf-space-3) var(--sf-space-4);
  margin-top: var(--sf-space-5);
}
.sf-share__label {
  font-family: var(--sf-font-ui);
  font-weight: 700;
  font-size: 12px;
  line-height: 1.3;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--sf-muted);
}
@media (min-width: 768px) {
  .sf-share--inline .sf-share__item--native { flex: 0 0 auto; }
  .sf-share--inline .sf-share__native { width: auto; }
}
/* cu „Distribuie…” (Web Share API) eticheta ar dubla textul butonului — ascunsă vizual, păstrată pentru role="group" */
.sf-share--inline.has-native .sf-share__label {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

/* ---------- Mesaj „Linkul a fost copiat” (regiune live, mereu în arborele de accesibilitate) ---------- */
.sf-share__toast {
  position: fixed;
  left: 50%;
  bottom: var(--sf-space-5);
  z-index: 1100; /* peste cardul de cookies (1000) */
  max-width: calc(100% - 32px);
  margin: 0;
  padding: 10px 22px;
  border: 1px solid transparent; /* vizibil în modul „forced colors” */
  border-radius: var(--sf-radius-pill);
  background: var(--sf-navy);
  color: var(--sf-cream-2);
  font-family: var(--sf-font-ui);
  font-weight: 700;
  font-size: 14px;
  line-height: 1.35;
  letter-spacing: .01em;
  text-align: center;
  box-shadow: var(--sf-shadow-2);
  opacity: 0;
  transform: translate(-50%, 8px);
  pointer-events: none;
  transition: opacity var(--sf-dur) var(--sf-ease), transform var(--sf-dur) var(--sf-ease);
}
.sf-share__toast:empty { padding: 0; border: 0; box-shadow: none; }
.sf-share__toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
@media (max-width: 767px) {
  .sf-share__toast { bottom: var(--sf-space-4); }
}

@media (prefers-reduced-motion: reduce) {
  .sf-share__toast { transition: none; transform: translate(-50%, 0); }
  .sf-share__btn, .sf-share__native { transition: none; }
}
@media (forced-colors: active) {
  .sf-share__btn--copy.is-done { border-color: Highlight; }
}