/**
 * WordPress Core & Component Styles for Plus UI Theme
 * Enhanced with 3-column grid, compact padding, styled tables, custom list designs,
 * FontAwesome icon support, and centered pagination pills.
 *
 * @package Plus_UI
 */

/* ==========================================================================
   Google Fonts Typography:
   - English & Numbers : Fraunces (Optical Sizing, Editorial Serif)
   - Arabic & Quran    : Scheherazade New (Authentic Classical Islamic Calligraphy)
   - Bangla            : Noto Serif Bengali (Authoritative Academic Book Serif)
   ========================================================================== */
:root {
  --contentW: 1280px;
  --sideW: 300px;
  --font-en: 'Fraunces', Georgia, serif;
  --font-ar: 'Scheherazade New', 'Amiri', serif;
  --font-bn: 'Noto Serif Bengali', serif;
  --fontH: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif;
  --fontB: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif;
  --fontBa: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif;
}

html, body, button, input, textarea, select,
h1, h2, h3, h4, h5, h6,
.headLogo, .headTitle, .nav-link, .menu-item,
.edu-finder-section, .edu-main-title, .edu-subtitle, .edu-search-input, .edu-card-title, .edu-card-sub,
.blog-grid, .post-card, .entry-title, .entry-content, .entry-excerpt,
.sidebar-area, .sb-widget-title, .sb-cat-name, .popular-item,
.comment-content, .widget, .main-footer {
  font-family: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif !important;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* Specific helper classes for Noto Serif Bengali */
.font-noto-serif-bengali, .font-tiro-bangla, .font-noto-sans-bengali, .font-kalpurush, [lang="bn"], .bn-text {
  font-family: 'Noto Serif Bengali', serif !important;
}

/* Specific helper classes for Fraunces English */
.font-fraunces, .en-font, [lang="en"], .card-meta-date, .sb-meta-chip, .dyn-cover-logo-mark, .edu-top-badge time {
  font-family: 'Fraunces', serif !important;
  font-feature-settings: "onum" 1, "kern" 1;
}

/* General Arabic Text: Hadith, Vocabulary, Quranic Verses, IAU Exam Text */
.font-amiri, .font-arabic, [lang="ar"], .ar-text, .arabic-text, .arabic,
.quran-text, .ayat, .surah-text, .quran-font {
  font-family: 'Scheherazade New', 'Amiri', serif !important;
  font-size: 1.35em;
  line-height: 2.3 !important;
  direction: rtl;
  text-align: right;
  word-spacing: 2px;
  letter-spacing: 0;
}

/* ==========================================================================
   FontAwesome Icons Support
   ========================================================================== */
.fa, .fas, .far, .fal, .fab {
  display: inline-block;
  line-height: 1;
  vertical-align: -0.1em;
}
a .fa, a .fas, a .far {
  margin-right: 5px;
}

/* ==========================================================================
   WordPress Core Classes
   ========================================================================== */
.alignleft {
  float: left;
  margin-right: 1.5em;
  margin-bottom: 1em;
}
.alignright {
  float: right;
  margin-left: 1.5em;
  margin-bottom: 1em;
}
.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1em;
}
.alignwide {
  max-width: 100%;
  width: 100%;
}
.alignfull {
  max-width: 100vw;
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}

