/* Imports */
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");
@import "./bsExtension.css";

/* Global Styles */
body {
  font-family: "Montserrat", "IBM Plex Sans", Arial, Helvetica, sans-serif;
  min-height: 100vh;
  display: flex;
  color: #4d4d4f;
  flex-direction: column;

  /* Scrollbar Styles */
  ::-webkit-scrollbar { width: 10px; }
  ::-webkit-scrollbar-track { 
    background: var(--bs-gray-400);
    border-radius: 5px; 
  }
  ::-webkit-scrollbar-thumb {
    background: var(--bs-gray-600);
    border-radius: 5px;
  }
}

h1, h2, h3, h4, h5, h6, .btn,
.h1, .h2, .h3, .h4, .h5, .h6,
.display-1, .display-2, .display-3,
.display-4, .display-5, .display-6 {
  font-family: "Montserrat", "Roboto", Arial, Helvetica, sans-serif;
}

main { flex-grow: 1; }

/* Header Image */
.header-img {
  aspect-ratio: 4 / 1;
  margin: 0;
  max-height: 500px;
  padding: 0;
  width: 100%;
  img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

/* Utility Classes */
.container-fluid.p-0 > .row {
  margin-left: 0;
  margin-right: 0;
  padding-left: 1rem;
  padding-right: 1rem;
}

.bg-primary {
  background-color: var(--primary-color) !important;
  color: var(--primary-text);
}

.bg-img {
  --image: unset;
  background-image: var(--image);
  background-repeat: no-repeat;
  background-size: cover;
}

.bg-light-trans {
  background-color: rgba(248, 248, 248, 0.79);
  padding: 1rem;
  --bs-border-color: var(--bs-gray-500);
}

.text-primary {
  color: var(--primary-color) !important;
}

.border-bottom-primary { 
  border-bottom: 2px solid var(--primary-color); 
}

.circle {
  display: inline-block;
  width: 2.25em;
  height: 2.25em;
  text-align: center;
  border-radius: 1.125em;
  padding: 0.375em 0;
}

.sm-circle {
  display: inline-block;
  width: 1.25em;
  height: 1.25em;
  text-align: center;
  border-radius: 0.625em;
  padding: 0;
}

.user-primary::before {
  aspect-ratio: 1 / 1;
  background: var(--primary-color);
  border-radius: 50%;
  color: var(--primary-text);
  content: "\f4da";
  padding: 0.25em;
}

.img-3-2 { 
  aspect-ratio: 3 / 2 !important;
  max-width: 100% !important;
}

/* Currency Alignment */
.money {
  text-align: right;
  &:before { 
    content: "$"; 
    padding-right: 0.25rem;
  }
  &.credit:before { content: "-$"; }
}

.money-nospace {
  text-align: right;
  &:before { content: "$"; }
  &.credit:before { content: "-$"; }
}

/* Link Styling */
.link {
  background: none;
  border: none;
  color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));
  cursor: pointer;
  text-decoration: underline;
}

.link-unstyled {
  cursor: pointer;
  text-decoration: none;
}

.link:hover, 
.link:focus {
  --bs-link-color-rgb: var(--bs-link-hover-color-rgb);
}

.clickable-row { cursor: pointer; }

.page-divider {
  height: 1.5rem;
  background-color: rgba(0, 0, 0, 0.1);
  border: solid rgba(0, 0, 0, 0.15);
  border-width: 1px 0;
  box-shadow: 
    inset 0 0.5em 1.5em rgba(0, 0, 0, 0.1),
    inset 0 0.125em 0.5em rgba(0, 0, 0, 0.15);
}

/* ------ Nav Styles ------ */
#main-nav {
  background-color: var(--nav-background);
  border-bottom: 0.5rem solid var(--primary-color);
  font-weight: bold;
  height: 100px;
  color: var(--nav-text);
  .nav-item, .nav-link {
    color: var(--nav-text);
    font-weight: 500;
    white-space: nowrap;
  }
  & > .container-xl {
    background-color: var(--nav-background);
  }
}

.nav-item, .nav-link {
  color: var(--bs-body-color);
  cursor: pointer;
}

.nav-item.active, .nav-link.active {
  color: var(--primary-color);
}

