/* forgotpassword.css */

:root {
    --primary-color: #5563DE;
    --hover-color: #334E68;
    --card-bg: #fff;
    --text-color: #333;
    --box-shadow: 0 8px 16px rgba(0,0,0,0.25);
  }
  
  body, html {
    height: 100%;
    margin: 0;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background: linear-gradient(135deg, var(--primary-color), #8A2BE2);
    color: var(--text-color);
  }
  
  .container {
    max-width: 70%;
    margin: 20px auto;
  }
  
  .card {
    background: var(--card-bg);
    border: none;
    border-radius: 10px;
    box-shadow: var(--box-shadow);
    padding: 20px;
    transition: transform 0.3s ease;
  }
  
  .card:hover {
    transform: scale(1.02);
  }
  
  .form-label {
    font-weight: bold;
  }
  
  .required-star {
    color: red;
    margin-left: 2px;
  }
  
  /* Responsive adjustments */
  @media (max-width: 768px) {
    .card {
      width: 90%;
      padding: 15px;
    }
  }