/* NEXVIA — capa visual de la plataforma (clientes y administración).
   Se carga después del CSS de la app: fuentes propias, destello de fondo, foco de teclado y pie legal.
   No cambia el comportamiento de ninguna pantalla. */

/* Fuentes servidas desde este servidor (licencia SIL OFL 1.1, /branding/fonts/OFL.txt): sin conexión a Google. */
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 600; font-display: swap; src: url('/branding/fonts/montserrat-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 700; font-display: swap; src: url('/branding/fonts/montserrat-latin-700-normal.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 800; font-display: swap; src: url('/branding/fonts/montserrat-latin-800-normal.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 300; font-display: swap; src: url('/branding/fonts/poppins-latin-300-normal.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url('/branding/fonts/poppins-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url('/branding/fonts/poppins-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url('/branding/fonts/poppins-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url('/branding/fonts/poppins-latin-700-normal.woff2') format('woff2'); }

/* Destello de fondo: dos halos suaves de los colores de la marca (verde y azul del logo) que se mueven muy despacio. */
.home-content-area,
.login-right-panel {
    background-color: var(--bg-secondary, #f5f7fa);
    background-image:
        radial-gradient(900px 520px at 88% -8%, rgba(65, 173, 191, 0.13), transparent 62%),
        radial-gradient(760px 480px at 4% 108%, rgba(102, 196, 135, 0.12), transparent 60%),
        radial-gradient(520px 320px at 50% 45%, rgba(45, 155, 155, 0.05), transparent 70%);
    background-repeat: no-repeat;
    background-size: 140% 140%, 140% 140%, 100% 100%;
}
/* Solo en las pantallas de ingreso se mueve (despacio); dentro de la plataforma queda quieto para no gastar en repintar. */
.login-right-panel { background-color: #ffffff; animation: nx-glow 28s ease-in-out infinite alternate; }

@keyframes nx-glow {
    0%   { background-position: 0% 0%, 100% 100%, 50% 50%; }
    100% { background-position: 18% 10%, 82% 88%, 50% 50%; }
}

/* Tarjetas: un poco de transparencia sobre el destello, sin perder legibilidad. */
.home-content-area .bg-white { background-color: rgba(255, 255, 255, 0.94); }

/* Teclado: siempre se ve dónde está el foco (WCAG 2.4.7). El ratón no muestra el contorno. */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
    outline: 3px solid #1F7A7A;
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    .home-content-area, .login-right-panel { animation: none; }
}

/* Fondo de puntos en movimiento (lo dibuja nexvia-skin.js): un canvas fijo sobre cada zona, detrás del
   contenido. La zona crea su propio contexto de apilado para que el canvas quede entre su fondo y su contenido. */
.home-content-area, .login-right-panel, .login-left-panel { isolation: isolate; }
.nx-particles { position: fixed; z-index: -1; pointer-events: none; display: block; }

/* Pie legal: copyright, datos de la empresa y documentos (lo agrega /branding/nexvia-skin.js). */
.nx-legal {
    margin: 40px auto 0;
    padding: 18px 12px 6px;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    max-width: 72rem;
    width: 100%;
    text-align: center;
    font-family: 'Poppins', system-ui, sans-serif;
    font-size: 12px;
    line-height: 1.7;
    color: #5F6B6D;
}
.nx-legal p { margin: 0; }
.nx-legal strong { color: #374151; font-weight: 600; }
.nx-legal nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 14px; margin-top: 4px; }
.nx-legal a { color: #1F7A7A; text-decoration: underline; text-underline-offset: 2px; }
.nx-legal a:hover { color: #175F5F; }
.login-right-panel .nx-legal { margin-top: 28px; max-width: 420px; border-top: none; }