body {
    margin: 0;
    padding: 0;
    font-family: Arial, sans-serif;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../img/FONDO.jpg);
    background-size: cover;
    background-position: center;
    font-family: 'bauhaus';
}

@font-face {
    font-family: 'bauhaus';
    src: url('../fonts/Bauhaus.woff2') format('woff2'),  /* Modern browsers */
         url('../fonts/Bauhaus.woff') format('woff'),    /* Legacy modern browsers */
         url('../fonts/Bauhaus_.ttf') format('truetype'); /* Safari, Android, iOS */
    font-weight: normal;
    font-style: normal;
}
 /* Estilos existentes (sin cambios) */
        .container {
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: auto;
        }
        .politica_datos {
        margin-top: 15px;
        font-size: 10px;
        color: #333;
        
        }
        .login-container {
            background-color: rgba(255, 255, 255, 0.578);
            padding: 30px;
            max-width: 400px;
            margin: auto;
            box-shadow: 10px 10px 10px #ebebeb;
            border: 3px solid #990f0c;
            border-radius: 10px;
            text-align: center;
            margin-top: 100px;
        }
        .boton-final {
            background-color: #990f0c;
            border-color: #990f0c;
        }
        .boton-final:hover {
            background-color: #990f0c;
            border-color: #990f0c;
        }
        .login-container h2 {
            margin-bottom: 20px;
            color: #990f0c;
        }
        .form-group label {
            color: #990f0c;
        }

        /* Nuevo estilo para el mensaje de éxito */
        .mensaje-exito {
            position: absolute; /* Posiciona el mensaje absolutamente respecto al body */
            top: 10px; /* Margen superior de 10px desde la parte superior */
            left: 10px; /* Margen izquierdo de 10px desde la izquierda */
            z-index: 1000; /* Asegura que esté sobre otros elementos */
            width: auto; /* Ancho automático según el contenido */
            max-width: 300px; /* Limita el ancho máximo */
        }
        .error {
            position: absolute; /* Posiciona el mensaje absolutamente respecto al body */
            top: 10px; /* Margen superior de 10px desde la parte superior */
            left: 10px; /* Margen izquierdo de 10px desde la izquierda */
            z-index: 1000; /* Asegura que esté sobre otros elementos */
            width: auto; /* Ancho automático según el contenido */
            max-width: 300px; /* Limita el ancho máximo */
        }
       