/*
 * Tokens de marca de MaestrumPro.
 *
 * Extraidos de la aplicacion legacy (wwwroot/assets/css/estilos.css) y renombrados
 * semanticamente: alli los nombres de Bootstrap estaban invertidos (--success era
 * azul marino, --warning burdeos, --danger naranja) y --info tenia un hex invalido
 * (#6a2cal). Aqui cada color tiene el nombre de lo que realmente es.
 */

:root {
  /* --- Paleta de marca --- */
  --mp-navy: #00335b;      /* Sidebar, hover del boton primario, titulos de seccion */
  --mp-blue: #0079c8;      /* Enlaces, estado "Nuevo" */
  --mp-magenta: #c6007e;   /* Boton primario, acentos, franjas */
  --mp-wine: #942151;      /* Cabeceras de tabla, paginacion */
  --mp-teal: #008385;      /* Incidencias, franjas superiores */
  --mp-olive: #678004;     /* Franjas y enlaces de apoyo */
  --mp-orange: #fe5000;    /* Estado "Suspendido" */
  --mp-cyan: #36b9cc;      /* Estado "Completado" */

  /* Variantes derivadas para hover y fondos suaves */
  --mp-navy-claro: #004a83;
  --mp-magenta-oscuro: #9e0064;
  --mp-magenta-suave: #fdf0f8;
  --mp-navy-suave: #eef4f9;

  /* --- Neutros --- */
  --mp-beige: #f1efeb;     /* Fondo del login */
  --mp-canvas: #f8f9fc;    /* Fondo del area de contenido */
  --mp-card: #efeeee;      /* Tarjeta de curso */
  --mp-blanco: #ffffff;
  --mp-texto: #858796;     /* Texto base */
  --mp-texto-fuerte: #2e2f37;
  --mp-gris: #6c6e71;      /* Texto secundario */
  --mp-borde: #e3e6f0;     /* Separadores punteados de fila */
  --mp-borde-suave: #eef0f5;

  /* --- Semanticos --- */
  --mp-exito: #1cc88a;
  /* Paleta de grafico. Son los CUATRO tramos de la barra de cumplimiento, y se
     eligen juntos: lo que importa no es que cada uno guste, sino que ninguna
     pareja se confunda. Validados con `python tools/validar-paleta.py
     "#1cc88a" "#0079c8" "#fe5000" "#c6007e"` -> el peor par se separa 18.0 con
     daltonismo sobre un suelo de 15, y la banda de luminosidad es 28.3 sobre 32.

     El oliva que estaba aqui antes NO valia: es amarillo-verdoso, y contra el
     naranja de "sin cumplir" daba 3.0 con protanopia. Los dos extremos de la
     barra eran el mismo color para quien no distingue el rojo del verde. Es
     tambien lo que impedia usar un ambar para "vence pronto": cualquier amarillo
     se le funde.

     Antes de tocar uno solo de estos cuatro, pasar los cuatro por el validador.
     El color ademas nunca va solo: cada tramo lleva su leyenda y su cifra. */
  --mp-grafico-bien:  #1cc88a;   /* Superadas */
  --mp-grafico-curso: #0079c8;   /* En curso, con plazo de sobra */
  --mp-grafico-aviso: #fe5000;   /* En curso, pero vence en una semana o menos */
  --mp-grafico-mal:   #c6007e;   /* Caducadas y no superadas */
  --mp-aviso: #f6c23e;
  --mp-error: #e74a3b;
  --mp-info: var(--mp-blue);

  /* --- Tipografia --- */
  --mp-fuente: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, sans-serif;

  /* --- Geometria --- */
  /* Rasgo caracteristico del legacy: esquinas rectas en botones, tarjetas y modales. */
  --mp-radio: 0;
  --mp-radio-suave: 2px;
  --mp-franja: 14px;       /* Franja superior gruesa que codifica cada seccion por color */

  --mp-sidebar-ancho: 15rem;
  --mp-sidebar-ancho-min: 5.5rem;
  --mp-topbar-alto: 4.375rem;

  --mp-sombra: 0 2px 10px rgba(0, 51, 91, 0.06);
  --mp-sombra-elevada: 0 12px 28px rgba(0, 51, 91, 0.12);

  --mp-transicion: 160ms ease;

  /* --- Marca por empresa ---
     El middleware de tenancy vuelca aqui el color del cliente. Por defecto es el
     magenta de la plataforma. */
  --mp-acento: var(--mp-magenta);
  --mp-acento-hover: var(--mp-navy);
}

/*
 * Se reasignan las variables de Bootstrap 5.3 para no tener que reescribir sus
 * componentes: botones, enlaces, tablas y formularios heredan la marca solos.
 */
:root {
  --bs-primary: #c6007e;
  --bs-primary-rgb: 198, 0, 126;
  --bs-secondary: #00335b;
  --bs-secondary-rgb: 0, 51, 91;
  --bs-info: #0079c8;
  --bs-info-rgb: 0, 121, 200;
  --bs-success: #1cc88a;
  --bs-success-rgb: 28, 200, 138;
  --bs-warning: #f6c23e;
  --bs-warning-rgb: 246, 194, 62;
  --bs-danger: #e74a3b;
  --bs-danger-rgb: 231, 74, 59;

  --bs-body-font-family: var(--mp-fuente);
  --bs-body-color: #858796;
  --bs-body-bg: #f8f9fc;
  --bs-link-color: #0079c8;
  --bs-link-hover-color: #00335b;
  --bs-border-color: #e3e6f0;
  --bs-border-radius: 0;
  --bs-border-radius-sm: 0;
  --bs-border-radius-lg: 0;
  --bs-border-radius-xl: 0;
}
