body {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  overflow-x: hidden;
}

body,
p,
span,
div,
a {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  font-weight: normal;
}

textarea[disabled],
input[disabled],
select[disabled],
.has-error input[disabled] .has-error textarea[disabled],
.has-error select[disabled],
.has-error .input-text[disabled],
.has-success input[disabled],
.has-success textarea[disabled],
.has-success select[disabled] {
  background-color: #dddddd;
  border: 1px solid #dddddd;
  color: #ddd;
  cursor: not-allowed;
}

*:focus-visible {
  outline: none;
}

strong div,
strong span,
strong p {
  font-weight: bold;
}

body,
p,
span,
div {
  color: #636363;
}

iframe {
  border: 0px;
  text-align: left;
}

hr {
  border-color: rgba(0, 0, 0, 0.3);
}

fieldset legend {
  margin-bottom: 0;
  font-size: .875rem;
}

[contenteditable="true"]:focus {
  border: 1px solid #e5e5e5;
  outline: none;
  box-shadow: 1px 1px 4px #2c93e2;
  border-radius: 3px;
}
.row {
  margin-bottom: 0;
}

#page-wrapper {
  padding-top: 45px;
}
#page-wrapper.expand {
  padding-left: 0;
}
#page-wrapper.contract {
  padding-left: 275px;
}

#contentmain {
  padding-top: 0;
  background-color: #fff;
  border-radius: 5px;
  margin: 0 0 0;
  padding: 10px 0;
}

#caseChatContainer .card-title {
  margin-bottom: 0;
}
#caseChatContainer .card-header {
  padding: 5px;
}
#caseChatContainer .btn-icon {
  background-color: #f6f8f9;
}
#caseChatContainer .btn-icon:hover {
  background-color: #e7ecef;
}
#caseChatContainer .btn-icon .icon,
#caseChatContainer .btn-icon .fa {
  vertical-align: middle;
}

.page-item.active .page-link {
  background-color: #0063CC;
  border-color: #0063CC;
}

.nav-pills li {
  /* Override civica design system*/
  padding: 0;
  margin: 0;
  height: auto;
  line-height: normal;
  border-bottom: none;
  align-self: flex-end;
}
.nav-pills li a {
  padding: 0.675rem 1rem;
  border-bottom: none;
  border-radius: 3px;
  margin: 3px;
  line-height: normal;
  height: auto;
  color: #747474;
  border-radius: 3px;
}
.nav-pills li a span {
  color: #3174af;
}
.nav-pills li a:hover {
  border-bottom: none;
  color: #1f2937;
  background-color: #e5e7eb;
}
.nav-pills li .nav-link.active {
  color: #fff;
  background-color: #446cb3;
  position: relative;
}
.nav-pills .nav-link {
  color: #747474;
  font-weight: bold;
  border-bottom: none;
  margin-bottom: 0;
}
.nav-pills .nav-link [class^="ri-"],
.nav-pills .nav-link [class*=" ri-"] {
  font-size: 1rem;
  margin-right: 5px;
  vertical-align: bottom;
}
.nav-pills .nav-link:hover {
  background-color: #e5e7eb;
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: #3174af;
  color: #fff;
}
.nav-pills .tabdrop {
  top: 14px;
}
.nav-pills .tabdrop .dropdown-toggle {
  color: #2e2e2e;
  background-color: #edecec;
  border-radius: 4px;
}
.nav-pills .tabdrop .dropdown-toggle span {
  color: inherit;
}
.nav-pills .tabdrop .dropdown-menu {
  top: 100% !important;
  left: auto !important;
  right: 0;
  transform: translateX(-19px) !important;
}
.nav-pills .tabdrop .dropdown-menu .nav-link:hover {
  background-color: #d1d5db;
}

.nav-pills .tabdrop .dropdown-toggle:focus {
  box-shadow: none;
}

.nav-pills .tabdrop .dropdown-toggle:focus-visible {
  background-color: #e5e7eb;
  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px #006278 inset;
}

.nav-pills .tabdrop .dropdown-toggle:active {
  background-color: #c7cbd4;
}

.nav-pills .dropdown-menu .nav-item {
  display: block;
}

.nav-pills .dropdown-menu .nav-link {
  margin: 0;
  font-weight: normal;
}

@media (max-width: 767.5px) {
  .nav-pills .nav-item:not(.active) {
    display: inline-block;
  }
}
.tabbable .nav-pills {
  padding-left: 24px;
  padding-right: 16px;
  margin-left: -1rem;
  margin-right: -1rem;
}

a.dropdown-header {
  border-bottom: none;
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.3px;
}

.dropdown-menu,
.daterangepicker {
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.16);
}

/* Datepicker */
.daterangepicker .drp-calendar {
  position: relative;
  left: unset !important;
}

.daterangepicker select.monthselect,
.daterangepicker select.yearselect {
  font-size: initial;
  padding: 0;
  padding-left: 10px;
  width: auto;
}

/*overrride daterangepicker*/
#daterangepicker {
  width: auto;
  max-width: 500px;
}

.drp-calendar table:not(.not-responsive):not(.ui-datepicker-calendar) td,
.drp-calendar table:not(.not-responsive) th[scope="row"] {
  display: table-cell;
  text-align: center;
  padding: 5px;
}
.drp-calendar table:not(.not-responsive):not(.ui-datepicker-calendar) thead {
  position: relative;
}
.drp-calendar table:not(.not-responsive):not(.ui-datepicker-calendar) tr {
  margin-bottom: 0;
}

.Headline {
  font-size: 1.4rem;
  color: #1f2937;
  padding: 4px;
}

.back-link {
  display: block;
  padding-right: 10px;
  width: 100px;
  margin-bottom: 10px;
}

@media (min-width: 576px) {
  .daterangepicker .drp-selected {
    margin-top: 0.875rem;
  }
}
.heatmap a,
.heatmap a {
  text-decoration: none;
  display: block;
  border-collapse: separate;
  border-spacing: 0px 0px;
}

.ChartTab {
  background-color: #eeedf2;
  margin-top: 10px;
  padding-top: 8px;
  padding-bottom: 8px;
  padding-left: 8px;
  padding-right: 8px;
  border-radius: 4px;
  border: 1px solid #abb7d0;
}

.ChartBox {
  border-radius: 4px;
  padding: 2px;
  border: 1px solid #abb7d0;
  background-color: white;
  margin-left: 4px;
  margin-right: 4px;
  margin-bottom: 6px;
  margin-top: 6px;
}

/* Needed to ensure fusion charts display properly */
.tab-content {
  margin-top: 1rem;
}

.tab-content > .tab-pane.ChartTab {
  visibility: hidden;
  width: 0;
  height: 0;
  margin-top: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
}

.tab-content > .active.ChartTab {
  visibility: visible;
  width: 100%;
  height: auto;
  margin-top: 10px;
  padding-top: 8px;
  padding-bottom: 8px;
  padding-left: 8px;
  padding-right: 8px;
}

/* Edit Below to Customize Widths > 768px */
@media (min-width: 768px) {
  .ChartContainer {
    width: 100%;
  }
  .ChartRow {
    display: grid;
    grid-template-columns: 1fr minmax(0, 1fr);
    width: 100%;
  }

  .SpanFullWidth .ChartCell {
    grid-column: span 2;
  }
}
.RowButton {
  padding-bottom: 10px;
  vertical-align: bottom;
}

#DocumentCard .card.bg-light .card-header .card-title {
  background-color: #e5e7eb;
  font-size: 1rem;
}

.pvtCheckContainer label {
  line-height: normal;
}
.pvtCheckContainer label .pvtFilter {
  min-height: unset;
  margin-right: 5px;
  margin-bottom: 0;
}

#contentframetimeline {
  height: 3500px;
}

#iCaseworkContent > div h1 {
  line-height: 1.5;
}
#iCaseworkContent > div > span:not(#NavigableAlert) a:not(.dropdown-item) {
  padding: 6px;
  color: #4b5563;
  background-color: #e2e8f0;
  border: 1px solid #d8e0eb;
  border-radius: 4px;
}
#iCaseworkContent > div > span:not(#NavigableAlert) a:not(.dropdown-item):hover,
#iCaseworkContent
  > div
  > span:not(#NavigableAlert)
  a:not(.dropdown-item):focus {
  background-color: #4b5563;
  color: #e2e8f0;
  border-color: #4b5563;
}
#iCaseworkContent > div > span:not(#NavigableAlert) a[aria-label="Print"] {
  font-size: 12px;
  padding-bottom: 5px;
}

#previousimagetimeline,
#nextimagetimeline {
  border-bottom: none;
}

/* Hack for case view ->  managecase iframe */
#iCaseworkContent > .card.bg-light > .card-body > div > div div:nth-child(2) {
  width: auto;
}
@media (min-width: 768px) {
  #iCaseworkContent > .card.bg-light > .card-body > div > div > div {
    display: initial !important;
    max-width: unset !important;
  }
}
@media (max-width: 767px) {
  #iCaseworkContent > .card.bg-light > .card-body > div > div {
    flex-direction: column;
  }
  #iCaseworkContent > .card.bg-light > .card-body > div > div > div {
    width: 100% !important;
  }
}

.modal {
  display: none;
}

.modal-header .close {
  order: 1;
}

.list-group {
  list-style: none;
}

.list-group-item-heading {
  margin-bottom: 0;
  line-height: 1.4;
}
.list-group-item:hover {
  background-color: #f6f8f9;
  border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}
.list-group-item-text {
  margin-bottom: 0;
}
.list-group-item.active {
  background-color: #3174af;
  border-color: #3174af;
  color: #fff;
}
.list-group-item.active h4,
.list-group-item.active h5,
.list-group-item.active p {
  color: #fff;
  margin-bottom: 0;
}

.hide {
  display: none !important;
}

.scrollableMenu {
  height: auto;
  max-height: 500px;
  overflow-x: hidden;
}

/* Chartlist js */
.ct-series-a .ct-bar,
.ct-series-a .ct-line,
.ct-series-a .ct-point,
.ct-series-a .ct-slice-donut {
  stroke: #3174af !important;
}

.ct-label {
  color: #1f2937 !important;
}

.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
}
.well.well-sm {
  padding: 9px;
}

#resize-controller {
  transition: all 0.2s ease-in-out;
  width: 20px;
  height: 100vh;
  position: absolute;
  top: 0;
  right: 0;
}
#resize-controller:hover {
  opacity: 1;
  visibility: visible;
  width: 8px;
  background-color: rgba(3, 105, 161, 0.9);
  cursor: move;
}

#logo-leftmenu {
  display: none;
}

.has-error small.help-block::before {
  font-family: FontAwesome, Arial, Helvetica, sans-serif;
  content: "\f06a";
  font-size: inherit;
  padding-right: 5px;
}

.error-summary {
  margin-bottom: 10px;
  border: 1px solid #a92131;
  background-color: #fcf5f5;
  color: #a92131;
}
.error-summary .text-danger {
  color: #a92131 !important;
}

.error-summary-title {
  color: #a92131;
}

.error-summary-list li a {
  font-family: FontAwesome, Arial, Helvetica, sans-serif;
  color: #a92131;
  border-bottom: none;
  position: relative;
  display: inline-block;
  overflow: hidden;
  transition: all 0.15s linear;
}
.error-summary-list li a::before {
  content: "\f06a";
  font-size: inherit;
  padding-right: 5px;
}
.error-summary-list li a::after {
  content: "";
  position: absolute;
  display: block;
  bottom: 0;
  width: 100%;
  height: 1px;
  background-color: #5a0000;
  transform: translateX(16px);
}
.error-summary-list li a:hover::after {
  height: 2px;
  background-color: #a92131;
}

#calendar {
  padding-top: 15px;
  width: 95%;
  font-family: "Arial", Verdana, Sans-Serif;
  margin: 0 auto;
}

.status__case-assignment > div:first-child {
  display: inline-block;
  font-weight: bold;
}
.status__case-assignment > div:first-child > div {
  font-weight: bold;
}

#sessionTimeoutLabel,
#signedOutLabel {
  font-size: 18px;
  line-height: 1.4;
}

#FindCustomer {
  margin-bottom: 0.875rem;
}

.list-group-item {
  padding: 8px;
}

.list-group-item.active {
  background-color: rgb(42, 55, 88);
  border-color: rgb(42, 55, 88);
}

.list-group-item.active h4,
.list-group-item.active h5,
.list-group-item.active p,
.list-group-item-heading,
.list-group-item-text {
  font-size: 0.875rem;
}

.list-group-item p {
  margin-bottom: 0;
}

.list-group-item-heading {
  font-weight: bold;
}

.list-group-item.active .list-group-item-heading {
  color: #fff;
}
.user-name-section {
  margin-top: -20px !important;
  margin-left: -10px;
  margin-right: -10px;
  padding: 30px !important;
  background-color: #f3f3f3;
  margin-bottom: 20px;
  border-bottom: 1px solid #ddd;
}

.ace_editor,
.ace_editor * {
  font-family: monospace !important;
  font-size: 12px !important;
  direction: ltr !important;
  text-align: left !important;
}

#managecase {
  min-height: 600px;
}

.input-hidden-accessible {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  -webkit-clip-path: inset(50%) !important;
  clip-path: inset(50%) !important;
  height: 1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
  white-space: nowrap !important;
}

.contentmain-title > .fa {
  margin-right: 5px;
}

.jqSimpleConnect {
  z-index: 100;
}

div[id*="CaseImageList"] {
  position: relative;
}

.img-thumbnail {
  background-color: transparent;
  padding: 0;
}

.img-thumbnail > img {
  max-height: 100px;
  max-width: 100px;
  will-change: transform;
}

.img-thumbnail:hover > img {
  transform: scale(2);
  transform-origin: cennter;
  box-shadow: 0 3px 6px rgba(0,0,0,.16);
  cursor: pointer;
}

.kanban-container main {
  background-color: inherit;
}
@keyframes rotate-center {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.alert {
  min-height: unset;
  padding: 1rem;
}
.alert * {
  font-weight: normal;
}
.alert div {
  display: block;
}
.alert > .fa,
.alert .ui-pnotify-icon {
  font-size: 18px;
  color: #0096ef;
  position: relative;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
}
.alert .fa {
  font-weight: 900;
}
.alert .ui-pnotify-icon {
  color: inherit;
}
.alert span {
  color: inherit;
}
.alert #NavigableAlert {
  padding: 5px 0 5px 5px;
  width: calc(100% - 50px);
}

