@font-face {
  font-family: 'Kalpurush';
  src: url('../font/Kalpurush.woff2') format('woff2'),
    url('../font/Kalpurush.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

/* default  */
body {
  font-family: 'Kalpurush', sans-serif;
  font-weight: normal;
  font-size: 16px;
  text-align: left;
  box-sizing: border-box;
  height: auto;
}


h1,
h2,
h3,
h4,
h5,
h6,
p,
ul {
  margin: 0;
  padding: 0;
}

:root {
  --primary-color: #d9d9d9;
  --secondary-color: #f68d23;
  --Hover-color: #f68d23;
  --font-color: rgb(28, 27, 27);
  --white-color: #fff;
  --black-color: #000;
  --font-family: Kalpurush, sans-serif;
  --highlight-light: rgb(246, 139, 31);
}


.top-header {
  margin-bottom: 10px;
}

.top-ads img {
  margin-top: 10px;
  margin-bottom: 15px;
}

.slider-image-text {
  h3 {
    font-size: 16px;
    flex: 1 1 auto;
    min-width: 0;
    align-self: center;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
  }

  img {
    margin-left: 10px;
    height: 70px;
    width: 130px;
  }
}

.right-slider .carousel-inner {
  margin-top: 2.6rem;
}

.carousel-indicators {
  margin: 0px 10px 0px -10rem;

}

.carousel-indicators [data-bs-target] {
  background-color: black;
  width: 20px;
  border-radius: 50px;
}

.nav-item {
  color: black;
  font-size: 18px;
  font-weight: 600;

  .dropdown-item {
    font-weight: 600;
    font-size: 18px;

  }
}

/* .navbar-expand-lg .navbar-nav .nav-link {
  padding: 0px 8px;
}

.navbar-nav .nav-item h2 {
  align-items: center;
  font-size: 20px;
  font-weight: 600;
} */


.date-text {
  font-size: 14px;
  color: #666;
}

.quick-links {
  margin-top: 5px;
}

.quick-links a {
  text-decoration: none;
  color: #444;
  font-size: 18px;
}


.navbar-area {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  background: var(--white-color);
}



.news-menu .nav-link {
  color: var(--font-color);
  font-size: 22px;
  font-weight: 600;
  padding: 18px 14px;
  white-space: nowrap;
}

.news-menu .nav-link:hover {
  color: var(--Hover-color);
}

.left-tools {
  border-left: 1px solid #ddd;
  padding-left: 5px;
}

#theme-toggle {
  padding: 0px;
}

.theme-btn {
  width: 40px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid #ddd;
  background: var(--font-color);
  padding-top: 10px;
}

.social-icon {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  color: var(--white-color);
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.facebook {
  background: #1877F2;
}

.youtube {
  background: #FF0000;
}

.twitter {
  background: #000;
}

.icon-btn {
  width: 42px;
  height: 42px;
  border: 1px solid #ddd;
  background: var(--white-color);
  color: #444;
  font-size: 16px;
}

.search-btn {
  border-radius: 50%;
}

.dropdown-menu {
  border-radius: 0;
  border: 1px solid var(--white-color);
  margin-top: 0;
}

.dropdown-toggle {
  margin-top: 0px;
}

.dropdown-item {
  padding: 10px 18px;
  font-size: 16px;
}

.dropdown-item:hover {
  background: #f5f5f5;
}

.red-line {
  height: 3px;
  width: 55%;
  margin: auto;
  background: #d40000;
}


/* Tranding News */
.poll-heading {
  text-align: center;

  a {
    text-decoration: none;
    color: var(--font-color);
    font-weight: 600;
    font-size: 20px;
    border-left: 6px solid var(--Hover-color);
    border-right: 6px solid var(--Hover-color);
    padding: 0 20px;
  }

}


.tranding-news {
  background: var(--primary-color);
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .15);
  padding: 0;
  overflow: hidden;
  border-bottom: 2px solid #000;
}

.tranding-news .nav-link {
  color: var(--font-color);
  font-size: 18px;
  padding: 5px 10px 2px 10px;
  transition: .3s;
  font-weight: 600;
}


.tranding-news .nav-link.active {
  background: #f28c28;
  color: var(--white-color);
  border-radius: 10px;
}



.tranding-news ul li a:hover {
  background: var(--Hover-color);
  color: var(--white-color) !important;
  border-radius: 10px;
}

.notice-text {
  text-align: center;
  margin-top: 22px;

  a {
    color: var(--secondary-color);
    font-size: 25px;
    font-weight: 600;
    text-decoration: none;
  }
}

/* news-card */
.news-card {
  border-bottom: 1.5px solid var(--primary-color);
  padding: 10px 5px 10px 10px;
  margin: -10px;
  margin-bottom: 6px;

  h4 {
    font-size: 16px;

    a {
      color: var(--font-color);
      font-weight: 600;

    }
  }

}

/* hero-section */
.hero-section,
.international {
  border-bottom: 3px solid #d9d9d9;
}

.hero-middle-card {
  border-top: 1px solid var(--primary-color);
  margin-top: 5px;
  padding-top: 10px;
}

.hero-middle-card .news-card {
  border: none;
  padding-bottom: 5px;
  margin: 0;
}

.hero-middle .news-card {
  border: none;
  padding: 0px;
  margin: 0px;
}

.hero-middle {
  border-top: 1px solid var(--primary-color);
  border-bottom: 1px solid var(--primary-color);
  margin: 5px 0;
}

.hero-content {

  h2 {
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1.1;
    color: var(--secondary-color);
  }

  h3 {
    font-weight: 600;

    a {
      text-decoration: none;
      color: var(--font-color);
    }
  }

  p {
    line-height: 1.5;
    font-size: 16px;
    font-weight: 400;
    padding-top: 10px;
  }
}

/* hero Conten card */
.hero-content-card,
.international-section {
  margin: 15px 0;

  .news-card {
    h3 {
      margin-top: 10px;
      font-size: 18px;
    }
  }
}

.international-section h3 a {
  font-size: 19px !important;
}

/* text color , decoration font withe */
.text-card h4 a,
.news-card a {
  text-decoration: none;
  color: var(--font-color);
  font-weight: 600;
}

.right-ads {
  border-left: 1px solid var(--primary-color);
  padding-left: 10px;
  margin-left: -8px;
  height: 100%;
}

.btn-search {
  background-color: #323c4d;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  padding: 12px 28px;
  font-size: 16px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.btn-search:hover {
  background: var(--Hover-color, #f68d23);
  color: #ffffff;
}

/* author css starts */
.headline { font-weight: 700; font-size: 1.05rem; line-height: 1.3; color: #111; text-decoration: none; }
.headline:hover { text-decoration: underline; }
.date-text { font-size: 0.85rem; color: #6c757d; }

.custom-load-btn {
  color: #000000;
  border: 1.5px solid #2e6b60;
  background-color: #ffffff;
}

.custom-load-btn:hover {
  background-color: #f8f9fa;
  color: #000000;
}
/* author css ends */

/* category page: sub-nav + article list starts */
.category-section {
  border-bottom: 2px solid var(--secondary-color);
  padding-bottom: 1rem;
}

.category-title {
  color: var(--font-color);
  font-size: 1.6rem;
}

/* Sub-category bar scrolls horizontally on one row instead of wrapping —
   wrapping had no mobile-safe layout of its own and overflowed/clipped
   under the site's global `overflow-x: clip` on narrow viewports. Driven
   by <TagScroller>, the same drag-to-scroll component used by the video
   category tag bar (.tag-scroll) — plain overflow-x: auto touch scrolling
   proved unreliable for this pattern elsewhere in the codebase, so
   touch-action here hands horizontal panning to its pointer-drag JS
   instead of relying on native scroll alone. */
.subnav-scroll {
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  touch-action: pan-y;
  user-select: none;
  cursor: grab;
}

.subnav-scroll.is-dragging {
  cursor: grabbing;
}

.subnav-scroll::-webkit-scrollbar {
  display: none;
}

.subnav-scroll .subnav-link,
.subnav-scroll .separator {
  flex: 0 0 auto;
}

.subnav-link {
  color: var(--font-color);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.95rem;
  white-space: nowrap;
  padding: 0.25rem 0;
  transition: color .2s ease;
}

.subnav-link:hover {
  color: var(--secondary-color);
}

.subnav-link.active {
  color: var(--secondary-color);
}

.separator {
  color: #ccc;
  font-weight: 300;
}

.category-list-item {
  padding: 1.25rem 0.5rem;
  transition: background-color .25s ease;
}

/* Divider between items: a border on the item itself (rather than a
   separate <hr>) so the gap above and below the line is the same —
   each item's own top/bottom padding, not lopsided by the hr sitting
   flush against the content on one side. */
.category-list-item:not(:last-child) {
  border-bottom: 1px solid rgba(108, 117, 125, 0.25);
}

.category-list-item:hover {
  background-color: rgba(246, 141, 35, 0.06);
}

.category-list-item h5 a:hover {
  color: var(--secondary-color) !important;
  transition: color .2s ease;
}

.category-list-item p {
  line-height: 1.6;
}

.category-list-thumb {
  overflow: hidden;
  width: 100%;
  max-width: 220px;
  aspect-ratio: 16 / 9;
}

.category-list-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}

.category-list-item:hover .category-list-thumb img {
  transform: scale(1.06);
}

.load-more-btn {
  border: 1.5px solid var(--font-color);
  color: var(--font-color);
  background-color: transparent;
  transition: background-color .25s ease, color .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}

.load-more-btn:hover:not(:disabled) {
  background-color: var(--secondary-color);
  border-color: var(--secondary-color);
  color: var(--white-color);
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(246, 141, 35, .25);
}

.load-more-btn:disabled {
  opacity: 0.65;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}
/* category page: sub-nav + article list ends */

.text-card h4 {
  font-size: 16px;
}

.hero-content-card .news-card h2 a:hover,
.international-section .news-card h4 a:hover,
.international-section .news-card h3 a:hover,
.text-card h4 a:hover,
.hero-section a:hover,
.election-card .news-card h3 a:hover,
.news-card h4 a:hover,
.news-text a:hover,
.notice-text a:hover,
.sport-right-item .news-card h3 a:hover,
.nationwide-left-card .news-card h3 a:hover,
.sport-content .sport h3 a:hover,
.chittagong h3 a:hover,
.law-news-container .news-item h3 a:hover,
.political-card-left .news-card h3 a:hover,
.news-title-more .nav-link a:hover,
.more-link:hover,
.video-content .video-item h4 a:hover,
.video-right-card .news-card h4 a:hover,
.video .d-flex a:hover,
.video .d-flex .nav-link a:hover,
.special-content .special-item h3 a:hover,
.entertainment-card h3 a:hover,
.entertainment-left-card h3 a:hover,
.art-news-container .news-item h3 a:hover,
.Photogallery-title h4 a:hover,
.Photogallery-title h4 a:hover,
.digital-card h4 a:hover,
.prime-section .online-poll h3 a:hover,
.details-right-card .news-card h2 a:hover,
.news-details-bottom h2 a:hover,
.details-content h5 a:hover,
.recently-news-card h4 a:hover,
.details-more-news h5 a:hover,
.digital-hero .hero-content h2 a:hover {
  color: var(--Hover-color);
  transition: .3s;
}

.mega-links a:hover {
  background: var(--Hover-color);
  color: var(--white-color);
}

.notice-text a:hover {
  color: var(--font-color) !important;
  transition: .3s;

}

.btn-primary:hover {
  background: var(--font-color);
}

/* text-card */
.international-section h4 a {
  font-size: 18px !important;
}

.text-card {
  padding: 10px;
  border: 1.5px solid var(--primary-color);
  border-radius: 5px;
  min-height: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.international-right-card .news-card h4 {
  /* margin-top: 10px; */

  a {
    font-size: 18px !important;
  }

}

.international-right-card .news-card:nth-last-child(1) {
  border: none;
}

.finance-section {
  border-left: 1.5px solid var(--primary-color);
  padding-left: 15px;
  margin-left: -8px;
  height: fit-content;
  padding-top: 10px;
}

.finance-section .news-card:nth-last-child(1) {
  border: none;
}

/* Bangladesh and world Media */
.nav-pills {
  padding: 0px 12px;
}

.bangladesh-media .nav-pills li.nav-item {
  width: 50%;
}


.nav-pills .nav-link {
  /* margin: 0 12px; */
  padding: 10px 52px;
  color: var(--font-color);
  background: var(--white-color);
  border-radius: 0px;
  box-shadow: 0px 5px 5px #888888;
}

.nav-pills .nav-link:hover {
  color: var(--font-color);
  background: var(--Hover-color);
  border-radius: 0px;
}

.nav-pills .nav-link.active {
  color: var(--font-color);
  background: var(--Hover-color);
  border-radius: 0px;
}

.bangladesh-media .nav-pills li.nav-item .nav-link.active {
  width: 100%;
  background: var(--Hover-color);
}

.nav-pills .nav-link:last-child {
  margin-right: 0;
}

.bangladesh-media {
  /* border-left: 1.5px solid var(--primary-color);
  padding-left: 15px;
  margin-left: 8px; */
}

.bangladesh-media .tab-content {
  padding-top: 0;
}

.bangladesh-media .news-card {
  margin: 0px;
  border: none;

  h3 {
    margin-top: 2px;
    line-height: 28px;
  }
}

.bangladesh-media .news-card h3 a {
  font-size: 13px !important;
}

.bangladesh-media .tab-pane {
  background: var(--primary-color);
  padding: 10px;

}

.custom-number {
  font-size: 28px;
  font-weight: bold;
  color: #7a828a;
  line-height: 40px;
  min-width: 25px;
}

.news-text {
  font-size: 14px;
  font-weight: 600;
  color: var(--font-color);
  margin-top: 2px;

  a {
    text-decoration: none;
    color: var(--font-color);
  }
}

.news-bd {
  border-bottom: 2px solid #eef0f2;
  padding-bottom: 5px;
}

.news-bd:last-child {
  border-bottom: none;
}

.video-line {
  margin: 0 10px;
  border-top: 2px solid #ffffff !important;
}

.video {
  background: var(--font-color);

  .news-title-more .nav-link a,
  .more-link {
    color: var(--white-color);
  }
}

.election-card {
  border-right: 1px solid var(--primary-color);
  padding-right: 15px;
  margin-right: -8px;
}

.election-card .news-card {
  margin-bottom: 5px;
  padding-bottom: 8px;

  h3 {
    font-size: 18px;
    margin-top: 8px;
  }
}

.opinion-card {
  border-right: 1px solid var(--primary-color);
  padding: 0 15px;
  margin: 0 -8px 0px -8px;
}

.opinion-card .news-card:nth-last-child(1) {
  border-bottom: none;
}

.election-card>div:nth-child(n+4) .news-card {
  border: none;
}

/* Video Tranding Part */

.video-tranding-news {
  margin-top: 10px;

  .nav-link {
    color: var(--white-color);
    font-size: 13px;
    font-weight: 500;
    padding: 6px 3px;
    transition: .3s;
  }
}

.video-tranding-news .nav-link:hover {
  color: #d96d1f;
}

.video-tranding-news .nav-link.active {
  background: #f28c28;
  color: var(--font-color);

}

.video-right-card {
  padding-bottom: 20px;

  .news-card {
    margin: 0px;
    /* background: #333333; */
    /* border-bottom: 4px solid #999999; */

    h4 {
      padding-bottom: 20px;
      padding-top: 7px;

      a {
        /* color: var(--white-color); */
        font-size: 20px;
      }
    }
  }
}

.video-right-card .news-card:first-child {
  margin-top: 10px;
}

.video-right-card .news-card:last-child {
  border-bottom: none;
}

/* video left Content  */

.video-content .video-item h4 a {
  color: var(--white-color);
  text-decoration: none;
  font-weight: 600;
  font-size: 25px;
}

.video-item,
.Photogallery-item,
.digital-item {
  position: relative;
}

.video-icon,
.digital-icon {
  position: absolute;
  top: 0;
  right: 0px;

  img {
    height: 6rem;
    width: 7.5rem;
  }
}

/* Sport */

.sport-content .sport {
  border: none;

  h3 {
    border: 1px solid var(--primary-color);
    margin-top: -10px;
    font-size: 20px;
    padding: 20px 0px 10px 0px;
  }
}

.sport-right-item .news-card h3 {
  margin-top: 11px;
  padding-bottom: 10px;
  font-size: 18px;
}

.sport-content .text-card {
  margin-top: 15px;
  border: 1.5px solid var(--primary-color);
  border-radius: 5px;
}

/* Prevent API-driven content from changing card and grid alignment. */
.news-card h3 a,
.news-card h4 a,
.news-item .news-title a,
.news-text a,
.Photogallery-title h4 a {
  /*display: -webkit-box;
  overflow: hidden;
   text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; */
}

.text-card h4 a {
  display: -webkit-box;
  overflow: hidden;
  /* text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3; */
}

.hero-content p,
.special-item p,
.entertainment-left-card p,
.card-text {
  display: -webkit-box;
  overflow: hidden;
  /* text-overflow: ellipsis; */
  -webkit-box-orient: vertical;
  /* -webkit-line-clamp: 3; */
}

.sport-right-item .sports-item-column {
  display: flex;
  flex-direction: column;
}

.sport-right-item .sports-item-column > .news-card {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
}

.sport-right-item .news-card img,
.sport-content .sport img {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

.sport-right-item .news-card h3 {
  flex: 1 1 auto;
}

.sport-content .news-card h3 a {
  -webkit-line-clamp: 1;
}

.sport-right-item .sports-item-column > .text-card {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 78px;
}

.sport-right-item .sports-item-column > .text-card h4 {
  margin-bottom: 0;
}

/* Keep API-driven card grids aligned when source images and titles vary. */
.hero-content-card .row > [class*="col-"],
.election-card > [class*="col-"],
.political-card-left .row > [class*="col-"],
.entertainment-card .row > [class*="col-"],
.lifestyle .row > [class*="col-"] {
  display: flex;
}

.hero-content-card .news-card,
.election-card .news-card,
.political-card-left .news-card,
.nationwide-left-card .news-card,
.entertainment-card .news-card,
.lifestyle .news-card {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  width: 100%;
}

.hero-content-card .news-card > a img,
.election-card .news-card > a img,
.political-card-left .news-card > a img,
.nationwide-left-card .news-card > a img,
.entertainment-card .news-card > a img,
.lifestyle .news-card > a img,
.law-news-container .news-item > img,
.art-news-container .news-item > img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.hero-content-card .news-card h3,
.election-card .news-card h3,
.political-card-left .news-card h3,
.nationwide-left-card .news-card h3,
.entertainment-card .news-card h3,
.lifestyle .news-card h3 {
  flex: 1 1 auto;
}

.law > .container > .row > [class*="col-"],
.art-news-container {
  display: flex;
  flex-direction: column;
}

.law-news-container,
.art-news-container {
  height: 100%;
}

.international-right-card .news-card > .row,
.finance-section .news-card > .row,
.interview .news-card > .row{
  align-items: center;
}

.international-right-card .news-card img,
.finance-section .news-card img,
.interview .news-card img,
.video-right-card .news-card img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.international-grid-column,
.world-media-column {
  display: flex;
  flex-direction: column;
}

.international-grid-column > .news-card,
.world-media-column > .news-card {
  display: block;
}

.international-grid-column > .news-card > a img,
.world-media-column > .news-card > a img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

.international-grid-column > .text-card {
  margin-top: 15px;
}

.international-content-row {
  align-items: flex-start;
}

.entertainment-left-card > a img {
  display: block;
  width: 100%;
  /* aspect-ratio: 4 / 3; */
  object-fit: cover;
}

/* Political  Part */
.political .tranding-news {
  margin-bottom: 15px;
}

.political-card-left .news-card h3 {
  padding: 15px 0;
  font-size: 19px;
  border: 1px solid var(--primary-color);
  margin-top: -10px;
  padding: 20px 0px 14px 0px;
}

.political-card-left .news-card {
  border: none;
}

.political-card-left .news-card > a img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.political .international-right-card .news-card img,
.political .finance-section .news-card img {
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

.international-section .international-right-card .news-card img {
  aspect-ratio: 3 / 2;
}

/* Tranding , Reals , Online jorip Slider */
.reals-section {
  background: var(--primary-color);
}

.online-poll {
  background: #F2F2F2;
  padding: 15px;

}

.poll-slider {
  background: #e5e5e5;
  border-radius: 40px;
  padding: 20px;
  position: relative;
}

.tranding-slider {
  background: var(--white-color);
  border-radius: 0px !important;
  padding: 3px 20px;

  .poll-content {
    border-radius: 20px;
  }
}

.tranding-slider .custom-btn {
  top: 50%;

}

.expalin-card {
  padding: 0px 20px;
  background: none;
}

.expalin-card h3 {
  font-size: 18px;
}

.poll-img {
  border: 6px solid var(--Hover-color);
}

.poll-img img {
  object-fit: cover;
}

.poll-text {
  font-size: 18px;
  font-weight: 600;
  text-align: center;
  margin: 10px 0;
  line-height: 1.4;
}

.question {
  background: var(--font-color);
  color: var(--white-color);
  text-align: center;
  padding: 8px;
  font-size: 15px;
  font-weight: 600;
  margin: 15px 0;
}

.vote-area {
  display: flex;
  justify-content: center;
  gap: 18px;
  margin: 10px 0;
}

.vote-area button {
  width: 75px;
  height: 45px;
  border: 5px solid #ff2626;
  border-radius: 10px;
  background: var(--white-color);
  font-size: 25px;
  font-weight: 600;
}

.poll-content p {
  text-align: center;
  font-weight: 600;
}

.custom-btn {
  width: 45px;
  height: 45px;
  background: #c7c7c775;
  border-radius: 50%;
  top: 78%;
  opacity: 1;
  color: var(--font-color);
  font-size: 22px;
}

.carousel-control-prev {
  left: -15px;
}

.carousel-control-next {
  right: -15px;
}

@media(max-width:576px) {

  .online-poll {
    width: 100%;
  }

  .poll-text {
    font-size: 15px;
  }

  .vote-area button {
    width: 80px;
    height: 55px;
    font-size: 24px;
  }
}

/* special-content */

/* .special-content .special-item h3 {
  margin-top: 15px;
  font-size: 22px;
} */

.special-content .international-right-card {
  border-right: 1px solid var(--primary-color);
  padding-right: 20px;
  margin: 0 -17px 0px -8px;
  height: 100%;
}

.interview .news-card:nth-last-child(1) {
  border: none;
}

.interview {
  margin-left: 5px;
}

/* Nationwide  */
.nationwide-searching select {
  padding: 8px 5px;
  font-weight: 600;
  width: 100%;
  border: none;
  background-color: var(--primary-color);
}

.nationwide-searching select option {
  margin-right: 10px;
}

.nationwide-searching button {
  width: 100%;
  border-radius: 0px;
  padding: 8px 5px;
  background: var(--secondary-color);
  border: none;

}

.nationwide-left-card .news-card h3 {
  padding: 17px 0;
  font-size: 19px !important;
}

.nationwide-left-card .news-card {
  border: none;
}

/* chittagong */

.chittagong-card {
  border-left: 1px solid var(--primary-color);
  padding: 0 15px;
  margin: 10px -10px 0px -8px;
}

/* law */

/* .law-news-container .news-item,
.art-news-container .news-item {
  border-top: 1px solid var(--primary-color);
  padding-bottom: 8px;

  h3 {
    margin-top: 5px;
    font-size: 18px;

    a {
      color: var(--font-color);
      text-decoration: none;
    }
  }

  img {
    padding-bottom: 5px;
  }
} */

.law-news-container {
  border-right: 1px solid var(--primary-color);
  padding: 0 10px 8px 10px;
  margin: 0 -12px 0px -12px;
}


.law-news-container .news-title,
.art-news-container .news-title {
  font-weight: 600;
  color: var(--font-color);
  line-height: 1.4;
  transition: color 0.2s ease-in-out;
}

.features-section .law-news-container .news-item {
  border-top: 0;
}

/* entertainment */
.entertainment .container {
  background: #fff4f4;
}


.entertainment-left-card {
  border: none;

  /* h3 {
    padding-top: 15px;
    font-size: 25px;
  } */

}

.entertainment-card .news-card {
  border-right: 1px solid var(--primary-color);
  margin-right: -18px;
  padding-right: 6px;
}

.entertainment-card .row>div:nth-child(2) .news-card,
.entertainment-card .row>div:nth-child(4) .news-card {
  border-right: none;
}

.entertainment-card .row>div:nth-child(4) .news-card,
.entertainment-card .row>div:nth-child(3) .news-card {
  border-bottom: none;
}

/* .entertainment-card h3 {
  margin-top: 10px;
  font-size: 18px;
} */

/* Lifestyle */

/* Read More text */
.news-title-more {
  position: relative;
  padding-left: 18px;

  h2 {
    font-size: 20px;
    font-weight: 600;
    color: var(--font-color);
    white-space: nowrap;
    padding-top: 4px;

    a {
      color: var(--font-color);
      text-decoration: none;
    }
  }

}

.news-title-more::before {
  content: "";
  position: absolute;
  left: 0;
  top: -3px;
  width: 6px;
  height: 36px;
  background: var(--secondary-color);
}

.news-line {
  border-top: 2px solid #222;
  flex-grow: 1;
  margin: 0 20px;
}

.more-link {
  color: var(--font-color);
  text-decoration: none;
  font-size: 20px;
  white-space: nowrap;
}

/* Photogallery */
.Photogallery-title {
  position: absolute;
  bottom: 0;
  left: 0;
}


.Photogallery-title {
  background: rgba(60, 60, 60, 0.75);
  width: 100%;

  h4 {
    padding: 10px 0px 10px 15px;

    a {
      color: var(--font-color);
      text-decoration: none;
      font-weight: 600;
      color: var(--white-color);
    }
  }
}

.Photogallery-title .fa-solid {
  color: var(--Hover-color);
}

.Photogallery-card h4 {
  padding: 3px 0px 3px 3px;
  font-size: 15px;
  color: var(--font-color);

  a {
    text-decoration: none;
    font-weight: normal;

  }
}

/* footer Part */
footer {
  background-color: var(--primary-color);
  padding: 40px 0 30px 0;
}

.newsletter-box {
  width: 400px;
  height: 52px;
  border: 2px solid #6d6d6d;
  border-radius: 12px;
  overflow: hidden;
  background: transparent;

}

.input-area {
  flex: 1;
  display: flex;
  padding: 0 10px;
  background: transparent;
}

.input-area i {
  color: #8d8d8d;
  font-size: 22px;
  margin-right: 10px;
  margin-top: 14px;
}

.input-area input {
  border: none;
  outline: none;
  width: 100%;
  font-size: 15px;
  color: #666;
  background-color: transparent;
}

.input-area input::placeholder {
  color: #9b9b9b;
  font-weight: 600;
}

.subscribe-btn {
  width: 122px;
  border: none;
  background: #2d2d2d;
  color: var(--primary-color);
  font-size: 15px;
  font-weight: 600;
  margin-right: -13px;
}

.subscribe-btn:hover {
  background: #222;
}

.main-logo h3 {
  font-weight: 600;
}

.footer-logo-icon {
  border: 2px solid #2d2d2d;
  border-width: 2px 0px;
  padding: 10px 0;

  img {
    width: 125px;
    height: auto;
  }


  ul {
    padding: 0px 10px;

    li {
      list-style: none;
      text-decoration: none;

      a {
        text-decoration: none;
        color: black;
      }
    }
  }

  .footer-socail-icon {
    ul li a {
      font-size: 16px;
      font-weight: bold;
    }
  }

  .footer-extra-links {
    border-right: 2px solid #2d2d2d;
  }

}

.editor-main {
  border-bottom: 2px solid #2d2d2d;
  margin-bottom: 10px;
}

.editor {
  font-size: 18px;
  padding: 0 20px 0 0;
}

.editor-link ul li {
  list-style: none;

  a {
    text-decoration: none;
    color: var(--font-color);
    font-size: 18px;
  }
}

.footer-rapport {
  font-size: 18px;

  a {
    text-decoration: none;
    color: var(--font-color);
  }
}

.copyright-text {
  ul li {
    list-style: none;

    a {
      color: var(--font-color);
    }
  }
}

/* details */

.news-meta-wrapper {
  max-width: 1000px;
  margin: 30px auto;
  padding: 0 15px;
}

.news-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 28px;
  font-weight: 600;
  color: var(--font-color);
}

.orange-dot {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--Hover-color);
}

.meta-info {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  font-size: 15px;
  font-weight: 600;
  color: var(--font-color);
}

.meta-info .fa-arrow-right-arrow-left {
  display: inline-block;
  transform: rotate(90deg);
}

.updated-time {
  /* border: 2px solid #ff4d4f; */
  padding: 3px 10px;
  display: inline-block;
  background: #fff;
}

hr {
  margin: 18px 0;
  opacity: .15;
}

.social-area {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 15px;
}

.social-left,
.social-right {
  display: flex;
  gap: 10px;
}

.icon-btn {
  width: 38px;
  height: 35px;
  border: 1px solid #ddd;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #222;
  background: #fff;
  text-decoration: none;
  transition: .3s;
}

.icon-btn:hover {
  background: #f5f5f5;
}

.copy-link-btn {
  border: 1px solid #ddd;
  border-radius: 10px;
  height: 44px;
  padding: 0 16px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--font-color);
  text-decoration: none;
  background: var(--white-color);
}

/* digital-hero Part */
.digital-hero {
  border-bottom: none;
}

.digital-hero .hero-content {
  p {
    font-weight: 600;
    text-align: justify;
  }

  h2 {
    a {
      text-decoration: none;
      color: var(--font-color);
      font-weight: 600;

    }

  }
}

.live-icon img {
  width: 100px;
  height: 50px;
  margin-left: -10px;
}

.digital-card h4 a {
  text-decoration: none;
  color: var(--font-color);
  font-weight: 600;
  font-size: 25px;
}

.digital .video-right-card .news-card {
  margin-top: 7px;
}

.prime {
  background: var(--primary-color);
  padding: 10px 0;
}

.prime-section .online-poll {
  background: none;
  box-shadow: none;
  padding: 0px;
}

.reals-card {
  border-radius: 0px;
  background: none;
  box-shadow: none;
  padding: 0px;
}

/* Details Content  */
.details-content {
  h2 {
    font-size: 40px;
    font-weight: 600;
    margin-top: 10px;
  }

  h3 {
    font-size: 40px;
    font-weight: 600;
    color: var(--secondary-color);
    margin-top: 10px;
  }

  h4 {
    font-weight: 600;
    font-size: 25px;
    margin-top: 20px;
    background: var(--primary-color);
    padding: 15px;
  }

  h5 {
    margin-top: 15px;

    a {
      text-decoration: none;
      font-weight: 600;
      border-bottom: 2px solid red;
      color: var(--font-color);
    }
  }

  p {
    font-weight: 400;
    font-size: 20px;
    line-height: 35px;
    text-align: justify;
     color: var(--black-color);
  }
}

.details-more-news h4 a:hover {
  color: var(--font-color);
  transition: .3s;
}

.details-more-news h4 {
  background: none;
  padding: 10px 8px;

  a {
    text-decoration: none;
    color: var(--secondary-color);
  }
}

.details-more-news h5 {
  padding: 10px 8px;
  background: var(--primary-color);
  margin-bottom: 8px;

  a {
    font-weight: 600;
    color: var(--font-color);
    text-decoration: none;
  }

}

.details-news h5 {
  font-weight: 600;
  font-size: 18px;
  margin-top: 10px;
}

.follow-wrapper {
  margin: 20px 0;
  max-width: 650px;
  border: 2px solid #777;
  border-radius: 8px;
  overflow: hidden;
  background: #f8f8f8;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8),
    0 2px 4px rgba(0, 0, 0, .15);
}

.follow-btn {
  min-width: 150px;
  background: var(--secondary-color);
  color: var(--white-color);
  font-size: 20px;
  font-weight: 600;
  text-align: center;
  padding: 10px 10px;
  border-right: 3px solid #2c2c2c;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .2);
}

.social-section {
  flex: 1;
  padding: 10px 15px;
  background: linear-gradient(#ffffff, #f0f0f0);
}

.social-link {
  text-decoration: none;
  font-size: 18px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: .3s;
}

.social-link:hover {
  transform: translateY(-1px);
}

.whatsapp {
  color: #39b54a;
}

.telegram {
  color: #4ea5ff;
  margin-left: 10px;
}

.icon-circle {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 16px;
}

.whatsapp .icon-circle {
  background: #25D366;
}

.telegram .icon-circle {
  background: #347edff0;
}

.details-right-card .news-card h2,
.news-details-bottom h2 {
  margin-top: 10px;
  font-size: 24px;
}

.details-right-card .news-card h2 {
  font-size: 24px;
}



.news-details-poll .tab-content {
  padding: 15px 5px;
}

.recently-news-titile {
  margin-bottom: 20px;
  margin-top: 10px;

  h3 {
    font-weight: 600;
    font-size: 24px;
  }
}

.recently-news-card a img {
  border-radius: 8%;
}

.recently-news-card h4 {
  padding-top: 8px;

  a {
    text-decoration: none;
    color: var(--font-color);
    font-weight: 600;
    text-align: justify;
  }
}

/* Mega Menu */

.sticky-top {
  position: sticky;
  top: 0;
  z-index: 9998;
}

.icon-btn {
  cursor: pointer;
}

.modal {
  z-index: 9999;
}

/* The sticky navbar (.sticky-top, z-index: 9998) sits in its own stacking
   context right below the mega-menu modal. Bootstrap's modal show/hide is a
   plain display toggle — it doesn't force the browser to re-composite that
   sticky layer, so on some engines the navbar's last-painted pixels stay
   ghosted on screen underneath the modal's content instead of being cleanly
   replaced. Dropping it to a normal static box while the modal is open (body
   gets .modal-open from Bootstrap automatically) removes the stale layer
   entirely — it isn't needed anyway since the fullscreen modal already
   covers it. */
body.modal-open .sticky-top {
  position: static;
}

.modal-header .barnd-logo-modal img {
  width: 150px;
  height: 70%;
  margin-left: 25px;
}

.modal-header .btn-close {
  font-size: 20px;
  margin-top: 4px;
}

.mega-menu-nav {
  border-bottom: 1px solid #ddd;
  padding-bottom: 15px;

  ul {
    list-style: none;
  }
}

.mega-menu-list {
  border-bottom: 1px solid #ddd;
  padding: 25px 0;
}

.mega-menu-list ul li:nth-child(1) {
  a {
    font-weight: 600;
    margin-right: 10px;
    background: none;
  }
}

.mega-menu-list ul li a {
  text-decoration: none;
  font-size: 16px;
  padding: 2px 5px;
  border-radius: 5px;
  margin: 0 4px;
}

.mega-menu-list ul li {
  padding: 0 5px;
}

.dropdown-icon {
  display: none;
}

.mega-menu-nav .nav-item a:hover {
  color: var(--Hover-color);
}


.mega-card {
  background: var(--white-color);
  border-radius: 15px;
  padding: 20px;
  height: 100%;
}


/* sticky Menu Css */
.logo-wrapper {
  width: 0;
  overflow: hidden;
  opacity: 0;
  margin-right: 0;
  margin-left: -12px;
  transition: all .4s ease;
  white-space: nowrap;
}

.sticky-logo {
  height: 32px;
  width: 100px;
}

.navbar.sticky-active .logo-wrapper {
  width: 100px;
  opacity: 1;
  margin-right: 10px;
  margin-left: 0px;
}

[data-bs-theme="dark"] body,
[data-bs-theme="dark"] h1,
[data-bs-theme="dark"] h2 a,
[data-bs-theme="dark"] h3 a,
[data-bs-theme="dark"] h4 a,
[data-bs-theme="dark"] h5 a,
[data-bs-theme="dark"] p,
[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .more-link,
[data-bs-theme="dark"] .card-title,
[data-bs-theme="dark"] .date-text,
[data-bs-theme="dark"] .nav-item,
[data-bs-theme="dark"] .footer-extra-links ul li a,
[data-bs-theme="dark"] .quick-links a,
[data-bs-theme="dark"] .editor-link ul li a,
[data-bs-theme="dark"] .footer-socail-icon ul li a,
[data-bs-theme="dark"] .footer-rapport a,
[data-bs-theme="dark"] .copyright-text a,
[data-bs-theme="dark"] .nav-link-item,
[data-bs-theme="dark"] .card-text {
  color: #ffffff !important;

}

/* The dark-theme rule above forces every .nav-link-item white via
   !important, which would otherwise swallow the active-tab accent color
   entirely in dark mode (only the underline would remain visible). */
[data-bs-theme="dark"] .nav-link-item.active {
  color: var(--Hover-color) !important;
}

[data-bs-theme="dark"] footer {
  background: rgb(25 25 25) !important;
}

[data-bs-theme="dark"] .prime {
  background: rgb(25 25 25) !important;
}

[data-bs-theme="dark"] .prime .poll-heading a {
  color: var(--white-color) !important;
}

[data-bs-theme="dark"] .nav-link {
  color: var(--white-color);
}

[data-bs-theme="dark"] .nav-link.active {
  color: var(--Hover-color);
}

[data-bs-theme="dark"] .carousel-indicators button {
  background-color: var(--white-color);
}

[data-bs-theme="dark"] .poll-heading a {
  color: var(--font-color) !important;
}

[data-bs-theme="dark"] .nationwide-searching select {
  color: var(--font-color);
  background: var(--white-color);
}

[data-bs-theme="dark"] body {
  background: rgb(25 25 25) !important;
}

[data-bs-theme="dark"] .tranding-news {
  background: rgb(25 25 25) !important;
  border-bottom: 2px solid var(--primary-color);
}

[data-bs-theme="dark"] .navbar-area {
  background: rgb(25 25 25) !important;
}


[data-bs-theme="dark"] .news-line {
  border-top: 2px solid var(--white-color);
}

[data-bs-theme="dark"] .entertainment .container {
  background: transparent;
}

[data-bs-theme="dark"] .dropdown-item {
  color: var(--white-color);
}

[data-bs-theme="dark"] .mega-card {
  background: rgb(25 25 25);
}


[data-bs-theme="dark"] .details-more-news h5 {
  background: transparent;
}

[data-bs-theme="dark"] .dropdown-item:hover {
  background: var(--primary-color);
  color: var(--secondary-color);
}

[data-bs-theme="dark"] .expalin-card .news-card h3 a,
[data-bs-theme="dark"] .vote-area button {
  color: var(--font-color) !important;
}

[data-bs-theme="dark"] .prime-section .poll-text,
[data-bs-theme="dark"] .prime-section .poll-content p {
  color: var(--white-color) !important;
}

[data-bs-theme="dark"] .bangladesh-media .tab-pane {
  background: transparent;

  .news-text a {
    color: var(--white-color);
  }
}

[data-bs-theme="dark"] .social-icon,
.theme-btn {
  background: var(--white-color) !important;
  color: var(--font-color);
}

[data-bs-theme="dark"] .nav-pills .nav-link {
  color: var(--white-color) !important;
}

[data-bs-theme="light"] .nav-pills .nav-link.active {
  color: var(--white-color);
}

[data-bs-theme="dark"] #btn-light,
#btn-dark {
  color: var(--font-color) !important;
}

[data-bs-theme="dark"] .notice-text a:hover {
  color: var(--Hover-color) !important;
}

[data-bs-theme="dark"] h2 a:hover,
h1 a:hover,
h2 a:hover,
h3 a:hover,
.footer-rapport a:hover,
.footer-socail-icon ul li a:hover,
.editor-link ul li a:hover,
.editor-link ul li a:hover,
h4 a:hover,
.nav-link:hover,
.quick-links a:hover,
.copyright-text a:hover,
.details-more-news h5 a:hover,
.nav-link-item:hover {
  color: var(--Hover-color) !important;
  transition: .3s;
}

/* Text that inherits its color from var(--font-color)/var(--black-color) or a
   hardcoded dark literal, rendered on a background that turns dark in dark mode. */
[data-bs-theme="dark"] .news-menu .nav-link,
[data-bs-theme="dark"] .tranding-news .nav-link,
[data-bs-theme="dark"] .news-card h4 a,
[data-bs-theme="dark"] .hero-content h3 a,
[data-bs-theme="dark"] .text-card h4 a,
[data-bs-theme="dark"] .news-card a,
[data-bs-theme="dark"] .nav-pills .nav-link:hover,
[data-bs-theme="dark"] .nav-pills .nav-link.active,
[data-bs-theme="dark"] .news-text,
[data-bs-theme="dark"] .news-text a,
[data-bs-theme="dark"] .video-tranding-news .nav-link.active,
[data-bs-theme="dark"] .law-news-container .news-title,
[data-bs-theme="dark"] .art-news-container .news-title,
[data-bs-theme="dark"] .news-title-more h2,
[data-bs-theme="dark"] .news-title-more h2 a,
[data-bs-theme="dark"] .Photogallery-card h4,
[data-bs-theme="dark"] .footer-logo-icon ul li a,
[data-bs-theme="dark"] .copyright-text ul li a,
[data-bs-theme="dark"] .news-title,
[data-bs-theme="dark"] .meta-info,
[data-bs-theme="dark"] .digital-hero .hero-content h2 a,
[data-bs-theme="dark"] .digital-card h4 a,
[data-bs-theme="dark"] .details-content h5 a,
[data-bs-theme="dark"] .details-more-news h4 a:hover,
[data-bs-theme="dark"] .details-more-news h5 a,
[data-bs-theme="dark"] .recently-news-card h4 a,
[data-bs-theme="dark"] .fs-nd-lead,
[data-bs-theme="dark"] .fs-nd,
[data-bs-theme="dark"] .fs-nd a,
[data-bs-theme="dark"] .fs-nd-lead a,
[data-bs-theme="dark"] .list-group-item .fw-bold,
[data-bs-theme="dark"] .list-group-item a,
[data-bs-theme="dark"] .listing-page .news-title-more h1 a,
[data-bs-theme="dark"] .listing-video-card h2 a,
[data-bs-theme="dark"] .category-post h2 a,
[data-bs-theme="dark"] .category-post p,
[data-bs-theme="dark"] .sports-section .featured-news h2 a,
[data-bs-theme="dark"] .sports-section .small-news h5 a,
[data-bs-theme="dark"] .news-widget .nav-link,
[data-bs-theme="dark"] .news-widget .nav-link.active,
[data-bs-theme="dark"] .news-widget .news-time,
[data-bs-theme="dark"] .news-widget .news-title a {
  color: var(--white-color) !important;
}

.mobile-search {
  border: none;
  margin-top: 15px;
}

/* Scorling Nav Bar */
.custom-navbar {
  display: flex;
  align-items: center;
  padding: 0;
  overflow: hidden;
  max-width: 100%;
  margin-left: -9px;
}

.scrollable-menu {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  white-space: nowrap !important;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  flex-grow: 1;
}

.scrollable-menu::-webkit-scrollbar {
  display: none;
}

.scrollable-menu {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.scrollable-menu .api-menu {
  flex-wrap: nowrap;
  width: max-content;
  min-width: 100%;
  margin: 0;
  padding: 0;
}

.scrollable-menu .api-menu > .nav-item {
  flex: 0 0 auto;
}

.scrollable-menu .api-menu .dropdown-menu .nav-item {
  width: 100%;
}


.nav-link-item {
  position: relative;
  display: inline-block;
  color: var(--font-color);
  text-decoration: none;
  padding: 8px 10px;
  font-weight: 600;
  font-size: 18px;
  transition: all 0.2s ease;
}

.nav-link-item:hover {
  color: var(--Hover-color);
}

/* Current-section indicator — an accent underline plus the same accent
   color .nav-link-item:hover already uses, so "you are here" reads at a
   glance instead of every tab looking identical regardless of which page
   is actually open. */
.nav-link-item.active {
  color: var(--Hover-color);
}

.nav-link-item.active::after {
  content: '';
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 2px;
  height: 2px;
  border-radius: 2px;
  background: var(--Hover-color);
}

@media (min-width: 992px) {
  .scrollable-menu {
    justify-content: space-around;
    /* Was `overflow-x: visible` — with `.custom-navbar { overflow: hidden }`
       wrapping this, any items that didn't fit the container's width (e.g.
       the video header's 10 items, several with long Bangla labels) were
       silently clipped and permanently unreachable on desktop, with no
       scrollbar and no error. Scrolling now stays available whenever
       content actually overflows; when it fits, space-around still looks
       identical to before. */
  }
}

.header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: nowrap;
  gap: 8px;
}

.header-actions .left-tools,
.header-actions .right-tools {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 8px;
  margin: 0;
}

.header-actions .left-tools {
  height: 38px;
  padding-left: 8px;
}

.header-actions #theme-toggle,
.header-actions .social-icon,
.header-actions .icon-btn {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  margin: 0;
}

.header-actions .theme-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  padding: 0;
}

.header-actions .icon-btn {
  border-radius: 10px;
}

.header-actions .search-btn a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

/* Keep supplied ad artwork inside its slot instead of growing the hero row. */
body,
button,
input,
select,
textarea {
  font-family: 'Kalpurush', sans-serif !important;
}

.fs-nd-lead {
  color: var(--black-color);
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 1.3;
  text-decoration: none;
}

.fs-nd {
  color: var(--black-color);
  font-size: 1.1rem;
  font-weight: 600;
  line-height: 1.4;
  text-decoration: none;
}

.fs-nd a,
.fs-nd-lead a {
  color: var(--black-color);
  text-decoration: none;
}

.text-secondary {
  color: #5b7485 !important;
  font-weight: 700;
}

.entertainment .entertainment-left-card img,
.entertainment .entertainment-card img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}
.entertainment .entertainment-left-card h3,
.entertainment .entertainment-left-card h3 a,
.entertainment .entertainment-card h3,
.entertainment .entertainment-card h3 a {
  font-weight: 600 !important;
}
.entertainment .entertainment-left-card p {
  font-size: 1rem;
  line-height: 1.55;
}

.list-group-item {
  transition: .2s;
}

.list-group-item:hover {
  background: #f8f9fa;
}

.list-group-item .fw-bold {
  color: #1b2430;
  transition: .2s;
}

.list-group-item:hover .fw-bold {
  color: #0d6efd;
}

.list-group-item a {
  color: #212529;
  transition: color .2s ease;
}

.list-group-item a:hover {
  color: #dc3545;
  text-decoration: underline;
}

.list-group-item img {
  flex-shrink: 0;
  object-fit: cover;
}

.law-grid-section .law-news-container .news-item {
  border-top: 0;
}
.law-grid-section .law-news-container .news-item img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}
.law-grid-section .law-news-container h3,
.law-grid-section .law-news-container h3 a,
.law-grid-section .law-news-container .list-group-item a {
  font-weight: 600 !important;
}
.law-grid-section .row > div:last-child .law-news-container {
  border-right: 0;
}

.special-content .special-item img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}
.special-content .special-item h3,
.special-content .special-item h3 a,
.special-content .special-report-list h4,
.special-content .interview h4 {
  font-weight: 600 !important;
}
.special-content .special-report-list img,
.special-content .interview img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
.special-content .special-report-list small {
  display: inline-block;
  margin-top: 5px;
}

/* video detail page */
.leading-relaxed {
  line-height: 1.6;
}
.leading-snug {
  line-height: 1.3;
}
.tracking-wide {
  letter-spacing: 0.05em;
}
.group:hover .hover-underline {
  text-decoration: underline;
}
/* The CMS embed's <iframe> ships with hardcoded width/height attributes
   (e.g. 1410x793), which render at native size and get cropped by this
   wrapper's overflow:hidden instead of scaling to fit. Force it responsive.
   Position:absolute (resolved against .video-embed-frame's own
   position:relative) is used instead of height:100%, because the CMS body
   wraps the iframe in <p><a>...</a></p> — auto-height ancestors that would
   break a height:100% percentage chain but don't affect an absolute
   containing-block lookup. */
.video-embed-frame {
  aspect-ratio: 16 / 9;
}
.video-embed-frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.video-thumb img {
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.title-more {
  position: relative;
}
.title-more h2 {
  font-size: 20px;
  font-weight: 600;
  color: var(--font-color);
  white-space: nowrap;
  padding-top: 4px;
}
.title-more h2 a {
  color: var(--font-color);
  text-decoration: none;
}
.title-more::before {
  content: "";
  position: absolute;
  left: 0;
  top: -3px;
  width: 6px;
  height: 36px;
}
.more-line {
  border-top: 2px solid #ffffff;
  flex-grow: 1;
  margin: 0 0 0 20px;
}

.politics-category-slider .tag-scroll {
  display: flex;
  flex-flow: row nowrap;
  width: 100%;
}
.politics-category-slider .carousel-cell {
  flex: 0 0 auto;
  width: auto;
  margin-right: 10px;
}
.politics-feature-card .card-img-top {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}
.politics-feature-card h3,
.politics-feature-card h3 a {
  font-weight: 600 !important;
}
.politics-side-list h5 {
  font-weight: 700 !important;
}
.politics-feature-card p {
  font-size: 1rem;
  line-height: 1.55;
}
.politics-side-list img {
  flex: 0 0 120px;
  width: 120px;
  height: 90px;
  object-fit: cover;
}
.politics-section .politics-side-list .list-group-item:last-child {
  border-bottom: 0 !important;
}
.politics-section .finance-section {
  height: auto;
  margin-left: 0;
  padding-left: 0;
  padding-top: 0;
  border-left: 0;
}

.listing-page .news-title-more h1 {
  margin: 0;
  font-size: 1.7rem;
  font-weight: 600;
  white-space: nowrap;
}
.listing-page .news-title-more h1 a { color: var(--font-color); }
.listing-video-image {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 6px;
  background: #222;
}
.listing-video-image img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.listing-play {
  position: absolute;
  top: 50%; left: 50%;
  display: grid;
  width: 48px; height: 48px;
  place-items: center;
  border: 3px solid #fff;
  border-radius: 50%;
  color: #fff;
  background: #f50045;
  transform: translate(-50%, -50%);
}
.listing-video-card h2 { margin-top: 10px; font-size: 1.15rem; line-height: 1.4; }
.listing-video-card h2 a { color: var(--font-color); font-weight: 600; }
.listing-video-card.is-featured h2 { font-size: 1.7rem; }
.category-post {
  display: flex;
  gap: 24px;
  justify-content: space-between;
  padding: 0 0 24px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--primary-color);
}
.category-post-copy { flex: 1; min-width: 0; }
.category-post h2 { font-size: 1.45rem; line-height: 1.4; }
.category-post h2 a { color: var(--font-color); font-weight: 600; }
.category-post p {
  display: -webkit-box;
  margin-top: 10px;
  color: #666;
  line-height: 1.55;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.category-post-image { flex: 0 0 180px; }
.category-post-image img {
  width: 180px; height: 123px;
  border-radius: 4px;
  object-fit: cover;
}
.listing-sidebar { border-left: 1px solid var(--primary-color); padding-left: 24px; }
.listing-ad { display: block; width: min(100%, 300px); height: auto; margin: 0 auto; }
.sidebar-title { padding-bottom: 8px; border-bottom: 3px solid var(--secondary-color); font-size: 1.4rem; }
@media (max-width: 767.98px) {
  .listing-video-card.is-featured h2 { font-size: 1.35rem; }
  .category-post { gap: 12px; }
  .category-post h2 { font-size: 1.15rem; }
  .category-post p { display: none; }
  .category-post-image { flex-basis: 110px; }
  .category-post-image img { width: 110px; height: 80px; }
  .listing-sidebar { border-left: 0; padding-left: calc(var(--bs-gutter-x) * .5); }
}

.sports-section .featured-news img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}
.sports-section .featured-news h2 a,
.sports-section .small-news h5 a {
  color: var(--font-color);
  text-decoration: none;
}
.sports-section .featured-news h2 {
  font-size: 2rem;
  line-height: 1.2;
}
.sports-section .featured-news h2,
.sports-section .featured-news h2 a {
  font-weight: 700 !important;
}
.sports-section .featured-news p {
  font-size: 1rem;
  line-height: 1.55;
}
.sports-section .small-news img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}
.sports-section .small-news h5,
.sports-section .small-news h5 a {
  font-size: 1.25rem;
  font-weight: 700 !important;
  line-height: 1.35;
}
.sports-section .sports-text-list .fs-nd {
  font-size: 1.1rem;
  font-weight: 600 !important;
  line-height: 1.4;
}
.sports-section .sports-text-list .list-group-item {
  background: transparent;
}
.sports-section .sports-ad {
  display: block;
  width: 100%;
  height: auto;
}
@media (max-width: 991.98px) {
  .sports-section .featured-news h2 { font-size: 1.6rem; }
  .sports-section .small-news h5,
  .sports-section .small-news h5 a { font-size: 1.1rem; }
}

