/* Lightly blur modal background, remove black overlay */

/* Only show blur overlay when modal dialog is open */
[data-controller="modal"] dialog[open]::before,
[data-controller="modal-frame"] dialog[open]::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 40;
  background: rgba(255,255,255,0.15); /* very light overlay */
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  pointer-events: auto;
  transition: background 0.2s;
}

/* Remove default black backgrounds if any */
/* Remove default black backgrounds if any, only when dialog is open */
[data-controller="modal"] dialog[open]::before,
[data-controller="modal-frame"] dialog[open]::before {
  background: rgba(255,255,255,0.15) !important;
}

/* Ensure modal content is above the backdrop */
[data-controller="modal"] dialog,
[data-controller="modal-frame"] dialog,
.modal-content {
  position: relative;
  z-index: 50;
}