/**
 * @file
 * MyEvent announcement block.
 *
 * Scoped to full Event Group pages so announcement listings elsewhere retain
 * their module-provided presentation.
 */

.group.group--full.group--event-group .event-announcements {
  --announcement-accent: #743cfb;
  --announcement-accent-dark: #5d28df;
  --announcement-accent-soft: #efe8ff;
  --announcement-ink: #282638;
  --announcement-muted: #6e6a7c;
  --announcement-border: #e4ddef;
  background: #fbfaff;
  border: 0;
  border-radius: 5px;
  box-shadow: 0 0.7rem 2rem rgb(50 37 79 / 5%);
  box-sizing: border-box;
  margin: 0 25px;
  max-width: 1600px;
  overflow: hidden;
  padding: clamp(1.05rem, 2.2vw, 1.45rem);
  width: auto;
}

/* Section heading. */
.group.group--full.group--event-group
.event-announcements__header {
  align-items: center;
  display: grid;
  gap: 0.75rem 1rem;
  grid-template-columns: minmax(0, 1fr) auto auto;
  margin: 0 0 1rem;
}

.group.group--full.group--event-group
.event-announcements__heading {
  min-height: 2.9rem;
  padding: 0 0 0 3.85rem;
  position: relative;
}

.group.group--full.group--event-group
.event-announcements__heading::before {
  background: var(--announcement-accent-soft);
  border-radius: 0.72rem;
  content: "";
  height: 3rem;
  left: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 3rem;
}

.group.group--full.group--event-group
.event-announcements__heading::after {
  background-color: var(--announcement-accent);
  content: "";
  height: 1.55rem;
  left: 0.72rem;
  -webkit-mask: 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.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8a6 6 0 0 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9'/%3E%3Cpath d='M10 21h4'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: 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.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8a6 6 0 0 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9'/%3E%3Cpath d='M10 21h4'/%3E%3C/svg%3E") center / contain no-repeat;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 1.55rem;
}

.group.group--full.group--event-group
.event-announcements__heading h2 {
  color: var(--announcement-ink) !important;
  font-size: clamp(1.5rem, 2.3vw, 1.9rem);
  font-weight: 750;
  letter-spacing: -0.035em;
  line-height: 1.15;
  margin: 0;
  text-shadow: none !important;
}

.group.group--full.group--event-group
.event-announcements__heading p {
  color: var(--announcement-muted) !important;
  font-size: 0.92rem;
  line-height: 1.4;
  margin: 0.18rem 0 0;
}

.group.group--full.group--event-group
.event-announcements__count {
  background: var(--announcement-accent-soft);
  border: 1px solid #e4d8ff;
  border-radius: 999px;
  color: var(--announcement-accent-dark);
  font-size: 0.82rem;
  font-weight: 750;
  line-height: 1;
  padding: 0.62rem 0.85rem;
  white-space: nowrap;
}

.group.group--full.group--event-group
.event-announcements__create {
  align-items: center;
  background: var(--announcement-accent) !important;
  border: 1px solid var(--announcement-accent) !important;
  border-radius: 0.58rem !important;
  box-shadow: 0 0.45rem 1rem rgb(116 60 251 / 20%);
  color: #fff !important;
  display: inline-flex;
  font-size: 0.92rem;
  font-weight: 700;
  gap: 0.48rem;
  justify-content: center;
  line-height: 1.2;
  min-height: 2.7rem;
  padding: 0.68rem 1rem !important;
  text-decoration: none !important;
  transition: background-color 160ms ease, border-color 160ms ease,
    box-shadow 160ms ease, transform 160ms ease;
  white-space: nowrap;
}

.group.group--full.group--event-group
.event-announcements__create::before {
  background: currentColor;
  content: "";
  height: 1.05rem;
  -webkit-mask: 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='M12 5v14M5 12h14'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: 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='M12 5v14M5 12h14'/%3E%3C/svg%3E") center / contain no-repeat;
  width: 1.05rem;
}

.group.group--full.group--event-group
.event-announcements__create:hover,
.group.group--full.group--event-group
.event-announcements__create:focus-visible {
  background: var(--announcement-accent-dark) !important;
  border-color: var(--announcement-accent-dark) !important;
  box-shadow: 0 0.6rem 1.2rem rgb(116 60 251 / 25%);
  transform: translateY(-1px);
}

