/*! PLF v0.1.0 | MIT */
/* extension: sortable list with drag handles */
[data-plf-root] .sortable {
  position: relative;
  display: flex;
  min-width: 0px;
  flex-direction: column;
  gap: var(--plf-sortable-gap, var(--plf-space-2));
  margin: 0;
  padding: 0;
  list-style: none;
}
[data-plf-root] .sortable:where([data-plf-orientation="horizontal"]) {
  flex-direction: row;
  padding-block: var(--plf-space-1);
  overflow-x: auto;
}
[data-plf-root] .sortable:where([data-plf-orientation="grid"]) {
  display: grid;
  grid-template-columns: repeat(var(--plf-sortable-columns, 3), minmax(0, 1fr));
}
[data-plf-root] .sortable-item {
  box-sizing: border-box;
  display: flex;
  min-width: 0px;
  flex: none;
  align-items: center;
  overflow-wrap: anywhere;
  gap: var(--plf-space-2);
  min-block-size: var(--plf-control-height-md);
  padding: var(--plf-space-1) var(--plf-space-3);
  padding-inline-start: var(--plf-space-1);
  border: var(--plf-border-width) solid var(--plf-sortable-border, var(--plf-color-border-subtle));
  border-radius: var(--plf-sortable-radius, var(--plf-radius-lg));
  background: var(--plf-sortable-bg, var(--plf-color-surface));
  color: var(--plf-color-text);
  font: var(--plf-font-weight-normal) var(--plf-font-size-sm)/1.25 var(--plf-font-family);
}
[data-plf-root] .sortable-name {
  min-width: 0px;
  flex: 1;
}
[data-plf-root] .sortable-meta {
  flex: none;
  color: var(--plf-color-text-muted);
  font-size: var(--plf-font-size-xs);
}
[data-plf-root] .sortable-handle {
  box-sizing: border-box;
  display: inline-grid;
  flex: none;
  place-items: center;
  inline-size: var(--plf-control-height-sm);
  block-size: var(--plf-control-height-sm);
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--plf-radius-md);
  background: transparent;
  box-shadow: none;
  color: var(--plf-color-text-muted);
  font: inherit;
  letter-spacing: normal;
  text-transform: none;
  cursor: grab;
  touch-action: none;
}
[data-plf-root] .sortable-handle:where(:disabled) {
  cursor: not-allowed;
  opacity: 0.5;
}
[data-plf-root] .sortable-item:where(.sortable-item-media) {
  position: relative;
  flex-direction: column;
  align-items: stretch;
  gap: var(--plf-space-1);
  padding: var(--plf-space-1);
}
[data-plf-root] .sortable-media {
  display: block;
  -webkit-user-select: none;
  user-select: none;
  inline-size: 100%;
  block-size: auto;
  aspect-ratio: 1;
  border-radius: var(--plf-radius-md);
  object-fit: cover;
  -webkit-user-drag: none;
}
[data-plf-root] :where(.sortable-item-media) > .sortable-handle {
  position: absolute;
  inset-block-start: var(--plf-space-2);
  inset-inline-start: var(--plf-space-2);
  background: var(--plf-color-surface);
  color: var(--plf-color-text);
  box-shadow: var(--plf-shadow-xs);
}
[data-plf-root] :where(.sortable-item-media) > .sortable-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-inline: var(--plf-space-1);
  color: var(--plf-color-text-muted);
  font-size: var(--plf-font-size-xs);
}
[data-plf-root] :is(.sortable-icon, :where(.sortable-handle) > .icon) {
  pointer-events: none;
  inline-size: var(--plf-control-icon-size);
  block-size: var(--plf-control-icon-size);
}
[data-plf-root] .sortable-handle:where(:not(:has(> :first-child)))::before {
  pointer-events: none;
  content: "";
  inline-size: var(--plf-control-icon-size);
  block-size: var(--plf-control-icon-size);
  background-color: currentcolor;
  mask: var(--_plf-icon-grip-vertical) center / 100% 100% no-repeat;
  forced-color-adjust: preserve-parent-color;
}
@media (forced-colors: active) {
  @supports not (forced-color-adjust: preserve-parent-color) {
    [data-plf-root] .sortable-handle:where(:not(:has(> :first-child)))::before {
      background-color: CanvasText;
    }
  }
}
[data-plf-root] .sortable-item:where([data-plf-sortable-grabbed]) {
  border-color: var(--plf-color-primary);
  background: var(--plf-sortable-grabbed-bg, var(--plf-color-primary-subtle));
}
[data-plf-root] .sortable-handle:where([aria-pressed="true"]) {
  background: var(--plf-color-primary);
  color: var(--plf-color-on-primary);
  cursor: grabbing;
}
[data-plf-root] .sortable-item:where([data-plf-sortable-dragging]) {
  position: relative;
  z-index: 1;
  border-color: var(--plf-color-primary);
  box-shadow: var(--plf-shadow-lg);
  cursor: grabbing;
}
[data-plf-root] :where(.sortable-item[data-plf-sortable-dragging]) .sortable-handle {
  cursor: grabbing;
}
[data-plf-root] .sortable-handle:focus-visible {
  outline: var(--plf-focus-width) solid var(--plf-focus-color);
  outline-offset: calc(-1 * var(--plf-focus-width));
}
[data-plf-root] .sortable-handle:where(:not(:disabled, [aria-pressed="true"])):hover {
  background: linear-gradient(var(--plf-color-surface-muted) 0 0), var(--plf-color-surface);
  color: var(--plf-color-text);
}
[data-plf-root] [data-plf-part~="sortable-status"] {
  position: absolute;
  overflow: hidden;
  white-space: nowrap;
  inline-size: 1px;
  block-size: 1px;
  margin: -1px;
  padding: 0;
  clip-path: inset(50%);
}
[data-plf-root] :where(.sortable, .sortable-item, .sortable-handle, .sortable-name, .sortable-meta, .sortable-media, .sortable-icon)[hidden] {
  display: none !important;
}