/* El menú lateral (`partials/sidebar.html`).
 *
 * Va enlazado sin condición desde `base.html` y no desde `{% block styles_file %}`
 * porque el menú está en todas las pantallas. */

/* El chevron de un grupo que se despliega **apunta a donde va a ir**: a la
 * derecha mientras está cerrado —"esto se abre hacia allá"— y hacia abajo cuando
 * ya se abrió. Una flecha que siempre apunta abajo dice lo mismo en los dos
 * estados, así que no dice nada.
 *
 * El estado sale de `aria-expanded`, que es el que Bootstrap cambia al plegar y
 * desplegar: así no hay una segunda fuente de verdad que pueda quedar
 * desincronizada del panel, y el giro es correcto desde el primer render —el
 * grupo llega abierto cuando ya se está dentro de la sección—.
 *
 * Es mejora progresiva, como todo lo demás: sin esta hoja el chevron se queda
 * apuntando a la derecha y el menú abre y cierra igual. */
.sidebar-chevron {
    transition: transform 0.2s ease-in-out;
}

[aria-expanded="true"] .sidebar-chevron {
    transform: rotate(90deg);
}

/* Quien prefiere no ver movimiento tampoco lo ve aquí: el giro es decorativo y
 * el estado ya lo dicen `aria-expanded` y el panel abierto. */
@media (prefers-reduced-motion: reduce) {
    .sidebar-chevron {
        transition: none;
    }
}
