/*
 * AI Prompt Manager — STRUCTURAL styles.
 *
 * Every rule lives in @layer apm and uses :where() (zero specificity), so ANY
 * theme or custom CSS outside a layer wins without !important.
 * Only layout, overflow, states and accessibility live here. Typography and
 * colour are inherited from the theme (theme.json presets with fallbacks).
 *
 * Public tokens (override on :root or any container):
 *   --apm-col          min column width (280px)
 *   --apm-gap          grid/flex gap
 *   --apm-space        inner spacing
 *   --apm-radius       corner radius (used by the cosmetic layer)
 *   --apm-prompt-max   max height of prompt blocks before scrolling
 *   --apm-prompt-font  font of prompt text
 *   --apm-mono         monospace stack
 */
@layer apm {
	:where(:root) {
		--apm-col: 280px;
		--apm-gap: var(--wp--style--block-gap, 1.5rem);
		--apm-space: var(--wp--preset--spacing--30, 1rem);
		--apm-radius: 6px;
		--apm-prompt-max: 28rem;
		--apm-mono: var(--wp--preset--font-family--monospace, ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace);
		--apm-prompt-font: var(--apm-mono);
	}

	/* Accessibility helpers */
	:where(.apm-sr) {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}

	/* Layout ---------------------------------------------------------- */

	/* Classic-theme wrapper only (block themes use their own constrained group).
	   Classic themes share no container class, so the plugin provides a neutral one. */
	:where(.apm-container) {
		box-sizing: border-box;
		max-width: var(--apm-container, var(--wp--style--global--wide-size, 1200px));
		margin-inline: auto;
		padding-inline: var(--apm-gutter, var(--wp--style--root--padding-left, 1.25rem));
		padding-block: var(--apm-gap);
	}

	:where(.apm-archive, .apm-single) {
		display: flex;
		flex-direction: column;
		gap: var(--apm-gap);
		min-width: 0;
	}

	:where(.apm-grid) {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(min(var(--apm-col), 100%), 1fr));
		gap: var(--apm-gap);
	}

	/* Result images on a single image prompt: 1 image = 100%, 2 = 50%, 3+ = 33.33%
	   of .apm-results (minus gaps). A grid keeps left-to-right order, so the
	   featured (first) image always leads. */
	:where(.apm-grid[data-layout="gallery"]) {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		align-items: start;
	}
	:where(.apm-grid[data-layout="gallery"][data-count="1"]) {
		grid-template-columns: minmax(0, 1fr);
	}
	:where(.apm-grid[data-layout="gallery"][data-count="2"]) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	:where(.apm-grid[data-layout="gallery"] > *) {
		margin: 0;
		min-width: 0;
	}
	:where(.apm-result > a) {
		display: block;
		cursor: zoom-in;
	}
	:where(.apm-result img) {
		display: block;
		width: 100%;
		height: auto;
	}

	/* Cards: one structure for every kind. Optional lead (code: language tile,
	   image: round thumbnail) next to the body; the call to action sits at the bottom
	   so cards in a row line up. The title link covers the whole card. */
	:where(.apm-card) {
		position: relative;
		display: flex;
		align-items: flex-start;
		gap: var(--apm-space);
		min-width: 0;
	}
	:where(.apm-card__body) {
		display: flex;
		flex: 1 1 auto;
		flex-direction: column;
		align-self: stretch;
		gap: calc(var(--apm-space) / 2);
		min-width: 0;
	}
	:where(.apm-card__lead) {
		display: grid;
		flex: 0 0 auto;
		place-items: center;
		overflow: hidden;
	}
	:where(.apm-card__lang) {
		min-width: 2.75rem;
		height: 2.75rem;
		padding-inline: 0.35em;
		font-family: var(--apm-mono);
		font-size: 0.75rem;
		font-weight: 700;
		line-height: 1;
		white-space: nowrap;
	}
	:where(.apm-card__thumb) {
		width: 3.5rem;
		height: 3.5rem;
		border-radius: 50%;
	}
	:where(.apm-card__thumb img) {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	:where(.apm-card__flags) {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 0.375rem;
		margin: 0;
	}
	:where(.apm-card__title a)::after {
		position: absolute;
		inset: 0;
		content: "";
	}
	:where(.apm-card__cta) {
		align-self: flex-start;
		margin-block-start: auto;
	}
	:where(.apm-card__title, .apm-card__excerpt, .apm-single__title, .apm-archive__title) {
		margin: 0;
		overflow-wrap: anywhere;
	}
	:where(.apm-result) {
		display: block;
		margin: 0;
	}
	:where(.apm-result img) {
		display: block;
		width: 100%;
		height: auto; /* width/height attributes reserve space → no layout shift */
	}
	:where(.apm-toolbar) {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: calc(var(--apm-space) / 2);
		margin-block-start: auto;
	}
	:where(.apm-mono) {
		font-family: var(--apm-mono);
	}

	/* Meta badges */
	:where(.apm-meta) {
		display: flex;
		flex-wrap: wrap;
		gap: 0.35em;
		margin: 0;
		padding: 0;
		list-style: none;
	}
	:where(.apm-badge) {
		display: inline-flex;
		align-items: center;
		font-size: 0.8em;
		line-height: 1.6;
		padding-inline: 0.5em;
		white-space: nowrap;
	}

	/* Prompt text ------------------------------------------------------ */
	:where(.apm-prompt) {
		max-block-size: var(--apm-prompt-max);
		overflow: auto;
		overscroll-behavior: contain;
		display: flex;
		flex-direction: column;
		gap: 1em;
	}
	:where(.apm-prompt__text) {
		font-family: var(--apm-prompt-font);
		white-space: pre-wrap;
		overflow-wrap: anywhere;
		tab-size: 2;
	}
	:where(.apm-prompt__code, .apm-output, .apm-code-input) {
		font-family: var(--apm-mono);
		tab-size: 2;
	}
	:where(.apm-prompt__code) {
		margin: 0;
		overflow-x: auto;
		white-space: pre;
	}
	:where(.apm-output) {
		margin: 0;
		white-space: pre-wrap;
		overflow-wrap: anywhere;
		max-block-size: var(--apm-prompt-max);
		overflow: auto;
	}

	/* Forms ------------------------------------------------------------ */
	:where(.apm-fill, .apm-filters) {
		display: flex;
		flex-direction: column;
		gap: var(--apm-space);
		margin: 0;
	}
	:where(.apm-fill__title) {
		margin: 0;
	}
	:where(.apm-fill__grid) {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr));
		gap: var(--apm-space);
	}
	/* "Wide" variables span the whole row. */
	:where(.apm-fill__grid > .apm-field--wide) {
		grid-column: 1 / -1;
	}
	/* Search & filter bar ------------------------------------------------
	   One row; stacks in narrow containers (sidebar, Elementor column). Colors and
	   fonts are inherited (Canvas / CanvasText / currentColor), so any theme and
	   both color schemes work. */
	:where(.apm-searchbar) {
		position: relative;
		container-type: inline-size;
		container-name: apm-searchbar;
		gap: 0.5rem;
	}
	:where(.apm-searchbar__bar) {
		display: flex;
		align-items: stretch;
		min-height: 3.5rem;
		padding: 0.375rem;
		border: 1px solid color-mix(in srgb, currentColor 16%, transparent);
		border-radius: 0.75rem;
		background: Canvas;
		color: CanvasText;
		box-shadow: 0 1px 2px rgb(0 0 0 / 0.04), 0 6px 20px rgb(0 0 0 / 0.04);
	}
	:where(.apm-searchbar__bar > .apm-searchbar__field) {
		position: relative;
		flex: 1 1 9rem;
		flex-direction: row;
		align-items: center;
		gap: 0.5rem;
		min-width: 0;
		padding-inline: 0.875rem;
		border-radius: 0.5rem;
	}
	:where(.apm-searchbar__bar > .apm-searchbar__field + .apm-searchbar__field, .apm-searchbar__bar > .apm-searchbar__field + .apm-searchbar__more) {
		border-inline-start: 1px solid color-mix(in srgb, currentColor 14%, transparent);
		border-start-start-radius: 0;
		border-end-start-radius: 0;
	}
	:where(.apm-searchbar__bar > .apm-field--search) {
		flex: 2 1 14rem;
	}
	:where(.apm-searchbar__bar > .apm-searchbar__field:focus-within) {
		outline: 2px solid currentColor;
		outline-offset: -2px;
	}
	:where(.apm-searchbar__icon) {
		flex: 0 0 auto;
		opacity: 0.6;
	}
	:where(.apm-searchbar__bar > .apm-searchbar__field select) {
		padding-inline-end: 1.5rem;
		background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
		background-position: right 0.6rem center, right 0.3rem center;
		background-repeat: no-repeat;
		background-size: 0.3rem 0.3rem, 0.3rem 0.3rem;
		text-overflow: ellipsis;
		cursor: pointer;
	}
	:where(.apm-searchbar__more) {
		display: flex;
		flex: 0 0 auto;
		padding-inline: 0.375rem;
	}
	:where(.apm-searchbar__toggle) {
		position: relative;
		display: grid;
		place-items: center;
		width: 2.75rem;
		height: 100%;
		min-height: 2.75rem;
		border-radius: 0.5rem;
		list-style: none;
		cursor: pointer;
	}
	:where(.apm-searchbar__toggle)::-webkit-details-marker {
		display: none;
	}
	:where(.apm-searchbar__toggle:hover, .apm-searchbar__more[open] > .apm-searchbar__toggle) {
		background: color-mix(in srgb, currentColor 8%, transparent);
	}
	:where(.apm-searchbar__toggle:focus-visible) {
		outline: 2px solid currentColor;
		outline-offset: -2px;
	}
	:where(.apm-searchbar__count) {
		position: absolute;
		top: 0.2rem;
		inset-inline-end: 0.1rem;
		min-width: 1.15rem;
		height: 1.15rem;
		padding-inline: 0.25rem;
		border-radius: 999px;
		background: CanvasText;
		color: Canvas;
		font-size: 0.7rem;
		font-weight: 700;
		line-height: 1.15rem;
		text-align: center;
	}
	:where(.apm-searchbar__panel) {
		position: absolute;
		top: calc(100% + 0.5rem);
		inset-inline-end: 0;
		z-index: 25;
		display: grid;
		gap: 0.875rem;
		width: min(22rem, 100%);
		padding: 1rem;
		border: 1px solid color-mix(in srgb, currentColor 16%, transparent);
		border-radius: 0.75rem;
		background: Canvas;
		color: CanvasText;
		box-shadow: 0 12px 32px rgb(0 0 0 / 0.14);
	}
	/* Native option lists take their colors from the option: with a transparent select
	   and inherited light text, dark themes got light text on a white list. System
	   colors follow the page's color-scheme; themes can override (layered, :where). */
	:where(.apm-filters, .apm-fill, .apm-palette) :where(select option, select optgroup) {
		background-color: Canvas;
		color: CanvasText;
	}

	:where(.apm-searchbar__panel select) {
		min-height: 2.5rem;
		padding-inline: 0.75rem;
		border: 1px solid color-mix(in srgb, currentColor 40%, transparent);
		border-radius: 0.5rem;
		background: Canvas;
		color: inherit;
	}
	:where(.apm-searchbar__submit) {
		flex: 0 0 auto;
		justify-content: center;
		margin-inline-start: 0.375rem;
		padding-inline: 1.5rem;
		border-radius: 0.5rem;
	}
	:where(.apm-searchbar__reset) {
		margin: 0;
		font-size: 0.875em;
	}

	/* Narrow containers: search on its own row, filters below, button full width. */
	@container apm-searchbar (max-width: 40rem) {
		:where(.apm-searchbar__bar) {
			flex-wrap: wrap;
			row-gap: 0.375rem;
		}
		:where(.apm-searchbar__bar > .apm-field--search) {
			flex-basis: 100%;
			min-height: 2.75rem;
			border-block-end: 1px solid color-mix(in srgb, currentColor 14%, transparent);
			border-end-start-radius: 0;
			border-end-end-radius: 0;
		}
		:where(.apm-searchbar__bar > .apm-field--search + .apm-searchbar__field, .apm-searchbar__bar > .apm-searchbar__more) {
			border-inline-start: 0;
		}
		:where(.apm-searchbar__bar > .apm-searchbar__field:not(.apm-field--search)) {
			min-height: 2.75rem;
		}
		:where(.apm-searchbar__submit) {
			flex: 1 1 auto;
		}
		:where(.apm-searchbar__panel) {
			inset-inline: 0;
			width: auto;
		}
	}
	@container apm-searchbar (max-width: 22rem) {
		:where(.apm-searchbar__bar > .apm-searchbar__field) {
			flex-basis: 100%;
			border-inline-start: 0;
		}
		:where(.apm-searchbar__submit) {
			margin-inline-start: 0;
		}
	}

	/* Widgets: prompt cards / list, terms ------------------------------- */
	:where(.apm-widget-prompts) {
		container-type: inline-size;
	}
	:where(.apm-grid[data-columns]) {
		grid-template-columns: repeat(var(--apm-columns, 3), minmax(0, 1fr));
	}
	@container (max-width: 36rem) {
		:where(.apm-grid[data-columns]) {
			grid-template-columns: minmax(0, 1fr);
		}
	}
	@container (min-width: 36.01rem) and (max-width: 56rem) {
		:where(.apm-grid[data-columns="3"], .apm-grid[data-columns="4"]) {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
	}
	:where(.apm-plist) {
		display: flex;
		flex-direction: column;
	}
	:where(.apm-plist__item) {
		display: flex;
		align-items: center;
		gap: 0.75rem;
		padding-block: 0.6rem;
		border-block-start: 1px solid color-mix(in srgb, currentColor 12%, transparent);
	}
	:where(.apm-plist__item:first-child) {
		border-block-start: 0;
	}
	:where(.apm-plist__main) {
		display: flex;
		flex: 1 1 auto;
		flex-direction: column;
		gap: 0.15rem;
		min-width: 0;
	}
	:where(.apm-plist .apm-btn--copy) {
		flex: 0 0 auto;
		font-size: 0.875em;
	}
	:where(.apm-plist__kind) {
		font-size: 0.8em;
		opacity: 0.75;
	}
	:where(.apm-terms--chips) {
		display: flex;
		flex-wrap: wrap;
		gap: 0.4rem;
	}
	:where(.apm-terms--chips a) {
		display: inline-flex;
		align-items: center;
		gap: 0.35em;
		padding: 0.2em 0.6em;
		border: 1px solid color-mix(in srgb, currentColor 18%, transparent);
		border-radius: 0.4rem;
		text-decoration: none;
	}
	:where(.apm-terms__count) {
		opacity: 0.7;
		font-variant-numeric: tabular-nums;
	}
	:where(.apm-widget-more) {
		margin: 0.75rem 0 0;
	}
	:where(.apm-field) {
		display: flex;
		flex-direction: column;
		gap: 0.25em;
		margin: 0;
		min-width: 0;
	}
	:where(.apm-field--search) {
		flex: 1 1 14rem;
	}
	:where(.apm-field--actions) {
		flex-direction: row;
		gap: calc(var(--apm-space) / 2);
	}
	:where(.apm-field input, .apm-field select, .apm-field textarea) {
		box-sizing: border-box;
		width: 100%;
		max-width: 100%;
		font: inherit;
	}
	:where(.apm-field textarea) {
		resize: vertical;
	}

	/* Buttons: inherit the theme's button styling via .wp-element-button. */
	:where(.apm-btn) {
		cursor: pointer;
		font: inherit;
		text-decoration: none;
		display: inline-flex;
		align-items: center;
		gap: 0.35em;
	}
	:where(.apm-btn:focus-visible, .apm-palette__item:focus-visible) {
		outline: 2px solid currentColor;
		outline-offset: 2px;
	}
	:where(.apm-btn[disabled], .apm-btn[aria-disabled="true"]) {
		opacity: 0.5;
		cursor: not-allowed;
	}
	:where(.apm-btn[data-state="copied"])::after {
		content: "✓";
	}
	:where(.apm-btn[data-state="error"])::after {
		content: "!";
	}
	:where(.apm-btn--icon) {
		line-height: 1;
		padding: 0.25em 0.5em;
		background: none;
		border: 0;
		color: inherit;
		font-size: 1.25em;
	}

	/* Details / fields ------------------------------------------------- */
	:where(.apm-fields) {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr));
		gap: var(--apm-space);
		margin: 0;
	}
	:where(.apm-fields dd) {
		margin: 0;
		overflow-wrap: anywhere;
	}
	:where(.apm-sample summary) {
		cursor: pointer;
	}
	:where(.apm-includes) {
		margin: 0;
		font-size: 0.875em;
		opacity: 0.85;
	}
	:where(.apm-field__help) {
		font-size: 0.85em;
		opacity: 0.8;
	}
	:where(.apm-missing, .apm-tested) {
		margin: 0;
	}

	/* Assembled output with a corner copy button */
	:where(.apm-output-wrap) {
		position: relative;
		min-width: 0;
	}
	:where(.apm-output-wrap .apm-output) {
		padding-inline-end: 3rem;
	}
	:where(.apm-icon-btn) {
		position: absolute;
		top: 0.5rem;
		inset-inline-end: 0.5rem;
		z-index: 1;
		display: inline-grid;
		place-items: center;
		width: 2rem;
		height: 2rem;
		padding: 0;
		border: 0;
		border-radius: var(--apm-radius);
		background: none;
		color: inherit;
		cursor: pointer;
	}
	:where(.apm-icon-btn:hover) {
		background: color-mix(in srgb, currentColor 10%, transparent);
	}
	:where(.apm-icon-btn:focus-visible) {
		outline: 2px solid currentColor;
		outline-offset: 2px;
	}
	:where(.apm-icon-btn .apm-icon--check),
	:where(.apm-icon-btn[data-state="copied"] .apm-icon--copy) {
		display: none;
	}
	:where(.apm-icon-btn[data-state="copied"] .apm-icon--check) {
		display: block;
	}
	/* Tooltip (hover + keyboard focus) */
	:where(.apm-icon-btn[data-apm-tip])::after {
		position: absolute;
		top: 50%;
		inset-inline-end: calc(100% + 6px);
		transform: translateY(-50%);
		padding: 0.2em 0.55em;
		border-radius: 4px;
		background: CanvasText;
		color: Canvas;
		font-size: 0.75rem;
		line-height: 1.5;
		white-space: nowrap;
		pointer-events: none;
		content: attr(data-apm-tip);
		opacity: 0;
		visibility: hidden;
	}
	:where(.apm-icon-btn[data-apm-tip]:hover, .apm-icon-btn[data-apm-tip]:focus-visible, .apm-icon-btn[data-state="copied"])::after {
		opacity: 1;
		visibility: visible;
	}

	/* Live search suggestions */
	:where(.apm-field--live) {
		position: relative;
	}
	:where(.apm-live) {
		position: absolute;
		top: calc(100% + 4px);
		inset-inline: 0;
		z-index: 30;
		min-width: min(28rem, 90vw);
		max-height: min(26rem, 70vh);
		overflow: auto;
		overscroll-behavior: contain;
		background: Canvas;
		color: CanvasText;
		border: 1px solid color-mix(in srgb, currentColor 20%, transparent);
		border-radius: var(--apm-radius);
		box-shadow: 0 0.75rem 2rem rgb(0 0 0 / 0.15);
	}
	:where(.apm-live__list) {
		margin: 0;
		padding: 0.25rem;
		list-style: none;
	}
	:where(.apm-live__item) {
		display: flex;
		flex-direction: column;
		gap: 0.15rem;
		padding: 0.5rem 0.65rem;
		border-radius: var(--apm-radius);
		cursor: pointer;
	}
	:where(.apm-live__item[aria-selected="true"]) {
		background: color-mix(in srgb, currentColor 10%, transparent);
	}
	:where(.apm-live__title mark) {
		background: none;
		color: inherit;
		font-weight: 700;
		text-decoration: underline;
		text-underline-offset: 0.15em;
	}
	:where(.apm-live__meta) {
		display: flex;
		align-items: center;
		gap: 0.5em;
		min-width: 0;
		font-size: 0.85em;
		opacity: 0.85;
	}
	:where(.apm-live__excerpt) {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		min-width: 0;
	}
	:where(.apm-live__empty) {
		padding: 0.65rem;
		opacity: 0.8;
	}
	:where(.apm-live__all) {
		display: block;
		width: 100%;
		padding: 0.6rem 0.9rem;
		border: 0;
		border-top: 1px solid color-mix(in srgb, currentColor 14%, transparent);
		background: none;
		color: inherit;
		font: inherit;
		text-align: start;
		cursor: pointer;
	}

	/* Pagination */
	:where(.apm-pagination ul) {
		display: flex;
		flex-wrap: wrap;
		gap: 0.5em;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	/* Command palette (native <dialog>: top layer, no z-index needed) */
	:where(.apm-palette) {
		box-sizing: border-box;
		width: min(44rem, calc(100vw - 2rem));
		max-height: min(80vh, 48rem);
		padding: 0;
		border: 0;
		background: var(--apm-palette-bg, var(--wp--preset--color--base, Canvas));
		color: var(--apm-palette-fg, var(--wp--preset--color--contrast, CanvasText));
		overflow: hidden;
	}
	:where(.apm-palette)::backdrop {
		background: rgb(0 0 0 / 0.45);
	}
	:where(html:has(.apm-palette[open])) {
		overflow: hidden;
	}
	:where(.apm-palette__inner) {
		display: flex;
		flex-direction: column;
		gap: var(--apm-space);
		padding: var(--apm-space);
		max-height: inherit;
		box-sizing: border-box;
	}
	:where(.apm-palette__head, .apm-palette__detail-head) {
		display: flex;
		align-items: center;
		gap: calc(var(--apm-space) / 2);
	}
	:where(.apm-palette__detail-title) {
		margin: 0;
		font-size: 1.1em;
	}
	:where(.apm-palette__search) {
		flex: 1;
		min-width: 0;
		font: inherit;
		font-size: 1.1em;
		padding: 0.5em;
		box-sizing: border-box;
	}
	:where(.apm-palette__list) {
		list-style: none;
		margin: 0;
		padding: 0;
		overflow: auto;
		min-height: 0;
	}
	:where(.apm-palette__detail) {
		overflow: auto;
		min-height: 0;
	}
	:where(.apm-palette__item) {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		gap: 0.5em;
		padding: 0.5em 0.65em;
		cursor: pointer;
	}
	/* Selection indicator must stay visible on any background. */
	:where(.apm-palette__item[aria-selected="true"]) {
		background: color-mix(in srgb, currentColor 12%, transparent);
	}
	:where(.apm-palette__meta) {
		display: flex;
		flex-wrap: wrap;
		gap: 0.35em;
	}
	:where(.apm-palette__hint) {
		margin: 0;
		font-size: 0.8em;
		opacity: 0.75;
	}
	:where(.apm-palette__empty) {
		padding: 0.5em;
		margin: 0;
	}
	:where(.apm-palette kbd, #wp-admin-bar-apm-palette kbd) {
		font-family: var(--apm-mono);
		font-size: 0.85em;
	}

	@media (prefers-reduced-motion: no-preference) {
		:where(.apm-btn) {
			transition: opacity 0.15s ease;
		}
	}
}

