body {
    min-height: 100vh;
}

html {
    height: -webkit-fill-available;
}

main {
    height: 100vh;
    max-height: 100vh;
    overflow-x: auto;
    overflow-y: hidden;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    margin-top: 15px;
    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;
}

.sidebar-blue {
    background-color: #00529b;
    width: 280px;
}


.dropdown-toggle {
    outline: 0;
}

.btn-toggle {
    padding: .25rem .5rem;
    font-weight: 600;
    color: var(--bs-emphasis-color);
    background-color: transparent;
}

    .btn-toggle:hover,
    .btn-toggle:focus {
        color: rgba(var(--bs-emphasis-color-rgb), .85);
        background-color: var(--bs-tertiary-bg);
    }

    .btn-toggle::before {
        width: 1.25em;
        line-height: 0;
        content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
        transition: transform .35s ease;
        transform-origin: .5em 50%;
    }

.btn-toggle::before {
    content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%28255,255,255,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
}

    .btn-toggle[aria-expanded="true"] {
        background-color: #007dc3;
    }

    .btn-toggle[aria-expanded="true"]::before {
        transform: rotate(90deg);
    }

.btn-toggle-nav a {
    padding: .1875rem .5rem;        
    margin-top: .125rem;
    margin-left: 1.25rem;
}

    .btn-toggle-nav a.active {
        background-color: #007dc3;
    }

    .btn-toggle-nav a:hover,
    .btn-toggle-nav a:focus {
        background-color: #007dc3;
    }

.btn-toggle-nav .fa-solid {
    vertical-align: middle;
}

/* Add spacing between the icon and the text */
.btn-toggle-nav a {
    display: inline-flex;
    align-items: center;
}


.scrollarea {
    overflow-y: auto;
}

.pieChartCanvas {
    max-height: 700px;
    max-width: 700px;
}


.header {
    display: flex;
    align-items: flex-end;
}

.row-Header {
    background-color: #00529b;
    color: #fff;
}

.row-Admin {
    background-color: #f8cbad;
}
.row-Factory {
    background-color: #ffe699;
}
.row-GRN {
    background-color: #bdd7ee;
}
.row-I.T. {
    background-color: #acb9ca;
}
.row-Other {
    background-color: #dbdbdb;
}
.row-Purchasing {
    background-color: #c6e0b4;
}
.row-SalesCoordination {
    background-color: #f8cbad;
}
.row-Transport {
    background-color: #b4c6e7;
}
.row-Supplier {
    background-color: #d9d9d9;
}
.row-Warranty {
    background-color: #aeaaaa;
}

.row-Query-Red {
    background-color: #AA4A44;
    color: white;
}
.column-Query-Status {
    width: 200px;
}
.column-Query-Type {
    width: 100px;
}




.star-rating {
    font-size: 0;
    white-space: nowrap;
    display: inline-block;
    width: 150px;
    height: 50px;
    overflow: hidden;
    position: relative;
    background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMjBweCIgaGVpZ2h0PSIyMHB4IiB2aWV3Qm94PSIwIDAgMjAgMjAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIwIDIwIiB4bWw6c3BhY2U9InByZXNlcnZlIj48cG9seWdvbiBmaWxsPSIjREREREREIiBwb2ludHM9IjEwLDAgMTMuMDksNi41ODMgMjAsNy42MzkgMTUsMTIuNzY0IDE2LjE4LDIwIDEwLDE2LjU4MyAzLjgyLDIwIDUsMTIuNzY0IDAsNy42MzkgNi45MSw2LjU4MyAiLz48L3N2Zz4=');
    background-size: contain;
}

    .star-rating i {
        opacity: 0;
        position: absolute;
        left: 0;
        top: 0;
        height: 100%;
        width: 33%;
        z-index: 1;
        background: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMjBweCIgaGVpZ2h0PSIyMHB4IiB2aWV3Qm94PSIwIDAgMjAgMjAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIwIDIwIiB4bWw6c3BhY2U9InByZXNlcnZlIj48cG9seWdvbiBmaWxsPSIjRkZERjg4IiBwb2ludHM9IjEwLDAgMTMuMDksNi41ODMgMjAsNy42MzkgMTUsMTIuNzY0IDE2LjE4LDIwIDEwLDE2LjU4MyAzLjgyLDIwIDUsMTIuNzY0IDAsNy42MzkgNi45MSw2LjU4MyAiLz48L3N2Zz4=');
        background-size: contain;
    }

    .star-rating input {
        -moz-appearance: none;
        -webkit-appearance: none;
        opacity: 0;
        display: inline-block;
        width: 33%;
        height: 100%;
        margin: 0;
        padding: 0;
        z-index: 2;
        position: relative;
    }
.viewBlock {
    pointer-events: none !important;
    width: 100%;
    display: block;
    height: 100%;
    z-index: 10;
    background-color: white;
    -moz-appearance: none;
    -webkit-appearance: none;
}
.viewOnly {
    pointer-events: none;
}
.star-rating input:not(.viewOnly):hover + i,
.star-rating input:checked + i {
    opacity: 1;
}

.star-rating i {
    width: 33%;
    filter: hue-rotate(90deg);
}

        .star-rating i ~ i {
            width: 66%;
            filter: hue-rotate(0deg);
        }

            .star-rating i ~ i ~ i {
                width: 100%;
                filter: hue-rotate(310deg);
            }

    .star-rating::after,
    .star-rating::before {
        height: 100%;
        padding: 0;
        margin: 0;
        box-sizing: border-box;
        text-align: center;
        vertical-align: middle;
    }