/*==================
=== User Interface Components ====
= 

====



*/

.page__columns{
	display:flex;
	flex-direction:row;
	justify-content: flex-start;
	align-items:flex-start;
}

.page__columns .column--left {
	display:flex;
	min-width:250px;
	max-width:320px;
	flex:0 0 30%;
}

.page__columns .column--right{
	flex-grow:1;
	margin-left:40px;
}









.card__container{
	display:flex;
	align-items:center;
	justify-content: center;
	flex-direction: column;
	margin: auto;	
	height:100%;
}

.card--form{
	background-color:#fff;
	padding:2rem;
	width:100%;
	max-width:500px;	
	margin:3rem auto 0;	
	display:flex;
	flex-direction: column;
}

.form--account{
	width:100%;
	display:flex;
	flex-direction: column;
	margin-bottom:2rem;
}

.form__title{
	font-weight:800;
	font-size:1.5rem;
}

.form__description{
	font-weight:400;
	color:rgba(0,0,0,0.8);
	font-size:0.9rem;
	letter-spacing: 0px;
}

.label--default{
	font-weight:600;
	font-size:0.9rem;
	margin-bottom:0.25rem;
	color:rgba(0,0,0,0.8);
}

.input--default{
	background-color: #f3f3f4;
	border:none;
	box-shadow:none;
}

.input--default:focus,
.input--default:hover{
  background-color: #fff;
  border-color: rgba(58,151,212,0.4);
  -webkit-box-shadow: 0 0 0 4px rgba(58,151,212,0.3);
  box-shadow: 0 0 0 4px rgba(58,151,212,0.3);
}

.link--forgot{
	font-size:0.9rem;
	letter-spacing: 0px;	
}

.link--default:hover{
	color: #1a1f36;
	text-decoration: none;
}

.link--default{
	color: #5469d4;
	text-decoration: none;
}

body{
	font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Ubuntu,sans-serif;
}

.page--login,
.page--signup,
.page--reset-password{
	background-color:#fff;
}


.check{
	width:30px;
}

input[type="checkbox"].checkbox--ui{
	position:relative;
	opacity:1;
}

.checkbox--ui[disabled]{
	cursor:not-allowed;	
}




a.link--unstyled{
	display:block;
	color:inherit;
	width:100%;
	height:100%;
	text-decoration: none;
	cursor:inherit;
	font-weight: inherit;
}

a.link--unstyled:hover,
a.link--unstyled:focus.
a.link--unstyled:active{
	text-decoration: none;
	color:inherit;
	cursor: inherit;
}


/* Generic Dropdown Menu */

.dropdown--anchor {
	position: relative;
}

.dropdown--trigger{
	min-width:150px;
	width:100%;
	cursor:pointer;
}
.dropdown--trigger.button--action{
	min-width:auto;
}
.dropdown--trigger.trigger--disabled{
	opacity:0.7;
	cursor:wait;
	pointer-events:none;
}

.dropdown--trigger .button-inner{
	display:flex;
	flex-direction: row;
	align-items:center;
	pointer-events: none;
}

.dropdown--trigger i.trigger-icon{
	color:rgba(0,0,0,0.15);
	padding-right:0.5rem;
	margin-left:auto;;
}
.dropdown--trigger i.fa-ellipsis-h:before{
	content: "\f054";
}
.contextual--menu{
	margin-top:15px;
}
@media(min-width:992px){
	.contextual--menu{
		margin-top:0;
	}
	.dropdown--trigger i.fa-ellipsis-h:before{
		content: "\f141";
	}
	
}

.dropdown--anchor .dropdown--background{
	position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  background: rgba(245,245,245,0.8);
  z-index: 4999;
  display: none;
}	

.dropdown--anchor.menu--is-open .dropdown--background{
	display:block;
}

@media(min-width:992px){
	
	.dropdown--menu .dropdown--background,
	.dropdown--anchor.menu--is-open .dropdown--background{
		display: none;
	}	
	
}

.dropdown--menu {
	position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  top: auto;
	margin-top: 1px;
	background-color: rgba(255,255,255,1);
	border-radius: 4px;
	opacity: 0;
	display: none;
	flex-direction: column;
	align-items: start;
	font-size: 14px;
	min-width: 200px;
	z-index:5000;	
	padding-bottom:0.5rem;
	transition: all 0.25s ease-in;	
}

