/* ===================================
   Blog list / category / tag / detail — brand colour roles
   Same system as the tours pages:
   BLUE  (#0174CD) = information & navigation: categories, tags, labels,
                     meta icons, widget headings, pagination, links
   GREEN (#019524) = action & positive: Read Article / Read More,
                     Subscribe, Post Comment, Featured badge
   Loaded by the four blog templates — remove their <link> to revert.
   =================================== */
:root {
    --bl-blue: var(--secondary-color, #0174CD);
    --bl-blue-dark: var(--secondary-dark, #045A9E);
    --bl-blue-soft: #E8F2FC;
    --bl-green: var(--primary-color, #019524);
    --bl-green-dark: var(--primary-dark, #017A1D);
}

/* ----- Section labels & widget headings ----- */
.section-label i { color: var(--bl-blue); }
.all-articles-heading span { color: var(--bl-blue); }
.widget-title { border-left-color: var(--bl-blue); }

/* ----- Categories sidebar: a selection, so blue ----- */
.cat-icon { color: var(--bl-blue); }
.category-pill-item.active a {
    background: var(--bl-blue);
    border-color: var(--bl-blue);
    color: #fff;
}
.category-pill-item:not(.active) a:hover { border-color: var(--bl-blue); color: var(--bl-blue); }
.category-pill-item:not(.active) .cat-count { background: var(--bl-blue-soft); color: var(--bl-blue); }

/* ----- Cards: labels, tags, author, links ----- */
.post-cat-badge { background: var(--bl-blue-soft); color: var(--bl-blue-dark); }
.post-cat-badge:hover { background: var(--bl-blue); color: #fff; }
.post-tag { color: var(--bl-blue); }
.post-tag:hover { color: var(--bl-blue-dark); }
.author-avatar-sm { background: var(--bl-blue); }
.featured-card-body h4 a:hover,
.blog-card-h-body h4 a:hover,
.recent-post-text h6 a:hover { color: var(--bl-blue); }
.card-action-btn:hover { background: var(--bl-blue); color: #fff; }
.post-meta-line i,
.post-date-txt i,
.read-time i,
.author-stat i { color: var(--bl-blue); }

/* Actions stay green */
.featured-badge,
.btn-read-article { background: var(--bl-green); }
.btn-read-article:hover { background: var(--bl-green-dark); }
.read-more-link { color: var(--bl-green); }
.read-more-link:hover { color: var(--bl-green-dark); }

/* ----- Sidebar widgets ----- */
.recent-post-thumb-placeholder { background: var(--bl-blue-soft); color: var(--bl-blue); }
.pop-tag { background: var(--bl-blue-soft); color: var(--bl-blue-dark); }
.pop-tag:hover { background: var(--bl-blue); color: #fff; }
/* Newsletter box: a blue → green brand gradient (it's the page's main
   call to action, so the button inside stays white with green text) */
.newsletter-widget { background: linear-gradient(135deg, var(--bl-blue) 0%, var(--bl-green) 100%); }

/* ----- Pagination ----- */
.pagination .page-link { color: var(--bl-blue); }
.pagination .page-link:hover { background: var(--bl-blue-soft); color: var(--bl-blue-dark); }
.pagination .page-item.active .page-link { background: var(--bl-blue); border-color: var(--bl-blue); color: #fff; }

/* ===== Post detail ===== */
.blog-detail .post-category { background: var(--bl-blue-soft); color: var(--bl-blue-dark); }
.blog-detail .post-category:hover { background: var(--bl-blue); color: #fff; }
.blog-detail .post-meta i { color: var(--bl-blue); }
.blog-detail .post-content blockquote { border-left-color: var(--bl-blue); background: var(--bl-blue-soft); }
.blog-detail .post-tags-row a.tag:hover { background: var(--bl-blue); color: #fff; }
.blog-detail .comment-avatar { background: var(--bl-blue); }
.blog-detail .comment-form .form-control:focus {
    border-color: var(--bl-blue);
    box-shadow: 0 0 0 3px rgba(1, 116, 205, 0.15);
}
.blog-detail .comment-form button { background: var(--bl-green); }
.blog-detail .comment-form button:hover { background: var(--bl-green-dark); }
.blog-detail .related-post-item .thumb-placeholder { background: var(--bl-blue-soft); color: var(--bl-blue); }
.blog-detail .related-post-item h6 a:hover { color: var(--bl-blue); }

/* Footer sky matches this page's last section */
:root { --footer-sky: #F9FAFB; }