body, html {
    margin: 0;
    min-height: 100%;
    height: 100%;
   /* color: #228B7E !important;*/
}

#app-side-nav-outer-toolbar {
    flex-direction: column;
    display: flex; 
    height: 100%;
    width: 100%;
}

/* OFF */
/*#swLista[aria-checked="false"] .dx-switch-container::before {
    background-color: var(--accent-color) !important;
    border-color: var(--accent-color) !important;
    background-image: none !important;
    opacity: 1 !important;
}*/

/* ON */
/*#swLista[aria-checked="true"] .dx-switch-container::before {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    background-image: none !important;
    opacity: 1 !important;
}*/

.layout-header {
    flex: 0 0 auto;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    position: relative;
    z-index: 1505;
}

.dx-toolbar .dx-toolbar-item.menu-button {
    width: 60px;
    text-align: center;
    padding: 0;
}

.dx-card {
    box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.24);
    border-radius: 4px;
    background-color: #fff;
    margin: 2px 2px 3px;
}

.dx-card.wide-card {
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    border-right: 0;
    border-left: 0;
}

.with-footer > .dx-scrollable-wrapper > .dx-scrollable-container > .dx-scrollable-content {
    height: 100%;
}

.with-footer > .dx-scrollable-wrapper > .dx-scrollable-container > .dx-scrollable-content > .dx-scrollview-content {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.layout-body {
    background-color: #f5f5f5; /*f2f2f2 ;*/
    flex: 1;
    height: 100%;
    min-height: 0;
    color: lightblue !important;
}

.layout-body .menu-container {
    height: 100%;
    width: 250px;
    background-color: #fff;
}

.layout-body .content {
    flex-grow: 1;
    height: 100%;
    line-height: 1.5;
    margin: 10px 40px;
}

.layout-body .content h2 {
    font-size: 32px;
    /*line-height: 40px;*/
}

.layout-body .content-block {
    margin: 0 0 20px;
}

.layout-body .content-footer {
    display: block;
    color: rgba(0,0,0,.609);
    border-top: 1px solid rgba(0,0,0,.1);
    padding-top: 20px;
    padding-bottom: 24px;
    margin: 0 40px;
}

.layout-body .responsive-paddings {
    padding: 20px;
}

.layout-body-hidden {
    visibility: hidden;
}

#layout-drawer.dx-drawer-shrink .dx-drawer-panel-content {
    box-shadow: rgba(0, 0, 0, 0.06) 0px 4px 4px 0px, rgba(0, 0, 0, 0.12) 0px 1px 2px 0px;
}

@media screen and (max-width: 600px) {
    .layout-body .content {
        margin: 20px;
    }
}

@media screen and (min-width: 1280px) {
    .layout-body .responsive-paddings {
        padding: 40px;
    }
}

.menu-container .dx-widget {
    font-weight: 700;
    font-size: 14px;
    font-family: Poppins, Roboto,RobotoFallback,Helvetica,Arial,sans-serif !important;
    line-height: 24px;
}

.menu-container .dx-treeview {
    white-space: nowrap;
}

.menu-container .dx-treeview .dx-treeview-item {
    padding-left: 0;
    flex-direction: row-reverse;
    border-radius: 0;
}

.menu-container .dx-treeview .dx-treeview-item .dx-icon {
    width: 60px !important;
    margin: 0 !important;
}

.menu-container .dx-treeview .dx-treeview-node {
    padding: 0 0 !important;
}

.menu-container .dx-treeview .dx-treeview-toggle-item-visibility {
    right: 10px;
    left: auto;
}

.menu-container .dx-treeview .dx-rtl .dx-treeview-toggle-item-visibility {
    left: 10px;
    right: auto;
}

.menu-container .dx-treeview .dx-treeview-node[aria-level="1"] {
    font-weight: bold;
}

.menu-container .dx-treeview .dx-treeview-node[aria-level="2"] .dx-treeview-item-content {
    font-weight: normal;
    padding: 0 60px;
}

/*#cmdLogout {
    color: black !important;
}
*/
/*.dx-button-mode-text.dx-button-success.dx-state-hover .dx-icon{
    color: black !important;
}
.dx-button-mode-text.dx-button-success .dx-icon {
    color: black !important;
}*/