@media(min-width:992px){
	
	.dropdown--menu{
		position: absolute;
		top: 100%;
		left:inherit;
		right:inherit;
		bottom:inherit;
		width:fit-content;
		box-shadow: 0 0 0 1px rgba(136, 152, 170, .1), 0 15px 35px 0 rgba(49, 49, 93, .1), 0 5px 15px 0 rgba(0, 0, 0, .08);
		
	}
	
	.dropdown--menu.sub-menu--is-open{
		box-shadow:none;
	}
	.dropdown--menu.sub-menu--is-open .dropdown--sub-menu.menu--is-open{
		box-shadow: 0 0 0 1px rgba(136, 152, 170, .1), 0 15px 35px 0 rgba(49, 49, 93, .1), 0 5px 15px 0 rgba(0, 0, 0, .08);
	}
}


.dropdown--anchor.menu--is-open .dropdown--menu {
	opacity: 1;
	display: flex;	
}

.dropdown--menu.menu--center {
	left: 50%;
	transform: translateX(-50%);
}

.dropdown--menu.menu--left {
	left: 0;
}

.dropdown--menu.menu--right {
	right: 0;
}

.dropdown--menu .menu--inner{
	position: relative;	
	width:100%;
}

.dropdown--menu .dropdown--sub-menu{
	width:100%;
	height:100%;
	background-color: #fff;
	display:none;
	opacity:0;
	position: absolute;
	top:auto;
	left:0;
	right:0;
	bottom:0;
	padding-bottom:0.5rem;
	height:fit-content;
}
@media(min-width:992px){
	
	.dropdown--menu .dropdown--sub-menu{
		top:0;
		bottom:auto;
	}
}
.dropdown--menu .dropdown--sub-menu.menu--is-open{
	display:flex;
	opacity:1;
}

.dropdown--menu .menu--group {
	width: 100%;
}

.dropdown--menu .menu--header {
	color: rgba(0, 0, 0, 0.6);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: -0.25px;
	padding: 0.5rem 0.75rem;
}

.dropdown--menu .menu--item {
	white-space: nowrap;
	padding: 0.5rem 1.5rem 0.5rem 0.5rem;
	cursor: pointer;
	color: rgba(0, 0, 0, 0.9);
	font-weight: 500;
	width: 100%;
	display:flex;
	align-items:center;
	justify-content: stretch;
	text-decoration: none;
}
.dropdown--menu .menu--item.dropdown--trigger-submenu{
	justify-content: space-between;
}

.dropdown--menu .menu--item i{
	width:30px;
}
.dropdown--menu .menu--item.selectable--action .fa-check:before{
	content:"";
}
.dropdown--menu .menu--item.selectable--action.is--selected .fa-check:before{
	content:"\f00c";
}
.dropdown--menu .item--disabled {
	display: none;
}

.dropdown--menu .menu--item:hover {
	background-color: #f4f4f4;
	color: rgba(0, 0, 0, 1);
	text-decoration: none;
}

.select2-container--default .select2-results__group {
	display:none;
}

.updating--row{
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 2000;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	font-weight: 600;
	background: #fff;
	font-size: 14px;
	opacity:0;
	transition:opacity 0.2s ease-in;
	text-transform: capitalize;
}

.is--visible{
	opacity:1;
}


/* Tabs & Nav Bars */
.nav {
	box-shadow: inset 0 -1px #e3e8ee;
}

nav.nav--scrollable {
	overflow-x: auto;
	flex-wrap: nowrap;
}

nav.nav--scrollable > a:first-of-type {
	margin-left: 0.5rem;
}

nav.nav--scrollable > a:last-of-type {
	margin-right: 0.5rem;
}
nav .controls__right{
	display:none;
}

	@media(min-width:992px){
		nav .controls__right{
			display:flex;
		}
		nav.nav--scrollable > a:first-of-type {
			margin-left: 0;
		}
	}

.tab-link{
	padding-left:0;
	padding-right:0;
	padding-bottom:10px;
	padding-top:10px;
	border-bottom:3px solid transparent;
	text-decoration: none;
	font-family:'Roboto', sans-serif;
	letter-spacing: 0.15px;
	color:rgba(0,0,0,0.6);
	margin-left:1.25rem;
	font-size:14px;
	font-weight:500;
}

.tab-link:active,
.tab-link:focus,
.tab-link:hover{
	text-decoration:none;
	color:#5469d4;
}

.tab-link.active{
	border-bottom:2px solid #5469d4;
	color: #5469d4
}
.tab-link:first-of-type{
	margin-left:0px;
}





/* MODAL */


.modal-dialog{
	box-shadow:0 12px 28px 0 rgba(0,0,0,0.2),0 2px 4px 0 rgba(0,0,0,0.1),inset 0 0 0 1px rgba(255,255,255,0.5);
}

.modal-backdrop{
	display:none;
}
	
