/*
 * Bootstrap Modal Overrides
 * --------------------------------------------------
 */
.modal {
    --bs-modal-border-radius: 0.25rem;
    --bs-modal-inner-border-radius: calc(
    var(--bs-modal-border-radius) - var(--bs-modal-border-width)
  );
    --bs-modal-footer-border-width: 0;
}

.modal-header {
    min-height: 49px;
}

.modal-footer {
    border-radius: 0;
}

.modal-footer > * {
    margin: 0;
}

/* Modal overlays are not grid columns. Keep Bootstrap's inline scrollbar
   compensation and the modal-dialog's own spacing intact. */
.row > .modal {
    margin: 0;
    padding-left: 0;
    padding-right: 0;
}

.modal-header.modal-header-split {
    height: auto;
    padding: 0;
    flex-wrap: wrap;
}

.modal-header-title {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    min-width: 0;
}

.modal-header-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-left: auto;
    padding: 6px;
    min-height: inherit;
}

/*
 * Modal Header Close Button
 * --------------------------------------------------
 * Keep placement and plain-button backgrounds here; sizing lives in buttons.
 */
.modal-header .btn.btn-plain.btn-close {
    flex-shrink: 0;
    margin: 0;
    opacity: 1;
    background-color: var(--bs-btn-bg);
}

.modal-header .btn.btn-plain.btn-close.btn-sm {
    margin: 3px;
}

.modal-header .btn.btn-plain.btn-close:hover,
.modal-header .btn.btn-plain.btn-close:focus-visible {
    background-color: var(--bs-btn-hover-bg);
}

.modal-header .btn.btn-plain.btn-close:active {
    background-color: var(--bs-btn-active-bg);
}