/*
  Wortic macOS UI Kit — Empty State / ContentUnavailableView / Placeholder
  wm-empty
*/

@layer components {
  .wm-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--wm-space-3);
    padding: var(--wm-space-13) var(--wm-space-10);
    text-align: center;
  }

  .wm-empty__icon {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--wm-space-3);
    background: var(--wm-fill-secondary);
    color: var(--wm-label-tertiary);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4),
      inset 0 0 0 0.5px var(--wm-separator);
  }
  :root[data-theme="dark"] .wm-empty__icon {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06),
      inset 0 0 0 0.5px var(--wm-separator);
  }
  .wm-empty__icon .wm-icon { width: 26px; height: 26px; }

  .wm-empty--accent .wm-empty__icon {
    background: var(--wm-accent-fill);
    color: var(--wm-accent);
  }

  .wm-empty__title {
    font-size: var(--wm-font-size-title3);
    font-weight: var(--wm-font-weight-semibold);
    letter-spacing: var(--wm-letter-spacing-tight);
    color: var(--wm-label-primary);
  }

  .wm-empty__desc {
    max-width: 340px;
    font-size: var(--wm-font-size-subheadline);
    color: var(--wm-label-secondary);
    line-height: var(--wm-line-height-relaxed);
  }

  .wm-empty__actions {
    display: flex;
    gap: var(--wm-space-4);
    margin-top: var(--wm-space-5);
  }

  .wm-empty--compact {
    padding: var(--wm-space-9) var(--wm-space-8);
  }
  .wm-empty--compact .wm-empty__icon { width: 40px; height: 40px; }
  .wm-empty--compact .wm-empty__icon .wm-icon { width: 18px; height: 18px; }
  .wm-empty--compact .wm-empty__title { font-size: var(--wm-font-size-headline); }
}