[data-modal='confirm-occupancy-tours'] {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: normal;
	color: #343434;
	display: none;
	position: fixed;
	z-index: 99991;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100dvh;
	background: rgba(0, 0, 0, 0.7);
	overflow: auto;
	margin: 0;
	justify-content: center;
	align-items: flex-end;
	overflow: hidden;
	
	*,
	*::before,
	*::after {
		margin: 0;
		padding: 0;
		box-sizing: border-box;
	}
	
	h1, h2, h4, h5 {
		font-weight: revert;
		line-height: normal;
	}

	@media (min-width: 769px) {
	  .hide-md {
		display: none !important;
		visibility: hidden !important;
	  }
	}

	@media (max-width: 768px) {
	  .hide-sm {
		display: none !important;
		visibility: hidden !important;
	  }
	}
	
	.bg-grey-lt {
		background: #f9f9f9 !important;
	}
	
	.box-card {
	  border: 1px solid #cecece;
	  border-radius: 5px;
	  padding: 20px;
	  position: relative;
	  overflow: hidden;
	}
	
	.modal-content {
	  background: #fff;
	  position: relative;
	  max-width: 1140px;
	  width: 100%;
	  max-height: calc(100dvh - 50px);
	  border-radius: 5px;
	  margin: auto;
	  border: 1px solid #cecece;
	  overflow-y: auto;
	}

	.modal-content-res {
	  width: fit-content;
	}

	@media (max-width: 768px) {
	  .modal-mbl-overlay {
		width: 100%;
		animation: slideUp 0.3s ease-in-out;
		max-width: 100%;
		border-radius: 5px 5px 0 0;
		margin-bottom: 0;
	  }
	}
	.modal-container {
	  padding: 30px;
	  position: relative;
	}

	.close-modal {
	  top: 10px;
	  right: 20px;
	  cursor: pointer;
	  padding: 5px 5px 0 5px;
	  position: absolute;
	  right: 5px;
	  top: 5px;
	  z-index: 55;
	  cursor: pointer;
	  background: transparent;
	  border: none;
	}

	@media (max-width: 768px) {
	  .close-modal {
		top: 0;
		height: 50px;
		padding-bottom: 5px;
	  }
	}
	.close-modal:hover,
	.close-modal:focus {
	  color: black;
	  text-decoration: none;
	  cursor: pointer;
	}

	.close-modal span {
	  font-size: 14px;
	  padding: 10px;
	  cursor: pointer;
	}
	
	.modal-mbl-overlay .btn-container .btn {
	  width: 140px;
	  margin-top: 20px;
	  text-align: center;
	  font-size: 16px;
	}

	@media (max-width: 768px) {
	  .modal-mbl-overlay {
		animation: slideUp 0.3s ease-in-out;
		width: 100%;
		margin-bottom: 0;
		border-bottom-right-radius: 0;
		border-bottom-left-radius: 0;
	  }
	  .modal-mbl-overlay .cst-mbl-wrap {
		display: block;
	  }
	  .modal-mbl-overlay .modal-mbl-title {
		display: flex;
		align-items: center;
		align-self: flex-start;
		background: #fff;
		min-height: 50px;
		width: 100%;
		border-bottom: 1px solid #cecece;
		padding-left: 10px;
		position: sticky;
		top: 0;
		z-index: 54;
	  }
	  .modal-mbl-overlay .modal-mbl-title > * {
		font-size: 16px;
		text-align: left;
	  }
	  .modal-mbl-overlay__title {
		display: flex;
		align-items: center;
		align-self: flex-start;
		background: #fff;
		height: 50px;
		width: 100%;
		font-size: 16px;
		text-align: left;
		border-bottom: 1px solid #cecece;
		padding-left: 10px;
		margin-bottom: 10px;
		position: relative;
	  }
	  .modal-mbl-overlay__body {
		width: 100%;
		padding: 0 10px 10px;
		text-align: left;
	  }
	  .modal-mbl-overlay__body > p {
		margin-bottom: 10px !important;
		font-size: 14px;
		text-align: left;
		width: 100%;
	  }
	  .modal-mbl-overlay .modal-container {
		padding: 0;
		background: #f1f1f2;
		overflow-y: auto;
		max-height: 100dvh;
	  }
	  .modal-mbl-overlay .btn-container {
		padding: 10px;
		width: 100%;
		background: #fff;
		position: sticky;
		bottom: 0;
		border-top: 1px solid #dbdbdb;
		justify-content: center;
	  }
	  .modal-mbl-overlay .btn-container .btn {
		width: 100%;
		margin-top: 0;
		font-size: 14px;
	  }
	}
	
	.confirm-occupancy-tours--opts {
	  display: flex;
	  gap: 10px;
	  width: min-content;
	  align-items: flex-end;
	  
	  select {
		  min-width: 100px;
		  width: max-content;
		  padding-right: 30px !important;
	  }
	}
	
	@media (max-width: 768px) {
	  .confirm-occupancy-tours--opts {
		display: grid;
		grid-template-columns: 1fr 1fr;
		width: 100%;
		
		select {
			min-width: auto;
			width: 100%;
		}
	  }
	}
}

[data-modal='confirm-occupancy-tours'].open {
  display: flex;
}

body:has([data-modal='confirm-occupancy-tours'].open) {
  overflow: hidden;
}

.disabled {
  pointer-events: none;
}

.skeleton-row {
  width: 472px;
  height: 120px;
  background: linear-gradient(90deg, #e0e0e0 25%, #f4f4f4 50%, #e0e0e0 75%);
  background-size: 200% 100%;
  border-radius: 5px;
  animation: shimmer 2s infinite ease-in-out;
}

@media (max-width: 768px) {
  .skeleton-row {
    width: 100%;
  }
}

@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

@keyframes pulse {
  0% {
    opacity: 0.5;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0.5;
  }
}