#calendar {
  display: grid;
  grid-template-columns: 112px 1fr;
  grid-template-rows: 40px 1fr;
  line-height: initial;
  color: black;
  font-family: Calibri, "Segoe UI", Arial;
  font-size: 13.2px;
  letter-spacing: 0.2px;
}
#calendar #esquina {
  grid-column: 1/2;
  grid-row: 1/2;
}
#calendar #dias {
  grid-column: 2/3;
  grid-row: 1/2;
}
#calendar #habs {
  grid-column: 1/2;
  grid-row: 2/3;
}
#calendar #grilla {
  grid-column: 2/3;
  grid-row: 2/3;
}
#calendar.busy * {
  cursor: wait !important;
}
#calendar.not-busy {
  cursor: default !important;
}
#calendar.busy-shadow .reserva {
  border: initial;
  border-top: 1px #ababab solid;
  border-left: 1px #ababab solid;
  background: #dfdfdf;
}
#calendar.busy-shadow .reserva .contenido {
  display: none;
}
#calendar.busy-shadow .bloqueo {
  border: initial;
  border-top: 1px #ababab solid;
  border-left: 1px #ababab solid;
  background: #dfdfdf;
  opacity: 1;
}
#calendar.busy-shadow .bloqueo div {
  display: none;
}
#calendar.busy-shadow .sel {
  display: none;
}

#calendar .tooltip {
  width: auto;
  height: auto;
  display: none;
  position: absolute;
  top: 293px;
  border: 1px #6F8293 solid;
  background: white;
  padding: 1px;
  border-radius: 3px;
  z-index: 2;
  opacity: 1;
  /* para evitar que se sobrescriba esta clase */
  font-family: Calibri, "Segoe UI", Arial;
  font-size: 14px;
  letter-spacing: 0.2px;
  line-height: initial;
}
#calendar .tooltip div {
  background: #F7F8FA;
  height: 100%;
  text-align: left;
  padding: 3px;
}

.menu {
  width: 180px;
  /* height: 80px; */
  display: block;
  position: absolute;
  top: 293px;
  border: 1px gray solid;
  background: white;
  padding: 1px;
  border-radius: 3px;
  z-index: 2;
  box-shadow: 2px 2px 4px rgba(128, 128, 128, 0.6);
  visibility: hidden;
}
.menu ul {
  list-style-type: none;
  text-align: left;
  padding: 3px;
  margin: 0px;
}
.menu ul li {
  padding: 5px;
  border: 1px solid white;
}
.menu ul li:hover {
  background-color: #A0C5E8;
}
.menu ul li hr {
  border-style: inset;
  border-width: 1px;
}
.menu ul li .square {
  height: 15px;
  width: 15px;
  float: right;
  border-radius: 3px;
  border: 1px solid gray;
}
.menu ul li .pendiente {
  background-color: #ffc64b;
}
.menu ul li .confirmado {
  background-color: #FFFF02;
}
.menu ul li .re-confirmado {
  background-color: #34CD34;
}
.menu ul li .check-in {
  background-color: #0000CC;
}
.menu ul li .check-out {
  background-color: #9A6702;
}
.menu ul li .cerrado {
  background-color: #707070;
}
.menu .no-sel {
  padding: 0px 5px;
}
.menu .no-sel:hover {
  background-color: initial;
}
.menu .no-sel hr {
  margin-top: 7px;
  margin-bottom: 7px;
}
.menu .menu-sel {
  border: 1px solid black !important;
}

.menu-visible {
  visibility: visible;
}

.menu-hidden {
  animation: fade-out 500ms; /*  el opacity va llegando a 0 */
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fade-out {
  from {
    opacity: 1;
    visibility: visible;
  }
  to {
    opacity: 0;
    visibility: visible;
  }
}
.expansor-cursor {
  width: 10px;
  background-color: #CEE0F7;
  position: relative;
  /* display: none; */
  height: 100%;
  opacity: 50%;
  cursor: e-resize;
  border: 1px solid black;
  margin-left: auto;
  z-index: 1;
  border-radius: 3px;
}
.expansor-cursor:hover {
  opacity: 100%;
}

.expansor-mark {
  border-radius: 8px;
  z-index: 0;
  display: block;
  border: 3px solid gray;
  cursor: e-resize;
  border-style: dashed;
}

#habs {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(20, 1fr);
  text-align: center;
  border-bottom: #ABABAB 1px solid;
}
#habs > div {
  display: grid;
  border-left: #ABABAB 1px solid;
  border-top: #ABABAB 1px solid;
  background: linear-gradient(to right, #fafafa, #dadada, #f7f7f7);
}
#habs > div > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr;
  align-items: center;
  border-top: white 1px solid;
  margin: 0px;
}
#habs > div > div .numero {
  grid-column: 1/2;
  grid-row: 1/2;
  white-space: nowrap;
  overflow: hidden;
  margin: 0px 3px;
}
#habs > div > div .tipo {
  grid-column: 2/3;
  grid-row: 1/2;
  white-space: nowrap;
  overflow: hidden;
  margin: 0px;
  margin-right: 3px;
  padding: 0px 3px;
  border-left: 1px solid gray;
}

