body {
    font-family: 'Roboto Mono', monospace;
    background-color: #1f1f1f; /* Color de fondo oscuro */
    color: #ffffff; /* Texto en blanco para mayor contraste */
}

h1 {
    color: #ff6600; /* Naranja brillante para el título */
}

input[type="text"],
input[type="number"],
button {
    font-family: 'Roboto Mono', monospace;
    font-size: 16px;
    padding: 8px 12px;
    border-radius: 5px;
    border: 2px solid #ff6600; /* Borde naranja */
    background-color: #1f1f1f; /* Color de fondo oscuro */
    color: #ffffff; /* Texto en blanco para mayor contraste */
    cursor: pointer;
}

button:hover {
    background-color: #ff6600; /* Cambio de color al pasar el ratón */
}

button:active {
    transform: translateY(1px); /* Efecto de clic */
}

table {
    border-collapse: collapse;
    width: 100%;
}

th, td {
    padding: 10px;
    text-align: left;
    border-bottom: 1px solid #ffffff; /* Líneas divisorias blancas */
}

th {
    background-color: #ff6600; /* Encabezado naranja */
}
/* Agregar un margen inferior al formulario */
#player-form {
    margin-bottom: 20px;
}

/* Agregar un margen inferior a la tabla */
#players-table {
    margin-bottom: 20px;
}