/* Vice Social · alıntı (22.10). Gönderinin içindeki alıntı kartı, paylaşım kutusundaki "Alıntılıyorsun" alanı ve yer tutucu.
   Uygulamada imza katmanının (--i-*), misafir görünümü ve karakter duvarında site (--vx-*) / Social (--sn-*) değişkenlerini kullanır.
   Renk ve yazı kuralları site genelindeki ".vsn a { color: inherit !important }" ile avatar kurallarını geçecek kadar güçlü. */

.vsn :is(.vsn-quote, .vsn-quote-slot) {
	--q-line: var(--i-line, var(--vx-line, var(--sn-line, #2a3441)));
	--q-ink: var(--i-ink, var(--vx-ink, var(--sn-ink, #f2f4f8)));
	--q-muted: var(--i-muted, var(--vx-muted, var(--sn-muted, #b0bccb)));
	--q-faint: var(--i-faint, var(--vx-faint, var(--sn-muted, #8391a3)));
	--q-sunk: var(--i-sunk, var(--vx-sunken, var(--sn-soft, #0b0f14)));
	--q-pink: var(--i-pink, var(--vx-pink, var(--sn-pink, #f49ac1)));
	--q-gold: var(--i-gold, var(--vx-gold, #e7cb89));
	--q-cond: var(--i-cond, var(--vx-cond, "Barlow Condensed", sans-serif));
	--q-mono: var(--i-mono, var(--vx-mono, "JetBrains Mono", ui-monospace, monospace));
	--q-sans: var(--i-sans, var(--vx-sans, "Barlow", sans-serif));
}

/* ---------- kart ---------- */
.vsn .vsn-quote { position: relative; display: block; margin: 14px 20px 4px; border: 1px solid var(--q-line); background: var(--q-sunk); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%); transition: border-color .2s; }
.vsn .vsn-quote::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: linear-gradient(180deg, #f49ac1, #f17f97 45%, #e7cb89); }
.vsn .vsn-quote:hover { border-color: rgba(244, 154, 193, .38); }
/* başlık tam genişlik; fotoğraf sağa yaslı, metin (kendi biçimlendirme bağlamı) yanında daralır */
.vsn .vsn-quote__link { display: flow-root; padding: 12px 14px 13px 17px; text-decoration: none; }
.vsn .vsn-quote__who { display: flex; align-items: center; gap: 8px; min-width: 0; margin: 0 0 6px; }
.vsn .vsn-quote__text { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; overflow-wrap: anywhere; }
.vsn .vsn-quote__media, .vsn .vsn-quote__chain { display: block; margin: 6px 0 0; }
.vsn .vsn-quote__photo { float: right; display: block; width: 84px; height: 84px; margin: 0 0 2px 14px; object-fit: cover; border: 1px solid var(--q-line); }
.vsn .vsn-quote .vsn-avatar { width: 24px; height: 24px; }

html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn .vsn-quote .vsn-avatar { width: 24px !important; height: 24px !important; min-width: 24px !important; border-width: 1px !important; box-shadow: none !important; }
html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn .vsn-quote .vsn-avatar-fallback { display: inline-grid !important; place-items: center !important; font-size: 12px !important; }
html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn .vsn-quote__who strong { min-width: 0; overflow: hidden; color: var(--q-ink) !important; font: 600 14px/1.15 var(--q-cond) !important; letter-spacing: .05em !important; text-transform: uppercase !important; text-overflow: ellipsis; white-space: nowrap; }
html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn .vsn-quote__who small { flex: none; color: var(--q-faint) !important; font: 500 11px/1.3 var(--q-mono) !important; }
html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn .vsn-quote__text { color: var(--q-muted) !important; font: 400 15px/1.5 var(--q-sans) !important; }
html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn .vsn-quote__media { color: var(--q-gold) !important; font: 600 12px/1.3 var(--q-cond) !important; letter-spacing: .08em !important; text-transform: uppercase !important; }
html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn .vsn-quote__chain { color: var(--q-faint) !important; font: 500 11px/1.3 var(--q-mono) !important; }
html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn a.vsn-quote__link:is(:hover, :focus-visible) .vsn-quote__who strong { color: var(--q-pink) !important; }
.vsn a.vsn-quote__link:focus-visible { outline: 2px solid var(--q-pink); outline-offset: -2px; }

/* yer tutucu: kaldırılmış, kapanmış ya da görene kapalı */
.vsn .vsn-quote.is-gone { display: grid; gap: 3px; padding: 12px 14px 12px 17px; }
.vsn .vsn-quote.is-gone::before { background: var(--q-line); }
html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn .vsn-quote.is-gone strong { color: var(--q-muted) !important; font: 600 13px/1.3 var(--q-cond) !important; letter-spacing: .06em !important; text-transform: uppercase !important; }
html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn .vsn-quote.is-gone small { color: var(--q-faint) !important; font: 500 11px/1.4 var(--q-mono) !important; }

/* ---------- paylaşım kutusu: "Alıntılıyorsun" ---------- */
.vsn .vsn-quote-slot { margin: 12px 0 2px; }
.vsn .vsn-quote-slot[hidden] { display: none !important; }
.vsn .vsn-quote-slot .vsn-quote { margin: 0; }
.vsn .vsn-quote-slot__bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 6px; }
html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn .vsn-quote-slot__bar span { color: var(--q-gold) !important; font: 600 11px/1.2 var(--q-cond) !important; letter-spacing: .16em !important; text-transform: uppercase !important; }
html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn .vsn-quote-slot__bar a { padding: 4px 0; color: var(--q-faint) !important; font: 600 12px/1.2 var(--q-cond) !important; letter-spacing: .08em !important; text-transform: uppercase !important; text-decoration: none !important; }
html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn .vsn-quote-slot__bar a:is(:hover, :focus-visible) { color: var(--q-pink) !important; }

/* "Alıntıla" isteği sürerken */
.vsn .vsn-quote-action[aria-busy="true"] { opacity: .55; pointer-events: none; }

@media (max-width: 560px) {
	.vsn .vsn-quote { margin: 12px 14px 4px; }
	.vsn .vsn-quote__link { padding: 11px 11px 12px 14px; }
	.vsn .vsn-quote__photo { width: 64px; height: 64px; margin-left: 10px; }
	html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn .vsn-quote__text { font-size: 14.5px !important; -webkit-line-clamp: 5; }
	/* "Alıntıla" ile eylem satırı ikiye kırılınca "Bağlantıyı kopyala" kendi satırında tam görünür (92px sınırında kesiliyordu). */
	html:root[data-vice-mode] body #main_content_section .vsn.vsn.vsn.vsn .vsn-post-actions > [data-vsn-copy] { max-width: none !important; }
}
@media (prefers-reduced-motion: reduce) { .vsn .vsn-quote { transition: none; } }
