/* Application components that replace Bootstrap 3 features removed in Bootstrap 5. */
.card {
  margin-bottom: 1.25rem;
}

.accordion > .card {
  margin-bottom: 0;
}

.card.border-primary > .card-header,
.card.border-success > .card-header,
.card.border-info > .card-header,
.card.border-warning > .card-header,
.card.border-danger > .card-header {
  color: #fff;
}

.card.border-primary > .card-header { background-color: var(--bs-primary, #0d6efd); }
.card.border-success > .card-header { background-color: var(--bs-success, #198754); }
.card.border-info > .card-header { background-color: var(--bs-info, #0dcaf0); }
.card.border-warning > .card-header { color: #212529; background-color: var(--bs-warning, #ffc107); }
.card.border-danger > .card-header { background-color: var(--bs-danger, #dc3545); }

.oa-well {
  min-height: 20px;
  padding: 1.25rem;
  margin-bottom: 1.25rem;
  color: var(--bs-body-color);
  background-color: var(--bs-tertiary-bg);
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-radius: var(--bs-border-radius);
}

.oa-well-sm {
  padding: 0.625rem;
  border-radius: var(--bs-border-radius-sm);
}

.oa-well-lg {
  padding: 1.5rem;
  border-radius: var(--bs-border-radius-lg);
}

.oa-thumbnail {
  display: block;
  padding: 0.25rem;
  margin-bottom: 1.25rem;
  color: var(--bs-body-color);
  background-color: var(--bs-body-bg);
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-radius: var(--bs-border-radius);
}

.oa-thumbnail > img,
.oa-thumbnail a > img {
  display: block;
  max-width: 100%;
  height: auto;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .oa-form-horizontal .col-form-label {
    text-align: right;
  }
}

.oa-navbar-header {
  display: contents;
}

.oa-form-inline {
  display: inline-block;
  width: auto;
  vertical-align: middle;
}

form.oa-form-inline[role="form"] {
  display: inline-flex;
  align-items: center;
  float: none;
  gap: 0.25rem;
  margin: 5px 0.25rem 5px 0;
  vertical-align: middle;
}

form.oa-form-inline[role="form"] .oa-form-group {
  margin: 0 !important;
}

form.oa-form-inline[role="form"] + .pagination {
  display: inline-flex;
  float: none;
  vertical-align: middle;
}

form.oa-form-inline[role="form"] ~ .pagination-data {
  float: none;
  vertical-align: middle;
}

.oa-btn-xs {
  --bs-btn-padding-y: 0.125rem;
  --bs-btn-padding-x: 0.375rem;
  --bs-btn-font-size: 0.75rem;
  --bs-btn-border-radius: var(--bs-border-radius-sm);
}

.oa-btn-group-justified > .btn,
.oa-btn-group-justified > .btn-group {
  flex: 1 1 0;
}

.oa-pre-scrollable {
  max-height: 340px;
}

.oa-input-group-btn {
  position: relative;
  display: flex;
  align-items: stretch;
}

.input-group > .oa-input-group-btn:not(:last-child) > .btn {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.input-group > .oa-input-group-btn:not(:first-child) > .btn {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.oa-progress-striped > .progress-bar {
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-size: 1rem 1rem;
}

.oa-progress-striped.active > .progress-bar {
  animation: 1s linear infinite progress-bar-stripes;
}

.oa-has-error .form-control,
.oa-has-error .form-select {
  border-color: var(--bs-danger);
}

.oa-has-error .col-form-label,
.oa-has-error .form-label,
.oa-has-error .form-check-label,
.oa-has-error .form-text {
  color: var(--bs-danger);
}

.oa-has-success .form-control,
.oa-has-success .form-select {
  border-color: var(--bs-success);
}

.oa-has-warning .form-control,
.oa-has-warning .form-select {
  border-color: var(--bs-warning);
}

/* Angular UI Bootstrap 0.14 still creates list wrappers around dropdown links. */
.dropdown-menu > li > a:not(.dropdown-item) {
  display: block;
  width: 100%;
  padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);
  clear: both;
  color: var(--bs-dropdown-link-color);
  text-align: inherit;
  text-decoration: none;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
}

.dropdown-menu > li > a:not(.dropdown-item):hover,
.dropdown-menu > li > a:not(.dropdown-item):focus,
.dropdown-menu > li.active > a:not(.dropdown-item) {
  color: var(--bs-dropdown-link-hover-color);
  background-color: var(--bs-dropdown-link-hover-bg);
}

.dropdown-menu > li.disabled > a:not(.dropdown-item) {
  color: var(--bs-dropdown-link-disabled-color);
  pointer-events: none;
}

.dropdown-menu > li.active > .dropdown-item {
  color: var(--bs-dropdown-link-active-color);
  background-color: var(--bs-dropdown-link-active-bg);
}

.oa-datetimepicker > .dropdown-toggle::after {
  display: none;
}

.form-check{
  padding-left: 0;
  padding-top: 0.75em;
  padding-bottom: 0.75em;
}
.form-check .form-check-input{
  margin-left: 0;
  margin-right: 0.5em;
}
/* Preserve the close-first source order used by the Angular modal templates. */
.modal-header > .modal-title {
  order: 1;
}

.modal-header > .btn-close {
  order: 2;
  margin-left: auto;
}

/* Angular UI Bootstrap controls visibility and placement without Popper. */
.tooltip,
.popover {
  position: absolute;
}

.tooltip.in {
  opacity: var(--bs-tooltip-opacity, 0.9);
}

.tooltip-inner {
  padding: .4rem .75rem;
  border-radius: var(--bs-border-radius, .5rem);
}

.tooltip.top,
.tooltip.bottom {
  padding: var(--bs-tooltip-arrow-height) 0;
}

.tooltip.right,
.tooltip.left {
  padding: 0 var(--bs-tooltip-arrow-height);
}

.tooltip.top { margin-top: calc(-0.5 * var(--bs-tooltip-arrow-height)); }
.tooltip.right { margin-left: calc(0.5 * var(--bs-tooltip-arrow-height)); }
.tooltip.bottom { margin-top: calc(0.5 * var(--bs-tooltip-arrow-height)); }
.tooltip.left { margin-left: calc(-0.5 * var(--bs-tooltip-arrow-height)); }

.tooltip .tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}

.tooltip .tooltip-arrow::before {
  display: none;
}

.tooltip.top .tooltip-arrow {
  bottom: 0;
  left: 50%;
  margin-left: calc(-0.5 * var(--bs-tooltip-arrow-width));
  border-width: var(--bs-tooltip-arrow-height) calc(0.5 * var(--bs-tooltip-arrow-width)) 0;
  border-top-color: var(--bs-tooltip-bg);
}

.tooltip.right .tooltip-arrow {
  top: 50%;
  left: 0;
  margin-top: calc(-0.5 * var(--bs-tooltip-arrow-width));
  border-width: calc(0.5 * var(--bs-tooltip-arrow-width)) var(--bs-tooltip-arrow-height) calc(0.5 * var(--bs-tooltip-arrow-width)) 0;
  border-right-color: var(--bs-tooltip-bg);
}

.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: calc(-0.5 * var(--bs-tooltip-arrow-width));
  border-width: 0 calc(0.5 * var(--bs-tooltip-arrow-width)) var(--bs-tooltip-arrow-height);
  border-bottom-color: var(--bs-tooltip-bg);
}

.tooltip.left .tooltip-arrow {
  top: 50%;
  right: 0;
  margin-top: calc(-0.5 * var(--bs-tooltip-arrow-width));
  border-width: calc(0.5 * var(--bs-tooltip-arrow-width)) 0 calc(0.5 * var(--bs-tooltip-arrow-width)) var(--bs-tooltip-arrow-height);
  border-left-color: var(--bs-tooltip-bg);
}

.tooltip.show,
.popover.show {
  display: block;
}

.collapse.in {
  display: block;
}

.carousel .item.carousel-item {
  transition: none;
}

.tab-content > .tab-pane.active {
  display: block;
}