/* Announcement card. */
.group.group--full.group--event-group
.event-announcements__list {
  display: grid;
  gap: 0.85rem;
}

.group.group--full.group--event-group
.event-announcement {
  background: #fff;
  border: 1px solid var(--announcement-border);
  border-radius: 0.52rem;
  box-shadow: 0 0.45rem 1.35rem rgb(40 31 63 / 6%);
  box-sizing: border-box;
  color: var(--announcement-ink);
  overflow: hidden;
  position: relative;
  transition: border-color 160ms ease, box-shadow 160ms ease,
    transform 160ms ease;
}

.group.group--full.group--event-group
.event-announcement--pinned {
  border-color: #dcd0f8;
  border-left: 0.28rem solid var(--announcement-accent);
}

.group.group--full.group--event-group
.event-announcement:hover {
  border-bottom-color: #d8cff0;
  border-right-color: #d8cff0;
  border-top-color: #d8cff0;
  box-shadow: 0 0.7rem 1.55rem rgb(40 31 63 / 9%);
  transform: translateY(-1px);
}

/* The metadata wrapper uses display: contents so the pinned label can sit
 * above the title while the remaining metadata stays below it. */
.group.group--full.group--event-group
.event-announcement > header {
  display: grid;
  gap: 0.22rem 1rem;
  grid-template-columns: max-content max-content minmax(0, 1fr);
  padding: 0.8rem 1rem 0;
}

.group.group--full.group--event-group
.event-announcement > header h3 {
  color: var(--announcement-ink) !important;
  font-size: clamp(1.12rem, 1.7vw, 1.3rem);
  font-weight: 750;
  grid-column: 1 / -1;
  grid-row: 2;
  letter-spacing: -0.018em;
  line-height: 1.25;
  margin: 0.08rem 0;
  text-shadow: none !important;
}

.group.group--full.group--event-group
.event-announcement__meta {
  display: contents;
}

.group.group--full.group--event-group
.event-announcement__meta > span,
.group.group--full.group--event-group
.event-announcement__meta > time {
  align-items: center;
  color: var(--announcement-muted);
  display: inline-flex;
  font-size: 0.82rem;
  gap: 0.38rem;
  line-height: 1.3;
  min-width: 0;
}

.group.group--full.group--event-group
.event-announcement__pinned {
  align-items: center;
  background: var(--announcement-accent-soft);
  border-radius: 0.38rem;
  color: var(--announcement-accent-dark) !important;
  font-weight: 750;
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
  padding: 0.28rem 0.52rem;
}

.group.group--full.group--event-group
.event-announcement__audience {
  grid-column: 1;
  grid-row: 3;
}

.group.group--full.group--event-group
.event-announcement__author {
  grid-column: 2;
  grid-row: 3;
}

.group.group--full.group--event-group
.event-announcement__date {
  grid-column: 3;
  grid-row: 3;
  white-space: nowrap;
}

.group.group--full.group--event-group
.event-announcement__pinned::before,
.group.group--full.group--event-group
.event-announcement__audience::before,
.group.group--full.group--event-group
.event-announcement__author::before,
.group.group--full.group--event-group
.event-announcement__date::before {
  background: currentColor;
  content: "";
  flex: 0 0 0.95rem;
  height: 0.95rem;
  -webkit-mask: var(--announcement-meta-icon) center / contain no-repeat;
  mask: var(--announcement-meta-icon) center / contain no-repeat;
  width: 0.95rem;
}

.group.group--full.group--event-group
.event-announcement__pinned {
  --announcement-meta-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 3h8l-1 7 3 3v2h-5v6l-1 1-1-1v-6H6v-2l3-3Z' fill='black'/%3E%3C/svg%3E");
}

.group.group--full.group--event-group
.event-announcement__audience {
  --announcement-meta-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.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Ccircle cx='17' cy='9' r='2.3'/%3E%3Cpath d='M3.5 19a5.5 5.5 0 0 1 11 0M14 15a4 4 0 0 1 6.5 3.1'/%3E%3C/svg%3E");
}

