/**
 * Wander Wise Pro — Social Layer (Phase 2b) : Feed styles
 */
.ww-feed-wrap { max-width: 640px; margin: 2rem auto; padding: 0 1rem; }
.ww-feed-title {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 1.6rem;
	color: var(--ww-ink, #241633);
	margin: 0 0 1.25rem;
}

/* ── Composer ─────────────────────────────────────────────── */
.ww-composer {
	background: #fff;
	border: 1px solid var(--ww-line, #EBE1F6);
	border-radius: 18px;
	padding: 1rem;
	margin-bottom: 1.5rem;
	box-shadow: 0 4px 20px rgba(74,29,115,.05);
}
.ww-composer-top { display: flex; gap: .75rem; align-items: flex-start; }
.ww-composer-avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.ww-composer-body {
	flex: 1; border: none; resize: none; font: inherit; font-size: 1.05rem;
	padding: .6rem 0; outline: none; color: var(--ww-ink, #241633); background: transparent;
}
.ww-composer-place {
	background: #F2E9FB; color: #6B2FA0; border-radius: 999px;
	padding: .3rem .75rem; font-size: .85rem; font-weight: 600;
	display: inline-flex; align-items: center; gap: .4rem; margin: .25rem 0;
}
.ww-composer-place button, .ww-prev-x, .ww-place-clear {
	background: none; border: none; cursor: pointer; font-size: 1rem; line-height: 1; color: inherit;
}
.ww-composer-preview { position: relative; margin: .5rem 0; }
.ww-composer-preview img { max-width: 100%; border-radius: 12px; display: block; }
.ww-prev-x {
	position: absolute; top: 8px; right: 8px;
	background: rgba(0,0,0,.55); color: #fff; width: 28px; height: 28px; border-radius: 50%;
}
.ww-composer-tools {
	display: flex; align-items: center; gap: .5rem; margin-top: .75rem;
	padding-top: .75rem; border-top: 1px solid var(--ww-line, #EBE1F6); flex-wrap: wrap;
}
.ww-tool { font-size: .9rem; color: var(--ww-sub, #6E6180); cursor: pointer; }
.ww-tool span { white-space: nowrap; }
.ww-place-results {
	position: absolute; top: 100%; left: 0; right: 0; z-index: 10; margin-top: 4px;
	background: #fff; border: 1px solid var(--ww-line, #EBE1F6); border-radius: 12px;
	box-shadow: 0 8px 24px rgba(74,29,115,.12); overflow: hidden;
}
.ww-place-opt {
	display: block; width: 100%; text-align: left; background: none; border: none;
	padding: .55rem .8rem; font: inherit; font-size: .88rem; cursor: pointer; color: var(--ww-ink, #241633);
}
.ww-place-opt:hover { background: #F6F2FB; }
.ww-post-btn { margin-left: auto; }

/* ── Feed + posts ─────────────────────────────────────────── */
.ww-feed { display: flex; flex-direction: column; gap: 1.25rem; }
.ww-post {
	background: #fff; border: 1px solid var(--ww-line, #EBE1F6); border-radius: 18px; padding: 1rem;
	box-shadow: 0 4px 20px rgba(74,29,115,.05);
}
.ww-post-head { display: flex; align-items: center; gap: .7rem; margin-bottom: .6rem; }
.ww-post-avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.ww-post-meta { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ww-post-author { font-weight: 700; color: var(--ww-ink, #241633); text-decoration: none; }
.ww-post-sub { font-size: .82rem; color: var(--ww-sub, #6E6180); }
.ww-post-del {
	background: none; border: none; font-size: 1.4rem; line-height: 1; color: var(--ww-sub, #6E6180);
	cursor: pointer; padding: 0 .3rem;
}
.ww-post-body { margin: .3rem 0 .7rem; color: var(--ww-ink, #241633); line-height: 1.55; white-space: pre-wrap; }
.ww-post-place {
	display: inline-flex; align-items: center; gap: .3rem; margin-bottom: .7rem;
	background: #F6F2FB; border-radius: 999px; padding: .35rem .8rem;
	font-size: .85rem; font-weight: 600; color: #6B2FA0; text-decoration: none;
}
.ww-post-image { width: 100%; border-radius: 14px; display: block; margin-bottom: .5rem; }

.ww-post-actions {
	display: flex; gap: .35rem; align-items: center;
	padding-top: .6rem; border-top: 1px solid var(--ww-line, #EBE1F6);
}
.ww-act {
	background: none; border: none; cursor: pointer; font: inherit; font-size: .9rem;
	color: var(--ww-sub, #6E6180); padding: .4rem .7rem; border-radius: 999px; display: inline-flex; align-items: center; gap: .35rem;
}
.ww-act:hover { background: #F6F2FB; }
.ww-like.is-liked { color: #D6336C; }
.ww-like.is-liked .ww-like-ico { color: #D6336C; }
.ww-report { margin-left: auto; font-size: .8rem; }

/* ── Comments ─────────────────────────────────────────────── */
.ww-comments { margin-top: .8rem; padding-top: .8rem; border-top: 1px solid var(--ww-line, #EBE1F6); }
.ww-comment { display: flex; gap: .55rem; margin-bottom: .6rem; }
.ww-comment-avatar { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.ww-comment-bubble { background: #F6F2FB; border-radius: 14px; padding: .45rem .7rem; }
.ww-comment-author { font-weight: 700; font-size: .85rem; color: var(--ww-ink, #241633); margin-right: .4rem; }
.ww-comment-text { font-size: .9rem; color: var(--ww-ink, #241633); }
.ww-comment-form { display: flex; gap: .5rem; margin-top: .5rem; }
.ww-comment-input {
	flex: 1; border: 1px solid var(--ww-line, #EBE1F6); border-radius: 999px;
	padding: .5rem .85rem; font: inherit; font-size: .9rem; background: #F6F2FB; outline: none;
}
.ww-comment-send {
	background: linear-gradient(135deg, #3B1A5E, #6B2FA0); color: #fff; border: none;
	border-radius: 999px; padding: .5rem 1rem; font-weight: 600; cursor: pointer;
}

.ww-feed-more {
	display: block; margin: 1.25rem auto 0; background: #F6F2FB;
	border: 1px solid var(--ww-line, #EBE1F6); color: #6B2FA0;
	border-radius: 999px; padding: .55rem 1.5rem; font-weight: 600; cursor: pointer;
}
.ww-feed-login {
	background: #F6F2FB; border-radius: 14px; padding: 1rem; text-align: center; margin-bottom: 1.5rem;
}
.ww-feed-login a { color: #6B2FA0; font-weight: 600; text-decoration: none; }

/* Composer/feed section on profile pages */
.ww-profile-wrap .ww-composer, .ww-profile-wrap .ww-feed { margin-top: 1rem; }

@media (max-width: 480px) {
	.ww-composer-tools { gap: .4rem; }
	.ww-place-tool { order: 3; flex-basis: 100%; }
	.ww-post-btn { order: 2; }
}

/* Place toggle + revealed search panel (2b.1) */
.ww-place-toggle {
	background: none; border: none; cursor: pointer;
	font: inherit; font-size: .9rem; color: var(--ww-sub, #6E6180);
	padding: .3rem .2rem;
}
.ww-place-toggle:hover { color: #6B2FA0; }
#ww-place-tool { position: relative; margin-top: .6rem; }
#ww-place-tool input[type="text"] {
	width: 100%; box-sizing: border-box; border: 1px solid var(--ww-line, #EBE1F6);
	border-radius: 999px; padding: .5rem .9rem; font: inherit; font-size: .9rem; background: #F6F2FB;
}