:root {
    --ww-primary: #11376B; /* Azul corporativo principal (17, 55, 107) */
    --ww-primary-dark: #0d2c57; /* Tono más oscuro para hover/active */
    --ww-primary-rgb: 17, 55, 107;

    /* Sobrescribimos el color de los links para que coincida con la paleta */
    --bs-link-color-rgb: var(--ww-primary-rgb);
    --bs-link-hover-color-rgb: 13, 44, 87; /* Corresponde a --ww-primary-dark */
}

body {
    overflow-x: hidden;
}

/* Reducimos el tamaño de los H1 para que no sean tan prominentes */
h1 {
    font-size: 1.75rem; /* El valor por defecto de Bootstrap es 2.5rem */
}
 
/* --- Colores Corporativos Aplicados --- */

/* Botón Primario */
.btn-primary {
    --bs-btn-bg: var(--ww-primary);
    --bs-btn-border-color: var(--ww-primary);
    --bs-btn-hover-bg: var(--ww-primary-dark);
    --bs-btn-hover-border-color: var(--ww-primary-dark);
    --bs-btn-active-bg: var(--ww-primary-dark);
    --bs-btn-active-border-color: var(--ww-primary-dark);
}

/* Elementos activos en el menú lateral */
.list-group-item.active {
    background-color: var(--ww-primary);
    border-color: var(--ww-primary);
}

#wrapper {
    display: flex;
}

#sidebar-wrapper {
    min-height: 100vh;
    margin-left: -15rem;
    transition: margin .25s ease-out;
}

#sidebar-wrapper .sidebar-heading {
    padding: 0.875rem 1.25rem;
}

/* Estilos para los títulos de los submenús */
.sidebar-heading {
    color: #495057;
}

/* Hacemos la fuente de todos los elementos del menú un poco más pequeña y consistente */
.list-group-item {
    font-size: 0.85rem;
}

/* Alineación de los iconos del menú */
.sidebar-heading > .bi,
.list-group-item > .bi {
    vertical-align: middle;
    line-height: 1;
}

.sidebar-submenu {
    /* Aumentamos el sangrado y mantenemos el borde para la jerarquía */
    border-left: 3px solid #e9ecef;
    margin-left: 1.5rem;
    padding-left: 0;
}

/* Reducimos el tamaño de la fuente para los elementos del submenú */
.sidebar-submenu .list-group-item {
    font-size: 0.9rem;
}

/* Estilos para la flecha indicadora del submenú */
.sidebar-heading::after {
    content: '›';
    float: right;
    transition: transform 0.2s ease-in-out;
    font-size: 1.5rem;
    line-height: 1;
}

/* Rotación de la flecha cuando el submenú está expandido */
.sidebar-heading[aria-expanded="true"]::after {
    transform: rotate(90deg);
}

#page-content-wrapper {
    min-width: 0;
    width: 100%;
}

body.sb-sidenav-toggled #sidebar-wrapper {
    margin-left: 0;
}

@media (min-width: 768px) {
    #sidebar-wrapper {
        margin-left: 0;
    }

    #page-content-wrapper {
        transition: margin .25s ease-out;
    }

    body.sb-sidenav-toggled #sidebar-wrapper {
        margin-left: -15rem;
    }
}

/* --- Estilos para el Timeline de Actividad --- */
.timeline {
    position: relative;
    padding-left: 2.5rem;
    border-left: 2px solid #e9ecef;
}

.timeline-item {
    position: relative;
    margin-bottom: 1.5rem;
}

.timeline-icon {
    position: absolute;
    left: -2.5rem;
    top: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f8f9fa;
    border-radius: 50%;
    border: 2px solid #e9ecef;
}

.timeline-icon .bi {
    font-size: 1.2rem;
}