.box {
  display: flex;
  flex-direction: column;
  gap: var(--y-space-16);
  padding: var(--y-space-24);
  border-radius: var(--y-space-16);
  box-shadow: var(--y-color-shadow);
  background-color: var(--y-color-bg);
  color: var(--y-color-txt);
  width: 100%;
}
.box .calendar-popover,
.main-box .calendar-popover {
  display: none !important;
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 117 !important;
}
.box .calendar-popover.show,
.main-box .calendar-popover.show {
  display: flex !important;
}
.box .title {
  font-size: var(--y-space-16);
  font-weight: 700;
  color: var(--y-color-txt);
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.box p {
  font-size: var(--y-space-16);
  font-weight: 400;
  color: var(--y-color-txt);
}

.box .grey {
  font-size: var(--y-space-14);
  font-weight: 400;
  color: var(--y-color-grey);
}
.box h3 {
  font-size: var(--y-space-20);
  font-weight: 700;
  color: var(--y-color-btn-hover);
}

.box button,
.box a {
  font-size: var(--y-space-16) !important;
}

.box p.address {
  display: flex;
  align-items: center;
  gap: var(--y-space-8);
}
.box p.address img {
  width: 16px;
  height: 16px;
  object-fit: contain;
  filter: invert(1);
}
@media (max-width: 380px) {
  .box button,
  .box a {
    font-size: var(--y-space-14) !important;
  }
  .box p {
    font-size: var(--y-space-14);
    font-weight: 400;
    text-align: center;
  }
  .left .box:not(:has(h3)) p {
    text-align: justify;
  }
}