.group.group--full.group--event-group
.event-announcement__author {
  --announcement-meta-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.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7' r='3.5'/%3E%3Cpath d='M5 21a7 7 0 0 1 14 0'/%3E%3C/svg%3E");
}

.group.group--full.group--event-group
.event-announcement__date {
  --announcement-meta-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.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='2'/%3E%3Cpath d='M8 3v4M16 3v4M3.5 9.5h17'/%3E%3C/svg%3E");
}

.group.group--full.group--event-group
.event-announcement__body {
  color: #343142 !important;
  font-size: 1rem;
  line-height: 1.5;
  padding: 0.45rem 1rem 0.65rem;
}

.group.group--full.group--event-group
.event-announcement__body > :first-child {
  margin-top: 0;
}

.group.group--full.group--event-group
.event-announcement__body > :last-child {
  margin-bottom: 0;
}

/* Sharing actions. */
.group.group--full.group--event-group
.event-announcement__actions {
  border-top: 1px solid #ece8f2;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0 1rem;
  padding: 0.58rem 0;
}

.group.group--full.group--event-group
.event-announcement__action {
  --announcement-action-colour: #424052;
  --announcement-action-bg: #fff;
  --announcement-action-border: #dcd7e6;
  align-items: center;
  background: var(--announcement-action-bg) !important;
  border: 1px solid var(--announcement-action-border);
  border-radius: 0.48rem;
  color: var(--announcement-action-colour) !important;
  display: inline-flex;
  font-size: 0.83rem;
  font-weight: 680;
  gap: 0.42rem;
  justify-content: center;
  line-height: 1.2;
  min-height: 2.15rem;
  padding: 0.48rem 0.78rem;
  text-decoration: none !important;
  transition: box-shadow 150ms ease, filter 150ms ease, transform 150ms ease;
}

.group.group--full.group--event-group
.event-announcement__action::before {
  background: currentColor;
  content: "";
  flex: 0 0 1.05rem;
  height: 1.05rem;
  -webkit-mask: var(--announcement-action-icon) center / contain no-repeat;
  mask: var(--announcement-action-icon) center / contain no-repeat;
  width: 1.05rem;
}

.group.group--full.group--event-group
.event-announcement__action:hover,
.group.group--full.group--event-group
.event-announcement__action:focus-visible {
  box-shadow: 0 0.35rem 0.8rem rgb(38 30 58 / 10%);
  filter: saturate(1.1);
  transform: translateY(-1px);
}

.group.group--full.group--event-group
.event-announcement__action--open {
  --announcement-action-colour: #642ce8;
  --announcement-action-bg: #f0e9ff;
  --announcement-action-border: #e4d7ff;
  --announcement-action-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='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E");
}

.group.group--full.group--event-group
.event-announcement__action--whatsapp {
  --announcement-action-colour: #087a2e;
  --announcement-action-bg: #f0fbf3;
  --announcement-action-border: #a9e1ba;
  --announcement-action-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%3Cpath d='M20.5 11.7a8.5 8.5 0 0 1-12.6 7.4L3 20.5l1.4-4.7A8.5 8.5 0 1 1 20.5 11.7Z'/%3E%3Cpath d='M8.1 7.8c.4 4 2.5 6.1 6.4 6.7l1.2-1.5 2.2 1.1c-.3 1.7-1.4 2.6-3.1 2.5-4.7-.4-8.6-4.3-9-9-.1-1.7.8-2.8 2.5-3.1l1.1 2.2Z' transform='scale(.72) translate(4.7 4.7)'/%3E%3C/svg%3E");
}

.group.group--full.group--event-group
.event-announcement__action--facebook {
  --announcement-action-colour: #1261d7;
  --announcement-action-bg: #f2f7ff;
  --announcement-action-border: #b9d3fb;
}

.group.group--full.group--event-group
.event-announcement__action--facebook::before {
  background-color: transparent;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10' fill='%231261d7'/%3E%3Cpath d='M13.5 19v-6h2l.4-2.5h-2.4V9c0-.7.3-1.2 1.3-1.2H16V5.6c-.4-.1-1.1-.1-1.9-.1-2 0-3.4 1.2-3.4 3.5v1.5H8.5V13h2.2v6Z' fill='white'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  -webkit-mask: none;
  mask: none;
}

