@use "@wordpress/base-styles/colors" as *;

.wp-block-file {
	// This block has customizable padding, border-box makes that more predictable.
	box-sizing: border-box;

	&:not(.wp-element-button) {
		font-size: 0.8em;
	}

	&.aligncenter {
		text-align: center;
	}

	&.alignright {
		/*rtl:ignore*/
		text-align: right;
	}

	* + .wp-block-file__button {
		margin-left: 0.75em;
	}
}

// Lowest specificity to avoid overriding layout styles.
:where(.wp-block-file) {
	margin-bottom: 1.5em;
}

.wp-block-file__embed {
	margin-bottom: 1em;
}

//This needs a low specificity so it won't override the rules from the button element if defined in theme.json.
:where(.wp-block-file__button) {
	border-radius: 2em;
	padding: 0.5em 1em;
	display: inline-block;

	&:where(a) {
		&:hover,
		&:visited,
		&:focus,
		&:active {
			box-shadow: none;
			color: $white;
			opacity: 0.85;
			text-decoration: none;
		}
	}
}