/* ============================================================
   THEME 4 — "কম্প্যাক্ট" (Compact)
   Modelled on the dailynababani.com look: a dense, text-first
   portal — left-aligned logo on a soft grey masthead, a compact
   grey nav strip, red lead-in phrases on link lists, boxed white
   cards with square corners, and a numbered sidebar list using
   Bengali numerals.

   Scoped entirely under body.theme-4 so Themes 1/2/3 are never
   affected.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@400;500;600;700&family=Noto+Sans+Bengali:wght@400;500;600;700;800&display=swap');

:root {
    --t4-bg:       #eef1f3;   /* page behind the white cards */
    --t4-surface:  #ffffff;
    --t4-head:     #f0f2f4;   /* soft grey masthead */
    --t4-ink:      #14181c;
    --t4-body:     #454e57;
    --t4-muted:    #838f9a;
    --t4-red:      #e02020;   /* lead-in phrases, hover */
    --t4-blue:     #1a73c8;   /* active tab underline */
    --t4-line:     #dfe4e8;
    --t4-numeral:  #ccd3d9;   /* big grey list numerals */
}

/* ---- Base ---- */
body.theme-4 {
    background: var(--t4-bg) !important;
    color: var(--t4-body);
    font-family: 'Hind Siliguri', 'SolaimanLipi', 'Noto Sans Bengali', sans-serif !important;
    font-size: 16.5px;
    line-height: 1.65;
}
body.theme-4 h1, body.theme-4 h2, body.theme-4 h3,
body.theme-4 h4, body.theme-4 h5,
body.theme-4 .cat-title, body.theme-4 .section-title,
body.theme-4 .breaking-headline, body.theme-4 .slide-headline,
body.theme-4 .main-featured-headline, body.theme-4 .right-section-title {
    font-family: 'Noto Sans Bengali', 'Hind Siliguri', 'SolaimanLipi', sans-serif !important;
    color: var(--t4-ink);
    font-weight: 700;
    letter-spacing: -.1px;
}
body.theme-4 a { color: inherit; }
body.theme-4 a:hover { color: var(--t4-red); }

/* ---- Masthead: soft grey, logo left ---- */
body.theme-4 .primary-header-wrapper {
    background: var(--t4-head) !important;
    box-shadow: none !important;
    border-bottom: 1px solid var(--t4-line);
}
body.theme-4 .header-content-flex {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
body.theme-4 .brand-logo-container { flex: 0 0 auto; }
body.theme-4 .logo-image-element { max-height: 72px; width: auto; }
body.theme-4 .date-info-display {
    color: var(--t4-body);
    font-size: 13.5px;
    font-weight: 600;
}
body.theme-4 .search-input-box {
    border: 1px solid var(--t4-line) !important;
    border-radius: 3px;
    background: #fff;
}

/* ---- Navigation: compact grey strip ---- */
body.theme-4 .main-navigation-section,
body.theme-4 .nav-content-container {
    background: #e6eaee !important;
    border-top: 1px solid var(--t4-line);
    border-bottom: 1px solid #d3d9de !important;
    box-shadow: none !important;
}
body.theme-4 .nav-menu-item { border: none !important; }
body.theme-4 .nav-link-element {
    color: var(--t4-ink) !important;
    font-weight: 600;
    font-size: 1rem !important;
    padding: 11px 15px !important;
    background: transparent !important;
    transition: background .18s ease, color .18s ease;
}
body.theme-4 .nav-link-element:hover,
body.theme-4 .nav-link-element.active {
    background: #fff !important;
    color: var(--t4-red) !important;
}

/* ---- Ticker: white strip, red bullet before each item ---- */
body.theme-4 .news-ticker {
    background: #fff !important;
    border: 1px solid var(--t4-line) !important;
    border-radius: 0;
}
body.theme-4 .ticker-label {
    background: #fff !important;
    color: var(--t4-ink) !important;
    font-weight: 700;
    border-right: 1px solid var(--t4-line);
}
body.theme-4 .ticker-move a { color: var(--t4-ink) !important; font-weight: 500; }
body.theme-4 .ticker-move a::before {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--t4-red);
    margin-right: 8px;
    vertical-align: middle;
}
body.theme-4 .ticker-move a:hover { color: var(--t4-red) !important; }

