/* ===========================
   FLOATING CARD LOOK
   =========================== */

/* Remove heavy borders and give soft card style */
.gadgetStyle003,
.gadgetStyle004 {
  border: none !important;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(102,45,145,.2);
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease;
}

/* Lift on hover */
.gadgetStyle003:hover,
.gadgetStyle004:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(0,0,0,.16);
}

/* Title bar styling */
.gadgetStyle003 .gadgetStyleTitle,
.gadgetStyle004 .gadgetStyleTitle {
  background: transparent !important;
  color: #662d91;
  font-weight: 800;
  padding: 16px 20px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}

/* Make sure content is visible & padded */
.gadgetStyle003 .gadgetStyleBody,
.gadgetStyle004 .gadgetStyleBody {
  display: block !important;
  padding: 18px 20px 20px;
}

/* Links inside cards */
.gadgetStyle003 a, .gadgetStyle004 a {
  color: #4a2a86;
}
.gadgetStyle003 a:hover, .gadgetStyle004 a:hover {
  color: #c16ff5;
}

/* Remove old thick borders */
.double-spacer,
.double-left,
.double-right,
.gadgetStyle004 {
  border: none !important;
}

/* ===========================
   3-COLUMN LAYOUT
   =========================== */

/* Target main zone container — adjust selector if needed */
#idMainContent .zoneInner {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 24px;
}

/* Remove default WA gadget margins */
#idMainContent .zoneInner > * {
  margin: 0 !important;
}

/* Responsive breakpoints */
@media (max-width: 980px) {
  #idMainContent .zoneInner { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  #idMainContent .zoneInner { grid-template-columns: 1fr; }
}

/* ===========================
   KEEP EXISTING STYLIZED BUTTONS & MENU COLORS
   =========================== */

button.stylizedButton.buttonStyle003, a.stylizedButton.buttonStyle003 {
  font-size: 25px;
  background: #662d91;
  border-radius: 5px;
  transition: transform 0.3s, box-shadow 0.3s;
  color:white;
}
button.stylizedButton.buttonStyle003:hover, a.stylizedButton.buttonStyle003:hover {
  background: #c16ff5;
  transform: translateY(-5px);
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.25);
  color:white;
}

/* Horizontal menu dropdowns */
.WaGadgetMenuHorizontal .menuInner ul ul,
.WaGadgetCustomMenu.menuStyle001 .orientationVertical li:before {
  background: #662d91;
}

/* Hover & selected states */
.WaGadgetMenuHorizontal .menuInner ul ul li>.item:hover>a,
.WaGadgetMenuHorizontal .menuInner ul ul li.sel>.item>a {
  background: #c16ff5;
}
.WaGadgetCustomMenu.menuStyle001 .orientationVertical li a:hover {
  color: #c16ff5;
}
.WaGadgetCustomMenu.menuStyle001 .orientationVertical li a {
  color: #662d91;
}

/* Event & blog title hover color */
.WaGadgetEventsStateList .boxOuterContainer .boxHeaderOuterContainer .boxHeaderContainer h4.boxHeaderTitle a:hover, 
.WaGadgetBlog ul.boxesList li.boxesListItem .boxHeaderOuterContainer h4.boxHeaderTitle a:hover {
  color: #662d91;
}

/* Purple icon set overrides */
.WaGadgetEventsStateList .boxOuterContainer .boxHeaderOuterContainer .boxHeaderContainer h4.boxHeaderTitle a:after {
  background: url('https://mlo22.wildapricot.org/resources/purple-icons.png') 0 -1850px no-repeat;
}
.WaGadgetEventsStateList .pageTitleOuterContainer .pageViewSwitcherOuterContainer .pageViewSwitcherContainer a:before {
  background: url('https://mlo22.wildapricot.org/resources/purple-icons.png') 0px -300px no-repeat;
}
.WaGadgetBlog ul.boxesList li.boxesListItem .boxHeaderOuterContainer h4.boxHeaderTitle a:after {
  background: url('https://mlo22.wildapricot.org/resources/purple-icons.png') 0 -1900px no-repeat;
}
.WaGadgetBlog .boxFooterOuterContainer .postBottom .boxFooterPrimaryOuterContainer .boxFooterPrimaryContainer a:first-child:before {
  background: url('https://mlo22.wildapricot.org/resources/purple-icons.png') 0 -350px no-repeat;
}
.WaGadgetBlog .pageTitleOuterContainer .pageBackContainer a:before,
.WaGadgetEventsStateDetails .pageTitleOuterContainer .pageBackContainer a:before {
  background: url('https://mlo22.wildapricot.org/resources/purple-icons.png') 0 -550px no-repeat;
}

/* Mobile menu background */
@media only screen and (max-width: 616px) {
  .WaGadgetMenuHorizontal[class*=menuStyle] .menuInner ul ul {
    background: #662d91;
  }
  .WaGadgetMenuHorizontal[class*=menuStyle] .menuInner ul.firstLevel>li {
    border-top: 2px solid #c16ff5;
  }
  .WaGadgetMenuHorizontal .menuInner ul.firstLevel>li.dir>.item>a>span:before {
    background: none;
  }
}
.gadgetTitleH4 {
color:#662d91 !important;
}

.WaGadgetFeaturedMember .gadgetStyleBody .showPic .img img {
    display:none !important;
    }
hr.symbol {
  border: none;
  border-top: 2px solid #662d91;
  text-align: center;
  /*position: relative;*/
  margin: 2rem 0;
}

hr.symbol::after {
  content: "✦";
  display: inline-block;
  position: absolute;
  top: -0.8em; /* moves it above the line */
  left: 50%;
  transform: translateX(-50%);
  background: #fff; /* masks the line behind */
  padding: 0 .5em;
  color: #662d91;
  font-size: 1.2em;
  z-index: 1; /* brings the symbol above the line */
}
.gadgetTitleH4{
  text-align:center;
}
hr.peacock {
  border: 0;
  height: 2px;
  background: #662d91;
  position: relative;
  margin: 2rem 0;
  overflow: visible;
}

hr.peacock::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -75%);
  width: 50px;   /* control size */
  height: 50px;
  background: #fff url("https://malialibrary.org/resources/icon.svg") no-repeat center/contain;
}