/* Cloudjet Finance theme: charcoal, white and yellow over the inherited red Bootstrap build.
   Loaded after custom.css. Semantic error colours (form errors, alerts) are left red on purpose. */
:root {
  --primary-rgb: 23, 25, 24;
  --primary-color: #171918;
  --secondary-color: #4d4f51;
  --bs-primary: #171918;
  --bs-primary-rgb: 23, 25, 24;
  --cj-yellow: #f3d744;
  --cj-charcoal: #171918;
  --cj-paper: #f2f3ee;
}
.bg-primary, .footer.bg-primary, .modal-header.bg-primary, .modal-header { background-color: var(--cj-charcoal) !important; color: #fff; }
.modal-header .btn-close { filter: invert(1); }
.text-primary { color: var(--cj-charcoal) !important; }
.border-primary { border-color: var(--cj-yellow) !important; }
.app-header.border-primary { border-bottom-color: var(--cj-yellow) !important; }
.btn-primary, .btn-danger:not(.btn-outline-danger), .generate-btn, .scrollToTop {
  background-color: var(--cj-yellow) !important; border-color: var(--cj-yellow) !important; color: var(--cj-charcoal) !important;
}
.btn-primary:hover, .btn-danger:hover, .generate-btn:hover { background-color: #e6c92c !important; border-color: #e6c92c !important; color: var(--cj-charcoal) !important; }
.btn-outline-danger { color: var(--cj-charcoal); border-color: var(--cj-charcoal); }
.btn-outline-danger:hover { background-color: var(--cj-charcoal); color: #fff; }
.section-heading, .metric-value, .card-title { color: var(--cj-charcoal) !important; }
/* Header rule is a hairline, as in the Supplies tables; the accent is not used to underline. */
.table thead, .table thead th, thead { background-color: #f5f5f0 !important; color: #141414 !important; border-bottom: 1px solid #e6e6df; }
.table-primary, .table-danger { --bs-table-bg: var(--cj-paper); }
.card.financial-metric-card { border-top-color: var(--cj-yellow) !important; }
.badge.bg-danger { background-color: var(--cj-charcoal) !important; }
.nav-pills .nav-link.active, .page-item.active .page-link { background-color: var(--cj-charcoal) !important; border-color: var(--cj-charcoal) !important; color: #fff !important; }
a { color: var(--cj-charcoal); }
.side-menu__item.active, .slide.active > .side-menu__item { color: var(--cj-yellow) !important; }
.app-sidebar, .main-sidebar, .main-sidebar-header { background-color: var(--cj-charcoal) !important; }
/* Every table header gets the one Supplies treatment. Several views still carry bg-primary or
   text-white on the thead or its row; those utilities are !important, and left alone they paint
   white text onto the light header, so they are neutralised here for the cells as well. */
.table thead th,
.table thead.text-white th, .table thead tr.text-white th, .table thead th.text-white,
.table thead.bg-primary th, .table thead.bg-danger th, .table thead.bg-dark th,
.table thead tr.bg-primary th, .table thead tr.bg-danger th,
thead.bg-primary th, thead.bg-danger th, thead.bg-dark th {
  background-color: #f5f5f0 !important; color: #141414 !important;
}
.table thead.bg-primary, .table thead.bg-danger, .table thead.bg-dark,
.table thead tr.bg-primary, .table thead tr.bg-danger,
thead.bg-primary, thead.bg-danger, thead.bg-dark {
  background-color: #f5f5f0 !important; color: #141414 !important;
}
.btn.bg-danger, .bg-danger:not(.badge):not(.alert), .btn-group .btn-danger.active, .btn-check:checked + .btn-danger { background-color: var(--cj-yellow) !important; border-color: var(--cj-yellow) !important; color: var(--cj-charcoal) !important; }
.main-sidebar-header .header-logo img { max-height: 40px; }