:root {
    --background-standard: #f5f5f5;
    --linkcolor-standard: #565656;
    --bs-accordion-btn-icon: url("data:image/svg+xml, <svg viewBox='0 0 24 24' style='width: 24px; height: 24px; overflow: visible;' fill: 'rgb(199, 199, 199);'> <path d='M0 0h24v24H0z' fill='none'/> <path d='M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z'/> </svg>") !important;
    --background-color-one: #323232;
    --background-color-two: #383434;
    --background-color-three: #484444;
    --background-color-four: #403c3c;
    --background-color-five: #302c2c;
    --background-color-six: #181414;
    --background-color-seven: black;
    --background-color-eight: white;
    --background-color-nine: #5A5A5A;
    --background-color-ten: #b0acac;
    --font-color-one: white;
    --font-color-two: black;
    --font-color-three: #b0acac;
    --font-color-four: #818181;
    --font-color-five: #2c8cd4;
    --font-color-six: #403c3c;
    --border-color-one: white;
    --border-color-two: black;
    --border-color-three: #2c8cd4;
    --bs-link-color: lightblue !important;
    --bs-link-hover-color: var(--font-color-three) !important;
    --header-content-height: 65px;
    --pagetitle-content-height: 36px;
    --standard-content-height: calc(100vh - --header-content-height);
    --datatable-misc-height: 180px;
    --pageheaderandtitle-height: 100px;
    --datatable-content-height: calc(100vh - 100px - 180px); /* It seems we can't have a var within a var, so this is pseudo using  --pageheaderandtitle-height and --datatable-misc-height*/
    --datatable-content-wbreadcrumb: calc(100vh - 100px - 180px - 34px); /* It seems we can't have a var within a var, so this is pseudo using  --pageheaderandtitle-height and --datatable-misc-height, also removing 34px for the breadcrumb bar*/
    --foreground-standard: #ffffff;
    --button-standard: #007fff;
    --background-mid: #eeeeee;
}


body {
    font-family: Poppins, sans-serif;
    background-color: var(--background-standard);
    color: #4a4a4a;
    font-size: 1em;
    font-weight: 400;
    line-height: 1.5;
}

h2 {
    font-weight: 700;
    font-size: 30px;
    color: #333333;
    margin-top: 10px;
}

    h2 .editable {
        color: #333333;
    }

.ruler {
    background-image: url("../Images/ruler.png");    
    overflow: hidden;
}


.nav_menu_item {
    display: flex;
    flex-direction: row;
    height: 50px;
    width: 250px;
    margin-left: 8px;
}

.nav_menu_icon_container {
    /*background-color: #efefef;*/
    border-radius: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    width: 50px;
}

.nav_menu_icon {
    width: 24px;
    height: 24px;
    overflow: visible;
    fill: var(--linkcolor-standard);
}

.nav_menu_link {
    display: flex;
    height: 50px;
    width: 200px;
    align-items: center;
}

a {
    text-decoration: none;
    color: var(--linkcolor-standard);
}

.nav_menu_handle {
    display: flex;
    flex-direction: column;
    width: 20px;
    background-color: var(--background-standard);
}

.nav_menu_handle_icon_container {
    display: flex; 
    height: 100%; 
    width: 100%; 
    align-items: center; 
    justify-content: center;
}

.nav_menu_handle_icon {
    color: #999999;
    font-size: 12px;
    font-weight: bold;
}

.hidden-scrollable {
    height: var(--standard-content-height);
    /* position: fixed; */
    overflow-y: scroll; /* Add the ability to scroll */
}

.hidden-scrollable::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.hidden-scrollable {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
  }

.card {
    background-color: unset;
    color: unset;
}

.card-title {
    border-bottom: 1px solid var(--font-color-one);
}

.modal-header {
    background-color: #003da5;
    color: var(--font-color-one);
    font-family: Poppins, sans-serif;
    font-weight: bold;
    padding: 10px;
}

.modal-body {
    background-color: var(--background-color-six);
    color: var(--font-color-three);
    font-family: Poppins, sans-serif;
}

.dataTableTopLayout {
    display:flex;
    justify-content: space-between;
}

.dataTables_wrapper {
    background-color: var(--background-color-six);
    color: var(--font-color-three);
    font-family: Poppins, sans-serif;
    margin: 5px;
}

.dataTables_wrapper .dataTables_paginate {
    display:flex;
}

.dataTables_scrollBody {
    min-height: var(--datatable-content-wbreadcrumb);
}

.dt-scroll {
    width: calc(100vw - 70px);
    height: calc(100vh - 230px);
    position:unset;
}

.dt-scroll-body {
    min-height: var(--datatable-content-height)
}

.dt-info, .dt-length, .dt-paging {
    display: inline-block;
    padding: 5px;
    font-size: 12px;
    font-weight: 500;
    height: 2.5em;
}

.dt-length label {
    padding:5px;
}

.dt-paging {
    float:right;
}

div.dt-container .dt-paging .dt-paging-button {
    background-color: var(--button-standard);
    border-color: var(--button-standard);
    color: #ffffff !important;
    font-size: 10px;
    font-weight:700;
    height: 2.5em;
}

div.dt-container .dt-paging .dt-paging-button.first,
div.dt-container .dt-paging .dt-paging-button.last {
    display: none;
}
 
.ellipsis {
    font-size: 10px;
    font-weight: 700;
}

.modal-title {
    margin-left: 10px;
}

thead {
    background-color: var(--background-mid);
    color: var(--linkcolor-standard);
    font-size: 12px;
}

table.dataTable > tbody > tr > * {
    color: var(--font-color-three);
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
    color: unset;
}

.table-striped > tbody > tr:nth-of-type(even) > * {
    color: unset;
}


table.dataTable tbody tr.odd {
    background-color: #ffffff;
    color: #333333;
}

table.dataTable tbody tr.even {
    background-color: #f9f9f9;
    color: #333333;
}

table.dataTable.display>tbody>tr.odd>* {
    box-shadow:unset;
}

div.dt-buttons > .dt-button {
    background-color: var(--button-standard);
    border-color: var(--button-standard);
    color: #ffffff !important;
    margin-bottom: 9px;
    font-size: 12px;
    border-radius: 9px;
}

table.dataTable>tbody>tr.selected>td.select-checkbox:before {
    border: 2px solid #b0acac;
    font-size: 12px;
    line-height:unset;
}

#DataTables_Table_0_filter {
    visibility: hidden;
}

table.dataTable tbody tr.selected>* {
    box-shadow: inset 0 0 0 9999px rgba(8, 125, 109, 0.923) !important;
}

