/*************************************************************************************
 * Hoja de estilos para botones y acciones                                           *
 * --------------------------------------------------------------------------------- *
 * - Define la disposición de contenedores de acciones (.acciones).                  *
 * - Establece estilos base para botones principales (.btn) y alternativos (.btn-2). *
 * - Incluye variantes específicas: crear, actualizar, cancelar y borrar.            *
 * - Contempla un estilo especial para botones de edición (.btn-edit).               *
 * - Aplica efectos hover, estados deshabilitados y soporte para íconos.             *
 * - Añade reglas responsivas para pantallas pequeñas (<460px),                      *
 *   mostrando botones alternativos y ocultando el bloque principal.                 *
 *                                                                                   *
 * Objetivo: mantener consistencia visual y usabilidad en los                        *
 * controles de acción de la interfaz de gestión de partidas.                        *
 *************************************************************************************/

.acciones {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  margin-top: 1.5rem;
}

.btn {
  display: inline-block;
  min-width: 120px;
  padding: 0.6rem 1rem;
  font-size: 1rem;
  font-weight: bold;
  text-align: center;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  transition: all 0.3s linear;
}

.btn-2 {
  display: none;
  min-width: 90px;
  padding: 1.5rem 0.5rem 1.5rem;
  text-align: center;
  border-radius: 5px;
  border: none;
}

/* Botón de crear */
#btn-crear {
  background-color: #38bd57;
  color: white;
}

#btn-crear:hover {
  background-color: #207935;
}

/* Botón de actualizar */
#btn-actualizar, #btn-actualizar-2, .btn-actualizar {
  background-color: #007bff;
  color: white;
}

#btn-actualizar:hover, .btn-actualizar:hover {
  background-color: #004ea1;
}

/* Botón de cancelar */
#btn-cancelar, #btn-cancelar-2 {
  background-color: #6c757d;
  color: white;
}

#btn-cancelar:hover {
  background-color: #474d52;
}

/* Botón de borrar */
#btn-borrar, #btn-borrar-2, .btn-borrar {
  background-color: #dc3545;
  color: white;
}

#btn-borrar:hover, .btn-borrar:hover {
  background-color: #8b1a25;
}

/* Botón de registrar */
#btn-registrar {
  background-color: #38bd57;
  color: white;
}

#btn-registrar:hover {
  background-color: #207935;
}

/* Botón de actualizar */
#btn-login {
  background-color: #38bd57;
  color: white;
}

#btn-login:hover {
  background-color: #207935;
}

/* Botón de registro */
#btn-registro {
  font-family: Arial, Helvetica, sans-serif;
  text-decoration: none;   /* Quita el subrayado */
  line-height: normal;     /* Asegura alineación vertical */
  background-color: #007bff; /* Azul */
  color: white;
}

#btn-registro:hover {
  background-color: #004ea1; /* Azul más oscuro */
}

.btn-edit {
  display: inline-block;
  min-width: 120px;
  padding: 0.6rem 1rem;
  font-size: 0.8rem;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  text-align: center;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  background-color: #5A4FCF;
  color: white;
  text-decoration: none;
  transition: all 0.3s linear;
}

/* Hover para ambos */
.btn-edit:hover {
  background-color: #433b9c;
  transform: scale(1.02);
}

/* Enlace que actúa como botón */
a.btn-edit {
  border: none;
}

/* Botón desactivado */
.btn-edit[disabled],
.btn-edit.disabled {
  background-color: #e4e4e4;
  color: #666;
  cursor: not-allowed;
  transform: none;
}

/* Íconos dentro del botón */
.btn-edit i {
  margin-right: 0.5rem;
}

@media only screen and (max-width: 460px) {
  .btn-2 {
    display: block;
  }

  #div-acciones {
    display: none;
  }
}