/* MDIX audit — template-specific fixes (mdix-donasi-sentosa). */

/* ScrollSmoother pins the whole page in a fixed wrapper; full-page captures (catalogue,
   audit, "save as PDF") then show only the first screen. Let the page scroll natively. */
#smooth-wrapper {
  position: relative !important;
  height: auto !important;
  overflow: visible !important;
  inset: auto !important;
}
#smooth-content {
  transform: none !important;
}

/* Theme-shop colour switcher is demo tooling, not part of the site. */
.color-scheme-wrap {
  display: none !important;
}

/* Thin decorative strip next to event photos was still a grey "35 × 294" placeholder. */
.event-card .box-img-bg,
.box-img .box-img-bg {
  display: none !important;
}
.event-card .event-content-bg,
.box-content .event-content-bg {
  display: none !important;
}

/* ---- design-qa 2026-10-13 ---- */

/* D-20: theme green #3E8F75 is 3.9:1 with white text / 3.5:1 on the beige cards → darker shade (≥4.7:1). */
:root {
  --theme-color: #2B765E;
}

/* Home hero: 154px dark padding was meant for an overlay header; the header sits in the flow,
   so it showed as an empty dark band above the photo. */
.hero-1 {
  padding-top: 0 !important;
}

/* Title Case on Indonesian sentences → sentence case as written. */
.sec-title,
.subscribe-box_title,
.footer-widget .widget_title,
.feature-wrap1 .feature-card .box-title,
.th-mobile-menu ul li a,
.main-menu ul.sub-menu li a,
.tagcloud a,
.recent-post .recent-post-meta a {
  text-transform: none !important;
}

/* Fake language switcher (German, French… pages do not exist). */
.dropdown-link:has(#dropdownMenuLink1) {
  display: none !important;
}

/* Award / "trusted by 90K companies" logo strip = seller sample logos and invented claims. */
.brand-area-1 {
  display: none !important;
}

/* Sample-data note for donation totals, progress bars and donor counts. */
.mdix-sample-note {
  margin: 12px auto 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--body-color);
  font-style: italic;
  text-align: center;
}
.mdix-sample-note.text-white {
  color: rgba(255, 255, 255, 0.85) !important;
}
.counter-wrap1 + .mdix-sample-note {
  margin-top: 24px;
}

/* Former video play button (stranger's music video removed, D-25) → static heart badge. */
.mdix-heart-badge {
  cursor: default;
}
.mdix-heart-badge i {
  font-size: 30px;
  color: var(--theme-color2);
}

/* Event cards: "Penyelenggara" label ran into the decorative circle. */
.event-card .box-content .event-speaker-wrap .event-speakers .thumb:after {
  display: none;
}
.event-card .box-content .event-speaker-wrap .event-speakers .event-speaker-text {
  margin-left: 10px;
}
.event-card .box-content .event-speaker-wrap .event-speakers .event-speaker-text span {
  color: inherit;
}

/* Phones: back-to-top button covered the copyright line. */
@media (max-width: 767px) {
  .copyright-wrap {
    padding-bottom: 72px;
  }
}

/* Home blog: decorative leaf sat on top of the first card's date/title below 1800px. */
@media (max-width: 1799px) {
  .blog-bg-shape1-1 {
    display: none !important;
  }
}

/* About "Cara Kami Bekerja": the connecting-line image is a seller placeholder box ("1734 × 489"). */
.process-bg-line1-1 {
  display: none !important;
}

/* Theme buttons paint their resting colour with a masked ::after layer; give the button itself the
   same resting colour (and the theme's hover colour on hover) so the real text/background pair is
   what contrast tools and fallbacks see. Visible look is unchanged. */
.th-btn { background-color: var(--theme-color2); }
.th-btn.style2 { background: var(--theme-color); }
.th-btn.style2:hover, .th-btn.style2:focus, .th-btn.style2:active { background: var(--theme-color2); }
.th-btn.style3 { background: var(--theme-color2); }
.th-btn.style3:hover, .th-btn.style3:focus, .th-btn.style3:active { background: var(--white-color); }
.th-btn.style4 { background: var(--white-color); }
.th-btn.style4:hover, .th-btn.style4:focus, .th-btn.style4:active { background: var(--theme-color2); }
.th-btn.style5 { background: var(--title-color); }
.th-btn.style5:hover, .th-btn.style5:focus, .th-btn.style5:active { background: var(--white-color); }
.th-btn.style6 { background: var(--title-color); }
.th-btn.style6:hover, .th-btn.style6:focus, .th-btn.style6:active { background: var(--theme-color); }
.th-btn.style-border { background: var(--white-color); }
.th-btn.style-border:hover, .th-btn.style-border:focus, .th-btn.style-border:active { background: var(--theme-color); }

/* Yellow CTA card: muted grey subtitle was 4.1:1 on yellow. */
.cta-card.bg-theme2 .box-subtitle { color: var(--title-color); }

/* Footer / meta links: at least 24px tall touch targets (WCAG 2.5.8). */
.footer-widget .menu a,
.footer-widget a.box-link,
.th-widget-contact .box-link,
.copyright-wrap a,
.blog-meta a,
.location-card .box-title a {
  display: inline-block;
  min-height: 24px;
  line-height: 24px;
}
.header-logo a,
.footer-widget .about-logo a,
.th-widget-about .about-logo a {
  display: inline-block;
  min-height: 24px;
}

/* Location pop-up photo was squeezed at 360px. */
.location-card .box-img img {
  object-fit: cover;
}
.about-logo a,
.mobile-logo a {
  display: inline-block;
  min-height: 24px;
}

/* More small targets: header info links, breadcrumb, blog sidebar. */
.header-top .box-title a,
.info-card .box-title a,
.breadcumb-menu li a,
.widget_categories li a,
.recent-post .recent-post-meta a {
  display: inline-block;
  min-height: 24px;
  line-height: 24px;
}
.recent-post .media-img a {
  display: block;
}

/* Copyright brand link: yellow on the green bar was 3.9:1. */
.copyright-wrap .copyright-text a {
  color: var(--white-color);
  font-weight: 700;
}

.th-btn.style-border4 { background: var(--smoke-color); }
.th-btn.style-border4:hover, .th-btn.style-border4:focus, .th-btn.style-border4:active { background: var(--theme-color); }

@media (max-width: 767px) {
  .copyright-wrap {
    padding-bottom: 84px !important;
  }
}

.donation-form .form-text { color: var(--body-color); }
.th-btn.style-border3 { background: var(--theme-color); }
.th-btn.style-border3:hover, .th-btn.style-border3:focus, .th-btn.style-border3:active { background: var(--theme-color2); }
