/* BASE STYLING  */
body {
  font-family: Arial, sans-serif;
}
:root {
  --bs-link-color-rgb: 39,58,96;
  --bs-link-color: rgb(0, 0, 0);
  --bs-link-hover-color-rgb: 0, 174, 189;
  --bs-link-hover-color: rgb(0, 174, 189);
  --bs-primary-rgb: var(--bs-link-color-rgb);
  --bs-blue: #273A60;
  --bs-primary: var(--bs-blue);
}
.pagination {
  --bs-pagination-active-bg: var(--bs-blue);
  --bs-pagination-active-border-color: var(--bs-blue);
  --bs-pagination-active-color: #FFFFFF;
}

.btn-primary {
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
}

.dropdown-menu {
  --bs-dropdown-link-active-bg: var(--bs-dropdown-link-hover-bg);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: #00AEBD;
  border-color: #00AEBD;
}

.btn-link {
  color: rgba(var(--bs-link-color-rgb),var(--bs-link-opacity,1));
  padding: 0;
}

.btn-outline-primary {
  color: #273A60;
  border-color: #273A60;
}

.btn-outline-primary:hover {
  color: #ffffff;
  background-color: #273A60;
  border-color: #273A60;
}

.btn-outline-primary:active {
  color: #ffffff;
  background-color: #273A60;
  border-color: #273A60;
}

a:hover:not([class]) {
  text-decoration: underline;
}
.asteriskField {
  display: none;
}
.form-label-optional label:not(.requiredField):not(.form-check-label):not(.custom-control-label):after {
  content: '(Optional)';
  display: inline-block;
}
label.form-check-label:after {
  display: none;
}
.form-label-none label {
  display: none;
}
.w-150 {
  max-width: 150px;
}
.w-350 {
  max-width: 350px;
}
.w-500 {
  max-width: 500px;
}
.w-800 {
  max-width: 800px;
}
.w-900 {
  max-width: 900px;
}
.w-1400 {
  max-width: 1400px;
}
.w-full {
  width: 100%;
}
.w-min-300 {
  min-width: 300px;
}
.w-static-250 {
  width: 250px;
}
.htmx-indicator {
  display: none
}
.htmx-request > .htmx-indicator {
  display: block;
}
.htmx-request > .not-indicator {
  display: none;
}
.htmx-request > .loading-indicator {
  filter: blur(2px);
}
.htmx-indicator-loading {
  /*
  add this to the .htmx-indicator element
  Example: <span class="htmx-indicator htmx-indicator-loading">Loading...</span>
  */
  position: absolute;
  top: 100px;
  left: 50%;
  transform: translate(-50%, 0);
  padding: 10px 20px;
  background-color: grey;
  color: white;
  font-size: 1.5em;
  border-radius: 5px;
  z-index: 1000; /* To make sure it appears above the other content */
}

legend {
  width: auto;
  font-size: 1.2rem;
  font-weight: bold;
}

.form-label {
  font-size: 1rem;
  font-weight: normal;
}
.modal-body .form-label {
  font-weight: bold;
}

