/* ---------- Category filter bar ---------- */
.category-bar{
  max-width:600px;
  margin:14px auto 0;
  padding:0 12px;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.cat-pill{
  border:1.5px solid var(--ig-border);
  background:#fff;
  color:var(--ig-text);
  font-size:12.5px;
  font-weight:700;
  padding:6px 10px;
  border-radius:999px;
  cursor:pointer;
  white-space:nowrap;
}
.cat-pill.active{
  background:var(--ig-blue);
  border-color:var(--ig-blue);
  color:#fff;
}
.wa-group-pill{
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  gap:5px;
  border:1.5px solid #25D366;
  background:#25D366;
  color:#fff;
  font-size:12.5px;
  font-weight:700;
  padding:6px 12px;
  border-radius:999px;
  cursor:pointer;
  white-space:nowrap;
  text-decoration:none;
}
.wa-group-pill:hover{background:#1EBE5A;border-color:#1EBE5A;}

.chat-live-pill{
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  gap:6px;
  border:1.5px solid #9C27B0;
  background:#9C27B0;
  color:#fff;
  font-size:12.5px;
  font-weight:700;
  padding:6px 12px;
  border-radius:999px;
  cursor:pointer;
  white-space:nowrap;
  text-decoration:none;
}
.chat-live-pill:hover{background:#7E1F8F;border-color:#7E1F8F;}
.mini-live-dot{
  width:6px;height:6px;
  border-radius:50%;
  background:#7CFFB2;
  display:inline-block;
  animation:live-pulse 1.4s ease-in-out infinite;
}
@keyframes live-pulse{
  0%, 100% { opacity:1; transform:scale(1); }
  50%      { opacity:0.4; transform:scale(0.7); }
}

.qa-pill{
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  gap:5px;
  border:1.5px solid #F2A93B;
  background:#F2A93B;
  color:#fff;
  font-size:12.5px;
  font-weight:700;
  padding:6px 12px;
  border-radius:999px;
  cursor:pointer;
  white-space:nowrap;
  text-decoration:none;
}
.qa-pill:hover{background:#D9910F;border-color:#D9910F;}

/* ---------- Compact Facebook-style post card ---------- */
.news-post{
  background:var(--ig-card);
  border:1px solid var(--ig-border);
  border-radius:10px;
  margin-bottom:14px;
  padding:12px 14px;
}
.news-header{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:8px;
}
.news-avatar{
  width:36px;height:36px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:17px;
  color:#fff;
  flex-shrink:0;
  position:relative;
  overflow:hidden;
}
.news-avatar img{
  position:absolute;
  inset:0;
  width:100%;height:100%;
  object-fit:cover;
}
.cat-icon{
  width:15px;height:15px;
  border-radius:50%;
  vertical-align:middle;
  margin-right:2px;
}
.news-who{flex:1;min-width:0;}
.news-creator{font-weight:700;font-size:14px;}
.news-meta{font-size:12px;color:var(--ig-sub);}

.news-title{
  font-weight:800;
  font-size:16px;
  margin-bottom:4px;
}
.news-content{
  font-size:14px;
  line-height:1.5;
  white-space:pre-wrap;
  margin-bottom:8px;
}
.news-content-html{
  position:relative;
  max-height:260px;
  overflow:hidden;
  padding:0 14px;
  margin-bottom:4px;
  white-space:normal;
}
.news-content-html.expanded{
  max-height:none;
}
.html-content-inner{
  font-size:14px;
  line-height:1.5;
}
.html-content-inner img{max-width:100%;height:auto;border-radius:8px;}
.html-content-inner a{color:var(--ig-blue);text-decoration:underline;word-break:break-all;}
.html-content-inner table{max-width:100%;overflow-x:auto;display:block;}
.html-fade{
  position:absolute;
  bottom:0;left:0;right:0;
  height:50px;
  background:linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,0.95));
  pointer-events:none;
}
.readmore-btn{
  background:none;border:none;
  color:var(--ig-blue);
  font-weight:700;
  font-size:14px;
  cursor:pointer;
  padding:0;
  margin-left:2px;
}

.news-photo{
  width:100%;
  max-height:320px;
  object-fit:cover;
  border-radius:8px;
  display:block;
  margin-bottom:8px;
}

.news-stats{
  display:flex;
  justify-content:space-between;
  font-size:12px;
  color:var(--ig-sub);
  padding:4px 0;
  border-bottom:1px solid var(--ig-border);
  margin-bottom:4px;
}

.news-actions{
  display:flex;
}
.news-action-btn{
  flex:1;
  background:none;
  border:none;
  padding:8px 4px;
  font-size:13px;
  font-weight:700;
  color:var(--ig-sub);
  cursor:pointer;
  border-radius:6px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
}
.news-action-btn:hover{background:#F5F5F5;}
.news-action-btn.liked{color:var(--ig-red);}
.news-action-btn.saved-active{color:var(--ig-blue);}

.news-comments{
  margin-top:8px;
  padding-top:8px;
  border-top:1px solid var(--ig-border);
}
.news-comments .comments-list{margin-bottom:8px;}
.news-comments .comment-line{font-size:13px;}

.comment-form{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.comment-form input,
.comment-form textarea{
  width:100%;
  font-size:14px;
  padding:8px 10px;
  border-radius:8px;
  border:1.5px solid var(--ig-border);
  font-family:inherit;
}
.comment-form textarea{min-height:50px;resize:vertical;}
.comment-form .btn-do-submit{
  align-self:flex-end;
  min-height:36px;
  padding:0 16px;
  border-radius:8px;
  border:none;
  background:var(--ig-blue);
  color:#fff;
  font-weight:700;
  font-size:14px;
  cursor:pointer;
}

@media (max-width:480px){
  .news-title{font-size:15px;}
  .news-content{font-size:13.5px;}
}

/* ---------- Multi-image upload preview (post form) ---------- */
.image-preview-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(80px, 1fr));
  gap:8px;
  margin-top:8px;
}
.image-thumb{
  position:relative;
  aspect-ratio:1/1;
  border-radius:8px;
  overflow:hidden;
  border:1px solid var(--ig-border);
}
.image-thumb img{
  width:100%;height:100%;object-fit:cover;display:block;
}
.image-thumb-remove{
  position:absolute;
  top:3px;right:3px;
  width:22px;height:22px;
  border-radius:50%;
  border:none;
  background:rgba(0,0,0,0.6);
  color:#fff;
  font-size:12px;
  cursor:pointer;
  line-height:1;
}

/* ---------- Multi-image gallery display (feed card) ---------- */
.news-gallery{
  display:grid;
  gap:3px;
  margin-bottom:8px;
}
.news-gallery img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.news-gallery-1{grid-template-columns:1fr;}
.news-gallery-1 img{max-height:340px;}
.news-gallery-2{grid-template-columns:1fr 1fr;}
.news-gallery-2 img{height:200px;}
.news-gallery-3{grid-template-columns:1fr 1fr;}
.news-gallery-3 a:first-child{grid-row:span 2;}
.news-gallery-3 img{height:200px;}
.news-gallery-3 a:first-child img{height:100%;}
.news-gallery-4{grid-template-columns:1fr 1fr;}
.news-gallery-4 img{height:150px;}
.news-gallery-5{grid-template-columns:1fr 1fr 1fr;}
.news-gallery-5 img{height:120px;}

/* ---------- Contact buttons (phone / WhatsApp / link) ---------- */
.news-contact-row{
  display:flex;
  gap:6px;
  padding:0 14px 10px;
  flex-wrap:wrap;
  justify-content:flex-start;
}
.contact-btn{
  flex:0 0 auto;
  text-align:center;
  padding:5px 10px;
  border-radius:7px;
  background:#F0F0F0;
  color:var(--ig-text);
  font-size:12px;
  font-weight:700;
  text-decoration:none;
}
.contact-btn.wa{background:#25D366;color:#fff;}

/* ---------- Bold/Italic/Underline toolbar for posting ---------- */
.format-toolbar{display:flex;gap:4px;margin:2px 0 6px;}
.format-toolbar button{
  width:32px;height:32px;border:1.5px solid var(--ig-border);background:#fff;
  border-radius:8px;cursor:pointer;font-size:14px;color:var(--ig-text);
  display:flex;align-items:center;justify-content:center;
}
.format-toolbar button:hover{background:#F5F5F5;}
.content-textarea{min-height:160px !important;font-size:15px !important;}
.news-content a{color:var(--ig-blue);text-decoration:underline;word-break:break-all;}