/*
 * Talk attachments — the admin list of uploaded files and the drag-&-drop
 * upload well. Layout/reset come from utilities in the markup (u-list-plain,
 * u-flex-fill, u-well, u-visually-hidden, and u-surface-active toggled by the
 * attachment-upload controller for drag-over); only the bespoke bits live here.
 * See admin/talks/attachments/*.
 */
@layer components {
  .attachments {
    display: flex;
    flex-direction: column;
    gap: calc(var(--u-pad) / 4);
  }

  .attachments__item {
    display: flex;
    align-items: baseline;
    gap: calc(var(--u-pad) / 2);
    padding-block: calc(var(--u-pad) / 2);
    border-block-end: var(--border-size-1) solid var(--line);
  }

  .attachments__name { overflow-wrap: anywhere; }
  .attachments__meta { flex-shrink: 0; }
  .attachments__delete { flex-shrink: 0; }

  /* The upload well: border/radius via u-well; the whole label is the surface. */
  .dropzone { background: var(--fill-subtle, transparent); }

  .dropzone__label {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(var(--u-pad) / 4);
    padding: var(--u-pad);
    text-align: center;
    cursor: pointer;
  }

  .dropzone__browse { color: var(--link); text-decoration: underline; }
}