/**
 * Shadhin360 - Complete Dark & Light Mode Stylesheet
 * Covers all layout elements, newsbox templates (box1-box16, tab1, ad),
 * header toggle button, navigation, typography, lines, and widgets.
 */

/* ==========================================================================
   1. Theme Variables & Base Transitions
   ========================================================================== */
:root {
  --dm-bg-body: #111418;
  --dm-bg-surface: #181d24;
  --dm-bg-elevated: #222832;
  --dm-bg-card: #1c222b;
  --dm-text-primary: #f3f4f6;
  --dm-text-secondary: #94a3b8;
  --dm-text-muted: #64748b;
  --dm-border-color: rgba(255, 255, 255, 0.12);
  --dm-border-light: rgba(255, 255, 255, 0.08);
  --dm-border-focus: #DF2027;
  --dm-brand-red: #DF2027;
  --dm-brand-red-hover: #ff3b44;
}

body,
.header,
.top-bar,
.main-nav-bar,
.footer,
.mainfooter,
.footer_copy_right,
.mobile-footer,
.news-item,
.bbody-news-item,
.body-news-item,
.title-aria-glob,
.side-grid-wrap,
.lead-wrap,
.video-gallery {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* ==========================================================================
   2. Light / Dark Mode Toggle Buttons (Desktop Slide Toggle & Mobile Single)
   ========================================================================== */
.theme-mode-toggle {
  display: inline-block;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  vertical-align: middle;
}

/* --- A. Desktop Slide Toggle Switch (Sun - Track/Thumb - Moon) --- */
.theme-slide-toggle {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: #ffffff;
  border: 1px solid #d2ded7;
  border-radius: 999px;
  padding: 3px 9px;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  transition: background-color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.theme-slide-toggle:hover {
  border-color: #60a5fa;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transform: translateY(-1px);
}

/* Sun Icon */
.theme-slide-toggle .slide-toggle-sun {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #f59e0b;
  stroke: #f59e0b;
  line-height: 1;
  transition: color 0.25s ease, stroke 0.25s ease, opacity 0.25s ease, transform 0.25s ease;
}

.theme-slide-toggle .slide-toggle-sun svg {
  width: 15px;
  height: 15px;
}

/* Middle Track */
.theme-slide-toggle .slide-toggle-track {
  position: relative;
  display: inline-block;
  width: 42px;
  height: 22px;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

/* Sliding Knob / Thumb */
.theme-slide-toggle .slide-toggle-thumb {
  position: absolute;
  top: 2px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #60a5fa; /* Soft Blue circle like user uploaded image */
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.3s ease, box-shadow 0.3s ease;
}

/* Moon Icon */
.theme-slide-toggle .slide-toggle-moon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
  stroke: #94a3b8;
  opacity: 0.55;
  line-height: 1;
  transition: color 0.25s ease, stroke 0.25s ease, opacity 0.25s ease, transform 0.25s ease;
}

.theme-slide-toggle .slide-toggle-moon svg {
  width: 14px;
  height: 14px;
}

/* Desktop Slide Toggle: Dark Mode Active State ("ডার্ক মোডে ডার্ক") */
html.dark-mode .theme-slide-toggle,
body.dark-mode .theme-slide-toggle {
  background: #181d24 !important; /* Dark background in dark mode */
  border-color: rgba(255, 255, 255, 0.16) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}

html.dark-mode .theme-slide-toggle:hover,
body.dark-mode .theme-slide-toggle:hover {
  border-color: #38bdf8 !important;
  box-shadow: 0 0 10px rgba(56, 189, 248, 0.3);
}

/* Dark mode: Sun muted */
html.dark-mode .theme-slide-toggle .slide-toggle-sun,
body.dark-mode .theme-slide-toggle .slide-toggle-sun {
  color: #64748b !important;
  stroke: #64748b !important;
  opacity: 0.45;
  transform: scale(0.92);
}

/* Dark mode: Track turns dark */
html.dark-mode .theme-slide-toggle .slide-toggle-track,
body.dark-mode .theme-slide-toggle .slide-toggle-track {
  background: #252e3b !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
}

/* Dark mode: Thumb slides right (toward Moon) */
html.dark-mode .theme-slide-toggle .slide-toggle-thumb,
body.dark-mode .theme-slide-toggle .slide-toggle-thumb {
  transform: translateX(19px);
  background: #38bdf8 !important; /* Glowing Sky Blue */
  box-shadow: 0 0 8px rgba(56, 189, 248, 0.6);
}

/* Dark mode: Moon bright and active */
html.dark-mode .theme-slide-toggle .slide-toggle-moon,
body.dark-mode .theme-slide-toggle .slide-toggle-moon {
  color: #93c5fd !important;
  stroke: #93c5fd !important;
  opacity: 1;
  transform: scale(1.08);
}

/* --- B. Mobile Single Round Button (#theme-toggle-mobile) --- */
.round-icon.theme-mode-toggle .theme-toggle-inner {
  width: 34px;
  height: 34px;
  border: 1px solid #d1d5db;
  background: #ffffff;
  border-radius: 50%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: border-color 0.25s ease, background-color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease;
}

.round-icon.theme-mode-toggle:hover .theme-toggle-inner {
  transform: scale(1.08);
  border-color: #60a5fa;
}

.round-icon.theme-mode-toggle .icon-moon {
  display: inline-block;
  color: #1e293b;
  stroke: #1e293b;
  transition: transform 0.3s ease;
}

.round-icon.theme-mode-toggle .icon-sun {
  display: none;
  color: #f59e0b;
  stroke: #f59e0b;
  fill: #f59e0b;
  transition: transform 0.3s ease;
}

/* Mobile Toggle Dark Mode Active State (on white mobile header) */
html.dark-mode .round-icon.theme-mode-toggle .theme-toggle-inner,
body.dark-mode .round-icon.theme-mode-toggle .theme-toggle-inner {
  background: #1e242d !important;
  border-color: #3b4453 !important;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.25);
}

html.dark-mode .round-icon.theme-mode-toggle .icon-moon,
body.dark-mode .round-icon.theme-mode-toggle .icon-moon {
  display: none !important;
}

html.dark-mode .round-icon.theme-mode-toggle .icon-sun,
body.dark-mode .round-icon.theme-mode-toggle .icon-sun {
  display: inline-block !important;
  color: #fbbf24;
  stroke: #fbbf24;
  fill: #fbbf24;
}


/* ==========================================================================
   3. Global Dark Mode Body & Base Elements
   ========================================================================== */
html.dark-mode,
body.dark-mode {
  --nav-bg-color: #14181f;
  --nav-text-color: #f3f4f6;
  --nav-text-hover-color: #ff4d4f;
  background-color: #111418 !important;
  color: #f3f4f6 !important;
}

html.dark-mode body {
  background-color: #111418 !important;
  color: #f3f4f6 !important;
}

body.dark-mode a {
  color: #f3f4f6;
}

body.dark-mode a:hover,
body.dark-mode a:hover .title25,
body.dark-mode a:hover .title22,
body.dark-mode a:hover .title30,
body.dark-mode a:hover .newboxtitle {
  color: #ff3b44 !important;
}

/* Global headings */
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6 {
  color: #f3f4f6;
}

/* Global text helpers */
body.dark-mode .title25,
body.dark-mode .title22,
body.dark-mode .title30,
body.dark-mode .title22-o,
body.dark-mode .newboxtitle {
  color: #f3f4f6 !important;
}

body.dark-mode .desc {
  color: #94a3b8 !important;
}


/* ==========================================================================
   4. Header & Top Bar Dark Mode
   ========================================================================== */
body.dark-mode .header,
body.dark-mode .top-bar {
  background-color: #181d24 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

body.dark-mode .main-nav-bar {
  background-color: #14181f !important;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

body.dark-mode .navigation.stricky {
  background-color: #181d24 !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5) !important;
}

/* Date and Time in Top-Bar */
body.dark-mode .top-right-nav ul li span {
  color: #e2e8f0 !important;
}

body.dark-mode .top-right-nav ul li span svg path {
  fill: #e2e8f0 !important;
}

/* Header Round Icons (Search, Login) */
body.dark-mode .round-icon div {
  background: #242b35;
  border-color: #3b4453;
}

body.dark-mode #open-search div svg path,
body.dark-mode .round-icon[href*="wp-admin"] div svg path {
  fill: #e2e8f0 !important;
}

body.dark-mode #open-search:hover div {
  background-color: #2271b1 !important;
  border-color: #2271b1 !important;
}

body.dark-mode .round-icon[href*="wp-admin"]:hover div {
  background-color: #374151 !important;
  border-color: #9ca3af !important;
}

/* Navigation Links */
html.dark-mode #main-nav ul.menu > li > a,
body.dark-mode #main-nav ul.menu > li > a {
  color: #f3f4f6 !important;
}

html.dark-mode #main-nav ul.menu > li:hover > a,
body.dark-mode #main-nav ul.menu > li:hover > a,
html.dark-mode #main-nav ul.menu > li.current-menu-item > a,
body.dark-mode #main-nav ul.menu > li.current-menu-item > a {
  color: #ff3b44 !important;
}

/* Submenu dropdown & Arrow in Dark Mode */
html.dark-mode #main-nav ul.menu > li.menu-item-has-children:after,
body.dark-mode #main-nav ul.menu > li.menu-item-has-children:after {
  color: #cbd5e1 !important;
}

