﻿/*-----------------------------
        Sydebar Style (Aggiornato)
-------------------------------*/

/* Il contenitore che "blocca" la sidebar in quella posizione */
.sContenent {
    position: absolute;
    top: 315px; /* Mantiene la tua distanza dall'alto */
    bottom: 0;
    left: 20px;
    z-index: 1000;
    display: block;
    width: 260px; /* Larghezza fissa del contenitore */
    height: auto;
    padding-bottom: 20px;
}

/* Sidebar Effettiva */
#sidebar {
    width: 100%;
    background: #ffffff;
    border-radius: 12px; /* Angoli più moderni */
    color: #333;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1); /* Ombra morbida */
    overflow: hidden;
    transition: all 0.3s ease;
    border: 1px solid #eee;
}

    /* Liste */
    #sidebar ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

        #sidebar ul li a {
            padding: 15px 20px;
            font-size: 1rem;
            display: flex;
            align-items: center;
            color: #524d9a;
            text-decoration: none;
            transition: all 0.2s;
            border-bottom: 1px solid #f8f9fa;
        }

            /* Hover: l'effetto fucsia che avevi, ma più pulito */
            #sidebar ul li a:hover {
                background-color: #c82185;
                color: #ffffff !important;
                padding-left: 25px; /* Leggero scivolamento */
            }

        /* Stato Attivo (Verde) */
        #sidebar ul li.active > a,
        a[aria-expanded="true"] {
            color: #54C571 !important;
            font-weight: 600;
            background: #f0fdf4;
        }

        /* Sotto-menu (Dropdown) */
        #sidebar ul ul a {
            font-size: 0.85rem !important;
            padding-left: 40px !important;
            background: #fdfdfd;
            color: #666 !important;
        }

        /* Testo Titillium */
        #sidebar ul li a .nav-text {
            font-family: 'Titillium Web', sans-serif;
            display: inline-block;
            margin-left: 20px;
            cursor: default;
        }

/*----------------------------
         Logo & Icone
-----------------------------*/
.circolare {
    width: 80px;
    height: 80px;
    margin: 20px auto;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 50%;
    display: block;
}

/* Icona piccola di controllo */
.list {
    width: 42px;
    height: 35px;
    background: #ffffff;
    border-radius: 2px;
    text-align: center;
    border: 1px solid #ddd;
    line-height: 35px;
    display: inline-block;
    transition: 0.3s;
}

/*----------------------------
       Responsiveness
------------------------------*/
@media only screen and (max-width: 991px) {
    .sContenent {
        top: 340px; /* Si abbassa su mobile come nel tuo originale */
        left: 5px;
        width: 60px; /* Diventa mini su mobile */
    }

    #sidebar {
        min-width: 60px;
    }

        #sidebar .nav-text {
            display: none; /* Nasconde il testo per salvare spazio */
        }
}
