/**
 * @file
 * Member and RSVP overview on full MyEvent Event Group pages.
 * Native tables remain usable without JavaScript; enhanced rows stack on mobile.
 */

.group.group--full.group--event-group .ptah-rsvp-members-overview {
  --members-ink: #282735;
  --members-muted: #626779;
  --members-border: #e1e4ed;
  --members-purple: #642ce8;
  --members-purple-soft: #f0eaff;
  --members-people-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Cpath d='M3 21v-2a6 6 0 0 1 12 0v2M16 5a3 3 0 0 1 0 6M21 21v-2a6 6 0 0 0-4-5.65'/%3E%3C/svg%3E");
  --members-check-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 4 4L19 6'/%3E%3C/svg%3E");
  --members-clock-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E");
  --members-cross-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m7 7 10 10M17 7 7 17'/%3E%3C/svg%3E");
  --members-guests-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Cpath d='M3 21v-2a6 6 0 0 1 12 0v2M19 7v6M16 10h6'/%3E%3C/svg%3E");
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  box-sizing: border-box;
  color: var(--members-ink);
  margin: 0 25px;
  max-width: 1600px;
  min-width: 0;
  padding: clamp(1rem, 2.2vw, 1.45rem);
}

.group.group--full.group--event-group .ptah-rsvp-members-overview *,
.group.group--full.group--event-group .ptah-rsvp-members-overview *::before,
.group.group--full.group--event-group .ptah-rsvp-members-overview *::after {
  box-sizing: border-box;
}