.select-checkbox {
    padding-bottom: 20px !important;
}

table.dataTable > tbody > tr > td.select-checkbox:before {
    background-color: #161616;
    width: 24px;
    height: 24px;
    border: 2px solid #b0acac;
    box-sizing: border-box;
    border-radius: 2px;
    color: var(--font-color-three);
    margin-bottom: -12px;
}

table.dataTable > tbody > tr.selected > td.select-checkbox:after, table.dataTable > tbody > tr.selected > th.select-checkbox:after {
    margin-left: 0px !important;    
}

tr.selected a:hover {
    color: var(--font-color-three) !important;
}

.dataTables_info {
    color: var(--font-color-three) !important;
}

.select-checkbox.sorting_disabled.sorting_asc:before {
    visibility: hidden !important;
}

.select-checkbox.sorting_disabled.sorting_asc:after {
    visibility: hidden !important;
}

.modal.fade.show {
    background-color: transparent !important;
}

table.dataTable thead > tr > td.sorting, table.dataTable thead > tr > td.sorting_asc, table.dataTable thead > tr > td.sorting_desc, table.dataTable thead > tr > td.sorting_asc_disabled, table.dataTable thead > tr > td.sorting_desc_disabled {
}

table.dataTable thead > tr > td.sorting, table.dataTable thead > tr > td.sorting_asc, table.dataTable thead > tr > td.sorting_desc, table.dataTable thead > tr > td.sorting_asc_disabled, table.dataTable thead > tr > td.sorting_desc_disabled:before {
    padding-right: 23px !important;
}

#modalLoader {
    background-color: transparent !important;
}

table.dataTable thead > tr > th.sorting_asc:before, table.dataTable thead > tr > th.sorting_desc:after, table.dataTable thead > tr > td.sorting_asc:before, table.dataTable thead > tr > td.sorting_desc:after {
    opacity: 1 !important;
    color: #3074ec !important;
}

table.dataTable thead > tr > th.sorting:after, table.dataTable thead > tr > th.sorting_asc:after, table.dataTable thead > tr > th.sorting_desc:after, table.dataTable thead > tr > th.sorting_asc_disabled:after, table.dataTable thead > tr > th.sorting_desc_disabled:after, table.dataTable thead > tr > td.sorting:after, table.dataTable thead > tr > td.sorting_asc:after, table.dataTable thead > tr > td.sorting_desc:after, table.dataTable thead > tr > td.sorting_asc_disabled:after, table.dataTable thead > tr > td.sorting_desc_disabled:after {
    opacity: 0.6;
}

table.dataTable thead > tr > th.sorting:before, table.dataTable thead > tr > th.sorting_asc:before, table.dataTable thead > tr > th.sorting_desc:before, table.dataTable thead > tr > th.sorting_asc_disabled:before, table.dataTable thead > tr > th.sorting_desc_disabled:before, table.dataTable thead > tr > td.sorting:before, table.dataTable thead > tr > td.sorting_asc:before, table.dataTable thead > tr > td.sorting_desc:before, table.dataTable thead > tr > td.sorting_asc_disabled:before, table.dataTable thead > tr > td.sorting_desc_disabled:before {
    opacity: 0.6;
}

.dataTables_filter {
    color: var(--font-color-three) !important;
}

    .dataTables_filter label > input {
        color: var(--font-color-three) !important;
    }

.modal-header button {
    color: var(--font-color-one) !important;
}

@keyframes sliderOpen {
    from { width: 0px; }
    to { width: 250px; }
}

.sidebar_sliderOpen {
    animation: sliderOpen;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}

.sidebar_sliderClosed {
    animation: sliderOpen;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-direction: reverse;
}

.sidebar {
    height: 100vh;
    z-index: 1;
    left: 0;
    background-color: var(--background-standard);
    overflow-x: hidden;
    transition: 0.5s;
    font-family: Poppins, sans-serif;
    font-weight: 600;
    font-size: 14px;
    line-height: 120%;
    color: var(--linkcolor-standard);
}

.sidebar a:hover {
    color: var(--button-standard);
}

.sidebar .closebtn {
    position: absolute;
    bottom: 0;
    right: 10px;
    font-size: 36px;
    margin-left: 50px;
}

.openbtn {
    font-size: 16px;
    cursor: pointer;
    background-color: var(--background-color-one);
    color: var(--font-color-one);
    padding: 10px 15px;
    border: none;
}

.openbtn:hover {
    background-color: #444;
}

.search-box {
    background-color: black;
    border: 2px solid grey;
    color: var(--font-color-one);
    display: none;
}

.search-box:focus {
    background-color: black;
    border: 2px solid #0d6efd;
    color: var(--font-color-one);
}

.left-pane-collapse {
    cursor:pointer;
}

.left-pane-collapse:hover {
    background-color: unset;
}

.nav-bar {
    background-color: var(--background-color-one);
    cursor: pointer;
}

.nav-bar:hover {
    background-color: var(--background-color-nine);
    color: var(--font-color-one) !important;
}

.accordion {
    background-image: url("data:image/svg+xml, <svg viewBox='0 0 24 24' style='width: 24px; height: 24px; overflow: visible;' fill: 'rgb(199, 199, 199);'> <path d='M0 0h24v24H0z' fill='none'/> <path d='M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z'/> </svg>") !important
}

.accordion_item_style {
    background-color: var(--background-color-six);
    margin-top: -7px;
    border: 0px solid black !important;
    border-radius: 0px !important;
}

.accordion_style {
    border: 0px solid black !important;
    border-radius: 0px !important;
}

.accordion-button {
    background-color: var(--background-color-five) !important;
    color: var(--font-color-one) !important;
    border: 0px !important;
    border-radius: 0px !important;
}

.accordion-button:not(.collapsed) {
    box-shadow: unset;
    color: var(--font-color-one) !important;
}

.accordion-button.collapsed::after {
    display: inline-block !important;
    content: "" !important;
    vertical-align: -.125em !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' style='width: 24px; height: 24px; overflow: visible; fill: rgb(199, 199, 199);'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z'/%3E%3C/svg%3E")         !important;
    background-repeat: no-repeat !important;
    background-size: 1rem 1rem !important;
}

.accordion-button::after {
    display: inline-block !important;
    content: "" !important;
    vertical-align: -.125em !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' style='width: 24px; height: 24px; overflow: visible; fill: rgb(199, 199, 199);'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='m12 8-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: 1rem 1rem !important;
}

.card_style {
    background-color: var(--background-color-six) !important;
    color: var(--font-color-one) !important;
}

.card_body {
    border: 0px !important;
}

