:root {
    --glpi-logo-light: url("/plugins/alephbranding/recurso.php?marca=aleph-menu-blanco.png");
    --glpi-logo-light-reduced: url("/plugins/alephbranding/recurso.php?marca=aleph-iso-blanco.png");
    --glpi-logo-dark: url("/plugins/alephbranding/recurso.php?marca=aleph-menu-navy.png");
    --glpi-logo-dark-reduced: url("/plugins/alephbranding/recurso.php?marca=aleph-iso-navy.png");
    --glpi-logo-dark-login: url("/plugins/alephbranding/recurso.php?marca=aleph-login-navy.png");
    --glpi-logo-light-login: url("/plugins/alephbranding/recurso.php?marca=aleph-login-blanco.png");
}

:root {
    --aleph-navy: #082338;
    --aleph-navy-2: #0c2e48;
    --aleph-navy-3: #123f64;
    --aleph-salvia: #abc9b5;
    --aleph-crema: #f2f2f0;
    --aleph-teal: #7daaa8;
    --tblr-primary: var(--aleph-navy-3);
    --tblr-primary-rgb: 18, 63, 100;
    --glpi-mainmenu-bg: var(--aleph-navy);
}

.page-anonymous .glpi-logo {
    --logo: var(--glpi-logo-light-login);

    width: 190px;
    height: 168px;
    object-fit: contain;
}

body.welcome-anonymous {
    background-color: var(--aleph-navy);
    background-image:
        radial-gradient(ellipse 80% 60% at 20% 0%, rgba(125, 170, 168, 0.18), transparent 60%),
        radial-gradient(ellipse 70% 50% at 85% 100%, rgba(171, 201, 181, 0.14), transparent 60%),
        linear-gradient(160deg, var(--aleph-navy) 0%, var(--aleph-navy-2) 100%);
    background-attachment: fixed;
}

body.welcome-anonymous .text-muted,
.page-anonymous .text-muted,
body.welcome-anonymous .copyright,
body.welcome-anonymous .copyright a {
    color: rgba(242, 242, 240, 0.72) !important;
}

body.welcome-anonymous .copyright a:hover {
    color: var(--aleph-salvia) !important;
}

.page-anonymous .main-content-card {
    /* Crema, el fondo claro de la marca (--off-white en la landing, donde cubre
       las secciones claras alternas). Es el token pensado justo para esto: una
       superficie amplia y clara.

       Antes se probo en salvia y se descarto al verlo. El salvia es el acento
       principal, pero en alephbi.com va siempre en piezas pequeñas —pildoras,
       puntos, botones—; estirado a toda la tarjeta apagaba el contraste con el
       fondo navy en lugar de reforzarlo. No era falta de contraste (navy sobre
       salvia da 9:1), era cuestion de escala. El salvia se queda donde le toca:
       en la red de vertices del fondo. */
    background-color: var(--aleph-crema);
    border: 0;
    box-shadow: 0 16px 52px rgba(6, 20, 31, 0.45);
}

/* Los campos, en blanco: sobre el crema se leen como zona de escritura sin
   necesidad de reforzar el borde. */
.page-anonymous .main-content-card .form-control,
.page-anonymous .main-content-card .form-select {
    background-color: #ffffff;
}

/* El lienzo de la red de vertices. Va fijo, detras de todo y sin capturar
   clics: es decoracion, no debe interponerse entre el cursor y el formulario. */
#aleph-constelacion {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    display: block;
}

/* Sin esto el lienzo, que es el primer hijo del body, taparia el formulario. */
body.welcome-anonymous .page-anonymous {
    position: relative;
    z-index: 1;
}

/* El logotipo de Aleph es mas alto que el de GLPI —casi cuadrado frente a
   apaisado— y suma unos 60 px a la columna. En un portatil de 900 px eso bastaba
   para empujar el aviso de copyright fuera de la ventana. Se recupera el hueco
   quitando el margen superior, que con el bloque ya centrado no aporta nada. */
body.welcome-anonymous .page-anonymous > .flex-fill {
    margin-top: 0 !important;
}