@import "@wordpress/base-styles/_colors.native.scss";
@import "../../stylesheets/_variables.scss";

.woocommerce-marketplace__woo-update-manager-plugin__notices {
	.components-notice {
		margin-left: 0;
		margin-right: 0;
		background-color: #fff;
		box-shadow: 0 2px 6px 0 rgba($gray-100, 0.05);
		border: 1px solid var(--gutenberg-gray-100, #f0f0f0);
		padding-right: $grid-unit-15;
		position: relative;

		&::before {
			content: "";
			display: block;
			width: 4px;
			height: 100%;
			background-color: var(--wp-admin-theme-color, #007cba);
			position: absolute;
			left: 0;
			top: 0;
			bottom: 0;
		}

		&.is-error::before {
			background-color: $alert-red;
		}

		.components-notice__content {
			align-items: center;
			gap: $grid-unit-15;
			padding: 0;
			margin-left: 12px;
		}

		.components-notice__buttons {
			margin-top: 12px;
		}
	}

	.components-button {
		&.is-link {
			text-decoration: none;
			padding: 6px 12px;
		}
	}
}

.woocommerce-marketplace__woo-update-manager-plugin__notices {
	margin-bottom: $grid-unit-50;
}

.woocommerce-marketplace__discover {
	.woocommerce-marketplace__woo-update-manager-plugin__notices {
		margin-bottom: 0;
	}
}

.woocommerce-marketplace__header-account-modal {
	.components-button {
		&.is-link {
			text-decoration: none;
			padding: 6px 12px;
		}
	}
}