/* ========================================================================
   Credential Manager | Iconos del sidebar
   Archivo: public/cm-sidebar-icons.css
   Fuente unica para: tamanos, trazos y colores SVG.

   Este archivo se carga DESPUES de cm-approved-ui.css.
   Las imagenes PNG no tienen un stroke-width editable desde CSS.
   Para editar sus lineas internas se necesita el arte vectorial original.
   ======================================================================== */

/* 1. Ajustes globales: modifica SOLO estos valores para todo el menu. */
#app.cm-sidebar-ready {
  --cm-si-svg-size: 23px;
  --cm-si-svg-stroke: 2.7; /* Antes: 2.1. Cambio visible: +29 %. */
  --cm-si-png-size: 23px;
  --cm-si-profile-stroke: var(--cm-si-svg-stroke);
  --cm-si-logout-stroke: var(--cm-si-svg-stroke);
  --cm-si-chevron-stroke: 1.9; /* Aprobado: no engrosar la flecha. */
}

/* 2. Iconos SVG. Se puede sobrescribir --cm-si-icon-stroke o
   --cm-si-icon-size en #navHome, #navPeople, #navAlerts,
   #navAudit o #navHelp para modificar un icono individual. */
#app.cm-sidebar-ready > nav > button .nav-icon .cm-icon {
  width: var(--cm-si-icon-size, var(--cm-si-svg-size));
  height: var(--cm-si-icon-size, var(--cm-si-svg-size));
  stroke-width: var(--cm-si-icon-stroke, var(--cm-si-svg-stroke));
}

/* Ejemplo de ajuste individual: quitar el comentario para activarlo.
#app.cm-sidebar-ready > nav #navHome {
  --cm-si-icon-stroke: 3;
}
*/

/* 3. Color aprobado: sin modificar la paleta ni el estado activo. */
#app.cm-sidebar-ready > nav > button .nav-icon {
  color: #35d7e5 !important;
}

#app.cm-sidebar-ready > nav #navAlerts .nav-icon {
  color: #ffd326 !important;
}

#app.cm-sidebar-ready > nav > button.active .cm-icon {
  color: #39e4f2 !important;
}

/* 4. Credenciales y Reportes usan el mismo sistema SVG del menú. */
#app.cm-sidebar-ready > nav :is(#navCredentials, #navReports) > .nav-icon > .cm-icon {
  display: inline-block !important;
}
#app.cm-sidebar-ready > nav :is(#navCredentials, #navReports) > .nav-icon::before {
  content: none !important;
  display: none !important;
  background-image: none !important;
}

/* 5. IT Administrator y salida: configuracion independiente. */
#app.cm-sidebar-ready > nav .cm-sidebar-footer > .cm-icon {
  width: var(--cm-si-svg-size);
  height: var(--cm-si-svg-size);
  color: #35dbe9;
  stroke-width: var(--cm-si-profile-stroke);
}

#app.cm-sidebar-ready > nav .cm-sidebar-logout .cm-icon {
  width: var(--cm-si-svg-size);
  height: var(--cm-si-svg-size);
  color: #35dbe9;
  stroke-width: var(--cm-si-logout-stroke);
}

/* 6. Flecha simple de contraccion: mantener trazos aprobados. */
#app.cm-sidebar-ready .cm-sidebar-toggle .cm-sidebar-edge-icon {
  width: 21px;
  height: 21px;
  color: #35deeb;
  stroke-width: var(--cm-si-chevron-stroke);
}