#footer {
    position: fixed;
 
    justify-content: space-between !important;
    left: 0;
    bottom: 0;
    width: 100%;
   
    color: white;
    text-align: center;
    padding: 10px;



}
.menuIzquierdoArriba{
position: fixed;
width: 50px;
height: 50px;
left: 11px; top: 31px; font-size: 30px;
border-radius: 50%;
border: 2px solid rgba(255,255,255,0.3);
background: var(--accent-color);
color: white;
display: flex;
justify-content: center;
align-items: center;
font-size: 30px;
cursor: pointer;
transition: 0.3s ease;
z-index: 10;
}

.menuIzquierdaBitacora{
position: fixed;
width: 50px;
height: 50px;
left: 11px; bottom:  168px; font-size: 30px;
border-radius: 50%;
border: 2px solid rgba(255,255,255,0.3);
background: var(--accent-color);
color: white;
display: flex;
justify-content: center;
align-items: center;
font-size: 30px;
cursor: pointer;
transition: 0.3s ease;
z-index: 10;
}
.menuDerechaArriba{
position: fixed;
width: 50px;
height: 50px;
right: 11px; top: 31px; font-size: 30px;
border-radius: 50%;
border: 2px solid rgba(255,255,255,0.3);
background: var(--accent-color);
color: white;
display: flex;
justify-content: center;
align-items: center;
font-size: 30px;
cursor: pointer;
transition: 0.3s ease;
z-index: 10;
}



.menuIzquierda { left: 11px; bottom: 97px; font-size: 30px;  }
.btn-flotante { bottom: 100px; }

.btn-flotante, 
.menuIzquierda {
position: absolute;

}
.menuIzquierda, .btn-flotante, .btnNuevaExamen, .btnNuevaAsistencia, .btnNuevaCotidiano, 
.btnNuevaTarea, .btnNuevaProyecto{
    cursor: pointer;
    z-index: 10;



}
.menuIzquierda{

animation: burbujaPulso 2.5s infinite;
}



.menuIzquierda,
.btn-flotante, .btnNuevaExamen, .btnNuevaAsistencia, .btnNuevaCotidiano, 
.btnNuevaTarea, .btnNuevaProyecto {

    width: 52px;
    height: 52px;
    border-radius: 50%;
    border: 1.5px solid rgba(255,255,255,0.35);

    /* Degradado tipo burbuja */
 background: radial-gradient(
        circle at top left,
        #000000 0%,
        #1a1a1a 50%,
        #333333 100%
    );

    color: white;

    justify-content: center;
  
    font-size: 20px;


}

#menuIzquierdaBitacora, #menuIzquierda{
    position: fixed !important;

}
/* Pulso suave tipo burbuja */
@keyframes burbujaPulso {
    0% {
        transform: scale(1);
        box-shadow:
            inset 2px 2px 6px rgba(220, 255, 220, 0.55),
            inset -4px -4px 8px rgba(0, 140, 0, 0.45),
            0 0 0 0 rgba(60, 200, 60, 0.45),
            0 6px 14px rgba(0, 100, 0, 0.35);
    }

    40% {
        transform: scale(1.06);
        box-shadow:
            inset 2px 2px 10px rgba(240, 255, 240, 0.85),
            inset -4px -4px 12px rgba(0, 170, 0, 0.65),
            0 0 0 22px rgba(80, 220, 80, 0),
            0 12px 26px rgba(0, 130, 0, 0.45);
    }

    70% {
        transform: scale(1.04);
        box-shadow:
            inset 2px 2px 8px rgba(230, 255, 230, 0.75),
            inset -4px -4px 10px rgba(0, 150, 0, 0.55),
            0 0 0 30px rgba(80, 220, 80, 0),
            0 10px 22px rgba(0, 120, 0, 0.4);
    }

    100% {
        transform: scale(1);
        box-shadow:
            inset 2px 2px 6px rgba(220, 255, 220, 0.55),
            inset -4px -4px 8px rgba(0, 140, 0, 0.45),
            0 0 0 0 rgba(60, 200, 60, 0.45),
            0 6px 14px rgba(0, 100, 0, 0.35);
    }
}