/*
 * Archivo: [RAÍZ_DE_ROUNDCUBE]/skins/elastic/custom.css
 *
 * Este archivo personaliza el fondo de la página de login
 * y ajusta el contenedor del formulario para mejorar la legibilidad.
 */

/* 1. Aplicar el fondo de pantalla a la página de login */
body.task-login {
   /* * IMPORTANTE: 
     * Reemplaza 'fondo-login.jpg' con el nombre exacto de tu imagen
     * que subiste al directorio 'images/' en el Paso 1.
     */
   background-image: url('../images/02.jpg');

   /* Propiedades para que la imagen cubra toda la pantalla */
   background-size: cover;
   background-position: center center;
   background-repeat: no-repeat;

   /* Mantiene la imagen fija mientras se hace scroll (si lo hubiera) */
   background-attachment: fixed;

   /* Color de fondo de respaldo (similar al que tienes) 
       si la imagen tarda en cargar o falla */
   background-color: #2a323a;
}

/* * 2. (Opcional pero recomendado) 
 * Ajustar el contenedor del formulario para que resalte.
 * * Esto le da al formulario un fondo oscuro semi-transparente
 * para que los campos de usuario/contraseña se lean bien 
 * sobre CUALQUIER imagen de fondo.
 */
body.task-login #login-form .box-inner {
   /* Fondo negro con 40% de opacidad */
   background-color: rgba(0, 0, 0, 0.4);

   /* Bordes redondeados para un look más moderno */
   border-radius: 8px;

   /* Eliminamos el borde y la sombra de caja por defecto
       que no se ven bien con la transparencia */
   border: none;
   box-shadow: none;

   /* Un poco más de espacio interno (opcional) */
   padding: 25px;
}

/* * 3. (Opcional) Forzar el color del texto del pie de página del formulario.
 * Esto asegura que "Webmail - Golden Alliances SRL" y "Obtener soporte"
 * se vean bien (en blanco) sobre el fondo transparente.
 */
body.task-login #login-form .formfooter {
   color: #ffffff;
}

/* 4. (Opcional) Mejorar el color de los íconos de usuario/contraseña */
body.task-login #login-form .input-group-text {
   /* Un gris más claro para que resalten sobre el fondo oscuro */
   color: #ccc;
}