/* Sobuj Sylhet brand override — green accent (#0f9d58).
   Corporate Sangbad's styles.css uses a red (#ff2028 / #ea2028) accent in 20
   rules. This file re-skins the *entire* public site to the Sobuj Sylhet green
   identity without editing the inherited stylesheet. Loaded after styles.css
   so these declarations win. Failure to cover every hook leaves stray red,
   which is what made the design look broken. */

:root {
  --sobuj-green: #0f9d58;
  --sobuj-green-dark: #0b7a43;
}

/* Logo height -> 60px (corporate default was 70px / 40px mobile) */
.logo img {
  height: 60px;
}
@media (max-width: 768px) {
  .logo img {
    height: 60px;
    max-height: 60px;
  }
}
/* Converter page logo */
.header-logo {
  height: 60px;
  width: auto;
}

/* --- Brand text accents (was red) --- */
.nayem,
.subtitle {
  color: var(--sobuj-green);
}

/* Top nav: hover background + dropdown hover (was red) */
.navbar-item:hover {
  color: #fff;
  background-color: var(--sobuj-green);
  cursor: pointer;
}
.dropdown-menu li:hover {
  color: var(--sobuj-green);
}

/* Header button + icon gradient (was red gradient) */
.header-button a:hover {
  color: var(--sobuj-green);
}
#icon {
  font-size: 1em;
  background: -webkit-linear-gradient(var(--sobuj-green), var(--sobuj-green-dark));
  background: linear-gradient(var(--sobuj-green), var(--sobuj-green-dark));
  background-clip: border-box;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-left: -5px;
}

/* Search: active input border + mobile search button (was red) */
.desktop-search-input.active {
  border-bottom: 2px solid var(--sobuj-green);
}
.mobile-search button {
  background-color: var(--sobuj-green);
}

/* Category label + article title hover (was red) */
.news-category {
  color: var(--sobuj-green);
  text-decoration-color: var(--sobuj-green);
}
.article-link:hover .text-card h1,
.article-link:hover .text-card-child h1 {
  color: var(--sobuj-green);
}

/* Pagination hover (was red) */
.pagination li:hover,
.pagination a:hover {
  color: var(--sobuj-green);
}

/* Scrolling ticker links (was red) */
.scroll-text-link:hover,
.scroll-text-link:not(:last-child)::after {
  color: var(--sobuj-green);
}

/* E-paper widget block (was red background) */
.epaper-widget {
  background-color: var(--sobuj-green);
}

/* Calendar widget: header hover, select focus, day hover, selected (was red) */
.cal-header button:hover {
  background: var(--sobuj-green);
}
.cal-selectors select:focus {
  border-color: var(--sobuj-green);
}
.cal-days div:hover:not(.empty):not(.selected) {
  color: var(--sobuj-green);
}
.cal-days .selected {
  background: var(--sobuj-green) !important;
}

/* Generic red-glow reuse kept for brand consistency */
.red-glow {
  color: var(--sobuj-green);
}

/* --- Remaining brand-red hooks not in the .main-grid / accent list. --- */

/* Section title underline accent (was #b32819 brownish-red) */
.container-title {
  border-bottom-color: var(--sobuj-green);
}

/* Misc menu link hover background (was `red`) */
.misc a:hover {
  background-color: var(--sobuj-green);
  color: white;
}

/* Scrolling ticker title bar (was red gradient rgb(255,32,40)→rgb(200,34,34)) */
.scroll-title {
  background: linear-gradient(90deg, var(--sobuj-green) 0%, var(--sobuj-green-dark) 100%);
}

/* --- Homepage grid placement: match the OLD Sobuj Sylhet layout. ---
   The migrated homepage reuses old-sobujsylhet's markup and .main-grid-1..16
   class names, but the inherited corporate styles.css defines a DIFFERENT
   .main-grid-* placement map, which mis-positions the cards. Overriding the
   placement here (after styles.css) restores the old Sobuj layout without
   forking corporate's stylesheet. */
.main-grid-1 { grid-column: 1 / 3; grid-row: 1 / 2; }
.main-grid-2 { grid-column: 3 / 4; grid-row: 1 / 3; }
.main-grid-3 { grid-column: 4 / 5; grid-row: 1 / 3; display: flex; flex-direction: column; justify-content: space-between; }
.main-grid-4 { grid-column: 1 / 3; grid-row: 2 / 2; }
.main-grid-5 { grid-column: 1 / 2; grid-row: 3 / 4; }
.main-grid-6 { grid-column: 2 / 4; grid-row: 3 / 4; }
.main-grid-7 { grid-column: 4 / 5; grid-row: 3 / 4; }
.main-grid-8 { grid-column: 1 / 5; grid-row: 4 / 5; }
.main-grid-9 { grid-column: 1 / 3; grid-row: 5 / 6; }
.main-grid-10 { grid-column: 3 / 5; grid-row: 5 / 6; }
.main-grid-11 { grid-column: 1 / 2; grid-row: 6 / 7; }
.main-grid-12 { grid-column: 2 / 3; grid-row: 6 / 7; }
.main-grid-13 { grid-column: 3 / 4; grid-row: 6 / 7; }
.main-grid-14 { grid-column: 4 / 5; grid-row: 6 / 7; }
.main-grid-15 { grid-column: 1 / 3; grid-row: 7 / 8; }
.main-grid-16 { grid-column: 3 / 5; grid-row: 7 / 8; }