.card_body_style {
    background-color: var(--background-color-five) !important;
    color: black;
    border-radius: 0px;
    margin-top: 2.5px;
}

.white-bg-theme {
    background-color: var(--background-color-eight);
    color: var(--font-color-two);
    border: 0px;
}

.white-bg-theme a {
    color: #0000CC;
}

.white-bg-theme a:visited {
    color: #800080;
}

.list-group {
    border-radius: 0px;
}

table.dataTable thead > tr > th.sorting, table.dataTable thead > tr > th.sorting_asc, table.dataTable thead > tr > th.sorting_desc, table.dataTable thead > tr > th.sorting_asc_disabled, table.dataTable thead > tr > th.sorting_desc_disabled, table.dataTable thead > tr > td.sorting, table.dataTable thead > tr > td.sorting_asc, table.dataTable thead > tr > td.sorting_desc, table.dataTable thead > tr > td.sorting_asc_disabled, table.dataTable thead > tr > td.sorting_desc_disabled {
    cursor: pointer;
    position: relative;
    padding-right: 26px;
    padding-bottom: 14.5px;
}

.user_name_dropdown_item {
    font-style: italic;
    pointer-events: none !important;
}

table.dataTable td {
    max-width: 100px;
}

table.dataTable td {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

table.dataTable {
    overflow-y: scroll;
}

.combodate {
    display:flex;
}

#ui_components_container {
    display: flex;
    flex-direction: column;
    width: 10%;
    height: 100%;
    margin-top: 10px;
}

.ui_component_section_div {
    display: flex;
    height: 100%;
    width: 100%;
    align-items: center;
    justify-content: center;
}

.fields_container_div {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    margin-top: 10px;
}

.fields_list_container_div {
    display: flex;
    flex-direction: column;
    min-height: 100px;
    max-height: 950px;
    width: 100%;
    overflow-y: auto;
}

.field_item_container_div {
    height: 60px;
    width: 100%;
    cursor: pointer;
}

.field_body_container_div {
    display: flex;
    flex-direction: row;
}

.field_body_left_div {
    display: flex;
    width: 70%;
}

.field_body_text {
    font-size: 15px;
}

.field_body_right_div {
    display: flex;
    width: 30%;
    justify-content: flex-end;
    align-items: flex-start;
    margin-top: -5px;
    padding-left: 25px;
}

.pdf_body_row_section_container {
    display: flex;
    flex-direction: column;
    min-height: 35px;
    width: 100%;
}

.pdf_body_two_column_row_section {
    display: flex;
    flex-direction: row;
    min-height: 35px;
    width: 100%;
}

.field_option_one_container_div {
    display: flex;
    flex-direction: row;
    height: 35px;
    width: 100%;
    margin-top: 10px;
}

.field_option_one_label_container_div {
    display: flex;
    height: 35px;
    width: 15%;
    align-items: center;
    border-bottom: 1px solid black;
}

.field_option_one_value_container_div {
    display: flex;
    height: 35px;
    width: 85%;
    border-left: 1px solid black;
    border-bottom: 1px solid black;
    justify-content: center;
    align-items: center;
}

.field_option_one_label_span {
    font-size: 15px;
    color: #184c74;
    padding-left: 10px;
}

.field_option_one_value_span {
    font-size: 15px;
    color: #184c74;
}

.field_option_two_container_div {
    display: flex;
    flex-direction: row;
    height: 35px;
    flex: 1;
    margin-top: 10px;
}

.field_option_two_label_container_div {
    display: flex;
    height: 35px;
    width: 15%;
    align-items: center;
}

.field_option_two_value_container_div {
    display: flex;
    height: 35px;
    width: 90%;
    justify-content: center;
    align-items: center;
    border-bottom: 2px solid black;
}

.field_option_two_label_span {
    font-size: 15px;
    color: black;
    padding-left: 10px;
    padding-top: 22.5px;
    font-family: Poppins;
    border-bottom: 2px solid white;
    font-weight: bold;
}

.field_option_two_value_span {
    font-size: 15px;
    color: black;
    font-family: Poppins;
}

.field_option_three_container_div {
    display: flex;
    flex-direction: row;
    height: 35px;
    flex: 1;
    margin-top: 10px;
}

.field_option_three_label_container_div {
    display: flex;
    height: 35px;
    width: 15%;
    align-items: center;
}

.field_option_three_value_container_div {
    display: flex;
    height: 35px;
    width: 90%;
    justify-content: center;
    align-items: center;
    background-color: #e8f4fc;
}

.field_option_three_label_span {
    font-size: 14px;
    color: black;
    padding-left: 10px;
    padding-bottom: 1px;
    font-family: Poppins;
    font-weight: bold;
}

.field_option_three_value_span {
    font-size: 15px;
    color: black;
    font-family: Poppins;
}

.field_option_four_container_div {
    display: flex;
    flex-direction: column;
    height: 125px;
    width: 100%;
    margin-left: 10px;
    margin-top: 10px;
}

.field_option_four_label_container_div {
    display: flex;
    height: 25%;
    width: 100%;
}

.field_option_four_value_container_div {
    display: flex;
    height: 75%;
    width: 100%;
    background-color: #e8f4fc;
}

.field_option_four_label_span {
    font-size: 14px;
    font-family: Poppins;
    color: black;
    font-weight: bold;
}

.field_option_five_container_div {
    display: flex;
    flex-direction: column;
    height: 125px;
    width: 100%;
    margin-left: 10px;
    margin-top: 10px;
}

.field_option_five_label_container_div {
    display: flex;
    height: 25%;
    width: 100%;
}

.field_option_five_value_container_div {
    display: flex;
    height: 75%;
    width: 100%;
    background-color: #b8f4c4;
}

.field_option_five_label_span {
    font-size: 14px;
    font-family: Poppins;
    color: #184c74;
    font-weight: bold;
}

.section_header_option_one_container_div {
    display: flex;
    height: 50px;
    width: 100%;
    background-color: #e8f4fc;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
}

.section_header_option_one_label_span {
    color: #184c74;
    font-family: Poppins;
    font-size: 18px;
}

.section_header_option_two_container_div {
    display: flex;
    height: 50px;
    width: 100%;
    background-color: #b8f4c4;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
}

.section_header_option_two_label_span {
    color: #184c74;
    font-family: Poppins;
    font-size: 18px;
}

.cross_div {
    height: 25px;
    width: 25px;
    background-image: url("data:image/svg+xml,%3Csvg style='cursor: pointer;' xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='black' class='bi bi-x' viewBox='0 0 12 12' data-bs-toggle='collapse' data-bs-target='%23errorCodesPanel'%3E%3Cpath d='M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z' /%3E%3C/svg%3E");
    cursor: pointer;
}

