/**
 * @package 	WordPress
 * @subpackage 	Medical Clinic
 * @version 	1.1.6
 * 
 * Timetable CSS Rules
 * Created by CMSMasters
 * 
 */



@import "../../../../../theme-framework/theme-style/css/less/general.less";


/*-------------------------------------------------------------------------*/
/* Timetable Filters
/*-------------------------------------------------------------------------*/

/* --- navigation wrapper --- */
.tt_navigation_wrapper {
	margin:0 -10px 40px;
	.display_flex;
	.justify_content(space-between);
	.align_items(center);
}

.tt_navigation_cell {
	display:inline-block;
	max-width:100%;
	padding:0 10px;
}

/* --- dropdown filter --- */
.tabs_box_navigation {
	list-style-type:none;
	display:inline-block;
	display:block;
	margin:0;
	padding:0 40px 0 0;
	position:relative;
	z-index:10;
	.cl;
	overflow:visible !important;
	.fl;
	
	&:last-of-type {
		padding-right:0;
	}
	
	ul, 
	li {
		list-style-type:none;
		margin:0;
		padding:0;
		
		&:before {
			content:none;
		}
	}
	
	.tabs_box_navigation_selected {
		display:inline-block;
		min-width:170px;
		max-width:100%;
		position:relative;
		.bd;
		
		&:before {
			content:'\e946';
			font-family:"fontello";
			font-size:14px;
			.pos_abs(1em, 1em, auto, 15px);
		}
		
		&:hover {			
			&:before {
				-webkit-transform:rotate(180deg);
				-moz-transform:rotate(180deg);
				-ms-transform:rotate(180deg);
				-o-transform:rotate(180deg);
				transform:rotate(180deg);
			}
			
			.sub-menu {
				visibility:visible;
				.op(1);
			}
		}
		
		label {
			display:block;
			padding:12px 40px 12px 20px;
			cursor:pointer;
		}
		
		.tabs_box_navigation_icon {
			.dn;
		}
		
		.sub-menu {
			.bd;
			.bdt(0);
			padding:10px 0 17px;
			visibility:hidden;
			position:absolute;
			left:-2px;
			right:-2px;
			top:100%;
			.op(0);
			
			li {
				padding:3px 20px;
			}
			
			a {
				display:inline-block;
			}
		}
	}
}

/* --- generate pdf --- */
form.tt_generate_pdf {
	display:block;
	
	textarea.tt_pdf_html {
		.dn;
	}
}

/* --- tabs filter --- */
.ui-tabs {
	.tt_tabs_navigation.ui-widget-header {
		list-style:none;
		width:100%;
		margin:0;
		padding:0;
		float:none;
		background:none;
		.bdrs(0);
		.bd(0);
		.bdb;
		.cl;
		overflow:visible !important;
		
		li {
			float:none;
			display:inline-block;
			vertical-align:bottom;
			margin:0 -1px -1px 0;
			padding:0;
			.bdrs(0);
			.bd(0);
			background:none;
			
			&:before {
				content:none;
			}
			
			&:last-child {
				margin:0 0 -1px;
			}
			
			&.ui-tabs-active {
				padding:0;
				margin:0 -1px -1px 0;
			}
			
			a {
				display:block;
				padding:15px 25px;
				.bd;
				border-color:transparent;
				.tac;
				position:relative;
				
				&:before {
					content:'';
					display:block;
					height:2px;
					position:absolute;
					top:-1px;
					left:-1px;
					right:-1px;
				}
			}
			
			a:hover,
			a.selected,
			&.ui-tabs-active a {
				outline:none;
			}
		}
	}
}



/*-------------------------------------------------------------------------*/
/* Timetable Page
/*-------------------------------------------------------------------------*/

.middle_content .cmsmasters_tt_single_event {
	.cmsmasters_tt_event {
		padding:10px 0 0;
	}
}

.cmsmasters_timetable_shortcode {
	position:relative;
	
	&:after {
		.cl_after;
	}
}

.timetable_clearfix:after {
	font-size:0px;
	content:".";
	display:block;
	height:0px;
	visibility:hidden;
	clear:both;
}

.tt_booking_overlay,
.tt_hide {
	display:none !important;
}

/* --- lists --- */
div.tt_tabs {
	border:none !important;
	
	&.ui-widget-content {
		background:none;
		padding:0;
		margin:0;
		.bdrs(0);
	}
}

.tt_tabs .ui-tabs-panel {
	padding:0 !important;
	clear:both;
}

/* --- timetable --- */
table.tt_timetable {
	width:100%;
	margin:0;
	padding:0;
	border:none;
	border-collapse:separate;
	border-spacing:0;
}

table.tt_timetable th,
table.tt_timetable td {
	border:none;
}