.blocco-sfondo {
    background-image: linear-gradient(to bottom right, #5BCFC5 0%, #5BCFC5 100%); /* Gradiente diagonale scurito */
    color: white; /* Rende il testo più leggibile su sfondo scuro */
    padding: 0; /* Imposta il padding a 0 */
    display: flex; /* Abilita Flexbox per il contenitore del testo */
    align-items: center; /* Mantiene l'allineamento verticale al centro */
    justify-content: flex-end; /* Spinge il contenuto a destra */
    text-align: left; /* Allinea il testo a sinistra all'interno del suo spazio */
   /* min-height: 300px; /* Imposta un'altezza minima per il blocco */
}

.testo-contenuto {
   /* width: 70%;*/ /* Il testo occupa il 70% della larghezza del contenitore */
    display: flex;
    flex-direction: column;
    justify-content: space-around; /* Distribuisce lo spazio verticale tra gli elementi */
    height: 70%; /* Forza l'altezza del contenuto testuale */
   /* padding: 20px;*/ /* Reintroduce il padding per il contenuto testuale */
    box-sizing: border-box; /* Assicura che il padding non influenzi la larghezza */
}

    .testo-contenuto h2 {
        font-family: 'Montserrat Condensed', sans-serif; /* Applica il font al titolo */
        font-size: 2.6vw !important;
        /* font-variant: small-caps;*/
        margin-bottom: 30px;
        line-height: 0.9;
    }

    .testo-contenuto p {
        font-size: 1.2vw; /* Aumento della dimensione del paragrafo */
        font-family: 'Open Sans', sans-serif;
        line-height: 1.9; /* Leggero aumento della spaziatura tra le righe */
        margin-bottom: 0; /* Rimuove il margine inferiore predefinito */
    }

.immagine-destra {
    padding-right: 0; /* Rimuove il padding a destra */
}

    .immagine-destra img {
        opacity: 0.7; /* Imposta l'opacità dell'immagine */
        /*width: 100%;*/ /* Assicura che l'immagine riempia il contenitore */
        /*height: auto;*/ /* Mantiene le proporzioni */
max-height:30vh;
       /* width: auto;*/ /* Aggiunto per maggiore chiarezza */
        display: block; /* Rimuove spazio extra sotto l'immagine */
    }

.Titolo2Home{
    color: lightblue !important;
}

.dx-menu, .dx-menu-item, .dx-menu-item-selected, .dx-icon, .dx-datagrid-headers {
    color: #228B7E !important;
}



#cmdLogout {
    color: #228B7E !important;
}




.dx-button-content {
    font-family: Poppins, Roboto, RobotoFallback, Helvetica, Arial, sans-serif !important;
    /*color: #0f6cbd !important;*/
    display: flex;
    align-items: center; /* Allinea gli elementi verticalmente al centro */
    justify-content: center; /* Allinea gli elementi orizzontalmente al centro */
}

.dx-widget {
    font-family: Poppins, Roboto, RobotoFallback, Helvetica, Arial, sans-serif !important;
}

.dx-button.dx-button-success {
    border-radius: 4px;
    background-color: white;
    color: #fff
}
    .dx-button.dx-button-success.dx-state-hover {
        border-radius: 4px;
        background-color: #ebebeb;
        color: #fff
    }

.dx-button#registerSubmit, .dx-button#update-profile-button {
    min-height: 52px;
}



.dx-editor-outlined.dx-texteditor-label-outside .dx-label {
    font-weight: bold;
    color: var(--text-color) !important;
}

.dx-theme-fluent-typography h1 {
    font-size: 24px !important;
}

.layout-body .content h2 {
    font-size:20px;
}

.dx-theme-fluent-typography h3 {
    font-size: 20px;
    
}

.dx-theme-fluent-typography a {
    color: white;
}

.nav-link {
    color: var(--primary-color) !important;
}

    .nav-link.active {
        color: var(--primary-color) !important;
    }

.layout-body .content h4 {
    font-size: 20px;
}

