/* Estilos comunes */
body {
    font-family: Arial, sans-serif;
    text-align: center;
    padding: 20px;
}

/* Estilos para modo claro (default) */
body {
    background-color: #ffffff; /* Fondo claro */
    color: #000000; /* Texto oscuro */
}

textarea, input {
    width: 300px;
    margin-bottom: 10px;
    padding: 10px;
    background-color: #ffffff; /* Fondo de los campos de entrada claro */
    color: #000000; /* Texto oscuro */
}

#resultados {
    margin-top: 20px;
}

/* Estilos para modo oscuro */
body.modo-oscuro {
    background-color: #121212; /* Fondo oscuro */
    color: #ffffff; /* Texto claro */
}

body.modo-oscuro textarea,
body.modo-oscuro input {
    background-color: #1e1e1e; /* Fondo de los campos de entrada oscuro */
    color: #ffffff; /* Texto claro */
}

body.modo-oscuro #resultados {
    background-color: #1e1e1e; /* Fondo para la sección de resultados oscuro */
}