/*
 * Critical resets — deliberately OUTSIDE the layer, single-class specificity.
 * Unlayered element rules in themes (e.g. `ul { padding-left }`) would otherwise
 * beat any layered rule and break badge rows / listboxes. A theme can still
 * override these with any selector of higher specificity (e.g. `.entry-content ul`).
 */
.apm-meta,
.apm-palette__list,
.apm-pagination ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.apm-meta > li,
.apm-palette__list > li {
	margin: 0;
}

.apm-searchbar__bar > .apm-searchbar__field {
	flex-direction: row;
	align-items: center;
}
/* Search bar fields: borderless inside the bar. Outside the layer with class
   specificity, so theme input rules (borders, hover/focus rings) don't box them. */
.apm-searchbar .apm-searchbar__bar > .apm-searchbar__field :is(input, select),
.apm-searchbar .apm-searchbar__bar > .apm-searchbar__field :is(input, select):is(:hover, :focus, :focus-visible) {
	width: 100%;
	min-width: 0;
	min-height: 2.75rem;
	margin: 0;
	padding-block: 0;
	padding-inline-start: 0;
	border: 0;
	border-radius: 0;
	background-color: transparent;
	box-shadow: none;
	outline: none;
	color: inherit;
	font: inherit;
}
.apm-searchbar .apm-searchbar__bar > .apm-searchbar__field input {
	-webkit-appearance: none;
	appearance: none;
}
/* Selects: leave "appearance" to the theme where styleable selects exist (base-select),
   so a theme can style the option list. */
@supports not (appearance: base-select) {
	.apm-searchbar .apm-searchbar__bar > .apm-searchbar__field select {
		-webkit-appearance: none;
		appearance: none;
	}
}
.apm-searchbar__toggle {
	list-style: none;
}
.apm-plist,
.apm-terms {
	list-style: none;
	margin: 0;
	padding: 0;
}