.pr {
  padding: 1rem;
  border: 1px solid #f59f0a;
  border-radius: 0.75rem;
  background-color: rgba(245, 159, 10, 0.1);
}

.pr_head {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: center;
}

.pr_head .wrapper {
  display: flex;
  gap: 10px;
}

.pr_head .title {
  font-size: 16px;
  font-weight: 600;
  color: #262626;
}

.pr_head .count {
  color: rgb(38, 38, 38);
  font-weight: 600;
  background-color: rgb(230, 230, 230);
  font-size: 0.75rem;
  line-height: inherit;
  width: 30px;
  height: 30px;
  display: block;
  align-items: center;
  display: flex;
  justify-content: center;
  border-radius: 50%;
}

.pr_head .icon {
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNmNTlmMGEiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0ibHVjaWRlIGx1Y2lkZS11c2VycyBoLTUgdy01IHRleHQtd2FybmluZyI+PHBhdGggZD0iTTE2IDIxdi0yYTQgNCAwIDAgMC00LTRINmE0IDQgMCAwIDAtNCA0djIiPjwvcGF0aD48Y2lyY2xlIGN4PSI5IiBjeT0iNyIgcj0iNCI+PC9jaXJjbGU+PHBhdGggZD0iTTIyIDIxdi0yYTQgNCAwIDAgMC0zLTMuODciPjwvcGF0aD48cGF0aCBkPSJNMTYgMy4xM2E0IDQgMCAwIDEgMCA3Ljc1Ij48L3BhdGg+PC9zdmc+");
}

.pr .bb-pending-group-requests {
  margin: 0;
  padding: 0;
  list-style: none;
  margin-top: 1rem;
}

