/*
Theme Name: EHS News (Astra Child)
Theme URI: https://ehsnews.digital/
Description: Neutraal, zakelijk child-theme op basis van Astra voor het EHS-nieuwsplatform. Werkt breed voor Environment, Health & Safety content zonder branche-specifieke kleurassociatie.
Author: EHS News
Template: astra
Version: 1.0.0
Text Domain: ehs-news-child
*/

/* ==========================================================================
   1. Kleurenpalet (neutraal zakelijk: marineblauw / leigrijs / wit)
   Overschrijft Astra's globale kleurvariabelen zodat header, knoppen,
   links en accenten site-breed consistent zijn, ongeacht welk EHS-thema
   (Environment / Health / Safety) het artikel behandelt.
   ========================================================================== */
:root {
	/* 0: donkerste kleur — koppen, hoofdnavigatie-tekst */
	--ast-global-color-0: #142433;
	/* 1: accentkleur — links, knoppen, actieve staten (gedempt leigrijs-teal, geen safety-oranje/environment-groen) */
	--ast-global-color-1: #3d5a6c;
	/* 2: hoofdtekstkleur */
	--ast-global-color-2: #33404a;
	/* 3: lichte achtergrond (secties, kaarten) */
	--ast-global-color-3: #f4f6f7;
	/* 4: wit / lichtste kleur */
	--ast-global-color-4: #ffffff;

	--ehs-border-color: #e1e6e9;
	--ehs-muted-text: #667380;
}

body {
	color: var(--ast-global-color-2);
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

h1, h2, h3, h4, h5, h6,
.entry-title, .site-title {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	font-weight: 700;
	color: var(--ast-global-color-0);
	letter-spacing: -0.01em;
}

a {
	color: var(--ast-global-color-1);
}

/* ==========================================================================
   2. Header — sober en zakelijk, geen felle kleuren of schaduweffecten
   ========================================================================== */
.ast-primary-header-bar,
.site-header {
	background-color: var(--ast-global-color-4);
	border-bottom: 1px solid var(--ehs-border-color);
}

.main-header-menu .menu-item > .menu-link {
	font-weight: 500;
	color: var(--ast-global-color-0);
}

.main-header-menu .menu-item > .menu-link:hover,
.main-header-menu .current-menu-item > .menu-link {
	color: var(--ast-global-color-1);
}

/* ==========================================================================
   3. Knoppen
   ========================================================================== */
.ast-button,
button,
.wp-block-button__link {
	background-color: var(--ast-global-color-0);
	border-radius: 4px;
	font-weight: 600;
	letter-spacing: 0.01em;
}

.ast-button:hover,
button:hover,
.wp-block-button__link:hover {
	background-color: var(--ast-global-color-1);
}

/* ==========================================================================
   4. EHS-specifieke onderdelen: categorie-badges en bronvermelding
   Gebruikt door de n8n/Claude-contentpipeline gegenereerde artikelen
   (zie prompts/categorization-prompt.md — Type content / Branche / Ernst / Thema).
   ========================================================================== */
.ehs-category-badge {
	display: inline-block;
	padding: 0.2em 0.75em;
	font-size: 0.75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--ast-global-color-1);
	background-color: var(--ast-global-color-3);
	border: 1px solid var(--ehs-border-color);
	border-radius: 3px;
	margin-right: 0.4em;
}

.ehs-source-note {
	margin-top: 2em;
	padding-top: 1em;
	border-top: 1px solid var(--ehs-border-color);
	color: var(--ehs-muted-text);
	font-size: 0.9rem;
	font-style: italic;
}

.ehs-ai-disclaimer {
	background-color: var(--ast-global-color-3);
	border-left: 3px solid var(--ast-global-color-1);
	padding: 0.9em 1.2em;
	font-size: 0.85rem;
	color: var(--ehs-muted-text);
	margin: 1.5em 0;
}

/* ==========================================================================
   5. Footer
   ========================================================================== */
.site-footer,
.ast-small-footer {
	background-color: var(--ast-global-color-0);
	color: var(--ast-global-color-4);
}

.site-footer a,
.ast-small-footer a {
	color: var(--ast-global-color-4);
	opacity: 0.85;
}

.site-footer a:hover,
.ast-small-footer a:hover {
	opacity: 1;
}