/* Mara Support Help Portal v1.3.0 */
.wtn-mara-help {
  --wtn-site-black: #111827;
  --wtn-site-blue: #005CFF;
  --wtn-site-blue-dark: #0045bf;
  --wtn-site-yellow: #ffcc00;
  --wtn-site-gold: #ffcc00;
  position: fixed !important;
  z-index: var(--wtn-mara-z) !important;
  font-family: Roboto, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  box-sizing: border-box !important;
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  line-height: 1.25 !important;
  isolation: isolate !important;
  transform: none !important;
}
.wtn-mara-help *, .wtn-mara-help *::before, .wtn-mara-help *::after { box-sizing: border-box !important; }
.wtn-mara-help--bottom-right { right: 18px !important; bottom: 20px !important; }
.wtn-mara-help--bottom-left { left: 18px !important; right: auto !important; bottom: 20px !important; }

/* Launcher shell */
.wtn-mara-main-wrap {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  transform: none !important;
}
.wtn-mara-help--bottom-left .wtn-mara-main-wrap { flex-direction: row-reverse !important; }
.wtn-mara-main-label {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 38px !important;
  padding: 0 15px !important;
  margin: 0 !important;
  border: 3px solid var(--wtn-site-yellow) !important;
  border-radius: 9999px !important;
  background: var(--wtn-site-blue) !important;
  color: var(--wtn-site-yellow) !important;
  box-shadow: 0 5px 0 var(--wtn-site-black), 0 11px 24px rgba(0,0,0,.24) !important;
  font-family: "Roboto Condensed", Roboto, sans-serif !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  pointer-events: none !important;
}

/* Outer button is transparent. The clipped child is the only visible shape. */
.wtn-mara-help button.wtn-mara-main {
  all: unset !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  display: grid !important;
  place-items: center !important;
  width: 70px !important;
  height: 70px !important;
  min-width: 70px !important;
  max-width: 70px !important;
  min-height: 70px !important;
  max-height: 70px !important;
  flex: 0 0 70px !important;
  aspect-ratio: 1 / 1 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 9999px !important;
  background: transparent !important;
  line-height: 0 !important;
  cursor: pointer !important;
  overflow: visible !important;
  transform: none !important;
  -webkit-tap-highlight-color: transparent !important;
}
.wtn-mara-help button.wtn-mara-main::before,
.wtn-mara-help button.wtn-mara-main::after,
.wtn-mara-help .wtn-mara-action::before,
.wtn-mara-help .wtn-mara-action::after { content: none !important; display: none !important; }
.wtn-mara-main-disc {
  display: grid !important;
  place-items: center !important;
  width: 66px !important;
  height: 66px !important;
  min-width: 66px !important;
  max-width: 66px !important;
  min-height: 66px !important;
  max-height: 66px !important;
  flex: 0 0 66px !important;
  aspect-ratio: 1 / 1 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 3px solid var(--wtn-site-yellow) !important;
  outline: 3px solid var(--wtn-site-black) !important;
  outline-offset: 0 !important;
  border-radius: 9999px !important;
  clip-path: circle(50% at 50% 50%) !important;
  -webkit-clip-path: circle(50% at 50% 50%) !important;
  background: var(--wtn-site-blue) !important;
  color: var(--wtn-site-yellow) !important;
  box-shadow: 0 11px 28px rgba(0,0,0,.34) !important;
  overflow: hidden !important;
  transform: translateZ(0) !important;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}
.wtn-mara-main:hover .wtn-mara-main-disc,
.wtn-mara-main:focus-visible .wtn-mara-main-disc {
  transform: translateY(-2px) scale(1.03) translateZ(0) !important;
  filter: brightness(1.04) !important;
  box-shadow: 0 15px 34px rgba(0,0,0,.38) !important;
}
.wtn-mara-help .wtn-mara-main-disc .wtn-mara-icon {
  display: grid !important;
  place-items: center !important;
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  max-width: 46px !important;
  min-height: 46px !important;
  max-height: 46px !important;
  color: var(--wtn-site-yellow) !important;
  transform: none !important;
}

