/* ------------ nuovo booking --------------- */

.dx-overlay-content.dx-popup-normal.dx-resizable {
  max-width: 760px !important;
}

.listRowBooking {
  padding: 1rem 1.25rem;
}

.listRowBooking:hover {
  background-color: var(--text-100);
  cursor: pointer;
}

.listStyleBooking {
  align-self: stretch;
  border-radius: var(--border-radius-list) !important;
  border: var(--border-default) !important;
  background: var(--background-list);
  cursor: pointer;
  padding: 1rem 1.25rem;
}

.listStyleArchivedBooking {
  align-self: stretch;
  border-radius: var(--border-radius-list) !important;
  border: var(--border-default) !important;
  background: var(--background-list);
  cursor: pointer;
  padding: 1rem 1.25rem;
}

.info-box {
  padding: 0.5rem 0.75rem;
  background-color: var(--text-100);
  border-radius: 0.25rem;
  margin-bottom: 0.5rem;
  font-size: var(--font-size-sm);
}

.btn-danger {
  background-color: var(--danger-100) !important;
  border-color: var(--danger-200) !important;
  color: var(--danger-700) !important;
}
.alert-warning {
  background-color: var(--warning-50) !important;
  color: var(--warning-700) !important;
  font-size: var(--font-size-sm) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  padding: 9px !important;
}

/* NUOVO: */
.alert-danger {
  background-color: var(--danger-50) !important;
  color: var(--danger-700) !important;
  font-size: var(--font-size-sm) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  padding: 9px !important;
}

.alert-success {
  background-color: var(--success-50) !important;
  color: var(--success-700) !important;
  font-size: var(--font-size-sm) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  padding: 9px !important;
}

