/* New Members R5.1. Functional state is universal; visual fallback rules run
   only when Core explicitly owns presentation. */

[data-mmbt3th-module="new-members"] [hidden],
[data-mmbt3th-module="new-members"][hidden] {
  display: none !important;
}

[data-mmbt3th-module="new-members"][data-mmbt3th-surface="filter"].is-loading button {
  cursor: wait;
}

[data-mmbt3th-module="new-members"][data-mmbt3th-surface="state"][data-new-members-visual-owner="fallback"] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 12px 0 0;
  padding: 10px 12px;
  color: var(--nm-ink, var(--ink-700, #334155));
  text-align: center;
  background: var(--nm-surface-soft, var(--surface-soft, #f8fafc));
  border: 1px solid var(--nm-line, var(--line, #cbd5e1));
  border-radius: var(--nm-state-radius, 10px);
}

[data-mmbt3th-module="new-members"][data-mmbt3th-surface="state"][data-new-members-visual-owner="fallback"].is-error {
  color: var(--nm-error-ink, #7c263d);
  background: var(--nm-error-surface, #fff6f8);
  border-color: var(--nm-error-line, #efc3cf);
}

[data-mmbt3th-module="new-members"][data-mmbt3th-surface="state"][data-new-members-visual-owner="fallback"] .new-members-request-state__retry {
  flex: 0 0 auto;
  min-height: 34px;
  padding: 5px 12px;
  color: var(--nm-retry-ink, #0d5c9e);
  font: inherit;
  font-weight: 700;
  background: var(--nm-retry-surface, #fff);
  border: 1px solid var(--nm-retry-line, #9fc9ea);
  border-radius: 999px;
  cursor: pointer;
}

[data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] > .member-card {
  container-name: newest-member-card;
  container-type: inline-size;
}

[data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] .member-card__content {
  overflow-wrap: normal;
  word-break: normal;
}

@media (max-width: 767px) {
  [data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 600px) {
  @container newest-member-card (max-width: 267.9px) {
    [data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] .member-card__body {
      grid-template-columns: 64px minmax(0, 1fr);
      gap: 8px;
      padding: 12px 8px;
    }
    [data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] .member-card__avatar-link {
      width: 64px;
      justify-self: center;
    }
    [data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] .member-card__avatar {
      width: 64px;
      height: 64px !important;
    }
  }

  @container newest-member-card (max-width: 231.9px) {
    [data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] .member-card__body {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      padding: 12px 8px;
      text-align: center;
    }
    [data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] .member-card__content {
      width: 100%;
    }
  }
}

@supports not (container-type: inline-size) {
  @media (min-width: 768px) and (max-width: 836px) {
    [data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] .member-card__body {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      padding: 12px 8px;
      text-align: center;
    }
    [data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] .member-card__avatar-link { width: 64px; }
    [data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] .member-card__avatar {
      width: 64px;
      height: 64px !important;
    }
    [data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] .member-card__content { width: 100%; }
  }

  @media (min-width: 837px) and (max-width: 932px),
         (min-width: 1200px) and (max-width: 1264px) {
    [data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] .member-card__body {
      grid-template-columns: 64px minmax(0, 1fr);
      gap: 8px;
      padding: 12px 8px;
    }
    [data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] .member-card__avatar-link {
      width: 64px;
      justify-self: center;
    }
    [data-mmbt3th-module="new-members"][data-mmbt3th-surface="grid"][data-new-members-visual-owner="fallback"] .member-card__avatar {
      width: 64px;
      height: 64px !important;
    }
  }
}