/* =====================================================
   NEGOCIO LIBRE
===================================================== */

.nl-menu{

    width:100%;
    max-width:380px;
    background:#fff;
    border:1px solid #e6e6e6;
    border-radius:12px;
    overflow:hidden;

}

.nl-item{

    border-bottom:1px solid #ececec;

}

.nl-item:last-child{

    border-bottom:none;

}

/* CABECERA */

.nl-header{

    display:flex;

    align-items:center;

    gap:14px;

    padding:18px 20px;

    background:#fff;

    cursor:pointer;

    transition:.25s;

}

.nl-header:hover{

    background:#f8fbf9;

}

.nl-arrow{

    width:20px;

    text-align:center;

    font-size:18px;

    color:#999;

    flex-shrink:0;

    transition:.25s;

}

.nl-title{

    flex:1;

    text-decoration:none;

    color:#222;

    font-size:20px;

    font-weight:600;

}

.nl-title:hover{

    color:#00A86B;

}

/* SUBMENU */

.nl-body{

    display:none;

    background:#fafafa;

}

.nl-link{

    display:block;

    padding:14px 20px 14px 54px;

    text-decoration:none;

    color:#555;

    border-top:1px solid #ececec;

    transition:.20s;

}

.nl-link:hover{

    background:#eef8f3;

    color:#00A86B;

}

/* ACTIVO */

.nl-item.active .nl-body{

    display:block;

}

.nl-item.active .nl-arrow{

    transform:rotate(45deg);

    color:#00A86B;

}

/* RESPONSIVE */

@media(max-width:768px){

    .nl-title{

        font-size:18px;

    }

}