.wp-caption {
  margin-bottom: 1.2em;
  max-width: 100%;
}
.wp-caption img[class*="wp-image-"] {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.wp-caption-text {
  text-align: center;
  font-size: 0.82rem;
  color: var(--bodyCa, #989b9f);
  margin-top: 0.4rem;
}

/* ==========================================================================
   Modern Header, Search Bar & Desktop Navigation
   Layout: Logo -> Search Box -> Navigation Menu -> Dark/Light Mode Toggle
   Aligned with Page Max-Width (1280px)
   ========================================================================== */
.mainH {
  width: 100% !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 990 !important;
  background: rgba(255, 255, 255, 0.94) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border-bottom: 1px solid var(--contentL, #e2e8f0) !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.03) !important;
  transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease !important;
}

/* Zero top margin/padding reset to avoid any unwanted header gap */
/* WordPress Admin Bar Compatibility */
@media screen and (min-width: 783px) {
  .admin-bar .mainH {
    top: 32px !important;
  }
}
@media screen and (max-width: 782px) {
  /* On mobile screens, WordPress admin bar is absolute and scrolls off-screen.
     The sticky header must stick to top: 0 so no gap appears when scrolling */
  .admin-bar .mainH {
    top: 0;
  }
}

.headC {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  max-width: var(--contentW, 1280px) !important;
  margin: 0 auto !important;
  padding: 0 14px !important;
  height: 60px !important;
  gap: 14px !important;
  position: relative !important;
  box-sizing: border-box !important;
}

.headC::after {
  display: none !important; /* Hide old Blogger bottom line artifact */
}

/* 1. Left: Logo & Hamburger */
.headD.headL {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-shrink: 0 !important;
  width: auto !important;
  padding: 0 !important;
}

.headLogo {
  display: flex !important;
  align-items: center !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: var(--headC, #0f172a) !important;
  letter-spacing: -0.3px !important;
  white-space: nowrap !important;
}

.headLogo a,
.headLogo .site-title-link {
  color: var(--headC, #0f172a) !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  font-size: 1.25rem !important;
  letter-spacing: -0.3px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: color 0.15s ease !important;
}

.headLogo a:hover,
.headLogo .site-title-link:hover {
  color: var(--linkC, #10b981) !important;
}

.headLogo img {
  max-height: 38px !important;
  width: auto !important;
  object-fit: contain !important;
  display: block !important;
}

/* Hamburger button (Mobile only) */
.tNav.drawer-trigger {
  cursor: pointer !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 8px !important;
  border: none !important;
  background: transparent !important;
  color: var(--headC, #0f172a) !important;
  transition: background 0.2s ease, color 0.2s ease !important;
  flex-shrink: 0 !important;
  padding: 0 !important;
}

.tNav.drawer-trigger:hover {
  background: rgba(0, 0, 0, 0.05) !important;
  color: var(--linkC, #10b981) !important;
}

@media (max-width: 991px) {
  .tNav.drawer-trigger {
    display: flex !important;
  }
}

/* 2. Search Box (Placed directly after Logo) */
.headD.headSearch {
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}

.headSearch .search-form-wrap {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
}

.headSearch .search-input-box {
  background: var(--srchB, #f1f5f9) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 20px !important;
  padding: 7px 14px 7px 36px !important;
  font-size: 0.88rem !important;
  color: var(--headC, #0f172a) !important;
  width: 210px !important;
  font-family: inherit !important;
  transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease !important;
  outline: none !important;
}

.headSearch .search-input-box:focus {
  width: 260px !important;
  border-color: var(--linkC, #10b981) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.15) !important;
}

.headSearch .search-icon {
  position: absolute !important;
  left: 11px !important;
  pointer-events: none !important;
  color: #334155 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 1 !important;
}

.headSearch .search-icon svg {
  fill: none !important;
  stroke: #334155 !important;
  stroke-width: 2.2 !important;
  filter: none !important;
  opacity: 1 !important;
}
.headSearch .search-icon svg circle,
.headSearch .search-icon svg line {
  fill: none !important;
  stroke: #334155 !important;
  stroke-width: 2.2 !important;
}

/* 3. Header Navigation Menu */
.headD.headNav {
  display: flex !important;
  align-items: center !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 4px 0 10px !important;
  overflow: visible !important;
  position: relative !important;
  z-index: 30 !important;
}

.header-nav-list {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  flex-wrap: nowrap !important;
}

.header-nav-list > li {
  position: relative !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.header-nav-list > li > a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 7px 14px !important;
  font-size: 0.90rem !important;
  font-weight: 600 !important;
  color: #334155 !important;
  text-decoration: none !important;
  border-radius: 9999px !important;
  white-space: nowrap !important;
  border: 1px solid transparent !important;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.header-nav-list > li > a .nav-m-icon {
  font-size: 0.95rem !important;
  color: #64748b !important;
  transition: transform 0.22s ease, color 0.22s ease !important;
}

/* Hover state - Modern elevation, subtle tint & border */
.header-nav-list > li:not(.current-menu-item):not(.current_page_item):not(.current-menu-ancestor):hover > a {
  color: #2563eb !important;
  background: rgba(37, 99, 235, 0.08) !important;
  border-color: rgba(37, 99, 235, 0.2) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 3px 10px rgba(37, 99, 235, 0.12) !important;
}

.header-nav-list > li:not(.current-menu-item):not(.current_page_item):not(.current-menu-ancestor):hover > a .nav-m-icon {
  color: #2563eb !important;
  transform: scale(1.18) translateY(-0.5px) !important;
}

/* Active State - Vibrant Gradient Pill with Glow */
.header-nav-list > li.current-menu-item > a,
.header-nav-list > li.current_page_item > a,
.header-nav-list > li.current-menu-ancestor > a {
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
  color: #ffffff !important;
  border-color: #1d4ed8 !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.32) !important;
  transform: translateY(-0.5px) !important;
}

.header-nav-list > li.current-menu-item > a .nav-m-icon,
.header-nav-list > li.current_page_item > a .nav-m-icon,
.header-nav-list > li.current-menu-ancestor > a .nav-m-icon {
  color: #ffffff !important;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.2)) !important;
}

.header-nav-list > li.current-menu-item.menu-item-has-children > a::after,
.header-nav-list > li.current-menu-ancestor.menu-item-has-children > a::after {
  border-color: #ffffff !important;
}

/* Submenu caret / arrow indicator */
.header-nav-list > li.menu-item-has-children > a::after,
.header-nav-list > li.page_item_has_children > a::after {
  content: '' !important;
  display: inline-block !important;
  width: 5px !important;
  height: 5px !important;
  border-right: 2px solid currentColor !important;
  border-bottom: 2px solid currentColor !important;
  transform: rotate(45deg) translateY(-2px) !important;
  transition: transform 0.2s ease !important;
  margin-left: 2px !important;
}

.header-nav-list > li.menu-item-has-children > a {
  cursor: pointer !important;
  user-select: none;
}

.header-nav-list > li.menu-item-has-children:hover > a::after,
.header-nav-list > li.menu-item-has-children:focus-within > a::after,
.header-nav-list > li.menu-item-has-children.dropdown-open > a::after {
  transform: rotate(-135deg) translateY(-2px) !important;
}

/* Submenu dropdown floating card */
.header-nav-list .sub-menu,
.header-nav-list .children {
  position: absolute !important;
  top: calc(100% + 4px) !important;
  left: 0 !important;
  min-width: 250px !important;
  max-width: 360px !important;
  width: max-content !important;
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 12px !important;
  padding: 8px !important;
  box-shadow: 0 14px 35px rgba(0, 0, 0, 0.12) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(8px) !important;
  transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1), transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.2s ease !important;
  z-index: 1000 !important;
  list-style: none !important;
  margin: 0 !important;
}

/* Invisible Hover Bridge - prevents mouse from losing hover when crossing gap */
.header-nav-list .sub-menu::before,
.header-nav-list .children::before {
  content: '' !important;
  position: absolute !important;
  top: -14px !important;
  left: 0 !important;
  right: 0 !important;
  height: 16px !important;
  background: transparent !important;
}

/* Smart Alignment: items on the right side of the navbar open towards the left to prevent screen overflow */
.header-nav-list > li:last-child > .sub-menu,
.header-nav-list > li:nth-last-child(2) > .sub-menu,
.header-nav-list > li.dropdown-align-right > .sub-menu {
  left: auto !important;
  right: 0 !important;
}

/* Open on Hover AND on Focus-within AND on Click/Toggle */
.header-nav-list li:hover > .sub-menu,
.header-nav-list li:hover > .children,
.header-nav-list li:focus-within > .sub-menu,
.header-nav-list li:focus-within > .children,
.header-nav-list li.dropdown-open > .sub-menu,
.header-nav-list li.dropdown-open > .children {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) !important;
}

.header-nav-list .sub-menu li,
.header-nav-list .children li {
  list-style: none !important;
  margin: 0 0 3px 0 !important;
  padding: 0 !important;
  position: relative !important;
}

.header-nav-list .sub-menu li:last-child,
.header-nav-list .children li:last-child {
  margin-bottom: 0 !important;
}

.header-nav-list .sub-menu a,
.header-nav-list .children a {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 12px !important;
  font-size: 0.88rem !important;
  font-weight: 500 !important;
  color: #334155 !important;
  text-decoration: none !important;
  border-radius: 8px !important;
  transition: all 0.18s ease !important;
  white-space: normal !important;
  line-height: 1.35 !important;
  word-break: break-word !important;
}

.header-nav-list .sub-menu a .nav-m-icon,
.header-nav-list .children a .nav-m-icon {
  font-size: 0.85rem !important;
  color: inherit !important;
  width: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.header-nav-list .sub-menu a:hover,
.header-nav-list .children a:hover {
  color: #1d4ed8 !important;
  background: rgba(37, 99, 235, 0.08) !important;
  transform: translateX(4px) !important;
}

/* Multi-level sub-sub-menu */
.header-nav-list .sub-menu .sub-menu {
  top: 0 !important;
  left: calc(100% + 4px) !important;
  right: auto !important;
}

/* Desktop Header: "অনলাইন টুলস ও সেবা" Dropdown Menu Styling */
.header-nav-list > li.menu-item-tools > a {
  font-weight: 700 !important;
}

.header-nav-list > li.menu-item-tools:not(.current-menu-ancestor):hover > a {
  color: #059669 !important;
  background: rgba(16, 185, 129, 0.1) !important;
  border-color: rgba(16, 185, 129, 0.25) !important;
}

.header-nav-list > li.menu-item-tools.current-menu-ancestor > a {
  background: linear-gradient(135deg, #059669 0%, #10b981 100%) !important;
  color: #ffffff !important;
  border-color: #059669 !important;
  box-shadow: 0 4px 14px rgba(16, 185, 129, 0.35) !important;
}

.header-nav-list > li.menu-item-tools .sub-menu {
  min-width: 320px !important;
  padding: 8px !important;
}

.header-nav-list > li.menu-item-tools .sub-menu li {
  margin-bottom: 3px !important;
}

.header-nav-list > li.menu-item-tools .sub-menu a,
.drawer-tools-section .drawer-menu-list a {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 8px 12px !important;
  border-radius: 9px !important;
  text-decoration: none !important;
  transition: all 0.18s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.header-nav-list > li.menu-item-tools .sub-menu a:hover,
.drawer-tools-section .drawer-menu-list a:hover {
  background: #f1f5f9 !important;
  transform: translateX(3px) !important;
}

.drK .header-nav-list > li.menu-item-tools .sub-menu a:hover,
[data-theme="dark"] .header-nav-list > li.menu-item-tools .sub-menu a:hover,
.drK .drawer-tools-section .drawer-menu-list a:hover,
[data-theme="dark"] .drawer-tools-section .drawer-menu-list a:hover {
  background: #334155 !important;
}

/* Tool item badge (icon container) */
.tool-item-badge {
  width: 34px !important;
  height: 34px !important;
  border-radius: 9px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.header-nav-list > li.menu-item-tools .sub-menu a:hover .tool-item-badge,
.drawer-tools-section a:hover .tool-item-badge {
  transform: scale(1.1) !important;
}

/* Tool item title */
.tool-item-title {
  flex: 1 !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  color: #1e293b !important;
  line-height: 1.35 !important;
}

.drK .tool-item-title,
[data-theme="dark"] .tool-item-title {
  color: #f1f5f9 !important;
}

/* Tool NEW badge */
.tool-badge-new {
  margin-left: auto !important;
  font-size: 0.62rem !important;
  background: #0284c7 !important;
  color: #ffffff !important;
  padding: 2px 7px !important;
  border-radius: 4px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  flex-shrink: 0 !important;
}

/* Distinct Vibrant Badge Colors (Light Mode) */
.tool-badge-teal {
  background: #ecfdf5 !important;
  color: #059669 !important;
  border: 1px solid #a7f3d0 !important;
}

.tool-badge-blue {
  background: #eff6ff !important;
  color: #2563eb !important;
  border: 1px solid #bfdbfe !important;
}

.tool-badge-amber {
  background: #fffbeb !important;
  color: #d97706 !important;
  border: 1px solid #fde68a !important;
}

.tool-badge-purple {
  background: #f5f3ff !important;
  color: #7c3aed !important;
  border: 1px solid #ddd6fe !important;
}

.tool-badge-sky {
  background: #f0f9ff !important;
  color: #0284c7 !important;
  border: 1px solid #bae6fd !important;
}

/* Distinct Vibrant Badge Colors (Dark Mode) */
.drK .tool-badge-teal, [data-theme="dark"] .tool-badge-teal {
  background: rgba(16, 185, 129, 0.2) !important;
  color: #34d399 !important;
  border-color: rgba(52, 211, 153, 0.35) !important;
}

.drK .tool-badge-blue, [data-theme="dark"] .tool-badge-blue {
  background: rgba(37, 99, 235, 0.2) !important;
  color: #60a5fa !important;
  border-color: rgba(96, 165, 250, 0.35) !important;
}

.drK .tool-badge-amber, [data-theme="dark"] .tool-badge-amber {
  background: rgba(245, 158, 11, 0.2) !important;
  color: #fbbf24 !important;
  border-color: rgba(251, 191, 36, 0.35) !important;
}

.drK .tool-badge-purple, [data-theme="dark"] .tool-badge-purple {
  background: rgba(124, 58, 237, 0.2) !important;
  color: #a78bfa !important;
  border-color: rgba(167, 139, 250, 0.35) !important;
}

.drK .tool-badge-sky, [data-theme="dark"] .tool-badge-sky {
  background: rgba(14, 165, 233, 0.2) !important;
  color: #38bdf8 !important;
  border-color: rgba(56, 189, 248, 0.35) !important;
}

/* CRITICAL: Overcome plus-ui.css "svg { fill: var(--svgC) }" so icons are NEVER solid filled grey blobs! */
.tool-item-badge svg,
.tool-item-badge svg *,
.drawer-tools-section .tool-item-badge svg,
.drawer-tools-section .tool-item-badge svg * {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.header-nav-list > li.menu-item-tools .sub-menu li.current-menu-item a {
  background: rgba(16, 185, 129, 0.12) !important;
}

.header-nav-list > li.menu-item-tools .sub-menu li.current-menu-item .tool-item-title {
  color: #059669 !important;
  font-weight: 700 !important;
}

.drK .header-nav-list > li.menu-item-tools:not(.current-menu-ancestor):hover > a,
[data-theme="dark"] .header-nav-list > li.menu-item-tools:not(.current-menu-ancestor):hover > a {
  color: #34d399 !important;
  background: rgba(16, 185, 129, 0.18) !important;
  border-color: rgba(52, 211, 153, 0.3) !important;
}

.drK .header-nav-list > li.menu-item-tools .sub-menu li.current-menu-item a,
[data-theme="dark"] .header-nav-list > li.menu-item-tools .sub-menu li.current-menu-item a {
  background: rgba(16, 185, 129, 0.2) !important;
}

.drK .header-nav-list > li.menu-item-tools .sub-menu li.current-menu-item .tool-item-title,
[data-theme="dark"] .header-nav-list > li.menu-item-tools .sub-menu li.current-menu-item .tool-item-title {
  color: #34d399 !important;
}

@media (max-width: 991px) {
  .headD.headNav {
    display: none !important;
  }
}

/* 4. Right: Dark / Light Mode Switcher */
.headD.headR {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex: 0 0 auto !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  flex-basis: auto !important;
  margin-left: auto !important;
  padding: 0 !important;
  gap: 8px !important;
  width: auto !important;
  position: relative !important;
  z-index: 10 !important;
}

@media (max-width: 1200px) and (min-width: 992px) {
  .headSearch .search-input-box {
    width: 150px !important;
  }
  .headSearch .search-input-box:focus {
    width: 190px !important;
  }
  .header-nav-list {
    gap: 2px !important;
  }
  .header-nav-list > li > a {
    padding: 6px 9px !important;
    font-size: 0.85rem !important;
  }
}

.tDL {
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  background: #f1f5f9 !important;
  color: var(--headC, #0f172a) !important;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1) !important;
  flex-shrink: 0 !important;
  padding: 0 !important;
}

.tDL:hover {
  background: rgba(16, 185, 129, 0.12) !important;
  color: var(--linkC, #10b981) !important;
  border-color: rgba(16, 185, 129, 0.3) !important;
  transform: rotate(15deg);
}

.tDL svg {
  width: 18px !important;
  height: 18px !important;
  stroke: currentColor !important;
}

.d1 { display: block !important; }
.d2 { display: none !important; }
.drK .d1, [data-theme="dark"] .d1 { display: none !important; }
.drK .d2, [data-theme="dark"] .d2 { display: block !important; }

/* Desktop & Global Header Bookmarks Button */
.header-bookmarks-trigger {
  position: relative !important;
}
.header-bookmarks-trigger:hover {
  transform: scale(1.08) !important;
}
.header-bm-badge {
  position: absolute !important;
  top: -2px !important;
  right: -2px !important;
  background: #ef4444 !important;
  color: #ffffff !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  min-width: 16px !important;
  height: 16px !important;
  line-height: 16px !important;
  border-radius: 8px !important;
  padding: 0 4px !important;
  text-align: center !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25) !important;
  border: 1.5px solid #ffffff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.drK .header-bm-badge,
[data-theme="dark"] .header-bm-badge {
  border-color: #1e293b !important;
}

/* Dark Mode Theme Support for Header */
.drK .mainH,
[data-theme="dark"] .mainH {
  background: rgba(18, 26, 43, 0.94) !important;
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.3) !important;
}

.drK .headLogo a,
.drK .headLogo .site-title-link,
[data-theme="dark"] .headLogo a {
  color: #f8fafc !important;
}

.drK .tNav.drawer-trigger,
[data-theme="dark"] .tNav.drawer-trigger {
  color: #f8fafc !important;
}

.drK .tNav.drawer-trigger:hover,
[data-theme="dark"] .tNav.drawer-trigger:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #34d399 !important;
}

.drK .headSearch .search-input-box,
[data-theme="dark"] .headSearch .search-input-box {
  background: #1e293b !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  color: #f1f5f9 !important;
}

.drK .headSearch .search-input-box:focus,
[data-theme="dark"] .headSearch .search-input-box:focus {
  background: #273549 !important;
  border-color: #10b981 !important;
  box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.25) !important;
}

.drK .headSearch .search-icon,
[data-theme="dark"] .headSearch .search-icon {
  color: #cbd5e1 !important;
  opacity: 1 !important;
}

.drK .headSearch .search-icon svg,
[data-theme="dark"] .headSearch .search-icon svg {
  fill: none !important;
  stroke: #f1f5f9 !important;
  stroke-width: 2.2 !important;
  filter: none !important;
  opacity: 1 !important;
}
.drK .headSearch .search-icon svg circle,
.drK .headSearch .search-icon svg line,
[data-theme="dark"] .headSearch .search-icon svg circle,
[data-theme="dark"] .headSearch .search-icon svg line {
  fill: none !important;
  stroke: #f1f5f9 !important;
  stroke-width: 2.2 !important;
}

.drK .header-nav-list > li > a,
[data-theme="dark"] .header-nav-list > li > a {
  color: #cbd5e1 !important;
}

.drK .header-nav-list > li > a .nav-m-icon,
[data-theme="dark"] .header-nav-list > li > a .nav-m-icon {
  color: #94a3b8 !important;
}

.drK .header-nav-list > li:not(.current-menu-item):not(.current_page_item):not(.current-menu-ancestor):hover > a,
[data-theme="dark"] .header-nav-list > li:not(.current-menu-item):not(.current_page_item):not(.current-menu-ancestor):hover > a {
  color: #60a5fa !important;
  background: rgba(59, 130, 246, 0.16) !important;
  border-color: rgba(96, 165, 250, 0.28) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}

.drK .header-nav-list > li:not(.current-menu-item):not(.current_page_item):not(.current-menu-ancestor):hover > a .nav-m-icon,
[data-theme="dark"] .header-nav-list > li:not(.current-menu-item):not(.current_page_item):not(.current-menu-ancestor):hover > a .nav-m-icon {
  color: #60a5fa !important;
}

.drK .header-nav-list > li.current-menu-item > a,
.drK .header-nav-list > li.current_page_item > a,
.drK .header-nav-list > li.current-menu-ancestor > a,
[data-theme="dark"] .header-nav-list > li.current-menu-item > a,
[data-theme="dark"] .header-nav-list > li.current_page_item > a,
[data-theme="dark"] .header-nav-list > li.current-menu-ancestor > a {
  background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%) !important;
  color: #ffffff !important;
  border-color: #3b82f6 !important;
  box-shadow: 0 4px 16px rgba(59, 130, 246, 0.4) !important;
}

.drK .header-nav-list > li.current-menu-item > a .nav-m-icon,
.drK .header-nav-list > li.current_page_item > a .nav-m-icon,
.drK .header-nav-list > li.current-menu-ancestor > a .nav-m-icon,
[data-theme="dark"] .header-nav-list > li.current-menu-item > a .nav-m-icon {
  color: #ffffff !important;
}

.drK .header-nav-list .sub-menu,
.drK .header-nav-list .children,
[data-theme="dark"] .header-nav-list .sub-menu {
  background: #1e293b !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.5) !important;
}

.drK .header-nav-list .sub-menu a,
[data-theme="dark"] .header-nav-list .sub-menu a {
  color: #cbd5e1 !important;
}

.drK .header-nav-list .sub-menu a .nav-m-icon,
[data-theme="dark"] .header-nav-list .sub-menu a .nav-m-icon {
  color: #94a3b8 !important;
}

.drK .header-nav-list .sub-menu a:hover,
[data-theme="dark"] .header-nav-list .sub-menu a:hover {
  background: rgba(59, 130, 246, 0.16) !important;
  color: #93c5fd !important;
}

.drK .header-nav-list .sub-menu a:hover .nav-m-icon,
[data-theme="dark"] .header-nav-list .sub-menu a:hover .nav-m-icon {
  color: #60a5fa !important;
}

.drK .tDL,
[data-theme="dark"] .tDL {
  background: #1e293b !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  color: #f1f5f9 !important;
}

.drK .tDL:hover,
[data-theme="dark"] .tDL:hover {
  background: #273549 !important;
  color: #facc15 !important;
  border-color: rgba(250, 204, 21, 0.3) !important;
}

/* Responsive Mobile Header Tweaks */
@media (max-width: 768px) {
  .headC {
    height: 54px !important;
    padding: 0 10px !important;
    gap: 8px !important;
  }
  .headLogo {
    font-size: 1.1rem !important;
  }
  .headSearch .search-input-box {
    width: 130px !important;
    padding: 6px 10px 6px 30px !important;
    font-size: 0.82rem !important;
  }
  .headSearch .search-input-box:focus {
    width: 160px !important;
  }
  .headSearch .search-icon {
    left: 8px !important;
  }
  .tDL {
    width: 34px !important;
    height: 34px !important;
  }
}

@media (max-width: 420px) {
  .headSearch .search-input-box {
    width: 105px !important;
  }
  .headSearch .search-input-box:focus {
    width: 130px !important;
  }
}

/* ==========================================================================
   Drawer Navigation Sidebar
   ========================================================================== */
.drawer-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(2px);
  z-index: 998;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.drawer-overlay.active {
  opacity: 1;
  visibility: visible;
}
.drawer-sidebar {
  position: fixed;
  top: 0;
  left: 0;
  width: 260px;
  height: 100vh;
  background: var(--menuB, #fff);
  box-shadow: 2px 0 20px rgba(0,0,0,0.08);
  z-index: 999;
  transform: translateX(-100%);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.drawer-sidebar.open {
  transform: translateX(0);
}
.drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid var(--contentL, #f1f1f0);
}
.drawer-nav {
  padding: 12px 10px;
  flex: 1;
}
.drawer-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.drawer-nav li {
  margin-bottom: 3px;
}
.drawer-nav a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 6px;
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--menuC, #08102b);
  transition: background 0.15s ease, color 0.15s ease;
}
.drawer-nav a:hover,
.drawer-nav li.current-menu-item > a {
  background: var(--transB, rgba(0,0,0,0.05));
  color: var(--linkC, #1976d2);
}
.drawer-nav .sub-menu {
  padding-left: 18px;
  margin-top: 3px;
}

/* Mobile Drawer: Hide duplicate top 'শিক্ষার্থী সেবা' / Student Services if rendered from primary menu */
.drawer-sidebar .drawer-nav > ul.drawer-menu-list > li#menu-item-70217,
.drawer-sidebar .drawer-nav > ul.drawer-menu-list > li.menu-item-70217 {
  display: none !important;
}
.drawer-sidebar .drawer-nav > ul.drawer-menu-list > li:has(> a[href*="teletalk"]),
.drawer-sidebar .drawer-nav > ul.drawer-menu-list > li:has(> a[href*="nu-cgpa"]),
.drawer-sidebar .drawer-nav > ul.drawer-menu-list > li:has(> a[href*="admission-checker"]) {
  display: none !important;
}

/* ==========================================================================
   Reading Progress Bar
   ========================================================================== */
#reading-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  background: var(--linkC, #1976d2);
  width: 0%;
  z-index: 1000;
  transition: width 0.1s linear;
}

/* ==========================================================================
   Table of Contents (TOC)
   ========================================================================== */
.plus-toc {
  background: var(--contentBs, #f8fafc);
  border: 1px solid var(--contentL, #e2e8f0);
  border-radius: 12px;
  padding: 12px 16px;
  margin: 20px 0;
  transition: all 0.2s ease;
}
.plus-toc-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  user-select: none;
  padding: 2px 0;
}
.plus-toc-title {
  font-size: 0.98rem;
  font-weight: 700;
  color: var(--headC, #08102b);
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}
.plus-toc-toggle {
  background: var(--cardB, #ffffff);
  border: 1px solid var(--contentL, #cbd5e1);
  border-radius: 9999px;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--linkC, #2563eb);
  cursor: pointer;
  padding: 3px 12px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  transition: all 0.15s ease;
}
.plus-toc-toggle:hover {
  background: var(--linkC, #2563eb);
  color: #ffffff;
  border-color: var(--linkC, #2563eb);
}
.plus-toc-list {
  margin: 12px 0 4px 0;
  padding-left: 20px;
  list-style: decimal;
  border-top: 1px dashed var(--contentL, #e2e8f0);
  padding-top: 10px;
}
.plus-toc-list.collapsed {
  display: none !important;
}
.plus-toc-list li {
  margin-bottom: 6px;
  font-size: 0.9rem;
  line-height: 1.5;
}
.plus-toc-list a {
  color: var(--bodyC, #08102b);
  transition: color 0.15s ease;
}
.plus-toc-list a:hover {
  color: var(--linkC, #2563eb);
}

.drK .plus-toc,
[data-theme="dark"] .plus-toc {
  background: #1e293b !important;
  border-color: #334155 !important;
}
.drK .plus-toc-title,
[data-theme="dark"] .plus-toc-title {
  color: #f1f5f9 !important;
}
.drK .plus-toc-toggle,
[data-theme="dark"] .plus-toc-toggle {
  background: #0f172a !important;
  border-color: #334155 !important;
  color: #60a5fa !important;
}
.drK .plus-toc-toggle:hover,
[data-theme="dark"] .plus-toc-toggle:hover {
  background: #2563eb !important;
  color: #ffffff !important;
}
.drK .plus-toc-list,
[data-theme="dark"] .plus-toc-list {
  border-top-color: #334155 !important;
}
.drK .plus-toc-list a,
[data-theme="dark"] .plus-toc-list a {
  color: #cbd5e1 !important;
}
.drK .plus-toc-list a:hover,
[data-theme="dark"] .plus-toc-list a:hover {
  color: #60a5fa !important;
}

/* ==========================================================================
   Code Blocks & Copy Button
   ========================================================================== */
pre {
  position: relative;
  background: var(--synxB, #f6f6f6);
  color: var(--synxC, #2f3337);
  border-radius: 8px;
  padding: 16px;
  overflow-x: auto;
  font-family: var(--fontC, monospace);
  font-size: 0.88rem;
  margin: 16px 0;
}
.code-copy-btn {
  position: absolute;
  top: 6px;
  right: 6px;
  background: var(--contentB, #fff);
  border: 1px solid var(--contentL, #ddd);
  border-radius: 5px;
  padding: 3px 8px;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--bodyC, #333);
  cursor: pointer;
  opacity: 0.8;
  transition: opacity 0.2s ease, background 0.2s ease;
  display: flex;
  align-items: center;
  gap: 4px;
}
pre:hover .code-copy-btn {
  opacity: 1;
}
.code-copy-btn:hover {
  background: var(--linkC, #1976d2);
  color: #fff;
  border-color: var(--linkC, #1976d2);
}

/* ==========================================================================
   Post Layout & 3-Column Grid on Desktop
   ========================================================================== */
.main-wrapper {
  max-width: var(--contentW, 1280px);
  margin: 0 auto;
  padding: 16px 14px 28px;
  display: flex;
  gap: 20px;
}
.content-area {
  flex: 1;
  min-width: 0;
}
.sidebar-area {
  width: var(--sideW, 300px);
  flex-shrink: 0;
}

@media (max-width: 900px) {
  .main-wrapper {
    flex-direction: column;
    padding: 12px 10px 24px;
    gap: 16px;
  }
  .sidebar-area {
    width: 100%;
  }
}

/* 3 Columns on PC / Desktop */
@media (min-width: 992px) {
  .blog-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
  }
}
@media (max-width: 991px) and (min-width: 601px) {
  .blog-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px !important;
  }
}

/* 2 Columns on Mobile with App-Like Sleek Styling */
@media (max-width: 600px) {
  .blog-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  .post-card {
    border-radius: 8px !important;
    margin-bottom: 0 !important;
  }
  .post-card-body {
    padding: 8px 10px 10px !important;
  }
  .post-card-title {
    font-size: 13px !important;
    line-height: 1.45 !important;
    margin-bottom: 4px !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }
  .post-card-snippet {
    display: none !important;
  }
  .post-card-meta {
    font-size: 11px !important;
    margin-top: 4px !important;
    gap: 6px !important;
  }
  .dynamic-post-cover {
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    min-height: 96px !important;
    padding: 7px 8px !important;
  }
  .dyn-cover-top {
    margin-bottom: 3px !important;
  }
  .dyn-cover-badge {
    font-size: 8.5px !important;
    padding: 1px 5px !important;
  }
  .dyn-cover-logo-mark {
    font-size: 8px !important;
  }
  .dyn-cover-title {
    font-size: 11.5px !important;
    line-height: 1.25 !important;
    -webkit-line-clamp: 3 !important;
  }
  .dyn-cover-code-wrap {
    margin-top: 2px !important;
  }
  .dyn-cover-code {
    font-size: 8px !important;
    padding: 1px 5px !important;
  }
  .dyn-cover-bottom {
    display: none !important;
  }
}

/* Post Cards (Tight & Compact Padding with Vibrant Hover) */
.post-card {
  background: var(--contentB, #fff);
  border-radius: 12px;
  border: 1px solid var(--contentL, #e2e8f0);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.22s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.22s ease;
}
.post-card:hover {
  transform: translateY(-4px);
  border-color: #93c5fd;
  box-shadow: 0 10px 25px -3px rgba(37, 99, 235, 0.12), 0 4px 10px -2px rgba(0, 0, 0, 0.05);
}
.post-card-thumb {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: var(--contentBs, #eee);
  overflow: hidden;
}
.post-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.post-card:hover .post-card-thumb img {
  transform: scale(1.03);
}

/* Dynamic Title-Based Cover (When No Featured Image Exists) */
.dynamic-post-cover {
  position: relative;
  width: 100%;
  height: 100%;
  aspect-ratio: 16 / 9;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 8px 10px;
  color: #ffffff;
  overflow: hidden;
  box-sizing: border-box;
  user-select: none;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.post-card:hover .dynamic-post-cover {
  transform: scale(1.03);
}

/* 6 Aesthetic Vibrant Multi-Stop Gradient Palettes */
.cover-grad-0 {
  background: linear-gradient(135deg, #064e3b 0%, #059669 45%, #10b981 80%, #34d399 100%);
}
.cover-grad-1 {
  background: linear-gradient(135deg, #0f172a 0%, #1e40af 45%, #2563eb 75%, #38bdf8 100%);
}
.cover-grad-2 {
  background: linear-gradient(135deg, #1e1b4b 0%, #4338ca 45%, #6366f1 75%, #818cf8 100%);
}
.cover-grad-3 {
  background: linear-gradient(135deg, #3b0764 0%, #701a75 45%, #a21caf 75%, #d946ef 100%);
}
.cover-grad-4 {
  background: linear-gradient(135deg, #881337 0%, #be123c 45%, #e11d48 75%, #fb7185 100%);
}
.cover-grad-5 {
  background: linear-gradient(135deg, #451a03 0%, #c2410c 45%, #ea580c 75%, #f59e0b 100%);
}

/* Background Texture & Watermark */
.dyn-cover-pattern {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: radial-gradient(circle at top right, rgba(255, 255, 255, 0.22) 0%, transparent 60%),
                    radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.25) 0%, transparent 70%);
  pointer-events: none;
  z-index: 1;
}
.dyn-cover-watermark {
  position: absolute;
  right: -10px;
  bottom: -15px;
  color: rgba(255, 255, 255, 0.09);
  pointer-events: none;
  z-index: 1;
  transform: rotate(-10deg);
}

/* Cover Header Pill */
.dyn-cover-top {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.dyn-cover-badge {
  background: rgba(0, 0, 0, 0.35) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  color: #ffffff !important;
  padding: 3px 9px !important;
  border-radius: 12px !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.3px !important;
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
  white-space: nowrap !important;
  max-width: 65% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25) !important;
}
.dyn-cover-logo-mark {
  font-size: 0.65rem;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.85);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  white-space: nowrap;
}

/* Cover Main Title */
.dyn-cover-body {
  position: relative;
  z-index: 2;
  margin: auto 0;
  padding: 4px 0;
}
.dyn-cover-title {
  font-family: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif !important;
  font-size: 0.96rem !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  line-height: 1.35 !important;
  margin: 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  word-break: break-word !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.55) !important;
}
.dyn-cover-code-wrap {
  margin-top: 5px;
}
.dyn-cover-code {
  display: inline-block;
  background: rgba(245, 158, 11, 0.28) !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
  color: #fef08a !important;
  font-family: 'Fraunces', 'Noto Serif Bengali', serif !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
  border: 1px solid rgba(251, 191, 36, 0.6) !important;
  letter-spacing: 0.4px !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25) !important;
}

/* Cover Footer Accent */
.dyn-cover-bottom {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.dyn-cover-action {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.68rem;
  color: rgba(255, 255, 255, 0.9);
  background: rgba(0, 0, 0, 0.25);
  padding: 2px 8px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.15);
}

/* For Single Post Large Cover */
.single-featured-img .dynamic-post-cover {
  aspect-ratio: 16 / 8;
  border-radius: 12px;
  padding: 30px 24px;
}
.single-featured-img .dyn-cover-title {
  font-size: 1.5rem !important;
}
.single-featured-img .dyn-cover-badge {
  font-size: 0.82rem;
  padding: 4px 12px;
}
.single-featured-img .dyn-cover-watermark svg {
  width: 220px;
  height: 220px;
}

.post-card-badge {
  position: absolute;
  top: 8px;
  left: 8px;
  background: var(--linkC, #1976d2);
  color: #fff;
  padding: 2px 8px;
  border-radius: 14px;
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
.post-card-body {
  padding: 6px 8px 6px !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
}
.post-card-title,
.post-card-title.pTtl.itm {
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  line-height: 1.48 !important;
  margin: 0 0 5px !important;
  color: var(--headC, #08102b) !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  word-break: break-word !important;
  max-height: calc(1.48em * 3) !important;
}
.post-card-title a,
.post-card-title.pTtl.itm a {
  color: inherit;
  font-family: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif !important;
  line-height: 1.48 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.post-card-title a:hover {
  color: var(--linkC, #10b981) !important;
}
.post-card-snippet,
.post-card-snippet.pDesc,
.post-card .pDesc {
  font-size: 0.8rem !important;
  color: var(--bodyCa, #64748b) !important;
  line-height: 1.35 !important;
  margin: 2px 0 !important; /* 70% reduced vertical margin for compact card */
  padding: 0 !important;
  flex: 1 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  word-break: break-word !important;
  max-height: calc(1.35em * 2) !important;
}
.post-card-snippet p,
.post-card-snippet.pDesc p,
.post-card .pDesc p {
  margin: 0 !important;
  padding: 0 !important;
  line-height: inherit !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  word-break: break-word !important;
}
.post-card-meta {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-size: 0.74rem !important;
  color: var(--bodyCa, #64748b) !important;
  border-top: 1px solid var(--contentL, #f1f5f9) !important;
  padding-top: 4px !important;
  margin-top: 3px !important;
  gap: 8px !important;
}

.card-meta-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  white-space: nowrap !important;
  font-weight: 500 !important;
  color: var(--bodyCa, #64748b) !important;
  line-height: 1 !important;
}

.card-meta-icon {
  font-size: 12px !important;
  color: #64748b !important;
  margin-right: 3px !important;
  display: inline-block !important;
  vertical-align: middle !important;
  line-height: 1 !important;
}

.drK .card-meta-icon,
[data-theme="dark"] .card-meta-icon {
  color: #94a3b8 !important;
}

.card-meta-item svg {
  color: var(--bodyCa, #94a3b8) !important;
  fill: none !important;
  stroke: currentColor !important;
  flex-shrink: 0 !important;
  opacity: 0.85 !important;
}

.drK .card-meta-item,
[data-theme="dark"] .card-meta-item {
  color: #94a3b8 !important;
}

.drK .card-meta-item svg,
[data-theme="dark"] .card-meta-item svg {
  color: #64748b !important;
}

/* ==========================================================================
   Featured Hero Carousel / Banner
   ========================================================================== */
.featured-hero {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 20px;
  aspect-ratio: 24 / 9;
  background: var(--contentBs, #eee);
}
@media (max-width: 768px) {
  .featured-hero {
    aspect-ratio: 16 / 9;
  }
}
.featured-hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.featured-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.3) 60%, transparent 100%);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 16px 20px;
  color: #fff;
}
.featured-hero-title {
  color: #fff;
  font-size: 1.35rem;
  font-weight: 700;
  margin: 6px 0;
}
.featured-hero-title a {
  color: #fff;
}

/* ==========================================================================
   Single Post Specific Styles & Content Formatting
   ========================================================================== */
.single-article {
  background: var(--contentB, #fff);
  border-radius: 10px;
  border: 1px solid var(--contentL, #f1f1f0);
  padding: 22px 24px;
}
@media (max-width: 600px) {
  .single-article {
    padding: 14px;
  }
}
.single-header {
  margin-bottom: 16px;
}
.single-breadcrumbs {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.82rem;
  color: var(--bodyCa, #989b9f);
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.single-breadcrumbs a {
  color: var(--bodyCa, #989b9f);
}
.single-breadcrumbs a:hover {
  color: var(--linkC, #1976d2);
}
.single-title {
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--headC, #08102b);
  margin: 0 0 12px;
}
.single-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 0.82rem;
  color: var(--bodyCa, #989b9f);
  flex-wrap: wrap;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--contentL, #f1f1f0);
}
.single-meta .meta-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
}
.single-meta .meta-item svg {
  width: 15px !important;
  height: 15px !important;
  stroke: #334155 !important;
  stroke-width: 1.8 !important;
  fill: none !important;
  display: inline-block !important;
  vertical-align: middle !important;
  flex-shrink: 0 !important;
}
.single-meta .meta-item svg * {
  stroke: inherit !important;
  stroke-width: inherit !important;
  fill: none !important;
}
.drK .single-meta .meta-item svg,
[data-theme="dark"] .single-meta .meta-item svg,
.drK .single-meta .meta-item svg *,
[data-theme="dark"] .single-meta .meta-item svg * {
  stroke: #94a3b8 !important;
  fill: none !important;
}
/* Specifically for Calendar Icon to be extra crisp and visible */
.single-meta .meta-date svg,
.single-meta .meta-calendar-svg,
.single-meta .meta-cal-icon {
  width: 16px !important;
  height: 16px !important;
  stroke: #1e293b !important;
  stroke-width: 2 !important;
  fill: none !important;
}
.single-meta .meta-date svg *,
.single-meta .meta-calendar-svg *,
.single-meta .meta-cal-icon * {
  stroke: #1e293b !important;
  stroke-width: 2 !important;
  fill: none !important;
}
.drK .single-meta .meta-date svg,
.drK .single-meta .meta-calendar-svg,
.drK .single-meta .meta-cal-icon,
[data-theme="dark"] .single-meta .meta-date svg,
[data-theme="dark"] .single-meta .meta-calendar-svg,
[data-theme="dark"] .single-meta .meta-cal-icon {
  stroke: #e2e8f0 !important;
}
.drK .single-meta .meta-date svg *,
.drK .single-meta .meta-calendar-svg *,
.drK .single-meta .meta-cal-icon *,
[data-theme="dark"] .single-meta .meta-date svg *,
[data-theme="dark"] .single-meta .meta-calendar-svg *,
[data-theme="dark"] .single-meta .meta-cal-icon * {
  stroke: #e2e8f0 !important;
}
.single-meta .meta-updated-badge svg,
.single-meta .meta-updated-badge svg * {
  stroke: #059669 !important;
  fill: none !important;
}
.drK .single-meta .meta-updated-badge svg,
[data-theme="dark"] .single-meta .meta-updated-badge svg,
.drK .single-meta .meta-updated-badge svg *,
[data-theme="dark"] .single-meta .meta-updated-badge svg * {
  stroke: #34d399 !important;
  fill: none !important;
}
.single-featured-img {
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 8px;
  overflow: hidden;
  margin: 16px 0;
  background-color: var(--cardB, #f1f5f9);
}
.single-featured-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.single-content {
  font-family: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif !important;
  font-size: 1.1rem;
  line-height: 1.9;
  color: var(--bodyC, #08102b);
  letter-spacing: 0.015em;
}
.single-content p {
  margin-bottom: 1.3em;
}
.single-content h2, .single-content h3, .single-content h4 {
  margin: 1.6em 0 0.6em;
  line-height: 1.3;
}
.single-content blockquote {
  margin: 1.5em 0;
  padding: 12px 18px;
  border-left: 4px solid var(--linkC, #1976d2);
  background: var(--contentBs, #f6f6f6);
  border-radius: 0 6px 6px 0;
  font-style: italic;
  color: var(--headC, #08102b);
}

/* ==========================================================================
   Standard Table Styles & Responsive Overflow Fix (User Requested)
   ========================================================================== */
.table-responsive,
.single-content .wp-block-table,
.single-content figure.wp-block-table {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
  margin: 16px 0 !important;
  border-radius: 6px !important;
}

.single-content table,
.entry-content table {
  width: 100% !important;
  min-width: 0 !important;        /* screen এর সাথে 100% fit */
  table-layout: auto !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  margin: 0 !important;
  border: 1px solid var(--contentL, #cbd5e1) !important;
  font-size: 0.875rem !important; /* একটু ছোট ফন্ট - compact */
  background: var(--contentB, #ffffff) !important;
}

.single-content table th,
.single-content table td,
.entry-content table th,
.entry-content table td {
  border: 1px solid var(--contentL, #cbd5e1) !important;
  padding: 6px 10px !important;   /* compact padding */
  line-height: 1.4 !important;    /* tight line spacing */
  vertical-align: middle !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  white-space: normal !important; /* wrap text */
}

.single-content table th,
.entry-content table th {
  background: var(--contentBs, #f1f5f9) !important;
  color: var(--headC, #0f172a) !important;
  font-weight: 700 !important;
  text-align: center !important;  /* header সারি center */
  white-space: normal !important; /* header-ও wrap হবে প্রয়োজনে */
}

.single-content table td,
.entry-content table td {
  color: var(--bodyC, #334155) !important;
  text-align: left !important;
}

.single-content table tbody tr:nth-child(even),
.entry-content table tbody tr:nth-child(even) {
  background: #f8fafc !important;
}

.single-content table tbody tr:hover,
.entry-content table tbody tr:hover {
  background: #f1f5f9 !important;
}

/* Dark Mode Table Grid & Borders */
.drK .single-content table,
.drK .entry-content table,
[data-theme='dark'] .single-content table,
[data-theme='dark'] .entry-content table {
  background: #1e293b !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
}

.drK .single-content table th,
.drK .single-content table td,
.drK .entry-content table th,
.drK .entry-content table td,
[data-theme='dark'] .single-content table th,
[data-theme='dark'] .single-content table td,
[data-theme='dark'] .entry-content table th,
[data-theme='dark'] .entry-content table td {
  border-color: rgba(255, 255, 255, 0.15) !important;
}

.drK .single-content table th,
.drK .entry-content table th,
[data-theme='dark'] .single-content table th,
[data-theme='dark'] .entry-content table th {
  background: #0f172a !important;
  color: #f8fafc !important;
}

.drK .single-content table td,
.drK .entry-content table td,
[data-theme='dark'] .single-content table td,
[data-theme='dark'] .entry-content table td {
  color: #cbd5e1 !important;
}

.drK .single-content table tbody tr:nth-child(even),
.drK .entry-content table tbody tr:nth-child(even),
[data-theme='dark'] .single-content table tbody tr:nth-child(even),
[data-theme='dark'] .entry-content table tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.03) !important;
}

.drK .single-content table tbody tr:hover,
.drK .entry-content table tbody tr:hover,
[data-theme='dark'] .single-content table tbody tr:hover,
[data-theme='dark'] .entry-content table tbody tr:hover {
  background: rgba(255, 255, 255, 0.06) !important;
}

/* ==========================================================================
   Custom Ordered & Unordered Lists (User Requested)
   ========================================================================== */
.single-content ol:not(.plus-toc-list):not(.comment-list) {
  counter-reset: plus-ol-num;
  list-style: none;
  padding-left: 0;
  margin: 16px 0;
}
.single-content ol:not(.plus-toc-list):not(.comment-list) > li {
  counter-increment: plus-ol-num;
  position: relative;
  padding-left: 36px;
  margin-bottom: 10px;
  line-height: 1.65;
  color: var(--bodyC, #08102b);
}
.single-content ol:not(.plus-toc-list):not(.comment-list) > li::before {
  content: counter(plus-ol-num);
  position: absolute;
  left: 0;
  top: 2px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--linkC, #1976d2);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1;
}

.single-content ul:not(.plus-toc-list):not(.children) {
  list-style: none;
  padding-left: 0;
  margin: 16px 0;
}
.single-content ul:not(.plus-toc-list):not(.children) > li {
  position: relative;
  padding-left: 20px;
  margin-bottom: 8px;
  line-height: 1.65;
  color: var(--bodyC, #08102b);
}
.single-content ul:not(.plus-toc-list):not(.children) > li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 9px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--linkC, #1976d2);
}

/* Social Share Bar */
.social-share-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 20px 0 16px;
  padding: 12px 0;
  border-top: 1px solid var(--contentL, #f1f1f0);
  border-bottom: 1px solid var(--contentL, #f1f1f0);
  flex-wrap: wrap;
}
.share-label {
  font-size: 0.85rem;
  font-weight: 600;
  margin-right: 6px;
  color: var(--headC, #08102b);
}
.share-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  color: #ffffff !important;
  border: none !important;
  cursor: pointer !important;
  transition: transform 0.22s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.22s ease, opacity 0.2s ease !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
  text-decoration: none !important;
  flex-shrink: 0 !important;
  padding: 0 !important;
}
.share-btn:hover {
  transform: translateY(-2px) scale(1.08) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.22) !important;
  opacity: 0.96 !important;
}
.share-facebook { background: #1877f2 !important; }
.share-twitter  { background: #000000 !important; }
.share-whatsapp { background: #128C7E !important; }
.share-telegram { background: #229ed9 !important; }
.share-linkedin { background: #0a66c2 !important; }
.share-native   { background: #4f46e5 !important; }
.share-copy     { background: #0284c7 !important; }
.share-print    { background: #475569 !important; }

.share-btn svg {
  width: 17px !important;
  height: 17px !important;
  display: block !important;
  flex-shrink: 0 !important;
}
.share-facebook svg,
.share-twitter svg,
.share-whatsapp svg,
.share-telegram svg,
.share-linkedin svg {
  fill: #ffffff !important;
  stroke: none !important;
}
.share-facebook svg *,
.share-twitter svg *,
.share-whatsapp svg *,
.share-telegram svg *,
.share-linkedin svg * {
  fill: #ffffff !important;
  stroke: none !important;
}
.share-native svg,
.share-copy svg,
.share-print svg {
  fill: none !important;
  stroke: #ffffff !important;
  stroke-width: 2.2 !important;
}
.share-native svg *,
.share-copy svg *,
.share-print svg * {
  fill: none !important;
  stroke: #ffffff !important;
  stroke-width: 2.2 !important;
}

/* Author Box */
.author-box {
  background: var(--contentBs, #f8f9fa);
  border: 1px solid var(--contentL, #f1f1f0);
  border-radius: 10px;
  padding: 16px;
  display: flex;
  gap: 14px;
  align-items: center;
  margin: 20px 0;
}
.author-avatar img {
  width: 55px;
  height: 55px;
  border-radius: 50%;
  object-fit: cover;
}
.author-info {
  flex: 1;
}
.author-name {
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 4px;
  color: var(--headC, #08102b);
}
.author-bio {
  font-size: 0.84rem;
  color: var(--bodyCa, #989b9f);
  margin: 0;
  line-height: 1.45;
}

/* Related Posts */
.related-posts-sec {
  margin-top: 24px;
}
.related-posts-title {
  font-size: 1.15rem;
  font-weight: 700;
  margin-bottom: 14px;
  color: var(--headC, #08102b);
}

/* ==========================================================================
   Comments Section
   ========================================================================== */
.comments-area {
  margin-top: 24px;
  background: var(--contentB, #fff);
  border-radius: 10px;
  border: 1px solid var(--contentL, #f1f1f0);
  padding: 22px;
}
.comments-title {
  font-size: 1.15rem;
  font-weight: 700;
  margin-bottom: 18px;
  color: var(--headC, #08102b);
  display: flex;
  align-items: center;
  gap: 8px;
}
.comment-list, .children {
  list-style: none;
  margin: 0;
  padding: 0;
}
.children {
  padding-left: 20px;
  margin-top: 14px;
  border-left: 2px solid var(--contentL, #f1f1f0);
}
.comment-body {
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--contentL, #f1f1f0);
}
.comment-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.comment-author img {
  width: 32px;
  height: 32px;
  border-radius: 50%;
}
.comment-author .fn {
  font-weight: 700;
  color: var(--headC, #08102b);
}
.comment-metadata {
  font-size: 0.78rem;
  color: var(--bodyCa, #989b9f);
}
.comment-content {
  font-size: 0.88rem;
  line-height: 1.55;
}
.comment-respond {
  margin-top: 24px;
}
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
  width: 100%;
  background: var(--contentBs, #f6f6f6);
  border: 1px solid var(--contentL, #f1f1f0);
  border-radius: 6px;
  padding: 10px 12px;
  font-size: 0.9rem;
  margin-bottom: 10px;
  color: var(--bodyC, #08102b);
}
.comment-form textarea {
  min-height: 100px;
}
.comment-form input[type="submit"] {
  background: var(--linkC, #1976d2);
  color: #fff;
  border: none;
  border-radius: var(--linkR, 6px);
  padding: 9px 20px;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.2s ease;
}
.comment-form input[type="submit"]:hover {
  opacity: 0.9;
}

/* ==========================================================================
   Pagination Numbers (Centered, Beautiful Pill Buttons)
   ========================================================================== */
.navigation.pagination {
  margin: 28px 0;
  width: 100%;
  display: block;
}
.navigation.pagination .nav-links {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
}
.navigation.pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  height: 38px;
  padding: 0 12px;
  border-radius: 8px;
  background: var(--contentB, #fff);
  border: 1px solid var(--contentL, #f1f1f0);
  color: var(--bodyC, #08102b);
  font-size: 0.88rem;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.navigation.pagination .page-numbers:hover {
  background: var(--transB, rgba(0,0,0,0.05));
  color: var(--linkC, #1976d2);
  border-color: var(--linkC, #1976d2);
  transform: translateY(-1px);
}
.navigation.pagination .page-numbers.current {
  background: var(--linkC, #1976d2) !important;
  color: #fff !important;
  border-color: var(--linkC, #1976d2) !important;
  box-shadow: 0 3px 10px rgba(72, 45, 255, 0.25);
}
.navigation.pagination .page-numbers.dots {
  border: none;
  background: transparent;
  box-shadow: none;
  cursor: default;
  color: var(--bodyCa, #989b9f);
  padding: 0 4px;
  min-width: auto;
}
.navigation.pagination .prev.page-numbers,
.navigation.pagination .next.page-numbers {
  gap: 6px;
  padding: 0 14px;
}

/* ==========================================================================
   Mobile Bottom Navigation Dock
   ========================================================================== */
.mobile-nav-dock {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100vw;
  height: 54px;
  background: var(--mobB, #fff);
  border-top: 1px solid var(--mobL, #f1f1f0);
  box-shadow: 0 -2px 10px rgba(0,0,0,0.05);
  z-index: 990;
  align-items: center;
  justify-content: space-around;
}
@media (max-width: 768px) {
  .mobile-nav-dock {
    display: flex;
  }
  body {
    padding-bottom: 58px;
  }
  body.single {
    padding-bottom: 114px !important;
  }
}
.mobile-dock-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--mobC, #08102b);
  font-size: 0.7rem;
  font-weight: 500;
  gap: 2px;
  flex: 1;
  height: 100%;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
.mobile-dock-item * {
  pointer-events: none;
}
.mobile-dock-item svg,
.mobile-dock-item svg.line {
  width: 20px !important;
  height: 20px !important;
  fill: none !important;
  stroke: var(--mobC, #08102b) !important;
  stroke-width: 1.6 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  opacity: 0.85 !important;
  transition: stroke 0.2s ease, opacity 0.2s ease !important;
}
.mobile-dock-item:hover svg,
.mobile-dock-item.active svg,
.mobile-dock-item.active svg.line {
  stroke: var(--linkC, #1976d2) !important;
  opacity: 1 !important;
}
.mobile-dock-item.active {
  color: var(--linkC, #1976d2);
}

/* Back to Top Floating Button */
.back-to-top {
  position: fixed;
  bottom: 122px; /* On homepage & archive: sits cleanly above WhatsApp (which is at 68px) */
  right: 18px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, #2563eb, #1d4ed8) !important;
  color: #ffffff !important;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(37, 99, 235, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 935;
}
.back-to-top.visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.back-to-top:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(37, 99, 235, 0.5);
  background: linear-gradient(135deg, #1d4ed8, #1e40af) !important;
}
.back-to-top i {
  font-size: 16px;
  line-height: 1;
  color: #ffffff !important;
}
@media (min-width: 769px) {
  .back-to-top {
    bottom: 84px; /* On desktop: stacked cleanly above WhatsApp at 24px */
    right: 29px;
  }
}
/* On single post, the post settings bar sits at bottom: 54px and WhatsApp is at 112px.
   So Back-to-Top sits at bottom: 168px on single posts! */
body.single .back-to-top {
  bottom: 168px !important;
}

/* ==========================================================================
   StudyBoi Island & Bento Footer (Ultra-Modern, Colorful & Unique)
   ========================================================================== */
.main-footer.studyboi-footer {
  background: radial-gradient(circle at 50% 0%, rgba(30, 58, 138, 0.35) 0%, rgba(11, 19, 41, 1) 65%), #0b1329 !important;
  color: #cbd5e1 !important;
  margin-top: 48px !important;
  position: relative !important;
  overflow: visible !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Multi-color Radiant Top Accent Line */
.footer-top-accent {
  height: 4px;
  width: 100%;
  background: linear-gradient(90deg, #2563eb 0%, #7c3aed 25%, #06b6d4 50%, #10b981 75%, #f43f5e 100%);
  box-shadow: 0 0 20px rgba(99, 102, 241, 0.5);
  position: relative;
  z-index: 5;
}

/* 1. Floating Interactive Student Community & Solution Request Island */
.footer-cta-island-wrap {
  max-width: var(--contentW, 1280px);
  margin: -30px auto 26px;
  padding: 0 16px;
  position: relative;
  z-index: 20;
  box-sizing: border-box;
}

.footer-cta-island {
  background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
  border: 1px solid rgba(99, 102, 241, 0.35);
  border-radius: 16px;
  padding: 20px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  box-shadow: 0 14px 40px -6px rgba(0, 0, 0, 0.45), 0 0 24px rgba(99, 102, 241, 0.15);
  position: relative;
  overflow: hidden;
}

.cta-island-glow {
  position: absolute;
  right: -50px;
  top: -50px;
  width: 240px;
  height: 240px;
  background: radial-gradient(circle, rgba(99, 102, 241, 0.28) 0%, transparent 70%);
  pointer-events: none;
  border-radius: 50%;
}

.cta-island-content {
  position: relative;
  z-index: 2;
  flex: 1;
}

.cta-island-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 3px 12px;
  background: rgba(56, 189, 248, 0.12);
  color: #38bdf8;
  border-radius: 20px;
  font-size: 0.76rem;
  font-weight: 700;
  margin-bottom: 6px;
  border: 1px solid rgba(56, 189, 248, 0.3);
}

.cta-badge-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #38bdf8;
  box-shadow: 0 0 8px #38bdf8;
  animation: sb-pulse 2s infinite;
}

@keyframes sb-pulse {
  0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(56, 189, 248, 0.7); }
  70% { transform: scale(1.1); box-shadow: 0 0 0 6px rgba(56, 189, 248, 0); }
  100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(56, 189, 248, 0); }
}

.cta-island-title {
  font-family: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  margin: 0 0 4px !important;
  line-height: 1.35 !important;
}

.cta-island-desc {
  font-size: 0.85rem !important;
  color: #94a3b8 !important;
  margin: 0 !important;
  line-height: 1.45 !important;
}

.cta-island-actions {
  display: flex;
  gap: 12px;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: 12px;
  font-size: 0.86rem;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.cta-btn-tg {
  background: linear-gradient(135deg, #0284c7 0%, #0ea5e9 100%);
  color: #ffffff !important;
  border: 1px solid rgba(14, 165, 233, 0.4);
}
.cta-btn-tg:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(14, 165, 233, 0.45);
  filter: brightness(1.08);
}

.cta-btn-wa {
  background: linear-gradient(135deg, #059669 0%, #10b981 100%);
  color: #ffffff !important;
  border: 1px solid rgba(16, 185, 129, 0.4);
}
.cta-btn-wa:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(16, 185, 129, 0.45);
  filter: brightness(1.08);
}

/* 2. Main Bento Footer Grid */
.footer-main-wrap {
  padding: 10px 0 36px;
  position: relative;
  z-index: 2;
}

.studyboi-footer-grid {
  display: grid;
  grid-template-columns: 1.25fr 1.35fr 1fr 1fr;
  gap: 22px;
  align-items: stretch;
}

.sb-footer-card {
  background: rgba(15, 23, 42, 0.65);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 22px 20px;
  transition: border-color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
  display: flex;
  flex-direction: column;
}

.sb-footer-card:hover {
  border-color: rgba(99, 102, 241, 0.35);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px -4px rgba(0, 0, 0, 0.3);
}

/* Card Titles */
.footer-col-title {
  font-size: 1.02rem !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  margin: 0 0 16px 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding-bottom: 8px !important;
  position: relative !important;
}

.footer-col-title::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 28px !important;
  height: 2.5px !important;
  border-radius: 2px !important;
  background: linear-gradient(90deg, #38bdf8, #818cf8) !important;
}

.f-title-icon {
  font-size: 1.1rem;
}

/* Bento Card 1: Brand & Academic Mission */
.footer-site-title.sb-gradient-title {
  font-family: 'Fraunces', serif !important;
  font-size: 1.55rem !important;
  font-weight: 800 !important;
  background: linear-gradient(135deg, #60a5fa 0%, #a78bfa 50%, #f472b6 100%);
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-decoration: none !important;
  display: inline-block !important;
  letter-spacing: -0.5px !important;
}

.sb-mission-badge {
  background: rgba(99, 102, 241, 0.15);
  border: 1px solid rgba(99, 102, 241, 0.3);
  color: #c7d2fe;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 0.72rem;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 10px 0 12px;
  align-self: flex-start;
}

.sb-badge-star {
  color: #fbbf24;
}

.footer-about-text {
  color: #94a3b8 !important;
  font-size: 0.84rem !important;
  line-height: 1.58 !important;
  margin: 0 0 16px 0 !important;
}

/* Live Stats */
.sb-live-stats {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
}

.sb-stat-pill {
  flex: 1;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 6px 10px;
  display: flex;
  flex-direction: column;
}

.sb-stat-pill strong {
  font-family: 'Fraunces', serif;
  color: #38bdf8;
  font-size: 1.02rem;
  font-weight: 700;
  line-height: 1.2;
}

.sb-stat-pill span {
  color: #94a3b8;
  font-size: 0.7rem;
  margin-top: 2px;
}

/* Social Buttons */
.footer-social-hub {
  display: flex;
  gap: 8px;
  margin-top: auto;
}

.footer-social-hub .social-btn {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #cbd5e1;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  text-decoration: none;
}

.footer-social-hub .social-fb:hover {
  background: #1877f2;
  color: #ffffff;
  border-color: #1877f2;
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(24, 119, 242, 0.4);
}
.footer-social-hub .social-yt:hover {
  background: #ff0000;
  color: #ffffff;
  border-color: #ff0000;
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(255, 0, 0, 0.4);
}
.footer-social-hub .social-tg:hover {
  background: #0088cc;
  color: #ffffff;
  border-color: #0088cc;
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(0, 136, 204, 0.4);
}
.footer-social-hub .social-wa:hover {
  background: #25d366;
  color: #ffffff;
  border-color: #25d366;
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4);
}

/* Bento Card 2: Interactive Question Bank Tag Cloud */
.sb-footer-pills-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.sb-f-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  border-radius: 20px;
  font-size: 0.77rem;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  backdrop-filter: blur(4px);
}

.chip-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
}

.sb-f-chip.chip-blue {
  background: rgba(37, 99, 235, 0.15);
  color: #93c5fd;
  border: 1px solid rgba(59, 130, 246, 0.35);
}
.sb-f-chip.chip-blue:hover {
  background: #2563eb;
  color: #ffffff;
  border-color: #2563eb;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.4);
}

.sb-f-chip.chip-purple {
  background: rgba(147, 51, 234, 0.15);
  color: #d8b4fe;
  border: 1px solid rgba(168, 85, 247, 0.35);
}
.sb-f-chip.chip-purple:hover {
  background: #9333ea;
  color: #ffffff;
  border-color: #9333ea;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(147, 51, 234, 0.4);
}

.sb-f-chip.chip-emerald {
  background: rgba(16, 185, 129, 0.15);
  color: #6ee7b7;
  border: 1px solid rgba(16, 185, 129, 0.35);
}
.sb-f-chip.chip-emerald:hover {
  background: #059669;
  color: #ffffff;
  border-color: #059669;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4);
}

.sb-f-chip.chip-amber {
  background: rgba(245, 158, 11, 0.15);
  color: #fde047;
  border: 1px solid rgba(245, 158, 11, 0.35);
}
.sb-f-chip.chip-amber:hover {
  background: #d97706;
  color: #ffffff;
  border-color: #d97706;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.4);
}

.sb-f-chip.chip-rose {
  background: rgba(244, 63, 94, 0.15);
  color: #fda4af;
  border: 1px solid rgba(244, 63, 94, 0.35);
}
.sb-f-chip.chip-rose:hover {
  background: #e11d48;
  color: #ffffff;
  border-color: #e11d48;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(244, 63, 94, 0.4);
}

.sb-f-chip.chip-pink {
  background: rgba(236, 72, 153, 0.15);
  color: #f9a8d4;
  border: 1px solid rgba(236, 72, 153, 0.35);
}
.sb-f-chip.chip-pink:hover {
  background: #db2777;
  color: #ffffff;
  border-color: #db2777;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(236, 72, 153, 0.4);
}

.sb-f-chip.chip-cyan {
  background: rgba(6, 182, 212, 0.15);
  color: #67e8f9;
  border: 1px solid rgba(6, 182, 212, 0.35);
}
.sb-f-chip.chip-cyan:hover {
  background: #0891b2;
  color: #ffffff;
  border-color: #0891b2;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(6, 182, 212, 0.4);
}

.sb-f-chip.chip-indigo {
  background: rgba(99, 102, 241, 0.15);
  color: #a5b4fc;
  border: 1px solid rgba(99, 102, 241, 0.35);
}
.sb-f-chip.chip-indigo:hover {
  background: #4f46e5;
  color: #ffffff;
  border-color: #4f46e5;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(99, 102, 241, 0.4);
}

.sb-f-chip.chip-red {
  background: rgba(239, 68, 68, 0.15);
  color: #fca5a5;
  border: 1px solid rgba(239, 68, 68, 0.35);
}
.sb-f-chip.chip-red:hover {
  background: #dc2626;
  color: #ffffff;
  border-color: #dc2626;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(239, 68, 68, 0.4);
}

.sb-f-chip.chip-violet {
  background: rgba(139, 92, 246, 0.15);
  color: #c4b5fd;
  border: 1px solid rgba(139, 92, 246, 0.35);
}
.sb-f-chip.chip-violet:hover {
  background: #7c3aed;
  color: #ffffff;
  border-color: #7c3aed;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(139, 92, 246, 0.4);
}

/* Bento Card 3: Academic Guides & Study Shortcuts */
.sb-academic-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.sb-academic-list li {
  margin: 0 !important;
  padding: 0 !important;
}

.sb-academic-list li a {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: #cbd5e1 !important;
  text-decoration: none !important;
  font-size: 0.83rem !important;
  font-weight: 500 !important;
  padding: 7px 10px !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid transparent !important;
  transition: all 0.18s ease !important;
}

.sb-academic-list li a:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  transform: translateX(4px) !important;
}

.f-bullet {
  font-size: 0.9rem;
  flex-shrink: 0;
}

/* Bento Card 4: Trust & AdSense Legal Policies */
.sb-trust-card {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.12) 0%, rgba(6, 182, 212, 0.08) 100%);
  border: 1px solid rgba(16, 185, 129, 0.25);
  border-radius: 12px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}

.trust-shield-icon {
  font-size: 1.4rem;
  flex-shrink: 0;
}

.trust-shield-text strong {
  display: block;
  color: #6ee7b7;
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1.25;
}

.trust-shield-text span {
  display: block;
  color: #94a3b8;
  font-size: 0.69rem;
  line-height: 1.35;
  margin-top: 2px;
}

.sb-policy-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}

.sb-policy-list li {
  margin: 0 !important;
  padding: 0 !important;
}

.sb-policy-list li a {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #94a3b8 !important;
  text-decoration: none !important;
  font-size: 0.79rem !important;
  font-weight: 500 !important;
  padding: 3px 0 !important;
  transition: color 0.15s ease, transform 0.15s ease !important;
}

.sb-policy-list li a:hover {
  color: #38bdf8 !important;
  transform: translateX(3px) !important;
}

.sb-policy-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #64748b;
  flex-shrink: 0;
  transition: background 0.15s ease;
}

.sb-policy-list li a:hover .sb-policy-dot {
  background: #38bdf8;
}

/* Footer Bottom Bar & Interactive Back-to-Top Button */
.sb-footer-bottom {
  background: #070d1e !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
  padding: 16px 0 !important;
  position: relative;
  z-index: 5;
}

.sb-footer-bottom .footer-bottom-inner {
  max-width: var(--contentW, 1280px);
  margin: 0 auto;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  box-sizing: border-box;
}

.footer-copyright {
  color: #94a3b8 !important;
  font-size: 0.82rem !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}

.footer-copyright strong {
  color: #f1f5f9 !important;
}

.sb-footer-top-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #cbd5e1;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  outline: none;
}

.sb-footer-top-btn:hover {
  background: #2563eb;
  color: #ffffff;
  border-color: #2563eb;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.4);
}

/* Responsive Footer Breakpoints */
@media (max-width: 1024px) {
  .studyboi-footer-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }
  .footer-cta-island {
    flex-direction: column;
    text-align: center;
    gap: 16px;
  }
  .cta-island-badge {
    margin: 0 auto 6px;
  }
  .cta-island-actions {
    justify-content: center;
    width: 100%;
  }
  .cta-btn {
    flex: 1;
    min-width: 160px;
    justify-content: center;
  }
}

@media (max-width: 640px) {
  .footer-cta-island-wrap {
    margin-top: -24px;
    padding: 0 12px;
  }
  .footer-cta-island {
    padding: 16px;
    border-radius: 14px;
  }
  .cta-island-title {
    font-size: 1.05rem !important;
  }
  .studyboi-footer-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .sb-footer-card {
    padding: 18px 16px !important;
  }
  .sb-footer-bottom .footer-bottom-inner {
    flex-direction: column !important;
    text-align: center !important;
    gap: 10px !important;
  }
  .footer-copyright {
    text-align: center !important;
  }
}

/* ==========================================================================
   Education Finder Hero Section (Homepage Only - Compact Edition)
   ========================================================================== */
.edu-finder-section {
  max-width: var(--contentW, 1280px);
  margin: 10px auto 6px;
  padding: 0 14px;
}
.edu-finder-container {
  background: var(--contentB, #ffffff);
  border: 1px solid var(--contentL, #e8ecef);
  border-radius: 12px;
  padding: 16px 14px 14px;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.02);
  text-align: center;
}
/* Top Badge */
.edu-top-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  background: #e8f5e9;
  color: #1b5e20;
  border-radius: 14px;
  font-size: 0.76rem;
  font-weight: 600;
  margin-bottom: 8px;
}
.dark-mode .edu-top-badge,
.drK .edu-top-badge,
[data-theme="dark"] .edu-top-badge {
  background: rgba(46, 125, 50, 0.25);
  color: #81c784;
}
.edu-badge-dot {
  width: 6px;
  height: 6px;
  background: #2e7d32;
  border-radius: 50%;
  display: inline-block;
}
/* Main Title */
.edu-main-title {
  font-size: 1.45rem;
  font-weight: 800;
  line-height: 1.3;
  color: var(--headC, #08102b);
  margin: 0 0 4px;
  letter-spacing: -0.3px;
}
.edu-title-highlight {
  color: #1b5e20;
  position: relative;
}
.dark-mode .edu-title-highlight,
.drK .edu-title-highlight,
[data-theme="dark"] .edu-title-highlight {
  color: #4caf50;
}
.edu-subtitle {
  font-size: 0.86rem;
  color: #334155;
  font-weight: 500;
  max-width: 520px;
  margin: 0 auto 10px;
  line-height: 1.45;
}
/* Search Form */
.edu-search-form {
  display: flex !important;
  align-items: center !important;
  max-width: 480px !important;
  margin: 0 auto 10px !important;
  background: #ffffff !important;
  border: 1.5px solid #d1d5db !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  padding: 3px 3px 3px 18px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}
.edu-search-form:focus-within {
  border-color: #1b5e20 !important;
  box-shadow: 0 3px 12px rgba(27, 94, 32, 0.15) !important;
}
.dark-mode .edu-search-form,
.drK .edu-search-form,
[data-theme="dark"] .edu-search-form {
  background: #1e293b !important;
  border-color: #475569 !important;
}
.edu-search-leading-icon {
  display: none !important;
}
.edu-search-input {
  flex: 1 !important;
  border: none !important;
  background: transparent !important;
  padding: 10px 8px 10px 0 !important;
  font-size: 0.95rem !important;
  color: var(--bodyC, #08102b) !important;
  outline: none !important;
  min-width: 0 !important;
}
.edu-search-btn {
  background: #1b5e20 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 22px !important;
  padding: 8px 18px !important;
  margin: 2px !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  transition: background 0.15s ease !important;
}
.edu-search-btn:hover {
  background: #144618 !important;
}
.edu-search-btn svg {
  width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: #ffffff !important;
  stroke-width: 2.3 !important;
  display: block !important;
  flex-shrink: 0 !important;
}
.edu-search-btn svg circle,
.edu-search-btn svg line {
  fill: none !important;
  stroke: #ffffff !important;
  stroke-width: 2.3 !important;
}
/* Quick Tags */
.edu-quick-tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-bottom: 12px;
}
.edu-quick-tag {
  display: inline-block;
  padding: 3px 10px;
  background: #f1f5f9;
  color: #334155;
  border-radius: 12px;
  font-size: 0.74rem;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.15s ease;
}
.edu-quick-tag:hover {
  background: #1b5e20;
  color: #ffffff;
}
.dark-mode .edu-quick-tag,
.drK .edu-quick-tag,
[data-theme="dark"] .edu-quick-tag {
  background: #1e293b;
  color: #94a3b8;
}
.dark-mode .edu-quick-tag:hover,
.drK .edu-quick-tag:hover,
[data-theme="dark"] .edu-quick-tag:hover {
  background: #2e7d32;
  color: #ffffff;
}
/* Category Block & Dividers */
.edu-category-block {
  margin-top: 10px;
}
.edu-block-divider {
  position: relative;
  text-align: center;
  margin-bottom: 8px;
}
.edu-block-divider::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  height: 1px;
  background: #e2e8f0;
  z-index: 1;
}
.dark-mode .edu-block-divider::before,
.drK .edu-block-divider::before,
[data-theme="dark"] .edu-block-divider::before {
  background: #334155;
}
.edu-block-divider span {
  position: relative;
  z-index: 2;
  display: inline-block;
  background: var(--contentB, #ffffff);
  padding: 2px 14px;
  color: #1b5e20;
  font-weight: 700;
  font-size: 0.8rem;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
}
.dark-mode .edu-block-divider span,
.drK .edu-block-divider span,
[data-theme="dark"] .edu-block-divider span {
  background: #0f172a;
  border-color: #334155;
  color: #81c784;
}
/* Cards Grid: 6 columns on desktop, 3 columns on mobile (User Requested) */
.edu-cards-grid {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr) !important;
  gap: 8px !important;
}
@media (max-width: 991px) {
  .edu-cards-grid {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 6px !important;
  }
}
@media (max-width: 640px) {
  .edu-cards-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 5px !important;
  }
  .edu-card {
    padding: 6px 2px !important;
  }
  .edu-card-icon svg {
    width: 28px !important;
    height: 28px !important;
  }
  .edu-card-title {
    font-size: 0.78rem !important;
  }
  .edu-card-sub {
    font-size: 0.68rem !important;
  }
  .edu-main-title {
    font-size: 1.25rem !important;
  }
}
.edu-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--contentB, #ffffff);
  border: 1px solid var(--contentL, #e8ecef);
  border-radius: 10px;
  padding: 8px 4px;
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.edu-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.04);
  border-color: #1b5e20;
}
.dark-mode .edu-card,
.drK .edu-card,
[data-theme="dark"] .edu-card {
  background: #1e293b;
  border-color: #334155;
}
.dark-mode .edu-card:hover,
.drK .edu-card:hover,
[data-theme="dark"] .edu-card:hover {
  border-color: #81c784;
}
.edu-card-icon {
  width: auto !important;
  height: auto !important;
  background: transparent !important;
  border-radius: 0 !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 6px;
  transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.edu-card-icon svg {
  width: 36px;
  height: 36px;
  display: block;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.08));
  transition: transform 0.2s ease, filter 0.2s ease;
}
.edu-card:hover .edu-card-icon svg {
  transform: scale(1.15) translateY(-2px);
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.15));
}
.edu-card-title {
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--headC, #08102b);
  line-height: 1.2;
}
.edu-card-sub {
  font-size: 0.70rem;
  color: #334155;
  font-weight: 600;
  margin-top: 1px;
}

/* ==========================================================================
   Sidebar Widgets (Matching User Screenshots)
   ========================================================================== */
.sidebar-area {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.sidebar-widget {
  background: var(--contentB, #ffffff);
  border: 1px solid var(--contentL, #e8ecef);
  border-radius: 14px;
  padding: 16px;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.03);
}
.dark-mode .sidebar-widget,
.drK .sidebar-widget,
[data-theme="dark"] .sidebar-widget {
  background: #1e293b;
  border-color: #334155;
}

/* 1. Sidebar Search Box */
.sidebar-search-box {
  padding: 10px;
}
.sb-search-form {
  display: flex;
  align-items: center;
  background: var(--srchB, #f8fafc);
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 3px;
  overflow: hidden;
  transition: border-color 0.2s ease;
}
.sb-search-form:focus-within {
  border-color: #1b5e20;
}
.dark-mode .sb-search-form,
.drK .sb-search-form,
[data-theme="dark"] .sb-search-form {
  background: #0f172a;
  border-color: #334155;
}
.sb-search-input {
  flex: 1;
  border: none;
  background: transparent;
  padding: 8px 12px;
  font-size: 0.88rem;
  color: var(--bodyC, #08102b);
  outline: none;
}
.sb-search-btn {
  background: #1b5e20;
  color: #ffffff;
  border: none;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.15s ease;
}
.sb-search-btn:hover {
  background: #144618;
}

/* 2. Sidebar Widget Titles */
.sb-widget-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--headC, #08102b);
  margin: 0 0 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--contentL, #e8ecef);
}
.sb-title-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #1b5e20;
}
.dark-mode .sb-title-icon,
.drK .sb-title-icon,
[data-theme="dark"] .sb-title-icon {
  color: #4ade80 !important;
}

/* 3. Community Box (2x2 Social Grid with 100% SVG Icons) */
.sb-social-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
.sb-soc-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 8px;
  border-radius: 8px;
  color: #ffffff !important;
  font-size: 0.84rem;
  font-weight: 600;
  text-decoration: none;
  transition: opacity 0.2s ease, transform 0.15s ease;
}
.sb-soc-btn:hover {
  opacity: 0.92;
  transform: translateY(-1px);
}
.sb-soc-btn .sb-soc-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}
.sb-soc-btn .sb-soc-icon svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
  color: #ffffff !important;
}
.sb-soc-telegram {
  background: #2aabee;
}
.sb-soc-whatsapp {
  background: #25d366;
}
.sb-soc-facebook {
  background: #1877f2;
}
.sb-soc-youtube {
  background: #ff0000;
}

/* 4. Categories 2-Column Grid with Pill Badges & Dashed Borders */
.sb-categories-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 16px;
  row-gap: 10px;
}
.sb-category-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 6px;
  border-bottom: 1px dashed #e2e8f0;
  min-width: 0;
}
.dark-mode .sb-category-item,
.drK .sb-category-item,
[data-theme="dark"] .sb-category-item {
  border-bottom-color: #334155;
}
.sb-cat-link {
  display: flex;
  align-items: center;
  gap: 4px;
  text-decoration: none;
  color: var(--bodyC, #334155);
  font-size: 0.85rem;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 0.15s ease;
}
.sb-cat-link:hover {
  color: #1b5e20;
}
.dark-mode .sb-cat-link:hover,
.drK .sb-cat-link:hover,
[data-theme="dark"] .sb-cat-link:hover {
  color: #81c784;
}
.sb-cat-arrow {
  font-size: 0.75rem;
  color: var(--bodyCa, #94a3b8);
}
.sb-cat-count {
  background: #e8f5e9;
  color: #1b5e20;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 1px 7px;
  border-radius: 12px;
  min-width: 20px;
  text-align: center;
  flex-shrink: 0;
}
.dark-mode .sb-cat-count,
.drK .sb-cat-count,
[data-theme="dark"] .sb-cat-count {
  background: rgba(46, 125, 50, 0.25);
  color: #81c784;
}

/* 5. "TRAND POSTS" Section (Screenshot media_1789367775079.png) */
.sidebar-trend-posts-box {
  padding: 16px;
}
.sb-trend-header {
  font-size: 0.95rem;
  font-weight: 800;
  letter-spacing: 0.5px;
  color: var(--headC, #08102b);
  border-bottom: 1px solid var(--contentL, #e8ecef);
  padding-bottom: 12px;
  margin-bottom: 14px;
}
.sb-trend-dot {
  width: 12px;
  height: 12px;
  background: #00796b;
  border-radius: 50%;
  display: inline-block;
  box-shadow: 0 0 0 3px rgba(0, 121, 107, 0.2);
}
.sb-trend-posts-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.sb-trend-item {
  display: flex;
  align-items: center;
  gap: 12px;
}
.sb-trend-thumb-wrap {
  position: relative;
  width: 62px;
  height: 62px;
  flex-shrink: 0;
}
.sb-trend-thumb-link {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid #e0f2f1;
  background: #f1f5f9;
}
.dark-mode .sb-trend-thumb-link,
.drK .sb-trend-thumb-link,
[data-theme="dark"] .sb-trend-thumb-link {
  border-color: #334155;
  background: #1e293b;
}
.sb-trend-thumb-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.sb-trend-thumb-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
}
.sb-trend-rank {
  position: absolute;
  top: -3px;
  left: -3px;
  width: 22px;
  height: 22px;
  background: #00796b;
  color: #ffffff;
  border: 2px solid #ffffff;
  border-radius: 50%;
  font-size: 0.72rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}
.dark-mode .sb-trend-rank,
.drK .sb-trend-rank,
[data-theme="dark"] .sb-trend-rank {
  border-color: #1e293b;
}
.sb-trend-content {
  flex: 1;
  min-width: 0;
}
.sb-trend-badge {
  display: inline-block;
  background: #00796b;
  color: #ffffff;
  font-size: 0.65rem;
  font-weight: 800;
  padding: 2px 7px;
  border-radius: 4px;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  margin-bottom: 4px;
  line-height: 1.2;
}
.sb-trend-title {
  margin: 0 0 3px;
  font-size: 0.85rem;
  font-weight: 700;
  line-height: 1.35;
}
.sb-trend-title a {
  color: var(--headC, #08102b);
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color 0.15s ease;
}
.sb-trend-title a:hover {
  color: #00796b;
}
.dark-mode .sb-trend-title a:hover,
.drK .sb-trend-title a:hover,
[data-theme="dark"] .sb-trend-title a:hover {
  color: #4ade80;
}
.sb-trend-date {
  font-size: 0.74rem;
  color: #475569;
  font-weight: 500;
  display: block;
}

/* Suppress "Find Us" and "About This Site" completely */
.widget_text:has(*:contains("Find Us")),
.widget_text:has(*:contains("About This Site")),
.widget_block:has(*:contains("Find Us")),
.widget_block:has(*:contains("About This Site")),
.sidebar-area .widget:has(*:contains("Find Us")),
.sidebar-area .widget:has(*:contains("About This Site")) {
  display: none !important;
}

/* ==========================================================================
   Dark Mode Web Icons (Bright / White in Dark Mode)
   ========================================================================== */
html.drK,
body.drK,
[data-theme="dark"] {
  --iconC: #ffffff;
  --iconCa: #ffffff;
  --iconCs: #e2e8f0;
}
.drK svg:not([fill="none"]):not([fill^="#"]):not([fill^="rgb"]),
[data-theme="dark"] svg:not([fill="none"]):not([fill^="#"]):not([fill^="rgb"]) {
  color: #ffffff;
}
.drK .tNav svg,
.drK .tIc svg,
.drK .tDk svg,
.drK .tBkm svg,
.drK .search-icon svg,
.drK .sb-search-btn svg,
.drK .edu-search-btn svg,
.drK .back-to-top svg,
.drK .mobile-dock-item svg,
.drK .pM svg,
.drK .entry-meta svg,
.drK .sb-cat-arrow,
.drK .fa,
.drK .fas,
.drK .far,
.drK .fab,
[data-theme="dark"] .tNav svg,
[data-theme="dark"] .tIc svg,
[data-theme="dark"] .tDk svg,
[data-theme="dark"] .tBkm svg,
[data-theme="dark"] .search-icon svg,
[data-theme="dark"] .sb-search-btn svg,
[data-theme="dark"] .edu-search-btn svg,
[data-theme="dark"] .back-to-top svg,
[data-theme="dark"] .mobile-dock-item svg,
[data-theme="dark"] .pM svg,
[data-theme="dark"] .entry-meta svg,
[data-theme="dark"] .sb-cat-arrow,
[data-theme="dark"] .fa,
[data-theme="dark"] .fas,
[data-theme="dark"] .far,
[data-theme="dark"] .fab {
  color: #ffffff !important;
  stroke: #ffffff !important;
}
.drK svg[stroke="currentColor"],
[data-theme="dark"] svg[stroke="currentColor"] {
  stroke: #ffffff !important;
}
.drK .sb-title-icon svg,
[data-theme="dark"] .sb-title-icon svg {
  color: #4ade80 !important;
  stroke: #4ade80 !important;
}

/* ==========================================================================
   In-Article Social Community CTA Cards (Telegram, WhatsApp, Facebook)
   ========================================================================== */
.in-article-social-wrap {
  margin: 22px 0;
  width: 100%;
  clear: both;
}

.in-article-social-card {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 12px 22px !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  position: relative !important;
  overflow: hidden !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08) !important;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  color: #ffffff !important;
}

.in-article-social-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.14) !important;
  color: #ffffff !important;
}

/* Semi-circular light highlight on the right side behind the button */
.in-article-social-card::after {
  content: '';
  position: absolute;
  right: -20px;
  top: -30px;
  bottom: -30px;
  width: 240px;
  background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0) 70%);
  pointer-events: none;
  border-radius: 50%;
}

/* 1. Telegram Card Style */
.in-article-social-telegram {
  background: linear-gradient(98deg, #1d6fe9 0%, #2086f7 55%, #0099ff 100%) !important;
}
.in-article-social-telegram .in-art-soc-icon-wrap {
  color: #1d6fe9 !important;
}
.in-article-social-telegram .in-art-soc-btn {
  color: #1d6fe9 !important;
}
.in-article-social-telegram .in-art-soc-icon-wrap svg {
  fill: #1d6fe9 !important;
  color: #1d6fe9 !important;
}

/* 2. WhatsApp Card Style */
.in-article-social-whatsapp {
  background: linear-gradient(98deg, #059669 0%, #10b981 55%, #10c776 100%) !important;
}
.in-article-social-whatsapp .in-art-soc-icon-wrap {
  color: #059669 !important;
}
.in-article-social-whatsapp .in-art-soc-btn {
  color: #059669 !important;
}
.in-article-social-whatsapp .in-art-soc-icon-wrap svg {
  fill: #059669 !important;
  color: #059669 !important;
}

/* 3. Facebook Card Style */
.in-article-social-facebook {
  background: linear-gradient(98deg, #1856c8 0%, #1d6fe9 55%, #257bf4 100%) !important;
}
.in-article-social-facebook .in-art-soc-icon-wrap {
  color: #1856c8 !important;
}
.in-article-social-facebook .in-art-soc-btn {
  color: #1856c8 !important;
}
.in-article-social-facebook .in-art-soc-icon-wrap svg {
  fill: #1856c8 !important;
  color: #1856c8 !important;
}

/* Dark mode protection */
.drK .in-article-social-card,
[data-theme="dark"] .in-article-social-card {
  color: #ffffff !important;
}
.drK .in-article-social-card svg,
[data-theme="dark"] .in-article-social-card svg {
  stroke: none !important;
}
.drK .in-article-social-telegram .in-art-soc-icon-wrap svg,
[data-theme="dark"] .in-article-social-telegram .in-art-soc-icon-wrap svg {
  fill: #1d6fe9 !important;
  color: #1d6fe9 !important;
}
.drK .in-article-social-whatsapp .in-art-soc-icon-wrap svg,
[data-theme="dark"] .in-article-social-whatsapp .in-art-soc-icon-wrap svg {
  fill: #059669 !important;
  color: #059669 !important;
}
.drK .in-article-social-facebook .in-art-soc-icon-wrap svg,
[data-theme="dark"] .in-article-social-facebook .in-art-soc-icon-wrap svg {
  fill: #1856c8 !important;
  color: #1856c8 !important;
}
.drK .in-article-social-telegram .in-art-soc-btn,
[data-theme="dark"] .in-article-social-telegram .in-art-soc-btn {
  color: #1d6fe9 !important;
  background: #ffffff !important;
}
.drK .in-article-social-whatsapp .in-art-soc-btn,
[data-theme="dark"] .in-article-social-whatsapp .in-art-soc-btn {
  color: #059669 !important;
  background: #ffffff !important;
}
.drK .in-article-social-facebook .in-art-soc-btn,
[data-theme="dark"] .in-article-social-facebook .in-art-soc-btn {
  color: #1856c8 !important;
  background: #ffffff !important;
}

/* Left Section: Icon + Texts */
.in-art-soc-left {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  z-index: 1;
}

.in-art-soc-icon-wrap {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
}

.in-art-soc-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

.in-art-soc-title {
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  line-height: 1.25 !important;
  letter-spacing: -0.01em !important;
}

.in-art-soc-sub {
  font-size: 0.85rem !important;
  color: rgba(255, 255, 255, 0.92) !important;
  line-height: 1.3 !important;
  font-family: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif, var(--font-family) !important;
}

/* Right Section: Pill Button */
.in-art-soc-btn {
  z-index: 1;
  background: #ffffff !important;
  border-radius: 9999px !important;
  padding: 8px 24px !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.in-article-social-card:hover .in-art-soc-btn {
  transform: scale(1.03) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18) !important;
}

/* Mobile Responsiveness */
@media (max-width: 640px) {
  .in-article-social-wrap {
    margin: 16px 0;
  }
  .in-article-social-card {
    padding: 10px 14px !important;
    gap: 10px !important;
  }
  .in-art-soc-left {
    gap: 10px !important;
  }
  .in-art-soc-icon-wrap {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
  }
  .in-art-soc-icon-wrap svg {
    width: 18px !important;
    height: 18px !important;
  }
  .in-art-soc-title {
    font-size: 0.88rem !important;
  }
  .in-art-soc-sub {
    font-size: 0.76rem !important;
  }
  .in-art-soc-btn {
    padding: 6px 14px !important;
    font-size: 0.8rem !important;
  }
}

/* ==========================================================================
   Header Announcement / Notification Bar
   ========================================================================== */
.abswer-ui-announcement-bar,
.plus-ui-announcement-bar {
  background: linear-gradient(90deg, #1e3a8a 0%, #2563eb 50%, #1d4ed8 100%) !important;
  color: #ffffff !important;
  font-family: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif, var(--font-family, sans-serif) !important;
  font-size: 0.86rem !important;
  padding: 8px 16px !important;
  position: relative !important;
  z-index: 90 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
}

.ann-container {
  max-width: 1200px !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

.ann-content {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex: 1 !important;
  min-width: 0 !important;
}

.ann-badge {
  background: rgba(255, 255, 255, 0.22) !important;
  color: #ffffff !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  padding: 2px 8px !important;
  border-radius: 20px !important;
  white-space: nowrap !important;
  letter-spacing: 0.3px !important;
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
}

.ann-text {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font-weight: 500 !important;
}

.ann-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-shrink: 0 !important;
}

.ann-btn {
  background: #ffffff !important;
  color: #1e3a8a !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  padding: 4px 12px !important;
  border-radius: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  text-decoration: none !important;
  transition: transform 0.15s ease, background 0.15s ease !important;
}

.ann-btn:hover {
  transform: translateY(-1px) !important;
  background: #f8fafc !important;
}

.ann-close-btn {
  background: transparent !important;
  border: none !important;
  color: #ffffff !important;
  opacity: 0.8 !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 4px !important;
  border-radius: 50% !important;
  transition: opacity 0.15s ease, background 0.15s ease !important;
}

.ann-close-btn:hover {
  opacity: 1 !important;
  background: rgba(255, 255, 255, 0.18) !important;
}

@media (max-width: 768px) {
  .abswer-ui-announcement-bar,
  .plus-ui-announcement-bar {
    padding: 5px 10px !important;
    font-size: 0.78rem !important;
    line-height: 1.35 !important;
  }
  .ann-container {
    gap: 8px !important;
  }
  .ann-badge {
    display: none !important;
  }
  .ann-text {
    font-size: 0.76rem !important;
  }
  .ann-actions {
    gap: 6px !important;
  }
  .ann-btn {
    padding: 2px 8px !important;
    font-size: 0.72rem !important;
    white-space: nowrap !important;
  }
  .ann-close-btn {
    padding: 2px !important;
  }
}

/* ==========================================================================
   Exam Countdown Timer Live Banner
   ========================================================================== */
.abswer-ui-countdown-banner,
.plus-ui-countdown-banner {
  background: var(--contentB, #ffffff) !important;
  border: 1px solid var(--contentL, #e2e8f0) !important;
  border-radius: 14px !important;
  padding: 16px 20px !important;
  margin: 16px 0 24px !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.04) !important;
  font-family: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif, var(--font-family, sans-serif) !important;
  border-left: 4px solid #2563eb !important;
}

.countdown-container {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}

.countdown-info {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.countdown-icon {
  width: 44px !important;
  height: 44px !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.12), rgba(59, 130, 246, 0.2)) !important;
  color: #2563eb !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

.countdown-text-wrap {
  display: flex !important;
  flex-direction: column !important;
}

.countdown-title {
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: var(--headC, #08102b) !important;
  line-height: 1.3 !important;
}

.countdown-subtitle {
  font-size: 0.8rem !important;
  color: var(--bodyCa, #64748b) !important;
}

.countdown-cards {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.cd-card {
  background: var(--contentBs, #f8fafc) !important;
  border: 1px solid var(--contentL, #e2e8f0) !important;
  border-radius: 10px !important;
  padding: 6px 10px !important;
  min-width: 52px !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.cd-val {
  font-size: 1.25rem !important;
  font-weight: 800 !important;
  color: var(--linkC, #2563eb) !important;
  line-height: 1.1 !important;
}

.cd-lbl {
  font-size: 0.68rem !important;
  color: var(--bodyCa, #64748b) !important;
  font-weight: 600 !important;
  margin-top: 2px !important;
}

.cd-sep {
  font-size: 1.1rem !important;
  font-weight: 800 !important;
  color: var(--bodyCa, #94a3b8) !important;
}

.countdown-action .countdown-btn {
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
  color: #ffffff !important;
  font-size: 0.86rem !important;
  font-weight: 700 !important;
  padding: 8px 16px !important;
  border-radius: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  text-decoration: none !important;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.28) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

.countdown-action .countdown-btn:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 16px rgba(37, 99, 235, 0.38) !important;
}

/* Dark mode for countdown */
.drK .abswer-ui-countdown-banner,
.drK .plus-ui-countdown-banner,
[data-theme="dark"] .abswer-ui-countdown-banner,
[data-theme="dark"] .plus-ui-countdown-banner {
  background: #18202f !important;
  border-color: #2b384e !important;
}

.drK .cd-card,
[data-theme="dark"] .cd-card {
  background: #202b3e !important;
  border-color: #2e3e57 !important;
}

.drK .cd-val,
[data-theme="dark"] .cd-val {
  color: #60a5fa !important;
}

@media (max-width: 768px) {
  .countdown-container {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }
  .countdown-cards {
    justify-content: center !important;
  }
  .countdown-action {
    text-align: center !important;
  }
  .countdown-action .countdown-btn {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* ==========================================================================
   AJAX Live Instant Search Dropdown
   ========================================================================== */
.headSearch {
  position: relative !important;
}

.ajax-search-results {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 99999 !important;
  background: var(--contentB, #ffffff) !important;
  border: 1px solid var(--contentL, #e2e8f0) !important;
  border-radius: 14px !important;
  box-shadow: 0 14px 35px rgba(0, 0, 0, 0.14), 0 0 0 1px rgba(0, 0, 0, 0.03) !important;
  max-height: 420px !important;
  overflow-y: auto !important;
  padding: 8px 0 !important;
  font-family: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif, var(--font-family, sans-serif) !important;
  animation: ajaxFadeDown 0.18s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

@keyframes ajaxFadeDown {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ajax-search-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.ajax-search-item {
  border-bottom: 1px solid var(--contentL, #f1f5f9) !important;
  transition: background 0.12s ease !important;
}

.ajax-search-item:last-child {
  border-bottom: none !important;
}

.ajax-search-item:hover,
.ajax-search-item.active {
  background: var(--contentBs, #f1f5f9) !important;
}

.ajax-search-link {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 14px !important;
  text-decoration: none !important;
  color: inherit !important;
}

.ajax-search-thumb {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  border-radius: 8px !important;
  object-fit: cover !important;
}

.ajax-search-icon-doc {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  border-radius: 8px !important;
  background: var(--contentBs, #e2e8f0) !important;
  color: var(--linkC, #2563eb) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.ajax-search-meta {
  flex: 1 !important;
  min-width: 0 !important;
}

.ajax-search-title {
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  color: var(--headC, #08102b) !important;
  display: block !important;
  line-height: 1.35 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.ajax-search-sub {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 0.74rem !important;
  color: var(--bodyCa, #64748b) !important;
  margin-top: 3px !important;
}

.ajax-search-cat {
  background: rgba(37, 99, 235, 0.1) !important;
  color: var(--linkC, #2563eb) !important;
  padding: 1px 6px !important;
  border-radius: 4px !important;
  font-weight: 600 !important;
}

.ajax-search-loading,
.ajax-search-empty {
  padding: 18px !important;
  text-align: center !important;
  color: var(--bodyCa, #64748b) !important;
  font-size: 0.88rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}

.ajax-spinner {
  width: 16px !important;
  height: 16px !important;
  border: 2px solid var(--contentL, #cbd5e1) !important;
  border-top-color: var(--linkC, #2563eb) !important;
  border-radius: 50% !important;
  animation: ajaxSpin 0.6s linear infinite !important;
}

@keyframes ajaxSpin {
  to { transform: rotate(360deg); }
}

.ajax-search-footer {
  padding: 8px 14px !important;
  background: var(--contentBs, #f8fafc) !important;
  text-align: center !important;
  border-top: 1px solid var(--contentL, #e2e8f0) !important;
  border-radius: 0 0 14px 14px !important;
}

.ajax-search-footer a {
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  color: var(--linkC, #2563eb) !important;
  text-decoration: none !important;
}

/* Dark mode for AJAX live search */
.drK .ajax-search-results,
[data-theme="dark"] .ajax-search-results {
  background: #18202f !important;
  border-color: #2b384e !important;
}

.drK .ajax-search-item:hover,
.drK .ajax-search-item.active,
[data-theme="dark"] .ajax-search-item:hover,
[data-theme="dark"] .ajax-search-item.active {
  background: #202b3e !important;
}

.drK .ajax-search-item,
[data-theme="dark"] .ajax-search-item {
  border-color: #263347 !important;
}

.drK .ajax-search-footer,
[data-theme="dark"] .ajax-search-footer {
  background: #131a26 !important;
  border-color: #263347 !important;
}

/* ==========================================================================
   Toast Notification & Single Post Enhancements
   ========================================================================== */
.abswer-ui-toast,
.plus-ui-toast {
  position: fixed !important;
  bottom: 30px !important;
  left: 50% !important;
  transform: translateX(-50%) translateY(20px) !important;
  background: #0f172a !important;
  color: #ffffff !important;
  font-family: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif, var(--font-family, sans-serif) !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  padding: 10px 22px !important;
  border-radius: 30px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important;
  z-index: 9999999 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.abswer-ui-toast.show,
.plus-ui-toast.show {
  opacity: 1 !important;
  transform: translateX(-50%) translateY(0) !important;
}

/* Last Updated Badge */
.meta-updated-badge {
  background: rgba(16, 185, 129, 0.12) !important;
  color: #059669 !important;
  border: 1px solid rgba(16, 185, 129, 0.3) !important;
  padding: 2px 9px !important;
  border-radius: 12px !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  line-height: 1.4 !important;
}

.meta-updated-badge svg,
.meta-updated-badge .updated-badge-icon {
  width: 14px !important;
  height: 14px !important;
  fill: none !important;
  stroke: #059669 !important;
  stroke-width: 2.2 !important;
  color: #059669 !important;
  display: inline-block !important;
  vertical-align: middle !important;
  flex-shrink: 0 !important;
}

.meta-updated-badge svg path,
.meta-updated-badge .updated-badge-icon path {
  fill: none !important;
  stroke: #059669 !important;
  stroke-width: 2.2 !important;
}

.drK .meta-updated-badge,
[data-theme="dark"] .meta-updated-badge {
  background: rgba(16, 185, 129, 0.22) !important;
  color: #34d399 !important;
  border-color: rgba(16, 185, 129, 0.45) !important;
}

.drK .meta-updated-badge svg,
[data-theme="dark"] .meta-updated-badge svg,
.drK .meta-updated-badge .updated-badge-icon,
[data-theme="dark"] .meta-updated-badge .updated-badge-icon {
  stroke: #34d399 !important;
  color: #34d399 !important;
  fill: none !important;
}

.drK .meta-updated-badge svg path,
[data-theme="dark"] .meta-updated-badge svg path,
.drK .meta-updated-badge .updated-badge-icon path,
[data-theme="dark"] .meta-updated-badge .updated-badge-icon path {
  stroke: #34d399 !important;
  fill: none !important;
}

/* Single Post Header Print Button */
.btn-print-post {
  background: var(--contentBs, #f1f5f9) !important;
  border: 1px solid var(--contentL, #e2e8f0) !important;
  color: var(--bodyC, #334155) !important;
  border-radius: 8px !important;
  padding: 3px 9px !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-family: inherit !important;
  transition: all 0.15s ease !important;
}

.btn-print-post:hover {
  background: var(--linkC, #2563eb) !important;
  color: #ffffff !important;
  border-color: var(--linkC, #2563eb) !important;
}

.btn-print-post i.fa {
  font-size: 13px !important;
  color: inherit !important;
  display: inline-block !important;
}

.drK .btn-print-post,
[data-theme="dark"] .btn-print-post {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #94a3b8 !important;
}

.drK .btn-print-post:hover,
[data-theme="dark"] .btn-print-post:hover {
  background: var(--linkC, #2563eb) !important;
  color: #ffffff !important;
  border-color: var(--linkC, #2563eb) !important;
}

/* ==========================================================================
   10. Speed & Core Web Vitals (CWV) Optimizations
   ========================================================================== */
/* Content-visibility skips layout & paint of offscreen elements until scrolled */
.main-footer,
.related-posts-sec,
.comments-area,
.drawer-sidebar {
  content-visibility: auto;
  contain-intrinsic-size: 1px 300px;
}

/* Smooth TOC scrolling with sticky header offset */
html {
  scroll-behavior: smooth;
}

.single-content h1,
.single-content h2,
.single-content h3,
.single-content h4,
.single-content h5,
.single-content h6 {
  scroll-margin-top: 85px;
}

/* ==========================================================================
   11. Educational PDF Download Box & Buttons (Verified Resource Card - Compact)
   ========================================================================== */
.pdf-download-box,
.download-box {
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid #e2e8f0;
  border-left: 4px solid #ef4444;
  border-radius: 10px;
  padding: 8px 14px;
  margin: 12px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
  box-sizing: border-box;
  max-width: 100%;
}

.pdf-download-box:hover,
.download-box:hover {
  border-color: #cbd5e1;
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.08);
}

/* Legacy Info fallback */
.pdf-dl-info {
  display: flex;
  align-items: center;
  gap: 10px;
}

.pdf-dl-icon {
  width: 36px;
  height: 36px;
  min-width: 36px;
  border-radius: 8px;
  background: rgba(239, 68, 68, 0.12);
  color: #ef4444;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pdf-dl-text h4 {
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--headC, #08102b);
  margin: 0 0 2px;
  line-height: 1.25;
}

.pdf-dl-text p {
  font-size: 0.72rem;
  color: var(--bodyCa, #64748b);
  margin: 0;
  line-height: 1.2;
}

/* Enhanced Resource Card Structure (Compact) */
.pdf-dl-meta-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}

.pdf-dl-icon-badge {
  width: 36px;
  height: 36px;
  min-width: 36px;
  border-radius: 8px;
  background: #fef2f2;
  color: #ef4444;
  border: 1px solid #fecaca;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 3px rgba(239, 68, 68, 0.08);
  flex-shrink: 0;
}

.pdf-dl-icon-badge .pdf-svg-icon {
  width: 17px;
  height: 17px;
}

.pdf-dl-icon-badge .pdf-badge-label {
  font-size: 7px;
  font-weight: 800;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  line-height: 1;
  margin-top: 1px;
}

.pdf-dl-details {
  flex: 1;
  min-width: 0;
}

.pdf-tag-safe {
  font-size: 9px;
  font-weight: 600;
  padding: 1px 6px;
  border-radius: 9999px;
  background: #dcfce7;
  color: #166534;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  line-height: 1.25;
}

.pdf-tag-host {
  color: #2563eb;
  font-weight: 600;
}

.pdf-dl-subject-title {
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--headC, #0f172a);
  margin: 0 0 2px;
  line-height: 1.3;
  word-break: break-word;
}

.pdf-dl-meta-sub {
  font-size: 0.72rem;
  color: var(--bodyCa, #64748b);
  margin: 0;
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
  line-height: 1.25;
}

.pdf-dl-meta-sub .dot {
  color: #cbd5e1;
  font-size: 0.65rem;
}

.pdf-dl-action-wrap {
  flex-shrink: 0;
}

.btn-download,
.pdf-download-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 7px 16px !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 0.82rem !important;
  text-decoration: none !important;
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.2) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease !important;
  white-space: normal !important;
  text-wrap: balance !important;
  word-break: break-word !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
  line-height: 1.3 !important;
}

.btn-download:hover,
.pdf-download-btn:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.32) !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%) !important;
}

.btn-download:active,
.pdf-download-btn:active {
  transform: scale(0.98) !important;
}

/* Mobile Responsiveness for Download Box (Compact) */
@media (max-width: 640px) {
  .pdf-download-box,
  .download-box {
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 8px 11px !important;
    gap: 8px !important;
    margin: 10px 0 !important;
    border-left-width: 3.5px !important;
    border-radius: 9px !important;
  }
  .pdf-dl-meta-wrap {
    align-items: center !important;
    gap: 8px !important;
  }
  .pdf-dl-icon-badge {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    border-radius: 7px !important;
  }
  .pdf-dl-icon-badge .pdf-svg-icon {
    width: 15px !important;
    height: 15px !important;
  }
  .pdf-dl-icon-badge .pdf-badge-label {
    font-size: 6.5px !important;
  }
  .pdf-dl-subject-title {
    font-size: 0.86rem !important;
    line-height: 1.25 !important;
    margin: 0 0 2px !important;
  }
  .pdf-dl-meta-sub {
    font-size: 0.68rem !important;
    gap: 4px !important;
    line-height: 1.2 !important;
  }
  .pdf-dl-action-wrap {
    width: 100% !important;
  }
  .btn-download,
  .pdf-download-btn {
    display: flex !important;
    width: 100% !important;
    text-align: center !important;
    padding: 7px 12px !important;
    font-size: 0.8rem !important;
    border-radius: 7px !important;
  }
}

/* Dark mode PDF download box */
.drK .pdf-download-box,
[data-theme="dark"] .pdf-download-box,
.drK .download-box,
[data-theme="dark"] .download-box {
  background: #182232 !important;
  border-color: rgba(59, 130, 246, 0.25) !important;
  border-left-color: #ef4444 !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important;
}

.drK .pdf-dl-subject-title,
[data-theme="dark"] .pdf-dl-subject-title,
.drK .pdf-dl-text h4,
[data-theme="dark"] .pdf-dl-text h4 {
  color: #f8fafc !important;
}

.drK .pdf-dl-icon-badge,
[data-theme="dark"] .pdf-dl-icon-badge {
  background: rgba(239, 68, 68, 0.15) !important;
  border-color: rgba(239, 68, 68, 0.3) !important;
}

.drK .pdf-tag-safe,
[data-theme="dark"] .pdf-tag-safe {
  background: rgba(16, 185, 129, 0.2) !important;
  color: #6ee7b7 !important;
}

.drK .pdf-tag-host,
[data-theme="dark"] .pdf-tag-host {
  color: #60a5fa !important;
}

.drK .pdf-dl-meta-sub,
[data-theme="dark"] .pdf-dl-meta-sub {
  color: #94a3b8 !important;
}

.drK .pdf-dl-meta-sub .dot,
[data-theme="dark"] .pdf-dl-meta-sub .dot {
  color: #475569 !important;
}

/* ==========================================================================
   12. Print Stylesheet (Clean PDF / Paper Printing)
   ========================================================================== */
@media print {
  #header,
  #footer,
  .sidebar-area,
  .abswer-ui-announcement-bar,
  .plus-ui-announcement-bar,
  .abswer-ui-countdown-banner,
  .plus-ui-countdown-banner,
  .mobile-nav-dock,
  #back-to-top,
  .social-share-wrap,
  .in-article-social-wrap,
  .comments-area,
  .post-nav,
  .tDL,
  .drawer-sidebar,
  .drawer-overlay {
    display: none !important;
  }
  .main-wrapper,
  .content-area,
  .single-article {
    width: 100% !important;
    max-width: 100% !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  body {
    background: #ffffff !important;
    color: #000000 !important;
  }
}
/* ==========================================================================
   Dark Mode: Ordered List & Blockquote overrides in single post content
   ========================================================================== */

/* Ordered list li text color in dark mode */
.drK .single-content ol:not(.plus-toc-list):not(.comment-list) > li,
[data-theme="dark"] .single-content ol:not(.plus-toc-list):not(.comment-list) > li {
  color: #cbd5e1 !important;
  background: transparent !important;
}

/* Unordered list li text color in dark mode */
.drK .single-content ul:not(.plus-toc-list):not(.children) > li,
[data-theme="dark"] .single-content ul:not(.plus-toc-list):not(.children) > li {
  color: #cbd5e1 !important;
  background: transparent !important;
}

/* Blockquote in dark mode */
.drK .single-content blockquote,
[data-theme="dark"] .single-content blockquote,
.drK .entry-content blockquote,
[data-theme="dark"] .entry-content blockquote {
  background: #1a2235 !important;
  border-left-color: #3b82f6 !important;
  color: #cbd5e1 !important;
}

.drK .single-content blockquote p,
[data-theme="dark"] .single-content blockquote p,
.drK .entry-content blockquote p,
[data-theme="dark"] .entry-content blockquote p {
  color: #cbd5e1 !important;
}

/* Generic wp-block-quote dark mode */
.drK .wp-block-quote,
[data-theme="dark"] .wp-block-quote {
  background: #1a2235 !important;
  border-left-color: #3b82f6 !important;
  color: #cbd5e1 !important;
}

/* ==========================================================================
   Legacy Font Awesome 4 Icon Fallback (fa-file-pdf-o, fa-download, etc.)
   ========================================================================== */
.fa-file-pdf-o:before {
  content: "\f1c1" !important;
}
.fa-file-pdf:before {
  content: "\f1c1" !important;
}

/* ==========================================================================
   Skeleton Loading Animation
   ========================================================================== */
@keyframes plusUiShimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
.skeleton-loading,
.post-card-thumb:empty {
  background: linear-gradient(90deg, var(--contentBs, #f1f5f9) 25%, var(--contentL, #e2e8f0) 50%, var(--contentBs, #f1f5f9) 75%) !important;
  background-size: 200% 100% !important;
  animation: plusUiShimmer 1.5s infinite !important;
}

/* ==========================================================================
   Telegram VIP Community Join Banner (Animated)
   ========================================================================== */
.plus-telegram-join-box {
  background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
  border-radius: 16px !important;
  padding: 20px 24px !important;
  margin: 30px 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  color: #ffffff !important;
  box-shadow: 0 8px 25px rgba(2, 132, 199, 0.28) !important;
  font-family: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif, var(--font-family, sans-serif) !important;
  position: relative !important;
  overflow: hidden !important;
}
.plus-telegram-join-box::before {
  content: '' !important;
  position: absolute !important;
  top: -50% !important;
  right: -20% !important;
  width: 250px !important;
  height: 250px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
}
.tg-left {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  flex: 1 !important;
}
.tg-plane-icon {
  width: 52px !important;
  height: 52px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.2) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  animation: tgPulse 2s infinite ease-in-out !important;
}
@keyframes tgPulse {
  0%, 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4); }
  50% { transform: scale(1.06); box-shadow: 0 0 0 10px rgba(255, 255, 255, 0); }
}
.tg-title {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  margin: 0 0 4px !important;
}
.tg-desc {
  font-size: 0.88rem !important;
  color: rgba(255, 255, 255, 0.9) !important;
  margin: 0 !important;
  line-height: 1.4 !important;
}
.tg-join-btn {
  background: #ffffff !important;
  color: #0369a1 !important;
  font-size: 0.92rem !important;
  font-weight: 700 !important;
  padding: 10px 22px !important;
  border-radius: 25px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15) !important;
  transition: transform 0.15s ease, background 0.15s ease !important;
  flex-shrink: 0 !important;
}
.tg-join-btn:hover {
  transform: translateY(-2px) scale(1.02) !important;
  background: #f8fafc !important;
}
@media (max-width: 768px) {
  .plus-telegram-join-box {
    flex-direction: column !important;
    align-items: stretch !important;
    text-align: center !important;
    padding: 18px !important;
  }
  .tg-left {
    flex-direction: column !important;
  }
  .tg-join-btn {
    text-align: center !important;
  }
}

/* ==========================================================================
   Inline PDF Viewer (.plus-pdf-viewer-wrap)
   ========================================================================== */
.plus-pdf-viewer-wrap {
  border: 1px solid var(--contentL, #e2e8f0) !important;
  border-radius: 12px !important;
  background: var(--contentB, #ffffff) !important;
  margin: 24px 0 !important;
  overflow: hidden !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04) !important;
}
.pdf-viewer-header {
  background: var(--contentBs, #f8fafc) !important;
  padding: 10px 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-bottom: 1px solid var(--contentL, #e2e8f0) !important;
  gap: 10px !important;
  font-family: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif, var(--font-family, sans-serif) !important;
}
.pdf-v-title {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  color: var(--headC, #08102b) !important;
}
.pdf-v-fullscreen-btn {
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  color: var(--linkC, #2563eb) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  text-decoration: none !important;
}
.pdf-v-fullscreen-btn:hover {
  text-decoration: underline !important;
}

/* ==========================================================================
   Dark Mode Toggle Sun/Moon Transition Animation
   ========================================================================== */
.theme-toggle-btn {
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}
.theme-toggle-btn:hover {
  transform: rotate(25deg) scale(1.1) !important;
}
.theme-toggle-btn:active {
  transform: rotate(180deg) scale(0.9) !important;
}

/* ==========================================================================
   Category-wise Color Coding for Badges
   ========================================================================== */
/* School Categories */
.category-school .post-card-badge,
a[href*="/category/school/"] .post-card-badge {
  background: #2563eb !important;
  color: #ffffff !important;
}
/* Madrasha Categories */
.category-madrasha .post-card-badge,
a[href*="/category/madrasha/"] .post-card-badge {
  background: #059669 !important;
  color: #ffffff !important;
}
/* BCS & NTRCA */
.category-bcs-studies .post-card-badge,
.category-ntrca-exam .post-card-badge {
  background: #7c3aed !important;
  color: #ffffff !important;
}
/* Exam Routine & Results */
.category-exam-routine .post-card-badge,
.category-exam-results .post-card-badge {
  background: #e11d48 !important;
  color: #ffffff !important;
}
/* Admission & Guide Books */
.category-admission-guide .post-card-badge,
.category-guide-books .post-card-badge {
  background: #d97706 !important;
  color: #ffffff !important;
}

/* ==========================================================================
   Interactive Quiz / MCQ Block (.plus-mcq-box)
   ========================================================================== */
.plus-mcq-box {
  background: var(--contentB, #ffffff) !important;
  border: 1px solid var(--contentL, #e2e8f0) !important;
  border-radius: 14px !important;
  padding: 20px !important;
  margin: 24px 0 !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03) !important;
  font-family: 'Fraunces', 'Scheherazade New', 'Noto Serif Bengali', serif, var(--font-family, sans-serif) !important;
  border-left: 4px solid var(--linkC, #2563eb) !important;
}
.plus-mcq-question {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin-bottom: 16px !important;
}
.mcq-q-badge {
  background: var(--linkC, #2563eb) !important;
  color: #ffffff !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  padding: 2px 8px !important;
  border-radius: 12px !important;
  white-space: nowrap !important;
  margin-top: 2px !important;
}
.mcq-q-title {
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: var(--headC, #08102b) !important;
  margin: 0 !important;
  line-height: 1.4 !important;
}
.plus-mcq-options {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
.mcq-opt {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 14px !important;
  border-radius: 10px !important;
  background: var(--contentBs, #f8fafc) !important;
  border: 1.5px solid var(--contentL, #e2e8f0) !important;
  cursor: pointer !important;
  text-align: left !important;
  font-family: inherit !important;
  font-size: 0.92rem !important;
  color: var(--bodyC, #334155) !important;
  transition: all 0.15s ease !important;
}
.mcq-opt:hover:not(.correct):not(.wrong) {
  background: #f1f5f9 !important;
  border-color: var(--linkC, #2563eb) !important;
}
.mcq-opt-marker {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  border-radius: 50% !important;
  background: var(--contentL, #e2e8f0) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
}
.mcq-opt.correct {
  background: rgba(16, 185, 129, 0.12) !important;
  border-color: #10b981 !important;
  color: #047857 !important;
  font-weight: 700 !important;
}
.mcq-opt.correct .mcq-opt-marker {
  background: #10b981 !important;
  color: #ffffff !important;
}
.mcq-opt.wrong {
  background: rgba(239, 68, 68, 0.1) !important;
  border-color: #ef4444 !important;
  color: #b91c1c !important;
}
.mcq-opt.wrong .mcq-opt-marker {
  background: #ef4444 !important;
  color: #ffffff !important;
}
.plus-mcq-explanation {
  margin-top: 14px !important;
  padding: 12px 16px !important;
  border-radius: 10px !important;
  background: rgba(37, 99, 235, 0.08) !important;
  border: 1px solid rgba(37, 99, 235, 0.2) !important;
  color: var(--bodyC, #1e293b) !important;
  font-size: 0.88rem !important;
  line-height: 1.5 !important;
  animation: ajaxFadeDown 0.2s ease !important;
}

/* Dark mode for MCQ */
.drK .plus-mcq-box,
[data-theme="dark"] .plus-mcq-box {
  background: #18202f !important;
  border-color: #2b384e !important;
}
.drK .mcq-opt,
[data-theme="dark"] .mcq-opt {
  background: #202b3e !important;
  border-color: #2e3e57 !important;
  color: #cbd5e1 !important;
}
.drK .plus-mcq-explanation,
[data-theme="dark"] .plus-mcq-explanation {
  background: rgba(37, 99, 235, 0.15) !important;
  border-color: rgba(37, 99, 235, 0.3) !important;
  color: #e2e8f0 !important;
}

.drK .wp-block-quote cite,
[data-theme="dark"] .wp-block-quote cite {
  color: #94a3b8 !important;
}

/* ==========================================================================
   14. Smart Header Auto-Hide on Scroll
   ========================================================================== */
.mainH {
  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease !important;
}
.mainH.header-hidden {
  transform: translateY(-100%) !important;
}
.admin-bar .mainH.header-hidden {
  transform: translateY(-100%) !important;
}

/* ==========================================================================
   15. Quick Classes Filter Bottom Sheet Modal
   ========================================================================== */
.bottom-sheet-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 9998;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
.bottom-sheet-backdrop.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.bottom-sheet-container {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  background: var(--contentB, #ffffff);
  border-radius: 20px 20px 0 0;
  box-shadow: 0 -4px 30px rgba(0, 0, 0, 0.15);
  max-height: 85vh;
  overflow-y: auto;
  transform: translateY(100%);
  transition: transform 0.3s cubic-bezier(0.32, 0.72, 0, 1);
  padding: 0 16px 30px;
  box-sizing: border-box;
}
.bottom-sheet-container.active {
  transform: translateY(0);
}
.sheet-drag-handle-wrap {
  display: flex;
  justify-content: center;
  padding: 10px 0 6px;
  cursor: grab;
}
.sheet-drag-handle {
  width: 44px;
  height: 5px;
  background: #cbd5e1;
  border-radius: 4px;
}
.sheet-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--contentL, #f1f5f9);
  margin-bottom: 14px;
}
.sheet-title-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
}
.sheet-icon {
  font-size: 24px;
  line-height: 1;
}
.sheet-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--headC, #0f172a);
}
.sheet-subtitle {
  margin: 2px 0 0;
  font-size: 0.76rem;
  color: var(--bodyCa, #64748b);
}
.sheet-close-btn {
  background: var(--contentBs, #f1f5f9);
  border: none;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--bodyCa, #64748b);
  cursor: pointer;
  transition: background 0.15s ease;
}
.sheet-close-btn:hover {
  background: #e2e8f0;
  color: #0f172a;
}
.sheet-group {
  margin-bottom: 18px;
}
.sheet-group-title {
  font-size: 0.84rem;
  font-weight: 700;
  color: var(--headC, #1e293b);
  margin: 0 0 10px 4px;
}
.sheet-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
@media (max-width: 400px) {
  .sheet-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
.sheet-card {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--contentBs, #f8fafc);
  border: 1px solid var(--contentL, #e2e8f0);
  padding: 8px 10px;
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.15s ease;
}
.sheet-card:hover {
  background: rgba(37, 99, 235, 0.08);
  border-color: var(--linkC, #2563eb);
  transform: translateY(-1px);
}
.sheet-card-icon {
  font-size: 0.72rem;
  font-weight: 800;
  padding: 4px 6px;
  border-radius: 8px;
  line-height: 1;
}
.sheet-card-name {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--headC, #1e293b);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ==========================================================================
   16. Student Offline Bookmarks Modal
   ========================================================================== */
.bookmarks-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 9998;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
.bookmarks-backdrop.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.bookmarks-modal {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  background: var(--contentB, #ffffff);
  border-radius: 20px 20px 0 0;
  box-shadow: 0 -4px 30px rgba(0, 0, 0, 0.15);
  max-height: 80vh;
  overflow-y: auto;
  transform: translateY(100%);
  transition: transform 0.3s cubic-bezier(0.32, 0.72, 0, 1);
  padding: 16px;
  box-sizing: border-box;
}
.bookmarks-modal.active {
  transform: translateY(0);
}
.bookmarks-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--contentL, #f1f5f9);
}
.bm-header-title-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
}
.bm-star-icon {
  font-size: 22px;
  line-height: 1;
}
.bm-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--headC, #0f172a);
}
.bm-subtitle {
  margin: 2px 0 0;
  font-size: 0.76rem;
  color: var(--bodyCa, #64748b);
}
.bm-close-btn {
  background: var(--contentBs, #f1f5f9);
  border: none;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--bodyCa, #64748b);
  cursor: pointer;
}
.bm-empty-state {
  text-align: center;
  padding: 40px 16px;
}
.bm-empty-icon {
  font-size: 40px;
  display: block;
  margin-bottom: 10px;
}
.bm-empty-state h4 {
  font-size: 1rem;
  margin: 0 0 6px;
  color: var(--headC, #0f172a);
}
.bm-empty-state p {
  font-size: 0.82rem;
  color: var(--bodyCa, #64748b);
  margin: 0 auto;
  max-width: 280px;
  line-height: 1.4;
}
.bookmarks-items-wrap {
  margin-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.bm-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--contentBs, #f8fafc);
  border: 1px solid var(--contentL, #e2e8f0);
  padding: 10px 14px;
  border-radius: 12px;
  gap: 10px;
  transition: all 0.15s ease;
}
.bm-card:hover {
  background: #f1f5f9;
}
.bm-card-link {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  text-decoration: none;
  min-width: 0;
}
.bm-card-icon {
  font-size: 18px;
  flex-shrink: 0;
}
.bm-card-title {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--headC, #1e293b);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.btn-remove-bm {
  background: transparent;
  border: none;
  color: #94a3b8;
  cursor: pointer;
  padding: 4px;
  border-radius: 6px;
  transition: color 0.15s ease, background 0.15s ease;
}
.btn-remove-bm:hover {
  color: #ef4444;
  background: rgba(239, 68, 68, 0.1);
}
.bookmarks-footer {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--contentL, #f1f5f9);
  text-align: center;
}
.btn-clear-bookmarks {
  background: rgba(239, 68, 68, 0.08);
  border: 1px solid rgba(239, 68, 68, 0.2);
  color: #ef4444;
  font-size: 0.78rem;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 20px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.btn-clear-bookmarks:hover {
  background: #ef4444;
  color: #ffffff;
}
.bm-badge-count {
  position: absolute;
  top: 3px;
  right: calc(50% - 16px);
  background: #ef4444;
  color: #ffffff;
  font-size: 10px;
  font-weight: 700;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* ==========================================================================
   17. Single Post Mobile Sticky Action Bar (removed)

/* Meta Font Size Controls in Single Post Header */
.meta-font-controls {
  display: inline-flex;
  background: var(--contentBs, #f1f5f9);
  border: 1px solid var(--contentL, #e2e8f0);
  border-radius: 14px;
  padding: 1px 2px;
}
.btn-font-dec,
.btn-font-inc {
  background: transparent;
  border: none;
  color: var(--bodyC, #334155);
  font-size: 0.72rem;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 10px;
  cursor: pointer;
  transition: background 0.15s ease;
}
.btn-font-dec:hover,
.btn-font-inc:hover {
  background: rgba(37, 99, 235, 0.12);
  color: var(--linkC, #2563eb);
}
.btn-post-bookmark {
  background: var(--contentBs, #f1f5f9) !important;
  border: 1px solid var(--contentL, #e2e8f0) !important;
  color: var(--bodyC, #334155) !important;
  border-radius: 8px !important;
  padding: 3px 9px !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  transition: all 0.15s ease !important;
}
.btn-post-bookmark.bookmarked {
  background: rgba(245, 158, 11, 0.15) !important;
  border-color: rgba(245, 158, 11, 0.4) !important;
  color: #d97706 !important;
}
.btn-post-bookmark.bookmarked i.bm-icon {
  color: #f59e0b !important;
}

/* ==========================================================================
   18. WhatsApp Floating Community Help Button
   ========================================================================== */
.whatsapp-floating-wrap {
  position: fixed;
  bottom: 68px; /* sits cleanly above the 54px mobile dock on non-single pages */
  right: 14px;
  z-index: 930;
}
@media (min-width: 769px) {
  .whatsapp-floating-wrap {
    bottom: 24px;
    right: 24px;
  }
}

.whatsapp-floating-btn {
  width: 48px !important;
  height: 48px !important;
  background: #128C7E !important; /* Deep rich dark official WhatsApp green */
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 14px rgba(18, 140, 126, 0.45) !important;
  position: relative !important;
  text-decoration: none !important;
  transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}
.whatsapp-floating-btn:hover {
  transform: scale(1.08) !important;
  background: #0e6f64 !important;
}
.whatsapp-floating-btn svg {
  width: 28px !important;
  height: 28px !important;
  display: block !important;
  flex-shrink: 0 !important;
}
.whatsapp-floating-btn svg path {
  fill: #ffffff !important;
  stroke: none !important;
}
.whatsapp-floating-btn svg .wa-phone-path {
  fill: #128C7E !important;
  stroke: none !important;
}
.wa-pulse-ring {
  position: absolute;
  inset: -3px;
  border-radius: 50%;
  border: 2px solid #128C7E;
  opacity: 0.8;
  animation: waPulseRing 2s cubic-bezier(0.24, 0, 0.38, 1) infinite;
  pointer-events: none;
}
@keyframes waPulseRing {
  0% { transform: scale(0.95); opacity: 0.8; }
  50% { transform: scale(1.2); opacity: 0; }
  100% { transform: scale(1.25); opacity: 0; }
}

/* ==========================================================================
   19. Lightweight Toast Notification
   ========================================================================== */
.abswer-ui-toast,
.plus-ui-toast {
  position: fixed;
  bottom: 120px;
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  background: rgba(15, 23, 42, 0.94);
  color: #ffffff;
  padding: 8px 18px;
  border-radius: 24px;
  font-size: 0.85rem;
  font-weight: 600;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.22s ease, visibility 0.22s ease;
  z-index: 100000;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
  white-space: nowrap;
}
.abswer-ui-toast.show,
.plus-ui-toast.show {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

/* Pulse Highlight for Download Buttons */
.pulse-highlight {
  animation: dlPulse 1.8s ease-in-out;
}
@keyframes dlPulse {
  0%, 100% { transform: scale(1); box-shadow: none; }
  50% { transform: scale(1.03); box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.4); }
}

/* ==========================================================================
   Dark Mode Theme Overrides for New Mobile Features
   ========================================================================== */
.drK .bottom-sheet-container,
[data-theme="dark"] .bottom-sheet-container,
.drK .bookmarks-modal,
[data-theme="dark"] .bookmarks-modal {
  background: #182232 !important;
  box-shadow: 0 -4px 30px rgba(0, 0, 0, 0.5) !important;
}
.drK .sheet-card,
[data-theme="dark"] .sheet-card,
.drK .bm-card,
[data-theme="dark"] .bm-card {
  background: #1f2d42 !important;
  border-color: #2b3d56 !important;
}
.drK .sheet-card:hover,
[data-theme="dark"] .sheet-card:hover,
.drK .bm-card:hover,
[data-theme="dark"] .bm-card:hover {
  background: #253752 !important;
  border-color: var(--linkC, #2563eb) !important;
}
.drK .sheet-drag-handle,
[data-theme="dark"] .sheet-drag-handle {
  background: #475569 !important;
}
.drK .sheet-close-btn,
[data-theme="dark"] .sheet-close-btn,
.drK .bm-close-btn,
[data-theme="dark"] .bm-close-btn {
  background: #1f2d42 !important;
  color: #cbd5e1 !important;
}

.drK .btn-font-dec,
.drK .btn-font-inc,
[data-theme="dark"] .btn-font-dec,
[data-theme="dark"] .btn-font-inc {
  color: #cbd5e1 !important;
}
.drK .btn-post-bookmark,
[data-theme="dark"] .btn-post-bookmark {
  background: #1f2d42 !important;
  border-color: #2b3d56 !important;
  color: #cbd5e1 !important;
}

/* ==========================================================================
   Core Web Vitals (CLS, LCP, INP) Layout Stability & AdSense Shield
   ========================================================================== */
/* 1. Prevent AdSense Layout Shifts: Reserve layout space when ads are active */
.adsbygoogle:not([data-ad-status="unfilled"]),
.google-auto-placed,
.abswer-ui-ad-slot,
.plus-ui-ad-slot,
.widget_custom_html:has(.adsbygoogle:not([data-ad-status="unfilled"])) {
  min-height: 90px;
  display: block;
  contain: layout style;
}

/* Collapse unfilled ads completely so no blank space appears when ads are off */
ins.adsbygoogle[data-ad-status="unfilled"],
.adsbygoogle[data-ad-status="unfilled"] {
  display: none !important;
  min-height: 0 !important;
  height: 0 !important;
}

@media (min-width: 768px) {
  .abswer-ui-ad-slot,
  .plus-ui-ad-slot,
  .widget_custom_html:has(.adsbygoogle:not([data-ad-status="unfilled"])) {
    min-height: 250px;
  }
}

/* 2. Card thumbnail placeholder to prevent grid shift */
.post-card-thumb {
  aspect-ratio: 16 / 9;
  background-color: var(--cardB, #f1f5f9);
}

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

/* 3. Smooth Font rendering to prevent layout thrashing */
body, button, input, select, textarea {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* ==========================================================================
   Ultra-Modern Compact Category & Archive Hero
   ========================================================================== */
.cat-modern-hero {
  position: relative;
  background: var(--contentB, #ffffff);
  border: 1px solid var(--contentL, #e2e8f0);
  border-radius: 14px;
  padding: 12px 16px;
  margin-bottom: 16px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.02);
  overflow: hidden;
  transition: background-color 0.3s ease, border-color 0.3s ease;
}

.cat-modern-hero::before {
  content: '';
  position: absolute;
  top: -50px;
  right: -30px;
  width: 180px;
  height: 180px;
  background: radial-gradient(circle, rgba(37, 99, 235, 0.08) 0%, rgba(37, 99, 235, 0) 70%);
  border-radius: 50%;
  pointer-events: none;
}

.cat-hero-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 12px;
}

.cat-hero-crumbs-wrap .single-breadcrumbs {
  margin: 0 !important;
  font-size: 0.84rem !important;
  color: var(--bodyCa, #64748b) !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}

.cat-hero-crumbs-wrap .single-breadcrumbs a {
  color: var(--bodyCa, #64748b);
  text-decoration: none;
  transition: color 0.15s ease;
}

.cat-hero-crumbs-wrap .single-breadcrumbs a:hover {
  color: var(--linkC, #2563eb);
}

.cat-hero-crumbs-wrap .single-breadcrumbs .separator {
  margin: 0 6px;
  opacity: 0.5;
  font-size: 0.78rem;
}

.cat-hero-crumbs-wrap .single-breadcrumbs .current {
  color: var(--headC, #0f172a);
  font-weight: 600;
}

.cat-count-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--contentBs, #eff6ff);
  color: var(--linkC, #2563eb);
  border: 1px solid rgba(37, 99, 235, 0.2);
  padding: 4px 12px;
  border-radius: 9999px;
  font-size: 0.8rem;
  font-weight: 600;
  white-space: nowrap;
}

.cat-hero-main {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 10px;
}

.cat-hero-icon {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--linkC, #2563eb) 0%, #1d4ed8 100%);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25);
}

.cat-hero-title-wrap {
  flex: 1;
  min-width: 0;
}

.cat-tag-badge {
  display: inline-block;
  font-size: 0.74rem;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 0.5px;
  color: var(--linkC, #2563eb);
  margin-bottom: 2px;
}

.cat-hero-title {
  font-size: 1.48rem !important;
  font-weight: 700 !important;
  color: var(--headC, #0f172a) !important;
  margin: 0 !important;
  line-height: 1.3 !important;
  word-break: break-word;
}

/* Sibling / Subcategory quick chips */
.cat-subnav-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin: 10px 0 12px;
  padding-top: 10px;
  border-top: 1px dashed var(--contentL, #e2e8f0);
}

.cat-subnav-label {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--bodyCa, #64748b);
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.cat-sub-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  background: var(--contentBs, #f1f5f9);
  border: 1px solid var(--contentL, #e2e8f0);
  border-radius: 8px;
  font-size: 0.78rem;
  color: var(--bodyC, #334155);
  text-decoration: none;
  transition: all 0.15s ease;
}

.cat-sub-chip:hover {
  background: var(--linkC, #2563eb);
  color: #ffffff;
  border-color: var(--linkC, #2563eb);
}

.cat-sub-chip.current-chip {
  background: var(--linkC, #2563eb);
  color: #ffffff;
  border-color: var(--linkC, #2563eb);
  font-weight: 600;
}

/* Compact Collapsible Description */
.cat-desc-box {
  position: relative;
  margin-top: 8px;
  background: rgba(0, 0, 0, 0.02);
  border-radius: 8px;
  padding: 8px 12px;
  border-left: 3px solid var(--linkC, #2563eb);
}

.cat-desc-text {
  font-size: 0.9rem;
  color: var(--bodyC, #334155);
  line-height: 1.6;
  margin: 0;
}

.cat-desc-text p {
  margin: 0;
}

.cat-desc-text p + p {
  margin-top: 0.5em;
}

.cat-desc-text.is-collapsible {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: max-height 0.25s ease;
}

.cat-desc-text.is-collapsible.expanded {
  display: block;
  -webkit-line-clamp: unset;
}

.cat-desc-toggle-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 6px;
  background: none;
  border: none;
  color: var(--linkC, #2563eb);
  font-family: inherit;
  font-size: 0.8rem;
  font-weight: 700;
  cursor: pointer;
  padding: 0;
  transition: opacity 0.15s;
}

.cat-desc-toggle-btn:hover {
  opacity: 0.85;
  text-decoration: underline;
}

/* Dark Mode */
.drK .cat-modern-hero {
  background: var(--darkBs, #252526);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

.drK .cat-modern-hero::before {
  background: radial-gradient(circle, rgba(59, 130, 246, 0.15) 0%, rgba(59, 130, 246, 0) 70%);
}

.drK .cat-count-pill {
  background: rgba(59, 130, 246, 0.15);
  color: #60a5fa;
  border-color: rgba(59, 130, 246, 0.3);
}

.drK .cat-desc-box {
  background: rgba(255, 255, 255, 0.03);
}

.drK .cat-desc-text {
  color: #cbd5e1;
}

.drK .cat-sub-chip {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.1);
  color: #cbd5e1;
}

.drK .cat-sub-chip:hover,
.drK .cat-sub-chip.current-chip {
  background: #3b82f6;
  color: #ffffff;
  border-color: #3b82f6;
}

/* Mobile Responsiveness */
@media (max-width: 640px) {
  .cat-modern-hero {
    padding: 10px 12px;
    border-radius: 12px;
    margin-bottom: 14px;
  }
  .cat-hero-title {
    font-size: 1.25rem !important;
  }
  .cat-hero-icon {
    width: 38px;
    height: 38px;
    min-width: 38px;
    font-size: 1.05rem;
    border-radius: 10px;
  }
  .cat-count-pill {
    padding: 3px 9px;
    font-size: 0.74rem;
  }
  .cat-desc-box {
    padding: 6px 10px;
  }
}

/* ==========================================================================
   Category Year / Academic Stream Horizontal Scroll Pill Bar (v1.5.5)
   ========================================================================== */
.cat-years-scroll-wrap {
  margin-top: 14px;
  position: relative;
  width: 100%;
}

.cat-years-scroll-track {
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
  white-space: nowrap;
  padding: 4px 2px;
  scrollbar-width: none;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
}

.cat-years-scroll-track::-webkit-scrollbar {
  display: none;
}

.cat-years-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--bodyCa, #64748b);
  margin-right: 4px;
  flex-shrink: 0;
}

.cat-year-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 0.84rem;
  font-weight: 600;
  text-decoration: none !important;
  background: #ffffff;
  color: #334155;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  flex-shrink: 0;
}

.cat-year-pill:hover {
  border-color: #3b82f6;
  color: #1d4ed8;
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(59, 130, 246, 0.15);
}

.cat-year-pill.active {
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  color: #ffffff !important;
  border-color: #1d4ed8;
  box-shadow: 0 3px 10px rgba(37, 99, 235, 0.28);
}

.cat-year-pill.active i {
  color: #ffffff;
}

/* Dark Mode for Year Pills */
.drK .cat-year-pill,
[data-theme='dark'] .cat-year-pill {
  background: #1e293b;
  border-color: #334155;
  color: #e2e8f0;
}

.drK .cat-year-pill:hover,
[data-theme='dark'] .cat-year-pill:hover {
  background: #27354a;
  border-color: #60a5fa;
  color: #93c5fd;
}

.drK .cat-year-pill.active,
[data-theme='dark'] .cat-year-pill.active {
  background: linear-gradient(135deg, #3b82f6, #1d4ed8);
  color: #ffffff !important;
  border-color: #3b82f6;
  box-shadow: 0 3px 12px rgba(59, 130, 246, 0.35);
}

.drK .cat-years-label,
[data-theme='dark'] .cat-years-label {
  color: #94a3b8;
}

/* ==========================================================================
   Smart 3-Card Related Suggestions Grid (v1.5.5)
   ========================================================================== */
.smart-related-sec {
  margin-top: 36px;
  padding-top: 26px;
  border-top: 1px solid var(--contentL, #e2e8f0);
}

.smart-related-header {
  margin-bottom: 22px;
}

.smart-related-title-wrap {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.smart-related-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  align-self: flex-start;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.3px;
  padding: 4px 12px;
  border-radius: 6px;
  background: rgba(37, 99, 235, 0.08);
  color: #2563eb;
}

.smart-related-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1.3rem;
  font-weight: 800;
  color: var(--headC, #0f172a);
  margin: 4px 0 0;
}

.smart-related-subtitle {
  font-size: 0.88rem;
  color: var(--bodyCa, #64748b);
  margin: 6px 0 0;
  line-height: 1.5;
}

.smart-related-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.smart-related-grid .post-card {
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  height: 100%;
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.smart-related-grid .post-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.smart-related-grid .post-card-body {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* Dark Mode for Smart Related Grid */
.drK .smart-related-sec,
[data-theme='dark'] .smart-related-sec {
  border-top-color: #334155;
}

.drK .smart-related-badge,
[data-theme='dark'] .smart-related-badge {
  background: rgba(59, 130, 246, 0.2);
  color: #93c5fd;
}

.drK .smart-related-title,
[data-theme='dark'] .smart-related-title {
  color: #f8fafc;
}

.drK .smart-related-subtitle,
[data-theme='dark'] .smart-related-subtitle {
  color: #94a3b8;
}

.drK .smart-related-grid .post-card:hover,
[data-theme='dark'] .smart-related-grid .post-card:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

/* ==========================================================================
   FAQ Shortcode Card [faq_item] (v1.5.5)
   ========================================================================== */
.plus-faq-card {
  margin: 20px 0;
  padding: 16px 20px;
  background: #f8fafc;
  border-left: 4px solid #2563eb;
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.plus-faq-q {
  font-weight: 700;
  font-size: 1.05rem;
  color: #0f172a;
  margin-bottom: 8px;
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.plus-faq-q i {
  color: #2563eb;
  margin-top: 3px;
  flex-shrink: 0;
}

.plus-faq-a {
  font-size: 0.95rem;
  line-height: 1.7;
  color: #334155;
}

.drK .plus-faq-card,
[data-theme='dark'] .plus-faq-card {
  background: #1e293b;
  border-left-color: #3b82f6;
}

.drK .plus-faq-q,
[data-theme='dark'] .plus-faq-q {
  color: #f8fafc;
}

.drK .plus-faq-q i,
[data-theme='dark'] .plus-faq-q i {
  color: #60a5fa;
}

.drK .plus-faq-a,
[data-theme='dark'] .plus-faq-a {
  color: #cbd5e1;
}

/* Responsive Styles */
@media (max-width: 860px) {
  .smart-related-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }
}

@media (max-width: 580px) {
  .smart-related-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .smart-related-title {
    font-size: 1.15rem;
  }
}

/* Drawer Mobile Menu Nav Icons */
.drawer-menu-list li a {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.drawer-menu-list li a .nav-m-icon {
  font-size: 1.05rem !important;
  width: 22px !important;
  text-align: center !important;
  color: var(--linkC, #2563eb) !important;
  flex-shrink: 0 !important;
}

/* Featured Quick Tag (Homepage Hero) */
.edu-quick-tag.tag-featured {
  background: #e0f2fe !important;
  color: #0369a1 !important;
  border: 1px solid #7dd3fc !important;
  font-weight: 600 !important;
}
.dark-mode .edu-quick-tag.tag-featured,
.drK .edu-quick-tag.tag-featured,
[data-theme="dark"] .edu-quick-tag.tag-featured {
  background: rgba(14, 165, 233, 0.18) !important;
  color: #38bdf8 !important;
  border-color: rgba(56, 189, 248, 0.35) !important;
}

/* Teletalk Smart CTA Box (Single Post) */
.plus-teletalk-cta-box {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.plus-teletalk-cta-box:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(2, 132, 199, 0.12);
}
.dark-mode .plus-teletalk-cta-box,
.drK .plus-teletalk-cta-box,
[data-theme="dark"] .plus-teletalk-cta-box {
  background: rgba(14, 165, 233, 0.08) !important;
  border-color: #0284c7 !important;
}

/* Tool card subtle highlight in homepage Education Finder */
.edu-card.edu-card-tool:hover {
  border-color: #0284c7;
  transform: translateY(-3px);
}

/* ==========================================================================
   All Bangladesh Academic & Job Exam Results Hub (ফলাফল পোর্টাল)
   ========================================================================== */
.results-hub-section {
  margin: 36px auto 24px;
  max-width: 1200px;
  padding: 0 16px;
  box-sizing: border-box;
}

.results-hub-container {
  background: var(--contentB, #ffffff);
  border: 1px solid var(--contentL, #e2e8f0);
  border-radius: 20px;
  padding: 34px 28px;
  box-shadow: 0 4px 25px -4px rgba(0, 0, 0, 0.05);
  transition: all 0.25s ease;
}

.results-hub-header {
  text-align: center;
  margin-bottom: 26px;
}

.results-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(37, 99, 235, 0.08);
  color: var(--linkC, #2563eb);
  font-size: 0.82rem;
  font-weight: 700;
  padding: 5px 14px;
  border-radius: 20px;
  border: 1px solid rgba(37, 99, 235, 0.2);
  margin-bottom: 12px;
}

.results-badge-ping {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #10b981;
  box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.25);
  animation: resultsPulse 2s infinite;
}

@keyframes resultsPulse {
  0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.6); }
  70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(16, 185, 129, 0); }
  100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}

.results-title {
  font-size: 1.65rem;
  font-weight: 800;
  color: var(--headC, #0f172a);
  margin: 0 0 8px;
  letter-spacing: -0.02em;
}

.results-subtitle {
  font-size: 0.94rem;
  color: var(--bodyCa, #64748b);
  max-width: 680px;
  margin: 0 auto;
  line-height: 1.6;
}

/* Controls: Search & Tabs */
.results-controls-wrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 28px;
}

.results-search-box {
  position: relative;
  width: 100%;
  max-width: 620px;
  margin: 0 auto;
}

.results-search-input {
  width: 100%;
  padding: 13px 40px 13px 44px;
  border: 1.5px solid var(--contentL, #cbd5e1);
  border-radius: 12px;
  font-size: 0.95rem;
  background: var(--contentBs, #f8fafc);
  color: var(--headC, #0f172a);
  outline: none;
  transition: all 0.2s ease;
  box-sizing: border-box;
}

.results-search-input:focus {
  border-color: #2563eb;
  background: #ffffff;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

.results-search-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  pointer-events: none;
  display: flex;
  align-items: center;
}

.results-search-clear {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  background: #e2e8f0;
  border: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  font-size: 10px;
  color: #475569;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.results-tabs-nav {
  display: flex;
  align-items: center;
  gap: 6px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 2px 2px 6px;
}

.results-tabs-nav::-webkit-scrollbar {
  display: none;
}

.results-tab-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 14px;
  border-radius: 20px;
  background: var(--contentBs, #f1f5f9);
  border: 1px solid var(--contentL, #e2e8f0);
  color: var(--headC, #334155);
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.15s ease;
}

.results-tab-btn:hover {
  background: rgba(37, 99, 235, 0.08);
  border-color: rgba(37, 99, 235, 0.3);
  color: #2563eb;
}

.results-tab-btn.active {
  background: #2563eb;
  border-color: #2563eb;
  color: #ffffff;
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25);
}

.results-tab-btn .tab-count {
  background: rgba(255, 255, 255, 0.25);
  color: inherit;
  font-size: 0.68rem;
  padding: 1px 6px;
  border-radius: 8px;
  font-weight: 700;
}

/* Cards Grid — Ultra Compact */
.results-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 12px;
}

.result-card {
  background: var(--contentB, #ffffff);
  border: 1px solid var(--contentL, #e2e8f0);
  border-radius: 12px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.02);
}

.result-card:hover {
  border-color: #93c5fd;
  box-shadow: 0 6px 16px -2px rgba(37, 99, 235, 0.1);
  transform: translateY(-2px);
}

.result-card.is-hidden {
  display: none !important;
}

.rc-header {
  display: flex;
  align-items: center;
  gap: 10px;
}

.rc-icon-wrap {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: transform 0.2s ease;
}

.result-card:hover .rc-icon-wrap {
  transform: scale(1.06);
}

.rc-icon-wrap svg {
  width: 20px;
  height: 20px;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.rc-meta {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  overflow: hidden;
}

.rc-authority {
  font-size: 0.72rem;
  color: var(--bodyCa, #64748b);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rc-badge {
  font-size: 0.68rem;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 6px;
  display: inline-block;
  white-space: nowrap;
  flex-shrink: 0;
  letter-spacing: 0.02em;
}

.rc-body {
  flex-grow: 1;
}

.rc-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--headC, #0f172a);
  margin: 0 0 3px;
  line-height: 1.35;
}

.rc-desc {
  font-size: 0.8rem;
  color: var(--bodyCa, #64748b);
  line-height: 1.45;
  margin: 0;
  display: block;
}

.rc-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: auto;
}

.rc-actions svg,
.rc-actions svg *,
.rc-btn-primary svg,
.rc-btn-primary svg *,
.rc-btn-alt svg,
.rc-btn-alt svg *,
.rc-btn-sms svg,
.rc-btn-sms svg * {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.rc-btn-primary svg,
.rc-btn-primary svg * {
  stroke: #ffffff !important;
  fill: none !important;
}

.rc-btn-primary {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 6px 12px;
  background: #2563eb;
  color: #ffffff !important;
  border-radius: 7px;
  font-size: 0.8rem;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.15s ease;
  box-shadow: 0 1px 3px rgba(37, 99, 235, 0.2);
  white-space: nowrap;
  box-sizing: border-box;
}

.rc-btn-primary:hover {
  background: #1d4ed8;
}

.rc-btn-alt,
.rc-btn-sms {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 6px 10px;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 7px;
  text-decoration: none !important;
  border: 1px solid var(--contentL, #cbd5e1);
  background: var(--contentBs, #f8fafc);
  color: var(--headC, #334155);
  cursor: pointer;
  transition: all 0.15s ease;
  white-space: nowrap;
  box-sizing: border-box;
}

.rc-btn-alt:hover,
.rc-btn-sms:hover {
  background: var(--contentB, #ffffff);
  border-color: #2563eb;
  color: #2563eb;
}

/* Empty State */
.results-empty-box {
  text-align: center;
  padding: 48px 20px;
  background: var(--contentBs, #f8fafc);
  border: 1px dashed var(--contentL, #cbd5e1);
  border-radius: 14px;
  margin: 18px 0;
}

.results-empty-box .empty-icon {
  font-size: 2.2rem;
  margin-bottom: 8px;
}

.results-empty-box h4 {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--headC, #0f172a);
  margin: 0 0 6px;
}

.results-empty-box p {
  font-size: 0.9rem;
  color: var(--bodyCa, #64748b);
  margin: 0 0 16px;
}

.results-reset-btn {
  padding: 8px 18px;
  background: #2563eb;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
}

/* SMS Modal */
.results-sms-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(15, 23, 42, 0.65);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  box-sizing: border-box;
}

.results-sms-modal-box {
  background: var(--contentB, #ffffff);
  border-radius: 18px;
  width: 100%;
  max-width: 520px;
  box-shadow: 0 20px 40px -8px rgba(0, 0, 0, 0.25);
  border: 1px solid var(--contentL, #e2e8f0);
  overflow: hidden;
  animation: modalPopIn 0.22s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes modalPopIn {
  from { opacity: 0; transform: scale(0.94); }
  to { opacity: 1; transform: scale(1); }
}

.sms-modal-header {
  padding: 16px 20px;
  border-bottom: 1px solid var(--contentL, #e2e8f0);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.sms-modal-title-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
}

.sms-icon-pill {
  font-size: 1.25rem;
}

.sms-modal-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--headC, #0f172a);
  margin: 0;
}

.sms-modal-close {
  background: none;
  border: none;
  font-size: 1.2rem;
  color: #94a3b8;
  cursor: pointer;
  padding: 4px 8px;
}

.sms-modal-body {
  padding: 22px 20px;
}

.sms-exam-name {
  font-size: 1.05rem;
  font-weight: 700;
  color: #2563eb;
  margin: 0 0 12px;
}

.sms-format-display {
  background: var(--contentBs, #f8fafc);
  border: 1px solid var(--contentL, #e2e8f0);
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 14px;
}

.sms-label {
  font-size: 0.76rem;
  font-weight: 700;
  color: var(--bodyCa, #64748b);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  display: block;
  margin-bottom: 4px;
}

.sms-format-text {
  font-size: 0.92rem;
  color: var(--headC, #0f172a);
  line-height: 1.5;
  margin: 0;
  font-weight: 600;
}

.sms-copy-section {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
}

.sms-copy-input {
  flex: 1;
  padding: 10px 14px;
  background: var(--contentBs, #f1f5f9);
  border: 1px solid var(--contentL, #cbd5e1);
  border-radius: 8px;
  font-family: monospace;
  font-size: 0.95rem;
  color: var(--headC, #0f172a);
  outline: none;
}

.sms-copy-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  background: #2563eb;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease;
  white-space: nowrap;
}

.sms-copy-btn:hover {
  background: #1d4ed8;
}

.sms-modal-tips {
  background: rgba(245, 158, 11, 0.08);
  border-left: 3px solid #f59e0b;
  padding: 10px 12px;
  border-radius: 0 8px 8px 0;
}

.sms-modal-tips p {
  font-size: 0.8rem;
  color: var(--bodyCa, #475569);
  margin: 0;
  line-height: 1.45;
}

.sms-modal-footer {
  padding: 12px 20px;
  border-top: 1px solid var(--contentL, #e2e8f0);
  text-align: right;
  background: var(--contentBs, #f8fafc);
}

.btn-sms-done {
  padding: 8px 20px;
  background: #334155;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
}

/* Dark Mode Support */
.dark-mode .results-hub-container,
.drK .results-hub-container,
[data-theme="dark"] .results-hub-container {
  background: #1e293b !important;
  border-color: #334155 !important;
}

.dark-mode .result-card,
.drK .result-card,
[data-theme="dark"] .result-card {
  background: #0f172a !important;
  border-color: #334155 !important;
}

.dark-mode .results-search-input,
.drK .results-search-input,
[data-theme="dark"] .results-search-input {
  background: #0f172a !important;
  border-color: #334155 !important;
  color: #f8fafc !important;
}

.dark-mode .results-tab-btn,
.drK .results-tab-btn,
[data-theme="dark"] .results-tab-btn {
  background: #0f172a !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

.dark-mode .rc-btn-alt,
.dark-mode .rc-btn-sms,
.drK .rc-btn-alt,
.drK .rc-btn-sms,
[data-theme="dark"] .rc-btn-alt,
[data-theme="dark"] .rc-btn-sms {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #cbd5e1 !important;
}

.dark-mode .results-sms-modal-box,
.drK .results-sms-modal-box,
[data-theme="dark"] .results-sms-modal-box {
  background: #1e293b !important;
  border-color: #334155 !important;
}

.dark-mode .sms-format-display,
.dark-mode .sms-copy-input,
.drK .sms-format-display,
.drK .sms-copy-input,
[data-theme="dark"] .sms-format-display,
[data-theme="dark"] .sms-copy-input {
  background: #0f172a !important;
  border-color: #334155 !important;
  color: #f1f5f9 !important;
}

.dark-mode .sms-modal-footer,
.drK .sms-modal-footer,
[data-theme="dark"] .sms-modal-footer {
  background: #0f172a !important;
  border-color: #334155 !important;
}

@media (max-width: 640px) {
  .results-hub-section {
    padding: 12px 0 20px;
  }
  .results-hub-container {
    padding: 14px 10px;
    border-radius: 12px;
  }
  .results-hub-header {
    margin-bottom: 12px;
  }
  .results-badge {
    padding: 2px 8px;
    font-size: 0.7rem;
    margin-bottom: 4px;
  }
  .results-title {
    font-size: 1.15rem;
    margin-bottom: 4px;
  }
  .results-subtitle {
    font-size: 0.75rem;
    line-height: 1.35;
  }
  .results-search-box {
    height: 36px;
    margin-bottom: 8px;
    padding-left: 10px;
  }
  .results-search-input {
    font-size: 0.78rem;
  }
  .results-tabs-nav {
    gap: 5px;
    padding-bottom: 4px;
    margin-bottom: 10px;
  }
  .results-tab-btn {
    padding: 4px 10px;
    font-size: 0.74rem;
  }
  .results-grid {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .result-card {
    padding: 10px 11px;
    border-radius: 10px;
    gap: 6px;
  }
  .rc-header {
    gap: 8px;
    margin-bottom: 2px;
  }
  .rc-icon-wrap {
    width: 32px;
    height: 32px;
    border-radius: 8px;
  }
  .rc-icon-wrap svg {
    width: 17px;
    height: 17px;
  }
  .rc-authority {
    font-size: 0.72rem;
    font-weight: 500;
  }
  .rc-badge {
    font-size: 0.68rem;
    font-weight: 700;
    padding: 2px 7px;
  }
  .rc-title {
    font-size: 0.95rem;
    font-weight: 700;
    margin-bottom: 3px;
    line-height: 1.35;
  }
  .rc-desc {
    font-size: 0.78rem;
    line-height: 1.45;
    display: block;
    margin: 0 0 6px;
    color: var(--bodyCa, #64748b);
  }
  .rc-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
  }
  .rc-btn-primary {
    flex: 1.2;
    padding: 7px 10px;
    font-size: 0.78rem;
    font-weight: 600;
    gap: 5px;
  }
  .rc-btn-alt,
  .rc-btn-sms {
    padding: 7px 10px;
    font-size: 0.76rem;
    font-weight: 600;
    gap: 4px;
  }
  .rc-btn-alt svg,
  .rc-btn-sms svg {
    width: 13px !important;
    height: 13px !important;
  }
}


/* ==========================================================================
   Colorful Education Finder Hero Chips
   ========================================================================== */
.edu-quick-tag.sb-chip-blue {
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  border: 1px solid #bfdbfe !important;
}
.edu-quick-tag.sb-chip-blue:hover {
  background: #2563eb !important;
  color: #ffffff !important;
  border-color: #2563eb !important;
}

.edu-quick-tag.sb-chip-purple {
  background: #faf5ff !important;
  color: #7e22ce !important;
  border: 1px solid #e9d5ff !important;
}
.edu-quick-tag.sb-chip-purple:hover {
  background: #9333ea !important;
  color: #ffffff !important;
  border-color: #9333ea !important;
}

.edu-quick-tag.sb-chip-emerald {
  background: #ecfdf5 !important;
  color: #047857 !important;
  border: 1px solid #a7f3d0 !important;
}
.edu-quick-tag.sb-chip-emerald:hover {
  background: #10b981 !important;
  color: #ffffff !important;
  border-color: #10b981 !important;
}

.edu-quick-tag.sb-chip-cyan {
  background: #ecfeff !important;
  color: #0e7490 !important;
  border: 1px solid #a5f3fc !important;
}
.edu-quick-tag.sb-chip-cyan:hover {
  background: #06b6d4 !important;
  color: #ffffff !important;
  border-color: #06b6d4 !important;
}

.edu-quick-tag.sb-chip-rose {
  background: #fff1f2 !important;
  color: #be123c !important;
  border: 1px solid #fecdd3 !important;
}
.edu-quick-tag.sb-chip-rose:hover {
  background: #f43f5e !important;
  color: #ffffff !important;
  border-color: #f43f5e !important;
}

.edu-quick-tag.sb-chip-amber {
  background: #fffbeb !important;
  color: #b45309 !important;
  border: 1px solid #fde68a !important;
}
.edu-quick-tag.sb-chip-amber:hover {
  background: #f59e0b !important;
  color: #ffffff !important;
  border-color: #f59e0b !important;
}

.edu-quick-tag.sb-chip-violet {
  background: #f5f3ff !important;
  color: #6d28d9 !important;
  border: 1px solid #ddd6fe !important;
}
.edu-quick-tag.sb-chip-violet:hover {
  background: #7c3aed !important;
  color: #ffffff !important;
  border-color: #7c3aed !important;
}

.edu-quick-tag.sb-chip-teal {
  background: #f0fdfa !important;
  color: #0f766e !important;
  border: 1px solid #99f6e4 !important;
}
.edu-quick-tag.sb-chip-teal:hover {
  background: #14b8a6 !important;
  color: #ffffff !important;
  border-color: #14b8a6 !important;
}

/* Dark mode overrides for hero chips */
.dark-mode .edu-quick-tag.sb-chip-blue, [data-theme="dark"] .edu-quick-tag.sb-chip-blue {
  background: rgba(37, 99, 235, 0.18) !important; color: #93c5fd !important; border-color: rgba(59, 130, 246, 0.4) !important;
}
.dark-mode .edu-quick-tag.sb-chip-purple, [data-theme="dark"] .edu-quick-tag.sb-chip-purple {
  background: rgba(147, 51, 234, 0.18) !important; color: #d8b4fe !important; border-color: rgba(168, 85, 247, 0.4) !important;
}
.dark-mode .edu-quick-tag.sb-chip-emerald, [data-theme="dark"] .edu-quick-tag.sb-chip-emerald {
  background: rgba(16, 185, 129, 0.18) !important; color: #6ee7b7 !important; border-color: rgba(16, 185, 129, 0.4) !important;
}
.dark-mode .edu-quick-tag.sb-chip-cyan, [data-theme="dark"] .edu-quick-tag.sb-chip-cyan {
  background: rgba(6, 182, 212, 0.18) !important; color: #67e8f9 !important; border-color: rgba(6, 182, 212, 0.4) !important;
}
.dark-mode .edu-quick-tag.sb-chip-rose, [data-theme="dark"] .edu-quick-tag.sb-chip-rose {
  background: rgba(244, 63, 94, 0.18) !important; color: #fda4af !important; border-color: rgba(244, 63, 94, 0.4) !important;
}
.dark-mode .edu-quick-tag.sb-chip-amber, [data-theme="dark"] .edu-quick-tag.sb-chip-amber {
  background: rgba(245, 158, 11, 0.18) !important; color: #fde047 !important; border-color: rgba(245, 158, 11, 0.4) !important;
}
.dark-mode .edu-quick-tag.sb-chip-violet, [data-theme="dark"] .edu-quick-tag.sb-chip-violet {
  background: rgba(139, 92, 246, 0.18) !important; color: #c4b5fd !important; border-color: rgba(139, 92, 246, 0.4) !important;
}
.dark-mode .edu-quick-tag.sb-chip-teal, [data-theme="dark"] .edu-quick-tag.sb-chip-teal {
  background: rgba(20, 184, 166, 0.18) !important; color: #5eead4 !important; border-color: rgba(20, 184, 166, 0.4) !important;
}