.onboarding_div {
    display: flex;
    flex-direction: row;
    max-height: 100vh;
    width: 100%;
}

.left_onboarding_div {
    display: flex;
    flex-direction: column;
    max-height: 92.5vh;
    width: 10%;
    overflow-y: auto;
}

.main_onboarding_div {
    display: flex;
    flex-direction: row;
    height: 100%;
    width: 90%;
}

.pdf_config_container_div {
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    width: 90%;
    height: 60px;
    border: 0px solid white;
    cursor: pointer;
    margin-top: 10px;
    background-color: #383434;
    border-radius: 5px;
}

.pdf_config_name_span {
    font-size: 12px;
    color: white;
    font-weight: bold;
}

.new_field_sidebar {
    display: flex;
    flex-direction: row;
    height: 100vh;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 50px;
    right: 50vh;
    background-color: #302c2c;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 15px;
    font-family: Poppins, sans-serif;
}

.pdf_magic_right_panel {
    display: none;
    flex-direction: row;
    position: fixed;
    z-index: 1;
    height: 100vh !important;
    width: 50vh;
    background-color: #302c2c;
    right: 0px;
    top: 20px;
}

.name_details_section_body_div {
    display: flex;
    min-height: 30px;
    width: 100%;
}

.name_details_section_div {
    display: flex;
    flex-direction: column;
    min-height: 30px;
    width: 97%;
    background-color: #383434;
}

.App-header {
    background-color: #282c34;
    width: 1000px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: calc(10px + 2vmin);
    color: white;
}


.inline-editable {
    color: var(--linkcolor-standard);
}

.toast{
    position:absolute;
    right: 0;
    bottom: 0;
}

.tdrembedcontainer {
    display:flex;
    flex-direction: row;
}

.maxheight {
    height: 100%;
}

.spinner-grow,
.spinner-border {
    display: inline-block;
    width: var(--bs-spinner-width);
    height: var(--bs-spinner-height);
    vertical-align: var(--bs-spinner-vertical-align);
    border-radius: 50%;
    animation: var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name);
}

@keyframes spinner-border {
    to {
        transform: rotate(360deg) /* rtl:ignore */;
    }
}

.spinner-border {
    --bs-spinner-width: 2rem;
    --bs-spinner-height: 2rem;
    --bs-spinner-vertical-align: -0.125em;
    --bs-spinner-border-width: 0.25em;
    --bs-spinner-animation-speed: 0.75s;
    --bs-spinner-animation-name: spinner-border;
    border: var(--bs-spinner-border-width) solid currentcolor;
    border-right-color: transparent;
}

.spinner-border-sm {
    --bs-spinner-width: 1rem;
    --bs-spinner-height: 1rem;
    --bs-spinner-border-width: 0.2em;
}

@keyframes spinner-grow {
    0% {
        transform: scale(0);
    }

    50% {
        opacity: 1;
        transform: none;
    }
}

.spinner-grow {
    --bs-spinner-width: 2rem;
    --bs-spinner-height: 2rem;
    --bs-spinner-vertical-align: -0.125em;
    --bs-spinner-animation-speed: 0.75s;
    --bs-spinner-animation-name: spinner-grow;
    background-color: currentcolor;
    opacity: 0;
}

.spinner-grow-sm {
    --bs-spinner-width: 1rem;
    --bs-spinner-height: 1rem;
}

@media (prefers-reduced-motion: reduce) {
    .spinner-border,
    .spinner-grow {
        --bs-spinner-animation-speed: 1.5s;
    }
}

.chartContainer {
    display:flex;
    flex-direction:row;
    flex-wrap: wrap;
    overflow:scroll;
}

.widget {
    width: 20rem;
    margin: 10px;    
}

.widgetPanel {    
    width: unset;
}

.widgetPanel > .card-content {
    background-color: var(--background-standard);
    border-radius: 0.375em;
}

.widgetHeader {
    color: unset;
    font-size: 17px;
    font-weight: 600;
    text-overflow: ellipsis;
    overflow: hidden;
}

.widgetLoader {
}

.widgetCount {
    font-weight: bold;
    color: #009900
}

.widgetPreviousCount {
    color: white
}

.widgetDrilldownLink {
    width: 24px;
    height: 24px;
    overflow: visible;
    fill: var(--button-standard);
    margin-right: 10px;
}

.listRightPanel {
    align-items: center;
    background-color: unset;
    padding: 10px;
    padding-left: 20px;
    height: calc(100vh - 65px);
}

.errorLibrarySelectedError {
    background-color: rgba(8, 125, 109, 0.923) !important;
}

#libraryContent p {
    color: var(--font-color-three);
}

.logo {
    height: 55px;
    width: 200px;
    max-height: 55px;
    max-width: 200px;
    background-image: url("https://thedarqroom.azurewebsites.net/Images/Logos/Small Logo.png");
    background-repeat:round;
}

.tab-content {
    background-color: var(--foreground-standard);
}

.breadcrumb {
    color: var(--linkcolor-standard);
    background-color: var(--background-standard);
    margin: unset;
}

.bg-dark {
    background-color: var(--foreground-standard);
    color: var(--linkcolor-standard);
}

.accordion {
    background-image: url("data:image/svg+xml, <svg viewBox='0 0 24 24' style='width: 24px; height: 24px; overflow: visible;' fill: 'rgb(199, 199, 199);'> <path d='M0 0h24v24H0z' fill='none'/> <path d='M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z'/> </svg>") !important
}

.accordion_item_style {
    background-color: var(--background-color-six);
    margin-top: -7px;
    border: 0px solid var(--border-color-two) !important;
    border-radius: 0px !important;
}

.accordion_style {
    border: 0px solid var(--border-color-two) !important;
    border-radius: 0px !important;
}

.accordion-button {
    background-color: var(--background-color-five) !important;
    color: var(--font-color-one) !important;
    border: 0px !important;
    border-radius: 0px !important;
}

    .accordion-button:not(.collapsed) {
        box-shadow: unset;
        color: var(--font-color-one) !important;
    }

    .accordion-button.collapsed::after {
        display: inline-block !important;
        content: "" !important;
        vertical-align: -.125em !important;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' style='width: 24px; height: 24px; overflow: visible; fill: rgb(199, 199, 199);'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z'/%3E%3C/svg%3E") !important;
        background-repeat: no-repeat !important;
        background-size: 1rem 1rem !important;
    }

    .accordion-button::after {
        display: inline-block !important;
        content: "" !important;
        vertical-align: -.125em !important;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' style='width: 24px; height: 24px; overflow: visible; fill: rgb(199, 199, 199);'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='m12 8-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z'/%3E%3C/svg%3E") !important;
        background-repeat: no-repeat !important;
        background-size: 1rem 1rem !important;
    }

