/* * Hoja de Estilos Personalizada v2.0 para el Login de WordPress */ /* Fondo y Estilos Generales del */ body.login { background-color: #f0f2f5; /* Mantenemos nuestro fondo gris claro */ /* Hemos quitado las reglas de 'display: flex' para usar el método de centrado clásico de WordPress, que es más estable aquí. */ } /* El contenedor principal que centra todo */ #login { width: 380px; /* <-- LO HICIMOS MÁS ANCHO (el original es 320px) */ padding: 5% 0 0; /* Lo separamos un poco de la parte superior */ margin: auto; /* El truco clásico para centrar horizontalmente */ } /* El Logo de WordPress lo reemplazamos por el nuestro */ .login h1 a { background-image: url('https://docentesproactivos.com/wp-content/uploads/2025/10/cropped-cropped-LOGO-DP.png'); /* <-- ¡IMPORTANTE! Reemplaza esto con la URL de tu logo */ width: 200px; height: 80px; background-size: contain; background-position: center; margin: 0 auto 25px; /* Centramos el logo dentro de su caja */ } /* El Formulario Principal */ #loginform { background-color: #ffffff; border-radius: 12px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08); padding: 40px; border: none; } /* Etiquetas (Nombre de usuario, Contraseña) */ .login label { font-weight: 600; color: #333; } /* Campos de texto (input) */ .login input[type="text"], .login input[type="password"] { background-color: #f7f7f7; border: 1px solid #ddd; border-radius: 8px; box-shadow: none; padding: 12px; margin-top: 5px; /* Pequeño espacio extra */ } .login input[type="text"]:focus, .login input[type="password"]:focus { border-color: #ffc107; box-shadow: 0 0 0 2px rgba(255, 193, 7, 0.2); } /* El botón de "Acceder" */ .login .submit input[type="submit"] { background-color: #ffc107; border: none; text-transform: uppercase; font-weight: bold; border-radius: 8px; padding: 12px 24px; transition: background-color 0.2s ease; width: 100%; cursor: pointer; margin-top: 15px; /* Espacio sobre el botón */ } .login .submit input[type="submit"]:hover { background-color: #e0a800; } /* Enlaces de "Olvidaste tu contraseña" y "Volver al sitio" */ .login #nav, .login #backtoblog { text-align: center; padding: 15px 0 0; /* Espacio para que no estén tan pegados al formulario */ } .login #nav a, .login #backtoblog a { color: #555; } .login #nav a:hover, .login #backtoblog a:hover { color: #000; }