﻿.popover {
  border-radius: 0.5rem;
  background-color: #007bff;
  color: white;
  border: none !important;
}

.custom-popover .popover-header {
  background-color: #007bff; /* Same as body */
  color: white;
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
  display: flex;
  justify-content: space-between;
  align-items: self-start;
  padding: 0.5rem 0.5rem;
  text-transform: none;
  border-bottom-left-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}

  .custom-popover .popover-header .close {
    color: white;
    font-size: 1.2rem;
    cursor: pointer;
    border: none;
    background: transparent;
  }

.custom-popover .popover-body {
  background-color: #007bff; /* Same as header */
  color: white;
  border-bottom-left-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
  padding: 1rem;
}

.custom-popover.bs-popover-bottom .popover-arrow::before {
  border-bottom-color: #007bff;
}

.custom-popover.bs-popover-top .popover-arrow::before {
  border-bottom-color: #007bff;
}

.bs-popover-auto[data-popper-placement^="bottom"] > .popover-arrow::after, .bs-popover-bottom > .popover-arrow::after {
  border-bottom-color: #007bff;
  background-color: transparent;
  box-shadow: none;
}

.bs-popover-auto[data-popper-placement^="top"] > .popover-arrow::after, .bs-popover-top > .popover-arrow::after {
  border-bottom-color: #007bff;
  background-color: transparent;
  box-shadow: none;
}

.bs-popover-auto[data-popper-placement^="bottom"] .popover-header::before, .bs-popover-bottom .popover-header::before {
  border-bottom: none;
}

.bs-popover-auto[data-popper-placement^="bottom"] > .popover-arrow, .bs-popover-bottom > .popover-arrow {
  top: calc(-0.9 * (var(--bs-popover-arrow-height)) - var(--bs-popover-border-width));
}

.bs-popover-auto[data-popper-placement^="top"] .popover-header::before, .bs-popover-top .popover-header::before {
  border-bottom: none;
}

.bs-popover-auto[data-popper-placement^="top"] > .popover-arrow, .bs-popover-top > .popover-arrow {
  top: calc(-0.9 * (var(--bs-popover-arrow-height)) - var(--bs-popover-border-width));
}