.pr .bb-pending-group-requests li {
  margin-bottom: 0.75rem;
  background-color: rgb(255, 255, 255);
  border: 1px solid #d9d9d9;
  border-radius: 0.5rem;
  padding: 0.75rem;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.pr .bb-pending-group-requests li .wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.pr .bb-pending-group-requests li .wrapper .badges {
  font-size: 0.75rem;
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  color: rgb(255, 255, 255);
  background-color: rgb(223, 108, 32);
  border-radius: 60px;
}

.pr .bb-pending-group-requests li .char {
  background-color: rgb(242, 242, 242);
  border-radius: 50%;
  width: 2.5rem;
  height: 2.5rem;
  border: 1px solid rgb(217, 217, 217);
  color: rgb(38, 38, 38);
  display: flex;
  align-items: center;
  justify-content: center;
}

.pr .bb-pending-group-requests li .name {
  color: rgb(38, 38, 38);
  display: flex;
  align-items: center;
  gap: 5px;
}

.pr .bb-pending-group-requests li .wilddad_number,
.pr .bb-pending-group-requests li .request-date {
  font-size: 0.75rem;
  margin-bottom: 5px;
  line-height: initial;
}

.pr .bb-pending-group-requests li .actions {
  display: flex;
  gap: 5px;
  height: 40px;
}

.pr .bb-pending-group-requests li .actions .bb-request-btn {
  padding: 0.75rem;
  flex: 1;
}

.pr .bb-pending-group-requests li .actions .approves {
  padding: 0.75rem;
}

.pr .bb-pending-group-requests li .actions .rejects {
  background-color: rgb(250, 250, 250);
  border: 1px solid rgb(230, 230, 230);
}

.pr .bb-pending-group-requests li .actions .approves span {
  height: 16px;
  width: 16px;
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgY2xhc3M9Imx1Y2lkZSBsdWNpZGUtY2hlY2sgaC00IHctNCI+PHBhdGggZD0iTTIwIDYgOSAxN2wtNS01Ij48L3BhdGg+PC9zdmc+");
  display: block;
}

.pr .bb-pending-group-requests li .actions .rejects span {
  height: 16px;
  width: 16px;
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLXggaC00IHctNCI+PHBhdGggZD0iTTE4IDYgNiAxOCI+PC9wYXRoPjxwYXRoIGQ9Im02IDYgMTIgMTIiPjwvcGF0aD48L3N2Zz4=");
  display: block;
}

.pr .bb-pending-group-requests li .view {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 5px;
  background-color: transparent;
  color: #262626;
  border: 1px solid rgb(230, 230, 230);
  justify-content: center;
  margin-bottom: 5px;
}

.pr .bb-pending-group-requests li .view span {
  height: 16px;
  width: 16px;
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLWV5ZSBoLTQgdy00IG1yLTEiPjxwYXRoIGQ9Ik0yLjA2MiAxMi4zNDhhMSAxIDAgMCAxIDAtLjY5NiAxMC43NSAxMC43NSAwIDAgMSAxOS44NzYgMCAxIDEgMCAwIDEgMCAuNjk2IDEwLjc1IDEwLjc1IDAgMCAxLTE5Ljg3NiAwIj48L3BhdGg+PGNpcmNsZSBjeD0iMTIiIGN5PSIxMiIgcj0iMyI+PC9jaXJjbGU+PC9zdmc+");
  display: block;
}

.overlaymodal {
  display: none;
  position: fixed;
  background-color: rgba(0, 0, 0, 0.8);
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 999;
}

.overlaymodal.active {
  display: block;
}

.pr_details {
  width: 100%;
  max-width: 28rem;
  position: fixed;
  left: 50%;
  top: 50%;
  padding: 1.5rem;
  z-index: 1000;
  border-radius: 0.75rem;
  display: none;
  transform: translate(-50%, -50%);
  background-color: rgb(250, 250, 250);
}

.pr_details .meta {
  display: flex;
  gap: 1rem;
  width: 100%;
}

.pr_details .meta .name {
  width: 100%;
}
.pr_details .meta .name .label {
  font-size: 16px;
  font-weight: 600;
  color: #262626;
}
.pr_details .meta .name .number {
  font-size: 14px;
  color: #737373;
}
.pr_details .meta .name .badges {
  color: #262626;
  font-size: 12px;
  font-weight: 600;
  background-color: hwb(0 90.2% 9.8%);
  border-radius: 50px;
  padding: 2px 10px;
  max-width: max-content;
}
.pr_details .meta .char {
  height: 48px;
  width: 100%;
  border-radius: 50%;
  background-color: #f2f2f2;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 48px;
}

.pr_details.active {
  display: block;
}

.pr_details .details h2 {
  font-size: 18px;
  line-height: 18px;
  margin-bottom: 1rem;
}

.pr_details .actions {
  display: flex;
  width: 100%;
  gap: 5px;
}

.pr_details .actions.hide {
  display: none;
}

.pr_details .actions .approves span {
  height: 16px;
  width: 16px;
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgY2xhc3M9Imx1Y2lkZSBsdWNpZGUtY2hlY2sgaC00IHctNCI+PHBhdGggZD0iTTIwIDYgOSAxN2wtNS01Ij48L3BhdGg+PC9zdmc+");
  display: block;
}

.pr_details .actions .rejects span {
  height: 16px;
  width: 16px;
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLXggaC00IHctNCI+PHBhdGggZD0iTTE4IDYgNiAxOCI+PC9wYXRoPjxwYXRoIGQ9Im02IDYgMTIgMTIiPjwvcGF0aD48L3N2Zz4=");
  display: block;
}

.pr_details .actions button {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

.pr_details .actions button.rejects {
  background-color: rgb(250, 250, 250);
  border: 1px solid #e6e6e6;
  color: #1e2132;
}
.pr_details .date {
  margin-bottom: 1rem;
}

.pr_details .date h3 {
  font-size: 14px;
  line-height: 20px;
  margin-top: 1rem;
  margin-bottom: 0;
}

.skeleton-box {
  display: inline-block;
  height: 1em;
  position: relative;
  overflow: hidden;
  background-color: #dddbdd;
}
.skeleton-box::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transform: translateX(-100%);
  background-image: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0,
    rgba(255, 255, 255, 0.2) 20%,
    rgba(255, 255, 255, 0.5) 60%,
    rgba(255, 255, 255, 0)
  );
  -webkit-animation: shimmer 3s infinite;
  animation: shimmer 3s infinite;
  content: "";
}
@-webkit-keyframes shimmer {
  100% {
    transform: translateX(100%);
  }
}
@keyframes shimmer {
  100% {
    transform: translateX(100%);
  }
}

