/* Mench WhatsApp Order — buttons, pop-up and chat bubble. Scoped under .mwa-*; colours are custom properties. */
.mwa-order-wrap, .mwa-chat, .mwa-dialog, .mwa-share, .mwa-inline {
	--mwa-brand: #25D366;
	--mwa-brand-ink: #ffffff;
	--mwa-deep: #128C7E;
	--mwa-ink: #142b49;
	--mwa-muted: #4f6380;
	--mwa-line: #dce3ee;
	--mwa-soft: #f6f8fc;
	--mwa-bad: #a3261b;
	box-sizing: border-box;
}
.mwa-order-wrap *, .mwa-chat *, .mwa-dialog * { box-sizing: border-box; }
.mwa-icon { flex: 0 0 auto; }
.mwa-order-wrap { clear: both; margin: 12px 0 0; flex-basis: 100%; width: 100%; }
.mwa-inline, .mwa-share { margin: 10px 0 0; }
.mwa-order-wrap .mwa-order, .mwa-dialog .mwa-submit, .mwa-inline, .mwa-share {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 22px;
	border: 0; border-radius: 999px; background: var(--mwa-brand); color: var(--mwa-brand-ink);
	font: inherit; font-weight: 700; font-size: 16px; line-height: 1.2; text-decoration: none; cursor: pointer; text-transform: none; letter-spacing: normal;
}
.mwa-order-wrap .mwa-order { width: 100%; max-width: 420px; }
.mwa-order-wrap .mwa-order:hover, .mwa-order-wrap .mwa-order:focus, .mwa-dialog .mwa-submit:hover, .mwa-dialog .mwa-submit:focus, .mwa-inline:hover, .mwa-inline:focus { background: var(--mwa-deep); color: var(--mwa-brand-ink); border: 0; }
.mwa-order-wrap .mwa-order[disabled] { opacity: .5; cursor: not-allowed; background: var(--mwa-brand); }
.mwa-share { min-height: 40px; padding: 0 16px; font-size: 14px; background: transparent; color: var(--mwa-deep); border: 1.5px solid currentColor; }
.mwa-share:hover, .mwa-share:focus { background: #e9f8ef; color: var(--mwa-deep); }
.mwa-order:focus-visible, .mwa-submit:focus-visible, .mwa-share:focus-visible, .mwa-inline:focus-visible, .mwa-chat__fab:focus-visible, .mwa-agent:focus-visible, .mwa-close:focus-visible, .mwa-secondary:focus-visible {
	outline: 3px solid #2f6fd6; outline-offset: 3px;
}
/* Pop-up */
.mwa-dialog { width: min(440px, calc(100vw - 24px)); max-height: calc(100vh - 24px); padding: 0; border: 0; border-radius: 20px; color: var(--mwa-ink); background: #fff; box-shadow: 0 30px 80px -20px rgba(10, 22, 40, .55); }
.mwa-dialog::backdrop { background: rgba(10, 22, 40, .55); }
.mwa-dialog__head { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px 6px; }
.mwa-dialog__head h2 { margin: 0; font-size: 20px; line-height: 1.25; color: var(--mwa-ink); }
.mwa-dialog .mwa-close { width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--mwa-soft); color: var(--mwa-ink); font-size: 24px; line-height: 1; cursor: pointer; }
.mwa-dialog .mwa-close:hover, .mwa-dialog .mwa-close:focus { background: var(--mwa-line); color: var(--mwa-ink); }
.mwa-form, .mwa-done { padding: 6px 20px 20px; }
.mwa-summary { margin: 0 0 12px; padding: 10px 12px; border-radius: 12px; background: #e9f8ef; color: #0e5c3a; font-weight: 600; font-size: 15px; }
.mwa-summary:empty { display: none; }
.mwa-field { margin: 0 0 12px; }
.mwa-field label { display: block; margin-bottom: 4px; font-weight: 600; font-size: 15px; }
.mwa-optional { font-weight: 400; color: var(--mwa-muted); }
.mwa-field input, .mwa-field textarea { width: 100%; min-height: 46px; padding: 10px 12px; border: 1.5px solid #b9c8dc; border-radius: 10px; font: inherit; font-size: 16px; color: var(--mwa-ink); background: #fff; }
.mwa-field textarea { min-height: 64px; resize: vertical; }
.mwa-field[data-invalid] input, .mwa-field[data-invalid] textarea { border-color: var(--mwa-bad); }
/* Theme guard: themes style input[type=text|tel|email] and textarea (0,1,1) and their :focus (0,2,1). These rules
   outrank them, so the pop-up fields look the same whatever order the stylesheets load in. */
.mwa-dialog .mwa-field :is(input, textarea), .mwa-dialog .mwa-field :is(input, textarea):focus { border: 1.5px solid #b9c8dc; border-radius: 10px; background: #fff; color: var(--mwa-ink); }
.mwa-dialog .mwa-field[data-invalid] :is(input, textarea), .mwa-dialog .mwa-field[data-invalid] :is(input, textarea):focus { border-color: var(--mwa-bad); }
.mwa-hint { display: block; margin-top: 3px; font-size: 13px; color: var(--mwa-muted); }
.mwa-error { display: block; margin-top: 3px; font-size: 14px; color: var(--mwa-bad); }
.mwa-error:empty { display: none; }
.mwa-pay { margin: 4px 0 12px; padding: 0; border: 0; }
.mwa-pay legend { margin-bottom: 6px; font-weight: 600; font-size: 15px; }
.mwa-pay label { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 12px; margin-bottom: 6px; border: 1.5px solid var(--mwa-line); border-radius: 10px; cursor: pointer; }
.mwa-pay label:has(input:checked) { border-color: var(--mwa-brand); background: #e9f8ef; }
.mwa-pay input { width: 18px; height: 18px; accent-color: var(--mwa-deep); }
.mwa-status { margin: 0 0 10px; font-weight: 600; }
.mwa-status:empty { display: none; }
.mwa-status[data-kind="error"] { color: var(--mwa-bad); }
.mwa-dialog .mwa-submit { width: 100%; font-size: 17px; }
.mwa-dialog .mwa-submit[disabled] { opacity: .6; cursor: progress; }
.mwa-small { margin: 10px 0 0; font-size: 13px; color: var(--mwa-muted); text-align: center; }
.mwa-done { text-align: center; }
.mwa-done__title { margin: 8px 0 4px; font-size: 22px; font-weight: 800; color: #0e5c3a; }
.mwa-done__text { margin: 0 0 16px; color: var(--mwa-muted); }
.mwa-secondary { display: flex; align-items: center; justify-content: center; min-height: 48px; margin-top: 10px; border: 1.5px solid #b9c8dc; border-radius: 999px; color: var(--mwa-ink); font-weight: 700; text-decoration: none; }
.mwa-secondary[hidden] { display: none; }
/* Floating chat */
.mwa-chat { position: fixed; bottom: 20px; z-index: 99990; display: flex; flex-direction: column; gap: 12px; }
.mwa-chat--right { right: 20px; align-items: flex-end; }
.mwa-chat--left { left: 20px; align-items: flex-start; }
.mwa-chat .mwa-chat__fab { display: grid; place-items: center; width: 60px; height: 60px; padding: 0; border: 0; border-radius: 50%; background: var(--mwa-brand); color: #fff; box-shadow: 0 12px 28px -8px rgba(10, 22, 40, .45); cursor: pointer; }
.mwa-chat .mwa-chat__fab:hover, .mwa-chat .mwa-chat__fab:focus { background: var(--mwa-deep); color: #fff; }
.mwa-chat__fab .mwa-icon { width: 30px; height: 30px; }
.mwa-bubble { width: min(320px, calc(100vw - 40px)); padding: 16px; border-radius: 18px; background: #fff; color: var(--mwa-ink); box-shadow: 0 24px 60px -20px rgba(10, 22, 40, .5); }
.mwa-bubble[hidden] { display: none; }
.mwa-bubble__greeting { margin: 0 0 12px; padding: 12px 14px; border-radius: 14px 14px 14px 4px; background: #e9f8ef; font-weight: 600; }
.mwa-agents { list-style: none; margin: 0; padding: 0; }
.mwa-agent { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 8px; border-radius: 12px; color: var(--mwa-ink); text-decoration: none; }
.mwa-agent:hover, .mwa-agent:focus { background: var(--mwa-soft); color: var(--mwa-ink); }
.mwa-agent__avatar { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--mwa-brand); color: #fff; font-weight: 800; }
.mwa-agent__text { flex: 1; min-width: 0; }
.mwa-agent__text strong { display: block; }
.mwa-agent__text span { display: block; font-size: 13px; color: var(--mwa-muted); }
.mwa-agent__status { font-size: 12px; color: var(--mwa-muted); white-space: nowrap; }
.mwa-agent__status.is-online { color: #0e7a43; font-weight: 700; }
.mwa-agent__status.is-online::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 5px; border-radius: 50%; background: #25D366; }
@media (max-width: 480px) { .mwa-chat { bottom: 14px; } .mwa-chat--right { right: 14px; } .mwa-chat--left { left: 14px; } }
@media (prefers-reduced-motion: no-preference) { .mwa-order, .mwa-submit, .mwa-chat__fab, .mwa-agent { transition: background-color .15s ease; } }
/* Elementor editor only: shown instead of an empty widget. */
.mwa-el-placeholder { padding: 12px 14px; border: 1.5px dashed #b9c8dc; border-radius: 10px; background: #f6f8fc; color: #142b49; font-size: 14px; line-height: 1.4; text-align: start; }