/* BEGIN: scroll-bar */
html {
    --scrollbarBG: #000000;
    --thumbBG: #808080;
}

body::-webkit-scrollbar {
    width: 8px;
}

body {
    --scrollbar-width: thin;
    --scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}

body::-webkit-scrollbar-track {
    background: var(--scrollbarBG);
}

body::-webkit-scrollbar-thumb {
    background-color: var(--thumbBG);
    border-radius: 6px;
    border: 3px solid var(--scrollbarBG);
}
/* END: scroll-bar */

/*body {
    padding-top: 50px;
    padding-bottom: 20px;
}*/

/* Set padding to keep content from hitting the edges */
/*.body-content {
    padding-left: 15px;
    padding-right: 15px;
}*/

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
/*.dl-horizontal dt {
    white-space: normal;
}*/

/* Set width on the form input elements since they're 100% wide by default */
/*input,
select,
textarea {
    max-width: 280px;
}*/

input[type="file"]::file-selector-button { /* the button to select file */
    background-color: #ffffff;
    margin: 0;
    padding: 0.5rem;
    border: 0;
    border-color: #000000;
    border-right-width: 1px;
    border-style: solid;
    color: rgb(0, 0, 0);
    height: 100%;
}

input[type="file"]::file-selector-button:hover {
    background-color: #a7a7a7;
}

input[type="file"]::file-selector-button:active {
    background-color: #ffffff;
}

input[type="file" i] { /* the name of the selected file */
    width: 50%;
}

.image_input_container {
    background-color: #ffffff;
    display: flex;
    margin: 0px;
    padding: 0;
    border: 0;
    border-color: #000000;
    border-width: 1px;
    border-style: solid;
    max-width: 40%;
    color: rgb(0, 0, 0);
}