/*!
 * QUIPU Design System — ICONOS (Bootstrap Icons)
 * Version: 1.0.1  ·  Build: 2026-09-05
 * ================================================================
 * La aplicación pinta sus iconos con Bootstrap Icons (`<em class="bi bi-x">`).
 * Esta hoja cubre sólo lo que la librería no trae y Font Awesome sí daba:
 * el giro continuo, la normalización del contenedor y el puente con las reglas
 * de AdminLTE, que están escritas sobre `.fa` y sobre la fuente de Font Awesome.
 * No define ni un solo glifo propio: los dibuja bootstrap-icons.css, que va antes.
 * ================================================================ */

/* El marcado heredado usa <em> como contenedor del icono. <em> es cursiva por
   defecto; el glifo no se inclina —lo pinta ::before con font-style normal—
   pero cualquier texto que acompañe dentro del mismo <em> sí lo haría. */
em.bi, em[class*="bi-"] { font-style: normal; }

/* Giro continuo. Reemplaza a `fa-spin`, que era de Font Awesome.
   Se anima el ::before (el glifo), no el contenedor: así el hueco que ocupa
   el icono en la línea no se mueve mientras gira. */
@keyframes q-bi-spin { to { transform: rotate(360deg); } }
.bi-spin::before { animation: q-bi-spin 2s linear infinite; }
@media (prefers-reduced-motion: reduce) { .bi-spin::before { animation: none; } }

/* ================================================================
   PUENTE CON ADMINLTE
   ----------------------------------------------------------------
   AdminLTE 2 coloca y dimensiona los iconos de su menú y su cabecera con
   selectores escritos sobre `.fa`. Ninguno de ellos falla al quedarse sin
   elementos: dejan de aplicar en silencio, y lo que se ve es un menú con los
   iconos descolocados sin que la consola diga una palabra.
   `dist/css/AdminLTE.min.css` es librería de terceros y no se toca; aquí se
   repite lo que hacía, apuntando a `.bi`. Sólo se traen las reglas de los
   componentes que esta aplicación usa de verdad: menú lateral, desplegables,
   cabecera de caja y la capa de espera. Quedan fuera a propósito `btn-app`,
   `todo-list`, `timeline`, `nav-tabs-custom`, `carousel`, `user-panel`,
   `breadcrumb` y `notifications-menu`: cero usos en las 136 vistas.
   ================================================================ */
.sidebar-menu > li > a > .bi,
.sidebar-menu .treeview-menu > li > a > .bi { width: 20px; }
.sidebar-menu li > a > .bi-chevron-left {
  width: auto; height: auto; padding: 0; margin-right: 10px; margin-top: 3px;
}
.sidebar-menu li.active > a > .bi-chevron-left { transform: rotate(-90deg); }
.sidebar-menu .treeview-menu > li > a > .bi-chevron-left,
.sidebar-menu .treeview-menu > li > a > .bi-chevron-down { width: auto; }
.dropdown-menu > li > a > .bi { margin-right: 10px; }
.main-header .navbar .nav > li.user > a > .bi { margin-right: 5px; }
.box-header > .bi { margin-right: 5px; }
.box .overlay > .bi,
.overlay-wrapper .overlay > .bi {
  position: absolute; top: 50%; left: 50%;
  margin-left: -15px; margin-top: -15px;
  color: #000; font-size: 30px;
}

/* La hamburguesa de la topbar no es un elemento con clase: AdminLTE la dibuja
   con `font-family: fontAwesome` y el punto de código \f0c9 sobre el ::before de
   `.sidebar-toggle`. Es el único glifo de AdminLTE que sale de la fuente y no de
   una clase, y sólo se ve por debajo de 768px —en escritorio la hamburguesa vive
   dentro del menú lateral (modern.css la oculta)—, así que al retirar Font
   Awesome se habría quedado un cuadro vacío en el móvil, no en la pantalla en la
   que se estuviera mirando. \f479 es bi-list, el mismo dibujo. */
.main-header .sidebar-toggle::before {
  font-family: "bootstrap-icons" !important;
  font-weight: normal !important;
  content: "\f479";
}