.modal-title{
		font-family:'Roboto', sans-serif;
		letter-spacing: 0px;
		font-weight:700;
		color:#000;
		font-size:1.5rem;
		margin-bottom:0;
	}
	
	.modal-subtitle{
		line-height:1.5;
		letter-spacing: 1px;
		font-size:1rem;
		color: rgba(0,0,0,0.55);
	}
	.modal-header{
		padding-bottom:0;
		pointer-events: all;
		min-height:40px;
		border-bottom:none;
	}
	.modal-header .close{
		position: absolute;
		right:15px;
		float:none;
	}



.modal__shell{
  position:fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	z-index:2000;
	overflow: hidden;
	background-color: rgba(244,244,244, 0.8); 
}

.modal-open .modal__shell.modal.show,
.ui-modal-open .modal__shell.modal.show{
	overflow: hidden;
	display:flex!important;
}

.modal__frame{
	position: relative;
	display: flex;
	flex-direction: column;
  justify-content: center;
  align-items: stretch;
/*  min-height: 100vh;*/
  padding: 0;
  width: 100%;
	overflow:hidden;
}
@media(min-width:992px){
	
	.modal__frame{
		padding: 3rem;

	}
}


.modal__container{
	display:flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	pointer-events: none;
	min-height:0px;
}

.modal__inner{
  display: flex;
  flex-direction: column; 
  overflow-y: hidden;
	max-width:700px;
	width:100%;
	margin:auto;
	pointer-events: all;
	box-shadow: 0 12px 28px 0 rgba(0,0,0,0.2),0 2px 4px 0 rgba(0,0,0,0.1),inset 0 0 0 1px rgba(255,255,255,0.5);
	position:relative;
	overflow:hidden;	
}

.modal--wide .modal__inner{
	max-width:1200px;
}

.modal__header{
	display:flex;
	align-items:center;
	justify-content: center;
	min-height:50px;
	border-bottom:1px solid #e3e8ee;
	pointer-events: all;
	padding:1rem;
	position:relative;
	background-color:#fff;
}
.modal__title{
	margin-bottom:0;
	font-size:1.5rem;
	font-weight:700;
}

.modal__close{
	position:absolute;
	top:10px;
	right:25px;
	border-radius: 50%;
  background: #cccccc!important;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  text-align: center;
  height: 40px;
	font-size:2rem;
	line-height:2.25rem;
	margin:auto;
}
.modal__close > div{
	width: 100%;
  height: 100%;
  border-radius: 50%;
}

.modal__body{
	display:flex;
	flex-direction: column;
	overflow: auto;
	background-color: #fff;
	pointer-events: all;
	padding:1rem;
	padding-bottom:75px;
}

.acf-form-submit{
	position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background: #fff;
  border-top: 1px solid #cacaca;
  right: 0;
  display: flex;
  justify-content: flex-end;
  flex-direction: row;
	padding-right:1rem;
}
.acf-form-submit .acf-button{
	
	margin:0;
}

.modal__ui .acf-form{
	border:none;
}




/* tables */


.table--manage{
	font-size:14px;
	border:none;
}

.table--manage thead tr{
	border-top:none;
}
.table--manage thead th{
	padding:1rem 0.5rem 0.5rem 0.5rem;
	box-shadow:0 1px #dee2e6;
	color:rgba(0,0,0,0.6);
}
.table--manage thead th{
	font-size:12px;
	text-transform: uppercase;
	border:none;
}
.table--manage td{
	border:none;
	padding:0.25rem 0.5rem;
	box-shadow:0 -1px #e3e8ee;
}
.table--manage tr{
	border-bottom:none;
}


.table--manage tr.has--link:hover{
	cursor: pointer;
	background-color:#f7fafc;
}

.table--manage tr.has--link a.link--unstyled{
	padding:0.25rem 0.5rem;
}

.table--manage td.has--link{
	padding:0;
}

/* FLEXIBLE TABLES */
.flex-table{
	border-bottom:1px solid #e3e8ee;
	margin-bottom:75px;
}
	
.table__row{
	display:grid;	
	position:relative;
	box-shadow: 0 -1px #e3e8ee;
	padding:0.25rem;		
}
	

	
.table__header.table__row{
	display:none;
}
	
.table__header.table__row + .table__body{
	box-shadow:none;
}
	
.table__group{
	display:grid;		
}
	
.table__group.table__cell{
	display:flex;
	grid-template-columns:auto;
}
	
.table__header .table__cell{
	font-size: 12px;
  text-transform: uppercase;
  border: none;
  padding: 1rem 0.5rem 0.5rem 0.5rem;
  box-shadow: none;
  color: rgba(0,0,0,0.7);
	font-weight:bold;
}
	
.table__cell.cell--control{
	display:none;
}
	
.table__cell{
	padding: 0.15rem 0.5rem;
	box-shadow:none;
}