.nav-item:focus, .nav-link:focus,
.nav-item:hover, .nav-link:hover {
  color: var(--primary-hover);
}

.nav-underline .nav-item:focus,
.nav-underline .nav-item:hover,
.nav-underline .nav-item.active,
.nav-underline .nav-link:focus,
.nav-underline .nav-link:hover,
.nav-underline .nav-link.active {
  color: var(--bs-body-color);
  border-bottom-color: var(--primary-color);
}

/* hide breadcrumbs on screens below the lg breakpoint */
@media (max-width: 991.98px) {
  nav .breadcrumb {
    display: none;
  }
}

/* ------ Timeline Styles ------ */

input[type="checkbox"].bi:not(.form-control) {
  height: 0;
  color: inherit;
  margin-right: 0.5rem;
  &.circle-1 { 
    &:before { content: '\F797'; }
    &:checked:before { content: '\F26B'; }
  }
  &.circle-2 {
    &:before { content: '\F79D'; }
    &:checked:before { content: '\F26B'; }
  }
  &.circle-3 {
    &:before { content: '\F7A3'; }
    &:checked:before { content: '\F26B'; }
  }
  &.circle-4 {
    &:before { content: '\F7A9'; }
    &:checked:before { content: '\F26B'; }
  }
  &.view-password {
    position: absolute;
    top: 50%;
    right: calc(0.375em + 0.1875rem);
    &:before { 
      content: '\F33E'; 
      position: absolute;
      transform: translateY(-50%);
    }
    &:checked:before { content: '\F33F'; }
  }
}

.timeline {
  display: flex;
  flex-direction: column;
  list-style: none;
  padding-left: 0;
  .tl-item {
    text-align: center;
    &.active { 
      color: var(--primary-color);
      --bs-border-color: var(--primary-color); 
    }
  }
  a, li { 
    color: inherit !important; 
    text-decoration: none;
    &.active{
      color: var(--primary-color) !important;
      font-weight: bold;
      input[type="checkbox"].bi:not(.form-control) {
        &:checked:before { content: '\F26A' !important; }
        &.circle-1:before { content: '\F796'; }
        &.circle-2:before { content: '\F79C'; }
        &.circle-3:before { content: '\F7A2'; }
        &.circle-4:before { content: '\F7A8'; }
      }
    }
  }
  &:has(> li:only-child), &.single-item {
    &:before { display: none; }
  }
}


@media (min-width: 992px) {
  .timeline { 
    flex-direction: row;
    justify-content: space-between;
    position: relative;
    background-color: var(--bs-light);
    &:before {
      position: absolute;
      top: 50%;
      height: 1px;
      width: 100%;
      content: " ";
      background-color: var(--bs-gray-400);
      z-index: 1;
    }
  
    li {
      padding-left: 1rem;
      padding-right: 1rem;
      background-color: var(--bs-light);
      z-index: 2;
      &:first-child {
        padding-left: 0;
      }
      &:last-child {
        padding-right: 0;
      }
    }

    &.timeline-end:has(> li:only-child) > li, &.timeline-end.single-item > li:last-child {
      margin-left: auto;
    }
  }
  .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 5px;
    padding-left: 5px;
  }
}

/* ------ Footer Styles ------ */
footer {
  background-color: var(--foot-background);
  color: var(--foot-text);
  position: relative;
  a { color: inherit; }
  .card {
    background-color: unset;
    border: 0px;
    color: inherit;
  }
  #clientFooterLogo {
    max-width: 100%;
    max-height: 4rem;
  }
}

/* ------ Button Styles ------ */
.btn {
  /*border-radius: 0;*/
  text-transform: uppercase;
}

.btn-outline-primary {
  --bs-btn-color: var(--primary-color);
  --bs-btn-border-color: var(--primary-color);
  --bs-btn-hover-color: var(--primary-text);
  --bs-btn-hover-bg: var(--primary-hover);
  --bs-btn-hover-border-color: var(--primary-hover);
  --bs-btn-active-color: var(--primary-text);
  --bs-btn-active-bg: var(--primary-hover);
  --bs-btn-active-border-color: var(--primary-hover);
  --bs-btn-disabled-color: var(--primary-color);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--primary-color);
}