/* NUOVO: */
@keyframes sidebarIn {
  0% {
    opacity: 0;
    transform: translateX(-20px);
  }
  50% {
    opacity: 0.5;
    transform: translateX(-10px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes sidebarOut {
  0% {
    opacity: 1;
    transform: translateX(0);
  }
  50% {
    opacity: 0.5;
    transform: translateX(-10px);
  }
  100% {
    opacity: 0;
    transform: translateX(-20px);
  }
}
.sidebar-show {
  animation: sidebarIn 0.8s ease-in-out forwards;
}
.sidebar-hide {
  animation: sidebarOut 0.8s ease-in-out forwards;
}

/* --------------------------------------------------------------------------*/

@media screen and (max-width: 500px) {
  .card-body {
    padding: 15px 0px !important;
  }
}

.bg_tourguide {
  /* background-color: #e5e6e8 !important; */
  border: 2px solid rgb(0, 45, 84) !important;
  box-shadow: 2px 3px 15px 2px rgba(0, 45, 84, 0.74) !important;
}

.dx-list-group-header,
.dx-list-item-content {
  color: rgb(0, 45, 84) !important;
}

.dx-list-group-body {
  background-color: #f0f3f5;
  border-radius: 10px;
  /* padding-left: 25px */
}

.dx-item.dx-list-item.dx-state-focused.dx-state-active {
  background-color: transparent !important;
}

.dx-popup-bottom {
  border-top: 1px solid #e0e0e0;
}

.dx-popup-title {
  /* padding: 0px !important; */
  min-height: fit-content !important;
}

.m_badge {
  padding: 8px 10px !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
}

.required {
  color: rgb(198, 4, 4);
}

.dx-list-item > .dx-inkripple > .dx-inkripple-wave {
  transition-property: none !important;
  transform: none !important;
  animation: none !important;
}

/*.dx-toolbar-center {
  display: flex;
  justify-content: center;
  align-items: center;
}*/

.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused {
  background-color: transparent !important;
}

/* #toolbarScheduler > .dx-toolbar-items-container {
  min-height: 4rem;
} */

/* Cella Tutto il giorno */
.dx-scheduler-all-day-title,
.dx-scheduler-all-day-table {
  height: 3.25rem !important;
}
.dx-scheduler-all-day-title {
  padding-top: 15px;
}
/*.dx-scheduler-time-panel, .dx-scheduler-appointment-horizontal {
  height: fit-content !important;
}*/

/* Celle scheduler */
.dx-scheduler-cell-sizes-vertical,
.dx-scheduler-cell-sizes-horizontal {
  height: 3.65rem;
}

/* Tooltip size */
/*.dx-tooltip-wrapper .dx-overlay-content .dx-popup-content {
  max-height: 450px !important;
  height: 400px !important;
}*/

.dx-overlay-modal > div.dx-overlay-content {
  /* max-width: 550px !important;*/
  width: 50% !important;
}

.dx-menu-item-content span {
  margin-right: 5px;
}

.dx-menu-item .dx-icon-spinright {
  position: absolute;
  top: 7px;
  right: 2px;
}

#list_temp > .list-group-item {
  padding: 0.75rem 0rem !important;
}

/*..dx-list-item-content {
  padding: 0px 0px 0px 0px !important;
  border-radius: 0.75rem !important;
}*/

/*.dx-tooltip-wrapper .dx-overlay-content .dx-popup-content {
  width: 50% !important;
  overflow-y: auto !important;
}*/

.dx-scheduler-appointment-content-details {
  font-size: 12px !important;
}
.dx-scheduler-appointment-tooltip-wrapper > div.dx-overlay-content {
  width: 50% !important;
  overflow-y: auto !important;
}

.shadow_card {
  box-shadow: 6px 6px 15px 6px #d6d6d6;
}

/*COLORI TEMPLATE TOOLTIP/POPUP*/
.disponibile {
  border-left: 15px solid #004c81 !important;
  border-radius: 0.25rem;
}
.passato {
  border-left: 15px solid #91a6b6 !important;
  border-radius: 0.25rem;
}
.notPreno {
  border-left: 15px solid #9f1239 !important;
  border-radius: 0.25rem;
}
.notAttivo {
  border-left: 15px solid #b75e00 !important;
  border-radius: 0.25rem;
}
.prenotato {
  border-left: 15px solid #047857 !important;
  border-radius: 0.25rem;
}

.borderTooltip {
  border-left: 15px solid !important;
}

/*COLORI TEMPLATE APPUNTAMENTO*/
.disponibile_mr {
  background-color: #b7e1ff !important;
  color: #0369a1;
}
.passato_mr {
  background-color: #e5e5e5 !important;
  color: #415462;
}
.notPreno_mr {
  background-color: #fecdd3 !important;
  color: #881337;
}
.notAttivo_mr {
  background-color: #ffdebc !important;
  color: #7f4100;
}
.prenotato_mr {
  background-color: #b8e9d0 !important;
  color: #166534;
}
.transparent {
  background-color: transparent !important;
  color: black;
}

/* FIX: modifica temporanea per provare  */
/* .disabilitato_mr {
  opacity: 0.5;
} */

.dx-scheduler-appointment-content-details {
  white-space: unset !important;
}

.dx-scheduler-appointment {
  background-color: transparent !important;
  color: black;
}

.dx-scheduler-appointment-content-details {
  white-space: unset !important;
}

.privacyBlock {
  font-size: 15px;
}

/*tooltip marker*/
.dx-scheduler-overlay-panel .dx-tooltip-appointment-item .dx-tooltip-appointment-item-marker-body {
  margin-top: 18px !important;
  margin-left: 0px !important;
  width: 30px !important;
  border-radius: 50% !important;
  height: 30px !important;
}

/*Posti a sedere*/
.lista_posti {
  list-style: none;
  padding: 0;
  margin: 0;
}
.seats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-left: 0;
  margin-bottom: 0;
}

.seats li::marker {
  display: none;
  content: none;
}

.seat {
  flex: 0 0 auto;
  position: relative;
}

.seat input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  z-index: -1;
}

.seat input[type="checkbox"]:checked + label {
  background: var(--success-100);
  border-color: var(--success-400); /* verde selezionato */
  color: var(--success-900);
}

.check-available + label,
.check-unavailable + label,
.check-booked + label {
  display: flex;
  width: 44px;
  height: 44px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
  border-radius: 4px;
  border: 0.5px solid transparent;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}

/* Differenzia gli stati */
.check-available + label {
  background: var(--primary-50);
  border-color: var(--primary-300);
  color: var(--primary-900);
}

.check-unavailable + label {
  background: var(--text-200);
  border-color: var(--text-400);
  color: var(--text-900);
  cursor: not-allowed;
}

