/* Общие компоненты. Значения приходят из пресетов WordPress. */
.isha-button,
.wp-block-button .wp-block-button__link {
	--button-bg: var(--wp--preset--color--ink);
	--button-fg: var(--wp--preset--color--white);
	--button-hover: var(--wp--custom--color--ink-hover);
	--button-pressed: var(--wp--custom--color--ink-pressed);
	--button-keyboard-color: var(--wp--preset--color--on-dark-accent);
	--button-keyboard-offset: -2px;
	--button-height: var(--wp--custom--size--button);
	--button-padding: var(--wp--preset--spacing--24);
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--wp--preset--spacing--8);
	min-block-size: var(--button-height);
	max-inline-size: 100%;
	padding: var(--wp--preset--spacing--8) var(--button-padding);
	border: 0;
	border-radius: var(--wp--custom--radius--pill);
	background-color: var(--button-bg);
	color: var(--button-fg);
	font: var(--wp--custom--type--interface--weight) var(--wp--preset--font-size--interface)/var(--wp--custom--type--interface--line-height) var(--wp--preset--font-family--onest);
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	transition: background-color var(--wp--custom--motion--fast) var(--wp--custom--motion--ease);
}

.isha-button--soft,
.isha-button--quiet,
.isha-button--inverse,
.wp-block-button.is-style-outline > .wp-block-button__link {
	--button-bg: var(--wp--preset--color--stone);
	--button-fg: var(--wp--preset--color--ink);
	--button-hover: var(--wp--custom--color--stone-hover);
	--button-pressed: var(--wp--custom--color--stone-pressed);
	--button-keyboard-color: var(--wp--custom--color--focus);
	--button-keyboard-offset: 0px;
}

.isha-button--quiet { --button-bg: transparent; --button-hover: var(--wp--preset--color--stone); }
.isha-button--inverse { --button-bg: var(--wp--preset--color--white); }
.isha-button--sm { --button-height: var(--wp--custom--size--button-small); --button-padding: var(--wp--preset--spacing--16); }
.isha-button--lg { --button-height: var(--wp--custom--size--button-large); --button-padding: var(--wp--preset--spacing--32); }
.isha-button--icon { inline-size: var(--button-height); flex: none; padding: 0; }
@media (hover: hover) {
	.isha-button:where(:not(:disabled)):hover,
	.wp-block-button .wp-block-button__link:where(:not(.has-background, .has-text-color, [style*="background"], [style*="color:"])):hover {
		background-color: var(--button-hover);
		color: var(--button-fg);
	}
}

.isha-button:where(:not(:disabled)):active,
.wp-block-button .wp-block-button__link:where(:not(.has-background, .has-text-color, [style*="background"], [style*="color:"])):active {
	background-color: var(--button-pressed);
	color: var(--button-fg);
}

@media (prefers-reduced-motion: no-preference) {
	.isha-button,
	.wp-block-button__link {
		transition: background-color var(--wp--custom--motion--fast) var(--wp--custom--motion--ease),
			scale var(--wp--custom--motion--fast) ease-out;
	}
	.isha-button:where(:not(:disabled, .isha-button--static)):active,
	.wp-block-button__link:active { scale: var(--wp--custom--motion--press); }
}

.isha-button:disabled {
	background-color: var(--wp--custom--color--disabled-bg);
	color: var(--wp--custom--color--disabled-text);
	cursor: not-allowed;
}

.isha-theme :focus-visible:where(:not([data-isha-pointer] *), input, textarea, select, [contenteditable]) {
	outline: 2px solid var(--isha-focus-color, var(--wp--custom--color--focus));
	outline-offset: 0;
}

.isha-theme :focus:where([data-isha-pointer] *):not(:where(input, textarea, select, [contenteditable])) {
	outline: none;
}

.isha-theme .isha-button:focus-visible:where(:not([data-isha-pointer] *)),
.isha-theme .isha-demo-focus,
.wp-block-button .wp-block-button__link:focus-visible:where(:not([data-isha-pointer] *)) {
	outline: 2px solid var(--button-keyboard-color);
	outline-offset: var(--button-keyboard-offset);
}