.dx-button.dx-button-default {
  /*  background-color: #5BCFC5;*/
}
.dx-button {
    background-color: var(--primary-color) !important;
}

    .dx-button.dx-state-focused, .dx-button.dx-state-hover {
        background-color: #27ae60 !important;
        color: white !important;
    }



.link {
    display: block;
    margin-bottom: 0.2em;
}

#imagesContainer {
    border: 1px none gray;
    border-radius: 0.2em;
    height: 15em;
    width: 16em;
}

.dx-placeholder{
    font-size: 14px !important;
}

.genericlink {
    color: blue !important;
}

.fondoChiaro {
    color: #5BCFC5 !important;
}

/* GRIGLIE SERVIZI */
.column:first-child {
    width: 50%;
    padding-right: 15px;
}

.column:last-child {
    width: 50%;
    padding-left: 15px;
}

.dx-button-mode-outlined.dx-button-default {
    color: lightblue;
}

.w-40 {
    width: 40% !important;
}
.w-48 {
    width: 48% !important;
}

.vh-90{
    height: 90vh !important;
}

.vh-75 {
    height: 75vh !important;
}



/* Questo è il tuo div con classi come p-3 mb-3 border rounded shadow-sm w-100 */
.p-3.mb-3.border.rounded.shadow-sm.w-100 {
    width: 100% !important; /* Forziamo il div a essere al 100% della larghezza del suo parente (tbody) */
    max-width: 100% !important; /* Non ci devono essere limiti superiori */
    box-sizing: border-box; /* Includi padding e bordo nel calcolo della larghezza totale */
    /* Regola il padding interno della card per dare "aria" al contenuto */
    padding: 1rem !important; /* Padding di base per tutti gli schermi */
    margin-bottom: 1rem !important; /* Spazio tra le "righe" del template */
}

/* Regole per schermi desktop (da 768px in su) */
@media (min-width: 768px) {
    .p-3.mb-3.border.rounded.shadow-sm.w-100 {
        padding: 1.5rem !important; /* Più padding su tutti i lati per desktop */
    }

        /* Regola la dimensione dell'immagine sul desktop, senza alterare i font */
        .p-3.mb-3.border.rounded.shadow-sm.w-100 .flex-shrink-0 img {
            max-width: 200px !important;
            height: 200px !important;
        }
}

/* Regole specifiche per schermi mobile (fino a 767px) */
@media (max-width: 767px) {
    .p-3.mb-3.border.rounded.shadow-sm.w-100 {
        padding: 1rem !important; /* Padding standard su mobile */
    }

        /* Ridimensiona l'immagine su mobile */
        .p-3.mb-3.border.rounded.shadow-sm.w-100 .flex-shrink-0 img {
            max-width: 100px !important;
            height: auto !important;
        }

        /* Centra il contenitore dell'immagine quando gli elementi sono impilati */
        .p-3.mb-3.border.rounded.shadow-sm.w-100 .flex-shrink-0 {
            margin-left: auto !important;
            margin-right: auto !important;
            display: block !important;
        }
}

.dx-drawer-shader {
   
    background-color: #F5F5F5;
}

.dx-tab .dx-tab-text {   
    min-width: 70px !important;
}

/* ELENCO STUDI */

    /* Layout a due colonne */
    .left-panel {
        /*border-right: 1px solid #eee;*/
        padding-right: 20px;
    }

    .right-panel {
        height: 600px;
        background-color: #f8f8f8;
        border: 1px solid #ddd;
        display: flex;
        justify-content: center;
        align-items: center;

        border:none;
    }

    /* Responsività per schermi piccoli */
    @media (max-width: 768px) {
        .left-panel

    {
        border-right: none;
        padding-right: 0;
        border-bottom: 1px solid #eee;
        padding-bottom: 20px;
        margin-bottom: 20px;
    }

    .right-panel {
        height: 400px;
    }

    }

    /* Accordion: stile migliorato */
    .dx-accordion-item-title {
        font-weight: 600; /* più moderno del "bold" */
        color: #337ab7;
        padding: 10px 15px;
        border-bottom: 1px solid #eee;
        background-color: #fff; /* migliora il contrasto */
        cursor: pointer;
    }

    .dx-accordion-item-content {
        padding: 15px;
        background-color: #f9f9f9;
        border-top: 1px solid #eee;
    }

