/**
 * Button component styles.
 * Primary/secondary fills use surface text for contrast — not body-text accents.
 */

.wp-block-button__link,
.pp-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 44px;
	min-width: 44px;
	padding: 0.75rem 1.25rem;
	border: 1px solid transparent;
	border-radius: var(--wp--custom--radius--md);
	background-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--surface);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--md);
	font-weight: 600;
	line-height: 1.25;
	text-decoration: none;
	cursor: pointer;
}

.wp-block-button__link:hover,
.wp-block-button__link:focus-visible,
.pp-button:hover,
.pp-button:focus-visible {
	background-color: var(--wp--preset--color--primary-hover);
	color: var(--wp--preset--color--surface);
}

.wp-block-button.is-style-pp-secondary .wp-block-button__link,
.pp-button--secondary {
	background-color: var(--wp--preset--color--secondary);
	color: var(--wp--preset--color--surface);
}

.wp-block-button.is-style-pp-secondary .wp-block-button__link:hover,
.wp-block-button.is-style-pp-secondary .wp-block-button__link:focus-visible,
.pp-button--secondary:hover,
.pp-button--secondary:focus-visible {
	background-color: var(--wp--preset--color--secondary-hover);
	color: var(--wp--preset--color--surface);
}

.wp-block-button.is-style-outline .wp-block-button__link,
.pp-button--outline {
	background-color: transparent;
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--contrast);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:focus-visible,
.pp-button--outline:hover,
.pp-button--outline:focus-visible {
	background-color: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--surface);
}

.wp-block-button__link:disabled,
.pp-button:disabled {
	opacity: 0.55;
	cursor: not-allowed;
}
