/* Overflow menu (disclosure): <div class="sv-dropdown" data-sv-dropdown> + toggle + .sv-dropdown__panel.
   No-JS fallback: <details class="sv-dropdown"><summary class="sv-button …">…</summary><ul class="sv-dropdown__panel">. */

.sv-dropdown {
  position: relative;
  display: inline-flex;
}

.sv-dropdown__panel {
  position: absolute;
  z-index: var(--sv-z-dropdown);
  inset-block-start: calc(100% + var(--sv-space-1));
  inset-inline-end: 0;
  min-width: 13rem;
  max-width: min(22rem, calc(100vw - 2rem));
  margin: 0;
  padding: var(--sv-space-1);
  border: 1px solid var(--sv-color-border);
  border-radius: var(--sv-radius-lg);
  background: var(--sv-color-surface);
  box-shadow: var(--sv-shadow-lg);
  list-style: none;
  text-align: start;
  animation: sv-pop-in var(--sv-duration-fast) var(--sv-ease);
}
.sv-dropdown--start .sv-dropdown__panel { inset-inline: 0 auto; }
.sv-dropdown--up .sv-dropdown__panel { inset-block: auto calc(100% + var(--sv-space-1)); }
.sv-dropdown__panel li { margin: 0; }
.sv-dropdown__separator {
  height: 0;
  margin: var(--sv-space-1) calc(-1 * var(--sv-space-1));
  border-top: 1px solid var(--sv-color-border);
}
.sv-dropdown__heading {
  padding: var(--sv-space-2) var(--sv-space-3) var(--sv-space-1);
  color: var(--sv-color-text-muted);
  font-size: var(--sv-text-xs);
  font-weight: var(--sv-weight-semibold);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.sv-dropdown__item,
.sv-dropdown__panel li > a,
.sv-dropdown__panel li > button {
  display: flex;
  align-items: center;
  gap: var(--sv-space-3);
  width: 100%;
  min-height: 2.25rem;
  padding: var(--sv-space-2) var(--sv-space-3);
  border: 0;
  border-radius: var(--sv-radius-md);
  background: transparent;
  color: var(--sv-color-text);
  font-size: var(--sv-text-sm);
  font-weight: var(--sv-weight-regular);
  line-height: var(--sv-leading-tight);
  text-align: start;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}
@media (pointer: coarse) {
  .sv-dropdown__item,
  .sv-dropdown__panel li > a,
  .sv-dropdown__panel li > button { min-height: 2.75rem; }
}
.sv-dropdown__item .sv-icon,
.sv-dropdown__panel li > a .sv-icon { color: var(--sv-color-text-muted); }
.sv-dropdown__item:hover,
.sv-dropdown__item:focus-visible,
.sv-dropdown__panel li > a:hover,
.sv-dropdown__panel li > button:hover {
  background: var(--sv-color-surface-sunken);
  text-decoration: none;
}
.sv-dropdown__item:focus-visible { box-shadow: inset 0 0 0 2px var(--sv-color-focus); }
.sv-dropdown__item--danger,
.sv-dropdown__item--danger .sv-icon { color: var(--sv-color-danger); }
.sv-dropdown__item--danger:hover { background: var(--sv-error-bg); }
.sv-dropdown__item[aria-disabled="true"],
.sv-dropdown__item:disabled { color: var(--sv-gray-600); cursor: not-allowed; }

/* <details> fallback. */
details.sv-dropdown > summary { list-style: none; }
details.sv-dropdown > summary::-webkit-details-marker { display: none; }
details.sv-dropdown:not([open]) > .sv-dropdown__panel { display: none; }

/* Split action (core dropbutton / operations rendered by the theme). */
.sv-actions {
  display: inline-flex;
  align-items: center;
  gap: var(--sv-space-1);
}
.sv-actions__primary > a,
.sv-actions__primary > button {
  display: inline-flex;
  align-items: center;
  min-height: var(--sv-control-height-sm);
  padding: 0 var(--sv-space-3);
  border: 1px solid var(--sv-color-border-strong);
  border-radius: var(--sv-radius-md);
  background: var(--sv-color-surface);
  color: var(--sv-color-text);
  font-size: var(--sv-text-sm);
  font-weight: var(--sv-weight-semibold);
  text-decoration: none;
  white-space: nowrap;
}
.sv-actions__primary > a:hover { background: var(--sv-color-surface-sunken); text-decoration: none; }

@keyframes sv-pop-in {
  from { opacity: 0; transform: translateY(-4px) scale(0.98); }
  to { opacity: 1; transform: none; }
}

/* Danger entries of theme-rendered dropbuttons (Delete, Cancel, Remove). */
.sv-dropdown__panel li.is-danger > a,
.sv-dropdown__panel li.is-danger > button { color: var(--sv-color-danger); }
.sv-dropdown__panel li.is-danger > a:hover { background: var(--sv-error-bg); }