@keyframes panel-enter {
  to {
    transform: translateY(0) scale(1);
    opacity: 1;
  }
}

.icon-edit {
  height: 30px;
  width: 30px;
  display: block;
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLXNxdWFyZS1wZW4gaC00IHctNCBtci0xIj48cGF0aCBkPSJNMTIgM0g1YTIgMiAwIDAgMC0yIDJ2MTRhMiAyIDAgMCAwIDIgMmgxNGEyIDIgMCAwIDAgMi0ydi03Ij48L3BhdGg+PHBhdGggZD0iTTE4LjM3NSAyLjYyNWExIDEgMCAwIDEgMyAzbC05LjAxMyA5LjAxNGEyIDIgMCAwIDEtLjg1My41MDVsLTIuODczLjg0YS41LjUgMCAwIDEtLjYyLS42MmwuODQtMi44NzNhMiAyIDAgMCAxIC41MDYtLjg1MnoiPjwvcGF0aD48L3N2Zz4=");
}

.take-attendance .btn-attend {
  background-color: #fafafa;
  width: 100%;
  border: 1px solid #e6e6e6;
  color: #262626;
  margin-top: 10px;
}

.take-attendance .btn-attend:hover {
  background-color: #269dd9;
  color: white;
}

.take-attendance .note {
  color: #737373;
  margin-top: 15px;
  font-size: 0.75rem;
  line-height: 1rem;
}

.event-card .icon-edit {
  display: none;
  position: absolute;
  right: 20px;
  cursor: pointer;
}

.event-card:hover .icon-edit {
  display: block;
  opacity: 0.8;
}

.event-card-details,
.wilddad-leader-card-details {
  width: 100%;
  max-width: 28rem;
  position: fixed;
  left: 50%;
  top: 50%;
  padding: 1.5rem;
  z-index: 1000;
  border-radius: 0.75rem;
  display: none;
  transform: translate(-50%, -50%);
  background-color: rgb(250, 250, 250);
}

.wilddad-leader-card-details .close-icon {
  position: absolute;
  right: 15px;
  top: 10px;
}

.wilddad-leader-card-details .wrapper {
  width: 100%;
}

.wilddad-leader-card-details form button {
  width: 100%;
  margin-top: 1rem;
}

.event-card-details.active,
.wilddad-leader-card-details.active {
  display: flex;
}

.close-icon {
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLXggaC00IHctNCI+PHBhdGggZD0iTTE4IDYgNiAxOCI+PC9wYXRoPjxwYXRoIGQ9Im02IDYgMTIgMTIiPjwvcGF0aD48L3N2Zz4=");
  height: 16px;
  width: 16px;
  display: block;
  cursor: pointer;
}

.event-card-details .close-icon {
  position: absolute;
  right: 20px;
  top: 20px;
}

.event-card-details form {
  width: 100%;
}

.event-card-details .close-icon:hover {
  opacity: 0.8;
}

.w-full {
  width: 100%;
}

#snackbar {
  visibility: hidden; /* Hidden by default. Visible on click */
  min-width: 250px; /* Set a default minimum width */
  margin-left: -125px; /* Divide value of min-width by 2 */
  background-color: rgb(22, 87, 22); /* Black background color */
  color: #fff; /* White text color */
  text-align: center; /* Centered text */
  border-radius: 2px; /* Rounded borders */
  padding: 16px; /* Padding */
  position: fixed; /* Sit on top of the screen */
  z-index: 1; /* Add a z-index if needed */
  left: 50%; /* Center the snackbar */
  bottom: 30px; /* 30px from the bottom */
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
  visibility: visible; /* Show the snackbar */
  /* Add animation: Take 0.5 seconds to fade in and out the snackbar.
  However, delay the fade out process for 2.5 seconds */
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
  from {
    bottom: 0;
    opacity: 0;
  }
  to {
    bottom: 30px;
    opacity: 1;
  }
}

@keyframes fadein {
  from {
    bottom: 0;
    opacity: 0;
  }
  to {
    bottom: 30px;
    opacity: 1;
  }
}

