/* ==========================================
   CUSTOMIZAÇÃO DE LOGIN - CXPADORA.COM.BR
   ========================================== */

/* Fundo Geral da Página */
#login {
    background-color: #0f172a !important; /* Fundo Slate 900 */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Ocultar a logo original caso exista, deixando apenas o Nome que você configurou */
#login img {
    display: none !important;
}

/* Título (O nome que você vai configurar nas opções) */
#login h1 {
    color: #ffffff !important;
    font-size: 2rem !important;
    font-weight: 800 !important;
    margin-bottom: 1.5rem !important;
}

/* Card do Formulário de Login */
#login form {
    background-color: #1e293b !important; /* Fundo do card Slate 800 */
    border: 1px solid #334155 !important;
    border-radius: 0.75rem !important;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important;
    padding: 2.5rem !important;
    width: 100% !important;
    max-width: 26rem !important;
    margin: 0 !important;
}

/* Campos de Entrada (Usuário e Senha) */
#login input[type="text"], 
#login input[type="password"] {
    background-color: #0f172a !important;
    border: 1px solid #475569 !important;
    color: #ffffff !important;
    border-radius: 0.5rem !important;
    padding: 0.75rem 1rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-bottom: 1.5rem !important;
    transition: all 0.2s ease-in-out !important;
}

#login input[type="text"]:focus, 
#login input[type="password"]:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.5) !important;
    outline: none !important;
}

/* Botão de Conexão */
#login input[type="submit"], 
#login button {
    background-color: #3b82f6 !important; /* Azul Tailwind */
    color: #ffffff !important;
    font-weight: 600 !important;
    border-radius: 0.5rem !important;
    padding: 0.75rem 1rem !important;
    width: 100% !important;
    border: none !important;
    cursor: pointer !important;
    margin-top: 0.5rem !important;
    transition: background-color 0.2s ease-in-out !important;
}

#login input[type="submit"]:hover, 
#login button:hover {
    background-color: #2563eb !important; /* Azul Escuro Hover */
}