.ska-button-group__group {
	display: inline-block;

	:where(.components-button) {
		border-radius: 0;
		display: inline-flex;
		box-shadow: inset 0 0 0 1px var(--wp-components-color-foreground, #1e1e1e);

		& + .components-button {
			margin-left: -1px;
		}

		&:first-child {
			border-radius: 2px 0 0 2px;
		}

		&:last-child {
			border-radius: 0 2px 2px 0;
		}

		// The focused button should be elevated so the focus ring isn't cropped,
		// as should the active button, because it has a different border color.
		&:focus,
		&.is-primary {
			position: relative;
			z-index: 1;
		}

		// The active button should look pressed.
		&:active {
			box-shadow: inset 0 0 0 1px var(--wp-components-color-foreground, #1e1e1e);
		}
	}

	// .components-button {
	// 	// The active button should look pressed.
	// 	&:active:not(:disabled) {
	// 		box-shadow: inset 0 0 0 1px #1e1e1e;
	// 	}
	// 	&.is-primary:active:not(:disabled) {
	// 		box-shadow: inset 0 0 0 1px var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9));
	// 	}
	// }
}