/**
 * Pose (Berbagi Pose) form + visual-first card + masonry feed.
 *
 * @package AkuAjae_Community_Core
 */

  /* ─── Masonry feed layout ────────────────────────────────── */

  .acc-feed--layout-masonry {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    align-items: start;
  }

  @media (min-width: 1024px) {
    .acc-feed--layout-masonry {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }

  @media (max-width: 480px) {
    .acc-feed--layout-masonry {
      grid-template-columns: 1fr;
    }
  }

  /*
   * Empty / error states are direct children of the masonry grid.
   * Without a full span they occupy only one column (~½ / ⅓ width).
   * List-layout categories use flex so .acc-empty is naturally full width.
   */
  .acc-feed--layout-masonry > .acc-empty {
    grid-column: 1 / -1;
    width: 100%;
    max-width: none;
    box-sizing: border-box;
  }

  .acc-feed--layout-masonry .acc-thread-card,
  .acc-feed--layout-masonry .acc-pose-card {
    width: 100%;
  }

  /* ─── Form ───────────────────────────────────────────────── */

  .acc-pose-form {
    display: flex;
    flex-direction: column;
    gap: var(--acc-space-4);
    font-family: var(--acc-font-family);
    color: var(--acc-color-text);
  }

  .acc-pose-form input,
  .acc-pose-form textarea,
  .acc-pose-form button {
    font-family: var(--acc-font-family);
  }


  .acc-pose-form__upload-btn {
    display: inline-flex;
    cursor: pointer;
  }

  .acc-pose-form__upload-btn .acc-btn {
    pointer-events: none;
    gap: var(--acc-space-2);
  }


  /* ─── Card (visual-first) ────────────────────────────────── */

  .acc-pose-card {
    display: block;
    padding: 0;
    overflow: hidden;
  }

  .acc-pose-card__thumb {
    position: relative;
    width: 100%;
    aspect-ratio: auto;
    min-height: 160px;
    max-height: 480px;
    overflow: hidden;
    background: var(--acc-color-bg-soft);
  }

  .acc-pose-card__thumb img {
    width: 100%;
    height: 100%;
    max-height: 480px;
    display: block;
    object-fit: cover;
    -webkit-user-drag: none;
    user-select: none;
    vertical-align: middle;
  }


  .acc-pose-card__body {
    padding: var(--acc-space-2) var(--acc-space-3) var(--acc-space-3);
    gap: var(--acc-space-2);
  }

  .acc-pose-card__body-only {
    padding: var(--acc-space-4) var(--acc-space-3) var(--acc-space-2);
    display: flex;
    flex-direction: column;
    gap: var(--acc-space-2);
  }

  .acc-pose-card__body-only .acc-thread-card__title {
    font-size: var(--acc-font-size-sm);
    margin: 0;
  }

  .acc-pose-card__pin {
    align-self: flex-start;
    margin-bottom: 2px;
  }

  .acc-pose-card__footer {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
    gap: var(--acc-space-2);
    align-items: center;
  }

  .acc-pose-card__footer .acc-thread-card__meta {
    font-size: var(--acc-font-size-xs);
    min-width: 0;
    flex: 1 1 auto;
  }


  .acc-pose-card__footer .acc-thread-card__stats {
    flex-shrink: 0;
    gap: var(--acc-space-1);
  }

  /* Masonry: cards stack as blocks, full-bleed image */
  .acc-feed--layout-masonry .acc-pose-card {
    width: 100%;
  }

  .acc-feed--layout-masonry .acc-pose-card.acc-thread-card--has-thumb {
    grid-template-columns: minmax(0, 1fr);
  }

  @media (min-width: 768px) {
    /* Override default thread-card side-thumb layout for pose */
    .acc-pose-card.acc-thread-card--has-thumb {
      display: block;
    }

    .acc-pose-card.acc-thread-card--has-thumb .acc-pose-card__thumb {
      width: 100%;
    }
  }