/*
 * Bootstrap 5 JS compatibility for the Bootstrap 4 based theme CSS.
 * BS5 positions tooltips/popovers with Popper 2 (data-popper-placement) and
 * renders .tooltip-arrow / .popover-arrow instead of .arrow, so the theme's
 * BS4 placement rules no longer match. Colours and sizes mirror the theme.
 */

/* Tooltip */
.tooltip .tooltip-arrow {
  position: absolute;
  display: block;
  width: 0.8rem;
  height: 0.4rem; }
  .tooltip .tooltip-arrow::before {
    position: absolute;
    content: "";
    border-color: transparent;
    border-style: solid; }

.bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow {
  bottom: -0.4rem; }
  .bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before {
    top: -1px;
    border-width: 0.4rem 0.4rem 0;
    border-top-color: #000; }

.bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow {
  left: -0.4rem;
  width: 0.4rem;
  height: 0.8rem; }
  .bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before {
    right: -1px;
    border-width: 0.4rem 0.4rem 0.4rem 0;
    border-right-color: #000; }

.bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow {
  top: -0.4rem; }
  .bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::before {
    bottom: -1px;
    border-width: 0 0.4rem 0.4rem;
    border-bottom-color: #000; }

.bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow {
  right: -0.4rem;
  width: 0.4rem;
  height: 0.8rem; }
  .bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow::before {
    left: -1px;
    border-width: 0.4rem 0 0.4rem 0.4rem;
    border-left-color: #000; }

/* Popover */
.popover .popover-arrow {
  position: absolute;
  display: block;
  width: 1rem;
  height: 0.5rem; }
  .popover .popover-arrow::before, .popover .popover-arrow::after {
    position: absolute;
    display: block;
    content: "";
    border-color: transparent;
    border-style: solid; }

.bs-popover-auto[data-popper-placement^="top"] > .popover-arrow {
  bottom: calc((0.5rem + 1px) * -1); }
  .bs-popover-auto[data-popper-placement^="top"] > .popover-arrow::before {
    bottom: 0;
    border-width: 0.5rem 0.5rem 0;
    border-top-color: rgba(0, 0, 0, 0.25); }
  .bs-popover-auto[data-popper-placement^="top"] > .popover-arrow::after {
    bottom: 1px;
    border-width: 0.5rem 0.5rem 0;
    border-top-color: #fff; }

.bs-popover-auto[data-popper-placement^="right"] > .popover-arrow {
  left: calc((0.5rem + 1px) * -1);
  width: 0.5rem;
  height: 1rem; }
  .bs-popover-auto[data-popper-placement^="right"] > .popover-arrow::before {
    left: 0;
    border-width: 0.5rem 0.5rem 0.5rem 0;
    border-right-color: rgba(0, 0, 0, 0.25); }
  .bs-popover-auto[data-popper-placement^="right"] > .popover-arrow::after {
    left: 1px;
    border-width: 0.5rem 0.5rem 0.5rem 0;
    border-right-color: #fff; }

.bs-popover-auto[data-popper-placement^="bottom"] > .popover-arrow {
  top: calc((0.5rem + 1px) * -1); }
  .bs-popover-auto[data-popper-placement^="bottom"] > .popover-arrow::before {
    top: 0;
    border-width: 0 0.5rem 0.5rem 0.5rem;
    border-bottom-color: rgba(0, 0, 0, 0.25); }
  .bs-popover-auto[data-popper-placement^="bottom"] > .popover-arrow::after {
    top: 1px;
    border-width: 0 0.5rem 0.5rem 0.5rem;
    border-bottom-color: #fff; }
.bs-popover-auto[data-popper-placement^="bottom"] .popover-header::before {
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  width: 1rem;
  margin-left: -0.5rem;
  content: "";
  border-bottom: 1px solid #f7f7f7; }

.bs-popover-auto[data-popper-placement^="left"] > .popover-arrow {
  right: calc((0.5rem + 1px) * -1);
  width: 0.5rem;
  height: 1rem; }
  .bs-popover-auto[data-popper-placement^="left"] > .popover-arrow::before {
    right: 0;
    border-width: 0.5rem 0 0.5rem 0.5rem;
    border-left-color: rgba(0, 0, 0, 0.25); }
  .bs-popover-auto[data-popper-placement^="left"] > .popover-arrow::after {
    right: 1px;
    border-width: 0.5rem 0 0.5rem 0.5rem;
    border-left-color: #fff; }

/* BS5 puts .show on the dropdown toggle instead of the parent .dropdown */
.navbar-light .navbar-nav .dropdown .has-arrow.show:after {
  -webkit-transform: translateY(-50%) rotate(180deg);
  -ms-transform: translateY(-50%) rotate(180deg);
  transform: translateY(-50%) rotate(180deg); }

/* Modal "static backdrop" bounce that BS5 adds when clicking outside a static modal */
.modal.modal-static .modal-dialog {
  transform: scale(1.02); }