/*=================================================================
  SIDEBAR & SHARED WIDGETS — शङ्खघोष मिडिया
  Loaded on EVERY page (registered from header.php) so this look is
  consistent everywhere and never fights the old theme CSS.
  Uses colour tokens declared in header.css (:root).
=================================================================*/

/* ============ AD BLOCKS (used in article + sidebar) ============ */
.ad-block{
  margin:26px 0;
  padding:14px 0 4px;
  border-top:1px dashed #e3e3ec;
  border-bottom:1px dashed #e3e3ec;
  text-align:center;
}
.ad-block-label{
  display:block;
  color:#b3b4c8;
  font:600 11px 'Open Sans',sans-serif;
  letter-spacing:.6px;
  margin-bottom:10px;
}
.ad-block img{margin-bottom:16px;}
.ad-right-side-bar{margin-bottom:26px;}

.fbLikeBox{
  margin-bottom:26px;
  background:#f9f9fd;
  border-radius:10px;
  padding:14px;
  text-align:center;
}

/* ============ SHARED SECTION TITLE (cat-tags / cat-name) ============
   Used by related.php, tab-news-content.php, and every homepage
   news-box-content-*.php widget. */
.cat-box{margin-bottom:20px;}
.cat-tags{
  border:none;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-bottom:1px solid #edeef5;
  padding-bottom:12px;
}
.cat-name{
  display:inline-block;
  color:var(--sg-navy,#1e1878);
  font:600 22px 'Mukta',sans-serif;
  border:none;
  position:relative;
  padding-bottom:9px;
}
.cat-name::after{
  content:'';
  position:absolute;
  left:0;bottom:0;
  width:32px;height:3px;
  border-radius:3px;
  background:var(--sg-orange,#f89d28);
}
.extra-news-title{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--sg-muted,#707070);
  font:600 14px 'Mukta',sans-serif;
  padding:6px 14px;
  border-radius:20px;
  background:#f3f3f9;
  transition:background .2s ease, color .2s ease;
}
.extra-news-title span{
  display:inline-flex;
  font-size:11px;
}
.extra-news-title:hover{
  background:var(--sg-navy,#1e1878);
  color:#fff;
}

/* newsHeadingSection / newsHeadingTitle — same header, different class
   names, used by news-box-content-5.php */
.newsHeadingSection{
  border-bottom:1px solid #edeef5;
  padding-bottom:12px;
  margin-bottom:20px;
}
.newsHeadingTitle{
  display:inline-block;
  color:var(--sg-navy,#1e1878);
  font:600 22px 'Mukta',sans-serif;
  position:relative;
  padding-bottom:9px;
}
.newsHeadingTitle::after{
  content:'';
  position:absolute;
  left:0;bottom:0;
  width:32px;height:3px;
  border-radius:3px;
  background:var(--sg-orange,#f89d28);
}

/* ============ CUSTOM TAB COMPONENT (sg-tabs) ============
   Self-contained — no Bootstrap nav-tabs classes involved at all,
   so nothing from any older stylesheet can clash with it. */
.sg-tabs{margin-bottom:30px;}
.sg-tab-nav{
  display:flex;
  gap:6px;
  border-bottom:2px solid #ececf5;
  margin-bottom:18px;
}
.sg-tab-btn{
  background:transparent;
  border:none;
  cursor:pointer;
  padding:10px 18px;
  font:600 16px 'Mukta',sans-serif;
  color:var(--sg-muted,#707070);
  position:relative;
  top:2px;
}
.sg-tab-btn::after{
  content:'';
  position:absolute;
  left:18px;right:18px;bottom:-2px;
  height:3px;border-radius:3px 3px 0 0;
  background:var(--sg-orange,#f89d28);
  transform:scaleX(0);
  transition:transform .2s ease;
}
.sg-tab-btn.is-active{color:var(--sg-navy,#1e1878);}
.sg-tab-btn.is-active::after{transform:scaleX(1);}
.sg-tab-panel{display:none;}
.sg-tab-panel.is-active{display:block;}

/* tab-news.php — sidebar news-list card (used inside sg-tab-panel) */
.tab-news-content{
  display:flex;
  align-items:center;
  gap:14px;
  padding-bottom:14px;
  margin-bottom:14px;
  border-bottom:1px solid #edeef5;
}
.tab-news-content:last-child{
  border-bottom:none;
  margin-bottom:0;
  padding-bottom:0;
}
.tab-news-content .img-zoom-effect{
  display:flex;
  align-items:center;
  gap:14px;
  width:100%;
}
.tab-new-img{
  float:none !important;
  width:78px !important;
  height:60px;
  object-fit:cover;
  border-radius:8px;
  flex-shrink:0;
  margin:0 !important;
}
.tab-news-title{
  color:var(--sg-text,#242424);
  font:600 15px/22px 'Mukta',sans-serif;
  transition:color .2s ease;
}
.tab-news-title:hover{color:var(--sg-navy,#1e1878);}

/* tab-news-content.php — trending list variant */
.newsContainerThree{margin-bottom:6px;}
.trendingNewsSection{
  padding:11px 0;
  border-bottom:1px dashed #e3e3ec;
}
.trendingNewsSection:last-child{border-bottom:none;}
.trendingNewsHeading{
  color:var(--sg-text,#242424);
  font:500 15px/23px 'Mukta',sans-serif;
  display:block;
  transition:color .2s ease;
}
.trendingNewsHeading:hover{color:var(--sg-navy,#1e1878);}
