/* ═══════════════════════════════════════════════════════════
   TPMT News Blocks — Social Sharing Bar
   Frontend styles for .tnb-share-bar injected into posts.
═══════════════════════════════════════════════════════════ */

/* ── Bar wrapper ────────────────────────────────────────── */
.tnb-share-bar {
 display: flex;
 align-items: center;
 flex-wrap: wrap;
 gap: 10px;
 margin-top: 32px;
 padding-top: 20px;
 border-top: 2px solid #e2e2e2;
 font-family: Arial, Helvetica, sans-serif;
}

.tnb-share-label {
 font-size: .72rem;
 font-weight: 700;
 letter-spacing: .1em;
 text-transform: uppercase;
 color: #555;
 white-space: nowrap;
 margin-right: 4px;
}

.tnb-share-buttons {
 display: flex;
 flex-wrap: wrap;
 gap: 8px;
 align-items: center;
}

/* ── Base button ────────────────────────────────────────── */
.tnb-share-btn {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 font-size: .75rem;
 font-weight: 700;
 letter-spacing: .03em;
 border-radius: 4px;
 cursor: pointer;
 transition: opacity .15s, transform .12s;
 text-decoration: none !important;
 border: none;
 line-height: 1;
}
.tnb-share-btn:hover { opacity: .85; transform: translateY(-1px); }
.tnb-share-btn:active { transform: translateY(0); }
.tnb-share-btn svg {
 width: 16px;
 height: 16px;
 flex-shrink: 0;
}

/* ── Filled style (default) ─────────────────────────────── */
.tnb-share-bar--filled .tnb-share-btn {
 background: var(--tnb-share-color, #555);
 color: #fff !important;
 padding: 7px 13px;
}
.tnb-share-bar--filled .tnb-share-btn svg {
 color: #fff;
}

/* ── Outline style ──────────────────────────────────────── */
.tnb-share-bar--outline .tnb-share-btn {
 background: transparent;
 color: var(--tnb-share-color, #555) !important;
 border: 2px solid var(--tnb-share-color, #555);
 padding: 5px 11px;
}
.tnb-share-bar--outline .tnb-share-btn svg {
 color: var(--tnb-share-color, #555);
}

/* ── Icon-only style ────────────────────────────────────── */
.tnb-share-bar--icon .tnb-share-btn {
 background: var(--tnb-share-color, #555);
 color: #fff !important;
 padding: 8px;
 border-radius: 50%;
 width: 36px;
 height: 36px;
 justify-content: center;
}
.tnb-share-bar--icon .tnb-share-btn svg {
 width: 18px;
 height: 18px;
 color: #fff;
}

/* ── Copy-link feedback ─────────────────────────────────── */
.tnb-share-btn--copy.is-copied span::after {
 content: ' ✓';
}

/* ── Admin preview (inside tnb-ref-card, no hover needed) ── */
.tnb-ref-card .tnb-share-bar {
 border-top: none;
 margin-top: 0;
 padding-top: 0;
}
.tnb-ref-card .tnb-share-btn {
 pointer-events: none;
}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 480px) {
 .tnb-share-bar { gap: 8px; }
 .tnb-share-btn { font-size: .7rem; }
}
