#availability-calendar {
	width: 100%;
	border: none;
}

body dialog.pricing-calendar-modal {
	transition: .25s all ease-in-out;
    position: fixed;
    background-color: #FFF;
    max-width: 700px;
    width: 100%;
    margin: auto;
    padding: 45px 30px 30px!important;
    opacity: 0;
    border: none;
    font-family: 'aktiv-grotesk', sans-serif;
    font-weight: 400;
    border: 1px solid #DFDFDF;
    -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-variant-ligatures: none;
	font-weight: 300!important;
	letter-spacing: 0!important;

	.back {
		transition: .25s all ease-in-out;
		position: absolute;
        top: 15px;
        left: 15px;
		font-size: 12px;
		cursor: pointer;
		opacity: 0;
		pointer-events: none;

		@media screen and (min-width: 768px) {
	        top: 30px;
	        left: 30px;
		}

		&:hover {
			text-decoration: underline;
		}

		&.active {
			animation: fadeIn .5s forwards ease-in-out;
			pointer-events: auto;
		}
	}

    .close {
    	background: url('../img/close.svg') center / contain no-repeat;
    	-webkit-appearance: none;
    	border: none;
        position: absolute;
        top: 15px;
        right: 15px;
        cursor: pointer;
        outline: 0;
        width: 20px;
        height: 20px;
        padding: 0;

        svg {
        	width: 100%;
        	height: 100%;
        }
    }

    .inner {
    	display: flex;
    	flex-direction: column;
    	align-items: center;
    	justify-content: center;
    	position: relative;
    	max-width: 500px;
    	margin: 0 auto;
    	min-height: 500px;

    	@media screen and (min-width: 768px) {
    		min-height: 400px;
    	}
    }

    .introduction {
    	width: 100%;
    }

    p {
    	font-family: 'aktiv-grotesk', sans-serif!important;
    	font-size: 14.4px;
    	line-height: 1.2;
    	text-align: center;
    	margin: 0 0 10px 0;
    	margin-bottom: 10px;
    	font-weight: 300!important;
    	letter-spacing: 0!important;
    	padding: 0;
    	color: #000;

    	&.selected-date-p {
    		font-size: 16px;
    	}
    }

    strong {
    	font-family: 'aktiv-grotesk', sans-serif!important;
    	font-weight: 500;
    }

    @media screen and (min-width: 768px) {
    	br {
    		display: none;
    	}
    }

    .original-price:not(.no-offer) {
    	color: red;
    	text-decoration: line-through;
    }

    .option-buttons {
    	display: flex;
    	flex-direction: column;
    	justify-content: center;
    	align-items: center;
    	gap: 15px;
    	margin-top: 30px;
    	width: 100%;

    	@media screen and (min-width: 768px) {
    		flex-direction: row;
    	}

	    a.option-button, .option-button {
	    	display: flex;
	    	justify-content: center;
	    	align-items: center;
		   	font-family: 'aktiv-grotesk', sans-serif!important;
	    	transition: .25s background-color ease-in-out;
	    	background: #000;
	    	color: #FFF;
	    	width: auto;
	    	border-color: #000;
	    	min-width: auto;
	    	width: 230px;
	    	height: 46px;
	    	text-transform: uppercase;
	    	font-size: 14.4px;
	    	text-align: center;
	    	font-weight: 400!important;
	    	cursor: pointer;
	    	-webkit-appearance: none!important;
	    	border: none!important;
	    	letter-spacing: 0!important;
	    	border-radius: 0!important;
	    	pointer-events: auto;
	    	opacity: 1;
	    	text-box: trim-both cap alphabetic;
	    	line-height: 1;
	    	padding-top: 3px;
	    	text-decoration: none!important;

			&:hover {
				color: #fff!important;
				background-color: #444;
				border-color: black;
			}
	    }
    }

    &:not(:has(.option-buttons)) {
    	.form-container {
    		opacity: 1;
    		display: block;
    		pointer-events: auto;
    	}
    }

    .form-container {
    	transition: .25s all ease-in-out;
    	display: flex;
    	flex-direction: column;
    	align-items: center;
    	justify-content: center;
    	display: none;
    	background: #FFF;
    	opacity: 0;
    	pointer-events: none;

    	&.active {
    		display: flex;
    		animation: fadeIn .5s forwards ease-in-out;
    		pointer-events: auto;
    	}

    	p.prompt {
    		margin-bottom: 30px;

    		@media screen and (min-width: 768px) {
    			margin-bottom: 40px;
    		}
    	}
    }

    .gform_heading, .gform_submission_error {
    	display: none;
    }

	form[data-active-form="true"] button:not(.close) {
		pointer-events: none;
	}
	form[data-active-form="true"] button:not(.close):before {
		opacity: 1;
	}

	form[data-active-form="true"] button:not(.close) span {
		opacity: 0;
	}
	form[data-active-form="true"] button:not(.close) span:after {
		opacity: 0;
	}

    .wpcf7, #availability-calendar-form, .gform_wrapper {
    	width: 100%;

		p, .inner-form-container, .gform_fields {
			width: 100%;
			grid-template-columns: repeat(2, 1fr)!important;
			gap: 16px!important;

			@media screen and (max-width: 768px) {
				gap: 15px!important;
			}
		}

		form {
			font-family: 'aktiv-grotesk', sans-serif;
			margin: 0;
			border: none;
			padding: 0;
			background: none;

			br {
				display: none;
			}
		}

		label, .form-field, .gfield {
			font-size: 15px!important;
	    }

		.label {
			display: block;
			margin: 0 0 5px 0;
		}

		.form-field, label, .gfield {
			grid-column: 1 / -1;
			margin: 0;

			@media screen and (min-width: 768px) {
				grid-column: span 1;
			}
		}

		label:has(textarea), label:has([type="email"]), .form-field.email-field, .gfield--type-email, .gfield--type-textarea {
			display: block;
			width: 100%!important;
			grid-column: 1 / -1!important;
		}

		input[type="text"], input[type="email"], input[type="tel"], textarea {
			font-family: 'aktiv-grotesk', sans-serif!important;
			transition: .25s all ease-in-out;
			border: 1px solid #bfbfbf!important;
			box-shadow: none!important;
			color: #000!important;
			font-size: 15px!important;
			line-height: 1.5em!important;
			letter-spacing: 0!important;
			font-weight: 300!important;
			height: 44px;
			border-radius: 0;
			margin: 0!important;
			width: 100%;
			background: #FFF;
			padding: 10px!important;
			display: block;
			min-height: auto;
		}

		textarea {
			height: 120px!important;
			max-height: 120px!important;
		}

		::placeholder {
			font-family: 'aktiv-grotesk', sans-serif!important;
			font-size: 15px!important;
			line-height: 1.5em!important;
			color: #000!important;
		}

		input:hover, textarea:focus, input:focus, textarea:hover {
			border-color: #000!important;
		}
    }

    input[aria-invalid=true], textarea[aria-invalid=true] {
    	border-color: #cb1b23!important;
    }

    .wpcf7-not-valid-tip, .not-valid, .validation_message {
    	font-family: 'aktiv-grotesk', sans-serif!important;
    	display: block!important;
    	position: static;
    	margin-top: 10px;
    	color: #db0e0e;
    	font-size: 9px!important;
    	line-height: 1;
    	text-align: left;
    	margin: 10px 0 0 0!important;
    	letter-spacing: 0;
    	font-weight: 400;
    }
    .not-valid {
    	display: none!important;
    }

    .error .not-valid {
    	display: block!important;
    }

    span.error {
    	display: none!important;
    }

    input[type="submit"], button:not(.close) {
    	font-family: 'aktiv-grotesk', sans-serif!important;
    	transition: .25s background-color ease-in-out;
    	background: #000;
    	color: #FFF;
    	margin-top: 30px;
    	width: auto;
    	border-color: #000;
    	min-width: auto;
    	width: 230px;
    	height: 46px;
    	text-transform: uppercase;
    	font-size: 14.4px;
    	text-align: center;
    	padding: 0!important;
    	font-weight: 400!important;
    	margin: 30px auto 0 auto;
    	cursor: pointer;
    	-webkit-appearance: none!important;
    	border: none!important;
    	letter-spacing: 0!important;
    	border-radius: 0!important;
    	position: static;
    	top: auto;
    	left: auto;
    	pointer-events: auto;
    	opacity: 1;
    	text-box: trim-both cap alphabetic;
    }

    button:not(.close) {
    	position: relative;

    	   &:before {
	        transition: .25s all ease-in-out;
	        background-color: #000;
	        background-image: url('../img/processing.gif');
	        background-size: contain;
	        background-repeat: no-repeat;
	        background-position: center;
	        background-size: 30px;
	        content: '';
	        position: absolute;
	        z-index: 5;
	         opacity: 0;
	        top: -2px;
	        left: -2px;
	        height: calc(100% + 4px);
	        width: calc(100% + 4px);
    	}
    }

    .gform_footer {
    	margin-top: 30px;

    	@media screen and (min-width: 768px) {
    		margin-top: 40px;
    	}

    	input[type="submit"], button:not(.close) {
    		margin-top: 0;
    	}
    }

	input[type="submit"].submitting {
		pointer-events: none;
		background-color: #000;
		background-image: url('../img/processing.gif');
        background-size: 25px;
        background-repeat: no-repeat;
        background-position: center;
        font-size: 0;
	}

	input[type="submit"]:hover, button:not(.close):hover {
		color: #fff!important;
		background-color: #444;
		border-color: black;
	}

	p.small {
		display: block!important;
    	font-size: 12px;
    	line-height: 1.2;
    	margin-top: 30px;
    	text-decoration: none;
    	color: #000;

    	a {
    		font-family: 'aktiv-grotesk', sans-serif!important;
    		letter-spacing: 0;
    		font-size: 12px;
    		line-height: 1.2;
    		color: #000;
    		text-decoration: underline!important;
    		font-weight: 300;
    		box-shadow: none;

    		&:after {
    			display: none;
    		}
    	}
	}

	.wpcf7-spinner, .ajax-loader {
		display: none!important;
	}

    &::backdrop {
        background: rgba(255,255,255, 0.5);
        opacity: 0;
    }

    .success-message {
    	transition: .5s all ease-in-out;
    	opacity: 0;
    	pointer-events: none;
    	display: flex;
    	flex-direction: column;
    	justify-content: center;
    	align-items: center;
    	position: absolute;
    	top: 0;
    	left: 0;
    	width: 100%;
    	height: 100%;
    	background: #FFF;

    	.inner-success-message {
	    	display: flex;
	    	flex-direction: column;
	    	justify-content: center;
	    	align-items: center;
	    	max-width: 400px;
    	}

    	h2, h3 {
    		font-style: normal;
    		text-transform: none;
    		font-size: 36px!important;
    		line-height: 1!important;
    		font-family: 'warnock-pro-subhead', sans-serif!important;
    		font-weight: 300!important;
    		margin: 0 0 10px 0!important;
    		letter-spacing: 0!important;
    		color: #000;
    	}

    	h2:after, h2:before {
    		display: none;
    	}

    	h3 {
    		font-style: italic;
    		font-size: 30px!important;
    	}

    	p {
    		line-height: 2;
    	}

    	br {
    		display: block;
    	}

		@media screen and (max-width: 767px) {
			strong {
				display: block;
			}
		}

    	.vertical-divider {
    		height: 50px;
    		width: 1px;
    		background: #000;
    		margin: 10px 0 20px 0;
    	}

    	a.btn {
    		font-family: 'aktiv-grotesk', sans-serif;
    		margin-top: 15px;
    		display: flex;
    		justify-content: center;
    		align-items: center;
    		text-decoration: none;
	    	transition: .25s all ease-in-out;
	    	background: none;
	    	color: #000;
	    	border: 1px solid #000;
	    	width: 180px;
	    	height: 46px;
	    	text-transform: uppercase;
	    	font-size: 14.4px;
	    	text-align: center;
	    	font-weight: 400;
	    	letter-spacing: 0;
	    	padding: 0;
	    	box-shadow: none;

	    	&:before, &:after {
	    		display: none;
	    	}
    	}

    	a.btn:hover {
    		background: #000;
    		color: #FFF;
    	}
    }

    .success-message.message-sent {
    	opacity: 1;
    	pointer-events: auto;
    }

    .wpcf7-response-output {
    	display: none!important;
    }
}

#availability-calendar-form {
    input[type="submit"] {
    	margin-top: 24px;
    }

    p.small {
    	margin-top: 14px;
    }
}

.pricing-calendar-modal[open] {
	animation: fadeIn .5s forwards ease-in-out;
	animation-delay: .25s;

    &::backdrop {
    	opacity: 1;
        animation: fadeIn .5s forwards ease-in-out;
    }
}

 @media screen and (max-width: 768px) {
	.pricing-calendar-modal {
    	max-width: 90vw;
    	padding: 60px 20px 20px 20px;
	}
}

@keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}