#esquina {
  border-left: #ABABAB 1px solid;
  border-top: #ABABAB 1px solid;
  background-color: white;
}

#dias {
  display: grid;
  height: 40px;
  background-color: white;
  grid-template-columns: repeat(14, 1fr);
  grid-template-rows: repeat(1, 1fr);
  text-align: center;
  border-right: #ABABAB 1px solid;
}
#dias > div {
  display: grid;
  align-items: center;
  overflow: hidden;
  border-left: #ABABAB 1px solid;
  border-top: #ABABAB 1px solid;
  background: linear-gradient(to bottom, #fafafa, #e0e0e0, #dadada, #dfdfdf, #f7f7f7);
  box-shadow: inset 1px 0 0 0 white;
}
#dias .dia-rojo {
  border-left: #FF6060 1px solid !important;
}
#dias .dia-amarillo {
  background-color: #FFF59F;
}

.traslado {
  display: none;
  grid-column: 3/6;
  grid-row: 5/6;
  border: 3px solid lightgray;
  border-radius: 8px;
  z-index: 0;
}

.traslado.valido {
  display: block;
  border-color: gray;
  cursor: move;
}

.traslado.no-valido {
  display: block;
  border-color: red;
  cursor: move;
}

.sel {
  grid-column: 2/3;
  grid-row: 6/7;
  border: 1px #81A7DE solid;
  background-color: #CEE0F7;
}

.reserva {
  position: relative;
  display: grid;
  background-color: white;
  border: 1px #6d6d6d solid;
  border-radius: 3px;
  box-shadow: 1px 1px 1px rgba(128, 128, 128, 0.6);
  cursor: pointer;
}
.reserva .contenido {
  display: grid;
  align-items: center;
  overflow: hidden;
  border-radius: 3px;
  margin: 0.67px;
}
.reserva .contenido span {
  white-space: nowrap;
  line-height: 13.2px;
  height: 13.2px;
  padding-left: 3px;
  padding-right: 3px;
}

.seleccionado {
  border: 1px black solid;
}
.seleccionado .contenido {
  border: 2px #6da9d1 solid !important;
  margin: 0px;
}

.pendiente > .contenido {
  border: 1px #CFBE97 solid;
  background: linear-gradient(to bottom, #ffd985, #ffd572, #ffc445);
}
.pendiente > .contenido:hover {
  background: linear-gradient(to bottom, #ffe7aa, #ffe69e, #ffd773);
}

.confirmado > .contenido {
  border: 1px #C7CE55 solid;
  background: linear-gradient(to bottom, #ffff7a, #FFFF3A, #FFFF00);
}
.confirmado > .contenido:hover {
  background: linear-gradient(to bottom, #FEFEC3, #FEFEA1, #FFFF48);
}

.re-confirmado > .contenido {
  border: 1px #3BB445 solid;
  background: linear-gradient(to bottom, #79db79, #64db64, #34CD34);
}
.re-confirmado > .contenido:hover {
  background: linear-gradient(to bottom, #d2ffd2, #B3ECB3, #6EDB6E);
}

.check-in > .contenido {
  border: 1px #5B61C1 solid;
  background: linear-gradient(to bottom, #3A3AD8, #2626D4, #0000CC);
  color: white;
}
.check-in > .contenido:hover {
  background: linear-gradient(to bottom, #C3C3F2, #A0A0EB, #4747DA);
}

.check-out > .contenido {
  border: 1px #9C8044 solid;
  background: linear-gradient(to bottom, #AF8839, #A97D27, #9A6702);
  color: white;
}
.check-out > .contenido:hover {
  background: linear-gradient(to bottom, #e0cfac, #dbb872, #b88725);
}

.cerrado > .contenido {
  border: 1px #707070 solid;
  background: linear-gradient(to bottom, #A0A0A0, #707070);
  color: white;
}
.cerrado > .contenido:hover {
  background: linear-gradient(to bottom, #C0C0C0, #909090);
}

.grilla {
  border-right: #ABABAB 1px solid;
  border-bottom: #ABABAB 1px solid;
  display: grid;
  background-color: white;
  grid-template-columns: repeat(14, 1fr);
  grid-template-rows: repeat(20, 1fr);
  text-align: center;
}

.cell {
  border-left: #ABABAB 1px solid;
  border-top: #ABABAB 1px solid;
}

.cell-rojo {
  border-left: #FF6060 1px solid;
}

.cell-amarillo {
  background-color: #FFF59F;
}

.bloqueo {
  display: grid;
  border: red 2px solid;
  opacity: 0.8;
}
.bloqueo div {
  background: red;
  opacity: 0.2;
}

.non-selectable {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

@font-face {
  font-family: Calibri;
  src: url("./calibri/Calibri Regular.ttf");
  font-weight: normal;
}
@font-face {
  font-family: Calibri;
  src: url("./calibri/Calibri Bold.TTF");
  font-weight: bold;
}
.font-calibri {
  font-family: Calibri, "Segoe UI", Arial;
  font-size: 13.2px;
  letter-spacing: 0.2px;
}

/*# sourceMappingURL=calendar.css.map */