#accordionStudi {
    padding-right: 20px;
}

    /* Riepilogo studio */
.studio-summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    /*background-color: var(--primary);*/ /*#007acc;*/
    background-color: var(--primary-color) !important;
    color: white;
    font-weight: 600;
    font-size: 1.2rem;
    border-radius: 4px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

    .studio-summary .name {
        flex: 1;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .studio-summary .city {
        font-size: 0.9rem;
        opacity: 0.8;
        margin-left: 15px;
        white-space: nowrap;
    }

.studio-details-content {
    padding: 12px 16px;
    background-color: rgba(91,207,197,0.05) !important;
    border: 1px solid #d1e3ff;
    border-top: none;
    border-radius: 0 0 4px 4px;
    font-size: 1rem;
    color: #333;
}

    .studio-details-content p {
        margin: 6px 0;
    }

    .studio-details-content strong {
        color: var(--primary);
    }

.user-menu {
    position: absolute; /* o fixed, a seconda del comportamento voluto */
    right: 0; /* ancoralo al bordo destro */
    max-width: 100vw; /* non deve superare la larghezza viewport */
    overflow-wrap: break-word; /* se testo troppo lungo */
    box-sizing: border-box;
    z-index: 1600; /* più alto di header etc */
}

/* --- Contenitore principale dell'header con Flexbox --- */
.main-header-flex-wrapper {
    display: flex !important;
    align-items: center !important; /* Allinea verticalmente gli elementi */
    justify-content: flex-start !important; /* Allinea tutto a sinistra per iniziare */
    width: 100% !important;
    background-color: #fff !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24) !important;
    position: relative !important;
    z-index: 1505 !important;
    padding: 0 10px !important;
    min-height: 50px !important;
    box-sizing: border-box !important;
    flex-wrap: nowrap !important; /* Forziamo a stare su una riga per ora */
    overflow: hidden; /* Lasciamo hidden, ma i figli dovrebbero essere visibili */
}

/* --- Il div che contiene SOLO la DevExtreme Toolbar (pulsante ricerca) --- */
.layout-header {
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    flex-basis: auto !important;
    box-shadow: none !important;
    position: static !important;
    z-index: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    width: auto !important;
    min-width: fit-content !important;
    min-height: 50px !important;
    background-color: transparent !important;
    display: flex !important;
    align-items: center !important;
    overflow: visible !important;
}

    /* Il componente DevExtreme Toolbar stesso */
    .layout-header .dx-toolbar {
        background-color: transparent !important;
        border: none !important;
        padding: 0 !important;
        width: 100% !important;
        height: 100% !important;
        overflow: visible !important;
    }

/* --- Contenitore del logo --- */
.header-logo-container {
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    flex-basis: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    height: 50px !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 0 0 30px !important; /* Margine sinistro per il logo */
    overflow: visible !important;
}

@media (max-width: 600px){
    .header-logo-container {
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
        flex-basis: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        height: 50px !important;
        width: 40px !important;
        min-width: 0 !important;
        padding: 0 !important;
        margin: 0 0 0 30px !important; /* Margine sinistro per il logo */
        overflow: hidden !important;
    }
}

    .header-logo-container img {
        display: block !important;
        height: 40px !important;
        width: auto !important;
        max-width: 250px !important;
        object-fit: contain !important;
        visibility: visible !important;
        opacity: 1 !important;
        padding: 0 !important;
        margin: 0 !important;
    }

/* --- Contenitore dei due menu (navigation e user) --- */
.header-menus-container {
    display: flex !important;
    align-items: center !important;
    /* Rimuoviamo gap se vogliamo gestire i margini singolarmente per i menu */
    gap: 0px !important; /* Manteniamo 0px se i gap sono gestiti dai margin-auto */
    flex-grow: 1 !important; /* **NUOVO:** Permetti a questo contenitore di espandersi */
    flex-shrink: 0 !important;
    flex-basis: auto !important;
    justify-content: flex-start !important; /* **NUOVO:** Inizia ad allineare a sinistra i menu al suo interno */
    min-width: fit-content !important;
    min-height: 50px !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    margin-left: 0 !important; /* **Rimosso il margin-left: auto; qui** */
}

    /* --- Stili per i singoli menu wrapper (.navigation-primary, .user-primary) --- */
    .header-menus-container .menu-container {
        height: auto !important;
        width: auto !important;
        background-color: transparent !important;
        box-shadow: none !important;
        padding: 0 !important;
        margin: 0 !important;
        min-width: fit-content !important;
        min-height: 40px !important;
        display: flex !important;
        align-items: center !important;
        overflow: visible !important;
    }

        /* Centra il menu di navigazione --- */
        .header-menus-container .menu-container.navigation-primary {
            margin-left: auto !important; /* Sposta il menu di navigazione a destra dello spazio libero */
            margin-right: auto !important; /* Sposta il menu di navigazione a sinistra dello spazio libero, centrandolo */
        }

        /* Sposta il menu utente a destra --- */
        @media (max-width: 1199px){
            .header-menus-container .menu-container.navigation-primary {
                margin-left: auto !important; /* Sposta il menu utente all'estrema destra */
                margin-right: 40px !important;
            }

        }


    /* Il componente DevExtreme Menu stesso */
    .header-menus-container .dx-menu {
        border: none !important;
        background-color: transparent !important;
        box-shadow: none !important;
        padding: 0 !important;
        height: auto !important;
        min-height: 40px !important;
        white-space: nowrap !important;
        overflow: visible !important;
    }

        /* --- Voci di menu individuali (DxMenu Item) --- */
        .header-menus-container .dx-menu .dx-menu-item {
            min-height: 40px !important;
            height: auto !important;
            padding: 0px 0px !important;
            display: flex !important;
            align-items: center !important;
            overflow: visible !important;
        }

        .header-menus-container .dx-menu .dx-menu-item-text {
            line-height: normal !important;
        }

.menu-container .dx-widget {
    font-weight: 700;
    font-size: 14px;
    font-family: Poppins, Roboto,RobotoFallback,Helvetica,Arial,sans-serif !important;
}

.desktop-menu{
    display: block;
}

.mobile-menu {
    padding: 0px;
    margin:0px;
    width:0px;
    display: none;
}



@media screen and (max-width: 1199px) {
    .desktop-menu {
        padding: 0px;
        margin: 0px;
        width: 0px;
        display: none;
    }

    .mobile-menu {
        display: block;
    }
}


@media (max-width: 1199px) {
    .header-menus-container .menu-container.menu-authenticated {
        display: none !important;
    }
}

.dx-scheduler-a11y-status-container {
    display:none;
}


#main-menu-desktop .dx-icon.dx-icon-message {
    position: relative;
    margin-right: 15px;
}


    #main-menu-mobile .dx-icon.dx-icon-message {
        position: relative;
    }