html.dark-mode #main-nav ul.menu > li.menu-item-has-children:hover:after,
body.dark-mode #main-nav ul.menu > li.menu-item-has-children:hover:after {
  color: #ff4d4f !important;
}

html.dark-mode #main-nav ul.menu li > ul,
html.dark-mode #main-nav ul.menu li .sub-menu,
body.dark-mode #main-nav ul.menu li > ul,
body.dark-mode #main-nav ul.menu li .sub-menu {
  background: #1a202c !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-top: 3px solid #ff4d4f !important;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.06) !important;
}

html.dark-mode #main-nav ul.menu li > ul li,
html.dark-mode #main-nav ul.menu li .sub-menu li,
body.dark-mode #main-nav ul.menu li > ul li,
body.dark-mode #main-nav ul.menu li .sub-menu li {
  border: none !important;
  background: transparent !important;
}

html.dark-mode #main-nav ul.menu li > ul li a,
html.dark-mode #main-nav ul.menu li .sub-menu li a,
body.dark-mode #main-nav ul.menu li > ul li a,
body.dark-mode #main-nav ul.menu li .sub-menu li a {
  color: #e2e8f0 !important;
  background: transparent !important;
  border: none !important;
  border-bottom: none !important;
}

html.dark-mode #main-nav ul.menu li > ul li a::before,
html.dark-mode #main-nav ul.menu li .sub-menu li a::before,
body.dark-mode #main-nav ul.menu li > ul li a::before,
body.dark-mode #main-nav ul.menu li .sub-menu li a::before {
  background: #475569 !important;
}

html.dark-mode #main-nav ul.menu li > ul li:hover > a,
html.dark-mode #main-nav ul.menu li .sub-menu li:hover > a,
body.dark-mode #main-nav ul.menu li > ul li:hover > a,
body.dark-mode #main-nav ul.menu li .sub-menu li:hover > a {
  background: rgba(255, 77, 79, 0.16) !important;
  color: #ff5252 !important;
}

html.dark-mode #main-nav ul.menu li > ul li:hover > a::before,
html.dark-mode #main-nav ul.menu li .sub-menu li:hover > a::before,
body.dark-mode #main-nav ul.menu li > ul li:hover > a::before,
body.dark-mode #main-nav ul.menu li .sub-menu li:hover > a::before {
  background: #ff5252 !important;
}

html.dark-mode #main-nav ul.menu li > ul li.current-menu-item > a,
html.dark-mode #main-nav ul.menu li .sub-menu li.current-menu-item > a,
body.dark-mode #main-nav ul.menu li > ul li.current-menu-item > a,
body.dark-mode #main-nav ul.menu li .sub-menu li.current-menu-item > a {
  background: rgba(255, 77, 79, 0.16) !important;
  color: #ff5252 !important;
}

html.dark-mode #main-nav ul.menu li > ul li.current-menu-item > a::before,
html.dark-mode #main-nav ul.menu li .sub-menu li.current-menu-item > a::before,
body.dark-mode #main-nav ul.menu li > ul li.current-menu-item > a::before,
body.dark-mode #main-nav ul.menu li .sub-menu li.current-menu-item > a::before {
  background: #ff5252 !important;
}

/* Hamburger button */
body.dark-mode .all-button,
body.dark-mode .hamburger-btn,
body.dark-mode .hamburger-btn i {
  color: #f3f4f6 !important;
}

/* All Menu Offcanvas / Drawer */
body.dark-mode .all-menu-item-bg {
  background: #181d24 !important;
  color: #f3f4f6 !important;
}

body.dark-mode .all-menu-item .heading {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #f3f4f6 !important;
}

body.dark-mode .all-cat-menu li a {
  color: #e2e8f0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

body.dark-mode .all-cat-menu li a:hover {
  color: #ff3b44 !important;
}

/* Mobile Header Dark Mode */
body.dark-mode #mobile-header,
body.dark-mode .header-m {
  background-color: #0f172a !important;
  border-bottom: 1px solid #1e293b !important;
}

body.dark-mode .mobile-head-wrap,
body.dark-mode .mobile-head,
body.dark-mode .mobile-logo-area,
body.dark-mode .mobile-logo-link,
body.dark-mode .mobile-header-actions {
  background-color: transparent !important;
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

body.dark-mode .mobile-nav {
  background: #1e242d !important;
  border-top: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .mobile-nav a {
  color: #e2e8f0 !important;
}

body.dark-mode .moble-menu {
  background: #181d24 !important;
}

body.dark-mode .moble-menu a {
  color: #e2e8f0 !important;
}

/* Search Overlay */
body.dark-mode #search_aria.full-header-overlay {
  background: rgba(17, 20, 24, 0.96) !important;
}

body.dark-mode #search_field_full {
  background: #1e242d !important;
  border: 2px solid #3b4453 !important;
  color: #f3f4f6 !important;
}

body.dark-mode #search_field_full::placeholder {
  color: #94a3b8 !important;
}

