/**
 * Bloom meta icons: a small line set (24px grid, 1.75 stroke) for post meta — date, updated, author, reading time,
 * category, tag. Opt-in: nothing shows until an element carries a class, so existing pages render unchanged.
 *
 *   <!-- wp:post-date {"className":"bloom-icon-calendar"} /-->   → calendar before the date
 *
 * The icon is a mask over currentColor, so it takes the text colour. Per site: --bloom-icon-size (default 1em),
 * --bloom-icon-gap (0.4em), --bloom-icon-opacity (1). A child theme can put an icon on markup it does not control
 * by reusing the variable: .pg-date::before { … mask-image: var(--bloom-icon-calendar); }
 *
 * @package Bloom
 */

:root {
	--bloom-icon-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='2.5'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E");
	--bloom-icon-updated: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19.5 11a7.5 7.5 0 0 0-13.4-4.2L4.5 8.5'/%3E%3Cpath d='M4.5 4v4.5H9'/%3E%3Cpath d='M4.5 13a7.5 7.5 0 0 0 13.4 4.2l1.6-1.7'/%3E%3Cpath d='M19.5 20v-4.5H15'/%3E%3C/svg%3E");
	--bloom-icon-author: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.75'/%3E%3Cpath d='M4.5 20.5c.8-3.9 3.8-6 7.5-6s6.7 2.1 7.5 6'/%3E%3C/svg%3E");
	--bloom-icon-clock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E");
	--bloom-icon-folder: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 7.5a2 2 0 0 1 2-2h4l2 2.5h7a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-13a2 2 0 0 1-2-2z'/%3E%3C/svg%3E");
	--bloom-icon-tag: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 12.1V5.5a2 2 0 0 1 2-2h6.6a2 2 0 0 1 1.4.6l7.4 7.4a2 2 0 0 1 0 2.8l-6.6 6.6a2 2 0 0 1-2.8 0l-7.4-7.4a2 2 0 0 1-.6-1.4z'/%3E%3Ccircle cx='8' cy='8' r='1.25'/%3E%3C/svg%3E");
}

.bloom-icon-calendar,
.bloom-icon-updated,
.bloom-icon-author,
.bloom-icon-clock,
.bloom-icon-folder,
.bloom-icon-tag {
	display: inline-flex;
	align-items: center;
	gap: var(--bloom-icon-gap, 0.4em);
}

.bloom-icon-calendar::before,
.bloom-icon-updated::before,
.bloom-icon-author::before,
.bloom-icon-clock::before,
.bloom-icon-folder::before,
.bloom-icon-tag::before {
	content: "";
	flex: none;
	width: var(--bloom-icon-size, 1em);
	height: var(--bloom-icon-size, 1em);
	background-color: currentColor;
	opacity: var(--bloom-icon-opacity, 1);
	-webkit-mask: var(--bloom-icon) center / contain no-repeat;
	mask: var(--bloom-icon) center / contain no-repeat;
}

.bloom-icon-calendar { --bloom-icon: var(--bloom-icon-calendar); }
.bloom-icon-updated { --bloom-icon: var(--bloom-icon-updated); }
.bloom-icon-author { --bloom-icon: var(--bloom-icon-author); }
.bloom-icon-clock { --bloom-icon: var(--bloom-icon-clock); }
.bloom-icon-folder { --bloom-icon: var(--bloom-icon-folder); }
.bloom-icon-tag { --bloom-icon: var(--bloom-icon-tag); }