#main-menu-desktop .badge-on-icon {
    position: absolute;
    top: -6px;
    right: -8px;
    background: #dc3545;
    color: #fff;
    border-radius: 10px;
    padding: 0 6px;
    font-size: 11px;
    font-weight: bold;
    min-width: 18px;
    line-height: 18px;
    text-align: center;
    z-index: 10;
    pointer-events: none;
}

.badge-on-icon {
    position: absolute;
    top: -6px;
    right: -8px;
    background: #dc3545;
    color: #fff;
    border-radius: 10px;
    padding: 0 6px;
    font-size: 11px;
    font-weight: bold;
    min-width: 18px;
    line-height: 18px;
    text-align: center;
    z-index: 10;
    pointer-events: none;
}

.dx-treeview-node-container:first-child > .dx-treeview-node:first-child  {
    margin-top: 15px;
}

.dx-widget {
    display: block;
    -webkit-tap-highlight-color: transparent;
    -webkit-text-size-adjust: none;
    -webkit-touch-callout: none;
    padding: 0;
    outline: 0;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    color: #228B7E !important; /*#5BCFC5 !important;*/
    font-weight: 400;
    font-size: 14px;
    font-family: Poppins, "Segoe UI",-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,Cantarell,Ubuntu,roboto,noto,arial,sans-serif !important;
    line-height: 1.428571
}