.card_style {
    background-color: var(--background-color-six) !important;
    color: var(--font-color-one) !important;
}

.container_style {
    background-color: var(--background-color-six);
    min-height: 94.2vh !important;
}

.card_body {
    border: 0px !important;
}

.card_body_style {
    background-color: var(--background-color-five) !important;
    color: var(--font-color-two);
    border-radius: 0px;
    margin-top: 2.5px;
}

.list-group {
    border-radius: 0px;
}

.main_container_div {
    display: flex;
    flex-direction: row;
    min-height: 50px;
    width: 100%;
    background-color: var(--background-color-three);
}

.main_div_left {
    display: flex;
    flex-direction: column;
    min-height: 20px;
    width: 95%;
    cursor: pointer;
}

.main_div_right {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 35px;
    width: 5%;
    background-color: var(--background-color-three);
}

.error_note_top_section_container_div {
    display: flex;
    flex-direction: row;
    min-height: 20px;
    width: 100%;
}

.error_description_container_div {
    display: flex;
    min-height: 20px;
    width: 100%;
    background-color: var(--background-color-three);
    align-items: center;
}

.error_more_elipsis_container_div {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    width: 5%;
    background-color: var(--background-color-three);
}

.error_note_bottom_section_container_div {
    display: flex;
    flex-direction: row;
    min-height: 20px;
    width: 100%;
}

.error_description {
    padding-top: 10px;
    padding-left: 15px;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    overflow: hidden !important;
}

.error_note_bottom_section_div {
    display: flex;
    height: 30px;
    width: 33.33%;
    background-color: var(--background-color-three);
}

.error_note_text {
    color: var(--font-color-one);
    padding-left: 15px;
    padding-bottom: 10px;
    font-size: 10px;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    overflow: hidden !important;
}

#modalLoader {
    background-color: transparent !important;
}

.dataTables_wrapper
.dataTables_length {
    background-color: #ffffff;
    color: var(--font-color-three) !important;
    float: left;
    padding-top: 0.5em !important;
    padding-left: 0.6em !important;
}

    .dataTables_wrapper .dataTables_length select {
        color: var(--font-color-three) !important;
    }

.modal-body {
    background-color: var(--background-color-eight) !important;
}

.custom_error_list_container {
    background-color: var(--background-color-five) !important;
}

#toolbar_buttons_container_div {
    display: flex;
    flex-direction: row;
    height: 20px;
    width: 100%;
}

.toolbar_button_div {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 10%;
    cursor: pointer;
}

.header_row {
    display: flex;
    flex-direction: row;
    min-height: 30px;
    width: 100%;
}

.header_row_left_column {
    display: flex;
    align-items: center;
    min-height: 30px;
    width: 25%;
}

.header_row_right_column {
    display: flex;
    align-items: center;
    min-height: 30px;
    width: 75%;
}

.header_row_left_column_text {
    font-size: 12px;
    color: var(--font-color-one);
    font-weight: bold;
}

.details_section_container_div {
    display: flex;
    flex-direction: column;
    min-height: 125px;
    width: 100%;
    background-color: var(--background-color-five);
}

.details_section_div {
    display: flex;
    flex-direction: column;
    min-height: 60px;
    width: 97%;
    background-color: var(--background-color-two);
}

.details_section_header_div {
    display: flex;
    flex-direction: row;
    min-height: 12.5px;
    width: 99%;
}

.details_section_header_title_div {
    display: flex;
    align-items: center;
    min-height: 12.5px;
    width: 90%;
}

.details_section_header_icons_div {
    display: flex;
    flex-direction: row;
    min-height: 12.5px;
    width: 10%;
    padding-left: 25px;
}

.details_section_header_icons_div_two {
    display: none;
    flex-direction: row;
    min-height: 12.5px;
    width: 10%;
    margin-right: 7.5px;
}

.details_section_tick_icon_div {
    display: none;
    min-height: 12.5px;
    width: 50%;
}

.details_section_cancel_icon_div {
    display: none;
    min-height: 12.5px;
    width: 50%;
}

.details_section_body_div {
    display: flex;
    min-height: 47.5px;
    width: 100%;
}

.details_section_text_area_body_div {
    display: none;
    min-height: 47.5px;
    width: 100%;
}

.name_details_section_text_area_body_div {
    display: none;
    min-height: 30px;
    width: 100%;
}

.comment_section_container_div {
    display: none;
    flex-direction: column;
    min-height: 160px;
}

.comment_section_header_div {
    display: flex;
    align-items: center;
    min-height: 20px;
}

.comment_section_textarea_div {
    display: flex;
    min-height: 110px;
}

.comment_section_footer_div {
    display: flex;
    flex-direction: row;
    min-height: 30px;
}

.comment_footer_section_checkbox_div {
    display: flex;
    min-height: 30px;
    width: 6.5%;
    align-items: center;
    padding-left: 5px;
}

.comment_footer_section_text_div {
    display: flex;
    min-height: 30px;
    width: 50%;
    align-items: center;
}

.comment_footer_section_submit_button_div {
    display: flex;
    flex-direction: row;
    min-height: 30px;
    width: 50%;
}

.main_comment_container_div {
    display: flex;
    flex-direction: column;
    min-height: 30px;
    width: 97%;
    margin-top: 5px;
}

.odd_comment_div {
    background-color: var(--background-color-two);
    color: var(--font-color-one);
}

.even_comment_div {
    background-color: var(--background-color-three);
    color: var(--font-color-one);
}

.comment_div_header_section_div {
    display: flex;
    flex-direction: row;
    min-height: 20px;
}

.comment_div_header_user_div {
    display: flex;
    min-height: 20px;
    width: 85%;
}

.comment_div_header_dateraised_div {
    display: flex;
    justify-content: flex-end;
    min-height: 20px;
    width: 15%;
}

.comment_div_body_section_div {
    display: flex;
    min-height: 10px;
    width: 100%;
}

.user_text {
    color: var(--font-color-one);
    font-size: 12px;
    padding-left: 6.5px;
    padding-top: 2.5px;
}

.date_raised_text {
    color: var(--font-color-one);
    font-size: 8px;
    padding-top: 5px;
    padding-right: 6.5px;
}

.body_text {
    color: var(--font-color-one);
    font-size: 10px;
    padding-left: 6.5px;
    padding-bottom: 2.5px;
    overflow-wrap: anywhere;
    padding-right: 6.5px;
}

