.font-inter {
      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    }

    .input-with-icon {
      position: relative;
    }

    .input-icon {
      position: absolute;
      left: 12px;
      top: 50%;
      transform: translateY(-50%);
      color: #9ca3af;
      z-index: 10;
      pointer-events: none;
    }

    @media (min-width: 640px) {
      .input-icon {
        left: 16px;
      }
      
      .input-field {
        padding-left: 48px !important;
      }
    }

    .input-field {
      padding-left: 40px !important;
    }

    .input-field:focus + .input-icon,
    .input-field:focus-within + .input-icon {
      color: #e53935;
    }

    /* Entrance animations */
    @keyframes fadeInUp {
      from {
        opacity: 0;
        transform: translateY(30px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    @keyframes fadeIn {
      from {
        opacity: 0;
      }
      to {
        opacity: 1;
      }
    }

    .login-container {
      animation: fadeInUp 0.8s ease-out;
    }

    .login-form {
      animation: fadeIn 1s ease-out 0.3s both;
    }

    .login-logo {
      animation: fadeIn 0.6s ease-out 0.1s both;
    }

    .login-header {
      animation: fadeInUp 0.7s ease-out 0.2s both;
    }