/* Login Page Styles */

.login-box {
   background: white;
   border: 1px solid #cccccc;
   border-radius: 5px;
   padding: 40px;
   margin-top: 50px;
   max-width: 400px;
   margin-left: auto;
   margin-right: auto;
}

h2 {
   color: #000000;
   font-size: 24px;
   margin-bottom: 30px;
   text-align: center;
   font-weight: 600;
}

.form-group {
   margin-bottom: 20px;
}

label {
   display: block;
   color: #000000;
   font-size: 14px;
   font-weight: 600;
   margin-bottom: 8px;
}

input[type="email"],
input[type="password"] {
   width: 100%;
   padding: 12px 15px;
   font-size: 16px;
   border: 1px solid #cccccc;
   border-radius: 4px;
   transition: border-color 0.3s;
}

input[type="email"]:focus,
input[type="password"]:focus {
   outline: none;
   border-color: #000000;
}

button[type="submit"] {
   width: 100%;
   padding: 14px;
   background: #000000;
   color: white;
   font-size: 16px;
   font-weight: 600;
   border: none;
   border-radius: 4px;
   cursor: pointer;
   transition: background 0.3s;
   margin-top: 10px;
}

button[type="submit"]:hover {
   background: #333333;
}

button[type="submit"]:active {
   background: #000000;
}

button[type="submit"]:disabled {
   background: #808080;
   cursor: not-allowed;
}

.error-message {
   color: #cc0000;
   font-size: 14px;
   margin-top: 10px;
   margin-bottom: 10px;
   padding: 10px;
   border-radius: 4px;
   background: #ffeeee;
   border: 1px solid #ffcccc;
   display: none;
}

.error-message.show {
   display: block;
}

.links {
   margin-top: 20px;
   text-align: center;
}

.links a {
   color: #000000;
   text-decoration: none;
   font-size: 14px;
}

.links a:hover {
   text-decoration: underline;
}