@-webkit-keyframes fadeout {
  from {
    bottom: 30px;
    opacity: 1;
  }
  to {
    bottom: 0;
    opacity: 0;
  }
}

@keyframes fadeout {
  from {
    bottom: 30px;
    opacity: 1;
  }
  to {
    bottom: 0;
    opacity: 0;
  }
}

.wilddad-leader-card {
  position: relative;
}

.wilddad-leader-card .icon-edit {
  display: none;
  right: 20px;
  top: 15px;
  cursor: pointer;
  position: absolute;
}

.wilddad-leader-card:hover .icon-edit {
  display: block;
}

.take-attendance .actions button {
  width: 100%;
}

.take-attendance .lists .label {
  font-size: 14px;
  color: #262626;
  font-weight: 500;
  margin-top: 1.2rem;
}

.take-attendance .lists {
  display: none;
}

.take-attendance .lists.active {
  display: block;
}

.take-attendance .lists .bb-group-members {
  list-style: none;
  padding-left: 0;
  margin-left: 0;
}

.take-attendance .lists .bb-group-members li {
  padding: 0.5rem;
  background-color: #f2f2f2;
  border-radius: 0.25rem;
  border: 1px solid #d9d9d9;
  margin: 8px 0;
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  align-items: center;
}

.take-attendance .lists .bb-group-members li .meta {
  display: flex;
  gap: 10px;
  align-items: center;
}

.take-attendance .lists .bb-group-members li .actions {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  color: #737373;
  font-size: 0.75rem;
}

/* Hide the browser's default checkbox */
.take-attendance .lists .bb-group-members li .actions input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 26px;
  width: 100%;
  left: 0;
  z-index: 1;
}

.take-attendance .lists .bb-group-members li .meta .name {
  color: #262626;
  font-size: 14px;
  font-weight: 500;
  line-height: initial;
}

.take-attendance .lists .bb-group-members li .meta .id {
  color: #767676;
  font-size: 12px;
}

.take-attendance .lists .bb-group-members li .meta .char {
  font-size: 16px;
  width: 32px;
  height: 32px;
  align-items: center;
  text-align: center;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
  border: 1px solid #df6c20;
}

/* On mouse-over, add a grey background color */
.take-attendance .lists .bb-group-members li .actions:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.take-attendance
  .lists
  .bb-group-members
  li
  .actions
  input:checked
  ~ .checkmark {
  background-color: #df6c20;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.take-attendance
  .lists
  .bb-group-members
  li
  .actions
  input:checked
  ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.take-attendance .lists .bb-group-members li .actions .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.members-tab,
.message-tab {
  padding: 1rem;
  background-color: #fff;
  border: 1px solid #d9d9d9;
  border-radius: 0.75rem;
}

.message-tab .message-tab__footer {
  text-align: center;
  font-size: 12px;
  color: #737373;
  margin-top: 1rem;
}

.members-tab .members-tab__head {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  align-items: center;
}

.members-tab .members-tab__head .title,
.message-tab .message-tab__head .title {
  display: flex;
  gap: 12px;
  color: #262626;
  font-size: 16px;
  font-weight: 600;
}

.message-tab .message-tab__messages .message-item {
  border-left: 2px solid #df6c20;
  padding: 0.5rem;
  padding-left: 10px;
}

.message-tab .message-tab__messages .message-item.active {
  border-left: 2px solid #269ed9;
  box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.17);
  -webkit-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.17);
}

.message-tab .message-tab__messages {
  display: flex;
  flex-direction: column-reverse;
  gap: 1rem;
  margin-top: 1rem;
}

.message-tab
  .message-tab__messages
  .message-item
  .message-content
  .message-text {
  font-size: 14px;
  color: #262626;
}

.message-tab .message-tab__messages .message-item .message-content .meta {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}
.message-tab
  .message-tab__messages
  .message-item
  .message-content
  .meta
  .details {
  display: flex;
  gap: 10px;
}

.message-tab
  .message-tab__messages
  .message-item
  .message-content
  .meta
  .message-time {
  color: #737373;
  font-size: 12px;
}

