@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100;
  src: local(""), url("/resource/fonts/inter/inter-v12-latin-100.woff2") format("woff2"), url("/resource/fonts/inter/inter-v12-latin-100.woff") format("woff");
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 200;
  src: local(""), url("/resource/fonts/inter/inter-v12-latin-200.woff2") format("woff2"), url("/resource/fonts/inter/inter-v12-latin-200.woff") format("woff");
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  src: local(""), url("/resource/fonts/inter/inter-v12-latin-300.woff2") format("woff2"), url("/resource/fonts/inter/inter-v12-latin-300.woff") format("woff");
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  src: local(""), url("/resource/fonts/inter/inter-v12-latin-400.woff2") format("woff2"), url("/resource/fonts/inter/inter-v12-latin-400.woff") format("woff");
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  src: local(""), url("/resource/fonts/inter/inter-v12-latin-500.woff2") format("woff2"), url("/resource/fonts/inter/inter-v12-latin-500.woff") format("woff");
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  src: local(""), url("/resource/fonts/inter/inter-v12-latin-600.woff2") format("woff2"), url("/resource/fonts/inter/inter-v12-latin-600.woff") format("woff");
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  src: local(""), url("/resource/fonts/inter/inter-v12-latin-700.woff2") format("woff2"), url("/resource/fonts/inter/inter-v12-latin-700.woff") format("woff");
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  src: local(""), url("/resource/fonts/inter/inter-v12-latin-800.woff2") format("woff2"), url("/resource/fonts/inter/inter-v12-latin-800.woff") format("woff");
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  src: local(""), url("/resource/fonts/inter/inter-v12-latin-900.woff2") format("woff2"), url("/resource/fonts/inter/inter-v12-latin-900.woff") format("woff");
}

button.btn i[class*=" fa-"], button.btn span[class*=" spinner"] {
  margin-top: -1px;
}

#disable-hover-icon {
  display: none;
  top: -999px;
  left: -999px;
  position: fixed;
  z-index: 999999;
}

#disable-hover-icon .fas {
  filter: drop-shadow(2px 2px 1px #cccccc);
}

.hover-pointer:hover {
  cursor: pointer;
}

.form-custom.form-control:focus {
  border-color: var(--kt-link-hover-color);
}

.form-custom.form-control.is-invalid:focus {
  border-color: #f1416c;
  box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 2px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px !important;
}

.rowhover:hover {
  background-color: var(--kt-primary-light);
}

.form-control-xs {
  min-height: calc(1.5em + 0.6rem + 2px);
  padding: 0.1rem 0.75rem;
  font-size: 0.925rem;
  border-radius: 0.375rem;
}

.ms-checkbox {
  margin-left: 2.1rem;
}

.br-0 {
  border-radius: 0 !important;
}

.scale-50 {
  transform: scale(0.5);
}

.scale-75 {
  transform: scale(0.75);
}

.form-floating.float-manual {
  height: 3.75rem;
}

.form-floating > .form-label-small-force {
  opacity: .65;
  transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
}

.form-floating > .form-control, .form-floating > .form-control-plaintext, .form-floating > .form-select {
  height: calc(3.75rem);
}

.form-floating .flatpickr-alt-input:placeholder-shown ~ label {
  opacity: 1;
  transform: none;
}

.form-floating .is-invalid ~ label {
  color: #f1416c;
}

.form-floating .is-invalid ~ label.required::after {
  content: '';
}

.required.chain::after {
  color: #ffb008;
}

.spinner-slow {
  --bs-spinner-animation-speed: 1s;
}

.app-header .app-navbar.drop-shadow {
  box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 2px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;
}

