.cart-sub-transform {
	margin-top    : 10px;
	background    : linear-gradient(79deg, #FFB412 0.01%, #F80A7D 32.23%, #7E27B7 65.88%, #0244F2 100.02%);
	border-radius : 10px;
	box-shadow    : 0 4px 20px 0 rgba(0, 0, 0, 0.06);
	padding       : 4px;
}

.cart-sub-transform_container {
	border-radius   : 7px;
	background      : var(--color-white-default);
	padding         : 25px;
	display         : flex;
	gap             : 50px;
	align-items     : center;
	justify-content : center;
}

.cart-sub-transform_title {
	display     : flex;
	align-items : center;
	gap         : 5px;
}

.cart-sub-transform_title span {
	max-width   : 390px;
	color       : var(--color-primary);
	text-align  : center;
	font-size   : 20px;
	font-style  : normal;
	font-weight : 700;
	line-height : 26px;
}

.cart-sub-transform #subscription-interval {
	width              : 100%;
	max-width          : 490px;
	height             : 45px;
	margin             : 0 0 1em 0;
	padding            : 0.5em 30px 0.5em 20px;
	border-radius      : 50px;
	border             : 1px solid #D9D9D9;
	appearance         : none;
	-webkit-appearance : none;
	-moz-appearance    : none;
	background         : white url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'><path d='M10.9219 1.31323L5.96124 6.37308L1.00061 1.31323' stroke='%230C1B46' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat right 10px center;
	background-size    : 12px 8px;
}

.cart-sub-transform .btn-cart-to-sub {
	width          : 100%;
	max-width      : 25em;
	font-weight    : bolder;
	padding        : 0.75em 0;
	text-transform : initial;
}

@media (max-width : 768px) {
	.cart-sub-transform_container {
		flex-direction : column;
	}
}