﻿/* TITULO Y DATOS DEL USUARIO SOBRE EL TREEVIEW */
.textoPequeño {
    font-size: 8px;
    color: gray;
    text-align: left;
    margin-bottom: 5px;
}

.multiChoiceContainer {
    text-align: left;
    margin-bottom: 10px;
}

.multiChoice {
    font-size: 10px;
    display:block;
    margin-bottom:3px;
}
.datosPequeños {
    font-size: 10px; /* Letra más pequeña */
    color: gray;
    display: block; /* Ubica cada dato en una línea */
    margin-bottom: 1px; /* Reduce espacio entre líneas */
    text-align: left;
}

/*SIDEBAR DERECHO PARA INFORMACIÓN DE GESTION */
.sidebarDerecho {
    position: fixed;
    right: 0; /* Asegura que esté pegado al borde derecho */
    top: 80px;
    width: 210px; /* Define un ancho fijo */
    height: 100vh; /* Ocupar toda la altura de la pantalla */
    background-color: #f8f9fa;
    padding: 10px;
    border-left: 2px solid #ccc;
    overflow-y: auto;
    z-index: 900; /* Evita que quede detrás de otros elementos */
}
.sidebarDerecho h5 {
    font-size: 18px; /* Ajuste más compacto */
    color: #0056b3;
    font-weight: normal;
    margin-bottom: 5px;
}


.datosPequeños1 {
    font-size: 12px;
    color: #333;
    margin-bottom: 5px;
    display:block ;
}

.multiChoice {
    font-size: 10px;
    display: block;
    margin-bottom: 3px;
}


/* ======= TREEVIEW ======= */
.treeview-title {
    text-align: left; /* Evita que quede centrado */
    font-size: 18px; /* Ajusta el tamaño */
    font-weight: normal; /* Evita la negrita */
    margin-bottom: 15px; /* Agrega espacio debajo */
    padding-left: 10px; /* Pequeño margen para mejor alineación */
}

#sidebar {
    position: fixed;
    left: 0;
    top: 0px; /* Ajusta según el diseño */
    width: 300px; /* Define el ancho del menú */
    height: 100vh;
    background-color: #f8f9fa;
    padding: 10px;
    box-shadow: 2px 0px 5px rgba(0,0,0,0.1);
}

.logo-aida {
    display: block;
    width: 70%;
    max-width: 200px; /* Ajusta el tamaño del logo */
    margin: 0 auto 10px; /* Centra y da margen inferior */
}

.treeview-container {
    text-align: left; /* Centra los elementos */
}


.treeview-menu {
    font-size: 1rem;
    padding-left: 0 !important; /* Elimina espacio extra */
    background: #f8f9fa;
    border-radius: 8px;
    padding: 10px;
    box-shadow: 2px 2px 10px rgba(0,0,0,0.1);
}

.treeview-menu a {
    color: #333 !important; /* Texto azul */
    font-weight:normal;
    text-decoration: none !important;
}

.treeview-menu a:hover {
    color: #0056b3 !important; /* Azul más oscuro */
}

.treeview-container {
    position: fixed;
    left: 0;
    top: 60px; /* Ajusta la distancia desde la parte superior */
    width: 300px;
    height: auto; /* Ajusta la altura total */
    background-color: #F5F7FA; /* Azul celeste más claro */
    padding: 15px; /* Más espacio vertical */
    margin-bottom: 10px; /* Espaciado adicional entre cada opción */
    border-bottom: 1px solid #E0E0E0; /* Línea separadora más tenue */
    overflow-y: auto;
}

.treeview-menu ul {
    padding-left: 20px; /* Más espacio para subnodos */
}

.treeview-menu li {
    padding: 12px;
    margin-bottom: 8px;
}

.treeview-menu li a {
    display: block; /* Hace que toda el área sea clickeable */
    font-size: 16px;
    color: #333;
    font-weight: normal;
    text-decoration: none;
    }

