/* © Camarade Agency (camarade.agency) */
/* -------------------------------------------------------------------------- */
/* POPOVER — shared structural styles (box, arrow, close button)
/* Module-specific styles (width, content typography) stay in each module's
/* own CSS file — this only covers what every popover has in common.
/* -------------------------------------------------------------------------- */
.ca-popover {
  font-family: var(--e-global-typography-text-font-family), Sans-serif;
  line-height: var(--e-global-typography-text-line-height);
  color: var(--e-global-color-text);
  position: absolute;
  z-index: 9999;
  background: #fff;
  border: 1px solid #C8D5DC;
  box-shadow: 0 5px 20px rgba(0,0,0,0.1);
  padding: 15px 20px;
  display: none;
}
.ca-popover.is-visible {
  display: flex;
  flex-direction: column;
  gap:15px;
}
/* Header : compact label/title block, no gap between lines by default —
   module-specific spacing (e.g. between title and subtitle) stays in the
   module's own CSS file. */
.ca-popover-header {
  display: flex;
  flex-direction: column;
  gap:7.5px;
  margin:-15px -20px 0 -20px;
  padding: 15px 20px;
  border-bottom: 1px solid #C8D5DC;
  line-height:normal;
}
.ca-popover-header .nav_link { font-size:small}
.ca-popover-suptitle {
  font-size: .7em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--e-global-color-text) 50%, transparent);
}
.ca-popover-title {
  font-size: 1em;
  text-transform: uppercase;
  font-family: var(--e-global-typography-primary-font-family), Sans-serif;
  line-height: 1.1em;
}
.ca-popover-subtitle {
  display: block;
  line-height: 1.3em;
  font-size: .9em;
  color: color-mix(in srgb, var(--e-global-color-text) 75%, transparent);
}
/* Body : the actual content (definition, summary, links...), visually
   separated from the header */
.ca-popover-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
/* Arrow — ::before = border color, ::after = white fill */
.ca-popover::before,
.ca-popover::after {
  content: '';
  position: absolute;
  left: var(--arrow-left, 20px);
  transform: translateX(-50%);
  width: 0;
  height: 0;
}
/* Below: arrow points up */
.ca-popover:not(.is-above)::before {
  top: -7.41421356px;
  border-left: 7.41421356px solid transparent;
  border-right: 7.41421356px solid transparent;
  border-bottom: 7.41421356px solid #C8D5DC;
}
.ca-popover:not(.is-above)::after {
  top: -6px;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #fff;
}
/* Above: arrow points down */
.ca-popover.is-above::before {
  bottom: -7.41421356px;
  border-left: 7.41421356px solid transparent;
  border-right: 7.41421356px solid transparent;
  border-top: 7.41421356px solid #C8D5DC;
}
.ca-popover.is-above::after {
  bottom: -6px;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #fff;
}
.ca-popover-close {
  position: absolute;
  top:2px;
  right: 10px;
  display: inline-block;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  user-select: none;
  color: color-mix(in srgb, var(--e-global-color-text) 50%, transparent);
}
.ca-popover-close:hover,
.ca-popover-close:focus-visible {
  color: var(--e-global-color-text);
}
.ca-popover-close:focus-visible {
  outline: 2px solid var(--e-global-color-primary);
  outline-offset: 2px;
}
