/*
 * Icons — the site's inline SVG line icons (config/icons.php, helper icon()).
 * They inherit the text colour and scale with the font size of their wrapper,
 * so the old emoji wrappers keep their sizes; the rules below only give each
 * place a colour and alignment that suits a line icon.
 */

svg.icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  flex-shrink: 0;
  vertical-align: -0.14em;
  overflow: visible;
}

/* Icon + text side by side */
.hero-badge, .hero-kicker, .blog-hero-badge, .see-all-link, .view-all-link,
.result-read, .search-trending-read, .cta-btn, .category-nav-link, .page-btn,
.chip, .mobile-nav-link, .footer-credits {
  align-items: center;
}
.hero-badge svg.icon, .hero-kicker svg.icon, .blog-hero-badge svg.icon { width: 1.05em; height: 1.05em; }
.see-all-link svg.icon, .view-all-link svg.icon, .result-read svg.icon,
.search-trending-read svg.icon, .cta-btn svg.icon, .category-nav-link svg.icon,
.page-btn svg.icon { margin-left: 0.3em; transition: transform 0.2s ease; }
a:hover > svg.icon:last-child,
a:hover .result-read svg.icon,
a:hover .search-trending-read svg.icon { transform: translateX(3px); }

/* Category icons take the category colour (--cc is set on each card) */
.bbc-emoji, .idx-cat-emoji, .cat-card-emoji, .icc-icon { color: var(--cc, #16a34a); }
.bbc-emoji, .idx-cat-emoji, .cat-card-emoji { display: inline-flex; line-height: 1; }
.icc-icon > span { display: inline-flex; font-size: 1.35rem; }
.nav-cat-icon, .chip-icon, .about-cat-icon { display: inline-flex; margin-right: 0.35em; }
.cat-card-arrow { display: inline-flex; }

/* Header / footer */
.search-close { display: inline-flex; align-items: center; justify-content: center; font-size: 1.1rem; }
.footer-heart { display: inline-flex; color: #ef4444; vertical-align: -0.12em; }
.footer-heart svg.icon { fill: currentColor; }

/* Home */
.page-home .trust-icon { display: inline-flex; color: #16a34a; }
.page-home .tip-icon { display: inline-flex; color: #0ea5e9; font-size: 1.15rem; }
.sidebar-icon { display: inline-flex; font-size: 1.15rem; color: #fff; }
.newsletter-icon-wrap { display: inline-flex; align-items: center; justify-content: center; }
.newsletter-icon-wrap svg.icon { width: 1.6rem; height: 1.6rem; }

/* Blogs */
.page-blogs .section-title { display: flex; align-items: center; gap: 0.4em; }
.page-blogs .section-title svg.icon { color: #f59e0b; width: 0.9em; height: 0.9em; }
.page-blogs #trending-heading svg.icon { color: #f97316; }
.empty-paw { display: inline-flex; font-size: 3rem; color: #16a34a; }

/* Category page */
.empty-emoji { display: inline-flex; color: #16a34a; }

/* Search */
.page-search .no-results-icon { color: #16a34a; }

/* About */
.page-about .section-icon-wrap { display: inline-flex; align-items: center; justify-content: center; color: #16a34a; }
.page-about .standard-icon { color: #16a34a; }
.page-about .cta-icon { display: inline-flex; color: #fff; }

/* Contact / privacy / disclaimer */
.page-contact .info-card span:has(> svg.icon) { display: inline-flex; }
.page-privacy .notice-icon { display: inline-flex; color: #16a34a; }
.toc-widget h3, .related-widget h3, .related-links-widget h3, .emergency-widget h3,
.page-contact h3:has(> svg.icon) { display: flex; align-items: center; gap: 0.45em; }
.toc-widget h3 svg.icon, .related-widget h3 svg.icon, .page-contact h3 svg.icon { color: #16a34a; }
.emergency-widget h3 svg.icon { color: #dc2626; }