.alert-warning {
  background-color: #fff4e5;
  color: #8d692a !important;
  border: none;
}
.alert-warning div,
.alert-warning span,
.alert-warning p {
  color: inherit;
}
.alert-warning hr {
  border-top-color: #8d692a;
}
.alert-warning > .fa,
.alert-warning .ui-pnotify-icon,
.alert-warning .ui-pnotify-icon span {
  color: #ef7a19;
}

.alert-success {
  background-color: #edf7ed;
  color: #436645 !important;
  border: none;
}
.alert-success div,
.alert-success span,
.alert-success p {
  color: inherit;
}
.alert-success hr {
  border-top-color: #436645;
}
.alert-success > .fa,
.alert-success .ui-pnotify-icon,
.alert-success .ui-pnotify-icon span {
  color: #418945;
}

.alert-error > .fa,
.alert-danger > .fa {
  color: #e16d6d;
}

.alert-danger {
  border: none;
  background-color: #fdeded;
  color: #723938 !important;
}
.alert-danger div,
.alert-danger span,
.alert-danger p {
  color: inherit;
}

.alert-danger .icon {
  color: #e16d6d;
}

.alert-info {
  border: none;
  background-color: #e5f6fd;
  color: #014361 !important;
}
.alert-info div,
.alert-info span,
.alert-info p {
  color: inherit;
}
.alert-info hr {
  border-top-color: #014361;
}
.alert-info .icon,
.alert-info .fa,
.alert-info .ui-pnotify-icon,
.alert-info .ui-pnotify-icon span {
  color: #1993d5;
}

.ui-pnotify {
  width: auto;
  max-height: 90vh;
  overflow-y: auto;
}
.ui-pnotify div {
  color: inherit;
  font-size: 0.875rem;
  vertical-align: middle;
  overflow-wrap: break-word;
}
.ui-pnotify h4 {
  color: inherit;
  font-weight: bold;
  font-size: 1.15rem;
}
.ui-pnotify .ui-pnotify-icon {
  font-size: 1.25rem;
  padding: 1px;
}
.ui-pnotify .ui-pnotify-shadow {
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.16);
}
.ui-pnotify .fa {
  display: inline;
  position: relative;
  vertical-align: middle;
}

button.close {
  color: #9ca3af;
  min-width: auto;
  font-size: 20px;
}

.btn__text {
  line-height: 1;
}

.btn-secondary .fa {
  color: #fff;
}

.btn-group .btn:not(:last-child) {
  margin-right: 1rem;
}

.btn.btn-link {
  min-width: auto;
  transition: none;
}
.btn-link:hover {
  border: none;
  text-decoration: underline;
}
.btn-link:focus {
  outline: 1px solid #2c93e2;
  box-shadow: none;
  border: none !important; /* override for CDS .btn */
}
.btn:not(.btn-link):not(.MenuButton),
.btn-sm {
  background-color: #d1d5db;
  color: #374151;
  font-weight: normal;
}
.btn-sm.btn-link {
  background-color: transparent;
}
.btn:not(.btn-link):not(.MenuButton) .fa,
.btn-sm .fa {
  color: inherit;
}
.btn:not(.btn-link):not(.MenuButton):hover,
.btn:not(.btn-link):not(.MenuButton):focus,
.btn-sm:hover,
.btn-sm:focus {
  background-color: #c0c0c0;
  color: #374151;
}

.btn-sm.btn-link:hover {
  background-color: #e6e6e6;
}

.btn,
.btn-sm {
  margin-top: 0.5rem;
}

.dataTable tbody [id*="priority"] .dropdown-toggle {
  color: #0369a1;
  background-color: #f0f9ff;
  display: inline-block;
  padding: 4px 7px !important;
  margin: 0 5px !important;
  border: 1px solid #dbeef9;
}
.dataTable tbody [id*="priority"] .dropdown-toggle:hover,
.dataTable tbody [id*="priority"] .dropdown-toggle:focus {
  background-color: #0369a1;
  color: #f0f9ff;
}
.dataTable tbody [id*="priority"] .dropdown-toggle.text-danger {
  color: #c00000;
  background-color: #fcf5f5;
  display: inline-block;
  padding: 4px 7px !important;
  margin: 0 5px !important;
  border: 1px solid #ffebeb;
}
.dataTable tbody [id*="priority"] .dropdown-toggle.text-danger:hover,
.dataTable tbody [id*="priority"] .dropdown-toggle.text-danger:focus {
  background-color: #c00000;
  color: #fcf5f5;
}
.dataTable tbody [id*="priority"] .dropdown-toggle.text-danger:hover {
  color: #fff !important;
}
/*override date in datatable */
table.dataTable th.dt-type-numeric, 
table.dataTable th.dt-type-date, 
table.dataTable td.dt-type-numeric, 
table.dataTable td.dt-type-date {
  text-align: left;
}

.btn-table-icon {
  font-size: 12px;
  color: #0369a1;
}

.btn.MenuButton {
  background: #ffffff !important;
  text-align: left !important;
  border: 1px solid #ccc !important;
  padding: 6px;
  color: #636363;
  font-weight: normal;
  margin-bottom: 0.6em;
}

.form-row .btn.MenuButton {
  margin-top: 0;
}

select {
  -moz-appearance: auto;
  -o-appearance: auto;
  -webkit-appearance: auto;
}
select.input-text {
  width: auto;
}

input,
select {
  min-height: 40px;
}

input[type="file"] {
  padding: 5px;
}

input[readonly],
textarea[readonly] {
  background-color: #e5e7eb;
  border-bottom: 1px solid #c4cedd;
}
input[readonly]:focus,
textarea[readonly]:focus {
  background-color: #e5e7eb;
  border-bottom: 1px solid #c4cedd;
}

.input-group {
  align-items: flex-start;
}
.input-group input,
.input-group .input-text,
.input-group .mce-tinymce {
  flex: 1 1 auto;
  width: 1%;
  min-width: 0;
  position: relative;
}
.input-group .mce-tinymce {
  width: 1% !important;
}
.input-group .input-group-append .fa {
  display: inherit !important;
  font-size: 1.1rem;
}
.input-group a.input-group-append {
  cursor: pointer;
  border-bottom: none;
}
.input-group a.input-group-append:hover {
  border-bottom: none;
}

.form-row > .col,
.form-row > [class*="col-"] {
  padding-top: 0;
  padding-bottom: 0;
}

.form-group {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.form-group input,
.form-group select {
  margin-bottom: 0.6em;
}

.validation-group {
  display: contents;
}
.validation-group > .form-text {
  width: 100%;
  padding-left: 5px;
  margin-bottom: 5px;
}

.FindCase {
  margin-bottom: 0;
}

.radio > label > input {
  min-height: auto;
  margin-right: 5px;
}

@media (min-width: 768px) {
  .form-horizontal .form-label,
  .form-horizontal .control-label {
    padding-top: 5px;
    text-align: right;
    align-self: flex-start;
    margin-bottom: 0;
  }
}
.form-label,
label {
  align-self: center;
}

@media (max-width: 575px) {
  .form-label,
  label {
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}
.checkbox-wrapper,
.radio-wrapper {
  margin: 0;
}
.checkbox-wrapper.small input:checked + label::before,
.radio-wrapper.small input:checked + label::before {
  background-color: #0284c7;
  border-color: #0284c7;
}
.checkbox-wrapper.small input:checked + label::after,
.radio-wrapper.small input:checked + label::after {
  color: #fff;
}

.radio-wrapper.small input:checked + label::after {
  background-color: #fff;
}

.checkbox-wrapper.small input + label::before {
  border-radius: 3px;
}
@media (max-width: 576px) {
  .checkbox-wrapper.small label {
    margin-right: 0.5rem;
  }
}

li.ui-menu-item a.ui-menu-item-wrapper {
  border-bottom: 0 !important;
}

.FindCase input {
  margin-bottom: 0;
}
.FindCase .input-group-append .fa {
  font-size: 0.875rem;
  width: auto;
}

.input-text {
  border: 1px solid #949494;
  margin-bottom: 0.6em;
}
.input-text:focus {
  border: 1px solid #0284c7;
}

@media (min-wdith: 768px) {
  select,
  select.input-text {
    width: auto;
  }
}
@media (min-width: 992px) {
  #refContainer,
  #nameContainer,
  #forenameContainer,
  #phoneContainer,
  #emailContainer,
  #postcodeContainer,
  #addressContainer {
    width: 33.33%;
    display: inline-flex;
    margin-top: 0;
  }
  #refContainer [class*="col-"],
  #nameContainer [class*="col-"],
  #forenameContainer [class*="col-"],
  #phoneContainer [class*="col-"],
  #emailContainer [class*="col-"],
  #postcodeContainer [class*="col-"],
  #addressContainer [class*="col-"] {
    max-width: 100%;
    flex-grow: 1;
    align-self: center;
    padding-top: 0;
  }
}
@media (max-width: 991px) {
  #refContainer,
  #nameContainer,
  #forenameContainer,
  #phoneContainer,
  #emailContainer,
  #postcodeContainer,
  #addressContainer {
    margin-bottom: 10px;
    margin-top: 0;
  }
}
@media (min-width: 576px) {
  .input-text.FormControlSmall {
    width: 12rem;
    max-width: 100%;
  }
  .input-text.FormControlMedium {
    width: 24rem;
    max-width: 100%;
  }
  .input-group.FormControlSmall {
    width: 12rem;
    max-width: 100%;
  }
  .input-group.FormControlMedium {
    width: 24rem;
    max-width: 100%;
  }
}
.FormDesignHandle .dropdown-toggle {
  border-bottom: none;
}
.FormDesignHandle .dropdown-toggle::after {
  display: none;
}
.FormDesignHandle .menu-item-text {
  word-break: break-all;
  white-space: normal;
}

/* Ratecard css */
.ratecard-radio-label {
  display: inline-block;
  position: relative;
  margin: 0 !important;
  min-width: 30px;
}
.ratecard-radio-label label.ratecard-radio-overlay {
  width: 100%;
  min-height: 30px;
  line-height: 27px;
  border-radius: 3px;
  transition: all 0.15s ease-in-out;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 3px 3px 3px 0;
}
.ratecard-radio-label label.ratecard-radio-overlay::before,
.ratecard-radio-label label.ratecard-radio-overlay::after {
  display: none;
}
.ratecard-radio-label span {
  color: inherit;
  position: relative;
  display: inline-block;
}
.ratecard-radio-label input[type="radio"] {
  opacity: 0;
  height: 20px;
  min-width: 30px;
  margin-left: 0;
}
.ratecard-radio-label input[type="radio"]::before,
.ratecard-radio-label input[type="radio"]::after {
  display: none;
}
.ratecard-radio-label input[type="radio"]:checked ~ .ratecard-radio-overlay {
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
  border-radius: 3px;
  color: #1f2937;
  width: auto;
  text-align: center;
  padding-top: 2px;
  font-weight: bold;
  min-width: 24px;
}
.ratecard-radio-label
  input[type="radio"]:checked
  ~ .ratecard-radio-overlay
  span {
  background-color: #fff;
  width: 100%;
}

.ratecard-radio-label:nth-of-type(-n + 3) .ratecard-radio-overlay {
  background-color: #dc2626;
}

.ratecard-radio-label .ratecard-radio-overlay {
  background-color: #d97706;
}

.ratecard-radio-label:nth-last-of-type(-n + 3) .ratecard-radio-overlay,
.ratecard-radio-label:nth-of-type(3):nth-last-of-type(2)
  .ratecard-radio-overlay {
  background-color: #059669;
}

.ratecard-radio-label:first-of-type:nth-last-of-type(2) .ratecard-radio-overlay,
.ratecard-radio-label:first-of-type:nth-last-of-type(3) .ratecard-radio-overlay,
.ratecard-radio-label:first-of-type:nth-last-of-type(4)
  .ratecard-radio-overlay {
  background-color: #dc2626;
}

.ratecard-radio-label:nth-of-type(2):nth-last-of-type(2)
  .ratecard-radio-overlay,
.ratecard-radio-label:nth-of-type(2):nth-last-of-type(3)
  .ratecard-radio-overlay,
.ratecard-radio-label:nth-of-type(3):nth-last-of-type(3)
  .ratecard-radio-overlay,
.ratecard-radio-label:nth-of-type(3):nth-last-of-type(4)
  .ratecard-radio-overlay,
.ratecard-radio-label:nth-of-type(3):nth-last-of-type(5)
  .ratecard-radio-overlay,
.ratecard-radio-label:nth-of-type(4):nth-last-of-type(3)
  .ratecard-radio-overlay,
.ratecard-radio-label:nth-of-type(6):nth-last-of-type(3)
  .ratecard-radio-overlay {
  background-color: #d97706;
}

#scrollOn .btn,
#scrollBack .btn {
  height: auto;
}

.header-content {
  width: 100%;
  justify-content: space-between;
}

@media (min-width: 1201px) {
  .header-dropdown-content {
    right: 0;
  }
}
.header-dropdown-content .left-menu-link:hover {
  color: #fff;
}
.header-dropdown-content .left-menu-link:focus .left-menu-item {
  border: none;
}
.header-dropdown-content .left-menu-link:focus .left-menu-item .menu-item-text {
  color: #fff;
  border-bottom-color: #fff;
}
.header-dropdown-content .left-menu-link .left-menu-item {
  color: #fff;
  padding: 0;
  background-color: transparent;
}
.header-dropdown-content .left-menu-link .left-menu-item:hover {
  background-color: transparent;
}
.header-dropdown-content .left-menu-link .left-menu-item:hover .menu-item-text {
  color: #fff;
  border-bottom-color: #fff;
}
.header-dropdown-content li a {
  color: #fff;
}
.header-dropdown-content li a:hover {
  background-color: #367f8c;
}
.header-dropdown-content li a .menu-item-text {
  color: #fff;
}

.navlink-icon {
  padding-right: 1.25rem;
}
.navlink-icon [class^="icon"] {
  vertical-align: middle;
}
.navlink-icon .navlink-text {
  display: none;
  color: #fff;
}
@media (min-width: 1201px) {
  .navlink-icon .navlink-text {
    display: inline-block;
  }
}
a:focus {
  box-shadow: 0 0 0 1pt #2c93e2;
}
a:focus .navigation-menu .fa {
  color: #0284c7;
}