.message-tab
  .message-tab__messages
  .message-item
  .message-content
  .meta
  .details
  .message-user {
  font-size: 14px;
  color: #262626;
  font-weight: 500;
}

.message-tab
  .message-tab__messages
  .message-item
  .message-content
  .meta
  .details
  .message-id {
  font-size: 12px;
  color: #737373;
  font-weight: 400;
}

.message-tab
  .message-tab__messages
  .message-item
  .message-content
  .meta
  .details
  .message-char {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: #f2f2f2;
  text-align: center;
  line-height: 24px;
}

.message-tab .message-tab__body button {
  margin-top: 1rem;
  width: 100%;
}

.message-tab .message-tab__body {
  margin-top: 1rem;
}

.members-tab .members-tab__head .title:before {
  height: 16px;
  width: 16px;
  display: block;
  margin-right: 5px;
  content: url("data:image/svg+xml;base64,IDxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJjdXJyZW50Q29sb3IiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBjbGFzcz0ibHVjaWRlIGx1Y2lkZS11c2VycyBoLTUgdy01Ij48cGF0aCBkPSJNMTYgMjF2LTJhNCA0IDAgMCAwLTQtNEg2YTQgNCAwIDAgMC00IDR2MiI+PC9wYXRoPjxjaXJjbGUgY3g9IjkiIGN5PSI3IiByPSI0Ij48L2NpcmNsZT48cGF0aCBkPSJNMjIgMjF2LTJhNCA0IDAgMCAwLTMtMy44NyI+PC9wYXRoPjxwYXRoIGQ9Ik0xNiAzLjEzYTQgNCAwIDAgMSAwIDcuNzUiPjwvcGF0aD48L3N2Zz4=");
}

.members-tab .members-tab__body {
  margin-top: 1rem;
}
.members-tab .members-tab__body .item {
  /* border: 1px solid #d9d9d9; */
  background-color: #f2f2f2;
  padding: 8px;
  display: flex;
  gap: 0.75rem;
  border-radius: 0.25rem;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
  cursor: pointer;
}

.members-tab .members-tab__body .item .join {
  font-size: 12px;
  color: #737373;
  display: flex;
  gap: 5px;
  align-items: center;
  margin-right: 10px;
}

.members-tab .members-tab__body .item .join::after {
  content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLWNoZXZyb24tcmlnaHQgaC00IHctNCB0ZXh0LW11dGVkLWZvcmVncm91bmQgdHJhbnNpdGlvbi10cmFuc2Zvcm0iPjxwYXRoIGQ9Im05IDE4IDYtNi02LTYiPjwvcGF0aD48L3N2Zz4=");
  display: block;
  height: 22px;
  width: 14px;
}

.members-tab .members-tab__body .item:hover {
  background-color: #269dd9;
}
.members-tab .members-tab__body .item .meta .char {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #f2f2f2;
  color: #262626;
  text-align: center;
  line-height: 40px;
}

.members-tab .members-tab__body .item .meta {
  display: flex;
  gap: 10px;
  align-items: center;
}

.members-tab .members-tab__body .item .details .name {
  font-size: 14px;
  color: #262626;
  font-weight: 500;
  line-height: initial;
}

.members-tab .members-tab__body .item .details .wdid {
  font-size: 12px;
  color: #737373;
  line-height: initial;
}

#postMessageBtn {
  color: white;
  padding: 12px 14px;
  border-radius: 6px;
  border: none;
  font-size: 14px;
}

#postMessageBtn:hover:not(:disabled) {
  background: #ea6208;
}

#postMessageBtn:disabled {
  background: #e5e7eb;
  color: #9ca3af;
  cursor: not-allowed;
  opacity: 0.7;
}

.customwild #dir-filters,
.customwild .grid-filters {
  display: none !important;
}

.customwild .wrap {
  display: flex;
  gap: 1rem;
  width: 100%;
  justify-content: space-between;
  align-content: center;
  margin-bottom: 20px;
}

p.event-description::before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  background-color: #737373;
  mask: url('/wp-content/uploads/2025/12/message-icon.svg') no-repeat center / contain;
  vertical-align: sub;
  margin-right: 5px;
}