/* Briticom Maroc: WhatsApp quote popup (modelled on the tthcompany.ma widget). */
.bmwa { --navy: var(--bm-deep, #101B36); --accent: var(--bm-accent, #1D3565); --red: #E02424; --wa: #25D366; --wa-d: #1AA851; --muted: #5d6778; --line: #e3e7ee; position: fixed; left: 24px; bottom: 24px; z-index: 2147483600; font-family: var(--bm-font-body); line-height: 1.4; }
.bmwa * { box-sizing: border-box; }
.bmwa svg { display: block; width: 20px; height: 20px; }
body.bm-lock .bmwa { display: none; }

.bmwa__launch { all: unset; box-sizing: border-box; cursor: pointer; display: flex; align-items: center; height: 56px; min-width: 56px; max-width: 56px; padding: 0 6px; border-radius: 28px; background: var(--wa); color: #fff; box-shadow: 0 10px 24px -6px rgba(37, 211, 102, .65); overflow: hidden; white-space: nowrap; transition: max-width .35s ease, background-color .2s; }
.bmwa__launch:focus-visible { outline: 3px solid var(--navy); outline-offset: 3px; }
.bmwa__launch-ico { flex: 0 0 44px; width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; position: relative; transition: background-color .3s, color .3s; }
.bmwa__launch-ico svg { width: 28px; height: 28px; }
.bmwa__launch-ico .x { display: none; }
.bmwa__launch-ico .x svg { width: 22px; height: 22px; }
.bmwa__label { font: 700 15px var(--bm-font-body); color: #fff; padding: 0 16px 0 8px; opacity: 0; transition: opacity .2s; }
.bmwa:not(.is-open) .bmwa__launch:hover, .bmwa:not(.is-open) .bmwa__launch:focus-visible, .bmwa.is-peek .bmwa__launch { max-width: 240px; }
.bmwa:not(.is-open) .bmwa__launch:hover .bmwa__label, .bmwa:not(.is-open) .bmwa__launch:focus-visible .bmwa__label, .bmwa.is-peek .bmwa__label { opacity: 1; }
.bmwa:not(.is-open) .bmwa__launch:hover .bmwa__launch-ico, .bmwa.is-peek .bmwa__launch-ico { background: #fff; color: var(--wa); }
.bmwa__launch-ico::after { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .7); opacity: 0; animation: bmwa-ring 2.4s ease-out 1.5s 3; }
.bmwa.is-open .bmwa__launch { background: var(--navy); box-shadow: 0 10px 24px -6px rgba(16, 27, 54, .6); }
.bmwa.is-open .bmwa__launch-ico .a { display: none; }
.bmwa.is-open .bmwa__launch-ico .x { display: block; }

.bmwa__badge { position: absolute; left: 38px; top: -6px; z-index: 2; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: var(--red); color: #fff; font: 700 12px/18px var(--bm-font-body); text-align: center; border: 2px solid #fff; box-shadow: 0 4px 10px -2px rgba(224, 36, 36, .55); pointer-events: none; transform: scale(0); transition: transform .35s cubic-bezier(.34, 1.56, .64, 1); }
.bmwa__badge::after { content: ""; position: absolute; inset: -2px; border-radius: inherit; border: 2px solid var(--red); opacity: 0; }
.bmwa.has-badge:not(.is-open) .bmwa__badge { transform: scale(1); }
.bmwa.has-badge:not(.is-open) .bmwa__badge::after { animation: bmwa-badge 1.8s ease-out .4s 4; }
@keyframes bmwa-badge { 0% { opacity: .9; transform: scale(1); } 100% { opacity: 0; transform: scale(1.9); } }
@keyframes bmwa-ring { 0% { opacity: .8; transform: scale(.8); } 100% { opacity: 0; transform: scale(1.35); } }

.bmwa__panel { position: absolute; left: 0; bottom: 72px; width: 360px; max-height: calc(100vh - 110px); display: flex; flex-direction: column; background: #fff; border-radius: 14px; box-shadow: 0 22px 50px -14px rgba(16, 27, 54, .45); overflow: hidden; opacity: 0; visibility: hidden; transform: translateY(12px); transform-origin: bottom left; transition: opacity .22s, transform .22s, visibility 0s .22s; }
.bmwa__panel:focus { outline: 0; }
.bmwa.is-open .bmwa__panel { opacity: 1; visibility: visible; transform: none; transition: opacity .22s, transform .22s; }

.bmwa__head { flex: 0 0 auto; display: flex; align-items: center; gap: 12px; padding: 16px 14px 16px 16px; background: var(--navy); color: #fff; }
.bmwa__avatar { flex: 0 0 42px; width: 42px; height: 42px; border-radius: 50%; background: var(--wa); display: flex; align-items: center; justify-content: center; color: #fff; position: relative; }
.bmwa__avatar svg { width: 24px; height: 24px; }
.bmwa__avatar::after { content: ""; position: absolute; right: 0; bottom: 1px; width: 11px; height: 11px; border-radius: 50%; background: #4ade80; border: 2px solid var(--navy); }
.bmwa__hd { flex: 1 1 auto; min-width: 0; }
.bmwa__hd b { display: block; font: 800 15px/1.25 var(--bm-font-head); color: #fff; }
.bmwa__hd span { display: block; margin-top: 2px; font-size: 12.5px; color: #b9c2d3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bmwa__icon-btn { all: unset; box-sizing: border-box; cursor: pointer; flex: 0 0 32px; width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; background: rgba(255, 255, 255, .08); transition: background-color .15s; }
.bmwa__icon-btn:hover { background: rgba(255, 255, 255, .18); }
.bmwa__icon-btn:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.bmwa__icon-btn svg { width: 18px; height: 18px; }

.bmwa__body { flex: 1 1 auto; overflow: auto; overscroll-behavior: contain; }
.bmwa__step--1, .bmwa__step--2 { padding: 16px 14px 14px; }
.bmwa .bmwa__q { margin: 0 2px 10px; font-size: 13px; font-weight: 700; color: var(--navy); }
.bmwa .bmwa__cats, .bmwa .bmwa__prods { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.bmwa .bmwa__prods { gap: 6px; }
.bmwa .bmwa__cats li, .bmwa .bmwa__prods li { margin: 0; padding: 0; }
.bmwa .bmwa__cats li::before, .bmwa .bmwa__prods li::before { display: none; }
.bmwa__prods[hidden], .bmwa__prods li[hidden], .bmwa__empty[hidden] { display: none !important; }

.bmwa__cat, .bmwa__prod { all: unset; box-sizing: border-box; cursor: pointer; width: 100%; display: flex; align-items: center; gap: 12px; padding: 9px 10px 9px 9px; border: 1px solid var(--line); border-radius: 12px; background: #fff; color: var(--navy); transition: border-color .15s, box-shadow .15s; }
.bmwa__cat:hover, .bmwa__cat:focus-visible, .bmwa__prod:hover, .bmwa__prod:focus-visible { border-color: var(--accent); box-shadow: 0 6px 16px -10px rgba(16, 27, 54, .5); }
.bmwa__cat:focus-visible, .bmwa__prod:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.bmwa__cat-ico, .bmwa__prod-ico { flex: 0 0 46px; width: 46px; height: 46px; border-radius: 50%; background: #eef1f6; color: var(--accent); display: flex; align-items: center; justify-content: center; transition: background-color .15s, color .15s; }
.bmwa__cat-ico svg { width: 22px; height: 22px; }
.bmwa__cat:hover .bmwa__cat-ico, .bmwa__cat:focus-visible .bmwa__cat-ico { background: var(--accent); color: #fff; }
.bmwa__cat-txt, .bmwa__prod-txt { flex: 1 1 auto; min-width: 0; text-align: left; }
.bmwa__cat-txt b { display: block; font-size: 14px; font-weight: 700; line-height: 1.25; color: var(--navy); }
.bmwa__cat-txt small { display: flex; align-items: center; gap: 5px; margin-top: 2px; font-size: 12px; color: var(--muted); }
.bmwa__cat-txt small::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--wa); }
.bmwa__cat-go { flex: 0 0 20px; color: #a3abb9; transition: color .15s, transform .15s; }
.bmwa__cat-go svg { width: 18px; height: 18px; }
.bmwa__cat:hover .bmwa__cat-go { color: var(--accent); transform: translateX(2px); }

.bmwa__filter { position: relative; display: block; margin: 0 0 10px; }
.bmwa__filter svg { position: absolute; left: 12px; top: 12px; width: 18px; height: 18px; color: var(--muted); }
.bmwa .bmwa__filter input { width: 100%; height: 42px; margin: 0; padding: 0 12px 0 38px; border: 1px solid var(--line); border-radius: 10px; background: #f6f8fb; color: var(--navy); font: 400 15px var(--bm-font-body); box-shadow: none; }
.bmwa .bmwa__filter input:focus { outline: 0; border-color: var(--accent); background: #fff; }
.bmwa__prod { gap: 10px; padding: 6px 10px 6px 6px; border-radius: 10px; }
.bmwa .bmwa__prod img { flex: 0 0 46px; width: 46px; height: 46px; max-width: none; object-fit: contain; border: 1px solid #eef1f6; border-radius: 8px; background: #fff; }
.bmwa__prod-ico svg { width: 22px; height: 22px; }
.bmwa__prod-txt b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 13px; font-weight: 700; line-height: 1.3; color: var(--navy); }
.bmwa__prod-txt small { display: block; margin-top: 2px; font-size: 11.5px; color: var(--muted); overflow-wrap: anywhere; }
.bmwa__prod--multi { border-style: dashed; background: #f9fafc; }
.bmwa .bmwa__empty { margin: 12px 2px 0; font-size: 13px; color: var(--muted); }

.bmwa__chat { display: flex; flex-direction: column; gap: 10px; min-height: 250px; padding: 16px 14px 14px; background-color: #efeae2; background-image: radial-gradient(rgba(16, 27, 54, .06) 1px, transparent 1.2px); background-size: 14px 14px; }
.bmwa__day { align-self: center; padding: 3px 10px; border-radius: 6px; background: #fff; font-size: 11px; color: #54656f; box-shadow: 0 1px .5px rgba(11, 20, 26, .13); }
.bmwa__in, .bmwa__out { position: relative; max-width: 90%; padding: 8px 10px 18px; border-radius: 10px; font-size: 13.5px; line-height: 1.45; color: #111b21; box-shadow: 0 1px .5px rgba(11, 20, 26, .13); }
.bmwa__in { align-self: flex-start; background: #fff; border-top-left-radius: 0; }
.bmwa__in::before { content: ""; position: absolute; left: -7px; top: 0; border-style: solid; border-color: transparent #fff transparent transparent; border-width: 0 8px 8px 0; }
.bmwa__in em { display: block; margin-bottom: 2px; font-style: normal; font-size: 12px; font-weight: 700; color: var(--accent); }
.bmwa__out { align-self: flex-end; width: 90%; padding: 8px 10px 20px; background: #d9fdd3; border-top-right-radius: 0; cursor: text; }
.bmwa__out::before { content: ""; position: absolute; right: -7px; top: 0; border-style: solid; border-color: #d9fdd3 transparent transparent #d9fdd3; border-width: 8px 8px 0 0; }
.bmwa__out:focus-within { box-shadow: 0 0 0 2px var(--wa), 0 1px .5px rgba(11, 20, 26, .13); }
.bmwa__time { position: absolute; right: 9px; bottom: 4px; display: flex; align-items: center; gap: 3px; font-size: 10.5px; color: #667781; }
.bmwa__time svg { width: 15px; height: 15px; color: #53bdeb; }
.bmwa__msg { display: block; min-height: 80px; max-height: 260px; overflow: auto; white-space: pre-wrap; word-break: break-word; font: 400 13.5px/1.45 var(--bm-font-body); color: #111b21; outline: 0; cursor: text; }
.bmwa__msg b, .bmwa__in b { font-weight: 700; color: #111b21; }

.bmwa__foot { flex: 0 0 auto; padding: 12px 14px 14px; background: #fff; border-top: 1px solid var(--line); }
.bmwa .bmwa__send { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 46px; border-radius: 23px; background: var(--wa); color: #fff; font: 700 15px var(--bm-font-body); text-decoration: none; box-shadow: 0 8px 18px -8px rgba(37, 211, 102, .8); transition: background-color .15s; }
.bmwa .bmwa__send:hover { background: var(--wa-d); color: #fff; }
.bmwa .bmwa__send:focus-visible { outline: 3px solid var(--navy); outline-offset: 2px; }
.bmwa__send svg { width: 22px; height: 22px; }
.bmwa__send[aria-disabled="true"] { opacity: .55; pointer-events: none; }
.bmwa .bmwa__hours { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px 12px; margin: 10px 0 0; font-size: 12.5px; line-height: 1.3; color: var(--muted); }
.bmwa__hours-st { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--navy); }
.bmwa__hours-t { display: inline-flex; align-items: center; gap: 5px; }
.bmwa__hours-t svg { width: 14px; height: 14px; }
.bmwa__dot { display: block; width: 8px; height: 8px; border-radius: 50%; background: var(--wa); box-shadow: 0 0 0 3px rgba(37, 211, 102, .2); }
.bmwa.is-closed .bmwa__dot { background: #f59e0b; box-shadow: 0 0 0 3px rgba(245, 158, 11, .2); }
.bmwa.is-closed .bmwa__avatar::after, .bmwa.is-closed .bmwa__cat-txt small::before { background: #f59e0b; }

@media (max-width: 767px) {
	.bmwa { left: 16px; bottom: 16px; }
	.bmwa__launch { height: 52px; min-width: 52px; max-width: 52px; }
	.bmwa__badge { left: 34px; }
	.bmwa__launch-ico { flex-basis: 40px; width: 40px; height: 40px; }
	.bmwa__panel { position: fixed; left: 12px; right: 12px; bottom: 80px; width: auto; max-height: calc(100vh - 96px); max-height: calc(100dvh - 96px); }
	.bmwa__msg { font-size: 16px; max-height: max(150px, calc(100dvh - 520px)); }
	.bmwa .bmwa__filter input { font-size: 16px; }
	.bmwa__chat { min-height: 0; }
	.bmwa__day { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.bmwa * { transition: none !important; animation: none !important; }
}