.navigation-menu {
  background-color: inherit;
}
.navigation-menu .fa {
  color: #fff;
  vertical-align: middle;
  font-size: 2rem;
}

.navbar-nav > li > a {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.navbar-toggler {
  margin-top: 7px;
}

.nav-items .navbar-toggler {
  height: 100%;
  padding-top: 10px;
  margin-top: 0;
}

.nav-items .navbar-toggler:focus {
  background-color: #0c4a6e;
}
.navbar-toggler .fa {
  color: #fff;
}

@media (min-width: 1201px) {
  .left-menu:not(.collapsed) {
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #d4d4d8 #f3f4f6;
  }
}

.left-menu-item .fa,
.left-menu-item .icon {
  color: #1f2937;
}

.left-menu {
  padding-top: 1em;
  z-index: 800;
}
.left-menu ul {
  padding: 0 10px;
}
.left-menu .accordion-header {
  margin-bottom: 0;
}
.left-menu .accordion-header-btn {
  background-color: white;
}
.left-menu .accordion-header-btn:hover {
  background-color: #d1d5db;
}
.left-menu .accordion-header-btn .accordion-control .icon {
  color: #0284c7;
  font-size: 1rem;
}
.left-menu .accordion-text {
  color: #1f2937;
}
@media (min-width: 1201px) {
  .left-menu .accordion-content .left-menu-item {
    background-color: #e5e7eb;
  }
}
.left-menu .accordion-content {
  background-color: #e5e7eb;
}
.left-menu .accordion-content .dropdown-header {
  padding-left: 3px;
  white-space: break-spaces;
}
.left-menu .accordion-content .dropdown-header .fa {
  margin-right: 0;
}
.left-menu .accordion-content .dropdown-header:first-child {
  padding-top: 10px;
}
.left-menu .accordion-content ul {
  padding-left: 5px;
  padding-right: 5px;
}
.left-menu .accordion-content li a {
  color: #1f2937;
  display: flex;
  padding: 6px 6px 6px 12px;
  align-items: flex-start;
}
.left-menu .accordion-content li a .fa {
  margin-right: 8px;
  padding-top: 3px;
}
.left-menu .accordion-content li:hover,
.left-menu .accordion-content li:focus,
.left-menu .accordion-content li a:focus {
  background-color: #d1d5db;
  box-shadow: none;
}
.left-menu #reportLibraryList li a {
  padding: 6px 6px 6px 12px;
  display: flex;
  align-items: flex-start;
  line-height: 1.5;
  color: #1f2937;
}
.left-menu #reportLibraryList li a .fa {
  color: #1f2937;
  margin-right: 8px;
  padding-top: 3px;
}
.left-menu #reportLibraryList li:hover a,
.left-menu #reportLibraryList li:focus a {
  color: #1f2937;
}
.left-menu #reportLibraryList li:hover a .fa,
.left-menu #reportLibraryList li:focus a .fa {
  color: #1f2937;
}
@media (max-width: 1200px) {
  .left-menu.shown-mobile {
    display: block;
  }
}

.menu-item-text--collapsed-hover {
  display: inline-block !important;
  position: fixed !important;
  background-color: #1f2937;
  color: #f3f4f6 !important;
  padding: 7px;
  left: 51px;
  transform: translateY(-10px);
  border-left: none;
  box-shadow: rgba(0, 0, 0, 0.19) 9px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
  transition: all 0.15s linear;
}
.menu-item-text--collapsed-hover::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 10px solid #1f2937;
  position: absolute;
  left: -10px;
}

.left-menu-user {
  font-size: 16px;
  padding: 10px;
  background: #fff;
  border: 1px solid #cbcbcb;
  border-radius: 3px;
  font-weight: bold;
}

.user-last-update {
  margin-bottom: 0.5rem;
}

.MultiColumn {
  max-width: 500px;
  width: 500px;
}
.MultiColumn ul {
  border-left: 1px solid #e5e5e5;
}
.MultiColumn li a {
  line-height: 1.4;
}
.MultiColumn li a .menu-item-text,
.MultiColumn li a .fa {
  color: #636363;
}
.MultiColumn li a .menu-item-text {
  font-weight: 300;
}

.MultiColumnTitle {
  font-size: 1rem;
  font-weight: bold;
  padding: 0 0 0 1rem;
}

.MultiColumnTitle h5 {
  padding-left: 1rem;
}

.dropdown-toggle:focus {
  border-bottom: none;
  box-shadow: none;
}

.dropdown-menu li a {
  display: block;
  width: 100%;
  padding: 0.25rem 1.5rem;
  clear: both;
  color: #5a5c5e;
  text-align: inherit;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
  position: relative;
}
.dropdown-menu li a:hover,
.dropdown-menu li a:focus {
  border-bottom: none;
  background-color: #d1d5db;
  color: #1f2937;
  box-shadow: none;
}
.dropdown-menu li a:hover .caret,
.dropdown-menu li a:focus .caret {
  color: inherit;
}
.chips {
  padding-left: 0;
  margin-left: -5px;
  list-style: none;
}

.chips li {
  display: inline-block;
  padding-left: 5px;
  padding-right: 5px;
}

.chip .close {
  margin-left: 6px;
  opacity: 1;
  font-size: inherit;
  color: #3174af;
}

.chip .close span {
  pointer-events: none;
}

.select2-container {
  margin-bottom: 0.4em;
}
.select2-container .select2-selection--multiple .select2-selection__rendered {
  margin-bottom: 0;
}
.select2-container .select2-selection--multiple .select2-search__field {
  margin: 0 0 0 5px;
  min-height: auto;
}
.select2-container
  .select2-selection--multiple
  .select2-search.select2-search--inline {
  margin-top: 5px;
  display: inline-block;
  width: 100%;
}
.select2-container .select2-search--inline .select2-search__field {
  margin-top: 1px;
  margin-left: 10px;
}

.select2-container--default
  .select2-selection--multiple
  .select2-selection__choice {
  padding: 0rem 0.25rem;
  background-color: #d1d5db;
  color: #1f2937;
  border-radius: 10px;
  display: inline-flex;
  font-size: 0.875em;
  border-color: #9ca3af;
  padding: 0 7px;
}
.select2-container--default
  .select2-selection--multiple
  .select2-selection__choice:hover {
  border: 1px solid rgb(42, 55, 88);
}

.select2-container--default
  .select2-selection--multiple
  .select2-selection__choice__remove {
  border-right: none;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0px;
  position: relative;
  padding: 0;
  color: #0284c7;
  order: 1;
}

.select2-container--default
  .select2-selection--multiple
  .select2-selection__choice__display {
  color: #1f2937;
}

.select2-container--default .select2-selection--single {
  min-height: 40px;
  padding: 0.5rem 0;
  border-color: #949494;
}

.select2-container--default
  .select2-selection--single
  .select2-selection__arrow {
  top: 8px;
}

.select2-container--default
  .select2-selection--single
  .select2-selection__rendered {
  line-height: 1.5;
}

.select2-container--default
  .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: #0284c7;
}
.select2-container--default
  .select2-results__option--highlighted.select2-results__option--selectable
  div {
  color: #fff;
}

.select2-container--default .select2-selection--multiple {
  border-color: #1f2937;
  min-height: 35px;
}
.select2-container--default
  .select2-selection--multiple
  .select2-selection__rendered
  li {
  padding-bottom: 0;
}
.select2-container--default
  .select2-selection--multiple
  .select2-selection__rendered
  li:hover {
  background-color: rgb(42, 55, 88);
}
.select2-container--default
  .select2-selection--multiple
  .select2-selection__rendered
  li:hover
  .select2-selection__choice__remove {
  background-color: transparent;
}
.select2-container--default
  .select2-selection--multiple
  .select2-selection__rendered
  li:hover
  .select2-selection__choice__remove
  span,
.select2-container--default
  .select2-selection--multiple
  .select2-selection__rendered
  li:hover
  .select2-selection__choice__display {
  color: #fff;
}
.select2-container--default
  .select2-search--inline
  .select2-search__search-field {
  margin-top: 0;
}
.select2-container--default.select2-container--focus
  .select2-selection--multiple {
  border: 1px solid #0284c7;
  box-shadow: 0 0 0 3pt rgba(44, 147, 226, 0.3);
}
.select2-container--default
  .select2-results__option--highlighted[aria-selected] {
  background-color: #0284c7;
}
.select2-container--default
  .select2-results__option--highlighted[aria-selected]
  div {
  color: #fff;
}

.select2-container--default
  .select2-selection--single
  .select2-selection__clear {
  height: auto;
  margin-top: -2px;
}

/* Chatbot css */
#webchatContainer {
  width: 400px;
  margin: 0 !important;
}
#webchatContainer.expanded {
  height: auto;
}
@media screen and (min-width: 768px) {
  #webchatContainer.expanded {
    height: 460px;
  }
}
#webchatContainer #webchatTitleBar .chat,
#webchatContainer #webchatTitleBar .chat span {
  color: #fff;
}

.webchat__send-box-text-box__input {
  margin: 0;
  box-shadow: none;
}

.webchat__send-box__text-box {
  padding: 5px;
}

#openChat .fa {
  padding: 0 3px;
}

#openChat span {
  color: #fff;
}

.card {
  min-height: auto;
  margin: 0 0 10px 0;
  box-shadow: none;
}
.card .card-title {
  color: #fff;
  line-height: normal;
  margin-bottom: 0;
  font-size: 1rem;
}
.card .card-title .fa {
  margin-right: 5px;
}
.card .card-title .flag-colour {
  color: #fbd1c8;
}
.card .card-title .label {
  vertical-align: middle;
}
.card .card-header {
  padding: 0.625rem 1rem;
}
.card .card-header small {
  color: inherit;
}
.card .card-header a {
  color: #fff;
  border-bottom: none;
}
.card .card-header a:hover {
  border-bottom: none;
}
.card .card-header .reopen-case-btn a {
  color: #fff;
  text-decoration: none;
  background-color: #3a4d7b;
  padding: 4px 8px;
  border-radius: 4px;
  display: block;
}
.card .card-header .reopen-case-btn a:hover {
  background-color: #43578c;
}
.card .card-header .reopen-case-btn a:focus {
  background-color: #222c47;
}
.card h4 {
  font-size: 0.875rem;
}
.card.bg-light {
  background-color: #fff !important;
  box-shadow: 0 1px 2px rgba(56, 65, 74, 0.15);
}
.card.bg-light .card-header {
  background-color: #e5e7eb;
  color: #3174af;
  border-color: transparent;
}
.card.bg-light .card-header .card-title {
  color: #1f2937;
  font-size: 1rem;
  font-weight: bold;
}
.card.bg-light .card-header .card-title a {
  font-size: inherit;
  font-weight: bold;
  color: #0b346e;
}
.card.bg-light .card-header .card-title a span {
  color: inherit;
}
.card.bg-light .card-header .card-title a .fa {
  color: inherit;
}
.card.bg-light .card-header .card-title a:hover {
  text-decoration: underline;
}
.card.bg-light .card-header a {
  color: #3174af;
}
.card.bg-light .card-header small {
  color: inherit;
}
.card.bg-light .card-body table tr:hover {
  background-color: #f3f3f6;
}
.card.bg-light .collapse .card-body {
  background-color: #fcfbff;
}
.card .card-body .card .card-header {
  background-color: #e5e7e8;
  color: #0b346e;
  border-color: #dddddd;
}
.card .card-body .card .card-header a {
  color: #0b346e;
}
.card .card-body .card .card-title {
  color: #0b346e;
  font-weight: bold;
}

.card-body .btn-group {
  vertical-align: baseline;
}
.card:not(.bg-light) #mainheading,
.card:not(.bg-light) .mainheading {
  background-color: rgb(42, 55, 88);
  border-bottom: none;
}
.card:not(.bg-light) #mainheading .card-title,
.card:not(.bg-light) .mainheading .card-title {
  align-items: center;
  color: #fff;
}
.card:not(.bg-light) #mainheading .card-title div,
.card:not(.bg-light) #mainheading .card-title span,
.card:not(.bg-light) #mainheading .card-title p,
.card:not(.bg-light) .mainheading .card-title div,
.card:not(.bg-light) .mainheading .card-title span,
.card:not(.bg-light) .mainheading .card-title p {
  color: #fff;
}
.card:not(.bg-light) #mainheading h1,
.card:not(.bg-light) .mainheading h1 {
  font-size: 1rem;
  font-weight: bold;
}
.card:not(.bg-light) #mainheading h2,
.card:not(.bg-light) .mainheading h2 {
  font-size: 15px;
}

.mainheading-container .card-title {
  width: calc(100% - 200px);
  display: inline-block;
}
.mainheading-container .mainheading-rightcol {
  float: right;
}
.mainheading-container .mainheading-rightcol::after {
  content: "";
  display: table;
  clear: both;
}

.mainheading-container .mainheading-rightcol .fa {
  color: #fff;
}

.card-body {
  padding: 0.5rem;
}

.card-header #docs,
.card-header #bundles,
.card-header #spreadsheets,
.card-header #images,
.card-header #audio,
.card-header #links,
.card-header #emails,
.card-header #attachments,
.card-header #showalldocs {
  display: inline-block;
}

#card-title__actions > div {
  display: inline-block;
}

#card-title__actions > div + div {
  margin-left: 10px;
}

.card .card-title #card-title__actions > div a {
  color: #3174af;
}

.card.bg-light .card-header .card-header-buttons {
  display: inline-block;
  position: relative;
}
.card.bg-light .card-header .card-header-buttons a {
  cursor: pointer;
  color: #1e40af;
}
.card.bg-light .card-header .card-header-buttons .notesDiv {
  position: absolute;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
  z-index: 1000;
}
.card.bg-light .card-header .card-header-buttons .notesDiv #Notes {
  width: 300px;
  height: 300px;
  padding: 0.625rem;
  background-color: #fff;
}

table td,
table th[scope="row"] {
  padding: 0;
  vertical-align: middle;
}
@media (max-width: 991px) {
  table td,
  table th[scope="row"] {
    padding: 0.5rem;
  }
}
table td a {
  border-bottom: none;
}
table td a:hover {
  border-bottom: none;
}