.check-booked + label {
  background: var(--danger-100);
  border-color: var(--danger-400);
  color: var(--danger-900);
  cursor: not-allowed;
}

.check-available + label:hover {
  box-shadow: 0 0 0px 2px var(--primary-500);
}

.mybox {
  width: 20px;
  height: 20px;
}

.booked {
  background-color: #f43f5e;
  border: 1px solid #9f1239;
}
.unavailable {
  background-color: #9a9da0ad;
  border: 1px solid #616e77;
}
.available {
  background-color: #008ef1;
  border: 1px solid #004c81;
}
.selected {
  background-color: #10b981;
  border: 1px solid #047857;
}

.dx-toast-warning {
  /* color: #1c1b19 !important; */
  color: #66512c !important;
}

@media only screen and (max-width: 700px) {
  /* .dx-popup-wrapper > div.dx-overlay-content {
   
    max-width: 500px !important;
    width: 100% !important;
    
  } */
  .dx-scheduler-work-space-work-week
    .dx-scheduler-appointment-reduced
    .dx-scheduler-appointment-content {
    padding-right: 0px !important;
  }
  .dx-scheduler-appointment-reduced-icon {
    display: none;
  }
  .dx-scheduler-overlay-panel > div.dx-overlay-content {
    height: fit-content !important;
  }

  .widthWorkWeek {
    width: 66px !important;
  }

  .privacyBlock {
    padding-left: 5% !important;
  }

  .dx-scheduler-cell-sizes-vertical,
  .dx-scheduler-cell-sizes-horizontal {
    height: 3rem;
  }

  .p_alert {
    padding-top: 20px;
    padding-bottom: 0px;
  }

  #seat-template {
    overflow-y: auto;
    height: 350px;
    padding-top: 20px;
  }

  .list-group-item {
    padding-bottom: 10px !important;
  }

  .legenda {
    display: none;
  }
}

#toolbarScheduler {
  background-color: white !important;
}

#chkPresaVisione .form-check-label {
  opacity: 1 !important;
}

/* FIX: modifica temporanea per provare  */

.disabilitato_mr {
  --dash: 4px; /* lunghezza trattino */
  --gap: 6px; /* spazio tra i trattini */
  --bw: 1px; /* spessore */

  background-image:
    /* sopra */
    repeating-linear-gradient(
      90deg,
      currentColor 0 var(--dash),
      transparent var(--dash) calc(var(--dash) + var(--gap))
    ),
    /* sotto */
    repeating-linear-gradient(
        90deg,
        currentColor 0 var(--dash),
        transparent var(--dash) calc(var(--dash) + var(--gap))
      ),
    /* sinistra */
    repeating-linear-gradient(
        180deg,
        currentColor 0 var(--dash),
        transparent var(--dash) calc(var(--dash) + var(--gap))
      ),
    /* destra */
    repeating-linear-gradient(
        180deg,
        currentColor 0 var(--dash),
        transparent var(--dash) calc(var(--dash) + var(--gap))
      ),
    /* sfondo sbiadito */ linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5)) !important;
  background-size:
    100% var(--bw),
    100% var(--bw),
    var(--bw) 100%,
    var(--bw) 100%,
    100% 100%;
  background-position:
    left top,
    left bottom,
    left top,
    right top,
    0 0;
  background-repeat: no-repeat;
}

.dx-scheduler-agenda-appointment-marker.disabilitato_mr,
.dx-tooltip-appointment-item-marker-body.disabilitato_mr {
  outline: none;
  background-image: none !important;
  border: 2px dashed currentColor;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.dx-scheduler-agenda-appointment-marker.disabilitato_mr {
  width: 32px;
  height: 32px;
  font-size: 11px;
}

.dx-scheduler-appointment-content.disabilitato_mr {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.dx-scheduler-appointment-content.disabilitato_mr::before {
  content: "\f070";
  font: var(--fa-font-solid);
  font-size: 1.5rem;
  position: absolute;
  inset: 0;
  display: flex;
  align-items: end;
  justify-content: end;
  opacity: 0.25;
  pointer-events: none;
  z-index: 0;
  padding: 0.35rem;
}

.dx-scheduler-appointment-content.disabilitato_mr > * {
  position: relative;
  z-index: 1;
}