:root {
    --body-bg-color: var(--csstools-light-dark-toggle--1, white);
}

.vh-85 {
    height: 85vh;
}

.vh-90 {
    height: 90vh;
}

.vh-95 {
    height: 95vh;
}

.vh-parent {
    height: 95vh; /* Parent takes 85% of viewport height */
    display: flex;
    flex-direction: column; /* Stacks children vertically */
}

.vh-child {
    flex-grow: 1; /* This element expands to fill the remaining vertical space */
    /* Add overflow: auto; if content might exceed the available space to enable scrolling within the element */
}

#scrollToBottomBtn {
    display: none; /* Hidden by default */
    position: fixed; /* Fixed position on the screen */
    bottom: 20px; /* 20px from the bottom */
    right: 20px; /* 20px from the right */
    z-index: 1000; /* Ensure it's above other content */
}

iframe {
    width: 100%;
    height: 100%;
    border: none;
}

.position-relative input.form-control {
    padding-right: 2rem; /* Make space for the button */
}

.btn-close {
    position: absolute;
    right: 0.5rem; /* Adjust positioning as needed */
    top: 50%;
    transform: translateY(-50%);
    /* Ensure the button is clickable and doesn't interfere with the input's layout */
    pointer-events: all;
    cursor: pointer;
}

.btn-cc {
    position: absolute;
    right: 1.5rem; /* Adjust positioning as needed */
    top: 50%;
    transform: translateY(-50%);
    /* Ensure the button is clickable and doesn't interfere with the input's layout */
    pointer-events: all;
    cursor: pointer;
}

.badge-nx {
    background-color: lightpink;
    color: black;
}

.badge-button {
    background-color: dodgerblue;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}

.badge-req {
    background-color: coral;
    color: black;
}

.badge-opt {
    background-color: lightgray;
    color: black;
}

.badge-cond {
    background-color: aquamarine;
    color: black;
}

i {
    pointer-events: none
}

.input-container {
    background-color: rgb(212,212,212);
}

#mainContainer {
    width: inherit;
}

.label-blurred {
    filter: blur(3px); /* Adjust the pixel value for desired blur */
}

.entry-selected {
    background-color: dodgerblue;
}

.disabled-container {
    pointer-events: none;
    opacity: 0.5; /* Optional: adds a grayed-out appearance */
}

.dz-area.hover {
    background-color: #e7f3ff;
    border-color: #0056b3;
}

.drag-over {
    background-color: lightgreen;
}

.drag-leave {
    background-color: dodgerblue;
}

#drop-zone {
    width: 400px;
    height: 200px;
    border: 2px dashed #007bff;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: white;
    transition: background-color 0.3s, border-color 0.3s;
    cursor: pointer;
}

    #drop-zone.hover {
        background-color: #e7f3ff;
        border-color: #0056b3;
    }

    #drop-zone p {
        margin: 0;
        color: #555;
        font-size: 1.1rem;
    }

#file-info {
    margin-top: 15px;
    font-size: 0.9rem;
    color: #333;
}

#progress-bar {
    width: 100%;
    height: 10px;
    background-color: #ddd;
    border-radius: 5px;
    margin-top: 10px;
    display: none;
    overflow: hidden;
}

#progress-fill {
    height: 100%;
    width: 0%;
    background-color: #28a745;
    transition: width 0.2s;
}

.modal-select {
}