table.tt_timetable th,
table.tt_timetable td.tt_hours_column {
	text-align:center;
	vertical-align:middle;
}

table.tt_timetable td.tt_hours_column {
	padding:0 5px;
}

table.tt_timetable th {
	width:12.5%;
	padding:10px 15px;
}

table.tt_timetable .event_container {
	padding:17px 15px 17px;
	position:relative;
}

table.tt_timetable .tt_single_event {
	.bd;
}

table.tt_timetable td {
	width:12.5%;
	vertical-align:top;
	height:31px;
	border:none;
	padding:0;
	position:relative;
}

table.tt_timetable .event {
	text-align:center;
	padding:0;
	vertical-align:top;
	
	div {
		text-align:inherit;
		
		&.tt_tooltip_content {
			text-align:inherit;
		}
	}
	
	&:not(.tt_single_event) {
		.event_container {
			.bd;
		}
	}
}

table.tt_timetable .event a,
table.tt_timetable .event .event_header {
	display:block;
}

table.tt_timetable .event_container .event_header {
	.op(.7);
}

table.tt_timetable .event a:hover {
	.op(.6);
}

table.tt_timetable .event .hours_container {
	padding:6px 0 13px;
}

table.tt_timetable .event .top_hour {
	padding-top:20px;
}

table.tt_timetable .event .bottom_hour {
	padding-bottom:13px;
}

table.tt_timetable .event {
	.available_slots {
		display:block;
	}
	
	.after_hour_text + .available_slots {
		margin-top:15px;
	}
}

table.tt_timetable .event .event_hour_booking_wrapper {
	display:block;
	
	&.always {
		margin:15px 0 0;
	}
	
	&.on_hover {
		position:absolute;
		left:0;
		right:0;
		top:auto;
		bottom:0;
		visibility:hidden;
		.op(0);
	}
	
	.event_hour_booking {
		display:block;
		width:100%;
		margin:0;
		padding:10px 18px;
		.op(1);
		
		&.unavailable {
			cursor:default;
		}
	}
}
	
table.tt_timetable .event.tt_single_event .event_hour_booking_wrapper {
	&.always {
		margin-top:0;
		padding:0 8px 15px;
	}
}

table.tt_timetable .event.tt_single_event:hover .event_hour_booking_wrapper.on_hover,
table.tt_timetable .event_container:hover .event_hour_booking_wrapper.on_hover {
	visibility:visible;
	.op(1);
} 

.event_layout_4 table.tt_timetable .event .top_hour {
	padding-top:4px;
	padding-bottom:12px;
}

table.tt_timetable .event hr {
	height:1px;
	margin:0;
	opacity:0.2;
	.bd(0);
}

/* --- tip/tooltip/qtip --- */
.tt_tooltip {
	position:relative;
}

.tt_tooltip .tt_tooltip_text {
	display:block;
	width:100% !important;
	max-width:100%;
	height:auto !important;
	padding-bottom:15px;
	visibility:hidden;
	position:absolute;
	left:0 !important;
	right:auto !important;
	top:auto !important;
	bottom:100% !important;
	z-index:1000;
	.op(0);
}

.tt_tooltip:hover .tt_tooltip_text {
	visibility:visible;
	.op(1);
}

.tt_tooltip .tt_tooltip_content {
	padding:10px 15px 15px;
}

.tt_tooltip .tt_tooltip_content a {
	margin-bottom:5px;
}

.tt_tooltip .tt_tooltip_arrow {
	display:block;
	.pos_abs(0, 0, 0, 0, auto, 10px);
	.bdt(5px);
	.bdl(5px);
	.bdr(5px);
	border-left-color:transparent !important;
	border-right-color:transparent !important;
}

/* --- booking --- */
.tt_booking_overlay {
	background-color:rgba(85,85,85,0.2);
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	z-index:999998;
}

.tt_booking {
    width:500px;
    margin:0 50px;
    position:absolute;
    z-index:999999;
	.bxsh(0px, 20px, 30px, -5px, .15);
	.tac;
	.bdbx;
	.ovh;
	
	.tt_booking_message {
		margin:40px;
		.tac;
		
		> div {
			.tac;
		}
	}
	
	&.in_iframe {
		margin:0 auto;
	}
	
	p {
		&.error-info {
			padding-bottom:0;
		}
		
		&:empty {
			.dn;
		}
	}
	
	a.tt_btn {
		display:inline-block;
		margin:20px 10px 0;
		padding:10px 18px;
		.tac;
		.ovh;
	}

	.tt_booking_message {
		padding:40px;
		.tac;
		
		&:empty {
			.dn;
		}
		
		> div {
			.tac;
		}
		
		.tt_booking_form  {
			padding:0 0 20px;
			
			.tt_field_wrapper {
				.tac;
				
				label {
					display:block;
					padding:0 0 10px;
				}
				
				.tt_slots_number_wrapper {
					.tac;
					
					> input {
						line-height:@input_height - 4px;
						height:@input_height;
						vertical-align:middle;
						
						&[type="button"] {
							padding:0 25px;
						}
						
						&[type="number"] {
							display:block;
							width:100%;
							text-align:center;
							margin:0 0 10px;
						}
					}
				}
			}
		}
	}
	
	p {
		&.error-info {
			padding-bottom:0;
		}
		
		&:empty {
			.dn;
		}
	}
	
	a.tt_btn {
		display:inline-block;
		margin:20px 10px 0;
		padding:0 18px;
		.tac;
		.ovh;
	}
}


