/* PURISCO catalog filters + single-ingredient lists. Base layout only; colours/fonts follow the Kit globals. */
.purisco-filter { --pf-ink: var(--e-global-color-primary, #0A6ED4); --pf-line: rgba(8, 41, 79, .18); --pf-text: var(--e-global-color-text, #08294F); }
.purisco-filter__label { display: block; margin: 0 0 8px; font-size: 14px; font-weight: 500; color: var(--pf-text); }
.purisco-filter__field { position: relative; display: block; }
.purisco-filter__input, .purisco-filter__select {
	box-sizing: border-box; width: 100%; min-height: 52px; margin: 0; padding: 0 48px 0 22px;
	border: 1px solid var(--pf-line); border-radius: 999px; background-color: #fff; color: var(--pf-text);
	font: inherit; font-size: 16px; line-height: 1.2;
}
.purisco-filter__select { padding-right: 44px; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2308294F' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 18px center; }
.purisco-filter__input::-webkit-search-cancel-button { -webkit-appearance: none; }
.purisco-filter__input:focus-visible, .purisco-filter__select:focus-visible { outline: 2px solid var(--pf-ink); outline-offset: 2px; }
.purisco-filter__clear {
	position: absolute; top: 50%; right: 6px; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; transform: translateY(-50%); padding: 0;
	border: 0; border-radius: 999px; background: transparent; color: var(--pf-text); cursor: pointer;
}
.purisco-filter__clear[hidden] { display: none; }
.purisco-filter__clear svg { fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; }
.purisco-filter--result { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; }
.purisco-filter--result:empty { display: none; }
.purisco-filter__result { margin: 0; color: var(--pf-text); }
.purisco-filter__reset { display: inline-flex; align-items: center; min-height: 44px; color: var(--pf-ink); font-weight: 500; }

/* Dynamic tag output (Text Editor widget) */
.purisco-technical { width: 100%; border-collapse: collapse; }
.purisco-technical th, .purisco-technical td { padding: 12px 16px 12px 0; border-bottom: 1px solid rgba(8, 41, 79, .12); text-align: left; vertical-align: top; }
.purisco-technical thead th { font-size: 13px; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; }
.purisco-technical tbody th { font-weight: 500; }
.purisco-documents { margin: 0; padding: 0; list-style: none; }
.purisco-documents__item { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; padding: 12px 0; border-bottom: 1px solid rgba(8, 41, 79, .12); }
.purisco-documents__type { font-weight: 500; }
.purisco-documents__download { margin-left: auto; display: inline-flex; align-items: center; min-height: 44px; }
.purisco-documents__state { margin-left: auto; opacity: .75; }

/* ---------------------------------------------------------------------------------------------------------------
   v0.5 catalog filters (Meir 2026-10-04, canvas "Catalog filters": desktop C look + D rail with collapsible groups,
   mobile A: search + Filters pill, side drawer). Buttons are scoped as ".purisco-cf button.x" so the Kit's global
   button style (".elementor-kit-6 button") does not restyle them.
   --------------------------------------------------------------------------------------------------------------- */
.purisco-cf, .purisco-cf-band {
	--pcf-navy: var(--e-global-color-text, #08294F); --pcf-blue: var(--e-global-color-primary, #0A6ED4); --pcf-blue-hover: #085EBD;
	--pcf-muted: #3A5573; --pcf-line: #C6DAEF; --pcf-rule: #DCE8F5; --pcf-tint: #EEF5FD; --pcf-band: #E4EFF9;
	--pcf-dots: radial-gradient(rgba(8, 41, 79, .075) .6px, transparent .7px);
	--pcf-ease: cubic-bezier(.22, .61, .36, 1);
}
.purisco-cf { color: var(--pcf-navy); font-family: inherit; }
.purisco-cf-sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.purisco-cf svg { fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }

/* Tinted top band with the fine dot texture of the home page's dark sections (navy dots on light). On the catalog
   the band also runs behind the header: the header takes the band colour until it sticks or the mobile menu opens. */
.purisco-cf-band, body.post-type-archive-purisco_ingredient .elementor-location-header {
	background-color: var(--pcf-band, #E4EFF9) !important;
	background-image: radial-gradient(rgba(8, 41, 79, .075) .6px, transparent .7px) !important;
	background-size: 3px 3px !important;
}
body.post-type-archive-purisco_ingredient .elementor-location-header .purisco-header-bar:not(.elementor-sticky--effects) { background-color: transparent !important; border-bottom-color: transparent !important; box-shadow: none !important; }
html.purisco-menu-open body.post-type-archive-purisco_ingredient .elementor-location-header .purisco-header-bar { background-color: #FFFFFF !important; }

/* Search capsule (C) + Filters pill (mobile A). */
.purisco-cf-search-row { display: flex; align-items: center; gap: 10px; width: 100%; }
.purisco-cf-search {
	position: relative; flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 10px; height: 56px; box-sizing: border-box;
	margin: 0; padding: 0 6px 0 22px; border: 1px solid transparent; border-radius: 7px; background: #FFFFFF;
	box-shadow: 0 1px 0 rgba(8, 41, 79, .06), 0 10px 28px rgba(8, 41, 79, .08); transition: border-color 180ms var(--pcf-ease), box-shadow 180ms var(--pcf-ease);
}
.purisco-cf-search:focus-within { border-color: var(--pcf-blue); box-shadow: 0 0 0 3px rgba(10, 110, 212, .16), 0 10px 28px rgba(8, 41, 79, .08); }
.purisco-cf-search__icon { flex: none; width: 20px; height: 20px; color: var(--pcf-muted); }
.purisco-cf .purisco-cf-search input.purisco-cf-search__input {
	flex: 1 1 auto; min-width: 0; width: auto; height: 100%; margin: 0; padding: 0; border: 0 !important; border-radius: 0; outline: 0; background: transparent !important;
	box-shadow: none !important; font: inherit; font-size: 16px; line-height: 1.2; color: var(--pcf-navy);
}
.purisco-cf-search__input::placeholder { color: #5F7690; opacity: 1; }
.purisco-cf-search__input::-webkit-search-cancel-button, .purisco-cf-search__input::-webkit-search-decoration { -webkit-appearance: none; appearance: none; }
.purisco-cf button.purisco-cf-search__clear, .purisco-cf button.purisco-cf-search__go {
	flex: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; min-height: 0; margin: 0; padding: 0;
	border: 0; border-radius: 7px; background: transparent; color: var(--pcf-muted); cursor: pointer; box-shadow: none; transform: none;
	transition: background-color 180ms var(--pcf-ease), color 180ms var(--pcf-ease);
}
.purisco-cf button.purisco-cf-search__clear[hidden] { display: none; }
.purisco-cf button.purisco-cf-search__clear:hover, .purisco-cf button.purisco-cf-search__clear:focus-visible { background: var(--pcf-tint); color: var(--pcf-navy); }
.purisco-cf button.purisco-cf-search__go { background: var(--pcf-blue); color: #FFFFFF; }
.purisco-cf button.purisco-cf-search__go:hover, .purisco-cf button.purisco-cf-search__go:focus-visible { background: var(--pcf-blue-hover); color: #FFFFFF; }
.purisco-cf button.purisco-cf-search__clear svg, .purisco-cf button.purisco-cf-search__go svg { width: 20px; height: 20px; }
.purisco-cf button:focus-visible, .purisco-cf a:focus-visible, .purisco-cf summary:focus-visible { outline: 2px solid var(--pcf-blue); outline-offset: 2px; }

.purisco-cf button.purisco-cf-toggle {
	flex: none; display: inline-flex; align-items: center; gap: 8px; height: 56px; min-height: 0; margin: 0; padding: 0 20px; box-sizing: border-box;
	border: 1px solid var(--pcf-line); border-radius: 7px; background: #FFFFFF; color: var(--pcf-navy); font: inherit; font-size: 16px; font-weight: 500; line-height: 1;
	cursor: pointer; box-shadow: none; transform: none; transition: border-color 180ms var(--pcf-ease);
}
.purisco-cf button.purisco-cf-toggle:hover, .purisco-cf button.purisco-cf-toggle:focus-visible { border-color: var(--pcf-navy); background: #FFFFFF; color: var(--pcf-navy); }
.purisco-cf button.purisco-cf-toggle[hidden] { display: none; }
.purisco-cf-toggle__count { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 6px; box-sizing: border-box; border-radius: 999px; background: var(--pcf-blue); color: #FFFFFF; font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.purisco-cf-toggle__count[hidden] { display: none; }
@media (min-width: 1025px) { .purisco-cf button.purisco-cf-toggle { display: none !important; } }
@media (max-width: 767px) { .purisco-cf button.purisco-cf-search__go { display: none; } .purisco-cf-search { padding: 0 4px 0 18px; } }

/* Filter panel: rail on desktop (D), collapsible groups. */
.purisco-cf-panel { position: sticky; top: 24px; display: flex; flex-direction: column; }
.purisco-cf-panel__head, .purisco-cf-panel__foot { display: none; }
.purisco-cf-panel__form { margin: 0; }
.purisco-cf-group { border-bottom: 1px solid var(--pcf-rule); }
.purisco-cf-group__title {
	display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 0 16px; cursor: pointer; list-style: none;
	font-size: 16px; font-weight: 600; color: var(--pcf-navy); border-radius: 12px;
}
.purisco-cf-group__title::-webkit-details-marker { display: none; }
.purisco-cf-group__title svg { flex: none; width: 18px; height: 18px; transition: transform 200ms var(--pcf-ease); }
.purisco-cf-group[open] > .purisco-cf-group__title svg { transform: rotate(180deg); }
.purisco-cf-group__list { display: flex; flex-direction: column; gap: 4px; min-width: 0; margin: 0; padding: 0 0 14px; border: 0; }
.purisco-cf-option {
	position: relative; display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 0 16px; border-radius: 7px; cursor: pointer;
	font-size: 16px; line-height: 1.25; color: var(--pcf-navy); transition: background-color 160ms var(--pcf-ease);
}
.purisco-cf-option:hover { background: var(--pcf-tint); }
.purisco-cf-option input {
	flex: none; width: 18px; height: 18px; margin: 0; box-sizing: border-box; border: 1.5px solid #8AA9CF; border-radius: 999px; background: #FFFFFF;
	-webkit-appearance: none; appearance: none; display: grid; place-content: center; cursor: pointer;
}
.purisco-cf-option input::before { content: ''; width: 8px; height: 8px; border-radius: 999px; background: var(--pcf-blue); transform: scale(0); transition: transform 160ms var(--pcf-ease); }
.purisco-cf-option input:checked { border-color: var(--pcf-blue); }
.purisco-cf-option input:checked::before { transform: scale(1); }
.purisco-cf-option input:focus-visible { outline: 2px solid var(--pcf-blue); outline-offset: 2px; }
.purisco-cf-option:has(input:checked) { background: var(--pcf-tint); font-weight: 600; }
.purisco-cf-option__name { flex: 1 1 auto; min-width: 0; }
.purisco-cf-option__count { flex: none; font-size: 14px; font-weight: 400; color: var(--pcf-muted); font-variant-numeric: tabular-nums; }
.purisco-cf-apply { margin-top: 16px; }

/* Result line + removable chips for the active search/filters. */
.purisco-cf-result { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; min-height: 44px; }
.purisco-cf-result__line { margin: 0; font-size: 15px; color: var(--pcf-muted); }
.purisco-cf-result__line:empty { display: none; }
.purisco-cf-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.purisco-cf a.purisco-cf-chip {
	display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 12px 0 14px; border-radius: 7px; background: var(--pcf-tint);
	color: var(--pcf-navy); font-size: 14px; font-weight: 500; text-decoration: none; transition: background-color 160ms var(--pcf-ease);
}
.purisco-cf a.purisco-cf-chip:hover { background: #DCEAF8; color: var(--pcf-navy); }
.purisco-cf a.purisco-cf-chip svg { width: 14px; height: 14px; }
.purisco-cf a.purisco-cf-reset, .purisco-cf a.purisco-cf-panel__clear { display: inline-flex; align-items: center; min-height: 44px; font-size: 15px; font-weight: 500; color: var(--pcf-blue); text-decoration: none; }
.purisco-cf a.purisco-cf-reset:hover, .purisco-cf a.purisco-cf-panel__clear:hover { color: var(--pcf-blue-hover); }

/* Tablet + mobile: the panel becomes an off-canvas drawer from the right (only once catalog.js has armed it;
   without JS the groups stay in the page with an Apply button). */
@media (max-width: 1024px) {
	.purisco-cf-panel { position: static; }
	.purisco-cf-panel.is-drawer {
		position: fixed; top: 0; right: 0; bottom: 0; z-index: 10000; width: min(360px, 88vw); box-sizing: border-box; background: #FFFFFF;
		box-shadow: -18px 0 40px rgba(8, 41, 79, .18); transform: translateX(100%); visibility: hidden;
		transition: transform 280ms var(--pcf-ease), visibility 0s linear 280ms;
		padding-top: env(safe-area-inset-top, 0px);
	}
	.purisco-cf-panel.is-drawer.is-open { transform: none; visibility: visible; transition: transform 280ms var(--pcf-ease); }
	.purisco-cf-panel.is-drawer .purisco-cf-panel__head { display: flex; flex: none; align-items: center; justify-content: space-between; height: 68px; padding: 0 12px 0 24px; border-bottom: 1px solid var(--pcf-rule); }
	.purisco-cf-panel.is-drawer .purisco-cf-panel__form { flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; padding: 12px 12px 20px; }
	.purisco-cf-panel.is-drawer .purisco-cf-panel__foot { display: flex; flex: none; align-items: center; gap: 12px; padding: 14px 16px calc(18px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--pcf-rule); }
	.purisco-cf-panel__title { margin: 0; font-family: 'Newsreader', 'Times New Roman', serif; font-size: 28px; font-weight: 500; line-height: 1.1; color: var(--pcf-navy); }
	.purisco-cf button.purisco-cf-panel__close {
		display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 7px;
		background: transparent; color: var(--pcf-navy); cursor: pointer; box-shadow: none; transform: none;
	}
	.purisco-cf button.purisco-cf-panel__close:hover, .purisco-cf button.purisco-cf-panel__close:focus-visible { background: var(--pcf-tint); color: var(--pcf-navy); }
	.purisco-cf button.purisco-cf-panel__close svg { width: 22px; height: 22px; }
	.purisco-cf a.purisco-cf-panel__clear { padding: 0 8px; }
	.purisco-cf button.purisco-cf-panel__show {
		flex: 1 1 auto; height: 56px; min-height: 0; margin: 0; padding: 0 20px; border: 0; border-radius: 7px; background: var(--pcf-blue); color: #FFFFFF;
		font: inherit; font-size: 16px; font-weight: 600; cursor: pointer; box-shadow: none; transform: none;
	}
	.purisco-cf button.purisco-cf-panel__show:hover, .purisco-cf button.purisco-cf-panel__show:focus-visible { background: var(--pcf-blue-hover); color: #FFFFFF; }
	.purisco-cf-scrim { position: fixed; inset: 0; z-index: 9999; background: rgba(8, 41, 79, .45); opacity: 0; transition: opacity 280ms var(--pcf-ease); }
	.purisco-cf-scrim.is-open { opacity: 1; }
	html.purisco-cf-locked, html.purisco-cf-locked body { overflow: hidden; }
}
@media (min-width: 1025px) { .purisco-cf-scrim { display: none; } }
@media (prefers-reduced-motion: reduce) {
	.purisco-cf-panel.is-drawer, .purisco-cf-panel.is-drawer.is-open, .purisco-cf-scrim, .purisco-cf-group__title svg, .purisco-cf-option input::before { transition: none; }
}

/* Molecular loader while results load (moved from Elementor Custom Code 60 so the plugin owns catalog filtering). */
.purisco-catalog__list { position: relative; }
.purisco-catalog__list > .elementor-element { transition: opacity 200ms var(--pcf-ease, ease); }
.purisco-catalog__list.is-entering > .elementor-element { opacity: 0; }
.purisco-catalog__list.is-loading > .elementor-element { visibility: hidden; }
/* Live search: the current rows stay in place, dimmed, while the next result loads (no blank flash per keystroke). */
.purisco-catalog__list.is-loading.is-live > .elementor-element { visibility: visible; opacity: .4; }
.purisco-loader { position: absolute; left: 50%; top: 50%; z-index: 5; width: 80px; height: 80px; margin: -40px 0 0 -40px; pointer-events: none; opacity: 0; visibility: hidden; transition: opacity 200ms ease-out, visibility 0s linear 200ms; }
.purisco-catalog__list.is-loading .purisco-loader { opacity: 1; visibility: visible; transition: opacity 150ms ease-out; }
.purisco-loader svg { display: block; width: 80px; height: 80px; overflow: visible; fill: #04203B; stroke: none; }
.purisco-loader__arm { transform-box: view-box; transform-origin: 590px 811px; animation: purisco-orbit 2400ms linear infinite; }
.purisco-loader__arm--sm { animation-direction: reverse; }
@keyframes purisco-orbit { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .purisco-loader__arm { animation: none; } .purisco-loader { transition: none; } .purisco-catalog__list > .elementor-element { transition: none; } }