.app-container {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.app-container .app-navbar {
  padding-left: 15px !important;
  padding-right: 15px !important;
}

.app-sidebar-header {
  border-bottom: var(--kt-app-separator-border);
}

.menu-item-head ~ .menu-item-head {
  margin-top: 1rem;
}

.bottom-sticky {
  position: sticky;
  bottom: 0px;
  background-color: var(--kt-card-bg);
}

.card-custom .card-header {
  padding: 0 1.25rem;
  min-height: 45px;
}

.card-custom .card-header.card-header-sticky {
  z-index: 95;
  position: sticky;
  top: 55px;
  background-color: var(--kt-card-bg);
}

.card-custom .card-body {
  padding: 1rem 1.25rem;
}

.card-custom .card-footer {
  padding: 1rem 1.25rem;
}

.card-custom .card-footer.card-footer-sticky {
  position: sticky;
  bottom: 0px;
  background-color: var(--kt-card-bg);
}

.card-custom.h-shadow-sm:hover {
  box-shadow: 0 0.1rem 1rem 0.25rem rgba(0, 0, 0, 0.05) !important;
}

.modal-custom .modal-header {
  padding: 1rem;
}

.modal-custom .modal-body {
  padding: 1rem 1rem 0.5rem 1rem;
}

.modal-custom .modal-footer {
  padding: 1rem;
}

.modal .modal-dialog-scroll-big .modal-body {
  max-height: 80vh;
  overflow-y: auto;
}

.symbol-help i[class*=fa-]:hover {
  color: var(--kt-text-dark);
  cursor: pointer;
}

.swal2-container {
  z-index: 2000;
}

.swal2-container .swal2-html-container .inner {
  height: 17vh;
  overflow-y: scroll;
}

.btn i ~ i {
  padding-left: 0.35rem;
  padding-right: 0 !important;
}

.btn.btn-xs {
  padding: calc(0.6rem + 1px) calc(.8rem + 1px) !important;
  font-size: .875rem;
  line-height: .75;
  border-radius: .2rem;
}

.btn.btn-xs.btn-icon {
  height: calc(1rem + 1rem + 2px);
  width: calc(1rem + 1rem + 2px);
}

.btn.btn-xs:not(.btn-icon) {
  height: calc(1rem + 1rem + 2px);
}

.btn.btn-xs i {
  font-size: .75rem;
  line-height: 0.75;
}

.btn.btn-xs i.icon-right {
  padding-left: .3rem;
  padding-right: 0;
}

.btn.btn-xs.btn-icon-only i {
  padding: 0 !important;
}

.btn:disabled {
  cursor: not-allowed;
}

.btn.btn-sm i {
  font-size: 1rem;
}

.btn.spinner {
  padding-left: 3rem !important;
}

.btn.spinner::before {
  width: 1.25rem;
  height: 1.25rem;
  margin-top: -0.625rem;
}

.btn .i-right {
  padding-left: 0.35rem;
  padding-right: 0;
}

.colored-toast.swal2-icon-info {
  background-color: #3dc3ee !important;
}

.colored-toast .swal2-title, .colored-toast .swal2-close, .colored-toast .swal2-html-container {
  color: #ffffff;
}

td.option-column {
  white-space: nowrap;
}

.table.p-0 > :not(caption) > * > * {
  padding: 0;
}

.table.table-tr-hover tr:not(.nohover):hover td, .table.table-tr-hover tr.hover td, .table.table-multirow-hover tr.hover td {
  background-color: rgba(235, 238, 240, 0.75);
}

tr.dragging .btn {
  visibility: hidden;
}

tr.dragging td {
  opacity: 0.5;
}

td.invoice_status_1 {
  background-color: #ff0000;
}

tr:hover td.invoice_status_1 {
  background-color: #ff9999 !important;
}

td.invoice_status_2 {
  background-color: #edfc1a;
}

tr:hover td.invoice_status_2 {
  background-color: #f9feb1;
}

td.invoice_status_3 {
  background-color: #3dff37;
}

tr:hover td.invoice_status_3 {
  background-color: #d1ffd0;
}

td.invoice_status_4 {
  background-color: #aaaaaa;
}

label.form-check.flex-wrap .invalid-feedback {
  width: auto !important;
}

.form-check-custom {
  user-select: none;
}

.form-check-custom:hover {
  cursor: pointer;
}

.form-check-custom.form-check-light .form-check-input:checked {
  background-color: var(--bs-secondary);
}

.form-check-custom.form-check-sm .form-check-input {
  height: 1.2rem;
  width: 1.2rem;
}

.app-root {
  margin-top: var(--kt-app-header-height);
}

body[data-app=true] {
  padding-top: var(--kt-app-header-height);
}

.fp-button-month-select .fp-hide-input {
  display: none;
}

.flatpickr-calendar.button-month-select {
  width: 333px !important;
}

@media (min-width: 1200px) {
  .app-root {
    margin-left: var(--kt-app-sidebar-width);
  }
  body[data-app=true] {
    padding-left: var(--kt-app-sidebar-width);
  }
  .modal-xxl {
    --bs-modal-width: 1600px;
  }
  .gy-r-2 .row > * {
    --bs-gutter-y: 0.5rem;
  }
}

@media (min-width: 992px) {
  main,
span,
ol,
ul,
pre,
div {
    scrollbar-width: thin;
    scrollbar-color: #f0f0f0 transparent;
  }
  main::-webkit-scrollbar,
span::-webkit-scrollbar,
ol::-webkit-scrollbar,
ul::-webkit-scrollbar,
pre::-webkit-scrollbar,
div::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }
  main ::-webkit-scrollbar-track,
span ::-webkit-scrollbar-track,
ol ::-webkit-scrollbar-track,
ul ::-webkit-scrollbar-track,
pre ::-webkit-scrollbar-track,
div ::-webkit-scrollbar-track {
    background-color: transparent;
  }
  main::-webkit-scrollbar-thumb,
span::-webkit-scrollbar-thumb,
ol::-webkit-scrollbar-thumb,
ul::-webkit-scrollbar-thumb,
pre::-webkit-scrollbar-thumb,
div::-webkit-scrollbar-thumb {
    background-color: #f0f0f0;
  }
  main::-webkit-scrollbar-corner,
span::-webkit-scrollbar-corner,
ol::-webkit-scrollbar-corner,
ul::-webkit-scrollbar-corner,
pre::-webkit-scrollbar-corner,
div::-webkit-scrollbar-corner {
    background-color: transparent;
  }
  main:hover,
span:hover,
ol:hover,
ul:hover,
pre:hover,
div:hover {
    scrollbar-color: #e0e0e0 transparent;
  }
  main:hover::-webkit-scrollbar-thumb,
span:hover::-webkit-scrollbar-thumb,
ol:hover::-webkit-scrollbar-thumb,
ul:hover::-webkit-scrollbar-thumb,
pre:hover::-webkit-scrollbar-thumb,
div:hover::-webkit-scrollbar-thumb {
    background-color: #e0e0e0;
  }
  main:hover::-webkit-scrollbar-corner,
span:hover::-webkit-scrollbar-corner,
ol:hover::-webkit-scrollbar-corner,
ul:hover::-webkit-scrollbar-corner,
pre:hover::-webkit-scrollbar-corner,
div:hover::-webkit-scrollbar-corner {
    background-color: transparent;
  }
  .app-header {
    z-index: 100;
    position: fixed !important;
    top: 0px;
    left: var(--kt-app-sidebar-width);
    width: calc(100% - var(--kt-app-sidebar-width));
  }
  .app-sidebar {
    z-index: 100;
    position: fixed !important;
    top: 0px;
    left: 0px;
    width: var(--kt-app-sidebar-width);
    height: 100vh;
  }
  .modal-dialog.modal-mtop-table {
    margin-top: 160px;
  }
}