.btn-primary {
  --bs-btn-color: var(--primary-text);
  --bs-btn-hover-color: var(--primary-text);
  --bs-btn-active-color: var(--primary-text);
  --bs-btn-bg: var(--primary-color);
  --bs-btn-hover-bg: var(--primary-hover);
  --bs-btn-active-bg: var(--primary-hover);
  --bs-btn-border-color: var(--primary-color);
  --bs-btn-hover-border-color: var(--primary-hover);
  --bs-btn-active-border-color: var(--primary-hover);
  --bs-btn-disabled-color: var(--primary-text);
  --bs-btn-disabled-bg: var(--primary-color);
  --bs-btn-disabled-border-color: var(--primary-color);
}

.btn-primary-inverse {
  --bs-btn-color: var(--primary-color);
  --bs-btn-hover-color: var(--primary-hover);
  --bs-btn-active-color: var(--primary-hover);
  --bs-btn-bg: var(--primary-text);
  --bs-btn-hover-bg: var(--primary-text);
  --bs-btn-active-bg: var(--primary-text);
  --bs-btn-border-color: var(--primary-text);
  --bs-btn-hover-border-color: var(--primary-text);
  --bs-btn-active-border-color: var(--primary-text);
  --bs-btn-disabled-color: var(--primary-color);
  --bs-btn-disabled-bg: var(--primary-text);
  --bs-btn-disabled-border-color: var(--primary-text);
}

.btn-prev { 
  float: left; 
  &:after {content: "< Previous";}
}

.btn-next { 
  float: right; 
  &:after {content: "Next >";}
}

.dd-carrot-end {
  padding-right: 1.5rem;
  text-align: left;
  &::after{
    position:absolute;
    top:0.75rlh;
    right:0.5rem;
  }
}

/* ------ Form Styles ------ */
label, 
.form-label, 
.col-form-label {
  background-color: unset;
  font-size: 1rem;
  max-width: 100%;

  &.required:after { content: " *" !important; }
  &.fake-floating{
    font-size: 0.85rem;
    color: var(--primary-color);
  }
}

.form-control:not([type="checkbox"]):not([type="radio"]):not(div),
.form-select,
.ms-options-wrap button,
.select2-selection {
  &:not(.search-bar):not(.config) {
    background-color: unset;
    border-color: var(--bs-border-color);
    border-style: solid;
    border-radius: 0;
    border-width: 0px;
    border-bottom-width: 1px;

    &:focus { 
      box-shadow: none !important;
      border-color: var(--primary-color);
      border-bottom-width: 3px;
    }
  }

  &:disabled { 
    background-color: var(--bs-secondary-bg) !important; 
  }

  &.form-control-plaintext { 
    border-bottom-width: 0; 
  }
}

.form-control.is-valid, 
.was-validated .form-control:valid {
  border-color: var(--bs-form-valid-border-color) !important;
}

.form-control.is-invalid, 
.was-validated .form-control:invalid {
  border-color: var(--bs-form-invalid-border-color) !important;
}

.ms-options-wrap:not(.config) {
  &.ms-active button {
    box-shadow: none !important;
    border-bottom-width: 3px !important;
    border-color: var(--primary-color) !important;
  }

  button,
  button:focus {
    height: 100%;
    font-size: var(--bs-body-font-size);
    line-height: var(--bs-body-line-height);
    color: var(--bs-body-color);
    padding: 1.625rem 0.75rem 0.625rem;
  }

  .ms-options .ms-selectall {
    text-transform: none;
  }
}

.input-group:not(.config) {
  .input-group-text {
    background-color: unset;
    border: 0;
  }
}