/* NAVBAR */
.logotype {
  width: 250px;
  height: 70px;
  background-image: url("../images/logotype.577c2d02e9db.svg?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=60");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.navbar {
  background-color: #273A60;
  border-bottom: #273A60 solid 5px;
}

.nav-link:hover {
  color: #00aebd;
}

.nav-link.active {
  color: #00aebd;
}

.nav-pills .nav-link.active {
  background-color: #273A60;
  color: #ffffff;
}

.profile {
  height: 50px;
  display: contents;
}

.profile-icon {
  padding: 13px 0 0 0;
}

.profile-text {
  padding: 13px 20px 0 0;
}

.profile-link {
  padding: 0 8px;
  font-size: 14px;
}

.profile-link-logout {
  font-size: 11px;
}

/* CONTENT BASE */
.bi-caret-right-fill::before {
  font-size: 12px;
  vertical-align: middle;
}

/* Login */
@media (min-width: 576px) {
  .login {
    min-height: 80vh;
    display: flex;
    align-items: center;
  }
}

.tooltip-text {
  visibility: hidden;
  position: absolute;
  z-index: 1;
  width: 300px;
  color: white;
  font-size: 12px;
  font-weight: normal;
  background-color: #192733;
  border-radius: 10px;
  padding: 10px 15px 10px 15px;
  left: -20px;
  top: 100%;
}

.tooltip-text-right {
  left: auto;
  right: 0;
}

.hover-text:hover .tooltip-text {
  visibility: visible;
}

.hover-text {
  position: relative;
  display: inline-block;
  border-bottom: 1px dashed grey;
}

.hover-text::after {
  content: "\F505";
  display: inline-block;
  font-family: "bootstrap-icons";
  font-size: 0.8em;
  margin-top: .125em;
  margin-left: 0.75em;
  margin-right: 0.15em;
}

.hover-text-none::after {
  content: "";
}

.text-warning {
  color: #ffaf00;
}

.hover-text-warning::after {
  content: "\F33A";
  color: rgb(var(--bs-warning-rgb));
}

.hover-text-danger::after {
  content: "\F334";
  color: rgb(var(--bs-danger-rgb));
}

.hover-text-person::after {
  content: "\F8A9";
}

h4 {
  margin-top: 2rem;
}

a[target="_blank"]::after {
  content: "\F143";
  display: inline-block;
  font-family: "bootstrap-icons";
  font-size: 0.8em;
  margin-left: 0.25em;
}

a.icon-over {
  text-decoration: none;
}
a.icon-over::after {
  display: none;
}
a.icon-over:hover::after {
  display: inline-block;
  font-size: 0.5em;
  vertical-align: text-top;
  margin-left: 0;
}

a[target="_blank"].no-icon::after {
  display: none;
}

dd > dl {
  margin-left: 1em;
  font-size: 0.9em;
}

.faq-section dt a,
.faq-section dt a:hover {
  text-decoration: none;
}


:target {
  background-color: #fff9c4;
}

tr.target th,
tr.target td,
tr.target + tr.subsequent-row th,
tr.target + tr.subsequent-row td {
  background-color: #fffde7;
}

.diff {
  font-family: var(--font-family-monospace);
  white-space: pre;
}

.diff-add {
  background-color: rgba(51,153,51,.1);
}

.diff-del {
  background-color: rgba(172,0,0,.1);
}

.diff-empty-bg {
  background-image: repeating-linear-gradient(-45deg,transparent,transparent 5px,rgba(var(--palette-neutral-10,218, 218, 218),1) 6px,rgba(var(--palette-neutral-10,218, 218, 218),1) 7px,transparent 8px);
}

.table-layout-fixed {
  table-layout: fixed;
}

.badge {
  --bs-badge-font-size: 1em;
  --bs-badge-font-weight: 500;
}

#shoppingcartModal .modal-dialog {
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 0;
  height: 100%;
}

#shoppingcartModal .modal-content {
  min-height: 100%;
  border-radius: 0;
}

.table.table-p-0 > * > * > * {
  padding: 0;
}

/* FILTER STYLING */
.hide_filter_inputs {
  overflow: hidden;
  max-height: 0; /* Initially collapsed */
}
#toggle_filters strong {
  cursor: pointer;
}
#toggle_filters i::before {
  font-size: 1.5rem;
  cursor: pointer;
  vertical-align: -7px;
}
#div_id_multi_edit {
  margin-bottom: 0 !important;
}
#filter_form legend {
  font-size: inherit;
}
.small-legend legend {
  font-size: inherit;
}

.table-no-bg {
  --bs-table-bg: inherit;
}

.alert-dismissable-on-click:hover {
  filter: brightness(95%);
  cursor: pointer;
}

.alert-dismissable-on-click .progress-bar {
  --bs-progress-bar-transition: none;
}

.flex-gap {
  gap: 1rem 2rem;
}

.form-check {
  --bs-border-width: 2px;
}
.text-truncate {
  max-width: 8em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mx-n3 {
  margin-left: -1rem;
  margin-right: -1rem;
}

.mb-n3 {
  margin-bottom: -1rem;
}

.z-4 {
  z-index: 4;
}

.fs-7 {
  font-size: 0.8em;
}

.fs-8 {
  font-size: 0.65em;
}

.badge-fs-08 {
  --bs-badge-font-size: 0.8rem
}

.breadcrumb-divider-dash {
  --bs-breadcrumb-divider: '-';
}

[x-cloak] { display: none !important; }