.deznav {
    padding-left: 5px;
    padding-right: 5px;
}

.eres-derived {
    color: #228B7E; /* #5BCFC5;*/
}

.header-link{
    color: white !important;
}

.auth-form .btn {
    font-weight: normal !important;
   /* padding: 0 !important;*/
}


.w-40 {
    width: 40% !important;
}

.w-45 {
    width: 45% !important;
}
.w-49 {
    width: 49% !important;
}

.w-55 {
    width: 55% !important;
}

.w-60 {
    width: 60% !important;
}

@media only screen and (max-width: 575px) {
    .auth-form {
        padding: 25px 25px;
    }
}

.authentication-content {
    margin-top: 1rem !important;
}

.sottomenu {
    background-color: white !important;
}

    .sottomenu:hover, .sottomenu.active {
        background-color: #5BCFC5 !important;
        color: white !important;
    }

.header-right .header-profile .dropdown-menu {
   
    width: 15rem;
    min-width: 15rem;
}

.content-body .container-fluid {
  /*  height: 30vh !important;*/
    padding-top: 0px !important;
}


@media screen and (max-width: 767px) {
    .content-body .container-fluid {
        /*height: 50vh !important;*/
        padding-top: 0px !important;
    }
}

    @media screen and (max-width: 1200px) {
        .testo-contenuto p {
            font-size: 16px !important;
        }

        .testo-contenuto h2 {
            font-size: 28px !important;
        }
    }




.new-arrival-content h4 a, .new-arrival-content .h4 a {
    color: var( --primary-color) !important;
}

.dx-info {
    color: var( --primary-color) !important;
    opacity: unset !important;
}

.dx-pager .dx-page-sizes .dx-selection, .dx-pager .dx-pages .dx-selection, .dx-pagination .dx-page-sizes .dx-selection, .dx-pagination .dx-pages .dx-selection, .dx-page .dx-selection {
    font-weight: 500;
    background-color: var( --primary-color) !important;
    color: #fff !important;
}

.dx-scheduler-appointment:not(.dx-scheduler-appointment-has-resource-color) .dx-scheduler-appointment-strip {
    display: block;
    position: absolute;
    width: 6px;
    height: 100%;
    background-color: #228B7E
}

.dx-scheduler-appointment {
    border-bottom: 1px solid transparent;
    background-clip: padding-box;
    position: absolute;
    cursor: default;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    background-color: #B0E3D6;
    color: #000;
    box-shadow: inset 0 2px 0 0 rgba(0,0,0,.3);
    left: 0;
    min-width: 4px;
    min-height: 4px
}

    .dx-scheduler-appointment .dx-scheduler-appointment:not(.dx-scheduler-appointment-has-resource-color):not(.dx-scheduler-appointment-drag-source)::before, .dx-scheduler-appointment.dx-state-focused:not(.dx-scheduler-appointment-has-resource-color):not(.dx-scheduler-appointment-drag-source)::before {
        background-color: #D0EBA3 !important;
        
    }
.dx-popup-wrapper.dx-scheduler-appointment-tooltip-wrapper .dx-tooltip-appointment-item .dx-tooltip-appointment-item-marker-body, .dx-scheduler-overlay-panel .dx-tooltip-appointment-item .dx-tooltip-appointment-item-marker-body {

    background: #B0E3D6 !important;
}

.btn:hover {
    /*background-color: var(--primary-hover) !important;*/
    border-color: var(--primary-hover) !important;
    color: white !important;
}

.btn-outline-secondary {
    border-color: var(--primary-hover) !important;
    color: var(--primary-hover) !important;
}

    .btn-outline-secondary:hover {
        color: #fff !important;
        background-color: #6c757d !important;
        border-color: #6c757d;
    }

.dx-button-mode-outlined.dx-button-default {
    border: 1px solid var(--primary) !important;
   
}

.dx-datagrid .dx-link {
    color: #228B7E !important;
}