table.not-responsive thead th {
  border-bottom: 1px solid #e5e5e5;
  width: unset !important;
}
table.not-responsive td {
  border-bottom: 1px solid #e5e5e5;
}
table.not-responsive td,
table.not-responsive th {
  padding: 0.5rem;
}
table.not-responsive.ActionsCompleted thead th:first-child {
  width: 140px !important;
}

table:not(.not-responsive):not(.ui-datepicker-calendar) thead {
  position: relative;
}
@media screen and (max-width: 992px) {
  table:not(.not-responsive):not(.ui-datepicker-calendar) thead {
    position: relative;
  }
}

th {
  color: #636363;
}
th div {
  font-weight: bold;
}

.table td,
.table th {
  vertical-align: middle;
}

.treetable tbody tr.leaf td a,
.treetable tbody .branch td a {
  display: inline-block;
}
.treetable .dropdown-menu .dropdown-item,
.treetable .dropdown-menu a {
  line-height: normal;
}

.treetable tbody tr.leaf td .btn-group {
  vertical-align: baseline;
}

@media (max-width: 768px) {
  table.dataTable.nowrap th,
  table.dataTable.nowrap td {
    white-space: normal;
  }
}
.dt-con {
  top: 12px;
  width: 0.8em;
  height: 0.8em;
  display: none;
  left: 0;
  position: absolute;
}
.dt-con::before {
  top: 50%;
  left: 50%;
  height: 0.8em;
  width: 0.8em;
  margin-top: -0.5em;
  margin-left: -0.5em;
  display: block;
  position: absolute;
  color: white;
  border: 0.15em solid white;
  border-radius: 1em;
  box-shadow: 0 0 0.2em #444;
  box-sizing: content-box;
  text-align: center;
  text-indent: 0 !important;
  font-family: "Courier New", Courier, monospace;
  line-height: 0.9;
  content: "+";
  background-color: #2c93e2;
}

.responsive-control .dt-con {
  display: inline-block;
}

.parent .dt-control::before {
  content: "-";
  background-color: #a92131;
}

table.treetable span.menu-item-text {
  padding-left: 0;
}

/* overrride dataTables css */
div.dt-container .row:first-child {
  margin-bottom: 0;
}
div.dt-container .row:first-child [class*="col-"] {
  padding-top: 0;
  padding-bottom: 0;
}
div.dt-container .row:first-child .ml-auto {
  display: flex;
}
div.dt-container #document-category-filter select {
  margin-left: 0.5em;
  display: inline-block;
}
div.dt-container .row {
 width: 100%;
 margin: 0;
}
div.dt-container .row .col-12 {
  padding: 0;
}
@media (max-width: 768px) {
  div.dt-container .row:first-child .col-sm-12.col-md-6:first-child {
    display: none;
  }
}
div.dt-container [class*="col-"] div.dt-search label {
  font-weight: bold;
}
@media (max-width: 767px) {
  div.dt-container [class*="col-"] div.dt-search {
    text-align: right;
  }
}

table.dataTable td,
table.dataTable th {
  position: relative;
}
/* Prevent overflow of dataTable on small screen size inside tabs */
.tab-panel .ChartBox .dt-container {
  width: 95%;
}
table.dataTable input.dt-select-checkbox {
  min-height: auto;
}

@media (max-width: 500px) {
  .tabbable .dt-container {
    width: 95%;
  }
}
@media (max-width: 991px) {
  #tableFilter {
    float: none;
    display: block;
  }
  #tableFilter label {
    width: 100%;
  }
}
.dataTable tbody tr:hover {
  background-color: #f3f4f6;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}
.dataTable tbody tr:hover .table__expand-link,
.dataTable tbody tr:hover .btn-group button {
  opacity: 1;
}

.dt-search {
  text-align: right;
}
.dt-search label {
  margin-bottom: 0;
  display: flex;
}
.dt-search label input {
  margin-bottom: 0;
  color: #0284c7;
  border-color: #949494;
}
.dt-search label input:focus {
  outline: 0;
  box-shadow: 0 0 0 3pt #2c93e2;
  border: 2px solid #0284c7;
}
@media (max-width: 576px) {
  .dt-search label {
    width: 100%;
  }
  #casedocuments_wrapper .dt-search label {
    width: auto;
  }
  .dt-search label input {
    max-width: unset;
    width: calc(100% - 35px) !important;
  }
}

@media (max-width: 768px) {
  table.dataTable.nowrap th,
  table.dataTable.nowrap td.child {
    white-space: normal;
  }
}
/* datatable responsive icons */
table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:focus:before, 
table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control:focus:before {
  box-shadow: 0 0 0 1pt #2c93e2;
}
table.dataTable.dtr-inline.collapsed
  > tbody
  > tr.parent
  > td.dtr-control:before,
table.dataTable.dtr-inline.collapsed
  > tbody
  > tr.parent
  > th.dtr-control:before {
  content: "\f068";
  background-color: transparent;
}

@media (max-width: 992px) {
  table:not(.not-responsive):not(.ui-datepicker-calendar) tr {
    box-shadow: none;
    border: none;
    display: table-row;
  }
  table:not(.not-responsive):not(.ui-datepicker-calendar) td,
  table:not(.not-responsive) th[scope="row"] {
    border-bottom: none;
    text-align: left;
    padding: 0.5rem;
    display: table-cell;
  }
}
table.dataTable > tbody > tr.child ul.dtr-details > li:last-child {
  padding-bottom: 0.5em;
}
/*Override for table-responsive, as there are some tables which are using BS3 table classes */
.table.table-responsive {
  display: table;
  padding: 0.5rem;
}

#tabST1 table {
  width: 100%;
}

#tablecasedocuments .btn-group .btn {
  white-space: break-spaces;
  text-align: left;
}

#categoryFilter,
#categoryList {
  margin: 0 0 0 8px;
}

@media (max-width: 767px) {
  #categoryFilter {
    display: none;
  }
}
.tooltip {
  z-index: 2200;
}
.tooltip .tooltip-inner {
  background-color: #525252;
  color: #fff;
  box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08),
    0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
  max-width: none;
}
.tooltip.show {
  opacity: 1;
}

.tooltip-icon {
  display: inline-flex;
  width: 24px;
  height: 24px;
  align-items: center;
  justify-content: center;
  transition: all 0.15s linear;
}
.tooltip-icon:hover {
  background-color: rgba(31, 41, 55, 0.2);
  border-radius: 50%;
}

.bs-tooltip-auto[x-placement^="bottom"] .arrow::before,
.bs-tooltip-bottom .arrow::before {
  border-bottom-color: #525252;
}

.bs-tooltip-auto[x-placement^="right"] .arrow::before,
.bs-tooltip-right .arrow::before {
  border-right-color: #525252;
}

.bs-tooltip-auto[x-placement^=left] .arrow::before,
 .bs-tooltip-left .arrow::before {
  border-left-color: #525252;
 }

 .bs-tooltip-auto[x-placement^=top] .arrow::before, 
 .bs-tooltip-top .arrow::before {
  border-top-color: #525252;
 }

/* Service menu */
.ServiceNavbar {
  display: inline-block;
  background-color: rgb(42, 55, 88);
  padding: 10px 10px 5px 10px;
  box-shadow: 0 1px 2px rgba(56, 65, 74, 0.15);
  margin-bottom: 1rem;
}
.ServiceNavbar .navbar-brand {
  font-size: 1rem;
  display: inline;
  margin-right: 0;
  padding: 5px 5px 5px 10px;
}

.ServiceNavbar > div {
  border-radius: 0px;
  background-color: rgb(42, 55, 88);
}

.ServiceNavbar a {
  border-bottom-color: #1f2937;
  font-size: 0.875rem;
}

.ServiceNavbar .fa {
  color: inherit;
}

.ServiceNavbar > .navbar-collapse > ul > .dropdown,
.ServiceNavbar > .navbar-collapse > ul > .dropdown > a {
  padding: 5px;
}

.ServiceNavbar .navbar-toggler span.fa {
  color: #fff;
  vertical-align: middle;
}

.ServiceNavbar .nav-item,
.ServiceNavbar .nav-link {
  height: auto;
  line-height: 1.4;
}

.navbar-dark.ServiceNavbar .navbar-toggler {
  padding: 3px 8px;
  margin-top: 0px;
  margin-bottom: 0px;
  margin-right: 0px;
  border-radius: 2px;
}

#searchBtn {
  display: inline-block;
  font-size: 1.125rem;
  line-height: 2.65;
  height: auto;
  padding: 0 10px;
}

@media (min-width: 768px) {
  #mobileSearch {
    width: 400px;
  }
}
.search-input__container {
  display: flex;
  position: relative;
  width: 100%;
}
.search-input__container label {
  position: absolute;
  font-size: 1rem;
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
  background-color: white;
  color: gray;
  padding: 0 0.3rem;
  margin: 0 0.5rem;
  transition: 0.1s ease-out;
  transform-origin: left top;
  pointer-events: none;
}
.search-input__container .search-input__image {
  color: #4b5563 !important;
  position: absolute;
  left: 10px;
  opacity: 0;
  align-self: center;
}
.search-input__container .input-text {
  font-size: 1rem;
  width: 100%;
  margin-bottom: 0;
  min-height: 38px;
  margin-left: 20px;
  padding-left: 10px;
  border: 1px solid #4b5563;
  transition: 0.1s all ease-out;
}
.search-input__container .input-text:focus {
  border: 1px solid #075985;
  padding-left: 30px;
  margin-left: 0;
}
.search-input__container .input-text:focus ~ .search-input__image {
  opacity: 1;
}
.search-input__container .input-text:focus + label {
  color: #075985;
  top: 0;
  transform: translateY(-50%) scale(0.9);
}
.search-input__container .input-group-append {
  display: inline-block;
  line-height: normal;
  background-color: #d1d5db;
  padding: 10px 7px;
}
.search-input__container .input-group-append .input-group-text {
  border-radius: 0;
  background-color: transparent;
  border: none;
  padding: 0;
  color: #1f2937;
}

.ServiceNavbar .nav.navbar-nav > li > a.nav-link .caret {
  font-family: "FontAwesome";
}

.ServiceNavbar .nav.navbar-nav > li > a.nav-link .caret::before {
  content: "\f0d7";
}

.ServiceNavbar .nav-link .sub-arrow {
  display: none !important;
}

.ServiceNavbar .navbar-dark .navbar-nav .nav-link {
  color: #fff;
  font-weight: normal;
}

.navbar-dark.ServiceNavbar .navbar-nav .dropdown-menu .nav-link {
  color: #1f2937;
}

@media (max-width: 767px) {
  .ServiceNavbar {
    border: none;
    border-radius: 5px;
    min-height: 35px;
    position: fixed;
    top: 4px;
    right: 25px;
    z-index: 2001;
    background-color: inherit;
    box-shadow: none;
    padding: 5px 5px 2px 5px;
  }
  .ServiceNavbar > .navbar-header > .navbar-brand {
    height: 35px;
    display: none;
  }
  .ServiceNavbar > div {
    background-color: inherit;
  }
  .ServiceNavbar li {
    padding-left: 0;
  }
  .ServiceNavbar .navbar-header {
    align-self: flex-end;
  }
  .ServiceNavbar .navbar-nav {
    padding: 8px 0;
  }
  .ServiceNavbar .navbar-collapse {
    background-color: #fff;
    box-shadow: 0px 5px 20px -5px rgba(9, 62, 82, 0.35);
    max-width: 100%;
    position: fixed;
    top: 50px;
    left: 0px;
    right: 0px;
    width: 100%;
    max-height: 500px;
    overflow-y: auto;
  }
  .ServiceNavbar .navbar-nav .nav-link {
    color: #1f2937;
    padding-left: 1rem;
    padding-top: 4px;
    padding-bottom: 4px;
    border-bottom: none;
  }
  .ServiceNavbar .navbar-nav .nav-link:hover,
  .ServiceNavbar .navbar-nav .nav-link:focus {
    background-color: #3174af;
    color: #fff;
  }
  .navbar-dark.ServiceNavbar .navbar-nav .show > .nav-link {
    color: #1f2937;
  }
  .navbar-dark.ServiceNavbar .navbar-nav .nav-link:focus,
  .navbar-dark.ServiceNavbar .navbar-nav .nav-link:hover {
    color: #fff;
    background-color: #3174af;
  }
  .ServiceNavbar .nav-link .sub-arrow {
    display: block !important;
  }
  .ServiceNavbar .nav.navbar-nav > li > a.nav-link .caret {
    display: none;
  }
}
@media (min-width: 768px) {
  .ServiceNavbar .navbar-nav .nav-link {
    padding-bottom: 0;
    font-family: "Museo Sans", "Helvetica Neue", Helvetica, Arial sans-serif;
  }
  .ServiceNavbar .navbar-nav .dropdown-menu .has-submenu {
    padding-right: 1rem;
    position: relative;
    white-space: normal;
    padding-left: 24px;
    font-weight: normal;
    width: 20em;
  }
  .ServiceNavbar .navbar-nav .dropdown-menu .has-submenu .caret {
    font-family: "FontAwesome";
    font-style: normal;
    position: relative;
    float: right;
    right: 0;
  }
  .ServiceNavbar .navbar-nav .dropdown-menu .has-submenu .caret::before {
    content: "\f0da";
    color: inherit;
  }
  .ServiceNavbar .navbar-nav .dropdown-item {
    padding-top: 0;
    padding-bottom: 0;
  }
}
@media (min-width: 768px) {
  .ServiceNavbar .navbar-nav .nav-link {
    color: #fff;
    font-weight: normal;
  }
}
/* Civica design system override */
textarea {
  max-width: none;
}

.datepicker {
  position: absolute;
  height: auto;
}

.clockpicker-popover.bottom {
  bottom: unset !important;
  box-shadow: 0 6px 12px rgba(9, 62, 82, 0.35);
}

.datepicker.datepicker-dropdown table thead .prev,
.datepicker.datepicker-dropdown table thead .next {
  padding: 8px;
}
.datepicker.datepicker-dropdown table thead .datepicker-switch {
  font-weight: normal;
}
.datepicker.datepicker-dropdown table thead .dow {
  font-weight: normal;
  padding: 9px 4px;
}
.datepicker.datepicker-dropdown table thead tr:nth-child(2) {
  background-color: #f1faff;
}
.datepicker.datepicker-dropdown table tbody .day {
  background-color: #f6f8f9;
  border: 1px solid #e5e5e5;
}
.datepicker.datepicker-dropdown table tbody .today {
  background-color: #fbb040;
}

