/*
/* * DR-MODALS.CSS */
/* * Diseño UNIVERSAL de Modales y Alertas para Design Reyes. */
/* * Asegura que tanto las alertas Swal como los modales tengan el mismo estilo glassmorphism. */
 */

/* 1. SWEETALERT2 POPUPS */

body .swal2-popup,
body .swal-popup-dr {
  background: linear-gradient(135deg, rgba(45, 10, 89, 0.95), rgba(26, 6, 56, 0.98)) !important;
  border: 1px solid rgba(138, 11, 210, 0.4) !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6), inset 0 0 20px rgba(138, 11, 210, 0.1) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-radius: 20px !important;
  color: #ffffff !important;
}

body .swal2-title,
body .swal-title-dr {
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 700 !important;
}

body .swal2-html-container,
body .swal-text-dr {
  color: #d1d5db !important;
  /* Gris muy claro para alto contraste */
  font-family: 'Poppins', sans-serif !important;
}

/* 2. STANDARD MODALS (.modal-content) */

.modal-content {
  background: linear-gradient(135deg, rgba(45, 10, 89, 0.95), rgba(26, 6, 56, 0.98)) !important;
  border: 1px solid rgba(138, 11, 210, 0.4) !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6), inset 0 0 20px rgba(138, 11, 210, 0.1) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-radius: 20px !important;
  color: #ffffff !important;
}

.modal-header {
  border-bottom: 1px solid rgba(138, 11, 210, 0.2) !important;
}

.modal-title,
.modal-header h1,
.modal-header h2,
.modal-header h3,
.modal-header h4,
.modal-header h5 {
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 700 !important;
}

.modal-body {
  color: #d1d5db !important;
}

.modal-footer {
  border-top: 1px solid rgba(138, 11, 210, 0.2) !important;
}

.swal2-icon {
  border: none !important;
  background: rgba(138, 11, 210, 0.1) !important;
  color: #a855f7 !important;
  box-shadow: inset 0 0 15px rgba(138, 11, 210, 0.2), 0 0 20px rgba(138, 11, 210, 0.3) !important;
}

.swal2-icon .swal2-icon-content {
  font-size: 2.5rem !important;
}

/* 3. BOTONES DE MODALES Y SWAL */

.swal2-confirm,
.swal-confirm-dr,
.modal-content .btn-primary {
  background: linear-gradient(135deg, #8A0BD2, #5a078a) !important;
  border: none !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 15px rgba(138, 11, 210, 0.4) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  transition: all 0.3s ease !important;
}

.swal2-confirm:hover,
.swal-confirm-dr:hover,
.modal-content .btn-primary:hover {
  background: linear-gradient(135deg, #a11fff, #7109b3) !important;
  box-shadow: 0 6px 20px rgba(138, 11, 210, 0.6) !important;
  transform: translateY(-2px) !important;
}

.swal2-cancel,
.swal-cancel-dr,
.modal-content .btn-secondary,
.modal-content .btn-close {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 10px !important;
  color: #d1d5db !important;
  font-weight: 600 !important;
  transition: all 0.3s ease !important;
}

.swal2-cancel:hover,
.swal-cancel-dr:hover,
.modal-content .btn-secondary:hover,
.modal-confirm-actions .btn-confirm-cancel:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
}

/* 4. CUSTOM CONFIRM MODALS (.modal-confirm-box) */

.modal-confirm-box {
  background: linear-gradient(135deg, rgba(45, 10, 89, 0.95), rgba(26, 6, 56, 0.98)) !important;
  border: 1px solid rgba(138, 11, 210, 0.4) !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6), inset 0 0 20px rgba(138, 11, 210, 0.1) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-radius: 20px !important;
  color: #ffffff !important;
}

.modal-confirm-title {
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 700 !important;
}

.modal-confirm-message {
  color: #d1d5db !important;
  font-family: 'Poppins', sans-serif !important;
}

.modal-confirm-actions .btn-confirm-ok {
  background: linear-gradient(135deg, #8A0BD2, #5a078a) !important;
  border: none !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 15px rgba(138, 11, 210, 0.4) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  transition: all 0.3s ease !important;
}

.modal-confirm-actions .btn-confirm-ok:hover {
  background: linear-gradient(135deg, #a11fff, #7109b3) !important;
  box-shadow: 0 6px 20px rgba(138, 11, 210, 0.6) !important;
  transform: translateY(-2px) !important;
}

.modal-confirm-actions .btn-confirm-cancel {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 10px !important;
  color: #d1d5db !important;
  font-weight: 600 !important;
  transition: all 0.3s ease !important;
}