@media (max-width: 991px) {
  body[data-app=true] {
    padding-top: var(--kt-app-header-height);
  }
  .app-header {
    position: fixed !important;
    top: 0px;
    left: 0px;
    width: 100%;
  }
}

#proxywhite {
  width: 100%;
  height: 20px;
  position: fixed;
  bottom: 0;
  background: #ffffff;
  z-index: 99;
}

.proxyscroll {
  overflow-x: scroll;
  overflow-y: hidden;
  white-space: nowrap;
  height: 16px;
  margin-left: 200px;
  width: 100%;
  position: fixed;
  bottom: 4px;
  z-index: 100;
}

.proxyscroll .inner {
  transform: translateY(-8px);
}

.proxyscroll::-webkit-scrollbar {
  height: 10px;
}

.proxyscroll::-webkit-scrollbar-track {
  background-color: #fff;
}

.proxyscroll::-webkit-scrollbar-thumb {
  background-color: #000;
}

.proxyscroll:hover {
  cursor: col-resize;
}

.calendar-head {
  position: relative;
  background: #ffffff;
  overflow-x: hidden;
  margin: 0 0 0 300px;
  padding: 0;
  display: grid;
  --grid-rows: 1;
  --grid-columns: 1;
  --grid-color: #eeeeee;
  grid-template-columns: repeat(var(--grid-columns), 26px);
  grid-template-rows: 25px 25px 35px;
}