body.dark-mode #close_full_search {
  color: #f3f4f6 !important;
}


/* ==========================================================================
   5. Top News Section Dark Mode (Lead News + 4x2 Grid + Sidebars)
   ========================================================================== */
body.dark-mode .section-with-border {
  border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .side-grid-wrap .side-b-border {
  border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .side-grid-left {
  border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .rg-r-border::after,
body.dark-mode .bg-r-border::after {
  background: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .rg-b-border::before,
body.dark-mode .bg-b-border::before {
  background: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .lead-title a,
body.dark-mode .news-title a,
body.dark-mode .main-text,
body.dark-mode .text-link {
  color: #f3f4f6 !important;
}

body.dark-mode .text-link:hover .main-text {
  color: #ff3b44 !important;
  text-decoration-color: #ff3b44 !important;
}

body.dark-mode .lead-excerpt {
  color: #94a3b8 !important;
}

body.dark-mode .title-dot {
  color: #4b5563 !important;
}


/* ==========================================================================
   6. Universal Sticky Category Header (.title-aria-glob)
   ========================================================================== */
body.dark-mode .title-aria-glob,
html.dark-mode .title-aria-glob {
  background: #111418 !important;
}

body.dark-mode .title-aria-glob a,
body.dark-mode .title-aria-glob p,
html.dark-mode .title-aria-glob a,
html.dark-mode .title-aria-glob p {
  background: #111418 !important;
  color: #DF2027 !important;
}

body.dark-mode .title-aria-glob::after,
html.dark-mode .title-aria-glob::after {
  background: rgba(223, 32, 39, 0.35) !important;
}


/* ==========================================================================
   7. Newsbox Templates (box1 - box16, tab1, ad)
   ========================================================================== */

/* --- Newsbox 1 --- */
body.dark-mode .newsbox1 .b_left_big {
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

body.dark-mode .newsbox1 .b_right-item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

body.dark-mode .newsbox1 .newboxtitle,
body.dark-mode .newsbox1 .title25,
body.dark-mode .newsbox1 .title22,
body.dark-mode .newsbox1 a {
  color: #f3f4f6 !important;
}

body.dark-mode .newsbox1 a:hover,
body.dark-mode .newsbox1 a:hover .title25,
body.dark-mode .newsbox1 a:hover .title22 {
  color: #ff3b44 !important;
}

/* --- Newsbox 2 --- */
body.dark-mode .newsbox2 .desc {
  color: #94a3b8 !important;
}

body.dark-mode .newsbox2 .col-6::after {
  background: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .newsbox2 .title22,
body.dark-mode .newsbox2 .news-item a {
  color: #f3f4f6 !important;
}

body.dark-mode .newsbox2 a:hover .title22 {
  color: #ff3b44 !important;
}

/* --- Newsbox 3 --- */
body.dark-mode .newsbox3 .desc {
  color: #94a3b8 !important;
}

body.dark-mode .newsbox3 .title22,
body.dark-mode .newsbox3 .news-item a,
body.dark-mode .newsbox3 a {
  color: #f3f4f6 !important;
}

body.dark-mode .newsbox3 a:hover .title22 {
  color: #ff3b44 !important;
}

/* --- Newsbox 4 --- */
body.dark-mode .newsbox4 {
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .newsbox4 .b_right-item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

@media all and (min-width: 768px) {
  body.dark-mode .newsbox4 .b_left_big .info-box {
    background: #1e242d !important;
    border: 1px solid #2d3748 !important;
    color: #F6A914 !important;
    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.5) !important;
  }
}

body.dark-mode .newsbox4 .newboxtitle,
body.dark-mode .newsbox4 .title25,
body.dark-mode .newsbox4 .title22,
body.dark-mode .newsbox4 a {
  color: #f3f4f6 !important;
}

body.dark-mode .newsbox4 a:hover,
body.dark-mode .newsbox4 a:hover .title22,
body.dark-mode .newsbox4 a:hover .title25 {
  color: #ff3b44 !important;
}

/* --- Newsbox 5 --- */
body.dark-mode .newsbox5-inner {
  border-color: #2d3748 !important;
  background: #181d24 !important;
}

body.dark-mode .newsbox5-inner .lsbig-item p {
  color: #94a3b8 !important;
}

body.dark-mode .newsbox5-inner .lsmall-item {
  border-top-color: #2d3748 !important;
}

body.dark-mode .newsbox5-inner .lsmall-item h3,
body.dark-mode .newsbox5-inner .lsmall-item h3 a {
  color: #f3f4f6 !important;
}

body.dark-mode .newsbox5-inner .lsmall-item h3 a:hover {
  color: #ff3b44 !important;
}

/* --- Newsbox 6 --- */
body.dark-mode .newsbox6-iner {
  background: #181d24 !important;
  border-color: #f6ab14 !important;
}

body.dark-mode .newsbox6-iner .tab_nav p {
  color: #cbd5e1 !important;
  border-bottom-color: rgba(246, 171, 20, 0.4) !important;
}

body.dark-mode .newsbox6-iner .tab_nav p.active {
  color: #ff4d4f !important;
  border-bottom-color: #f6ab14 !important;
}

body.dark-mode .newsbox6-iner .lsmall-item .number span {
  background: #2d3748 !important;
  color: #f3f4f6 !important;
}

body.dark-mode .newsbox6-iner .lsmall-item h3,
body.dark-mode .newsbox6-iner .lsmall-item h3 a {
  color: #f3f4f6 !important;
}

body.dark-mode .newsbox6-iner .lsmall-item h3 a:hover {
  color: #ff3b44 !important;
}

body.dark-mode .ajkersobkhobor {
  background: rgba(48, 128, 222, 0.25) !important;
  border-color: #3b82f6 !important;
  color: #60a5fa !important;
}

/* --- Newsbox 7 --- */
body.dark-mode .newsbox7-iner .lsmall-item h3,
body.dark-mode .newsbox7-iner .lsmall-item h3 a {
  color: #f3f4f6 !important;
}

body.dark-mode .newsbox7-iner .user-info .name,
body.dark-mode .newsbox7-iner .user-info .name a {
  color: #f3f4f6 !important;
}

body.dark-mode .newsbox7-iner .user-info .podobi {
  color: #94a3b8 !important;
}

body.dark-mode .newsbox7-iner .lsmall-item h3 a:hover {
  color: #ff3b44 !important;
}

/* --- Newsbox 8: গত ৩ দিনের জনপ্রিয় --- */
body.dark-mode .newsbox8-iner,
html.dark-mode .newsbox8-iner {
  border-color: rgba(255, 255, 255, 0.08) !important;
  background: #181e26 !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important;
}

body.dark-mode .newsbox8-header,
html.dark-mode .newsbox8-header {
  background: #1e2632 !important;
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .newsbox8-title,
html.dark-mode .newsbox8-title {
  color: #f3f4f6 !important;
}

body.dark-mode .newsbox8-badge,
html.dark-mode .newsbox8-badge {
  background: rgba(223, 32, 39, 0.2) !important;
  color: #ff5252 !important;
  border-color: rgba(223, 32, 39, 0.3) !important;
}

body.dark-mode .newsbox8-item,
html.dark-mode .newsbox8-item {
  border-bottom-color: rgba(255, 255, 255, 0.06) !important;
}

body.dark-mode .newsbox8-item.normal-rank .newsbox8-rank,
html.dark-mode .newsbox8-item.normal-rank .newsbox8-rank {
  background: #242c37 !important;
  color: #94a3b8 !important;
}

body.dark-mode .newsbox8-item-title a,
html.dark-mode .newsbox8-item-title a {
  color: #f1f5f9 !important;
}

body.dark-mode .newsbox8-item:hover .newsbox8-item-title a,
html.dark-mode .newsbox8-item:hover .newsbox8-item-title a {
  color: #ff5252 !important;
}

body.dark-mode .newsbox8-meta,
html.dark-mode .newsbox8-meta {
  color: #94a3b8 !important;
}

/* --- Newsbox 9 --- */
body.dark-mode .news-box9 .title-aria,
body.dark-mode .news-box9 .bbody-news-item a,
body.dark-mode .news-box9 .body-news-item h4,
body.dark-mode .news-box9 a {
  color: #f3f4f6 !important;
}

body.dark-mode .news-box9 .body-news-item {
  border-top-color: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .news-box9 a:hover,
body.dark-mode .news-box9 a:hover h4 {
  color: #ff3b44 !important;
}

/* --- Newsbox 10 --- */
body.dark-mode .news-box10 .title-aria,
body.dark-mode .news-box10 a,
body.dark-mode .news-box10-body-news-item h4 {
  color: #f3f4f6 !important;
}

body.dark-mode .news-box10-body-news-item {
  background: #181d24 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .news-box10 a:hover,
body.dark-mode .news-box10 a:hover h4 {
  color: #ff3b44 !important;
}

/* --- Newsbox 11 (Video Gallery) --- */
body.dark-mode .video-gallery {
  background: #15181e !important;
}

body.dark-mode .video-gallery .title-aria-glob {
  background: #15181e !important;
}

body.dark-mode .video-gallery .title-aria-glob a {
  background: #15181e !important;
  color: #DF2027 !important;
}

body.dark-mode .nexsbox11 .title22,
body.dark-mode .nexsbox11 a {
  color: #f3f4f6 !important;
}

body.dark-mode .nexsbox11 a:hover .title22 {
  color: #ff3b44 !important;
}

/* --- Newsbox 12 --- */
body.dark-mode .news-box12 .title-aria,
body.dark-mode .news-box12 a,
body.dark-mode .news-box12-body-news-item h4 {
  color: #f3f4f6 !important;
}

body.dark-mode .news-box12-body-news-item {
  background: #181d24 !important;
  border-color: rgba(80, 160, 90, 0.35) !important;
}

body.dark-mode .news-box12 a:hover,
body.dark-mode .news-box12 a:hover h4 {
  color: #ff3b44 !important;
}

/* --- Newsbox 13 (Arthoniti etc.) --- */
body.dark-mode .aurthonitis .body-news a,
body.dark-mode .aurthonitis .body-news .info-box {
  color: #f3f4f6 !important;
}

body.dark-mode .aurthonitis .body-news a:hover {
  color: #ff3b44 !important;
}

/* --- Newsbox 14 (Opinions / Quotes) --- */
body.dark-mode .newsbox14 .desc {
  color: #94a3b8 !important;
}

body.dark-mode .newsbox14 .col-6::after {
  background: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .newsbox14 .news-item {
  border-color: rgba(219, 0, 0, 0.4) !important;
  background: #181d24 !important;
}

body.dark-mode .newsbox14 .news-item .quate .bg {
  background: #2d3748 !important;
}

body.dark-mode .newsbox14 .user-info .name,
body.dark-mode .newsbox14 .user-info .name a {
  color: #f3f4f6 !important;
}

body.dark-mode .newsbox14 .user-info .podobi {
  color: #94a3b8 !important;
}

body.dark-mode .newsbox14 .title22,
body.dark-mode .newsbox14 a {
  color: #f3f4f6 !important;
}

body.dark-mode .newsbox14 a:hover,
body.dark-mode .newsbox14 a:hover .title22 {
  color: #ff3b44 !important;
}

/* --- Newsbox 15 --- */
body.dark-mode .newsbox15 .desc {
  color: #94a3b8 !important;
}

body.dark-mode .newsbox15 .title30,
body.dark-mode .newsbox15 .title22,
body.dark-mode .newsbox15 a {
  color: #f3f4f6 !important;
}

body.dark-mode .newsbox15 a:hover,
body.dark-mode .newsbox15 a:hover .title30,
body.dark-mode .newsbox15 a:hover .title22 {
  color: #ff3b44 !important;
}

/* --- Newsbox 16 --- */
body.dark-mode .newsbox16 .title22-o,
body.dark-mode .newsbox16 .title30,
body.dark-mode .newsbox16 a {
  color: #f3f4f6 !important;
}

body.dark-mode .newsbox16 .b_right-item {
  border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .newsbox16 a:hover,
body.dark-mode .newsbox16 a:hover .title22-o,
body.dark-mode .newsbox16 a:hover .title30 {
  color: #ff3b44 !important;
}

/* --- Tab 1 (Sara Desh) --- */
body.dark-mode .newstab1 .b_right-item {
  border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .tab_menu_list ul li {
  border-color: rgba(255, 255, 255, 0.15) !important;
  background: #181d24 !important;
}

body.dark-mode .tab_menu_list ul a {
  color: #e2e8f0 !important;
}

body.dark-mode .tab_menu_list ul li.active {
  border-color: #DF2027 !important;
  background: #242b35 !important;
}

body.dark-mode .tab_menu_list ul li.active a {
  color: #ff4d4f !important;
}

body.dark-mode .newstab1 .title25,
body.dark-mode .newstab1 .title22,
body.dark-mode .newstab1 a {
  color: #f3f4f6 !important;
}

body.dark-mode .newstab1 a:hover,
body.dark-mode .newstab1 a:hover .title25,
body.dark-mode .newstab1 a:hover .title22 {
  color: #ff3b44 !important;
}


/* ==========================================================================
   8. Category Template & Archive Pages
   ========================================================================== */
body.dark-mode .category_temp_top .temp_title {
  color: #f3f4f6 !important;
}

body.dark-mode .cat-normal-content-big a h3 {
  color: #f3f4f6 !important;
}

body.dark-mode .cat-normal-content-big a:hover h3 {
  color: #ff3b44 !important;
}

body.dark-mode .category_page_border {
  border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .cat-normal-content-other-item {
  border-right-color: rgba(255, 255, 255, 0.12) !important;
  border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode .cat-normal-content-other-item::after {
  background: #111418 !important;
}

body.dark-mode .cat-normal-content-other-item a h4,
body.dark-mode .cat-normal-content-other-item a {
  color: #f3f4f6 !important;
}

body.dark-mode .cat-normal-content-other-item a:hover h4 {
  color: #ff3b44 !important;
}


/* ==========================================================================
   9. Sidebars & Widgets
   ========================================================================== */
body.dark-mode #sidebar,
body.dark-mode .home-sidebar,
body.dark-mode .widget_bar {
  color: #f3f4f6;
}

body.dark-mode #latest-recent-news {
  border-color: rgba(219, 0, 0, 0.35) !important;
  background: #181d24 !important;
}

body.dark-mode #latest-rbar > span {
  color: #cbd5e1 !important;
  border-color: rgba(219, 0, 0, 0.35) !important;
  background: #13171f !important;
}

body.dark-mode #latest-rbar > span.active {
  background: rgba(219, 0, 0, 0.3) !important;
  color: #ffffff !important;
}

body.dark-mode #latest-rbar-body ul li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode #latest-rbar-body ul li a {
  color: #e2e8f0 !important;
}

body.dark-mode #latest-rbar-body ul li a:hover {
  color: #ff3b44 !important;
}

body.dark-mode #recent-news #rbar span {
  background: #181d24 !important;
  color: #e2e8f0 !important;
  border-color: #2d3748 !important;
}

body.dark-mode #recent-news #rbar span.active {
  background: #DF2027 !important;
  color: #ffffff !important;
}


/* ==========================================================================
   10. Single News Page & Comments
   ========================================================================== */
body.dark-mode .single-page-body,
body.dark-mode .single-main {
  color: #cbd5e1;
}

body.dark-mode .single-title,
body.dark-mode .entry-title,
body.dark-mode article h1 {
  color: #f3f4f6 !important;
}

body.dark-mode .post-content,
body.dark-mode .entry-content,
body.dark-mode .post-content p,
body.dark-mode .entry-content p {
  color: #cbd5e1 !important;
}

body.dark-mode .post-meta,
body.dark-mode .reporter-name,
body.dark-mode .post-date {
  color: #94a3b8 !important;
}

body.dark-mode .comment-form input,
body.dark-mode .comment-form textarea {
  background: #1e242d !important;
  border: 1px solid #3b4453 !important;
  color: #f3f4f6 !important;
}

body.dark-mode .comment-form input:focus,
body.dark-mode .comment-form textarea:focus {
  border-color: #DF2027 !important;
  outline: none;
}


/* ==========================================================================
   11. Footer Dark Mode
   ========================================================================== */
body.dark-mode .footer-pading {
  background: #111418 !important;
}

body.dark-mode .mainfooter {
  background: #0d1015 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

body.dark-mode .footer-menu-container {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

body.dark-mode .bottom-menu li a {
  color: #94a3b8 !important;
}

body.dark-mode .bottom-menu li a:hover {
  color: #ffffff !important;
}

body.dark-mode .footer_contract_info {
  color: #94a3b8 !important;
}

body.dark-mode .footer_copy_right {
  background: #080a0e !important;
  color: #64748b !important;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

body.dark-mode .footer_copy_right p {
  color: #94a3b8 !important;
}

body.dark-mode .footer_copy_right a {
  color: #cbd5e1 !important;
}

body.dark-mode .mobile-footer {
  background: #0d1015 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

body.dark-mode .mbottom-menu li a {
  color: #94a3b8 !important;
}

body.dark-mode .mbottom-menu li a:hover {
  color: #ffffff !important;
}

/* Images subtle adjustment */
body.dark-mode img {
  opacity: 0.95;
  transition: opacity 0.2s ease;
}

body.dark-mode img:hover {
  opacity: 1;
}

/* ==========================================================================
   12. Sub-Menu Featured News Section Dark Mode
   ========================================================================== */
body.dark-mode .sub-menu-featured-news {
  background: #14181e !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .featured-card-box {
  background: #1c222b !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35) !important;
}

body.dark-mode .featured-card-box a {
  color: #f3f4f6 !important;
}

body.dark-mode .featured-card-title {
  color: #f3f4f6 !important;
}

body.dark-mode .featured-image-side {
  border-color: rgba(255, 255, 255, 0.12) !important;
  background: #242c37 !important;
}

body.dark-mode .featured-card-box:hover {
  background: #222a36 !important;
  border-color: #DF2027 !important;
  box-shadow: 0 4px 14px rgba(223, 32, 39, 0.25) !important;
}

body.dark-mode .featured-card-box:hover .featured-card-title {
  color: #ff5252 !important;
}

/* ==========================================================================
   13. Single Post Page & Article Content Dark Mode
   ========================================================================== */
body.dark-mode .single_post {
  background: #111418 !important;
}

body.dark-mode .single_post .post_side {
  background: transparent !important;
}

body.dark-mode .single_post .post_side-body {
  background: transparent !important;
}

/* Breadcrumb Navigation */
body.dark-mode .single_post .breadcrumb {
  background: transparent !important;
}

body.dark-mode .single_post .breadcrumb a {
  color: #94a3b8 !important;
}

body.dark-mode .single_post .breadcrumb a:hover {
  color: #ffffff !important;
}

body.dark-mode .single_post .breadcrumb a:last-child {
  color: #DF2027 !important;
}

body.dark-mode .single_post .current-page {
  color: #64748b !important;
}

body.dark-mode .single_post .current-page a {
  color: #94a3b8 !important;
}

body.dark-mode .single_post .current-page a:hover {
  color: #ffffff !important;
}

body.dark-mode .single_post .current-page .fa-home {
  color: #94a3b8 !important;
}

/* Titles and Meta */
body.dark-mode .single_post .title-authod,
body.dark-mode .title-authod {
  background: transparent !important;
}

body.dark-mode .single_post .title-authod .title,
body.dark-mode .single_post .post_side .title,
body.dark-mode .single_post .post_side-body .title,
body.dark-mode .single_post h2.title,
body.dark-mode .single_post .title,
body.dark-mode .title-authod .title,
body.dark-mode .post_side .title {
  color: #f8fafc !important;
  background: transparent !important;
}

body.dark-mode .single_post .title-authod .title a,
body.dark-mode .single_post .post_side .title a,
body.dark-mode .single_post h2.title a,
body.dark-mode .title-authod .title a {
  color: #f8fafc !important;
}

body.dark-mode .single_post .title-authod .sub_heading,
body.dark-mode .single_post .post_side .sub_heading,
body.dark-mode .single_post .post_side-body .sub_heading,
body.dark-mode .single_post p.sub_heading,
body.dark-mode .single_post .sub_heading,
body.dark-mode .title-authod .sub_heading,
body.dark-mode .post_side .sub_heading,
body.dark-mode .sub_heading {
  color: #ff6b6b !important;
  background: transparent !important;
  font-weight: 600 !important;
}

body.dark-mode .single_post .title-authod .sub_heading a,
body.dark-mode .single_post .post_side .sub_heading a,
body.dark-mode .sub_heading a {
  color: #ff6b6b !important;
}

body.dark-mode .single_post .author-name {
  border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .single_post .dsheborder {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Author Profile Cards (Both Desktop Sidebar and Mobile Row Views) */
body.dark-mode .author_profile_card {
  background: #181d24 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35) !important;
}

body.dark-mode .author_avatar_container {
  background: #222832 !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

body.dark-mode .author_avatar_container:hover {
  border-color: #DF2027 !important;
}

body.dark-mode .author_details h4 a {
  color: #f3f4f6 !important;
}

body.dark-mode .author_details h4 a:hover {
  color: #ff5252 !important;
}

body.dark-mode .author_details p {
  color: #94a3b8 !important;
}

body.dark-mode .author-divider {
  background: rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .publish_date {
  color: #94a3b8 !important;
}

body.dark-mode .publish_date svg {
  color: #64748b !important;
}

/* Reading Time Badges */
body.dark-mode .reading-time-highlight-box {
  background: rgba(223, 32, 39, 0.1) !important;
  border-color: rgba(223, 32, 39, 0.35) !important;
  border-left-color: #DF2027 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
}

body.dark-mode .reading-time-highlight-box div,
body.dark-mode .reading-time-highlight-box span {
  color: #e2e8f0 !important;
}

body.dark-mode .reading-time-highlight-box span[style*="color: #d63638"],
body.dark-mode .reading-time-highlight-box span[style*="color:#d63638"] {
  color: #ff5252 !important;
}

/* Post Content (#content-p) */
body.dark-mode #content-p {
  color: #e2e8f0 !important;
}

body.dark-mode #content-p p {
  color: #e2e8f0 !important;
  line-height: 1.8;
}

body.dark-mode #content-p h1,
body.dark-mode #content-p h2,
body.dark-mode #content-p h3,
body.dark-mode #content-p h4,
body.dark-mode #content-p h5,
body.dark-mode #content-p h6 {
  color: #f8fafc !important;
}

body.dark-mode #content-p a {
  color: #60a5fa !important;
  text-decoration: underline;
  transition: color 0.15s ease;
}

body.dark-mode #content-p a:hover {
  color: #93c5fd !important;
}

body.dark-mode #content-p strong,
body.dark-mode #content-p b {
  color: #ffffff !important;
}

body.dark-mode #content-p em,
body.dark-mode #content-p i {
  color: #cbd5e1 !important;
}

body.dark-mode #content-p blockquote {
  background: #182230 !important;
  border-left: 4px solid #3b82f6 !important;
  color: #cbd5e1 !important;
}

body.dark-mode #content-p blockquote p {
  color: #cbd5e1 !important;
}

body.dark-mode #content-p .wp-caption {
  background: #181d24 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode #content-p .wp-caption-text,
body.dark-mode #content-p figcaption,
body.dark-mode #content-p .gallery-caption {
  color: #94a3b8 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  background: #181d24 !important;
}

body.dark-mode #content-p table {
  border-color: rgba(255, 255, 255, 0.15) !important;
  color: #e2e8f0 !important;
}

body.dark-mode #content-p th,
body.dark-mode #content-p td {
  border-color: rgba(255, 255, 255, 0.12) !important;
}

body.dark-mode #content-p th {
  background: #1f2732 !important;
  color: #ffffff !important;
}

body.dark-mode #content-p tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.02) !important;
}

body.dark-mode #content-p ul,
body.dark-mode #content-p ol {
  color: #e2e8f0 !important;
}

body.dark-mode #content-p li {
  color: #e2e8f0 !important;
}