.wp-block-button .wp-block-button__link:where(.has-background, .has-text-color, [style*="background"], [style*="color:"]):focus-visible:where(:not([data-isha-pointer] *)) {
	outline-color: currentColor;
}

.isha-icon {
	display: inline-block;
	flex: none;
	inline-size: var(--wp--custom--size--icon);
	block-size: var(--wp--custom--size--icon);
	fill: none;
	stroke: currentColor;
	stroke-width: var(--wp--custom--size--icon-stroke);
	stroke-linecap: round;
	stroke-linejoin: round;
	vertical-align: -0.15em;
}

.isha-button--sm .isha-icon, .isha-badge .isha-icon { --wp--custom--size--icon: var(--wp--custom--size--icon-small); }
.isha-button--lg .isha-icon { --wp--custom--size--icon: var(--wp--custom--size--icon-large); }

.isha-link {
	color: var(--isha-link, var(--wp--preset--color--ink));
	text-decoration: none;
	font-weight: var(--wp--custom--type--interface--weight);
	transition: color var(--wp--custom--motion--fast) var(--wp--custom--motion--ease),
		background-color var(--wp--custom--motion--fast) var(--wp--custom--motion--ease);
}
.isha-link.isha-link--inline,
:is(.isha-prose, .isha-entry, .isha-article-copy, .is-root-container, .isha-tour__image) :where(p, li, figcaption) > a:where(:not(.has-text-color, .isha-button, .wp-block-button__link)) {
	color: var(--isha-link, var(--wp--custom--color--link));
	font-weight: var(--wp--custom--type--link--weight);
	text-decoration: none;
}
@media (hover: hover) {
	.isha-theme .isha-link:hover,
	:is(.isha-prose, .isha-entry, .isha-article-copy, .is-root-container, .isha-tour__image) :where(p, li, figcaption) > a:where(:not(.has-text-color, .isha-button, .wp-block-button__link)):hover {
		color: var(--isha-link-hover, var(--wp--custom--color--link-hover));
	}
}
.isha-theme .isha-link:focus-visible:where(:not([data-isha-pointer] *)) {
	border-radius: 0.25rem;
	color: var(--isha-link-hover, var(--wp--custom--color--link-hover));
}

.isha-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	inline-size: fit-content;
	padding: 0.3125rem 0.6875rem;
	border-radius: var(--wp--custom--radius--pill);
	background-color: var(--isha-tone-bg, var(--wp--preset--color--stone));
	color: var(--isha-tone, var(--wp--preset--color--ink));
	font-size: var(--wp--preset--font-size--label);
	font-weight: var(--wp--custom--type--label--weight);
	line-height: var(--wp--custom--type--label--line-height);
}
.isha-badge--format {
	--isha-tone-bg: var(--wp--preset--color--surface-strong);
	font-weight: var(--wp--custom--type--strong--weight);
}

.isha-badge--olive {
	--isha-tone-bg: var(--wp--custom--color--olive-soft);
	--isha-tone: var(--wp--preset--color--olive);
}
:is(.has-stone-background-color, .has-surface-strong-background-color) {
	--isha-link: var(--wp--preset--color--selection);
	--isha-link-hover: var(--wp--custom--color--link-hover-on-strong);
}

.isha-tone--success { --isha-tone-bg: var(--wp--custom--color--olive-soft); --isha-tone: var(--wp--preset--color--olive); }
.isha-tone--warning { --isha-tone-bg: var(--wp--custom--color--warning-bg); --isha-tone: var(--wp--custom--color--warning); }
.isha-tone--error { --isha-tone-bg: var(--wp--custom--color--error-bg); --isha-tone: var(--wp--custom--color--error); }
.isha-tone--info { --isha-tone-bg: var(--wp--preset--color--info-bg); --isha-tone: var(--wp--preset--color--info); }