.form-floating:not(.config) {
  &.ms {
    .ms-options-wrap {
      height: calc(3.5rem + calc(var(--bs-border-width) * 2));
      min-height: calc(3.5rem + calc(var(--bs-border-width) * 2));
      line-height: 1.25;
    }
  
    .ms-options-wrap.ms-has-selections ~ .form-label,
    .ms-options-wrap.ms-has-selections ~ label {
      transform: scale(0.85) translateY(-1.75rem) translateX(0.15rem);
      color: var(--primary-color);
    }
  }

  &.s2 .select2-selection {
    min-height: calc(3.5rem + calc(var(--bs-border-width) * 2));
    min-height: calc(3.5rem + calc(var(--bs-border-width) * 2));
    line-height: 1.25;
    padding-top: 1.625rem;
    padding-bottom: .625rem;
    text-align: start;
  }

  label, .form-label {
    height: unset;
    top: unset;
    bottom: 0;
    padding-bottom: 0;
  }

  textarea.form-control {
    height: 100px;
  }

  .form-control-plaintext ~ label::after,
  .form-control-plaintext ~ .form-label::after,
  .form-control:focus ~ label::after,
  .form-control:focus ~ .form-label::after,
  .form-control:not(:placeholder-shown) ~ label::after,
  .form-control:not(:placeholder-shown) ~ .form-label::after,
  .form-select ~ label::after,
  .form-select ~ .form-label::after {
    background-color: unset !important;
    inset: unset;
    position: static;
  }

  .form-control-plaintext ~ label,
  .form-control-plaintext ~ .form-label,
  .form-control:focus ~ label,
  .form-control:focus ~ .form-label,
  .form-control:not(:placeholder-shown) ~ label,
  .form-control:not(:placeholder-shown) ~ .form-label,
  .form-select ~ label,
  .form-select ~ .form-label {
    color: var(--primary-color);
    top: 0;
  }

  &.has-validation {
    .form-select.is-valid,
    .form-select.is-invalid,
    .form-control.is-valid:not(:focus),
    .form-control.is-invalid:not(:focus),
    .form-control.is-valid:placeholder-shown,
    .form-control.is-invalid:placeholder-shown {
      .form-label, label {
        bottom: calc(.875em * var(--bs-body-line-height));
      }
    }
  }
}

.was-validated .form-floating.has-validation label,
.was-validated .form-floating.has-validation .form-label{
  bottom: calc(.875em * var(--bs-body-line-height));
}

optgroup:not([label]) {
  font-size: 0;
  option { font-size: 1rem; }
}

.view-password ~ .form-control {
  padding-right: calc(1.5em + .75rem);
  &.is-invalid {
    padding-right: calc(3em + .75rem);
    background-position: right calc(2em + 0.1875rem) center;
  }
  &.is-valid {
    padding-right: calc(3em + .75rem);
    background-position: right calc(2em + 0.1875rem) center;
  }
}

.was-validated .view-password ~ .form-control{
  &:invalid {
    padding-right: calc(3em + .75rem);
    background-position: right calc(2em + 0.1875rem) center;
  }
  &:valid {
    padding-right: calc(3em + .75rem);
    background-position: right calc(2em + 0.1875rem) center;
  }
}

.select2-container--disabled {
  background-color: var(--bs-secondary-bg);
}

.select-circle {
  position: relative;

  input[type="checkbox"] {
    background-image: none;
    border-radius: 50%;
    height: 2.5rem;
    width: 2.5rem;
    &:checked {
      background-color: var(--primary-color);
      & ~ label, ~ .form-label {
        color: var(--primary-text);
      }
    }
  }
  
  label, 
  .form-label {
    position: absolute;
    width: 100%;
    top: 0.75rem;
    left: 0;
    text-align: center;
  }
}

input[type="radio"].checkbox {
  -webkit-appearance: checkbox; /* Chrome, Safari, Opera */
  -moz-appearance: checkbox;    /* Firefox */
  -ms-appearance: checkbox;     /* not currently supported */
  border-radius: .25em;
  float: left;
  margin-left: -1.5em;
  --bs-form-check-bg: var(--bs-body-bg);
  flex-shrink: 0;
  width: 1em;
  height: 1em;
  margin-top: .25em;
  vertical-align: top;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--bs-form-check-bg);
  background-image: var(--bs-form-check-bg-image);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  border: var(--bs-border-width) solid var(--bs-border-color);
  -webkit-print-color-adjust: exact;
  color-adjust: exact;
  print-color-adjust: exact;
  &:checked {
    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
    background-color: var(--primary-color);
    border-color: var(--primary-color);
  }
}