/* ---- Cards: white, square, hairline border ---- */
body.theme-4 .breaking-news-box,
body.theme-4 .right-news-list,
body.theme-4 .grid-card,
body.theme-4 .center-news-card,
body.theme-4 .news-item,
body.theme-4 .latest-news-card,
body.theme-4 .cat-section,
body.theme-4 .main-featured {
    background: var(--t4-surface);
    border: 1px solid var(--t4-line) !important;
    border-radius: 3px;
    box-shadow: none !important;
}
body.theme-4 .grid-card img,
body.theme-4 .center-news-card img,
body.theme-4 .latest-news-card img,
body.theme-4 .main-featured-image img,
body.theme-4 .left-news-thumb img,
body.theme-4 .hero-slider .slide img {
    border-radius: 2px !important;
}

/* Left rail is a text-first link list: red lead-in, thin dividers */
body.theme-4 .left-news-list {
    background: var(--t4-surface);
    border: 1px solid var(--t4-line);
    border-radius: 3px;
    padding: 6px 12px;
}
body.theme-4 .left-news-item {
    border-bottom: 1px solid var(--t4-line) !important;
    border-radius: 0;
    padding: 11px 0 !important;
}
body.theme-4 .left-news-item:last-child { border-bottom: none !important; }
body.theme-4 .left-news-content h4,
body.theme-4 .left-news-content h4 a {
    color: var(--t4-ink) !important;
    font-weight: 600;
    line-height: 1.5;
}
body.theme-4 .left-news-content h4 a:hover { color: var(--t4-red) !important; }
body.theme-4 .left-news-meta { color: var(--t4-red) !important; font-weight: 600; font-size: 12.5px; }

body.theme-4 .breaking-badge {
    background: var(--t4-red) !important;
    color: #fff !important;
    border-radius: 2px;
    font-weight: 600;
}
body.theme-4 .breaking-desc,
body.theme-4 .main-featured-desc,
body.theme-4 .slide-desc { color: var(--t4-body) !important; }

/* ---- Section titles: solid red tab ---- */
body.theme-4 .cat-title,
body.theme-4 .section-title,
body.theme-4 .latest-news-header h2 {
    background: var(--t4-red) !important;
    color: #fff !important;
    display: inline-block;
    padding: 6px 18px !important;
    border-radius: 3px 3px 0 0;
    border: none !important;
    font-size: 1.15rem !important;
}