body.dark-mode #content-p code {
  background: #1e242d !important;
  color: #ff6b6b !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode #content-p pre {
  background: #15191e !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #f3f4f6 !important;
}

body.dark-mode #content-p .uploader_code {
  color: #64748b !important;
}

/* Modern Share Buttons */
body.dark-mode .msb-container {
  border-top-color: rgba(255, 255, 255, 0.1) !important;
  border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .msb-share-count {
  border-right-color: rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .msb-count-number {
  color: #f3f4f6 !important;
}

body.dark-mode .msb-count-label {
  color: #94a3b8 !important;
}

body.dark-mode .msb-font-sizer span {
  color: #cbd5e1 !important;
}

body.dark-mode .msb-font-btn {
  background: #1e242d !important;
  border-color: #3b4453 !important;
  color: #f3f4f6 !important;
}

body.dark-mode .msb-font-btn:hover {
  background: #2e3744 !important;
  border-color: #DF2027 !important;
  color: #ffffff !important;
}

body.dark-mode .msb-copy-toast {
  background: #1e242d !important;
  color: #f3f4f6 !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5) !important;
}

/* Post Tags */
body.dark-mode #tag {
  border-bottom-color: #DF2027 !important;
  color: #94a3b8 !important;
}

body.dark-mode #tag i {
  color: #DF2027 !important;
}