.tt_center {
	.tac;
}

/* --- booking preloader --- */
.tt_preloader {
	width:70px;
	margin:50px auto 50px;
	.tac;
	
	> div {
		width:18px;
		height:18px;
		background-color:#E5E5E5;
		border-radius:100%;
		display:inline-block;
		-webkit-animation:sk-bouncedelay 1.4s infinite ease-in-out both;
		animation:sk-bouncedelay 1.4s infinite ease-in-out both;
	}
	
	.bounce1 {
		-webkit-animation-delay:-0.32s;
		animation-delay:-0.32s;
	}
	
	.bounce2 {
		-webkit-animation-delay:-0.16s;
		animation-delay:-0.16s;
	}
}

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

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


/* --- tabs --- */
.tt-ui-tabs-hide {
	display:none;
}

/* --- Timetable Small --- */
.tt_timetable.small {
	display:none;
}

.tt_timetable.small.desktop {
	display:block;
}

h3.box_header.plus+ul.tt_items_list {
	display:none;
}

ul.tt_items_list {
	list-style:none;
	padding:0 0 40px;
	margin:0;
	
	&:last-child {
		padding:0;
	}
	
	li {
		padding:10px;
		margin:0;
		
		&:before {
			content:none;
		}
		
		a, 
		span {
			.fl;
		}
		
		.value {
			.fr;
		}
	}
}



/*-------------------------------------------------------------------------*/
/* Timetable Post
/*-------------------------------------------------------------------------*/

.cmsmasters_tt_single_event {
	position:relative;
}

.cmsmasters_tt_event {
	padding:60px 0 0;
	position:relative;
	
	.cmsmasters_tt_event_header {
		margin:0;
		padding:0;
		.ovh;
		.cl;
		
		.cmsmasters_tt_event_subtitle {
			margin:-15px 0 20px;
			padding:0;
			position:relative;
		}
	}
	
	.cmsmasters_tt_event_content_wrap {
		padding-bottom:30px;
		position:relative;
		.ovh;
		
		&.with_sidebar {
			width:74%;
			padding-right:30px;
			.fl;
		}
		
		> figure {
			margin-bottom:35px;
		}
	}
	
	.cmsmasters_tt_event_sidebar {
		width:26%;
		.fl;
		
		> div {
			padding:22px 30px 34px;
			margin-bottom:25px;
			.bd;
		}
	}
	
	.cmsmasters_tt_event_hours {
		position:relative;
		.ovh;
		
		.cmsmasters_tt_event_hours_title {
			margin:0 0 26px;
			padding:0;
		}
		
		.cmsmasters_tt_event_hours_item {
			padding:6px 0;
			position:relative;
			.ovh;
			.bdb;

			&:last-child {
				.bdb(0);
			}
			
			.cmsmasters_tt_event_hours_item_title {
				max-width:50%;
				.fl;
				.ovh;
			}
			
			.cmsmasters_tt_event_hours_item_values {
				padding:0 0 0 15px;
				word-wrap:break-word;
				.tar;
				.ovh;
				
				> span {
					display:block;
				}
			}
		}
	}
	
	.cmsmasters_tt_event_details {
		position:relative;
		.ovh;
		
		.cmsmasters_tt_event_details_title {
			margin:0 0 26px;
			padding:0;
		}
		
		.cmsmasters_tt_event_details_item {
			padding:6px 0;
			position:relative;
			.ovh;
			.bdb;
			
			&:last-child {
				.bdb(0);
			}
			
			.cmsmasters_tt_event_details_item_title {
				max-width:50%;
				.fl;
				.ovh;
			}
			
			.cmsmasters_tt_event_details_item_desc {
				padding:0 0 0 15px;
				word-wrap:break-word;
				.tar;
				.ovh;
								
				> span {
					display:block;
				}
			}
		}
	}
	
	#event_hours_list {
		display:block;
		margin:0 -@col_mar;
		position:relative;
		
		&:after {
			.cl_after;
		}
		
		> li {
			width:round((100% / 3) - (@col_mar * 2), 2);
			margin:0 @col_mar 40px;
			position:relative;
			padding:15px 20px 0;
			.fl;
			.bd;
			
			&:before {
				content:none;
			}
			
			h4 {
				margin:0;
				
				&:last-of-type {
					margin-bottom:20px;
				}
			}
		}
	}
	
	.tt_event_hours_count {
		margin:0 5px;
	}
}



