/* Wrapper Relativo */
.ui-popover-wrapper {
  position: relative;
  display: inline-block;
}

/* Painel Flutuante */
.ui-popover-panel {
  position: absolute;
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  z-index: var(--ui-z-popover);
  width: 280px;
  background-color: var(--ui-bg-card);
  border: 1px solid var(--ui-border-color);
  border-radius: var(--ui-radius-lg);
  box-shadow: var(--ui-shadow-lg);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--ui-transition-fast), transform var(--ui-transition-fast), visibility var(--ui-transition-fast);
}

/* Posicionamento Inferior (Padrão) */
.ui-popover-wrapper.is-pos-bottom .ui-popover-panel {
  top: calc(100% + var(--ui-space-2));
}

/* Posicionamento Superior */
.ui-popover-wrapper.is-pos-top .ui-popover-panel {
  bottom: calc(100% + var(--ui-space-2));
  transform: translateX(-50%) translateY(-4px);
}

.ui-popover-panel:not([hidden]) {
  display: block;
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

/* Cabeçalho do Popover */
.ui-popover-header {
  padding: var(--ui-space-3) var(--ui-space-4);
  background-color: var(--ui-bg-surface);
  border-bottom: 1px solid var(--ui-border-color);
  border-radius: var(--ui-radius-lg) var(--ui-radius-lg) 0 0;
}

.ui-popover-title {
  margin: 0;
  font-family: var(--ui-font-sans);
  font-size: var(--ui-font-size-sm);
  font-weight: var(--ui-font-weight-semibold);
  color: var(--ui-text-primary);
}

/* Corpo do Popover */
.ui-popover-body {
  padding: var(--ui-space-4);
  font-family: var(--ui-font-sans);
  font-size: var(--ui-font-size-xs);
  line-height: var(--ui-line-height-normal);
  color: var(--ui-text-secondary);
}

.ui-popover-body p:last-child {
  margin-bottom: 0;
}