.calendar-head .month {
  background: #3dc3ee;
  border-bottom: 1px solid #cccccc;
  border-right: 1px solid #cccccc;
  grid-row: 1;
  text-align: center;
  line-height: 25px;
  font-size: 18px;
  overflow: hidden;
}

.calendar-head .week {
  background: #edfc1a;
  border-bottom: 1px solid #cccccc;
  border-right: 1px solid #cccccc;
  grid-row: 2;
  overflow: hidden;
  text-align: center;
  line-height: 25px;
}

.calendar-head .day {
  background-color: #eeeeee;
  border-bottom: 1px solid #000000;
  border-right: 1px solid #000000;
  grid-row: 3;
  overflow: hidden;
  text-align: center;
  line-height: 12px;
  padding-top: 3px;
  margin-bottom: 4px;
}

.calendar-head .day.dow_6, .calendar-head .day.dow_7 {
  background-color: #fcd5b4;
}

.calendar-head .day.today {
  background-color: #ff9898;
  font-weight: bold;
}

.calendar-body {
  display: flex;
}

.calendar-body .left {
  flex: 0 0 auto;
  width: 300px;
}

.calendar-body .left .entry {
  white-space: nowrap;
  overflow: hidden;
  height: 20px;
  border-bottom: 1px solid #eeeeee;
  border-right: 1px solid #ccc;
  font-size: 1rem !important;
}

@media (min-width: 2048px) {
  .calendar-body .left .entry {
    height: 28px;
    font-size: 1.2rem !important;
  }
}

.calendar-body .left .entry:hover {
  background-color: #eeeeee;
  cursor: pointer;
}

.calendar-body .left .entry.city.open {
  font-weight: 600;
}

.calendar-body .left .entry.place {
  padding-left: 4px;
}

.calendar-body .left .entry.place.open {
  font-weight: 600;
}

.calendar-body .left .entry.room {
  padding-left: 12px;
}

.calendar-body .calendar {
  display: grid;
  --grid-color: #cccccc;
  grid-template-columns: repeat(var(--grid-columns), 26px);
  grid-template-rows: repeat(var(--grid-rows), 20px);
  overflow-x: hidden;
  position: relative;
}

@media (min-width: 2048px) {
  .calendar-body .calendar {
    grid-template-rows: repeat(var(--grid-rows), 28px);
  }
}

.calendar-body .calendar .empty {
  position: relative;
  top: -1px;
  left: -1px;
  overflow: hidden;
  z-index: 1;
}

.calendar-body .calendar .empty svg path {
  stroke: #bbbbbb;
  fill: transparent;
}

.calendar-body .calendar .empty svg #gr {
  height: 20px;
}

.calendar-body .calendar .empty.hover {
  display: none;
  z-index: 2;
  background-color: #eeeeee;
  border-bottom: 1px solid #cccccc;
  height: 21px;
}

@media (min-width: 2048px) {
  .calendar-body .calendar .empty.hover {
    height: 29px;
  }
}

.calendar-body .calendar .cityopen {
  background: #ffffff;
  border-bottom: 1px solid #eeeeee;
  z-index: 4;
}

.calendar-body .calendar .cityusage {
  background-color: #bbbbbb;
  border-bottom: 1px solid var(--grid-color);
  border-right: 1px solid var(--grid-color);
  z-index: 5;
}

