/* CSS Document */
/*Aqui centramos las clumnas desde donde muestra la asistencia*/
#tablaAsisAlumnos td:nth-child(n+4) {
    text-align: center !important;
}

/*Es para ajustar el alto de las filas de las tablas*/
#tablaAsisAlumnos td,
#tablaAsisAlumnos_Reg td,
#tablaAsisAlumnos_Reg_Tomar td,
#tablaOperacionesAlum_AlumnosReg td{
    padding: 5px; /* Ajusta el espaciado interior de las celdas */
    white-space: nowrap; /* Evita el salto de línea del texto en las celdas */
}

#tablaAsisAlumnos_Reg td:nth-child(1),
#tablaAsisAlumnos_Reg td:nth-child(n+3) {
    text-align: center !important;
}

#tablaAsisAlumnos_Reg_Tomar td:nth-child(1),
#tablaAsisAlumnos_Reg_Tomar td:nth-child(n+3) {
    text-align: center !important;
}

.centrar-titulo {
    text-align: center !important;
}


#tablaAlumnos td:nth-child(n+4) {
    text-align: center !important;
}

#tablaAlumnos td,
#tablaAlumnosCompleta td,
#tablaAlumnos_PPFF_Basica td,
#tablaAlumnos_PPFF_Completa td{
    padding: 5px; /* Ajusta el espaciado interior de las celdas */
    white-space: nowrap; /* Evita el salto de línea del texto en las celdas */
}

/*SE AGREGO PARA LOS ICONOS DE LOS PAISES*/
.select2-container .img-flag {
    width: 20px; /* Ancho fijo */
    height: auto; /* Altura ajustada automáticamente */
    display: inline-block;
    margin-right: 8px; /* Espacio entre el icono y el texto */
    vertical-align: middle; /* Alinear verticalmente */
}

/*AJUSTE PARA TABLAS DE DEUDAS Y DESCUENTOS*/

#tablaCobrosDeuda_AlumnosReg tbody tr,
#tablaDetalleDescuentos_AlumnosReg tbody tr,
#tablaEditarAgregarDescuentos_AlumnosReg tbody tr,
#tablaEditarModificarCobros_AlumnosReg tbody tr{
    height: 10px !important; /* Ajusta este valor según necesites */
}

#tablaCobrosDeuda_AlumnosReg tbody td,
#tablaDetalleDescuentos_AlumnosReg tbody td,
#tablaEditarAgregarDescuentos_AlumnosReg tbody td,
#tablaEditarModificarCobros_AlumnosReg tbody td{
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    vertical-align: middle; /* Asegura que el texto se centre verticalmente */
}


  /* Estilos que solo se aplicarán a la lista dentro de #ListaAlumnos_CreacionQR */
  #ListaAlumnos_CreacionQR .todo-list li {
    background-color: transparent !important;
    border: none !important;
    margin-bottom: 0;
    padding: 2px 0 2px 10px;
  }
  #ListaAlumnos_CreacionQR .todo-list li:hover {
    background-color: transparent !important;
  }



/* Para el modal de insittucion al abrirse */
.modal-invisible {
    opacity: 0 !important;
    pointer-events: none;
    /* Opcional: Si prefieres un efecto difuminado, podrías usar: */
    /* filter: blur(2px); */
}

/* Coloca esto en tu CSS global o dentro de <style> en el <head> */
#ColumnaFiltro {
  transition: all 0.5s ease;
}

/* Solucion para el Swift sea de color navy */
input.switch-activar[data-bootstrap-switch] + .bootstrap-switch
  .bootstrap-switch-handle-on {
  background-image: none !important;
  background-color:  #001f3f !important;  /* NAVY */
  border-color:      #001f3f !important;
}



/* ======== BOTONES RESPONSABLES (DESDE AQUI PRE - MATRICULA)======== */
#btnResponsablePadres_NuevoAlum,
#btnResponsableApoderado_NuevoAlum {
  transition: all 0.2s ease-in-out;
  font-weight: 600;
  color: #fff;
}

/* Estado seleccionado (bloqueado, gris oscuro casi negro) */
.btn-seleccionado {
  background: #222 !important;
  color: #fff !important;
  border: 1px solid #111 !important;
  box-shadow: inset 0 2px 4px rgba(0,0,0,0.4);
}

/* Efecto visual al pasar por encima de los no seleccionados */
#btnResponsablePadres_NuevoAlum:hover:not(:disabled),
#btnResponsableApoderado_NuevoAlum:hover:not(:disabled) {
  filter: brightness(1.15);
}


/* ======== TÍTULO DE SECCIÓN (estilo moderno) ======== */
.titulo-seccion {
  font-size: 1.6rem;
  font-weight: 700;
  color: #001f3f; /* tono navy oscuro */
  position: relative;
  display: inline-block;
  padding-bottom: 6px;
  letter-spacing: 0.5px;
}

.titulo-seccion::after {
  content: "";
  position: absolute;
  width: 60%;
  height: 3px;
  background: linear-gradient(90deg, #001f3f, #007bff);
  left: 20%;
  bottom: 0;
  border-radius: 2px;
}