/* ------ Accordian Styles ------ */
.accordion-button {
  border-color: var(--bs-accordion-border-color);
  &:focus {
    box-shadow: none;
  }

  &:not(.collapsed) {
    background: transparent;
    color: var(--primary-color);
    border-bottom: var(--bs-accordion-border-width) solid;
  }
}

/* List Styles */
.border-list {
  list-style: none;
  padding-left: 0;
  > li {
    padding-top: 1rem;
    padding-bottom: 1rem;
    border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
    &:first-child {
      border-top: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
    }
  }
}

/* ------ Toast Styles ------ */
.toast.info {
  background-color: var(--bs-info-bg-subtle);
}
.toast.warning {
  background-color: var(--bs-warning-bg-subtle);
}
.toast.danger {
  background-color: var(--bs-danger-bg-subtle);
}
.toast {
  --bs-bg-opacity: 1;
  --bs-toast-bg: rgba(var(--bs-body-bg-rgb), var(--bs-bg-opacity));
}

.toast.success {
  --bs-bg-opacity: 1;
  --bs-text-opacity: 1;
  background-color: rgba(var(--bs-success-rgb), var(--bs-bg-opacity));
  color: rgba(var(--bs-white-rgb), var(--bs-text-opacity));
  .btn-close {
    filter: var(--bs-btn-close-white-filter);
  }
}

.toast.danger {
  --bs-bg-opacity: 1;
  --bs-text-opacity: 1;
  background-color: rgba(var(--bs-danger-rgb), var(--bs-bg-opacity));
  color: rgba(var(--bs-white-rgb), var(--bs-text-opacity));
  .btn-close {
    filter: var(--bs-btn-close-white-filter);
  }
}

.toast.toast.warning {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-warning-rgb), var(--bs-bg-opacity));
}

/* ------ Side Menu Styles ------ */
.side-menu {
  padding: 0;
  max-width: max-content;
  z-index: 2;

  > .row {
    padding: 0 !important;
    height: 100%;
  }

  .col-md {
    padding: 0;
    max-width: max-content;
    border-right: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
    &:last-child {
      width: 325px;
      max-width: max-content;
    }
  }

  .accordion-button .bi {
    font-size: 1.75rem;
  }

  .side-menu-panel-container.show .side-menu-panel {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
  }

  #primary-side-menu {
    padding: 1.5rem 0.75rem;
    position: sticky;
    position: -webkit-sticky;
  }

  .side-menu-panel-container {
    position: sticky;
    position: -webkit-sticky;
  }

  .side-menu-panel {
    padding: 1.5rem 2px;
    max-height: min(calc(100vh - 100px), 100cqh);
    height: auto;
    width: 325px;

    &.foot {
      height: min(calc(100vh - 100px), 100cqh);
    }

    .panel-header {
      padding: 0 0.75rem;
      margin-bottom: 0.75rem;
    }

    .panel-body { 
      flex-grow: 1;
      padding: 0 0.75rem;
      overflow-y: auto; 
      width: 100%;
    }

    .panel-foot {
      padding: 0 0.75rem;
      margin-top: 0.25rem;
    }
  }
}

@media (max-width: 767.98px) {
  /* Extra Small & Small Devices (landscape phones, less than 768px)*/ 
  .side-menu {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-light-rgb),var(--bs-bg-opacity));
    width: 100%;
    max-width: 100%;

    .col-md {
      width: 100% !important;
      max-width: 100% !important;
      &:first-child { z-index: 2; }
    }

    .side-menu-panel-container { 
      width: inherit; 
      border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
    }
    .side-menu-panel { width: inherit; }
    .side-menu-panel .panel-body { overflow-y: unset; }
  }
}

/* Card Styles */
.cards {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: stretch;
}

.card {
  margin: 0.5rem;  
  text-decoration: none;
  &.std-card { width: 320px; }
  .card-img-top { aspect-ratio: 3 / 2; } 
}

a.card:hover { border-color: var(--bs-gray-500); }

@media (max-width: 767.98px) {
  /* Extra Small & Small Devices (landscape phones, less than 768px)*/ 
  .cards { 
    flex-direction: column; 
    align-items: center;
  }
  .card.std-card { width: 100%; }
  .swiper-wrapper .card.std-card { max-width: 320px; }
}

