/* FORME BOTTONI */

/* Bottone arrotondato (login) */
.rounded-pill {
    padding: 15px 28px;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    text-decoration: none; /* Rimuove il sottolineato */
    text-align: center;
}

/* Bottone normale */
.my-btn {
    padding: 10px 20px;
    border: none;
    border-radius: 15px;
    cursor: pointer;
    text-decoration: none; /* Rimuove il sottolineato */
    text-align: center;
}

/* Bottone grande */
.my-big-btn {
    padding: 15px 30px; /* Aumenta lo spazio interno */
    font-size: 18px; /* Aumenta la dimensione del testo */
    border: none;
    border-radius: 15px;
    cursor: pointer;
    text-decoration: none; /* Rimuove il sottolineato */
    text-align: center;
    min-width: 150px; /* Definisce una larghezza minima */
}

.my-rounded-3d-btn {
    width: 100px;  
    height: 100px; 
    border-radius: 50%; 
    border: none; 
    cursor: pointer;
    display: inline-block;
    text-decoration: none;
    font-size: 24px;
    outline: none;
    box-shadow: 0 9px #999;
    transform: translateY(0);
}

.my-3d-btn {    
    display: inline-block;
    padding: 10px 15px;
    font-size: 24px;   
    /* height: 80px; */
    width: auto;
    min-width: 100px;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    outline: none;
    border-radius: 20px;
    box-shadow: 0 9px #999;
    transform: translateY(0);
}






/* COLORI BOTTONI */
.my-blue-btn {
    background-color: #0b4f6c;
    color: white;
}
.my-blue-btn:hover {
    background-color: #0a465f;
}
.my-red-btn {
    background-color: #ef233c;
    color: white;
}
.my-red-btn:hover {
    background-color: #d11f34;
}
.my-darkred-btn {
    background-color: #780000;
    color: white;
}
.my-darkred-btn:hover {
    background-color: #6C0000;
}
.my-green-btn {
    background-color: #0A8754;
    color: white;
}
.my-green-btn:hover {
    background-color: #08794B;
}
.my-grey-btn {
    background-color: #CACFD6;
    color: white;
}
.my-grey-btn:hover {
    background-color: #a3b4bc;
}
/* .my-darkgreen-btn {
    background-color: #2F4B26;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 15px;
    cursor: pointer;
    text-decoration: none; 
    text-align: center;
}
.my-darkgreen-btn:hover {
    background-color: #2A4322;
} */
.my-white-btn {
    background-color: white;
    color: #0b4f6c;
    border: 1px solid #999;
}
.my-white-btn:hover {
    background-color: #dadada;
}

button.ex-button.d-button.selected {
    box-shadow: none;
    transform: translateY(9px);
    border: 3px solid red;
}
button.ex-button.t-button.selected {
    box-shadow: none;
    transform: translateY(9px);
    border: 3px solid green;
}
img.ex-button.d-button.selected {
    border: 3px solid red;
}
img.ex-button.t-button.selected {
    border: 3px solid green;
}



/* COLORI TESTI */
.my-darkred-text {
    color: #d11f34;
}
.my-red-text {
    color: #ef233c;
}
.my-blue-text {
    color: #0b4f6c;
}
/* .my-lightblue-text {
    color: #669BBC;
} */
.my-green-text {
    color: #0A8754;
}
/* .my-darkgreen-text {
    color: #2f4b26;
} */




/* LOGO */
.logo-img {
    width: 100px;
    height: auto; /* Mantiene le proporzioni dell'immagine */
    /* In questo modo la dimensione dell'immagine non si modifica se cambia il numero di elementi del menu */
}


/* Messaggi errore campi form  */
.invalid-input {
    color: #ef233c;
}


/* BREADCRUMB */
.breadcrumb a {
    color: #0b4f6c;
    text-decoration: none;
    font-weight: bold;
}

.breadcrumb a:hover {
    color: #0a465f;
}




