html {
    overflow-y: scroll;
}

.rz-dialog-side.vr-side-panel {
    overflow: hidden !important;
    display: flex;
    flex-direction: column;
}

.rz-dialog-side.vr-side-panel .rz-dialog-side-content {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto !important;
    overscroll-behavior: contain; /* reaching the end doesn't start scrolling the page behind */
}

/* A window opened from a side panel (the event panel's Edit event, O-04) sits above the panel, not behind it:
   both are at z-index 1001 and the panel comes later in the page. */
.rz-dialog-wrapper:has(> .vr-dialog-over-panel) {
    z-index: 1003;
}

.rz-dialog.vr-dialog .rz-dialog-content {
    max-height: calc(100vh - 140px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
}

/* The page behind an open dialog doesn't scroll (and doesn't show its own scrollbar next to the panel).
   scrollbar-gutter keeps the layout from jumping when the page scrollbar goes away. */
html {
    scrollbar-gutter: stable;
}

    html:has(.vr-side-panel), html:has(.vr-dialog) {
        overflow: hidden;
    }

/* Sticky action bar at the bottom of long forms inside a dialog. */
.vr-form-footer {
    position: sticky;
    bottom: 0;
    z-index: 2;
    background: var(--vt-surface);
    border-top: 1px solid var(--vt-border);
    padding: 1rem 0 .25rem;
    margin-top: 1.5rem;
}

/* Sidebar: Metronic draws inactive menu icons in #464852 on the #0D0E12 sidebar (2.1:1), so they almost vanish.
   They now use the titles' colour, #9A9CAE (7.1:1); the faint half of each duotone icon keeps it quieter than the text.
   Same selector as Metronic's, so the hover, active and open states (more specific) still win.
   The token pass (B-01) replaces these values. */
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon .svg-icon,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon i {
    color: #9A9CAE;
}

.rz-legend {
    margin-bottom: -50px !important;
}

.report-point{
    border: 1px solid rgba(0,0,0,0.08);
    border-radius: 3px;
    padding: 0px 4px;
    color: gray;
    display: block;
}
.report-point:focus {
    color: black;
    outline: 1px solid #1B84FF !important;
}

.no-select {
    user-select: none; /* Standard property */
    -webkit-user-select: none; /* For Safari */
    -moz-user-select: none; /* For Firefox */
    -ms-user-select: none; /* For Internet Explorer/Edge */
}

.rz-html-editor {
    padding: 0.775rem 1rem !important;
    color: var(--bs-gray-700) !important;
    background-color: var(--bs-body-bg) !important;
    background-clip: padding-box !important;
    border: 1px solid var(--bs-gray-300) !important;
    border-radius: 0.475rem !important;
    box-shadow: none !important;
    outline: none !important;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

.rz-dialog-side-content{
    height: 100% !important;
}

body.hide-body-scrollbar {
    overflow: hidden !important;
}

body.swal2-height-auto{
    height: 100% !important;
}

.cropper-container, .cropper-canvas {
    width: auto !important;
    height: 100% !important;
}

.image-input-placeholder {
    background-image: url('assets/media/svg/general/org2.svg');
}

.img-container {
    /* Never limit the container height here */
    max-width: 100%;
}

.img-container img {
    /* This is important */
    width: 100%;
}

.flatpickr-wrapper {
    min-width: 100% !important;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

.blazor-error-boundary::after {
    content: "An error has occurred."
}

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}