/*-------------------------------------------------------------------------*/
/* Timetable Upcoming Events
/*-------------------------------------------------------------------------*/

.tt_upcoming_events_widget {
	position:relative;
	.ovh;
}

.tt_upcoming_events_wrapper {
	width:100%;
	.cl;
	
	.caroufredsel_wrapper {
		width:100% !important;
		margin:0 !important;
		.ovh;
	}
	
	.tt_upcoming_event_controls {
		display:block;
		margin:0;
		position:relative;
		.ovh;
		
		> a {
			display:block !important;
			width:38px;
			height:38px;
			margin:10px 3px 0 0;
			position:relative;
			.bd;
			.fl;
			
			&:before {
				font-family:"fontello-custom";
				font-size:9px;
				line-height:9px;
				.pos_abs(1em, 1em, 0, 0, 0);
				.tac;
			}
			
			&#upcoming_event_prev:before {
				content:'\e900';
			}
			
			&#upcoming_event_next:before {
				content:'\e904';
			}
		}
	}
}

ul.tt_upcoming_events {
	width:100% !important;
	padding:0;
	margin:0;
	
	li {
		padding:0;
		margin:0;
		.bd(0);
		
		&:before {
			content:none;
		}
		
		&:first-child {
			.tt_upcoming_events_event_container {
				.bdt;
			}
		}
		
		.tt_upcoming_events_event_container {
			display:block;
			padding:15px 45px 15px 20px;
			.bd;
			.bdt(0);
			.ovh;
			
			&:before {
				content:'\e946';
				font-family:"fontello";
				font-size:12px;
				line-height:12px;
				.pos_abs(1em, 1em, auto, 15px, 18px, auto);
				.tac;
			}
			
			&:hover {
				&:before {
					content:'\e947';
				}
				
				.tt_event_hours_description, 
				img.wp-post-image {
					display:block;
				}
			}
			
			.tt_upcoming_events_arrow {
				.dn;
			}
			
			.tt_upcoming_events_hours {
				display:block;
			}
			
			.tt_event_hours_description {
				padding:13px 0 0;
				.dn;
			}
			
			img.wp-post-image {
				margin-top:20px;
				margin-bottom:5px;
				.dn;
			}
		}
	}
}



/*-------------------------------------------------------------------------*/
/* CSS3 Animations
/*-------------------------------------------------------------------------*/

html.csstransitions {
	.tabs_box_navigation .tabs_box_navigation_selected:before {
		.trans(~'all .3s ease-in-out');
	}
	
	.tabs_box_navigation .tabs_box_navigation_selected .sub-menu, 
	table.tt_timetable .tt_tooltip .tt_tooltip_text {
		.trans(~'opacity .3s ease-in-out, visibility .3s ease-in-out');
	}
	
	table.tt_timetable .tt_tooltip:hover .tt_tooltip_text {
		.trans(~'opacity .3s ease-in-out .2s, visibility .3s ease-in-out .2s');
	}
	
	table.tt_timetable .event_container, 
	table.tt_timetable .tt_single_event {
		.trans(~'background-color .3s ease-in-out, border-color .3s ease-in-out');
	}
	
	.tabs_box_navigation .tabs_box_navigation_selected, 
	.tt_upcoming_events_wrapper .tt_upcoming_event_controls > a {
		.trans(~'background-color .3s ease-in-out, border-color .3s ease-in-out, color .3s ease-in-out');
	}
	
	.tt_timetable .event_container * {
		.trans(~'color .3s ease-in-out');
	}
	
	table.tt_timetable .event_container a, 
	table.tt_timetable .tt_single_event a {
		.trans(~'color .3s ease-in-out, opacity .3s ease-in-out');
	}
	
	table.tt_timetable .event .event_hour_booking_wrapper.on_hover {
		.trans(~'opacity .3s ease-in-out, visibility .3s ease-in-out');
	}
	
	.tt_booking a.tt_btn {
		.trans(~'background-color .3s ease-in-out');
	}
	
	.tt_tabs_navigation li a {
		.trans(~'border-color .3s ease-in-out');
	}
	
	ul.tt_upcoming_events li .tt_upcoming_events_event_container {
		.trans(~'none');
	}
}