/* STILE PAGINAZIONE */
/* Cambia il colore di sfondo e il testo del nav */
#paginationNav {
    background-color: white; /* Bbackground */
}
/* Cambia il colore dei link di navigazione */
#paginationNav .page-link {
    color: #003049; /* Testo */
}
/* Cambia il colore dei link di navigazione al passaggio del mouse */
#paginationNav .page-link:hover {
    color: white; /* Colore del testo al passaggio del mouse */
    background-color: #003049; /* Background al passaggio del mouse */
}
/* Cambia il colore della selezione attiva */
#paginationNav .page-item.active .page-link {
    background-color: #003049; /* Elemento attivo */
    border-color: white;
    color: white; /* Colore del testo per l'elemento attivo */
}




/* STILE CARD LOGIN/LOGOUT */
.card {
    border: 1px solid #85c8ff;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}



/* STILE PAZIENTI ASSOCIATI AGLI ESPERTI (view expert.details)*/
body{margin-top:20px;}
.block-7 {
    border-radius: 4px;
    margin-bottom: 30px;
    padding: 0;
    overflow: hidden;
    background: #fff;
    -webkit-box-shadow: 0px 24px 48px -13px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0px 24px 48px -13px rgba(0, 0, 0, 0.05);
    box-shadow: 0px 24px 48px -13px rgba(0, 0, 0, 0.05);
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
@media (max-width: 991.98px) {
    .block-7 {
        margin-top: 30px;
    }
}
.block-7 .img {
    height: 250px;
}
.block-7 .heading-2 {
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
}
.block-7 .price {
    margin: 0;
    padding: 0;
    display: block;
}
.block-7 .price sup {
    font-size: 24px;
    top: -1em;
    color: #b3b3b3;
}
.block-7 .price .number {
    font-size: 60px;
    font-weight: 600;
    color: #000000;
}
.block-7 .excerpt {
    margin-bottom: 0px;
    color: #bd0000;
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
}
.block-7 .label2 {
    text-transform: uppercase;
}
.block-7 .pricing-text,
.block-7 .pricing-text li {
    padding: 0;
    margin: 0;
}
.block-7 .pricing-text li {
    list-style: none;
    padding-top: 10px;
    padding-bottom: 10px;
    color: #000000;
}
.block-7 .pricing-text li:nth-child(odd) {
    background: rgba(0, 0, 0, 0.05);
}
.block-7 .pricing-text li span.fa {
    color: #207dff;
}
.block-7 .btn-primary {
    color: #fff;
    text-transform: uppercase;
    font-style: 16px;
    font-weight: 600;
    letter-spacing: 1px;
    width: 60%;
    margin: 0 auto;
}
.block-7 .btn-primary:hover,
.block-7 .btn-primary:focus {
    background: #00bd56 !important;
    color: #fff;
}
.block-7:hover,
.block-7:focus {
    -webkit-box-shadow: 0px 24px 48px -13px rgba(0, 0, 0, 0.11);
    -moz-box-shadow: 0px 24px 48px -13px rgba(0, 0, 0, 0.11);
    box-shadow: 0px 24px 48px -13px rgba(0, 0, 0, 0.11);
}




/* STILE PAGINE ESERCIZI */

/* stile full screen */
.full-screen-container {
    background-color: white;
}

/* Stile container non in full screen */
.invisible {
    display: none;
}

/* Stile container degli esercizi */
.exercise-container {
    width: 1400px;
    height: 668px;
    margin: 0 auto; /* Centra il container orizzontalmente */
    /* border: 1px solid #000000; */
}


/* Stile countdown inizio esercizi */
.countdown-circle {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: conic-gradient(from 0deg, #669BBC 0%, #f8f9fa 0%);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 72px;
    color: #0b4f6c;
    margin: 20px auto;
}


/* STILE ES BUTTON SELECTION */

/* stile bottoni */


/* Stile bottoni selezionati 
ERA NELLO SCRIPT JS */




/* .ex-button:active {
    background-color: #3e8e41;
    box-shadow: 0 5px #666;
    transform: translateY(4px);
} */

/* Stile bottoni colorati */
/* .red-button {
    background-color: #FF3B30;
    border: none;
    color: white;
}
.red-button:hover {
    background-color: darkred;
}
.green-button {
    background-color: #34C759;
    border: none;
    color: white;
}
.green-button:hover {
    background-color: darkgreen;
}
.blue-button {
    background-color: #007AFF;
    border: none;
    color: white;
}
.blue-button:hover {
    background-color: darkblue;
}
.yellow-button {
    background-color: #FFCC00;
    border: none;
    color: white;
}
.yellow-button:hover {
    background-color: #eaea00;
}
.orange-button {
    background-color: #FF9500;
    border: none;
    color: white;
}
.orange-button:hover {
    background-color: darkorange;
}
.purple-button {
    background-color: #5856D6;
    border: none;
    color: white;
}
.purple-button:hover {
    background-color: #6F2DA8;
}
.pink-button {
    background-color: #FF2D55;
    border: none;
    color: white;
}
.pink-button:hover {
    background-color: #FBAED2;
}
.brown-button {
    background-color: #A2845E;
    border: none;
    color: white;
}
.brown-button:hover {
    background-color: brown;
}
.grey-button {
    background-color: #8E8E93;
    border: none;
    color: white;
}
.grey-button:hover {
    background-color: #6C6C6C;
}
.black-button {
    background-color: #1C1C1E;
    border: none;
    color: white;
}
.black-button:hover {
    background-color: #333333;
}
 */


 /* IPAD */
 .red-button {
    background-color: #ed3624;
    border: none;
    color: white;
}
.red-button:hover {
    background-color: #B51515;
}
.orange-button {
    background-color: #FA9D00;
    border: none;
    color: white;
}
.orange-button:hover {
    background-color: #FC791E;
}
.yellow-button {
    background-color: #FFE900;
    border: none;
    color: white;
}
.yellow-button:hover {
    background-color: #F9D616;
}
.green-button {
    background-color: #2FDA77;
    border: none;
    color: white;
}
.green-button:hover {
    background-color: #1F9D4D;
}
.blue-button {
    background-color: #006FFF;
    border: none;
    color: white;
}
.blue-button:hover {
    background-color: #1749B3;
}
.purple-button {
    background-color: #ac3bf9;
    border: none;
    color: white;
}
.purple-button:hover {
    background-color: #6F2DA8;
}
.pink-button {
    background-color: #FF92ED;
    border: none;
    color: white;
}
.pink-button:hover {
    background-color: #FF50E2;
}
.brown-button {
    background-color: #9E4C04;
    border: none;
    color: white;
}
.brown-button:hover {
    background-color: #793B06;
}
.grey-button {
    background-color: #C9C9C9;
    border: none;
    color: white;
}
.grey-button:hover {
    background-color: #969696;
}
.black-button {
    background-color: #333333;
    border: none;
    color: white;
}
.black-button:hover {
    background-color: black;
}




/* Stile input boxes di textCompletion */
input.text-compl-input {
    padding: 0.375rem 0.75rem;
    border: 1px solid #ced4da; 
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
input.current-input {
    border-color: #80bdff; 
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); 
}

/* STILE BARRA COMPLETAMENTO ESERCIZI */
.progress {
    margin: 0; /* Rimuove eventuali margini */
    padding: 0; /* Rimuove eventuali padding */
}

.progress-bar {
    margin: 0; /* Assicura che non ci siano margini all'interno della barra di progresso */
    padding: 0;
}

/* Stile barra di scroll per esercizi con testo lungo (TextCompl e V2) */
.overflow-auto::-webkit-scrollbar {
    width: 12px; /* Larghezza della barra di scorrimento */
    background-color: #f5f5f5; /* Colore dello sfondo della barra */
}

.overflow-auto::-webkit-scrollbar-thumb {
    background-color: #888; /* Colore del cursore */
    border-radius: 6px; /* Arrotondamento del cursore */
}

.overflow-auto::-webkit-scrollbar-thumb:hover {
    background-color: #555; /* Colore del cursore al passaggio del mouse */
}