/* ==========================================================================
   Share Buttons Component – eBuy.store
   ========================================================================== */

.eb-share {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

/* ── Individual button ── */
.eb-share-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;

  padding: 5px 11px;
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;

  border: 1px solid var(--bs-border-color, #dee2e6);
  border-radius: 20px;
  background: transparent;
  color: var(--bs-body-color, #212529);
  cursor: pointer;
  text-decoration: none;

  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.eb-share-btn svg,
.eb-share-btn [data-lucide] {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

.eb-share-btn:hover,
.eb-share-btn:focus-visible {
  background: var(--bs-light, #f8f9fa);
  border-color: var(--bs-secondary-color, #6c757d);
  color: var(--bs-body-color, #212529);
  outline: none;
}

/* ── WhatsApp ── */
.eb-share-btn--wa {
  border-color: #25d366;
  color: #128c7e;
}

.eb-share-btn--wa:hover,
.eb-share-btn--wa:focus-visible {
  background: #e8fdf2;
  border-color: #128c7e;
  color: #128c7e;
}

/* ── Copy — success state ── */
.eb-share-btn--copy.is-copied {
  border-color: var(--bs-success-border-subtle, #a3cfbb);
  color: var(--bs-success, #198754);
  background: var(--bs-success-bg-subtle, #d1e7dd);
}

/* ── Icon-only variant (no label text) ── */
.eb-share--icon-only .eb-share-btn {
  padding: 6px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
}