.auth-container {
display: flex;
justify-content: center;
align-items: center;
min-height: 60vh;
padding: 2rem;
}

.auth-form {
background: white;
padding: 2rem;
border-radius: 8px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
width: 100%;
max-width: 400px;
}

.auth-form h2 {
text-align: center;
margin-bottom: 1.5rem;
color: #2c3e50;
}

.form-group {
margin-bottom: 1rem;
}

.form-group label {
display: block;
margin-bottom: 0.5rem;
font-weight: 600;
color: #2c3e50;
}

.form-group input {
width: 100%;
padding: 0.75rem;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 1rem;
}

.form-group input:focus {
outline: none;
border-color: #3498db;
box-shadow: 0 0 0 2px rgba(52, 152, 219, 0.2);
}

.form-group.remember {
display: flex;
align-items: center;
}

.form-group.remember label {
display: flex;
align-items: center;
gap: 0.1rem;
margin-bottom: 0;
font-weight: normal;
}

.btn {
display: inline-block;
padding: 0.75rem 1.5rem;
border: none;
border-radius: 4px;
font-size: 1rem;
cursor: pointer;
text-decoration: none;
text-align: center;
transition: background-color 0.3s;
}

.btn-primary {
background-color: #3498db;
color: white;
width: 100%;

}

.btn-primary:hover {
background-color: #2980b9;
}

.btn-secondary {
background-color: #95a5a6;
color: white;
}

.btn-secondary:hover {
background-color: #7f8c8d;
}

.btn-danger {
background-color: #e74c3c;
color: white;
}

.btn-danger:hover {
background-color: #c0392b;
}

.alert {
padding: 0.75rem;
border-radius: 4px;
margin-bottom: 1rem;
}

.alert-error {
background-color: #f8d7da;
color: #721c24;
border: 1px solid #f5c6cb;
}

.auth-links {
margin-top: 1.5rem;
text-align: center;
}

.auth-links a {
color: #3498db;
text-decoration: none;
}

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

.logout-buttons {
display: flex;
gap: 1rem;
justify-content: center;
}

.email-address {
margin-bottom: 1rem;
padding: 1rem;
border: 1px solid #ddd;
border-radius: 4px;
}

.email-actions {
display: flex;
gap: 0.5rem;
flex-wrap: wrap;
margin: 1rem 0;
}

.verified {
color: #27ae60;
font-weight: bold;
}

.unverified {
color: #e74c3c;
}

.primary {
color: #3498db;
font-weight: bold;
}

small {
color: #7f8c8d;
font-size: 0.875rem;
}

.navbar {
min-height: 70px;
padding: 0.8rem 0;
}

.navbar-brand {
font-size: 1.4rem;
padding: 0.4rem 0;
}

.navbar-nav .nav-link {
padding: 0.9rem 1.3rem !important;
font-size: 1.05rem;
display: flex;
align-items: center;
height: 100%;
}

.navbar-toggler {
padding: 0.4rem 0.6rem;
}

body {
padding-top: 80px;
}

@media (max-width: 991.98px) {
.navbar {
min-height: 65px;
padding: 0.6rem 0;
}

.navbar-nav .nav-link {
    padding: 0.6rem 0.8rem !important;
}

body {
    padding-top: 75px;
}