@import "@automattic/typography/styles/woo-commerce";
@import "@wordpress/base-styles/breakpoints";

.wooexpress-plans__interval-toggle-wrapper {
	display: flex;
	justify-content: center;
	margin: 48px 0 32px 0;
	padding: 0 20px;

	.wooexpress-plans__interval-toggle {
		font-weight: 500;
		max-width: -moz-fit-content;
		max-width: fit-content;
		width: auto;

		@media (max-width: $break-mobile) {
			max-width: 100%;
			width: 100%;

			.wooexpress-plans__interval-savings {
				display: none;
			}
		}
	}
}

.wooexpress-plans__grid.is-2023-pricing-grid {
	.plan-price .plan-price__currency-symbol {
		font-size: $woo-font-title-medium;
	}
}

.enterprise-ecommerce__banner {
	align-items: center;
	border: 1px solid var(--color-border-subtle);
	margin: 0.5em auto 2em;
	max-width: calc(800px - 3em);
	padding: 2em 1.25em;

	@media (max-width: $break-medium) {
		.is-ecommerce-trial-plan & {
			margin-left: 1.25em;
			margin-right: 1.25em;
		}
	}

	.enterprise-ecommerce__content {
		display: flex;
		flex-flow: row wrap;
		justify-content: space-between;

		.enterprise-ecommerce__title {
			flex: 3 100%;
			font-size: $woo-font-title-medium;
			margin-bottom: 0.5em;
			margin-top: 0;
		}

		.enterprise-ecommerce__subtitle {
			flex: 2 0 0;
			font-size: $woo-font-body-extra-small;
		}

		.enterprise-ecommerce__cta {
			flex: 1 0 0;
			margin-left: 2em;
			text-align: right;

			@media (max-width: $break-small) {
				flex: 1 100%;
				margin-top: 2em;
				margin-left: 0;
				text-align: center;
			}

			.button {
				border-color: #0675c4;
				color: #0675c4;
				width: 240px;

				&:hover {
					border-color: #044b7a;
					color: #044b7a;
				}

				@media (max-width: $break-small) {
					width: 100%;
				}
			}
		}
	}
}
