/* SMARTCO Bootstrap-compatible modal overlay fallback.
   Based on Bootstrap 5.3 modal rules: fixed viewport overlay, modal-backdrop, modal-dialog, modal-content, modal-header/body/footer. */
.modal.smartco-bootstrap-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483600 !important;
    display: block !important;
    width: 100vw !important;
    height: 100dvh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding: clamp(1rem, 2.5vw, 2rem) !important;
    pointer-events: none !important;
}

.modal.smartco-bootstrap-modal.smartco-bootstrap-modal-fullscreen {
    padding: 0 !important;
    overflow: hidden !important;
}

.modal.smartco-bootstrap-modal .modal-dialog {
    pointer-events: auto !important;
    width: auto !important;
    margin: 1.75rem auto !important;
    max-width: min(860px, calc(100vw - 2rem)) !important;
}

.modal.smartco-bootstrap-modal .modal-dialog-centered {
    display: flex !important;
    align-items: center !important;
    min-height: calc(100dvh - 3.5rem) !important;
}

.modal.smartco-bootstrap-modal .modal-sm { max-width: min(500px, calc(100vw - 2rem)) !important; }
.modal.smartco-bootstrap-modal .modal-lg { max-width: min(760px, calc(100vw - 2rem)) !important; }
.modal.smartco-bootstrap-modal .modal-xl { max-width: min(1040px, calc(100vw - 2rem)) !important; }

.modal.smartco-bootstrap-modal.smartco-bootstrap-modal-fullscreen .modal-dialog,
.modal.smartco-bootstrap-modal .modal-fullscreen,
.modal.smartco-bootstrap-modal .smartco-modal-fullscreen {
    width: 100vw !important;
    max-width: none !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    margin: 0 !important;
}

.modal.smartco-bootstrap-modal.smartco-bootstrap-modal-fullscreen .modal-dialog-centered,
.modal.smartco-bootstrap-modal .modal-fullscreen.modal-dialog-centered,
.modal.smartco-bootstrap-modal .smartco-modal-fullscreen.modal-dialog-centered {
    align-items: stretch !important;
    min-height: 100dvh !important;
}

.modal-backdrop.smartco-bootstrap-backdrop {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483500 !important;
    background: rgba(2, 6, 23, 0.74) !important;
    backdrop-filter: blur(4px) !important;
}

.smartco-modal-shell.modal-content {
    width: 100% !important;
    max-height: calc(100dvh - 3.5rem) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    border-radius: 1rem !important;
    border: 1px solid rgba(148, 163, 184, 0.28) !important;
    background: #ffffff !important;
    box-shadow: 0 1rem 3rem rgba(15, 23, 42, 0.28) !important;
    color: #0f172a !important;
}

.modal.smartco-bootstrap-modal.smartco-bootstrap-modal-fullscreen .smartco-modal-shell.modal-content,
.modal.smartco-bootstrap-modal .modal-fullscreen .smartco-modal-shell.modal-content,
.modal.smartco-bootstrap-modal .smartco-modal-fullscreen .smartco-modal-shell.modal-content {
    height: 100dvh !important;
    max-height: 100dvh !important;
    border: 0 !important;
    border-radius: 0 !important;
}

.smartco-modal-header.modal-header {
    background: #ffffff !important;
    padding: 1rem 1.25rem !important;
}

.modal.smartco-bootstrap-modal.smartco-bootstrap-modal-fullscreen .smartco-modal-header.modal-header {
    padding: 1.1rem 1.5rem !important;
}

.smartco-modal-body.modal-body {
    overflow-y: auto !important;
    padding: clamp(1.1rem, 2vw, 1.65rem) !important;
}

.modal.smartco-bootstrap-modal.smartco-bootstrap-modal-fullscreen .smartco-modal-body.modal-body,
.modal.smartco-bootstrap-modal .modal-fullscreen .smartco-modal-body.modal-body,
.modal.smartco-bootstrap-modal .smartco-modal-fullscreen .smartco-modal-body.modal-body {
    flex: 1 1 auto !important;
    padding: clamp(1.25rem, 2.2vw, 2rem) !important;
}

.smartco-modal-footer.modal-footer {
    background: #ffffff !important;
    padding: .9rem 1.25rem 1rem !important;
}

.modal.smartco-bootstrap-modal.smartco-bootstrap-modal-fullscreen .smartco-modal-footer.modal-footer {
    padding: 1rem 1.5rem !important;
    border-radius: 0 !important;
}

.btn-close.smartco-modal-close {
    width: 2.5rem !important;
    height: 2.5rem !important;
    display: inline-grid !important;
    place-items: center !important;
    padding: 0 !important;
    border-radius: 999px !important;
    background: rgba(15, 23, 42, 0.08) !important;
    background-image: none !important;
    color: #0f172a !important;
    opacity: 1 !important;
}

.btn-close.smartco-modal-close span {
    display: block !important;
    font-size: 1.45rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    transform: translateY(-1px) !important;
}

.btn-close.smartco-modal-close::before,
.btn-close.smartco-modal-close::after {
    content: none !important;
}

@media (max-width: 640px) {
    .modal.smartco-bootstrap-modal:not(.smartco-bootstrap-modal-fullscreen) {
        padding: .75rem !important;
    }

    .modal.smartco-bootstrap-modal:not(.smartco-bootstrap-modal-fullscreen) .modal-dialog,
    .modal.smartco-bootstrap-modal:not(.smartco-bootstrap-modal-fullscreen) .modal-sm,
    .modal.smartco-bootstrap-modal:not(.smartco-bootstrap-modal-fullscreen) .modal-lg,
    .modal.smartco-bootstrap-modal:not(.smartco-bootstrap-modal-fullscreen) .modal-xl {
        max-width: calc(100vw - 1.5rem) !important;
        margin: .75rem auto !important;
    }

    .modal.smartco-bootstrap-modal:not(.smartco-bootstrap-modal-fullscreen) .modal-dialog-centered {
        min-height: calc(100dvh - 1.5rem) !important;
    }
}