.error_section_container {
    display: none;
    flex-direction: column;
    width: 97%;
    min-height: 10px;
}

.error_section_div {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 25px;
}

.error_header_section_div {
    display: flex;
    flex-direction: row;
    width: 100%;
    min-height: 25px;
}

.error_header_title_section_div {
    display: flex;
    align-items: center;
    width: 90%;
    min-height: 25px;
}

.error_header_title_text {
    display: flex;
    font-size: 12px;
    color: var(--font-color-one);
}

.error_header_error_count_text {
    display: flex;
    font-size: 12px;
    color: var(--font-color-one);
}

.error_body_text {
    display: flex;
    align-items: center;
    font-size: 12px;
    color: var(--font-color-one);
    padding-left: 5px;
}

.error_header_error_count_section_div {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 10%;
    min-height: 25px;
}

.error_body_section_div {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 25px;
}

.error_body_row_div {
    display: flex;
    width: 100%;
    min-height: 25px;
}

table.dataTable tbody th, table.dataTable tbody td {
    /*color: var(--font-color-three) !important;*/
    padding-top: 18px !important;
    padding-left: 0.6em !important;
    padding: 18px 10px !important;
    font-size: 12px;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    max-width: 100px !important; /* I have to set this for text-overflow elipsis to work. It HAS to be in px it can't be a %. */
}

table.dataTable > tbody > tr > td.select-checkbox:before, table.dataTable > tbody > tr > td.select-checkbox:after, table.dataTable > tbody > tr > th.select-checkbox:before, table.dataTable > tbody > tr > th.select-checkbox:after {
    top: 1.6em !important;
    background-color: unset;
}

.no_date_closed {
    display: none;
}

.hide_icon {
    display: none;
}

.show_icon {
    display: flex;
}

.avatar {
    vertical-align: middle;
    width: 35px;
}

#assigneduserid {
    text-decoration: unset !important;
    color: var(--font-color-five) !important;
    border-bottom: 1px solid var(--border-color-three);
}

#assignee {
    text-decoration: unset !important;
    color: var(--font-color-five) !important;
    border-bottom: 1px solid var(--border-color-three);
}

.documents-list-groups {
    --bs-list-group-color: #212529;
    --bs-list-group-bg: #fff;
    --bs-list-group-border-color: rgba(0, 0, 0, 0.125);
    --bs-list-group-border-width: 1px;
    --bs-list-group-border-radius: 0.375rem;
    --bs-list-group-item-padding-x: 1rem;
    --bs-list-group-item-padding-y: 0.5rem;
    --bs-list-group-action-color: #495057;
    --bs-list-group-action-hover-color: #495057;
    --bs-list-group-action-hover-bg: #f8f9fa;
    --bs-list-group-action-active-color: #212529;
    --bs-list-group-action-active-bg: #e9ecef;
    --bs-list-group-disabled-color: #6c757d;
    --bs-list-group-disabled-bg: #fff;
    --bs-list-group-active-color: #fff;
    --bs-list-group-active-bg: #0d6efd;
    --bs-list-group-active-border-color: #0d6efd;
    display: flex;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    border-radius: 0px;
}

table.dataTable {
    min-width: 100% !important;
}

