/* ----------IMMAGINI --------------*/

#occhio {
    width: 3%;
}

.tabelle_elenco {
    border: medium solid #00f;
    margin: 5px;
}

.tabelle_elenco td, th {
    border: medium solid #00f;
}



.span_centrali {
    border-left: 2px solid;
}

.bottoni {
    margin: 1em;
}

/*FORM LOG-IN*/

body.login {
    /*font-family: 'Courier New', Courier, monospace;*/
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    padding-top: 140px;
    padding-bottom: 40px;
    font-family: 'Inconsolata', monospace;
    background-color: #A9D2FA;
    color: rgb(29, 15, 15);
}

#form_login{
    height: auto;
}


.righe_login{
    display: flex;
    flex-direction: column;
    justify-items: center;
    align-items: center;

}

.label_log_in{
    display: block;
}

.caselle_login {
    width: auto;
}

.occhietto{

    justify-items: center;
}

.occhietto > *{
    display: inline-flex;
}

/* ----------FORM-------------------*/
.inline{
    display: flex;
}

.obbligatorio{
    background-color: #F5F5F7;
    border-color: #ee0000;
}

.sfondo-casella{
    background-color: #F5F5F7;
    border-color: #FABF0C;
}

.password-toggle {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    cursor: pointer;
    color: #888;
}

/* ------------------MOSTRA-NASCONDI--------------------*/

#nuovo {
    display: none;
}

/* ------PAGINA VERIFICA UTENTE------------- */
.messaggio{
    margin: 3em;
}

/*------HEADER--------------*/

#intestazione{
    display: flex;
    background-color: #F5F5F7;
    justify-content: center;
    margin: 0 -0.5em 0 -0.5em;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: -.01em;
    font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
}

#logo_piccolo{
    width: 65%;
}

#navigazione{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.nav{
    text-decoration: none;
    color: #000000;
}

.nav_box{
    padding: 0 2em 0 2em;
}

#user_div{
    display: flex;
    align-items: center;

}

#user{
    display: inline;
}

#user_esci{
    display: inline;
    color: #000000;
    text-decoration: none;
}




/*-----------------PAGINE------------*/

.corpo_pagine{
    font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    background-color: #A9D2FA;
    color: rgb(29, 15, 15);


}

.pagine{
    display: flex;
    justify-content: center;
}

.pagine > a{
    padding: 1em;
}

.main_section{
    padding: 0 1em;
}

.titolo{
    text-align: center;
}

/*-----------------GRIGLIA HOME-----------------*/

.griglia_riga{
    display: flex;
    justify-content: center;
}

.griglia_cella{
    display: block;
    width: 25%;
    /*height: 50px;*/
    align-items: center;
    justify-content: center;
    background-color: #F5F5F7;
    padding: 3em;
    margin: 1em;
}

.griglia_riga > a{
    text-decoration: none;
    text-align: center;
}


/*----LAYOUT TABELLE ---*/

.table-container {
    margin-top: 20px;
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    background-color: white;
}

.table-container h2 {
    font-size: 20px;
    margin-bottom: 15px;
    color: #666;
}

.table-striped > tbody > tr:nth-child(odd) > td,
.table-striped > tbody > tr:nth-child(odd) > th {
    background-color: #f9f9f9;
}

.table-hover > tbody > tr:hover > td,
.table-hover > tbody > tr:hover > th {
    background-color: #f0f0f0;
}

.table-bordered {
    border-collapse: collapse;
}

.table-bordered th,
.table-bordered td {
    border: 1px solid #ddd;
    padding: 8px;
    vertical-align: middle;
}

.table-bordered thead th {
    background-color: #e0e0e0;
    color: #333;
    font-weight: bold;
    text-align: left;
}

.table-bordered caption {
    color: #555;
    padding: 10px;
    text-align: left;
    font-style: italic;
}

.cella_tabella {
    font-size: 10px;
}


.sottocella {
    color: red;
    font-style: italic;
}

.form-label {
    margin-top: 0.5rem;
}

.pagine {
    margin-top: 15px;
    display: flex;
    justify-content: center;
}

.pagine a {
    padding: 8px 12px;
    border: 1px solid #ddd;
    margin: 0 5px;
    text-decoration: none;
    color: #333;
    background-color: #f4f4f4;
    border-radius: 4px;
}

.pagine a:hover {
    background-color: #ddd;
}

/**--CONTENITORI a espansione --*/
.contenitore-ristretto {
    height: 80px; /* Altezza iniziale limitata*/
    overflow: hidden;  /* Nasconde il contenuto che eccede l'altezza*/
    transition: height 0.3s ease; /* Transizione per un'animazione fluida*/

}
.contenitore-espanso {
    height: auto; /* L'altezza si adatta al contenuto*/
}

.freccia {

    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    border: none;
    background: none;
    font-size: 16px;
}