.dx-icon{
    color: white !important;
}

.dx-datagrid-edit-popup .dx-popup-content {
    padding: 20px;
}

.dx-checkbox-checked .dx-checkbox-icon {
    
    border-color: var(--primary);
    background-color: var(--primary);
}

.dx-checkbox-checked.dx-state-active .dx-checkbox-icon, .dx-checkbox-checked.dx-state-focused .dx-checkbox-icon {
    border-color: var(--primary);
    background-color: var(--primary);
}
.dx-checkbox.dx-state-focused .dx-checkbox-icon {
    border-color: var(--primary);
}

.dx-checkbox-indeterminate .dx-checkbox-icon::before {
    background-color: var(--primary)
}

.dx-checkbox-indeterminate .dx-checkbox-icon {
    border-color: var(--primary)
}

.dx-datagrid-header-panel .dx-toolbar-text-auto-hide .dx-button.dx-button-has-icon {
   /*color: var(--primary) !important;
   background-color: transparent !important;
   border-color: var(--primary) !important;*/
}

.dx-texteditor.dx-state-active::before, .dx-texteditor.dx-state-focused::before {
    border-bottom: 2px solid var(--primary);
}

.dx-button-mode-outlined.dx-button-danger {
    border: 1px solid #228B7E !important;
    background-color: transparent;
    color: #228B7E !important;
}

.dx-texteditor-label {
   
    font-size: 14px !important;
   
}

.dx-widget input, .dx-widget textarea {
    font-size: 14px;
    font-family: Poppins, Roboto,RobotoFallback,Helvetica,Arial,sans-serif !important;
}

.dx-calendar-cell.dx-calendar-selected-date span {
    color: #fff;
    background-color: var(--primary) !important;
}

.dx-calendar-cell.dx-calendar-today span {
    border-color: #228B7E !important;
}

.dx-scheduler-header-panel-cell.dx-scheduler-header-panel-current-time-cell .dx-scheduler-header-panel-cell-date:last-child {
    color: #fff;
    background-color: var(--primary) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    margin-top: 0
}

/*.dx-switch-on-value.dx-state-active .dx-switch-container::before, .dx-switch-on-value.dx-state-focused .dx-switch-container::before {
    border-color: var(--primary-color) !important;
    background-color: var(--primary-color) !important;
}

.dx-switch-off-value.dx-state-active .dx-switch-container::before, .dx-switch-off-value.dx-state-focused .dx-switch-container::before {
    border-color: var(--accent-color) !important;
    background-color: var(--accent-color) !important;
}

.dx-switch.dx-state-active .dx-switch-container::before, .dx-switch.dx-state-focused .dx-switch-container::before {
    border-color: var(--accent-color) !important;
    background-color: var(--accent-color) !important;
}
*/


/*#swLista[aria-checked="true"] .dx-switch-container::before {
    border-color: var(--primary-color) !important;
    background-color: var(--primary-color) !important;
}
#swLista[aria-checked="false"] .dx-switch-container::before {
    border-color: var(--accent-color) !important;
    background-color: var(--accent-color) !important;
}

#swLista.dx-state-focused .dx-switch-container::before {
    opacity: 0.9 !important;
}

#swLista[aria-checked="false"].dx-state-focused .dx-switch-inner::before {
    border-color: var(--accent-color) !important;
    background-color: var(--accent-color) !important;
}

.dx-switch .dx-switch-handle::before, .dx-switch-handle, .dx-switch-handle::before {
    background-color: var(--primary-color) !important;
}

.dx-switch:not(.dx-switch-on-value):not(.dx-state-readonly).dx-state-active .dx-switch-handle::before, .dx-switch:not(.dx-switch-on-value):not(.dx-state-readonly).dx-state-focused .dx-switch-handle::before {
    background-color: var(--primary) !important;
}

.dx-switch-on-value .dx-switch-container::before {
    border-color: var(--primary-color) !important;
    background-color: var(--primary-color) !important;
}

.dx-switch-off-value .dx-switch-container::before {
    border-color: var(--accent-color) !important;
    background-color: var(--accent-color) !important;
}*/
/* Pillola OFF */
/*#swLista[aria-checked="false"] .dx-switch-container::before {
    background-color: var(--accent-color) !important;
    border-color: var(--accent-color) !important;
}*/