.cell--bookings > a{
	position:absolute;
	padding: 0.15rem 0.5rem;
  background-color: #e7e7e7;
  border-radius: 5px;
  font-size: 12px;
  position: absolute;
  top: 10px;
	right: 10px;
}

.cell--actions{
	justify-self:flex-end;
	align-self:center;
}
	
.cell--location	.location--meta{
		font-size:11px;
		font-style:italic;
}

.cell--location	.location--meta:before{
		content: ' • '
}
	
.button--float{
	position:fixed;
	bottom:1rem;
	right:1rem;
	border-radius:50%;
	background-color:#5469d4;
	color:#fff;
	width:45px;
	height:45px;
	display:flex;
	align-items:center;
	justify-content: center;
}
	
	@media(min-width:992px){
		
		.cell--location .location--meta:before{
			content: ''
		}
	
		.button--float{
			display:none;
		}
					
		.table__header.table__row + .table__body{
			box-shadow: 0 -2px #e3e8ee;
		}
	
		.table__header.table__row{
			display:grid;		
			box-shadow:none;			
		}		
		
		.table__row{		
			box-shadow: 0 -1px #e3e8ee;
		}
		
		.table__group{
			display:grid;			
		}
					
		.table__cell.cell--control{
			display:flex;
		}
		
		.table__cell{
			display:flex;
			flex-direction:row;
			align-items:center;
			justify-content: flex-start;
			padding:0.25rem 0.5rem;
			box-shadow:none;
		}		
		
		.cell--bookings > a{
			position: relative;
			top:auto;
			right:auto;
		}
		
		.cell--location{
			flex-direction: column;
			justify-content: center;
			align-items: flex-start;
		}

	}
/* FLEX-TABLES COLUMN CONFIGURATION */

/*=== SCHEDULE - CLASS ===*/
.table--schedule-class .table__row{
	grid-template-columns: 6fr 1fr;
}

.table--schedule-class .table__group{
  grid-template-columns: repeat(auto-fit, minmax(var(--column-width-min), 1fr));    
}
@media (min-width:992px){
		  
	.table--schedule-class .table__header.table__row,
	.table--schedule-class .table__row{
		grid-template-columns: 30px 6fr minmax(200px, 4fr);
	}
		
	.table--schedule-class .table__group{
		grid-template-columns: 100px min(150px) minmax(250px,1fr) min(150px) minmax(75px,100px);
	}
	
}


/*=== SCHEDULE - APPOINTMENT ===*/
.table--schedule-appointment .table__row{
	grid-template-columns: 6fr 1fr;
}

.table--schedule-appointment .table__group{
  grid-template-columns: repeat(auto-fit, minmax(var(--column-width-min), 1fr));    
}

@media (min-width:992px){
		  
	.table--schedule-appointment .table__header.table__row,
	.table--schedule-appointment .table__row{
		grid-template-columns: 30px 6fr minmax(200px, 4fr);
	}
		
	.table--schedule-appointment .table__group{
		grid-template-columns: 100px min(150px) minmax(250px,1fr) min(150px) min(100px) minmax(75px,100px);
	}
	
}



/*=== SCHEDULE - BOOKINGS ===*/
.table--schedule-bookings .table__row{
	grid-template-columns: 6fr 1fr;
}

.table--schedule-bookings .table__group{
  grid-template-columns: repeat(auto-fit, minmax(var(--column-width-min), 1fr));    
}

@media (min-width:992px){
		  
	.table--schedule-bookings .table__header.table__row,
	.table--schedule-bookings .table__row{
		grid-template-columns: 30px 6fr minmax(200px, 4fr);
	}
		
	.table--schedule-bookings .table__group{
		grid-template-columns: minmax(250px, 1fr) min(150px) min(150px) min(150px);
	}
	
}




.table__row.row__empty{
	grid-template-columns: 1fr;
}

.table__row.row__empty .table__cell{
	justify-content:center;
	align-items:center;
}

/* NOTIFICATIONS */

#notifications{
	width:100%;	
	display:flex;
	flex-direction:column;	
	position:fixed;
	bottom:0;
	max-width: 1240px;
	z-index:1200px;
}


.notification{
	display:flex;
	align-items:center;
	justify-content: center;
	min-height:50px;
	line-height:2;
	font-size:1rem;
  font-weight:500;
	padding:0.5rem 1rem;
	border:1px solid #cacaca;
	
}

.notification--working{
	background-color:#c8d7e1;
	color:#2e4453;
}

.notification--success{
	background-color:#cbf4c9;
	color:#0e6245;
}
.notification div{
	display:flex;
	flex-direction:row;
	align-items:center;
	justify-content: center;
}