.card-footer.no-style {
  border-top: 0;
  padding-top: 0;
  padding-bottom: 1rem;
  background-color: transparent;
}

.card.card-v {
  height: 100%;
  .card-head.image-header {
    position: relative;
    width: 100%;
    padding-top: 66%;
    img {
      aspect-ratio: 3/1 !important;
      position: absolute;
      top: 0;
      width: 100% !important;
      height: 100%;
      object-fit: cover;
    }
  }
}

/* carousel */
.carousel-indicators {
  left: unset;
  justify-content: flex-end;
  [data-bs-target] {
    width: 1rem;
    height: 1rem;
    border-top: unset;
    border-bottom: unset;
    border-radius: 0.5rem;
  }
  .active {
    width: 3rem;
  }
}

/* Swiper */
.swiper { padding: 0 2rem; }
.swiper-button-prev,
.swiper-button-next {
  display: block;
  position: static;
  padding: 0 1rem;
  width: auto;
}

/* table */
.table:not(.table-sm) {
  --table-cell-padding-y: 0.5rem;
  --table-cell-padding-x: 0.5rem;
  td, th {
    padding: var(--table-cell-padding-y) var(--table-cell-padding-x);
  }
}

table.dataTable thead>tr>th.dt-orderable-asc span.dt-column-order:before, 
table.dataTable thead>tr>th.dt-orderable-asc span.dt-column-order:after, 
table.dataTable thead>tr>th.dt-orderable-desc span.dt-column-order:before, 
table.dataTable thead>tr>th.dt-orderable-desc span.dt-column-order:after, 
table.dataTable thead>tr>th.dt-ordering-asc span.dt-column-order:before, 
table.dataTable thead>tr>th.dt-ordering-asc span.dt-column-order:after, 
table.dataTable thead>tr>th.dt-ordering-desc span.dt-column-order:before, 
table.dataTable thead>tr>th.dt-ordering-desc span.dt-column-order:after, 
table.dataTable thead>tr>td.dt-orderable-asc span.dt-column-order:before, 
table.dataTable thead>tr>td.dt-orderable-asc span.dt-column-order:after, 
table.dataTable thead>tr>td.dt-orderable-desc span.dt-column-order:before, 
table.dataTable thead>tr>td.dt-orderable-desc span.dt-column-order:after, 
table.dataTable thead>tr>td.dt-ordering-asc span.dt-column-order:before, 
table.dataTable thead>tr>td.dt-ordering-asc span.dt-column-order:after, 
table.dataTable thead>tr>td.dt-ordering-desc span.dt-column-order:before, 
table.dataTable thead>tr>td.dt-ordering-desc span.dt-column-order:after {
  line-height: 10px;
}


table.dataTable input.dt-select-checkbox:checked:after,
table.dataTable input.dt-select-checkbox:indeterminate:after {
  content: unset;
}

table.table.dataTable > tbody > tr.selected > * {
  --dt-row-selected: 226, 227, 229;
  --dt-row-selected-text: #000;
  border-color: #b5b6b8;
}

table.dataTable tr.dtrg-group th {
  background-color: #ecedee;
  border-bottom-color: #bFC1C5;
}

.navbar .cart-badge:after {
  content:attr(value);
  font-size:12px;
  color: #fff;
  background: #dc3545;
  border-radius:50%;
  padding: 0 5px;
  position:relative;
  left:-8px;
  top:-10px;
  opacity:0.9;
}

table.table.table-hover > tbody > tr.disabled:hover > *,
table.table.data-table.table-hover > tbody > tr.disabled:hover > * {
  box-shadow: unset;
}

/* PDF.js */
.pdf-viewer {
  max-height: 80vh;
  overflow-y: auto;
  color: #fff;
  background-color: RGBA(var(--bs-secondary-rgb), var(--bs-bg-opacity, 1));
  scrollbar-color: var(--bs-gray-600) var(--bs-gray-300);
  padding: 20px;
  border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color)!important;
  canvas {
    display: block;
    margin: 0 auto 20px auto;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    max-width: 100%;
  }
}