/* Modales en body: backdrop debajo, modal encima (fix iPad) */
body > .modal {
  z-index: 1055 !important;
}

body > .modal.show {
  z-index: 1055 !important;
}

body > .modal.show .modal-dialog,
body > .modal.show .modal-content,
body > .modal.show .modal-header,
body > .modal.show .modal-body,
body > .modal.show .modal-footer,
body > .modal.show .btn,
body > .modal.show .btn-close {
  pointer-events: auto !important;
}

body > .modal-backdrop,
body > #modalBackdrop {
  z-index: 1040 !important;
  pointer-events: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.modal-open > .modal-backdrop.show {
  z-index: 1040 !important;
  pointer-events: none !important;
}

/* iPad / iOS Safari: backdrop-filter en .modal-content borra el texto del modal.
   El desenfoque solo debe aplicarse al .modal-backdrop, nunca al contenido. */

.modal-content,
.modal-content .modal-header,
.modal-content .modal-body,
.modal-content .modal-footer,
.modal-content-flotante,
.modal-content-flotante .modal-header,
.modal-content-flotante .modal-body,
.modal-content-flotante .modal-footer,
.modal-content-flotante .wizard-modal-header,
.modal-content-flotante .wizard-modal-body,
.modal-content-flotante .wizard-modal-footer,
#modalIndicador .modal-content,
#modalIndicador .modal-header,
#modalIndicador .modal-body,
#modalIndicador .modal-footer {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
  -webkit-font-smoothing: antialiased;
}

.modal-content,
.modal-content-flotante,
#modalCrearPeriodos .modal-content,
#modalCrearPeriodos .modal-header,
#modalCrearPeriodos .modal-body,
#modalCrearPeriodos .modal-footer,
#modalCrearPeriodosPerfil .modal-content,
#modalCrearPeriodosPerfil .modal-header,
#modalCrearPeriodosPerfil .modal-body,
#modalCrearPeriodosPerfil .modal-footer,
#modalIndicador .modal-content {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

#modalIndicador .modal-header {
  background: #28a745 !important;
  background-color: #28a745 !important;
  color: #fff !important;
}

#modalIndicador .modal-body,
#modalIndicador .modal-footer {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

.modal-content-flotante .wizard-modal-header,
.modal-flotante .wizard-modal-header {
  background: linear-gradient(135deg, #00695c 0%, #26a69a 100%) !important;
  background-color: #00695c !important;
}

.modal-content-flotante .form-control,
.modal-content-flotante .form-select {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: #fff !important;
  background-color: #fff !important;
}

/* Tablet con sidebar: más columnas en materias del wizard */
@media (max-width: 1199.98px) {
  .materias-comunes-row > .col-md-3 {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }

  .materia-card-fixed .card-title,
  .materia-card-fixed h6.card-title {
    font-size: 0.95rem !important;
    hyphens: none !important;
    -webkit-hyphens: none !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
  }

  .wizard-estudiantes-opciones > .col-md-4 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  .wizard-estudiante-card .card-body .btn,
  .wizard-estudiante-btn {
    max-width: 100%;
    white-space: normal;
    line-height: 1.3;
    min-height: 2.75rem;
  }
}

@media (max-width: 991.98px) {
  .modal-dialog {
    max-width: min(92vw, 640px);
    margin-left: auto;
    margin-right: auto;
  }
}

/* Touch: backdrop suave sin blur pesado (mejor rendimiento en iPad) */
@media (hover: none) and (pointer: coarse) {
  .modal-backdrop,
  .modal-backdrop.show,
  #modalBackdrop {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: rgba(15, 23, 42, 0.45) !important;
    background-color: rgba(15, 23, 42, 0.45) !important;
  }
}