@use "~@wordpress/base-styles/mixins" as wp-mixins;
@use "~@wordpress/base-styles/variables" as wp-vars;

// Sit flush with the surrounding column: core insets panels horizontally, which
// would misalign them against the section they belong to.
.newspack-accordion {
	.components-panel__body {
		border: 0;

		> .components-panel__body-title:hover {
			background: none;
		}
	}

	.components-panel__body.is-opened {
		padding: 0;

		> .components-panel__body-title {
			margin: 0 0 wp-vars.$grid-unit-30;
		}
	}

	.components-panel__body-toggle.components-button {
		@include wp-mixins.heading-large();
		padding: 0;

		.components-panel__arrow {
			right: 0;
		}

		&:focus:not(:focus-visible) {
			box-shadow: none;
		}
	}
}