.video-category-slider .tag-scroll {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  width: 100%;
  color: #fff;
}
.video-category-slider .carousel-cell {
  display: inline-block;
  flex: 0 0 auto;
  width: auto;
  margin-right: 12px;
  white-space: nowrap;
}
.video-category-slider {
  width: 100%;
  overflow: hidden;
}
.video-content .video-image img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.video-play-icon {
  position: absolute;
  z-index: 2;
  line-height: 0;
}
.featured-play { top: 0; right: 0; }
.side-play { top: 0; right: 0; }
.video-right-card .video-card {
  margin-top: 10px;
  padding-bottom: 10px;
  border-bottom: 2px solid #999999;
  background: #333;
}
.video-right-card .video-card:last-child { border-bottom: 0; }
.video-right-card .video-card img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.video-right-card .video-card h4 { padding: 8px 16px; }
.video-right-card .video-card h4 a {
  color: #fff;
  font-size: 1.1rem;
  font-weight: 600 !important;
  line-height: 1.4;
}

.opinion-avatar {
  width: 70px;
  height: 70px;
  object-fit: cover;
}

.election-ad {
  display: block;
  width: 100%;
  height: auto;
}

/* Election cards use one row divider; individual card borders caused double lines. */
.election-card .news-card {
  border-bottom: 0 !important;
}

