
:root {
	--ul-green-dark: #045357;
	--ul-green-light: #9fc7b3;
	--ul-yellow: #f5e926;
	--ul-orange: #e04814;
	--ul-rouge: #db251c;
}

.archive {
	.price .subscription-details {
		font-size: .5em;
	    font-weight: 400;

	    small {
	    	display: block;
	    	line-height: 1.6;
	    }
	}

	.from {
		color: #fff !important;
	}
}

.archive,
.single {
	.price .from {
		display: block;
	}
	.price .fee {
		display: block;
		margin-top: 0.5rem;
		font-style: italic;
		font-size: 0.8em;
		color: #a00;
		font-weight: 500;
		letter-spacing: -.05em;
	}
}

.single {
	.price .from,
	.price .subscription-details {
		font-size: .5em;
	    font-weight: 400;
	}

	.price .subscription-details small {
		display: block;
		font-style: italic;
		line-height: 1.6;
		color: var(--ul-rouge);
		font-weight: 500;
	}

	.single_variation_wrap {
		div.single_variation {
			padding: 1rem 2rem;
			border: 1px solid var(--ul-green-dark);
			background-color: var(--ul-green-light);
			margin-bottom: 2rem;
			border-radius: 0.5rem;

			span.price {
				color: #fff;
				color: var(--ul-green-dark);
			}
		}
	}
}

body.woocommerce-account {

	a.btn_subcription {
		display: inline-block;
		background-color: var(--ul-yellow);
		color: #000;
		padding: 1rem 1.5rem;
		border-radius: 3rem;
		font-weight: 700;
		text-transform: uppercase;
		font-family: 'Jost', sans-serif;
		font-size: 1.1rem;

		&:hover,
		&:focus {
			background-color: var(--ul-orange);
			color: #fff;
			text-decoration: none;
		}
	}

	form[id^="form_abo_eticket_"] {

		.ce_columns_flex {
			flex-wrap: wrap;
		}

		.ce_columns_flex > div {
			padding-right: 0.5rem;

			&:first-child {
				width: 100%;
				margin-bottom: .5rem;
			}

			label {
			    margin-top: 0.8em;
			    margin-bottom: 0.2em;
			}

			a.btn_download_voucher {
				display: inline-block;
				background-color: var(--ul-yellow);
				color: #000;
				padding: .4rem 1rem;
				border-radius: 4px;
				text-transform: uppercase;
				font-family: 'Jost', sans-serif;

				&:hover,
				&:focus {
					background-color: var(--ul-orange);
					color: #fff;
					text-decoration: none;
				}

				&.disable_btn {
					background-color: #ccc;
					color: #000;
				}
			}
		}

		input[id^="ulabo_title_voucher"] {
			border-top: 0;
			border-left: 0;
			border-right: 0;
			border-bottom: 2px solid var(--ul-orange);
			font-weight: 700;
			color: var(--ul-orange);
		}

		input[id^="ulabo_birthday_voucher"] {
			max-width: 160px;
		}

	}

}

#popup_new_abo {
	position: fixed;
	z-index: 2000000000;
	top: 0; left: 100.5vw;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.42);
	display: flex;
	justify-content: center;
	align-items: center;

	.popup_new_abo-container {
		transform: scale(0);
		transition: all .6s ease;
		padding: 2rem clamp(1.5rem, 1.5vw, 3rem);
		background-color: #fff;
		border-radius: 3px;
		box-shadow: 0 0 4px rgba(0,0,0,.8);
		text-align: center;
		max-width: 96%;

		h2 {
			color: var(--ul-orange);
			font-weight: 700;
		}

		.btn_actions {
			margin-top: 2rem;
			display: flex;
			justify-content: center;

			a {
				display: inline-block;
				background-color: var(--ul-yellow);
				color: #000;
				padding: 1rem 1.5rem;
				border-radius: 3rem;
				font-weight: 700;
				text-transform: uppercase;
				font-family: 'Jost', sans-serif;
				font-size: 1.1rem;

				&:hover,
				&:focus {
					background-color: var(--ul-orange);
					color: #fff;
				}
			}
		}
	}

	&.show_invite {
		left: 0;

		.popup_new_abo-container {
			transform: scale(1);
		}
	}
}