.isha-notice {
	display: flex;
	align-items: start;
	gap: var(--wp--preset--spacing--12);
	padding: var(--wp--preset--spacing--16);
	border-radius: var(--wp--custom--radius--field);
	background-color: var(--isha-tone-bg);
	color: var(--isha-tone);
	font-size: var(--wp--preset--font-size--small);
}
.isha-notice .isha-icon, :is(.isha-field__error, .isha-field__hint) .isha-icon {
	--wp--custom--size--icon: var(--wp--custom--size--icon-small);
	margin-block-start: calc((1lh - var(--wp--custom--size--icon)) / 2);
}

.isha-card {
	--field-bg: var(--wp--preset--color--white);
	border-radius: var(--wp--custom--radius--card);
	background-color: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
}
.isha-card--raised {
	border: 1px solid transparent;
	box-shadow: var(--wp--preset--shadow--lift);
}

.isha-control {
	display: block;
	inline-size: 100%;
	min-block-size: var(--wp--custom--size--control);
	padding: var(--wp--preset--spacing--12) var(--wp--preset--spacing--16);
	border: 0;
	border-radius: var(--wp--custom--radius--control);
	background-color: var(--field-bg, var(--wp--preset--color--stone));
	color: var(--wp--preset--color--ink);
	font: 400 var(--wp--preset--font-size--interface)/1.5 var(--wp--preset--font-family--onest);
	font-variant-numeric: lining-nums proportional-nums;
}
.isha-control::placeholder { color: var(--wp--preset--color--muted); opacity: 1; }
.isha-theme .isha-control:focus-visible { outline: none; }

select.isha-select {
	appearance: none;
	padding-inline-end: 3rem;
	background-image: var(--field-chevron, url("lucide-chevron-down.svg"));
	background-position: right 1rem center;
	background-size: var(--wp--custom--size--icon);
	background-repeat: no-repeat;
	cursor: pointer;
}
select.isha-select:focus-visible { background-image: var(--field-chevron-focus, url("select-focus.svg")); }
[dir="rtl"] select.isha-select { background-position: left 1rem center; }

@supports (appearance: base-select) and selector(::picker(select)) {
	select.isha-select,
	select.isha-select::picker(select) { appearance: base-select; }
	select.isha-select {
		display: flex;
		align-items: center;
		gap: var(--wp--preset--spacing--12);
		padding-inline-end: var(--wp--preset--spacing--16);
		background-image: none;
	}
	select.isha-select:focus-visible { background-image: none; }
	select.isha-select::picker-icon {
		inline-size: var(--wp--custom--size--icon);
		block-size: var(--wp--custom--size--icon);
		content: "";
		background: currentColor;
		mask: url("lucide-chevron-down.svg") center / contain no-repeat;
	}
	select.isha-select:focus-visible::picker-icon {
		background: var(--field-chevron-color, var(--wp--custom--color--choice));
	}
	select.isha-select:open::picker-icon { rotate: 180deg; }
	select.isha-select::picker(select) {
		margin-block: 0.375rem;
		padding: var(--wp--preset--spacing--8);
		border: 1px solid var(--wp--custom--color--line);
		border-radius: var(--wp--custom--radius--control);
		background: var(--wp--preset--color--white);
		color: var(--wp--preset--color--ink);
		box-shadow: var(--wp--preset--shadow--float);
		overscroll-behavior: contain;
	}
	select.isha-select option {
		display: flex;
		align-items: center;
		gap: var(--wp--preset--spacing--8);
		min-block-size: var(--wp--custom--size--target);
		padding: var(--wp--preset--spacing--8) var(--wp--preset--spacing--12);
		border-radius: var(--wp--custom--radius--field);
	}
	select.isha-select option + option { margin-block-start: var(--wp--preset--spacing--4); }
	select.isha-select option::checkmark { order: 1; margin-inline-start: auto; color: var(--wp--custom--color--choice); }
	select.isha-select option:checked {
		background: var(--wp--preset--color--stone);
		font-weight: var(--wp--custom--type--strong--weight);
	}
	select.isha-select option:focus-visible { outline-offset: -2px; }
	@media (hover: hover) {
		select.isha-select option:not(:checked):hover { background: var(--wp--preset--color--surface); }
	}
}

textarea.isha-control { min-block-size: 6rem; resize: vertical; }
.isha-control[aria-invalid="true"] { background-color: var(--wp--custom--color--error-bg); }