body.dark-mode #tag a {
  background: #1c222b !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  color: #cbd5e1 !important;
  transition: all 0.2s ease;
}

body.dark-mode #tag a:hover {
  background: #DF2027 !important;
  border-color: #DF2027 !important;
  color: #ffffff !important;
}

/* Comments Section */
body.dark-mode .comments {
  background: #181d24 !important;
  border-radius: 8px;
  padding: 16px !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25) !important;
}

body.dark-mode .comments .title-aria-big h2 {
  color: #f3f4f6 !important;
}

body.dark-mode .comments .title-aria-big span.mu {
  color: #DF2027 !important;
}

body.dark-mode .comments .title-aria-big p {
  color: #94a3b8 !important;
  border-left-color: rgba(255, 255, 255, 0.2) !important;
}

/* Single Post Sidebars & Widgets */
body.dark-mode .single_post .right_bar-content,
body.dark-mode .single_post .left_bar-content,
body.dark-mode .single_post #sidebar,
body.dark-mode .single_post .left_bar {
  background: transparent !important;
}

body.dark-mode .single_post .left_bar-content .title {
  color: #f3f4f6 !important;
  border-bottom-color: #DF2027 !important;
}

body.dark-mode .single_post .left_bar .body {
  background: transparent !important;
}

body.dark-mode .single_post .left_bar .body .titles a {
  color: #e2e8f0 !important;
}

