/**
 * MODAL FIX - Highest Priority
 * Forces all modals to be hidden by default
 * Overrides any conflicting CSS rules
 */

/* Hide all modals by default with maximum specificity */
html body .modal,
html body div.modal,
body .modal:not(.active),
.modal:not(.active) {
    display: none !important;
}

/* Only show modals when explicitly activated.
   .modal = full-screen backdrop, .modal-content = dialog.
   Must override: apple-inline-overrides.min.css (top/left: 0 !important)
   and v2/components/modal.css (width: 520px, opacity: 0, transform, pointer-events: none). */
html body .modal.active,
html body div.modal.active,
body .modal.active,
.modal.active {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    max-height: none !important;
    transform: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    z-index: 9000 !important;
    background: rgba(0, 0, 0, 0.6) !important;
    backdrop-filter: blur(4px) !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 20px !important;
}

/* Mobile: Bottom sheet style for active modals */
@media (max-width: 768px) {
    html body .modal.active,
    body .modal.active,
    .modal.active {
        align-items: flex-end !important;
        padding: 0 !important;
    }
}