.calendar-body .calendar .sum_usage_1 {
  background-color: #eaec78;
  border-bottom: 1px solid var(--grid-color);
  border-right: 1px solid var(--grid-color);
  z-index: 5;
}

.calendar-body .calendar .sum_usage_2 {
  background-color: #ec7878;
  border-bottom: 1px solid var(--grid-color);
  border-right: 1px solid var(--grid-color);
  z-index: 5;
}

.calendar-body .calendar .room {
  z-index: 5;
}

@media (min-width: 2048px) {
  .calendar-body .calendar .room {
    font-size: 1.2rem !important;
  }
}

.calendar-body .calendar .room.status_0 {
  background-color: #fbff00;
}

.calendar-body .calendar .room.status_1 {
  background-color: #3dff37;
}

.calendar-body .calendar .room.room_hover {
  background-color: #8dcffc;
  cursor: pointer;
}

.calendar-body .calendar .room.customer_locked {
  background-color: #ff0000 !important;
}

.rtable {
  display: flex;
}

.rtable .left {
  flex: 0 0 auto;
  width: 200px;
  padding-top: 85px;
}

.rtable .left .entry {
  white-space: nowrap;
  overflow: hidden;
  height: 20px;
  border-bottom: 1px solid #eeeeee;
  border-right: 1px solid #eee;
}

.rtable .left .entry.city.open {
  font-weight: 600;
}

.rtable .left .entry.place {
  padding-left: 4px;
}

.rtable .left .entry.place.open {
  font-weight: 600;
}

.rtable .left .entry.room {
  padding-left: 12px;
}

.rtable .calendar .empty {
  overflow: hidden;
  z-index: 1;
}

.rtable .calendar .cityopen {
  background: #ffffff;
  border-bottom: 1px solid var(--grid-color);
  z-index: 2;
}

.rtable .calendar .cityusage {
  background-color: #aaaaaa;
  border-bottom: 1px solid var(--grid-color);
  border-right: 1px solid var(--grid-color);
  z-index: 2;
}

.rtable .calendar .placeusage {
  background-color: #aaaaaa;
  border-bottom: 1px solid var(--grid-color);
  border-right: 1px solid var(--grid-color);
  z-index: 2;
}

.rtable .calendar .room {
  z-index: 2;
  border-bottom: 1px solid var(--grid-color);
  border-right: 1px solid var(--grid-color);
}

.rtable .calendar .room.status_0 {
  background-color: #fbff00;
}

.rtable .calendar .room.status_1 {
  background-color: #3dff37;
}

.btn-blue-500 {
  background-color: #0d6efd;
  color: #ffffff;
}

.btn-blue-500 i {
  color: #fff;
}

.btn-blue-500:hover, .btn-blue-500.show {
  color: #ffffff;
  background-color: #6da7fd;
}

.revenue-date-inline-popup {
  top: 34px;
  width: 344px;
}

.revenue-date-inline-popup .flatpickr-calendar {
  box-shadow: none !important;
}

.reservation-overview {
  flex-wrap: wrap;
}

.reservation-overview .overview-entry {
  width: calc(20% - 2rem);
  margin: 1rem;
  padding: 1rem;
  text-align: center;
  background-color: #31869b;
  color: #ffffff;
  font-size: 15px;
  user-select: none;
}

.reservation-overview .overview-entry:hover {
  background-color: #51b0c8;
  cursor: pointer;
}

.reservation-overview .overview-entry .place {
  font-weight: bold;
  font-size: 18px;
}

.header-search {
  position: sticky;
  top: 0px;
  padding: 0.5rem;
  z-index: 100;
  background-color: var(--kt-app-bg-color);
  height: 55px;
  overflow-y: hidden;
}

.header-search-result {
  position: fixed;
  top: 38.5px;
  left: 0;
  z-index: 101;
  margin: .5rem;
  width: calc(100% - 1rem);
  background-color: var(--kt-input-bg);
  border: 1px solid var(--kt-input-border-color);
  border-radius: 0 0 .425rem;
}

table thead th {
  white-space: nowrap;
}

table thead th.sorting:hover {
  cursor: ns-resize;
}
