.modal-content.modal-warning {
    background-color: var(--bs-warning-bg-subtle) !important;
    color: var(--bs-warning-text-emphasis) !important;
    border: 1px solid var(--bs-warning-border-subtle) !important;
}

.spot-card.spotlighted {
    position: relative !important;
    z-index: 2000 !important;
    border: 2px solid var(--bs-danger) !important;
    box-shadow: 0 0 10px 4px rgba(var(--bs-danger-rgb), 0.65) !important;
}

/* Remove bottom margin from <p> elements inside modals */
#spotlight_modal_3 .modal-body p {
  margin-bottom: 0 !important;
}

/* Make the offcanvas body a positioning context */
.offcanvas-body {
    position: relative;
}

/* Blackout that only covers the offcanvas body */
#blackout {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    z-index: 999;
    /* above cards in the offcanvas */
    display: none;
    /* or flex when you want it visible */
    justify-content: center;
    align-items: center;
}