/* ============================================================
 * Weltechniek — GLOBAL CSS
 *
 * Site-brede, thema-onafhankelijke presentatielaag. Hierin hoort
 * alles wat OVERAL geldt en nergens specifiek thuishoort:
 *  - Design tokens (merkkleuren + status) — canonieke bron, brug
 *    naar theme.json bij de latere block-theme-migratie.
 *  - WC-meldingen (notices) in block-banner-stijl.
 *  - Checkboxen in huisstijl (native, site-breed).
 *
 * Geenqueued via wt_global_css() in functions.php met filemtime()
 * -> automatische cache-busting, geen handmatige versie-bump.
 *
 * NB: header.css definieert (voorlopig) dezelfde merk-tokens nog in
 * z'n eigen :root. Bewust gedupliceerd tijdens de overgang; bij de
 * opruim-/migratieronde verdwijnt de kopie daar en wordt dit de enige
 * bron. Identieke waarden -> geen conflict in de tussentijd.
 * ============================================================ */

:root {
	/* ---- Merk ---- */
	--wt-blue:        #1e3a6d;  /* navy - primair */
	--wt-blue-soft:   #f2f7fc;
	--wt-green:       #00bb00;
	--wt-green-hover: #008d00;

	/* ---- Status (notices) ---- */
	--wt-notice-text:         #1e2733;
	--wt-notice-error-bg:     #fdecec;
	--wt-notice-error-border: #e0413d;
	--wt-notice-ok-bg:        #edf7ee;
	--wt-notice-ok-border:    #2e9a44;
	--wt-notice-info-bg:      #eef2f9;
	--wt-notice-info-border:  var(--wt-blue);
}

/* ============================================================
 * WC-meldingen (notices) - block-banner-stijl
 * (lichte bg, gekleurde rand, icoon links, donkere tekst) i.p.v. de
 * classic massieve stijl. Geldt voor fout/succes/info op alle pagina's
 * (checkout, winkelwagen, account, shop...). Knoppen (.button) ongemoeid.
 * ============================================================ */
.woocommerce-error,
.woocommerce-message,
.woocommerce-info {
	list-style: none;
	/* !important: WC-core + Shoptimizer zetten hun eigen notice-stijl (massief
	   gekleurde bg, witte tekst, radius) op dezelfde selector, later geladen ->
	   anders winnen die. */
	margin: 0 0 16px !important;
	padding: 14px 18px 14px 52px !important;
	border: 1px solid !important;
	border-radius: 8px !important;
	color: var(--wt-notice-text) !important;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.5;
	background-repeat: no-repeat !important;
	background-position: 18px center !important;
	background-size: 22px 22px !important;
	box-shadow: none !important;
	text-shadow: none !important;
}
.woocommerce-error li,
.woocommerce-message li,
.woocommerce-info li {
	list-style: none;
	margin: 0;
	padding: 0;
}
.woocommerce-error::before,
.woocommerce-message::before,
.woocommerce-info::before {
	content: none !important;
}
.woocommerce-error {
	background-color: var(--wt-notice-error-bg) !important;
	border-color: var(--wt-notice-error-border) !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10' fill='%23dc2626'/%3E%3Cpath d='M11 7h2v6h-2zm0 8h2v2h-2z' fill='%23fff'/%3E%3C/svg%3E") !important;
}
.woocommerce-message {
	background-color: var(--wt-notice-ok-bg) !important;
	border-color: var(--wt-notice-ok-border) !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10' fill='%2300871f'/%3E%3Cpath d='M7.5 12.5l3 3 6-6' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}
.woocommerce-info {
	background-color: var(--wt-notice-info-bg) !important;
	border-color: var(--wt-notice-info-border) !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10' fill='%231e3a6d'/%3E%3Cpath d='M11 10h2v7h-2zm0-3h2v2h-2z' fill='%23fff'/%3E%3C/svg%3E") !important;
}
.woocommerce-error a:not(.button),
.woocommerce-message a:not(.button),
.woocommerce-info a:not(.button) {
	color: inherit;
	font-weight: 600;
	text-decoration: underline;
}

/* ============================================================
 * Checkboxen in huisstijl - site-breed
 * Native checkboxen (cookie-banner, formulieren, plugins...) navy
 * aangevinkt i.p.v. browser-default. `accent-color` raakt alleen native
 * gerenderde checkboxen; WC-block-checkboxen (appearance:none, op
 * checkout/winkelwagen) houden hun styling in block-checkout.css.
 * ============================================================ */
input[type="checkbox"] {
	accent-color: var(--wt-blue);
}