.wtn-mara-help .wtn-mara-main-disc .wtn-mara-icon svg {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

/* Pop-out channels */
.wtn-mara-actions {
  position: absolute !important;
  right: 2px !important;
  left: auto !important;
  bottom: 82px !important;
  display: grid !important;
  gap: 11px !important;
  width: 68px !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(14px) scale(.94) !important;
  transform-origin: bottom center !important;
  transition: opacity .2s ease, transform .2s ease, visibility .2s ease !important;
}
.wtn-mara-help--bottom-left .wtn-mara-actions { left: 2px !important; right: auto !important; }
.wtn-mara-help.is-open .wtn-mara-actions,
.wtn-mara-help--mode-hover:hover .wtn-mara-actions {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) scale(1) !important;
}
.wtn-mara-action-item {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 66px !important;
  height: 66px !important;
  min-width: 66px !important;
  max-width: 66px !important;
  min-height: 66px !important;
  max-height: 66px !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}
.wtn-mara-help button.wtn-mara-action,
.wtn-mara-help a.wtn-mara-action {
  all: unset !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 66px !important;
  height: 66px !important;
  min-width: 66px !important;
  max-width: 66px !important;
  min-height: 66px !important;
  max-height: 66px !important;
  flex: 0 0 66px !important;
  aspect-ratio: 1 / 1 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 9999px !important;
  background: transparent !important;
  color: inherit !important;
  line-height: 0 !important;
  cursor: pointer !important;
  text-decoration: none !important;
  overflow: visible !important;
  transform: none !important;
}
.wtn-mara-action-disc {
  display: grid !important;
  place-items: center !important;
  width: 62px !important;
  height: 62px !important;
  min-width: 62px !important;
  max-width: 62px !important;
  min-height: 62px !important;
  max-height: 62px !important;
  flex: 0 0 62px !important;
  aspect-ratio: 1 / 1 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 3px solid var(--wtn-action-border, #ffffff) !important;
  outline: 2px solid var(--wtn-site-black) !important;
  outline-offset: 0 !important;
  border-radius: 9999px !important;
  clip-path: circle(50% at 50% 50%) !important;
  -webkit-clip-path: circle(50% at 50% 50%) !important;
  background: var(--wtn-action-bg, var(--wtn-site-blue)) !important;
  color: var(--wtn-action-fg, #ffffff) !important;
  box-shadow: 0 9px 22px rgba(0,0,0,.30) !important;
  overflow: hidden !important;
  transform: translateZ(0) !important;
  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease !important;
}
.wtn-mara-help button.wtn-mara-action:hover .wtn-mara-action-disc,
.wtn-mara-help a.wtn-mara-action:hover .wtn-mara-action-disc,
.wtn-mara-help button.wtn-mara-action:focus-visible .wtn-mara-action-disc,
.wtn-mara-help a.wtn-mara-action:focus-visible .wtn-mara-action-disc {
  transform: translateY(-2px) scale(1.04) translateZ(0) !important;
  filter: brightness(1.04) !important;
  box-shadow: 0 13px 28px rgba(0,0,0,.36) !important;
}
.wtn-mara-action--live,
.wtn-mara-action--email,
.wtn-mara-action--call { --wtn-action-bg: #005CFF; --wtn-action-fg: #ffcc00; --wtn-action-border: #ffcc00; }
.wtn-mara-action--whatsapp { --wtn-action-bg: #25D366; --wtn-action-fg: #ffffff; }
.wtn-mara-action--messenger { --wtn-action-bg: #0084FF; --wtn-action-fg: #ffffff; }
.wtn-mara-action--instagram { --wtn-action-bg: linear-gradient(135deg,#833ab4 0%,#fd1d1d 58%,#fcaf45 100%); --wtn-action-fg: #ffffff; }
.wtn-mara-help .wtn-mara-action .wtn-mara-icon {
  display: grid !important;
  place-items: center !important;
  width: 35px !important;
  height: 35px !important;
  min-width: 35px !important;
  max-width: 35px !important;
  min-height: 35px !important;
  max-height: 35px !important;
  color: inherit !important;
}
.wtn-mara-help .wtn-mara-icon svg,
.wtn-mara-channel-icon svg {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 100% !important;
  max-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  fill: currentColor !important;
  color: inherit !important;
  transform: none !important;
}
.wtn-mara-tip {
  position: absolute !important;
  right: 76px !important;
  left: auto !important;
  top: 50% !important;
  transform: translate(6px,-50%) !important;
  width: max-content !important;
  max-width: 190px !important;
  padding: 8px 11px !important;
  border: 1px solid rgba(17,24,39,.15) !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  color: var(--wtn-site-black) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.18) !important;
  font-family: "Roboto Condensed", Roboto, sans-serif !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity .15s ease, transform .15s ease !important;
}
.wtn-mara-help--bottom-left .wtn-mara-tip { left: 76px !important; right: auto !important; transform: translate(-6px,-50%) !important; }
.wtn-mara-action-item:hover .wtn-mara-tip,
.wtn-mara-action-item:focus-within .wtn-mara-tip { opacity: 1 !important; transform: translate(0,-50%) !important; }

/* Chaty-style chat card */
.wtn-mara-chat {
  position: absolute !important;
  right: 0 !important;
  left: auto !important;
  bottom: 82px !important;
  display: none !important;
  flex-direction: column !important;
  inline-size: min(400px, calc(100vw - 28px)) !important;
  block-size: auto !important;
  max-block-size: min(670px, calc(100vh - 118px)) !important;
  max-block-size: min(670px, calc(100dvh - 118px)) !important;
  border: 1px solid var(--wtn-mara-chat-border, rgba(14,32,64,.18)) !important;
  border-radius: var(--wtn-mara-chat-radius, 20px) !important;
  background: var(--wtn-mara-chat-bg, #ffffff) !important;
  box-shadow: var(--wtn-mara-chat-shadow, 0 22px 70px rgba(0,0,0,.30)) !important;
  overflow: hidden !important;
}
.wtn-mara-help--bottom-left .wtn-mara-chat { left: 0 !important; right: auto !important; }
.wtn-mara-chat.is-visible { display: flex !important; animation: wtnMaraChatIn .2s ease-out both !important; }
@keyframes wtnMaraChatIn { from { opacity: 0; transform: translateY(12px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
.wtn-mara-chat-head {
  flex: 0 0 auto !important;
  display: grid !important;
  grid-template-columns: 42px 1fr 36px !important;
  align-items: center !important;
  gap: 10px !important;
  min-block-size: 68px !important;
  padding: 12px 13px !important;
  border-bottom: 4px solid var(--wtn-site-yellow) !important;
  background: linear-gradient(135deg, var(--wtn-mara-header-bg, var(--wtn-site-blue)) 0%, var(--wtn-site-blue-dark) 100%) !important;
  color: var(--wtn-mara-header-text, var(--wtn-site-yellow)) !important;
}
.wtn-mara-avatar {
  display: grid !important;
  place-items: center !important;
  inline-size: 42px !important;
  block-size: 42px !important;
  border: 2px solid #ffffff !important;
  border-radius: 50% !important;
  background: var(--wtn-site-gold) !important;
  color: var(--wtn-site-black) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.18) !important;
  font-family: "Roboto Condensed", Roboto, sans-serif !important;
  font-size: 20px !important;
  font-weight: 900 !important;
}
.wtn-mara-chat-heading { display: grid !important; gap: 3px !important; min-inline-size: 0 !important; }
.wtn-mara-chat-heading strong {
  font-family: "Roboto Condensed", Roboto, sans-serif !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
}
.wtn-mara-chat-heading small { font-size: 12px !important; font-weight: 600 !important; opacity: .9 !important; }
.wtn-mara-chat-close {
  all: unset !important;
  display: grid !important;
  place-items: center !important;
  inline-size: 34px !important;
  block-size: 34px !important;
  border-radius: 50% !important;
  color: var(--wtn-site-yellow) !important;
  font-size: 28px !important;
  line-height: 1 !important;
  cursor: pointer !important;
}
.wtn-mara-chat-close:hover, .wtn-mara-chat-close:focus-visible { background: rgba(255,255,255,.16) !important; }
.wtn-mara-chat-body {
  flex: 1 1 auto !important;
  min-block-size: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  background: var(--wtn-mara-body-bg, #f4f7fb) !important;
  overflow: hidden !important;
}
.wtn-mara-thread {
  flex: 1 1 auto !important;
  min-block-size: 110px !important;
  display: grid !important;
  align-content: start !important;
  gap: 10px !important;
  padding: 16px 15px 12px !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: thin !important;
}
.wtn-mara-panel {
  flex: 0 0 auto !important;
  display: grid !important;
  gap: 8px !important;
  max-block-size: min(380px, 52vh) !important;
  max-block-size: min(380px, 52dvh) !important;
  padding: 11px 15px 15px !important;
  border-top: 1px solid rgba(14,32,64,.11) !important;
  background: rgba(255,255,255,.94) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: thin !important;
}
.wtn-mara-msg {
  inline-size: fit-content !important;
  max-inline-size: 88% !important;
  padding: 10px 12px !important;
  border-radius: 15px !important;
  font-size: 14px !important;
  line-height: 1.42 !important;
  overflow-wrap: anywhere !important;
  box-shadow: 0 3px 12px rgba(14,32,64,.07) !important;
}
.wtn-mara-msg--bot {
  justify-self: start !important;
  border: 1px solid rgba(14,32,64,.12) !important;
  border-bottom-left-radius: 5px !important;
  background: var(--wtn-mara-bot-bg, #ffffff) !important;
  color: var(--wtn-mara-bot-text, #152033) !important;
}
.wtn-mara-msg--user {
  justify-self: end !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  border-bottom-right-radius: 5px !important;
  background: var(--wtn-mara-user-bg, var(--wtn-site-blue)) !important;
  color: var(--wtn-mara-user-text, #ffffff) !important;
}
.wtn-mara-msg a { color: var(--wtn-site-blue-dark) !important; font-weight: 800 !important; }
.wtn-mara-bubble {
  all: unset !important;
  display: flex !important;
  align-items: center !important;
  inline-size: 100% !important;
  min-block-size: 42px !important;
  padding: 10px 13px !important;
  border: 1px solid var(--wtn-mara-option-border, #d7dfec) !important;
  border-radius: 12px !important;
  background: var(--wtn-mara-option-bg, #ffffff) !important;
  color: var(--wtn-mara-option-text, #152033) !important;
  box-shadow: 0 3px 10px rgba(14,32,64,.06) !important;
  font-size: 14px !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
  cursor: pointer !important;
}
.wtn-mara-bubble::after { content: "›" !important; margin-left: auto !important; color: var(--wtn-site-blue) !important; font-size: 20px !important; font-weight: 900 !important; }
.wtn-mara-bubble:hover, .wtn-mara-bubble:focus-visible {
  border-color: var(--wtn-site-blue) !important;
  background: #f4f8ff !important;
  transform: translateY(-1px) !important;
}

/* Forms */
.wtn-mara-form {
  display: grid !important;
  gap: 9px !important;
  inline-size: 100% !important;
  padding: 12px !important;
  margin: 0 !important;
  border: 1px solid rgba(14,32,64,.14) !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  color: #152033 !important;
  box-shadow: 0 5px 18px rgba(14,32,64,.07) !important;
}
.wtn-mara-form label { display: grid !important; gap: 5px !important; margin: 0 !important; color: #152033 !important; font-size: 12px !important; font-weight: 800 !important; line-height: 1.2 !important; }
.wtn-mara-form input, .wtn-mara-form textarea, .wtn-mara-form select {
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  margin: 0 !important;
  padding: 10px 11px !important;
  border: 1px solid #c3ccda !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  color: #152033 !important;
  font: 500 14px/1.3 Roboto, sans-serif !important;
  box-shadow: none !important;
}
.wtn-mara-form input:focus, .wtn-mara-form textarea:focus, .wtn-mara-form select:focus { border-color: var(--wtn-site-blue) !important; outline: 3px solid rgba(0,92,255,.14) !important; }
.wtn-mara-form textarea { min-block-size: 92px !important; max-block-size: 150px !important; resize: vertical !important; }
.wtn-mara-form button[type="submit"] {
  all: unset !important;
  position: sticky !important;
  bottom: 0 !important;
  display: grid !important;
  place-items: center !important;
  inline-size: 100% !important;
  min-block-size: 44px !important;
  padding: 10px 14px !important;
  border: 2px solid var(--wtn-site-black) !important;
  border-radius: 999px !important;
  background: var(--wtn-site-blue) !important;
  color: var(--wtn-site-yellow) !important;
  box-shadow: 0 4px 0 rgba(0,0,0,.18) !important;
  font-family: "Roboto Condensed", Roboto, sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}
.wtn-mara-form button[type="submit"]:disabled { opacity: .65 !important; cursor: wait !important; }
.wtn-mara-hp { display: none !important; }
.wtn-mara-status { margin: 0 !important; color: #455468 !important; font-size: 13px !important; }
.wtn-mara-result { padding: 12px !important; border: 1px solid rgba(14,32,64,.14) !important; border-left: 5px solid var(--wtn-site-gold) !important; border-radius: 12px !important; background: #ffffff !important; color: #152033 !important; font-size: 14px !important; }
.wtn-mara-result ul { margin: .5rem 0 0 !important; padding-left: 1.2rem !important; }
.wtn-mara-result a { color: var(--wtn-site-blue-dark) !important; font-weight: 800 !important; }

/* Branded messaging choices inside chat */
.wtn-mara-channel-block { display: grid !important; gap: 8px !important; padding: 10px !important; border: 1px solid rgba(14,32,64,.12) !important; border-radius: 13px !important; background: #f8fafc !important; }
.wtn-mara-channel-title { color: #455468 !important; font-size: 12px !important; font-weight: 800 !important; }
.wtn-mara-channel-row { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 7px !important; }
.wtn-mara-channel-link {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-block-size: 40px !important;
  padding: 7px 8px !important;
  border-radius: 10px !important;
  color: #ffffff !important;
  text-decoration: none !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}
.wtn-mara-channel-link--whatsapp { background: #25d366 !important; }
.wtn-mara-channel-link--messenger { background: #0084ff !important; }
.wtn-mara-channel-link--instagram { background: linear-gradient(135deg,#833ab4 0%,#fd1d1d 58%,#fcaf45 100%) !important; }
.wtn-mara-channel-icon { display: grid !important; place-items: center !important; inline-size: 18px !important; block-size: 18px !important; color: #ffffff !important; flex: 0 0 18px !important; }

.wtn-hide-mobile { display: block; }
.wtn-hide-desktop { display: none; }

@media (max-width: 767px) {
  .wtn-hide-mobile { display: none !important; }
  .wtn-hide-desktop { display: block; }
  .wtn-mara-help--bottom-right, .wtn-mara-help--bottom-left { right: 14px !important; left: auto !important; bottom: 18px !important; }
  .wtn-mara-main-wrap { gap: 8px !important; }
  .wtn-mara-main-label { min-height: 34px !important; padding: 0 12px !important; font-size: 13px !important; }
  .wtn-mara-help button.wtn-mara-main { width: 68px !important; height: 68px !important; min-width: 68px !important; max-width: 68px !important; min-height: 68px !important; max-height: 68px !important; flex-basis: 68px !important; }
  .wtn-mara-main-disc { width: 64px !important; height: 64px !important; min-width: 64px !important; max-width: 64px !important; min-height: 64px !important; max-height: 64px !important; flex-basis: 64px !important; }
  .wtn-mara-actions { right: 0 !important; bottom: 80px !important; width: 66px !important; gap: 10px !important; }
  .wtn-mara-action-item { width: 64px !important; height: 64px !important; min-width: 64px !important; max-width: 64px !important; min-height: 64px !important; max-height: 64px !important; }
  .wtn-mara-help button.wtn-mara-action, .wtn-mara-help a.wtn-mara-action { width: 64px !important; height: 64px !important; min-width: 64px !important; max-width: 64px !important; min-height: 64px !important; max-height: 64px !important; flex-basis: 64px !important; }
  .wtn-mara-action-disc { width: 60px !important; height: 60px !important; min-width: 60px !important; max-width: 60px !important; min-height: 60px !important; max-height: 60px !important; flex-basis: 60px !important; }
  .wtn-mara-help .wtn-mara-action .wtn-mara-icon { width: 34px !important; height: 34px !important; min-width: 34px !important; max-width: 34px !important; min-height: 34px !important; max-height: 34px !important; }
  .wtn-mara-tip { right: 73px !important; font-size: 11px !important; }
  .wtn-mara-help--bottom-left .wtn-mara-tip { left: 73px !important; right: auto !important; }
  .wtn-mara-chat { position: fixed !important; left: 10px !important; right: 10px !important; bottom: 84px !important; inline-size: auto !important; max-block-size: calc(100vh - 100px) !important; max-block-size: calc(100dvh - 100px) !important; }
  .wtn-mara-thread { min-block-size: 80px !important; padding: 13px 12px 9px !important; }
  .wtn-mara-panel { max-block-size: min(405px, 56vh) !important; max-block-size: min(405px, 56dvh) !important; padding: 9px 12px 12px !important; }
  .wtn-mara-msg { font-size: 13.5px !important; }
  .wtn-mara-channel-row { grid-template-columns: 1fr !important; }
  .wtn-mara-channel-link { justify-content: flex-start !important; padding-inline: 12px !important; font-size: 12px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .wtn-mara-help *, .wtn-mara-help *::before, .wtn-mara-help *::after { transition: none !important; animation: none !important; }
}


/* Mara live conversation composer */
.wtn-mara-ai-composer{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:end;
  padding:10px 12px 12px;
  border-top:1px solid var(--wtn-mara-chat-border);
  background:var(--wtn-mara-chat-bg);
}
.wtn-mara-ai-composer[hidden]{display:none!important}
.wtn-mara-ai-composer textarea{
  width:100%;
  min-height:42px;
  max-height:112px;
  resize:none;
  overflow-y:auto;
  border:1px solid var(--wtn-mara-option-border);
  border-radius:16px;
  padding:10px 12px;
  background:#fff;
  color:#152033;
  font:inherit;
  line-height:1.35;
  box-sizing:border-box;
}
.wtn-mara-ai-composer textarea:focus{
  outline:2px solid color-mix(in srgb,var(--wtn-mara-accent) 34%,transparent);
  outline-offset:1px;
  border-color:var(--wtn-mara-accent);
}
.wtn-mara-ai-composer button{
  min-width:58px;
  min-height:42px;
  border:0;
  border-radius:14px;
  padding:0 13px;
  background:var(--wtn-mara-accent);
  color:var(--wtn-mara-text);
  font-weight:800;
  cursor:pointer;
}
.wtn-mara-ai-composer button:disabled{opacity:.6;cursor:wait}
.wtn-mara-ai-status{
  grid-column:1/-1;
  min-height:0;
  font-size:11px;
  color:#667085;
}
.wtn-mara-msg.is-typing{letter-spacing:4px;font-weight:800}
@media (max-width:480px){
  .wtn-mara-ai-composer{padding:8px 10px 10px}
  .wtn-mara-ai-composer button{min-width:54px;padding:0 10px}
}

/* v2.2: chat-first customer support and email-icon form */
.wtn-mara-quick-title {
  display: flex !important;
  align-items: center !important;
  min-block-size: 24px !important;
  margin: 0 0 2px !important;
  color: #455468 !important;
  font-family: "Roboto Condensed", Roboto, sans-serif !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

.wtn-mara-help.is-email-mode .wtn-mara-thread {
  display: none !important;
}
.wtn-mara-help.is-email-mode .wtn-mara-panel {
  flex: 1 1 auto !important;
  max-block-size: min(530px, calc(100vh - 190px)) !important;
  max-block-size: min(530px, calc(100dvh - 190px)) !important;
  border-top: 0 !important;
  padding-top: 14px !important;
}
.wtn-mara-email-intro {
  display: grid !important;
  gap: 4px !important;
  padding: 12px 13px !important;
  border: 1px solid rgba(14,32,64,.13) !important;
  border-left: 5px solid var(--wtn-site-gold) !important;
  border-radius: 13px !important;
  background: #ffffff !important;
  color: #152033 !important;
}
.wtn-mara-email-intro strong {
  font-family: "Roboto Condensed", Roboto, sans-serif !important;
  font-size: 16px !important;
  font-weight: 900 !important;
}
.wtn-mara-email-intro span {
  color: #455468 !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}
.wtn-mara-email-success {
  padding: 14px !important;
  border: 1px solid rgba(8,127,35,.24) !important;
  border-left: 5px solid #087f23 !important;
  border-radius: 13px !important;
  background: #f1fff4 !important;
  color: #14532d !important;
  font-size: 14px !important;
  font-weight: 750 !important;
  line-height: 1.4 !important;
}
.wtn-mara-form-secondary {
  all: unset !important;
  display: grid !important;
  place-items: center !important;
  inline-size: 100% !important;
  min-block-size: 40px !important;
  padding: 8px 12px !important;
  border: 1px solid #c3ccda !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: #152033 !important;
  box-sizing: border-box !important;
  font-family: "Roboto Condensed", Roboto, sans-serif !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}
.wtn-mara-form-secondary:hover,
.wtn-mara-form-secondary:focus-visible {
  border-color: var(--wtn-site-blue) !important;
  background: #f4f8ff !important;
}

/* Keep the real chat composer visible and dominant in live-chat mode. */
.wtn-mara-ai-composer {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto !important;
  gap: 8px !important;
  align-items: end !important;
  padding: 10px 12px 12px !important;
  border-top: 1px solid var(--wtn-mara-chat-border) !important;
  background: var(--wtn-mara-chat-bg) !important;
}
.wtn-mara-ai-composer textarea {
  inline-size: 100% !important;
  min-block-size: 42px !important;
  max-block-size: 112px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 1px solid var(--wtn-mara-option-border) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  color: #152033 !important;
  box-sizing: border-box !important;
  font: 500 14px/1.35 Roboto, sans-serif !important;
  resize: none !important;
  overflow-y: auto !important;
}
.wtn-mara-ai-composer button {
  min-inline-size: 58px !important;
  min-block-size: 42px !important;
  margin: 0 !important;
  padding: 0 13px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: var(--wtn-mara-accent) !important;
  color: var(--wtn-mara-text) !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}
.wtn-mara-ai-status {
  grid-column: 1 / -1 !important;
  min-block-size: 0 !important;
  color: #667085 !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
}