/* Balance the icon with an equal empty gutter so the label itself stays centred. */
body :is(.ts-menu-whatsapp, .ts-button--whatsapp, .ts-contact-method--primary[href*="wa.me"],
  .ts-direct-contact__options .ts-button.mc11-whatsapp, button.mc11-whatsapp[type="submit"])
  :is(.ts-whatsapp-control__label, .ts-button-whatsapp__label, .ts-contact-methods__whatsapp-label) {
  grid-column: 2;
  grid-row: 1;
  justify-self: center;
}

body :is(.ts-menu-whatsapp, .ts-button--whatsapp, .ts-contact-method--primary[href*="wa.me"],
  .ts-direct-contact__options .ts-button.mc11-whatsapp, button.mc11-whatsapp[type="submit"])
  :is(img, .ts-parity-icon--whatsapp) {
  grid-column: 1;
  grid-row: 1;
  justify-self: end;
  margin-inline: 0;
}

body :is(.ts-menu-whatsapp, .ts-button--whatsapp, .ts-contact-method--primary[href*="wa.me"],
  .ts-direct-contact__options .ts-button.mc11-whatsapp, button.mc11-whatsapp[type="submit"]):has(> img, > .ts-parity-icon--whatsapp) {
  display: inline-grid;
  grid-template-columns: minmax(17px, 1fr) minmax(0, max-content) minmax(17px, 1fr);
  align-items: center;
  justify-items: center;
  column-gap: 7px;
  row-gap: 0;
  padding-inline: max(8px, min(3vw, 14px));
  text-align: center;
}

html body.mc11-ppf :is(.ts-menu-whatsapp.mc17-whatsapp, .ts-contact-method--primary.mc17-whatsapp,
  button.mc17-whatsapp[type="submit"]):has(> img) {
  display: inline-grid !important;
  grid-template-columns: minmax(17px, 1fr) minmax(0, max-content) minmax(17px, 1fr) !important;
}

.ts-site-header .ts-header-actions > .ts-mobile-header-whatsapp {
  display: none !important;
}

@media (max-width: 760px) {
  .ts-site-header .ts-header-actions > :not(.ts-mobile-header-whatsapp) {
    display: none !important;
  }

  .ts-site-header .ts-header-actions > .ts-mobile-header-whatsapp {
    display: inline-grid !important;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    place-items: center;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .ts-site-header .ts-mobile-header-whatsapp img {
    display: block;
    width: 22px;
    height: 22px;
    margin: 0;
    filter: none;
  }

  .ts-site-header .ts-mobile-header-whatsapp:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -2px;
  }
}

html body :is(.ts-menu-whatsapp, .ts-button--whatsapp, .ts-contact-method--primary[href*="wa.me"],
  .ts-footer-action--whatsapp, .ts-whatsapp-float, .mc17-hero-whatsapp, .cb18-whatsapp-round,
  .mc11-whatsapp--round, .ts-direct-contact__options .ts-button.mc11-whatsapp,
  button.mc11-whatsapp[type="submit"],
  .mc2-support-contact-form .ts-enquiry-form button.ts-button.mc11-whatsapp):not(.ts-site-header *) {
  background: #151513 !important;
  border: 1px solid #a39a8c !important;
  color: #f7f5ef !important;
  box-shadow: none;
  text-shadow: none;
}

html body :is(.ts-menu-whatsapp, .ts-button--whatsapp, .ts-contact-method--primary[href*="wa.me"],
  .ts-footer-action--whatsapp, .ts-whatsapp-float, .mc17-hero-whatsapp, .cb18-whatsapp-round,
  .mc11-whatsapp--round, .ts-direct-contact__options .ts-button.mc11-whatsapp,
  button.mc11-whatsapp[type="submit"],
  .mc2-support-contact-form .ts-enquiry-form button.ts-button.mc11-whatsapp):not(.ts-site-header *):hover {
  background: #252723 !important;
  border-color: #c9b7a3 !important;
}

html body :is(.ts-menu-whatsapp, .ts-button--whatsapp, .ts-contact-method--primary[href*="wa.me"],
  .ts-footer-action--whatsapp, .ts-whatsapp-float, .mc17-hero-whatsapp, .cb18-whatsapp-round,
  .mc11-whatsapp--round, .ts-direct-contact__options .ts-button.mc11-whatsapp,
  button.mc11-whatsapp[type="submit"]):not(.ts-site-header *) img[src$="/whatsapp.svg"] {
  content: url("/assets/modcare-alignment12/whatsapp-green.7b6c525e0602.svg");
  filter: none !important;
}

html body :is(.ts-menu-whatsapp, .ts-button--whatsapp, .ts-contact-method--primary[href*="wa.me"],
  .ts-footer-action--whatsapp, .ts-direct-contact__options .ts-button.mc11-whatsapp)
  :is(.ts-whatsapp-control__label, .ts-button-whatsapp__label, .ts-contact-methods__whatsapp-label) {
  color: #f7f5ef !important;
  text-shadow: none;
}

html body .ts-contact-method--primary[href*="wa.me"] .ts-parity-icon--whatsapp {
  color: #25d366 !important;
  fill: currentColor;
  filter: none;
}

.mc11-ppf .mc17-actions .mc17-hero-whatsapp.mc17-whatsapp {
  border-radius: 2px;
}

/* Keep the labelled hero icon in the same row as its text. */
html body a.ts-button.ts-button--whatsapp:has(> img.ts-button-brand-icon) > img.ts-button-brand-icon {
  position: static;
  inset: auto;
  grid-column: 3;
  grid-row: 1;
  align-self: center;
  justify-self: start;
  margin: 0;
  transform: none;
}

html body a.ts-button.ts-button--whatsapp:hover:has(> img.ts-button-brand-icon) > img.ts-button-brand-icon {
  transform: scale(1.04);
}