.af-checkbox {
    width: 24px;
    height: 24px;
    border: 2px solid var(--font-color-three);
    box-sizing: border-box;
    border-radius: 3px;
    color: var(--font-color-three);
    background-color: #161616;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}

.af-checkbox-selected::after {
    content: "✓";
    font-size: 20px;
    text-align: center;
    text-shadow: 1px 1px #b0bed9;
    font-weight: bolder;
}



.error-code-checkbox {
    width: 24px;
    height: 24px;
    border: 2px solid var(--font-color-three);
    box-sizing: border-box;
    border-radius: 3px;
    color: var(--font-color-three);
    background-color: #161616;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}

.error-code-checkbox-selected::after {
    content: "✓";
    font-size: 20px;
    text-align: center;
    text-shadow: 1px 1px #b0bed9;
    font-weight: bolder;
}

.no_issue_header_row {
    display: none;
}

.show_issue_header_row {
    display: flex;
}

.dashboard-container-div {
    display: flex;
    flex-direction: row;
    justify-content:space-evenly;
    height: 100%;
}

.dashboard-category-div {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.dashboard-category-header-div {
    font-size: 25px;
    padding-left: 12.5px;
}

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 26px;
        width: 26px;
        left: 4px;
        bottom: 4px;
        background-color: var(--background-color-eight);
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #2196F3;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }

.nav_bar_style {
    height: 75px;
    background-color: #003da5;
}

/*PDF Magic Styles*/
.pdf_magic_right_panel {
    display: none;
    flex-direction: row;
    position: fixed;
    z-index: 1;
    height: 100vh !important;
    width: 50vh;
    background-color: #302c2c;
    right: 0px;
    top: 20px;
}

.data_source_row_container {
    display: flex;
    flex-direction: row;
    height: 50px;
    width: 100%;
    border-top: 1px solid white;
    background-color: #383434;
}

.data_source_name_div {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    width: 30%;
}

.data_source_endpoint_div {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    width: 30%;
    border-left: 1px solid white;
}

.data_source_link_dropdown_div {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    width: 40%;
    border-left: 1px solid white;
}

.data_source_text_span {
    font-size: 13px;
    color: white;
    font-weight: bold;
}

.data_source_link_dropdown {
    height: 30px !important;
    font-size: 12.5px !important;
    background-color: white !important;
    color: black !important;
}

.data_source_table_header_container_div {
    display: flex;
    height: 30px;
    width: 100%;
    background-color: #383434;
}

.data_source_table_header_name_div {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 30px;
    width: 30%;
}

.data_source_table_endpoint_div {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 30px;
    width: 30%;
}

.data_source_table_link_div {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 30px;
    width: 40%;
}

.pdf_page_container_div {
    display: flex;
    flex-direction: column;
    min-height: 1070px;
    width: 950px;
    border-radius: 2.5px;
    background-color: white;
    margin-top: 15px;
}

.pdf_page_body_container_div {
    display: flex;
    margin-top: 20px;
    min-height: 10vh;
    width: 100%;
}

.pdf_page_body_container_div_two {
    display: flex;
    margin-top: 20px;
    min-height: 10vh;
    width: 100%;
}

.pdf_body_container_div {
    display: flex;
    flex-direction: row;
    height: 100%;
    width: 100%;
}

.pdf_body_break_div {
    display: flex;
    height: 100%;
    width: 2.5%;
}

.pdf_main_body_container_div {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 95%;
}

.pdf_main_body_container_div_two {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 95%;
}

.pdf_main_body_field_container_div {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

.pdf_page_container_div {
    display: flex;
    flex-direction: column;
    min-height: 1070px;
    width: 950px;
    border-radius: 2.5px;
    background-color: white;
}

.pdf_header_one_container_div {
    display: none;
    flex-direction: column;
    height: 175px;
    width: 100%;
    background-color: #4094a4;
    border-radius: 2.5px;
}

.pdf_header_one_break_div {
    display: flex;
    width: 100%;
    height: 15%;
}

.pdf_header_one_content_container_div {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 70%;
}

.pdf_header_one_content_break_div {
    display: flex;
    height: 100%;
    width: 3.5%;
}

.pdf_header_one_content_div {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 93%;
}

.pdf_header_one_content_title_container_div {
    display: flex;
    min-height: 30%;
    width: 100%;
    align-items: center;
}

.pdf_header_title_span_one {
    color: white;
    font-size: 32.5px;
    font-family: Poppins;
    overflow-wrap: anywhere;
}

.pdf_header_one_content_description_container_div {
    display: flex;
    flex-direction: column;
    min-height: 70%;
    width: 100%;
    margin-top: 5px;
}

.pdf_header_description_span_one {
    color: white;
    font-size: 13.25px;
    font-family: Poppins;
    overflow-wrap: anywhere;
}

.pdf_header_two_container_div {
    display: none;
    flex-direction: column;
    height: 175px;
    width: 100%;
}

.pdf_header_two_break_div {
    display: flex;
    height: 15%;
    width: 100%;
}

.pdf_header_two_content_container_div {
    display: flex;
    flex-direction: row;
    height: 70%;
    width: 100%;
}

.pdf_header_two_small_break_div {
    display: flex;
    height: 100%;
    width: 3.5%;
}

.pdf_header_two_content_div {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 93%;
}

.pdf_header_two_title_container_div {
    display: flex;
    height: 30%;
    width: 100%;
    align-items: center;
}

.pdf_header_title_span_two {
    color: #509c74;
    font-size: 32.5px;
    font-family: Poppins;
    overflow-wrap: anywhere;
}

.pdf_header_two_description_container_div {
    display: flex;
    flex-direction: column;
    height: 70%;
    width: 100%;
    margin-top: 5px;
}

.pdf_header_description_span_two {
    color: black;
    font-size: 12.5px;
    font-family: Poppins;
    overflow-wrap: anywhere;
}

.pdf_header_three_container_div {
    display: none;
    flex-direction: row;
    height: 175px;
    width: 100%;
    margin-top: 15px;
}

.pdf_header_option_three_left_side_container_div {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 50%;
}

.pdf_header_option_three_form_title_container_div {
    display: flex;
    height: 20px;
    width: 100%;
    margin-top: 50px;
}

.pdf_header_option_three_form_title_span {
    font-size: 16px;
    font-weight: bold;
    color: black;
    padding-left: 25px;
    overflow-wrap: anywhere;
}

.pdf_header_option_three_pdf_owner_container_div {
    display: flex;
    height: 16px;
    width: 100%;
    margin-top: 5px;
}

.pdf_header_option_three_pdf_owner_span {
    font-size: 12px;
    padding-left: 25px;
    color: black;
    font-family: sans-serif;
    overflow-wrap: anywhere;
}

.pdf_header_option_three_date_container_div {
    display: flex;
    height: 16px;
    width: 100%;
}

.pdf_header_option_three_date_span {
    font-size: 12px;
    padding-left: 25px;
    color: black;
    font-family: sans-serif;
}

.pdf_header_option_three_project_container_div {
    display: flex;
    height: 16px;
    width: 100%;
}

.pdf_header_option_three_project_span {
    font-size: 12px;
    padding-left: 25px;
    color: black;
    font-family: sans-serif;
}

.pdf_header_option_three_right_side_container_div {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 50%;
    border-left: 2px solid #707489;
}

.pdf_header_option_three_logo_container_div {
    display: flex;
    height: 50%;
    width: 100%;
    justify-content: flex-end;
}

.pdf_header_option_three_logo_img {
    max-height: 100px;
    max-width: 200px;
    margin-right: 10px;
    margin-bottom: 10px;
}

.pdf_header_option_three_main_content_section_container_div {
    display: flex;
    flex-direction: row;
    height: 50%;
    width: 100%;
}

.pdf_header_option_three_left_break_div {
    display: flex;
    height: 100%;
    width: 62%;
}

.pdf_header_option_three_company_details_section_container_div {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 38%;
    justify-content: flex-end;
    align-items: flex-end;
    margin-right: 10px;
}

.pdf_header_option_three_abn_container_div {
    display: flex;
    height: 18px;
}

.pdf_header_option_three_abn_span {
    font-size: 10px;
    color: #707489;
    font-family: sans-serif;
}

.pdf_header_option_three_street_address_container_div {
    display: flex;
    height: 18px;
}

.pdf_header_option_three_street_address_span {
    font-size: 10px;
    color: #707489;
    font-family: sans-serif;
}

.pdf_header_option_three_phone_number_container_div {
    display: flex;
    height: 18px;
}

.pdf_header_option_three_phone_number_span {
    font-size: 10px;
    color: #707489;
    font-family: sans-serif;
}

.pdf_header_option_three_email_container_div {
    display: flex;
    height: 18px;
}

.pdf_header_option_three_email_span {
    font-size: 10px;
    color: #707489;
    font-family: sans-serif;
}

.pdf_header_option_three_company_website_container_div {
    display: flex;
    height: 18px;
}

.pdf_header_option_three_company_website_span {
    font-size: 10px;
    color: #707489;
    font-family: sans-serif;
}

.pdf_header_four_container_div {
    display: none;
    flex-direction: row;
    height: 175px;
    width: 100%;
    margin-top: 20px;
}

.pdf_header_option_four_left_side_container_div {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 50%;
}

.pdf_header_option_four_logo_container_div {
    display: flex;
    height: 50%;
    align-items: center;
    margin-left: 15px;
}

.pdf_header_option_four_logo_img {
    max-height: 100px;
    max-width: 200px;
    margin-right: 10px;
    margin-bottom: 10px;
}

.pdf_header_option_four_company_details_container_div {
    display: flex;
    flex-direction: column;
    height: 50%;
    width: 100%;
    margin-top: 20px;
}

.pdf_header_option_four_abn_container_div {
    display: flex;
    height: 18px;
}

.pdf_header_option_four_abn_span {
    font-size: 10px;
    padding-left: 24px;
    color: #707489;
    font-family: sans-serif;
}

.pdf_header_option_four_street_address_container_div {
    display: flex;
    height: 18px;
}

.pdf_header_option_four_street_address_span {
    font-size: 10px;
    padding-left: 24px;
    color: #707489;
    font-family: sans-serif;
}

.pdf_header_option_four_phone_number_container_div {
    display: flex;
    height: 18px;
}

.pdf_header_option_four_phone_number_span {
    font-size: 10px;
    padding-left: 24px;
    color: #707489;
    font-family: sans-serif;
}

.pdf_header_option_four_email_address_container_div {
    display: flex;
    height: 18px;
}

.pdf_header_option_four_email_address_span {
    font-size: 10px;
    padding-left: 24px;
    color: #707489;
    font-family: sans-serif;
}

.pdf_header_option_four_company_website_container_div {
    display: flex;
    height: 18px;
}

.pdf_header_option_four_company_website_span {
    font-size: 10px;
    padding-left: 24px;
    color: #707489;
    font-family: sans-serif;
}

.pdf_header_option_four_right_side_container_div {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 50%;
    border-left: 1px solid #707489;
}

.pdf_header_option_four_form_info_container_div {
    display: flex;
    flex-direction: column;
    height: 50%;
    width: 100%;
}

.pdf_header_option_four_form_title_container_div {
    display: flex;
    height: 20px;
    width: 100%;
    margin-top: 50px;
    justify-content: flex-end;
}

.pdf_header_option_four_form_title_span {
    font-size: 16px;
    font-weight: bold;
    color: black;
    padding-right: 15px;
    overflow-wrap: anywhere;
}

.pdf_header_option_four_form_owner_container_div {
    display: flex;
    height: 16px;
    width: 100%;
    margin-top: 5px;
    justify-content: flex-end;
}

.pdf_header_option_four_form_owner_span {
    font-size: 12px;
    padding-right: 15px;
    color: black;
    font-family: sans-serif;
}

.pdf_header_option_four_form_date_container_div {
    display: flex;
    height: 16px;
    width: 100%;
    justify-content: flex-end;
}

.pdf_header_option_four_form_date_span {
    font-size: 12px;
    padding-right: 15px;
    color: black;
    font-family: sans-serif;
}

.pdf_header_option_four_project_container_div {
    display: flex;
    height: 16px;
    width: 100%;
    justify-content: flex-end;
}

.pdf_header_option_four_project_span {
    font-size: 12px;
    padding-right: 15px;
    color: black;
    font-family: sans-serif;
}

.pdf_header_option_four_half_div_break_div {
    display: flex;
    height: 50%;
    width: 100%;
}


/**
    New System Library Section
*/
.page-title {
    color: var(--font-color-one); 
    margin-top: 10px;
}

.system-container-list {
    display: block;
    /* border- */
}

.system-container-list .system-logo {
    display: inline;
    max-width: 16px;
}

.system-container-list .system-name {
    display: inline;
}

.system-library-header .system-logo {
    display: inline;
    max-width: 32px;
}

.system-container-list {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    margin-top: 5px;
}

.system-category {
    background-color: #f0f0f0;
    padding: 5px 10px;
    margin: 5px;
    border-radius: 5px;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hidden-categories {
    display: none;  
}


.label-box {
    margin-top: 10px;
    margin-bottom: 10px;
    display: block;
    border: 1px solid #ccc; /* Light grey border */
    background-color: #f4f4f4; /* Light grey background */
    border-radius: 5px; /* Rounded corners for the box */ 
    width: 100%;
}

.label-box .label {
    display: inline-block;
    border-radius: 3px; /* Rounded corners for the box */ 
    color: rgb(0, 0, 0);
    background-color: #adb0b4; 
    margin: 2px;
    padding: 3px 5px;
    font-size: 14px;
    cursor: pointer;
}

.label-box .label:hover {
    background-color: #6d6e70; /* Jira-like blue background */
}

.system-library-about-section textarea {
    max-width: none;
    width: 100%;
    height: 60%;
}

div.dt-container.dt-empty-footer .dt-scroll-body {
    border-bottom:unset;
}

#aiMessages > div {
    border: 1px solid;
    border-radius: 5px;
    padding: 5px;
    margin: 5px;
    color: #fff;
}

#aiMessages > div.aiUser {
    background-color: #198754;
    border-color: #157347;
    margin-right: 30px;
}

#aiMessages > div.aiAssistant {
    background-color: #0d6efd;
    border-color: #0a58ca;
    margin-left: 30px;
}

#aiMessages > div.aiError {
    background-color: #dc3545;
    border-color: #b02a37;
    margin-left: 30px;
}

.loading_anim:after {
    overflow: hidden;
    display: inline-block;
    vertical-align: bottom;
    -webkit-animation: ellipsis steps(4,end) 900ms infinite;
    animation: ellipsis steps(4,end) 900ms infinite;
    content: "\2026"; /* ascii code for the ellipsis character */
    width: 0px;
}

@keyframes ellipsis {
    to {
        width: 1.25em;
    }
}

@-webkit-keyframes ellipsis {
    to {
        width: 1.25em;
    }
}

#tblItemsToUpdate tr {
    vertical-align: middle;
}

