nav.navbar {  }
.custom-nav {  padding-left: 0 !important; }
.custom-nav a.nav-link {  color: rgba(255, 255, 255, 0.7); }
.custom-nav a.nav-link {  font-size: 20px; padding: 5px 20px; left: 1.5; border-radius: 8px;}
.custom-nav.icons-nav a.nav-link {  color: #0dcaf0;}
.custom-nav .nav-item.active .nav-link,
.custom-nav .nav-link:focus, .custom-nav .nav-link:hover
{
    color: #fff;
    background-color: #0069d9;
    border-color: #0062cc;
}
.custom-nav.icons-nav .nav-item.active .nav-link,
.custom-nav.icons-nav .nav-link:focus, .custom-nav.icons-nav .nav-link:hover
{
    color:#fff;
	background-color: #0dcaf0;
    border-color: #0dcaf0;
}
.custom-nav a.nav-link.nav-icon {
	padding: 0 10px;
}
.navbar .navbar-brand { padding: 0 !important;}

.nav-icon .bi { line-height: 1.9 !important;}


.btn-purple { background: #6f42c1; color:#fff;}
.btn-purple:hover { background: #512998; color:#fff;}
.btn-aqua { background: #58e0c7; color:#000;}
.btn-aqua:hover { background: #42c3ac; color:#000;}

.autocomplete {
  /*the container must be positioned relative:*/
  position: relative;
  display: inline-block;
  width: 100%;
}
.autocomplete input {
  width: 100%;
}
.autocomplete-items {
  position: absolute;
  border: 1px solid #ced4da;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
}
.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  background-color: #fff;
  border-bottom: 1px solid #ced4da;
}
.autocomplete-items div:hover {
  /*when hovering an item:*/
  background-color: #e9e9e9;
}
.autocomplete-active {
  /*when navigating through the items using the arrow keys:*/
  background-color: DodgerBlue !important;
  color: #ffffff;
}

tr.clicked, .table-clicked tr.clicked td, .table-clicked tr.clicked th { background-color:#ffc107 !important; }
tr.clicked:hover, .table-clicked tr.clicked:hover td, .table-clicked tr.clicked:hover th { background-color:#e0ab0c !important; }

.form-control.checkin,
.form-control.checkout { background: #fff !important;}

.datepicker-dropdown {
	-webkit-box-shadow: 1px 21px 35px 14px rgba(0,0,0,0.3);
	-moz-box-shadow: 1px 21px 35px 14px rgba(0,0,0,0.3);
	box-shadow: 1px 21px 35px 14px rgba(0,0,0,0.3);
}

.alert-warning {
	background: #f9d25c  !important; border-color:#b98e0c  !important; color:#000 !important;
}

.header-logo { 
	width: auto;
	max-width: 100%;
	display:block;
	/* padding-top: 11px; */
}

form input.option-notice, input.error { border: 1px solid #f00; }
.form-group { margin-bottom: 1rem;}

.btn-icon { padding: 0px 5px; }
.btn-icon:focus { box-shadow: none !important;}
.btn-icon.--info { background: transparent; color:#0dcaf0; border-color: transparent;}
.btn-icon.--info:hover { background: transparent; color:#098fac; border-color: transparent; }
.btn-icon.--info:hover svg { fill: #098fac; }
.btn-icon.--danger { background: transparent; color:#dc3545; border-color: transparent;}
.btn-icon.--danger:hover { background: transparent; color:#ff8793; border-color: transparent; }
.btn-icon.--primary { background: transparent; color:#0b5ed7; border-color: transparent;}
.btn-icon.--primary:hover { background: transparent; color:#4992fe; border-color: transparent; }
.btn-fade, .btn-fade { opacity: 1; }
.btn-fade:hover, .btn-fade:focus { opacity: 0.7; }

.max-850 { width: 100%; max-width: 850px; }
.max-750 { width: 100%; max-width: 750px; }
.max-650 { width: 100%; max-width: 650px; }

.content-section { min-height: 75vh;}

.date-group input { border: rgba(255, 255, 255, 0) !important; }
.date-group .input-group-text { border-right: 3px solid #ccc !important; }
.ui-menu.ui-autocomplete { 
	background: var(--primary);
    color: #fff;
	box-shadow: rgb(0 0 0 / 16%) 0px 5px 6px, rgb(0 0 0 / 23%) 0px 3px 6px;
}
.ui-menu.ui-autocomplete li.ui-menu-item { 
	border-color: rgba(255, 255, 255, 0.5) !important;
}
.autocomplete-no-result-feedback { color: var(--danger); padding: 5px 10px; display:none;}


label, .label { font-family: var(--content-font); margin-bottom: .5rem; font-size: 18px; line-height: var(--line-height); display:inline-block;}

.flatpickr-weekdays { margin-top: 10px;}
.flatpickr-time input { font-size: 20px !important; }
.autocomplete-custom { background: #3f4458 !important; color:#fff !important; border: 1px solid #000; border-radius: 0 0 6px 6px;}
.autocomplete-custom div { font-family: var(--content-font) !important; font-size: 18px !important; padding: 4px 10px !important; line-height: 1.5; }
.autocomplete-custom div:hover { background: #198754 !important; color:#fff !important;} 
.autocomplete-custom .selected { background: #80cbc4 !important; color:#3f4458 !important;} 
.autocomplete-custom .group { font-weight: bold; }

.divider { display:block; width: 100%; line-height: 0; height: 1px; }

.box-masa { display: flex; flex-direction: column; justify-content: space-between; align-items: stretch; border-radius: 8px; border: 1px solid rgba(0,0,0, 0.15); background: rgba(0,0,0, 0.05); padding: 0 !important;}
.box-masa .name { font-weight: 500; border-bottom: 1px solid rgba(0,0,0, 0.1); padding: 3px 10px; }
.box-masa:hover, 
.box-masa:focus,
.box-masa.active { background: var(--datepkr-dark); color:#fff; border-color:#000 !important;}
/* .box-masa:hover *, */
/* .box-masa:focus * { border-color: rgba(255, 255, 255, 0.1) !important; } */
.box-masa:hover .text-success,
.box-masa:focus .text-success,
.box-masa.active .text-success { color: var(--success-light) !important; }
.box-masa:hover .text-dark,
.box-masa:focus .text-dark,
.box-masa.active .text-dark { color: #fff !important; }

.box-masa .table-rez-link { padding: 3px 10px; margin-bottom: 5px; text-decoration:none; }
.box-masa .table-rez-link:hover, .box-masa .table-rez-link:focus { text-decoration:underline; }
.box-masa .rez-link-wrapper { width: auto; position:relative; }
.box-masa .rez-popover { 
	position: absolute;
	width: 325px;
	height: auto;
	/* right: -170px; the top and right pos is set by JS*/
	z-index: 99;
	padding: 20px;
	margin: auto;
	background: #fff;
	color: #000;
	border: 1px solid rgba(0,0,0, 0.3);
	border-radius: 6px;
	box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}
.rez-popover::after {
  content: "";
  top: 50%;
  transform: translate(0, -50%);
  left: -9px;
  position:absolute;
  z-index: 999;
  width: 0; 
  height: 0; 
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent; 
  border-right:10px solid #fff; 
}
.box-masa .rez-popover p { font-size: 16px; }

.popover-header { color: #000; }

.modal-title { font-weight: 400 !important;}

.table tr th { font-family: var(--headline-font); font-size: 16px;}
.table tr td { font-family: var(--content-font); font-size: 16px; }

.tag-badge {
	/* badge bg-light text-dark flex-sc gap-2 */
	background: #ffbf00;
	color:#000;
	padding: 3px 10px;
	display: inline-flex;
	justify-content: start;
	align-items: center;
	gap: 10px;
	border-radius: 6px;
	margin-bottom: 8px;
}
.tag-badge.hide { display:none; }
.tag-badge button { padding: 3px 4px !important; font-size: 14px; }

.modal-content { color:#000; }
.modal-header #btnBack {
    padding: 0.5rem 0.5rem;
    margin: -0.5rem -0.5rem -0.5rem auto;
	line-height: 1;
}

/* // Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {  
	
}

/* // Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {  
	.flex-md-row { flex-direction: row; }
	.flex-md-col { flex-direction: column; }
}

/* // Large devices (desktops, 992px and up) */
@media (min-width: 992px) {  
	.fz-lg-16 { font-size: 16px !important; }
	.fz-lg-18 { font-size: 18px !important; }
	.fz-lg-20 { font-size: 20px !important; }
	.fz-lg-22 { font-size: 22px !important; }
	.fz-lg-24 { font-size: 24px !important; }
	.fz-lg-28 { font-size: 28px !important; }
	.fz-lg-32 { font-size: 32px !important;}
	.fz-lg-34 { font-size: 34px !important; }
	.fz-lg-38 { font-size: 38px !important; }
	.fz-lg-42 { font-size: 42px !important; }
	.fz-lg-44 { font-size: 44px !important; }
	.fz-lg-52 { font-size: 52px !important; }
	.fz-lg-62 { font-size: 62px !important; }
	.pos-lg-a { position:absolute;}
	
	.flex-lg-row { flex-direction: row; }
	.flex-lg-col { flex-direction: column; }
	
	.flex-lg-1 { flex: 1 !important; }
	.flex-lg-2 { flex: 2 !important; }
	.flex-lg-3 { flex: 3 !important; }
	.flex-lg-4 { flex: 4 !important; }
	.flex-lg-5 { flex: 5 !important; }
	
	.jsc-lg-start { justify-content: start !important; }
	.jsc-lg-center { justify-content: center !important; }
	.jsc-lg-center { justify-content: end !important; }
	.jsc-lg-between { justify-content: space-between !important; }
	.ai-lg-start { align-items: start !important; }
	.ai-lg-center { align-items: center !important; }
	.ai-lg-end { align-items: end !important; }

	.gap-lg--5, .gap-lg--5 .inner { gap: 5px !important; }
	.gap-lg-10, .gap-lg-10 .inner { gap: 10px !important; }
	.gap-lg-15, .gap-lg-15 .inner { gap: 15px !important; }
	.gap-lg-20, .gap-lg-20 .inner { gap: 20px !important; }
	.gap-lg-25, .gap-lg-25 .inner { gap: 25px !important; }
	.gap-lg-30, .gap-lg-30 .inner { gap: 30px !important; }
}

/* Media Queries */
@media (min-width: 1200px) {  

}
@media (min-width: 1400px) { 

}
@media (max-width: 1399px) {
	
}
@media (max-width: 1199px) {

}
@media (max-width: 991px) {

}
@media (max-width: 767px) {
	.mese-wrapper .box-masa { width: 100% !important;}
	.box-masa .rez-popover { 
		position: static; 
		margin-top: 10px;
		background: #fff;
		color: #000;
		border: 1px solid rgba(0,0,0, 0.3);
		border-radius: 6px;
		box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
	}
	.rez-popover::after {
		top: 13px;
		left: 50%;
		transform: translate(-50%, 0);
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
		border-bottom: 10px solid #fff;
	}
}
@media (max-width: 575px) {  
	
}
@media (max-width: 380px) {  
	
}

@media (min-width: 576px) and (max-width: 767px) { }
@media (min-width: 768px) and (max-width: 991px) {  }
@media (min-width: 992px) and (max-width: 1199px) {  }

@media (max-width: 1199px) {  }
@media (max-width: 1399px) {  }