const estadoSelect = document.getElementById('estado');
const ciudadSelect = document.getElementById('ciudad');
const estadosYCiudades = {
"Aguascalientes": ["Aguascalientes", "Asientos", "Calvillo", "Cosío", "Jesús María", "Pabellón de Arteaga", "Rincón de Romos", "San Francisco de los Romo", "Tepezalá"],
"Baja California": ["Ensenada", "Mexicali", "Tecate", "Tijuana", "Playas de Rosarito"],
"Baja California Sur": ["La Paz", "Los Cabos", "Comondú", "Loreto", "Mulegé"],
"Campeche": ["Campeche", "Carmen", "Champotón", "Escárcega", "Hecelchakán", "Hopelchén", "Palizada", "Tenabo", "Calkiní", "Calakmul", "Candelaria"],
"Chiapas": ["Tuxtla Gutiérrez", "San Cristóbal de las Casas", "Tapachula", "Comitán", "Palenque"],
"Chihuahua": ["Chihuahua", "Juárez", "Cuauhtémoc", "Delicias", "Hidalgo del Parral"],
"Ciudad de México": ["Álvaro Obregón", "Azcapotzalco", "Benito Juárez", "Coyoacán", "Cuajimalpa de Morelos", "Cuauhtémoc", "Gustavo A. Madero", "Iztacalco", "Iztapalapa", "Magdalena Contreras", "Miguel Hidalgo", "Milpa Alta", "Tláhuac", "Tlalpan", "Venustiano Carranza", "Xochimilco"],
"Coahuila": ["Saltillo", "Torreón", "Monclova", "Piedras Negras", "Acuña"],
"Colima": ["Colima", "Manzanillo", "Tecomán", "Villa de Álvarez", "Comala"],
"Durango": ["Durango", "Gómez Palacio", "Lerdo", "Santiago Papasquiaro", "Nazas"],
"Estado de México": ["Toluca", "Ecatepec", "Naucalpan", "Tlalnepantla", "Chimalhuacán"],
"Guanajuato": ["León", "Irapuato", "Celaya", "Salamanca", "Guanajuato"],
"Guerrero": ["Acapulco", "Chilpancingo", "Iguala", "Taxco", "Zihuatanejo"],
"Hidalgo": ["Pachuca", "Tulancingo", "Tula", "Tepeji", "Ixmiquilpan"],
"Jalisco": ["Guadalajara", "Zapopan", "Tlaquepaque", "Tonalá", "Puerto Vallarta"],
"Michoacán": ["Morelia", "Uruapan", "Zamora", "Lázaro Cárdenas", "Zitácuaro"],
"Morelos": ["Cuernavaca", "Jiutepec", "Cuautla", "Temixco", "Yautepec"],
"Nayarit": ["Tepic", "Bahía de Banderas", "Compostela", "Xalisco", "Ixtlán del Río"],
"Nuevo León": ["Monterrey", "San Nicolás de los Garza", "Guadalupe", "Apodaca", "Santa Catarina"],
"Oaxaca": ["Oaxaca de Juárez", "San Juan Bautista Tuxtepec", "Salina Cruz", "Juchitán", "Santa Cruz Xoxocotlán"],
"Puebla": ["Puebla", "Tehuacán", "Atlixco", "San Martín Texmelucan", "Cholula"],
"Querétaro": ["Querétaro", "San Juan del Río", "El Marqués", "Corregidora", "Tequisquiapan"],
"Quintana Roo": ["Cancún", "Chetumal", "Playa del Carmen", "Tulum", "Cozumel"],
"San Luis Potosí": ["San Luis Potosí", "Soledad de Graciano Sánchez", "Ciudad Valles", "Matehuala", "Rioverde"],
"Sinaloa": ["Culiacán", "Mazatlán", "Los Mochis", "Guasave", "Navolato"],
"Sonora": ["Hermosillo", "Cajeme", "Nogales", "San Luis Río Colorado", "Navojoa"],
"Tabasco": ["Villahermosa", "Cárdenas", "Comalcalco", "Cunduacán", "Huimanguillo"],
"Tamaulipas": ["Reynosa", "Matamoros", "Nuevo Laredo", "Ciudad Victoria", "Tampico"],
"Tlaxcala": ["Tlaxcala", "Apizaco", "Huamantla", "Chiautempan", "Zacatelco"],
"Veracruz": ["Veracruz", "Xalapa", "Coatzacoalcos", "Córdoba", "Orizaba"],
"Yucatán": ["Mérida", "Valladolid", "Tizimín", "Progreso", "Ticul"],
"Zacatecas": ["Zacatecas", "Guadalupe", "Fresnillo", "Jerez", "Sombrerete"]
};
estadoSelect.addEventListener('change', function() {
const estado = this.value;
const ciudades = estadosYCiudades[estado] || [];
ciudadSelect.innerHTML = 'Selecciona una ciudad';
ciudades.forEach(ciudad => {
const option = document.createElement('option');
option.value = ciudad;
option.textContent = ciudad;
ciudadSelect.appendChild(option);
});
});
.form-group {
margin-bottom: 15px;
}
.form-group label {
display: block;
margin-bottom: 5px;
font-weight: 600;
}
.form-group input, .form-group select {
width: 100%;
padding: 10px;
font-size: 14px;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
font-family: 'Raleway', sans-serif;
}
.form-group select {
width: calc(100% - 10px);
}