/* White Modern Theme for SweetAlert2 - Clean and Professional Design */

/* Backdrop */
.white-modern-container.swal2-backdrop-show {
  background: rgba(50, 50, 50, 0.8) !important;
}

/* Popup (including toast mode) */
.white-modern-popup {
  background: #ffffff !important;
  color: #1a1a1a !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
  border-radius: 16px !important;
}

.white-modern-popup.swal2-toast {
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
}

.white-modern-popup.swal2-toast .swal2-button:focus {
  box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px rgba(0, 123, 255, 0.3) !important;
}

/* Title */
.white-modern-title {
  color: #1a1a1a !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.9) !important;
}

/* HTML Container */
.white-modern-html-container {
  color: #333333 !important;
}

/* Footer */
.white-modern-footer {
  border-top: 1px solid rgba(0, 0, 0, 0.1) !important;
  color: #666666 !important;
  background: rgba(255, 255, 255, 0.95) !important;
}

/* Timer Progress Bar */
.white-modern-timer-progress-bar {
  background: linear-gradient(90deg, #007bff, #4dabf7) !important;
  box-shadow: 0 2px 6px rgba(0, 123, 255, 0.25) !important;
}

/* Input */
.white-modern-input {
  color: #1a1a1a !important;
  background: #f9f9f9 !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05) !important;
  border-radius: 8px !important;
}

.white-modern-input:focus {
  border-color: #007bff !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05), 0 0 0 3px rgba(0, 123, 255, 0.2) !important;
}

/* Validation Message */
.white-modern-validation-message {
  background: #ffe6e6 !important;
  color: #d32f2f !important;
  border: 1px solid rgba(211, 47, 47, 0.2) !important;
  border-radius: 8px !important;
}

/* Actions (button container) */
.white-modern-actions {
  gap: 16px !important;
}

/* Confirm Button */
.white-modern-confirm-button {
  background: linear-gradient(145deg, #007bff, #0056b3) !important;
  border: 1px solid #0056b3 !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(0, 123, 255, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
  transition: all 0.3s ease !important;
}

.white-modern-confirm-button:hover {
  background: linear-gradient(145deg, #0056b3, #003d80) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 16px rgba(0, 123, 255, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
}

.white-modern-confirm-button:focus {
  box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px rgba(0, 123, 255, 0.3) !important;
}

/* Cancel Button */
.white-modern-cancel-button {
  background: linear-gradient(145deg, #6c757d, #4b545c) !important;
  border: 1px solid #4b545c !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(108, 117, 125, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
  transition: all 0.3s ease !important;
}

.white-modern-cancel-button:hover {
  background: linear-gradient(145deg, #4b545c, #343a40) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 16px rgba(108, 117, 125, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
}

.white-modern-cancel-button:focus {
  box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px rgba(108, 117, 125, 0.3) !important;
}

/* Progress Steps (queue) */
.white-modern-popup .swal2-progress-steps .swal2-progress-step {
  background: linear-gradient(145deg, #e9ecef, #ced4da) !important;
  color: #333333 !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
}

.white-modern-popup .swal2-progress-steps .swal2-progress-step.swal2-active-progress-step {
  background: linear-gradient(145deg, #007bff, #0056b3) !important;
  color: #ffffff !important;
  border-color: #0056b3 !important;
}

/* Icons */
.white-modern-icon.swal2-success [class^="swal2-success-line"] {
  background-color: #28a745 !important;
}

.white-modern-icon.swal2-success .swal2-success-ring {
  border-color: rgba(40, 167, 69, 0.25) !important;
}

.white-modern-icon.swal2-error [class^="swal2-x-mark-line"] {
  background-color: #d32f2f !important;
}

.white-modern-icon.swal2-error .swal2-x-mark {
  filter: drop-shadow(0 2px 6px rgba(211, 47, 47, 0.25)) !important;
}

.white-modern-icon.swal2-warning {
  color: #ffca2c !important;
  border-color: #ffca2c !important;
  background: linear-gradient(145deg, #fff8e1, #ffecb3) !important;
  box-shadow: 0 4px 12px rgba(255, 202, 44, 0.2) !important;
}

.white-modern-icon.swal2-info {
  color: #17a2b8 !important;
  border-color: #17a2b8 !important;
  background: linear-gradient(145deg, #e6f7fa, #b2ebf2) !important;
  box-shadow: 0 4px 12px rgba(23, 162, 184, 0.2) !important;
}

.white-modern-icon.swal2-question {
  color: #6610f2 !important;
  border-color: #6610f2 !important;
  background: linear-gradient(145deg, #ede9fe, #ddd6fe) !important;
  box-shadow: 0 4px 12px rgba(102, 16, 242, 0.2) !important;
}

/* Additional modern enhancements */
.white-modern-popup::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(0, 123, 255, 0.5), transparent) !important;
  border-radius: 16px 16px 0 0 !important;
}

/* Close button styling */
.white-modern-popup .swal2-close {
  color: #666666 !important;
  background: #f9f9f9 !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  border-radius: 50% !important;
  width: 36px !important;
  height: 36px !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
  transition: all 0.3s ease !important;
}

.white-modern-popup .swal2-close:hover {
  background: #e9ecef !important;
  color: #333333 !important;
  transform: scale(1.1) !important;
}