.isha-control:disabled {
	background-color: var(--wp--custom--color--disabled-bg);
	color: var(--wp--custom--color--disabled-text);
	opacity: 1;
	cursor: not-allowed;
}
.isha-field { display: grid; gap: var(--wp--preset--spacing--8); min-inline-size: 0; }
.isha-field > label { font-size: var(--wp--preset--font-size--small); font-weight: var(--wp--custom--type--interface--weight); }
.isha-field__error, .isha-field__hint {
	display: flex;
	align-items: start;
	gap: var(--wp--preset--spacing--8);
	font-size: var(--wp--preset--font-size--small);
	line-height: var(--wp--custom--type--small--line-height);
}
.isha-field__error { color: var(--wp--custom--color--error); }
.isha-field__hint { color: var(--wp--preset--color--muted); }

.isha-choice {
	display: inline-flex;
	align-items: center;
	gap: var(--wp--preset--spacing--12);
	min-block-size: var(--wp--custom--size--target);
	cursor: pointer;
}
.isha-choice input { inline-size: var(--wp--custom--size--choice); block-size: var(--wp--custom--size--choice); flex: none; margin: 0; accent-color: var(--wp--custom--color--choice); }

.isha-disclosure {
	border-block-start: 1px solid var(--wp--custom--color--line);
}
.isha-disclosure:last-child { border-block-end: 1px solid var(--wp--custom--color--line); }
.isha-disclosure summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--wp--preset--spacing--16);
	min-block-size: var(--wp--custom--size--target);
	padding: var(--wp--preset--spacing--12) var(--wp--preset--spacing--8);
	font-weight: var(--wp--custom--type--strong--weight);
	cursor: pointer;
	list-style: none;
}
.isha-disclosure summary::-webkit-details-marker { display: none; }
.isha-disclosure[open] .isha-disclosure__plus,
.isha-disclosure:not([open]) .isha-disclosure__minus { display: none; }
.isha-disclosure > p {
	padding: 0 var(--wp--preset--spacing--8) var(--wp--preset--spacing--16);
	margin: 0;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
	line-height: var(--wp--custom--type--small--line-height);
}

.isha-dark {
	--isha-focus-color: var(--wp--custom--color--focus-on-solid);
	--isha-link: var(--wp--preset--color--on-dark-accent);
	--isha-link-hover: var(--wp--preset--color--white);
	background-color: var(--wp--preset--color--dark);
	color: var(--wp--preset--color--white);
}

.isha-dark .isha-badge {
	--isha-tone-bg: var(--wp--preset--color--dark-surface);
	--isha-tone: var(--wp--preset--color--on-dark-muted);
}

.isha-accent {
	--isha-focus-color: var(--wp--preset--color--accent-ink);
	background-color: var(--wp--preset--color--accent-bright);
	color: var(--wp--preset--color--accent-ink);
}

.isha-dialog {
	inline-size: min(32rem, calc(100% - 2rem));
	max-block-size: calc(100% - 2rem);
	overflow: auto;
	overscroll-behavior: contain;
	padding: clamp(1.25rem, 4vw, 2rem);
	border: 1px solid transparent;
	border-radius: var(--wp--custom--radius--card);
	background-color: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
	box-shadow: var(--wp--preset--shadow--float);
}
.isha-dialog::backdrop { background: rgb(44 43 39 / .56); }
.isha-dialog > form { display: flex; justify-content: end; }

@media (forced-colors: active) {
	.isha-button, .isha-badge, .isha-notice, .isha-card, .isha-dialog, .isha-control { border: 1px solid ButtonText; }
	.isha-button:disabled { border-color: GrayText; }
	.isha-theme :focus-visible:where(:not([data-isha-pointer] *), input, textarea, select, [contenteditable]) { outline: 2px solid Highlight !important; outline-offset: 0; }
	select.isha-select { appearance: auto; }
	select.isha-select, select.isha-select:focus-visible { background-image: none; }
	select.isha-select::picker-icon { content: revert; background: none; mask: none; }
}
