/**
 * SweetAlert2 — overrides ARGOS (cargar después del script de Swal).
 */

/* ——— Diálogos modales (SweetAlert2, no toast) ——— */

.swal2-container.swal2-center,
.swal2-container.swal2-center-start,
.swal2-container.swal2-center-end {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: max(1rem, env(safe-area-inset-top, 0px)) max(1rem, env(safe-area-inset-right, 0px))
    max(1rem, env(safe-area-inset-bottom, 0px)) max(1rem, env(safe-area-inset-left, 0px)) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.swal2-container.swal2-center .swal2-popup:not(.swal2-toast),
.swal2-container.swal2-center-start .swal2-popup:not(.swal2-toast),
.swal2-container.swal2-center-end .swal2-popup:not(.swal2-toast) {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: min(92vw, 36em) !important;
  max-height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 1.25rem 1.25rem 1rem !important;
  overflow: hidden !important;
  flex-shrink: 1 !important;
  border-radius: 12px !important;
  border: 1px solid var(--argos-border, #e2e8f0) !important;
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.2) !important;
  box-sizing: border-box !important;
}

.swal2-container.swal2-center .swal2-popup:not(.swal2-toast) .swal2-icon,
.swal2-container.swal2-center-start .swal2-popup:not(.swal2-toast) .swal2-icon,
.swal2-container.swal2-center-end .swal2-popup:not(.swal2-toast) .swal2-icon {
  flex-shrink: 0 !important;
  margin: 0.5rem auto 0.75rem !important;
}

.swal2-container.swal2-center .swal2-popup:not(.swal2-toast) .swal2-title,
.swal2-container.swal2-center-start .swal2-popup:not(.swal2-toast) .swal2-title,
.swal2-container.swal2-center-end .swal2-popup:not(.swal2-toast) .swal2-title {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 0.25rem !important;
  font-size: 1.15rem !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  color: var(--argos-text, #1e293b) !important;
}

.swal2-container.swal2-center .swal2-popup:not(.swal2-toast) .swal2-html-container,
.swal2-container.swal2-center-start .swal2-popup:not(.swal2-toast) .swal2-html-container,
.swal2-container.swal2-center-end .swal2-popup:not(.swal2-toast) .swal2-html-container {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
  margin: 0.65rem 0 0 !important;
  padding: 0 0.25rem !important;
  font-size: 0.9rem !important;
  line-height: 1.45 !important;
  color: var(--argos-text-muted, #64748b) !important;
  text-align: left !important;
}

.swal2-container.swal2-center .swal2-popup:not(.swal2-toast) .swal2-actions,
.swal2-container.swal2-center-start .swal2-popup:not(.swal2-toast) .swal2-actions,
.swal2-container.swal2-center-end .swal2-popup:not(.swal2-toast) .swal2-actions {
  flex: 0 0 auto !important;
  margin-top: 1rem !important;
  gap: 0.65rem !important;
  z-index: 1 !important;
}

/* Permitir scroll en el contenedor si el popup supera el viewport (fallback) */
@media (max-height: 520px) {
  .swal2-container.swal2-center,
  .swal2-container.swal2-center-start,
  .swal2-container.swal2-center-end {
    align-items: flex-start !important;
    overflow-y: auto !important;
    padding-top: 0.75rem !important;
    padding-bottom: 0.75rem !important;
  }

  .swal2-container.swal2-center .swal2-popup:not(.swal2-toast),
  .swal2-container.swal2-center-start .swal2-popup:not(.swal2-toast),
  .swal2-container.swal2-center-end .swal2-popup:not(.swal2-toast) {
    max-height: calc(100dvh - 1.5rem) !important;
  }
}

/* ——— Toasts ——— */

.swal2-container.swal2-top-end {
  top: 4.75rem !important;
  right: 1rem !important;
  padding: 0 !important;
  z-index: 2000 !important;
  overflow: visible !important;
}

.swal2-popup.swal2-toast {
  display: grid !important;
  grid-template-columns: min-content 1fr !important;
  grid-template-rows: auto auto !important;
  column-gap: 0.65rem !important;
  row-gap: 0.2rem !important;
  width: auto !important;
  min-width: 18rem !important;
  max-width: min(26rem, calc(100vw - 2rem)) !important;
  height: auto !important;
  min-height: unset !important;
  margin: 0.5rem 0 0 !important;
  padding: 0.85rem 1rem 1rem !important;
  border-radius: 12px !important;
  border: 1px solid var(--argos-border, #e2e8f0) !important;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.14) !important;
  overflow: visible !important;
  box-sizing: border-box !important;
  align-items: start !important;
}

.swal2-popup.swal2-toast .swal2-icon {
  grid-row: 1 / span 2;
  grid-column: 1;
  align-self: start;
  width: 1.5rem !important;
  height: 1.5rem !important;
  min-width: 1.5rem !important;
  margin: 0.1rem 0 0 !important;
  border-width: 2px !important;
  scale: 1;
}

.swal2-popup.swal2-toast .swal2-icon .swal2-icon-content {
  font-size: 0.9rem !important;
  font-weight: 700 !important;
}

.swal2-popup.swal2-toast .swal2-title {
  grid-row: 1;
  grid-column: 2;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  color: var(--argos-text, #1e293b) !important;
  white-space: normal !important;
  word-break: break-word !important;
  overflow: visible !important;
  text-align: left !important;
}

.swal2-popup.swal2-toast .swal2-html-container {
  grid-row: 2;
  grid-column: 2;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0.8125rem !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  color: var(--argos-text-muted, #64748b) !important;
  white-space: normal !important;
  word-break: break-word !important;
  overflow: visible !important;
  text-align: left !important;
}

.swal2-popup.swal2-toast .swal2-timer-progress-bar-container {
  grid-row: 3;
  grid-column: 1 / -1;
  position: relative !important;
  height: 0.2rem !important;
  margin: 0.55rem -1rem -1rem !important;
  border-radius: 0 0 12px 12px !important;
  overflow: hidden !important;
}

.swal2-popup.swal2-toast .swal2-timer-progress-bar {
  background: var(--argos-accent, #3b82f6) !important;
}

@media (max-width: 640px) {
  .swal2-container.swal2-top-end {
    top: 4.25rem !important;
    right: 0.75rem !important;
    left: 0.75rem !important;
    width: auto !important;
  }

  .swal2-popup.swal2-toast {
    min-width: 0 !important;
    max-width: 100% !important;
  }
}