.election-card.border-bottom {
  border-bottom: 1px solid var(--primary-color) !important;
}

.international-feature-card .card-img-top {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.international-section .international-feature-card .fs-nd,
.international-section .international-list-item h4,
.international-section .international-list-item .fs-nd,
.international-section .international-list-item a {
  font-weight: 600 !important;
}

.international-list-item img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.news-widget {
  max-width: 420px;
  border: 1px solid #ddd !important;
}

.news-widget .nav-tabs { border-bottom: 1px solid #bbb; }
.news-widget .nav-link {
  border: 0;
  color: #222;
  font-size: 18px;
  font-weight: 700;
  padding: 0.75rem 1rem;
}
.news-widget .nav-link.active {
  color: #000;
  border: 0;
  border-bottom: 3px solid #d70000;
}
.news-widget .news-list {
  max-height: 450px;
  overflow-y: auto;
}
.news-widget .news-item {
  display: flex;
  gap: 18px;
  padding: 18px 0;
  border-bottom: 1px solid #e5e5e5;
}
.news-widget .news-time {
  width: 42px;
  flex-shrink: 0;
  color: #666;
  font-size: 18px;
}

.news-widget .popular-news-item {
  width: 25px;
  flex-shrink: 0;
  color: #666;
  font-size: 18px;
}
.news-widget .news-title { flex: 1; }
.news-widget .news-title a {
  color: #222;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
  text-decoration: none;
}
.news-widget .news-list::-webkit-scrollbar { width: 7px; }
.news-widget .news-list::-webkit-scrollbar-track { background: #f1f1f1; }
.news-widget .news-list::-webkit-scrollbar-thumb {
  background: #b7b7b7;
  border-radius: 10px;
}
.category-slider .carousel-cell {
  width: auto;
  margin-right: 10px;
}

.btn-tag {
  display: inline-block;
  padding: 8px 20px;
  border: 1px solid #e0e0e0;
  border-radius: 50px;
  background-color: #f8f9fa;
  color: #212529;
  font-size: 0.95rem;
  text-decoration: none;
  pointer-events: auto;
  transition: all 0.2s ease-in-out;
}

.btn-tag:hover {
  border-color: #ced4da;
  background-color: #e9ecef;
  color: #000;
}

.category-bar {
  display: flex;
  align-items: center;
  overflow: hidden;
}

.tag-scroll,
.category-slider {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
}

.tag-scroll:active,
.tag-scroll.is-dragging,
.category-slider:active,
.category-slider.is-dragging {
  cursor: grabbing;
}

.tag-scroll::-webkit-scrollbar,
.category-slider::-webkit-scrollbar {
  display: none;
}

.tag-scroll .carousel-cell,
.category-slider .carousel-cell {
  width: auto;
  margin-right: 8px;
  -webkit-user-drag: none;
}

.tag-trending,
.tag-trending:hover {
  background-color: #f68d23;
  border-color: #f68d23;
  color: #fff;
}

.hero-section .top-ads {
  min-height: 70px;
  max-height: 85px;
  overflow: hidden;
}

.hero-section .top-ads img {
  width: min(100%, 728px);
  height: 70px;
  object-fit: contain;
}

@media (max-width: 767.98px) {
  .hero-section .top-ads {
    min-height: 50px;
    max-height: 65px;
  }

  .hero-section .top-ads img {
    height: 50px;
  }
}

.right-ads {
  height: auto;
  overflow: visible;
}

.right-ads .sidebar-ad {
  display: block;
  width: 100%;
  height: auto !important;
  max-height: none;
  aspect-ratio: auto;
  object-fit: initial;
}

.right-ads > div,
.right-ads > div > div {
  height: auto;
  min-height: 0;
  overflow: visible;
}

.hero-img img,
.hero-content-card .news-card > a img {
  width: 100%;
  object-fit: cover;
}

@media (min-width: 992px) {
  .hero-img img {
    aspect-ratio: 622 / 350;
  }
}

@media (max-width: 991.98px) {
  .right-ads {
    border-left: 0;
    padding-left: 0;
    margin-left: 0;
  }

  .right-ads .sidebar-ad {
    width: min(100%, 300px);
  }
}



.horizontal-list {
  display: flex;
  flex-wrap: wrap; /* Allows items to wrap to the next line */
  list-style: none;
  padding: 0;
  margin: 0;
  gap: 12px 20px; /* Vertical gap, Horizontal gap */
}

.horizontal-list li {
  white-space: nowrap; /* Prevents words inside a single item from breaking */
}

.horizontal-list li a{
  color: #000;
}



 

.title-hanger {
    color: var(--highlight-light);
    font-size: 1.35rem;
}


.title-hanger::after {
    content: "•";
    color: #212529; /* Bootstrap text-dark */
    margin: 0 8px;
}







.reel-card {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    aspect-ratio: 3 / 5;
    background: #eee;
}

.reel-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reel-title {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;

    padding: 40px 10px 10px;

    color: #fff;
    font-size: 14px;
    font-weight: 600;

    background: linear-gradient(
        transparent,
        rgba(0, 0, 0, 0.85)
    );
}








.block-title {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 14px;
}

.block-title-line {
  flex: 1;
  height: 1px;
  background-color: #f68d23;
}

.block-title-text {
  position: relative;
  color: #000000;
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  padding: 0 2px;
}

/* Small decorative strokes around the title */
/* .block-title-text::before,
.block-title-text::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 7px;
  height: 1px;
  background: #000000;
}

.block-title-text::before {
  left: -7px;
  transform: rotate(55deg);
}

.block-title-text::after {
  right: -7px;
  transform: rotate(-55deg);
} */



 

.custom-swiper-prev,
.custom-swiper-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);

    width: 36px;
    height: 36px;

    border-radius: 50%;
    background: #f68d23;
    color: #fff;

    display: flex;
    align-items: center;
    justify-content: center;

    z-index: 10;
    cursor: pointer;
}

.custom-swiper-prev {
    left: 10px;
}

.custom-swiper-next {
    right: 10px;
}

.custom-swiper-prev:hover,
.custom-swiper-next:hover {
    background: #e57912;
}

.bg-explainer{
  background: #f68d23;
}