/* ---- Hero slider ---- */
body.theme-4 .hero-slider {
    border: 1px solid var(--t4-line) !important;
    border-radius: 3px;
    box-shadow: none !important;
}
body.theme-4 .slide-overlay {
    background: linear-gradient(to top, rgba(0,0,0,.85), rgba(0,0,0,.25) 60%, transparent) !important;
}
body.theme-4 .slide-headline { color: #fff !important; font-size: 1.45rem !important; line-height: 1.4 !important; }

/* ---- Right rail: tab head + Bengali-numbered list ---- */
body.theme-4 .right-news-list {
    padding: 0 14px 10px;
    counter-reset: t4item;          /* numerals below are generated from this */
}
body.theme-4 .right-section-title {
    display: block;
    background: transparent !important;
    color: var(--t4-ink) !important;
    border-bottom: 3px solid var(--t4-blue) !important;
    padding: 12px 0 8px !important;
    margin: 0 0 6px !important;
    font-size: 1.1rem !important;
}
body.theme-4 .right-news-item {
    position: relative;
    border-bottom: 1px solid var(--t4-line) !important;
    border-radius: 0;
    padding: 12px 52px 12px 0 !important;   /* room for the numeral on the right */
}
body.theme-4 .right-news-item:last-child { border-bottom: none !important; }
/* Big pale Bengali numeral, exactly like the reference's ১ ২ ৩ ৪ column */
body.theme-4 .right-news-item::after {
    counter-increment: t4item;
    content: counter(t4item, bengali);
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    font-family: 'Noto Sans Bengali', sans-serif;
    font-size: 34px;
    font-weight: 700;
    line-height: 1;
    color: var(--t4-numeral);
    pointer-events: none;
}
body.theme-4 .right-news-item a { color: var(--t4-ink) !important; font-weight: 600; }
body.theme-4 .right-news-item a:hover { color: var(--t4-red) !important; }
body.theme-4 .item-meta { color: var(--t4-red) !important; font-weight: 600; font-size: 12.5px; }
body.theme-4 .right-news-with-thumb {
    border-bottom: 1px solid var(--t4-line) !important;
    border-radius: 0;
}
body.theme-4 .ad-label { color: var(--t4-muted) !important; letter-spacing: 1px; }
body.theme-4 .load-more-latest-btn {
    background: var(--t4-blue) !important;
    border-radius: 3px !important;
    font-weight: 600;
}

/* ---- Category grids: three across ---- */
body.theme-4 .center-news-grid,
body.theme-4 .latest-news-grid,
body.theme-4 .cat-layout-1,
body.theme-4 .cat-layout-2,
body.theme-4 .cat-layout-3,
body.theme-4 .cat-layout-4,
body.theme-4 .cat-layout-5,
body.theme-4 .cat-layout-6 {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
}
body.theme-4 .cat-section { padding: 16px !important; margin-bottom: 26px; }

/* ---- Footer ---- */
body.theme-4 .footer-wrapper {
    background: #1b2229 !important;
    color: #d2d9df;
    border-top: 4px solid var(--t4-red) !important;
}
body.theme-4 .footer-logo {
    background: #ffffff !important;
    padding: 10px 18px;
    border-radius: 3px;
    display: inline-flex;
    align-items: center;
}
body.theme-4 .footer-description-section {
    background: rgba(255,255,255,.05) !important;
    border: 1px solid rgba(255,255,255,.10);
}
body.theme-4 .footer-description-section p,
body.theme-4 .footer-links ul li a,
body.theme-4 .footer-contact-row span,
body.theme-4 .footer-contact-row span a,
body.theme-4 .editorial-board-footer,
body.theme-4 .editorial-board-footer .editorial-row { color: #d2d9df !important; }
body.theme-4 .footer-links ul li a:hover,
body.theme-4 .footer-contact-row span a:hover { color: #ff9a9a !important; }
body.theme-4 .footer-links { border-bottom-color: rgba(255,255,255,.12) !important; }
body.theme-4 .footer-contact-row { border-color: rgba(255,255,255,.12) !important; }
body.theme-4 .footer-bottom {
    background: rgba(0,0,0,.3) !important;
    border-top: 1px solid rgba(255,255,255,.10);
}
body.theme-4 .footer-copyright p,
body.theme-4 .footer-editor p { color: #b6c0c9 !important; }
body.theme-4 .footer-editor p strong,
body.theme-4 .editorial-board-footer strong { color: #fff !important; }
body.theme-4 .editorial-board-footer h4 { color: #ff9a9a !important; }

/* ---- Article page ---- */
body.theme-4 .news-content-body,
body.theme-4 .news-content-body p,
body.theme-4 .news-content-body div,
body.theme-4 .news-content-body li {
    text-align: justify !important;
    color: #1c2229 !important;
}
body.theme-4 .site-ad-slot { background: #fff; border: 1px dashed var(--t4-line); padding: 8px; }
body.theme-4 .division-chip.active { background: var(--t4-red); border-color: var(--t4-red); }
body.theme-4 .division-filter-label { color: var(--t4-red); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 992px) {
    body.theme-4 { font-size: 16px; }
    body.theme-4 .logo-image-element { max-height: 54px; }
    body.theme-4 .center-news-grid,
    body.theme-4 .latest-news-grid,
    body.theme-4 .cat-layout-1,
    body.theme-4 .cat-layout-2,
    body.theme-4 .cat-layout-3,
    body.theme-4 .cat-layout-4,
    body.theme-4 .cat-layout-5,
    body.theme-4 .cat-layout-6 {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    body.theme-4 .slide-headline { font-size: 1.2rem !important; }
    body.theme-4 .right-news-item::after { font-size: 28px; }
}

@media (max-width: 600px) {
    body.theme-4 .logo-image-element { max-height: 42px; }
    body.theme-4 .date-info-display { display: none; }
    body.theme-4 .center-news-grid,
    body.theme-4 .latest-news-grid,
    body.theme-4 .cat-layout-1,
    body.theme-4 .cat-layout-2,
    body.theme-4 .cat-layout-3,
    body.theme-4 .cat-layout-4,
    body.theme-4 .cat-layout-5,
    body.theme-4 .cat-layout-6 {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }
    body.theme-4 .cat-section { padding: 12px !important; }
    body.theme-4 .cat-title,
    body.theme-4 .section-title { font-size: 1.05rem !important; padding: 5px 14px !important; }
    body.theme-4 .slide-headline { font-size: 1.02rem !important; }
    body.theme-4 .nav-link-element { padding: 10px 12px !important; font-size: .95rem !important; }
    /* The numeral would crowd a narrow line — shrink it and tighten the gutter */
    body.theme-4 .right-news-item { padding-right: 38px !important; }
    body.theme-4 .right-news-item::after { font-size: 24px; }
}