/* Summary: white cards with restrained, meaningful accent colours. */
.group.group--full.group--event-group .ptah-rsvp-members-overview__summary {
  display: grid;
  gap: 0.8rem;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin: 0 0 1.25rem;
  padding: 0;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__stat {
  --member-stat-colour: #642ce8;
  --member-stat-bg: #f0eaff;
  --member-stat-icon: var(--members-people-icon);
  align-content: center;
  background: #fff;
  border: 1px solid var(--members-border);
  border-radius: 0.75rem;
  box-shadow: none;
  display: grid;
  gap: 0.12rem;
  min-height: 5.6rem;
  min-width: 0;
  padding: 0.95rem 0.8rem 0.95rem 4rem;
  position: relative;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__stat::before {
  background: var(--member-stat-bg);
  border-radius: 0.65rem;
  content: "";
  height: 2.6rem;
  left: 0.85rem;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2.6rem;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__stat::after {
  background: var(--member-stat-colour);
  content: "";
  height: 1.35rem;
  left: 1.475rem;
  -webkit-mask: var(--member-stat-icon) center / contain no-repeat;
  mask: var(--member-stat-icon) center / contain no-repeat;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 1.35rem;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__stat--going {
  --member-stat-colour: #087c54;
  --member-stat-bg: #e5f6ee;
  --member-stat-icon: var(--members-check-icon);
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__stat--pending {
  --member-stat-colour: #946000;
  --member-stat-bg: #fff3d9;
  --member-stat-icon: var(--members-clock-icon);
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__stat--not-attending {
  --member-stat-colour: #b33e53;
  --member-stat-bg: #fcebef;
  --member-stat-icon: var(--members-cross-icon);
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__stat--additional-guests {
  --member-stat-colour: #087d83;
  --member-stat-bg: #e4f5f6;
  --member-stat-icon: var(--members-guests-icon);
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__stat > strong {
  color: var(--members-ink);
  font-size: 1.65rem;
  font-variant-numeric: tabular-nums;
  font-weight: 750;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__stat > span {
  color: var(--members-muted);
  font-size: 0.82rem;
  font-weight: 500;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

/* Directory panel and heading. */
.group.group--full.group--event-group .ptah-rsvp-members-overview__directory {
  background: #fff;
  border: 1px solid var(--members-border);
  border-radius: 0.8rem;
  box-shadow: none;
  min-width: 0;
  overflow: hidden;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__heading {
  align-items: center;
  border: 0;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin: 0;
  min-height: 4.75rem;
  padding: 1rem 1.25rem;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__heading > h2 {
  align-items: center;
  color: var(--members-ink) !important;
  display: flex;
  font-size: clamp(1.25rem, 2vw, 1.55rem);
  font-weight: 750;
  gap: 0.7rem;
  letter-spacing: -0.025em;
  line-height: 1.25;
  margin: 0;
  min-width: 0;
  text-shadow: none !important;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__heading > h2::before {
  background: var(--members-purple);
  content: "";
  flex: 0 0 1.5rem;
  height: 1.5rem;
  -webkit-mask: var(--members-people-icon) center / contain no-repeat;
  mask: var(--members-people-icon) center / contain no-repeat;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__heading > span {
  background: var(--members-purple-soft);
  border: 1px solid #e2d7ff;
  border-radius: 999px;
  color: var(--members-purple);
  flex: 0 0 auto;
  font-size: 0.8rem;
  font-weight: 650;
  line-height: 1.25;
  padding: 0.38rem 0.7rem;
  white-space: nowrap;
}

/* Native table fallback, including horizontal scrolling on small screens. */
.group.group--full.group--event-group .ptah-rsvp-members-overview__table-wrap {
  margin: 0;
  overflow-x: auto;
  padding: 0;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__table {
  background: #fff;
  border: 0;
  border-collapse: separate;
  border-radius: 0;
  border-spacing: 0;
  color: var(--members-ink);
  font-size: 0.86rem;
  line-height: 1.5;
  margin: 0;
  min-width: 56rem;
  table-layout: auto;
  width: 100%;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__table thead,
.group.group--full.group--event-group .ptah-rsvp-members-overview__table thead tr,
.group.group--full.group--event-group .ptah-rsvp-members-overview__table thead th {
  background: #f7f8fc !important;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__table th,
.group.group--full.group--event-group .ptah-rsvp-members-overview__table td {
  border: 0;
  border-bottom: 1px solid var(--members-border);
  color: var(--members-ink);
  padding: 1rem 1.1rem;
  text-align: start;
  vertical-align: middle;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__table th {
  border-top: 1px solid var(--members-border);
  color: #555b6d;
  font-size: 0.79rem;
  font-weight: 650;
  padding-block: 0.75rem;
  white-space: nowrap;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__table tbody tr,
.group.group--full.group--event-group .ptah-rsvp-members-overview__table tbody td {
  background: #fff;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__table tbody tr:hover td {
  background: #fbfcff;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__table tbody tr:last-child td {
  border-bottom: 0;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__table td:first-child {
  min-width: 10rem;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__table td:last-child {
  color: var(--members-muted);
  font-size: 0.8rem;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__member {
  align-items: center;
  display: flex;
  gap: 0.65rem;
  min-width: 0;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__member > strong {
  font-size: 0.9rem;
  font-weight: 700;
  min-width: 0;
  overflow-wrap: anywhere;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__avatar {
  align-items: center;
  background: var(--members-purple-soft);
  border: 1px solid #e5ddfb;
  border-radius: 50%;
  color: var(--members-purple);
  display: inline-flex;
  flex: 0 0 2.4rem;
  font-size: 0.9rem;
  font-weight: 750;
  height: 2.4rem;
  justify-content: center;
  line-height: 1;
  overflow: hidden;
  width: 2.4rem;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__avatar img {
  border: 0;
  border-radius: inherit;
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

/* Status colours reinforce (not replace) the existing status text. */
.group.group--full.group--event-group .ptah-rsvp-members-overview__status {
  align-items: center;
  background: #f0f2f6;
  border: 1px solid #e0e4ec;
  border-radius: 999px;
  color: #555b6d;
  display: inline-flex;
  font-size: 0.76rem;
  font-weight: 650;
  gap: 0.35rem;
  line-height: 1.35;
  max-width: 100%;
  padding: 0.35rem 0.65rem;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__status.is-going {
  --member-status-icon: var(--members-check-icon);
  background: #e5f6ee;
  border-color: #c9e8d9;
  color: #087c54;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__status.is-pending {
  --member-status-icon: var(--members-clock-icon);
  background: #fff3d9;
  border-color: #f2dfb0;
  color: #946000;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__status.is-not-attending {
  --member-status-icon: var(--members-cross-icon);
  background: #fcebef;
  border-color: #f2d4dc;
  color: #b33e53;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__status:is(.is-going, .is-pending, .is-not-attending)::before {
  background: currentColor;
  content: "";
  flex: 0 0 0.85rem;
  height: 0.85rem;
  -webkit-mask: var(--member-status-icon) center / contain no-repeat;
  mask: var(--member-status-icon) center / contain no-repeat;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__role {
  background: #f2f3f7;
  border: 1px solid #e3e5ed;
  border-radius: 0.38rem;
  color: #535869;
  display: inline-block;
  font-size: 0.76rem;
  font-weight: 550;
  line-height: 1.35;
  padding: 0.35rem 0.55rem;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__cell-label {
  display: none;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview__cell-value {
  min-width: 0;
  overflow-wrap: anywhere;
}

.group.group--full.group--event-group .ptah-rsvp-members-overview a:focus-visible {
  border-radius: 0.2rem;
  outline: 2px solid var(--members-purple);
  outline-offset: 3px;
}

@media (max-width: 1100px) {
  .group.group--full.group--event-group .ptah-rsvp-members-overview__summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .group.group--full.group--event-group .ptah-rsvp-members-overview {
    margin-inline: 0;
    padding: 0.8rem;
  }

  .group.group--full.group--event-group .ptah-rsvp-members-overview__summary {
    gap: 0.65rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .group.group--full.group--event-group .ptah-rsvp-members-overview__stat {
    min-height: 5.2rem;
    padding-left: 3.6rem;
  }

  .group.group--full.group--event-group .ptah-rsvp-members-overview__stat::before {
    height: 2.2rem;
    left: 0.7rem;
    width: 2.2rem;
  }

  .group.group--full.group--event-group .ptah-rsvp-members-overview__stat::after {
    left: 1.125rem;
  }

  .group.group--full.group--event-group .ptah-rsvp-members-overview__heading {
    gap: 0.6rem;
    padding: 1rem;
  }

  .group.group--full.group--event-group .ptah-rsvp-members-overview__table.is-mobile-ready {
    background: transparent;
    display: block;
    min-width: 0;
    overflow: visible;
  }

  /* Keep column headers in the accessibility tree. */
  .group.group--full.group--event-group .ptah-rsvp-members-overview__table.is-mobile-ready thead {
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
  }

  .group.group--full.group--event-group .ptah-rsvp-members-overview__table.is-mobile-ready tbody {
    display: block;
    padding: 0 0.85rem 0.85rem;
  }

  .group.group--full.group--event-group .ptah-rsvp-members-overview__table.is-mobile-ready tbody tr {
    background: #fff;
    border: 1px solid var(--members-border);
    border-radius: 0.65rem;
    display: block;
    margin: 0 0 0.8rem;
    padding: 0.25rem 0.8rem;
  }

  .group.group--full.group--event-group .ptah-rsvp-members-overview__table.is-mobile-ready tbody tr:last-child {
    margin-bottom: 0;
  }

  .group.group--full.group--event-group .ptah-rsvp-members-overview__table.is-mobile-ready tbody td {
    align-items: center;
    background: transparent;
    border: 0;
    border-bottom: 1px solid #edf0f5;
    display: grid;
    gap: 0.7rem;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    min-width: 0;
    padding: 0.75rem 0;
    width: 100%;
  }

  .group.group--full.group--event-group .ptah-rsvp-members-overview__table.is-mobile-ready tbody td:last-child {
    border-bottom: 0;
  }

  .group.group--full.group--event-group .ptah-rsvp-members-overview__table.is-mobile-ready .ptah-rsvp-members-overview__cell-label {
    color: var(--members-muted);
    display: block;
    font-size: 0.76rem;
    font-weight: 550;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 380px) {
  .group.group--full.group--event-group .ptah-rsvp-members-overview__summary {
    grid-template-columns: minmax(0, 1fr);
  }

  .group.group--full.group--event-group .ptah-rsvp-members-overview__heading {
    align-items: flex-start;
    flex-direction: column;
  }
}