table.dataTable > tbody > tr > td.select-checkbox-aiupdate:before {
    top: 2.6em !important;
}

.portal-alert-danger {
    border: 1px solid #f5c6cb !important;
    background-color: #f8d7da !important;
    color: #721c24 !important;
}

.portal-alert-danger a {
    color:unset;
}

.portal-alert-info {
    border: 1px solid #bee5eb !important;
    background-color: #d1ecf1 !important;
    color: #0c5460 !important;
}

.portal-alert-info a {
    color: unset;
}

.portal-alert-warning {
    border: 1px solid #ffeeba !important;
    background-color: #fff3cd !important;
    color: #856404 !important;
}

.portal-alert-warning a {
    color: unset;
}

.nav-category {
    border-top: 1px solid #ddd;
    padding-top: 15px;
    margin-bottom: 15px;
}

.nav-category h6 {
    font-weight: 500;
    font-size: 12px;
    line-height:120%;
    color: #999;
    margin-bottom: 9px;
    padding-left: .5rem;
    padding-right: .5rem;
}

#rightContent {
    background-color: white;
    margin-left: 5px;
}


button.dt-button {
    background-color: var(--button-standard);
    border-color: var(--button-standard);
    color: #ffffff !important;
    border-radius: 8px;
    font-size: 10px;
    font-weight: 700;
    padding: 8px 24px;
}