/* ===========================================================================
 * UEA VDI — identidad institucional sobre el portal de IsardVDI
 *
 * Se INYECTA desde el proxy central (172.16.1.77), no se instala dentro de
 * IsardVDI. Esa decisión es deliberada:
 *
 *   - sobrevive a cualquier actualización del upstream, porque no toca su
 *     checkout ni sus contenedores;
 *   - no ensucia el árbol fijado por versions.lock, que el instalador verifica
 *     y abortaría si encontrara modificado;
 *   - se revierte quitando una línea del virtual host.
 *
 * El logo NO se pone aquí: IsardVDI tiene un mecanismo propio y oficial
 * (/opt/isard/frontend/custom/logo.png servido por /api/v4/logo), que es el
 * que se usa.
 *
 * Paleta tomada del portal Quipux UEA, para que ambos se reconozcan como la
 * misma institución:
 *   #2d4a6f  azul institucional
 *   #1e3a5f  azul oscuro
 *   #ff9800  acento
 * ======================================================================== */

:root {
  --uea-azul: #2d4a6f;
  --uea-azul-oscuro: #1e3a5f;
  --uea-acento: #ff9800;
}

/* ---------------------------------------------------------------------------
 * Panel izquierdo del acceso: fotografía institucional con un velo azul que
 * garantiza contraste sobre cualquier zona clara de la imagen.
 * ------------------------------------------------------------------------ */
.bg-cover-img {
  /* El velo va al 45-60 %: suficiente para que el texto blanco tenga contraste
   * sobre las zonas claras de la fotografía, y bajo como para que la
   * fotografía siga siendo reconocible. Por encima del 0,8 la imagen
   * desaparece y el panel queda como un rectángulo liso. */
  background-image:
    linear-gradient(
      180deg,
      rgba(30, 58, 95, 0.45) 0%,
      rgba(30, 58, 95, 0.72) 100%
    ),
    url('/branding/fondo-uea.jpg') !important;
  background-size: cover !important;
  background-position: center !important;
}

/* Rótulo institucional sobre el panel de la fotografía. */
.bg-cover-img::after {
  content: 'Universidad Estatal Amazónica';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 5.2rem;
  text-align: center;
  padding: 0 2rem;
  color: #fff;
  font-size: 1.35rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.35;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
}

.bg-cover-img::before {
  content: 'Escritorios virtuales académicos';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 3.4rem;
  text-align: center;
  padding: 0 2rem;
  color: rgba(255, 255, 255, 0.86);
  font-size: 0.95rem;
  font-weight: 400;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.4);
}

/* ---------------------------------------------------------------------------
 * Logo institucional: el sello de la UEA, sin el texto lateral.
 *
 * Se usa el sello suelto, sin ningún disco ni recuadro de fondo. Un fondo
 * opaco se recortaba como una mancha sobre la barra de la sesión, que es
 * oscura. El contraste se resuelve más abajo con un filtro, no con relleno.
 *
 * En el acceso el panel es blanco y el sello es azul: se ve tal cual, y se le
 * da tamaño porque ahora es cuadrado y no apaisado.
 * ------------------------------------------------------------------------ */
img[alt='IsardVDI logo'] {
  max-height: 132px !important;
  width: auto;
  max-width: 132px;
  object-fit: contain;
}

/* ---------------------------------------------------------------------------
 * El mismo sello, dentro de la aplicación, va sobre barras oscuras. En azul
 * resultaría ilegible: contraste 1,39:1 sobre #2f3437, muy por debajo del
 * mínimo exigible.
 *
 * `brightness(0) invert(1)` lo pasa a blanco puro conservando el canal alfa y
 * los trazos finos del grabado, y sube el contraste a 12,6:1. Se prefiere esto
 * a mantener dos archivos distintos: un solo recurso, sin riesgo de que uno
 * quede desactualizado respecto del otro.
 * ------------------------------------------------------------------------ */
aside img[src*='logo'],
nav img[src*='logo'],
header img[src*='logo'],
[class*='sidebar'] img[src*='logo'],
[class*='Sidebar'] img[src*='logo'],
[class*='navbar'] img[src*='logo'] {
  filter: brightness(0) invert(1);
}

/* ---------------------------------------------------------------------------
 * Acciones principales en azul institucional.
 *
 * Se seleccionan por las utilidades de color del tema original en lugar de por
 * nombres de componente: las clases de componente cambian entre versiones,
 * mientras que estas utilidades son estables dentro de una misma major.
 * ------------------------------------------------------------------------ */
button.bg-primary,
.bg-primary-600,
.bg-primary-500,
button[type='submit']:not(.bg-transparent) {
  background-color: var(--uea-azul) !important;
  border-color: var(--uea-azul) !important;
}

button.bg-primary:hover,
.bg-primary-600:hover,
.bg-primary-500:hover,
button[type='submit']:not(.bg-transparent):hover {
  background-color: var(--uea-azul-oscuro) !important;
  border-color: var(--uea-azul-oscuro) !important;
}

/* Foco visible y en color institucional: no se sacrifica accesibilidad. */
input:focus,
select:focus,
button:focus-visible {
  outline-color: var(--uea-azul) !important;
  border-color: var(--uea-azul) !important;
}

/* ---------------------------------------------------------------------------
 * Color de enlaces y de menús: NO se tocan. Deliberadamente.
 *
 * Una versión anterior de esta hoja teñía los enlaces de azul institucional y
 * forzaba texto claro en las barras. Ambas reglas rompieron la legibilidad,
 * porque la aplicación mezcla superficies claras y oscuras sin una clase que
 * las distinga:
 *
 *   - el azul institucional acabó sobre el menú lateral oscuro del panel de
 *     administración: contraste 1,18:1;
 *   - el texto claro acabó sobre tarjetas de fondo casi blanco del portal:
 *     contraste 1,03:1.
 *
 * El tema original ya resuelve bien ese contraste. La marca institucional se
 * consigue con el fondo del acceso, el logotipo y los botones de acción, que sí
 * son superficies identificables. Pintar texto a ciegas, no.
 * ------------------------------------------------------------------------ */

/* ---------------------------------------------------------------------------
 * Nota de laboratorio. El piloto no es un servicio en producción y conviene
 * que quien entre lo sepa desde la primera pantalla.
 * ------------------------------------------------------------------------ */
#app::after {
  content: 'Laboratorio — Dirección de Gestión de Tecnologías de la Información y Comunicación';
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 0.4rem 1rem;
  text-align: center;
  font-size: 0.72rem;
  color: #fff;
  background: var(--uea-azul-oscuro);
  z-index: 50;
  pointer-events: none;
}

/* En pantallas estrechas el panel de la fotografía se oculta por diseño del
 * tema original; el rótulo institucional iría sobre el formulario. */
@media (max-width: 767px) {
  .bg-cover-img::after,
  .bg-cover-img::before {
    display: none;
  }
}