.datepicker table tr td.active.active,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active.disabled.active,
.datepicker table tr td.active.disabled.disabled,
.datepicker table tr td.active.disabled:active,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active.disabled:hover.active,
.datepicker table tr td.active.disabled:hover.disabled,
.datepicker table tr td.active.disabled:hover:active,
.datepicker table tr td.active.disabled:hover:hover,
.datepicker table tr td.active.disabled:hover[disabled],
.datepicker table tr td.active.disabled[disabled],
.datepicker table tr td.active:active,
.datepicker table tr td.active:hover,
.datepicker table tr td.active:hover.active,
.datepicker table tr td.active:hover.disabled,
.datepicker table tr td.active:hover:active,
.datepicker table tr td.active:hover:hover,
.datepicker table tr td.active:hover[disabled],
.datepicker table tr td.active[disabled] {
  background-color: #3174af;
  background-image: none;
}

table > tbody > tr > td > span.footable-toggle {
  opacity: 1;
}

.fooicon::before {
  font-family: FontAwesome !important;
}

#jsPanel-replacement-container,
.jsPanel-minimized-box,
.jsPanel-minimized-container {
  background-color: #f6f8f9;
}

#jsPanel-replacement-container .jsPanel-replacement,
.jsPanel-minimized-box .jsPanel-replacement,
.jsPanel-minimized-container .jsPanel-replacement {
  background-color: #f6f8f9 !important;
  border: 1px solid #f0f0f0;
}

.jsPanel-content img {
  max-width: 100%;
}

.jsPanel-btn {
  color: #fff;
}
.jsPanel-btn span {
  color: inherit;
}
.jsPanel .jsPanel-content {
  padding: 10px;
}

/* jQuery UI */
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
  background-color: #3174af;
}

.ui-menu-item {
  padding-left: 0;
}

.has-error .help-block {
  color: #a92131;
  font-size: 0.875rem;
  font-family: inherit;
  font-weight: normal;
  margin-bottom: 0.5rem;
}
.has-error .input-text,
.has-error .mce-tinymce {
  border: 1px solid #a92131;
}
.has-error label {
  color: #a92131;
}

.has-success .input-text,
.has-success .mce-tinymce {
  border: 1px solid #086d52;
}
.has-success .input-text:focus,
.has-success .mce-tinymce:focus {
  border: 1px solid #0284c7;
}
.has-success .form-text,
.has-success .form-label {
  color: #086d52;
}

.more-search {
  width: 300px;
  left: auto;
  background-color: #fff;
  top: 3.5em;
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  position: absolute;
  box-shadow: 0px 5px 20px -5px rgba(0, 0, 0, 0.253);
}

.dropdown {
  z-index: unset;
}
.dropdown .fa {
  color: #3174af;
  font-size: 1rem;
}

.dropdown-item:hover,
.dropdown-item:focus {
  background-color: #d1d5db;
  color: #1f2937;
}
.dropdown-item:hover span,
.dropdown-item:hover i,
.dropdown-item:focus span,
.dropdown-item:focus i {
  color: inherit;
}
.dropdown-item:hover .caret,
.dropdown-item:focus .caret {
  color: inherit;
}

.dropdown-menu .dropdown-header {
  padding: 0.25rem 1.5rem;
  line-height: 1.5;
}
.dropdown-menu .dropdown-divider {
  padding: 0;
}
@media (max-width: 991px) {
  .dropdown-menu {
    max-width: 400px;
  }
  .dropdown-menu li a {
    white-space: normal;
  }
  .sm-collapsible .dropdown-menu {
    max-width: unset;
  }
}

@media (max-width: 991px) {
  .collapsedDropdown .dropdown-menu {
    min-width: 300px !important;
  }
}

.input-group-append .btn {
  margin: unset;
  min-width: unset;
  min-height: unset;
}

.btn.dropdown-toggle i.fa-caret-down {
  display: none;
}

.navbar-brand:hover {
  border-bottom: none;
}

.nav-items,
.nav-item-list {
  overflow-y: visible;
  overflow-x: visible;
}

.nav-item input {
  line-height: 1.5;
}

.nav-items {
  max-width: none;
}
.nav-items.view-more {
  color: #fff;
}

.left-menu-item div,
.left-menu-item span,
.left-menu-item p {
  color: #545f6e
}

.menu-item-text {
  color: #545f6e
}

@media (max-width: 767.5px) {
  .nav-items-row {
    display: none;
    position: absolute;
    top: 50px;
    left: 0;
    width: 100%;
    background-color: #fff;
    box-shadow: 0px 5px 20px -5px rgba(9, 62, 82, 0.35);
  }
  .nav-items-row .nav-item {
    display: inline-block;
  }
  .nav-items-row .nav-item .nav-link {
    color: #1f2937;
  }
  .nav-items-row .nav-item .nav-link .fa {
    color: #1f2937;
  }
}
@media (min-width: 768px) {
  .nav-items-row {
    display: block !important;
  }
}

.nav-item-list .fa:not(.input-group-text) {
  color: #fff;
}
.nav-item-list > li {
  padding: 0 0.5rem;
  margin: 0 0.25rem;
  border-bottom: 0 solid transparent;
  vertical-align: middle;
}
@media (min-width: 768px) {
  .nav-item-list > li span:not(.menu-item-text) {
    color: #fff;
  }
}
@media (max-width: 767px) {
  .nav-item-list > li .fa.HelpIcon {
    color: #1f2937;
  }
}
.nav-item-list > li:not(.nav-item) {
  line-height: 3.5em;
}
.nav-item-list .dropdown .left-menu-link:focus .left-menu-item {
  background-color: inherit;
  border: none;
}
.nav-item-list .dropdown .left-menu-link:hover .left-menu-item div,
.nav-item-list .dropdown .left-menu-link:hover .left-menu-item span,
.nav-item-list .dropdown .left-menu-link:hover .left-menu-item p {
  color: #1f2937;
}
.nav-item-list .dropdown .left-menu-item {
  padding: 0;
  background-color: inherit;
}
.nav-item-list .dropdown .left-menu-item:hover {
  background-color: inherit;
}
.nav-item-list .dropdown .left-menu-item:hover .menu-item-text {
  border-bottom: none;
  color: #1f2937;
}
.nav-item-list .nav-item {
  font-size: 0.875rem;
}

.nav-link span {
  color: inherit;
  padding-left: 5px;
}

.top-header {
  background-color: #0284c7;
  background: linear-gradient(180deg, #075985, #0c4a6e);
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.16);
  z-index: 800;
}
.top-header .logo {
  margin-left: 10px;
}
.top-header .logo span {
  color: #fff;
}
.top-header .left-menu {
  width: 270px;
  border-color: #e5e7eb;
  border-width: 1px;
  box-shadow: 20px 0 40px rgba(0, 0, 0, 0.341);
  background-color: #f3f4f6;
}
.top-header .left-menu .menu-item-text {
  position: relative;
}
.top-header .left-menu a {
  line-height: 1.5;
}
.top-header .left-menu .badge {
  color: #e0f2fe;
  font-weight: bold;
  background-color: #0369a1;
  border: 1px solid #0369a1;
  float: right;
  font-weight: normal;
  font-size: 11px;
  line-height: 1.2;
}
.top-header .left-menu .left-menu-item {
  background-color: inherit;
}
.top-header .left-menu .left-menu-item:hover,
.top-header .left-menu .left-menu-item:focus {
  background-color: #d1d5db;
}
.top-header .left-menu .left-menu-item:hover .menu-item-text,
.top-header .left-menu .left-menu-item:focus .menu-item-text {
  border-bottom: none;
  color: #1f2937;
}
.top-header .left-menu .left-menu-item:hover .fa,
.top-header .left-menu .left-menu-item:focus .fa {
  color: #1f2937;
}
.top-header .left-menu .fa {
  color: #545f6e;
  margin-right: 1rem;
  font-size: 1rem;
  width: 1.28571429em;
  text-align: center;
}
.top-header .left-menu .left-menu-user .fa {
  margin-right: 0px;
  color: inherit;
}
.top-header .left-menu .left-menu-user .flag-colour {
  color: #99402e;
  font-size: 0.875rem;
}
.top-header .left-menu .left-menu-user .flag-colour:hover {
  color: #853828;
  background-color: transparent;
}
.top-header .left-menu .left-menu-user .ui-btn .fa {
  color: inherit;
}
.top-header .left-menu .active {
  background-color: #e5e7eb;
  border-radius: 0px;
  box-shadow: -4px 0 0 #0369a1;
}
.top-header .left-menu .active .left-menu-item {
  background-color: transparent;
}
.top-header .left-menu .active .left-menu-item .menu-item-text {
  color: #0369a1;
  font-weight: bold;
}
.top-header .left-menu .active .fa {
  color: #0369a1;
  font-weight: bold;
}
@media (min-width: 1201px) {
  .top-header .left-menu {
    background-color: #f3f4f6;
    box-shadow: none;
  }
}
.top-header .dropdown-menu.show {
  max-height: 600px;
  overflow-y: auto;
}
.top-header .dropdown-menu li .fa {
  margin-right: 5px;
  padding: 0;
  color: #5a5c5e;
}
.top-header #authDropdown + .dropdown-menu li .fa-caret-right {
  display: none;
}
.top-header .dropdown-menu li a {
  line-height: 1.5;
  height: auto;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.top-header .dropdown-menu li a:hover {
  color: #1f2937;
}
.top-header .dropdown-menu li a:hover .fa {
  color: inherit;
}

.list-inline-item {
  padding-left: 0;
}

/*pagination*/
.pagination {
  margin-top: 10px;
  flex-wrap: wrap;
}
.pagination li {
  margin: 0 3px;
}
.pagination a {
  display: block;
  font-size: 0.875rem;
  box-shadow: rgb(255, 255, 255) 0px 0px 0px 0px inset,
    rgb(209, 213, 219) 0px 0px 0px 1px inset, rgba(0, 0, 0, 0) 0px 0px 0px 0px;
  margin-bottom: 5px;
  color: #636363;
  border-radius: 4px;
}
.pagination a:hover {
  background-color: #f3f4f6;
  box-shadow: rgb(255, 255, 255) 0px 0px 0px 0px inset,
    rgb(209, 213, 219) 0px 0px 0px 1px inset, rgba(0, 0, 0, 0) 0px 0px 0px 0px;
}
.pagination .active a {
  background-color: #dbeafe;
  color: #1d4ed8;
}

#uploadDiv .bg-info,
#iCaseworkContent .bg-info {
  background-color: #ebf7ff !important;
}

.label {
  overflow: hidden;
  color: #fff;
  background-color: #0284c7;
  border-radius: 4px;
  display: inline-block;
  line-height: 1;
  padding: 7px;
}
.label.label-default {
  background-color: #66686e;
}
.label span {
  color: #fff;
}

.MenuButton .caret {
  border-top-color: #333 !important;
}

.WhiteHover {
  color: white !important;
}

.RowButton a {
  border-bottom: none;
}

div.has-error .select2-selection {
  border-color: #a92131 !important;
}

.ReadOnlyDiv {
  min-height: 30px;
  text-align: middle;
  border: 1px solid #dddddd;
  padding: 5px;
}

.ReadOnlySpan {
  display: inline-block;
  vertical-align: middle;
  line-height: normal;
}

.InlineInputSmall {
  min-height: 35px;
  margin-bottom: 0.4em;
  width: 9em;
  margin-left: 4px;
  margin-right: 6px;
}

/* Bootstrap 4 text-* colors does not pass AA contrast check, so we overrride it */
.text-warning {
  color: #b05b01 !important;
}

.text-danger {
  color: #c00000 !important;
}

.text-success {
  color: #436645 !important;
}

.text-info {
  color: #014361 !important;
}

#tabSTbody4 #actionsCompletedDiv {
  margin-top: 1rem;
}

#tabDO #attachmentList table td,
#tabDO #documents table td {
  word-break: break-word;
}

/* Document List */
.tabheading #docs,
.tabheading #bundles,
.tabheading #spreadsheets,
.tabheading #images,
.tabheading #audio,
.tabheading #links,
.tabheading #emails,
.tabheading #attachments,
.tabheading #showalldocs {
  display: none;
  padding-left: 3px;
}

#tabheading #showalldocs {
  padding-right: 1em;
}

.document-list-filters .nav-pills {
  display: inline-block;
  width: 100%;
}

.document-list-filters .attachments {
  display: inline-block;
  vertical-align: top;
  position: relative;
  margin-left: 10px;
}

.document-list-filters .attachments label {
  background-color: #f3f4f6;
  color: #404040;
  margin-bottom: 0;
  padding: 8px;
}

.document-list-filters .attachments label:hover {
  background-color: #e5e7eb;
  cursor: pointer;
}

.document-list-filters .attachments input {
  opacity: 0;
  position: absolute;
  width: 0;
  height: 0;
}

.document-list-filters .attachments input:checked ~ label {
  background-color: #dee5f2;
  color: #404040;
  border-radius: 7px;
}

.document-list-filters .attachments label .fa::before {
  content: "\f067";
}

.document-list-filters .attachments input:checked ~ label .fa::before {
  content: "\f00c";
}

.document-list-filters .nav-pills > li > a {
  color: #404040;
  padding: 8px;
  background-color: transparent;
  display: inline-flex;
  align-items: center;
}

.document-list-filters .nav-pills .nav-link {
  margin: 0 8px 0 0;
}

.document-list-filters .attachments input {
  margin-right: 2px;
}

.document-list-filters .nav-pills > li > a .badge {
  color: #1e242c;
  background: #dfdfdf;
  margin-left: 5px;
}

.document-list-filters .nav-pills > li > a:hover {
  background-color: #e5e7eb;
}

.document-list-filters .nav-pills > li.nav-item-deleted:has(.badge-zero) {
  display: none;
}

.document-list-filters .nav-pills li.disabled > a {
  color: rgba(0, 0, 0, 0.38);
  background-color: #fafafa;
  padding: 11px 8px;
}

.document-list-filters .nav-pills li.disabled > a:hover {
  color: rgba(0, 0, 0, 0.38);
  background-color: #fafafa;
}

.document-list-filters .nav-pills .nav-item > .nav-link.active {
  background-color: #dee5f2;
  color: #404040;
}

.document-list-filters .nav-pills .nav-item > .nav-link.active .badge {
  background-color: #0369a1;
  color: #dbeafe;
}

