.auth-page {
  min-height: 80vh;
  display: flex;
  align-items: center;
  background: linear-gradient(135deg, var(--tk-gray-100) 0%, var(--tk-gray-200) 100%);
}

.auth-card {
  border: none;
  border-radius: var(--tk-radius-xl);
  box-shadow: var(--tk-shadow-lg);
}

.auth-title {
  font-size: 2rem;
  font-weight: 700;
  color: var(--tk-dark, #2c3e50);
  margin-bottom: 0.5rem;
}

.auth-page .btn-primary {
  background: linear-gradient(135deg, var(--tk-orange, #f39c12) 0%, var(--tk-orange-dark, #d68910) 100%);
  border: none;
  border-radius: var(--tk-radius-md);
  font-weight: 600;
  padding: var(--tk-space-3);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.auth-page .btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(243, 156, 18, 0.4);
}

.auth-page .btn-outline-danger,
.auth-page .btn-outline-primary {
  border-radius: var(--tk-radius-md);
  font-weight: 600;
  padding: var(--tk-space-3);
  transition: all 0.2s ease;
}

.auth-page .btn-outline-danger:hover,
.auth-page .btn-outline-primary:hover {
  transform: translateY(-2px);
}

.auth-page .form-control {
  border-radius: var(--tk-radius-md);
  padding: var(--tk-space-3);
  border: 1px solid var(--tk-gray-300);
  transition: all 0.2s ease;
}

.auth-page .form-control:focus {
  border-color: var(--tk-orange, #f39c12);
  box-shadow: 0 0 0 0.2rem rgba(243, 156, 18, 0.25);
}

.auth-page .form-label {
  font-weight: 600;
  color: var(--tk-dark, #2c3e50);
  margin-bottom: 0.5rem;
}

.auth-page a {
  color: var(--tk-orange, #f39c12);
  font-weight: 600;
}

.auth-page a:hover {
  color: #e67e22;
}