body.dark-mode .single_post .left_bar .body .titles a:hover {
  color: #DF2027 !important;
}

body.dark-mode .single_post .left_bar .body .border {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .single_post .left_bar .other-item {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

/* WordPress Standard Widgets on Single Post */
body.dark-mode .widget {
  background: #181d24 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 6px;
  padding: 15px;
  margin-bottom: 20px;
}

body.dark-mode .widget .widget-title,
body.dark-mode .widget h2,
body.dark-mode .widget h3 {
  color: #f3f4f6 !important;
  border-bottom: 2px solid #DF2027;
  padding-bottom: 8px;
  margin-bottom: 12px;
}

body.dark-mode .widget ul li {
  border-bottom-color: rgba(255, 255, 255, 0.06) !important;
  color: #94a3b8 !important;
}

body.dark-mode .widget ul li a {
  color: #cbd5e1 !important;
}

body.dark-mode .widget ul li a:hover {
  color: #ff5252 !important;
}

body.dark-mode .widget input[type="search"],
body.dark-mode .widget input[type="text"] {
  background: #222832 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: #f3f4f6 !important;
}

/* Latest & Popular News Widget (সর্বশেষ / পাঠক প্রিয়) */
body.dark-mode .lp-widget,
html.dark-mode .lp-widget,
html[data-theme="dark"] .lp-widget {
  background: #181d24 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .lp-header,
html.dark-mode .lp-header,
html[data-theme="dark"] .lp-header {
  color: #f1f5f9 !important;
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .lp-tabs,
html.dark-mode .lp-tabs,
html[data-theme="dark"] .lp-tabs {
  background: #11151c !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .lp-tab,
html.dark-mode .lp-tab,
html[data-theme="dark"] .lp-tab {
  color: #94a3b8 !important;
}

body.dark-mode .lp-tab:hover,
html.dark-mode .lp-tab:hover,
html[data-theme="dark"] .lp-tab:hover {
  color: #ff5252 !important;
}

body.dark-mode .lp-tab.active,
html.dark-mode .lp-tab.active,
html[data-theme="dark"] .lp-tab.active {
  background: #181d24 !important;
  color: #ff5252 !important;
  border-bottom: 2px solid #ff5252 !important;
}

body.dark-mode .lp-list li,
html.dark-mode .lp-list li,
html[data-theme="dark"] .lp-list li {
  border-bottom-color: rgba(255, 255, 255, 0.06) !important;
}

body.dark-mode .lp-list a,
html.dark-mode .lp-list a,
html[data-theme="dark"] .lp-list a {
  color: #e2e8f0 !important;
}

body.dark-mode .lp-list a:hover,
html.dark-mode .lp-list a:hover,
html[data-theme="dark"] .lp-list a:hover {
  color: #ff5252 !important;
}

body.dark-mode .lp-list::-webkit-scrollbar,
html.dark-mode .lp-list::-webkit-scrollbar {
  width: 5px;
}
body.dark-mode .lp-list::-webkit-scrollbar-track,
html.dark-mode .lp-list::-webkit-scrollbar-track {
  background: #11151c;
}
body.dark-mode .lp-list::-webkit-scrollbar-thumb,
html.dark-mode .lp-list::-webkit-scrollbar-thumb {
  background: #334155;
  border-radius: 4px;
}
body.dark-mode .lp-list::-webkit-scrollbar-thumb:hover,
html.dark-mode .lp-list::-webkit-scrollbar-thumb:hover {
  background: #475569;
}

/* ==========================================================================
   Web Stories Dark Mode Overrides
   ========================================================================== */
body.dark-mode .webstory-section-header .webstory-header-line {
  background: #10b981 !important;
  opacity: 0.55 !important;
}

body.dark-mode .webstory-section-header .webstory-header-title {
  color: #34d399 !important;
}

body.dark-mode .webstory-carousel-container .ws-carousel-nav {
  background: #1e242d !important;
  border: 1px solid #334155 !important;
  color: #f1f5f9 !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.4) !important;
}

body.dark-mode .webstory-carousel-container .ws-carousel-nav:hover {
  background: #059669 !important;
  color: #ffffff !important;
  border-color: #059669 !important;
}

body.dark-mode .ws-story-card .ws-card-inner {
  background: #141a22 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .ws-story-card:hover .ws-card-inner {
  border-color: rgba(52, 211, 153, 0.4) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5) !important;
}

body.dark-mode .ws-story-card .ws-card-title {
  color: #ffffff !important;
}

/* ==========================================================================
   14. Write for Us Card Dark Mode (Single Post)
   ========================================================================== */
body.dark-mode .write-for-us-card,
html.dark-mode .write-for-us-card {
  background: #181e26 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-left: 4px solid #ff4d4f !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4) !important;
}

body.dark-mode .write-card-icon,
html.dark-mode .write-card-icon {
  background: rgba(255, 77, 79, 0.18) !important;
  color: #ff5252 !important;
}

body.dark-mode .write-card-title,
html.dark-mode .write-card-title {
  color: #ff5252 !important;
}

body.dark-mode .write-card-desc,
html.dark-mode .write-card-desc {
  color: #cbd5e1 !important;
}

body.dark-mode .write-card-email,
html.dark-mode .write-card-email {
  background: rgba(255, 77, 79, 0.2) !important;
  border: 1px solid rgba(255, 77, 79, 0.4) !important;
  color: #ff8585 !important;
}

body.dark-mode .write-card-email:hover,
html.dark-mode .write-card-email:hover {
  background: #ff4d4f !important;
  color: #ffffff !important;
  box-shadow: 0 3px 10px rgba(255, 77, 79, 0.4) !important;
}

/* ==========================================================================
   15. Ghotonaprobaho (Event Timeline) & Bottom News Dark Mode
   ========================================================================== */
body.dark-mode .ghotonaprobaho-box,
html.dark-mode .ghotonaprobaho-box {
  background: #181e26 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4) !important;
}

body.dark-mode .ghotonaprobaho-title,
html.dark-mode .ghotonaprobaho-title {
  color: #f3f4f6 !important;
}

body.dark-mode .ghotonaprobaho-divider,
html.dark-mode .ghotonaprobaho-divider {
  background: rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .ghotonaprobaho-time,
html.dark-mode .ghotonaprobaho-time {
  color: #94a3b8 !important;
}

body.dark-mode .ghotonaprobaho-time .gnp-date,
html.dark-mode .ghotonaprobaho-time .gnp-date {
  color: #f1f5f9 !important;
}

body.dark-mode .ghotonaprobaho-time .gnp-clock,
html.dark-mode .ghotonaprobaho-time .gnp-clock {
  color: #94a3b8 !important;
}

body.dark-mode .ghotonaprobaho-content a,
html.dark-mode .ghotonaprobaho-content a {
  color: #f3f4f6 !important;
}

body.dark-mode .ghotonaprobaho-content a:hover,
html.dark-mode .ghotonaprobaho-content a:hover {
  color: #ff5252 !important;
}

body.dark-mode .ghotonaprobaho-footer,
html.dark-mode .ghotonaprobaho-footer {
  border-color: rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .ghotonaprobaho-more-btn,
html.dark-mode .ghotonaprobaho-more-btn {
  background: #222934 !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  color: #e2e8f0 !important;
}

body.dark-mode .ghotonaprobaho-more-btn:hover,
html.dark-mode .ghotonaprobaho-more-btn:hover {
  background: #ff4d4f !important;
  border-color: #ff4d4f !important;
  color: #ffffff !important;
}

body.dark-mode .bottom-news-block,
html.dark-mode .bottom-news-block {
  background: #181e26 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important;
}

body.dark-mode .bottom-news-header,
html.dark-mode .bottom-news-header {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .bottom-news-title,
html.dark-mode .bottom-news-title {
  color: #f3f4f6 !important;
}

body.dark-mode .bottom-news-item,
html.dark-mode .bottom-news-item {
  border-bottom-color: rgba(255, 255, 255, 0.06) !important;
}

body.dark-mode .bottom-news-item-title a,
html.dark-mode .bottom-news-item-title a {
  color: #f3f4f6 !important;
}

body.dark-mode .bottom-news-item:hover .bottom-news-item-title a,
html.dark-mode .bottom-news-item:hover .bottom-news-item-title a {
  color: #ff5252 !important;
}

body.dark-mode .bottom-news-thumb,
html.dark-mode .bottom-news-thumb {
  background: #242c37 !important;
}

body.dark-mode .bottom-news-time,
html.dark-mode .bottom-news-time {
  color: #94a3b8 !important;
}

/* ==========================================================================
   Post Actions Bar & Share Modal Dark Mode
   ========================================================================== */
body.dark-mode .shadhin-post-actions-bar,
html.dark-mode .shadhin-post-actions-bar {
  background: rgba(214, 54, 56, 0.08) !important;
  border: 1px dashed rgba(214, 54, 56, 0.45) !important;
  border-left: 4px solid #d63638 !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important;
}

body.dark-mode .spab-count-num,
html.dark-mode .spab-count-num {
  color: #f87171 !important;
}

body.dark-mode .spab-count-text,
html.dark-mode .spab-count-text {
  color: #fca5a5 !important;
  opacity: 0.8 !important;
}

body.dark-mode .spab-divider,
html.dark-mode .spab-divider {
  background: rgba(214, 54, 56, 0.3) !important;
}

body.dark-mode .spab-btn,
html.dark-mode .spab-btn {
  background: #181e26 !important;
  border-color: rgba(214, 54, 56, 0.35) !important;
  color: #cbd5e1 !important;
}

body.dark-mode .spab-btn svg,
html.dark-mode .spab-btn svg {
  color: #cbd5e1 !important;
}

body.dark-mode .spab-btn:hover,
html.dark-mode .spab-btn:hover {
  background: #d63638 !important;
  border-color: #d63638 !important;
  color: #ffffff !important;
}

body.dark-mode .spab-btn:hover svg,
html.dark-mode .spab-btn:hover svg {
  color: #ffffff !important;
}

body.dark-mode .spab-font-popover,
html.dark-mode .spab-font-popover {
  background: #1e2632 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4) !important;
}

body.dark-mode .spab-font-popover::after,
html.dark-mode .spab-font-popover::after {
  border-color: #1e2632 transparent transparent transparent !important;
}

body.dark-mode .spab-fbtn,
html.dark-mode .spab-fbtn {
  background: #242c37 !important;
  color: #f1f5f9 !important;
}

body.dark-mode .spab-fbtn:hover,
html.dark-mode .spab-fbtn:hover {
  background: #DF2027 !important;
  color: #ffffff !important;
}

body.dark-mode .spab-modal-dialog,
html.dark-mode .spab-modal-dialog {
  background: #181e26 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .spab-modal-header,
html.dark-mode .spab-modal-header {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .spab-modal-title,
html.dark-mode .spab-modal-title {
  color: #f1f5f9 !important;
}

body.dark-mode .spab-modal-close,
html.dark-mode .spab-modal-close {
  color: #94a3b8 !important;
}

body.dark-mode .spab-modal-close:hover,
html.dark-mode .spab-modal-close:hover {
  color: #ffffff !important;
}

body.dark-mode .spab-link-preview-box,
html.dark-mode .spab-link-preview-box {
  background: #222934 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .spab-link-icon,
html.dark-mode .spab-link-icon {
  background: #181e26 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  color: #cbd5e1 !important;
}

body.dark-mode .spab-link-title,
html.dark-mode .spab-link-title {
  color: #f1f5f9 !important;
}

body.dark-mode .spab-link-url,
html.dark-mode .spab-link-url {
  color: #94a3b8 !important;
}

body.dark-mode .spab-link-actions button,
html.dark-mode .spab-link-actions button {
  background: #181e26 !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  color: #cbd5e1 !important;
}

body.dark-mode .spab-link-actions button:hover,
html.dark-mode .spab-link-actions button:hover {
  background: #2b3543 !important;
  color: #ff5252 !important;
  border-color: #ff5252 !important;
}

body.dark-mode .spab-qr-body,
html.dark-mode .spab-qr-body {
  background: #222934 !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
}

body.dark-mode .spab-qr-text h4,
html.dark-mode .spab-qr-text h4 {
  color: #f1f5f9 !important;
}

body.dark-mode .spab-qr-text p,
html.dark-mode .spab-qr-text p {
  color: #94a3b8 !important;
}

body.dark-mode .spab-share-heading,
html.dark-mode .spab-share-heading {
  color: #94a3b8 !important;
}

body.dark-mode .spab-channel-item:hover,
html.dark-mode .spab-channel-item:hover {
  background: #222934 !important;
}

body.dark-mode .spab-chan-label,
html.dark-mode .spab-chan-label {
  color: #cbd5e1 !important;
}

body.dark-mode .spab-chan-nearby .spab-chan-icon,
html.dark-mode .spab-chan-nearby .spab-chan-icon {
  background: #222934 !important;
  color: #f1f5f9 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

/* Mobile Floating Bar Dark Mode */
body.dark-mode .spab-mfb-inner,
html.dark-mode .spab-mfb-inner {
  background: #181e26 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4) !important;
}

body.dark-mode .spab-mfb-btn,
html.dark-mode .spab-mfb-btn {
  color: #cbd5e1 !important;
}

body.dark-mode .spab-mfb-btn svg,
html.dark-mode .spab-mfb-btn svg {
  color: #cbd5e1 !important;
}

body.dark-mode .spab-mfb-btn:hover,
body.dark-mode .spab-mfb-btn.active,
html.dark-mode .spab-mfb-btn:hover,
html.dark-mode .spab-mfb-btn.active {
  background: #242c37 !important;
  color: #f1f5f9 !important;
}

body.dark-mode .spab-mfb-btn.active svg,
html.dark-mode .spab-mfb-btn.active svg {
  color: #f1f5f9 !important;
}

body.dark-mode .spab-mfb-popover,
html.dark-mode .spab-mfb-popover {
  background: #1e2632 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4) !important;
}

body.dark-mode .spab-mfb-fbtn,
html.dark-mode .spab-mfb-fbtn {
  background: #181e26 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .spab-mfb-fbtn .fbtn-text,
html.dark-mode .spab-mfb-fbtn .fbtn-text {
  color: #93c5fd !important;
}

body.dark-mode .spab-mfb-fbtn:hover,
html.dark-mode .spab-mfb-fbtn:hover {
  background: #2b3543 !important;
}

body.dark-mode .spab-mfb-fbtn-reset svg,
html.dark-mode .spab-mfb-fbtn-reset svg {
  color: #cbd5e1 !important;
}