/*
 Plugin Name: Course Booking System
 Plugin URI: https://commotion.online/individuelles-kurs-online-buchungssystem/
 Description: Individual course booking system for recurring events and specific needs.
 Version: 1.0
 Author: ComMotion
 Author URI: https://commotion.online
 Text Domain: course-booking-system
*/

/* Basic */

	.decline, .disabled {
		opacity: .75;
		filter: grayscale(100%);

		/* Flickering fix for Safari */
		-webkit-transform: translateZ(0) scale(1,1);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
	}

	.btn, .button {
		display: inline-block;
	}

	video {
		max-width: 100%;
	}

/* AJAX */

	.loader {
		display: none;
		position: fixed;
		top: calc(50% - 50px);
		left: calc(50% - 25px);
		z-index: 10;

		width: 100px !important;
		height: 50px;
		margin: 0;
		padding: 10px 20px;
		background-color: #888;
		border-radius: 5px;
	} .loader:before {
		content: '';
		position: fixed;
		top: 0; right: 0; bottom: 0; left: 0;
		background-color: rgba(0,0,0,.5);
	}

	.loader > div {
		width: 18px;
		height: 18px;
		background-color: #fff;
		border-radius: 100%;
		display: inline-block;
		-webkit-animation: sk-bouncedelay 1.5s infinite ease-in-out both;
		animation: sk-bouncedelay 1.5s infinite ease-in-out both;
	} .loader > div:first-child {
		-webkit-animation-delay: -.5s;
		animation-delay: -.5s;
	} .loader > div:nth-child(2) {
		-webkit-animation-delay: -.25s;
		animation-delay: -.25s;
	}

	@-webkit-keyframes sk-bouncedelay {
		0%, 100%, 80% {
			-webkit-transform: scale(0)
		} 40% {
			-webkit-transform: scale(1)
		}
	} @keyframes sk-bouncedelay {
		0%, 100%, 80% {
			-webkit-transform: scale(0);
			transform: scale(0)
		} 40% {
			-webkit-transform: scale(1);
			transform: scale(1)
		}
	}

/* Archive */

	.course form,
	body.post-type-archive-course form {
		padding-bottom: 1.5em;
	}

	body.post-type-archive-course .posts-container { /* Salient Fix */
		height: auto !important;
	}

