@use "~@wordpress/base-styles/colors" as wp-colors;

/**
 * Plugins table.
 */
table.plugins {
	.newspack-plugin {
		&.uninstalled .check-column input[type="checkbox"] {
			display: none;
		}
	}
}

.newspack-plugin-info-modal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 9;
	display: flex;
	justify-content: center;
	align-items: center;
	background: rgba(0, 0, 0, 0.5);
	&--hidden {
		display: none;
	}
	h1,
	p,
	> div > div {
		padding-left: 32px;
		padding-right: 32px;
	}
	h1 {
		margin-top: 21px;
		font-size: 16px;
		padding-bottom: 20px;
		border-bottom: 1px solid #ddd;
	}
	> div {
		position: relative;
		display: flex;
		padding-bottom: 32px;
		flex-direction: column;
		background-color: wp-colors.$white;
		box-shadow: 0 10px 10px rgb(0 0 0 / 25%);
		max-width: 80vw;
		@media screen and ( min-width: 700px ) {
			max-width: 570px;
		}
		> button {
			position: absolute;
			top: 14px;
			right: 27px;
			padding: 0.5em;
			background: none;
			border: none;
		}
		> p {
			flex: 1;
		}
		> div:last-child {
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			> a {
				margin-top: 20px;
			}
		}
	}
}