/* Pillola ON */
/*#swLista[aria-checked="true"] .dx-switch-container::before {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}*/

/* Focused: leggero effetto */
/*#swLista.dx-state-focused .dx-switch-container::before {
    opacity: 0.9 !important;
}*/
#swLista .dx-switch-container {
    transition: background-color 0s !important;
}

/* Stili per la TRACCIA/SFONDO quando è OFF */
#swLista[aria-checked="false"] .dx-switch-container::before {
    background-color: var(--accent-color) !important;
    border-color: var(--accent-color) !important;
    background-image: none !important;
    opacity: 1 !important;
    /* Opzionale: Prova ad annullare la transizione di colore durante il cambio di stato */
    transition: background-color 0s !important;
}

/* Stili per la TRACCIA/SFONDO quando è ON */
#swLista[aria-checked="true"] .dx-switch-container::before {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    background-image: none !important;
    opacity: 1 !important;
    /* Opzionale: Prova ad annullare la transizione di colore durante il cambio di stato */
    transition: background-color 0s !important;
}

/* Stile per lo stato Focused (mantienilo separato) */
#swLista.dx-state-focused .dx-switch-container::before {
    opacity: 0.9 !important;
}

#swLista[aria-checked="true"] dx-switch-handle::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    transform: translateX(2px);
}

#swLista[aria-checked="false"] dx-switch-handle::after {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    transform: translateX(2px); /* sposta leggermente l’handle */
}

.dx-calendar-cell.dx-calendar-today span {
    border: 2px solid #228B7E !important;
}
.dx-icon-search {
    color: #228B7E !important;
}

[data-nav-headerbg="color_11"][data-theme-version="dark"][data-sidebar-style="overlay"] .nav-header .hamburger.is-active .line, [data-nav-headerbg="color_11"][data-sidebar-style="overlay"] .nav-header .hamburger.is-active .line {
    background-color: white !important
}

.dx-calendar {
 
    display: flex !important;
 }


.header-right .notification_dropdown .nav-link {
    /*    position: relative;
    color: #3e4954;
    background: transparent;
    border: 1px solid rgba(62, 73, 84, 0.1);
    border-radius: 2rem;
    height: 45px;*/
    /*width: 45px;*/
    height: unset !important;
    width: unset !important;
    line-height: 1.5rem;
    /*    text-align: center;
    line-height: 1;*/
}

.spanHeader, .spanHeaderLogged {
    font-size: 0.9rem !important;
}

@media only screen and (max-width: 575px) {
    .spanHeader {
     /*  display: none !important;*/
    }
}

@media only screen and (max-width: 1199px) {
    .spanHeaderLogged {
        display: none !important;
    }
}

.privacy-container {
    /* Abilita Flex per l'allineamento verticale e la riga singola */
    display: flex;
    align-items: center;
    flex-wrap: nowrap; /* Mantiene checkbox e testo sulla stessa riga */
    /* Gestisce l'allineamento orizzontale se non c'è justify-content */
    text-align: left; /* o center, se desideri centratura orizzontale */
}

    .privacy-container .dx-checkbox {
        /* Assicura che l'elemento checkbox mantenga il suo spazio e sia trattato come un blocco */
        flex-shrink: 0;
    }

/*h1 {
    color: #5BCFC5 !important;
}

.text-info{
    color: unset !important;
}
    h2 {
    color: #228B7E !important;
}

h3 {
    color: unset !important
}

h4 {
    color: #228B7E !important;
}
h5 {
    color: #228B7E !important;
    font-weight: bold;
}
    .dx-button-text {
    font-family: Poppins, Roboto, RobotoFallback, Helvetica, Arial, sans-serif !important;
    color: white !important;
  
}

.dx-button-text:hover, .dx-button-text:focus, .dx-button-text:active,
.dx-button-content:hover, .dx-button-content:focus, .dx-button-content:active {
    color: #5BCFC5 !important;
}

*/