.document-list-filters__container {
  display: flex;
  margin-bottom: 10px;
}

.document-list-filters__container .nav-link i {
  color: #005a9e;
  transform: scale(1.15);
}

.document-list-filters__container .dropdown-menu .badge {
  display: none;
}

.document-list-filters__container .dropdown-menu .nav-item {
  display: block;
}

.document-list-filters__container .nav-pills .dropdown-menu .nav-link:hover {
  background-color: #d1d5db;
}

.document-list-filters__container
  .nav-pills
  .dropdown-menu
  .disabled
  .nav-link:hover {
  cursor: not-allowed;
}

.document-list-filters .nav-pills .tabdrop {
  top: 0;
  width: 63px;
}

.document-list-filters .tabbable {
  min-width: 500px;
}

/* Document Folder */
#tabDO .table-row {
  cursor: pointer;
}

#tabDO .selected {
  background-color: #deecf9 !important;
  color: black;
}
#tabDO table.dataTable.table > tbody > tr.selected > * {
  box-shadow: unset;
  color: unset;
}

#sidepanel.d-none #grabhandle,
#sidepanel.d-none #excol {
  display: none;
}

#sidepanel tr[data-tt-id] {
  border-top: 2px solid transparent;
  border-bottom: 2px solid transparent;
}

#sidepanel tr[data-tt-id] td {
  border: 1px solid transparent;
}

#sidepanel.droppable tr[data-tt-id] td {
  pointer-events: none; /* suppress drag events on tr children */
  border: 1px solid grey;
}

#sidepanel.droppable tr[data-tt-id].dropover td {
  background-color: lightgrey;
}

.side-panel {
  display: block;
  width: 250px;
  flex-shrink: 0;
  padding: 10px;
  color: #000000;
  background: rgb(243, 243, 243);
  border-right: 1px solid #ddd;
}

.side-panel-toggle {
  width: 10px;
  height: 25px;
  flex-grow: 1;
  display: grid;
  place-items: center;
  color: #000000;
  background: #ffffff;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 0px;
}

.sp-icon-close {
  display: none !important;
}

.side-panel-open .side-panel {
  display: initial;
}

.side-panel-open .sp-icon-open {
  display: initial !important;
}

.side-panel-open .sp-icon-close {
  display: none !important;
}

.documentWrapper {
  display: flex;
}

.documents-list__wrapper {
  position: relative;
  z-index: 2;
  background-color: #fff;
}

.documents-list__wrapper #casedocuments {
  table-layout: auto;
  width: 100%;
}

#tabDObody {
  flex-grow: 1;
  padding: 0px;
  overflow-y: auto;
}

#tabDO table.treetable {
  table-layout: fixed;
  min-width: 200px;
}

#tabDO table.treetable tbody tr td {
  display: block;
  padding: 0.3em 0.7em;
}

#tabDO table.treetable .fa-folder {
  color: #2085e2;
}

#tabDO table.treetable tr.selected {
  background-color: #e5e7eb;
  color: #404040;
}

#tabDO table.treetable tr.expanded i.fa-folder::before {
  content: "\f07c";
}

#tabDO table.treetable tr.branch {
  background-color: transparent;
}

#tabDO table.treetable tr.selected.branch {
  background-color: #e5e7eb;
  color: #404040;
}

#tabDO table.treetable span {
  background-position: center left;
  background-repeat: no-repeat;
  padding: 0 0 0 0;
}

#tabDO table.treetable span.Text {
  width: 100px;
  word-break: break-word;
  display: inline-block;
}

#tabDO table.treetable span.Text:hover {
  cursor: pointer;
}

.folder-row__content {
  display: flex;
}

.folder-name {
  display: inline-flex;
}

#tabDO table.treetable tr.collapsed.selected span.indenter a,
#tabDO table.treetable tr.expanded.selected span.indenter a {
  filter: brightness(0.5);
}

#context-menu {
  background-color: #ffffff;
  box-shadow: 0 0 20px rgba(37, 40, 42, 0.22);
  color: #1f194c;
  width: 10em;
  padding: 0.8em 0.6em;
  font-size: 1.3rem;
  position: fixed;
  visibility: hidden;
  z-index: 1;
}

#context-menu .item {
  padding: 0.3em 1.2em;
}

#context-menu .item:hover {
  background-color: #e5e5e5;
  cursor: pointer;
}

#context-menu .item .fa {
  padding-right: 5px;
}

.wrapper {
  color: #000000;
  border-right: 1px solid #ddd;
  /* Use flexbox */
  display: flex;
  position: relative;
}

.box {
  padding: 10px;
  background-color: #f9fafb;
  color: #404040;
  flex-shrink: 0;
  border-right: 1px solid #ddd;
  /* Use box-sizing so that element's outerwidth will match width property */
  box-sizing: border-box;
  width: 250px;
  position: relative;
  opacity: 1;
  visibility: visible;
}

#movable {
  position: fixed;
  z-index: 1;
  opacity: 1;
  visibility: hidden;
}

@media (min-widht: 768px) {
  .document-list-filters .tabbable {
    width: 550px;
  }
}

@media (min-width: 991px) {
  .document-list-filters .tabbable {
    width: 650px;
  }
}

@media (max-width: 1200px) {
  .scroll-style {
    width: 230px;
    height: 400px;
    overflow: hidden;
  }
}

@media (min-width: 1201px) {
  .scroll-style {
    width: 230px;
    height: 600px;
    overflow: hidden;
  }
  .document-list-filters .tabbable {
    width: 100%;
  }
}

#moveable:hover .scroll-style {
  overflow-y: auto;
}

#moveable:hover .scroll-style::-webkit-scrollbar {
  width: 0.5em;
}

/* This sets the colour of the scrollbar background. You may not need this if you want a scrollbar with no background*/
#moveable:hover .scroll-style::-webkit-scrollbar-track {
  background: transparent;
}

/* This sets the colour of the scrollbar */
#moveable:hover .scroll-style::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.1);
}

.element-transition {
  opacity: 0;
  visibility: hidden;
}

.resize-controller {
  position: absolute;
  top: 0;
  right: -4px;
  bottom: 0;
}

.handler {
  position: absolute;
  width: 24px;
  padding: 0;
  cursor: ew-resize;
  left: 100%;
  top: 0;
  bottom: 0;
  z-index: 3;
}

.handler:hover .handler-shadow {
  background: #0ea5e9;
  position: absolute;
  left: -3px;
  top: 0;
  bottom: 0;
  width: 2px;
}

.center {
  position: relative;
  top: 60px;
  left: 8px;
  background: #ffffff;
  color: #404040;
  transition: background 0.1s ease, color 0.1s ease, padding-left 0.1s ease,
    padding-right 0.1s ease, transform 0.1s ease;
  text-align: center;
  cursor: pointer;
  border: 1px solid #ddd;
  border-radius: 20px;
  padding: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 3;
}

.center .fa {
  font-size: 10px;
}

.center:hover {
  background: #2085e2;
  color: #ffffff;
  border-color: #2085e2;
}

.nav-item.active {
  border-bottom: none;
}

#casedocuments th.sorting:empty::before,
#casedocuments th.sorting:empty::after {
  display: none;
}

#documents .nav-pills .nav-link {
  font-weight: normal;
}

#documents .nav-pills .nav-item.disabled .nav-link {
  cursor: not-allowed;
  pointer-events: none;
}

.dashboard-loader {
  width: 48px;
  height: 48px;
  border: 3px solid #0284c7;
  border-radius: 50%;
  display: inline-block;
  position: relative;
  box-sizing: border-box;
  animation: rotation 0.5s linear infinite;
}
.dashboard-loader::after {
  content: "";
  box-sizing: border-box;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 3px solid;
  border-color: #075985 transparent;
}
.dashboard-loader-container {
  position: absolute;
  background: #f9fafb;
  width: 100%;
  left: 0;
  top: 0;
  bottom: 0;
  z-index: 500;
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s ease-in;
}
.dashboard-loader-container.active {
  opacity: 1;
  visibility: visible;
}
.dashboard-loader-inner {
  position: absolute;
  top: 50vh;
  left: 50%;
  z-index: 1000;
  transform: translateY(-50%);
}
.dashboard-loader-text {
  font-weight: bold;
  display: block;
}

.top-nav-left {
  width: auto;
}

@media (max-width <= 575px) {
  .nav-item-list {
    padding: 0;
  }
}
@media (max-width: 768px) {
  .top-nav-left {
    z-index: 800;
  }
}
@media (max-width: 1200px) {
  .nav-items {
    max-width: -moz-fit-content;
    max-width: fit-content;
  }
}
@media (min-width: 768px) {
  .dl-horizontal dd {
    margin-left: 160px;
    max-width: 280px;
  }
  .dl-horizontal dt {
    letter-spacing: -0.6px;
    width: 140px;
    text-align: left;
    margin-bottom: 3px;
    white-space: normal;
    float: left;
    clear: both;
  }
}
@media (max-width: 990px) and (min-width: 767.5px) {
  .top-nav-left {
    width: auto;
  }
  .nav-items {
    margin-left: 5px;
  }
  .nav-item {
    padding: 0 5px;
  }
}
@media (max-width: 767px) {
  .nav-item-list {
    width: 100%;
    display: flex;
    justify-content: space-evenly;
  }
  .navbar-nav .dropdown .dropdown-menu {
    box-shadow: none;
    border: none;
  }
  select.input-text {
    width: 100%;
  }
  .card-body {
    padding: 5px;
  }
  .container-fluid {
    padding-left: 5px;
    padding-right: 5px;
  }
}
#overdue > a,
#new > a,
#untouched > a,
#soon > a,
#showall > a {
  display: none;
}

@media (min-width: 576px) {
  #overdue {
    padding: 6px 5px;
    background-color: #fcf5f5;
    border: 1px solid #ffebeb;
  }
  #overdue .text-danger strong {
    color: inherit;
  }
  #overdue > a {
    display: inline;
    border: none !important;
    background-color: transparent !important;
  }
  #overdue:hover,
  #overdue:focus {
    background-color: #c00000;
    border-color: #c00000;
  }
  #overdue:hover .text-danger,
  #overdue:hover .text-danger strong,
  #overdue:focus .text-danger,
  #overdue:focus .text-danger strong {
    color: #fcf5f5 !important;
  }
  #untouched,
  #soon {
    padding: 6px 5px;
    background-color: #fffcf4;
    border: 1px solid #fff5ea;
  }
  #untouched .text-warning,
  #untouched .text-warning strong,
  #soon .text-warning,
  #soon .text-warning strong {
    color: #b05b01 !important;
  }
  #untouched > a,
  #soon > a {
    display: inline;
    border: none !important;
    background-color: transparent !important;
  }
  #untouched:hover,
  #untouched:focus,
  #soon:hover,
  #soon:focus {
    background-color: #b05b01;
    border-color: #b05b01;
  }
  #untouched:hover .text-warning,
  #untouched:hover .text-warning strong,
  #untouched:focus .text-warning,
  #untouched:focus .text-warning strong,
  #soon:hover .text-warning,
  #soon:hover .text-warning strong,
  #soon:focus .text-warning,
  #soon:focus .text-warning strong {
    color: #fffcf4 !important;
  }
  #new {
    background-color: #e6f7f5;
    color: #15803d;
    padding: 6px 5px;
    border: 1px solid #d7f3f0;
  }
  #new .text-success,
  #new .text-success strong {
    color: #15803d !important;
  }
  #new > a {
    display: inline;
    border: none !important;
    background-color: transparent !important;
  }
  #new:hover,
  #new:focus {
    background-color: #15803d;
    border-color: #15803d;
  }
  #new:hover .text-success,
  #new:hover .text-success strong,
  #new:focus .text-success,
  #new:focus .text-success strong {
    color: #e6f7f5 !important;
  }
  #showall {
    background-color: #e0f2fe;
    color: #014361;
    padding: 6px 5px;
    border: 1px solid #d7f3f0;
  }
  #showall .text-info,
  #showall .text-info strong {
    color: #014361 !important;
  }
  #showall > a {
    display: inline;
    border: none !important;
    background-color: transparent !important;
  }
  #showall:hover,
  #showall:focus {
    background-color: #014361;
    border-color: #014361;
  }
  #showall:hover .text-info,
  #showall:hover .text-info strong,
  #showall:focus .text-info,
  #showall:focus .text-info strong {
    color: #e5f6fd !important;
  }
}

/* Accessibility related fixes */
table.pvtTable tr td {
  color: #000000 !important;
}

.datepicker {
  z-index: 2010 !important;
}

.case-details-panel-container {
  display: flex;
  flex-wrap: wrap;
}

.case-details-panel-row {
  flex-grow: 1;
  flex-basis: 60%;
}
.case-details-panel-row + div {
  flex-grow: 1;
}
.case-details-panel-row .case-details-panel-right {
  width: 100%;
}
.case-details-panel-row .case-details-panel-columns {
  display: flex;
}
.case-details-panel-row .case-details-panel-left {
  display: inline-block;
  margin-right: 5px;
  width: 100%;
}
.case-details-panel-row .case-details-panel-left + .case-details-panel-right {
  width: 32%;
  vertical-align: top;
}

#tabSTbody4 #actionsCompletedDiv {
  margin-top: 1rem;
}

#tabDO #attachmentList table td,
#tabDO #documents table td {
  word-break: normal;
}

/* Document List */

.tabheading #docs,
.tabheading #bundles,
.tabheading #spreadsheets,
.tabheading #images,
.tabheading #audio,
.tabheading #links,
.tabheading #emails,
.tabheading #attachments,
.tabheading #showalldocs {
  display: none;
  padding-left: 3px;
}

#tabheading #showalldocs {
  padding-right: 1em;
}

.document-list-filters {
  border-bottom: 1px solid #eee;
  margin-bottom: 1.125rem;
  margin-left: 5px;
}

.document-list-filters .nav-pills {
  display: inline-block;
}

.document-list-filters .attachments {
  display: inline-block;
  vertical-align: top;
  position: relative;
  margin-left: 10px;
}

.document-list-filters .attachments label {
  background-color: #f3f4f6;
  color: #404040;
  margin-bottom: 0;
  padding: 8px;
  text-wrap: nowrap;
  display: flex;
  align-items: center;
}

.document-list-filters .attachments label .badge {
  margin-left: 5px;
}

