/**
 * Share-row для одиночной фотографии.
 *
 * Дизайн mirroring /wp-content/themes/magon-child/assets/css/components/post-footer.css.
 * Брендовые цвета и dark-mode оверрайды совпадают пиксель-в-пиксель с WP-стороной,
 * чтобы переход между блогом и галереей был визуально однородным.
 */

.zp-share {
  margin: 24px 0 16px;
  padding-top: 16px;
  border-top: 1px solid var(--border, #E2DED8);
}

.zp-share__label {
  font-family: var(--font-sans, 'PT Sans', sans-serif);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  color: var(--text-muted, #4A4A5A);
  margin: 0 0 12px;
  text-transform: uppercase;
}

.zp-share__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.zp-share__list li {
  margin: 0;
}

.share-btn {
  display: inline-flex;
  align-items: center;
  padding: 8px 14px;
  border: 1px solid var(--border, #E2DED8);
  border-radius: 4px;
  background: var(--bg-secondary, #F4F1EC);
  font-family: var(--font-sans, 'PT Sans', sans-serif);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  line-height: 1;
  transition: background 0.18s, color 0.18s;
  appearance: none;
  -webkit-appearance: none;
  margin: 0;
  cursor: pointer;
}

.share-btn:hover,
.share-btn:focus-visible {
  background: var(--accent-light, #EBF0F7);
}

.share-btn--tg { color: #26A5E4; }
.share-btn--tg:hover,
.share-btn--tg:focus-visible { color: #26A5E4; }

.share-btn--vk { color: #2B6CB0; }
.share-btn--vk:hover,
.share-btn--vk:focus-visible { color: #2B6CB0; }

.share-btn--ok { color: #EE8208; }
.share-btn--ok:hover,
.share-btn--ok:focus-visible { color: #EE8208; }

.share-btn--copy { color: var(--text-muted, #4A4A5A); }
.share-btn--copy:hover,
.share-btn--copy:focus-visible { color: var(--text, #1C1C28); }

[data-theme="dark"] .share-btn--tg,
[data-theme="dark"] .share-btn--tg:hover,
[data-theme="dark"] .share-btn--tg:focus-visible { color: #4AB5E8; }
[data-theme="dark"] .share-btn--vk,
[data-theme="dark"] .share-btn--vk:hover,
[data-theme="dark"] .share-btn--vk:focus-visible { color: #4A90D0; }
[data-theme="dark"] .share-btn--ok,
[data-theme="dark"] .share-btn--ok:hover,
[data-theme="dark"] .share-btn--ok:focus-visible { color: #F19D3D; }
[data-theme="dark"] .share-btn--copy { color: var(--text-muted); }
[data-theme="dark"] .share-btn--copy:hover,
[data-theme="dark"] .share-btn--copy:focus-visible { color: var(--text); }

.share-btn--copied {
  background: #2B8A3E;
  color: #FFFFFF;
}