/* ------------ nuovo booking --------------- */

.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;
}

.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: */
@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;
}
.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;
}