.document-list-filters .attachments label:hover {
  background-color: #e5e7eb;
  cursor: pointer;
}

.document-list-filters .attachments input {
  opacity: 0;
  position: absolute;
  width: 0;
  height: 0;
}

.document-list-filters .attachments input:checked ~ label {
  background-color: #dee5f2;
  color: #404040;
}

.document-list-filters .attachments label .fa::before {
  content: "\f067";
}

.document-list-filters .attachments input:checked ~ label .fa::before {
  content: "\f00c";
}

.document-list-filters .nav-pills .nav-item > a {
  color: #595959;
  padding: 8px;
}

.document-list-filters .attachments input {
  margin-right: 2px;
}

.document-list-filters .nav-pills > li > a .badge {
  color: #1e242c;
  background: #dfdfdf;
}

.document-list-filters .nav-pills > li > a:hover {
  background-color: #e5e7eb;
}

.document-list-filters .nav > li.disabled > a {
  color: rgba(0, 0, 0, 0.38);
  background-color: transparent;
}

.document-list-filters .nav > li.disabled > a i {
  color: inherit;
}

.document-list-filters .nav > li.disabled > a:hover {
  color: rgba(0, 0, 0, 0.38);
  background-color: #fafafa;
}

.document-list-filters .nav-pills > li.active > a {
  background-color: #dee5f2;
  color: #404040;
}

.document-list-filters .nav-pills > li.active > a .badge {
  background-color: #2085e2;
  color: #dbeafe;
}

.document-list-filters__container {
  display: flex;
  margin-bottom: 10px;
}

/* Document Folder */

#tabDO .table-row {
  cursor: pointer;
}

#tabDO .selected-row {
  background-color: #f3f3f3 !important;
  color: black;
}

.side-panel {
  display: block;
  width: 250px;
  flex-shrink: 0;
  padding: 10px;
  color: #000000;
  background: rgb(243, 243, 243);
  border-right: 1px solid #ddd;
}
.side-panel-toggle {
  width: 10px;
  height: 25px;
  flex-grow: 1;
  display: grid;
  place-items: center;
  color: #000000;
  background: #ffffff;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 0px;
}

.sp-icon-close {
  display: none !important;
}

.side-panel-open .side-panel {
  display: initial;
}

.side-panel-open .sp-icon-open {
  display: initial !important;
}

.side-panel-open .sp-icon-close {
  display: none !important;
}

.documentWrapper {
  display: flex;
}

.documents-list__wrapper {
  position: relative;
  z-index: 2;
  background-color: #fff;
}

.documents-list__wrapper #casedocuments {
  table-layout: auto;
  width: 100%;
}

#tabDObody {
  flex-grow: 1;
  padding: 0px;
  overflow-y: auto;
  overflow-x: hidden;
}

#tabDO table.treetable {
  table-layout: fixed;
  min-width: 200px;
}

#tabDO table.treetable tr td {
  display: block;
  padding: 0.3em 0.7em;
}

#tabDO table.treetable .fa-folder {
  color: #2085e2;
}

#tabDO table.treetable tr.selected {
  background-color: #e5e7eb;
  color: #404040;
}

#tabDO table.treetable tr.expanded i.fa-folder::before {
  content: "\f07c";
}

#tabDO table.treetable tr.branch {
  background-color: transparent;
}

#tabDO table.treetable tr.selected.branch {
  background-color: #e5e7eb;
  color: #404040;
}

#tabDO table.treetable span {
  background-position: center left;
  background-repeat: no-repeat;
  padding: 0 0 0 0;
}

#tabDO table.treetable span.editable {
  word-break: break-word;
  display: inline-block;
}

#tabDO table.treetable .edit-inline__editable:hover {
  cursor: pointer;
}

.edit-inline .edit-inline__editable {
  display: grid;
  grid-template-columns: minmax(100px, 600px);
  position: relative;
}

.edit-inline__editable-container {
  display: flex;
}

.truncate {
  font-size: .875rem;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: auto;
}

.edit-inline.edit-inline__editing .edit-inline__editable {
  display: none;
}

.edit-inline .edit-inline__input {
  display: flex;
  transform-origin: center;
  animation: fadeOutCenter .05s ease-in;
  animation-fill-mode: forwards;
  position: absolute;
  top: 8px;
  z-index: 10;
}

.edit-inline .edit-inline__input input {
  margin-bottom: 0;
}

.edit-inline .edit-inline__input .input-group-append {
  margin-left: 4px;
}

.edit-inline.edit-inline__editing .edit-inline__input {
  background: white;
  position: absolute;
  padding: 10px 15px;
  top: 3px;
  z-index: 10;
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.16);
  border: 1px solid rgba(0,0,0,.15);
  border-radius: .25rem;
  animation: fadeInCenter .10s ease-in-out;
  animation-fill-mode: forwards;
}

@keyframes fadeInCenter {
  0% {
    transform: scale(0);
    opacity: 0;
  }
  33% {
    transform: scale(.33);
    opacity: .33
  }
  66% {
    transform: scale(.66);
    opacity: .66;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes fadeOutCenter {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  33% {
    transform: scale(.66);
    opacity: .66;
  }
  66% {
    transform: scale(.33);
    opacity: .33
  }
  100% {
    transform: scale(0);
    opacity: 0;
  }
}

.edit-inline.edit-inline__editing .edit-inline__input .input-text {
  width: 300px;
  margin-right: 5px;
}

#tabDO table.treetable tr.collapsed.selected span.indenter a,
#tabDO table.treetable tr.expanded.selected span.indenter a {
  filter: brightness(0.5);
}

#context-menu {
  background-color: #ffffff;
  box-shadow: 0 0 20px rgba(37, 40, 42, 0.22);
  color: #1f194c;
  width: 10em;
  padding: 0.8em 0.6em;
  font-size: 1.3rem;
  position: fixed;
  visibility: hidden;
  z-index: 1;
}
#context-menu .item {
  padding: 0.3em 1.2em;
}
#context-menu .item:hover {
  background-color: #e5e5e5;
  cursor: pointer;
}
#context-menu .item .fa {
  padding-right: 5px;
}

.wrapper {
  color: #000000;
  border-right: 1px solid #ddd;
  /* Use flexbox */
  display: flex;
  position: relative;
}
.box {
  padding: 10px;
  background-color: #f9fafb;
  color: #404040;
  flex-shrink: 0;
  border-right: 1px solid #ddd;
  /* Use box-sizing so that element's outerwidth will match width property */
  box-sizing: border-box;
  width: 250px;
  position: relative;
  opacity: 1;
  visibility: visible;
}
#movable {
  position: fixed;
  z-index: 1;
  opacity: 1;
  visibility: hidden;
}

@media (max-width: 1200px) {
  .scroll-style {
    width: 230px;
    height: 400px;
    overflow: hidden;
  }
}

@media (min-width: 1201px) {
  .scroll-style {
    width: 230px;
    height: 600px;
    overflow: hidden;
  }
}

#moveable:hover .scroll-style {
  overflow-y: auto;
}
#moveable:hover .scroll-style::-webkit-scrollbar {
  width: 0.5em;
}

/* This sets the colour of the scrollbar background. You may not need this if you want a scrollbar with no background*/
#moveable:hover .scroll-style::-webkit-scrollbar-track {
  background: transparent;
}

/* This sets the colour of the scrollbar */
#moveable:hover .scroll-style::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.1);
}

.element-transition {
  opacity: 0;
  visibility: hidden;
}

.resize-controller {
  position: absolute;
  top: 0;
  right: -4px;
  bottom: 0;
}
.handler {
  position: absolute;
  width: 24px;
  padding: 0;
  cursor: ew-resize;
  left: 100%;
  top: 0;
  bottom: 0;
  z-index: 3;
}
.handler:hover .handler-shadow {
  background: #0ea5e9;
  position: absolute;
  left: -3px;
  top: 0;
  bottom: 0;
  width: 2px;
}

.center {
  position: relative;
  top: 60px;
  left: 8px;
  background: #ffffff;
  color: #404040;
  transition: background 0.1s ease, color 0.1s ease, padding-left 0.1s ease,
    padding-right 0.1s ease, transform 0.1s ease;
  text-align: center;
  cursor: pointer;
  border: 1px solid #ddd;
  border-radius: 20px;
  padding: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 3;
}

.center .fa {
  font-size: 10px;
}
.center:hover {
  background: #2085e2;
  color: #ffffff;
  border-color: #2085e2;
}

.nav-item.active {
  border-bottom: none;
}

#casedocuments th.sorting:empty::before,
#casedocuments th.sorting:empty::after {
  display: none;
}

#documents .nav-pills .nav-link {
  font-weight: normal;
}

.dashboard-loader-container {
  position: absolute;
  background: #f9f9f9;
  width: 100%;
  left: 0;
  top: 0;
  bottom: 0;
  z-index: 500;
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s ease-in;
}

.dashboard-loader-container.active {
  opacity: 1;
  visibility: visible;
}

.dashboard-loader-inner {
  position: absolute;
  top: 50vh;
  left: 50%;
  z-index: 1000;
  transform: translateY(-50%);
}

.dashboard-loader-text {
  font-weight: bold;
  display: block;
}
.dashboard-loader {
  width: 48px;
  height: 48px;
  border: 3px solid #0284c7;
  border-radius: 50%;
  display: inline-block;
  position: relative;
  box-sizing: border-box;
  animation: rotation 0.5s linear infinite;
}
.dashboard-loader::after {
  content: "";
  box-sizing: border-box;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 3px solid;
  border-color: #075985 transparent;
}

#uploadDiv > div.bg-info {
  position: relative;
}
.loader-backdrop {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(255, 255, 255, 0.65);
  z-index: 10;
}
.loader-container {
  margin-top: 10px;
  width: 200px;
  background-color: white;
  border-radius: 10px;
  padding: 10px 5px 1px;
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.32);
  z-index: 11;
}
.progress-loader {
  width: 36px;
  height: 6px;
  margin-top: 40px;
  background: #999;
  display: inline-block;
  position: relative;
}
.progress-loader::after {
  content: "";
  left: 50%;
  top: -47px;
  transform: translate(-50%, 0);
  position: absolute;
  border: 12px solid transparent;
  border-bottom-color: #333;
  box-sizing: border-box;
  animation: bump 0.4s ease-in-out infinite alternate;
}
.progress-loader::before {
  content: "";
  left: 50%;
  bottom: 15px;
  transform: translate(-50%, 0);
  position: absolute;
  width: 5px;
  height: 20px;
  background: #333;
  box-sizing: border-box;
  animation: bump 0.4s ease-in-out infinite alternate;
}

@keyframes bump {
  0% {
    transform: translate(-50%, 5px);
  }
  100% {
    transform: translate(-50%, -5px);
  }
}

.pull-right {
  float: right;
}

#sharepointListContent {
  background: #fff;
  padding: 0.3em;
  margin: 5px;
  border-radius: 3px;
}

#sharepointListContent table.treetable tbody tr td {
  padding: 10px 15px;
}

#sharepointListContent table.treetable tbody tr td input[type="checkbox"] {
  margin-bottom: 0;
  min-height: auto;
}

#sharepointListContent table.treetable thead tr {
  background: #fff !important;
}
#sharepointListContent table.treetable thead tr th {
  font-weight: bold;
  padding: 10px 15px;
  border: none;
  border-bottom: 1px solid #e5e5e5;
}

#sharepointListContent table.treetable thead tr th:first-of-type {
  padding-left: 32px;
}
#sharepointListContent table.treetable thead tr th:nth-of-type(2) {
  padding-left: 13px;
}
#sharepointListContent table.treetable thead tr th:nth-of-type(3) {
  padding-left: 13px;
}

#sharepointListContent table.treetable tbody tr td .folder {
  margin-left: -4px;
}

#sharepointListContent table.treetable tbody tr {
  border-bottom: 1px solid #e5e5e5;
}
#sharepointListContent table.treetable tbody tr:hover {
  background-color: #e5e5e5;
}
#sharepointListContent table.treetable span {
  background-position: center left;
  background-repeat: no-repeat;
  padding: 0.2em 0 0.2em 0.6em;
}

#sharepointListContent .checkbox-container {
  position: relative;
}

#sharepointListContent .checkbox-container input[type="checkbox"] {
  opacity: 0;
  visibility: visible;
}

#sharepointListContent .checkbox-container .checkbox-label {
  position: absolute;
  display: block;
  width: 20px;
  height: 20px;
  cursor: pointer;
  appearance: none;
  background-color: white;
  border: 1px solid #ccc;
  border-radius: 50%; /* Makes it round like a radio button */
  top: 0;
  font-family: FontAwesome;
  font-weight: normal;
  transition: all 0.15s ease;
  opacity: 0;
}

#sharepointListContent .checkbox-container .checkbox-label::after {
  content: "\f00c";
  position: absolute;
  color: #fff;
  opacity: 0;
  top: 2px;
  left: 2px;
}

#sharepointListContent
  .checkbox-container
  input[type="checkbox"]:hover
  ~ .checkbox-label {
  background-color: #ccc;
}

#sharepointListContent
  .checkbox-container
  input[type="checkbox"]:hover
  ~ .checkbox-label::after {
  opacity: 1;
}

#sharepointListContent
  .checkbox-container
  input[type="checkbox"]:checked
  ~ .checkbox-label {
  background-color: #0078d4; /* SharePoint-like color */
  border: 1px solid #0078d4;
}

#sharepointListContent
  .checkbox-container
  input[type="checkbox"]:checked
  ~ .checkbox-label::after {
  opacity: 1;
}

/*show checkbox when row is hovered */
#sharepointListContent tr:hover .checkbox-container .checkbox-label {
  opacity: 1;
}

/* Show checkbox when the checkbox is clicked */
#sharepointListContent
  .checkbox-container
  input[type="checkbox"]:checked
  ~ .checkbox-label {
  opacity: 1;
}

/* Highlight row when checkbox is checked */
#sharepointListContent .highlighted-row {
  background-color: #e5e5e5; /* Light blue background for the highlighted row */
}
.table-actions {
  display: flex;
}

.table-actions .btn-link {
  padding: 5px;
  color: #4d555c;
}

.table-actions .btn-link:hover {
  border: none;
  background-color: #e1e1e1;
  border-radius: 4px;
}

.table-actions .btn-link:active {
  background-color: #ccc;
}