.group.group--full.group--event-group
.event-announcement__action--email {
  --announcement-action-colour: #343142;
  --announcement-action-bg: #fff;
  --announcement-action-border: #d9d5e2;
  --announcement-action-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.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5.5' width='18' height='13' rx='2'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E");
}

/* Delivery and engagement summary. */
.group.group--full.group--event-group
.event-announcement__tracking {
  background: #f7f7fb;
  border-top: 1px solid #ece8f2;
  color: var(--announcement-muted);
  font-size: 0.79rem;
  line-height: 1.35;
  padding: 0.55rem 1rem;
}

.group.group--full.group--event-group
.event-announcement__tracking.is-enhanced {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 1.2rem;
}

.group.group--full.group--event-group
.event-announcement__metric {
  align-items: center;
  display: inline-flex;
  gap: 0.42rem;
  white-space: nowrap;
}

.group.group--full.group--event-group
.event-announcement__metric::before {
  background: currentColor;
  content: "";
  flex: 0 0 1rem;
  height: 1rem;
  -webkit-mask: var(--announcement-metric-icon) center / contain no-repeat;
  mask: var(--announcement-metric-icon) center / contain no-repeat;
  width: 1rem;
}

.group.group--full.group--event-group
.event-announcement__metric.is-visits {
  --announcement-metric-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.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E");
}

.group.group--full.group--event-group
.event-announcement__metric.is-accepted {
  --announcement-metric-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.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5.5' width='18' height='13' rx='2'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E");
  background: #edf9f0;
  border-radius: 999px;
  color: #177a37;
  margin: -0.18rem 0;
  padding: 0.3rem 0.72rem;
}

.group.group--full.group--event-group
.event-announcement__metric.is-failed {
  --announcement-metric-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.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.2 3.7 2.5 17a2 2 0 0 0 1.7 3h15.6a2 2 0 0 0 1.7-3L13.8 3.7a2 2 0 0 0-3.6 0Z'/%3E%3Cpath d='M12 9v4M12 17h.01'/%3E%3C/svg%3E");
}

@media (max-width: 48rem) {
  .group.group--full.group--event-group
  .event-announcements__header {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .group.group--full.group--event-group
  .event-announcements__create {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .group.group--full.group--event-group
  .event-announcement__actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 35rem) {
  .group.group--full.group--event-group .event-announcements {
    border-radius: 0.72rem;
    padding: 0.85rem;
  }

  .group.group--full.group--event-group
  .event-announcements__heading {
    min-height: 2.6rem;
    padding-left: 3.25rem;
  }

  .group.group--full.group--event-group
  .event-announcements__heading::before {
    height: 2.6rem;
    width: 2.6rem;
  }

  .group.group--full.group--event-group
  .event-announcements__heading::after {
    height: 1.3rem;
    left: 0.65rem;
    width: 1.3rem;
  }

  .group.group--full.group--event-group
  .event-announcements__heading h2 {
    font-size: 1.4rem;
  }

  .group.group--full.group--event-group
  .event-announcement > header {
    grid-template-columns: max-content minmax(0, 1fr);
    padding-left: 0.85rem;
    padding-right: 0.85rem;
  }

  .group.group--full.group--event-group
  .event-announcement__audience {
    grid-column: 1;
  }

  .group.group--full.group--event-group
  .event-announcement__author {
    grid-column: 2;
  }

  .group.group--full.group--event-group
  .event-announcement__date {
    grid-column: 1 / -1;
    grid-row: 4;
    margin-top: 0.1rem;
  }

  .group.group--full.group--event-group
  .event-announcement__body {
    padding-left: 0.85rem;
    padding-right: 0.85rem;
  }

  .group.group--full.group--event-group
  .event-announcement__actions {
    grid-template-columns: 1fr;
    margin-left: 0.85rem;
    margin-right: 0.85rem;
  }

  .group.group--full.group--event-group
  .event-announcement__tracking.is-enhanced {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (prefers-reduced-motion: reduce) {
  .group.group--full.group--event-group
  .event-announcement,
  .group.group--full.group--event-group
  .event-announcement__action,
  .group.group--full.group--event-group
  .event-announcements__create {
    transition: none;
  }
}


article.event-announcement.event-announcement--pinned h3 {
    text-transform: capitalize;
}