/* Single */

	.course:not(.type-course) {
		position: relative;
		max-width: unset;
		padding: 5rem;
		margin-bottom: 1rem;
		background-color: #fff;
		border: 1px solid rgba(0,0,0,.5);
	}

	.course .red {
		color: #d65050;
	} .course .red:hover {
		color: #ff0000;
	}

	.course .availability label {
		display: inline;
	} .course .availability input[type="number"] {
		max-width: 40px;
		padding: 0;
		font-size: inherit;
		text-align: center;
		background-color: transparent;
		border: 0 none;
		appearance: none;
		-webkit-appearance: none;
	}

	.course .progress-wrapper {
		margin-bottom: 15px;
		padding-top: 0;
	} .course progress {
		color: #fff;
		width: 100%;

		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		border: none;
	} .course progress::-webkit-progress-bar {
		background-color: #f3f3f3;
	} .course progress::-webkit-progress-value {
		background: #cdeb8e;
		background: -moz-linear-gradient(top,  #cdeb8e 0%, #a5c956 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cdeb8e), color-stop(100%,#a5c956));
		background: -webkit-linear-gradient(top,  #cdeb8e 0%,#a5c956 100%);
		background: -ms-linear-gradient(top,  #cdeb8e 0%,#a5c956 100%);
		background: linear-gradient(to bottom,  #cdeb8e 0%,#a5c956 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cdeb8e', endColorstr='#a5c956',GradientType=0 );
	} .course progress::-moz-progress-bar {
		background: #cdeb8e;
		background: -moz-linear-gradient(top,  #cdeb8e 0%, #a5c956 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cdeb8e), color-stop(100%,#a5c956));
		background: -webkit-linear-gradient(top,  #cdeb8e 0%,#a5c956 100%);
		background: -ms-linear-gradient(top,  #cdeb8e 0%,#a5c956 100%);
		background: linear-gradient(to bottom,  #cdeb8e 0%,#a5c956 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cdeb8e', endColorstr='#a5c956',GradientType=0 );
	}

	.course .yellow progress::-webkit-progress-bar {
		background-color: #f3f3f3;
	} .course .yellow progress::-webkit-progress-value {
		background: #f7cd2e;
		background: -moz-linear-gradient(top,  #f7cd2e 0%, #f6b12a 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f7cd2e), color-stop(100%,#f6b12a));
		background: -webkit-linear-gradient(top,  #f7cd2e 0%,#f6b12a 100%);
		background: -ms-linear-gradient(top,  #f7cd2e 0%,#f6b12a 100%);
		background: linear-gradient(to bottom,  #f7cd2e 0%,#f6b12a 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7cd2e', endColorstr='#f6b12a',GradientType=0 );
	} .course .yellow progress::-moz-progress-bar {
		background: #f7cd2e;
		background: -moz-linear-gradient(top,  #f7cd2e 0%, #f6b12a 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f7cd2e), color-stop(100%,#f6b12a));
		background: -webkit-linear-gradient(top,  #f7cd2e 0%,#f6b12a 100%);
		background: -ms-linear-gradient(top,  #f7cd2e 0%,#f6b12a 100%);
		background: linear-gradient(to bottom,  #f7cd2e 0%,#f6b12a 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7cd2e', endColorstr='#f6b12a',GradientType=0 );
	}

	.course .red progress::-webkit-progress-bar {
		background-color: #f3f3f3;
	} .course .red progress::-webkit-progress-value {
		background: #d65050;
		background: -moz-linear-gradient(top,  #fC0d1b 0%, #c30712 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fC0d1b), color-stop(100%,#c30712));
		background: -webkit-linear-gradient(top,  #fC0d1b 0%,#c30712 100%);
		background: -ms-linear-gradient(top,  #fC0d1b 0%,#c30712 100%);
		background: linear-gradient(to bottom,  #fC0d1b 0%,#c30712 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fC0d1b', endColorstr='#c30712',GradientType=0 );
	} .course .red progress::-moz-progress-bar {
		background: #d65050;
		background: -moz-linear-gradient(top,  #fC0d1b 0%, #c30712 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fC0d1b), color-stop(100%,#c30712));
		background: -webkit-linear-gradient(top,  #fC0d1b 0%,#c30712 100%);
		background: -ms-linear-gradient(top,  #fC0d1b 0%,#c30712 100%);
		background: linear-gradient(to bottom,  #fC0d1b 0%,#c30712 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fC0d1b', endColorstr='#c30712',GradientType=0 );
	}

	.course table, .course tr, .course th, .course td, .course table input {
		font-size: 16px;
	} .course th {
		min-width: 40px;
	} .course th:first-child, .course td:first-child, .course th:last-child, .course td:last-child {
		text-align: center;
	} .course table input {
		height: auto !important;
		padding: 0 !important;
		background-color: transparent !important;
		outline: none !important;
		border: none !important;
		border-bottom: 2px solid #e0e0e0 !important;
	} .course table .button, .course .availability .button {
		margin: 0;
		padding: 0;
		width: 25px;
		height: 25px;
		line-height: 25px;
		text-align: center;
		border-radius: 50%;
	} .course table .button:hover, .course .availability .button:hover {
		opacity: .75;
		text-decoration: none !important;
	} .course table .button.goodwill {
		margin-top: .25rem;
		color: #000;
		background-color: var(--wc-green);
	}

	.course .export:before, .course .email:before, .course .sms label[for="message"]:before {
		content: "\f316";
		font-family: dashicons;
		speak: none;
		display: inline-block;
		margin-right: .5em;
	} .course .email:before {
		content: "\f465";
	} .course .sms label[for="message"]:before {
		content: "\f470";
	}

	.course form textarea {
		display: block;
		width: 100%;
	}

	.course h2:empty, .course h3:empty, .course p.intro:empty {
		width: 100%;
		height: 50px;

		position: relative;
		animation-duration: 5s;
		animation-fill-mode: forwards;
		animation-iteration-count: infinite;
		animation-name: skeletonScreenAnimation;
		animation-timing-function: linear;
		background-color: #f6f7f8;
		background: linear-gradient(to right, #eee 8%, #ccc 18%, #eee 33%);
		background-size: 100vw 50px;
	} .course p.intro:empty {
		height: 25px;
	}

	@keyframes skeletonScreenAnimation {
		0% {
			background-position: -100vw 0
		} 100% {
			background-position: 100vw 0
		}
	}

	/* Slick */

	.course .slider.slick-dotted.slick-slider {
		margin-bottom: 100px;
	}

	.course .slider .slide {
		padding-right: 2rem;
		outline: none;
	} .course .slide h4 {
		margin-top: 2rem;
	}

	.course button.slick-prev, .course button.slick-next {
		width: 30px;
		height: 30px;
		background-color: transparent;
	} .course button.slick-prev {
		left: -3.5rem;
	} .course button.slick-next {
		right: -3.5rem;
	} .course button.slick-prev:before,.course button.slick-next:before {
		color: #000;
		font-size: 30px;
		transition: all .3s;
	}

	.course .slick-dots {
		bottom: -35px;
	} .course .slick-dots li button:before {
		font-size: 15px;
		line-height: 40px;
	}

	/* Livesearch */

	#livesearch, #livesearch-waitlist {
		display: none;
	}

	.livesearch-closer {
		position: fixed;
		top: 0; right: 0; bottom: 0; left: 0;
		z-index: 9998;
	}

	.livesearch {
		position: absolute;
		z-index: 9999;

		margin: 0;
		padding: 0;
		width: 250px !important;
		max-height: 300px;
		overflow-y: scroll;

		border: 1px solid rgba(0,0,0,.5);
		background: rgba(255,255,255,0.95);
		box-shadow: rgba(0,0,0,.2) 0 10px 20px;
	}

	.livesearch li {
		margin: 0;
		padding: 0;
		list-style: none;
	} .livesearch li:not(:last-child) {
		border-bottom: 1px solid rgba(0,0,0,.5);
	}

	.livesearch li span:not(.expiry), .livesearch li a {
		display: block;
		padding: 5px 10px;
	} .livesearch li a {
		color: inherit;
		font-size: 16px;
		line-height: normal;
		text-decoration: none;
	} .livesearch li a:hover, .livesearch li.selected a {
		background: rgba(0,0,0,.1);
	}

/* Weekday */

	.cbs-weekday-grid .cbs-weekday-course h2 {
		margin-top: 0;
	}

	.cbs-weekday-grid .cbs-weekday-course img {
		float: left;
		width: 75px;
		margin-right: 1em;
	}

/* WooCommerce */

	/* Message */

	.wc-block-components-notice-banner[data-fixed="true"] {
		position: fixed !important;
		top: 1em; right: 1em; left: 1em;
		width: calc(100% - 2em);
		z-index: 99999;
	} .admin-bar .wc-block-components-notice-banner[data-fixed="true"] {
		top: calc(32px + 1em);
	}

	/* Account */

	#account {
		margin-bottom: 5rem;
	}

	.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--delete a {
		color: red;
	}

	/* Shop */

	.cbs-booking-progress {
		display: flex;
		justify-content: center;
		margin: 2rem 0;
		padding: 0;
		list-style: none;
	} .cbs-booking-progress-step {
		width: 20%;
		position: relative;
		text-align: center;
		list-style: none;
	} .cbs-booking-progress-step:not(.active) {
		opacity: .25;
	} .cbs-booking-progress-step:not(:first-child):before {
		content: '';
		width: calc(100% - 30px);
		height: 2px;
		background-color: #000;

		position: absolute;
		top: 14px; left: calc(-50% + 15px);
		z-index: -1;
	} .cbs-booking-progress-step-number {
		width: 30px;
		height: 30px;
		font-size: 20px;
		line-height: 30px;
		margin: 0 auto 1rem;
		color: #fff;
		background-color: #000;
		border-radius: 50%;
	} .cbs-booking-progress-step-description {
		font-size: .875rem;
	}

	.cbs-booking-overview {
		padding: 1rem 1.5rem 1.5rem;
		margin-bottom: 2em;
		border-radius: 10px;
		box-shadow: rgba(0,0,0,.2) 0 10px 20px;

		overflow: hidden;
		position: relative;
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
	} .cbs-booking-overview > * {
		position: relative;
		z-index: 2;
		color: inherit;
	} .cbs-booking-overview > p {
		margin: 0;
		padding: 0;
	}

	.cbs-booking-products {
		margin-bottom: 2em;
	} .cbs-booking-product {
		padding: 1rem 0;
		border-top: 1px solid #000;
	}

@media only screen and (min-width: 768px) {

	.cbs-weekday-grid {
		display: grid;
		grid-template-columns: repeat(2,50%);
		column-gap: 2.5%;
		row-gap: 1rem;
	}

	.woocommerce-MyAccount-content table.bookings-table time.Y-m-d.date-format-short, .woocommerce-MyAccount-content table.subscription-table time.Y-m-d.date-format-short, .woocommerce-MyAccount-content table.bookings-past-table time.Y-m-d.date-format-short, .woocommerce-MyAccount-content table.waitlist-table time.Y-m-d.date-format-short {
		display: none;
	}

	span.time-delimiter {
		margin: 0 5px;
	}
}

@media only screen and (max-width: 768px) {

	/* Single */

	.course:not(.type-course) {
		padding: 25px;
	}

	.course .slider .slide {
		padding: 0;
	}

	.course button.slick-prev, button.slick-next {
		width: 30px;
		height: 30px;
		background-color: #fff;
		border-radius: 50%;
	} .course button.slick-prev {
		left: -40px;
	} .course button.slick-next {
		right: -40px;
	} .course button.slick-prev:before, button.slick-next:before {
		color: #000;
		font-size: 35px;
		margin-left: -2px;
		transition: all .3s;
	}

	/* WooCommerce */

	/* .woocommerce-MyAccount-content table.bookings-table, .woocommerce-MyAccount-content table.subscription-table, .woocommerce-MyAccount-content table.bookings-past-table, .woocommerce-MyAccount-content table.waitlist-table {
		display: block;
		overflow-x: auto;
		white-space: nowrap;
		border: 0 none;
	} */ .woocommerce-MyAccount-content table.bookings-table td:not(:first-child), .woocommerce-MyAccount-content table.subscription-table td:not(:first-child), .woocommerce-MyAccount-content table.bookings-past-table td:not(:first-child), .woocommerce-MyAccount-content table.waitlist-table td:not(:first-child) {
		white-space: nowrap;
	} .woocommerce-MyAccount-content table.bookings-table time.Y-m-d:not(.date-format-short), .woocommerce-MyAccount-content table.subscription-table time.Y-m-d:not(.date-format-short), .woocommerce-MyAccount-content table.bookings-past-table time.Y-m-d:not(.date-format-short), .woocommerce-MyAccount-content table.waitlist-table time.Y-m-d:not(.date-format-short),
	.woocommerce-MyAccount-content table.bookings-table span.time-formatted-suffix, .woocommerce-MyAccount-content table.subscription-table span.time-formatted-suffix, .woocommerce-MyAccount-content table.bookings-past-table span.time-formatted-suffix, .woocommerce-MyAccount-content table.waitlist-table span.time-formatted-suffix {
		display: none;
	}
}

@media only screen and (max-width: 480px) {

	/* Single */

	.course .slide {
		padding: 0;
	}

	.slick-dots li {
		margin: 0 !important;
	}
}

@media print {

	table {
		font-size: 14px;
	}

	.woocommerce-account .woocommerce-MyAccount-content {
		float: none;
		width: 100%;
	}

	a[href]:after { content: none !important; }
	img[src]:after { content: none !important; }

	.cbs-weekday-grid {
		display: block;
	} .cbs-weekday-grid .cbs-weekday-course:not(:first-child) {
		break-before: always;
		page-break-before: always;
	}

	.course:not(.type-course) {
		padding: 25px;
		margin-bottom: 0;
	}
}