.table-actions .dropdown-item a {
  color: #1f2937;
}
.table-actions .action-item:not(:last-of-type) {
  position: relative;
  margin-right: 5px;
}

.table-actions .dropdown-toggle::after {
  display: none;
}

.table-actions .dropdown-item:hover {
  background-color: #d1d5db;
}

table.dataTable > thead > tr > th:not(.sorting_disabled):focus,
table.dataTable > thead > tr > td:not(.sorting_disabled):focus {
  outline: 2px solid #2c93e2;
}

.styled-links span > a {
  font-size: inherit;
}

.back-btn {
  font-size: inherit;
  border-radius: 5px;
  display: inline-block;
}

.back-btn:focus {
  box-shadow: none;
}

.back-btn:focus-visible {
  color: #6c757d;
  color: #1a6cc4;
  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px #006278 inset;
}

.back-btn:active {
  color: #007bff;
  color: #6c757d;
  transform: scale(0.95) translate3d(0, 0, 0);
}

#casedocuments_wrapper > .row:first-child > .col-md-auto:first-child {
  display: flex;
  flex-grow: 1;
  padding-right: 0;
}

#casedocuments_wrapper > .row:first-child {
  background-color: #f3f4f6;
  justify-content: flex-start !important;
  padding: 5px 0 10px;
}
#casedocuments_wrapper > .row:first-child > .col-md-auto {
  margin: 0 !important;
}

#casedocuments_wrapper .dt-search {
  flex-grow: 1;
  text-align: unset;
  position: relative;
}

.search-filter {
  position: absolute;
  z-index: 10;
  left: 16px;
  top: 55%;
  transform: translateY(-50%);
  color: #9ca3af;
}

#casedocuments_wrapper .dt-search .form-control {
  min-width: calc(100% - 75px);
  margin-bottom: 0;
  vertical-align: bottom;
  border: none;
  background-color: #f3f4f6;
  padding-left: 30px;
  height: 38px;
  box-shadow: none;
}

#casedocuments th {
  border-top: none;
}

#document-category-filter {
  align-self: flex-end;
}
#document-category-filter #categoryList {
  border: none;
  background-color: #e7e9ec;
  margin-left: 0;
  height: 35px;
  box-shadow: none;
}
#casedocuments_wrapper .dt-search label {
  display: inline-block;
  position: unset;
}
#casedocuments_wrapper .btn-sm {
  min-width: unset;
  padding: 7px;
}

.btn.buttons-colvis {
  min-width: unset;
  padding: 7px;
}

.btn.btn-sm.dt-filter-drp-btn {
  background: #e7e9ec;
  border: none;
  border-radius: 0;
  margin-top: 8px;
  transition: none;
  font-size: 1.125rem;
}

.btn.btn-sm.dt-filter-search-btn,
.btn.btn-secondary.buttons-colvis {
  background-color: #e7e9ec;
  border: none;
  border-radius: 0;
  box-shadow: none;
  transition: none;
  font-size: 1.125rem;
}

#categoryList:hover,
.btn.dt-filter-drp-btn:hover,
.btn.dt-filter-search-btn:hover,
.btn.btn-secondary.buttons-colvis:hover {
  background-color: #d1d5db;
}

.btn.dt-filter-drp-btn:focus,
.btn.dt-filter-search-btn:focus,
.btn.btn-secondary.buttons-colvis:focus {
  background-color: #d1d5db !important;
  border: none !important;
}

#casedocuments_wrapper .dt-search .form-control:focus,
#categoryList:focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
  border: 1px solid #0078d4 !important;
}

.btn.btn-secondary.buttons-colvis {
  margin-right: 0;
  margin-top: 7px;
  padding-top: 5px;
}
.btn.btn-secondary.buttons-colvis ~ .dropdown-menu {
  right: 30px !important;
  left: auto !important;
}

.filter-form .form-group:hover {
  background-color: #d1d5db;
}

#casedocuments .fa-lg {
  padding: 15px 9px;
  border-radius: 13px;
}

#casedocuments .fa.fa-file-image-o {
  color: #21009e;
}

#casedocuments .fa.fa-envelope-open-o {
  color: #76009e;
}
#casedocuments .fa.fa-file-pdf-o {
  color: #9e0000;
}

#casedocuments .fa.fa-file-word-o {
  color: #005c9e;
}

#casedocuments .fa.fa-file-archive-o {
  color: #0e6b00;
}

#casedocuments .fa.fa-file-excel-o {
  color: #216e44;
}

.casedocs .btn-link {
  color: #636363;
}
.casedocs .btn-link:hover {
  background-color: #dfe1e9
}
.casedocs .selected .btn-link:hover {
  background-color: #f4faff;
}
.casedocs .dt-select-checkbox {
  margin-bottom: 4px;
}
/*
 .has-notes-indicator-true,
 .has-notes-indicator-false {
	 display: block;
	 padding: 7px;
 }
 
 .has-notes-indicator-true {
	 background-color: #d1fae5;
	 color: #047857
 }
 
  .has-notes-indicator-false {
	  background-color: #fff1f2;
	  color: #9f1239;
  } */

#casedocuments .dt-select-checkbox,
.documents-tbl-action-btn {
  opacity: 0;
  background-color: transparent;
  visibility: hidden;
}

.documents-tbl-action-btn {
  margin-bottom: 0;
  border: none;
}

#casedocuments_wrapper .documents-tbl-action-btn  {
  padding: 5px;
  margin-top: 0;
}

#casedocuments tr:hover .dt-select-checkbox,
#casedocuments tr:hover .documents-tbl-action-btn,
#casedocuments .dt-select-checkbox:focus,
.documents-tbl-action-btn:focus,
#casedocuments tr.selected .dt-select-checkbox {
  opacity: 1;
  background-color: transparent;
  visibility: visible;
}

#casedocuments tr:hover .documents-tbl-action-btn:hover {
  color: #0782f2;
  transform: scale(1.2);
  border: none;
}

#casedocuments .dt-column-title {
  font-size: 12px;
}

.dt-button-collection {
  z-index: 1000;
}

#folder-menu {
  position: fixed;
}

.icw-menu .dropdown-menu button {
  font-size: 14px;
}

.icw-menu .dropdown-menu button:focus {
  box-shadow: none;
  border: none;
  outline: none;
  background-color: transparent;
}

.icw-menu .dropdown-menu .dropdown-item {
  color: #1f2937;
}

.icw-menu .dropdown-menu .dropdown-item:hover,
.icw-menu .dropdown-menu button:focus-visible {
  background-color: #d1d5db;
}

.icw-menu .dropdown-menu .dropdown-item:focus,
.dt-button.dropdown-item:focus {
  box-shadow: none;
}

.icw-menu .dropdown-menu .dropdown-item.disabled {
  color: rgba(0, 0, 0, 0.28);
  background-color: transparent;
  cursor: not-allowed;
}

.icw-menu .dropdown-menu .dropdown-item:not(.disabled) .fa {
  color: #005a9e;
  color: #5a5c5e;
}

.icw-menu .dropdown-menu .dropdown-item .fa {
  margin-right: 3px;
}

.icw-menu .dropdown-menu .dropdown-item:not(.disabled) .fa-trash-o {
  color: #9e0000;
}

.dt-checkbox-label {
  position: relative;
  display: block;
}

.dt-custom-checkbox {
  position: absolute;
  opacity: 0;
  width: 20px;
  height: 20px;
}

.dt-checkbox-overlay {
  position: absolute;
  padding: 0 2px;
  border-radius: 16px;
  border: 1px solid #ccc;
  opacity: 0;
  transition: opacity 0.15s linear;
  background-color: #fff;
}

.dt-checkbox-overlay .fa {
  opacity: 0;
}

#casedocuments tr:hover .dt-checkbox-overlay {
  opacity: 1;
}

.dt-checkbox-label:hover .dt-checkbox-overlay .fa {
  opacity: 1;
}

.dt-checkbox-label input:checked ~ .dt-checkbox-overlay {
  background-color: #0078d4;
  border-color: #0078d4;
  opacity: 1;
}

.dt-checkbox-label input:checked ~ .dt-checkbox-overlay .fa {
  color: #fff;
  opacity: 1;
}

.card.bg-light .collapse #documents {
  background-color: #fff;
}

[class^="has-notes-indicator"] {
  transform: scale(1.5);
}

.has-notes-indicator-true .fa {
  color: #609476;
}

.has-notes-indicator-false .fa {
  color: #946060;
}

#managecase,
.documents-list__wrapper {
  min-height: 700px;
}

.managecases-container {
  display: grid;
  grid-template-columns: 1fr 300px;
}

.managecases-content {
  grid-column: span 2;
}

.managecases-container.help-shown .managecases-content {
  grid-column: span 1;
}

#toggle-case-help {
  display: block;
}

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@media (max-width: 575.98px) {
  .top-header .logo img + font,
  .top-header .logo img + p {
    display: none !important;
  }
}

@media (max-width: 767px) {
  .table-actions {
    flex-direction: column;
  }
  .table-actions .action-item:not(:last-of-type) {
    border-right: none;
    margin: 5px;
  }
  .responsive-table-row {
    display: block !important;
    background: #fffbff;
    padding: 0 7px;
    border: 1px solid #ddd;
  }

  /* make each coloum in responsive-table-row a row */
  .responsive-table-row {
    margin-bottom: 10px;
  }

  .responsive-table-row > div {
    display: block !important;
    padding-top: 10px !important;
  }

  .responsive-table-row > div .validation-group > div {
    display: flex;
    align-items: center;
  }

  .responsive-table-row > div .validation-group > div > div {
    padding: 5px;
  }

  .responsive-table-row > div .validation-group > div label {
    display: block !important;
  }

  /* overrride sr-only class */
  .responsive-table-row > div .validation-group > div label.sr-only {
    position: static;
    overflow: visible;
    clip: unset;
    width: auto;
    height: auto;
  }

  .responsive-table-row .RowButton {
    padding-top: 0 !important;
    width: 26px;
    margin-left: auto;
  }
}

@media (max-width: 768px) {
  .case-details-panel-container {
    flex-direction: column;
  }
  .case-details-panel-left {
    margin-right: 0;
  }

  .rolediv-container.btn-group .dropdown-menu {
    left: auto;
    right: 0;
    top: 0;
    transform: translateY(-100%);
  }

  .rolediv-container.btn-group .btn-link .fa-caret-down:before {
    content: "\f0d8";
  }
  #toggle-case-help {
    display: none;
  }
}
@media (max-width: 991px) {
  .case-details-panel-row .case-details-panel-left {
    width: 100%;
  }
  .case-details-panel-row .case-details-panel-left + .case-details-panel-right {
    width: 100%;
  }
  .case-details-panel-columns {
    flex-direction: column;
  }
  .table-actions .action-item:not(:last-of-type)::after {
    display: none;
  }
  .top-header .dropdown-menu.show {
    max-height: 400px;
    width: 300px;
  }
  .document-list-filters__container .attachments,
  #document-category-filter {
    display: none;
  }
  .document-list-filters .tabbable {
    min-width: unset;
    width: 100%;
  }
  .document-list-filters .nav-pills,
  #casedocuments_wrapper > .row:first-child .btn-group {
    display: block;
  }
  #casedocuments_wrapper .dt-search .form-control {
  }
  #casedocuments_wrapper > .row:first-child .btn-group .btn {
    width: 100%;
  }
  table.dataTable.dtr-column > tbody > tr > td.dtr-control,
  table.dataTable.dtr-column > tbody > tr > th.dtr-control,
  table.dataTable.dtr-column > tbody > tr > td.control,
  table.dataTable.dtr-column > tbody > tr > th.control {
    padding: 6px;
  }
  #tabDO #attachmentList table .dt-select,
  #tabDO #documents table .dt-select {
    padding: 0.5em;
  }
  #casedocuments_wrapper table tbody .btn-sm {
    margin-top: 4px;
  }
}
@media (min-width: 1200px) {
  #page-wrapper {
    padding-left: 275px;
  }
}

[ripple] {
  position: relative;
  overflow: hidden;
}
[ripple] .ripple--container {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
[ripple] .ripple--container span {
  transform: scale(0);
  border-radius: 100%;
  position: absolute;
  opacity: 0.75;
  background-color: #fff;
  animation: ripple 1000ms;
}

@keyframes ripple {
  to {
    opacity: 0;
    transform: scale(2);
  }
}

.btn-toggle input[type="checkbox"]:not(:checked) + label .btn-toggle__on {
  display: none;
}

.btn-toggle input[type="checkbox"]:checked + label .btn-toggle__off {
  display: none;
}

.nav-link:focus {
  border-bottom: none;
}

.checkbox-switch {
    display: grid;
    grid-template-columns: 50px 50px;
    grid-column-gap: 15px;
}

.checkbox-switch.size-small {
  transform: scale(.85);
}

.checkbox-switch .help-text {
    display: block;
}

.checkbox-switch label {
    margin-bottom: 0;
}

.checkbox-switch-input {
    position: relative;
    display: inline-block;
}

.checkbox-switch-input > input {
    opacity: 0;
    position: absolute;
    width: 45px;
    height: 22px;
    z-index: 10;
}

.checkbox-switch-btn {
    position: relative;
    width: 45px;
    height: 22px;
    border-radius: 100px;
    background-color: #ccc;
    overflow: hidden;
}

.checkbox-switch-btn:hover {
    background-color: #ddd;
}

.switch-handle {
    background-color: white;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: 3px;
    transition: all .2s ease-in-out;
    transform: translateX(0px);
    display: inline-block;
}

.switch-inner {
    width: 60px;
    height: 22px;
    display: inline-flex;
    position: absolute;
    justify-content: space-between;
    padding: 5px;
    transform: translateX(-18px);
}

.checkbox-switch-input > input:checked ~ .checkbox-switch-btn {
    background-color: #2085e2;
}

.checkbox-switch-input > input:checked ~ .checkbox-switch-btn .switch-handle {
    transform: translateX(22px);
}

.checkbox-switch-input > input:checked ~ .checkbox-switch-btn .switch-inner {
    transform: translateX(0);
}

.checkbox-switch-input > input:checked ~ .checkbox-switch-btn .switch-inner .fa {
    color: white;
}
@media (prefers-reduced-motion) {
  .edit-inline.edit-inline__editing .edit-inline__input,
  .edit-inline .edit-inline__input {
    animation: none;
  }
}
