Se agrega ruta de login

src/components/auth/ExternalLoginForm.tsx

@@ -0,0 +1,35 @@
+import { useState } from 'react'
+//import { supabase } from '@/lib/supabase'
+import { Input } from '../ui/Input'
+import { SubmitButton } from '../ui/SubmitButton'
+
+export function ExternalLoginForm() {
+  const [email, setEmail] = useState('')
+  const [password, setPassword] = useState('')
+
+  const submit = async () => {
+    /*await supabase.auth.signInWithPassword({
+      email,
+      password,
+    })*/
+  }
+
+  return (
+    <form
+      className="space-y-4"
+      onSubmit={e => {
+        e.preventDefault()
+        submit()
+      }}
+    >
+      <Input label="Correo electrónico" value={email} onChange={setEmail} />
+      <Input
+        label="Contraseña"
+        type="password"
+        value={password}
+        onChange={setPassword}
+      />
+      <SubmitButton />
+    </form>
+  )
+}

src/components/auth/InternalLoginForm.tsx

@@ -0,0 +1,35 @@
+import { useState } from 'react'
+//import { supabase } from '@/lib/supabase'
+import { Input } from '../ui/Input'
+import { SubmitButton } from '../ui/SubmitButton'
+
+export function InternalLoginForm() {
+  const [clave, setClave] = useState('')
+  const [password, setPassword] = useState('')
+
+  const submit = async () => {
+    /*await supabase.auth.signInWithPassword({
+      email: `${clave}@ulsa.mx`,
+      password,
+    })*/
+  }
+
+  return (
+    <form
+      className="space-y-4"
+      onSubmit={e => {
+        e.preventDefault()
+        submit()
+      }}
+    >
+      <Input label="Clave ULSA" value={clave} onChange={setClave} />
+      <Input
+        label="Contraseña"
+        type="password"
+        value={password}
+        onChange={setPassword}
+      />
+      <SubmitButton />
+    </form>
+  )
+}

src/components/auth/LoginCard.tsx

@@ -0,0 +1,27 @@
+import { useState } from 'react'
+import { LoginTabs } from './LoginTabs.tsx'
+import { InternalLoginForm } from './InternalLoginForm.tsx'
+import { ExternalLoginForm } from './ExternalLoginForm.tsx'
+
+export function LoginCard() {
+  const [type, setType] = useState<'internal' | 'external'>('internal')
+
+  return (
+    <div className="w-full max-w-md bg-white rounded-2xl shadow-xl p-8">
+      <h1 className="text-2xl font-semibold text-center mb-1">
+        Iniciar sesión
+      </h1>
+      <p className="text-sm text-gray-500 text-center mb-6">
+        Accede al Sistema de Planes de Estudio
+      </p>
+
+      <LoginTabs value={type} onChange={setType} />
+
+      {type === 'internal' ? (
+        <InternalLoginForm />
+      ) : (
+        <ExternalLoginForm />
+      )}
+    </div>
+  )
+}

src/components/auth/LoginTabs.tsx

@@ -0,0 +1,28 @@
+interface Props {
+  value: 'internal' | 'external'
+  onChange: (v: 'internal' | 'external') => void
+}
+
+export function LoginTabs({ value, onChange }: Props) {
+  return (
+    <div className="flex bg-gray-100 rounded-lg p-1 mb-6">
+      {[
+        { key: 'internal', label: 'Interno' },
+        { key: 'external', label: 'Externo' },
+      ].map(tab => (
+        <button
+          key={tab.key}
+          onClick={() => onChange(tab.key as any)}
+          className={`flex-1 py-2 rounded-md text-sm font-medium transition
+            ${
+              value === tab.key
+                ? 'bg-white shadow text-gray-900'
+                : 'text-gray-500'
+            }`}
+        >
+          {tab.label}
+        </button>
+      ))}
+    </div>
+  )
+}

src/components/ui/Input.tsx

@@ -0,0 +1,28 @@
+interface InputProps {
+  label: string
+  value: string
+  onChange: (value: string) => void
+  type?: string
+}
+
+export function Input({
+  label,
+  value,
+  onChange,
+  type = 'text',
+}: InputProps) {
+  return (
+    <div className="space-y-1">
+      <label className="text-sm font-medium text-gray-700">
+        {label}
+      </label>
+      <input
+        type={type}
+        value={value}
+        onChange={e => onChange(e.target.value)}
+        className="w-full rounded-lg border border-gray-300 px-3 py-2
+                   focus:outline-none focus:ring-2 focus:ring-[#7b0f1d]"
+      />
+    </div>
+  )
+}

src/components/ui/SubmitButton.tsx

@@ -0,0 +1,15 @@
+interface Props {
+  text?: string
+}
+
+export function SubmitButton({ text = 'Iniciar sesión' }: Props) {
+  return (
+    <button
+      type="submit"
+      className="w-full bg-[#7b0f1d] text-white py-2 rounded-lg
+                 font-semibold hover:opacity-90 transition"
+    >
+      {text}
+    </button>
+  )
+}