diff --git a/index.php b/index.php
new file mode 100644
index 0000000..8d6b07f
--- /dev/null
+++ b/index.php
@@ -0,0 +1,141 @@
+<?php
+// index.php - Página principal del sistema
+session_start();
+require_once 'clases/BaseDatos.php';
+require_once 'clases/Sala.php';
+require_once 'clases/Boleto.php';
+require_once 'clases/Venta.php';
+require_once 'clases/VendedorController.php';
+
+// Conexión a base de datos
+$db = new BaseDatos('localhost:3306', 'root', '481037', 'boletos_db');
+
+// Inicializar el controlador
+$vendedorController = new VendedorController($db);
+
+// Cargar sala (solo hay una sala con id=1)
+$sala = $vendedorController->cargarSala(1);
+
+// Si no hay sala, podríamos inicializarla para desarrollo
+if (!$sala) {
+ $sala = new Sala(1, 'Sala Principal');
+ $sala->inicializarBoletos(10, 15, 50.00); // 10 filas, 15 asientos por fila, $50 cada uno
+}
+
+// Variable para almacenar mensajes de confirmación
+$mensaje = '';
+
+// Procesar formulario de venta
+if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['vender'])) {
+ if (isset($_POST['asientos']) && isset($_POST['nombre_cliente'])) {
+ $idsBoletos = $_POST['asientos'];
+ $nombreCliente = $_POST['nombre_cliente'];
+
+ $boletosSeleccionados = $vendedorController->seleccionarBoletos($idsBoletos);
+
+ if (count($boletosSeleccionados) > 0) {
+ $comprobante = $vendedorController->procesarVenta($boletosSeleccionados, $nombreCliente);
+
+ if ($comprobante) {
+ // Guardar comprobante en sesión para mostrarlo
+ $_SESSION['comprobante'] = $comprobante;
+ // Redireccionar a página de comprobante
+ header('Location: comprobante.php');
+ exit;
+ } else {
+ $mensaje = 'Error al procesar la venta. Intente nuevamente.';
+ }
+ } else {
+ $mensaje = 'No se han seleccionado asientos disponibles.';
+ }
+ } else {
+ $mensaje = 'Por favor, seleccione al menos un asiento y proporcione el nombre del cliente.';
+ }
+}
+
+// Obtener mapa de asientos
+$mapaAsientos = $vendedorController->mostrarDisponibilidadAsientos();
+?>
+
+<!DOCTYPE html>
+<html lang="es">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Sistema de Venta de Boletos</title>
+ <link rel="stylesheet" href="css/index.css">
+ <style>
+
+ </style>
+</head>
+<body>
+ <div class="container">
+ <h1>Sistema de Venta de Boletos para Concierto</h1>
+
+ <?php if (!empty($mensaje)): ?>
+ <div class="mensaje"><?php echo $mensaje; ?></div>
+ <?php endif; ?>
+
+ <form method="post" id="formularioVenta">
+ <div class="sala">
+ <h2>Selección de Asientos - Sala Principal</h2>
+ <div class="escenario">ESCENARIO</div>
+
+ <div class="filas">
+ <?php foreach ($mapaAsientos as $numeroFila => $asientosEnFila): ?>
+ <div class="fila">
+ <div class="numero-fila">F<?php echo $numeroFila; ?></div>
+ <div class="asientos">
+ <?php foreach ($asientosEnFila as $numeroAsiento => $estado): ?>
+ <?php
+ $idBoleto = (($numeroFila - 1) * count($asientosEnFila)) + $numeroAsiento;
+ $clase = ($estado === 'disponible') ? 'asiento disponible' : 'asiento vendido';
+ $disabled = ($estado === 'disponible') ? '' : 'disabled';
+ ?>
+ <div class="<?php echo $clase; ?>"
+ data-id="<?php echo $idBoleto; ?>"
+ <?php echo $disabled; ?>>
+ <?php echo $numeroAsiento; ?>
+ </div>
+ <?php endforeach; ?>
+ </div>
+ </div>
+ <?php endforeach; ?>
+ </div>
+
+ <div class="leyenda">
+ <div class="leyenda-item">
+ <div class="leyenda-color" style="background-color: #28a745;"></div>
+ <span>Disponible</span>
+ </div>
+ <div class="leyenda-item">
+ <div class="leyenda-color" style="background-color: #007bff;"></div>
+ <span>Seleccionado</span>
+ </div>
+ <div class="leyenda-item">
+ <div class="leyenda-color" style="background-color: #dc3545;"></div>
+ <span>Vendido</span>
+ </div>
+ </div>
+ </div>
+
+ <div class="form-group">
+ <label for="nombre_cliente">Nombre del Cliente:</label>
+ <input type="text" id="nombre_cliente" name="nombre_cliente" required>
+ </div>
+
+ <div class="resumen" id="resumen">
+ <h3>Resumen de Selección</h3>
+ <p>Asientos seleccionados: <span id="asientosSeleccionados">Ninguno</span></p>
+ <p>Total: $<span id="totalVenta">0.00</span></p>
+ <button type="submit" name="vender" class="btn">Confirmar Venta</button>
+ </div>
+
+ <!-- Campo oculto para almacenar IDs de asientos seleccionados -->
+ <div id="asientosSeleccionadosInput"></div>
+ </form>
+ </div>
+
+ <script src="js/index.js"></script>
+</body>
+</html>
\ No newline at end of file